/* 
   WooCommerce Custom Styles - Atomic Sarms 
   Directly loaded via functions.php (wp_head) to bypass cache.
*/

/* --- 0. LAYOUT & RESETS --- */
.woocommerce-page .entry-content,
.woocommerce-page .page-content {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

.woocommerce img,
.woocommerce-page img {
    height: auto;
    max-width: 100%;
}

/* Ensure inputs don't overflow containers */
.woocommerce input,
.woocommerce textarea,
.woocommerce select {
    box-sizing: border-box;
    max-width: 100%;
}

/* --- 1. GLOBAL STYLES --- */
body.woocommerce-page {
    background-color: var(--bg-color) !important;
    color: var(--primary-text-color) !important;
}

.woocommerce,
.woocommerce-page {
    color: var(--primary-text-color) !important;
}

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce h4,
.woocommerce h5,
.woocommerce h6 {
    color: var(--primary-text-color) !important;
    font-family: var(--font-primary) !important;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.woocommerce a {
    transition: color 0.3s ease;
}

.woocommerce a:hover {
    color: var(--accent-color-hover) !important;
}

/* --- 2. COMPONENTS (Buttons & Inputs) --- */
body .woocommerce button.button,
body .woocommerce input.button,
body .woocommerce a.button,
body .woocommerce .wc-proceed-to-checkout a.checkout-button,
body .woocommerce button[name="update_cart"],
body .woocommerce button[name="apply_coupon"],
body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body .woocommerce #respond input#submit {
    background: linear-gradient(180deg, #007fff, #012a3d) !important;
    background-image: linear-gradient(180deg, #007fff, #012a3d) !important;
    color: #72c9ff !important;
    padding: 1rem 3rem !important;
    border: none !important;
    border-radius: 8px !important;
    font-family: var(--font-primary) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    font-size: 1rem !important;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    display: inline-block;
    text-decoration: none !important;
    line-height: normal !important;
}

body .woocommerce button.button::before,
body .woocommerce a.button::before,
body .woocommerce button[name="update_cart"]::before,
body .woocommerce button[name="apply_coupon"]::before,
body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button::before,
body .woocommerce .wc-proceed-to-checkout a.checkout-button::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(153, 204, 255, 0.4), transparent 70%);
    opacity: 0;
    transition: opacity 0.5s ease-in-out !important;
}

body .woocommerce button.button:hover::before,
body .woocommerce a.button:hover::before,
body .woocommerce button[name="update_cart"]:hover::before,
body .woocommerce button[name="apply_coupon"]:hover::before,
body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover::before,
body .woocommerce .wc-proceed-to-checkout a.checkout-button:hover::before {
    opacity: 1;
}

body .woocommerce button.button:hover,
body .woocommerce input.button:hover,
body .woocommerce a.button:hover,
body .woocommerce button[name="update_cart"]:hover,
body .woocommerce button[name="apply_coupon"]:hover,
body .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
body .woocommerce .wc-proceed-to-checkout a.checkout-button:hover,
body .woocommerce #respond input#submit:hover {
    transform: translateY(-3px);
    box-shadow: 0 0 30px rgba(153, 204, 255, 0.6),
        0 0 60px rgba(153, 204, 255, 0.4),
        0 0 90px rgba(153, 204, 255, 0.2) !important;
    color: #fff !important;
    background: linear-gradient(180deg, #007fff, #012a3d) !important;
    background-image: linear-gradient(180deg, #007fff, #012a3d) !important;
}

body .woocommerce button.button:active,
body .woocommerce input.button:active,
body .woocommerce a.button:active {
    transform: translateY(-1px);
}

body .woocommerce button.button:disabled,
body .woocommerce input.button:disabled,
body .woocommerce a.button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none !important;
}

/* Ensure text is always on top */
body .woocommerce button .btn-text,
body .woocommerce a .btn-text {
    position: relative;
    z-index: 5;
    display: inline-block;
}

.woocommerce input[type="text"],
.woocommerce input[type="password"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce textarea,
.woocommerce .quantity input.qty,
.select2-selection {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--primary-text-color) !important;
    padding: 15px 20px !important;
    border-top: 3px solid var(--accent-color-3) !important;
}

/* --- 2.1 INPUT VALIDATION --- */
/* Validated (Green) */
.woocommerce-validated input,
.woocommerce-validated select,
.woocommerce-validated .select2-selection {
    border-top-color: var(--accent-color-3) !important;
}

/* Invalid (Red) */
.woocommerce-invalid input,
.woocommerce-invalid select,
.woocommerce-invalid .select2-selection,
.woocommerce-invalid .select2-selection--single {
    border-top-color: #ff4444 !important;
}



/* --- 2.2 CHECKOUT FORM LAYOUT (Clean & Streamlined) --- */

/* Add breathing room to section title */
.woocommerce-checkout h3 {
    font-size: 1.5rem !important;
    border-bottom: 2px solid #222;
    /* Subtle divider */
    padding-bottom: 8px;
    padding-top: 3px;
    display: inline-block;
}

/* Hide Company Field (Visual) */
#billing_company_field {
    display: none !important;
}

