/* ==========================================================================
   Dokan Instacart Store Theme — store.css  v3
   Astra-compatible: all rules scoped to .dis-store-wrap so Astra base
   styles cannot override our button shapes or layout.
   ========================================================================== */

:root {
    --dis-green:       #00a651;
    --dis-green-h:     #008f45;
    --dis-orange:      #f5a623;
    --dis-red:         #e63b2e;
    --dis-ebt:         #5c6bc0;
    --dis-text:        #1a1a1a;
    --dis-text-2:      #6b7280;
    --dis-border:      #e8e8e8;
    --dis-bg:          #f7f8f9;
    --dis-card:        #ffffff;
    --dis-radius:      14px;
    --dis-shadow:      0 2px 10px rgba(0,0,0,.07);
    --dis-shadow-h:    0 6px 20px rgba(0,0,0,.12);
    --dis-font:        -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --dis-max:         1280px;
}

/* ── Astra conflict resets ────────────────────────────────────────────────── */
/* All rules are scoped tightly to .dis-store-wrap to win specificity battles
   against Astra, Kadence, GeneratePress, OceanWP, and block themes alike. */
.dis-store-wrap,
.dis-store-wrap * {
    box-sizing: border-box;
}

/* Neutralise theme button styles inside our wrap */
.dis-store-wrap button,
.dis-store-wrap a {
    font-family : var(--dis-font);
}

/* ── Universal sidebar + layout reset (works on ANY theme) ──────────────── */
/* Target the main/primary content wrapper used by most themes and hide sidebars.
   Works on Astra (.ast-sidebar-right / .ast-article-single),
   Kadence (#secondary / #primary), GeneratePress (.widget-area / #primary),
   OceanWP (.widget-area / #primary), and FSE/block themes. */

/* Hide right sidebars on store pages */
body.dokan-store #secondary,
body.dokan-store .widget-area,
body.dokan-store aside,
body.dokan-store .sidebar,
body.dokan-store [class*="sidebar"],
body.dokan-store .ast-sidebar-right { display: none !important; }

/* Make the main content column full-width */
body.dokan-store #primary,
body.dokan-store #main,
body.dokan-store .site-main,
body.dokan-store main,
body.dokan-store .entry-content-wrap,
body.dokan-store .ast-article-single { width: 100% !important; max-width: 100% !important; padding: 0 !important; margin: 0 !important; float: none !important; }

/* Remove outer site padding/gutters */
body.dokan-store .site-content,
body.dokan-store .content-area { padding: 0 !important; }

/* Block theme: make the main group block full-width */
body.dokan-store .wp-block-group.alignfull { padding: 0 !important; }

