/* Optimum (optimum) — new-locator visual parity with the legacy locator.
 *
 * Overrides the provider's :where(.locator-theme-root) token vars + the semantic type/spacing
 * fallbacks (see store_locator/frontend/styles/main.css KTD4). Values lifted from the legacy
 * sass/template_system/optimum.scss. Loaded on both paths via store_locator.theming; on the widget
 * this file is cloned into the shadow root by lib/mount.ts (href under /locator_themes/).
 *
 * px only. Brand color + radii and the white/grey→black action-button treatment come from the DB
 * LocatorTheme tokens (scripts/store_locator/optimum_theme.py); this file adds only the
 * CSS-reachable deltas. @font-face for ParagraphFont is loaded by the Optimum shell override; this
 * file only references the family. --locator-color-primary + --locator-font-family are also
 * declared here to satisfy the themed-file guard (store_locator/tests/test_theming.py).
 */
.locator-theme-root {
    /* Brand — DB color_primary (scripts/store_locator/optimum_theme.py). */
    --locator-color-primary: #f66608;
    --locator-color-muted: #6a6a6a;

    /* Body font: the Optimum brand face (optimum.scss $font-family-default). The @font-face is
       applied at the shell layer, not here. */
    --locator-font-family: "ParagraphFont", Arial, Helvetica, sans-serif;

    /* Sidebar search heading: 26px. */
    --locator-text-sidebar-title: 26px;
    --locator-color-locate-icon-stroke: var(--locator-color-primary);
    --locator-color-locate-icon-fill: var(--locator-color-primary);
    --locator-color-input-prefix: var(--locator-color-primary);
    --locator-font-weight-sidebar-title: 400;

    /* Card header */
    --locator-font-weight-card-title: 530;
    --locator-color-card-header-highlight-distance: var(--locator-color-muted);

    /* Logo/title row sits flush under the header. */
    --locator-space-card-media-row-top: 0;

    /* Action grid holds three buttons in one row (call, directions, appointment). */
    --locator-actions-grid-columns: 3;
    --locator-text-button: 12px; /* CTA text size */
    /* CTA labels use the link face (optimum.scss $font-family-link) rather than the body face. */
    --locator-font-family-button:
        "LinkFont", "ParagraphFont", Lato, Helvetica, Arial, sans-serif;
    --locator-font-weight-button: 530;
    --locator-text-button-icon: 24px;
    --locator-radius-button-card: 30px;
    --locator-radius-featured: 30px;

    /* Action buttons: icon stacked above the label; dark #262626 label with the Optimum-orange
       brand icon. Grid buttons keep their white fill from the DB button_* tokens
       (optimum_theme.py); the featured CTA is made to match (white fill, same dark label). */
    --locator-actions-button-direction: column;
    --locator-actions-button-gap: 4px;
    --locator-color-button-text: #262626;
    --locator-color-button-icon: var(--locator-color-primary);
    --locator-text-featured: 14px; /* larger than the 12px grid CTAs */
    --locator-color-featured-background: #ffffff;
    --locator-color-featured-text: #262626;

    /* Resting border for every button (grid + featured) is light grey, turning Optimum-orange on
       hover. The orange hover overrides the DB grid hover (color_button_border_hover: black). */
    --locator-color-button-border: #dbdbdb;
    --locator-color-button-border-hover: var(--locator-color-primary);
    --locator-color-featured-border: #dbdbdb;
    --locator-color-featured-border-hover: var(--locator-color-primary);

    /* Map Popover */
    --locator-line-height-map-popover: 20px;
}