/* Shop Locator – Home Dashboard (no Tailwind dependency)
 * Scope everything to .sbf-home to avoid theme collisions.
 */

.sbf-home{--sbf-bg:#f4f6f8;--sbf-card:#ffffff;--sbf-text:#111827;--sbf-muted:#6b7280;--sbf-line:#e5e7eb;--sbf-shadow:0 8px 24px rgba(17,24,39,.08);--sbf-radius:22px;--sbf-radius2:16px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";color:var(--sbf-text)}
.sbf-home *, .sbf-home *::before, .sbf-home *::after{box-sizing:border-box}
.sbf-home a{color:inherit;text-decoration:none}
/* App root */
.sbf-home__app{min-height:100vh;background:var(--sbf-bg)}

/*
  Theme compatibility / full-bleed background
  Many themes constrain .entry-content children to a boxed max-width container.
  The sample HTML expects the dashboard background to span edge-to-edge.
*/
.sbf-home-dashboard-bleed{width:100vw;margin-left:calc(50% - 50vw);background:var(--sbf-bg)}

.entry-content.is-layout-constrained > .sbf-home-dashboard-bleed,
.entry-content > .sbf-home-dashboard-bleed{
  max-width:none !important;
  width:100% !important;
}

/* Remove theme spacing that creates the "boxed" look for the home dashboard view */
body.sbf-view-home .entry-content{margin:0 !important;padding:0 !important}
body.sbf-view-home .site-main,body.sbf-view-home .content-area,body.sbf-view-home .site-content{padding-top:0 !important}

/* Optional SBF header (shortcode: [sbf_sbf_header]) */
.sbf-sbf-header{position:relative;z-index:50;background:#fff;border-bottom:1px solid #e5e7eb}
.sbf-sbf-header__inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:14px 18px}
.sbf-sbf-brand{display:flex;align-items:center;gap:10px;font-weight:800;color:#111827}
.sbf-sbf-mark{width:34px;height:34px;border-radius:12px;background:#111827;display:inline-block;box-shadow:0 10px 20px rgba(17,24,39,.12)}
.sbf-sbf-nav{display:flex;gap:16px;margin-left:18px;flex:1;flex-wrap:wrap}
.sbf-sbf-nav__link{color:#6b7280;text-decoration:none;font-weight:600;position:relative;padding:8px 4px}
.sbf-sbf-nav__link.is-active{color:#111827}
.sbf-sbf-nav__link.is-active:after{content:"";position:absolute;left:0;right:0;bottom:-14px;height:3px;border-radius:3px;background:#fca5a5}
.sbf-sbf-user{display:flex;align-items:center;gap:10px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:14px;padding:10px 12px}
.sbf-sbf-user__label{font-size:11px;line-height:1;color:#6b7280;font-weight:700}
.sbf-sbf-user__name{font-weight:800;color:#111827}
.sbf-sbf-user__avatar{width:32px;height:32px;border-radius:999px;background:#111827;display:inline-block}

.sbf-container{width:100%;max-width:1520px;margin:0 auto;padding:0 22px}

/* Screen-reader only */
.sbf-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Inline SVG icon system (keeps plugin CDN-free) */
.sbf-svg{width:20px;height:20px;display:block;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sbf-svg--sm{width:18px;height:18px}
.sbf-cat__wm .sbf-svg{width:96px;height:96px}

/* Top bar */
.sbf-topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid var(--sbf-line)}
.sbf-topbar__row{display:flex;align-items:center;justify-content:space-between;gap:18px;height:76px}
.sbf-brand{display:flex;align-items:center;gap:12px;font-weight:800}
.sbf-brand__logo{width:40px;height:40px;border-radius:14px;background:#0f172a;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 20px rgba(15,23,42,.18)}
.sbf-brand__text{font-size:20px;letter-spacing:-.01em}

.sbf-nav{display:flex;align-items:center;gap:26px;color:#6b7280;font-weight:600}
.sbf-nav__item{position:relative;padding:10px 6px;border-radius:12px}
.sbf-nav__item:hover{color:#111827}
.sbf-nav__item--active{color:#111827}
.sbf-nav__item--active::after{content:"";position:absolute;left:6px;right:6px;bottom:-16px;height:4px;border-radius:999px;background:#fda4af}

.sbf-topbar__right{display:flex;align-items:center;gap:12px}
.sbf-iconbtn{width:40px;height:40px;border-radius:14px;border:1px solid var(--sbf-line);background:#fff;display:flex;align-items:center;justify-content:center;color:#64748b;cursor:pointer}
.sbf-iconbtn:hover{background:#f9fafb}
.sbf-iconbtn--menu{display:none}

.sbf-user{display:flex;align-items:center;gap:12px;padding:8px 10px 8px 14px;border-radius:18px;border:1px solid var(--sbf-line);background:#fff}
.sbf-user:hover{background:#f9fafb}
.sbf-user__meta{display:flex;flex-direction:column;gap:2px;line-height:1.1}
.sbf-user__status{font-size:12px;color:#9ca3af;font-weight:700}
.sbf-user__name{font-size:14px;font-weight:800}
.sbf-user__avatar{width:36px;height:36px;border-radius:999px;background:#111827;color:#fff;display:flex;align-items:center;justify-content:center}

/* Mobile drawer */
.sbf-mobile{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;z-index:60}
.sbf-mobile--open{display:block}
.sbf-mobile__panel{position:absolute;top:0;right:0;height:100%;width:320px;background:#fff;padding:18px 18px 24px;box-shadow:-12px 0 40px rgba(0,0,0,.18)}
.sbf-mobile__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.sbf-mobile__title{font-weight:900;font-size:18px}
.sbf-mobile__nav{display:flex;flex-direction:column;gap:8px}
.sbf-mobile__item{padding:12px 12px;border-radius:14px;color:#111827;font-weight:700}
.sbf-mobile__item:hover{background:#f3f4f6}

/* Main */
body.sbf-view-home .sbf-main{padding:var(--sbf-header-offset) 0 40px}

/* Hero */
.sbf-hero{display:flex;flex-direction:column;align-items:center;text-align:center;margin:16px 0 26px}
.sbf-hero__title{font-size:44px;line-height:1.05;letter-spacing:-.03em;margin:10px 0 14px;font-weight:900}

.sbf-search{width:100%;max-width:760px}
.sbf-search__row{display:flex;gap:14px;align-items:center;justify-content:center}
.sbf-search__field{flex:1;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--sbf-line);border-radius:22px;padding:14px 16px;box-shadow:0 10px 22px rgba(17,24,39,.06)}
.sbf-search__field i{color:#9ca3af}
.sbf-search__field input{border:0;outline:0;width:100%;font-size:16px;background:transparent}
.sbf-search__btn{border:0;cursor:pointer;background:#111827;color:#fff;font-weight:900;padding:14px 22px;border-radius:18px;box-shadow:0 12px 24px rgba(17,24,39,.18)}
.sbf-search__btn:hover{filter:brightness(.95)}

.sbf-recent{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;color:#6b7280;font-weight:700}
.sbf-recent__label{font-size:13px;color:#9ca3af}
.sbf-recent__chip{font-size:13px;padding:8px 10px;border-radius:999px;background:#fff;border:1px solid var(--sbf-line)}
.sbf-recent__chip:hover{background:#f9fafb}

/* Category cards */
.sbf-cats{display:grid;gap:18px;margin:24px 0 26px}
/* Default: 2 cols */
.sbf-cats{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:640px){.sbf-cats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:900px){.sbf-cats{grid-template-columns:repeat(7,minmax(0,1fr))}}

.sbf-cat{position:relative;min-height:175px;border-radius:22px;padding:18px 18px 16px;box-shadow:var(--sbf-shadow);color:#fff;overflow:hidden;display:flex;flex-direction:column;gap:8px}
.sbf-cat:hover{transform:translateY(-2px);transition:transform .15s ease, box-shadow .15s ease;box-shadow:0 14px 34px rgba(17,24,39,.14)}

.sbf-cat__icon{width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.95)}
.sbf-cat__icon svg{width:22px;height:22px;display:block;stroke:currentColor;fill:none}
.sbf-cat__title{font-weight:900;font-size:16px;letter-spacing:-.01em}
.sbf-cat__sub{font-size:12px;opacity:.85;line-height:1.25;max-width:140px}
.sbf-cat__meta{margin-top:auto;font-weight:900;font-size:12px;opacity:.95}
.sbf-cat__wm{position:absolute;right:-12px;bottom:-18px;font-size:92px;opacity:.14;transform:rotate(-10deg)}

/* Colorways */
.sbf-cat--hardware{background:#5b57a8}
.sbf-cat--hwbin{background:#c84c5d}
.sbf-cat--items{background:#2e7d48}
.sbf-cat--tools{background:#e1870e}
.sbf-cat--fluids{background:#6d6e26}
.sbf-cat--storage{background:#2c7a8b}
.sbf-cat--locations{background:#2563eb}

/* Widget cards */
.sbf-grid{display:grid;grid-template-columns:1fr;gap:22px;margin-top:10px}
@media (min-width:1024px){.sbf-grid{grid-template-columns:2fr 1fr;align-items:stretch}}

.sbf-bottom{display:grid;grid-template-columns:1fr;gap:22px;margin-top:22px}
@media (min-width:1024px){.sbf-bottom{grid-template-columns:1fr 1fr}}

.sbf-card{background:var(--sbf-card);border-radius:var(--sbf-radius);box-shadow:var(--sbf-shadow);overflow:hidden;border:1px solid rgba(229,231,235,.8)}
.sbf-card--wide{grid-column:1 / -1}
@media (min-width:1024px){.sbf-card--wide{grid-column:1 / span 1}}

.sbf-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:22px 22px 18px;border-bottom:1px solid var(--sbf-line)}
.sbf-card__head--simple{border-bottom:0;padding-bottom:14px}
.sbf-card__title{font-weight:900;font-size:22px;letter-spacing:-.02em}
.sbf-card__sub{font-size:13px;color:var(--sbf-muted);margin-top:4px;font-weight:600}
.sbf-card__headRight{display:flex;align-items:center;gap:10px}

.sbf-card__body{padding:18px 22px 22px}

.sbf-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:8px 12px;font-weight:900;font-size:12px;border:1px solid rgba(0,0,0,.06)}
.sbf-pill--pink{background:#ffe4e6;color:#9f1239}
.sbf-pill--yellow{background:#fef3c7;color:#92400e}

.sbf-circle{width:34px;height:34px;border-radius:999px;background:#f3f4f6;color:#6b7280;display:flex;align-items:center;justify-content:center}
.sbf-circle:hover{background:#e5e7eb;color:#111827}

.sbf-ghost{width:34px;height:34px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#9ca3af}
.sbf-ghost:hover{background:#f3f4f6;color:#111827}

.sbf-link{font-size:12px;font-weight:900;color:#2563eb}
.sbf-link:hover{text-decoration:underline}

/* Stats */
.sbf-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px}
.sbf-stat{border-radius:18px;padding:16px;border:1px solid rgba(0,0,0,.05)}
.sbf-stat__num{font-size:26px;font-weight:1000;letter-spacing:-.02em}
.sbf-stat__lbl{font-size:11px;font-weight:900;margin-top:4px;opacity:.75;letter-spacing:.08em}
.sbf-stat--blue{background:#eff6ff;color:#1d4ed8;border-color:#dbeafe}
.sbf-stat--orange{background:#fff7ed;color:#c2410c;border-color:#ffedd5}
.sbf-stat--green{background:#ecfdf5;color:#047857;border-color:#d1fae5}

/* List */
.sbf-list{display:flex;flex-direction:column;gap:10px}
.sbf-muted{color:var(--sbf-muted);font-weight:600;font-size:14px}

/* Map */
.sbf-map{display:block;margin:0 22px 22px;border-radius:18px;overflow:hidden;min-height:320px;background:#e5e7eb;position:relative}
.sbf-map__img{position:absolute;inset:0;background-image:linear-gradient(135deg, rgba(17,24,39,.08), rgba(17,24,39,.03));background-size:cover;background-position:center}
.sbf-map__shade{position:absolute;inset:0;background:radial-gradient(circle at 30% 20%, rgba(255,255,255,.35), rgba(0,0,0,.12))}

/* Orders */
.sbf-order{display:flex;align-items:flex-start;gap:12px}
.sbf-order__ic{width:40px;height:40px;border-radius:14px;background:#fff7ed;color:#c2410c;display:flex;align-items:center;justify-content:center}
.sbf-order__txt{display:flex;flex-direction:column;gap:2px}
.sbf-order__title{font-weight:900}

/* Dark card */
.sbf-card--dark{background:linear-gradient(135deg,#111827,#1f2937);color:#fff;border:0}
.sbf-card--dark .sbf-card__title{color:#fff}
.sbf-card--dark .sbf-card__sub{color:rgba(255,255,255,.72)}

.sbf-btn{display:inline-flex;align-items:center;gap:10px;background:#10b981;color:#052e1b;font-weight:1000;padding:12px 16px;border-radius:16px;box-shadow:0 14px 30px rgba(16,185,129,.28)}
.sbf-btn:hover{filter:brightness(.98)}

/* Footer */
.sbf-footer{padding:18px 0 26px}
.sbf-footer__row{display:flex;align-items:center;justify-content:space-between;gap:12px}

/* Responsive header behavior */
@media (max-width:980px){
  .sbf-nav{display:none}
  .sbf-iconbtn--menu{display:flex}
}
@media (max-width:520px){
  .sbf-user__meta{display:none}
}

/* -------------------------------------------------------------------------
   Full-bleed breakout
   Block themes (e.g., Blocksy) constrain .entry-content to a max-width.
   The reference HTML is full-bleed with a continuous background.
---------------------------------------------------------------------------*/
.sbf-home-dashboard-body{
  width:100vw;
  position:relative;
  left:50%;
  right:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  background:#f3f4f6;
}

/* -------------------------------------------------------------------------
   Custom utility classes referenced by the provided HTML
---------------------------------------------------------------------------*/
.shadow-card{box-shadow:0 18px 45px rgba(15,23,42,.10)}
.shadow-soft{box-shadow:0 10px 28px rgba(15,23,42,.10)}
.text-primary{color:#0f172a}
.text-secondary{color:#64748b}
.bg-accent{background:#fecdd3}