/* Growth Gusto — alertes (centre d'alertes, réglages) + sites (« Mes établissements »). V2 cream & violet. Prefix .al */
.al .al-seg{margin:0}

/* icon wells */
.al-ic{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--accent)}
.al-ic .ico{width:21px;height:21px}
.al-ic.bad{background:var(--tomato-tint);color:var(--bad)}
.al-ic.warn{background:var(--saffron-tint);color:var(--saffron-ink)}
.al-ic.sky{background:var(--sky-tint);color:#2F5FBF}
.al-ic.vio{background:var(--tint);color:var(--accent)}
.al-ic.ok{background:var(--tint-ok);color:var(--ok)}
.al-ic.sm{width:38px;height:38px}
.al-ic.sm .ico{width:19px;height:19px}

/* hero */
.al-hero{border-radius:28px;padding:20px 20px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 4px 0 #2A0BA6,0 24px 40px -24px rgba(76,31,234,.6);margin-bottom:4px}
.al-hn{display:flex;align-items:center;gap:14px;flex:1;min-width:0}
.al-big{font-family:var(--d);font-variation-settings:"opsz" 96,"wdth" 88;font-size:64px;line-height:.9;font-weight:780;letter-spacing:-.05em;animation:alPop .7s var(--spring) both .15s}
.al-hl{display:flex;flex-direction:column;font-family:var(--d);font-size:20px;font-weight:720;letter-spacing:-.02em;line-height:1.08;white-space:nowrap}
.al-hl>span:nth-child(2){color:#D9D0FF}
.al-hl em{font-style:normal;font-family:var(--f);font-size:13px;font-weight:700;color:#3A0F00;background:var(--saffron);border-radius:999px;padding:4px 10px;margin-top:7px;align-self:flex-start;box-shadow:0 2px 0 var(--saffron-edge)}
.al-all{all:unset;box-sizing:border-box;cursor:pointer;flex:none;display:flex;align-items:center;gap:7px;background:#fff;color:var(--accent-ink);font:700 14px var(--f);padding:12px 14px;border-radius:14px;box-shadow:0 4px 0 #2A0BA6;transition:transform .2s var(--spring),box-shadow .2s;margin-bottom:4px;min-height:44px;text-align:center}
.al-all .ico{width:19px;height:19px}
.al-all:active{transform:translateY(4px);box-shadow:none}
.al-all:focus-visible{outline:3px solid var(--saffron);outline-offset:3px}
@keyframes alPop{from{opacity:0;transform:scale(.4) rotate(-8deg)}to{opacity:1;transform:none}}

.al-calm{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:30px 18px 26px}
.al-calm-ic{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--accent);margin-bottom:10px;animation:alSway 3.6s ease-in-out infinite;transform-origin:50% 20%}
.al-calm-ic .ico{width:34px;height:34px}
@keyframes alSway{0%,100%{transform:rotate(0)}20%{transform:rotate(9deg)}40%{transform:rotate(-7deg)}55%{transform:rotate(3deg)}70%{transform:rotate(0)}}

/* list rows */
.al-list{display:flex;flex-direction:column;gap:10px}
.al-row{position:relative;border-radius:22px;transition:height .35s var(--ease),opacity .3s,margin .35s var(--ease)}
.al-row.bye{height:0!important;opacity:0;margin-bottom:-10px;overflow:hidden}
.al-row.fly .al-card{transform:translateX(110%) rotate(4deg);opacity:0;transition:transform .45s var(--ease),opacity .4s}
.al-bg{position:absolute;inset:0;border-radius:22px;background:var(--tint);color:var(--accent-ink);display:flex;align-items:center;justify-content:space-between;padding:0 22px;font:700 14px var(--f);opacity:0;transition:opacity .2s,background .2s}
.al-bg .ico{width:20px;height:20px}
.al-bg span{margin-left:auto}
.al-row.drag .al-bg{opacity:1}
.al-row.arm .al-bg{background:var(--accent);color:#fff}
.al-card{position:relative;display:flex;align-items:center;gap:12px;padding:13px 12px 13px 14px;background:var(--paper);border:1.5px solid var(--rim);border-radius:22px;box-shadow:0 2px 0 #EFE6D6;cursor:pointer;touch-action:pan-y;user-select:none;-webkit-user-select:none;transition:transform .45s var(--spring),box-shadow .2s,background .2s;min-height:68px}
.al-row.drag .al-card{transition:none;box-shadow:0 14px 30px -14px rgba(27,21,48,.35)}
.al-card.bad{border-color:#F3C7B8;box-shadow:0 2px 0 #F3C7B8}
.al-card:active{transform:scale(.985)}
.al-card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media (hover:hover){.al-card:hover{background:#fff}}
.al-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.al-tx b{font-weight:680;font-size:15px;letter-spacing:-.01em;color:var(--ink);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.al-tx em{font-style:normal;font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.al-vu{all:unset;box-sizing:border-box;cursor:pointer;flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--ink-2);box-shadow:0 0 0 1.5px var(--rim-2) inset,0 3px 0 var(--edge-b);transition:transform .2s var(--spring),box-shadow .2s,color .2s;margin-bottom:3px}
.al-vu .ico{width:20px;height:20px}
.al-vu:active{transform:translateY(3px);box-shadow:0 0 0 1.5px var(--rim-2) inset}
.al-vu:hover{color:var(--accent)}
.al-vu:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.al-chev{color:var(--faint);display:grid;place-items:center;width:24px}
.al-chev .ico{width:18px;height:18px}
.al-row.seen .al-card{background:transparent;box-shadow:none;border-color:transparent;border-bottom-color:var(--line);border-radius:0;min-height:60px;padding:10px 6px}
.al-row.seen .al-ic{background:#F1E9DA;color:var(--ink-2)}
.al-row.seen .al-tx b{font-weight:600;color:var(--ink-2)}
.al-row.seen:last-child .al-card{border-bottom-color:transparent}
.al-list:has(.seen){gap:0;background:var(--paper);border:1.5px solid var(--rim);border-radius:22px;padding:2px 10px;box-shadow:0 2px 0 #EFE6D6}
.al-hint{text-align:center;font-size:12.5px;color:var(--faint);margin:-4px 0 4px}
.al-lbl{margin:6px 4px -4px}
@media (hover:hover) and (pointer:fine){.al-hint{display:none}}

/* réglages */
.al-card-s{padding:16px 14px 10px}
.al-h{display:flex;align-items:center;justify-content:space-between;gap:10px;font-family:var(--d);font-size:18px;font-weight:740;letter-spacing:-.02em;padding:0 4px 8px}
.al-card-s .li{margin:0;padding-left:4px;padding-right:4px}
.al-card-s .li .tx em{white-space:normal}
.al-card-s .li .ava{width:38px;height:38px;flex:none}
.al-sw{width:50px;height:30px;border-radius:30px;flex:none;background:#E6DCCB;position:relative;transition:background .3s var(--ease)}
.al-sw i{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 0 rgba(27,21,48,.12);transition:transform .45s var(--spring)}
.al-sw.on{background:var(--accent)}
.al-sw.on i{transform:translateX(20px)}
.al-f2{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 4px}
.al-f2 .field{margin:0}
.al-f2 .input{width:100%;min-width:0}
.al-fl{font-size:13px;font-weight:650;color:var(--ink-2);margin:14px 4px 8px}
.al-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 4px 8px}
.al-chips .chip{min-height:44px;padding:0 16px;border-radius:14px}
.al-chips.g4,.al-chips.g3,.al-days{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.al-chips.g3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:340px}
.al-days{grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;max-width:400px}
.al-chips.g4 .chip,.al-chips.g3 .chip,.al-days .chip{padding:0;justify-content:center;width:100%}
.al-in{padding:2px 4px 10px;animation:alIn .4s var(--spring-soft) both}
.al-in .al-fl{margin-top:4px}
.al-in .field{margin:6px 0 0}
@keyframes alIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.al-add{padding:10px 4px 4px;gap:8px}
.al-add .input{flex:1;min-width:0}
.al-add .btn{flex:none}
.al-x{width:40px;height:40px}
.al-sep{height:1.5px;background:#F1E9DA;margin:12px 4px 4px}
.al-btns{padding:14px 4px 2px}
.al-btns .btn{margin-top:0}
.al-pad{padding:4px 4px 8px}
.al-shake{animation:alShake .4s}
@keyframes alShake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}

/* e-mail preview sheet */
.al-pv-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.al-soon{display:flex;gap:10px;align-items:flex-start;background:var(--saffron-tint);color:var(--saffron-ink);border-radius:16px;padding:12px 14px;font-size:13.5px;margin-bottom:12px}
.al-soon .ico{width:18px;height:18px;flex:none;margin-top:1px}
.al-pv{border-radius:20px;overflow:hidden;border:1.5px solid var(--rim);background:#FBF6EC;margin-bottom:14px}
.al-pv iframe{display:block;width:100%;height:min(62vh,560px);border:0;background:#FBF6EC}

/* sites */
.al-sites{display:grid;gap:14px}
.al-site{padding:16px;cursor:pointer;transition:transform .3s var(--spring),box-shadow .2s}
.al-site:active{transform:scale(.98)}
.al-site:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.al-site.cur{border-color:#D6CBFF;box-shadow:0 2px 0 #DCD2FF,0 14px 28px -20px rgba(76,31,234,.3)}
.al-sh{display:flex;align-items:center;gap:12px}
.al-mono{width:46px;height:46px;flex:none;border-radius:15px;display:grid;place-items:center;background:var(--saffron);color:var(--ink);box-shadow:0 3px 0 var(--saffron-edge);font:800 15px var(--d);letter-spacing:-.02em}
.al-sn{flex:1;min-width:0;display:flex;flex-direction:column}
.al-sn b{font-family:var(--d);font-size:18px;font-weight:740;letter-spacing:-.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.al-sn em{font-style:normal;font-size:13px;color:var(--muted)}
.al-open{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--tint);color:var(--accent);transition:transform .3s var(--spring)}
.al-site:hover .al-open{transform:translateX(3px)}
.al-sg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}
.al-sk{background:#F7F0E3;border-radius:18px;padding:12px 8px 10px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px;min-height:96px;position:relative}
.al-sk em{font-style:normal;font-size:12.5px;font-weight:650;color:var(--ink-2)}
.al-num{font-family:var(--d);font-variation-settings:"opsz" 96,"wdth" 90;font-size:30px;font-weight:760;letter-spacing:-.04em;line-height:1}
.al-num small,.al-cv small{font-size:15px;font-weight:650;color:var(--faint);margin-left:1px}
.al-sk.hot{background:var(--tomato-tint)}
.al-sk.hot .al-num{color:var(--bad)}
.al-conf{justify-content:flex-end}
.al-ring{position:absolute;top:8px;left:50%;width:58px;height:58px;transform:translateX(-50%) rotate(-90deg)}
.al-ring circle{fill:none;stroke-width:6}
.al-ring .bg{stroke:#EADFCB}
.al-ring .fg{stroke:var(--accent);stroke-linecap:round;transition:stroke-dashoffset 1s var(--ease);animation:alRing 1.1s var(--ease) both .2s}
.al-ring.ok .fg{stroke:var(--ok)}.al-ring.warn .fg{stroke:var(--saffron)}.al-ring.bad .fg{stroke:var(--tomato)}.al-ring.neu .fg{stroke:transparent}
@keyframes alRing{from{stroke-dashoffset:164}}
.al-cv{position:absolute;top:24px;left:0;right:0;text-align:center;font-family:var(--d);font-size:17px;font-weight:760;letter-spacing:-.03em}
.al-cv small{font-size:11px;margin:0}
.al-load span{min-height:96px;border-radius:18px;background:#F4EDE0;animation:alPulse 1.2s ease-in-out infinite}
@keyframes alPulse{50%{opacity:.5}}
.al-addsite{all:unset;box-sizing:border-box;cursor:pointer;width:100%;min-height:60px;border-radius:22px;border:2px dashed var(--rim-2);display:flex;align-items:center;justify-content:center;gap:8px;font:700 15px var(--f);color:var(--accent-ink);transition:background .2s,transform .3s var(--spring)}
.al-addsite .ico{width:20px;height:20px}
.al-addsite:hover{background:var(--paper)}
.al-addsite:active{transform:scale(.98)}
.al-invite{padding:24px 18px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;border-style:dashed;border-color:var(--rim-2);background:transparent;box-shadow:none}
.al-invite .al-ic{width:56px;height:56px;margin-bottom:8px;animation:alSway 4s ease-in-out infinite}
.al-invite .al-ic .ico{width:26px;height:26px}
.al-invite .btn{margin-top:14px;padding:0 22px}
@media (min-width:820px){.al-sites{grid-template-columns:1fr 1fr}.al-sites .al-site:only-child{grid-column:1/-1}}
@media (min-width:960px){.al-hero{padding:24px 26px}.al-big{font-size:76px}}
@media (prefers-reduced-motion:reduce){.al-calm-ic,.al-invite .al-ic,.al-big,.al-ring .fg,.al-in{animation:none}.al-card{transition:none}}
