/* Temporary Map Styling */
/*  */
.single-gd_place #distributors-sidebar {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.single-gd_place .geodir-page-title {
    font-family: 'Exo', sans-serif;
    font-weight:bold;
    margin:0;
}

.post-type-archive-gd_place main .uk-container,
.single-gd_place  main .uk-container {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
}

.post-type-archive-gd_place nav.uk-margin-medium-bottom,
.single-gd_place nav.uk-margin-medium-bottom {
    display: none;
}

.post-type-archive-gd_place h1.uk-article-title,
.single-gd_place h1.uk-article-title,
.single-gd_place .geodir_post_meta_title {
    display: none;
}

.post-type-archive-gd_place main#tm-main,
.single-gd_place main#tm-main {
    padding: 0;
}

.post-type-archive-gd_place main .uk-margin-medium,
.single-gd_place main .uk-margin-medium {
    margin: 0!important;
}

.post-type-archive-gd_place .wp-block-columns,
.single-gd_place .wp-block-columns {
    gap: 0;
    margin:0;
}

.post-type-archive-gd_place #distributors-sidebar,
.single-gd_place #distributors-sidebar {
    position:unset!important;
    max-height: 800px;
    overflow-y: scroll;
    scrollbar-color: #303030 black;
}

.post-type-archive-gd_place .card.h-100.p-0.m-0.mw-100{
    background: none;
    border: none;
    margin-top:1rem;
    padding-top:1rem;
    border-top: 1px solid rgb(255 255 255 / 10%)
}

.post-type-archive-gd_place a.gd-badge.btn.btn-link,
.single-gd_place a.gd-badge.btn.btn-link {
    padding: 0;
    text-decoration: none;
}

.single-gd_place .custom-address-wrapper {
    gap:0;
}

/*  */

#offcanvas-flip .gd-search-field-search-filters {
    display: none;
}
#offcanvas-flip h3 {
    margin: 1rem 0;
}
.dealer-contact input.ninja-forms-field[type="submit"] {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.dealer-location p,
.dealer-location h4 {
    margin: 0;
}

.dealer-search {
    margin-top:1rem;
    margin-bottom:1rem;
    padding-top:1rem;
    border-top: 1px solid rgb(255 255 255 / 10%)
}
.dealer-location .btn {
    padding:0;
}
.autocomplete-container {
    position: absolute;
    z-index: 1000;
    width: 100%;
    background: black;
    max-height: 200px;
    overflow-y: scroll;
    scrollbar-color: #303030 black;
}
.suggestion-item {
    padding: 10px;
    cursor: pointer;
    border-bottom: 1px solid #262626;
}
.suggestion-item:last-child {
    border-bottom: none;
}
.suggestion-item:hover {
    background-color: #262626;
}
#autocomplete-suggestions ul {
    margin:0;
    padding:0;
    list-style:none;
}
li.suggestion-item:focus {
    background: #262626!important;
}

/*  */

.geodir-listing-posts {
    max-width: 100%;
    margin: 0 auto!important
}
.geodir-entry-title a {
    font-weight:bold!important;
}
h2.geodir-entry-title.h5.text-white {
	margin-bottom:0;
}

.geodir-bubble_desc h6 {
    font-size: 1rem;
}

/*  */

.dealer-category {
    margin-top:1rem;
    /* padding:1rem; */
}
.dealer-actions {
    border-top: 1px solid rgba(0,0,0,0.2);
    gap:10px;
    /* The rule is a divider, not a frame. With no padding the pill started 1px under it and the two
       read as one welded object. 24px below balances the 20px margin above, so the line sits clear
       of both the category list and the button. */
    padding-top: 24px;
}
.dealer-category form label {
    gap: 5px;
    display:flex;
    align-items:center;
}

