/* ============================================================================
   GetPassed - Public pages redesign (v1): business profile + search results
   Applies the homepage design language. Scoped to .business and
   .search-results-page. !important beats the legacy rules in custom.css.
   ============================================================================ */

:root {
    --gp-ink: #0f172a;
    --gp-body: #475569;
    --gp-muted: #64748b;
    --gp-brand: #ff6b2c;
    --gp-brand-600: #e85a1c;
    --gp-muted-bg: #f1f5f9;
    --gp-border: #e2e8f0;
    --gp-radius: 14px;
    --gp-radius-pill: 999px;
    --gp-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
    --gp-shadow-md: 0 12px 30px rgba(15, 23, 42, .10);
    --gp-font-head: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --gp-font-body: 'Open Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ---------- page shells ---------- */
div.business {
    background-color: var(--gp-muted-bg) !important;
    font-family: var(--gp-font-body) !important;
    color: var(--gp-ink) !important;
}

div.search-results-page {
    font-family: var(--gp-font-body) !important;
    color: var(--gp-ink) !important;
}

div.business h1,
div.business h2,
div.business h3,
div.business .title,
div.business .name,
div.search-results-page h1,
div.search-results-page h2,
div.search-results-page .title,
div.search-results-page .search-item .name {
    font-family: var(--gp-font-head) !important;
    color: var(--gp-ink) !important;
}

/* ---------- cards ---------- */
div.business .info-block,
div.search-results-page .info-block {
    background: #fff !important;
    border: 1px solid var(--gp-border) !important;
    border-radius: var(--gp-radius) !important;
    box-shadow: var(--gp-shadow-sm) !important;
}

/* ---------- buttons ---------- */
div.business .btn,
div.search-results-page .btn {
    border-radius: var(--gp-radius-pill) !important;
    font-family: var(--gp-font-head) !important;
    font-weight: 700 !important;
    letter-spacing: .03em;
    box-shadow: none !important;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

div.business .btn-three,
div.search-results-page .btn-three,
div.search-results-page .btn-more {
    background-color: var(--gp-brand) !important;
    color: #20140a !important;
    border: 0 !important;
}

    div.business .btn-three:hover,
    div.search-results-page .btn-three:hover,
    div.search-results-page .btn-more:hover {
        background-color: var(--gp-brand-600) !important;
        color: #20140a !important;
    }

div.business .btn-six,
div.search-results-page .btn-six {
    background-color: var(--gp-ink) !important;
    color: #fff !important;
    border: 0 !important;
}

    div.business .btn-six:hover,
    div.search-results-page .btn-six:hover {
        background-color: #1e293b !important;
        color: #fff !important;
    }

div.business .btn-seven {
    background: #fff !important;
    color: var(--gp-ink) !important;
    border: 1px solid var(--gp-border) !important;
}

    div.business .btn-seven:hover,
    div.business .btn-seven:focus {
        border-color: var(--gp-ink) !important;
        color: var(--gp-ink) !important;
    }

div.search-results-page .btn-five {
    border-radius: var(--gp-radius-pill) !important;
}

/* MORE arrow is a sprite - force it dark to match the MORE text */
div.search-results-page .btn-more i {
    filter: brightness(0) saturate(100%) !important;
}

/* ============================ BUSINESS PROFILE ============================ */
/* name / hero card */
div.business .name-info .name,
div.business .name-info h1.name {
    font-weight: 700 !important;
    letter-spacing: -.01em;
}

div.business .name-info .address {
    color: var(--gp-muted) !important;
}

/* breadcrumbs */
div.business .navigation-urls .navigation-url,
div.business .navigation-urls .navigation-url a {
    color: var(--gp-muted) !important;
}

    div.business .navigation-urls .navigation-url a:hover {
        color: var(--gp-brand) !important;
    }

/* section titles */
div.business .info-block .title,
div.business .reviews-info .title,
div.business .services-info .title {
    font-weight: 600 !important;
}

/* reviews */
div.business .review {
    background: #fff !important;
    border: 1px solid var(--gp-border) !important;
    border-radius: var(--gp-radius) !important;
    box-shadow: var(--gp-shadow-sm) !important;
}

div.business .review .review-text {
    color: var(--gp-body) !important;
}

/* links - darker orange for readable contrast on white */
div.business a {
    color: #c2410c !important;
}

    div.business a.btn,
    div.business .navigation-urls a,
    div.business .name-info a {
        color: inherit !important;
    }

/* ---------- form controls ---------- */
div.business .form-control,
div.search-results-page .form-control {
    border-radius: var(--gp-radius-pill) !important;
}

/* ============================ SEARCH RESULTS ============================ */
/* category filter chips - keep the original colours, just round them */
div.search-results-page .category-filter {
    border-radius: var(--gp-radius-pill) !important;
}

/* filter pills */
div.search-results-page .btn-filter {
    border-radius: var(--gp-radius-pill) !important;
}

/* result cards */
div.search-results-page .search-item {
    background: #fff !important;
    border: 1px solid var(--gp-border) !important;
    border-radius: var(--gp-radius) !important;
    box-shadow: var(--gp-shadow-sm) !important;
    transition: box-shadow .2s ease, border-color .2s ease;
}

    div.search-results-page .search-item:hover {
        box-shadow: var(--gp-shadow-md) !important;
        border-color: var(--gp-brand) !important;
    }

    div.search-results-page .search-item .last-review {
        color: var(--gp-body) !important;
    }

    div.search-results-page .search-item .address1 {
        color: var(--gp-ink) !important;
    }

    div.search-results-page .search-item .address2,
    div.search-results-page .search-item .distance {
        color: var(--gp-muted) !important;
    }

/* within-results search + sort */
div.search-results-page .search-within .form-control {
    border-radius: var(--gp-radius-pill) !important;
}

div.search-results-page .btn-filter,
div.search-results-page .dropdown-toggle {
    font-family: var(--gp-font-head) !important;
}

/* ---------- header logo (public pages) ---------- */
/* The legacy header filled the brand/logo with cream (#f8f7ec) on hover, which
   looks like a yellow block against the white header. Keep the header background
   and use a subtle fade as the hover cue instead. */
.public-page-top .navbar.navbar-default.navbar-main .navbar-header a.navbar-brand {
    background-color: transparent;
    transition: opacity .2s ease;
}

    .public-page-top .navbar.navbar-default.navbar-main .navbar-header a.navbar-brand:hover,
    .public-page-top .navbar.navbar-default.navbar-main .navbar-header a.navbar-brand:focus {
        background-color: transparent;
        opacity: .72;
    }

/* ---------- focus visibility ---------- */
div.business a:focus-visible,
div.business button:focus-visible,
div.search-results-page a:focus-visible,
div.search-results-page button:focus-visible,
div.search-results-page .dropdown-toggle:focus-visible,
div.search-results-page .category-filter:focus-within {
    outline: 2px solid var(--gp-brand);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    div.business *,
    div.search-results-page * {
        transition: none !important;
        scroll-behavior: auto !important;
    }
}