/* Labels: subtle and clean */
.woocommerce-checkout form .form-row label {
    font-size: 0.9rem !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
}

/* Hide (Optional) text - cleaner look */
@keyframes slideInRight {
    from {
        transform: translateX(120%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Keyframes for slide-out animation */
@keyframes slideOutRight {
    from {
        transform: translateX(0);
        opacity: 1;
    }

    to {
        transform: translateX(120%);
        opacity: 0;
    }
}

.sarms-toast-hiding {
    animation: slideOutRight 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) forwards !important;
    opacity: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}

/* Base style for all notices - Right Side Toast */
/* Broad selectors to catch ALL injections */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info,
ul.woocommerce-error,
div.woocommerce-error,
div.woocommerce-message,
div.woocommerce-info,
.coupon-error-notice,
#coupon-error-notice {
    position: fixed !important;
    top: 100px !important;
    /* Below header */
    right: 20px !important;
    left: auto !important;
    width: auto !important;
    min-width: 250px;
    max-width: 350px;
    z-index: 2147483647 !important;
    padding: 1rem 1rem !important;
    margin: 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
    animation: slideInRight 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) forwards !important;

    /* Theme Integration */
    background-color: #111 !important;
    color: #fff !important;
    border: 1px solid #333 !important;

    display: flex !important;
    flex-direction: row;
    /* Icon and text side-by-side */
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    gap: 1rem;
    list-style: none !important;
    float: none !important;
    clear: both !important;
}

/* Remove Overlay (Toast doesn't block screen) */
.woocommerce-error::after,
.woocommerce-message::after,
.woocommerce-info::after,
ul.woocommerce-error::after,
.coupon-error-notice::after,
#coupon-error-notice::after {
    display: none !important;
}

/* Icons - SVG Data URIs for Robustness */
.woocommerce-error::before,
.woocommerce-message::before,
.woocommerce-info::before,
ul.woocommerce-error::before,
.coupon-error-notice::before,
#coupon-error-notice::before {
    content: '' !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    flex-shrink: 0 !important;

    /* Reset Positioning to prevent overlaps */
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    border: none !important;
}

/* Specific Icons/Colors & SVG Backgrounds */
.woocommerce-error,
ul.woocommerce-error,
.coupon-error-notice,
#coupon-error-notice {
    border-top: 3px solid #ff4444 !important;
}

.woocommerce-message {
    border-top: 3px solid #00C851 !important;
}

.woocommerce-info {
    border-top: 3px solid #33b5e5 !important;
}

/* ERROR ICON (Red Cross circle) */
.woocommerce-error::before,
ul.woocommerce-error::before,
.coupon-error-notice::before,
#coupon-error-notice::before {
    /* SVG: Red Circle X */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ff4444' d='M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm121.6 313.1c4.7 4.7 4.7 12.3 0 17L338 377.6c-4.7 4.7-12.3 4.7-17 0L256 312l-65.1 65.6c-4.7 4.7-12.3 4.7-17 0L134.4 338c-4.7-4.7-4.7-12.3 0-17l65.6-65-65.6-65.1c-4.7-4.7-4.7-12.3 0-17l39.6-39.6c4.7-4.7 12.3-4.7 17 0l65 65.7 65.1-65.6c4.7-4.7 12.3-4.7 17 0l39.6 39.6c4.7 4.7 4.7 12.3 0 17L312 256l65.6 65.1z'/%3E%3C/svg%3E") !important;
}

/* SUCCESS ICON (Green Check circle) */
.woocommerce-message::before {
    /* SVG: Green Circle Check */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%2300C851' d='M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628 0z'/%3E%3C/svg%3E") !important;
}

/* INFO ICON (Blue Info circle) */
.woocommerce-info::before {
    /* SVG: Blue Circle Info */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%2333b5e5' d='M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z'/%3E%3C/svg%3E") !important;
}

/* Text & Links */
.woocommerce-error li,
ul.woocommerce-error li,
.coupon-error-notice {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 1rem;
}

.woocommerce-error a,
.woocommerce-message a,
.woocommerce-info a {
    text-decoration: underline;
    color: inherit !important;
    margin-left: 5px;
    font-weight: bold;
    display: inline-block;
    margin-top: 0;
}