/* Category checkbox — yellow box, dark tick, matching the downloads, products, blog and search
   filters. UIkit's .uk-checkbox paints a tick as an SVG background-image, so its colour cannot be
   set in CSS at all; the box has to be redrawn. Unchecked is a hairline on transparent rather than
   the white-on-white default, because this panel is dark — same treatment as the products drawer.

   Every rule is prefixed with #dealer-sidebar on purpose. This panel is a .uk-tile-primary, so
   UIkit's inverse-context rule `.uk-card-primary.uk-card-body .uk-checkbox:checked` (0,4,0) applies
   and forces the box back to white — it outranks a bare `.dealer-category-checkbox:checked` (0,2,0),
   which is why the first attempt at this rendered white-with-a-dark-tick and looked almost right.
   The id makes these (1,2,0) and settles it. */
#dealer-sidebar .dealer-category-checkbox {
    appearance: none;
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    margin: 0;
    flex-shrink: 0;
    position: relative;
    border: 1.5px solid #B9BABC;
    border-radius: 3px;
    background: #fff;
    background-image: none;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
#dealer-sidebar .dealer-category-checkbox:hover { border-color: #161616; }
#dealer-sidebar .dealer-category-checkbox:checked {
    background: #FED208;
    background-image: none;
    border-color: #FED208;
}
#dealer-sidebar .dealer-category-checkbox:checked::after {
    content: '';
    position: absolute;
    left: 4px;
    top: 0.5px;
    width: 4px;
    height: 8px;
    border: solid #161616;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
#dealer-sidebar .dealer-category-checkbox:focus-visible {
    outline: 2px solid #161616;
    outline-offset: 2px;
}
.location-item {
    margin-bottom:.5rem;
    padding-bottom:.5rem;
    border-bottom:1px solid rgba(0,0,0,0.2);
}
.location-category.uk-badge {
    background:#f2f2f2;
    color:rgba(0,0,0,0.75);
}
/* #locations {
    padding:1.5rem 1.5rem 0 1.5rem;
} */
/* #pagination {
    padding: 0 1.5rem 1rem 1.5rem;
} */
a.pagination-link {
    padding: 10px;
}
.pagination-nav {
    display: flex;
    gap: 1rem;
}
#dealer-map {
    width:100%;
    position:relative;
}
#zip-search-form label {
    margin-bottom:10px;
}
/* 
#sidebar-container {
    max-width:450px;
    flex: 1;
    background: black;
}
#dealer-sidebar {
    width: 100%;
    padding: 1.5rem;
    color: white;
    /* display: flex;
    flex-direction: column;
    justify-content: center; */
} */

/* ---- Light panel -------------------------------------------------------------------------
   The sidebar column is `tile-muted` (see _migration/dealers/apply-sidebar-tile.php), so
   everything below that was written for the old #212C34 slate has to invert. UIkit's own
   inverse-context rules stop applying with that class gone, which is why the search input and
   the selects need nothing here — they fall back to their normal light treatment. */
.dealer-heading {
    color: #161616;
}

/* #F2F2F2 rather than tile-muted's own #F8F8F8, to sit on the same light grey the download
   sections and filter rules use. */
#dealer-sidebar .uk-tile-muted,
#dealer-sidebar.uk-tile-muted { background: #F2F2F2; }
.dealer-heading + p,
#dealer-sidebar .uk-text-lead { color: #58595B; }

.filter-toggle {
    background:transparent;
    padding-right:0!important;
}

main .uk-container, #tm-main {
    max-width: unset;
    margin: 0;
    padding: 0;
}

.dealer-search .uk-search {
    width:unset;
    flex:1;
}

ul.uk-subnav li {
    line-height: 1;
}
/* NEAR ME — the house primary button.
   Measured wrong on five counts against the spec: #FEDD00 (the theme's older yellow) instead of
   #FED208, WHITE label on yellow instead of #161616, a 2px corner instead of a pill, Roboto
   Condensed instead of Roboto, and weight 500 instead of 700. That is LynTec's button language,
   carried through the port.

   The spec is restated here with literals rather than aliased onto kf-about.css's .kf-btn, which is
   how the other stacks do it, because kf-about.css is NOT enqueued on this archive — and even if it
   were, its --kf-* tokens are scoped to `.kf-sec`, which this sidebar (a .uk-tile-primary) is not.
   An alias would silently resolve to nothing here. !important throughout to beat .uk-button-primary. */
