/* ============================================================
   RekoGames — Black Gaming Theme (custom.css)
   Loaded after main.css / style.css / libs.css, so every rule
   here overrides the original light Apadana theme.
   ============================================================ */

:root {
    --bg: #05070b;
    --bg-soft: #0a0d13;
    --surface: #0d1017;
    --surface-2: #12161f;
    --surface-3: #181d29;
    --border: #212834;
    --border-soft: #171d27;
    --text: #dde4ec;
    --text-2: #9aa5b5;
    --text-3: #6b7686;
    --brand: #ffb300;
    --brand-bright: #ffd54a;
    --brand-dim: rgba(255, 179, 0, .1);
    --cyan: #22d3ee;
    --amber: #fbbf24;
    --red: #f87171;
    --radius: 14px;
}

/* ---------- Base ---------- */

html {
    background: var(--bg);
}

body,
body.primary-bg-color {
    background-color: var(--bg);
    color: var(--text);
    background-image:
        /* gold halo top */
        radial-gradient(950px 420px at 50% -130px, rgba(255, 179, 0, .11), transparent 68%),
        /* gold glow bottom-right */
        radial-gradient(1100px 520px at 106% 112%, rgba(255, 179, 0, .06), transparent 62%),
        /* deep blue ambient left */
        radial-gradient(900px 560px at -6% 18%, rgba(24, 42, 82, .4), transparent 65%),
        /* violet ambient right */
        radial-gradient(1000px 620px at 104% 42%, rgba(58, 32, 92, .28), transparent 60%),
        /* subtle cyber grid */
        repeating-linear-gradient(0deg, rgba(255, 179, 0, .02) 0 1px, transparent 1px 48px),
        repeating-linear-gradient(90deg, rgba(255, 179, 0, .02) 0 1px, transparent 1px 48px);
    background-attachment: fixed;
}

/* soft breathing glow on the top gold halo */
@keyframes bgGlowPulse {
    0%, 100% { opacity: .55; }
    50% { opacity: 1; }
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    background: radial-gradient(1200px 520px at 50% -160px, rgba(255, 179, 0, .09), transparent 65%);
    animation: bgGlowPulse 9s ease-in-out infinite;
}

h1, h2, h3, h4, h5, h6 {
    color: #f1f5f9;
}

b, strong {
    color: var(--brand-bright);
    font-weight: 600;
}

a {
    color: var(--brand);
    transition: color .2s ease;
}

a:hover {
    color: var(--brand-bright);
}

.text-muted,
.text-secondary {
    color: var(--text-2) !important;
}

::selection {
    background: rgba(255, 179, 0, .85);
    color: #000;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: #090c11;
}

::-webkit-scrollbar-thumb {
    background: #232b3a;
    border-radius: 8px;
    border: 2px solid #090c11;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--brand);
}

/* ---------- Header ---------- */

header.header {
    background-color: #04060a;
    border-bottom: 1px solid var(--border);
}

header.header .topbar {
    background-color: #070a10;
    border-bottom: 1px solid var(--border-soft);
}

header.header .navbar a {
    color: #c7d0da;
}

header.header .navbar a:hover {
    color: var(--brand-bright);
}

header.header .navbar-nav a {
    font-weight: 500;
}

header.header .toolbar .nav-link {
    color: #c7d0da;
    background-color: transparent;
}

header.header .toolbar .nav-link:hover {
    color: var(--brand-bright);
    background-color: rgba(255, 255, 255, .04);
}

header.header .search {
    border: 1px solid var(--border) !important;
    background: var(--surface);
    border-radius: 12px !important;
    overflow: hidden;
}

header.header .search .form-control {
    background-color: var(--surface);
    color: var(--text);
}

header.header .search .form-control::placeholder {
    color: var(--text-3);
}

header.header .search .btn {
    background-color: var(--surface);
    color: var(--brand);
    border-left: 1px solid var(--border) !important;
}

header.header .search:focus-within {
    border-color: rgba(255, 179, 0, .6) !important;
    box-shadow: 0 0 0 3px rgba(255, 179, 0, .12);
}

header.header .main-navbar-wrapper {
    border-top: 1px solid var(--border-soft);
    background: #04060a;
}

header.header .navbar-nav .nav-link {
    color: #c7d0da;
}

header.header .navbar-nav .nav-link:hover,
header.header .navbar-nav .nav-link:focus {
    color: var(--brand-bright);
}

header.header .navbar-nav .text-success {
    color: var(--brand) !important;
}

/* mobile toggle */
.navbar-light .navbar-toggler {
    border-color: var(--border);
    color: var(--text);
}

.navbar-light .navbar-toggler .fad {
    color: var(--text);
}

/* dropdowns inside header */
header.header .dropdown-menu {
    background-color: #0e1219;
    border: 1px solid var(--border);
    box-shadow: 0 14px 34px -12px rgba(0, 0, 0, .8);
}

header.header .dropdown-menu .dropdown-item {
    color: var(--text-2);
}

header.header .dropdown-menu .dropdown-item:hover {
    background-color: var(--brand-dim);
    color: var(--brand-bright);
}

header.header .dropdown-divider {
    border-top-color: var(--border);
}

.client-top-access-item-count {
    background-color: var(--brand) !important;
    color: #000 !important;
    box-shadow: 0 0 0 3px rgba(255, 179, 0, .25);
}

/* ---------- Breadcrumb ---------- */

.master-breadcrumb {
    background-color: #070a10;
    border-bottom: 1px solid var(--border);
}

.master-breadcrumb .breadcrumb {
    margin: 0;
    padding: 10px 30px;
    font-size: 14px;
    background: transparent;
}

.master-breadcrumb .breadcrumb-item,
.master-breadcrumb .breadcrumb-item a {
    color: var(--text-2);
}

.master-breadcrumb .breadcrumb-item a:hover {
    color: var(--brand-bright);
}

.master-breadcrumb .breadcrumb-item.active {
    color: var(--brand);
}

.master-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-3);
}

/* ---------- Cards / Panels ---------- */

.card,
.mc-promo-login,
.mc-promo-manage,
.panel,
.panel-default {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .9);
}

.card:hover {
    border-color: rgba(255, 179, 0, .35) !important;
}

.card-header,
.panel-heading,
.panel-default > .panel-heading {
    background-color: var(--surface-2) !important;
    border-bottom: 1px solid var(--border) !important;
    color: var(--text);
    border-radius: var(--radius) var(--radius) 0 0 !important;
}

.card-footer,
.panel-footer,
.panel-default > .panel-footer {
    background-color: var(--surface-2) !important;
    border-top: 1px solid var(--border) !important;
    border-radius: 0 0 var(--radius) var(--radius) !important;
}

.card-body,
.panel-body,
.mc-promo-login .content,
.mc-promo-manage .content {
    background-color: var(--surface);
    color: var(--text);
}

.card-title,
.primary-content .card-title,
.mc-promo-login .panel-heading h3,
.mc-promo-manage .panel-heading h3 {
    color: #f1f5f9 !important;
}

.card-text,
.card-body p {
    color: var(--text-2);
}

.header-lined,
.primary-content h1,
.primary-content h2,
.primary-content h3,
.primary-content h4 {
    color: #f1f5f9;
}

.header-lined {
    border-bottom-color: var(--border);
}

/* ---------- Tables ---------- */

.table {
    color: var(--text);
    background-color: transparent;
}

.table thead th {
    color: #e6ebf2;
    border-bottom: 1px solid var(--border);
    background-color: var(--surface-2);
}

.table td,
.table th {
    border-top-color: var(--border-soft);
}

.table-hover tbody tr:hover {
    color: var(--text);
    background-color: rgba(255, 179, 0, .06);
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, .025);
}

.table-bordered,
.table-bordered td,
.table-bordered th {
    border-color: var(--border);
}

.table .thead-dark th,
.table-dark {
    background-color: #0a0d13;
    border-color: var(--border);
    color: #e6ebf2;
}

.table .thead-light th,
.table-light {
    background-color: var(--surface-2);
    color: var(--text);
}

table.table-list thead th {
    background-color: var(--surface-2);
    border-bottom: 1px solid var(--border);
}

table.table-list tbody td {
    border-bottom: 1px solid var(--border-soft);
}

.table-list > tbody > tr:hover > td {
    background-color: rgba(255, 179, 0, .06);
}

div.dataTables_wrapper div.dataTables_info {
    color: var(--text-2);
}

/* ---------- Forms ---------- */

.form-control,
.form-select,
select.form-control,
textarea.form-control,
input[type="text"].form-control,
input[type="email"].form-control,
input[type="password"].form-control,
input[type="search"].form-control,
.custom-select {
    background-color: var(--surface-2);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 10px;
}

.form-control:focus,
.custom-select:focus {
    background-color: var(--surface-2);
    border-color: rgba(255, 179, 0, .55);
    color: var(--text);
    box-shadow: 0 0 0 3px rgba(255, 179, 0, .12);
}

