/* ============================================================
   Theme: OLED Black
   True near-pure-black (#050505) fuer OLED-Displays + Nacht.
   Bewusst KEIN Grain, KEINE Background-Radials — der Charakter
   ist "Light off". Gleicher Cobalt-Accent wie Dark v2 + Espresso
   + Stone Light fuer Brand-Continuity.
   ============================================================ */

:root[data-theme="oled-black"]{
  /* Neutral scale — pure OLED range */
  --pk-gray-0:#ffffff;
  --pk-gray-50:#fafaf8;
  --pk-gray-100:#f0eeea;   /* TEXT — warm-bright off-white */
  --pk-gray-200:#c8c4be;
  --pk-gray-300:#9a9a98;
  --pk-gray-400:#6e6e6c;
  --pk-gray-500:#4a4a48;
  --pk-gray-600:#2a2a2a;
  --pk-gray-700:#1d1d1d;
  --pk-gray-800:#141414;   /* elevated */
  --pk-gray-850:#101010;
  --pk-gray-900:#0c0c0c;   /* surface */
  --pk-gray-950:#050505;   /* BASE — true off-black */

  /* Surfaces — minimal lightness steps, fast unsichtbar */
  --pk-bg:           var(--pk-gray-950);     /* #050505 */
  --pk-bg-surface:   var(--pk-gray-900);     /* #0c0c0c */
  --pk-bg-elevated:  var(--pk-gray-800);     /* #141414 */
  --pk-bg-input:     #000000;                /* true black fuer Inputs */
  --pk-bg-hover:     rgba(240,238,234,.05);
  --pk-bg-active:    rgba(240,238,234,.09);

  /* Borders — staerker als Dark v2 (dim surroundings brauchen mehr edge-definition) */
  --pk-border-subtle: rgba(240,238,234,.07);
  --pk-border:        rgba(240,238,234,.12);
  --pk-border-strong: rgba(240,238,234,.20);
  --pk-border-focus:  rgba(58,141,255,.55);

  /* Text — warm-bright fuer OLED-Kontrast */
  --pk-text:           var(--pk-gray-100);   /* #f0eeea */
  --pk-text-secondary: var(--pk-gray-200);   /* #c8c4be */
  --pk-text-muted:     #8a8680;
  --pk-text-disabled:  var(--pk-gray-500);

  /* Accent — IDENTISCHER Cobalt wie Dark v2 + Espresso + Stone */
  --pk-accent:        #3a8dff;
  --pk-accent-hover:  #5aa0ff;
  --pk-accent-active: #2877e0;
  --pk-accent-bg:     rgba(58,141,255,.12);
  --pk-accent-bg-strong: rgba(58,141,255,.18);
  --pk-accent-border: rgba(58,141,255,.32);
  --pk-accent-text:   #a8c8ff;

  /* Status — leicht heller fuer OLED-Kontrast */
  --pk-success:#52d068; --pk-success-bg:rgba(82,208,104,.10); --pk-success-border:rgba(82,208,104,.30); --pk-success-text:#92e2a4;
  --pk-warning:#e8a942; --pk-warning-bg:rgba(232,169,66,.12); --pk-warning-border:rgba(232,169,66,.32); --pk-warning-text:#f0c578;
  --pk-error:#ff6a60;   --pk-error-bg:rgba(255,106,96,.10);    --pk-error-border:rgba(255,106,96,.30);   --pk-error-text:#ffa8a0;
  --pk-info:#62b0ff;    --pk-info-bg:rgba(98,176,255,.10);    --pk-info-border:rgba(98,176,255,.28);   --pk-info-text:#a8cfff;

  /* Tool accents */
  --pk-tool-movebase:#3a8dff;
  --pk-tool-watchcost:#e8a942;
  --pk-tool-mapmark:#52d068;
  --pk-tool-setinfo:#a378ff;
  --pk-tool-overtime:#62b0ff;
  --pk-tool-callgap:#f078b0;
  --pk-tool-callsheetcheck:#62c0ee;

  /* Selection */
  --pk-selection: rgba(58,141,255,.32);
}

/* ─── Body — KEIN Radial-Overlay (das wuerde OLED-Pure brechen) */
:root[data-theme="oled-black"] body{
  color: var(--pk-text);
  background: var(--pk-bg);
  background-attachment: fixed;
}
:root[data-theme="oled-black"] ::selection{ background:var(--pk-selection); color:var(--pk-text); }

/* Topbar — frosted pure dark */
:root[data-theme="oled-black"] .pk-topbar{
  background:rgba(5,5,5,.86);
  backdrop-filter:blur(16px) saturate(180%);
  -webkit-backdrop-filter:blur(16px) saturate(180%);
  border-bottom:1px solid var(--pk-border-subtle);
}