button.near-me {
    min-height: 52px !important;
    padding: 0 30px !important;
    border-radius: 30px !important;
    background: #FED208 !important;
    color: #161616 !important;
    border: 1px solid #FED208 !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: normal !important;
    text-transform: uppercase !important;
    transition: background .15s ease, border-color .15s ease !important;
}
button.near-me:hover {
    background: #D9B201 !important;
    border-color: #D9B201 !important;
    color: #161616 !important;
}
button.near-me:focus-visible {
    outline: 2px solid #161616 !important;
    outline-offset: 2px !important;
}
/* The icon inherits the label colour — it was white against the yellow too. */
button.near-me .fa { color: inherit !important; }

/* Reset is the tertiary action beside it: ghost-on-dark, same type, no fill. Roboto 700 to match,
   rather than the ported Roboto Condensed 500. */
button.reset-filters {
    min-height: 44px !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: normal !important;
    text-transform: uppercase !important;
    color: #161616 !important;
}
/* Not the yellow hover it had on the slate panel — #FED208 text on #F2F2F2 is about 1.5:1. */
button.reset-filters:hover:not(:disabled) { color: #58595B !important; text-decoration: underline !important; }

/* The mobile "Filter Results" toggle is the same primary button and had the same three faults —
   #FEDD00 fill, white label, square corners. It sits full-width in its wrapper, so only the
   geometry inside the pill differs from .near-me. */
button.dealer-filter-toggle {
    min-height: 52px !important;
    padding: 0 30px !important;
    border-radius: 30px !important;
    background: #FED208 !important;
    color: #161616 !important;
    border: 1px solid #FED208 !important;
    font-family: 'Roboto', system-ui, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: normal !important;
    text-transform: uppercase !important;
}
button.dealer-filter-toggle:hover {
    background: #D9B201 !important;
    border-color: #D9B201 !important;
    color: #161616 !important;
}

/* button.reset-filters {
    color: white;
    border-color: white;
}

button.reset-filters:disabled {
    color: white;
    border-color: white;
    background:none;
    opacity:0.3
} */

/* Map popup styling */
.gm-style-iw-ch {
    display: none;
}

.gm-style-iw-chr {
    position: absolute;
    right: 10px;
}
.page-template-page-map .geodir-map-canvas .gm-style .gm-style-iw-d {
    max-height: unset!important;
    overflow: auto!important;
}
/*  */




/* Mobile drawer for filters */

@media(max-width:959px) {
    .dealer-filter-toggle-wrap {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 1rem;
        background: rgba(0, 0, 0, 0.9);
        z-index: 1200;
    }

    body {
        padding-bottom: 90px;
    }

    /* #05030f was LynTec's near-black navy. The drawer holds the same controls as the desktop
       panel, so it takes the same light ground — otherwise the checkboxes and inputs styled above
       land on the wrong background at exactly the width where the drawer takes over. */
    #dealer-filter-offcanvas .uk-offcanvas-bar {
        width: 100%;
        padding: 2rem 1.5rem!important;
        background: #F2F2F2;
        color: #161616;
    }

    #dealer-filter-offcanvas .uk-offcanvas-close {
        color: #161616;
    }
}

@media(min-width:960px) {
    .dealer-filter-toggle-wrap {
        display: none;
    }

    #dealer-filter-offcanvas {
        position: static;
        display: block !important;
        visibility: visible !important;
        z-index: auto;
    }

    #dealer-filter-offcanvas .uk-offcanvas-bar {
        position: static;
        transform: none;
        width: auto;
        background: transparent;
        padding: 0;
    }
}
#dealer-category-filter label.uk-grid-margin {
    margin-top: 0.25rem;
}
#dealer-category-filter label.uk-grid-margin.uk-first-column {
    margin-top: 0.25rem;
}
.reset-filters {
    border-radius: 500px !important;
}

.pagination-meta, .pagination-nav {
    /* margin-bottom: 1rem; */
}
.dealer-search .uk-search-medium input {
    font-size: 1rem;
}
/* Loading overlay */
#loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}

#loading-overlay .loading-message {
    color: white;
    font-size: 1.25rem;
}

.locations-loading {
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #666;
}

.locations-loading .loading-message {
    display: flex;
    align-items: center;
    font-size: 1rem;
}