.form-control::placeholder {
    color: var(--text-3);
}

.form-control:disabled,
.form-control[readonly] {
    background-color: var(--bg-soft);
    color: var(--text-3);
}

.input-group-text {
    background-color: var(--surface-2);
    border: 1px solid var(--border);
    color: var(--text-2);
}

.form-group label,
label {
    color: var(--text-2);
}

.form-text,
small.form-text {
    color: var(--text-3);
}

select.form-control option,
select option {
    background-color: var(--surface-2);
    color: var(--text);
}

/* ---------- Buttons ---------- */

.btn {
    border-radius: 10px;
    transition: all .25s ease;
}

.btn:focus,
.btn.focus {
    box-shadow: none;
}

.btn-primary {
    color: #1c1000;
    background: linear-gradient(135deg, #e0a100, #ffb300);
    border: 1px solid rgba(43, 255, 94, .45);
    box-shadow: 0 8px 22px -10px rgba(255, 179, 0, .65);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
    color: #000;
    background: linear-gradient(135deg, #ffb300, #ffd54a);
    border-color: rgba(43, 255, 94, .7);
    box-shadow: 0 10px 28px -10px rgba(255, 179, 0, .8);
}

.btn-success {
    color: #1c1000;
    background: linear-gradient(135deg, #e0a100, #ffb300);
    border: 1px solid rgba(43, 255, 94, .45);
    box-shadow: 0 8px 22px -10px rgba(255, 179, 0, .65);
}

.btn-success:hover,
.btn-success:focus {
    color: #000;
    background: linear-gradient(135deg, #ffb300, #ffd54a);
    border-color: rgba(43, 255, 94, .7);
}

.btn-info {
    color: #02121a;
    background: linear-gradient(135deg, #17c3e8, #22d3ee);
    border: 1px solid rgba(103, 232, 249, .5);
    box-shadow: 0 8px 22px -10px rgba(34, 211, 238, .55);
}

.btn-info:hover,
.btn-info:focus {
    color: #000;
    background: linear-gradient(135deg, #22d3ee, #67e8f9);
    border-color: rgba(103, 232, 249, .75);
}

.btn-warning {
    color: #1c1200;
    background: linear-gradient(135deg, #f5a623, #fbbf24);
    border: 1px solid rgba(252, 211, 77, .55);
}

.btn-warning:hover,
.btn-warning:focus {
    color: #000;
    background: linear-gradient(135deg, #fbbf24, #fde047);
}

.btn-danger {
    color: #fff;
    background: linear-gradient(135deg, #dc2626, #f87171);
    border: 1px solid rgba(248, 113, 113, .5);
}

.btn-danger:hover,
.btn-danger:focus {
    color: #fff;
    background: linear-gradient(135deg, #ef4444, #fca5a5);
}

.btn-default,
.btn-secondary {
    color: var(--text);
    background-color: var(--surface-3);
    border: 1px solid var(--border);
}

.btn-default:hover,
.btn-secondary:hover {
    color: var(--brand-bright);
    background-color: #202838;
    border-color: rgba(255, 179, 0, .4);
}

.btn-light {
    color: var(--text);
    background-color: var(--surface-3);
    border: 1px solid var(--border);
}

.btn-light:hover {
    color: #000;
    background-color: var(--brand);
    border-color: var(--brand);
}

.btn-dark {
    color: var(--brand-bright);
    background-color: #06080d;
    border: 1px solid var(--border);
}

.btn-outline-primary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-secondary,
.btn-outline-light,
.btn-outline-dark {
    background-color: transparent;
}

.btn-outline-success {
    color: var(--brand);
    border-color: rgba(255, 179, 0, .5);
}

.btn-outline-success:hover {
    color: #000;
    background-color: var(--brand);
    border-color: var(--brand);
}

.btn-outline-primary {
    color: var(--brand-bright);
    border-color: rgba(255, 179, 0, .5);
}

.btn-outline-primary:hover {
    color: #000;
    background-color: var(--brand);
    border-color: var(--brand);
}

.btn-outline-info {
    color: var(--cyan);
    border-color: rgba(34, 211, 238, .5);
}

.btn-outline-info:hover {
    color: #000;
    background-color: var(--cyan);
    border-color: var(--cyan);
}

.btn-outline-warning {
    color: var(--amber);
    border-color: rgba(251, 191, 36, .5);
}

.btn-outline-warning:hover {
    color: #000;
    background-color: var(--amber);
    border-color: var(--amber);
}

.btn-outline-danger {
    color: var(--red);
    border-color: rgba(248, 113, 113, .5);
}

.btn-outline-danger:hover {
    color: #fff;
    background-color: var(--red);
    border-color: var(--red);
}

.btn-outline-secondary {
    color: var(--text-2);
    border-color: var(--border);
}

.btn-outline-secondary:hover {
    color: var(--brand-bright);
    background-color: var(--surface-3);
    border-color: var(--brand);
}

/* ---------- Modal ---------- */

.modal-content {
    background-color: #0e1219;
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .9);
}

.modal-header {
    background-color: var(--surface-2);
    border-bottom: 1px solid var(--border);
    border-radius: 16px 16px 0 0;
}

.modal-footer {
    background-color: var(--surface-2);
    border-top: 1px solid var(--border);
    border-radius: 0 0 16px 16px;
}

.modal-title {
    color: #f1f5f9;
}

.modal-content .close,
.modal-header .close {
    color: var(--text);
    text-shadow: none;
    opacity: .8;
}

.modal-content .modal-body .icon {
    color: var(--brand) !important;
}

.modal-backdrop.show {
    opacity: .7;
}

/* ---------- Dropdowns ---------- */

.dropdown-menu {
    background-color: #0e1219;
    border: 1px solid var(--border);
    box-shadow: 0 14px 34px -12px rgba(0, 0, 0, .85);
}

.dropdown-item {
    color: var(--text-2);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--brand-dim);
    color: var(--brand-bright);
}

.dropdown-divider {
    border-top-color: var(--border);
}

/* ---------- List groups / sidebar ---------- */

.list-group-item {
    background-color: var(--surface);
    border: 1px solid var(--border);
    color: var(--text);
}

.list-group-item.active {
    background-color: rgba(255, 179, 0, .15);
    border-color: rgba(255, 179, 0, .4);
    color: var(--brand-bright);
}

.list-group-item-action:hover,
.list-group-item-action:focus {
    background-color: rgba(255, 179, 0, .07);
    color: var(--brand-bright);
}

.sidebar .panel,
.sidebar .card {
    border-radius: var(--radius);
}

.sidebar .panel-heading,
.sidebar .card-header {
    background-color: var(--surface-2);
}

.sidebar .list-group-item {
    border-radius: 0;
    border-left: 0;
    border-right: 0;
}

.sidebar .list-group-item:first-child {
    border-top: 0;
}

.sidebar .list-group-item:last-child {
    border-bottom: 0;
}

.sidebar a {
    color: var(--text-2);
}

.sidebar a:hover {
    color: var(--brand-bright);
}

/* ---------- Pagination ---------- */

.pagination .page-item .page-link {
    background-color: var(--surface-2);
    border: 1px solid var(--border);
    color: var(--text-2);
}

.pagination .page-item .page-link:hover {
    background-color: var(--brand-dim);
    color: var(--brand-bright);
    border-color: rgba(255, 179, 0, .4);
}

.pagination .page-item.active .page-link {
    background-color: var(--brand);
    border-color: var(--brand);
    color: #000;
}

.pagination .page-item.disabled .page-link {
    background-color: var(--bg-soft);
    border-color: var(--border-soft);
    color: var(--text-3);
}

/* ---------- Badges / alerts / progress ---------- */

.badge {
    border-radius: 8px;
}

.badge-success,
.badge-primary {
    background-color: var(--brand);
    color: #000;
}

.badge-info {
    background-color: var(--cyan);
    color: #02121a;
}

.badge-warning {
    background-color: var(--amber);
    color: #1c1200;
}

.badge-danger {
    background-color: #dc2626;
    color: #fff;
}

.badge-secondary,
.badge-light {
    background-color: var(--surface-3);
    color: var(--text);
}

.alert {
    background-color: var(--surface-2);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: var(--radius);
}

.alert-success {
    background-color: rgba(255, 179, 0, .08);
    border-color: rgba(255, 179, 0, .35);
    color: #9ef5b4;
}

.alert-info {
    background-color: rgba(34, 211, 238, .08);
    border-color: rgba(34, 211, 238, .35);
    color: #a5f3fc;
}

.alert-warning {
    background-color: rgba(251, 191, 36, .08);
    border-color: rgba(251, 191, 36, .35);
    color: #fde68a;
}

.alert-danger {
    background-color: rgba(248, 113, 113, .08);
    border-color: rgba(248, 113, 113, .35);
    color: #fecaca;
}

.alert .close {
    color: var(--text);
    text-shadow: none;
    opacity: .8;
}

.progress {
    background-color: var(--surface-3);
    border: 1px solid var(--border-soft);
}

.progress-bar {
    background-color: var(--brand);
}

/* ---------- Navs / tabs ---------- */

.nav-tabs .nav-link {
    color: var(--text-2);
    border-color: var(--border);
    background-color: var(--surface);
}

.nav-tabs .nav-link:hover {
    color: var(--brand-bright);
    border-color: rgba(255, 179, 0, .35);
}

.nav-tabs .nav-link.active {
    color: var(--brand-bright);
    background-color: var(--surface-2);
    border-color: rgba(255, 179, 0, .45) var(--border) var(--surface-2);
}

.nav-pills .nav-link {
    color: var(--text-2);
    background-color: var(--surface-2);
    border: 1px solid var(--border);
}

.nav-pills .nav-link.active {
    background-color: var(--brand);
    color: #000;
    border-color: var(--brand);
}

.nav-pills .nav-link:hover {
    color: var(--brand-bright);
}

/* ---------- Footer ---------- */

footer.footer {
    background-color: #04060a;
    color: var(--text-2);
    border-top: 1px solid var(--border);
}

footer.footer .nav-link {
    color: var(--text-2);
}

footer.footer .nav-link:hover {
    color: var(--brand-bright);
}

.footer-block {
    background-color: #04060a;
}

.footer-block-col {
    border-bottom: 1px solid var(--border);
}

.footer-block-col-1st div p:first-child {
    color: var(--brand-bright);
}

.footer-block-col-1st div p:nth-child(2) {
    color: var(--text-2);
}

/* ============================================================
   GAMING FOOTER — black + neon gold
   ============================================================ */

footer.bg-footer {
    position: relative;
    overflow: hidden;
    background-color: #05070b !important;
    color: #c9d1d9;
    border-top: 0 !important;
    padding: 56px 0 40px;
}

/* neon top edge */
footer.bg-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    z-index: 2;
    background: linear-gradient(90deg, transparent 0%, rgba(255,179,0,.12) 12%, #ffd54a 50%, rgba(255,179,0,.12) 88%, transparent 100%);
    box-shadow: 0 0 18px rgba(255,179,0,.55), 0 2px 44px rgba(255,179,0,.28);
}

/* gold radial glow + faint gaming grid */
footer.bg-footer::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(60% 95% at 50% 0%, rgba(255,179,0,.11) 0%, transparent 62%),
        radial-gradient(90% 60% at 88% 112%, rgba(255,179,0,.05) 0%, transparent 55%),
        repeating-linear-gradient(0deg, rgba(255,179,0,.028) 0 1px, transparent 1px 44px),
        repeating-linear-gradient(90deg, rgba(255,179,0,.028) 0 1px, transparent 1px 44px);
}

footer.bg-footer .container {
    position: relative;
    z-index: 1;
}

.bg-footer a {
    transition: color .25s ease, text-shadow .25s ease, transform .25s ease;
}

.bg-footer p {
    color: #8a94a3;
}

/* column titles — gold gradient with glowing underline */
.bg-footer .footer-title {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #ffb300;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .4px;
    position: relative;
    padding-bottom: 11px;
    margin-bottom: 16px;
}

@supports (-webkit-background-clip: text) or (background-clip: text) {
    .bg-footer .footer-title {
        color: transparent;
        background: linear-gradient(120deg, #ffd54a 0%, #ffb300 45%, #e0a100 100%);
        -webkit-background-clip: text;
        background-clip: text;
    }
}

.bg-footer .footer-title::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 48px;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, #ffb300 0%, rgba(255,179,0,0) 100%);
    box-shadow: 0 0 12px rgba(255,179,0,.6);
}

.bg-footer .footer-title svg {
    width: 21px;
    height: 21px;
    flex-shrink: 0;
    filter: drop-shadow(0 0 6px rgba(255,179,0,.5));
}

/* brand column */
.bg-footer .footer-brand .footer-title {
    font-size: 22px;
    gap: 10px;
}

.bg-footer .footer-brand .footer-title svg {
    width: 26px;
    height: 26px;
}

.bg-footer .footer-brand p {
    line-height: 2.15;
    padding: 0;
    max-width: 300px;
    color: #7d8896;
}

/* links — gold arrow + neon hover */
.bg-footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.bg-footer ul li a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #9aa5b5;
    line-height: 30px;
}

.bg-footer ul li a:not(:has(svg))::before {
    content: "▸";
    color: rgba(255,179,0,.55);
    font-size: 11px;
    transition: transform .25s ease, color .25s ease;
}

.bg-footer ul li a:hover {
    color: #ffd54a;
    text-shadow: 0 0 14px rgba(255,179,0,.6);
    transform: translateX(-4px);
}

.bg-footer ul li a:hover:not(:has(svg))::before {
    color: #ffd54a;
    transform: translateX(-3px);
}

/* contact icons */
.bg-footer .foot-ico {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    transition: filter .25s ease, transform .25s ease;
}

.bg-footer ul li a:hover .foot-ico {
    filter: drop-shadow(0 0 7px rgba(255,179,0,.8));
    transform: scale(1.15);
}

/* copyright bar */
footer.bg-footer .border-t {
    border-top: 1px solid rgba(255,179,0,.2) !important;
}

footer.bg-footer .border-t p {
    color: #7d8896;
    line-height: 1.9;
}

footer.bg-footer .border-t a {
    color: #ffb300;
    font-weight: 700;
    text-shadow: 0 0 10px rgba(255,179,0,.4);
}

footer.bg-footer .border-t a:hover {
    color: #ffd54a;
    text-shadow: 0 0 16px rgba(255,179,0,.75);
}

/* ---------- Login / register ---------- */

/* page wrapper: pure black with a faint green halo */
.logins,
.registers {
    background-color: #000;
    background-blend-mode: multiply;
    min-height: 100vh;
    position: relative;
}

.logins::before,
.registers::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(760px 340px at 50% -40px, rgba(255, 179, 0, .10), transparent 70%);
    pointer-events: none;
}

/* card wrapper */
.container-login100 {
    background-color: rgba(11, 14, 20, .97) !important;
    box-shadow: 0 24px 70px -28px rgba(0, 0, 0, .95), 0 0 46px -18px rgba(255, 179, 0, .22) !important;
    border-radius: 20px !important;
    border: 1px solid var(--border);
}

/* form card */
.login100-form,
.Registr100-form {
    background-color: #0a0d13 !important;
    background-image: linear-gradient(344deg, #0a0d13 calc(100% - 450px), #0e131c 85px) !important;
    color: var(--text);
    position: relative;
    overflow: hidden;
}

/* neon top accent line on the card */
.login100-form::before,
.Registr100-form::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--brand), var(--brand-bright), transparent);
    opacity: .85;
}

.login100-form-title,
.login100-form p,
.login100-form label {
    color: var(--text);
}

.login100-form-title {
    color: #f1f5f9;
    text-shadow: 0 0 18px rgba(255, 179, 0, .35);
}

/* auth page logo */
.logos {
    margin-bottom: 24px;
}

.login-logo,
.logo-img {
    filter: hue-rotate(-78deg) saturate(1.35) brightness(1.08) drop-shadow(0 0 16px rgba(255, 179, 0, .35));
}

/* keep the brand mark crisp on dark surfaces */
.login-logo {
    max-width: 300px;
}

/* register: section cards (login-boder / login-body) */
.login-boder {
    background-color: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    margin-bottom: 1.1rem;
    transition: border-color .25s ease, box-shadow .25s ease;
}

.login-boder:hover {
    border-color: rgba(255, 179, 0, .35);
    box-shadow: 0 0 0 1px rgba(255, 179, 0, .12);
}

.login-body {
    padding: 1.3rem 1.35rem;
}

/* register inputs — ID selector beats the #registration rules in style.css */
#registration .field,
#registration .form-control {
    background-color: var(--surface-2);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 10px;
}

#registration .field:focus,
#registration .form-control:focus {
    background-color: var(--surface-2);
    border-color: rgba(255, 179, 0, .55);
    color: var(--text);
    box-shadow: 0 0 0 3px rgba(255, 179, 0, .12);
}

#registration .field::placeholder,
#registration .form-control::placeholder {
    color: var(--text-3);
}