/* Buttons inside toast */
.woocommerce-error .button,
.woocommerce-message .button,
.woocommerce-info .button {
    width: auto !important;
    margin: 0 0 0 auto !important;
    /* Push to right */
    padding: 0.5rem 1rem !important;
    font-size: 0.8rem;
    border: 1px solid #555 !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
}

.woocommerce-error .button:hover,
.woocommerce-message .button:hover,
.woocommerce-info .button:hover {
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
}

/* Hide (Optional) text - cleaner look */
@keyframes slideInRight {
    from {
        transform: translateX(120%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Keyframes for slide-out animation */
@keyframes slideOutRight {
    from {
        transform: translateX(0);
        opacity: 1;
    }

    to {
        transform: translateX(120%);
        opacity: 0;
    }
}

.sarms-toast-hiding {
    animation: slideOutRight 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) forwards !important;
    opacity: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}

/* --- 2.3 DESKTOP/TABLET 2-COLUMN LAYOUT --- */
@media (min-width: 1024px) {
    /* 
       Split checkout into 2 columns using Grid Areas for precise placement.
       Left: Billing Details
       Right: Order Heading + Order Review
    */

    form.woocommerce-checkout {
        display: grid !important;
        grid-template-columns: 1fr 400px;
        grid-template-rows: auto auto;
        grid-template-areas:
            "billing order-heading"
            "billing order-review";
        gap: 0 40px;
        /* Row gap handled by elements, Column gap 40px */
        align-items: start;
    }

    /* Left Column Area */
    #customer_details {
        grid-area: billing;
        width: 90% !important;
        float: none !important;
        margin-right: 0 !important;
    }

    /* Right Column Area: Heading */
    #order_review_heading {
        grid-area: order-heading;
        width: 100% !important;
        float: none !important;
        margin-top: 0 !important;
        margin-bottom: 20px !important;
        padding-top: 0 !important;
    }

    /* Right Column Area: Review & Payment */
    #order_review {
        grid-area: order-review;
        width: 100% !important;
        float: none !important;
        clear: none !important;

        /* Sticky styling */
        position: sticky;
        top: 120px;
    }

    /* RESET: Ensure internal structural floats don't break the grid item width */
    .col2-set,
    .col2-set .col-1,
    .col2-set .col-2 {
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        max-width: 100% !important;
    }

    /* Ensure hidden inputs don't mess with grid */
    form.woocommerce-checkout>input {
        display: none !important;
    }
}

/* Tablet intermediary - Stack or 50/50? User said Desktop/Tablet so keeping columns */
@media (min-width: 768px) and (max-width: 1023px) {
    form.woocommerce-checkout {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
        grid-template-areas:
            "billing order-heading"
            "billing order-review";
        gap: 0 30px;
    }

    #customer_details {
        grid-area: billing;
        width: 90% !important;
    }

    #order_review_heading {
        grid-area: order-heading;
    }

    #order_review {
        grid-area: order-review;
    }

    /* Reset floats here too */
    .col2-set,
    .col2-set .col-1,
    .col2-set .col-2 {
        width: 100% !important;
        float: none !important;
    }
}

/* --- 3. MOBILE CART RESTORATION --- */
@media (max-width: 768px) {

    /* Product Thumbnail - Visible & Centered */
    .woocommerce table.cart .product-thumbnail,
    .woocommerce-page table.cart .product-thumbnail {
        display: block !important;
        text-align: center !important;
    }

    .woocommerce table.cart .product-thumbnail img,
    .woocommerce-page table.cart .product-thumbnail img {
        display: block !important;
        height: auto;
        max-width: 80px;
        margin: 0 auto !important;
    }

    .woocommerce table.cart .product-thumbnail::before,
    .woocommerce-page table.cart .product-thumbnail::before {
        display: none !important;
    }

    /* Remove (X) Button - Top Right */
    .woocommerce table.shop_table_responsive tr,
    .woocommerce-page table.shop_table_responsive tr {
        position: relative;
    }

    .woocommerce table.shop_table_responsive tr td.product-remove,
    .woocommerce-page table.shop_table_responsive tr td.product-remove {
        position: absolute !important;
        top: 0;
        right: 0;
        width: auto !important;
        border: none !important;
        padding: 5px 10px !important;
    }

    /* Stacked Buttons */
    .woocommerce .coupon .input-text,
    .woocommerce .coupon .button,
    .woocommerce button[name="update_cart"] {
        width: 100% !important;
        float: none !important;
        display: block !important;
        margin-bottom: 10px !important;
    }

    .woocommerce button[name="update_cart"] {
        margin-top: 10px !important;
    }
}

