/* =========================================================
   COLOR MODES — WooCommerce (loads AFTER ecommerce.css)
   Shop, single product, cart, checkout, account, thank-you
   ========================================================= */

/* ─── Shop grid cards (higher specificity than ecommerce.css) ─── */
.products-section .product-card {
    background: var(--vb-bg-card-alt) !important;
    color: var(--vb-text) !important;
}

.products-section .product-card .product-name,
.products-section .product-card .product-price,
.products-section .product-card .product-meta-info,
.products-section .product-card .product-numeric-rating {
    color: var(--vb-text) !important;
}

/* Rating accent matches live search (#ff8a00); parent .product-meta-info uses vb-text */
.products-section .product-card .rating-value,
.products-section .product-card .rating-star,
.products-section .product-card .product-numeric-rating .rating-value,
.products-section .product-card .product-numeric-rating .rating-star {
    color: #ff8a00 !important;
}

/* ─── Single product layout ─── */
.product-header,
.product-header-modern {
    background: var(--vb-bg-card-alt) !important;
}

.product-header-mobile {
    background: var(--vb-bg-card-alt) !important;
}

.left-panel .product-name,
.product-info .product-name,
.ph-title {
    color: var(--vb-text) !important;
}

.product-meta span,
.product-short-desc,
.flag-meta span,
.live-price,
.item-info {
    color: var(--vb-text) !important;
}

.right-panel {
    background: var(--vb-bg-card-alt) !important;
}

.form-field label,
.product-quantity-wrapper h6 {
    color: var(--vb-text) !important;
}

.form-field input:not([type="checkbox"]):not([type="radio"]) {
    background-color: var(--vb-bg-input) !important;
    color: var(--vb-text) !important;
    border-color: var(--vb-border) !important;
}

.quantity-btn {
    color: var(--vb-text) !important;
    border-color: var(--vb-border) !important;
    background: transparent !important;
}

.quantity-display {
    color: var(--vb-text) !important;
}

.product-description,
.reviews {
    background: var(--vb-bg-card-alt) !important;
    color: var(--vb-text) !important;
}

.product-description h2,
.product-description p,
.reviews p,
.reviews h2 {
    color: var(--vb-text) !important;
}

.subtotal,
.subtotal .row {
    color: var(--vb-text) !important;
}

.subtotal .row.total {
    border-top-color: var(--vb-border) !important;
}

.sidebar-section {
    background: var(--vb-bg-input) !important;
    color: var(--vb-text) !important;
}

.sidebar-section ul li a {
    color: var(--vb-text-muted) !important;
}

/* Tabs */
.product-tabs .tab-buttons {
    border-bottom-color: var(--vb-border) !important;
}

.tab-btn {
    background: var(--vb-bg-card-alt) !important;
    color: var(--vb-text) !important;
}

.tab-btn:hover,
.tab-btn.active {
    background: var(--vb-bg-card) !important;
    color: var(--vb-text) !important;
}

.tab-content {
    background: var(--vb-bg-card-alt) !important;
    color: var(--vb-text) !important;
}

.tab-content p,
.tab-content li {
    color: var(--vb-text) !important;
}

.highlight-btn {
    outline-color: var(--vb-text) !important;
}

/* Diamond grid */
.diamond-grid {
    background: var(--vb-bg-card-alt) !important;
}

.diamond {
    border-color: var(--vb-border) !important;
    background: var(--vb-bg-card) !important;
    color: var(--vb-text) !important;
}

.diamond:hover,
.diamond.active {
    border-color: var(--vb-accent) !important;
}

.order-info {
    background: var(--vb-bg-select) !important;
    color: var(--vb-text) !important;
}

/* Comments on product */
.comments-section,
.section-title {
    color: var(--vb-text) !important;
}

.comment-card {
    background: var(--vb-bg-card-alt) !important;
    border-color: var(--vb-border-subtle) !important;
}

.comment-date {
    color: var(--vb-text-muted) !important;
}

.comment-text {
    color: var(--vb-text-muted2) !important;
}

.comment-form {
    background: var(--vb-bg-card-alt) !important;
}

.comment-form form input,
.comment-form form textarea {
    background: var(--vb-bg-input) !important;
    color: var(--vb-text) !important;
    border-color: var(--vb-border-input) !important;
}