#registration .field[disabled],
#registration .field[readonly],
#registration .form-control[disabled],
#registration .form-control[readonly] {
    background-color: var(--bg-soft);
    color: var(--text-3);
}

#registration label {
    color: var(--text-2);
    font-weight: 400;
}

#registration .prepend-icon .field-icon i,
#registration .field-icon i {
    color: var(--brand);
}

#registration .field-help-text {
    color: var(--text-3);
}

/* "sign up with ..." divider pill */
#registration .sub-heading {
    border-top-color: var(--border);
}

#registration .sub-heading span {
    color: var(--brand);
    background-color: var(--surface);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 2px 18px;
}

/* password strength meter */
.password-strength-meter .progress {
    background-color: var(--surface-3);
}

#passwordStrengthMeterBar {
    background-image: none;
    background-color: var(--brand) !important;
    box-shadow: 0 0 12px rgba(255, 179, 0, .5);
}

/* social login buttons */
.social-signin-btns .btn,
.btn-social {
    background-color: var(--surface-2);
    border: 1px solid var(--border);
    color: var(--text);
}

.social-signin-btns .btn:hover,
.btn-social:hover {
    border-color: rgba(255, 179, 0, .5);
    color: var(--brand-bright);
    box-shadow: 0 0 18px -4px rgba(255, 179, 0, .35);
}

