/* ============================================================================
   SolarCharts public skin — the TOKEN PASS over _LandingLayout
   ----------------------------------------------------------------------------
   Loaded by _LandingLayout.cshtml AFTER the color-admin bundle, so it reaches
   all ~13 public (anonymous) pages at once. See docs/public-web.md §5.

   What it does (and nothing more):
   - a cold "instrument" tint on the template's dark surfaces
   - one unified radius scale
   - tabular numerals on body
   - the mobile nav toggler becomes the landing's text "Menu" pill

   It brings NO typeface: no @font-face, no font token remapped. The one
   font-family it writes is the template's own --bs-font-monospace, on the
   Menu pill. All text on these pages is the template's own type.

   ---- THE BRAND TYPEFACE DOES NOT CROSS ONTO TEMPLATE PAGES ----------------
   Deliberate, decided 2026-08-09. That morning this file remapped
   --bs-font-sans-serif to Overused Grotesk and, to reach the views that carry
   an inline font-family:'Open Sans', also declared @font-face faces *named*
   'Open Sans' that actually served the Overused Grotesk woff2 files. The
   owner's verdict the same day: "ten font proste nevypada dobre jinde nez na
   landing page" — the face carries the landing and nothing else. Both the
   remap and the alias were removed; the template pages render in the
   template's own Open Sans again. Do not re-add them.

   --bs-font-monospace was remapped to Azeret Mono the same morning and went
   the same way, for two reasons:
   1. it is not a numeric token — the template's .font-monospace utility also
      dresses plain text (the /Home/Pricing plan names "Zdarma" and "Live
      Display + Pro"), which became mono headings;
   2. re-checked selector by selector on screenshots the same day, Azeret lost
      every single figure it was applied to. Czech N0 formatting puts a narrow
      no-break space in the thousands, and a monospaced cell blows it up to a
      full character ("2  990  Kč"); the strikethrough on .crossed-price then
      runs through those gaps. And Azeret ships 400/500 only, so every figure
      the views set in bold (.price 800, .solar-delivery-price 600, .total 600,
      .count-number 700) was either faux-bolded or had to be capped at 500 —
      i.e. the sale price was made *lighter* than the page intends.
   Numbers therefore stay in the template's face; `font-variant-numeric:
   tabular-nums` on body is what remains of "every number is an instrument
   reading". Evidence: .playwright-mcp/skinlight2/ab-*-{mono,nomono}.png.
   ---------------------------------------------------------------------------

   The rules of docs/public-web.md §4 apply in full:
   - the template's hierarchy is FILL-based. Every tinted surface below keeps
     (or slightly exceeds) the template's own tonal step against the page —
     measured: component 2b3541 / page 12181f = 1.44:1 vs original
     2d353c / 161a1d = 1.41:1. No fills are replaced with hairlines, no
     shadows are added, no contrast step is removed.
   - the sales page keeps its green price, green buy CTA and red "Akční cena"
     badge: this file sets NO color on any of them (the only color it sets
     anywhere is the selection highlight, which is interactive blue by §3).
   ========================================================================== */

/* ---- tokens ---------------------------------------------------------------
   The template reads these everywhere (body, .footer via --bs-light,
   .header-default via --bs-component-bg, form controls, the mobile nav sheet
   via rgba(var(--bs-component-bg-rgb),.95) ...) — remapping them here is the
   whole point of the token pass. The two font tokens are NOT remapped. */

:root {
    /* one radius scale: .5rem controls, 1rem cards — the family order.css
       already lives in (.5rem buttons, 1rem cards), so template components
       stop disagreeing with the sales/order pages */
    --bs-border-radius: .5rem;
    --bs-border-radius-sm: .375rem;
    --bs-border-radius-lg: .75rem;
    --bs-border-radius-xl: 1rem;
}

/* the cold surface tint. Same lightness ladder as the template's neutrals,
   hue pulled toward the landing's night-sky blue. Contrast steps measured
   against the originals (docs/public-web.md §4): every panel-vs-page delta
   is preserved or a touch stronger. */
[data-bs-theme=dark] {
    --bs-body-bg: #12181f;                          /* was #161a1d (1.41:1 to panel → now 1.44:1) */
    --bs-body-bg-rgb: 18, 24, 31;
    --bs-light: #1e2530;                            /* was #20252a — .footer, .bg-light (1.13:1 → 1.16:1) */
    --bs-light-rgb: 30, 37, 48;
    --bs-component-bg: #2b3541;                     /* was #2d353c — header-default, cards, inputs */
    --bs-component-bg-rgb: 43, 53, 65;
    --bs-secondary-bg: #2b3541;
    --bs-secondary-bg-rgb: 43, 53, 65;
    --bs-tertiary-bg: #242c37;                      /* was #272d33 (1.26:1 → 1.27:1) */
    --bs-tertiary-bg-rgb: 36, 44, 55;
    --bs-app-header-bg: #232c37;                    /* was #262d33 */
    --bs-component-border-color: #47525e;           /* was #495057 */
    --bs-component-border-color-rgb: 71, 82, 94;
    --bs-border-color: #69737f;                     /* was #6c757d */
    --bs-component-dropdown-bg: #414c59;            /* was #495057 — footer language switcher */
    --bs-component-dropdown-hover-bg: #626e7b;      /* was #6c757d */
    --bs-component-dropdown-border-color: #626e7b;
}

