/*
Theme Name: VPNSPOOF
Author: Gemini
Description: High-performance AI VPN theme focused on location spoofing. WooCommerce Ready.
Version: 1.2
*/

:root {
    --bg-dark: #0b0d11;
    --bg-card: #15181e;
    --primary: #00e0a6; /* Neon Green/Teal */
    --text-main: #ffffff;
    --text-muted: #8b9bb4;
    --font-main: 'Inter', sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { background-color: var(--bg-dark); color: var(--text-main); font-family: var(--font-main); line-height: 1.6; }
a { text-decoration: none; color: inherit; transition: 0.3s; }
a:hover { color: var(--primary); }
ul { list-style: none; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.btn { display: inline-block; padding: 12px 30px; border-radius: 50px; font-weight: 600; cursor: pointer; text-decoration: none; }
.btn-primary { background-color: var(--primary); color: var(--bg-dark); border: 1px solid var(--primary); }
.btn-primary:hover { box-shadow: 0 0 15px var(--primary); color: #000; }
.btn-outline { background: transparent; border: 1px solid #333; color: #fff; }
.btn-outline:hover { border-color: var(--primary); color: var(--primary); }
.btn-sm { padding: 8px 16px; font-size: 0.85rem; }

.text-center { text-align: center; }
.section-padding { padding: 80px 0; }

/* Header */
header { padding: 20px 0; position: fixed; width: 100%; z-index: 1000; background: rgba(11, 13, 17, 0.8); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(255,255,255,0.05); transition: 0.3s; }
.nav-wrapper { display: flex; justify-content: space-between; align-items: center; }
.logo { font-size: 1.5rem; font-weight: bold; color: var(--primary); }
.main-menu { display: flex; gap: 30px; }
.main-menu a { font-size: 0.9rem; color: var(--text-muted); }
.main-menu a:hover { color: var(--text-main); }
.header-actions { display: flex; gap: 15px; }

/* Hero */
.hero { 
    padding-top: 150px; padding-bottom: 80px; 
    background: 
        radial-gradient(circle at 50% 0%, #1a2a25 0%, var(--bg-dark) 60%);
    display: flex; align-items: center; 
}
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.hero-text h1 { font-size: 3.5rem; line-height: 1.1; margin-bottom: 20px; }
.hero-text p { color: var(--text-muted); margin-bottom: 30px; }
.hero-stats { display: flex; gap: 30px; margin-top: 40px; }
.hero-img img { width: 100%; height: auto; display: block; margin: auto; transition: transform 0.3s ease; animation: float 6s ease-in-out infinite; }
.hero .btn-primary { animation: btn-pulse 2s infinite; }

/* Features */
.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin-top: 50px; }
.feature-card { background: var(--bg-card); padding: 30px; border-radius: 20px; border: 1px solid #2a2e35; transition: 0.3s; }
.feature-card:hover { transform: translateY(-10px); border-color: var(--primary); box-shadow: 0 10px 30px rgba(0, 224, 166, 0.1); }
.feature-card h3 { margin-bottom: 10px; }
.feature-card p { color: var(--text-muted); font-size: 0.9rem; }

/* Pricing */
.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; margin-top: 50px; max-width: 1100px; margin-left: auto; margin-right: auto; }
.pricing-card { background: #15181e; padding: 40px; border-radius: 24px; border: 1px solid #2a2e35; position: relative; display: flex; flex-direction: column; transition: 0.3s; overflow: hidden; }
.pricing-card:hover { transform: translateY(-10px); border-color: #333; }
.pricing-card.featured { background: linear-gradient(145deg, #1a1d24, #15181e); border: 1px solid var(--primary); box-shadow: 0 0 40px rgba(0, 224, 166, 0.15); transform: scale(1.05); z-index: 2; }
.pricing-card.featured:hover { transform: scale(1.05) translateY(-5px); box-shadow: 0 0 60px rgba(0, 224, 166, 0.25); }
.price { font-size: 3.5rem; font-weight: 800; margin: 20px 0 10px; color: #fff; letter-spacing: -1px; }
.price span { font-size: 1rem; color: var(--text-muted); font-weight: 500; }
.pricing-badge { display: inline-block; background: rgba(0, 224, 166, 0.15); color: var(--primary); padding: 5px 12px; border-radius: 20px; font-size: 0.8rem; font-weight: bold; margin-bottom: 10px; }
.pricing-features { margin: 30px 0; text-align: left; }
.pricing-features li { margin-bottom: 15px; color: #ccc; font-size: 0.95rem; display: flex; align-items: center; gap: 10px; }
.pricing-features li svg { width: 18px; height: 18px; fill: var(--primary); flex-shrink: 0; }
.pricing-btn { margin-top: auto; width: 100%; text-align: center; padding: 15px; border-radius: 12px; font-weight: 700; transition: 0.3s; background: rgba(255,255,255,0.05); color: #fff; border: 1px solid rgba(255,255,255,0.1); }
.pricing-btn:hover { background: #fff; color: #000; }
.featured .pricing-btn { background: var(--primary); color: #000; border: none; box-shadow: 0 10px 20px rgba(0, 224, 166, 0.3); }
.featured .pricing-btn:hover { background: #fff; box-shadow: 0 10px 30px rgba(255, 255, 255, 0.3); }

/* Security Features Grid (New) */
.security-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 25px; margin-top: 50px; }
.security-card { background: #15181e; padding: 30px; border-radius: 20px; border: 1px solid #2a2e35; transition: 0.3s; display: flex; align-items: flex-start; gap: 20px; }
.security-card:hover { background: #1a1d24; border-color: var(--primary); transform: translateY(-5px); }
.sec-icon { width: 50px; height: 50px; background: rgba(0, 224, 166, 0.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--primary); font-size: 1.5rem; }
.sec-content h3 { font-size: 1.1rem; margin-bottom: 8px; color: #fff; }
.sec-content p { font-size: 0.9rem; color: var(--text-muted); line-height: 1.5; margin: 0; }

/* Footer */
footer { background: #050608; padding: 80px 0 20px; margin-top: 80px; font-size: 0.9rem; color: var(--text-muted); }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 50px; }
.footer-col h4 { color: white; margin-bottom: 20px; }

/* WOOCOMMERCE DARK MODE FIXES */
.woocommerce-page .content-area, .site-content { padding-top: 150px; padding-bottom: 80px; }
.woocommerce h1, .woocommerce h2, .woocommerce h3 { color: #fff; }

/* --- DASHBOARD REWORK (Clean Split Layout) --- */
.woocommerce-account .container {
    max-width: 1200px;
    margin: 0 auto;
}
/* Only use the split layout (Sidebar + Content) when logged in */
.logged-in.woocommerce-account .woocommerce {
    display: flex;
    gap: 60px;
    align-items: flex-start;
    margin-top: 50px;
    margin-bottom: 100px;
}

/* When logged out (Login Page), center everything */
.woocommerce-account:not(.logged-in) .woocommerce {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 80vh;
}

/* Sidebar */
.woocommerce-account .woocommerce-MyAccount-navigation {
    flex: 0 0 380px;
    background: #15181e;
    border: 1px solid #2a2e35;
    border-radius: 20px;
    padding: 40px 30px;
}

/* User Info */
.panel-user-info {
    text-align: center;
    padding-bottom: 25px;
    margin-bottom: 25px;
    border-bottom: 1px solid #2a2e35;
}
.panel-avatar img {
    width: 80px; height: 80px;
    border-radius: 50%;
    border: 3px solid var(--primary);
    box-shadow: 0 0 20px rgba(0, 224, 166, 0.2);
    margin-bottom: 15px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.panel-user-details strong { font-size: 1.1rem; color: #fff; display: block; margin-bottom: 5px; }
.panel-user-details span { font-size: 0.8rem; color: var(--text-muted); background: rgba(255,255,255,0.05); padding: 4px 10px; border-radius: 12px; word-break: break-all; display: inline-block; }

/* Navigation */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li { margin-bottom: 8px; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: flex; align-items: center; gap: 15px;
    padding: 14px 20px;
    color: #8b9bb4;
    border-radius: 12px;
    transition: 0.2s;
    font-weight: 600;
    border: 1px solid transparent;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
    background: #1a1d24;
    color: #fff;
    transform: translateX(5px);
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    background: var(--primary);
    color: #000;
    box-shadow: 0 5px 15px rgba(0, 224, 166, 0.3);
}

/* Menu Icons (Pseudo) */
.woocommerce-MyAccount-navigation-link--dashboard a::before { content: "🏠"; }
.woocommerce-MyAccount-navigation-link--orders a::before { content: "🧾"; }
.woocommerce-MyAccount-navigation-link--edit-account a::before { content: "🧑"; }
.woocommerce-MyAccount-navigation-link--customer-logout a::before { content: "🚪"; }
/* New Icons */
.woocommerce-MyAccount-navigation-link--subscriptions a::before { content: "💎"; }
.woocommerce-MyAccount-navigation-link--download-apps a::before { content: "📥"; }
.woocommerce-MyAccount-navigation-link--download-setup-link a::before { content: "📥"; }
.woocommerce-MyAccount-navigation-link--edit-address a::before { content: "🗺️"; }
.woocommerce-MyAccount-navigation-link--status-link a::before { content: "🟢"; }
.woocommerce-MyAccount-navigation-link--support-link a::before { content: "🎫"; }

/* VPN Plugin Specific Icons */
.woocommerce-MyAccount-navigation-link--vpn-servers a::before,
.woocommerce-MyAccount-navigation-link--vpn-server-list a::before { content: "🌐"; }
.woocommerce-MyAccount-navigation-link--vpn-config a::before,
.woocommerce-MyAccount-navigation-link--vpn-generator a::before { content: "🔧"; }

/* Generic VPN Plugin Icons (Catch-all) */
.woocommerce-MyAccount-navigation [class*="vpn"] a::before { content: "🔒"; }

/* Content Area */
.woocommerce-MyAccount-content {
    flex: 1;
    padding: 0;
    background: transparent;
    border: none;
}
.woocommerce-MyAccount-content p { color: var(--text-muted); }

/* --- PLUGIN CONTENT NORMALIZATION (Orders, Subs, Forms) --- */

/* Headings */
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
    font-size: 1.5rem;
    margin-bottom: 25px;
    color: #fff;
    border-bottom: 1px solid #2a2e35;
    padding-bottom: 15px;
}

/* Standardize Tables (Orders, Subscriptions) */
.woocommerce-MyAccount-content table.shop_table,
.woocommerce-MyAccount-content table.my_account_orders {
    width: 100%;
    background: #15181e;
    border: 1px solid #2a2e35;
    border-radius: 15px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    margin-bottom: 30px;
}
.woocommerce-MyAccount-content table.shop_table th {
    background: #0b0d11;
    color: var(--primary);
    padding: 15px 20px;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1px;
    border-bottom: 1px solid #2a2e35;
}
.woocommerce-MyAccount-content table.shop_table td {
    background: #15181e;
    padding: 15px 20px;
    border-bottom: 1px solid #2a2e35;
    color: var(--text-muted);
    vertical-align: middle;
}

/* Standardize Forms (Edit Account, Address) */
.woocommerce-MyAccount-content form.woocommerce-EditAccountForm,
.woocommerce-MyAccount-content form.edit-account,
.woocommerce-MyAccount-content form.woocommerce-address-fields {
    background: #15181e;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid #2a2e35;
}
.woocommerce-MyAccount-content form fieldset {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
}
.woocommerce-MyAccount-content form legend {
    color: #fff;
    font-size: 1.2rem;
    margin-bottom: 20px;
}
/* Fix "Old School" Save Button in Account Settings */
.woocommerce-MyAccount-content form .button {
    background-color: var(--primary); color: #000; border: none; padding: 15px 30px;
    border-radius: 50px; font-weight: bold; cursor: pointer; transition: 0.3s;
    margin-top: 10px;
}
.woocommerce-MyAccount-content form .button:hover { background-color: #fff; box-shadow: 0 0 15px var(--primary); }

/* Dashboard Widgets Grid */
.vpn-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 30px;
    margin-bottom: 40px;
}

/* Widget Cards */
.dashboard-card {
    background: #15181e;
    border: 1px solid #2a2e35;
    border-radius: 20px;
    padding: 40px; /* Bigger cards */
    transition: 0.3s;
}
.dashboard-card:hover {
    border-color: var(--primary);
    transform: translateY(-5px);
}

/* Specific Card Layouts */
.status-card { grid-column: span 12; }
.action-card { grid-column: span 12; }
.credentials-card { grid-column: span 12; }

/* Status Card Styling */
.status-card h3 { font-size: 1.8rem; margin-bottom: 10px; color: #fff; }
.status-indicator {
    display: inline-flex; align-items: center; gap: 10px;
    background: rgba(0, 224, 166, 0.15); color: var(--primary);
    padding: 8px 20px; border-radius: 30px;
    font-weight: bold; text-transform: uppercase; letter-spacing: 1px; font-size: 0.8rem;
}
.status-indicator .dot { width: 10px; height: 10px; background: var(--primary); border-radius: 50%; box-shadow: 0 0 10px var(--primary); }

/* Action Buttons */
.db-actions { display: flex; flex-direction: column; gap: 15px; }
@media (min-width: 1024px) {
    .db-actions { flex-direction: row; gap: 20px; }
}
.db-actions .btn { width: 100%; text-align: center; justify-content: center; padding: 12px; font-size: 0.9rem; }

/* VPN Credentials Card */
.credential-box {
    background: #000;
    border: 1px solid #333;
    padding: 25px;
    border-radius: 12px;
    font-family: 'Courier New', monospace;
    position: relative;
    margin-top: 15px;
}
.credential-box::after {
    content: "ENCRYPTED";
    position: absolute; top: 10px; right: 10px;
    font-size: 0.6rem; color: #333; border: 1px solid #333; padding: 2px 5px; border-radius: 4px;
}
.cred-row {
    display: flex; justify-content: space-between;
    border-bottom: 1px solid #1a1d24;
    padding: 10px 0;
    color: #888;
}
.cred-row strong { color: var(--primary); }
.cred-row span { color: #fff; }

/* Forms & Tables */
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea { background: #0b0d11; border: 1px solid #333; color: #fff; padding: 10px; border-radius: 5px; }
.woocommerce form .form-row label { color: var(--text-muted); }
.woocommerce table.shop_table { border: 1px solid #333; border-radius: 10px; background: var(--bg-card); color: #fff; }

/* Fix Billing History (Orders Table) Actions */
.woocommerce-orders-table__cell-order-actions {
    display: flex !important;
    gap: 10px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    white-space: nowrap !important;
}
.woocommerce-orders-table__cell-order-actions a {
    display: inline-block !important;
    padding: 8px 20px !important;
    border-radius: 50px !important;
    font-size: 0.85rem !important;
    text-decoration: none !important;
    transition: 0.2s !important;
    font-weight: 600 !important;
    margin: 0 !important; /* Reset margins, use gap */
    line-height: 1.2 !important;
}
/* Fix "Actions" Header Alignment */
.woocommerce-orders-table__header-order-actions,
th.order-actions--heading {
    text-align: right !important; /* Align header with the buttons */
}
/* Pay Button Style */
.woocommerce-orders-table__cell-order-actions a.pay {
    background: var(--primary) !important;
    color: #000 !important;
    border: 1px solid var(--primary) !important;
}
.woocommerce-orders-table__cell-order-actions a.pay:hover {
    background: #fff !important;
    box-shadow: 0 0 10px var(--primary);
}
/* Cancel Button Style (Red Background, Black Text) */
.woocommerce-orders-table__cell-order-actions a.cancel {
    background: #ff4444 !important;
    border: 1px solid #ff4444 !important;
    color: #000 !important;
}
.woocommerce-orders-table__cell-order-actions a.cancel:hover {
    background: #fff !important;
    color: #ff4444 !important;
    box-shadow: 0 0 10px rgba(255, 68, 68, 0.3);
}

/* ===============================
   WooCommerce Address Layout FIX
================================ */

/* Grid layout (desktop only) */
@media (min-width: 768px) {
    .woocommerce-Addresses {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        margin-bottom: 30px;
    }
}

/* Remove legacy floats safely */
.woocommerce-Addresses .woocommerce-Address {
    float: none !important;
    width: 100% !important;
}

/* Address card */
.woocommerce-Address {
    background: #15181e;
    padding: 28px;
    border-radius: 20px;
    border: 1px solid #2a2e35;
    color: var(--text-muted);
    height: 100%;
    position: relative;
    box-sizing: border-box;
}

/* Header layout (fix overlap issue) */
.woocommerce-Address { position: relative; }
.woocommerce-Address-title { 
    margin: 0; padding: 0; border: none; 
    height: 0; min-height: 0; overflow: visible;
}

/* Title text */
.woocommerce-Address-title h2,
.woocommerce-Address-title h3 {
    display: none !important;
}

/* Edit button (Fixed Position) */
.woocommerce-Address .edit {
    position: absolute;
    top: 25px;
    right: 30px;
    font-size: 0 !important;
    background: rgba(255, 255, 255, 0.05);
    padding: 8px 16px;
    border-radius: 50px;
    border: 1px solid #333;
    transition: 0.3s;
}
.woocommerce-Address .edit::after {
    content: "Edit Address"; font-size: 0.85rem; font-weight: 600; color: var(--primary);
}

/* Hover state */
.woocommerce-Address .edit:hover {
    border-color: var(--primary);
    background: rgba(0, 224, 166, 0.1);
}

/* Address text */
.woocommerce-Address address {
    margin-top: 40px; /* Push down to clear the fixed button */
    font-style: normal;
    color: #fff;
    line-height: 1.7;
    font-size: 0.95rem;
}

/* Safety: Hide any duplicate address blocks beyond the first two (Billing & Shipping) */
.u-columns.woocommerce-Addresses .woocommerce-Address:nth-of-type(n+3) {
    display: none !important;
}

/* Mobile fallback */
@media (max-width: 767px) {
    .woocommerce-Addresses {
        display: block;
    }

    .woocommerce-Address {
        margin-bottom: 20px;
    }
}

/* ===============================
   END WooCommerce Address Layout FIX
================================ */
/* Hide default WooCommerce dashboard text (Hello... / From your account...) */
.woocommerce-MyAccount-content > p:first-of-type,
.woocommerce-MyAccount-content > p:nth-of-type(2) {
    display: none;
}

/* Mobile Responsive Dashboard */
@media (max-width: 1024px) {
    .woocommerce-account .woocommerce { flex-direction: column; gap: 30px; }
    .woocommerce-account .woocommerce-MyAccount-navigation { width: 100%; flex: none; }
    .vpn-dashboard-grid { display: flex; flex-direction: column; }
}
.woocommerce table.shop_table th { background: #0b0d11; color: var(--primary); }
.woocommerce table.shop_table td { border-top: 1px solid #333; }
.woocommerce-message, .woocommerce-info { background: var(--bg-card); color: #fff; border-top: 3px solid var(--primary); }
.woocommerce button.button.alt { background-color: var(--primary); color: #000; font-weight: bold; border-radius: 50px; }
.woocommerce button.button.alt:hover { background-color: #fff; }

/* Cart & Checkout Specifics */
.woocommerce-cart .cart-collaterals .cart_totals { background: var(--bg-card); padding: 20px; border-radius: 10px; border: 1px solid #333; }
.woocommerce-checkout #order_review, .woocommerce-checkout #order_review_heading { background: var(--bg-card); padding: 20px; border-radius: 10px; border: 1px solid #333; margin-top: 20px; }
.woocommerce-checkout .woocommerce-checkout-payment { background: #0b0d11 !important; border-radius: 5px; }
.woocommerce-checkout .woocommerce-checkout-payment .payment_methods { border-bottom: 1px solid #333 !important; }
.select2-container--default .select2-selection--single { background-color: #0b0d11 !important; border: 1px solid #333 !important; color: #fff !important; height: 40px !important; line-height: 40px !important; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: #fff !important; line-height: 40px !important; }
.select2-dropdown { background-color: var(--bg-card) !important; border: 1px solid #333 !important; color: #fff; }

/* Fix Subscription "Every Year" Text Size in Cart/Checkout */
.woocommerce-cart .product-price .woocommerce-price-suffix,
.woocommerce-cart .product-subtotal .woocommerce-price-suffix,
.woocommerce-checkout .product-total .woocommerce-price-suffix,
.woocommerce-checkout .order-total .woocommerce-price-suffix,
.woocommerce-cart .product-price .subscription-details,
.woocommerce-cart .product-subtotal .subscription-details,
.woocommerce-checkout .product-total .subscription-details,
.woocommerce-checkout .order-total .subscription-details {
    font-size: 0.85rem !important;
    color: var(--text-muted) !important;
    font-weight: normal !important;
}

/* --- CHECKOUT REDESIGN --- */
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: 1.5fr 1fr; gap: 40px; margin-top: 20px; }

/* Left Column: Billing */
#customer_details { background: var(--bg-card); padding: 30px; border-radius: 15px; border: 1px solid #2a2e35; }
#customer_details h3 { color: var(--primary); margin-bottom: 20px; font-size: 1.5rem; border-bottom: 1px solid #2a2e35; padding-bottom: 10px; }

/* Right Column: Order Review */
#order_review_heading { display: none; } /* Hide default heading, we use the box style */
#order_review { background: var(--bg-card); padding: 30px; border-radius: 15px; border: 1px solid var(--primary); height: fit-content; position: sticky; top: 100px; }

/* Order Table */
.woocommerce-checkout table.shop_table { border: none; margin-bottom: 20px; width: 100%; }
.woocommerce-checkout table.shop_table th, 
.woocommerce-checkout table.shop_table td { background: transparent; border-bottom: 1px solid #2a2e35; padding: 15px 0; color: #fff; }
.woocommerce-checkout table.shop_table thead { display: none; } /* Hide header row for cleaner look */

.woocommerce-checkout table.shop_table .product-name { font-weight: 600; }
.woocommerce-checkout table.shop_table .product-total { text-align: right; }

/* Totals Section */
.woocommerce-checkout table.shop_table tfoot th { color: var(--text-muted); font-weight: normal; text-align: left; }
.woocommerce-checkout table.shop_table tfoot td { text-align: right; }
.woocommerce-checkout table.shop_table .order-total th { border-bottom: none; font-size: 1.5rem; color: var(--primary); font-weight: bold; padding-top: 20px; }
.woocommerce-checkout table.shop_table .order-total td { 
    border-bottom: none; font-size: 0.75rem; color: var(--text-muted); font-weight: normal; padding-top: 20px; 
    vertical-align: middle;
}
.woocommerce-checkout table.shop_table .order-total td .amount,
.woocommerce-checkout table.shop_table .order-total td .wc-block-formatted-money-amount { 
    font-size: 1.5rem; color: var(--primary); font-weight: bold; margin-right: 5px; 
}

/* Fix for WooCommerce Blocks / Modern Markup Subscription Text */
.wc-block-components-order-summary-item__individual-prices {
    font-size: 0.75rem !important;
    color: var(--text-muted) !important;
}
.wc-block-components-order-summary-item__individual-prices .wc-block-formatted-money-amount {
    font-size: 1.5rem !important;
    color: var(--primary) !important;
    font-weight: bold !important;
}

/* Payment Box */
#payment { background: #0b0d11 !important; border-radius: 10px; padding: 20px; border: 1px solid #333; }
#payment ul.payment_methods { border-bottom: 1px solid #333; padding-bottom: 20px; margin-bottom: 20px; }
#payment div.payment_box { background-color: #1a1d24 !important; color: #ccc; margin-top: 10px; padding: 10px; border-radius: 5px; }
#payment div.payment_box::before { border-bottom-color: #1a1d24 !important; }

/* Place Order Button */
#place_order { width: 100%; background-color: var(--primary); color: #000; font-weight: bold; padding: 15px; border-radius: 50px; font-size: 1.1rem; margin-top: 10px; transition: 0.3s; }
#place_order:hover { background-color: #fff; box-shadow: 0 0 20px var(--primary); }

/* Form Fields Cleanup */
.woocommerce form .form-row { margin-bottom: 20px; }
.woocommerce form .form-row label { display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 0.9rem; }
.woocommerce form .form-row .required { color: var(--primary); text-decoration: none; }

/* Mobile Responsive */
@media (max-width: 900px) {
    .woocommerce-checkout form.checkout { grid-template-columns: 1fr; }
    #order_review { position: static; border: 1px solid #2a2e35; border-top: 3px solid var(--primary); }
}

/* Fix for [object Object] visual glitch if JS fails */
.product-quantity { color: var(--text-muted); font-size: 0.9rem; margin-left: 5px; }

/* --- CHECKOUT POLISH (Focus & Payment Cards) --- */
/* Input Focus Glow */
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 8px rgba(0, 224, 166, 0.2); }

/* Fix Chrome Autofill White Background */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px #0b0d11 inset !important;
    -webkit-text-fill-color: white !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* Payment Methods as Cards */
#payment ul.payment_methods li { background: #15181e; padding: 15px; border-radius: 8px; margin-bottom: 10px; border: 1px solid #333; transition: 0.2s; list-style: none; }
#payment ul.payment_methods li:hover { border-color: #555; }
#payment ul.payment_methods li input { accent-color: var(--primary); transform: scale(1.2); margin-right: 10px; }
#payment ul.payment_methods li label { cursor: pointer; margin-bottom: 0; }

/* Coupon Section Cleanup */
.woocommerce-form-coupon-toggle .woocommerce-info { background: transparent; border: 1px dashed #333; color: var(--text-muted); padding: 15px; }
.woocommerce-form-coupon-toggle .woocommerce-info::before { color: var(--primary); }
.woocommerce-form-coupon-toggle .woocommerce-info a { color: var(--primary); }
form.checkout_coupon { background: var(--bg-card); padding: 20px; border: 1px solid #333; border-radius: 10px; margin-bottom: 30px; }

/* Login/Register Page Specifics */
#customer_login {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 40px;
    width: 100%;
}

.col-1, .col-2 {
    flex: 1 1 300px; /* Better mobile responsiveness */
    max-width: 550px;
    background: #15181e;
    padding: 50px;
    border-radius: 24px;
    border: 1px solid #2a2e35;
    box-shadow: 0 20px 50px rgba(0,0,0,0.2);
    transition: 0.3s;
}

/* Fix for standalone Login Form (Class provided by user) */
.woocommerce-form-login {
    background: #15181e;
    padding: 40px;
    border-radius: 24px;
    border: 1px solid #2a2e35;
    box-shadow: 0 20px 50px rgba(0,0,0,0.2);
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}
/* Reset styles if the form is inside our custom columns (to avoid double boxes) */
.col-1 .woocommerce-form-login, .col-2 .woocommerce-form-login {
    background: transparent; padding: 0; border: none; box-shadow: none;
}

.col-1:hover, .col-2:hover {
    border-color: #333;
    transform: translateY(-5px);
}

.col-2 h2 {
    text-align: center;
    font-size: 1.8rem;
    margin-bottom: 30px;
    color: #fff;
    border-bottom: 1px solid #2a2e35;
    padding-bottom: 20px;
}
/* Remove Login Header */
.col-1 h2 { display: none; }

/* Form Fields */
#customer_login form .form-row {
    margin-bottom: 20px;
}

#customer_login form .form-row label {
    display: block;
    margin-bottom: 8px;
    color: var(--text-muted);
    font-weight: 500;
    font-size: 0.9rem;
}

#customer_login form .form-row input.input-text {
    width: 100%;
    background: #0b0d11;
    border: 1px solid #2a2e35;
    color: #fff;
    padding: 15px;
    border-radius: 12px;
    font-size: 1rem;
    transition: 0.3s;
}

#customer_login form .form-row input.input-text:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(0, 224, 166, 0.1);
    outline: none;
}

/* Login Button (Primary) */
.woocommerce-form-login button.woocommerce-button,
.woocommerce-form-login button.button {
    width: 100%;
    background-color: var(--primary) !important;
    color: #000 !important;
    border: 1px solid var(--primary) !important;
    padding: 15px;
    border-radius: 50px;
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    transition: 0.3s;
    margin-top: 10px;
}

.woocommerce-form-login button.woocommerce-button:hover,
.woocommerce-form-login button.button:hover {
    background-color: #fff !important;
    color: #000 !important;
    box-shadow: 0 0 20px var(--primary);
    transform: translateY(-2px);
}

/* Register Button (Outline/Secondary) */
.woocommerce-form-register button.woocommerce-button,
.woocommerce-form-register button.button {
    width: 100%;
    background-color: transparent;
    color: #fff;
    border: 1px solid #333;
    padding: 15px;
    border-radius: 50px;
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    transition: 0.3s;
    margin-top: 10px;
}

.woocommerce-form-register button.woocommerce-button:hover,
.woocommerce-form-register button.button:hover {
    border-color: var(--primary);
    color: var(--primary);
    background: rgba(0, 224, 166, 0.05);
    transform: translateY(-2px);
}

/* Extra Links */
.woocommerce-form-login__rememberme {
    margin-bottom: 15px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    color: var(--text-muted);
}
.woocommerce-form-login__rememberme input {
    accent-color: var(--primary);
    width: 16px;
    height: 16px;
}

.woocommerce-LostPassword {
    margin-top: 20px;
    text-align: center;
    font-size: 0.9rem;
}
.woocommerce-LostPassword a {
    color: var(--text-muted);
    text-decoration: underline;
}
.woocommerce-LostPassword a:hover {
    color: var(--primary);
}

@media (max-width: 900px) {
    .col-1, .col-2 {
        padding: 30px;
    }
}

/* Contact Page */
.contact-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; }
.contact-info .info-box { background: var(--bg-card); padding: 30px; border-radius: 15px; border: 1px solid #2a2e35; margin-bottom: 20px; }
.contact-form-wrapper { background: var(--bg-card); padding: 40px; border-radius: 15px; border: 1px solid #2a2e35; }

/* Contact Form 7 Styling */
.wpcf7-form p { margin-bottom: 20px; }
.wpcf7-form label {
    display: block;
    margin-bottom: 8px;
    color: var(--text-muted);
    font-weight: 500;
    font-size: 0.9rem;
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea {
    width: 100%;
    background: #0b0d11;
    border: 1px solid #2a2e35;
    color: #fff;
    padding: 15px;
    border-radius: 12px;
    font-size: 1rem;
    transition: 0.3s;
    font-family: var(--font-main);
    box-sizing: border-box;
}
.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(0, 224, 166, 0.1);
    outline: none;
}
.wpcf7-form input[type="submit"] {
    width: 100%;
    background-color: var(--primary);
    color: #000;
    border: 1px solid var(--primary);
    padding: 15px;
    border-radius: 50px;
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    transition: 0.3s;
    margin-top: 10px;
}
.wpcf7-form input[type="submit"]:hover {
    background-color: #fff;
    box-shadow: 0 0 20px var(--primary);
    transform: translateY(-2px);
}
/* CF7 Response Messages */
.wpcf7-response-output {
    border-radius: 10px;
    padding: 15px !important;
    margin-top: 20px !important;
    text-align: center;
}

/* FAQ / Help Center */
.faq-wrapper { max-width: 800px; margin: 0 auto; }
.faq-item { margin-bottom: 15px; border: 1px solid #2a2e35; border-radius: 10px; background: var(--bg-card); overflow: hidden; }
.faq-item summary { padding: 20px; cursor: pointer; font-weight: bold; list-style: none; position: relative; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; position: absolute; right: 20px; color: var(--primary); font-size: 1.2rem; }
.faq-item details[open] summary::after { content: '-'; }
.faq-content { padding: 0 20px 20px; color: var(--text-muted); border-top: 1px solid #2a2e35; }

/* Legal Pages */
.legal-content { max-width: 800px; margin: 0 auto; }
.legal-content h2 { color: #fff; margin-top: 40px; margin-bottom: 15px; font-size: 1.5rem; }
.legal-content p { color: var(--text-muted); margin-bottom: 20px; }
.legal-content ul { list-style: disc; margin-left: 20px; margin-bottom: 20px; color: var(--text-muted); }
.legal-content li { margin-bottom: 10px; }

/* --- 3rd Party Plugin Support (VPN Resellers) --- */
/* Ensures tables generated by the VPN plugin match the dark theme */
main table:not(.shop_table) { width: 100%; border-collapse: collapse; margin-bottom: 20px; color: #fff; background: var(--bg-card); border-radius: 10px; overflow: hidden; }
main table:not(.shop_table) th { text-align: left; padding: 15px; border-bottom: 1px solid #333; color: var(--primary); background: #0b0d11; }
main table:not(.shop_table) td { padding: 15px; border-bottom: 1px solid #2a2e35; }

@media (max-width: 768px) {
    .hero-grid, .pricing-grid, .footer-grid { grid-template-columns: 1fr; }
    .contact-grid { grid-template-columns: 1fr; }
    .nav-wrapper { flex-direction: column; gap: 20px; }
    
    /* Fix Header Overlap on Mobile */
    .hero { padding-top: 280px; }
    .woocommerce-page .content-area, .site-content { padding-top: 280px; }
}

/* --- STATUS PAGE STYLES --- */

/* Main Banner */
.status-banner {
    background: rgba(0, 224, 166, 0.1);
    border: 1px solid var(--primary);
    border-radius: 20px;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin-bottom: 60px;
    box-shadow: 0 0 30px rgba(0, 224, 166, 0.1);
}
.status-icon-large { font-size: 3.5rem; }
.status-content h2 { margin: 0 0 10px 0; color: #fff; font-size: 2rem; }
.status-content p { margin: 0; color: var(--primary); font-weight: bold; font-size: 1.1rem; }

/* Status Grid */
.status-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 30px;
}
.status-card {
    background: #15181e;
    border: 1px solid #2a2e35;
    border-radius: 20px;
    padding: 30px;
    transition: 0.3s;
}
.status-card:hover { border-color: #333; transform: translateY(-5px); }

.sc-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.sc-header h3 { font-size: 1.3rem; margin: 0; color: #fff; }

.badge-operational {
    background: var(--primary);
    color: #000;
    padding: 6px 15px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Uptime Bars Visualization */
.uptime-bars { display: flex; gap: 4px; height: 40px; align-items: flex-end; margin-bottom: 15px; }
.uptime-bars .bar {
    flex: 1;
    background: var(--primary);
    height: 100%;
    border-radius: 2px;
    opacity: 0.8;
    transition: 0.2s;
}
.uptime-bars .bar:hover { opacity: 1; transform: scaleY(1.1); box-shadow: 0 0 10px var(--primary); }

.sc-footer { display: flex; justify-content: space-between; font-size: 0.8rem; color: var(--text-muted); }

/* Server Regions Grid */
.server-status-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}
.region-item {
    background: #15181e;
    padding: 20px 25px;
    border-radius: 15px;
    border: 1px solid #2a2e35;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.region-info h4 { margin: 0 0 5px 0; font-size: 1.1rem; color: #fff; }
.region-sub { font-size: 0.85rem; color: var(--text-muted); }
.status-indicator-dot {
    width: 12px; height: 12px;
    background: var(--primary);
    border-radius: 50%;
    box-shadow: 0 0 10px var(--primary);
}

@media (max-width: 768px) {
    .status-banner { flex-direction: column; text-align: center; }
    .status-grid { grid-template-columns: 1fr; }
}

/* --- DOWNLOAD PAGE STYLES --- */
.download-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 40px;
}
.download-card {
    background: #15181e;
    border: 1px solid #2a2e35;
    border-radius: 24px;
    padding: 40px 30px;
    text-align: center;
    transition: 0.3s;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}
.download-card:hover {
    border-color: var(--primary);
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 224, 166, 0.1);
}
.platform-icon {
    margin-bottom: 25px;
    background: rgba(255,255,255,0.03);
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.05);
}
.platform-icon img {
    width: 60%;
    height: 60%;
    object-fit: contain;
    display: block;
}
.download-card h3 { font-size: 1.4rem; margin-bottom: 10px; color: #fff; }
.download-card p { color: var(--text-muted); margin-bottom: 30px; font-size: 0.9rem; }
.download-card .btn { width: 100%; margin-top: auto; }

/* Grouped Buttons (for Android) */
.btn-group-vertical { width: 100%; display: flex; flex-direction: column; gap: 10px; margin-top: auto; }

/* --- CHECKOUT DARK THEME --- */
body.woocommerce-checkout { background-color: #0b0d11; color: #fff; }
.woocommerce-checkout h1, .woocommerce-checkout h2, .woocommerce-checkout h3, .woocommerce-checkout h4, .woocommerce-checkout h5 { color: #fff !important; }

/* Containers (Billing & Order Review) - Dark Cards */
.woocommerce-checkout #customer_details, 
.woocommerce-checkout #order_review { background: #15181e; border: 1px solid #2a2e35; color: #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.2); border-radius: 15px; }

/* Green Accents */
.woocommerce-checkout #customer_details h3 { color: var(--primary) !important; border-bottom: 1px solid #2a2e35; }
.woocommerce-checkout #order_review { border-top: 3px solid var(--primary); }

/* Inputs */
.woocommerce-checkout input, .woocommerce-checkout textarea, .woocommerce-checkout select { background-color: #0b0d11 !important; color: #fff !important; border: 1px solid #333 !important; transition: 0.3s; }
.woocommerce-checkout input:focus, .woocommerce-checkout textarea:focus, .woocommerce-checkout select:focus { border-color: var(--primary) !important; box-shadow: 0 0 0 3px rgba(0, 224, 166, 0.1); }
.woocommerce-checkout label { color: #ccc !important; font-weight: 500; }

/* Table */
.woocommerce-checkout table.shop_table th, .woocommerce-checkout table.shop_table td { color: #fff; border-bottom: 1px solid #2a2e35; }
.woocommerce-checkout table.shop_table .order-total th, .woocommerce-checkout table.shop_table .order-total td { color: var(--primary); }

/* Payment Box */
.woocommerce-checkout #payment { background: #0b0d11 !important; border: 1px solid #333; color: #fff; }
.woocommerce-checkout #payment ul.payment_methods li { background: #15181e; border: 1px solid #333; color: #fff; }
.woocommerce-checkout #payment div.payment_box { background-color: #1a1d24 !important; color: #ccc; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #1a1d24 !important; }

/* Select2 (Dropdowns) */
.woocommerce-checkout .select2-container--default .select2-selection--single { background-color: #0b0d11 !important; border: 1px solid #333 !important; }
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered { color: #333 !important; }
.woocommerce-checkout .select2-dropdown { background-color: #15181e !important; border: 1px solid #333 !important; color: #fff; }
.woocommerce-checkout .select2-results__option { background-color: #15181e !important; color: #fff !important; }
.woocommerce-checkout .select2-results__option--highlighted { background-color: var(--primary) !important; color: #000 !important; }

/* --- RELATED SUBSCRIPTIONS (Checkout) --- */
/* Fixes the "Related subscriptions" table that appears during renewals/switches */

.woocommerce-checkout > h3 {
    font-size: 1.5rem;
    color: #fff;
    margin-bottom: 20px;
    margin-top: 0;
    border-bottom: 1px solid #2a2e35;
    padding-bottom: 15px;
}

.woocommerce-checkout table.shop_table.related-subscriptions {
    width: 100%;
    background: #15181e;
    border: 1px solid #2a2e35;
    border-radius: 15px;
    margin-bottom: 40px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.woocommerce-checkout table.shop_table.related-subscriptions th {
    background: #0b0d11;
    color: var(--primary);
    padding: 15px 20px;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 1px;
    border-bottom: 1px solid #2a2e35;
    text-align: left;
}

.woocommerce-checkout table.shop_table.related-subscriptions td {
    background: #15181e;
    color: var(--text-muted);
    padding: 15px 20px;
    border-bottom: 1px solid #2a2e35;
    vertical-align: middle;
}

.woocommerce-checkout table.shop_table.related-subscriptions td a {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}
.woocommerce-checkout table.shop_table.related-subscriptions td a:hover {
    color: var(--primary);
}

/* --- ANIMATIONS --- */
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}
@keyframes btn-pulse {
    0% { box-shadow: 0 0 0 0 rgba(0, 224, 166, 0.7); }
    70% { box-shadow: 0 0 0 10px rgba(0, 224, 166, 0); }
    100% { box-shadow: 0 0 0 0 rgba(0, 224, 166, 0); }
}

/* --- ORDER RECEIVED & VIEW ORDER PAGE OVERHAUL --- */

/* 1. Main Receipt Container */
.woocommerce-order-received .woocommerce-order,
.woocommerce-view-order .woocommerce-order {
    max-width: 900px;
    margin: 0 auto;
    background: #15181e;
    padding: 50px;
    border-radius: 24px;
    border: 1px solid #2a2e35;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}

/* 2. Success Message Box */
.woocommerce-order-received .woocommerce-notice--success {
    background: rgba(0, 224, 166, 0.1);
    color: var(--primary);
    padding: 25px;
    border-radius: 15px;
    text-align: center;
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 40px;
    border: 1px solid rgba(0, 224, 166, 0.3);
    display: flex; align-items: center; justify-content: center; gap: 15px;
}
.woocommerce-order-received .woocommerce-notice--success::before {
    content: "✔️"; font-size: 1.5rem;
}

/* 3. Order Info Grid (Order Number, Date, Email, Total) */
ul.order_details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 20px;
    list-style: none;
    padding: 30px;
    background: #0b0d11;
    border-radius: 15px;
    border: 1px solid #2a2e35;
    margin-bottom: 40px;
    text-align: center;
}
ul.order_details li {
    float: none; margin: 0; padding: 0;
    border-right: 1px solid #2a2e35;
    text-transform: uppercase;
    font-size: 0.75rem; letter-spacing: 1px;
    color: var(--text-muted);
}
ul.order_details li:last-child { border-right: none; }
ul.order_details li strong {
    display: block; font-size: 1.1rem; color: #fff; margin-top: 8px; text-transform: none; font-weight: 700;
}

/* 4. Order Details Table */
.woocommerce-order-details { margin-bottom: 40px; }
.woocommerce-order-details h2 {
    font-size: 1.4rem; margin-bottom: 20px; color: #fff; border-bottom: 1px solid #2a2e35; padding-bottom: 15px;
}

/* Table Styling */
.woocommerce-table--order-details {
    width: 100%; border-collapse: separate; border-spacing: 0;
    border: 1px solid #2a2e35; border-radius: 15px; overflow: hidden;
}
.woocommerce-table--order-details th {
    background: #0b0d11; color: var(--text-muted); font-weight: 600; padding: 20px; text-align: left; border-bottom: 1px solid #2a2e35;
}
.woocommerce-table--order-details td {
    padding: 20px; border-bottom: 1px solid #2a2e35; color: #fff; vertical-align: middle;
}
.woocommerce-table--order-details tr:last-child td { border-bottom: none; }

/* Product & Price Alignment */
.woocommerce-table--order-details .product-name a { color: #fff; font-weight: 600; text-decoration: none; }
.woocommerce-table--order-details .product-name strong { color: var(--text-muted); font-weight: normal; margin-left: 5px; }
.woocommerce-table--order-details .product-total { text-align: right; }
.woocommerce-table--order-details .amount { color: #fff; font-weight: 700; }

/* Totals (Footer) */
.woocommerce-table--order-details tfoot th {
    text-align: right; color: var(--text-muted); font-weight: normal; border-top: 1px solid #2a2e35;
}
.woocommerce-table--order-details tfoot td {
    text-align: right; border-top: 1px solid #2a2e35; color: #fff; font-weight: 600;
}
.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td {
    background: rgba(0, 224, 166, 0.05); color: var(--primary); font-size: 1.2rem; font-weight: 800; padding: 25px 20px;
}

/* Hide "Order Details" H2 on View Order Page */
.woocommerce-view-order .woocommerce-order-details h2,
.woocommerce-view-order .woocommerce-order-details header,
.woocommerce-view-order .woocommerce-order-details .woocommerce-order-details__title {
    display: none !important;
}

/* Hide "Related Orders" Header on View Subscription Page */
.woocommerce-view-subscription .related-orders,
.woocommerce-view-subscription header h2,
.woocommerce-view-subscription h2:empty,
.woocommerce-view-subscription header:has(h2:empty) {
    display: none !important;
}

/* 5. Customer Details (Addresses) */
.woocommerce-customer-details {
    background: #0b0d11; padding: 30px; border-radius: 15px; border: 1px solid #2a2e35;
}
.woocommerce-customer-details h2 { font-size: 1.2rem; margin-bottom: 20px; color: #fff; }
.woocommerce-customer-details address { font-style: normal; color: var(--text-muted); line-height: 1.8; border: none; padding: 0; }

/* Mobile Fixes */
@media (max-width: 768px) {
    .woocommerce-order-received .woocommerce-order { padding: 20px; }
    ul.order_details { grid-template-columns: 1fr; text-align: left; }
    ul.order_details li { border-right: none; border-bottom: 1px solid #2a2e35; padding-bottom: 15px; margin-bottom: 15px; }
    ul.order_details li:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
}

/* --- PAY FOR ORDER PAGE (Fix Pay & Cancel) --- */

/* 1. Main Payment Card Container */
.woocommerce-order-pay .woocommerce {
    max-width: 800px;
    margin: 0 auto;
    background: #15181e;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid #2a2e35;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
}
.woocommerce-order-pay #order_review_heading {
    color: #fff; font-size: 1.5rem; margin-bottom: 20px; border-bottom: 1px solid #2a2e35; padding-bottom: 15px;
}

/* 2. Order Summary Table */
.woocommerce-order-pay table.shop_table {
    width: 100%; border: none; margin-bottom: 30px;
}
.woocommerce-order-pay table.shop_table th,
.woocommerce-order-pay table.shop_table td {
    background: transparent; border-bottom: 1px solid #2a2e35; color: #fff; padding: 15px 0;
}
.woocommerce-order-pay table.shop_table tfoot th {
    text-align: right; padding-right: 20px; color: var(--text-muted); font-weight: normal;
}
.woocommerce-order-pay table.shop_table tfoot td {
    text-align: right; font-weight: bold; color: #fff;
}
.woocommerce-order-pay table.shop_table tfoot tr:last-child td {
    color: var(--primary); font-size: 1.2rem;
}

/* 3. Payment Methods Box */
.woocommerce-order-pay #payment {
    background: #0b0d11; border: 1px solid #333; border-radius: 15px; padding: 25px;
}
.woocommerce-order-pay #payment ul.payment_methods {
    border-bottom: 1px solid #333; padding-bottom: 20px; margin-bottom: 20px;
}
.woocommerce-order-pay #payment .payment_box {
    background: #1a1d24; color: #ccc; margin-top: 10px; padding: 15px; border-radius: 8px;
}

/* 4. Pay & Cancel Buttons (Styled as Boxes) */
.woocommerce-order-pay #place_order {
    width: 100%; background: var(--primary); color: #000; font-weight: 800; padding: 18px; border-radius: 50px; font-size: 1.1rem; border: none; cursor: pointer; transition: 0.3s;
}
.woocommerce-order-pay #place_order:hover { background: #fff; box-shadow: 0 0 25px var(--primary); }
.woocommerce-order-pay .button.cancel {
    display: block; width: 100%; text-align: center; background: transparent; border: 1px solid #ff4444; color: #ff4444; padding: 15px; border-radius: 50px; font-weight: 600; text-decoration: none; transition: 0.3s; margin-top: 15px;
}
.woocommerce-order-pay .button.cancel:hover { background: #ff4444; color: #fff; box-shadow: 0 0 15px rgba(255, 68, 68, 0.4); }

/* Hide Breadcrumbs on Pay Page to fix "Pay My account" text glitch */
.woocommerce-order-pay .woocommerce-breadcrumb,
.woocommerce-order-pay .breadcrumb {
    display: none !important;
}

/* --- ERROR NOTIFICATIONS (Red Background) --- */
.woocommerce-error, 
.woocommerce-notice--error {
    background: rgba(255, 68, 68, 0.1) !important;
    color: #ff4444 !important;
    border: 1px solid #ff4444 !important;
    padding: 20px !important;
    border-radius: 15px !important;
    margin-bottom: 30px !important;
    list-style: none !important;
    display: flex; align-items: center; gap: 15px;
}
.woocommerce-error::before, 
.woocommerce-notice--error::before {
    content: "❌"; font-size: 1.5rem;
}
.woocommerce-error li { margin: 0 !important; padding: 0 !important; color: #ff4444 !important; }

/* ============================================================
   GEMINI FIX: PAY PAGE LAYOUT & BUTTONS
   Paste this at the VERY BOTTOM of your CSS file
   ============================================================ */

/* 1. Fix "PayCancel" Merging in the Table Row */
/* This specifically targets the 'Actions' row in the order summary table */
.woocommerce-order-pay table.shop_table td.actions, 
.woocommerce-order-pay table.shop_table td .order-actions,
.woocommerce-order-pay table.shop_table th.order-actions--heading + td {
    display: flex !important;
    gap: 15px !important;
    align-items: center !important;
    flex-wrap: wrap !important;
}

.woocommerce-order-pay table.shop_table td.actions a.button,
.woocommerce-order-pay table.shop_table th.order-actions--heading + td a,
.woocommerce-order-pay table.shop_table td a {
    margin-right: 15px !important; /* Force margin in case flex fails */
    margin-bottom: 5px !important;
    display: inline-block !important;
}

/* 2. Hide the Broken "Pay My account" Warning Box */
/* That specific box with the 'alert' icon is usually a breadcrumb glitch in the Pay endpoint */
.woocommerce-order-pay .woocommerce-info {
    display: none !important;
}

/* 3. Ensure the 'Cancel' text link looks like a proper secondary button */
.woocommerce-order-pay table.shop_table td.actions a.cancel,
.woocommerce-order-pay table.shop_table a.cancel,
.order-actions-button.cancel {
    background-color: #ff4444 !important; /* Red Background */
    color: #000000 !important; /* Black Text */
    border: 1px solid #ff4444 !important;
    padding: 8px 15px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
}

.woocommerce-order-pay table.shop_table td.actions a.cancel:hover,
.woocommerce-order-pay table.shop_table a.cancel:hover,
.order-actions-button.cancel:hover {
    background-color: #ffffff !important;
    color: #ff4444 !important;
}

/* 4. Fix the "Pay" button in that specific table row to match your theme */
.woocommerce-order-pay table.shop_table td.actions a.pay,
.woocommerce-order-pay table.shop_table a.pay,
.order-actions-button.pay {
    background-color: var(--primary) !important;
    color: #000 !important;
    padding: 8px 20px !important;
    border-radius: 50px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* ============================================================
   FIX: ORDER FAILED ACTIONS (Pay vs My Account)
   ============================================================ */
   
/* 1. Target the container specifically and override ALL error styles */
.woocommerce-page .woocommerce-notice.woocommerce-thankyou-order-failed-actions,
p.woocommerce-notice.woocommerce-thankyou-order-failed-actions {
    background: transparent !important;
    border: none !important;
    padding: 20px 0 !important;
    margin: 20px 0 !important;
    color: #fff !important; /* Ensure text is white */
    text-align: center !important;
    box-shadow: none !important;
    display: block !important; /* Ensure it's a block to stack text and buttons properly */
}

/* 2. Hide the warning icon pseudo-element */
.woocommerce-page .woocommerce-notice.woocommerce-thankyou-order-failed-actions::before,
p.woocommerce-notice.woocommerce-thankyou-order-failed-actions::before {
    display: none !important;
    content: none !important;
}

/* 3. Style the buttons */
.woocommerce-page .woocommerce-notice.woocommerce-thankyou-order-failed-actions a.button,
p.woocommerce-notice.woocommerce-thankyou-order-failed-actions a.button {
    display: inline-block !important;
    padding: 15px 40px !important;
    border-radius: 50px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: 0.3s !important;
    font-size: 1rem !important;
    margin: 10px !important; /* Add spacing around buttons */
    width: auto !important;
}

/* --- DASHBOARD DOWNLOAD SECTION --- */
/* New List Widget Style for Dashboard */
.download-list-widget {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.dl-item {
    display: flex;
    align-items: center;
    background: #15181e;
    border: 1px solid #2a2e35;
    padding: 15px;
    border-radius: 16px;
    transition: 0.3s;
    position: relative;
}
.dl-item:hover {
    border-color: var(--primary);
    transform: translateX(5px);
    background: #1a1d24;
}
.dl-icon {
    width: 45px; height: 45px;
    margin-right: 15px;
    flex-shrink: 0;
    background: rgba(255,255,255,0.05);
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
}
.dl-icon img { width: 60%; height: 60%; object-fit: contain; }
.dl-details { flex: 1; }
.dl-details h4 { margin: 0; font-size: 1rem; color: #fff; font-weight: 600; }
.dl-sub { font-size: 0.75rem; color: var(--text-muted); display: block; }
.dl-item .btn {
    white-space: nowrap;
}
.dl-actions-group {
    display: flex;
    gap: 8px;
}
/* Hidden by default (Mobile) */
.dl-desktop-link { display: none; }

/* Desktop Transformation: Icon Only Grid */
@media (min-width: 1024px) {
    .download-list-widget {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 15px;
    }
    .dl-item {
        width: 70px;
        height: 70px;
        padding: 0;
        justify-content: center;
    }
    .dl-item:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0, 224, 166, 0.15);
    }
    .dl-details, 
    .dl-item .btn, 
    .dl-actions-group {
        display: none;
    }
    .dl-icon {
        margin: 0;
        width: 100%;
        height: 100%;
        background: transparent;
    }
    .dl-desktop-link {
        display: block;
        position: absolute;
        top: 0; left: 0; width: 100%; height: 100%;
        z-index: 5;
    }

    /* Hover Animation: Small Shape Move */
    .dl-item::after {
        content: '';
        position: absolute;
        bottom: 8px;
        left: 50%;
        width: 6px;
        height: 6px;
        background: var(--primary);
        border-radius: 50%;
        transform: translateX(-50%) scale(0);
        transition: 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
        opacity: 0;
    }
    .dl-item:hover::after {
        transform: translateX(-50%) scale(1);
        opacity: 1;
        bottom: 12px;
    }
    .dl-item:hover .dl-icon img { transform: translateY(-4px); }
    .dl-icon img { transition: 0.3s; }
}

/* Pay Button (Green) - Target first button */
p.woocommerce-notice.woocommerce-thankyou-order-failed-actions a.button:nth-of-type(1) {
    background-color: var(--primary) !important;
    color: #000 !important;
    border: 1px solid var(--primary) !important;
}
p.woocommerce-notice.woocommerce-thankyou-order-failed-actions a.button:nth-of-type(1):hover {
    background-color: #fff !important;
    box-shadow: 0 0 20px var(--primary) !important;
}

/* My Account Button (White Outline) - Target second button */
p.woocommerce-notice.woocommerce-thankyou-order-failed-actions a.button:nth-of-type(2) {
    background-color: transparent !important;
    color: #fff !important;
    border: 1px solid #fff !important;
}
p.woocommerce-notice.woocommerce-thankyou-order-failed-actions a.button:nth-of-type(2):hover {
    background-color: #fff !important;
    color: #000 !important;
}

/* ============================================================
   FIX: CHECKOUT SUBSCRIPTION NOTICE (Yellow)
   ============================================================ */

/* Target the generic info boxes (like "Your subscription will be activated...") */
.woocommerce-checkout .woocommerce-info {
    background-color: rgba(255, 193, 7, 0.1) !important;
    color: #ffc107 !important;
    border: 1px solid rgba(255, 193, 7, 0.3) !important;
    border-left: 4px solid #ffc107 !important; /* distinct yellow strip */
    border-radius: 8px !important;
    padding: 15px 20px !important;
    font-size: 0.95rem !important;
    margin-bottom: 25px !important;
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
}

/* Restore Coupon & Login Toggles to their subtle style (don't make them yellow) */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info {
    background: transparent !important;
    border: 1px dashed #333 !important;
    color: var(--text-muted) !important;
}

/* ============================================================
   FIX: ORDER RECEIVED / THANK YOU PAGE
   ============================================================ */

/* 1. Center & Style the "Subscription Activation" Text (Yellow Notice) */
.woocommerce-order-received .woocommerce-order > p:not(.woocommerce-notice) {
    background-color: rgba(255, 193, 7, 0.1) !important;
    color: #ffc107 !important;
    border: 1px solid rgba(255, 193, 7, 0.3) !important;
    border-left: 4px solid #ffc107 !important;
    border-radius: 15px !important;
    padding: 25px !important;
    text-align: center !important;
    margin: 30px auto !important;
    font-weight: 600 !important;
    max-width: 800px !important;
    display: block !important;
}

/* 2. Remove "Related Subscriptions" Header & Table */
.related-subscriptions,
.woocommerce-table--related-subscriptions,
.woocommerce-order-received .related-subscriptions,
.woocommerce-checkout .related-subscriptions,
.woocommerce-view-order .related-subscriptions,
.woocommerce-view-order .woocommerce-table--related-subscriptions,
h2:has(+ .related-subscriptions),
h3:has(+ .related-subscriptions),
h2:has(+ .woocommerce-table--related-subscriptions),
h3:has(+ .woocommerce-table--related-subscriptions) {
    display: none !important;
}

/* ============================================================
   MOBILE RESPONSIVENESS & DESIGN OVERHAUL
   ============================================================ */
@media (max-width: 768px) {
    /* --- 1. Layout & Spacing --- */
    .woocommerce-account .container { padding: 0 20px; }
    .woocommerce-account .woocommerce { 
        margin-top: 20px; 
        gap: 40px; 
        display: flex; 
        flex-direction: column; 
        align-items: center; 
        justify-content: center;
        min-height: 50vh;
    }
    
    /* --- 2. Sidebar & Navigation --- */
    .woocommerce-account .woocommerce-MyAccount-navigation {
        padding: 30px 20px;
        background: #15181e;
        border-radius: 20px;
        text-align: center;
        width: 100%;
        max-width: 500px;
    }
    
    /* User Info Panel (Centered) */
    .panel-user-info {
        border-bottom: 1px solid #2a2e35;
        padding-bottom: 20px;
        margin-bottom: 20px;
    }
    .panel-user-details { text-align: center; }
    .panel-user-details strong { font-size: 1.2rem; margin-bottom: 8px; }
    
    /* Navigation Links (Touch Friendly) */
    .woocommerce-account .woocommerce-MyAccount-navigation li a {
        justify-content: center;
        padding: 15px;
        background: rgba(255,255,255,0.03);
        margin-bottom: 10px;
        border-radius: 12px;
    }
    
    /* --- 3. Dashboard Cards (Centered) --- */
    .dashboard-card {
        text-align: center;
        padding: 30px 20px;
    }
    
    .woocommerce-MyAccount-content {
        width: 100%;
    }
    .dashboard-card h3 { justify-content: center; }
    
    /* Status Indicator */
    .status-indicator { margin: 15px auto 0; display: inline-flex; }
    
    /* Quick Actions (Full Width Buttons) */
    .db-actions { width: 100%; }
    .db-actions .btn { width: 100%; display: block; margin-bottom: 12px; }
    
    /* --- 4. Tables (Card View Polish) --- */
    .woocommerce-account table.shop_table thead { display: none; }
    .woocommerce-account table.shop_table tr { 
        display: block; 
        margin-bottom: 25px; 
        border: 1px solid #2a2e35; 
        border-radius: 15px; 
        padding: 20px; 
        background: #15181e;
        box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    }
    .woocommerce-account table.shop_table td { 
        display: flex; 
        justify-content: space-between; 
        align-items: center; 
        border-bottom: 1px solid #2a2e35; 
        padding: 15px 0; 
        text-align: right; 
        color: #fff;
    }
    .woocommerce-account table.shop_table td:last-child { border-bottom: none; padding-bottom: 0; }
    .woocommerce-account table.shop_table td::before { 
        content: attr(data-title); 
        font-weight: 600; 
        color: var(--text-muted); 
        font-size: 0.85rem;
        text-transform: uppercase;
    }
    
    /* Fix Actions Column Alignment on Mobile */
    .woocommerce-account table.shop_table td.woocommerce-orders-table__cell-order-actions {
        justify-content: center !important;
        gap: 15px;
        flex-wrap: wrap;
        padding-top: 20px;
        border-top: 1px solid #2a2e35;
        margin-top: 10px;
    }
    
    /* --- 5. Address Cards (Mobile Stack) --- */
    .woocommerce-Address {
        text-align: center;
        padding: 30px 20px;
    }
    /* Un-fix the edit button for mobile so it flows naturally */
    .woocommerce-Address .edit {
        position: relative;
        top: auto;
        right: auto;
        margin-bottom: 20px;
        display: inline-block;
        background: rgba(255,255,255,0.08);
    }
    .woocommerce-Address address {
        margin-top: 10px;
    }
}