/* captcha area on auth pages */
.captcha-container,
#registration .captcha-container {
    background-color: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1rem;
}

/* reveal password button */
.btn-reveal-pw {
    background-color: var(--surface-2);
    border-color: var(--border);
    color: var(--text-2);
}

/* login/register action buttons */
.btn-group-lg .btn {
    border-radius: 12px;
    font-weight: 600;
}

.login100-form .btn-success,
.Registr100-form .btn-success {
    box-shadow: 0 6px 22px -8px rgba(255, 179, 0, .55);
}

.login100-form .btn-primary,
.Registr100-form .btn-primary {
    box-shadow: 0 6px 22px -8px rgba(255, 179, 0, .3);
}

/* generate password button */
#registration .generate-password {
    margin-top: 2px;
}

/* checkbox / radio accent */
.form-check-input,
input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--brand);
}

/* ---------- Homepage: slider ---------- */

.mainside {
    border-radius: 18px;
    overflow: hidden;
    margin-top: 22px;
    box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .9);
}

.mainside .carousel-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 6, 10, .15) 0%, rgba(4, 6, 10, .35) 55%, rgba(4, 6, 10, .75) 100%);
    pointer-events: none;
}

.mainside .carousel-indicators li {
    background-color: rgba(255, 255, 255, .4);
    width: 26px;
    height: 5px;
    border-radius: 4px;
    transition: all .25s ease;
}

.mainside .carousel-indicators .active {
    background-color: var(--brand);
    width: 42px;
}

.mainside .carousel-control-prev,
.mainside .carousel-control-next {
    width: 9%;
    opacity: 0;
    transition: opacity .3s ease;
}

.mainside:hover .carousel-control-prev,
.mainside:hover .carousel-control-next {
    opacity: 1;
}

/* ---------- Homepage: sections & tailwind utilities ---------- */

.bg-white {
    background-color: #0e1118 !important;
}

.bg-white\/10 {
    background-color: rgba(255, 255, 255, .06) !important;
}

.bg-white\/20 {
    background-color: rgba(255, 255, 255, .09) !important;
}

.bg-white\/70 {
    background-color: rgba(13, 16, 23, .7) !important;
}

.bg-white\/80 {
    background-color: rgba(13, 16, 23, .8) !important;
}

.bg-white\/95 {
    background-color: rgba(13, 16, 23, .95) !important;
}

.bg-slate-100 {
    background-color: #171c26 !important;
}

.bg-slate-50 {
    background-color: #10141c !important;
}

.bg-slate-900 {
    background-color: #0a0d13 !important;
}

.hover\:bg-slate-100:hover {
    background-color: #1c2330 !important;
}

.hover\:bg-white\/10:hover {
    background-color: rgba(255, 255, 255, .05) !important;
}

.hover\:bg-brand-50:hover {
    background-color: rgba(255, 179, 0, .08) !important;
}

.bg-brand-50 {
    background-color: rgba(255, 179, 0, .06) !important;
}

.bg-brand-100 {
    background-color: rgba(255, 179, 0, .12) !important;
}

.bg-brand-200 {
    background-color: rgba(255, 179, 0, .2) !important;
}

.bg-brand-500 {
    background-color: var(--brand) !important;
}

.bg-green-100 {
    background-color: rgba(255, 179, 0, .12) !important;
}

.bg-green-50 {
    background-color: rgba(255, 179, 0, .07) !important;
}

.bg-green-500 {
    background-color: var(--brand) !important;
}

.bg-red-100 {
    background-color: rgba(248, 113, 113, .12) !important;
}

.bg-yellow-100 {
    background-color: rgba(251, 191, 36, .12) !important;
}

.bg-canvas {
    background-color: #0b0e14 !important;
}

.border-slate-100 {
    border: 1px solid var(--border) !important;
}

.border-slate-200 {
    border-color: var(--border) !important;
}

.border-brand-200 {
    border-color: rgba(255, 179, 0, .35) !important;
}

.border-brand-300 {
    border-color: rgba(255, 179, 0, .45) !important;
}

.hover\:border-brand-200:hover {
    border-color: rgba(255, 179, 0, .55) !important;
}

.hover\:border-brand-400:hover {
    border-color: rgba(43, 255, 94, .75) !important;
}

.text-slate-900 {
    color: #f2f5f9 !important;
}

.text-slate-800 {
    color: #d7dee7 !important;
}

.text-slate-700 {
    color: #c2cad4 !important;
}

.text-slate-600 {
    color: #aab4c2 !important;
}

.text-slate-500 {
    color: #8f9aa9 !important;
}

.text-slate-400 {
    color: #717c8c !important;
}

.text-brand-500 {
    color: var(--brand) !important;
}

.text-brand-600 {
    color: var(--brand-bright) !important;
}

.text-brand-700 {
    color: var(--brand-bright) !important;
}

.text-brand-100 {
    color: #9df0b2 !important;
}

.hover\:text-brand-600:hover {
    color: var(--brand-bright) !important;
}

.hover\:text-brand-700:hover {
    color: var(--brand-bright) !important;
}

.text-green-600,
.text-green-700,
.text-green-800,
.text-green-900 {
    color: #86efac !important;
}

.text-red-600,
.text-red-800 {
    color: #fca5a5 !important;
}

.text-yellow-600,
.text-yellow-800 {
    color: #fde68a !important;
}

/* homepage cards: soft glow on hover */
.group {
    background-color: #0e1118;
    border-color: var(--border);
}

.group:hover {
    border-color: rgba(255, 179, 0, .4) !important;
    box-shadow: 0 22px 50px -22px rgba(255, 179, 0, .35) !important;
}

.shadow-lg {
    border: none !important;
    box-shadow: 0 16px 40px -20px rgba(0, 0, 0, .9) !important;
}

.shadow-xl {
    box-shadow: 0 20px 45px -20px rgba(0, 0, 0, .95) !important;
}

.hover\:shadow-xl:hover {
    box-shadow: 0 22px 50px -20px rgba(255, 179, 0, .28) !important;
}

.shadow-brand-100\/30,
.shadow-brand-200\/30,
.shadow-brand-200\/40,
.shadow-brand-200\/50 {
    --tw-shadow-color: rgba(255, 179, 0, .12) !important;
    --tw-shadow: var(--tw-shadow-colored) !important;
}

.hover\:shadow-brand-200\/40:hover {
    --tw-shadow-color: rgba(255, 179, 0, .3) !important;
    --tw-shadow: var(--tw-shadow-colored) !important;
}

.hover\:shadow-brand-500\/50:hover,
.shadow-brand-400\/40 {
    box-shadow: 0 22px 60px -18px rgba(255, 179, 0, .4) !important;
}

.shadow-glow {
    box-shadow: 0 40px 80px -32px rgba(255, 179, 0, .5) !important;
}

