/* ── LocalBiz Global Utility Classes ─────────────────────────────────
   Extracted from repeated inline styles across blade views.
   Link: <link rel="stylesheet" href="/css/localbiz.css">
─────────────────────────────────────────────────────────────────── */

/* ── Global Font ────────────────────────────────────── */
/* Poppins is a display face — built for headlines, not the small running
   text that fills a <body>. Every page loading this file had its body copy,
   inputs and buttons forced into it with !important, at whatever size the
   component happened to be, which is most of the site: 121 views extend
   layouts.app, which loads this file. Body text now runs in Inter, cut for
   small sizes; headings, the navbar brand and section titles keep Poppins
   explicitly, so nothing about the brand's headline voice changes — only
   the paragraphs, buttons and form fields read faster. */
body, .card, .btn, input, select, textarea {
    font-family: 'Inter', 'Noto Sans Devanagari', sans-serif !important;
}
h1, h2, h3, h4, h5, h6,
.navbar-brand, .sec-hd h2, .card-title, .biz-card-title {
    font-family: 'Poppins', 'Noto Sans Devanagari', sans-serif !important;
}

/* ── Gradient card placeholders ─────────────────────── */
.lb-img-placeholder {
    height: 140px;
    display: flex; align-items: center; justify-content: center;
    border-bottom: 1px solid rgba(0,0,0,.06);
    position: relative;
}
.lb-img-placeholder .lb-initial {
    width: 56px; height: 56px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem; font-weight: 700; color: #fff;
    letter-spacing: -1px;
}
/* Placeholder tiles.
   These were pastel: #bbf7d0 to #34d399 and seven like it. A listing card
   writes its name and category in white over this tile, and white on
   #bbf7d0 measures 1.3:1 -- the name of the business was the least legible
   thing on its own card. Every stop below is dark enough that white clears
   4.5:1 against the lightest point of the gradient (measured: 4.99 to 7.90).
   They are also a step quieter in saturation, so a wall of them reads as a
   directory rather than a paint chart, and the orange call to action stays
   the loudest thing on the page. */
