:root {
    --button-radius: 6px;
    --btn-height-standard: 42px;
    --btn-height-card: 38px;
    --btn-height-compact: 32px;
    --button-icon-size: 40px;
}

/* =========================================================
   Standard Button Design System
   ========================================================= */

/* 1. Global Reset & Interactive Focus */
:where(button, input[type="button"], input[type="submit"], input[type="reset"], [role="button"]):focus-visible,
:where(.b2b-button, .contact-button, .contact-submit, .market-slide__actions a, .market-hero__quote > a, .site-footer__whatsapp):focus-visible {
    outline: 3px solid rgba(10, 122, 50, 0.3) !important;
    outline-offset: 2px !important;
}

/* 2. Global Border Radius */
:where(
    button:not([data-market-dot]):not(.market-slider__dots button):not(.product-save-button),
    input[type="button"], input[type="submit"], input[type="reset"],
    .b2b-button, .contact-button, .contact-submit,
    .market-slide__actions a, .market-hero__quote > a,
    .site-footer__whatsapp, .site-footer__social-link,
    .customer-account__button, .product-card__details-link,
    .header-cart, .pagination-button, .premium-cart-btn, .shop-cart-add-btn,
    .cart-drawer__checkout, .cart-drawer__copy, .cart-item__remove,
    .shop-apply-filters, .shop-clear-filters, .shop-filter-toggle,
    .product-add-button, .product-secondary-actions a, .product-tabs button,
    .compact-pay-btn, .auth-submit, .otp-submit
) {
    border-radius: var(--button-radius) !important;
}

/* 3. Standard Primary & Form Action Buttons (42px) */
:where(
    input[type="submit"], input[type="button"], input[type="reset"],
    .b2b-button, .contact-button, .contact-submit,
    .market-slide__actions a, .market-hero__quote > a,
    .site-footer__whatsapp, .customer-account__button,
    .cart-drawer__checkout, .cart-drawer__copy,
    .product-add-button, .product-actions button, .product-actions a,
    .auth-submit, .otp-submit, .checkout-submit
) {
    min-height: var(--btn-height-standard);
    height: var(--btn-height-standard);
    padding: 0 18px;
    font-size: 14px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-sizing: border-box;
}