/* ─── Cart ─── */
.cart-section {
    color: var(--vb-text) !important;
}

.cart-item {
    background: var(--vb-bg-input) !important;
}

.cart-item-meta,
.summary-row {
    color: var(--vb-text-muted2) !important;
}

.cart-summary {
    background: var(--vb-bg-input) !important;
}

.summary-row.total {
    border-top-color: var(--vb-border) !important;
}

/* ─── Checkout layout ─── */
.vertex-checkout-wrapper {
    position: relative;
}

.section {
    background-color: var(--vb-bg-card-alt) !important;
    color: var(--vb-text) !important;
}

.woocommerce-checkout .vertex-checkout-wrapper .section {
    background-color: var(--vb-checkout-section-bg) !important;
}

.section h2,
.section h3,
.left-column h2,
.left-column h3 {
    color: var(--vb-text) !important;
}

.checkout-form label {
    color: var(--vb-text) !important;
}

.checkout-form input,
.checkout-form textarea,
.checkout-form select {
    background-color: var(--vb-bg-input) !important;
    color: var(--vb-text) !important;
    border-color: var(--vb-border) !important;
}

.product-details .item {
    color: var(--vb-text) !important;
}

/* ─── WooCommerce core (cart table, checkout, account) ─── */
.woocommerce,
.woocommerce-page {
    color: var(--vb-text);
}

.woocommerce table.shop_table,
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
    border-color: var(--vb-border) !important;
    color: var(--vb-text) !important;
}

.woocommerce-cart table.cart td.actions .coupon .input-text {
    background: var(--vb-bg-input) !important;
    color: var(--vb-text) !important;
    border-color: var(--vb-border) !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page .select2-container--default .select2-selection--single {
    background-color: var(--vb-bg-input) !important;
    color: var(--vb-text) !important;
    border-color: var(--vb-border) !important;
}

.woocommerce-page .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--vb-text) !important;
}

#add_payment_method #payment,
.woocommerce-cart #payment {
    background: var(--vb-bg-card-alt) !important;
    color: var(--vb-text) !important;
}

.woocommerce-checkout #payment,
.vertex-checkout-wrapper #payment,
.woocommerce-checkout .section.payment-method {
    background: var(--vb-checkout-section-bg) !important;
    color: var(--vb-text) !important;
}

.woocommerce-checkout #payment ul.payment_methods,
.woocommerce-checkout .section.payment-method ul.wc_payment_methods,
.woocommerce-checkout .wc_payment_methods.payment_methods {
    border-bottom-color: var(--vb-border) !important;
}

.woocommerce-checkout #payment ul.payment_methods li,
.woocommerce-checkout .section.payment-method ul.wc_payment_methods li,
.woocommerce-checkout .wc_payment_methods li.wc_payment_method {
    background: transparent !important;
    color: var(--vb-text) !important;
}

/*
 * Payment fields box: default WC #payment OR theme checkout (.section.payment-method / .vertex-checkout-wrapper)
 * (custom form-checkout has no #payment id)
 */
.woocommerce-checkout #payment div.payment_box,
.woocommerce-checkout .section.payment-method div.payment_box,
.vertex-checkout-wrapper div.payment_box {
    background: var(--vb-checkout-section-bg) !important;
    color: var(--vb-text) !important;
    -webkit-text-fill-color: var(--vb-text) !important;
}

.woocommerce-checkout #payment div.payment_box::before,
.woocommerce-checkout .section.payment-method div.payment_box::before,
.vertex-checkout-wrapper div.payment_box::before {
    border-color: transparent transparent var(--vb-checkout-section-bg) transparent !important;
}

.wc_payment_methods li label,
.woocommerce-checkout #payment label,
.woocommerce-checkout .section.payment-method label {
    color: var(--vb-text) !important;
}

.woocommerce-checkout #payment .input-radio,
.woocommerce-checkout .section.payment-method .input-radio,
.wc_payment_methods .input-radio {
    accent-color: var(--vb-accent);
}

