/* vorOrt dabei – app v19: Erinnerung nach Regionen (Push, Entwurf abgenommen 18.10.)
   Regionskarten in der Einrichtung, Vorschau, Erlaubnis-Fenster, Erlaubnis-Stand in den Favoriten (inkl. iPhone-Zeile), Seite #/woche.
   Baut auf app.css auf (.opt, .rad, .prev/.ios, .mh, .fcardset, .setrow). Das iPhone-Anleitungsfenster (Entwurf Bild 4) entfällt. */

/* ---------- Einrichtung Schritt 1: Regionen ---------- */
.regc-list { display: flex; flex-direction: column; gap: 10px; }
.regc {
  display: flex; align-items: center; gap: 14px; width: 100%; min-height: 84px; padding: 14px 16px;
  border: 0; border-radius: 20px; background: #fff; box-shadow: inset 0 0 0 1px var(--line);
  font: inherit; text-align: left; cursor: pointer; color: inherit;
}
.regc:hover { box-shadow: inset 0 0 0 1.5px var(--navy); }
.regc.on { box-shadow: inset 0 0 0 2px var(--navy); }
.regc:focus-visible { outline-offset: 3px; border-radius: 20px; }
.regc .opt-t { flex: 1 1 auto; gap: 3px; }
.regc .opt-s { font-size: 0.875rem; }
.regc-chk {
  width: 26px; height: 26px; border-radius: 8px; flex-shrink: 0; background: #fff; box-shadow: inset 0 0 0 2px var(--line);
  display: flex; align-items: center; justify-content: center; color: #fff;
}
.regc.on .regc-chk { background: var(--navy); box-shadow: none; }

/* ---------- Vorschau der Mitteilung ---------- */
.ios-t.two b { display: block; margin-bottom: 1px; }
.prev .soonhint { align-items: flex-start; line-height: 1.35; }
.prev .soonhint .ico-svg { flex-shrink: 0; margin-top: 2px; }
/* keine Termine im nächsten Zeitraum → keine Erinnerung (statt der Mitteilung) */
.prev-leer {
  background: rgba(255, 255, 255, .14); border-radius: 16px; padding: 12px 14px;
  font-weight: 600; font-size: 0.9375rem; line-height: 1.4; color: rgba(255, 255, 255, .95);
}

/* ---------- Erlaubnis-Fenster (Sheet im Stil .mh) ---------- */
.mh-note { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 0.875rem; color: var(--muted); margin-top: 2px; }
.mh-note .ico-svg { color: var(--teal-d); }

/* ---------- Favoriten: Interessen-Hinweis, feste Zeit, Erlaubnis ---------- */
.fs-note { font-weight: 500; font-size: 0.875rem; line-height: 1.4; color: var(--muted); }
.setrow.fix { cursor: default; }
.perm { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 0.9375rem; color: var(--teal-d); }
.perm-ico { width: 22px; height: 22px; border-radius: 11px; background: var(--teal-d); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.perm-btn { height: 48px; gap: 8px; }
.perm-box {
  display: flex; align-items: flex-start; gap: 12px; width: 100%; padding: 12px 14px; border: 0; border-radius: 16px; text-align: left;
  background: var(--mint-l); box-shadow: inset 0 0 0 1px var(--line); font: inherit; color: var(--ink); cursor: pointer;
}
.perm-box.warn { background: #FFF7D1; box-shadow: inset 0 0 0 1px var(--yellow); cursor: default; }
.perm-box-ico {
  width: 36px; height: 36px; border-radius: 12px; flex-shrink: 0; background: #fff; color: var(--navy);
  display: flex; align-items: center; justify-content: center;
}
.perm-box-b { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; font-weight: 500; font-size: 0.875rem; line-height: 1.4; color: var(--muted); }
.perm-box-b b { font-weight: 900; font-size: 0.9375rem; color: var(--navy); }
.perm-link { border: 0; background: none; padding: 0; margin-top: 2px; font: inherit; font-weight: 700; font-size: 0.9375rem; color: var(--teal-d); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
/* kurze Zeile statt Erlaubnis-Knopf: iPhone/iPad im Browser, Browser ohne Benachrichtigungen, Push noch aus, Anmeldung offen */
.perm-zeile { display: flex; align-items: flex-start; gap: 8px; font-weight: 600; font-size: 0.875rem; line-height: 1.4; color: var(--muted); }
.perm-zeile > .ico-svg { flex-shrink: 0; margin-top: 1px; color: var(--teal-d); }
.perm-zeile-b { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
.perm-zeile .perm-link { font-size: 0.875rem; margin-top: 0; }
.ob-body > .perm-zeile { margin-top: 2px; }

/* ---------- Seite #/woche ---------- */
.wk-page { gap: 14px; }
.wk-sub { margin-top: -8px; }
.wk-chips { margin: 0 -20px; padding: 2px 20px; }
.wk-chips .chip { flex-shrink: 0; }
.wk-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 6px; }
.wk-k { font-weight: 600; font-size: 0.875rem; color: var(--muted); }
.wk-hl .row-title .adpill { margin-top: 1px; }

/* ---------- app v20: Täglich und Wöchentlich unabhängig ---------- */
/* Einrichtung Schritt 3: Checkbox-Karten (Kasten wie bei den Regionen statt Radio-Punkt) */
.opt-chk .opt-h .regc-chk { margin-top: 2px; }
.opt-chk.on .regc-chk { background: var(--navy); box-shadow: none; }
/* Favoriten: zwei Schalter statt .seg3 */
.sw-liste { display: flex; flex-direction: column; gap: 8px; }
.sw-zeile {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 52px; padding: 8px 12px 8px 16px;
  border: 0; border-radius: 16px; background: var(--mint-l); box-shadow: inset 0 0 0 1px var(--line); font: inherit; cursor: pointer; text-align: left;
}
.sw-n { font-weight: 700; font-size: 1rem; color: var(--navy); }
.sw-knopf { position: relative; width: 50px; height: 30px; border-radius: 15px; background: #C9D6D8; flex-shrink: 0; transition: background .15s; }
.sw-knopf i { position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 12px; background: #fff; box-shadow: 0 1px 3px rgba(29, 54, 95, .3); transition: transform .15s; }
.sw-zeile.on .sw-knopf { background: var(--navy); }
.sw-zeile.on .sw-knopf i { transform: translateX(20px); }
.sw-zeile:focus-visible { outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .sw-knopf, .sw-knopf i { transition: none; } }
