/* ==========================================================================
   _modules.css
   Third-party overrides — Purpletree Marketplace.
   
   Scope rule: every selector below is prefixed with a Purpletree route
   body class to prevent leaking styles to unrelated pages.
   
   Breakpoint alignment:
   - Theme standard:  @media (max-width: 768px)
   - Purpletree:      @media (max-width: 767px)
   - Resolution: theme wins at 768px; Purpletree module-specific rules
     below explicitly handle 767px where the module's own CSS fires.
   
   Audit reference: THEME_STYLING_GUIDE §E, §F, §G
   No CSS filters applied to .pts-rating-box — star sprite preserved.
   ========================================================================== */

/* ==========================================================================
   COMMON ACROSS PURPLETREE ROUTES
   ========================================================================== */

/* Buttons — override #1979c2 with Strata gold */
.marketplace-index-index .pts-newbtn,
.marketplace-seller-view .pts-newbtn,
.marketplace-index-productedit .pts-newbtn,
.marketplace-index-orders .pts-newbtn,
.marketplace-seller-view .pts-seller-submit,
.marketplace-index-products .pts-newbtn {
    background: var(--gold, #B8893A) !important;
    border-color: var(--gold, #B8893A) !important;
    color: var(--obsidian, #1C1612) !important;
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif) !important;
    font-size: var(--text-sm, 0.8125rem) !important;
    font-weight: var(--font-weight-medium, 500) !important;
    min-height: 2.25rem !important;
    border-radius: var(--radius-md, 0.75rem) !important;
    padding: var(--sp-2, 0.5rem) var(--sp-4, 1rem) !important;
    transition:
        background 0.15s var(--ease-out-expo, cubic-bezier(0.16, 1, 0.5, 1)),
        border-color 0.15s var(--ease-out-expo, cubic-bezier(0.16, 1, 0.5, 1));
}

.marketplace-index-index .pts-newbtn-next,
.marketplace-seller-view .pts-newbtn-next,
.marketplace-index-productedit .pts-newbtn-next {
    display: inline-block;
    text-align: center;
}
.marketplace-index-index .pts-newbtn-next span,
.marketplace-seller-view .pts-newbtn-next span,
.marketplace-index-productedit .pts-newbtn-next span {
    display: inline-block;
    margin: 0;
    padding: 0;
    background: none;
    text-shadow: none;
}

.action.primary.pts-newbtn:hover,
.pts-newbtn:hover {
    background: var(--gold-light, #D4A85C) !important;
    border-color: var(--gold-light, #D4A85C) !important;
}

/* Wrapper action buttons — convert to flex */
.marketplace-index-products .actions-toolbar,
.marketplace-index-productedit .actions-toolbar {
    gap: var(--sp-3, 0.75rem);
}
.marketplace-index-products .actions-toolbar .actions-primary,
.marketplace-index-products .actions-toolbar .actions-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2, 0.5rem);
}
.marketplace-index-productedit .action-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3, 0.75rem);
    justify-content: flex-end;
}
.marketplace-index-productedit .action-wrap-prev,
.marketplace-index-productedit .action-wrap-next {
    display: flex;
    gap: var(--sp-2, 0.5rem);
}


/* ==========================================================================
   SELLER CARDS / STOREFRONT
   ========================================================================== */

.marketplace-seller-view .purpletree_seller {
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-xl, 0.875rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    box-shadow: var(--shadow-sm, 0 1px 2px rgba(28, 22, 18, 0.06));
    padding: var(--sp-5, 1.25rem);
    transition:
        transform var(--motion-duration-normal, 0.3s) cubic-bezier(0.25, 0.46, 0.45, 0.94),
        box-shadow var(--motion-duration-normal, 0.3s) cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.marketplace-seller-view .purpletree_seller:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg, 0 12px 40px rgba(28, 22, 18, 0.15));
}

