/* <x-alerts.subscribe> — scoped to .al-sub, safe on any page (2026-10-31). */
.al-sub{
  --al-ink:#0B1220; --al-body:#1F2937; --al-mute:#4B5563; --al-rule:#E5EAF1; --al-field:#8A97A8;
  --al-blue:#0C6FB8; --al-blue-d:#0A5C9A; --al-link:#0B5E9C; --al-focus:#0C6FB8; --al-box:#F6F8FB;
  color:var(--al-body); font-size:16px; line-height:1.55; text-align:start;
}
.al-sub--dark{
  --al-ink:#FFFFFF; --al-body:#E6EDF5; --al-mute:#C9D5E2; --al-rule:rgba(255,255,255,.2);
  --al-link:#A9D8FF; --al-focus:#8CCBFF; --al-box:rgba(255,255,255,.07);
}
.al-sub *,.al-sub *::before,.al-sub *::after{ box-sizing:border-box; }
.al-sub form{ margin:0; }
.al-sub p{ margin:0; }
.al-sub .al-field{ margin:0 0 14px; }
.al-sub .al-label{ display:block; font-weight:700; font-size:16px; color:var(--al-ink); margin:0 0 6px; padding:0; }
.al-sub .al-opt{ font-weight:400; color:var(--al-mute); }
.al-sub input[type="email"],.al-sub input[type="text"]{
  display:block; width:100%; min-height:48px; margin:0; padding:11px 14px; font:inherit; font-size:16px; line-height:1.4;
  color:#0B1220; background:#FFFFFF; border:1px solid var(--al-field); border-radius:10px; text-align:left;
}
.al-sub input[type="text"]{ text-align:start; }
.al-sub input::placeholder{ color:#66717F; opacity:1; }
.al-sub input[aria-invalid="true"]{ border-color:#D92D20; box-shadow:0 0 0 1px #D92D20; }
.al-sub input:focus-visible,.al-sub button:focus-visible,.al-sub a:focus-visible{ outline:3px solid var(--al-focus); outline-offset:2px; }
.al-sub input[type="email"]:focus-visible,.al-sub input[type="text"]:focus-visible{ border-color:var(--al-blue); }

.al-sub .al-topics{ border:0; margin:6px 0 12px; padding:0; min-width:0; }
.al-sub .al-check{ display:flex; gap:12px; align-items:flex-start; padding:10px 0; cursor:pointer; }
.al-sub .al-topics .al-check + .al-check{ border-top:1px solid var(--al-rule); }
.al-sub .al-check input{ flex:none; width:20px; height:20px; margin:2px 0 0; accent-color:var(--al-blue); cursor:pointer; }
.al-sub .al-check__label{ display:block; font-weight:600; color:var(--al-ink); }
.al-sub .al-check__help{ display:block; color:var(--al-mute); }
.al-sub .al-check--plain{ padding:0; }
.al-sub .al-check--plain .al-check__text{ color:var(--al-body); }

.al-sub .al-mkt{ margin:4px 0 16px; padding:12px 14px; background:var(--al-box); border:1px solid var(--al-rule); border-radius:10px; }
.al-sub--compact .al-mkt{ margin-top:12px; }

.al-sub .al-btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 22px; margin:0;
  border:0; border-radius:10px; background:var(--al-blue); color:#FFFFFF; font:inherit; font-size:17px; font-weight:700; cursor:pointer;
}
.al-sub .al-btn:hover{ background:var(--al-blue-d); }
.al-sub--dark .al-btn{ background:#2E8FD8; color:#06121F; }
.al-sub--dark .al-btn:hover{ background:#5AAAE6; }
.al-sub .al-btn--block{ width:100%; }

.al-sub .al-row{ display:flex; flex-wrap:wrap; gap:8px; }
.al-sub .al-row input{ flex:1 1 220px; min-width:0; }
.al-sub .al-row .al-btn{ flex:0 0 auto; }
@media (max-width:420px){ .al-sub .al-row .al-btn{ flex:1 1 100%; } }

.al-sub .al-note{ margin-top:14px; font-size:16px; color:var(--al-mute); }
.al-sub .al-note a{ color:var(--al-link); font-weight:600; text-decoration:underline; text-underline-offset:3px; }

.al-sub .al-err{ margin:0 0 14px; padding:10px 14px; border-radius:8px; background:#FEF3F2; color:#912018; border-inline-start:4px solid #D92D20; font-size:16px; }
.al-sub .al-ok{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:10px; background:#ECFDF3; border:1px solid #A6E9C3; color:#05603A; font-size:16px; }
.al-sub--dark .al-ok{ background:rgba(18,183,106,.14); border-color:rgba(166,233,195,.5); color:#D1FADF; }
.al-sub .al-ok__icon{ flex:none; margin-top:1px; }

/* honeypot: visually hidden without creating horizontal scroll in RTL */
.al-sub .al-hp{ position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; }