.dis-store-wrap { background: #fff; font-family: var(--dis-font); color: var(--dis-text); }

/* ── Delivery bar ─────────────────────────────────────────────────────────── */
.dis-delivery-bar {
    background  : var(--dis-green);
    color       : #fff;
    display     : flex;
    align-items : center;
    gap         : 8px;
    padding     : 10px 20px;
    font-size   : 14px;
    font-weight : 600;
}
.dis-delivery-icon { width: 16px; height: 16px; flex-shrink: 0; }

/* ── Admin-bar & sticky search custom properties ─────────────────────────── */
/*
 * --dis-adminbar-h: 0 normally; 32px/46px when WP admin bar is present.
 * --dis-searchbar-h: measured by JS so sticky subcategories sit directly
 * under the sticky search bar.
 */
:root {
    --dis-adminbar-h  : 0px;
    --dis-searchbar-h : 62px;
}
body.admin-bar { --dis-adminbar-h: 32px; }
@media screen and (max-width: 782px) {
    body.admin-bar { --dis-adminbar-h: 46px; }
}


/* ── Sticky search bar ───────────────────────────────────────────────────── */
.dis-search-sticky {
    position   : sticky;
    top        : var(--dis-adminbar-h);
    z-index    : 120;
    background : rgba(255,255,255,.96);
    border-bottom: 1px solid rgba(229,231,235,.95);
    box-shadow : 0 6px 18px rgba(16,24,40,.06);
    padding    : 10px 20px;
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
}
.dis-search-sticky .dis-store-search {
    max-width : var(--dis-max);
    width     : 100%;
    margin    : 0 auto;
    flex      : none;
}

/* ── Store header ─────────────────────────────────────────────────────────── */
.dis-store-header {
    background    : #fff;
    border-bottom : 1px solid var(--dis-border);
    position      : static;
    box-shadow    : 0 2px 8px rgba(0,0,0,.04);
}

/* Parent row is sticky only in All/no-subcategory mode.
 * When a parent with children is selected, only its subcategory row sticks. */
.dis-sticky-nav {
    position   : static;
    background : #fff;
}
.dis-banner {
    height              : 180px;
    background-size     : cover;
    background-position : center;
}
.dis-header-inner {
    max-width   : var(--dis-max);
    margin      : 0 auto;
    padding     : 14px 20px;
    display     : flex;
    align-items : center;
    gap         : 14px;
    flex-wrap   : wrap;
}
.dis-store-identity { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.dis-store-logo {
    width         : 52px;
    height        : 52px;
    border-radius : 10px;
    object-fit    : cover;
    border        : 1px solid var(--dis-border);
    flex-shrink   : 0;
}
.dis-store-meta { min-width: 0; }
.dis-store-name { font-size: 20px; font-weight: 800; margin: 0 0 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dis-store-rating { font-size: 13px; color: var(--dis-text-2); }
.dis-store-address { display: flex; align-items: center; gap: 4px; font-size: 12px; color: var(--dis-text-2); }
.dis-store-address svg { width: 12px; height: 12px; }
.dis-store-search {
    position      : relative;
    display       : flex;
    align-items   : center;
    gap           : 10px;
    background    : #fff;
    border        : 1px solid #d9dee7;
    border-radius : 18px;
    padding       : 0 12px 0 15px;
    flex          : 1;
    max-width     : 520px;
    min-height    : 46px;
    box-shadow    : 0 7px 20px rgba(16,24,40,.08);
    transition    : border-color .16s ease, box-shadow .16s ease, background-color .16s ease, transform .16s ease;
}
.dis-store-search:focus-within {
    border-color : rgba(0,166,81,.52);
    box-shadow   : 0 0 0 4px rgba(0,166,81,.12), 0 9px 24px rgba(16,24,40,.1);
}
.dis-store-search .dis-search-icon { width: 20px; height: 20px; color: #64748b; flex-shrink: 0; }
.dis-store-search input {
    border      : none;
    background  : transparent;
    outline     : none;
    font-size   : 15px;
    font-weight : 500;
    color       : var(--dis-text);
    width       : 100%;
    min-width   : 0;
    height      : 44px;
    line-height : 44px;
    padding     : 0;
    -webkit-appearance: none;
    appearance  : none;
}
.dis-store-search input::-webkit-search-decoration,
.dis-store-search input::-webkit-search-cancel-button,
.dis-store-search input::-webkit-search-results-button,
.dis-store-search input::-webkit-search-results-decoration { display: none; }
.dis-store-search input::placeholder { color: #8a94a6; font-weight: 500; }
.dis-search-clear {
    width        : 28px;
    height       : 28px;
    border       : none;
    border-radius: 999px;
    background   : #eef1f5;
    color        : #64748b;
    cursor       : pointer;
    font-size    : 20px;
    line-height  : 1;
    align-items  : center;
    justify-content: center;
    display      : none;
    flex-shrink  : 0;
    padding      : 0;
}
.dis-search-clear:hover { background: #e1e6ed; color: #334155; }
.dis-store-search.dis-has-value .dis-search-clear { display: inline-flex; }
.dis-search-spinner {
    display      : none;
    width        : 18px;
    height       : 18px;
    border       : 2px solid rgba(0,166,81,.18);
    border-top-color: var(--dis-green);
    border-radius: 50%;
    animation    : dis-spin .75s linear infinite;
    flex-shrink  : 0;
}
.dis-store-search.dis-is-loading .dis-search-spinner { display: inline-block; }
.dis-store-search.dis-is-loading .dis-search-clear { display: none; }

/* ── Category carousel ────────────────────────────────────────────────────── */
.dis-cat-carousel-wrap {
    background    : #fff;
    border-bottom : 1px solid var(--dis-border);
    overflow-x    : auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    /* parent category row scrolls normally */
}
.dis-cat-carousel-wrap::-webkit-scrollbar { display: none; }

/* Sticky parent category row: enabled by JS only for the All view
 * or when the selected parent has no subcategory row. */
.dis-store-wrap.dis-parent-row-sticky #dis-parent-pills-wrap {
    position   : sticky;
    top        : calc( var(--dis-adminbar-h) + var(--dis-searchbar-h) );
    z-index    : 111;
    box-shadow : 0 2px 6px rgba(0,0,0,.05);
}

.dis-store-wrap.dis-subcat-row-sticky #dis-parent-pills-wrap {
    position   : static;
    box-shadow : none;
}

.dis-cat-carousel {
    display     : flex;
    gap         : 4px;
    padding     : 14px 16px;
    max-width   : var(--dis-max);
    margin      : 0 auto;
}

/* ── Circle pill — icon circle above, label below ──────────────────────── */
.dis-cat-pill {
    display        : flex;
    flex-direction : column;
    align-items    : center;
    gap            : 8px;
    padding        : 0;
    border         : none;
    background     : transparent;
    cursor         : pointer;
    font-family    : var(--dis-font);
    flex-shrink    : 0;
    width          : 80px;
    min-width      : 80px;
}

/* The circle */
.dis-cat-pill-circle {
    width         : 64px;
    height        : 64px;
    border-radius : 50%;
    background    : #f0f0f0;
    display       : flex;
    align-items   : center;
    justify-content: center;
    overflow      : hidden;
    border        : 2.5px solid transparent;
    transition    : border-color .15s, transform .12s, box-shadow .15s;
    flex-shrink   : 0;
}

.dis-cat-pill-circle img {
    width      : 100%;
    height     : 100%;
    object-fit : cover;
    border-radius: 50%;
}

/* Fallback icon when no image */
.dis-cat-pill-circle svg {
    width  : 30px;
    height : 30px;
    color  : var(--dis-text-2);
}

/* Label */
.dis-cat-pill-label {
    font-size   : 12px;
    font-weight : 600;
    color       : var(--dis-text-2);
    text-align  : center;
    line-height : 1.3;
    max-width   : 76px;
    word-break  : break-word;
    hyphens     : auto;
}

/* Hover */
.dis-cat-pill:hover .dis-cat-pill-circle {
    border-color : var(--dis-text-2);
    transform    : scale(1.05);
}
.dis-cat-pill:hover .dis-cat-pill-label { color: var(--dis-text); }

/* Active */
.dis-cat-pill--active .dis-cat-pill-circle {
    border-color : var(--dis-green);
    background   : #fff;
    box-shadow   : 0 0 0 3px rgba(0,166,81,.12);
}
.dis-cat-pill--active .dis-cat-pill-label { color: var(--dis-green); font-weight: 800; }

/* ── Content area ─────────────────────────────────────────────────────────── */
.dis-store-content {
    max-width : var(--dis-max);
    margin    : 0 auto;
    padding   : 24px 20px 80px;
    /* Extra top padding so sticky nav doesn't overlap first section header */
    scroll-padding-top: 200px;
}

/* ── Section ──────────────────────────────────────────────────────────────── */
.dis-section { margin-bottom: 36px; }
.dis-section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.dis-section-title { font-size: 22px; font-weight: 800; margin: 0; color: var(--dis-text); }
.dis-view-more-btn { background: transparent; border: none; color: var(--dis-green); font-size: 14px; font-weight: 700; cursor: pointer; font-family: var(--dis-font); }
.dis-view-more-btn:hover { text-decoration: underline; }

/* ── Product carousel (horizontal scroll) ────────────────────────────────── */
.dis-product-carousel-outer { position: relative; }

.dis-product-carousel {
    display            : flex;
    gap                : 14px;
    overflow-x         : auto;
    padding-bottom     : 12px;
    scroll-behavior    : smooth;
    scrollbar-width    : none;
    -ms-overflow-style : none;
}
.dis-product-carousel::-webkit-scrollbar { display: none; }
.dis-product-carousel .dis-product-card { flex: 0 0 185px; min-width: 185px; }

/* Carousel arrow buttons */
.dis-carousel-btn {
    position      : absolute;
    top           : 50%;
    transform     : translateY(-50%);
    width         : 38px;
    height        : 38px;
    border-radius : 50% !important; /* important to beat Astra */
    background    : #fff !important;
    border        : 1.5px solid var(--dis-border) !important;
    box-shadow    : 0 2px 8px rgba(0,0,0,.12);
    display       : flex;
    align-items   : center;
    justify-content: center;
    cursor        : pointer;
    z-index       : 10;
    transition    : box-shadow .15s, background .15s;
    padding       : 0;
    line-height   : 1;
}
.dis-carousel-btn:hover { background: var(--dis-bg) !important; box-shadow: 0 4px 12px rgba(0,0,0,.16); }
.dis-carousel-btn svg { width: 18px; height: 18px; color: var(--dis-text); }
.dis-carousel-btn--prev { left: -18px; }
.dis-carousel-btn--next { right: -18px; }
.dis-carousel-btn[disabled] { opacity: 0; pointer-events: none; }

/* ── Product grid (for "All" tab / search results) ────────────────────────── */
.dis-products-grid {
    display               : grid;
    grid-template-columns : repeat(auto-fill, minmax(185px, 1fr));
    gap                   : 16px;
}

/* ── Product card ─────────────────────────────────────────────────────────── */
.dis-product-card {
    background    : var(--dis-card);
    border-radius : var(--dis-radius);
    border        : 1px solid var(--dis-border);
    overflow      : hidden;
    display       : flex;
    flex-direction: column;
    transition    : box-shadow .2s, transform .15s;
}
.dis-product-card:hover { box-shadow: var(--dis-shadow-h); transform: translateY(-2px); }
.dis-product-card--oos  { opacity: .6; }

/* Image wrap */
.dis-product-img-wrap {
    position     : relative;
    background   : #fff;
    aspect-ratio : 1;
    overflow     : hidden;
}
.dis-product-img-link { display: block; width: 100%; height: 100%; }
.dis-product-img {
    width      : 100%;
    height     : 100%;
    object-fit : contain;
    padding    : 12px;
    transition : transform .2s;
}
.dis-product-card:hover .dis-product-img { transform: scale(1.04); }

/* ── ADD BUTTON — forced circle, Astra-proof ──────────────────────────────── */
/* We use !important only here to specifically beat Astra's global button reset */
.dis-store-wrap .dis-add-btn,
.dis-store-wrap button.dis-add-btn,
.dis-store-wrap a.dis-add-btn {
    position        : absolute !important;
    top             : 8px !important;
    right           : 8px !important;
    width           : 36px !important;
    height          : 36px !important;
    min-width       : 36px !important;
    min-height      : 36px !important;
    max-width       : 36px !important;
    max-height      : 36px !important;
    border-radius   : 50% !important;
    background      : var(--dis-green) !important;
    border          : none !important;
    color           : #fff !important;
    display         : flex !important;
    align-items     : center !important;
    justify-content : center !important;
    padding         : 0 !important;
    margin          : 0 !important;
    cursor          : pointer !important;
    box-shadow      : 0 2px 10px rgba(0,166,81,.4) !important;
    transition      : background .15s, transform .1s, box-shadow .15s !important;
    text-decoration : none !important;
    z-index         : 5 !important;
    line-height     : 1 !important;
    flex-shrink     : 0 !important;
}
.dis-store-wrap .dis-add-btn svg { width: 18px !important; height: 18px !important; display: block !important; }
.dis-store-wrap .dis-add-btn:hover  { background: var(--dis-green-h) !important; transform: scale(1.1) !important; box-shadow: 0 4px 14px rgba(0,166,81,.5) !important; }
.dis-store-wrap .dis-add-btn:active { transform: scale(0.93) !important; }
.dis-store-wrap .dis-add-btn--loading { background: #aaa !important; pointer-events: none !important; }
.dis-store-wrap .dis-add-btn--done   { background: var(--dis-green-h) !important; }

/* OOS overlay */
.dis-oos-overlay {
    position   : absolute;
    inset      : 0;
    background : rgba(255,255,255,.65);
    display    : flex;
    align-items: center;
    justify-content: center;
    font-size  : 12px;
    font-weight: 700;
    color      : var(--dis-text-2);
}

/* ── Card body ────────────────────────────────────────────────────────────── */
.dis-product-body { padding: 10px 12px 14px; flex: 1; display: flex; flex-direction: column; gap: 5px; }

/* Price */
.dis-price-wrap { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.dis-price { display: flex; align-items: flex-start; font-weight: 800; color: var(--dis-text); line-height: 1; }
.dis-price-symbol  { font-size: 14px; margin-top: 3px; font-weight: 700; }
.dis-price-dollars { font-size: 28px; line-height: 1; }
.dis-price-cents   { font-size: 14px; margin-top: 3px; font-weight: 700; }
.dis-price-original { font-size: 12px; color: var(--dis-text-2); text-decoration: line-through; align-self: center; }
.dis-price-original ins { text-decoration: none; }

/* Badges */
.dis-badges { display: flex; gap: 5px; flex-wrap: wrap; }
.dis-badge {
    display       : inline-block;
    border-radius : 5px;
    padding       : 3px 8px;
    font-size     : 11px;
    font-weight   : 800;
    text-transform: uppercase;
}
.dis-badge--ebt  { background: var(--dis-ebt);    color: #fff; }
.dis-badge--sale { background: var(--dis-orange);  color: #fff; }

/* Product name */
.dis-product-name { font-size: 13px; font-weight: 500; color: var(--dis-text); text-decoration: none; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.dis-product-name:hover { text-decoration: underline; }

/* Stars */
.dis-rating { display: flex; align-items: center; gap: 2px; }
.dis-star { width: 13px; height: 13px; fill: none; stroke: #d1d5db; stroke-width: 1.5; }
.dis-star--filled { fill: #f59e0b; stroke: #f59e0b; }
.dis-rating-count { font-size: 12px; color: var(--dis-text-2); margin-left: 3px; }
.dis-rating--empty .dis-star { stroke: #e5e7eb; }
.dis-rating-count--none { font-size: 11px; color: #bbbec4; font-style: italic; }

/* Size */
.dis-product-size { font-size: 12px; color: var(--dis-text-2); }

/* Stock */
.dis-stock { display: flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 500; margin-top: auto; padding-top: 4px; }
.dis-stock-icon { width: 14px; height: 14px; }
.dis-stock--in  { color: var(--dis-text-2); }
.dis-stock--out { color: var(--dis-red); }

/* ── Floating cart bar removed; site/theme cart is used instead. ─────────── */
.dis-cart-bar { display: none !important; }

/* ── Load more ────────────────────────────────────────────────────────────── */
.dis-load-more-wrap { text-align: center; padding: 24px 0 0; }
.dis-load-more-btn { background: #fff; border: 1.5px solid var(--dis-border); border-radius: 999px; padding: 12px 32px; font-size: 14px; font-weight: 700; cursor: pointer; color: var(--dis-text); font-family: var(--dis-font); transition: background .15s; }
.dis-load-more-btn:hover { background: var(--dis-bg); }

/* ── Empty / loading ──────────────────────────────────────────────────────── */
.dis-empty { grid-column: 1/-1; text-align: center; color: var(--dis-text-2); font-size: 15px; padding: 40px 20px; }
.dis-loading-overlay { text-align: center; padding: 32px; }
.dis-spinner { display: inline-block; width: 24px; height: 24px; border: 3px solid var(--dis-border); border-top: 3px solid var(--dis-green); border-radius: 50%; animation: dis-spin .7s linear infinite; }
@keyframes dis-spin { to { transform: rotate(360deg); } }



/* Force category buttons to stay clean even when the theme adds focus/active backgrounds. */
.dis-store-wrap button.dis-cat-pill,
.dis-store-wrap button.dis-cat-pill:hover,
.dis-store-wrap button.dis-cat-pill:focus,
.dis-store-wrap button.dis-cat-pill:active {
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}
.dis-store-wrap button.dis-cat-pill:focus-visible .dis-cat-pill-circle {
    outline: 2px solid rgba(0,166,81,.35);
    outline-offset: 2px;
}

/* Cleaner product card alignment on mobile. */
.dis-product-card { min-height: 100%; }
.dis-product-img-wrap { min-height: 150px; }
.dis-product-name { min-height: 38px; }
.dis-rating { min-height: 18px; flex-wrap: nowrap; overflow: hidden; }
.dis-rating-count--none { white-space: nowrap; font-size: 10.5px; line-height: 1; }
.dis-sold-by { color: var(--dis-text-2); }

/* ── Responsive ───────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .dis-product-carousel .dis-product-card { flex: 0 0 160px; min-width: 160px; }
    .dis-products-grid { grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); }
    .dis-carousel-btn { display: none; }
}
@media (max-width: 680px) {
    .dis-header-inner  { flex-wrap: wrap; padding: 10px 14px; }
    .dis-store-search  { max-width: 100%; width: 100%; min-height: 44px; border-radius: 16px; }
    .dis-store-search input { height: 42px; line-height: 42px; font-size: 14px; }
    .dis-store-content { padding: 16px 12px 80px; }
    .dis-section-title { font-size: 18px; }
    .dis-products-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .dis-product-carousel .dis-product-card { flex: 0 0 148px; min-width: 148px; }
    .dis-banner { height: 120px; }
    .dis-search-sticky { padding: 8px 12px; }
}
@media (max-width: 380px) {
    .dis-products-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
}

/* ── Subcategory row — also circles, slightly smaller ─────────────────────── */
.dis-subcat-wrap {
    position   : sticky;
    top        : calc( var(--dis-adminbar-h) + var(--dis-searchbar-h) );
    z-index    : 110;
    background : #f7f8f9;
    border-bottom : 1px solid var(--dis-border);
    box-shadow : 0 2px 6px rgba(0,0,0,.05);
    overflow-x : auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.dis-subcat-wrap::-webkit-scrollbar { display: none; }

.dis-subcat-carousel {
    padding : 12px 16px;
    gap     : 4px;
}

/* Subcategory circle pills — 52px circles */
.dis-subcat-carousel .dis-cat-pill {
    width     : 68px;
    min-width : 68px;
}

.dis-subcat-carousel .dis-cat-pill .dis-cat-pill-circle {
    width  : 52px;
    height : 52px;
    border : 2px solid transparent;
    background: #e8e9eb;
}

.dis-subcat-carousel .dis-cat-pill .dis-cat-pill-circle svg {
    width  : 24px;
    height : 24px;
}

.dis-subcat-carousel .dis-cat-pill .dis-cat-pill-label {
    font-size : 11px;
    max-width : 64px;
}

.dis-subcat-carousel .dis-cat-pill--active .dis-cat-pill-circle {
    border-color : var(--dis-green);
    background   : #e8f5ee;
    box-shadow   : 0 0 0 3px rgba(0,166,81,.12);
}
.dis-subcat-carousel .dis-cat-pill--active .dis-cat-pill-label {
    color: var(--dis-green);
}


/* Search result states */
.dis-search-note {
    grid-column : 1 / -1;
    color       : var(--dis-text-2);
    font-size   : 14px;
    padding     : 18px 4px;
}
.dis-search-error {
    grid-column : 1 / -1;
    color       : var(--dis-red);
    background  : #fff5f4;
    border      : 1px solid rgba(230,59,46,.16);
    border-radius: var(--dis-radius);
    padding     : 14px;
    font-size   : 14px;
}

/* Clear search button */
.dis-clear-search-btn {
    background  : transparent;
    border      : none;
    color       : var(--dis-red);
    font-size   : 13px;
    font-weight : 600;
    cursor      : pointer;
    font-family : var(--dis-font);
}

/* ── Hide Dokan's default product search bar & WC sorting dropdown ──────── */
/* These are injected by dokan_store_profile_frame_after / WooCommerce hooks  */
/* and are redundant with the theme's own sticky search in the header.        */
.dokan-store-page .dokan-product-listing-filter-inner,
.dokan-store-page .dokan-w9,
.dokan-store-page .woocommerce-ordering,
.dokan-store-page select[name="orderby"],
.dokan-store-page .dokan-list-inline .store-search,
.dokan-store-page form.woocommerce-ordering,
.dis-store-wrap ~ .woocommerce-ordering,
.dis-store-content .woocommerce-ordering,
.dis-store-content .dokan-store-listing-filter-wrapper,
.dis-store-content .dokan-w9:has(input[type="text"]),
.dis-store-content .dokan-store-tabs { display: none !important; }

/* Smart live-search loading placeholders */
.dis-search-skeleton {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 14px;
    padding: 4px 0;
}
.dis-search-skeleton span {
    display: block;
    min-height: 210px;
    border-radius: var(--dis-radius);
    border: 1px solid var(--dis-border);
    background: linear-gradient(90deg, #f4f6f8 0%, #eef2f6 50%, #f4f6f8 100%);
    background-size: 220% 100%;
    animation: dis-search-shimmer 1s ease-in-out infinite;
}
@keyframes dis-search-shimmer {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

/* ==========================================================================
   Business Type Professional Designs v1.1.0
   Grocery keeps the original Instacart style. Other store types get a
   professional category-specific visual system.
   ========================================================================== */
.dis-store-wrap.dis-store--pro {
    --dis-type-accent: #111827;
    --dis-type-accent-2: #374151;
    --dis-type-soft: #f3f4f6;
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 280px);
}
.dis-store--pro .dis-delivery-bar { background: var(--dis-type-accent); color: #fff; }
.dis-store--pro .dis-store-header {
    max-width: var(--dis-max);
    margin: 18px auto 0;
    border-radius: 28px;
    overflow: hidden;
    background: linear-gradient(135deg, var(--dis-type-accent), var(--dis-type-accent-2));
    color: #fff;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .18);
}
.dis-store--pro .dis-banner { min-height: 190px; opacity: .28; filter: saturate(1.1) contrast(1.05); }
.dis-store--pro .dis-header-inner { background: transparent; padding: 28px; }
.dis-store--pro .dis-store-logo {
    width: 92px; height: 92px; border-radius: 24px;
    border: 4px solid rgba(255,255,255,.86);
    box-shadow: 0 14px 34px rgba(0,0,0,.25);
    background: #fff;
}
.dis-store--pro .dis-store-name {
    color: #fff;
    font-size: clamp(30px, 4vw, 52px);
    letter-spacing: -.045em;
    line-height: 1;
    text-shadow: 0 2px 10px rgba(0,0,0,.18);
}
.dis-store--pro .dis-store-rating,
.dis-store--pro .dis-store-address { color: rgba(255,255,255,.88); }
.dis-business-type-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin: 8px 0;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.18);
    color: #fff;
    border: 1px solid rgba(255,255,255,.26);
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.dis-store--pro .dis-store-search {
    background: rgba(255,255,255,.96);
    border: 0;
    box-shadow: 0 14px 34px rgba(15,23,42,.14);
    border-radius: 999px;
}
.dis-store--pro .dis-sticky-nav {
    max-width: var(--dis-max);
    margin: 16px auto 0;
    border-radius: 24px;
    border: 1px solid rgba(226,232,240,.95);
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(10px);
    box-shadow: 0 12px 34px rgba(15,23,42,.08);
    overflow: hidden;
}
.dis-store--pro .dis-cat-pill-circle {
    border-radius: 18px;
    background: var(--dis-type-soft);
    border: 1px solid rgba(15,23,42,.08);
}
.dis-store--pro .dis-cat-pill--active .dis-cat-pill-circle,
.dis-store--pro .dis-cat-pill:hover .dis-cat-pill-circle {
    background: var(--dis-type-accent);
    color: #fff;
    box-shadow: 0 10px 24px rgba(15,23,42,.16);
}
.dis-store--pro .dis-cat-pill--active .dis-cat-pill-label { color: var(--dis-type-accent); }
.dis-pro-intro {
    max-width: var(--dis-max);
    margin: 18px auto 0;
    border-radius: 28px;
    padding: 28px;
    display: flex;
    justify-content: space-between;
    gap: 22px;
    align-items: center;
    background: radial-gradient(circle at 10% 0%, rgba(255,255,255,.88), transparent 34%), linear-gradient(135deg, var(--dis-type-soft), #fff);
    border: 1px solid rgba(226,232,240,.96);
    box-shadow: 0 12px 34px rgba(15,23,42,.06);
}
.dis-pro-kicker { color: var(--dis-type-accent); font-size: 13px; font-weight: 1000; text-transform: uppercase; letter-spacing: .08em; }
.dis-pro-intro h2 { margin: 8px 0; font-size: clamp(26px, 3vw, 42px); line-height: 1; letter-spacing: -.045em; }
.dis-pro-intro p { margin: 0; max-width: 620px; color: #667085; font-size: 16px; font-weight: 700; }
.dis-pro-intro-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.dis-pro-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 18px;
    border-radius: 999px;
    background: var(--dis-type-accent);
    color: #fff !important;
    text-decoration: none !important;
    border: 0;
    font-weight: 900;
    cursor: pointer;
}
.dis-pro-action--ghost { background: #fff; color: var(--dis-type-accent) !important; border: 1px solid rgba(15,23,42,.12); }
.dis-store--pro .dis-store-content {
    max-width: var(--dis-max);
    margin: 20px auto 0;
    padding-left: 0;
    padding-right: 0;
}
.dis-store--pro .dis-section {
    background: #fff;
    border: 1px solid #edf0f5;
    border-radius: 28px;
    padding: 20px;
    box-shadow: 0 10px 28px rgba(15,23,42,.05);
    margin-bottom: 18px;
}
.dis-store--pro .dis-section-title { font-size: 28px; letter-spacing: -.035em; }
.dis-store--pro .dis-view-more-btn,
.dis-store--pro .dis-load-more-btn {
    border-radius: 999px;
    background: var(--dis-type-soft);
    color: var(--dis-type-accent);
    border: 1px solid rgba(15,23,42,.08);
}
.dis-store--pro .dis-product-card {
    border-radius: 24px;
    border: 1px solid #edf0f5;
    box-shadow: 0 8px 26px rgba(15,23,42,.06);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.dis-store--pro .dis-product-card:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(15,23,42,.10); border-color: rgba(15,23,42,.16); }
.dis-store--pro .dis-add-btn,
.dis-store--pro .dis-add-btn-small { background: var(--dis-type-accent); }
.dis-store--pro .dis-sale-badge { background: var(--dis-type-accent); color: #fff; }

.dis-store--type-restaurant { --dis-type-accent: #b45309; --dis-type-accent-2: #1f1308; --dis-type-soft: #fff7ed; }
.dis-store--type-restaurant .dis-store-header { background: radial-gradient(circle at 20% 0%, rgba(251,191,36,.38), transparent 30%), linear-gradient(135deg, #1f1308, #92400e); }
.dis-store--type-restaurant .dis-product-card { display: grid; grid-template-columns: 116px 1fr; align-items: center; gap: 12px; min-width: 340px; }
.dis-store--type-restaurant .dis-product-img-wrap { min-height: 116px; padding: 10px; }
.dis-store--type-restaurant .dis-product-info { padding-left: 0; }

.dis-store--type-bakery { --dis-type-accent: #c2410c; --dis-type-accent-2: #7c2d12; --dis-type-soft: #fff1e7; }
.dis-store--type-bakery .dis-store-header { background: radial-gradient(circle at 10% 10%, rgba(254,215,170,.6), transparent 32%), linear-gradient(135deg, #7c2d12, #ea580c); }
.dis-store--type-bakery .dis-product-card { border-radius: 30px; background: linear-gradient(180deg, #fffaf5, #fff); }

.dis-store--type-beauty { --dis-type-accent: #be185d; --dis-type-accent-2: #7e22ce; --dis-type-soft: #fdf2f8; }
.dis-store--type-beauty .dis-store-header { background: radial-gradient(circle at 85% 5%, rgba(244,114,182,.45), transparent 34%), linear-gradient(135deg, #831843, #7e22ce); }
.dis-store--type-beauty .dis-product-img-wrap { background: linear-gradient(180deg, #fdf2f8, #fff); }

.dis-store--type-apparel { --dis-type-accent: #111827; --dis-type-accent-2: #4b5563; --dis-type-soft: #f5f5f4; }
.dis-store--type-apparel .dis-store-header { background: linear-gradient(135deg, #111827, #525252); }
.dis-store--type-apparel .dis-product-card { border-radius: 8px; }
.dis-store--type-apparel .dis-product-img-wrap { min-height: 260px; background: #f3f4f6; }

.dis-store--type-electronics { --dis-type-accent: #2563eb; --dis-type-accent-2: #0f172a; --dis-type-soft: #eff6ff; }
.dis-store--type-electronics .dis-store-header { background: radial-gradient(circle at 80% 0%, rgba(59,130,246,.45), transparent 32%), linear-gradient(135deg, #0f172a, #1d4ed8); }
.dis-store--type-electronics .dis-product-img-wrap { background: radial-gradient(circle, #eff6ff, #fff 68%); }

.dis-store--type-pharmacy { --dis-type-accent: #0f766e; --dis-type-accent-2: #075985; --dis-type-soft: #ecfeff; }
.dis-store--type-pharmacy .dis-store-header { background: linear-gradient(135deg, #0f766e, #075985); }
.dis-store--type-pharmacy .dis-product-img-wrap { background: #f0fdfa; }

.dis-store--type-furniture { --dis-type-accent: #7c3f1d; --dis-type-accent-2: #44403c; --dis-type-soft: #fafaf9; }
.dis-store--type-furniture .dis-store-header { background: linear-gradient(135deg, #44403c, #92400e); }
.dis-store--type-furniture .dis-product-img-wrap { min-height: 230px; background: #fafaf9; }

.dis-store--type-alcohol { --dis-type-accent: #7f1d1d; --dis-type-accent-2: #111827; --dis-type-soft: #fef2f2; }
.dis-store--type-alcohol .dis-store-header { background: linear-gradient(135deg, #111827, #7f1d1d); }

.dis-store--type-express { --dis-type-accent: #ea580c; --dis-type-accent-2: #c2410c; --dis-type-soft: #fff7ed; }
.dis-store--type-express .dis-store-header { background: linear-gradient(135deg, #ea580c, #f59e0b); }

.dis-store--type-retail { --dis-type-accent: #4f46e5; --dis-type-accent-2: #111827; --dis-type-soft: #eef2ff; }
.dis-store--type-retail .dis-store-header { background: linear-gradient(135deg, #111827, #4f46e5); }

.dis-store--type-pets { --dis-type-accent: #f97316; --dis-type-accent-2: #7c2d12; --dis-type-soft: #fff7ed; }
.dis-store--type-sports { --dis-type-accent: #16a34a; --dis-type-accent-2: #0f172a; --dis-type-soft: #f0fdf4; }
.dis-store--type-toys { --dis-type-accent: #db2777; --dis-type-accent-2: #7c3aed; --dis-type-soft: #fdf2f8; }
.dis-store--type-books { --dis-type-accent: #1d4ed8; --dis-type-accent-2: #0f172a; --dis-type-soft: #eff6ff; }
.dis-store--type-flowers { --dis-type-accent: #be185d; --dis-type-accent-2: #16a34a; --dis-type-soft: #fdf2f8; }

@media (max-width: 768px) {
    .dis-store--pro .dis-store-header { margin: 8px 10px 0; border-radius: 22px; }
    .dis-store--pro .dis-header-inner { padding: 20px; }
    .dis-store--pro .dis-store-logo { width: 78px; height: 78px; border-radius: 20px; }
    .dis-store--pro .dis-sticky-nav,
    .dis-pro-intro,
    .dis-store--pro .dis-store-content { margin-left: 10px; margin-right: 10px; }
    .dis-pro-intro { flex-direction: column; align-items: stretch; padding: 20px; }
    .dis-pro-intro-actions { width: 100%; }
    .dis-pro-action { flex: 1; }
    .dis-store--type-restaurant .dis-product-card { grid-template-columns: 96px 1fr; min-width: 300px; }
    .dis-store--type-apparel .dis-product-img-wrap,
    .dis-store--type-furniture .dis-product-img-wrap { min-height: 190px; }
}


/* Aramitus service/event business type themes — added for mixed marketplace vendors. */
.dis-store--type-barber { --dis-type-accent: #111827; --dis-type-accent-2: #374151; --dis-type-soft: #f3f4f6; }
.dis-store--type-barber .dis-store-header { background: radial-gradient(circle at 12% 0%, rgba(239,68,68,.28), transparent 30%), linear-gradient(135deg, #030712, #374151); }
.dis-store--type-spa { --dis-type-accent: #0f766e; --dis-type-accent-2: #115e59; --dis-type-soft: #ecfdf5; }
.dis-store--type-spa .dis-store-header { background: radial-gradient(circle at 80% 0%, rgba(153,246,228,.46), transparent 34%), linear-gradient(135deg, #064e3b, #0f766e); }
.dis-store--type-car-wash { --dis-type-accent: #0284c7; --dis-type-accent-2: #0f172a; --dis-type-soft: #eff6ff; }
.dis-store--type-car-wash .dis-store-header { background: radial-gradient(circle at 82% 5%, rgba(186,230,253,.55), transparent 35%), linear-gradient(135deg, #0f172a, #0284c7); }
.dis-store--type-club, .dis-store--type-party, .dis-store--type-festival, .dis-store--type-event { --dis-type-accent: #7c3aed; --dis-type-accent-2: #111827; --dis-type-soft: #f5f3ff; }
.dis-store--type-club .dis-store-header { background: radial-gradient(circle at 20% 0%, rgba(236,72,153,.45), transparent 30%), linear-gradient(135deg, #111827, #581c87); }
.dis-store--type-party .dis-store-header { background: radial-gradient(circle at 18% 0%, rgba(251,191,36,.55), transparent 32%), linear-gradient(135deg, #7c2d12, #db2777); }
.dis-store--type-festival .dis-store-header { background: radial-gradient(circle at 15% 0%, rgba(250,204,21,.48), transparent 32%), linear-gradient(135deg, #7f1d1d, #ea580c); }
.dis-store--type-event .dis-store-header { background: radial-gradient(circle at 85% 0%, rgba(167,139,250,.45), transparent 34%), linear-gradient(135deg, #1e1b4b, #7c3aed); }
.dis-store--type-plumber { --dis-type-accent: #0369a1; --dis-type-accent-2: #0f172a; --dis-type-soft: #e0f2fe; }
.dis-store--type-plumber .dis-store-header { background: radial-gradient(circle at 82% 8%, rgba(125,211,252,.48), transparent 34%), linear-gradient(135deg, #0f172a, #0369a1); }
.dis-store--type-electrician { --dis-type-accent: #ca8a04; --dis-type-accent-2: #111827; --dis-type-soft: #fef9c3; }
.dis-store--type-electrician .dis-store-header { background: radial-gradient(circle at 20% 0%, rgba(250,204,21,.55), transparent 34%), linear-gradient(135deg, #111827, #854d0e); }
.dis-store--type-contractor { --dis-type-accent: #b45309; --dis-type-accent-2: #292524; --dis-type-soft: #fff7ed; }
.dis-store--type-contractor .dis-store-header { background: radial-gradient(circle at 85% 4%, rgba(253,186,116,.48), transparent 34%), linear-gradient(135deg, #292524, #b45309); }
.dis-store--type-barber .dis-product-card,
.dis-store--type-spa .dis-product-card,
.dis-store--type-car-wash .dis-product-card,
.dis-store--type-plumber .dis-product-card,
.dis-store--type-electrician .dis-product-card,
.dis-store--type-contractor .dis-product-card { border-radius: 24px; }
.dis-store--type-club .dis-product-card,
.dis-store--type-party .dis-product-card,
.dis-store--type-festival .dis-product-card,
.dis-store--type-event .dis-product-card { border-radius: 18px; border-color: rgba(124,58,237,.16); }