.vc-car-page {
    padding-top: 72px;
    padding-bottom: 56px;
}
.vc-car-page__summary {
    margin-top: 10px;
    margin-bottom: 14px;
    background: linear-gradient(90deg, #eef2ff, #ede9fe);
    border: 1px solid #c7d2fe;
    color: #3730a3;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 600;
    display: inline-block;
}
.vc-car-products-title {
    margin: 0 0 14px;
    font-size: 26px;
    line-height: 1.2;
    color: #111827;
}
.vc-car-hero {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 24px;
    box-shadow: 0 10px 24px rgba(2, 6, 23, 0.06);
}
.vc-car-hero__media img,
.vc-car-hero__placeholder {
    width: 140px;
    height: 98px;
    border-radius: 10px;
    object-fit: cover;
    display: block;
    background: linear-gradient(135deg, #e2e8f0, #cbd5e1);
}
.vc-car-hero__content h2 {
    margin: 0 0 8px;
    color: #0f172a;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 700;
}
.vc-car-hero__stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}
.vc-car-hero__stats span {
    background: #eef2ff;
    color: #3730a3;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}
.vc-car-hero__desc {
    margin: 0 0 10px;
    color: #475569;
    font-size: 14px;
    line-height: 1.45;
}
.vc-car-hero__back {
    color: #4338ca;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}
.vc-car-hero__back:hover { color: #3730a3; }
.vc-car-category-strip { margin-bottom: 26px; }
.vc-car-category-tabs {
    margin-top: 29px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.vc-car-category-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    padding: 9px 12px;
    box-shadow: 0 2px 8px rgba(2, 6, 23, 0.05);
}
.vc-car-category-tab--all {
    padding-left: 20px;
    padding-right: 20px;
}
.vc-car-category-tab.is-active {
    border-color: #4338ca;
    background: #eef2ff;
    box-shadow: 0 4px 10px rgba(67, 56, 202, 0.14);
}
.vc-car-category-tab__icon {
    width: 28px;
    height: 28px;
    background: #4338ca;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.vc-car-category-tab__name {
    color: #0f172a;
    font-weight: 700;
    font-size: 14px;
}
.vc-car-category-tab__count {
    color: #64748b;
    font-size: 11px;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    padding: 1px 6px;
}
.vc-car-products__head { margin-bottom: 0; }
.vc-car-products__head span {
    font-size: 13px;
    color: #64748b;
}
@media (max-width: 992px) {
    .vc-car-page { padding-top: 54px; }
    .vc-car-hero { flex-direction: column; }
    .vc-car-products-title { font-size: 22px; }
}
@media (max-width: 640px) {
    .vc-car-products__head { flex-direction: column; align-items: flex-start; gap: 6px; }
}
/* Shop Filters */
.shop-filters {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
    margin: 0 auto 30px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    max-width: 1280px;
}

.shop-filters__row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
}

@media (min-width: 768px) {
    .shop-filters__row {
        grid-template-columns: 1fr 1fr auto;
        align-items: center;
    }
}

/* Search Form */
.woocommerce-product-search {
    width: 100%;
    position: relative;
}

.woocommerce-product-search input[type="search"] {
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    font-size: 14px;
    background: white;
}

.woocommerce-product-search button {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 0 15px;
    background: none;
    border: none;
    color: #6b7280;
}

/* Sort Dropdown */
.woocommerce-ordering {
    margin: 0 !important;
    width: 100%;
}

.woocommerce-ordering select {
    width: 100%;
    padding: 10px 35px 10px 15px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    font-size: 14px;
    background-color: white;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 10px center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Filter Button */
.shop-filters__toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background-color: #4f46e5;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s;
}

.shop-filters__toggle:hover {
    background-color: #4338ca;
}

.shop-filters__toggle svg {
    width: 20px;
    height: 20px;
}

/* Remove default WooCommerce margins */
.woocommerce-products-header {
    margin-bottom: 30px !important;
}

.woocommerce .woocommerce-result-count {
    margin: 0 !important;
    padding: 10px 0;
}

/* Thank you page – payment instructions (e.g. BACS) – primary highlight, centered */
.thankyou-payment-instructions .thankyou-bank-details-inner {
    text-align: center;
}
.thankyou-payment-instructions .woocommerce-bacs-bank-details {
    text-align: center;
    margin-top: 0;
}
.thankyou-payment-instructions .wc-bacs-bank-details-heading {
    font-size: 1.125rem;
    font-weight: 600;
    color: #4338ca;
    margin: 0 0 1rem 0;
}
.thankyou-payment-instructions .wc-bacs-bank-details-account-name {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}
.thankyou-payment-instructions .wc-bacs-bank-details:first-of-type {
    margin-top: 0;
}
.thankyou-payment-instructions ul.bacs_details {
    list-style: none;
    padding-left: 0;
    margin: 0 auto 1rem auto;
    text-align: center;
}
.thankyou-payment-instructions ul.bacs_details li {
    padding: 0.25rem 0;
    text-align: center;
}

/* ============================================================
   CART PAGE – EMPTY CART STATE
   ============================================================ */

/* Custom vc-cart-empty component (from cart-empty.php template) */
.vc-cart-empty {
    text-align: center;
    padding: 3rem 1rem 2rem;
    max-width: 480px;
    margin: 0 auto;
}

.vc-cart-empty__icon {
    color: #9ca3af;
    margin-bottom: 1.5rem;
}

.vc-cart-empty__icon svg {
    width: 80px;
    height: 80px;
    display: inline-block;
}

.vc-cart-empty__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.75rem;
}

.vc-cart-empty__message {
    font-size: 1rem;
    color: #6b7280;
    margin: 0 0 2rem;
}

.vc-cart-empty__actions {
    margin: 0 0 4.5rem; /* ≥72px below the shop CTA */
}

.vc-cart-empty__button {
    display: inline-block;
    padding: 12px 32px;
    background-color: #4338ca;
    color: #fff !important;
    text-decoration: none !important;
    border-radius: 6px;
    font-weight: 500;
    font-size: 1rem;
    transition: background-color 0.2s;
}

.vc-cart-empty__button:hover {
    background-color: #3730a3;
    color: #fff !important;
}

/* Block empty cart: hide Woo default heading/icon if it still renders after our markup (class order / WC updates). */
.wp-block-woocommerce-empty-cart-block .vc-cart-empty ~ h2.wc-block-cart__empty-cart__title,
.wp-block-woocommerce-empty-cart-block .vc-cart-empty ~ h2.with-empty-cart-icon {
    display: none !important;
}

.wp-block-woocommerce-empty-cart-block .vc-cart-empty ~ hr.wp-block-separator.is-style-dots {
    display: none !important;
}

/* ============================================================
   CART PAGE – WooCommerce NOTICES OVERRIDE
   Re-skin the standard .woocommerce-info/.woocommerce-message
   boxes from woocommerce-general.css to match our theme.
   ============================================================ */

.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-error {
    border-radius: 6px;
    font-size: 0.9375rem;
    padding: 0.875rem 1.25rem 0.875rem 3rem;
}

/* Remove the default WooCommerce icon font ::before on the cart page
   so our custom SVG icon in the template shows cleanly. */
.woocommerce-cart .woocommerce-info::before,
.woocommerce-cart .cart-empty.woocommerce-info::before {
    display: none !important;
}

/* ============================================================
   CART / CHECKOUT – #primary.content-area
   Theme `.content-area` + `body.woocommerce(-page) #primary` use py-8 — large gap above headings.
   ============================================================ */
body.woocommerce-cart #primary.content-area,
body.woocommerce-checkout #primary.content-area {
    padding-top: 0.25rem !important;
}

/* ============================================================
   MY ACCOUNT – top spacing (matches cart/checkout title offset)
   Cart uses entry-header margin-top; account hides that header and uses
   #primary padding instead. Must use !important to beat .woocommerce { margin:0 }
   and the inline/tailwind pt-0 overrides.
   ============================================================ */
body.woocommerce-account #primary.content-area {
    padding-top: 30px !important;
    padding-bottom: 2rem !important;
}