/* featured pricing card (gradient) */
.bg-\[radial-gradient\(circle_at_top\,_rgba\(255\,255\,255\,0\.45\)\,rgba\(255\,255\,255\,0\)\)\] {
    background-image: radial-gradient(circle at top, #3a2d0a, #1a1408) !important;
    background-color: #2a200a !important;
    color: #fff !important;
}

.from-brand-500 {
    --tw-gradient-from: #3a2d0a !important;
    --tw-gradient-to: rgb(15 61 28 / 0) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.to-brand-600 {
    --tw-gradient-to: #06180c !important;
}

.shadow-brand-500\/40 {
    background-image: radial-gradient(circle at top, #3a2d0a, #1a1408) !important;
    background-color: #2a200a !important;
    color: #fff !important;
    box-shadow: 0 24px 60px -18px rgba(255, 179, 0, .45) !important;
}

.space-y-5 > :not([hidden]) ~ :not([hidden]) {
    color: var(--text) !important;
}

/* ---------- Client dashboard SVG icons ---------- */

.widget-core {
    position: relative;
}

.dash-icon {
    position: absolute;
    inset: 0;
    width: 46px;
    height: 46px;
    margin: auto;
    fill: none;
    stroke: url(#goldGrad);
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 0 8px rgba(255, 179, 0, .55));
    transition: transform .3s ease, filter .3s ease;
}

.widtet:hover .dash-icon {
    transform: scale(1.12);
    filter: drop-shadow(0 0 14px rgba(255, 179, 0, .8));
}

/* ---------- Header SVG icons ---------- */

.head-icon {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    display: inline-block;
    vertical-align: -4px;
    transition: stroke .2s ease, filter .2s ease;
}

.navbar .btn.nav-link:hover .head-icon,
.toolbar .btn.nav-link:hover .head-icon {
    stroke: var(--brand);
    filter: drop-shadow(0 0 5px rgba(255, 179, 0, .6));
}

.btn-icon-left .head-icon {
    stroke: var(--cyan);
    width: 18px;
    height: 18px;
    vertical-align: -3px;
}

/* ---------- Gaming SVG icon system ---------- */

.game-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 18px;
    background: linear-gradient(150deg, rgba(255, 179, 0, .16), rgba(255, 179, 0, .04));
    border: 1px solid rgba(255, 179, 0, .3);
    box-shadow: 0 10px 30px -12px rgba(255, 179, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .06);
    margin-bottom: 18px;
    position: relative;
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}

.game-icon svg {
    width: 34px;
    height: 34px;
    fill: none;
    stroke: url(#goldGrad);
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter: drop-shadow(0 0 6px rgba(255, 179, 0, .55));
}

.group:hover .game-icon {
    transform: translateY(-4px) scale(1.06);
    border-color: rgba(255, 179, 0, .6);
    box-shadow: 0 16px 40px -14px rgba(255, 179, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* smaller variant for pricing cards / feature rows */
.game-icon-sm {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    margin-bottom: 14px;
}

.game-icon-sm svg {
    width: 24px;
    height: 24px;
}

/* feature checkmarks */
.game-check {
    display: inline-flex;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 179, 0, .14);
    border: 1px solid rgba(255, 179, 0, .45);
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.game-check svg {
    width: 10px;
    height: 10px;
    stroke: #ffd54a;
    stroke-width: 3;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ---------- Big text / CTA band ---------- */

.big-text {
    background-color: #070a10 !important;
    background-image:
        radial-gradient(500px 200px at 80% 10%, rgba(255, 179, 0, .16), transparent 70%),
        radial-gradient(400px 200px at 15% 90%, rgba(255, 179, 0, .08), transparent 70%);
    color: #fff !important;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    margin: 40px 0;
}

.big-text h2 {
    color: #fff !important;
}

.big-text p {
    color: var(--text-2) !important;
}

.big-text a {
    color: var(--brand-bright) !important;
}

/* ---------- Misc WHMCS components ---------- */

.widget-stat {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
}

.announcement-item {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
}

.notifications-but a {
    background-color: var(--surface-2) !important;
    border-right: 5px solid var(--brand) !important;
    border-radius: 15px 0 0 15px !important;
}

.notification-title {
    color: var(--text) !important;
}

.well {
    background-color: var(--surface-2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    color: var(--text);
}

.ticket-simple-reply {
    background-color: var(--surface) !important;
    border-color: var(--border) !important;
}

.ticket-simple-reply .ticket-reply {
    background-color: var(--surface-2) !important;
    border-color: var(--border) !important;
}

.client-quote,
.quote {
    background-color: var(--surface-2);
    border-color: var(--border);
    color: var(--text);
}

.promo-container .header,
.promo-container .header h3 {
    color: #f1f5f9;
}

.popover {
    background-color: var(--surface-2);
    border-color: var(--border);
}

.popover .popover-header {
    background-color: var(--surface-3);
    border-bottom-color: var(--border);
    color: var(--text);
}

.popover .popover-body {
    color: var(--text-2);
}

.popover .arrow::before,
.popover .arrow::after {
    border-color: var(--border) !important;
}

/* invoice / payment pages */
.invoice-summary,
.invoice-list {
    background-color: var(--surface) !important;
    border-color: var(--border) !important;
}

/* cart */
#order-standard_cart .cart-items {
    background-color: var(--surface);
    border-color: var(--border);
}

#order-standard_cart .cart-item {
    background-color: var(--surface-2);
    border-color: var(--border);
}

/* code / pre */
pre,
code {
    background-color: var(--surface-2);
    border: 1px solid var(--border-soft);
    color: var(--brand-bright);
    border-radius: 8px;
}

hr {
    border-top-color: var(--border);
}

/* whmcsco nav login/register buttons */
.navbar-nav-btn .btn-rounded {
    border-radius: 30px;
}

.navbar-nav-btn .btn-info {
    box-shadow: 0 8px 22px -10px rgba(34, 211, 238, .5);
}

/* hide social login buttons (Google etc.) */
.social-signin-btns,
.providerPreLinking,
.providerLinkingMessages,
#providerLinkingMessages,
.providerLinkingFeedback,
.providerLinkingFeedback-div,
.sub-heading {
    display: none !important;
}

/* ---------- Kill remaining white backgrounds ---------- */

/* client dashboard tiles */
.tiles .tile {
    background-color: var(--surface) !important;
    border: 1px solid var(--border);
    box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .8);
}

.tiles .tile:hover {
    background-color: var(--surface-2) !important;
    border-color: rgba(255, 179, 0, .4);
    box-shadow: 0 16px 40px -18px rgba(255, 179, 0, .3);
}

.tiles .tile .title,
.tiles .tile .stat,
.tiles .tile .description,
.tiles .tile .highlight {
    color: var(--text);
}

.tiles .tile .title {
    color: #f1f5f9;
}

.tiles .tile i {
    color: rgba(255, 179, 0, .55);
}

/* client home cards */
.client-home-cards .card-header {
    background-color: var(--surface) !important;
    color: var(--text);
}

.client-home-cards .card-header .btn {
    background-color: var(--surface-2);
    border-color: var(--border);
    color: var(--text);
}

/* domain search box on homepage */
.home-domain-search .input-group-wrapper {
    background-color: var(--surface) !important;
    border-color: var(--border);
}

.home-domain-search .input-group-wrapper .form-control {
    background-color: var(--surface) !important;
    color: var(--text);
}

.home-domain-search .input-group-wrapper .form-control::placeholder {
    color: var(--text-3);
}

/* promo / banners */
.promo-container {
    background-color: var(--surface);
    border: 1px solid var(--border);
}

.promo-banner {
    background-color: var(--surface) !important;
    border: 1px solid var(--border);
    color: var(--text);
}

.promo-banner .content {
    color: var(--text);
}

.promo-banner .content h1,
.promo-banner .content h2,
.promo-banner .content h3 {
    color: #f1f5f9;
}

/* featured TLD box */
.featured-tld {
    background-color: var(--surface) !important;
    border: 1px solid var(--border);
    box-shadow: 0 16px 40px -24px rgba(0, 0, 0, .9);
}

.featured-tld .featured-tld-header,
.featured-tld .featured-tld-price {
    color: var(--text);
}

.featured-tld .featured-tld-price {
    color: var(--brand-bright);
}

/* upgrade page products */
.upgrade .products .product {
    background-color: var(--surface) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius);
}

/* store domain tabs */
.store-order-container .store-domain-tabs li.active a {
    background-color: var(--surface) !important;
    color: var(--brand-bright);
}

.store-order-container .store-domain-tab-content {
    background-color: var(--surface);
    border: 1px solid var(--border);
}

/* product details tabs */
div.product-details-tab-container {
    background-color: var(--surface) !important;
    border-color: var(--border);
}

/* responsive tabs (mobile) */
.responsive-tabs-sm {
    background: var(--surface) !important;
    border-color: var(--border);
}

/* thumbnails / images */
.img-thumbnail {
    background-color: var(--surface-2);
    border-color: var(--border);
}

/* white buttons */
.btn-white,
.btn-white:focus,
.btn-white:hover {
    background-color: var(--surface-2) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

/* file upload / custom controls */
.custom-file-label {
    background-color: var(--surface-2);
    border-color: var(--border);
    color: var(--text);
}

.custom-file-label::after {
    background-color: var(--surface-3);
    border-left-color: var(--border);
    color: var(--text);
}

.custom-control-label::before {
    background-color: var(--surface-2);
    border-color: var(--border);
}

.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    background-color: var(--brand);
}

/* markdown editor / preview */
.md-editor > .md-preview,
.md-editor > textarea.markdown-editor {
    background-color: var(--surface-2) !important;
    border-color: var(--border) !important;
    color: var(--text);
}

.md-editor > .btn-toolbar {
    background-color: var(--surface) !important;
}

.markdown-content table,
.md-preview table {
    background-color: var(--surface);
}

/* phone input dropdown (intl-tel-input) */
.intl-tel-input .country-list {
    background-color: var(--surface) !important;
    border-color: var(--border);
}

.intl-tel-input .country-list .country:hover,
.intl-tel-input .country-list .country.highlight {
    background-color: var(--surface-3);
}

.intl-tel-input .country-list .country-name,
.intl-tel-input .country-list .dial-code {
    color: var(--text);
}

/* bootstrap-switch */
.bootstrap-switch {
    background-color: var(--surface-2) !important;
    border-color: var(--border) !important;
}

.bootstrap-switch .bootstrap-switch-label {
    background-color: var(--surface-3) !important;
    color: var(--text) !important;
}

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success {
    background-color: var(--brand) !important;
    color: #000 !important;
}

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
    background-color: var(--surface-3) !important;
    color: var(--text) !important;
}

/* lightbox */
.lb-outerContainer,
.lightboxOverlay,
.lb-dataContainer {
    background-color: var(--surface-2) !important;
}

/* captcha popup */
.captcha-overlay-popup {
    background-color: var(--surface) !important;
    border: 1px solid var(--border);
}

/* misc: table-list header / rows already handled above, plus json-form errors */
form[data-role="json-form"] .has-error input.form-control,
form[data-role="json-form"] .has-error select.form-control,
form[data-role="json-form"] .has-error textarea.form-control {
    background-color: var(--surface-2) !important;
    color: var(--text);
}

/* responsive-tabs-sm nav link hover */
.responsive-tabs-sm .nav-item a:hover {
    background: var(--surface-2) !important;
    color: var(--brand-bright);
}

/* ---------- FINAL SAFETY NET: any remaining white surface ---------- */

/* containers that must never stay white */
.primary-content,
#main-body,
.wrapper,
.outer-wrapper,
.inner-wrapper,
.section-body,
.panel,
.panel-default,
.panel-body,
.card,
.card-body,
.card-header,
.card-footer,
.well,
.jumbotron,
.white-box,
.content-padded,
.content-container,
.table,
.modal-content,
.modal-header,
.modal-body,
.modal-footer,
.dropdown-menu,
.list-group,
.list-group-item,
.page-link,
.input-group-text,
.form-control,
.custom-select,
.custom-file-label,
.popover,
.popover-header,
.popover-body,
.bg-white,
.bg-light,
.bg-grey,
.bg-gray,
.sidebar .card,
.tab-content,
.nav-tabs .nav-link,
.nav-tabs .nav-link.active,
.product-details-tab-container,
.store-domain-tab-content,
.tile,
.featured-tld,
.promo-banner,
.promo-container,
.md-editor,
.bootstrap-switch,
.intl-tel-input .country-list,
.lb-outerContainer,
.lb-dataContainer,
.lightboxOverlay,
.captcha-overlay-popup,
.home-domain-search .input-group-wrapper,
.client-home-cards .card-header,
.upgrade .products .product,
.responsive-tabs-sm {
    background-color: var(--surface) !important;
    border-color: var(--border) !important;
}

/* make sure text inside those containers is readable */
.primary-content,
#main-body,
.wrapper,
.outer-wrapper,
.inner-wrapper,
.panel-body,
.card-body,
.modal-body,
.dropdown-menu,
.list-group-item,
.popover-body,
.tab-content,
.content-padded,
.content-container,
.promo-banner .content,
.table td,
.table th,
.page-link,
.tile .title,
.tile .stat,
.featured-tld,
.product-details-tab-container {
    color: var(--text);
}

/* specific dark text colors that stay dark on dark surfaces */
.card-body p,
.card-text,
.panel-body p,
.modal-body p,
.form-text,
small,
.text-muted {
    color: var(--text-2) !important;
}

.card-title,
.panel-title,
.modal-title,
.card-header h3,
.card-header h4,
.card-header h5 {
    color: #f1f5f9 !important;
}

/* headings inside content areas */
.primary-content h1,
.primary-content h2,
.primary-content h3,
.primary-content h4,
.primary-content h5,
#main-body h1,
#main-body h2,
#main-body h3,
#main-body h4,
#main-body h5 {
    color: #f1f5f9 !important;
}

/* any element still carrying an inline white bg (WHMCS rarely does) */
[style*="background-color: #fff"],
[style*="background: #fff"],
[style*="background-color:#fff"],
[style*="background:#fff"],
[style*="background-color: rgb(255, 255, 255)"],
[style*="background-color: rgb(255 255 255)"] {
    background-color: var(--surface) !important;
}

/* ---------- Client area: tickets / products / domains lists ---------- */

/* the white wrapper around every list table */
.table-container,
.table-container.clearfix {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px;
    box-shadow: 0 18px 44px -26px rgba(0, 0, 0, .9);
}

.table-container h5,
.table-container p {
    color: var(--text-2);
}

.table-container h5.text-primary {
    color: #ffd54a !important;
}

/* table-list: header + rows */
table.table-list thead th {
    background-color: var(--surface-2) !important;
    color: #f1f5f9 !important;
    border-bottom: 2px solid rgba(255, 179, 0, .5) !important;
}

.table-list > tbody > tr > td,
table.table-list tbody td {
    background-color: var(--surface) !important;
    border: .4rem solid var(--surface-2) !important;
    color: var(--text);
}

.table-list > tbody > tr:hover > td,
table.table-list tbody tr:hover td {
    background-color: var(--surface-2) !important;
}

/* DataTables controls */
div.dataTables_wrapper div.dataTables_info {
    color: var(--text-2);
}

.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_length label {
    color: var(--text-2);
}

.dataTables_wrapper .dataTables_filter label .form-control {
    background-color: var(--surface-2);
    border-color: var(--border);
    color: var(--text);
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    background-color: var(--surface-2) !important;
    border-color: var(--border) !important;
    color: var(--text-2) !important;
    border-radius: 8px;
    margin: 0 2px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background-color: var(--brand) !important;
    border-color: var(--brand) !important;
    color: #1c1000 !important;
}

/* stats widgets on products page */
.widget-stat .card-body {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px;
    box-shadow: 0 14px 34px -22px rgba(0, 0, 0, .9);
}

.widget-stat .media .media-body p,
.widget-stat .media .media-body h4 {
    color: var(--text) !important;
}

.widget-stat .media .media-body h4 {
    color: #f1f5f9 !important;
}

/* soft badge circles */
.bgl-primary,
.bgl-success,
.bgl-warning,
.bgl-danger,
.bgl-secondary,
.bgl-info {
    background: rgba(255, 179, 0, .12) !important;
    border-color: rgba(255, 179, 0, .25) !important;
    color: var(--brand-bright) !important;
}

/* ticket number + subject links */
.ticket-number {
    color: var(--brand-bright);
    font-weight: 700;
}

.ticket-subject {
    color: var(--text);
}

.ticket-subject:hover,
.ticket-subject.unread {
    color: #f1f5f9;
}

/* domain / service table links */
.table-list td a,
.table-list td strong {
    color: var(--text);
}

.table-list td a:hover {
    color: var(--brand-bright);
}

/* bulk action buttons */
.btn-group .btn-default.setBulkAction {
    color: var(--text);
}

/* ---------- Ticket detail page ---------- */

/* each reply bubble */
.ticket-replies .reply {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    color: var(--text);
    box-shadow: 0 14px 34px -24px rgba(0, 0, 0, .9);
}

.ticket-replies .replies-user-info {
    background-color: var(--surface-2) !important;
    border-color: var(--border) !important;
    color: var(--text);
}

.ticket-replies .replies-user-info .replies-user-image {
    border-color: var(--border) !important;
}

.ticket-replies .reply .message-content,
.ticket-replies .reply p {
    color: var(--text);
}

/* ticket info block on detail page */
.ticket-info-block,
.ticket-info-block .ticket-info-item {
    color: var(--text);
}

/* attachment / custom-file areas inside ticket page */
.attachment-group .custom-file-label {
    background-color: var(--surface-2);
    border-color: var(--border);
    color: var(--text);
}

/* ---------- Product details page ---------- */

div.product-details-tab-container {
    background-color: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px;
}

div.product-details .tab-content,
div.product-details .tab-pane {
    background-color: var(--surface) !important;
    color: var(--text);
}

/* detail rows (label / value pairs) */
div.product-details .form-group .col-form-label {
    color: var(--text-2);
}

/* status labels inside detail pages */
.label.status {
    border-radius: 8px;
}

/* info panels */
.clientareaproductdetails .panel,
.clientareadomaindetails .panel,
.viewticket .panel {
    background-color: var(--surface);
    border: 1px solid var(--border);
}

/* ---------- Client-area gold SVG icons ---------- */

/* widget-stat stat cards (products / invoices) */
.widget-stat .media.ai-icon i[class*='fa-server'] {
    font-size: 0 !important;
    width: 34px !important; height: 34px !important;
    display: inline-block !important;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%226%22%20rx%3D%221.5%22/%3E%3Crect%20x%3D%223%22%20y%3D%2214%22%20width%3D%2218%22%20height%3D%226%22%20rx%3D%221.5%22/%3E%3Ccircle%20cx%3D%226.5%22%20cy%3D%227%22%20r%3D%22.7%22%20fill%3D%22%23ffd54a%22%20stroke%3D%22none%22/%3E%3Ccircle%20cx%3D%226.5%22%20cy%3D%2217%22%20r%3D%22.7%22%20fill%3D%22%23ffd54a%22%20stroke%3D%22none%22/%3E%3Cpath%20d%3D%22M10%207h8M10%2017h8%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 7px rgba(255,179,0,.55));
}
.widget-stat .media.ai-icon i[class*='fa-hdd'] {
    font-size: 0 !important;
    width: 34px !important; height: 34px !important;
    display: inline-block !important;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%228.5%22%20width%3D%2218%22%20height%3D%229%22%20rx%3D%222%22/%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2213%22%20r%3D%22.8%22%20fill%3D%22%23ffd54a%22%20stroke%3D%22none%22/%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2213%22%20r%3D%22.8%22%20fill%3D%22%23ffd54a%22%20stroke%3D%22none%22/%3E%3Cpath%20d%3D%22M15.5%2013h3.5M5%2017.5h10%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 7px rgba(255,179,0,.55));
}
.widget-stat .media.ai-icon i[class*='fa-ban'] {
    font-size: 0 !important;
    width: 34px !important; height: 34px !important;
    display: inline-block !important;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228.5%22/%3E%3Cpath%20d%3D%22M5.5%205.5l13%2013%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 7px rgba(255,179,0,.55));
}