.lb-grad-green  { background: linear-gradient(135deg,#2f7d5b,#14532d); }
.lb-grad-blue   { background: linear-gradient(135deg,#2b6cb0,#1a365d); }
.lb-grad-purple { background: linear-gradient(135deg,#6b46c1,#3c1e70); }
.lb-grad-orange { background: linear-gradient(135deg,#c2410c,#7c2d12); }
.lb-grad-pink   { background: linear-gradient(135deg,#be3e6d,#701a41); }
.lb-grad-teal   { background: linear-gradient(135deg,#0f766e,#134e4a); }
.lb-grad-red    { background: linear-gradient(135deg,#b91c1c,#7f1d1d); }
.lb-grad-indigo { background: linear-gradient(135deg,#4338ca,#26237a); }
/* The icon chip was a darker version of the tile it sat on, which on a dark
   tile is nearly invisible. Frosted glass instead: one rule, every hue. */
.lb-ic-green, .lb-ic-blue, .lb-ic-purple, .lb-ic-orange,
.lb-ic-pink, .lb-ic-teal, .lb-ic-red, .lb-ic-indigo {
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.28);
    backdrop-filter: blur(2px);
}

/* ── Card hover lift ────────────────────────────────── */
.lb-card-hover {
    transition: transform .2s ease, box-shadow .2s ease;
    border-radius: 14px !important;
    overflow: hidden;
    border: 1px solid #e2e8f0 !important;
    box-shadow: var(--shadow-sm)!important;
}
.lb-card-hover:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg)!important;
}

/* ── View CTA pill on cards ─────────────────────────── */
.lb-view-btn {
    display: inline-block; font-size:.75rem; font-weight: 600;
    color: #16a34a; border: 1.5px solid #86efac;
    padding: 3px 12px; border-radius:999px;
    text-decoration: none; transition: background .15s, color .15s;
}
.lb-view-btn:hover { background: #16a34a; color: #fff; border-color: #16a34a; }

/* ── Popular search tags (hero) ─────────────────────── */
.lb-popular-tag {
    display: inline-block; font-size:.75rem; font-weight: 500;
    background: rgba(255,255,255,.1); color: rgba(255,255,255,.85);
    border: 1px solid rgba(255,255,255,.2); border-radius:999px;
    padding: 3px 12px; cursor: pointer; transition: background .15s;
    text-decoration: none;
}
.lb-popular-tag:hover {
    background: rgba(255,255,255,.2); color: #fff;
}

/* ── Category chip redesign ─────────────────────────── */
.lb-cat-chip {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    padding: 8px 14px; border-radius:14px; cursor: pointer;
    border: 1.5px solid #e2e8f0; background: #fff;
    min-width: 72px; white-space: nowrap;
    transition: all .15s; font-size:.75rem; font-weight: 500; color: #475569;
}
.lb-cat-chip .lb-cat-icon {
    width: 36px; height: 36px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size:1.25rem; background: #f1f5f9;
}
.lb-cat-chip:hover { border-color: #93c5fd; background: #f0f9ff; color: #1d4ed8; }
.lb-cat-chip.active {
    border-color: #1d4ed8; background: #eff6ff; color: #1d4ed8; font-weight: 600;
}
.lb-cat-chip.active .lb-cat-icon { background: #dbeafe; }

/* ── Results bar sort ───────────────────────────────── */
.lb-sort-select {
    border: 1.5px solid #e2e8f0; border-radius:10px;
    padding: 5px 10px; font-size:.75rem; color: #374151;
    background: #fff; cursor: pointer; outline: none;
    font-family: 'Poppins', 'Noto Sans Devanagari', sans-serif;
}
.lb-sort-select:focus { border-color: #93c5fd; }

/* ── Zomato-style filter chips ──────────────────────── */
.zf-chip {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 6px 13px; border-radius:999px;
    border: 1.5px solid #e2e8f0; background: #fff;
    font-size:.75rem; font-weight: 600; color: #374151;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    transition: border-color .15s, background .15s, color .15s;
    user-select: none;
}
.zf-chip:hover { border-color: #94a3b8; color: #0f172a; text-decoration: none; }
.zf-chip-active { border-color: #1d4ed8 !important; background: #eff6ff !important; color: #1d4ed8 !important; }
.zf-chip-active-green { border-color: #16a34a !important; background: #f0fdf4 !important; color: #15803d !important; }
.zf-chip-select { padding-right: 8px; }
.zf-chip-select select { font-family: inherit; }
.zf-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.zf-filter-row {
    display: flex; align-items: center; gap: 8px;
    overflow-x: auto; flex-wrap: nowrap;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
}
.zf-filter-row::-webkit-scrollbar { display: none; }
.zf-filter-row .zf-chip { flex-shrink: 0; }

/* ── Role CTA sidebar cards ─────────────────────────── */
.lb-role-card {
    border-radius:14px !important; border: 1px solid #e2e8f0 !important;
    box-shadow: none !important; transition: transform .15s, box-shadow .15s;
}
.lb-role-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow)!important;
}
.lb-role-icon {
    width: 34px; height: 34px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size:1.125rem; flex-shrink: 0;
}
.lb-role-cta-link {
    font-size: .75rem; font-weight: 600; text-decoration: none;
    display: inline-block; margin-top: 6px;
}

/* ── Pagination ─────────────────────────────────────── */
.lb-pagination .page-link {
    border-radius:10px !important; margin: 0 2px;
    border: 1.5px solid #e2e8f0; color: #374151;
    font-size:.75rem; font-weight: 500; min-width: 36px;
    text-align: center; padding: 5px 10px;
    transition: background .15s, border-color .15s;
}
.lb-pagination .page-link:hover { background: #f1f5f9; border-color: #cbd5e1; color: #0f172a; }
.lb-pagination .page-item.active .page-link {
    background: #16a34a !important; border-color: #16a34a !important;
    color: #fff !important;
}
.lb-pagination .page-item.disabled .page-link { opacity: .4; }

/* ── Typography helpers ─────────────────────────────── */
.lb-xs   { font-size:.6875rem; }
.lb-sm   { font-size: .75rem; }
.lb-sm2  { font-size:.75rem; }
.lb-sm3  { font-size:.875rem; }
.lb-sm4  { font-size:.875rem; }
.lb-md   { font-size:.875rem; }
.lb-icon-lg  { font-size:1.25rem; }
.lb-icon-xl  { font-size: 1.5rem; }
.lb-empty-icon { font-size: 2.5rem; opacity: .3; }

/* ── Section headings with left border accent ───────── */
.lb-heading-blue  { font-size:1.125rem; color: #1e293b; border-left: 4px solid #0d6efd; padding-left: 12px; }
.lb-heading-green { font-size:1.125rem; color: #1e293b; border-left: 4px solid #198754; padding-left: 12px; }
.lb-heading-amber { font-size:1.125rem; color: #1e293b; border-left: 4px solid #f59e0b; padding-left: 12px; }
.lb-heading-red   { font-size:1.125rem; color: #1e293b; border-left: 4px solid #dc2626; padding-left: 12px; }

/* ── Border radius helpers ─────────────────────────── */
.lb-r-sm  { border-radius: 10px; }
.lb-r     { border-radius:14px; }
.lb-r-md  { border-radius: 14px; }
.lb-r-lg  { border-radius:14px; }

/* ── Color helpers ─────────────────────────────────── */
.lb-muted-link  { color: #94a3b8; text-decoration: none; }
.lb-muted-link:hover { color: #64748b; text-decoration: underline; }
.lb-blue  { color: #1d4ed8; }
.lb-slate { color: #64748b; }
.lb-slate-light { color: rgba(255,255,255,.8); }

/* ── Image helpers ─────────────────────────────────── */
.lb-cover { width: 100%; height: 100%; object-fit: cover; }
.lb-thumb-sm  { width: 48px; height: 48px; object-fit: cover; }
.lb-thumb-md  { width: 64px; height: 64px; object-fit: cover; }

/* ── Container helpers ─────────────────────────────── */
.lb-container-sm  { max-width: 860px; }
.lb-container-md  { max-width: 1000px; }

/* ── Z-index helpers ──────────────────────────────── */
.lb-z-2 { z-index: 2; }
.lb-z-3 { z-index: 3; }

/* ── Skeleton loading shimmer ─────────────────────── */
@keyframes lb-shimmer {
    0%   { background-position: -600px 0; }
    100% { background-position:  600px 0; }
}
.lb-skeleton {
    background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
    background-size: 600px 100%;
    animation: lb-shimmer 1.4s infinite linear;
    border-radius: 6px;
}
.lb-sk-img  { height: 140px; border-radius:14px 12px 0 0; }
.lb-sk-line { height: 12px; margin-bottom: 8px; }
.lb-sk-line-sm  { height: 10px; width: 60%; }
.lb-sk-line-xs  { height: 8px;  width: 40%; }
.lb-sk-card {
    border: 0; border-radius:14px;
    overflow: hidden; box-shadow: var(--shadow-sm);
    padding-bottom: 16px;
}

/* ── Chips bar overlapping hero (floating effect) ───── */
.lb-chips-bar {
    position: sticky;
    z-index: 1020;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
    box-shadow: var(--shadow);
    margin-top: -18px;
    border-radius:14px 18px 0 0;
    padding-top: 8px;
}

/* ── Mobile responsive overrides ────────────────────── */
@media (max-width: 991px) {
    /* The sticky mobile search row auto-submits as the visitor types (see
       the debounced-input script on each module page), so the separate tap
       target next to it was asking for an action that already happens on
       its own — a button that does nothing new reads as broken, not
       redundant. The filter (sliders) button stays; that opens the drawer,
       which typing can't do. */
    .lb-mob-search-row .btn[type=submit] { display: none !important; }
    /* Same fix, the OTHER search box: the hero at the top of the page (the
       one visible before any scrolling) has its own separate form and was
       missed the first time — a visitor testing "does typing search?" most
       often meets this box first, not the sticky one further down. The
       input group already carries its own rounded corners and shadow
       independent of this button (inline style, all four corners), so
       nothing else needs adjusting once it's gone. */
    .lb-hero-search-row > button[type=submit] { display: none !important; }

    /* Hero: compact on mobile */
    .lb-hero-mobile-compact { padding: 16px 0 28px !important; }
    .lb-hero-mobile-compact h1 { font-size:1.25rem !important; margin-bottom: 4px !important; }
    .lb-hero-mobile-compact p  { font-size:.75rem !important; margin-bottom: 12px !important; }
    /* Hide stats + popular tags on mobile to keep hero tight */
    .lb-hero-stats { display: none !important; }
    .lb-popular-tags-row { display: none !important; }
    /* Search box full width on mobile */
    .lb-hero-search-wrap { max-width: 100% !important; }
    .lb-hero-search-wrap .btn { padding: 10px 16px !important; font-size:.875rem; }
    /* Chips bar: show search row on mobile, add padding */
    .lb-chips-bar { padding-top: 0; border-radius: 14px 14px 0 0; }
    .lb-mob-search-row { display: flex !important; padding: 10px 0 6px; border-bottom: 1px solid #f1f5f9; }
    /* Cards: better 2-col on mobile */
    .lb-mob-card-name { font-size:.75rem !important; }
    .lb-mob-card-body { padding: 8px !important; }
    /* Results bar compact */
    .lb-results-bar-mobile { padding: 8px 12px !important; }
}
/* Default: hide search row in sticky bar */
.lb-mob-search-row { display: none !important; }
/* When scrolled past hero: show on ALL screen sizes */
body.lb-hero-passed .lb-mob-search-row { display: flex !important; }

/* Desktop sticky search bar — wider and more prominent */
@media (min-width: 992px) {
    body.lb-hero-passed .lb-mob-search-row {
        display: flex !important;
        padding: 8px 0 6px;
        max-width: 680px;
        margin: 0 auto;
        border-bottom: 1px solid #f1f5f9;
    }
    body.lb-hero-passed .lb-mob-search-row .input-group {
        border-radius: 10px !important;
        border: 1.5px solid #e2e8f0 !important;
        box-shadow: var(--shadow-sm);
    }
    body.lb-hero-passed .lb-mob-search-row input[type=text] {
        font-size:.875rem !important;
        padding: 8px 4px !important;
    }
    body.lb-hero-passed .lb-mob-search-row .btn[type=submit] {
        padding: 6px 20px !important;
        font-size:.875rem !important;
        border-radius:10px !important;
    }
    /* Remove negative margin gap on desktop when search visible */
    body.lb-hero-passed .lb-chips-bar {
        border-radius: 0;
        margin-top: 0;
    }
}

/* ── Mobile sticky contact/CTA bar (business/provider/builder detail pages) ─ */
.lb-mobile-cta-bar {
    display: none; position: fixed; bottom: 62px; left: 0; right: 0;
    background: #fff; border-top: 1px solid #e2e8f0;
    padding: 10px 14px; z-index: 1034; gap: 8px;
}
@media (max-width: 991.98px) {
    .lb-mobile-cta-bar { display: flex; }
    body.lb-has-mobile-cta-bar { padding-bottom: 140px; }
}

/* ── Mobile Bottom Navigation ───────────────────────── */
.lb-bottom-nav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 1040;
    background: #fff; border-top: 1px solid #e2e8f0;
    box-shadow: var(--shadow-up);
    padding: 6px 0 env(safe-area-inset-bottom, 6px);
    justify-content: space-around; align-items: center;
}
.lb-bn-item {
    display: flex; flex-direction: column; align-items: center;
    gap: 2px; text-decoration: none; color: #94a3b8;
    font-size:.6875rem; font-weight: 600; padding: 4px 10px;
    border-radius: 10px; transition: color .15s;
    min-width: 52px;
}
.lb-bn-item i { font-size: 1.25rem; line-height: 1; }
.lb-bn-item.active { color: var(--c-primary); }
.lb-bn-item.active i {
    background: var(--c-primary-light); border-radius:10px;
    padding: 4px 10px; display: block;
}
/* push page content above bottom nav on mobile */
@media (max-width: 991px) {
    body { padding-bottom: 68px; }
}

/* ── Card category color strip ──────────────────────── */
.lb-card-strip { height: 3px; width: 100%; }
.lb-strip-green  { background: linear-gradient(90deg,#16a34a,#34d399); }
.lb-strip-blue   { background: linear-gradient(90deg,#2563eb,#60a5fa); }
.lb-strip-purple { background: linear-gradient(90deg,#7c3aed,#a78bfa); }
.lb-strip-orange { background: linear-gradient(90deg,#d97706,#fbbf24); }
.lb-strip-pink   { background: linear-gradient(90deg,#db2777,#f472b6); }
.lb-strip-teal   { background: linear-gradient(90deg,#0d9488,#2dd4bf); }
.lb-strip-red    { background: linear-gradient(90deg,#dc2626,#f87171); }
.lb-strip-indigo { background: linear-gradient(90deg,#4f46e5,#818cf8); }

/* ── "New" badge ────────────────────────────────────── */
.lb-new-badge {
    font-size:.6875rem; font-weight: 700; letter-spacing: .04em;
    background: #16a34a; color: #fff;
    padding: 2px 7px; border-radius:999px;
    display: inline-block; vertical-align: middle;
    animation: lb-pulse 2s infinite;
}
@keyframes lb-pulse {
    0%,100% { box-shadow: 0 0 0 0 rgba(22,163,74,.4); }
    50%      { box-shadow: 0 0 0 5px rgba(22,163,74,0); }
}

/* ── Hero stats strip ───────────────────────────────── */
.lb-hero-stats {
    display: flex; gap: 20px; flex-wrap: wrap;
    margin-top: 16px; padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,.12);
}
.lb-hero-stat {
    display: flex; align-items: center; gap: 8px;
}
.lb-hero-stat-icon {
    width: 32px; height: 32px; border-radius:10px;
    background: rgba(255,255,255,.12);
    display: flex; align-items: center; justify-content: center;
    font-size: 1rem; flex-shrink: 0;
}
.lb-hero-stat-val { font-size:1rem; font-weight: 700; color: #fff; line-height: 1.1; }
.lb-hero-stat-lbl { font-size:.6875rem; color: rgba(255,255,255,.5); letter-spacing: .03em; }
.lb-sk-body { padding: 12px; }
.lb-sk-body .lb-skeleton + .lb-skeleton { margin-top: 8px; }

/* ============================================================
   Global A11y + micro-interaction layer (loads on every page)
   Additive only — no existing rule is overridden.
   ============================================================ */

/* Keyboard focus ring — visible only for keyboard users, not mouse.
   Professional, accessible, and matches the brand. */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--c-primary, #ea580c);
    outline-offset: 2px;
    border-radius:6px;
}

/* Subtle press feedback on primary actions */
.btn:active { transform: translateY(1px); }

/* Respect users who prefer reduced motion (a11y / vestibular safety) */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}

/* ── Navbar language toggle (EN / हिं) ──────────────────────────────
   A single compact pill instead of two full-height Bootstrap buttons —
   sits flush with the other navbar controls instead of towering over
   them, and doesn't rely on Latin-only font metrics for the Hindi label. */
.lb-lang-toggle {
    display: inline-flex; align-items: center;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    padding: 2px;
    height: 32px;
    line-height: 1;
}
.lb-lang-opt {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 30px; height: 26px; padding: 0 8px;
    border-radius: 999px;
    font-size:.75rem; font-weight: 600;
    color: rgba(255,255,255,.65);
    text-decoration: none;
    transition: background .15s, color .15s;
}
.lb-lang-opt:hover { color: #fff; text-decoration: none; }
.lb-lang-opt.active { background: #fff; color: #0f172a; }

/* ── Navbar must never force the page wider than the viewport ──────
   .navbar-expand-lg's collapse becomes a plain flex row with no wrap at
   lg+, and every nav link/button here is text-nowrap. That's fine at a
   normal font size, but a larger browser/OS text setting (a real
   accessibility option, not the same as page zoom) makes the combined
   nowrap content wider than the navbar's own container -- and since
   nothing here can shrink below its text width, the whole <body>
   stretches to fit it. Every centered .container on every page below
   then centers within that wider body and its right edge slides past
   the visible viewport, cropping real content (buttons, description
   text) that has nothing to do with the navbar itself.
   Letting the collapse wrap onto a second line at that point costs a
   few extra pixels of navbar height; never letting the whole site
   overflow sideways is worth that. */
@media (min-width: 992px) {
    #mainNav.navbar-collapse { flex-wrap: wrap; row-gap: 6px; }
}

/* ── Navbar: icon-only nav links in the "squeeze zone" ──────────────
   Between the point navbar-expand-lg switches to a horizontal bar
   (992px) and where there's finally enough room for full labels
   again (1200px), the desktop nav doesn't fit on one line, so
   icon+label wraps onto two lines inside each pill. Hide the label
   text only in that range; the mobile dropdown (<992px) is a
   vertical list with plenty of room, so it always keeps labels.
   2026-09-30: credits/name/language moved out of the top bar into
   the profile dropdown (logged-in) — the top bar is lighter now, so
   this squeeze zone is back to its original, narrower 1199.98px. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .lb-nav-text { display: none; }
}

/* ── Mobile hamburger menu: 2-column grid instead of one long list ── */
@media (max-width: 991.98px) {
    #mainNav .navbar-nav {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2px 8px;
    }
    #mainNav .navbar-nav .nav-link {
        white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    /* A grid track's default minimum is its content, so `1fr 1fr` was not
       two halves: the longest item widened its own column and squeezed the
       other. */
    #mainNav .navbar-nav > .nav-item { min-width: 0; }
    #mainNav .navbar-nav .lb-nav-span2 { grid-column: 1 / -1; }
    /* A row that spans both columns has room for its badge, so nothing there
       needs clipping — and `overflow: hidden` above would have cut it off. */
    #mainNav .navbar-nav .lb-nav-span2 .nav-link { overflow: visible; }
}

/* ── Navbar dropdown ────────────────────────────────────────────────
   Bootstrap's stock menu was showing through: a 6px box with the
   framework's blue hover (#0d6efd) sitting under a navy-and-orange bar.
   The blue was the loudest colour on the page and belonged to no part of
   this brand.

   Warm tint on hover instead, an orange rule down the active item, and a
   softer, rounder card that reads as part of the navbar rather than a
   panel dropped on top of it. */
#main-navbar .dropdown-menu {
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 14px;
    padding: 6px;
    margin-top: 8px;
    min-width: 232px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .16);
}
#main-navbar .dropdown-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 2px;
    border-radius: 9px;
    padding: 9px 12px;
    font-size: .875rem;
    font-weight: 500;
    color: #1f2937;
    transition: background .15s, color .15s;
}
#main-navbar .dropdown-menu .dropdown-item i {
    color: #64748b;
    transition: color .15s;
}
#main-navbar .dropdown-menu .dropdown-item:hover,
#main-navbar .dropdown-menu .dropdown-item:focus {
    background: #fff7ed;
    color: #9a3412;
}
#main-navbar .dropdown-menu .dropdown-item:hover i,
#main-navbar .dropdown-menu .dropdown-item:focus i {
    color: #ea580c;
}
/* The page you are on, marked by a rule rather than a filled bar — the
   solid block read as a hover that would not go away. */
#main-navbar .dropdown-menu .dropdown-item.active {
    background: #fff7ed;
    color: #9a3412;
    box-shadow: inset 3px 0 0 #ea580c;
}
#main-navbar .dropdown-menu .dropdown-item.active i { color: #ea580c; }
#main-navbar .dropdown-menu .dropdown-divider {
    margin: 6px 8px;
    border-top-color: rgba(15, 23, 42, .08);
    opacity: 1;
}

/* ── Shared right-sidebar filter drawer (moved from layouts/app.blade.php
   inline <style> so it's cached across page loads instead of resent on
   every single navigation) ── */
.lb-drawer-overlay {
    display: none; position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,.45); z-index: 9999;
    justify-content: center; align-items: flex-end;
}
.lb-drawer-overlay.open { display: flex; }
.lb-filter-drawer {
    background: #fff; width: 100%; max-width: 520px;
    max-height: 86vh; display: flex; flex-direction: column;
    border-radius:14px 18px 0 0; overflow: hidden;
    animation: lbSlideUp .28s cubic-bezier(.22,1,.36,1);
}
.lb-filter-drawer::before {
    content: ''; width: 38px; height: 4px; border-radius:999px;
    background: #cbd5e1; margin: 8px auto 0; flex-shrink: 0;
}
@keyframes lbSlideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
.lb-drawer-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px; border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0; background: #fff;
}
.lb-drawer-header span { font-size:1rem; font-weight: 600; color: #0f172a; }
.lb-drawer-body { flex: 1; overflow-y: auto; padding: 6px 16px 4px; }
.lb-drawer-section { padding: 13px 0; border-bottom: 1px solid #f1f5f9; }
.lb-drawer-section:last-child { border-bottom: none; }
.lb-drawer-label { display: flex; align-items: center; gap: 7px; font-size:.875rem; font-weight: 600; color: #0f172a; margin-bottom: 9px; }
.lb-drawer-label i { font-size:1rem; color: var(--c-primary); width: 18px; text-align: center; }
.lb-drawer-label .lb-hint { margin-left: auto; font-size:.75rem; font-weight: 500; color: #94a3b8; }
.lb-drawer-footer { padding: 12px 16px; border-top: 1px solid #f1f5f9; background: #fff; flex-shrink: 0; }
.lb-filter-drawer .form-select { border-radius:10px; border: 1.5px solid #e5e9f0; padding: 11px 40px 11px 14px; font-size:.875rem; font-weight: 500; color: #0f172a; background-color: #fff; box-shadow: none; transition: border-color .15s, box-shadow .15s; }
.lb-filter-drawer .form-select:focus { border-color: var(--c-primary); box-shadow: 0 0 0 3px var(--c-primary-light); }
.lb-filter-drawer .form-select:disabled { background: #f8fafc; color: #94a3b8; }
.lb-loc-btn { width: 100%; display: flex; align-items: center; gap: 12px; text-align: left; padding: 12px 14px; border-radius:10px; border: 1.5px solid #e5e9f0; background: #fff; transition: .15s; }
.lb-loc-btn:active { transform: scale(.99); }
.lb-loc-btn .lb-loc-ic { flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--c-primary-light); color: var(--c-primary); font-size:1rem; }
.lb-loc-btn .lb-loc-txt { display: flex; flex-direction: column; line-height: 1.25; }
.lb-loc-btn .lb-loc-txt b { font-size:.875rem; font-weight: 600; color: #0f172a; }
.lb-loc-btn .lb-loc-txt small { font-size:.75rem; color: #94a3b8; }
.lb-loc-btn.is-set { border-color: #86efac; background: #f0fdf4; }
.lb-loc-btn.is-set .lb-loc-ic { background: #dcfce7; color: #16a34a; }
.lb-loc-btn .lb-loc-chev { margin-left: auto; color: #cbd5e1; }
.lb-toggle-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius:10px; border: 1.5px solid #e5e9f0; cursor: pointer; transition: .15s; }
.lb-toggle-row:has(input:checked) { border-color: #86efac; background: #f0fdf4; }
.lb-toggle-row .lb-loc-ic { flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #dcfce7; color: #16a34a; font-size: 1rem; }
.lb-toggle-row .lb-tog-txt { display: flex; flex-direction: column; line-height: 1.25; }
.lb-toggle-row .lb-tog-txt b { font-size:.875rem; font-weight: 600; color: #0f172a; }
.lb-toggle-row .lb-tog-txt small { font-size:.75rem; color: #94a3b8; }
.lb-toggle-row .form-check-input { margin-left: auto; width: 2.4em; height: 1.35em; cursor: pointer; }
.lb-chip { display: inline-block; border: 1.5px solid #e2e8f0; border-radius:999px; padding: 5px 13px; font-size:.875rem; cursor: pointer; margin: 3px 3px 3px 0; color: #0f172a; background: #fff; transition: .15s; }
.lb-chip.active, .lb-chip:active { border-color: var(--c-primary); background: var(--c-primary-light); color: var(--c-primary); }
.lb-filter-count { position: absolute; top: 3px; right: 4px; background: var(--c-primary); color: #fff; border-radius: 50%; min-width: 17px; height: 17px; padding: 0 3px; font-size:.6875rem; line-height: 17px; text-align: center; font-weight: 700; box-shadow: 0 0 0 1.5px #fff; }
.navbar-search input::placeholder { color: rgba(255,255,255,.45); }
.navbar-search input:focus { background: rgba(255,255,255,.18) !important; border-color: rgba(255,255,255,.35) !important; box-shadow: none; color: #fff; }
.zf-pop {
    position: fixed; z-index: 12000; min-width: 168px; max-width: 260px;
    max-height: 300px; overflow-y: auto; background: #fff;
    border: 1px solid #e5e9f0; border-radius:14px;
    box-shadow: var(--shadow-lg); padding: 6px;
    animation: zfPopIn .13s ease; -webkit-overflow-scrolling: touch;
}
@keyframes zfPopIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.zf-pop-opt {
    display: flex; align-items: center; gap: 8px;
    padding: 9px 11px; border-radius:10px; cursor: pointer;
    font-size:.875rem; font-weight: 500; color: #334155; line-height: 1.2;
}
.zf-pop-opt:hover { background: #f1f5f9; }
.zf-pop-opt.is-sel { background: var(--c-primary-light); color: var(--c-primary); font-weight: 600; }
.zf-pop-opt .zf-pop-check { margin-left: auto; opacity: 0; font-size:.75rem; }
.zf-pop-opt.is-sel .zf-pop-check { opacity: 1; }
.zf-pop-backdrop { position: fixed; inset: 0; z-index: 11999; background: transparent; }