.woocommerce-checkout #payment div.payment_box > div,
.woocommerce-checkout .section.payment-method div.payment_box > div,
.vertex-checkout-wrapper div.payment_box > div,
.woocommerce-checkout #payment div.payment_box table,
.woocommerce-checkout .section.payment-method div.payment_box table,
.vertex-checkout-wrapper div.payment_box table,
.woocommerce-checkout #payment div.payment_box tbody,
.woocommerce-checkout .section.payment-method div.payment_box tbody,
.vertex-checkout-wrapper div.payment_box tbody,
.woocommerce-checkout #payment div.payment_box tr,
.woocommerce-checkout .section.payment-method div.payment_box tr,
.vertex-checkout-wrapper div.payment_box tr,
.woocommerce-checkout #payment div.payment_box td,
.woocommerce-checkout .section.payment-method div.payment_box td,
.vertex-checkout-wrapper div.payment_box td,
.woocommerce-checkout #payment div.payment_box th,
.woocommerce-checkout .section.payment-method div.payment_box th,
.vertex-checkout-wrapper div.payment_box th {
    background-color: transparent !important;
    background-image: none !important;
}

.woocommerce-checkout #payment div.payment_box hr,
.woocommerce-checkout .section.payment-method div.payment_box hr,
.vertex-checkout-wrapper div.payment_box hr {
    border: none !important;
    border-top: 1px solid var(--vb-border) !important;
    background: transparent !important;
    margin: 12px 0 !important;
}

.woocommerce-checkout #payment div.payment_box p,
.woocommerce-checkout .section.payment-method div.payment_box p,
.vertex-checkout-wrapper div.payment_box p,
.woocommerce-checkout #payment div.payment_box span:not(.vb-usdt-badge),
.woocommerce-checkout .section.payment-method div.payment_box span:not(.vb-usdt-badge),
.vertex-checkout-wrapper div.payment_box span:not(.vb-usdt-badge),
.woocommerce-checkout #payment div.payment_box div,
.woocommerce-checkout .section.payment-method div.payment_box div,
.vertex-checkout-wrapper div.payment_box div,
.woocommerce-checkout #payment div.payment_box li,
.woocommerce-checkout .section.payment-method div.payment_box li,
.vertex-checkout-wrapper div.payment_box li,
.woocommerce-checkout #payment div.payment_box .form-row,
.woocommerce-checkout .section.payment-method div.payment_box .form-row,
.vertex-checkout-wrapper div.payment_box .form-row,
.woocommerce-checkout #payment div.payment_box label:not([for^="payment_method"]),
.woocommerce-checkout .section.payment-method div.payment_box label:not([for^="payment_method"]),
.vertex-checkout-wrapper div.payment_box label:not([for^="payment_method"]),
.woocommerce-checkout #payment div.payment_box strong,
.woocommerce-checkout .section.payment-method div.payment_box strong,
.vertex-checkout-wrapper div.payment_box strong,
.woocommerce-checkout #payment div.payment_box em,
.woocommerce-checkout .section.payment-method div.payment_box em,
.vertex-checkout-wrapper div.payment_box em,
.woocommerce-checkout #payment div.payment_box small,
.woocommerce-checkout .section.payment-method div.payment_box small,
.vertex-checkout-wrapper div.payment_box small {
    color: var(--vb-text) !important;
    -webkit-text-fill-color: var(--vb-text) !important;
}

.woocommerce-checkout #payment div.payment_box a:not(.button):not([class*="button"]),
.woocommerce-checkout .section.payment-method div.payment_box a:not(.button):not([class*="button"]),
.vertex-checkout-wrapper div.payment_box a:not(.button):not([class*="button"]) {
    color: var(--vb-accent) !important;
}