@media (min-width: 768px) {
    body.woocommerce-account #primary.content-area {
        padding-top: 50px !important;
    }
}

/* ============================================================
   CART / CHECKOUT – PAGE TITLE (entry header)
   Account titles render inside .woocommerce-MyAccount-content instead.
   ============================================================ */
.woocommerce-cart .entry-header,
.woocommerce-checkout .entry-header {
    display: block;
    margin-top: 30px;
    margin-bottom: 0.75rem;
}

@media (min-width: 768px) {
    .woocommerce-cart .entry-header,
    .woocommerce-checkout .entry-header {
        margin-top: 50px;
    }
}

.woocommerce-cart .entry-header .entry-title,
.woocommerce-checkout .entry-header .entry-title {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
}

.woocommerce-account .entry-header {
    display: none !important;
}

.woocommerce-account .vc-account-page-header {
    display: block;
    margin: 0 0 1.5rem;
}

.woocommerce-account .vc-account-page-header .entry-title {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
}

/* ============================================================
   CART PAGE – CROSS-SELLS PRODUCT GRID
   Style the cross-sell product cards shown on the cart page
   so they match the theme's shop product cards.
   ============================================================ */

/* Classic cart cross-sells heading */
.cross-sells > h2 {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 2rem 0 1.25rem;
}

/* Classic cart cross-sells product grid */
.cross-sells ul.products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

/* WooCommerce Blocks product grid on empty cart */
.wc-block-cart__cross-sells ul.wc-block-grid__products,
.wp-block-woocommerce-cart-cross-sells-products-block ul {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.wc-block-cart__cross-sells-title,
.wp-block-woocommerce-cart-cross-sells-block h2 {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 2rem 0 1.25rem;
}

/* ============================================================
   CART PAGE – WOOCOMMERCE GENERAL CSS OVERRIDES
   Override colours from woocommerce-general.css that don't
   match our indigo (#4338ca) primary colour.
   ============================================================ */

/* WooCommerce default primary colour (#720eec purple) → our indigo */
.woocommerce-cart a.button,
.woocommerce-cart button.button,
.woocommerce-cart input.button,
.woocommerce-cart #respond input#submit,
.woocommerce-checkout a.button,
.woocommerce-checkout button.button,
.woocommerce-checkout input.button,
.woocommerce-checkout #respond input#submit {
    background-color: #4338ca !important;
    color: #fff !important;
}

.woocommerce-cart a.button:hover,
.woocommerce-cart button.button:hover,
.woocommerce-cart input.button:hover,
.woocommerce-checkout a.button:hover,
.woocommerce-checkout button.button:hover,
.woocommerce-checkout input.button:hover {
    background-color: #3730a3 !important;
    color: #fff !important;
}

/* ============================================================
   CHECKOUT (CLASSIC SHORTCODE) – RESTORE TWO-COLUMN LAYOUT
   Ensures fallback [woocommerce_checkout] keeps the expected
   main-content + narrower sidebar visual structure.
   ============================================================ */
.woocommerce-checkout .woocommerce form.checkout {
    display: grid !important;
    grid-template-columns: minmax(0, 1.65fr) minmax(300px, 1fr) !important;
    grid-template-areas:
        "customer review-heading"
        "customer review";
    column-gap: 2rem !important;
    row-gap: 0 !important;
    align-items: start !important;
}

.woocommerce-checkout .woocommerce form.checkout #customer_details {
    grid-area: customer !important;
    float: none !important;
    width: 100% !important;
    min-width: 0;
}

.woocommerce-checkout .woocommerce form.checkout #order_review_heading,
.woocommerce-checkout .woocommerce form.checkout #order_review {
    grid-column: 2 !important;
    min-width: 0;
    clear: none !important;
    float: none !important;
    width: auto !important;
}
.woocommerce-checkout .woocommerce form.checkout #order_review_heading { grid-area: review-heading !important; }
.woocommerce-checkout .woocommerce form.checkout #order_review { grid-area: review !important; }

.woocommerce-checkout .woocommerce form.checkout #customer_details.col2-set,
.woocommerce-checkout .woocommerce form.checkout .col2-set {
    width: 100% !important;
    margin: 0 !important;
}

.woocommerce-checkout .woocommerce form.checkout #customer_details .col-1,
.woocommerce-checkout .woocommerce form.checkout #customer_details .col-2,
.woocommerce-checkout .woocommerce form.checkout .col2-set .col-1,
.woocommerce-checkout .woocommerce form.checkout .col2-set .col-2 {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}

.woocommerce-checkout .woocommerce form.checkout #customer_details .col-2 {
    margin-top: 1.25rem !important;
}

.woocommerce-checkout .woocommerce form.checkout .form-row-first,
.woocommerce-checkout .woocommerce form.checkout .form-row-last {
    width: calc(50% - 0.5rem) !important;
    float: left !important;
}