/* --- 3.1 CRYPTO PAYMENT STYLES --- */
/* Target specific payment method label for Blockonomics */
.payment_method_blockonomics label {
    text-align: center !important;
    display: block !important;
    width: 100% !important;

    /* Make it look more like a title */
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 1.1rem !important;
    /* Slight increase, not too much */
    letter-spacing: 1px !important;
    color: #fff !important;
    /* Ensure it stands out against dark theme */
    padding-bottom: 10px !important;
}

/* Center the image within the label if it's distinct */
.payment_method_blockonomics label img {
    margin: 10px auto !important;
    /* Add space around image */
    display: block !important;
    float: none !important;
}

/* Style the speech bubble (payment box) */
.payment_method_blockonomics .payment_box {
    background-color: #0056b3 !important;
    /* Darker Blue */
    color: #ffffff !important;
    border: none !important;
    text-align: center !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3) !important;
    /* Add depth */
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    font-weight: 1000 !important;
    margin-bottom: 10px !important;
    /* Make text all caps */
}

/* Change the triangle arrow color to match */
.payment_method_blockonomics .payment_box::before {
    border-bottom-color: #0056b3 !important;
    /* Darker Blue */
    top: -20px !important;

    /* Center the arrow dynamically */
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-left: 0 !important;
    /* Override core margins */
    border-width: 15px !important;
    /* Ensure consistent size */
}


/* Fallback: Hide Privacy Policy Text if Filter Fails */
.woocommerce-checkout .woocommerce-privacy-policy-text {
    display: none !important;
}

/* Make "Pay with Crypto" button full width */
.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
    width: 100% !important;
    float: none !important;
}

/* --- 4. BLOCKONOMICS CRYPTO PAGE --- */

/* Main Container */
.bnomics-order-container {
    background-color: #0d1e2e !important;
    /* Deep dark blue background */
    border: 1px solid #1f3a52 !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
    padding: 30px !important;
    color: #ffffff !important;
    margin-top: 20px !important;
    max-width: 600px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    font-family: 'Roboto', sans-serif !important;
}

/* Header */
.bnomics-header {
    border-bottom: 1px solid #1f3a52 !important;
    padding-bottom: 15px !important;
    margin-bottom: 20px !important;
}