.locations-loading .loading-message [uk-spinner] {
    margin-right: 0.5rem;
}
#header #nav ul.sub_menu {
    margin-top:0;
}
.location-phone {
    white-space: nowrap!important;
}

/* ---- Map bubble --------------------------------------------------------------------------
   Was a black box with muted grey text — the address and phone sat at roughly 3:1 on it and the
   category badge was a pale UIkit pill. Light card, ink text, yellow badge instead, so it matches
   the panel and the results table it sits between. Square corners: per the house spec only buttons,
   badges and chips become pills; cards and images stay at 0. */
.geodir-map-canvas .gm-style .gm-style-iw-c {
    /* Rounded, unlike the site's content cards, which are square. This is a floating tooltip over
       the map rather than a card in the layout — it reads as an object hovering above the page, and
       the corner is what says so. */
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 6px 24px rgba(0, 0, 0, .18);
    /* Google sets overflow on this node; without it the corners clip square again. */
    overflow: hidden !important;
}
/* Google draws a dotted focus ring on the bubble container that reads as a dashed border. */
.geodir-map-canvas .gm-style .gm-style-iw-c:focus,
.geodir-map-canvas .gm-style .gm-style-iw-c:focus-visible,
.geodir-map-canvas .gm-style .gm-style-iw:focus { outline: none; }
.gm-style .gm-style-iw-tc::after {
    background: #fff;
}
.gm-style .gm-style-iw {
    overflow: hidden !important;
}
.gm-style .gm-style-iw div {
    overflow: hidden !important;
}
.geodir-map-bubble {
    overflow: hidden !important;
}
.geodir-bubble-meta-side ul {
    list-style: none;
    padding: 0!important;
}
.geodir-map-canvas .gm-style .gm-style-iw-c {
    padding:15px!important;
}
.physical-locations td.location-name {
    padding-left:0;
}
.physical-locations table thead tr th:first-of-type {
    padding-left: 0;
}
.physical-locations td.location-name a {
    text-decoration: none;
}

/* Results-table links.
   These carried no colour of their own, so they inherited the site's global link colour — the
   Kino Flo yellow. That works on the dark grounds it was chosen for, but this table sits on white,
   where #FED208 measures about 1.4:1 against it: the phone numbers and "Visit Website" were
   effectively unreadable. Ink plus an underline instead, which is 18.9:1 and still obviously a
   link. The dealer name keeps its underline suppressed above — it is the row's heading, and the
   weight already marks it. */
.physical-locations a,
.physical-locations td.location-number a,
.physical-locations td.location-website a {
    color: #161616;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}
.physical-locations a:hover,
.physical-locations td.location-number a:hover,
.physical-locations td.location-website a:hover {
    color: #58595B;
    text-decoration: underline;
}
.physical-locations td.location-name a { color: #161616; }
.physical-locations td.location-name a:hover { color: #58595B; }

/* ==========================================================================
   Light panel — undoing UIkit's inverse context
   --------------------------------------------------------------------------
   Switching the column to `tile-muted` gives the panel its light ground, but it does NOT make the
   text dark. The sidebar's contents live inside `#dealer-filter-offcanvas > .uk-offcanvas-bar`,
   which is in the DOM at every width (on desktop `#sidebar-container.uk-display-initial` simply
   displays it in place) — and `.uk-offcanvas-bar` is one of UIkit's inverse contexts. So rules like
   `.uk-card-primary.uk-card-body .uk-h1` keep painting the heading, both labels, the checkbox
   captions, the placeholder and the search icon white, on a light grey panel.

   Fixing this in the mobile media query only, which is where the drawer's own colours live, leaves
   desktop untouched — that was the first attempt and the heading stayed at 1.12:1.

   Everything here is prefixed with an id so it carries (1,x,0) and beats UIkit's (0,3,0) inverse
   selectors without !important.
   ========================================================================== */
#dealer-sidebar,
#dealer-sidebar .uk-offcanvas-bar,
#dealer-sidebar .dealer-heading,
#dealer-sidebar h1, #dealer-sidebar h2, #dealer-sidebar h3,
#dealer-sidebar .uk-h1, #dealer-sidebar .uk-h2, #dealer-sidebar .uk-h3,
#dealer-sidebar label,
#dealer-sidebar legend,
#dealer-sidebar .dealer-category form label,
#dealer-filter-offcanvas .dealer-heading,
#dealer-filter-offcanvas label {
    color: #161616;
}

/* Supporting copy and the field labels sit a step back from the headline. */
#dealer-sidebar .dealer-filter-header p,
#dealer-sidebar .uk-text-lead,
#dealer-sidebar .dealer-location > label,
#dealer-sidebar .dealer-category > label {
    color: #58595B;
}

/* Text inputs and selects: white field on the grey panel so the control reads as enterable. */
#dealer-sidebar .uk-search-input,
#dealer-sidebar .uk-select,
#dealer-sidebar #dealer-search,
#dealer-sidebar #dealer-country,
#dealer-sidebar #dealer-region,
#dealer-sidebar #dealer-city {
    background-color: #fff;
    border: 1px solid #D6D6D6;
    color: #161616;
}
#dealer-sidebar .uk-search-input::placeholder,
#dealer-sidebar #dealer-search::placeholder { color: #8D9090; opacity: 1; }
#dealer-sidebar .uk-search-icon,
#dealer-sidebar .uk-search-icon svg { color: #58595B; }