/* product details big status icon */
.product-icon .fa-stack {
    width: 92px !important; height: 92px !important;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22/%3E%3Crect%20x%3D%226.5%22%20y%3D%228.5%22%20width%3D%2211%22%20height%3D%227%22%20rx%3D%221.5%22/%3E%3Ccircle%20cx%3D%229.5%22%20cy%3D%2212%22%20r%3D%22.8%22%20fill%3D%22%23ffd54a%22%20stroke%3D%22none%22/%3E%3Cpath%20d%3D%22M12.5%2012h3.5%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 18px rgba(255,179,0,.45));
}
.product-icon .fa-stack i { display: none !important; }

/* domain details addons icons */
i.fas.fa-shield-alt.fa-3x {
    font-size: 0 !important;
    width: 56px !important; height: 56px !important;
    display: inline-block !important;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l7%202.8v5.4c0%204.4-3%208.4-7%209.8-4-1.4-7-5.4-7-9.8V5.8z%22/%3E%3Cpath%20d%3D%22M9%2012l2.2%202.2L15.5%209.8%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 8px rgba(255,179,0,.5));
}
i.fas.fa-cloud.fa-3x {
    font-size: 0 !important;
    width: 56px !important; height: 56px !important;
    display: inline-block !important;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6.5%2018.5h11.5a3.5%203.5%200%200%200%20.6-6.95%205.5%205.5%200%200%200-10.6%201.1A3.2%203.2%200%200%200%206.5%2018.5z%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 8px rgba(255,179,0,.5));
}
i.fas.fa-envelope.fa-3x {
    font-size: 0 !important;
    width: 56px !important; height: 56px !important;
    display: inline-block !important;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225.5%22%20width%3D%2218%22%20height%3D%2213%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M4%207.5l8%205.5%208-5.5%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 8px rgba(255,179,0,.5));
}
i.fas.fa-envelope.fa-3x + i.fas.fa-share { display: none !important; }