.bnomics-order-id {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: #007fff !important;
    /* Bright blue accent */
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Inputs */
.bnomics-copy-container input {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid #1f3a52 !important;
    color: #d1d5db !important;
    /* Light gray text */
    padding: 12px 15px !important;
    border-radius: 6px !important;
    font-size: 0.95rem !important;
    width: 100% !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}

.bnomics-copy-container input:focus {
    border-color: #007fff !important;
    outline: none !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Copy Icons */
.blockonomics-icon-copy {
    color: #007fff !important;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.blockonomics-icon-copy:hover {
    opacity: 1;
}

/* Labels (Send to..., Amount...) */
.bnomics-address-text,
.bnomics-amount-text {
    color: #9ca3af !important;
    /* Muted gray */
    font-size: 0.9rem !important;
    display: block !important;
    margin-bottom: 8px !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
}

/* QR Code Section */
.bnomics-qr-block {
    background-color: #ffffff !important;
    padding: 15px !important;
    border-radius: 8px !important;
    display: inline-block !important;
    margin-bottom: 20px !important;
}

.bnomics-qr {
    text-align: center !important;
}

/* Hiding titles */
.scan-title,
.copy-title {
    display: none !important;
    /* Clean up visual noise */
}


/* Footer & Timer */
.bnomics-crypto-price-timer {
    color: #9ca3af !important;
    font-size: 0.85rem !important;
    margin-top: 15px !important;
    display: block !important;
}

#bnomics-crypto-rate {
    color: #fff !important;
    font-weight: bold !important;
}

.bnomics-time-left {
    color: #007fff !important;
    font-weight: bold !important;
}

/* Link cleanups */
.bnomics-qr-link {
    color: #007fff !important;
    text-decoration: none !important;
    font-size: 0.9rem !important;
    margin-top: 10px !important;
    display: block !important;
}

.bnomics-qr-link:hover {
    text-decoration: underline !important;
}

/* Copied Success Overlay - Professional Styling */
.output-copy-container .copied-overlay {
    background-color: #000000 !important;
    /* Black background as requested */
    color: #28a745 !important;
    /* Professional Green Text */
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 0.9rem !important;
    letter-spacing: 0.5px !important;

    padding: 6px 12px !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;

    /* Position it nicely over the element */
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 100 !important;

    /* Ensure visibility against any background */
    border: 1px solid #28a745 !important;
    text-align: center !important;
    white-space: nowrap !important;
}

/* Ensure container has relative positioning for the overlay */
.output-copy-container {
    position: relative !important;
}

/* Hide Order Actions Row (Pay/Cancel) */
.order-actions--heading,
tr:has(.order-actions--heading) {
    display: none !important;
}

/* Fallback for browsers (like older Safari) that might not support :has yet */
.order-actions--heading {
    display: none !important;
}

.order-actions-button {
    display: none !important;
}

tbody+tfoot>tr:first-child:has(.order-actions--heading) {
    display: none !important;
}

/* --- 5. ORDER RECEIVED PAGE --- */

/* Page Title & Headings */
.woocommerce-order-received .entry-title,
.woocommerce-order-received h2,
.woocommerce-order-received h3 {
    text-transform: uppercase !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    color: #ffffff !important;
    text-align: center !important;
    margin-top: 30px !important;
    margin-bottom: 20px !important;
}

/* Thank you message */
.woocommerce-thankyou-order-received {
    text-align: center !important;
    font-size: 1.1rem !important;
    margin-bottom: 30px !important;
    color: #a0a0a0 !important;
}

/* Order Overview List (Order #, Date, Total, etc) */
ul.order_details {
    display: flex !important;
    justify-content: center !important;
    gap: 30px !important;
    background: transparent !important;
    border: none !important;
    margin-bottom: 40px !important;
    padding: 0 !important;
    list-style: none !important;
    flex-wrap: wrap !important;
}

ul.order_details li {
    float: none !important;
    border-right: 1px solid #333 !important;
    margin-right: 0 !important;
    padding-right: 30px !important;
    text-transform: uppercase !important;
    font-size: 0.9rem !important;
    margin-bottom: 10px !important;
    width: auto !important;
}

ul.order_details li:last-child {
    border: none !important;
    padding-right: 0 !important;
}

ul.order_details li strong {
    display: block !important;
    font-size: 1.1rem !important;
    color: #ffffff !important;
    margin-top: 5px !important;
}

/* Order Details & Address Tables */
.woocommerce-order-details,
.woocommerce-customer-details {
    max-width: 800px;
    margin: 0 auto;
}

table.shop_table.order_details,
table.shop_table.customer_details {
    background-color: #0c0c0c !important;
    /* Extremely dark grey/black */
    border: 1px solid #1f3a52 !important;
    /* Blue-ish border */
    border-radius: 12px !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5) !important;
    color: #fff !important;
    overflow: hidden !important;
    margin-bottom: 40px !important;
}

table.shop_table.order_details thead th,
table.shop_table.customer_details thead th {
    background-color: #0d1e2e !important;
    /* Dark Blue Header */
    color: #99ccff !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    border-bottom: 1px solid #1f3a52 !important;
    padding: 15px !important;
}

table.shop_table.order_details td,
table.shop_table.order_details tfoot th,
table.shop_table.customer_details td {
    border-top: 1px solid #1f1f1f !important;
    padding: 15px !important;
    color: #ccc !important;
}

table.shop_table.order_details tfoot th {
    color: #fff !important;
    text-transform: uppercase !important;
    font-size: 0.9rem !important;
}

table.shop_table.order_details tfoot tr:last-child th,
table.shop_table.order_details tfoot tr:last-child td {
    border-top: 2px solid #1f3a52 !important;
    color: #007fff !important;
    /* Highlighting Total */
    font-weight: 700 !important;
    font-size: 1.2rem !important;
}

/* Address Boxes */
.woocommerce-customer-details address {
    border: 1px solid #1f3a52 !important;
    border-radius: 8px !important;
    padding: 20px !important;
    background-color: #0d1e2e !important;
    color: #ccc !important;
    font-style: normal !important;
}