#dealer-sidebar .uk-search-input:focus,
#dealer-sidebar .uk-select:focus {
    border-color: #161616;
    outline: none;
}

/* Dividers were hairlines chosen to show on slate. */
#dealer-sidebar .uk-border-top,
#dealer-sidebar .dealer-actions,
#dealer-sidebar hr { border-color: #D6D6D6; }

/* Disabled controls. The old rule was `opacity:.3; background:white` — against the slate that
   rendered as the solid grey blocks sitting where Region and City should be, which read as broken
   rather than disabled. On a light panel it would wash out to nothing instead. Both are wrong;
   this states a real disabled style: still legible, clearly inert. */
#dealer-sidebar .dealer-category-checkbox:disabled,
#dealer-sidebar #dealer-search:disabled,
#dealer-sidebar #dealer-city:disabled,
#dealer-sidebar #dealer-region:disabled,
#dealer-sidebar #dealer-country:disabled,
#dealer-filter-offcanvas #dealer-city:disabled,
#dealer-filter-offcanvas #dealer-region:disabled {
    opacity: 1;
    background: #E9E9E9;
    border-color: #D6D6D6;
    color: #8D9090;
    cursor: not-allowed;
}


/* ==========================================================================
   Map bubble contents
   ========================================================================== */
.gd-bubble .geodir-bubble_desc,
.gd-bubble .geodir-bubble-meta-side,
.gd-bubble .geodir-bubble-meta-side li { color: #161616; }

.gd-bubble .geodir-bubble_desc h6 {
    font-family: 'Roboto Condensed', 'Roboto', system-ui, sans-serif;
    font-size: 17px;
    line-height: 22px;
    font-weight: 700;
    color: #161616;
    text-transform: none;
}

.gd-bubble .geodir-bubble-meta-side li {
    font-family: 'Roboto', system-ui, sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: #58595B;
}

/* The uk-icon glyphs were sized to the old dark bubble and read as loud as the text on white. */
.gd-bubble .geodir-bubble-meta-side [uk-icon],
.gd-bubble .geodir-bubble-meta-side .uk-icon { color: #8D9090; margin-right: 6px; }

/* Category badge — the one piece of brand colour in the bubble. Pill, per the house spec. */
.gd-bubble .kf-dealer-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    background: #FED208;
    color: #161616;
    font-family: 'Roboto', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    line-height: 1.4;
}

/* Same reasoning as the results table: the site's global link colour is the yellow, which is about
   1.4:1 on this white card. */
.gd-bubble a {
    color: #161616;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.gd-bubble a:hover { color: #58595B; }

/* Close button was white-on-black. */
.geodir-map-canvas .gm-style .gm-style-iw-chr button span,
.geodir-map-canvas .gm-style .gm-style-iw button.gm-ui-hover-effect > span {
    background-color: #58595B !important;
}