.woocommerce-checkout #payment div.payment_box input.input-text,
.woocommerce-checkout .section.payment-method div.payment_box input.input-text,
.vertex-checkout-wrapper div.payment_box input.input-text,
.woocommerce-checkout #payment div.payment_box input[type="text"],
.woocommerce-checkout .section.payment-method div.payment_box input[type="text"],
.vertex-checkout-wrapper div.payment_box input[type="text"],
.woocommerce-checkout #payment div.payment_box input[type="tel"],
.woocommerce-checkout .section.payment-method div.payment_box input[type="tel"],
.vertex-checkout-wrapper div.payment_box input[type="tel"],
.woocommerce-checkout #payment div.payment_box input[type="number"],
.woocommerce-checkout .section.payment-method div.payment_box input[type="number"],
.vertex-checkout-wrapper div.payment_box input[type="number"],
.woocommerce-checkout #payment div.payment_box input[type="email"],
.woocommerce-checkout .section.payment-method div.payment_box input[type="email"],
.vertex-checkout-wrapper div.payment_box input[type="email"],
.woocommerce-checkout #payment div.payment_box select,
.woocommerce-checkout .section.payment-method div.payment_box select,
.vertex-checkout-wrapper div.payment_box select,
.woocommerce-checkout #payment div.payment_box textarea,
.woocommerce-checkout .section.payment-method div.payment_box textarea,
.vertex-checkout-wrapper div.payment_box textarea {
    background-color: var(--vb-bg-input) !important;
    color: var(--vb-text) !important;
    border-color: var(--vb-border-input) !important;
}

.vertex-checkout-wrapper .woocommerce-checkout #payment div.payment_box input::placeholder,
.vertex-checkout-wrapper .woocommerce-checkout #payment div.payment_box textarea::placeholder,
.vertex-checkout-wrapper div.payment_box input::placeholder,
.vertex-checkout-wrapper div.payment_box textarea::placeholder,
.woocommerce-checkout .section.payment-method div.payment_box input::placeholder,
.woocommerce-checkout .section.payment-method div.payment_box textarea::placeholder {
    color: var(--vb-text-muted) !important;
    -webkit-text-fill-color: var(--vb-text-muted) !important;
    opacity: 1 !important;
}

/* Placeholders: gateways often use near-white greys — force readable contrast */
html[data-theme="light"] .vertex-checkout-wrapper div.payment_box input::placeholder,
html[data-theme="light"] .vertex-checkout-wrapper div.payment_box textarea::placeholder,
html[data-theme="light"] .woocommerce-checkout .section.payment-method div.payment_box input::placeholder,
html[data-theme="light"] .woocommerce-checkout .section.payment-method div.payment_box textarea::placeholder {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
}

html[data-theme="dark"] .vertex-checkout-wrapper div.payment_box input::placeholder,
html[data-theme="dark"] .vertex-checkout-wrapper div.payment_box textarea::placeholder,
html[data-theme="dark"] .woocommerce-checkout .section.payment-method div.payment_box input::placeholder,
html[data-theme="dark"] .woocommerce-checkout .section.payment-method div.payment_box textarea::placeholder {
    color: #94a3b8 !important;
    -webkit-text-fill-color: #94a3b8 !important;
}

@media (prefers-color-scheme: light) {
    html:not([data-theme="dark"]) .vertex-checkout-wrapper div.payment_box input::placeholder,
    html:not([data-theme="dark"]) .vertex-checkout-wrapper div.payment_box textarea::placeholder,
    html:not([data-theme="dark"]) .woocommerce-checkout .section.payment-method div.payment_box input::placeholder,
    html:not([data-theme="dark"]) .woocommerce-checkout .section.payment-method div.payment_box textarea::placeholder {
        color: #475569 !important;
        -webkit-text-fill-color: #475569 !important;
    }
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) .vertex-checkout-wrapper div.payment_box input::placeholder,
    html:not([data-theme="light"]) .vertex-checkout-wrapper div.payment_box textarea::placeholder,
    html:not([data-theme="light"]) .woocommerce-checkout .section.payment-method div.payment_box input::placeholder,
    html:not([data-theme="light"]) .woocommerce-checkout .section.payment-method div.payment_box textarea::placeholder {
        color: #94a3b8 !important;
        -webkit-text-fill-color: #94a3b8 !important;
    }
}

/* Instruction lines: gateways set dark green inline — keep readable on dark + light panels */
.vertex-checkout-wrapper div.payment_box .woocommerce-info,
.vertex-checkout-wrapper div.payment_box .woocommerce-message,
.woocommerce-checkout .section.payment-method div.payment_box .woocommerce-info {
    color: var(--vb-text) !important;
    -webkit-text-fill-color: var(--vb-text) !important;
}