.marketplace-seller-view .purpletree_seller .product_count {
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
    font-size: var(--text-sm, 0.8125rem);
    color: var(--color-text-muted, #7A6A52);
}

.marketplace-seller-view .pts-store-banner {
    border-radius: var(--radius-lg, 0.875rem) var(--radius-lg, 0.875rem) 0 0;
    overflow: hidden;
}
.marketplace-seller-view .pts-store-logo {
    border-radius: var(--radius-md, 0.75rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    background: var(--card, #FDFAF4);
    object-fit: contain;
}
.marketplace-seller-view .pts-store-info-block {
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-lg, 0.875rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    padding: var(--sp-4, 1rem);
}

/* Seller dashboard nav */
.block-collapsible-nav.pts-main {
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-lg, 0.875rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    overflow: hidden;
}

.block-collapsible-nav.pts-main .block-collapsible-nav-title {
    background: transparent;
    border: 0;
    color: var(--color-text, #1C1612);
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--font-weight-medium, 500);
}

.block-collapsible-nav.pts-main .block-collapsible-nav-title strong {
    font-weight: inherit;
}

.block-collapsible-nav.pts-main .block-collapsible-nav-content {
    background: var(--card, #FDFAF4) !important;
    padding-top: 0 !important;
}

.block-collapsible-nav.pts-main .nav.item a,
.block-collapsible-nav.pts-main .nav.item > strong {
    border-left: 0;
    color: var(--color-text, #1C1612);
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
    font-size: var(--text-sm, 0.8125rem);
    padding: var(--sp-3, 0.75rem) var(--sp-4, 1rem);
}

.block-collapsible-nav.pts-main .nav.item a:hover,
.block-collapsible-nav.pts-main .nav.item a:focus {
    background: rgba(184, 137, 58, 0.08);
    color: var(--gold-dark, #8B6220);
    text-decoration: none;
}

.block-collapsible-nav.pts-main .nav.item.current a,
.block-collapsible-nav.pts-main .nav.item.current > strong {
    background: rgba(184, 137, 58, 0.08);
    color: var(--gold-dark, #8B6220);
    font-weight: var(--font-weight-medium, 500);
}

.pts-menu-heading {
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
    font-weight: var(--font-weight-medium, 500);
    font-size: var(--text-base, 0.875rem);
    color: var(--color-text, #1C1612);
    padding: var(--sp-4, 1rem);
    border-bottom: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    background: transparent;
}

@media (max-width: 767px) {
    .block-collapsible-nav.pts-main {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        z-index: auto !important;
        width: 100%;
        margin: 0 0 var(--sp-4, 1rem);
    }

    .block-collapsible-nav.pts-main .block-collapsible-nav-title {
        display: block;
        padding: var(--sp-3, 0.75rem) 2.75rem var(--sp-3, 0.75rem) var(--sp-4, 1rem);
        cursor: pointer;
    }

    .block-collapsible-nav.pts-main .block-collapsible-nav-title::after {
        content: '';
        position: absolute;
        top: 50%;
        right: var(--sp-4, 1rem);
        width: 0.45rem;
        height: 0.45rem;
        margin: -0.25rem 0 0;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg);
        transition: transform 0.18s var(--ease-out-expo, ease);
    }

    .block-collapsible-nav.pts-main .block-collapsible-nav-title.active::after {
        transform: rotate(-135deg);
    }

    .block-collapsible-nav.pts-main .block-collapsible-nav-content {
        display: none;
        border: 0;
        border-top: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    }

    .block-collapsible-nav.pts-main .block-collapsible-nav-content.active {
        display: block;
    }
}


/* ==========================================================================
   PRODUCT EDIT FORM — layout helpers (float → flex)
   ========================================================================== */

.marketplace-index-productedit .purpletree-lbl {
    float: none;
    width: auto;
    display: block;
    padding: var(--sp-2, 0.5rem) 0;
    font-weight: var(--font-weight-medium, 500);
    flex-shrink: 0;
    min-width: 10rem;
    text-align: right;
    padding-right: var(--sp-4, 1rem);
}

.marketplace-index-productedit .purpletree-lblryt {
    float: none;
    width: auto;
    display: block;
    padding: var(--sp-2, 0.5rem) 0;
}

.marketplace-index-productedit .purpletree-lgwidth {
    float: none;
    width: auto;
    display: block;
    max-width: 60%;
    margin-bottom: var(--sp-3, 0.75rem);
}

.marketplace-index-productedit .purpletree-shtwidth {
    float: none;
    width: auto;
    display: inline-block;
    max-width: 30%;
    margin-right: var(--sp-3, 0.75rem);
    margin-bottom: var(--sp-3, 0.75rem);
}

.marketplace-index-productedit ._has-datepicker,
.marketplace-index-productedit #weightoptn {
    float: none;
    width: auto;
    max-width: 12rem;
    display: inline-block;
}

/* Form layout wrapper — convert floats to flex rows */
.marketplace-index-productedit .purpletree-content > div[style*="float"],
.marketplace-index-productedit .field.row > div,
.marketplace-index-productedit .purpletree-lbl + .purpletree-lblryt,
.marketplace-index-productedit .purpletree-lbl + .purpletree-lgwidth,
.marketplace-index-productedit .purpletree-lbl + .purpletree-shtwidth {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--sp-3, 0.75rem);
}

.marketplace-index-productedit .purpletree-seprator {
    border: none;
    border-top: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    margin: var(--sp-6, 1.5rem) 0;
    padding: 0;
    cursor: default;
}

.marketplace-index-productedit .purpletree-tableproduct {
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-md, 0.75rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    overflow: hidden;
}
.marketplace-index-productedit .purpletree-tableproduct th {
    background: rgba(28, 22, 18, 0.03);
    font-weight: var(--font-weight-medium, 500);
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
}

.marketplace-index-productedit .purpletree-config,
.marketplace-index-productedit .purpletree-variations {
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-md, 0.75rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    padding: var(--sp-4, 1rem);
}


/* ==========================================================================
   FILTER UI — marketplace catalog pages
   ========================================================================== */

.marketplace-index-index .pts-group-filter,
.marketplace-sellers .pts-group-filter {
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-md, 0.75rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    padding: var(--sp-4, 1rem);
    margin-bottom: var(--sp-3, 0.75rem);
}

.marketplace-index-index .pts-filter-content,
.marketplace-sellers .pts-filter-content {
    padding: var(--sp-2, 0.5rem) 0;
}
.marketplace-index-index .pts-filter-current,
.marketplace-sellers .pts-filter-current {
    background: rgba(28, 22, 18, 0.03);
    border-radius: var(--radius-sm, 0.5rem);
    padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
    font-size: var(--text-sm, 0.8125rem);
}
.marketplace-index-index .pts-filter-label,
.marketplace-sellers .pts-filter-label {
    font-weight: var(--font-weight-medium, 500);
    color: var(--color-text, #1C1612);
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
}
.marketplace-index-index .pts-filter-value,
.marketplace-sellers .pts-filter-value {
    color: var(--color-text-muted, #7A6A52);
}
.marketplace-index-index .pts-items,
.marketplace-sellers .pts-items {
    list-style: none;
    padding: 0;
    margin: 0;
}
.marketplace-index-index .pts-items li,
.marketplace-sellers .pts-items li {
    padding: var(--sp-1, 0.25rem) 0;
}


/* ==========================================================================
   PAGINATION — module pager
   ========================================================================== */

.marketplace-index-index .pts-pagination,
.marketplace-sellers .pts-pagination {
    gap: var(--sp-1, 0.25rem);
}
.marketplace-index-index .pts-pagination .pts-item a,
.marketplace-sellers .pts-pagination .pts-item a,
.marketplace-index-index .pts-pagination .pts-item strong,
.marketplace-sellers .pts-pagination .pts-item strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
    border-radius: var(--radius-sm, 0.5rem);
    font-size: var(--text-sm, 0.8125rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    color: var(--color-text, #1C1612);
    text-decoration: none;
}
.marketplace-index-index .pts-pagination .pts-item a:hover,
.marketplace-sellers .pts-pagination .pts-item a:hover {
    border-color: var(--gold, #B8893A);
    color: var(--gold, #B8893A);
}
.marketplace-index-index .pts-pagination .pts-item strong,
.marketplace-sellers .pts-pagination .pts-item strong {
    background: var(--gold, #B8893A);
    border-color: var(--gold, #B8893A);
    color: var(--obsidian, #1C1612);
    font-weight: var(--font-weight-medium, 500);
}


/* ==========================================================================
   STAR RATINGS — preserve sprite, no CSS filters
   ========================================================================== */

.marketplace-seller-view .pts-rating-box,
.marketplace-index-index .pts-rating-box,
.marketplace-seller-view .pts-rating-review,
.marketplace-index-index .pts-rating-review {
    filter: none !important;
    -webkit-filter: none !important;
    background-image: url('../Purpletree/Marketplace/view/frontend/web/images/star20.png');
    background-repeat: repeat-x;
    background-position: 0 center;
    background-size: auto 100%;
}


/* ==========================================================================
   INPUT GROUPS — flexbox conversion
   ========================================================================== */

.marketplace-index-productedit .pts-input-group,
.marketplace-index-index .pts-input-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2, 0.5rem);
    margin-bottom: var(--sp-3, 0.75rem);
}
.marketplace-index-productedit .pts-input-group-addon,
.marketplace-index-index .pts-input-group-addon {
    background: var(--muted, #DDD4BC);
    color: var(--color-text-muted, #7A6A52);
    padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
    border-radius: var(--radius-sm, 0.5rem);
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
    font-size: var(--text-sm, 0.8125rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    border-right: none;
}
.marketplace-index-productedit .pts-input-group-btn,
.marketplace-index-index .pts-input-group-btn {
    display: flex;
    gap: var(--sp-1, 0.25rem);
}
.marketplace-index-productedit .pts-input-group input,
.marketplace-index-index .pts-input-group input {
    border-radius: var(--radius-sm, 0.5rem);
}
.marketplace-index-productedit .pts-input-group-addon + input,
.marketplace-index-index .pts-input-group-addon + input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: calc(var(--sp-1, 0.25rem) * -1);
}


/* ==========================================================================
   UTILITY / LAYOUT HELPERS
   ========================================================================== */

.marketplace-index-productedit .row-browes-pts,
.marketplace-index-index .row-browes-pts {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4, 1rem);
    align-items: flex-start;
}
.marketplace-index-productedit .column1,
.marketplace-seller-view .column1 {
    flex: 0 0 20%;
    min-width: 10rem;
}
.marketplace-index-productedit .column2,
.marketplace-seller-view .column2 {
    flex: 1 1 0;
    min-width: 0;
}

.marketplace-index-productedit .float-left,
.marketplace-index-index .float-left,
.marketplace-seller-view .float-left {
    float: none;
}
.marketplace-index-productedit .float-right,
.marketplace-index-index .float-right,
.marketplace-seller-view .float-right {
    float: none;
}

.marketplace-index-productedit .pts-text-center {
    text-align: center;
}
.marketplace-index-productedit :is(.purpletree-rmv, .purpletree-del, .purpletree-print, .pts-order-statuslink) {
    cursor: pointer;
    color: var(--color-link, #B8893A);
    font-size: var(--text-sm, 0.8125rem);
    padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
    border-radius: var(--radius-sm, 0.5rem);
    transition: background 0.15s var(--ease-out-expo, cubic-bezier(0.16, 1, 0.5, 1));
}
.marketplace-index-productedit :is(.purpletree-rmv, .purpletree-del, .purpletree-print, .pts-order-statuslink):hover {
    background: rgba(28, 22, 18, 0.04);
    color: var(--color-link-hover, #8B6220);
}

.marketplace-index-productedit .pts-margin-btm-zero {
    margin-bottom: 0;
}
.marketplace-index-productedit .pts-clear::after {
    content: '';
    display: table;
    clear: both;
}
.marketplace-index-productedit .pts-custmwid {
    max-width: 80rem;
    margin: 0 auto;
}


/* ==========================================================================
   SELLER REVIEWS
   ========================================================================== */

.marketplace-seller-view .pts-review-box,
.marketplace-index-index .pts-review-box {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4, 1rem);
    margin-bottom: var(--sp-4, 1rem);
}
.marketplace-seller-view .pts-review-left,
.marketplace-index-index .pts-review-left {
    flex: 0 0 auto;
    min-width: 8rem;
}
.marketplace-seller-view .pts-review-right,
.marketplace-index-index .pts-review-right {
    flex: 1 1 0;
    min-width: 0;
}
.marketplace-seller-view .pts-review-listing,
.marketplace-index-index .pts-review-listing {
    margin-top: var(--sp-2, 0.5rem);
}
.marketplace-seller-view .pts-review-text,
.marketplace-index-index .pts-review-text {
    font-size: var(--text-base, 0.875rem);
    line-height: 1.65;
}


/* ==========================================================================
   ORDERS / PAYMENT
   ========================================================================== */

.marketplace-index-orders .pts-seller-payment,
.marketplace-index-orders .pts-seller-dashboard,
.marketplace-index-sellerpayment .pts-seller-payment,
.marketplace-index-sellerpayment .pts-seller-dashboard {
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-lg, 0.875rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    padding: var(--sp-5, 1.25rem);
}
.marketplace-index-orders .pts-payment-tr td,
.marketplace-index-sellerpayment .pts-payment-tr td {
    padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
    border-bottom: 1px solid var(--border, rgba(28, 22, 18, 0.1));
}
.marketplace-index-orders .pts-order-box,
.marketplace-index-sellerpayment .pts-order-box {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4, 1rem);
    background: var(--card, #FDFAF4);
    border-radius: var(--radius-md, 0.75rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    padding: var(--sp-4, 1rem);
}
.marketplace-index-orders .pts-order-status,
.marketplace-index-sellerpayment .pts-order-status {
    padding: var(--sp-1, 0.25rem) var(--sp-2, 0.5rem);
    border-radius: var(--radius-sm, 0.5rem);
    font-size: var(--text-xs, 0.75rem);
    font-weight: var(--font-weight-medium, 500);
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
}
.marketplace-index-orders .pts-order-status.complete,
.marketplace-index-sellerpayment .pts-order-status.complete {
    background: rgba(47, 107, 58, 0.1);
    color: #2F6B3A;
}
.marketplace-index-orders .pts-order-status.pending,
.marketplace-index-sellerpayment .pts-order-status.pending {
    background: rgba(184, 137, 58, 0.15);
    color: var(--gold-dark, #8B6220);
}
.marketplace-index-orders .pts-order-status.canceled,
.marketplace-index-sellerpayment .pts-order-status.canceled {
    background: rgba(139, 47, 47, 0.1);
    color: var(--destructive, #8B2F2F);
}
.marketplace-index-orders .pts-btm-amount,
.marketplace-index-sellerpayment .pts-btm-amount {
    font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
    font-size: 1.125rem;
    font-weight: 400;
}
.marketplace-index-orders .pts-invoice-bottom,
.marketplace-index-sellerpayment .pts-invoice-bottom {
    border-top: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    margin-top: var(--sp-4, 1rem);
    padding-top: var(--sp-3, 0.75rem);
}


/* ==========================================================================
   SELLER GROUP TYPOGRAPHY OVERRIDES
   ========================================================================== */

.marketplace-index-index .seller_groups2,
.marketplace-seller-view .seller_groups2 {
    line-height: 1.6;
    font-size: var(--text-base, 0.875rem);
    color: var(--color-text, #1C1612);
}
.marketplace-seller-view .group22 {
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
    font-size: var(--text-base, 0.875rem);
    color: var(--color-text, #1C1612);
    line-height: 1.6;
}


/* ==========================================================================
   IMAGE THUMBNAILS
   ========================================================================== */

.marketplace-index-productedit .img-thumbnail,
.marketplace-index-products .img-thumbnail,
.marketplace-seller-view .img-thumbnail {
    border-radius: var(--radius-sm, 0.5rem);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    padding: var(--sp-1, 0.25rem);
    background: var(--card, #FDFAF4);
    cursor: pointer;
    transition: border-color 0.15s var(--ease-out-expo, cubic-bezier(0.16, 1, 0.5, 1));
}
.marketplace-index-productedit .img-thumbnail:hover,
.marketplace-index-products .img-thumbnail:hover,
.marketplace-seller-view .img-thumbnail:hover {
    border-color: var(--gold, #B8893A);
}


/* ==========================================================================
   FORM CONTROLS OVERRIDES — Purpletree form helpers
   ========================================================================== */

.marketplace-index-productedit .pts-form-control {
    background: var(--input-background, #FDFAF4);
    border: 1px solid var(--border, rgba(28, 22, 18, 0.1));
    border-radius: var(--radius-sm, 0.5rem);
    padding: var(--sp-2, 0.5rem) var(--sp-3, 0.75rem);
    font-family: var(--font-sans, 'Outfit', system-ui, sans-serif);
    font-size: var(--text-sm, 0.8125rem);
    color: var(--color-text, #1C1612);
    width: 100%;
    transition:
        border-color 0.15s var(--ease-out-expo, cubic-bezier(0.16, 1, 0.5, 1)),
        box-shadow 0.15s var(--ease-out-expo, cubic-bezier(0.16, 1, 0.5, 1));
}
.marketplace-index-productedit .pts-form-control:focus {
    outline: none;
    border-color: var(--ring, #B8893A);
    box-shadow: 0 0 0 3px rgba(184, 137, 58, 0.18), 0 0 0 1px var(--ring, #B8893A);
}


/* ==========================================================================
   RESPONSIVE — Purpletree module rules at 767px (explicit override)
   
   Note: theme uses 768px; Purpletree module uses 767px.
   The 1px gap is intentional per THEME_STYLING_GUIDE §Purpletree breakpoint.
   Theme wins at exactly 768px; module-specific rules below activate at 767px.
   ========================================================================== */

@media (max-width: 767px) {
    /* Purpletree float-based cols — column reverse on small screens */
    .marketplace-index-productedit .row-browes-pts,
    .marketplace-index-index .row-browes-pts {
        flex-direction: column-reverse;
    }
    .marketplace-index-productedit .column1,
    .marketplace-seller-view .column1 {
        flex: 1 1 100%;
        min-width: 100%;
    }
    .marketplace-index-productedit .column2,
    .marketplace-seller-view .column2 {
        flex: 1 1 100%;
        min-width: 100%;
    }

    /* Product edit form — stack label/value pairs */
    .marketplace-index-productedit .purpletree-lbl {
        text-align: left;
        padding-right: 0;
        padding-bottom: var(--sp-1, 0.25rem);
        min-width: 0;
    }
    .marketplace-index-productedit .purpletree-lblryt,
    .marketplace-index-productedit .purpletree-lgwidth,
    .marketplace-index-productedit .purpletree-shtwidth {
        max-width: 100%;
        flex: 1 1 100%;
    }

    /* pts-row columns → single column */
    .marketplace-index-productedit .pts-row {
        flex-direction: column;
    }
    .marketplace-index-productedit .pts-col-md-2,
    .marketplace-index-productedit .pts-col-md-3,
    .marketplace-index-productedit .pts-col-md-4,
    .marketplace-index-productedit .pts-col-md-5,
    .marketplace-index-productedit .pts-col-md-6,
    .marketplace-index-productedit .pts-col-sm-2,
    .marketplace-index-productedit .pts-col-sm-3,
    .marketplace-index-productedit .pts-col-sm-4,
    .marketplace-index-productedit .pts-col-sm-5,
    .marketplace-index-productedit .pts-col-sm-6,
    .marketplace-index-productedit .pts-col-xs-12,
    .marketplace-index-productedit .pts-col-xs-6 {
        flex: 1 1 100%;
        max-width: 100%;
        padding: 0;
        margin-bottom: var(--sp-3, 0.75rem);
    }

    /* Seller cards — single column */
    .marketplace-seller-view .purpletree_seller {
        margin-bottom: var(--sp-4, 1rem);
    }
    .pts-store-banner img {
        height: auto;
        aspect-ratio: 16 / 5;
        object-fit: cover;
    }

    /* pts-review two-col → stacked */
    .marketplace-seller-view .pts-review-box,
    .marketplace-index-index .pts-review-box {
        flex-direction: column;
    }
    .marketplace-seller-view .pts-review-left,
    .marketplace-index-index .pts-review-left,
    .marketplace-seller-view .pts-review-right,
    .marketplace-index-index .pts-review-right {
        flex: 1 1 100%;
        min-width: 100%;
    }
}

/* Tablet breakpoint — 768px (theme standard) */
@media (max-width: 768px) {
    .marketplace-index-productedit .purpletree-lbl {
        text-align: left;
        padding-right: 0;
        padding-bottom: var(--sp-1, 0.25rem);
        min-width: 0;
    }
    .marketplace-index-productedit .purpletree-lgwidth,
    .marketplace-index-productedit .purpletree-shtwidth {
        max-width: 100%;
    }
}