/* Brand-Mark — Cobalt gradient */
:root[data-theme="oled-black"] .pk-nav__brand-mark{
  background:linear-gradient(135deg,#3a8dff 0%,#6db4ff 100%);
  color:#ffffff;
  box-shadow:0 0 0 1px rgba(58,141,255,.30), 0 4px 16px rgba(58,141,255,.24);
}

/* Sidebar / pane lists — minimal raised vs base */
:root[data-theme="oled-black"] .pk-sidebar,
:root[data-theme="oled-black"] .pk-pane-list,
:root[data-theme="oled-black"] .pk-pane-side{
  background:#0a0a0a;
  border-color:var(--pk-border-subtle);
}

/* Cards / Stage — KEIN cool-tint Gradient, nur clean surface */
:root[data-theme="oled-black"] .pk-card,
:root[data-theme="oled-black"] .pk-stage,
:root[data-theme="oled-black"] .pk-hud__breakdown,
:root[data-theme="oled-black"] .pk-hud__kpi{
  background:var(--pk-bg-surface);
  border-color:var(--pk-border);
}

/* HUD Total — minimal lift, clean */
:root[data-theme="oled-black"] .pk-hud__total{
  background:var(--pk-bg-elevated);
  border-color:var(--pk-border-strong);
  box-shadow:none;
}

/* Inputs — true black */
/* WICHTIG: background-COLOR longhand statt background shorthand — sonst
   resettet der Shorthand background-image/repeat/position auf defaults
   und ueberschreibt den chevron-svg + no-repeat aus prodkit-design.css.
   Visueller Bug: chevron wird ueber die ganze Select-Breite repeated. */
:root[data-theme="oled-black"] .pk-input,
:root[data-theme="oled-black"] .pk-select,
:root[data-theme="oled-black"] .pk-textarea{
  background-color:var(--pk-bg-input);
  border-color:var(--pk-border);
  color:var(--pk-text);
}
:root[data-theme="oled-black"] .pk-input:focus,
:root[data-theme="oled-black"] .pk-select:focus,
:root[data-theme="oled-black"] .pk-textarea:focus{
  border-color:var(--pk-border-focus);
  box-shadow:0 0 0 3px rgba(58,141,255,.22);
}

/* Select arrow / pickers / chevron */
:root[data-theme="oled-black"] .pk-select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5l3 3 3-3' stroke='%239a9a98' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
:root[data-theme="oled-black"] .pk-input[type="date"]::-webkit-calendar-picker-indicator,
:root[data-theme="oled-black"] .pk-input[type="time"]::-webkit-calendar-picker-indicator,
:root[data-theme="oled-black"] .pk-input[type="datetime-local"]::-webkit-calendar-picker-indicator{
  filter: invert(.7);
  opacity:.8;
}
:root[data-theme="oled-black"] .pk-disclosure > summary::after{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M3.5 5.5l3.5 3.5 3.5-3.5' stroke='%239a9a98' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Default button MUSS VOR primary stehen */
:root[data-theme="oled-black"] .pk-btn{
  background:var(--pk-bg-elevated);
  border-color:var(--pk-border);
  color:var(--pk-text);
}
:root[data-theme="oled-black"] .pk-btn:hover{
  background:#1d1d1d;
  border-color:var(--pk-border-strong);
}

/* Primary button — Cobalt */
:root[data-theme="oled-black"] .pk-btn--primary{
  background:linear-gradient(180deg,#3a8dff 0%,#2877e0 100%);
  border-color:#2877e0;
  color:#ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 1px 2px rgba(0,0,0,.50);
}
:root[data-theme="oled-black"] .pk-btn--primary:hover{
  background:linear-gradient(180deg,#5aa0ff 0%,#3a8dff 100%);
  border-color:#3a8dff;
  color:#ffffff;
}

/* Modal — true black backdrop */
:root[data-theme="oled-black"] .pk-modal{
  background:rgba(0,0,0,.86);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
:root[data-theme="oled-black"] .pk-modal__card{
  background:var(--pk-bg-elevated);
  border-color:var(--pk-border-strong);
  box-shadow:0 24px 60px rgba(0,0,0,.80);
}

/* Toast */
:root[data-theme="oled-black"] .pk-toast{
  background:var(--pk-bg-elevated);
  border-color:var(--pk-border-strong);
  color:var(--pk-text);
  box-shadow:0 8px 24px rgba(0,0,0,.62);
}

/* Badge-Accent */
:root[data-theme="oled-black"] .pk-badge--accent{
  background:var(--pk-accent-bg);
  border-color:var(--pk-accent-border);
  color:var(--pk-accent-text);
}

/* KEIN body::before grain — OLED-Pure ist der Punkt */