/* ============================================================
   GetDogWalkers · Dashboard v2 · Website-Design (opt-in)
   Aktiv nur mit <html data-design="website"> (gesetzt von design.js:
   ?design=website, gemerkt in localStorage „dwDesign"). Alle Regeln
   gelten nur am Bildschirm; der Druck (documents.js) bleibt unverändert.
   Sprache wie getdogwalkers.com: Forest-Ink-Text, Beige-Flächen,
   Be Vietnam Pro, Haarlinien, Pillen, Status als Punkt + Text,
   eine waldgrüne Hervorhebung pro Seite, keine Verläufe, kein Glas.
   ============================================================ */

@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/BeVietnamPro-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/BeVietnamPro-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/BeVietnamPro-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/BeVietnamPro-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/BeVietnamPro-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/BeVietnamPro-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Old Standard TT';font-style:italic;font-weight:400;font-display:swap;src:url('fonts/OldStandardTT-400i-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Old Standard TT';font-style:italic;font-weight:400;font-display:swap;src:url('fonts/OldStandardTT-400i-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}

@media screen {

/* ——— Tokens · hell ——— */
:root[data-design="website"] {
  --w-ink:#233421; --w-text-2:#4a5847; --w-muted:#56634f;
  --w-ground:#f8f7f3; --w-side:#f7efdf; --w-surface:#fffdf8; --w-field:#ffffff;
  --w-hover:rgba(35,52,33,.045); --w-hair:rgba(35,52,33,.1); --w-hair-2:rgba(35,52,33,.2);
  --w-accent:#4d5f46; --w-fill:#4d5f46; --w-on-fill:#ffffff; --w-ticket:#384a33;
  --w-sage:#7e9079; --w-amber:#b8893e; --w-rose:#a34646; --w-muted-dot:#8f8e7c;
  --w-ring:color-mix(in srgb, #4d5f46 22%, transparent);
  --w-scrim:rgba(21,33,15,.28);
  --w-pop:0 18px 40px -18px rgba(21,33,15,.28);

  --cream:var(--w-ground); --cream-2:#f1efe8; --paper:var(--w-surface); --cream-soft:#fbfaf6;
  --bark:var(--w-ink); --bark-2:var(--w-text-2); --muted:var(--w-muted);
  --sage:var(--w-sage); --sage-deep:var(--w-accent); --sage-pale:#eef1e8; --sage-line:#c6cfb6;
  --amber:var(--w-amber); --amber-bg:var(--w-side); --amber-text:var(--w-ink);
  --sage-fill:var(--w-fill); --amber-fill:var(--w-ink);
  --rose:var(--w-rose); --rose-bg:#f6e7e4; --rose-text:#9a3f3f;
  --green:var(--w-accent); --green-bg:#eef1e8; --green-text:var(--w-accent);
  --serif:"Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --sans:"Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --w-italic:"Old Standard TT", "Times New Roman", serif;

  --bg:var(--w-ground); --surface:var(--w-surface); --surface-2:#f3f2ec;
  --surface-warm:var(--w-side); --surface-warm-line:var(--w-hair-2);
  --line:#e3e4dd; --line-strong:#cdd1c6; --line-soft:#ecece6;
  --input-bg:var(--w-field); --hover-surface:#f1f1eb;
  --on-accent:#ffffff; --accent-grad:var(--w-fill);
  --skeleton-a:#efeee8; --skeleton-b:#f8f7f3;
  --radius-sm:10px; --radius:14px; --radius-lg:20px;
  --shadow-1:none; --shadow-2:var(--w-pop);
  --gold:var(--w-accent); --gold-deep:var(--w-accent); --gold-pale:var(--sage-pale);
  --gold-wash:color-mix(in srgb, var(--w-sage) 40%, transparent);
  --amber-pale:var(--amber-bg);
  --glass:var(--surface); --glass-thick:var(--surface); --glass-thin:var(--surface);
  --glass-line:var(--line); --glass-line-dk:var(--line-strong);
  --sh-1:none; --sh-2:none; --sh-pop:var(--w-pop);
  --ease:cubic-bezier(.22,1,.36,1);
}

/* ——— Tokens · dunkel (System, solange nicht „Hell" gewählt; oder manuell „Dunkel") ——— */
@media (prefers-color-scheme: dark) {
  :root[data-design="website"]:not([data-theme="light"]) {
    --w-ink:#f5f5f5; --w-text-2:#a3a3a3; --w-muted:#9d9d9d;
    --w-ground:#0c0c0c; --w-side:#121212; --w-surface:#161616; --w-field:#1e1e1e;
    --w-hover:rgba(255,255,255,.045); --w-hair:rgba(255,255,255,.08); --w-hair-2:rgba(255,255,255,.16);
    --w-accent:#a9bba1; --w-fill:#4a5c44; --w-on-fill:#ffffff; --w-ticket:#2f3e2b;
    --w-sage:#93a68d; --w-amber:#d6a85c; --w-rose:#d98585; --w-muted-dot:#7a7a7a;
    --w-ring:color-mix(in srgb, #a9bba1 26%, transparent);
    --w-scrim:rgba(0,0,0,.55);
    --w-pop:0 22px 50px -20px rgba(0,0,0,.75);

    --cream-2:#141414; --cream-soft:#141414;
    --sage-pale:rgba(169,187,161,.12); --sage-line:rgba(169,187,161,.3);
    --sage-fill:var(--w-accent); --amber-fill:var(--w-ink);
    --rose-bg:rgba(217,133,133,.14); --rose-text:#e7a3a3;
    --green-bg:rgba(169,187,161,.12);
    --surface-2:#1b1b1b;
    --line:#262626; --line-strong:#3a3a3a; --line-soft:#1f1f1f;
    --hover-surface:#1f1f1f;
    --on-accent:#0c0c0c;
    --skeleton-a:rgba(255,255,255,.04); --skeleton-b:rgba(255,255,255,.09);
  }
}
:root[data-design="website"][data-theme="dark"] {
  --w-ink:#f5f5f5; --w-text-2:#a3a3a3; --w-muted:#9d9d9d;
  --w-ground:#0c0c0c; --w-side:#121212; --w-surface:#161616; --w-field:#1e1e1e;
  --w-hover:rgba(255,255,255,.045); --w-hair:rgba(255,255,255,.08); --w-hair-2:rgba(255,255,255,.16);
  --w-accent:#a9bba1; --w-fill:#4a5c44; --w-on-fill:#ffffff; --w-ticket:#2f3e2b;
  --w-sage:#93a68d; --w-amber:#d6a85c; --w-rose:#d98585; --w-muted-dot:#7a7a7a;
  --w-ring:color-mix(in srgb, #a9bba1 26%, transparent);
  --w-scrim:rgba(0,0,0,.55);
  --w-pop:0 22px 50px -20px rgba(0,0,0,.75);

  --cream-2:#141414; --cream-soft:#141414;
  --sage-pale:rgba(169,187,161,.12); --sage-line:rgba(169,187,161,.3);
  --sage-fill:var(--w-accent); --amber-fill:var(--w-ink);
  --rose-bg:rgba(217,133,133,.14); --rose-text:#e7a3a3;
  --green-bg:rgba(169,187,161,.12);
  --surface-2:#1b1b1b;
  --line:#262626; --line-strong:#3a3a3a; --line-soft:#1f1f1f;
  --hover-surface:#1f1f1f;
  --on-accent:#0c0c0c;
  --skeleton-a:rgba(255,255,255,.04); --skeleton-b:rgba(255,255,255,.09);
}

/* ——— Grundlagen ——— */
:root[data-design="website"] { font-size:14px; }
:root[data-design="website"] body { letter-spacing:-.005em; background:var(--w-ground); color:var(--w-ink); }
:root[data-design="website"] ::selection { background:var(--w-ink); color:var(--w-side); }
:root[data-design="website"] :focus-visible { outline:2px solid var(--w-ink); outline-offset:2px; }
:root[data-design="website"] a { color:var(--w-accent); text-decoration-thickness:.5px; text-underline-offset:.2em; }
:root[data-design="website"] h1, :root[data-design="website"] h2, :root[data-design="website"] h3 { font-weight:500; letter-spacing:-.02em; }
:root[data-design="website"] em { font-family:var(--w-italic); font-style:italic; font-weight:400; letter-spacing:-.01em; color:inherit; }
:root[data-design="website"] strong, :root[data-design="website"] b { font-weight:600; }
:root[data-design="website"] .skip-link:focus { background:var(--w-ink); color:var(--w-side); border-radius:999px; }

/* Kleine Großbuchstaben-Etiketten → ruhige Satz-Etiketten (keine Eyebrows) */
:root[data-design="website"] :is(.sb-brand .brand-sub, .sb-user .u-role, .eyebrow, .stat .k, .gc-head, .kv dt, .price-card .lbl,
  .fld > span, label.fld-l, .fld-label, .abo-opt .pop, .inq-hb-date small, .inq-hb-nights-lbl, .inq-detail-table th,
  .cal-month-wd, .today-block h2, .euer-stat .lbl, .euer-table th, .er-hero-label, .er-phone-label, .wt-day-label,
  .today-head-row, .msg-cat, .appt-preview-label, .appt-hero-card .appt-hero-eyebrow, .appt-mail-brand-text small,
  .appt-mail-tag, .settings-group-title, .section-title, .login-brand-sub, .portal-next-walk-day .sub,
  .portal-walk-row .walk-day .mon, .bh-stat-lbl, .m-inv-lines-head, .m-inv-tips-head, .data-stat-lbl,
  .trips-stat-label, .hc-grid-head, .wiz-summary-head, .hd-detail-section h4, .kpi-label, .gs-group,
  .wx-strip-title, .chat-day span, .data-table th, .section-head .sh-eyebrow, .tbl-head, table th) {
  text-transform:none; letter-spacing:0; font-size:.86rem; font-weight:500; color:var(--w-text-2);
}

/* ——— Rahmen: Seitenleiste ——— */
:root[data-design="website"] .sidebar { background:var(--w-side); border-right:1px solid var(--w-hair); }
:root[data-design="website"] .sb-brand { gap:12px; padding:10px 8px 20px; margin-bottom:14px; border-bottom:1px solid var(--w-hair); }
:root[data-design="website"] .sb-brand .logo-badge { width:40px; height:40px; background:transparent; border:0; border-radius:12px; padding:0;
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset, 0 6px 14px -8px rgba(21,33,15,.45); transition:transform 160ms cubic-bezier(.22,1,.36,1); }
:root[data-design="website"] .sb-brand .logo-badge:active { transform:scale(.96); }
:root[data-design="website"] .sb-brand .logo-badge img { border-radius:12px; }
:root[data-design="website"] .sb-brand .brand-block { display:grid; gap:5px; }
:root[data-design="website"] .sb-brand .brand { font-weight:600; font-size:1.14rem; line-height:1.05; letter-spacing:-.045em; color:var(--w-ink); }
/* Betrieb als zweite Zeile mit Punkt: die Marke, die die Kundschaft kennt, sichtbar statt Kleingedrucktem. */
:root[data-design="website"] .sb-brand .brand-sub { display:flex; align-items:center; gap:6px; margin:0; min-width:0;
  font-size:.8rem; font-weight:500; letter-spacing:-.005em; text-transform:none; color:var(--w-text-2); }
:root[data-design="website"] .sb-brand .brand-sub::before { content:""; flex:none; width:6px; height:6px; border-radius:50%; background:var(--w-sage); }
:root[data-design="website"] .sb-brand .brand-sub { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
:root[data-design="website"] .sb-foot { border-top:1px solid var(--w-hair); }
:root[data-design="website"] .sb-divider { background:var(--w-hair); }
:root[data-design="website"] :is(.nav-item, .sb-item) { color:var(--w-ink); font-weight:500; border-radius:12px; border:1px solid transparent; }
:root[data-design="website"] :is(.nav-item, .sb-item) .sb-ico { color:var(--w-accent); }
:root[data-design="website"] :is(.nav-item, .sb-item):hover { background:var(--w-hover); color:var(--w-ink); }
:root[data-design="website"] .nav-item.active, :root[data-design="website"] .nav-item.active:hover { background:var(--w-surface); border-color:var(--w-hair); color:var(--w-ink); font-weight:600; }
:root[data-design="website"] .sb-badge, :root[data-design="website"] .nav-item.active .sb-badge { background:transparent; color:var(--w-text-2); font-weight:600; min-width:0; padding:0; }
:root[data-design="website"] .chat-indicator .chat-ind-n { background:transparent; color:var(--w-rose); }
:root[data-design="website"] .sb-user .u-name { color:var(--w-ink); }

/* Tablet: Schiene (nur Icons) zwischen 901 und 1199 px */
@media (min-width:901px) and (max-width:1199px) {
  :root[data-design="website"] .app-shell { grid-template-columns:var(--sidebar-w-collapsed) minmax(0,1fr); }
  :root[data-design="website"] .sidebar { padding-left:10px; padding-right:10px; }
  :root[data-design="website"] .sb-brand { justify-content:center; padding-left:0; padding-right:0; }
  :root[data-design="website"] .sb-brand .brand-block, :root[data-design="website"] .sb-label, :root[data-design="website"] .sb-collapse { display:none; }
  :root[data-design="website"] :is(.nav-item, .sb-item) { justify-content:center; padding:0; }
  :root[data-design="website"] .sb-badge { position:absolute; top:5px; right:7px; width:7px; height:7px; min-width:0; padding:0; border-radius:50%; background:var(--w-amber); font-size:0; line-height:0; }
}
:root[data-design="website"] body.sb-collapsed .sb-badge { width:7px; height:7px; min-width:0; padding:0; border-radius:50%; background:var(--w-amber); font-size:0; line-height:0; top:5px; right:7px; }

/* ——— Kopfzeile ——— */
:root[data-design="website"] .top-row { background:var(--w-ground); border-bottom:1px solid var(--w-hair); }
:root[data-design="website"] .top-row .page-title { font-weight:500; letter-spacing:-.035em; font-size:1.75rem; }
:root[data-design="website"] .topbar-search { background:var(--w-field); border:1px solid var(--w-hair-2); border-radius:999px; color:var(--w-text-2); padding:0 8px 0 14px; }
:root[data-design="website"] .topbar-search:hover { background:var(--w-field); border-color:var(--w-ink); color:var(--w-ink); }
:root[data-design="website"] .topbar-search .tb-kbd { background:transparent; border:1px solid var(--w-hair-2); color:var(--w-text-2); border-radius:6px; }
:root[data-design="website"] .top-actions .notif-bell, :root[data-design="website"] .notif-bell { border-radius:999px; background:var(--w-field); border:1px solid var(--w-hair-2); color:var(--w-ink); }
:root[data-design="website"] .notif-dog { color:var(--w-ink); }
:root[data-design="website"] .notif-badge { background:var(--w-rose); color:#fff; }

/* Seitenkopf */
:root[data-design="website"] .page-head h1, :root[data-design="website"] .page-head h2 { font-weight:400; letter-spacing:-.045em; line-height:1.02; }
:root[data-design="website"] .page-head .sub { color:var(--w-text-2); }

/* ——— Buttons: Pillen mit Haarlinie ——— */
:root[data-design="website"] .btn { border-radius:999px; font-weight:500; letter-spacing:-.005em; background:var(--w-fill); border-color:var(--w-fill); color:var(--w-on-fill); padding-left:18px; padding-right:18px; }
:root[data-design="website"] .btn:hover { background:var(--w-ink); border-color:var(--w-ink); color:var(--w-ground); }
:root[data-design="website"] .btn:active { transform:scale(.97); }
:root[data-design="website"] .btn-ghost { background:transparent; color:var(--w-ink); border:1px solid var(--w-hair-2); }
:root[data-design="website"] .btn-ghost:hover { background:var(--w-hover); color:var(--w-ink); border-color:var(--w-ink); }
:root[data-design="website"] .btn-soft { background:transparent; color:var(--w-accent); border:1px solid var(--w-hair-2); }
:root[data-design="website"] .btn-soft:hover { background:var(--w-hover); color:var(--w-ink); border-color:var(--w-ink); }
:root[data-design="website"] .btn-danger { background:transparent; color:var(--rose-text); border:1px solid color-mix(in srgb, var(--w-rose) 45%, transparent); }
:root[data-design="website"] .btn-danger:hover { background:var(--rose-bg); color:var(--rose-text); border-color:var(--w-rose); }
:root[data-design="website"] .btn-sm { padding-left:13px; padding-right:13px; }
:root[data-design="website"] :is(.btn, .btn-ghost, .btn-soft, .seg-btn.active) { font-weight:500; }
:root[data-design="website"] .gbtn { border-radius:999px; background:transparent; border:1px solid var(--w-hair-2); color:var(--w-ink); }
:root[data-design="website"] .gbtn:hover { background:var(--w-hover); border-color:var(--w-ink); }
:root[data-design="website"] .gbtn.danger { color:var(--w-rose); }

/* ——— Karten & Kacheln: flach, Haarlinie ——— */
:root[data-design="website"] :is(.card, .glass-card, .detail-hero, .stat, .today-block, .price-card, .holiday-card, .inq-card, .kpi-card, .euer-stat) {
  background:var(--w-surface); border:1px solid var(--w-hair); box-shadow:none;
}
:root[data-design="website"] :is(.card, .glass-card, .detail-hero) { border-radius:20px; }
:root[data-design="website"] .stat { border-radius:20px; }
:root[data-design="website"] .stat .ico { background:transparent; color:var(--w-sage); width:auto; height:auto; justify-content:start; margin-bottom:10px; }
:root[data-design="website"] .stat .k { font-size:.88rem; color:var(--w-text-2); }
:root[data-design="website"] .stat .v { font-weight:500; letter-spacing:-.035em; color:var(--w-ink); }
:root[data-design="website"] .stat .v small, :root[data-design="website"] .stat .hint { color:var(--w-text-2); }
/* Die eine Hervorhebung: waldgrüne Kachel */
:root[data-design="website"] .stat.accent { background:var(--w-ticket); border-color:transparent; color:#fff; }
:root[data-design="website"] .stat.accent :is(.k, .v, .hint, small) { color:#fff; opacity:1; }
:root[data-design="website"] .stat.accent .k, :root[data-design="website"] .stat.accent .hint { color:rgba(255,255,255,.84); }
:root[data-design="website"] .stat.accent .ico { background:transparent; color:rgba(255,255,255,.84); }
:root[data-design="website"] .stat.forecast .v { color:var(--w-ink); }
:root[data-design="website"] :is(.holiday-card, .cust-card, .inq-card, .today-block, .cal-card, .inv-row):hover { transform:none; box-shadow:none; }

/* Linker Farbbalken → Haarlinie (Zustand trägt Text bzw. Punkt) */
:root[data-design="website"] :is(.today-block.today-block-birthday, .today-block.today-block-arrival, .today-block.today-block-depart, .today-block.today-block-stay,
  .inq-card.is-new, .inq-card.is-holiday, .msg-card.msg-incoming, .msg-card.msg-auto, .holiday-card.is-overbook) {
  border-left:1px solid var(--w-hair);
}
:root[data-design="website"] .today-list li.is-appt, :root[data-design="website"] .cust-card.is-demo { border-left:1px solid transparent; background:transparent; }
:root[data-design="website"] .today-block:is(.today-block-arrival, .today-block-depart, .today-block-stay, .today-block-birthday) { background:var(--w-surface); }
:root[data-design="website"] .today-block h2 { color:var(--w-ink); font-weight:600; font-size:.95rem; border-bottom-color:var(--w-hair); }
:root[data-design="website"] .today-block h2 .ico, :root[data-design="website"] .today-head-row .ico { color:var(--w-sage); }

/* ——— Status: Punkt + Text ——— */
:root[data-design="website"] :is(.hb-status, .inq-status-pill, .hd-detail-status) {
  background:transparent !important; -webkit-text-fill-color:var(--w-ink);
  display:inline-flex; align-items:center; gap:7px; padding:0; border-radius:0;
  text-transform:none; letter-spacing:0; font-size:.86rem; font-weight:600;
}
:root[data-design="website"] :is(.hb-status, .inq-status-pill, .hd-detail-status)::before {
  content:""; width:7px; height:7px; border-radius:50%; background:currentColor; flex:none;
}
:root[data-design="website"] .status-pill { background:transparent; border:0; padding:0; text-transform:none; letter-spacing:0; font-size:.86rem; font-weight:600; color:var(--w-ink); }
:root[data-design="website"] .chip { background:transparent; border:1px solid var(--w-hair-2); color:var(--w-text-2); text-transform:none; letter-spacing:0; font-size:.76rem; font-weight:500; padding:2px 9px; max-width:160px; }
:root[data-design="website"] .chip.abo { background:transparent; color:var(--w-text-2); border-color:var(--w-hair-2); }
:root[data-design="website"] .chip.docs-chip { border:0; padding:0 2px; display:inline-flex; align-items:center; gap:6px; color:var(--w-ink); font-weight:600; background:transparent; }
:root[data-design="website"] .chip.docs-chip::before { content:""; width:7px; height:7px; border-radius:50%; flex:none; background:var(--w-muted-dot); }
:root[data-design="website"] .chip.docs-chip.docs-done { color:var(--w-ink); background:transparent; }
:root[data-design="website"] .chip.docs-chip.docs-done::before { background:var(--w-sage); }
:root[data-design="website"] .chip.docs-chip.docs-partial, :root[data-design="website"] .chip.docs-chip.docs-pending { color:var(--w-ink); background:transparent; }
:root[data-design="website"] .chip.docs-chip.docs-partial::before, :root[data-design="website"] .chip.docs-chip.docs-pending::before { background:var(--w-amber); }
:root[data-design="website"] .chip.docs-chip.docs-empty { color:var(--w-text-2); background:transparent; }
:root[data-design="website"] .chip.chat-chip { background:transparent; border-color:color-mix(in srgb, var(--w-rose) 45%, transparent); color:var(--rose-text); }
:root[data-design="website"] .doc-status { background:transparent; border:0; padding:0; text-transform:none; letter-spacing:0; font-size:.86rem; color:var(--w-ink); }
:root[data-design="website"] .doc-status::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--w-muted-dot); }
:root[data-design="website"] .doc-status.gesendet { background:transparent; color:var(--w-ink); border:0; }
:root[data-design="website"] .doc-status.gesendet::before { background:var(--w-amber); }
:root[data-design="website"] .doc-status.signiert { background:transparent; color:var(--w-ink); border:0; }
:root[data-design="website"] .doc-status.signiert::before { background:var(--w-sage); }
:root[data-design="website"] .dot.aktiv { background:var(--w-sage); }
:root[data-design="website"] .dot { box-shadow:none; }
:root[data-design="website"] .cc-av .dot { border-color:var(--w-surface); }
:root[data-design="website"] .dog-tag { background:transparent; border:1px solid var(--w-hair); color:var(--w-text-2); font-size:.76rem; padding:1px 8px; }
:root[data-design="website"] .demo-tag { background:transparent; border:1px solid var(--w-hair-2); color:var(--w-text-2); text-transform:none; letter-spacing:0; }
:root[data-design="website"] .tag-pill.warn, :root[data-design="website"] .hb-overbook-tag, :root[data-design="website"] .intake-badge.pending, :root[data-design="website"] .vacc-alert.soon, :root[data-design="website"] .tag-pill.offline, :root[data-design="website"] .kpi-card.is-warn .kpi-badge {
  background:transparent; color:var(--w-ink); border-color:var(--w-hair-2);
}
/* Bernstein nie als Schrift */
:root[data-design="website"] :is(.cal-card.appt .cal-card-dog, .today-list li.is-appt .t-dog, .skel-status .skel-slow, .offline-banner .ob-count, .wx-chip .wx-hint, .bd-head) { color:var(--w-ink); }
:root[data-design="website"] .wx-chip .wx-hint { background:transparent; border:1px solid var(--w-hair-2); }

/* ——— Segmente & Tabs ——— */
:root[data-design="website"] :is(.seg-bar, .segmented, .view-tabs) { background:var(--w-hover); border:1px solid var(--w-hair); border-radius:999px; padding:3px; }
:root[data-design="website"] :is(.seg-bar > button, .segmented > button, .view-tab) { border-radius:999px; color:var(--w-text-2); font-weight:500; }
:root[data-design="website"] :is(.seg-bar > button, .segmented > button, .view-tab):hover { color:var(--w-ink); }
:root[data-design="website"] :is(.seg-bar > button.active, .segmented > button.active, .view-tab.active) { background:var(--w-surface); border-color:var(--w-hair-2); color:var(--w-ink); font-weight:600; box-shadow:none; }
:root[data-design="website"] :is(.cal-subnav, .holiday-tabs) { background:var(--w-hover); border:1px solid var(--w-hair); border-radius:999px; padding:3px; }
:root[data-design="website"] :is(.cal-subnav-btn, .holiday-tab) { border-radius:999px; color:var(--w-text-2); font-weight:500; }
:root[data-design="website"] :is(.cal-subnav-btn, .holiday-tab):hover { background:var(--w-hover); color:var(--w-ink); }
:root[data-design="website"] :is(.cal-subnav-btn.active, .holiday-tab.active) { background:var(--w-field); color:var(--w-ink); font-weight:600; box-shadow:0 0 0 1px var(--w-hair-2); }
:root[data-design="website"] .seg { border-bottom-color:var(--w-hair); }
:root[data-design="website"] .seg-btn { color:var(--w-text-2); font-weight:500; }
:root[data-design="website"] .seg-btn:hover { color:var(--w-ink); }
:root[data-design="website"] .seg-btn.active { color:var(--w-ink); border-bottom-color:var(--w-ink); font-weight:600; }

/* ——— Felder ——— */
:root[data-design="website"] :is(input[type=text], input[type=email], input[type=tel], input[type=date], input[type=number], input[type=search], input[type=time], input[type=month], input[type=password], input[type=url], select, textarea) {
  background:var(--w-field); border:1px solid var(--w-hair-2); border-radius:12px; color:var(--w-ink);
}
:root[data-design="website"] :is(input, select, textarea)::placeholder { color:var(--w-text-2); opacity:1; }
:root[data-design="website"] :is(input, select, textarea):focus { border-color:var(--w-accent); box-shadow:0 0 0 3px var(--w-ring); background:var(--w-field); }
:root[data-design="website"] .search input { border-radius:999px; }
:root[data-design="website"] input[type=checkbox], :root[data-design="website"] input[type=radio] { accent-color:var(--w-fill); }

/* ——— Listen ——— */
:root[data-design="website"] .cust-card { border-radius:14px; }
:root[data-design="website"] .cust-card:hover { background:var(--w-hover); }
:root[data-design="website"] .cust-card.active { background:var(--w-ground); border-color:var(--w-hair-2); box-shadow:none; }
:root[data-design="website"] .cc-av { background:var(--w-surface); border:1px solid var(--w-hair); color:var(--w-accent); font-weight:600; }
:root[data-design="website"] .hero-avatar { border-radius:50%; background:var(--w-fill); color:var(--w-on-fill); font-weight:500; }

/* ——— Filter-Pillen: aktiv = gefüllte Pille ——— */
:root[data-design="website"] :is(.sf-pill, .hp-pill, .inq-filter) { background:transparent; border:1px solid var(--w-hair-2); color:var(--w-ink); font-weight:500; }
:root[data-design="website"] :is(.sf-pill, .hp-pill, .inq-filter):hover { background:var(--w-hover); color:var(--w-ink); border-color:var(--w-ink); }
:root[data-design="website"] :is(.sf-pill.active, .hp-pill.active, .inq-filter.active) { background:var(--w-fill); border-color:var(--w-fill); color:var(--w-on-fill); font-weight:600; }
:root[data-design="website"] :is(.sf-pill .sf-n, .hp-pill span, .inq-filter:not(.active) .inq-filter-count) { background:transparent; color:var(--w-text-2); opacity:1; padding:0 0 0 2px; }
:root[data-design="website"] :is(.sf-pill.active .sf-n, .hp-pill.active span, .inq-filter.active .inq-filter-count) { background:transparent; color:rgba(255,255,255,.84); }
:root[data-design="website"] .bh-preset { background:transparent; border:1px solid var(--w-hair-2); color:var(--w-ink); font-weight:500; }
:root[data-design="website"] .bh-preset:hover { background:var(--w-ink); border-color:var(--w-ink); color:var(--w-ground); }
:root[data-design="website"] .settings-nav-item { border-radius:12px; }
:root[data-design="website"] .settings-nav-item.active { background:var(--w-ground); color:var(--w-ink); box-shadow:inset 0 0 0 1px var(--w-hair-2); }

/* ——— Kalender ——— */
:root[data-design="website"] .cal-day { background:var(--w-surface); border:1px solid var(--w-hair); border-radius:20px; box-shadow:none; }
:root[data-design="website"] .cal-day.today { border-color:var(--w-ink); box-shadow:0 0 0 .5px var(--w-ink); }
:root[data-design="website"] .cal-count { background:transparent; color:var(--w-text-2); padding:0; }
:root[data-design="website"] .cal-card, :root[data-design="website"] .cal-card.appt { background:var(--w-surface); border:1px solid var(--w-hair); }
:root[data-design="website"] .cal-card:hover { border-color:var(--w-ink); }
:root[data-design="website"] .cal-card-dog { color:var(--w-ink); }

/* ——— Rechnungen & Buchhaltung ——— */
:root[data-design="website"] .inv-row, :root[data-design="website"] .inv-row.paid, :root[data-design="website"] .inv-row.sent { background:var(--w-surface); border:1px solid var(--w-hair); box-shadow:none; }
:root[data-design="website"] .inv-row.is-cancel { background:var(--w-ground); border-color:var(--w-hair-2); color:var(--w-ink); }
:root[data-design="website"] :is(.inv-amount, .inv-amount.neg, .inv-row.is-cancel .inv-amount.neg) { color:var(--w-ink); font-weight:500; letter-spacing:-.03em; }
:root[data-design="website"] .inv-tag, :root[data-design="website"] .inv-tag-storno { background:transparent; color:var(--w-text-2); border:1px solid var(--w-hair-2); border-radius:999px; }
:root[data-design="website"] :is([data-inv-act="remind"], [data-inv-act="storno"]) { color:var(--w-ink) !important; }
:root[data-design="website"] .bh-section { background:var(--w-surface); border:1px solid var(--w-hair); border-radius:20px; box-shadow:none; }
:root[data-design="website"] .bh-title { font-weight:500; letter-spacing:-.03em; }
:root[data-design="website"] :is(.bh-filters, .bh-actions, .bh-stat) { background:var(--w-ground); border:1px solid var(--w-hair); border-radius:14px; }
:root[data-design="website"] :is(.bh-stat.paid, .bh-stat.open) { background:var(--w-ground); border-color:var(--w-hair); }
:root[data-design="website"] :is(.bh-stat-num, .bh-stat.paid .bh-stat-num, .bh-stat.open .bh-stat-num) { color:var(--w-ink); font-weight:500; letter-spacing:-.03em; }
:root[data-design="website"] :is(.bh-stat.paid, .bh-stat.open) .bh-stat-lbl { display:inline-flex; align-items:center; gap:7px; color:var(--w-ink); font-weight:600; }
:root[data-design="website"] :is(.bh-stat.paid, .bh-stat.open) .bh-stat-lbl::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--w-sage); }
:root[data-design="website"] .bh-stat.open .bh-stat-lbl::before { background:var(--w-amber); }

/* ——— Getönte Hinweisflächen → flache Fläche; Zustand trägt Überschrift/Punkt ——— */
:root[data-design="website"] :is(.weather-widget, .dunning-widget, .review-widget, .birthday-widget, .bd-card, .dn-card, .rv-card,
  .inq-holiday-banner, .dh-block, .dh-block.dh-block-warn, .wt-day, .wt-day.heat, .wt-day.storm, .inq-reply-source, .note-box,
  .euer-stat.income, .euer-stat.expense, .euer-stat.profit, .er-hero, .er-hero-empty, .er-warn-card,
  .er-phone-vet, .er-phone-emergency, .er-phone-self, .portal-hero, .trips-stat, .maintenance-card.is-active,
  .stat.forecast, .today-list li.is-appt) {
  background:var(--w-surface); border-color:var(--w-hair);
}
:root[data-design="website"] :is(.capacity-day.free, .hc-day.free, .wiz-cap-day.free) { background:var(--w-surface); }
:root[data-design="website"] :is(.capacity-day.busy, .hc-day.busy, .wiz-cap-day.busy) { background:color-mix(in srgb, var(--w-amber) 16%, var(--w-surface)); color:var(--w-ink); }
:root[data-design="website"] :is(.capacity-day.full, .hc-day.full, .wiz-cap-day.full) { background:color-mix(in srgb, var(--w-rose) 16%, var(--w-surface)); color:var(--w-ink); }
:root[data-design="website"] :is(.dh-vacc-due.soon, .dh-vacc-due.ok, .euer-stat.expense .val, .update-detail-reject summary) { color:var(--w-ink); }
:root[data-design="website"] .dh-vacc-due.expired, :root[data-design="website"] .dh-emergency-section h4, :root[data-design="website"] :is(.dn-head, .dn-body small) { color:var(--rose-text); }
:root[data-design="website"] :is(.rv-head, .wt-title) { color:var(--w-ink); }
:root[data-design="website"] :is(.dog-photo-avatar, .dog-gallery-tile) { background:var(--w-ground); }
:root[data-design="website"] :is(.msg-card.msg-incoming .msg-ico, .msg-card.msg-auto .msg-ico) { background:var(--w-ground); }
:root[data-design="website"] .inv-cancel-badge { background:transparent; color:var(--w-ink); border:1px solid var(--w-hair-2); border-radius:999px; text-transform:none; letter-spacing:0; }
:root[data-design="website"] .emergency-btn { background:var(--w-rose); border:0; box-shadow:none; }
:root[data-design="website"] .ana-top-row:hover { background:var(--w-hover); }
:root[data-design="website"] .empty-state .es-ico { background:var(--w-ground); color:var(--w-sage); }
:root[data-design="website"] .sb-brand .logo-badge { background:transparent; }

/* ——— Ebenen: Modal, Toast, Hinweise ——— */
:root[data-design="website"] .modal-bg { background:var(--w-scrim); }
:root[data-design="website"] .modal-card { border:1px solid var(--w-hair); box-shadow:var(--w-pop); }
:root[data-design="website"] .modal-head h2 { font-weight:500; letter-spacing:-.03em; }
:root[data-design="website"] .modal-actions { border-top-color:var(--w-hair); }
:root[data-design="website"] .modal-x { border-radius:999px; }
:root[data-design="website"] .toast { background:var(--w-ink); color:var(--w-ground); border-radius:999px; box-shadow:var(--w-pop); }
:root[data-design="website"] .toast.err { background:var(--w-rose); color:#fff; }
:root[data-design="website"] .platform-bar .pb { background:var(--w-side); border:1px solid var(--w-hair); border-radius:14px; color:var(--w-ink); }
:root[data-design="website"] .platform-bar :is(.pb-support, .pb-maint) { border-color:color-mix(in srgb, var(--w-amber) 45%, transparent); }
:root[data-design="website"] .platform-bar :is(.pb-support, .pb-maint) strong { color:var(--w-ink); }
:root[data-design="website"] .gdw-soon { background:var(--w-side); border:1px solid var(--w-hair); border-radius:20px; color:var(--w-ink); }
:root[data-design="website"] .gdw-soon-ico { color:var(--w-ink); }
:root[data-design="website"] .gdw-soon p { color:var(--w-text-2); }
:root[data-design="website"] .gdw-soon-tag { background:transparent; color:var(--w-ink); padding:0; display:inline-flex; align-items:center; gap:7px; text-transform:none; letter-spacing:0; font-size:.86rem; font-weight:600; }
:root[data-design="website"] .gdw-soon-tag::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--w-amber); }

/* ——— Mobil: Leiste unten + „Mehr"-Blatt ——— */
@media (max-width:900px) {
  :root[data-design="website"] .bottom-bar { background:var(--w-side); border-top:1px solid var(--w-hair); }
  :root[data-design="website"] .bb-item { color:var(--w-text-2); font-weight:500; }
  :root[data-design="website"] .bb-item.active { color:var(--w-ink); font-weight:600; }
  :root[data-design="website"] .bb-item.active .sb-ico { background:var(--w-surface); box-shadow:0 0 0 1px var(--w-hair-2); border-radius:999px; }
  :root[data-design="website"] .bb-item .sb-badge { background:var(--w-rose); color:#fff; padding:0 4px; min-width:16px; }
  :root[data-design="website"] .ms-backdrop { background:var(--w-scrim); }
  :root[data-design="website"] .ms-card { background:var(--w-side); border-radius:20px 20px 0 0; border-top:1px solid var(--w-hair); }
  :root[data-design="website"] .ms-grip { background:var(--w-hair-2); }
}

/* ——— Anmeldung ——— */
:root[data-design="website"] .gdw-login { background:var(--w-ground); }
/* Anmeldung: Video links (Website-Look), Formular rechts; schmal: Video als Streifen oben. */
:root[data-design="website"] .gdw-login { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); place-items:stretch; padding:0; }
:root[data-design="website"] .gdw-login-media { display:block; position:relative; overflow:hidden; background:#2a2414; color:#fff; min-height:100vh; min-height:100dvh; }
:root[data-design="website"] .gdw-login-media video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:30% 55%; }
:root[data-design="website"] .gdw-login-media::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(12,10,4,.05) 35%, rgba(12,10,4,.72)); }
:root[data-design="website"] .gdw-login-copy { position:absolute; z-index:1; left:clamp(24px,5vw,64px); right:clamp(24px,5vw,64px); bottom:clamp(28px,6vh,64px); }
:root[data-design="website"] .gdw-login-tag { display:inline-flex; align-items:center; gap:8px; margin:0 0 18px; padding:7px 14px; border-radius:999px;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); font-size:12.5px; letter-spacing:.02em; }
:root[data-design="website"] .gdw-login-tag::before { content:""; width:7px; height:7px; border-radius:50%; background:#9ccf8f; }
:root[data-design="website"] .gdw-login-claim { margin:0 0 14px; font-weight:400; font-size:clamp(38px,4.6vw,68px); line-height:1.02; letter-spacing:-.045em; text-wrap:balance; }
:root[data-design="website"] .gdw-login-claim em { font-family:var(--w-italic); font-style:italic; font-weight:400; letter-spacing:-.02em; font-size:1.06em; }
:root[data-design="website"] .gdw-login-sub { margin:0; max-width:40ch; font-size:16.5px; line-height:1.5; color:rgba(255,255,255,.86); }
:root[data-design="website"] .gdw-login > .gdw-login-card { align-self:center; justify-self:center; width:min(440px, calc(100% - 32px)); margin:40px 0; }
@media (max-width:860px) {
  :root[data-design="website"] .gdw-login { grid-template-columns:1fr; }
  :root[data-design="website"] .gdw-login-media { min-height:40vh; min-height:40svh; }
  :root[data-design="website"] .gdw-login-tag { display:none; }
  :root[data-design="website"] .gdw-login-claim { font-size:clamp(32px,9vw,44px); }
  :root[data-design="website"] .gdw-login-sub { font-size:15px; }
  :root[data-design="website"] .gdw-login > .gdw-login-card { margin:-28px 0 32px; position:relative; z-index:1; }
}
:root[data-design="website"] .gdw-login-card { background:var(--w-surface); border:1px solid var(--w-hair); border-radius:24px; box-shadow:none; padding:36px 32px; }
:root[data-design="website"] .gdw-login-brand { font-weight:600; letter-spacing:-.045em; font-size:1.2rem; color:var(--w-ink); }
:root[data-design="website"] .gdw-login-brand img { border-radius:10px; }
:root[data-design="website"] .gdw-login h1 { font-size:2.6rem; font-weight:400; letter-spacing:-.045em; line-height:1.05; color:var(--w-ink); margin-bottom:10px; }
:root[data-design="website"] .gdw-login .lead { color:var(--w-text-2); font-size:1rem; line-height:1.55; }
:root[data-design="website"] .gdw-login label { color:var(--w-ink); font-weight:500; font-size:.93rem; }
:root[data-design="website"] .gdw-login :is(input[type="email"], input[type="password"]) { background:var(--w-field); border:1px solid var(--w-hair-2); border-radius:12px; min-height:48px; color:var(--w-ink); }
:root[data-design="website"] .gdw-login input:focus-visible { outline:none; border-color:var(--w-accent); box-shadow:0 0 0 3px var(--w-ring); }
:root[data-design="website"] .gdw-login .btn { min-height:48px; font-size:1rem; }
:root[data-design="website"] .gdw-login-error { background:var(--rose-bg); color:var(--rose-text); border-radius:12px; }
:root[data-design="website"] .gdw-login-note { color:var(--w-text-2); }
:root[data-design="website"] .gdw-login-foot a { color:var(--w-text-2); text-decoration:underline; }

}