/* ticket department cards (submit ticket step 1) */
.apadana-support-departments,
.apadana-support-departments.card,
.apadana-support-departments .card-body {
    background: #0a0d13 !important;
    color: #dde4ec !important;
    border-color: #212834 !important;
}

.apadana-department-card,
.apadana-department-card.depa {
    background: #111722 !important;
    color: #dde4ec !important;
    border: 1px solid #303a4a !important;
}

.apadana-department-card:hover,
.apadana-department-card.depa:hover {
    background: #1a2433 !important;
    color: #ffffff !important;
    border-color: #ffb300 !important;
}

.apadana-department-card h6,
.apadana-department-card strong,
.apadana-department-card p,
.apadana-department-card div {
    color: #dde4ec !important;
}

.apadana-department-card a,
.apadana-department-card a:visited {
    color: #ffd54a !important;
}

.apadana-department-card a:hover {
    color: #ffffff !important;
}

.apadana-support-departments .card-title {
    color: #f1f5f9 !important;
}

.apadana-support-departments .text-muted {
    color: #9aa5b5 !important;
}
.depa {
    background: linear-gradient(135deg, #0b0f16 0%, #141b28 100%) !important;
    border: 1px solid rgba(255, 179, 0, .28);
    color: var(--text) !important;
    box-shadow: 0 12px 30px -20px rgba(0, 0, 0, .95), inset 0 1px 0 rgba(255, 179, 0, .06);
    transition: background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
}

.depa:hover {
    background: linear-gradient(135deg, #111722 0%, #1a2433 100%) !important;
    border-color: rgba(255, 179, 0, .58);
    color: var(--text) !important;
    box-shadow: 0 16px 38px -20px rgba(255, 179, 0, .32), inset 0 1px 0 rgba(255, 179, 0, .1);
    transform: translateY(-2px);
}

.depa h6,
.depa strong,
.depa p {
    color: var(--text) !important;
}

.depa a {
    color: var(--brand-bright) !important;
}

.depa a:hover {
    color: #fff !important;
}

.depa .fad {
    color: var(--brand) !important;
}

.depa i.fad.fa-comments-alt {
    font-size: 0 !important;
    width: 26px !important; height: 26px !important;
    display: inline-block !important; vertical-align: middle;
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffd54a%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%205.5h16v11H9l-4.5%203.5z%22/%3E%3Cpath%20d%3D%22M8%2010h8M8%2013h5%22/%3E%3C/svg%3E") center / contain no-repeat !important;
    filter: drop-shadow(0 0 6px rgba(255,179,0,.5));
}

/* ---------- Ticket detail page — NEON GOLD ---------- */

/* info block (was white #f9f9f9) -> dark neon card */
.ticket-des {
    background: linear-gradient(135deg, #0b0f16 0%, #141b28 100%) !important;
    border: 1px solid rgba(255, 179, 0, .3) !important;
    border-radius: 15px !important;
    color: #aeb8c4 !important;
    font-size: 14px;
    line-height: 2.2;
    box-shadow: inset 0 1px 0 rgba(255, 179, 0, .08), 0 14px 34px -22px rgba(0, 0, 0, .95);
    position: relative;
}

.ticket-des strong {
    color: #ffd54a;
    font-weight: 600;
}

.ticket-tit {
    color: #ffb300 !important;
    text-shadow: 0 0 20px rgba(255, 179, 0, .4);
}

/* neon status pills */
.ticket-status-label {
    display: inline-block;
    padding: 2px 16px;
    margin-right: 4px;
    border-radius: 20px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .3px;
    border: 1px solid;
    vertical-align: middle;
}

.ticket-status-label.status-default {
    color: #ffd54a;
    border-color: rgba(255, 179, 0, .55);
    background: rgba(255, 179, 0, .12);
    box-shadow: 0 0 14px rgba(255, 179, 0, .3);
}

.ticket-status-label.status-closed {
    color: #ff5c6c;
    border-color: rgba(255, 92, 108, .6);
    background: rgba(255, 92, 108, .13);
    box-shadow: 0 0 16px rgba(255, 92, 108, .4);
}

.ticket-status-label.status-answered {
    color: #ffd54a;
    border-color: rgba(255, 213, 74, .6);
    background: rgba(255, 213, 74, .13);
    box-shadow: 0 0 16px rgba(255, 213, 74, .4);
}

.ticket-status-label.status-open {
    color: #4da3ff;
    border-color: rgba(77, 163, 255, .6);
    background: rgba(77, 163, 255, .13);
    box-shadow: 0 0 16px rgba(77, 163, 255, .4);
}

.ticket-status-label.status-pending {
    color: #ffa657;
    border-color: rgba(255, 166, 87, .6);
    background: rgba(255, 166, 87, .13);
    box-shadow: 0 0 16px rgba(255, 166, 87, .4);
}

.ticket-status-label.status-customer-reply {
    color: #35e0c2;
    border-color: rgba(53, 224, 194, .6);
    background: rgba(53, 224, 194, .13);
    box-shadow: 0 0 16px rgba(53, 224, 194, .4);
}

.ticket-status-label.status-in-progress {
    color: #c07bff;
    border-color: rgba(192, 123, 255, .6);
    background: rgba(192, 123, 255, .13);
    box-shadow: 0 0 16px rgba(192, 123, 255, .4);
}

.ticket-status-label.status-on-hold {
    color: #ff8a3d;
    border-color: rgba(255, 138, 61, .6);
    background: rgba(255, 138, 61, .13);
    box-shadow: 0 0 16px rgba(255, 138, 61, .4);
}

/* reply bubbles — neon accents */
.ticket-replies .reply {
    border-color: rgba(255, 179, 0, .18) !important;
}

.ticket-replies .replies-admin {
    border-color: rgba(255, 179, 0, .38) !important;
    box-shadow: 0 0 24px -10px rgba(255, 179, 0, .25), 0 14px 34px -24px rgba(0, 0, 0, .9) !important;
}

.ticket-replies .replies-user-info .replies-user-image {
    border-color: rgba(255, 179, 0, .45) !important;
}

/* ---------- Add Funds page — defensive dark table ---------- */

.card > .table,
.card .table-striped {
    background-color: var(--surface) !important;
    color: var(--text) !important;
}

.card .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, .03) !important;
}

.card .table-striped tbody tr:nth-of-type(even) {
    background-color: transparent !important;
}

.card .table-striped td,
.card .table-striped th {
    color: var(--text) !important;
    border-top-color: var(--border-soft) !important;
}

.card .table-striped td strong {
    color: var(--brand-bright) !important;
}

/* ---------- Submit Ticket button — neon gold ---------- */

.btn-ticket {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #ffb300 0%, #e0a100 100%) !important;
    border: 1px solid rgba(255, 213, 74, .55) !important;
    color: #1a1200 !important;
    font-weight: 700;
    box-shadow: 0 6px 20px -6px rgba(255, 179, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .35);
    transition: all .3s ease;
}

.btn-ticket:hover,
.btn-ticket:focus {
    background: linear-gradient(135deg, #ffd54a 0%, #ffb300 100%) !important;
    color: #14100a !important;
    border-color: rgba(255, 213, 74, .8) !important;
    box-shadow: 0 8px 28px -6px rgba(255, 179, 0, .8), 0 0 20px rgba(255, 179, 0, .4);
    transform: translateY(-2px);
}

.btn-ticket .text-ticket {
    color: inherit;
}

.btn-ticket .head-icon {
    stroke: currentColor;
    filter: drop-shadow(0 0 4px rgba(0, 0, 0, .35));
}

/* shine sweep on hover */
.btn-ticket::after {
    content: "";
    position: absolute;
    top: 0;
    left: -60%;
    width: 40%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent);
    transform: skewX(-20deg);
    transition: left .55s ease;
    pointer-events: none;
}

.btn-ticket:hover::after {
    left: 130%;
}

/* ---------- Ticket icon — force dark (beat cyan rule) ---------- */

.btn-ticket .btn-icon-left .head-icon,
.btn-ticket .text-ticket .head-icon {
    stroke: #1a1200 !important;
    filter: drop-shadow(0 0 4px rgba(0, 0, 0, .4));
}

/* ---------- Add Funds — extra hard override ---------- */

body.primary-bg-color .card > .table,
body.primary-bg-color .card > .table-striped,
body.primary-bg-color .card > .table-striped tbody,
body.primary-bg-color .card > .table-striped tbody tr,
body.primary-bg-color .card > .table-striped td,
body.primary-bg-color .card > .table-striped th {
    background-color: #0d1017 !important;
    color: #dde4ec !important;
}

/* ---------- Header submit-ticket button — gold via CSS only ----------
   Works even if header.tpl still uses the old btn-info / text-info classes */
.navbar-nav-btn a[href*="submitticket.php"],
.navbar-nav-btn a[href*="submitticket.php"].btn-info {
    background: linear-gradient(135deg, #ffb300 0%, #e0a100 100%) !important;
    border: 1px solid rgba(255, 213, 74, .55) !important;
    color: #1a1200 !important;
    font-weight: 700;
    box-shadow: 0 6px 20px -6px rgba(255, 179, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .35);
    transition: all .3s ease;
}

.navbar-nav-btn a[href*="submitticket.php"]:hover,
.navbar-nav-btn a[href*="submitticket.php"].btn-info:hover {
    background: linear-gradient(135deg, #ffd54a 0%, #ffb300 100%) !important;
    color: #14100a !important;
    border-color: rgba(255, 213, 74, .8) !important;
    box-shadow: 0 8px 28px -6px rgba(255, 179, 0, .8), 0 0 20px rgba(255, 179, 0, .4);
    transform: translateY(-2px);
}

/* icon — force dark, never turquoise */
.navbar-nav-btn a[href*="submitticket.php"] .head-icon,
.navbar-nav-btn a[href*="submitticket.php"] .btn-icon-left .head-icon,
.navbar-nav-btn a[href*="submitticket.php"] .text-info .head-icon,
.navbar-nav-btn a[href*="submitticket.php"] .text-ticket .head-icon {
    stroke: #1a1200 !important;
    fill: none !important;
    filter: drop-shadow(0 0 4px rgba(0, 0, 0, .4));
}

/* shine sweep */
.navbar-nav-btn a[href*="submitticket.php"] {
    position: relative;
    overflow: hidden;
}

.navbar-nav-btn a[href*="submitticket.php"]::after {
    content: "";
    position: absolute;
    top: 0;
    left: -60%;
    width: 40%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .5), transparent);
    transform: skewX(-20deg);
    transition: left .55s ease;
    pointer-events: none;
}

.navbar-nav-btn a[href*="submitticket.php"]:hover::after {
    left: 130%;
}

/* ---------- Service status — dark + neon ---------- */

/* status label pills in tables (products / invoices / tickets) */
.label.status {
    border: 1px solid transparent;
    font-weight: 600;
    padding: 5px 12px;
}

.label.status.status-pending,
.label.status.status-transfer {
    background-color: #3a1c12 !important;
    color: #ff9d5c !important;
    border-color: rgba(255, 157, 92, .35);
}

.label.status.status-active,
.label.status.status-completed,
.label.status.status-open,
.label.status.status-paid {
    background-color: #12271a !important;
    color: #35e07a !important;
    border-color: rgba(53, 224, 122, .35);
}

.label.status.status-answered {
    background-color: #221433 !important;
    color: #c07bff !important;
    border-color: rgba(192, 123, 255, .35);
}

.label.status.status-closed,
.label.status.status-suspended,
.label.status.status-terminated {
    background-color: #1b2029 !important;
    color: #9aa5b5 !important;
    border-color: rgba(154, 165, 181, .3);
}

.label.status.status-fraud {
    background-color: #2a0f14 !important;
    color: #ff5c6c !important;
    border-color: rgba(255, 92, 108, .35);
}

.label.status.status-expired,
.label.status.status-transferred {
    background-color: #0f2430 !important;
    color: #4dd4ff !important;
    border-color: rgba(77, 212, 255, .35);
}

.label.status.status-onhold {
    background-color: #12202f !important;
    color: #6fb6ff !important;
    border-color: rgba(111, 182, 255, .35);
}

.label.status.status-inprogress,
.label.status.status-customer-reply {
    background-color: #33171c !important;
    color: #ff7d8d !important;
    border-color: rgba(255, 125, 141, .35);
}

/* product details status banner — black + gold */
.product-status,
.product-status-pending,
.product-status-active,
.product-status-suspended,
.product-status-cancelled,
.product-status-terminated,
.product-status-fraud {
    background-color: #0b0f16 !important;
    border: 1px solid rgba(255, 179, 0, .3) !important;
    border-top: 2px solid rgba(255, 179, 0, .6) !important;
    border-radius: 16px !important;
    box-shadow: 0 16px 36px -24px rgba(0, 0, 0, .95);
    padding: 22px 16px 18px;
}

.product-status-text {
    color: #ffd54a !important;
    background: rgba(255, 179, 0, .12);
    border: 1px solid rgba(255, 179, 0, .45);
    border-radius: 22px;
    display: inline-block;
    padding: 4px 22px;
    text-shadow: 0 0 10px rgba(255, 179, 0, .4);
    text-transform: none;
}

/* ---------- Services page — right-side icons dark + gold ---------- */

/* SSL status icons in the services table (white PNGs -> dark gold circle) */
.table-list td img[src*="ssl/"],
.table-list td .ssl-info img {
    background-color: #12161f !important;
    border: 1px solid rgba(255, 179, 0, .5) !important;
    border-radius: 50% !important;
    padding: 3px !important;
    width: 26px !important;
    height: 26px !important;
    object-fit: contain;
    box-shadow: 0 0 10px rgba(255, 179, 0, .3);
}



/* sidebar menu icons — gold neon (was bright blue #0074ff) */
.sidebar .sidebar-menu-item-icon-wrapper {
    color: #ffd54a !important;
    filter: drop-shadow(0 0 6px rgba(255, 179, 0, .45));
    transition: color .2s ease, filter .2s ease;
}

.sidebar .sidebar-menu-item:hover .sidebar-menu-item-icon-wrapper {
    color: #ffd54a !important;
    filter: drop-shadow(0 0 10px rgba(255, 179, 0, .8));
}

/* ===== Gold SVG shields — replaces WHMCS PNG status icons ===== */
.table-list td img[src*="ssl-active.png"] { content: url("/assets/img/ssl/ssl-active.svg") !important; filter: none !important; }
.table-list td img[src*="ssl-inactive-domain"] { content: url("/assets/img/ssl/ssl-inactive-domain.svg") !important; filter: none !important; }
.table-list td img[src*="ssl-inactive.png"] { content: url("/assets/img/ssl/ssl-inactive.svg") !important; filter: none !important; }
.table-list td img[src*="ssl-unknown"] { content: url("/assets/img/ssl/ssl-unknown.svg") !important; filter: none !important; }