.woocommerce-checkout .woocommerce form.checkout .form-row-first {
    margin-right: 1rem !important;
}

.woocommerce-checkout .woocommerce form.checkout #customer_details > .col-1,
.woocommerce-checkout .woocommerce form.checkout #customer_details > .col-2,
.woocommerce-checkout .woocommerce form.checkout #order_review {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.woocommerce-checkout .woocommerce form.checkout #order_review_heading {
    margin: 0 !important;
    font-size: 1.125rem;
    font-weight: 700;
    color: #111827;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-bottom: 0;
    border-radius: 12px 12px 0 0;
    padding: 1rem 1.25rem;
}

.woocommerce-checkout .woocommerce form.checkout #order_review {
    border-top: 0;
    border-radius: 0 0 12px 12px;
    padding-top: 0 !important;
}

.woocommerce-checkout .woocommerce-billing-fields > h3,
.woocommerce-checkout .woocommerce-shipping-fields > h3,
.woocommerce-checkout .woocommerce-additional-fields > h3 {
    margin: 0 0 1rem !important;
    padding: 0 !important;
    line-height: 1.3;
}

.woocommerce-checkout .woocommerce form.checkout #ship-to-different-address {
    margin: 0 0 1rem !important;
    padding: 0 !important;
}

.woocommerce-checkout .woocommerce form.checkout #ship-to-different-address label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-weight: 600;
}

.woocommerce-checkout #ship-to-different-address-checkbox,
.woocommerce-checkout #terms {
    appearance: auto !important;
    width: 1rem;
    height: 1rem;
    accent-color: #4338ca;
    cursor: pointer;
}

.woocommerce-checkout .woocommerce-additional-fields textarea#order_comments {
    min-height: 120px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    padding: 0.75rem 0.9rem;
    resize: vertical;
}
.woocommerce-checkout .woocommerce-additional-fields p#order_comments_field {
    margin-bottom: 0.5rem !important;
}

.woocommerce-checkout form.checkout select {
    appearance: auto !important;
    -webkit-appearance: menulist !important;
    -moz-appearance: menulist !important;
    background-image: none !important;
    padding: 0.7rem 0.85rem !important;
    min-height: 44px;
}

.woocommerce-checkout .select2-container .select2-selection--single {
    min-height: 44px !important;
    height: auto !important;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    display: flex !important;
    align-items: center !important;
}

.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 1.4 !important;
    padding-left: 0.9rem !important;
    color: #111827 !important;
    padding-right: 2rem !important;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    right: 10px !important;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
    background: #fff !important;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 0.75rem !important;
    margin: 0 0 0.75rem 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:last-child {
    margin-bottom: 0 !important;
}

.woocommerce-checkout #payment {
    background: #fff !important;
}

.woocommerce-checkout #payment ul.payment_methods {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 0 !important;
    list-style: none !important;
}

.woocommerce-checkout #payment ul.payment_methods > li.wc_payment_method > input.input-radio {
    margin-right: 0.55rem;
}

/* ============================================================
   BLOCK CHECKOUT – shipping + payment options.
   Each option is its own card (like the classic checkout payment
   methods); WooCommerce's shared outer frame, option separators,
   and inset selection shadow are removed. The radio itself is
   fully self-defined and vertically centered on its label row.
   ============================================================ */

/* kill the single shared frame around the whole option group */
.woocommerce-checkout .wc-block-components-radio-control--highlight-checked:after {
    display: none !important;
}

/* kill the 1px separator lines between options */
.woocommerce-checkout .wc-block-components-radio-control__option:after,
.woocommerce-checkout .wc-block-components-radio-control-accordion-option:after {
    display: none !important;
}

/* kill the inset selection shadow (selection shown via card border below) */
.woocommerce-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.woocommerce-checkout .wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted {
    box-shadow: none !important;
}

/* one card per option: shipping rates are plain labels, payment methods are
   accordion wrappers (label + expandable content share the card) */
.woocommerce-checkout .wc-block-components-radio-control > label.wc-block-components-radio-control__option,
.woocommerce-checkout .wc-block-components-radio-control-accordion-option {
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    background: #fff;
    margin: 0 0 0.75rem 0 !important;
    overflow: hidden;
}

.woocommerce-checkout .wc-block-components-radio-control > label.wc-block-components-radio-control__option:last-child,
.woocommerce-checkout .wc-block-components-radio-control-accordion-option:last-child {
    margin-bottom: 0 !important;
}

/* the label inside an accordion card must not double the border */
.woocommerce-checkout .wc-block-components-radio-control-accordion-option > label.wc-block-components-radio-control__option {
    border: 0 !important;
    margin: 0 !important;
}

/* selected card */
.woocommerce-checkout .wc-block-components-radio-control > label.wc-block-components-radio-control__option:has(> .wc-block-components-radio-control__input:checked),
.woocommerce-checkout .wc-block-components-radio-control-accordion-option:has(.wc-block-components-radio-control__input:checked) {
    border: 2px solid #4338ca !important;
    background: #f5f3ff;
}

.woocommerce-checkout .wc-block-components-radio-control-accordion-option:has(.wc-block-components-radio-control__input:checked) > label.wc-block-components-radio-control__option {
    background: transparent;
}

/* option row layout: plain flex row — [20px radio] [12px gap] [content].
   No absolute positioning, so the radio always sits inline with the first
   text line and the text can never slide underneath the radio, whatever
   height the option grows to (descriptions, pickup details, icons). */
.woocommerce-checkout .wc-block-components-radio-control__option {
    position: relative !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    cursor: pointer;
    margin: 0;
}

/* the radio itself — self-defined, static flex item */
.woocommerce-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input,
.woocommerce-checkout .wc-block-components-radio-control__option .wc-block-components-radio-control__input {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    flex: 0 0 20px !important;
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #9ca3af !important;
    border-radius: 50% !important;
    background: #fff !important;
    background-image: none !important;
    box-sizing: border-box;
    cursor: inherit;
}

/* content block fills the rest of the row */
.woocommerce-checkout .wc-block-components-radio-control__option .wc-block-components-radio-control__option-layout {
    flex: 1 1 auto !important;
    min-width: 0;
}

/* the expandable payment-method content sits outside the label — indent it
   to line up with the option text (16px padding + 20px radio + 12px gap) */
