/* =========================================================
   MW FewoManager – Markenwerte der Webseite (Auslieferung)

   Das ist die EINE Stelle, an der ein Betrieb Farbe und Schrift seiner
   Webseite festlegt. Wer die Seite umfärben will, überschreibt die
   --brand-*-Werte in seinem eigenen Stylesheet (Frontend-Einstellungen >
   Stylesheet oder ein Layout-Stylesheet NACH dieser Datei); an den
   Bauteilen ändert er nichts.

   Die Werte hier sind neutral: Sie geben das heutige Aussehen des Themes
   wieder. Die Küstenweb-Werte der Demo stehen in demo-layer.css.

   Ladereihenfolge: NACH style.css, VOR site-components.css.
   Schrift: Inter, selbst gehostet (fonts/), Halbfett ist 500.
   ========================================================= */

@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/inter-400.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/inter-600.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/inter-700.woff2") format("woff2"); }

:root {
  --brand-primary:        #3D5A92;
  --brand-primary-hover:  #2F487A;
  --brand-primary-dark:   #263B63;
  --brand-primary-darker: #1B2B4A;
  --brand-primary-soft:   #EDF1F8;
  --brand-accent:         #E89F3C;
  --brand-cta:            var(--brand-primary);
  --brand-cta-hover:      var(--brand-primary-hover);
  --brand-accent-text:    #8A5A00;
  --brand-ink:            #1F2937;
  --brand-ink-soft:       #475569;
  --brand-surface:        #F8FAFC;
  --brand-border:         #E2E8F0;
  --brand-on-dark-soft:   #A8B5CC;
  --brand-font:           "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --brand-radius-sm: 8px;
  --brand-radius-md: 14px;
  --brand-shadow-sm: 0 1px 2px rgba(15,27,45,.06), 0 2px 6px rgba(15,27,45,.04);
  --brand-shadow-md: 0 4px 12px rgba(15,27,45,.08), 0 12px 24px -8px rgba(15,27,45,.10);
  --brand-header-h: 88px;
}

:root {
  --c-primary:       var(--brand-primary);
  --c-primary-700:   var(--brand-primary-hover);
  --c-primary-50:    var(--brand-primary-soft);
  --c-accent:        var(--brand-accent);
  --c-text:          var(--brand-ink);
  --c-text-muted:    var(--brand-ink-soft);
  --c-line:          var(--brand-border);
  --c-bg-alt:        var(--brand-surface);
  --ff-sans:         var(--brand-font);
  --ff-display:      var(--brand-font);

  --color-primary:       var(--brand-primary);
  --color-primary-hover: var(--brand-primary-hover);
  --color-text:          var(--brand-ink);
  --color-muted:         var(--brand-ink-soft);
  --color-text-muted:    var(--brand-ink-soft);
  --font-family-sans-serif: var(--brand-font);
}

.picker-scope,
.pick,
.pick__panel--floating,
[data-pick-tooltip] {
  --pick-color-primary:       var(--brand-primary);
  --pick-color-primary-hover: var(--brand-primary-hover);
  --pick-color-bg:            var(--brand-surface);
  --pick-color-text:          var(--brand-ink);
  --pick-color-text-muted:    var(--brand-ink-soft);
  --pick-border-color:        var(--brand-border);
  --pick-border-radius:       var(--brand-radius-sm);
  --pick-border-radius-md:    var(--brand-radius-md);
}

:root {
  --border-radius: var(--brand-radius-sm);
  --radius-sm:     var(--brand-radius-sm);
  --radius-md:     var(--brand-radius-md);
  --booking-color-primary:       var(--brand-cta) !important;
  --booking-color-primary-hover: var(--brand-cta-hover) !important;
  --frontend-core-color-primary:       var(--brand-cta) !important;
  --frontend-core-color-primary-hover: var(--brand-cta-hover) !important;
}