/* CellphoneRepair (cellphonerepair) — 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/cellphonerepair.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. @font-face for Avenir is loaded by the CPR shell override / storefront SCSS (Avenir-Roman
 * = 400, Avenir-Heavy = 500); this file only references the family.
 */
.locator-theme-root {
    /* Brand — cellphonerepair.scss red / DB color_primary (scripts/store_locator/cpr_theme.py). */
    --locator-color-primary: #dc282e;
    --locator-color-secondary: #dc282e;
    --locator-color-accent: #f04d23;

    /* Fonts — Avenir for body and headings (cellphonerepair.scss). */
    --locator-font-family: "Avenir", sans-serif;
    --locator-font-family-heading: "Avenir", sans-serif;

    --locator-color-sidebar-header-background: #f3f2f2;
    --locator-color-sidebar-result-background: #f3f2f2;

    --locator-text-sidebar-title: 26px;
    --locator-font-weight-sidebar-title: 400;

    /* Results count ("N stores"): muted grey, 16px, bold. */
    --locator-text-sidebar-results: 16px;
    --locator-font-weight-sidebar-results: 700;
    --locator-color-sidebar-results: #6a6a6a;

    /* Card eyebrow + distance: muted grey, 12px. */
    --locator-color-card-eyebrow: #6a6a6a;
    --locator-text-card-eyebrow: 12px;
    --locator-color-card-distance: #6a6a6a;
    --locator-text-card-distance: 12px;

    /* Card title: 16px, heavy, 22px line-height (component default). */
    --locator-text-card-title: 16px;
    --locator-font-weight-card-title: 800;

    /* Detail lines (hours / address / phone): dark grey, 14px. */
    --locator-color-card-detail: #262626;
    --locator-text-card-detail: 14px;

    /* Open-hours line: status label + time text both dark grey, bold. */
    --locator-color-card-hours-label: #262626;
    --locator-font-weight-card-hours-label: 700;
    --locator-color-card-hours-value: #262626;
    --locator-font-weight-card-hours-value: 700;

    /* Action buttons — outlined pills: white fill, dark #2e2f33 border + #262626 label (icon inherits
       the label), 38px tall, 60px corner radius. Non-featured buttons (Call / Directions / Info) sit
       in a single row of 3, matching the legacy card; Book Repair is the featured button below. */
    --locator-actions-grid-columns: 3;
    --locator-actions-button-height: 38px;
    --locator-space-button-y: 0;
    --locator-color-button-border: #2e2f33;
    --locator-color-button-text: #262626;
    --locator-radius-button-card: 60px;

    /* Featured "Book Repair": solid red pill, white label, 46px tall, 60px corner radius. */
    --locator-actions-featured-height: 46px;
    --locator-radius-featured: 60px;
    --locator-color-featured-background: #e63434;
    --locator-color-featured-text: #ffffff;

    /* Location card outline: grey-blue border (cellphonerepair.scss $gray-blue). */
    --locator-color-card-border: #b9bdcb;

    /* Active/selected card + map pin popover: dark surface, light text (cellphonerepair.scss
       $dark-gray). Flips the whole card — text, and the outline action buttons into ghost buttons. */
    --locator-color-card-active-background: #2d2d3b;
    --locator-color-card-active-text: #fcfcfc;

    /* No inset shadow under the sidebar header (the default look). */
    --locator-shadow-sidebar-header: none;

    /* pagination overrides */
    --locator-radius-pagination-button: 12px;
    --locator-color-pagination-button-selected: #262626;

    /* Map overrides */
    --locator-line-height-map-popover: 20px;
    --locator-space-map-popover-status: 8px 0px;
}