.woocommerce-checkout .wc-block-components-radio-control-accordion-content {
    padding: 0 16px 14px 48px !important;
}

.woocommerce-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:checked,
.woocommerce-checkout .wc-block-components-radio-control__option .wc-block-components-radio-control__input:checked {
    border-color: #4338ca !important;
}

.woocommerce-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:checked:before,
.woocommerce-checkout .wc-block-components-radio-control__option .wc-block-components-radio-control__input:checked:before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #4338ca;
    margin: 0;
}

.woocommerce-checkout #payment ul.payment_methods > li.wc_payment_method > input.input-radio:checked + label {
    color: #4338ca !important;
    font-weight: 600;
}

.woocommerce-checkout #payment ul.payment_methods > li.wc_payment_method:has(> input.input-radio:checked) {
    border: 2px solid #4338ca !important;
    background: #f5f3ff !important;
}

.woocommerce-checkout #payment div.payment_box {
    margin: 0.75rem 0 0 !important;
    border: 1px solid #dbe1ea !important;
    border-radius: 8px;
    background: #f8fafc !important;
    font-size: 0.875rem !important;
    line-height: 1.45 !important;
}

.woocommerce-checkout #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::after {
    display: none !important;
}

.woocommerce-checkout #payment .woocommerce-privacy-policy-text {
    margin: 0.75rem 0 0.85rem !important;
    padding-top: 0 !important;
    background: transparent !important;
    clear: both;
    font-size: 0.8125rem;
    line-height: 1.45;
}

.woocommerce-checkout #payment .form-row.place-order {
    margin-top: 1rem !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

.woocommerce-checkout #order_review .shop_table {
    margin-top: 0 !important;
}

.woocommerce-checkout #order_review_heading + #order_review {
    margin-top: 0 !important;
}

.woocommerce-checkout #order_review .shop_table.woocommerce-checkout-review-order-table {
    margin: 0 0 10px 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}

