﻿/* ============================================================
   DARK THEME (html[data-theme="dark"])
   Overrides built on top of theme.css. Late in cascade so these
   win over theme.css whites; higher specificity + !important to
   also beat WHMCS (twenty-one) defaults on parent-template pages.
   ============================================================ */

html[data-theme="dark"] {
    --d11-primary-light: #1e3a8a;
    --d11-heading: #e2e8f0;
    --d11-text: #cbd5e1;
    --d11-muted: #94a3b8;
    --d11-bg: #0f172a;
    --d11-card: #1e293b;
    --d11-border: #2a3650;
    --d11-shadow: 0 4px 24px rgba(0, 0, 0, .35);
    --d11-shadow-lg: 0 12px 40px rgba(0, 0, 0, .45);
}

/* ---- Global surfaces ---- */
html[data-theme="dark"] body {
    background: var(--d11-bg) !important;
    color: var(--d11-text) !important;
}
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3,
html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6 {
    color: var(--d11-heading);
}
html[data-theme="dark"] .d11-text {
    color: var(--d11-text);
}
html[data-theme="dark"] .d11-muted,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] small {
    color: var(--d11-muted);
}

/* ---- Headers, topbar, breadcrumb, footer ---- */
html[data-theme="dark"] .d11-header,
html[data-theme="dark"] .d11-client-header,
html[data-theme="dark"] .d11-client-navbar,
html[data-theme="dark"] .d11-client-mainnav,
html[data-theme="dark"] .d11-home-mobile-nav,
html[data-theme="dark"] .master-breadcrumb,
html[data-theme="dark"] .d11-topbar { background: #0b1220 !important; border-color: var(--d11-border); }
html[data-theme="dark"] .d11-header { box-shadow: 0 1px 10px rgba(0, 0, 0, .5); }
html[data-theme="dark"] .d11-topbar { background: #0a101e !important; }
html[data-theme="dark"] .d11-kb-search-input,
html[data-theme="dark"] .d11-kb-search-field,
html[data-theme="dark"] .d11-domain-input { background: #1e293b !important; color: var(--d11-text); }
html[data-theme="dark"] .d11-domain-input input { color: var(--d11-heading); }
html[data-theme="dark"] .d11-domain-input input::placeholder { color: var(--d11-muted); }
html[data-theme="dark"] .d11-domain-input i { color: var(--d11-muted); }
html[data-theme="dark"] .d11-nav-item > a,
html[data-theme="dark"] #mainNavbar .nav-link,
html[data-theme="dark"] .d11-mainnav-collapse .nav-link,
html[data-theme="dark"] .d11-navbar-tools a { color: var(--d11-text); }
html[data-theme="dark"] .d11-nav-item > a:hover,
html[data-theme="dark"] #mainNavbar .nav-link:hover,
html[data-theme="dark"] .d11-mainnav-collapse .nav-link:hover { background: #1e293b; color: var(--d11-primary); }
html[data-theme="dark"] #mainNavbar .nav-item.active > .nav-link,
html[data-theme="dark"] #mainNavbar .nav-link.active,
html[data-theme="dark"] .d11-mainnav-collapse .nav-link.active { color: var(--d11-primary); background: var(--d11-primary-light); }
html[data-theme="dark"] .d11-nav-toggle span { background: var(--d11-heading); }
html[data-theme="dark"] .d11-hdr-login:hover { background: #1e293b; color: var(--d11-primary); }
html[data-theme="dark"] .master-breadcrumb .breadcrumb-item a { color: var(--d11-muted); }
html[data-theme="dark"] .master-breadcrumb .breadcrumb-item.active { color: var(--d11-heading); }
html[data-theme="dark"] .d11-footer { background: #0a101e !important; border-top-color: var(--d11-border); }
html[data-theme="dark"] .d11-footer, html[data-theme="dark"] .d11-footer a { color: var(--d11-muted); }

/* ---- Theme white cards ---- */
html[data-theme="dark"] .d11-panel,
html[data-theme="dark"] .d11-auth-card,
html[data-theme="dark"] .d11-invoice-container,
html[data-theme="dark"] .d11-domain-search,
html[data-theme="dark"] .d11-domain-row,
html[data-theme="dark"] .d11-pricing-card,
html[data-theme="dark"] .d11-cat-card,
html[data-theme="dark"] .d11-col-box-blue,
html[data-theme="dark"] .d11-col-box-light,
html[data-theme="dark"] .d11-feature-card,
html[data-theme="dark"] .d11-legal-card,
html[data-theme="dark"] .d11-stat-card,
html[data-theme="dark"] .d11-cart-card,
html[data-theme="dark"] .d11-dropdown,
html[data-theme="dark"] .d11-dropdown-nested,
html[data-theme="dark"] #d11-domain-result {
    background: var(--d11-card) !important;
    border-color: var(--d11-border);
    box-shadow: var(--d11-shadow);
}
html[data-theme="dark"] .d11-panel-body,
html[data-theme="dark"] .d11-auth-card,
html[data-theme="dark"] .d11-invoice-container,
html[data-theme="dark"] .d11-cat-card,
html[data-theme="dark"] .d11-col-box-light,
html[data-theme="dark"] .d11-feature-card,
html[data-theme="dark"] .d11-stat-card,
html[data-theme="dark"] .d11-pricing-card { color: var(--d11-text); }
html[data-theme="dark"] .d11-col-box-light h3 { color: var(--d11-heading); }
html[data-theme="dark"] .d11-col-box-light p { color: var(--d11-text); }
html[data-theme="dark"] .d11-col-box-light .d11-col-icon { background: var(--d11-primary-light); color: var(--d11-primary); }
html[data-theme="dark"] .d11-col-box-blue h3 { color: #fff; }
html[data-theme="dark"] .d11-col-box-blue p,
html[data-theme="dark"] .d11-col-box-blue { color: #cbd5e1; }
html[data-theme="dark"] .d11-pricing-card-featured { background: linear-gradient(180deg, #16213a, #1e293b) !important; }
html[data-theme="dark"] .d11-btn-light { background: #1e293b !important; color: var(--d11-heading) !important; border-color: var(--d11-border); }

/* ---- WHMCS / parent-template cards & sidebars ---- */
html[data-theme="dark"] .card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .card-sidebar,
html[data-theme="dark"] .panel-sidebar,
html[data-theme="dark"] .panel-default,
html[data-theme="dark"] .card-body {
    background: var(--d11-card) !important;
    border-color: var(--d11-border);
    color: var(--d11-text);
}
html[data-theme="dark"] .card .card-header,
html[data-theme="dark"] .panel .panel-heading,
html[data-theme="dark"] .panel-heading,
html[data-theme="dark"] .card-header {
    background: #16213a !important;
    border-bottom-color: var(--d11-border);
    color: var(--d11-heading);
}
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .list-group-flush .list-group-item,
html[data-theme="dark"] .card-sidebar .list-group-item,
html[data-theme="dark"] .panel-sidebar .list-group-item {
    background: transparent;
    color: var(--d11-text);
    border-color: var(--d11-border);
}
html[data-theme="dark"] .list-group-item:hover,
html[data-theme="dark"] .list-group-item-action:hover,
html[data-theme="dark"] .list-group-item.active { background: #1e293b; color: var(--d11-text); }

/* ---- Standard Cart / store surface ---- */
html[data-theme="dark"] #order-standard_cart .order-navigation,
html[data-theme="dark"] #order-standard_cart .cart-sidebar,
html[data-theme="dark"] #order-standard_cart .cart-sidebar .card,
html[data-theme="dark"] #order-standard_cart .cart-sidebar .panel,
html[data-theme="dark"] #order-standard_cart .products .product,
html[data-theme="dark"] #order-standard_cart .view-cart-table,
html[data-theme="dark"] #order-standard_cart .view-cart-table table,
html[data-theme="dark"] #order-standard_cart .checkout-confirmation,
html[data-theme="dark"] #order-standard_cart .order-summary,
html[data-theme="dark"] #order-standard_cart .checkout .panel {
    background: var(--d11-card) !important;
    border-color: var(--d11-border);
    color: var(--d11-text);
    box-shadow: var(--d11-shadow);
}

/* ---- Tables ---- */
html[data-theme="dark"] .table,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th,
html[data-theme="dark"] .view-cart-table td,
html[data-theme="dark"] .view-cart-table th {
    color: var(--d11-text);
    border-color: var(--d11-border);
}
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .view-cart-table thead th { color: var(--d11-muted); }
html[data-theme="dark"] .table-hover tbody tr:hover,
html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd),
html[data-theme="dark"] .table > tbody > tr:nth-of-type(odd) { background: #1e293b; }

/* ---- Forms / inputs / selects ---- */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] select.form-control,
html[data-theme="dark"] .input-group-text,
html[data-theme="dark"] .d11-input,
html[data-theme="dark"] .d11-select {
    background: #0b1220 !important;
    color: var(--d11-heading) !important;
    border-color: var(--d11-border);
}
html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] .d11-input::placeholder { color: var(--d11-muted); }
html[data-theme="dark"] label,
html[data-theme="dark"] .form-group label,
html[data-theme="dark"] .control-label { color: var(--d11-muted); }
html[data-theme="dark"] select.form-control,
html[data-theme="dark"] .form-group select {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
}

/* ---- Dropdowns (WHMCS / Bootstrap) ---- */
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] #mainNavbar .dropdown-menu,
html[data-theme="dark"] .d11-user-dropdown,
html[data-theme="dark"] .d11-dropdown { background: #1e293b !important; border-color: var(--d11-border); box-shadow: var(--d11-shadow-lg); }
html[data-theme="dark"] .dropdown-item,
html[data-theme="dark"] .d11-dropdown li a,
html[data-theme="dark"] .d11-user-dropdown a,
html[data-theme="dark"] #mainNavbar .dropdown-menu a { color: var(--d11-text); }
html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus,
html[data-theme="dark"] .d11-dropdown li a:hover,
html[data-theme="dark"] .d11-user-dropdown a:hover { background: #0f172a; color: var(--d11-primary); }

/* ---- Sections / alt backgrounds ---- */
html[data-theme="dark"] .d11-section-alt { background: #0b1220; }
html[data-theme="dark"] .d11-cta { background: #16213a; }
html[data-theme="dark"] .d11-trust-bar,
html[data-theme="dark"] .d11-section { background: var(--d11-bg); }
html[data-theme="dark"] .d11-cat-icon { background: var(--d11-primary-light); }
html[data-theme="dark"] .d11-col-list li { color: var(--d11-text); }

/* --- Colored pill/chips: force white text on dark-primary-light chips --- */
html[data-theme="dark"] .d11-domain-tlds span,
html[data-theme="dark"] .d11-cat-price,
html[data-theme="dark"] .d11-badge { color: #fff !important; background: var(--d11-primary-light); border-color: var(--d11-primary-light); }

/* --- Product plan titles (Starter, Economy, etc.) on order/store pages --- */
html[data-theme="dark"] .products .product > header,
html[data-theme="dark"] #order-standard_cart .products .product > header,
html[data-theme="dark"] .products .product > header span,
html[data-theme="dark"] #order-standard_cart .products .product header span,
html[data-theme="dark"] .products .product h4 {
    color: var(--d11-heading) !important;
}
html[data-theme="dark"] .products .product .price,
html[data-theme="dark"] #order-standard_cart .products .product .price { color: var(--d11-primary); font-weight: 700; }
html[data-theme="dark"] .d11-empty,
html[data-theme="dark"] .d11-empty-state { color: var(--d11-muted); }

/* ---- Sidebar / active menu ---- */
html[data-theme="dark"] .d11-panel .list-group-item { color: var(--d11-muted); }
html[data-theme="dark"] .d11-panel .list-group-item.active,
html[data-theme="dark"] #order-standard_cart .cart-sidebar .list-group-item.active,
html[data-theme="dark"] .list-group-item.active { color: #fff !important; background: #1e3a8a !important; border-color: #1e3a8a !important; }
html[data-theme="dark"] .list-group-item.active a,
html[data-theme="dark"] .list-group-item.active:hover { color: #fff !important; }
html[data-theme="dark"] .sidebar .list-group-item:hover,
html[data-theme="dark"] .d11-panel .list-group-item:hover { color: var(--d11-heading); background: #25324d; }
html[data-theme="dark"] .d11-domain-verdict,
html[data-theme="dark"] .d11-domain-result { border-color: var(--d11-border); }

/* ---- Domain search results (verdict + rows) ---- */
html[data-theme="dark"] .d11-domain-verdict { background: #1e293b !important; }
html[data-theme="dark"] .d11-domain-verdict.is-avail { background: #10251a !important; border-color: #1f6b3a; }
html[data-theme="dark"] .d11-domain-verdict.is-taken { background: #2a1418 !important; border-color: #7f2430; }
html[data-theme="dark"] .d11-domain-verdict.is-unk   { background: #2a2313 !important; border-color: #7a5c16; }
html[data-theme="dark"] .d11-domain-verdict.is-avail .d11-dv-main > i,
html[data-theme="dark"] .d11-domain-status.is-avail .d11-domain-status-name i { color: #4ade80; }
html[data-theme="dark"] .d11-domain-verdict.is-taken .d11-dv-main > i,
html[data-theme="dark"] .d11-domain-status.is-taken .d11-domain-status-name i { color: #f87171; }
html[data-theme="dark"] .d11-domain-verdict.is-unk .d11-dv-main > i,
html[data-theme="dark"] .d11-domain-status.is-invalid .d11-domain-status-name i { color: #fbbf24; }
html[data-theme="dark"] .d11-dv-main em,
html[data-theme="dark"] .d11-dv-price em { color: var(--d11-muted); }
html[data-theme="dark"] .d11-dv-main strong { color: var(--d11-heading); }
html[data-theme="dark"] .d11-dv-price,
html[data-theme="dark"] .d11-domain-status-price strong,
html[data-theme="dark"] .d11-dr-price strong { color: #60a5fa; }
html[data-theme="dark"] .d11-domain-row { background: #1e293b !important; }
html[data-theme="dark"] .d11-domain-row.is-avail { background: #10251a !important; }
html[data-theme="dark"] .d11-domain-row.is-taken { background: #2a1418 !important; }
html[data-theme="dark"] .d11-domain-row strong { color: var(--d11-heading); }
html[data-theme="dark"] .d11-domain-row.is-avail strong,
html[data-theme="dark"] .d11-domain-row.is-taken strong { color: var(--d11-heading); }

/* ---- Alerts ---- */
html[data-theme="dark"] .d11-alert-info { background: #16213a; border-color: #334155; color: #93c5fd; }
html[data-theme="dark"] .d11-alert-warning { background: #2a2416; border-color: #6b5416; color: #fcd34d; }

/* ---- Modals / popovers / tooltips ---- */
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .popover,
html[data-theme="dark"] .tooltip-inner { background: #1e293b !important; color: var(--d11-text); border-color: var(--d11-border); }
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { border-color: var(--d11-border); }
html[data-theme="dark"] .modal-title { color: var(--d11-heading); }

/* ---- Announcements / articles / parent-template content ---- */
html[data-theme="dark"] .well,
html[data-theme="dark"] .panel-well,
html[data-theme="dark"] .announcement,
html[data-theme="dark"] .announcement .well,
html[data-theme="dark"] .kb-article,
html[data-theme="dark"] .article,
html[data-theme="dark"] .display-4,
html[data-theme="dark"] .page-header,
html[data-theme="dark"] .page-header h1,
html[data-theme="dark"] .page-header h2 { color: var(--d11-heading); }
html[data-theme="dark"] .well,
html[data-theme="dark"] .panel-well,
html[data-theme="dark"] .announcement .well,
html[data-theme="dark"] .announcement article,
html[data-theme="dark"] .announcement .article { background: var(--d11-card) !important; border-color: var(--d11-border); color: var(--d11-text); box-shadow: var(--d11-shadow); }
html[data-theme="dark"] .announcement { background-color: var(--d11-card); border: 1px solid var(--d11-border); }
html[data-theme="dark"] .announcement:nth-child(odd) { background-color: #16213a; }
html[data-theme="dark"] .announcement .announcement-title,
html[data-theme="dark"] .announcement h3 > a,
html[data-theme="dark"] .announcement .well h3 > a,
html[data-theme="dark"] .announcement .well a,
html[data-theme="dark"] .announcement article a,
html[data-theme="dark"] .announcement .article a,
html[data-theme="dark"] .article a,
html[data-theme="dark"] .kb-article a { color: var(--d11-primary); }
html[data-theme="dark"] .announcement .well .secondary-panel-body,
html[data-theme="dark"] .announcement .well p,
html[data-theme="dark"] .announcement p,
html[data-theme="dark"] .announcement article p,
html[data-theme="dark"] .announcement .article p,
html[data-theme="dark"] .article p,
html[data-theme="dark"] .kb-article p { color: var(--d11-text); }
html[data-theme="dark"] .announcement .btn,
html[data-theme="dark"] .announcement a.btn.btn-default { background: #16213a; color: #e2e8f0; border-color: #334155; }
html[data-theme="dark"] .alert-info,
html[data-theme="dark"] .alert-warning,
html[data-theme="dark"] .alert-danger,
html[data-theme="dark"] .alert-success { background: #16213a !important; border-color: var(--d11-border); color: var(--d11-text); }
html[data-theme="dark"] .alert a,
html[data-theme="dark"] .alert-info a,
html[data-theme="dark"] .alert-warning a { color: var(--d11-primary); }
html[data-theme="dark"] .content pl, html[data-theme="dark"] .panel-body ul,
html[data-theme="dark"] .panel-body ol { color: var(--d11-text); }

/* ---- Floating helpers ---- */
html[data-theme="dark"] .back-to-top,
html[data-theme="dark"] .btn-return-to-admin { background: #1e293b !important; border-color: var(--d11-border); color: var(--d11-text); }