/* Mobile responsive for list */
@media (max-width: 768px) {
    ul.order_details {
        flex-direction: column !important;
        align-items: center !important;
        background: #0d1e2e !important;
        padding: 20px !important;
        border-radius: 12px !important;
    }

    ul.order_details li {
        border-right: none !important;
        border-bottom: 1px solid #333 !important;
        padding-right: 0 !important;
        padding-bottom: 15px !important;
        width: 100% !important;
        text-align: center !important;
    }

    ul.order_details li:last-child {
        border-bottom: none !important;
        padding-bottom: 0 !important;
    }

    /* Force Table to be Responsive Stack */
    table.shop_table.order_details,
    table.shop_table.order_details thead,
    /* --- MOBILE TABLE REDESIGN (Flexbox Single Card) --- */

    /* 1. Container - Single Dark Blue Card */
    table.shop_table.order_details {
        display: block !important;
        width: 100% !important;
        background-color: #0d1e2e !important;
        /* MATCHING TOP CARD COLOR */
        border: 1px solid #1f3a52 !important;
        border-radius: 12px !important;
        overflow: hidden !important;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5) !important;
        margin-top: 20px !important;
    }

    /* 2. Global Resets for Rows/Cells */
    table.shop_table.order_details tbody,
    table.shop_table.order_details tfoot,
    table.shop_table.order_details th,
    table.shop_table.order_details tr,
    table.shop_table.order_details td {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 3. Hide Thead */
    table.shop_table.order_details thead {
        display: none !important;
    }

    /* 4. Rows - Transparent & Divided (NOT separate boxes) */
    table.shop_table.order_details tbody tr,
    table.shop_table.order_details tfoot tr {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;

        background: transparent !important;
        /* No Individual BG */
        border: none !important;
        border-bottom: 1px solid #1f3a52 !important;
        /* Internal Divider */
        margin: 0 !important;
        /* No Spacing */
        padding: 15px !important;
        border-radius: 0 !important;
        /* Square Corners */
    }

    /* Remove divider from very last row */
    table.shop_table.order_details tfoot tr:last-child {
        border-bottom: none !important;
    }

    /* 5. Product Name Cell */
    table.shop_table.order_details tbody td.product-name {
        width: 70% !important;
        text-align: left !important;
        border: none !important;
        padding: 0 !important;
        color: #fff !important;
        font-weight: 700 !important;
        display: block !important;
    }

    /* Product Total Cell */
    table.shop_table.order_details tbody td.product-total {
        width: 25% !important;
        text-align: right !important;
        border: none !important;
        padding: 0 !important;
        color: #fff !important;
        display: block !important;
    }

    /* 6. Footer Cells (Subtotal, Tax, Etc) */
    table.shop_table.order_details tfoot th {
        width: auto !important;
        text-align: left !important;
        color: #9ca3af !important;
        /* Gray Label */
        text-transform: uppercase !important;
        font-size: 0.85rem !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    table.shop_table.order_details tfoot td {
        width: auto !important;
        text-align: right !important;
        color: #fff !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    /* 7. Highlight Final Total Row */
    table.shop_table.order_details tfoot tr:last-child th,
    table.shop_table.order_details tfoot tr:last-child td {
        color: #007fff !important;
        /* Blue Highlight */
        font-size: 1.1rem !important;
        font-weight: 700 !important;
    }

    /* 8. Explicitly Hide Actions */
    table.shop_table.order_details th.order-actions--heading,
    table.shop_table.order_details tr:has(.order-actions--heading),
    table.shop_table.order_details td[data-title="Actions:"],
    table.shop_table.order_details td[data-title="Actions"] {
        display: none !important;
    }
}

/* --- 6. MY ACCOUNT PAGE --- */




/* Safety Close for any previous open blocks */

/* --- 6. MY ACCOUNT PAGE (High Specificity Fix) --- */

/* Wrapper - Use Grid for layout stability */
body.woocommerce-account .woocommerce {
    display: grid !important;
    /* Fixed Sidebar | Fluid Content */
    gap: 7px !important;
    max-width: 1600px !important;
    margin: 0 auto !important;
    align-items: start !important;
    width: 100% !important;
    justify-items: center;
}

@media (min-width: 768px) {

    body.woocommerce-account .entry-title,
    .page-title-heading {
        margin-top: 4rem !important;
        margin-bottom: 4rem !important;
    }
}

/* Base style for Page Title (replacing inline styles) */
.page-title-heading {
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 2rem;
    margin-top: 2rem;
    font-family: var(--font-primary);
}

/* 6.1 LOGIN / REGISTER FORM - Grid Override */
#customer_login {
    grid-column: 1 / -1 !important;
    /* Full width */
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 30px !important;
    justify-content: center !important;
}

/* 6.2 NAVIGATION SIDEBAR */
body.woocommerce-account .woocommerce-MyAccount-navigation {
    background-color: #0d1e2e !important;
    border: 1px solid #1f3a52 !important;
    border-radius: 12px !important;
    margin: 0 !important;
    width: 100% !important;
    height: fit-content !important;
    position: unset !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block !important;
    color: #cbd5e1 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    background: transparent !important;
    box-sizing: border-box !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background-color: #007fff !important;
    color: #fff !important;
    font-weight: 700 !important;
}

/* 6.3 CONTENT AREA */
body.woocommerce-account .woocommerce-MyAccount-content {
    background-color: #0d1e2e !important;
    border: 1px solid #1f3a52 !important;
    border-radius: 12px !important;
    padding: 30px !important;
    color: #cbd5e1 !important;
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    /* Flex/Grid Overflow Fix */
}

/* --- 7. CUSTOM MOBILE MENU (PHP INJECTED) --- */
.custom-mobile-menu {
    display: none;
    /* Hidden on Desktop */
}

/* RESPONSIVE: TABLET & MOBILE (< 992px) */
@media (max-width: 992px) {
    body.woocommerce-account .woocommerce {
        display: flex !important;
        flex-direction: column !important;
    }



    /* Show CUSTOM Injection */
    .custom-mobile-menu {
        display: contents !important;
        width: 100% !important;
        margin-bottom: 25px !important;
    }

    .custom-mobile-menu ul {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        /* 2-Column Grid */
        gap: 10px !important;
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
    }

    .custom-mobile-menu ul li {
        margin: 0 !important;
        padding: 0 !important;
    }

    .custom-mobile-menu ul li a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background-color: #0d1e2e !important;
        border: 1px solid #1f3a52 !important;
        border-radius: 8px !important;
        padding: 12px 10px !important;
        color: #fff !important;
        font-weight: 600 !important;
        font-size: 0.85rem !important;
        text-align: center !important;
        text-decoration: none !important;
        text-transform: uppercase !important;
        min-height: 40px !important;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3) !important;
        box-sizing: border-box !important;
    }

    .custom-mobile-menu ul li.is-active a {
        background-color: #007fff !important;
        border-color: #007fff !important;
        box-shadow: 0 0 10px rgba(0, 127, 255, 0.4) !important;
    }

    /* Content Area Adjustment */
    .woocommerce-MyAccount-content {
        width: 100% !important;
        padding: 20px !important;
    }
}