/* ---- typography ------------------------------------------------------------
   All that is left of "every number is an instrument reading": tabular figures
   in the template's own face. No font-family is set anywhere in this file. */

body {
    font-variant-numeric: tabular-nums;
}

/* selection is an interaction → the one interactive blue (§3) */
::selection {
    background: #348fe2;
    color: #fff;
}

/* ---- radii (components that hardcode theirs) ------------------------------ */

.btn { --bs-btn-border-radius: .5rem; }             /* .rounded-pill CTAs keep their 50rem */
.card { --bs-card-border-radius: 1rem; --bs-card-inner-border-radius: calc(1rem - 1px); }
.alert { --bs-alert-border-radius: .5rem; }
.dropdown-menu { --bs-dropdown-border-radius: .5rem; }
.form-control, .form-select { border-radius: .5rem; }

/* ---- docking the shared mobile menu ---------------------------------------
   The menu itself is _PublicMobileNav + public-nav.css and is not styled here;
   this only puts it where the landing puts it. The template's own toggler is
   gone (it slideToggled .header-nav from the far right of the bar, beside the
   CTA — the inconsistency the shared component removes).

   1160px, not the template's 991.98: the landing's HUD row has to fold there
   (home.css carries the measurements behind that number), and a burger that
   appears at a different width per page would be the same inconsistency in a
   new place. Between 992 and 1160 the template's own nav row is still
   display:flex, so it must be told to go. */

@media (max-width: 1160px) {
    .header .header-nav { display: none; }

    /* .header-logo carries `margin-right: auto`, which would fling the button
       to the far side of the bar — exactly where it used to sit. Hand the auto
       margin to the button instead so the pair stays left, together. */
    .header .header-logo { margin-right: 0; }

    /* 20px where the landing uses 12: this logo box ends flush with the
       wordmark AND carries the BETA badge on that same edge, so the two need
       different numbers to read as the same distance. Anything tighter and the
       button's focus ring lands on the badge. */
    .header .pnav-burger {
        align-self: center;
        margin-left: 20px;
        margin-right: auto;
    }

    /* the logo rides above the open sheet next to the burger, so the header
       reads "[logo] [X]" here too. The CTA stays under it, like .header-nav. */
    .header .header-logo { position: relative; z-index: 2; }
}

/* small phones: the CTA already sat on top of the wordmark. Same cure as the
   landing ≤720px ("mark only — keep it quiet"): drop the wordmark bitmap,
   keep the mark. */
@media (max-width: 575.98px) {
    .header .header-logo .logo-link-text,
    .header .header-logo .logo-link small { display: none; }
    .header .header-btn .btn { white-space: nowrap; }
}

/* ============================================================================
   FAQ na /Home/Solax (2026-08-09)
   ----------------------------------------------------------------------------
   Postavené na <details>/<summary>, ne na Bootstrap accordionu: funguje bez JS,
   ovládá se klávesnicí zadarmo a obsah je v DOM i zavřený, takže ho vyhledávač
   i asistent přečtou. Tyhle rules jen schovají výchozí trojúhelník a dají
   položkám plochu - žádná nová barva, všechno jede z tokenů skinu.
   ========================================================================== */

.pfaq-item {
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: var(--bs-border-radius, .5rem);
    background: rgba(255, 255, 255, .04);
    margin-bottom: .5rem;
}

.pfaq-q {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .875rem 1.125rem;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    list-style: none;      /* Firefox */
}

/* WebKit kreslí marker vlastní pseudotřídou, kterou list-style neřeší */
.pfaq-q::-webkit-details-marker { display: none; }

/* Vlastní šipka. Píše se přes ::before, aby zůstala na prvním řádku i když se
   otázka zalomí na dva - u marketu s dlouhými českými otázkami běžný případ. */
.pfaq-q::before {
    content: "+";
    flex: 0 0 auto;
    width: 1rem;
    font-weight: 400;
    line-height: 1.4;
    opacity: .6;
}

.pfaq-item[open] > .pfaq-q::before { content: "\2212"; }   /* − */

.pfaq-q:hover { background: rgba(255, 255, 255, .06); }

.pfaq-a {
    padding: 0 1.125rem 1rem 2.875rem;
    color: rgba(255, 255, 255, .78);
    line-height: 1.6;
}