/* Alerts (BR Stage 6, PR 2; AlertsWindows and AlertsAccount boards): the "Get alerts" button, its window, and the
   rows in Account › Alerts. The window is the Step 7 modal frame; a bottom sheet on phones (modals.css). */
.ci-alerts-btn { gap: var(--ci-s2); }
.ci-alerts-btn[aria-pressed="true"] { background: var(--ci-moss); border-color: var(--ci-moss); color: var(--ci-deep-forest); }
.ci-phero__alerts, .ci-sum__alerts { margin: var(--ci-s3) 0 0; }

.ci-alert__for { margin: 0 0 var(--ci-s3); color: var(--ci-muted); }
.ci-alert__for strong { color: var(--ci-ink); }
.ci-alert__what { margin: 0 0 var(--ci-s3); padding: 0; border: 0; display: flex; flex-direction: column; gap: var(--ci-s2); }
.ci-alert__option { display: flex; gap: var(--ci-s3); align-items: flex-start; padding: var(--ci-s3) var(--ci-s4); border: 1.5px solid var(--ci-line);
    border-radius: var(--ci-r-field); cursor: pointer; }
.ci-alert__option:has(input:checked) { border-color: var(--ci-forest); background: var(--ci-surface); }
.ci-alert__option input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--ci-forest); flex: none; }
.ci-alert__option span { display: flex; flex-direction: column; gap: 2px; }
.ci-alert__option small { color: var(--ci-muted); font: var(--ci-small); }
.ci-alert__how { margin: 0 0 var(--ci-s2); font: var(--ci-small); }
.ci-alert__note { margin: var(--ci-s3) 0 0; padding: var(--ci-s3) var(--ci-s4); border-radius: var(--ci-r-field); background: var(--ci-warn-tint);
    color: var(--ci-warn-text); font: var(--ci-small); }
.ci-alert__all { margin-top: var(--ci-s4); }
.ci-alert__all p { margin: 0 0 4px; color: var(--ci-muted); }

/* Account › Alerts */
.ci-account .ci-alerts__group, .ci-alerts__group { margin: var(--ci-s5) 0 var(--ci-s2); font: var(--ci-overline); text-transform: uppercase; letter-spacing: .08em; color: var(--ci-muted); }
.ci-alerts__rows { margin: 0; padding: 0; list-style: none; border: 1px solid var(--ci-line); border-radius: var(--ci-r-card); background: var(--ci-surface); }
.ci-alerts__row { display: flex; align-items: center; justify-content: space-between; gap: var(--ci-s3); padding: var(--ci-s3) var(--ci-s4); }
.ci-alerts__row + .ci-alerts__row { border-top: 1px solid var(--ci-line); }
.ci-alerts__row > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ci-alerts__row > div span { color: var(--ci-muted); font: var(--ci-small); }
.ci-alerts__actions { display: inline-flex; align-items: center; gap: var(--ci-s4); flex: none; }
.ci-alerts__rows .ci-switch { min-height: 44px; }
input[role="switch"] { appearance: none; width: 44px; height: 26px; margin: 0; border-radius: 999px; background: var(--ci-track); position: relative;
    cursor: pointer; transition: background .15s ease; flex: none; }
input[role="switch"]::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--ci-white);
    box-shadow: 0 1px 2px rgba(18, 51, 38, .25); transition: transform .15s ease; }
input[role="switch"]:checked { background: var(--ci-forest); }
input[role="switch"]:checked::after { transform: translateX(18px); }
input[role="switch"]:disabled { opacity: .5; cursor: not-allowed; }
input[role="switch"]:focus-visible { outline: none; box-shadow: var(--ci-focus-ring); }
@media (prefers-reduced-motion: reduce) { input[role="switch"], input[role="switch"]::after { transition: none; } }