/* ==========================================================================
   Digital Charging Solutions — Theme Override für das Pipelet Fahrerportal
   --------------------------------------------------------------------------
   Scope: [data-portal-theme="dcs"] (gesetzt in templates/index.html)

   DCS-CI (angelehnt an digitalchargingsolutions.com): sehr cleanes,
   modernes Tech-Design mit tiefem Blau, Lila-Akzent und viel Weißraum.
   Primär-Farbe: #005EB8 (deep blue). Sekundär: #7C3AED (purple).
   Header ist weiß mit blauer Wordmark.
   ========================================================================== */

[data-portal-theme="dcs"] {
    /* Brand-Scale um #005EB8 herum — etwas kühler/tiefer als Pipelet. */
    --brand-25:  #f2f8ff;
    --brand-50:  #e0eefc;
    --brand-100: #bcdaf7;
    --brand-200: #8cbeef;
    --brand-300: #579de6;
    --brand-400: #2578d2;
    --brand-500: #005eb8;
    --brand-600: #00489a;
    --brand-700: #003875;
    --brand-800: #002a5a;
    --brand-900: #001f42;
    --brand-950: #001230;

    --color-accent-primary: #005eb8;
    --color-bg-brand-primary: #005eb8;
    --color-bg-brand-secondary: #2578d2;
    --color-border-brand: #8cbeef;
    --color-border-brand-solid: #005eb8;
    --color-text-brand-primary: #00489a;
    --color-text-brand-secondary: #003875;
    --color-fg-brand-primary: #005eb8;
    --color-fg-brand-secondary: #7c3aed;  /* DCS purple accent */
}

/* Header ---------------------------------------------------------------- */
[data-portal-theme="dcs"] #app-header {
    background: #ffffff;
    border-bottom: 1px solid #e0eefc;
}
[data-portal-theme="dcs"] #app-header h1,
[data-portal-theme="dcs"] .brand-wordmark {
    color: #001f42;
    font-weight: 700;
    letter-spacing: -0.01em;
    font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
}
[data-portal-theme="dcs"] #app-header .nav-link {
    color: #003875;
}
[data-portal-theme="dcs"] #app-header .nav-link:hover,
[data-portal-theme="dcs"] #app-header .nav-link.active {
    color: #005eb8;
    border-bottom-color: #005eb8;
}

/* Buttons --------------------------------------------------------------- */
[data-portal-theme="dcs"] .pd-btn-primary,
[data-portal-theme="dcs"] .ch-btn,
[data-portal-theme="dcs"] .dp-feedback-btn,
[data-portal-theme="dcs"] .dp-action-btn {
    background: #005eb8;
    color: #ffffff;
    border: 1px solid #005eb8;
}
[data-portal-theme="dcs"] .pd-btn-primary:hover,
[data-portal-theme="dcs"] .ch-btn:hover,
[data-portal-theme="dcs"] .dp-feedback-btn:hover,
[data-portal-theme="dcs"] .dp-action-btn:hover {
    background: #00489a;
    border-color: #00489a;
}
[data-portal-theme="dcs"] .pd-btn-ghost {
    color: #00489a;
    border-color: #bcdaf7;
}
[data-portal-theme="dcs"] .pd-btn-ghost:hover {
    background: #f2f8ff;
    color: #005eb8;
}

/* Links & Accents ------------------------------------------------------- */
[data-portal-theme="dcs"] .dp-link,
[data-portal-theme="dcs"] a.dp-link {
    color: #005eb8;
}
[data-portal-theme="dcs"] .dp-link:hover {
    color: #7c3aed;
}

/* Hero & Card-Accents --------------------------------------------------- */
[data-portal-theme="dcs"] .dp-hero {
    border-left: 4px solid #005eb8;
    background: linear-gradient(135deg, #ffffff 0%, #f2f8ff 100%);
}
[data-portal-theme="dcs"] .dp-hero-status.is-ok .dp-hero-dot {
    background: #1d805f;
}
[data-portal-theme="dcs"] .dp-wiz-bar-fill {
    background: linear-gradient(90deg, #005eb8 0%, #7c3aed 100%);
}
[data-portal-theme="dcs"] .dp-wiz-step.is-done .dp-wiz-step-check {
    background: #005eb8;
}
[data-portal-theme="dcs"] .veh-empty-hero {
    border-left-color: #7c3aed;
}

/* Form-Inputs / Radios -------------------------------------------------- */
[data-portal-theme="dcs"] .dp-mode-option input:checked + .dp-mode-card {
    border-color: #005eb8;
    background: #f2f8ff;
    box-shadow: inset 0 0 0 1px #005eb8;
}
[data-portal-theme="dcs"] .dp-wiz-step-link:hover {
    background: rgba(0, 94, 184, 0.05);
}

/* Page background — sehr subtle Gradient für cleanes SaaS-Feeling. */
[data-portal-theme="dcs"] body {
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}