/* bertol.de V17 – gemeinsame Darstellung für Startseite, Kontakt und Mailmigration */

/* Drei ausreichend große Touch-Ziele, auch auf iPhone/Android. */
.theme-control {
  display:inline-flex;
  align-items:center;
  flex:none;
  gap:2px;
  padding:4px;
  border:1px solid var(--border, var(--line, #dedfd7));
  background:var(--bg, #f7f6f2);
  border-radius:3px 16px 3px 3px;
}
.theme-choice {
  appearance:none;
  -webkit-appearance:none;
  min-height:44px;
  min-width:57px;
  padding:0 11px;
  border:1px solid transparent;
  background:transparent;
  border-radius:3px 12px 3px 3px;
  font:inherit;
  font-size:.81rem;
  line-height:1.2;
  font-weight:760;
  color:var(--muted);
  cursor:pointer;
  white-space:nowrap;
  transition:background-color .15s ease,color .15s ease;
}
.theme-choice:hover:not([aria-pressed="true"]) {background:var(--border, #dedfd7);color:var(--ink, var(--text));}
.theme-choice[aria-pressed="true"] {background:var(--dark);color:#fff;}
.theme-choice:focus-visible {outline:3px solid var(--accent);outline-offset:2px;}

/* Einheitliche Kopfzeile, die auf dem Smartphone nicht überläuft. */
@media(max-width:760px) {
  .site-header .header-inner {
    display:grid;
    grid-template-columns:max-content minmax(0,1fr);
    grid-template-areas:'logo theme' 'nav nav';
    align-items:center;
    column-gap:12px;
    row-gap:11px;
    padding:13px 0 14px;
  }
  .site-header .logo {grid-area:logo;}
  .site-header .nav {grid-area:nav;display:flex;gap:6px 10px;min-width:0;flex-wrap:wrap;}
  .site-header .nav a {
    display:inline-flex;
    align-items:center;
    min-height:44px;
    padding:9px 12px;
    border:1px solid var(--border, var(--line, #dedfd7));
    border-radius:3px 13px 3px 3px;
    font-size:.84rem;
    line-height:1.3;
  }
  .site-header .nav a[aria-current="page"] {border-color:var(--accent);}
  .site-header .theme-control {grid-area:theme;justify-self:end;}
}
@media(max-width:360px) {
  .site-header .header-inner {grid-template-areas:'logo logo' 'theme theme' 'nav nav';}
  .site-header .theme-control {justify-self:start;}
}
@media(prefers-reduced-motion:reduce) {.theme-choice {transition:none;}}

/* Dunkle Palette: die hellen Stylesheets bleiben vollständig erhalten. */
html[data-theme="dark"] {
  color-scheme:dark;
  --bg:#131d18;
  --ink:#eef2ed;
  --text:#eef2ed;
  --muted:#b4c4b9;
  --muted2:#a2b2a7;
  --card:#1e2d24;
  --white:#1e2d24;
  --border:#3d5445;
  --line:#3d5445;
  --line2:#2f4638;
  --accent:#f0aa90;
  --accent-soft:#492f29;
  --dark:#2b4a3a;
  --dark2:#3b604b;
}
html[data-theme="light"] {color-scheme:light;}
html[data-theme="dark"] .site-header {background:var(--card);border-bottom-color:var(--line2);}
html[data-theme="dark"] .logo,
html[data-theme="dark"] .site-header .logo {color:var(--ink);}
html[data-theme="dark"] .site-header .nav a {color:var(--muted);}
html[data-theme="dark"] .site-header .nav a:hover,
html[data-theme="dark"] .site-header .nav a[aria-current="page"] {color:var(--accent);}
html[data-theme="dark"] h1 .highlight,
html[data-theme="dark"] .hero h1 span {color:#b6c9b9;}
html[data-theme="dark"] .button.secondary:hover {background:#2d4032;}
html[data-theme="dark"] .live-label {background:#243b2d;color:#b8e7c5;border-color:#477655;}
html[data-theme="dark"] .detail-panel {
  background:#20362a;border-color:#41604a;
}
html[data-theme="dark"] .detail-panel p {color:#c4d4c6;}
html[data-theme="dark"] .detail-panel .side-panel {border-color:#41604a;}
html[data-theme="dark"] .legal .card h2 {color:var(--ink);}
html[data-theme="dark"] .legal a.text-link,
html[data-theme="dark"] .card .card-link {color:#b5e4c5;}
html[data-theme="dark"] .legal a.text-link:hover {color:var(--accent);}
html[data-theme="dark"] .meta {background:#253c2c;color:#e2eee2;border-color:#4a6b50;}
html[data-theme="dark"] .meta strong {color:#f1f8f1;}
html[data-theme="dark"] .lab-select {background:#24382c;color:var(--ink);border-color:var(--border);}
html[data-theme="dark"] .metric-card .lab-select {background:#eef3ec;color:#1b3a2b;border-color:#d4e0d6;}
html[data-theme="dark"] .metric-card .lab-label {color:#d9e3dc;}
html[data-theme="dark"] .reveal-email,
html[data-theme="dark"] .provider-button {background:#e9f0e8;color:#1c3c2b;border-color:#ceddce;}
html[data-theme="dark"] .reveal-email:hover,
html[data-theme="dark"] .provider-button:hover {background:#d9e8d9;}
html[data-theme="dark"] .term-popup {background:#eaf0e8;color:#233f31;}
html[data-theme="dark"] .theme-control {background:#17241b;border-color:#445b4a;}
html[data-theme="dark"] .theme-choice[aria-pressed="true"] {background:#c7e1cc;color:#183b28;}
html[data-theme="dark"] .theme-choice:hover:not([aria-pressed="true"]) {background:#2d4535;color:#eef5ed;}

/* Mailmigration: eigene Farbflächen und Links der Archivseite. */
html[data-theme="dark"] .mailmigration-page a {color:#addbc1;}
html[data-theme="dark"] .mailmigration-page .site-header .logo {color:var(--ink);}
html[data-theme="dark"] .mailmigration-page .site-header .logo span {color:var(--accent);}
html[data-theme="dark"] .mailmigration-page .site-header .nav a {color:var(--muted);}
html[data-theme="dark"] .mailmigration-page .site-header .nav a:hover,
html[data-theme="dark"] .mailmigration-page .site-header .nav a[aria-current="page"] {color:var(--accent);}
html[data-theme="dark"] .mailmigration-page .hero-link {color:#e0ede2;}
html[data-theme="dark"] .mailmigration-page .hero-link:hover {color:var(--accent);}
html[data-theme="dark"] .status {background:#402e28;border-color:#765245;}
html[data-theme="dark"] .status p {color:#f3cbb8;}
html[data-theme="dark"] .server-small {background:#25382d;color:#ceddcf;border-color:var(--line);}
html[data-theme="dark"] .spam-section {background:#1f3428;}
html[data-theme="dark"] .spam-inner p {color:#c8d9cb;}
html[data-theme="dark"] .spam-actions {border-color:#48604c;}
html[data-theme="dark"] .spam-actions p {border-color:#45604c;}
html[data-theme="dark"] .spam-actions b {color:#e8f2e8;}
html[data-theme="dark"] .device-nav a,
html[data-theme="dark"] .device-body .source {background:#263e30;color:#d6ebdc;border-color:#45604c;}
html[data-theme="dark"] .device-nav a:hover,
html[data-theme="dark"] .device-body .source:hover {color:var(--accent);border-color:var(--accent);}
html[data-theme="dark"] .expand {color:var(--ink);}
html[data-theme="dark"] .help-area b {color:#f0f5ed;}
html[data-theme="dark"] .contact-block a {background:#eaf2e8;color:#1e3c2d;}
html[data-theme="dark"] .contact-block a:hover {background:#d7e5d7;}
html[data-theme="dark"] .footer strong {color:var(--ink);}
html[data-theme="dark"] .footer a {color:#b0e0c0;}

@media print {
  .theme-control {display:none;}
  .site-header .header-inner {display:flex;}
}