.woocommerce-checkout #order_review > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.woocommerce-checkout #place_order,
.woocommerce-checkout button#place_order.button.alt {
    width: 100% !important;
    min-height: 48px;
    border-radius: 8px !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    padding: 0.85rem 1rem !important;
    display: block !important;
    float: none !important;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .form-row {
    margin-bottom: 0.75rem !important;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .woocommerce-form__label-for-checkbox {
    display: inline-flex !important;
    align-items: flex-start;
    gap: 0.6rem;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .woocommerce-form__input-checkbox,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper input#terms {
    appearance: auto !important;
    -webkit-appearance: checkbox !important;
    opacity: 1 !important;
    position: static !important;
    width: 1rem !important;
    height: 1rem !important;
    margin: 0 !important;
    margin-top: 0.15rem !important;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 1rem;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_first_name_field,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_city_field,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_phone_field {
    grid-column: 1;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_last_name_field,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_postcode_field,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_email_field {
    grid-column: 2;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_1_field {
    grid-column: 1;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_2_field {
    grid-column: 2;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_1_field,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_2_field {
    display: flex;
    flex-direction: column;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_1_field > label,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_2_field > label {
    min-height: 1.2rem;
    margin-bottom: 0.35rem;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_2_field > label {
    visibility: hidden;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_country_field {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_first_name_field,
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_last_name_field {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin-right: 0 !important;
}

.woocommerce-checkout .woocommerce form.checkout #billing_city_field input,
.woocommerce-checkout .woocommerce form.checkout #billing_postcode_field input,
.woocommerce-checkout .woocommerce form.checkout #billing_address_1_field input,
.woocommerce-checkout .woocommerce form.checkout #billing_address_2_field input,
.woocommerce-checkout .woocommerce form.checkout #billing_phone_field input,
.woocommerce-checkout .woocommerce form.checkout #billing_email_field input {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Keep checkout validation notices close to action button */
.woocommerce-checkout #payment .woocommerce-NoticeGroup,
.woocommerce-checkout #payment .woocommerce-NoticeGroup-checkout {
    margin: 0 0 0.9rem !important;
}

.woocommerce-checkout #payment .woocommerce-error,
.woocommerce-checkout #payment .woocommerce-message,
.woocommerce-checkout #payment .woocommerce-info {
    margin: 0 0 0.9rem !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .vc-review-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .vc-review-thumb {
    width: 42px;
    min-width: 42px;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .vc-review-thumb img {
    width: 42px;
    height: 42px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
}

@media (max-width: 991px) {
    .woocommerce-checkout .woocommerce form.checkout {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "customer"
            "review-heading"
            "review";
        gap: 1.25rem !important;
    }

    .woocommerce-checkout .woocommerce form.checkout #customer_details,
    .woocommerce-checkout .woocommerce form.checkout #order_review_heading,
    .woocommerce-checkout .woocommerce form.checkout #order_review {
        grid-column: 1 !important;
    }

    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_city_field,
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_first_name_field,
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_1_field,
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_postcode_field,
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_phone_field,
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_address_2_field,
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_last_name_field,
    .woocommerce-checkout .woocommerce-billing-fields__field-wrapper #billing_email_field {
        grid-column: 1;
    }
}

/* ============================================================
   Thank you page – consistent spacing and hide duplicate page title */
.woocommerce-thankyou .woocommerce-order-details {
    margin-top: 0;
}
.woocommerce-thankyou .woocommerce-order-details .woocommerce-order-details__title {
    margin-bottom: 1rem;
}
/* When order-received is shown, entry-content may add unwanted top margin */
body.woocommerce-checkout .entry-content .woocommerce-thankyou {
    margin-top: 0;
}
body.woocommerce-checkout .entry-content > .woocommerce {
    margin-bottom: 0;
}

/* ============================================================
   CHECKOUT – FIELD VALIDATION (block + classic)
   Pastel error border on inputs; message below field instead of crowding the label.
   ============================================================ */
.woocommerce-checkout .wc-block-components-text-input,
.woocommerce-checkout .wc-block-components-address-form__company,
.woocommerce-checkout .wc-block-components-address-form__vceu-vat-validator-vat-id,
.woocommerce-checkout .wc-block-components-address-form .wc-block-components-select {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
}

.woocommerce-checkout .wc-block-components-text-input.has-error .wc-block-components-text-input__input,
.woocommerce-checkout .wc-block-components-text-input.has-error input[type="text"],
.woocommerce-checkout .wc-block-components-text-input.has-error input[type="email"],
.woocommerce-checkout .wc-block-components-text-input.has-error input[type="tel"],
.woocommerce-checkout .wc-block-components-text-input.has-error input[type="number"],
.woocommerce-checkout .wc-block-components-text-input.has-error textarea,
.woocommerce-checkout .wc-blocks-components-select.has-error .wc-blocks-components-select__select {
    border-color: #f0a8a8 !important;
    background-color: #fffbfb !important;
    box-shadow: 0 0 0 1px rgba(240, 168, 168, 0.35);
}

.woocommerce-checkout .wc-block-components-text-input .wc-block-components-validation-error,
.woocommerce-checkout .wc-blocks-components-select .wc-block-components-validation-error {
    order: 4;
    margin-top: 0.35rem;
    margin-bottom: 0;
    width: 100%;
    font-size: 0.8125rem;
    line-height: 1.35;
}

.woocommerce-checkout .wc-block-components-text-input .wc-block-components-form-field-label {
    order: 1;
}

.woocommerce-checkout .wc-block-components-text-input .wc-block-components-text-input__input,
.woocommerce-checkout .wc-block-components-text-input textarea {
    order: 2;
}

/* ============================================================
   BLOCK CHECKOUT – checkboxes ("Create an account", "Use same
   address", terms…). Fully self-defined so the layout doesn't
   depend on which WooCommerce component stylesheet loads or on
   the Tailwind forms reset: flex label with a fixed gap, 20px
   box, white checkmark on primary when checked.
   ============================================================ */
.woocommerce-checkout .wc-block-components-checkbox label {
    display: inline-flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    line-height: 20px;
    position: relative;
    cursor: pointer;
    margin: 0 !important;
}

.woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0;
    border: 1px solid #d1d5db !important;
    border-radius: 4px !important;
    background-color: #fff !important;
    background-image: none !important;
    position: static !important;
    box-sizing: border-box;
    cursor: inherit;
}

.woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
    border-color: #4338ca !important;
    background-color: #4338ca !important;
}

.woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__mark {
    position: absolute !important;
    left: 3px !important;
    top: 3px !important;
    width: 14px !important;
    height: 14px !important;
    margin: 0 !important;
    fill: #fff !important;
    pointer-events: none;
}

.woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:not(:checked) + .wc-block-components-checkbox__mark {
    display: none !important;
}

.woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__label {
    padding: 0 !important;
    margin: 0 !important;
}

.woocommerce-checkout .wc-block-components-checkbox label {
    flex-wrap: wrap;
}

.woocommerce-checkout .wc-block-components-checkbox label .wc-block-components-validation-error {
    flex-basis: 100%;
}

.woocommerce-checkout .wc-block-components-address-card {
    border: 1px solid #e5e7eb !important;
}

/*
 * VCEU VAT plugin live feedback uses <p class="vceu-status-text"> (classic) and
 * #vceu-vat-block-status (block) — not Woo’s .wc-block-components-validation-error.
 * See vceu-vat-validator/assets/js/vat-checkout.js
 */
.woocommerce-checkout #vceu-vat-block-status,
.woocommerce-checkout p.vceu-status-text {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    margin: 0.75rem 0 0 !important;
    padding: 0.65rem 0.875rem !important;
    border-radius: 6px !important;
    font-size: 0.8125rem !important;
    line-height: 1.45 !important;
}

.woocommerce-checkout #vceu-vat-block-status.vceu-invalid,
.woocommerce-checkout p.vceu-status-text.vceu-invalid {
    background-color: #fef2f2 !important;
    border: 1px solid #fca5a5 !important;
    color: #991b1b !important;
}

.woocommerce-checkout #vceu-vat-block-status.vceu-success,
.woocommerce-checkout p.vceu-status-text.vceu-success {
    background-color: #ecfdf3 !important;
    border: 1px solid #86efac !important;
    color: #166534 !important;
}

.woocommerce-checkout #vceu-vat-block-status.vceu-info,
.woocommerce-checkout p.vceu-status-text.vceu-info {
    background-color: #fffbeb !important;
    border: 1px solid #fcd34d !important;
    color: #92400e !important;
}

.woocommerce-checkout #vceu-vat-block-status:empty,
.woocommerce-checkout p.vceu-status-text:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

.woocommerce-checkout #vceu-vat-block-status span,
.woocommerce-checkout p.vceu-status-text span {
    display: block;
    margin: 0;
}

/* Block submit-time VAT / additional-field errors from Woo (when present). */
.woocommerce-checkout .wc-block-checkout__billing-fields .wc-block-components-address-form .wc-block-components-address-form__company + .wc-block-components-validation-error:has(+ .wc-block-components-address-form__vceu-vat-validator-vat-id),
.woocommerce-checkout .wc-block-checkout__shipping-fields .wc-block-components-address-form .wc-block-components-address-form__company + .wc-block-components-validation-error:has(+ .wc-block-components-address-form__vceu-vat-validator-vat-id),
.woocommerce-checkout .wc-block-checkout__billing-fields .wc-block-components-address-form .wc-block-components-address-form__vceu-vat-validator-vat-id + .wc-block-components-validation-error,
.woocommerce-checkout .wc-block-checkout__shipping-fields .wc-block-components-address-form .wc-block-components-address-form__vceu-vat-validator-vat-id + .wc-block-components-validation-error,
.woocommerce-checkout .wc-block-checkout__billing-fields .wc-block-components-address-form .wc-block-components-validation-error[id*="vat-validator"],
.woocommerce-checkout .wc-block-checkout__shipping-fields .wc-block-components-address-form .wc-block-components-validation-error[id*="vat-validator"],
.woocommerce-checkout .wc-block-components-address-form__vceu-vat-validator-vat-id .wc-block-components-validation-error {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0.75rem !important;
    margin-bottom: 0 !important;
    box-sizing: border-box;
    padding: 0.65rem 0.875rem !important;
    background-color: #fffbeb !important;
    border: 1px solid #fbbf24 !important;
    border-radius: 6px !important;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: #78350f !important;
}

.woocommerce-checkout .wc-block-components-address-form__vceu-vat-validator-vat-id .wc-block-components-validation-error {
    order: 4;
}

.woocommerce-checkout .wc-block-components-address-form .wc-block-components-validation-error[id*="vat-validator"] p,
.woocommerce-checkout .wc-block-components-address-form__vceu-vat-validator-vat-id .wc-block-components-validation-error p,
.woocommerce-checkout .wc-block-components-address-form .wc-block-components-address-form__company + .wc-block-components-validation-error:has(+ .wc-block-components-address-form__vceu-vat-validator-vat-id) p,
.woocommerce-checkout .wc-block-components-address-form .wc-block-components-address-form__vceu-vat-validator-vat-id + .wc-block-components-validation-error p {
    margin: 0;
    color: inherit;
}

/* Classic checkout: VAT row invalid message as the same warning strip */
.woocommerce-checkout .woocommerce-billing-fields #billing_vat_id_field.woocommerce-invalid .woocommerce-error,
.woocommerce-checkout .woocommerce-billing-fields #billing_vat_id_field .woocommerce-error {
    display: block;
    margin-top: 0.75rem !important;
    padding: 0.65rem 0.875rem !important;
    background-color: #fffbeb !important;
    border: 1px solid #fbbf24 !important;
    border-radius: 6px !important;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: #78350f !important;
}

.woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid select,
.woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid textarea {
    border-color: #f0a8a8 !important;
    background-color: #fffbfb !important;
}

.woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid .description,
.woocommerce-checkout .woocommerce form .form-row.woocommerce-invalid > .woocommerce-error,
.woocommerce-checkout .woocommerce form .form-row .woocommerce-error {
    margin-top: 0.35rem;
    font-size: 0.8125rem;
}
/* ── Category Landing Section ────────────────────────────── */
.cat-landing {
    margin-bottom: 2rem;
}

.cat-landing__intro {
    font-size: 1.0625rem;
    line-height: 1.65;
    color: #1e293b;
    margin-bottom: 1.25rem;
    max-width: 72ch;
}

.cat-landing__panel {
    margin-bottom: 1.75rem;
    padding: 1.25rem;
    border-radius: 1rem;
    background: linear-gradient(135deg, #eef2ff 0%, #f8fafc 48%, #ecfdf5 100%);
    border: 1px solid #e0e7ff;
    box-shadow: 0 18px 40px -28px rgba(67, 56, 202, 0.45);
}

.cat-landing__highlights {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .cat-landing__highlights {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1rem;
    }
}

.cat-landing__highlight {
    text-align: center;
    padding: 1rem 0.75rem;
    border-radius: 0.875rem;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 8px 24px -18px rgba(15, 23, 42, 0.35);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cat-landing__highlight:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 28px -16px rgba(15, 23, 42, 0.28);
}

.cat-landing__highlight-value {
    font-size: clamp(1.125rem, 1.8vw, 1.5rem);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 0.35rem;
}

.cat-landing__highlight-label {
    font-size: 0.8125rem;
    line-height: 1.35;
    color: #64748b;
}

.cat-landing__highlight--blue .cat-landing__highlight-value { color: #2563eb; }
.cat-landing__highlight--green .cat-landing__highlight-value { color: #059669; }
.cat-landing__highlight--purple .cat-landing__highlight-value { color: #7c3aed; }
.cat-landing__highlight--orange .cat-landing__highlight-value { color: #ea580c; }

.cat-landing__guides,
.cat-landing__filters-panel {
    margin-bottom: 1.25rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.875rem;
    background: #ffffff;
    box-shadow: 0 8px 24px -20px rgba(15, 23, 42, 0.25);
    overflow: hidden;
}

.cat-landing__guides-toggle {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: background-color 0.15s ease;
}

.cat-landing__guides-toggle::-webkit-details-marker {
    display: none;
}

.cat-landing__guides-toggle::marker {
    content: '';
}

.cat-landing__guides-toggle:hover {
    background: #f8fafc;
}

.cat-landing__guides[open] .cat-landing__guides-toggle {
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
}

.cat-landing__guides-toggle-text {
    flex: 1;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.35;
    color: #0f172a;
}

.cat-landing__guides-chevron {
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
    color: #4338ca;
    transition: transform 0.2s ease;
}

.cat-landing__guides[open] .cat-landing__guides-chevron {
    transform: rotate(180deg);
}

.cat-landing__guides-body {
    padding: 1rem;
}

.cat-landing__guides-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.875rem;
}

@media (min-width: 768px) {
    .cat-landing__guides-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1rem;
    }
}

.cat-landing__guide {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 1.25rem;
    border-radius: 1rem;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 30px -24px rgba(15, 23, 42, 0.35);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.cat-landing__guide:hover {
    border-color: #c7d2fe;
    box-shadow: 0 18px 36px -22px rgba(67, 56, 202, 0.28);
    transform: translateY(-2px);
}

.cat-landing__guide-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    margin-bottom: 0.875rem;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #eef2ff, #e0e7ff);
    color: #4338ca;
}

.cat-landing__guide-icon svg {
    width: 1.25rem;
    height: 1.25rem;
}

.cat-landing__guide-title {
    margin: 0 0 0.5rem;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
}

.cat-landing__guide-title a {
    color: #0f172a;
    text-decoration: none;
    transition: color 0.15s ease;
}

.cat-landing__guide-title a:hover {
    color: #4338ca;
}

.cat-landing__guide-excerpt {
    margin: 0 0 1rem;
    flex-grow: 1;
    font-size: 0.875rem;
    line-height: 1.55;
    color: #64748b;
}

.cat-landing__guide-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: auto;
    font-size: 0.875rem;
    font-weight: 600;
    color: #4338ca;
    text-decoration: none;
    transition: gap 0.15s ease, color 0.15s ease;
}

.cat-landing__guide-link svg {
    width: 1rem;
    height: 1rem;
    transition: transform 0.15s ease;
}

.cat-landing__guide-link:hover {
    color: #3730a3;
    gap: 0.5rem;
}

.cat-landing__guide-link:hover svg {
    transform: translateX(2px);
}

.cat-landing__term-description {
    color: #4b5563;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 1rem;
    max-width: 72ch;
}

.cat-landing__term-description p {
    margin: 0 0 0.75rem;
}

.cat-landing__links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.cat-landing__links a {
    display: inline-block;
    padding: 4px 12px;
    border: 1px solid #E5E7EB;
    border-radius: 9999px;
    font-size: 13px;
    color: #374151;
    text-decoration: none;
    transition: border-color 0.15s, color 0.15s;
}

.cat-landing__links a:hover {
    border-color: #6366F1;
    color: #6366F1;
}

.cat-landing__filters {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem;
    padding: 1rem;
    margin: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.cat-landing__filter-label {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.cat-landing__filter-label select {
    height: 2.25rem;
    padding: 0 2rem 0 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%2364748b' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    appearance: none;
    font-size: 0.875rem;
    color: #0f172a;
    min-width: 11rem;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.cat-landing__filter-label select:hover {
    border-color: #c7d2fe;
}

.cat-landing__filter-label select:focus {
    outline: none;
    border-color: #4338ca;
    box-shadow: 0 0 0 3px rgba(67, 56, 202, 0.12);
}

.cat-landing__filter-submit {
    height: 2.25rem;
    padding: 0 1rem;
    background: #4338ca;
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
    align-self: flex-end;
}

.cat-landing__filter-submit:hover {
    background: #3730a3;
}

.cat-landing__filter-reset {
    height: 2.25rem;
    line-height: 2.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #64748b;
    text-decoration: none;
    align-self: flex-end;
    transition: color 0.15s ease;
}

.cat-landing__filter-reset:hover {
    color: #4338ca;
}

/* Shop archive outer (width/padding come from .site-main in main.css) */
.shop-page {
    width: 100%;
}

.vc-story-product-card {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.vc-story-product-summary {
    min-height: 4.5rem;
}

.vc-story-product-readmore {
    display: inline-flex;
    align-items: center;
}

.vc-story-products {
    margin-top: 1.75rem;
}

.vc-story-products__head {
    margin-bottom: 1.1rem;
}

.vc-story-products__title {
    font-size: 1.45rem;
    line-height: 1.3;
    color: #0f172a;
    margin: 0;
}

.vc-story-products__meta {
    margin: 0.35rem 0 0;
    font-size: 0.95rem;
    color: #64748b;
}

/* Homepage featured portable chargers */
.vc-homepage-featured {
    margin-top: 3rem;
    padding-top: 2.75rem;
    border-top: 1px solid #e2e8f0;
}

.vc-homepage-featured__head {
    text-align: center;
    margin-bottom: 2rem;
    padding: 0 0.5rem;
}

.vc-homepage-featured__title {
    font-size: clamp(1.5rem, 2vw, 1.875rem);
    font-weight: 700;
    line-height: 1.25;
    color: #111827;
    margin: 0 0 0.75rem;
}

.vc-homepage-featured__intro {
    max-width: 42rem;
    margin: 0 auto;
    font-size: 1.0625rem;
    line-height: 1.65;
    color: #4b5563;
}

.vc-homepage-featured__grid {
    width: 100%;
}

.vc-homepage-featured__grid ul.products {
    margin-bottom: 0 !important;
}

@media (min-width: 1024px) {
    .vc-homepage-featured__grid ul.products {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 1.75rem;
    }
}

.vc-homepage-featured__cta {
    text-align: center;
    margin-top: 2.5rem;
    padding-top: 0.25rem;
}

.vc-homepage-featured__cta--solo {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #e2e8f0;
}

.vc-homepage-featured__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background: #4338ca;
    color: #ffffff !important;
    padding: 1rem 2rem;
    border-radius: 0.5rem;
    font-weight: 600;
    font-size: 1.125rem;
    line-height: 1.5;
    text-decoration: none;
    box-shadow: 0 10px 15px -3px rgba(67, 56, 202, 0.25);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.vc-homepage-featured__button:hover {
    background: #3730a3;
    color: #ffffff !important;
    box-shadow: 0 12px 20px -4px rgba(67, 56, 202, 0.3);
}

.vc-homepage-featured__button-icon {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

/* Archive heading (replaces Tailwind-only classes on landing) */
.shop-header--archive {
    padding-top: 10px;
    margin-bottom: 0;
}

.shop-header__title {
    font-size: clamp(1.75rem, 2.2vw, 2.25rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: #111827;
    margin: 0;
}

/* Breadcrumb under archive title (important wins over any leftover global .breadcrumbs rules) */
.shop-page nav.breadcrumbs {
    padding: 6px 0 4px;
    margin-top: 0 !important;
    margin-bottom: 28px !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Story list / cards */
.vc-story-list {
    display: flex;
    flex-direction: column;
    gap: 2.25rem;
}

.vc-story-card {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 2rem;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    overflow: hidden;
    min-height: 320px;
}

.vc-story-card--reverse .vc-story-card__media {
    order: 2;
}

.vc-story-card--reverse .vc-story-card__content {
    order: 1;
}

.vc-story-card__media {
    display: block;
    background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
}

.vc-story-card__image {
    width: 100%;
    height: 100%;
    min-height: 320px;
    object-fit: contain;
    padding: 1.5rem;
}

.vc-story-card__placeholder {
    min-height: 320px;
    width: 100%;
    background: linear-gradient(180deg, #e2e8f0 0%, #f1f5f9 100%);
}

.vc-story-card__content {
    padding: 2rem 2.25rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.35rem;
}

.vc-story-card__title {
    font-size: clamp(1.45rem, 2vw, 2rem);
    line-height: 1.2;
    margin: 0 0 0.8rem;
    color: #0f172a;
}

.vc-story-card__title a {
    color: inherit;
    text-decoration: none;
}

.vc-story-card__text {
    margin: 0 0 0.75rem;
    color: #475569;
    line-height: 1.7;
    font-size: 1rem;
}

.vc-story-card__meta {
    margin: 0.25rem 0 1rem;
    font-size: 0.9375rem;
    color: #475569;
    line-height: 1.55;
}

.vc-story-card__price {
    font-weight: 600;
    color: #111827;
    margin-bottom: 0.35rem;
}

.vc-story-card__price .woocommerce-Price-amount {
    font-weight: 600;
}

.vc-story-card__stock {
    margin-bottom: 0.35rem;
}

.vc-story-card__stock .stock {
    margin: 0;
    font-size: 0.875rem;
}

.vc-story-card__attrs {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.vc-story-card__attr {
    display: block;
    font-size: 0.875rem;
    color: #64748b;
}

.vc-story-card__attr-label {
    font-weight: 600;
    color: #475569;
    margin-right: 0.25rem;
}

.vc-story-card__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    margin-top: 0.25rem;
    padding: 0.65rem 1.35rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    color: #fff;
    background: #4f46e5;
    border-radius: 0.5rem;
    border: none;
    cursor: pointer;
    transition: background 0.15s ease, box-shadow 0.15s ease;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.vc-story-card__cta:hover {
    background: #4338ca;
    color: #fff;
    text-decoration: none;
}

@media (max-width: 1024px) {
    .vc-story-card,
    .vc-story-card--reverse {
        grid-template-columns: 1fr;
    }

    .vc-story-card__media,
    .vc-story-card--reverse .vc-story-card__media,
    .vc-story-card--reverse .vc-story-card__content {
        order: initial;
    }

    .vc-story-card__content {
        padding: 1.25rem 1.25rem 1.5rem;
    }
}

/* Single product page layout */
@media (min-width: 768px) {
    .single-product .product_title {
        margin-top: 20px;
    }
}

/*
 * Single product summary purchase area — unlayered so it wins over @layer components
 * in main.css and WooCommerce defaults. Spacing uses one rhythm: 1rem above/below dividers
 * (matches .vc-product-summary-divider mt-4 + adjacent pt-4 in main.css).
 */
.single-product div.product form.cart,
.single-product .vc-product-summary form.cart,
.single-product .vc-product-summary form.variations_form.cart,
.single-product .vc-product-summary .vc-product-purchase,
.single-product .vc-product-summary .vc-product-add-to-cart,
.single-product .vc-product-summary .single_variation_wrap,
.single-product .vc-product-summary .woocommerce-variation-add-to-cart {
    margin-bottom: 0 !important;
}

.single-product .vc-product-summary .vc-product-purchase {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.single-product .vc-product-summary form.cart::before,
.single-product .vc-product-summary form.cart::after,
.single-product .vc-product-summary .woocommerce-variation-add-to-cart::before,
.single-product .vc-product-summary .woocommerce-variation-add-to-cart::after {
    content: none !important;
    display: none !important;
}

.single-product .vc-product-summary form.cart .button,
.single-product .vc-product-summary form.cart .quantity {
    float: none !important;
}

/* Fixed qty (e.g. 1 in stock): WC uses a hidden input — full-width add-to-cart */
.single-product .vc-product-summary form.cart:not(.variations_form):has(.quantity input[type="hidden"]),
.single-product .vc-product-summary .woocommerce-variation-add-to-cart:has(.quantity input[type="hidden"]) {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
}

.single-product .vc-product-summary .quantity:has(input[type="hidden"]) {
    display: none !important;
}

/* WC / gateway markup injected after add-to-cart (PayPal is common on production only). */
.single-product .vc-product-summary .vc-product-purchase #paypal-standard-container,
.single-product .vc-product-summary .vc-product-purchase #ppcp-recaptcha-v2-container,
.single-product .vc-product-summary .vc-product-purchase .wc_bis_form,
.single-product .vc-product-summary #paypal-standard-container,
.single-product .vc-product-summary #ppcp-recaptcha-v2-container,
.single-product .vc-product-summary .wc_bis_form {
    margin: 0 !important;
    padding: 0 !important;
}

.single-product .vc-product-summary .vc-product-purchase #paypal-standard-container:empty,
.single-product .vc-product-summary .vc-product-purchase #ppcp-recaptcha-v2-container:empty,
.single-product .vc-product-summary #ppcp-recaptcha-v2-container:empty {
    display: none;
}

.single-product .vc-product-summary .vc-variant-switcher {
    margin-bottom: 0;
}

.single-product .vc-product-summary .vc-variant-switcher + .vc-product-purchase,
.single-product .vc-product-summary .vc-variant-switcher + .vc-product-add-to-cart,
.single-product .vc-product-summary .vc-variant-switcher + form.variations_form.cart {
    padding-top: 1rem;
}

.single-product .vc-product-summary .vc-product-purchase + .vc-product-trust-badges,
.single-product .vc-product-summary .vc-product-trust-badges {
    margin-top: 1rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/* ============================================================
   THANK-YOU / ORDER VIEW – customer details
   Our templates render the address cards; strip WooCommerce core's
   built-in address box (border/padding) that created a card-in-card
   look, and its phone/email icon pseudo-elements.
   ============================================================ */
.woocommerce .woocommerce-customer-details address {
    border: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.woocommerce .woocommerce-customer-details .woocommerce-customer-details--phone::before,
.woocommerce .woocommerce-customer-details .woocommerce-customer-details--email::before {
    display: none !important;
}

.woocommerce .woocommerce-customer-details .woocommerce-customer-details--phone,
.woocommerce .woocommerce-customer-details .woocommerce-customer-details--email {
    margin: 0.25rem 0 0 !important;
    padding: 0 !important;
}

/* Payment QR code block */
.vc-bacs-qr-code svg {
    width: 100%;
    height: auto;
    display: block;
}

/* ============================================================
   UNIFORM TOP OFFSET – catalog + product pages
   One shared gap between the fixed header and the page content
   for shop, category/subcategory, brand archives, and product
   detail. Cart/checkout/account keep their own tuned offsets
   (excluded below). Page-specific extras (product grid py-8,
   shop-only products-header margin) were removed in favor of
   this single rule.
   ============================================================ */
body.woocommerce:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) #primary.content-area,
body.woocommerce-page:not(.woocommerce-cart):not(.woocommerce-checkout):not(.woocommerce-account) #primary.content-area {
    padding-top: 2rem !important;
}

/* ============================================================
   HEADER LOGO – sizing duplicated from src/main.css
   Fallback with teeth: this stylesheet is served straight from
   src/ (no Tailwind build step), so it always reflects the last
   deploy even when the compiled main.css on the server is stale.
   Keep the values in sync with .site-logo / .site-logo-link in
   src/main.css.
   ============================================================ */
.site-logo-link {
    display: inline-flex !important;
    align-items: center !important;
    margin-top: 4px !important;
    margin-left: -12px !important;
}
.site-logo {
    height: 48px !important;
    width: auto !important;
    aspect-ratio: 269.3 / 82;
    max-width: none !important;
    display: block !important;
}
@media (min-width: 1024px) {
    .site-logo {
        height: 55px !important;
    }
}

/* ============================================================
   PAYPAL SMART BUTTONS – z-index containment
   The PayPal SDK renders its buttons in iframes with inline
   z-index 100+ which paints over the fixed header (z-index 50).
   isolation creates a private stacking context: inside it the
   iframe can layer however it likes, but the whole widget
   competes with the rest of the page at z-index 0, so the
   header stays on top. Covers block cart/checkout express
   payment slots and the gateway's own button wrappers.
   ============================================================ */
.paypal-buttons,
.ppc-button-wrapper,
#ppc-button-ppcp-gateway,
.wc-block-components-express-payment,
.wc-block-components-express-payment__event-buttons li {
    isolation: isolate;
    position: relative;
    z-index: 0;
}