/* 4. Medium / Card Action Buttons (38px) */
:where(
    .shop-product-card .shop-cart-add-btn,
    .premium-cart-btn,
    .shop-apply-filters,
    .shop-clear-filters,
    .shop-filter-toggle,
    .compact-pay-btn,
    .product-secondary-actions a,
    .product-tabs button,
    .market-categories__toggle,
    .product-card__details-link
) {
    min-height: var(--btn-height-card) !important;
    height: var(--btn-height-card) !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

/* 5. Compact & Filter Preset Buttons (32px) */
:where(
    .shop-price-presets button,
    .cart-item__remove
) {
    min-height: var(--btn-height-compact) !important;
    height: var(--btn-height-compact) !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

/* 6. Standard Icon-only & Header Action Buttons (40px x 40px) */
.header-search button {
    height: var(--button-icon-size) !important;
    min-height: var(--button-icon-size) !important;
    padding: 0 14px !important;
    font-size: 13px !important;
    border-radius: var(--button-radius) !important;
}

.header-cart {
    height: var(--button-icon-size) !important;
    min-height: var(--button-icon-size) !important;
    padding: 0 12px !important;
    border-radius: var(--button-radius) !important;
}

.customer-menu__trigger,
.customer-notifications__trigger,
.mobile-menu-button,
.b2b-menu,
.cart-drawer__close,
.shop-filters__close,
.category-carousel-button,
.market-slider__arrow,
.site-footer__social-link,
.category-sidebar__toggle {
    width: var(--button-icon-size) !important;
    height: var(--button-icon-size) !important;
    min-height: var(--button-icon-size) !important;
    padding: 0 !important;
    border-radius: var(--button-radius) !important;
    display: grid !important;
    place-items: center !important;
    box-sizing: border-box !important;
}

/* 7. Pagination Buttons (38px x 38px) */
.shop-pagination button,
.pagination button,
.pagination-button {
    width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: var(--button-radius) !important;
    display: grid !important;
    place-items: center !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

/* 8. Hero and Carousel Colors & Actions */
.market-slider__dots button,
[data-market-dots] button,
[data-market-dot] {
    width: 10px !important;
    height: 10px !important;
    min-height: 10px !important;
    max-height: 10px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid rgba(8, 47, 91, 0.25) !important;
    background: rgba(255, 255, 255, 0.55);
    cursor: pointer;
    box-sizing: border-box !important;
    flex: 0 0 auto;
}
.market-slider__dots button[aria-current="true"],
[data-market-dots] button[aria-current="true"],
[data-market-dot][aria-current="true"] {
    width: 24px !important;
    height: 10px !important;
    min-height: 10px !important;
    max-height: 10px !important;
    border-radius: 999px !important;
    background: #2e7d32 !important;
}
.market-slide__primary, .market-quote__primary {
    color: #102a43 !important;
    background: #ff8a00 !important;
    border: 1px solid #ff8a00 !important;
}
.market-slide__secondary {
    color: #ffffff !important;
    background: rgba(8, 47, 91, 0.28) !important;
    border: 1px solid rgba(255, 255, 255, 0.78) !important;
    transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
.market-slide__secondary:hover, .market-slide__secondary:focus-visible {
    color: #082f5b !important;
    background: #ffffff !important;
    border-color: #ffffff !important;
}
.market-slide__secondary:active {
    color: #ffffff !important;
    background: #0a7a32 !important;
    border-color: #0a7a32 !important;
    transform: translateY(1px);
}

/* WhatsApp Secondary Actions (Quote card, Footer, Contact) */
.market-quote__secondary {
    color: #0a7a32 !important;
    background: #ffffff !important;
    border: 1px solid #0a7a32 !important;
    transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
:where(.market-quote__secondary, .site-footer__whatsapp, .contact-success-whatsapp, [data-contact-whatsapp]):hover,
:where(.market-quote__secondary, .site-footer__whatsapp, .contact-success-whatsapp, [data-contact-whatsapp]):focus-visible {
    color: #ffffff !important;
    background: #0a7a32 !important;
    border-color: #0a7a32 !important;
}
:where(.site-footer__whatsapp):hover .material-symbols-outlined,
:where(.site-footer__whatsapp):focus-visible .material-symbols-outlined {
    color: #ffffff !important;
}
.market-quote__secondary:active {
    color: #ffffff !important;
    background: #085e26 !important;
    border-color: #085e26 !important;
    transform: translateY(1px);
}
.market-slide__secondary:active, .market-quote__secondary:active {
    color: #ffffff !important;
    background: #0a7a32 !important;
    border-color: #0a7a32 !important;
    transform: translateY(1px);
}
.market-slide__primary:active, .market-quote__primary:active {
    background: #cc6b00 !important;
    transform: translateY(1px);
}

/* 9. Cart Quantity Stepper (36px) */
.cart-item__quantity {
    grid-template-columns: repeat(3, 36px);
    width: 108px;
    height: 36px;
    overflow: hidden;
    border: 1px solid #d9e2ec;
    border-radius: var(--button-radius) !important;
}
.cart-item__quantity button,
.cart-item__quantity span {
    width: 36px;
    height: 34px;
    min-height: 34px !important;
    display: grid;
    padding: 0;
    border: 0;
    border-radius: 0 !important;
    place-items: center;
    font-size: 14px;
}
.cart-item__quantity span {
    border-inline: 1px solid #d9e2ec;
    font-weight: 600;
}
.cart-item__quantity button:hover {
    color: #fff;
    background: #0a7a32;
}
.cart-item__quantity button:disabled {
    color: #98a2b3;
    background: #f2f4f7;
    cursor: not-allowed;
}
.cart-item__remove {
    color: #b42318 !important;
    background: transparent !important;
    border: 1px solid #b42318 !important;
}
.cart-item__remove:hover {
    background: #fff1f0 !important;
    text-decoration: none !important;
}

/* 10. Product Detail Stepper & Actions */
.product-quantity > div {
    display: grid;
    grid-template-columns: 36px 38px 36px;
    width: 110px;
    height: 42px;
    overflow: hidden;
    background: var(--nm-surface);
    border: 1px solid var(--nm-border);
    border-radius: var(--button-radius);
}
.product-quantity button {
    display: grid;
    width: 36px;
    height: 40px;
    min-height: 40px !important;
    padding: 0;
    color: var(--nm-primary);
    background: var(--nm-surface-soft);
    border: 0;
    border-radius: 0 !important;
    font-size: 18px;
    line-height: 1;
    place-items: center;
}
.product-quantity strong {
    display: grid;
    width: 38px;
    height: 40px;
    color: var(--nm-text);
    background: #fff;
    font-size: 13px;
    place-items: center;
}