.woocommerce-checkout #payment div.payment_box button[type="button"],
.woocommerce-checkout .section.payment-method div.payment_box button[type="button"],
.vertex-checkout-wrapper div.payment_box button[type="button"],
.woocommerce-checkout #payment div.payment_box input[type="button"],
.woocommerce-checkout .section.payment-method div.payment_box input[type="button"],
.vertex-checkout-wrapper div.payment_box input[type="button"] {
    background: var(--vb-bg-select) !important;
    color: var(--vb-text) !important;
    border: 1px solid var(--vb-border) !important;
}

.woocommerce-checkout #payment .form-row.place-order,
.woocommerce-checkout .section.payment-method .form-row.place-order,
.vertex-checkout-wrapper .form-row.place-order {
    background: transparent !important;
    padding-top: 12px;
    margin-top: 8px;
    border-top: 1px solid var(--vb-border-subtle);
}

.woocommerce-checkout #payment .wc_payment_method label img,
.woocommerce-checkout .section.payment-method .wc_payment_method label img {
    max-height: 28px;
    width: auto;
    vertical-align: middle;
}

#checkout-loading {
    border-color: var(--vb-border) !important;
    border-top-color: var(--vb-accent) !important;
}

/* Account navigation & content */
.woocommerce-MyAccount-navigation {
    background: var(--vb-bg-card-alt) !important;
    border-radius: 12px;
}

.woocommerce-MyAccount-navigation ul li a {
    color: var(--vb-text) !important;
    border-bottom-color: var(--vb-border-subtle) !important;
}

.woocommerce-MyAccount-content {
    color: var(--vb-text) !important;
}

.woocommerce-MyAccount-content .woocommerce-Message,
.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-info,
.woocommerce-message {
    color: var(--vb-text) !important;
    background: var(--vb-bg-card-alt) !important;
    border-color: var(--vb-border) !important;
}

.woocommerce-account .addresses .title h3 {
    color: var(--vb-text) !important;
}

.woocommerce-Address-title h3,
.woocommerce-Address address {
    color: var(--vb-text) !important;
}

/* ─── Order received / thank you ─── */
.woocommerce-order-overview,
.woocommerce-order-details,
.woocommerce-customer-details address {
    background: var(--vb-glass-card) !important;
    border-color: var(--vb-glass-border) !important;
}

.woocommerce-order-overview li {
    border-bottom-color: var(--vb-glass-row) !important;
    color: var(--vb-glass-text-muted) !important;
}

.woocommerce-table--order-details tr {
    border-bottom-color: var(--vb-glass-row) !important;
}

.woocommerce-table--order-details .product-name {
    color: var(--vb-text) !important;
}

.woocommerce-customer-details address {
    color: var(--vb-text) !important;
}

.woocommerce-customer-details--email,
.woocommerce-customer-details--phone {
    border-top-color: var(--vb-glass-row) !important;
    color: var(--vb-text) !important;
}

/* Order details table text */
.woocommerce table.shop_table.order_details tfoot th,
.woocommerce table.shop_table.order_details tfoot td {
    color: var(--vb-text) !important;
}

/* ─── Thank you (thankyou.php) — ecommerce.css defaults are dark-only whites ─── */
.vb-ty-progress-track {
    background: rgba(255, 255, 255, 0.08);
}

:root[data-theme="light"] .vb-back-btn,
html[data-theme="light"] .vb-back-btn {
    color: var(--vb-text-muted) !important;
}

:root[data-theme="light"] .vb-back-btn:hover,
html[data-theme="light"] .vb-back-btn:hover {
    color: var(--vb-text) !important;
}

:root[data-theme="light"] .vb-order-num,
html[data-theme="light"] .vb-order-num {
    color: var(--vb-text) !important;
}

:root[data-theme="light"] .vb-ty-card,
html[data-theme="light"] .vb-ty-card {
    background: var(--vb-bg-card-alt) !important;
    border-color: var(--vb-border) !important;
}

:root[data-theme="light"] .vb-ty-card-label,
html[data-theme="light"] .vb-ty-card-label {
    color: var(--vb-text-muted) !important;
}

:root[data-theme="light"] .vb-ty-item-name,
html[data-theme="light"] .vb-ty-item-name {
    color: var(--vb-text) !important;
}

:root[data-theme="light"] .vb-ty-item-meta,
html[data-theme="light"] .vb-ty-item-meta {
    color: var(--vb-text-muted) !important;
}