/* Tiny Mobile Screens - Stack Pills if needed or Grid */
@media (max-width: 480px) {
    .woocommerce-MyAccount-navigation ul {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        /* 2 Column Grid */
    }

    .woocommerce-MyAccount-navigation ul li a {
        width: 100% !important;
        border-radius: 8px !important;
        /* Reg Card Shape */
        padding: 12px 10px !important;
        font-size: 0.85rem !important;
    }
}

/* 6.1 LOGIN / REGISTER FORM */
.woocommerce-account h2 {
    text-transform: uppercase !important;
    font-size: 1.5rem !important;
    color: #fff !important;
    margin-bottom: 20px !important;
    text-align: center !important;
}

#customer_login {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
    width: 100%;
}

.u-column1,
.u-column2 {
    background-color: #0d1e2e;
    /* Dark Blue Card */
    border: 1px solid #1f3a52;
    border-radius: 12px;
    padding: 15px;
    flex: 1;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

.woocommerce-form-login label,
.woocommerce-form-register label {
    color: #9ca3af;
    text-transform: uppercase;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 5px;
    display: block;
}

.woocommerce-form-login input.input-text,
.woocommerce-form-register input.input-text {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid #1f3a52 !important;
    color: #fff !important;
    padding: 12px !important;
    border-radius: 6px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce-form-login input.input-text:focus,
.woocommerce-form-register input.input-text:focus {
    border-color: #007fff !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(0, 127, 255, 0.2) !important;
}

.woocommerce-form-login button.button,
.woocommerce-form-register button.button {
    background-color: #007fff !important;
    color: #fff !important;
    width: 100% !important;
    padding: 12px !important;
    border-radius: 6px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    margin-top: 10px !important;
}

.woocommerce-form-login button.button:hover,
.woocommerce-form-register button.button:hover {
    background-color: #0056b3 !important;
}

/* 6.2 MY ACCOUNT DASHBOARD (Logged In) */

/* Navigation Sidebar */
.woocommerce-MyAccount-navigation {
    flex: 0 0 250px;
    background-color: #0d1e2e;
    border: 1px solid #1f3a52;
    border-radius: 12px;
    padding: 0px 0;
    height: fit-content;
}

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.woocommerce-MyAccount-navigation ul li {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none;
}

.woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 15px 25px;
    color: #cbd5e1;
    text-decoration: none;
    transition: all 0.2s ease;
    font-weight: 500;
}

.woocommerce-MyAccount-navigation ul li a:hover {
    background-color: rgba(255, 255, 255, 0.05);
    color: #fff;
    padding-left: 30px;
    /* Slight slide effect */
}

.woocommerce-MyAccount-navigation ul li.is-active a {
    background-color: #007fff;
    color: #fff;
    font-weight: 700;
    box-shadow: 0 0 15px rgba(0, 127, 255, 0.3);
}

/* High Specificity Hover Fix */
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a:hover,
.woocommerce-MyAccount-navigation ul li.is-active a:hover {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* Content Area */
.woocommerce-MyAccount-content {
    flex: 1;
    background-color: #0d1e2e;
    border: 1px solid #1f3a52;
    border-radius: 12px;
    padding: 30px;
    color: #cbd5e1;
}

.woocommerce-MyAccount-content p {
    font-size: 1rem;
    line-height: 1.6;
}

.woocommerce-MyAccount-content a {
    color: #007fff;
    text-decoration: none;
}

/* Reuse Table Styles for Orders (Ensure they apply here) */
.woocommerce-MyAccount-content table.shop_table {
    background-color: transparent !important;
    /* Content area is already dark */
    border: none !important;
    box-shadow: none !important;
    margin-top: 0 !important;
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
}

/* Orders Table Desktop Adjustments */
.woocommerce-MyAccount-content table.shop_table thead {
    display: table-header-group !important;
    /* Bring back headers on desktop */
}

.woocommerce-MyAccount-content table.shop_table thead th {
    background-color: #1f3a52 !important;
    color: #fff !important;
    padding: 15px !important;
    text-transform: uppercase !important;
    border: none !important;
}

.woocommerce-MyAccount-content table.shop_table tbody tr {
    background-color: rgba(255, 255, 255, 0.02) !important;
    border-radius: 8px !important;
}

.woocommerce-MyAccount-content table.shop_table td {
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding: 15px !important;
    color: #fff !important;
}

.woocommerce-MyAccount-content a.button {
    background-color: #007fff !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 8px 15px !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
}

/* Address Styling in My Account */
.woocommerce-MyAccount-content address {
    border: 1px solid #1f3a52;
    background: var(--card-bg) !important;
    padding: 20px;
    border-radius: 8px;
    font-style: normal;
    color: #cbd5e1;
}

.woocommerce-Address-title title {
    position: unset !important;
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.woocommerce .col2-set .col-1,
.woocommerce-page .col2-set .col-1 {
    width: -webkit-fill-available !important;
}


/* Mobile Responsiveness for My Account */
@media (max-width: 991px) {

    /* Increased breakpoint for tablets */
    .woocommerce-account .woocommerce {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
    }

    .woocommerce-MyAccount-navigation {
        width: 100% !important;
        flex: none !important;
        margin-bottom: 30px !important;
    }

    .woocommerce-MyAccount-navigation ul {
        display: flex !important;
        white-space: nowrap !important;
        padding-bottom: 5px !important;
    }

    .woocommerce-MyAccount-navigation ul li {
        border-bottom: none;
    }

    .woocommerce-MyAccount-navigation ul li a {
        padding: 15px 20px;
    }

    /* Reuse Orders Mobile Stack (Inherits from previous rules, but ensure specific overrides if needed) */
    .woocommerce-MyAccount-content table.shop_table thead {
        display: none !important;
        /* Hide headers again on mobile */
    }
}

.woocommerce .woocommerce-customer-details address {
    font-style: normal;
    margin-bottom: 0;
    border: 1px solid rgba(0, 0, 0, .1);
    border-bottom-width: 2px;
    border-right-width: 2px;
    text-align: left;
    width: 100%;
    border-radius: 5px;
    padding: 6px 12px;
    box-sizing: border-box;
    background: var(--card-bg) !important;
}



/* --- 5. CORE OVERRIDES --- */
/* Fix linting error for variation selects (Vendor prefixes order) */
.woocommerce div.product form.cart .variations select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 3em;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItY2hldnJvbi1kb3duIj48cG9seWxpbmUgcG9pbnRzPSI2IDkgMTIgMTUgMTggOSI+PC9wb2x5bGluZT48L3N2Zz4=) no-repeat;
    -webkit-background-size: 16px;
    background-size: 16px;
    -webkit-background-position: calc(100% - 12px) 50%;
    background-position: calc(100% - 12px) 50%
}

/* --- 6. MY ACCOUNT NAVIGATION HOVER REFINEMENT --- */
/* Override generic shake animation and apply premium Electric Blue slide effect */
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    transition: all 0.3s ease;
    border-left: 3px solid transparent;
    /* Prepare for border transition */
    display: block;
    /* Ensure full clickable area */
}

/* Specific hover state for My Account links - High Specificity */
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    animation: none !important;
    /* HOSTILE OVERRIDE: Remove the shake */
    color: #007fff !important;
    /* Turn Electric Blue */
    padding-left: 15px;
    /* Slide Text Right */
    border-left: 3px solid #007fff;
    /* Electric Blue Marker */
    background: linear-gradient(90deg, rgba(0, 127, 255, 0.1) 0%, transparent 100%);
    /* Subtle Blue Fade */
    text-shadow: 0 0 10px rgba(0, 127, 255, 0.3);
    /* Soft Blue Glow */
}