:root[data-theme="light"] .vb-ty-item-meta strong,
html[data-theme="light"] .vb-ty-item-meta strong {
    color: var(--vb-text-muted2) !important;
}

:root[data-theme="light"] .vb-detail-key,
html[data-theme="light"] .vb-detail-key {
    color: var(--vb-text-muted) !important;
}

:root[data-theme="light"] .vb-detail-val,
html[data-theme="light"] .vb-detail-val {
    color: var(--vb-text) !important;
}

:root[data-theme="light"] .vb-ty-detail-row,
html[data-theme="light"] .vb-ty-detail-row {
    border-bottom-color: var(--vb-border-subtle) !important;
}

:root[data-theme="light"] .vb-ty-total-row,
html[data-theme="light"] .vb-ty-total-row {
    border-top-color: var(--vb-border) !important;
}

:root[data-theme="light"] .vb-total-label,
html[data-theme="light"] .vb-total-label {
    color: var(--vb-text) !important;
}

:root[data-theme="light"] .vb-ty-progress-track,
html[data-theme="light"] .vb-ty-progress-track {
    background: rgba(0, 0, 0, 0.08);
}

@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .vb-back-btn,
    html:not([data-theme="dark"]) .vb-back-btn {
        color: var(--vb-text-muted) !important;
    }

    :root:not([data-theme="dark"]) .vb-back-btn:hover,
    html:not([data-theme="dark"]) .vb-back-btn:hover {
        color: var(--vb-text) !important;
    }

    :root:not([data-theme="dark"]) .vb-order-num,
    html:not([data-theme="dark"]) .vb-order-num {
        color: var(--vb-text) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-card,
    html:not([data-theme="dark"]) .vb-ty-card {
        background: var(--vb-bg-card-alt) !important;
        border-color: var(--vb-border) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-card-label,
    html:not([data-theme="dark"]) .vb-ty-card-label {
        color: var(--vb-text-muted) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-item-name,
    html:not([data-theme="dark"]) .vb-ty-item-name {
        color: var(--vb-text) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-item-meta,
    html:not([data-theme="dark"]) .vb-ty-item-meta {
        color: var(--vb-text-muted) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-item-meta strong,
    html:not([data-theme="dark"]) .vb-ty-item-meta strong {
        color: var(--vb-text-muted2) !important;
    }

    :root:not([data-theme="dark"]) .vb-detail-key,
    html:not([data-theme="dark"]) .vb-detail-key {
        color: var(--vb-text-muted) !important;
    }

    :root:not([data-theme="dark"]) .vb-detail-val,
    html:not([data-theme="dark"]) .vb-detail-val {
        color: var(--vb-text) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-detail-row,
    html:not([data-theme="dark"]) .vb-ty-detail-row {
        border-bottom-color: var(--vb-border-subtle) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-total-row,
    html:not([data-theme="dark"]) .vb-ty-total-row {
        border-top-color: var(--vb-border) !important;
    }

    :root:not([data-theme="dark"]) .vb-total-label,
    html:not([data-theme="dark"]) .vb-total-label {
        color: var(--vb-text) !important;
    }

    :root:not([data-theme="dark"]) .vb-ty-progress-track,
    html:not([data-theme="dark"]) .vb-ty-progress-track {
        background: rgba(0, 0, 0, 0.08);
    }
}

/* ─── Checkout — guest disabled, login required ─── */
.vertex-checkout-wrapper .vb-login-required-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 320px;
    text-align: center;
    padding: 40px 20px;
}

.vertex-checkout-wrapper .vb-login-required-icon {
    font-size: 56px;
    margin-bottom: 16px;
    line-height: 1;
}

.vertex-checkout-wrapper .vb-login-required-title {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 700;
    color: var(--vb-text) !important;
}

.vertex-checkout-wrapper .vb-login-required-text {
    margin: 0 0 24px;
    max-width: 380px;
    color: var(--vb-text-muted) !important;
}

.vertex-checkout-wrapper .vb-checkout-login-btn {
    background: #e8612a;
    color: #fff;
    border: none;
    padding: 14px 40px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s ease;
    letter-spacing: 0.3px;
}

.vertex-checkout-wrapper .vb-checkout-login-btn:hover {
    background: #cf4f1e;
}