/* ==========================================================================
   Virtualized Modern: client area theme (child of twenty-one)
   Colours and type match virtualized.gg.
   ========================================================================== */

:root {
    --vz-bg: #131119;
    --vz-panel: #1C1924;
    --vz-card: #24202C;
    --vz-card-2: #2B2735;
    --vz-raise: #302B3B;
    --vz-border: #403B4E;
    --vz-border-soft: #352F41;
    --vz-border-hover: #726191;
    --vz-primary: #732DEC;
    --vz-primary-hover: #6423d6;
    --vz-primary-border: #8a50ef;
    --vz-accent: #BB98F6;
    --vz-accent-hover: #d0bcfc;
    --vz-text: #EEEEEE;
    --vz-text-2: #D7D5DD;
    --vz-text-3: #BBBBBB;
    --vz-muted: #8B8B8B;
    --vz-muted-2: #6B6478;
    --vz-green: #34d399;
    --vz-amber: #fbbf24;
    --vz-red: #f87171;
    --vz-blue: #60a5fa;
    --vz-radius: 12px;
    --vz-radius-sm: 8px;
    --vz-sidebar-w: 264px;
    --vz-topbar-h: 68px;
    --vz-font: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
body.vz,
body.vz.primary-bg-color {
    background: var(--vz-bg);
    color: var(--vz-text-2);
    font-family: var(--vz-font);
    font-size: 15px;
    -webkit-font-smoothing: antialiased;
}
body.vz .tooltip, body.vz .popover, body.vz input, body.vz select, body.vz textarea, body.vz button { font-family: var(--vz-font); }
body.vz ::selection { background: var(--vz-primary); color: #fff; }
body.vz a { color: var(--vz-accent); transition: color .15s ease; }
body.vz a:hover, body.vz a:focus { color: var(--vz-accent-hover); text-decoration: none; }
body.vz h1, body.vz h2, body.vz h3, body.vz h4, body.vz h5, body.vz h6,
body.vz .h1, body.vz .h2, body.vz .h3, body.vz .h4, body.vz .h5, body.vz .h6 { color: var(--vz-text); font-weight: 700; letter-spacing: -0.01em; }
body.vz hr { border-color: var(--vz-border-soft); }
body.vz .text-muted, body.vz small.text-muted { color: var(--vz-muted) !important; }
body.vz .text-dark, body.vz .text-body { color: var(--vz-text-2) !important; }
body.vz .bg-white, body.vz .bg-light { background: var(--vz-card) !important; }
body.vz .border, body.vz .border-top, body.vz .border-bottom { border-color: var(--vz-border-soft) !important; }
body.vz code { color: var(--vz-accent); background: var(--vz-card-2); padding: .1em .35em; border-radius: 4px; }
body.vz pre { color: var(--vz-text-2); background: var(--vz-panel); border: 1px solid var(--vz-border-soft); border-radius: var(--vz-radius-sm); padding: 12px; }
body.vz :focus-visible { outline: 2px solid var(--vz-primary-border); outline-offset: 2px; }

/* ---------- App shell ---------- */
.vz-shell { min-height: 100vh; }

.vz-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--vz-sidebar-w);
    background: var(--vz-panel);
    border-right: 1px solid var(--vz-border-soft);
    display: flex;
    flex-direction: column;
    z-index: 1040;
}
.vz-sidebar-head {
    height: var(--vz-topbar-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 18px 0 22px;
    border-bottom: 1px solid var(--vz-border-soft);
    flex-shrink: 0;
}
.vz-brand img { height: 22px; width: auto; display: block; }
.vz-icon-btn.vz-sidebar-close { display: none; }
.vz-sidebar-scroll { flex: 1; overflow-y: auto; padding: 14px 12px; scrollbar-width: thin; scrollbar-color: var(--vz-border) transparent; }
.vz-sidebar-foot { border-top: 1px solid var(--vz-border-soft); padding: 12px; flex-shrink: 0; }

.vz-main {
    margin-left: var(--vz-sidebar-w);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.vz-backdrop { display: none; }

/* ---------- Sidebar navigation ---------- */
.vz-nav { display: flex; flex-direction: column; gap: 2px; }
.vz-nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 10px 12px;
    border: 0;
    border-radius: var(--vz-radius-sm);
    background: transparent;
    color: var(--vz-text-2) !important;
    font-size: 14.5px;
    font-weight: 500;
    text-align: left;
    line-height: 1.2;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.vz-nav-link:hover, .vz-nav-link:focus-visible { background: var(--vz-card-2); color: var(--vz-text) !important; }
.vz-nav-icon { color: var(--vz-muted); font-size: 15px; width: 18px; text-align: center; transition: color .15s ease; }
.vz-nav-link:hover .vz-nav-icon { color: var(--vz-accent); }
.vz-nav-label { flex: 1; }
.vz-caret { font-size: 10px; color: var(--vz-muted-2); transition: transform .2s ease; }
.vz-nav-group.is-open > .vz-nav-link .vz-caret { transform: rotate(180deg); }
.vz-nav-link.is-active,
.vz-nav-group.has-active > .vz-nav-link { color: var(--vz-text) !important; }
.vz-nav-link.is-active { background: rgba(115, 45, 236, .16); box-shadow: inset 3px 0 0 var(--vz-primary-border); }
.vz-nav-link.is-active .vz-nav-icon,
.vz-nav-group.has-active > .vz-nav-link .vz-nav-icon { color: var(--vz-accent); }

.vz-subnav {
    display: none;
    flex-direction: column;
    gap: 1px;
    margin: 2px 0 6px 21px;
    padding-left: 12px;
    border-left: 1px solid var(--vz-border-soft);
}
.vz-nav-group.is-open > .vz-subnav { display: flex; }
.vz-subnav-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 6px;
    color: var(--vz-text-3) !important;
    font-size: 14px;
    transition: background .15s ease, color .15s ease;
}
.vz-subnav-link:hover { background: var(--vz-card-2); color: var(--vz-text) !important; }
.vz-subnav-link.is-active { color: var(--vz-text) !important; background: rgba(115, 45, 236, .16); }
.vz-subnav-divider { height: 1px; background: var(--vz-border-soft); margin: 4px 10px; }
.vz-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(187, 152, 246, .16);
    color: var(--vz-accent);
    font-size: 11.5px;
    font-weight: 700;
}

/* Account card at the bottom of the sidebar; its menu opens upwards. */
.vz-account { position: relative; }
.vz-account-card {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px;
    border: 1px solid var(--vz-border-soft);
    border-radius: var(--vz-radius-sm);
    background: var(--vz-card);
    color: var(--vz-text-2);
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease;
}
.vz-account-card:hover { border-color: var(--vz-border-hover); }
.vz-avatar {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--vz-primary), #a07af0);
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .02em;
}
.vz-account-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.vz-account-name, .vz-account-email { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vz-account-name { color: var(--vz-text); font-weight: 600; font-size: 14px; }
.vz-account-email { color: var(--vz-muted); font-size: 12.5px; }
.vz-account .vz-caret { transform: rotate(180deg); }
.vz-account.is-open .vz-caret { transform: none; }
.vz-subnav-up {
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% + 8px);
    margin: 0;
    padding: 6px;
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius-sm);
    background: var(--vz-card);
    box-shadow: 0 -12px 32px rgba(0, 0, 0, .45);
}
.vz-subnav-up .vz-subnav-link i { color: var(--vz-muted); margin-right: 4px; }
.vz-guest-actions { display: grid; gap: 8px; }
.vz-guest-actions .btn-block + .btn-block { margin-top: 0; }

/* ---------- Top bar ---------- */
.vz-topbar {
    position: sticky;
    top: 0;
    z-index: 1020;
    min-height: var(--vz-topbar-h);
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 32px;
    background: rgba(19, 17, 25, .82);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--vz-border-soft);
}
.vz-icon-btn.vz-menu-btn { display: none; }
.vz-topbar-title { flex: 1; min-width: 0; }
.vz-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 12.5px; margin-bottom: 1px; }
.vz-crumbs a { color: var(--vz-muted) !important; }
.vz-crumbs a:hover { color: var(--vz-accent) !important; }
.vz-crumbs i { font-size: 8px; color: var(--vz-muted-2); }
body.vz .vz-page-title { font-size: 21px; font-weight: 700; margin: 0; color: var(--vz-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vz-topbar-actions { display: flex; align-items: center; gap: 8px; }

.vz-icon-btn {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid var(--vz-border-soft);
    background: var(--vz-card);
    color: var(--vz-text-2) !important;
    font-size: 16px;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.vz-icon-btn:hover, .vz-icon-btn:focus-visible { border-color: var(--vz-border-hover); color: var(--vz-text) !important; background: var(--vz-card-2); }
.vz-dot {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--vz-primary);
    border: 2px solid var(--vz-bg);
    color: #fff;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
}
.vz-dot-empty { display: none; }

.vz-search { position: relative; margin-right: 4px; }
.vz-search i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--vz-muted); font-size: 13px; pointer-events: none; }
.vz-search input {
    width: 240px;
    height: 40px;
    padding: 0 14px 0 36px;
    border-radius: 10px;
    border: 1px solid var(--vz-border-soft);
    background: var(--vz-card);
    color: var(--vz-text);
    font-size: 14px;
    transition: border-color .15s ease, width .2s ease;
}
.vz-search input::placeholder { color: var(--vz-muted-2); }
.vz-search input:focus { outline: 0; border-color: var(--vz-primary-border); width: 300px; }
.vz-admin-return { margin-left: 4px; }

/* ---------- Content area ---------- */
body.vz #main-body.vz-content { flex: 1; padding: 28px 32px 40px; margin: 0; background: transparent; }
.vz-main { overflow-x: clip; }
.vz-page { max-width: 1320px; margin: 0 auto; }
.vz-page-rail { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
.vz-page-rail .vz-rail { order: 2; position: sticky; top: calc(var(--vz-topbar-h) + 24px); }
.vz-page-rail .vz-page-main { order: 1; min-width: 0; }
.vz-page-cart { max-width: 1400px; }

.vz-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 24px;
    padding: 20px 32px;
    border-top: 1px solid var(--vz-border-soft);
    color: var(--vz-muted);
    font-size: 13px;
}
.vz-footer-links { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; }
.vz-footer-links a, .vz-link-btn { color: var(--vz-muted) !important; }
.vz-footer-links a:hover, .vz-link-btn:hover { color: var(--vz-accent) !important; }
.vz-link-btn { background: none; border: 0; padding: 0; font-size: 13px; cursor: pointer; }

/* ---------- Responsive: drawer below 992px ---------- */
@media (max-width: 1279.98px) {
    .vz-page-rail { grid-template-columns: minmax(0, 1fr); }
    .vz-page-rail .vz-rail { order: 2; position: static; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 16px; }
    .vz-page-rail .vz-rail > .sidebar { display: contents; }
}
@media (max-width: 991.98px) {
    .vz-sidebar {
        width: min(86vw, 300px);
        transform: translateX(-100%);
        transition: transform .25s ease;
        box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    }
    body.vz-nav-open .vz-sidebar { transform: none; box-shadow: 24px 0 48px rgba(0, 0, 0, .5); }
    .vz-icon-btn.vz-sidebar-close { display: inline-grid; }
    .vz-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1030;
        background: rgba(8, 7, 12, .6);
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        opacity: 0;
        pointer-events: none;
        transition: opacity .25s ease;
    }
    body.vz-nav-open .vz-backdrop { opacity: 1; pointer-events: auto; }
    body.vz-nav-open { overflow: hidden; }
    .vz-main { margin-left: 0; }
    .vz-icon-btn.vz-menu-btn { display: inline-grid; }
    .vz-topbar { padding: 10px 16px; gap: 10px; }
    .vz-search { display: none; }
    body.vz #main-body.vz-content { padding: 20px 16px 32px; }
    .vz-footer { padding: 18px 16px; }
}
@media (max-width: 575.98px) {
    body.vz .vz-page-title { font-size: 18px; }
    .vz-crumbs { display: none; }
}

/* ---------- Auth layout (login, register, password reset) ---------- */
.vz-auth {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 48px 16px 24px;
    background:
        radial-gradient(700px 360px at 50% -80px, rgba(115, 45, 236, .28), transparent 70%),
        var(--vz-bg);
}
.vz-auth-logo img { height: 28px; width: auto; display: block; margin: 8px auto 32px; }
.vz-auth-body { width: 100%; max-width: 460px; }
.vz-tpl-clientregister .vz-auth-body { max-width: 900px; }
.vz-auth-foot { margin-top: auto; padding-top: 32px; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; color: var(--vz-muted); font-size: 13px; }
.vz-auth-foot a { color: var(--vz-muted) !important; }
.vz-auth-foot a:hover { color: var(--vz-accent) !important; }
.vz-auth .login-form .card, .vz-auth .card { box-shadow: 0 24px 64px rgba(0, 0, 0, .45); }
.vz-auth .card-body { padding: 28px; }

/* ==========================================================================
   Bootstrap components
   ========================================================================== */

/* Cards */
body.vz .card,
body.vz .panel {
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius);
    color: var(--vz-text-2);
    box-shadow: none;
}
body.vz .card-header, body.vz .panel-heading {
    background: transparent;
    border-bottom: 1px solid var(--vz-border-soft);
    color: var(--vz-text);
    padding: 14px 18px;
}
body.vz .card-header:first-child { border-radius: calc(var(--vz-radius) - 1px) calc(var(--vz-radius) - 1px) 0 0; }
body.vz .card-title, body.vz .panel-title { color: var(--vz-text); font-weight: 600; font-size: 15.5px; }
body.vz .card-body, body.vz .panel-body { padding: 18px; }
body.vz .card-footer, body.vz .panel-footer { background: var(--vz-card-2); border-top: 1px solid var(--vz-border-soft); color: var(--vz-text-3); }
body.vz .card-footer:last-child { border-radius: 0 0 calc(var(--vz-radius) - 1px) calc(var(--vz-radius) - 1px); }
body.vz .card .card { background: var(--vz-card-2); }
body.vz .card-text { color: var(--vz-text-2); }

/* Tables */
body.vz .table { color: var(--vz-text-2); margin-bottom: 0; }
body.vz .table th, body.vz .table td { border-color: var(--vz-border-soft); vertical-align: middle; }
body.vz .table thead th {
    border-bottom: 1px solid var(--vz-border);
    border-top: 0;
    color: var(--vz-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    background: transparent;
}
body.vz .table-striped tbody tr:nth-of-type(odd) { background: rgba(255, 255, 255, .015); }
body.vz .table-hover tbody tr:hover,
body.vz .table-list tbody tr:hover { background: var(--vz-card-2); color: var(--vz-text); }
body.vz .table-container,
body.vz .table-container .dataTables_wrapper {
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius);
    padding: 6px 6px 10px;
}
body.vz .table-container .dataTables_wrapper { border: 0; padding: 0; }
body.vz .table-list > thead > tr > th { background: transparent; }
body.vz .table-list > thead > tr > th.sorting_asc, body.vz .table-list > thead > tr > th.sorting_desc { color: var(--vz-text); }
body.vz .table-list > tbody > tr > td { background: transparent; border-top: 1px solid var(--vz-border-soft); }
body.vz .table-list > tbody > tr:first-child > td { border-top: 0; }
body.vz .dataTables_wrapper .dataTables_info,
body.vz .dataTables_wrapper .dataTables_length,
body.vz .dataTables_wrapper .dataTables_filter label { color: var(--vz-muted); }
body.vz .dataTables_wrapper .dataTables_filter input,
body.vz .dataTables_wrapper .dataTables_length select {
    background: var(--vz-panel);
    border: 1px solid var(--vz-border);
    color: var(--vz-text);
    border-radius: var(--vz-radius-sm);
}
body.vz .dataTables_wrapper .dataTables_filter input:focus { border-color: var(--vz-primary-border); outline: 0; }
body.vz .table-container .listtable-top, body.vz .table-container .table-top { border-bottom: 1px solid var(--vz-border-soft); }

/* Forms */
body.vz label, body.vz .col-form-label, body.vz .control-label { color: var(--vz-text-2); font-weight: 500; }
body.vz .form-control,
body.vz .custom-select,
body.vz select.form-control,
body.vz textarea,
body.vz input[type="text"], body.vz input[type="email"], body.vz input[type="password"],
body.vz input[type="number"], body.vz input[type="tel"], body.vz input[type="url"], body.vz input[type="search"] {
    background-color: var(--vz-panel);
    border: 1px solid var(--vz-border);
    color: var(--vz-text);
    border-radius: var(--vz-radius-sm);
    transition: border-color .15s ease, box-shadow .15s ease;
}
body.vz .form-control { min-height: 42px; }
body.vz .form-control-sm { min-height: 32px; }
body.vz .form-control:focus, body.vz .custom-select:focus, body.vz textarea:focus,
body.vz input[type="text"]:focus, body.vz input[type="email"]:focus, body.vz input[type="password"]:focus {
    background-color: var(--vz-panel);
    border-color: var(--vz-primary-border);
    color: var(--vz-text);
    box-shadow: 0 0 0 3px rgba(115, 45, 236, .25);
}
body.vz .form-control::placeholder, body.vz textarea::placeholder, body.vz input::placeholder { color: var(--vz-muted-2); }
body.vz .form-control:disabled, body.vz .form-control[readonly] { background-color: var(--vz-card-2); color: var(--vz-text-3); }
body.vz .custom-select, body.vz select.form-control {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23BB98F6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .8rem center;
    background-size: 12px 12px;
    -webkit-appearance: none;
    appearance: none;
    padding-right: 2.2rem;
}
body.vz select option { background: var(--vz-card); color: var(--vz-text); }
body.vz .input-group-text {
    background: var(--vz-card-2);
    border: 1px solid var(--vz-border);
    color: var(--vz-text-3);
}
body.vz .input-group > .form-control:not(:first-child), body.vz .input-group > .custom-select:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
body.vz .input-group > .form-control:not(:last-child), body.vz .input-group > .custom-select:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
body.vz .form-text, body.vz .help-block { color: var(--vz-muted); }
body.vz .custom-control-label::before { background: var(--vz-panel); border-color: var(--vz-border); }
body.vz .custom-control-input:checked ~ .custom-control-label::before { background: var(--vz-primary); border-color: var(--vz-primary-border); }
body.vz input[type="checkbox"], body.vz input[type="radio"] { accent-color: var(--vz-primary); }
body.vz .is-invalid, body.vz .form-control.is-invalid { border-color: var(--vz-red) !important; }
body.vz .invalid-feedback { color: var(--vz-red); }
body.vz .field-help-text { color: var(--vz-muted); }

/* Buttons */
body.vz .btn {
    border-radius: var(--vz-radius-sm);
    font-weight: 600;
    font-size: 14px;
    padding: .55rem 1rem;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
body.vz .btn-sm, body.vz .btn-group-sm > .btn { padding: .35rem .7rem; font-size: 13px; }
body.vz .btn-lg { padding: .75rem 1.3rem; font-size: 15.5px; }
body.vz .btn-xs { padding: .2rem .5rem; font-size: 12px; }
body.vz .btn:focus, body.vz .btn.focus { box-shadow: 0 0 0 3px rgba(115, 45, 236, .3); }
body.vz .btn-primary, body.vz .btn-primary:not(:disabled):not(.disabled):active, body.vz .btn-primary.active {
    background: var(--vz-primary);
    border: 1px solid var(--vz-primary-border);
    color: #fff !important;
    box-shadow: 0 6px 18px rgba(115, 45, 236, .25);
}
body.vz .btn-primary:hover, body.vz .btn-primary:focus { background: var(--vz-primary-hover); border-color: var(--vz-primary-border); color: #fff !important; }
body.vz .btn-default, body.vz .btn-secondary, body.vz .btn-light, body.vz .btn-outline-secondary, body.vz .btn-outline-primary,
body.vz .btn-outline-default, body.vz .btn-outline-dark, body.vz .btn-outline-light {
    background: var(--vz-card-2);
    border: 1px solid var(--vz-border);
    color: var(--vz-text-2) !important;
}
body.vz .btn-default:hover, body.vz .btn-secondary:hover, body.vz .btn-light:hover, body.vz .btn-outline-secondary:hover,
body.vz .btn-outline-primary:hover, body.vz .btn-outline-default:hover, body.vz .btn-outline-dark:hover, body.vz .btn-outline-light:hover,
body.vz .btn-default:not(:disabled):not(.disabled).active, body.vz .btn-default:not(:disabled):not(.disabled):active {
    background: var(--vz-raise);
    border-color: var(--vz-border-hover);
    color: var(--vz-text) !important;
}
body.vz .btn-success { background: #059669; border: 1px solid #10b981; color: #fff !important; }
body.vz .btn-success:hover { background: #047857; border-color: #10b981; }
body.vz .btn-danger { background: #b91c1c; border: 1px solid #ef4444; color: #fff !important; }
body.vz .btn-danger:hover { background: #991b1b; }
body.vz .btn-warning { background: #b45309; border: 1px solid #f59e0b; color: #fff !important; }
body.vz .btn-info { background: #1d4ed8; border: 1px solid #3b82f6; color: #fff !important; }
body.vz .btn-outline-danger { background: transparent; border: 1px solid rgba(248, 113, 113, .5); color: var(--vz-red) !important; }
body.vz .btn-outline-danger:hover { background: rgba(248, 113, 113, .12); }
body.vz .btn-outline-success { background: transparent; border: 1px solid rgba(52, 211, 153, .5); color: var(--vz-green) !important; }
body.vz .btn-link { color: var(--vz-accent) !important; font-weight: 600; }
body.vz .btn-link:hover { color: var(--vz-accent-hover) !important; text-decoration: none; }
body.vz .btn.disabled, body.vz .btn:disabled { opacity: .5; }
body.vz .btn-return-to-admin { background: rgba(251, 191, 36, .14); border: 1px solid rgba(251, 191, 36, .45); color: var(--vz-amber) !important; }
body.vz .btn-group > .btn:not(:last-child):not(.dropdown-toggle) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
body.vz .btn-group > .btn:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }

/* Alerts */
body.vz .alert { border-radius: var(--vz-radius-sm); border: 1px solid; color: var(--vz-text-2); }
body.vz .alert a, body.vz .alert .alert-link { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
body.vz .alert-info, body.vz .alert-primary { background: rgba(96, 165, 250, .1); border-color: rgba(96, 165, 250, .35); color: #cfe0fb; }
body.vz .alert-success { background: rgba(52, 211, 153, .1); border-color: rgba(52, 211, 153, .35); color: #c3f0dd; }
body.vz .alert-warning { background: rgba(251, 191, 36, .1); border-color: rgba(251, 191, 36, .38); color: #f9e3b0; }
body.vz .alert-danger, body.vz .alert-error { background: rgba(248, 113, 113, .1); border-color: rgba(248, 113, 113, .38); color: #f9cccc; }
body.vz .alert-secondary, body.vz .alert-light, body.vz .alert-dark { background: var(--vz-card-2); border-color: var(--vz-border); }

/* Badges and statuses */
body.vz .badge { border-radius: 999px; font-weight: 700; padding: .3em .65em; }
body.vz .badge-info, body.vz .badge-primary { background: rgba(115, 45, 236, .25); color: var(--vz-accent); }
body.vz .badge-secondary, body.vz .badge-light, body.vz .badge-default { background: var(--vz-card-2); color: var(--vz-text-3); }
body.vz .badge-success { background: rgba(52, 211, 153, .16); color: var(--vz-green); }
body.vz .badge-warning { background: rgba(251, 191, 36, .16); color: var(--vz-amber); }
body.vz .badge-danger { background: rgba(248, 113, 113, .16); color: var(--vz-red); }

body.vz .label,
body.vz .status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .01em;
    line-height: 1.2;
    white-space: nowrap;
    background: var(--vz-card-2);
    color: var(--vz-text-3);
    border: 1px solid transparent;
    text-transform: none;
}
body.vz .label.status::before, body.vz span.status::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}
body.vz .status-active, body.vz .status-paid, body.vz .status-open, body.vz .status-accepted, body.vz .status-completed,
body.vz .status-delivered, body.vz .label-success { background: rgba(52, 211, 153, .12); color: var(--vz-green); border-color: rgba(52, 211, 153, .25); }
body.vz .status-pending, body.vz .status-unpaid, body.vz .status-customer-reply, body.vz .status-in-progress, body.vz .status-inprogress,
body.vz .status-on-hold, body.vz .status-onhold, body.vz .status-payment-pending, body.vz .status-draft, body.vz .status-sent,
body.vz .status-pending-transfer, body.vz .status-pending-registration, body.vz .label-warning { background: rgba(251, 191, 36, .12); color: var(--vz-amber); border-color: rgba(251, 191, 36, .25); }
body.vz .status-overdue, body.vz .status-suspended, body.vz .status-terminated, body.vz .status-fraud, body.vz .status-cancelled,
body.vz .status-collections, body.vz .status-dead, body.vz .status-expired, body.vz .status-lost, body.vz .label-danger { background: rgba(248, 113, 113, .12); color: var(--vz-red); border-color: rgba(248, 113, 113, .25); }
body.vz .status-answered, body.vz .status-refunded, body.vz .status-transferred-away, body.vz .label-info { background: rgba(96, 165, 250, .12); color: var(--vz-blue); border-color: rgba(96, 165, 250, .25); }
body.vz .status-closed, body.vz .status-grace, body.vz .status-redemption, body.vz .label-default { background: var(--vz-card-2); color: var(--vz-muted); border-color: var(--vz-border-soft); }

/* List groups (also the contextual sidebar panels) */
body.vz .list-group-item {
    background: transparent;
    border-color: var(--vz-border-soft);
    color: var(--vz-text-2);
}
body.vz a.list-group-item, body.vz .list-group-item-action { color: var(--vz-text-2) !important; }
body.vz .list-group-item-action:hover, body.vz .list-group-item-action:focus { background: var(--vz-card-2); color: var(--vz-text) !important; }
body.vz .list-group-item.active, body.vz .list-group-item-action.active {
    background: rgba(115, 45, 236, .16);
    border-color: var(--vz-border-soft);
    color: var(--vz-text) !important;
    box-shadow: inset 3px 0 0 var(--vz-primary-border);
}
body.vz .list-group-item.disabled { color: var(--vz-muted-2) !important; background: transparent; }

/* Tabs and pills */
body.vz .nav-tabs { border-bottom: 1px solid var(--vz-border); }
body.vz .nav-tabs .nav-link { color: var(--vz-muted) !important; border: 0; border-bottom: 2px solid transparent; border-radius: 0; font-weight: 600; padding: .7rem 1rem; }
body.vz .nav-tabs .nav-link:hover { color: var(--vz-text) !important; border-bottom-color: var(--vz-border-hover); }
body.vz .nav-tabs .nav-link.active, body.vz .nav-tabs .nav-item.show .nav-link { color: var(--vz-text) !important; background: transparent; border-bottom-color: var(--vz-primary-border); }
body.vz .nav-pills .nav-link { color: var(--vz-text-3) !important; border-radius: var(--vz-radius-sm); }
body.vz .nav-pills .nav-link.active { background: rgba(115, 45, 236, .2); color: var(--vz-text) !important; }
body.vz .tab-content { color: var(--vz-text-2); }

/* Dropdowns, popovers, tooltips, modals */
body.vz .dropdown-menu {
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius-sm);
    box-shadow: 0 16px 40px rgba(0, 0, 0, .45);
    padding: 6px;
}
body.vz .dropdown-item { color: var(--vz-text-2) !important; border-radius: 6px; padding: .45rem .7rem; }
body.vz .dropdown-item:hover, body.vz .dropdown-item:focus { background: var(--vz-card-2); color: var(--vz-text) !important; }
body.vz .dropdown-divider { border-color: var(--vz-border-soft); }
body.vz .popover { background: var(--vz-card); border: 1px solid var(--vz-border); border-radius: var(--vz-radius-sm); box-shadow: 0 16px 40px rgba(0, 0, 0, .45); }
body.vz .popover-body { color: var(--vz-text-2); padding: 6px; }
body.vz .popover-header { background: var(--vz-card-2); border-color: var(--vz-border-soft); color: var(--vz-text); }
body.vz .bs-popover-bottom > .arrow::before, body.vz .bs-popover-auto[x-placement^="bottom"] > .arrow::before { border-bottom-color: var(--vz-border); }
body.vz .bs-popover-bottom > .arrow::after, body.vz .bs-popover-auto[x-placement^="bottom"] > .arrow::after { border-bottom-color: var(--vz-card); }
body.vz .client-alerts { margin: 0; padding: 0; list-style: none; min-width: 260px; }
body.vz .client-alerts li a { display: flex; gap: 10px; padding: 10px; border-radius: 6px; color: var(--vz-text-2) !important; }
body.vz .client-alerts li a:hover { background: var(--vz-card-2); }
body.vz .client-alerts li a i { color: var(--vz-amber); margin-top: 3px; }
body.vz .client-alerts li.none { padding: 10px; color: var(--vz-muted); }
body.vz .tooltip-inner { background: var(--vz-raise); color: var(--vz-text); border: 1px solid var(--vz-border); border-radius: 6px; }
body.vz .modal-content { background: var(--vz-card); border: 1px solid var(--vz-border); border-radius: var(--vz-radius); color: var(--vz-text-2); box-shadow: 0 24px 64px rgba(0, 0, 0, .55); }
body.vz .modal-header, body.vz .modal-footer { border-color: var(--vz-border-soft); }
body.vz .modal-title { color: var(--vz-text); }
body.vz .close { color: var(--vz-text-3); text-shadow: none; opacity: .8; }
body.vz .close:hover { color: var(--vz-text); opacity: 1; }
body.vz .modal-backdrop.show { opacity: .7; background: #08070c; }
body.vz .modal-localisation .modal-content { background: var(--vz-card); }
body.vz .modal-localisation .item-selector .item { color: var(--vz-text-2); border-radius: 6px; }
body.vz .modal-localisation .item-selector .item.active, body.vz .modal-localisation .item-selector .item:hover { background: rgba(115, 45, 236, .2); color: var(--vz-text); }

/* Pagination, progress */
body.vz .page-link { background: var(--vz-card); border-color: var(--vz-border); color: var(--vz-text-2) !important; }
body.vz .page-link:hover { background: var(--vz-card-2); border-color: var(--vz-border-hover); }
body.vz .page-item.active .page-link { background: var(--vz-primary); border-color: var(--vz-primary-border); color: #fff !important; }
body.vz .page-item.disabled .page-link { background: var(--vz-card); color: var(--vz-muted-2) !important; border-color: var(--vz-border-soft); }
body.vz .progress { background: var(--vz-card-2); border-radius: 999px; }
body.vz .progress-bar { background: var(--vz-primary); }

/* Full-page overlay */
body.vz #fullpage-overlay { background: rgba(8, 7, 12, .7); }
body.vz #fullpage-overlay .msg { color: var(--vz-text); }

/* ==========================================================================
   twenty-one pages
   ========================================================================== */

/* Contextual sidebar panels (right rail) */
body.vz .card-sidebar { margin-bottom: 16px !important; overflow: hidden; }
body.vz .card-sidebar .card-header { padding: 12px 16px; }
body.vz .card-sidebar .card-title { font-size: 14px; display: flex; align-items: center; gap: 8px; }
body.vz .card-sidebar .card-title > i:not(.card-minimise) { color: var(--vz-accent); }
body.vz .card-sidebar .card-minimise { color: var(--vz-muted); margin-left: auto; font-size: 11px; cursor: pointer; }
body.vz .card-sidebar .list-group-item { padding: 10px 16px; font-size: 14px; }
body.vz .sidebar-menu-item-icon { color: var(--vz-muted); }
body.vz .list-group-item.active .sidebar-menu-item-icon { color: var(--vz-accent); }
body.vz .card-sidebar .card-body { font-size: 14px; }
body.vz .card-sidebar .card-footer { padding: 10px 16px; }

/* Dashboard tiles */
body.vz .tiles { margin-bottom: 24px !important; }
body.vz .tiles .row { margin: -8px; }
body.vz .tiles .row > [class*="col-"] { padding: 8px; }
body.vz .tiles .tile {
    position: relative;
    display: block;
    height: 100%;
    padding: 20px 20px 18px;
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius);
    overflow: hidden;
    text-align: left;
    color: var(--vz-text-2) !important;
    transition: border-color .15s ease, transform .15s ease;
}
body.vz .tiles .tile:hover { border-color: var(--vz-border-hover); transform: translateY(-2px); background: var(--vz-card); }
body.vz .tiles .tile i {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: 16px;
    color: var(--vz-accent);
    background: rgba(115, 45, 236, .16);
    opacity: 1;
}
body.vz .tiles .tile .stat { font-size: 34px; font-weight: 800; color: var(--vz-text); line-height: 1.1; margin-top: 0; }
body.vz .tiles .tile .title { font-size: 13px; color: var(--vz-muted); text-transform: none; font-weight: 600; margin-top: 4px; }
body.vz .tiles .tile .highlight { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; opacity: .9; }
body.vz .tiles .bg-color-blue { background: linear-gradient(90deg, var(--vz-primary), var(--vz-accent)) !important; }
body.vz .tiles .bg-color-green { background: var(--vz-green) !important; }
body.vz .tiles .bg-color-red { background: var(--vz-red) !important; }
body.vz .tiles .bg-color-gold { background: var(--vz-amber) !important; }

/* Dashboard panels */
body.vz .client-home-cards .card { margin-bottom: 20px; }
body.vz .client-home-cards .card-header .card-title > i { color: var(--vz-accent); margin-right: 6px; }
body.vz .client-home-cards .card-header .btn { float: right; }
body.vz .client-home-cards .list-group-item { padding: 12px 18px; }
body.vz .client-home-cards .card-body { color: var(--vz-text-2); }
body.vz .client-home-cards .bg-color-blue, body.vz .client-home-cards .bg-color-green, body.vz .client-home-cards .bg-color-red,
body.vz .client-home-cards .bg-color-gold, body.vz .client-home-cards .bg-color-pomegranate, body.vz .client-home-cards .bg-color-asbestos,
body.vz .client-home-cards .bg-color-teal, body.vz .client-home-cards .bg-color-orange, body.vz .client-home-cards .bg-color-purple { color: var(--vz-text) !important; }
body.vz .card-accent-blue, body.vz .card-accent-green, body.vz .card-accent-red, body.vz .card-accent-gold,
body.vz .card-accent-pomegranate, body.vz .card-accent-asbestos, body.vz .card-accent-teal,
body.vz .card-accent-orange, body.vz .card-accent-purple, body.vz .card-accent-emerald, body.vz .card-accent-midnight-blue {
    border-top: 1px solid var(--vz-border) !important;
}
body.vz .card-accent-red, body.vz .card-accent-pomegranate { box-shadow: inset 0 3px 0 var(--vz-red); }
body.vz .card-accent-gold, body.vz .card-accent-orange { box-shadow: inset 0 3px 0 var(--vz-amber); }
body.vz .card-accent-green, body.vz .card-accent-emerald, body.vz .card-accent-teal { box-shadow: inset 0 3px 0 var(--vz-green); }
body.vz .card-accent-blue, body.vz .card-accent-purple, body.vz .card-accent-midnight-blue, body.vz .card-accent-asbestos { box-shadow: inset 0 3px 0 var(--vz-primary-border); }
body.vz .div-service-item, body.vz .div-service-name { color: var(--vz-text-2); }

/* Domain search banner (homepage) */
body.vz .home-domain-search, body.vz .domain-search-banner, body.vz section.home-domain-search {
    background: var(--vz-card) !important;
    border-bottom: 1px solid var(--vz-border-soft);
    color: var(--vz-text-2);
}

/* Service / product details */
body.vz .product-details .product-status,
body.vz .product-status {
    background: var(--vz-card-2);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius);
    color: var(--vz-text);
    overflow: hidden;
}
body.vz .product-status .product-icon { padding: 24px 16px; background: transparent; }
body.vz .product-status .product-icon .fa-stack .fa-circle { color: rgba(115, 45, 236, .25); }
body.vz .product-status .product-icon .fa-stack .fa-inverse, body.vz .product-status .product-icon .fa-stack-1x { color: var(--vz-accent); }
body.vz .product-status .product-icon h3 { color: var(--vz-text); font-size: 18px; margin-top: 10px; }
body.vz .product-status .product-icon h4 { color: var(--vz-muted); font-size: 14px; font-weight: 500; }
body.vz .product-status .product-status-text { padding: 8px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: 12px; background: rgba(52, 211, 153, .14); color: var(--vz-green); }
body.vz .product-status-pending .product-status-text { background: rgba(251, 191, 36, .14); color: var(--vz-amber); }
body.vz .product-status-suspended .product-status-text, body.vz .product-status-terminated .product-status-text,
body.vz .product-status-cancelled .product-status-text, body.vz .product-status-fraud .product-status-text { background: rgba(248, 113, 113, .14); color: var(--vz-red); }
body.vz .product-details-tab-container { background: var(--vz-card); border: 1px solid var(--vz-border); border-radius: var(--vz-radius); color: var(--vz-text-2); }
body.vz .product-details h4 { color: var(--vz-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 2px; }

/* Ticket view */
body.vz .ticket-reply {
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius);
    margin-bottom: 16px;
    overflow: hidden;
}
body.vz .ticket-reply .posted-by { background: var(--vz-card-2); border-bottom: 1px solid var(--vz-border-soft); color: var(--vz-muted); padding: 10px 16px; }
body.vz .ticket-reply .posted-by-name { color: var(--vz-text); font-weight: 600; }
body.vz .ticket-reply .message { color: var(--vz-text-2); padding: 16px; }
body.vz .ticket-reply.staff { border-color: rgba(138, 80, 239, .55); }
body.vz .ticket-reply.staff .posted-by { background: rgba(115, 45, 236, .14); }
body.vz .ticket-reply .requestor-type-operator, body.vz .ticket-reply .label-requestor-type { background: rgba(115, 45, 236, .25); color: var(--vz-accent); }
body.vz .ticket-reply .attachments { border-top: 1px solid var(--vz-border-soft); }
body.vz .markdown-editor, body.vz .md-editor, body.vz .md-editor > textarea, body.vz .md-editor .md-header { background: var(--vz-panel) !important; border-color: var(--vz-border) !important; color: var(--vz-text) !important; }
body.vz .md-editor .btn-default { background: var(--vz-card-2); }

/* Knowledgebase, announcements, downloads */
body.vz .kb-category, body.vz .kb-article-item, body.vz .announcement-single { color: var(--vz-text-2); }
body.vz .kb-article-title, body.vz .announcement-single h3 a { color: var(--vz-text) !important; }

/* Invoice payment / misc light panels in twenty-one */
body.vz .invoice-summary, body.vz .bg-default, body.vz .sub-heading span, body.vz .sub-heading-borderless span { background: var(--vz-card) !important; color: var(--vz-text-2) !important; }
body.vz .well { background: var(--vz-card-2); border: 1px solid var(--vz-border); border-radius: var(--vz-radius-sm); color: var(--vz-text-2); box-shadow: none; }

/* ==========================================================================
   Order form (standard_cart)
   ========================================================================== */
body.vz #order-standard_cart { color: var(--vz-text-2); }
body.vz #order-standard_cart .header-lined h1,
body.vz #order-standard_cart h1, body.vz #order-standard_cart h2, body.vz #order-standard_cart h3 { color: var(--vz-text); }
body.vz #order-standard_cart .header-lined { border-bottom: 1px solid var(--vz-border-soft); }
body.vz #order-standard_cart .products .product {
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius);
    color: var(--vz-text-2);
    overflow: hidden;
    transition: border-color .15s ease;
}
body.vz #order-standard_cart .products .product:hover { border-color: var(--vz-border-hover); }
body.vz #order-standard_cart .products .product header {
    background: transparent;
    border-bottom: 1px solid var(--vz-border-soft);
    color: var(--vz-text);
}
body.vz #order-standard_cart .products .product header span { color: var(--vz-text); font-weight: 700; }
body.vz #order-standard_cart .products .product header .qty { color: var(--vz-muted); }
body.vz #order-standard_cart .products .product div.product-desc { color: var(--vz-text-2); }
body.vz #order-standard_cart .products .product footer { background: transparent; }
body.vz #order-standard_cart .products .product div.product-pricing span.price { color: var(--vz-text); }
body.vz #order-standard_cart .cart-sidebar .card, body.vz #order-standard_cart .cart-sidebar .panel,
body.vz #order-standard_cart .sidebar .card { background: var(--vz-card); border-color: var(--vz-border); }
body.vz #order-standard_cart .cart-sidebar .list-group-item, body.vz #order-standard_cart .sidebar .list-group-item { background: transparent; color: var(--vz-text-2) !important; border-color: var(--vz-border-soft); }
body.vz #order-standard_cart .cart-sidebar .list-group-item.active { background: rgba(115, 45, 236, .16); color: var(--vz-text) !important; }
body.vz #order-standard_cart .order-summary,
body.vz #order-standard_cart .summary-container {
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: var(--vz-radius);
    color: var(--vz-text-2);
}
body.vz #order-standard_cart .order-summary h2 { background: transparent; color: var(--vz-text); border-bottom: 1px solid var(--vz-border-soft); }
body.vz #order-standard_cart .order-summary .summary-totals, body.vz #order-standard_cart .order-summary .subtotal,
body.vz #order-standard_cart .order-summary .bordered-totals { border-color: var(--vz-border-soft); }
body.vz #order-standard_cart .order-summary .total-due-today .amt, body.vz #order-standard_cart .total-due-today .amt { color: var(--vz-text); }
body.vz #order-standard_cart .order-summary .total-due-today span:not(.amt) { color: var(--vz-muted); }
body.vz #order-standard_cart .view-cart-items-header {
    background: var(--vz-card-2);
    color: var(--vz-muted);
    border-radius: var(--vz-radius) var(--vz-radius) 0 0;
    border: 1px solid var(--vz-border);
    border-bottom: 0;
}
body.vz #order-standard_cart .view-cart-items {
    background: var(--vz-card);
    border: 1px solid var(--vz-border);
    border-radius: 0 0 var(--vz-radius) var(--vz-radius);
}
body.vz #order-standard_cart .view-cart-items .item { background: transparent; border-color: var(--vz-border-soft); color: var(--vz-text-2); }
body.vz #order-standard_cart .view-cart-items .item-price span:not(.cycle) { color: var(--vz-text); }
body.vz #order-standard_cart .view-cart-items .item-price .cycle, body.vz #order-standard_cart .view-cart-items .item small { color: var(--vz-muted); }
body.vz #order-standard_cart .empty-cart .btn {
    background: var(--vz-card-2) !important;
    border: 1px solid var(--vz-border) !important;
    border-radius: var(--vz-radius-sm);
}
body.vz #order-standard_cart .empty-cart .btn:hover { border-color: rgba(248, 113, 113, .5) !important; color: #fca5a5 !important; }
body.vz #order-standard_cart .already-registered .btn-info {
    background: var(--vz-card-2);
    border: 1px solid var(--vz-border);
    color: var(--vz-text);
}
body.vz #order-standard_cart .already-registered .btn-info:hover { border-color: var(--vz-primary-border); background: rgba(115, 45, 236, .15); }
body.vz #order-standard_cart label.radio-inline, body.vz #order-standard_cart .radio-inline { color: var(--vz-text-2); }
/* Saved cards / linked PayPal accounts list (only shown with a card or PayPal gateway selected) */
body.vz #order-standard_cart .cc-input-container ul, body.vz #order-standard_cart .cc-input-container ul li {
    background: transparent !important;
    border-color: var(--vz-border-soft) !important;
    color: var(--vz-text-2) !important;
}
body.vz #order-standard_cart .payment-instructions { color: var(--vz-text-2); }
body.vz #order-standard_cart .view-cart-items .item-title { color: var(--vz-text); }
body.vz #order-standard_cart .view-cart-items .item-group, body.vz #order-standard_cart .view-cart-items .item-domain { color: var(--vz-muted); }
body.vz #order-standard_cart .view-cart-empty { color: var(--vz-muted); }
body.vz #order-standard_cart .sub-heading { border-color: var(--vz-border-soft); }
body.vz #order-standard_cart .sub-heading span { background: var(--vz-bg) !important; color: var(--vz-muted) !important; }
body.vz #order-standard_cart .field-container, body.vz #order-standard_cart .product-info,
body.vz #order-standard_cart .domain-checker-container, body.vz #order-standard_cart .domain-selection-options .option,
body.vz #order-standard_cart .account-select-container .account, body.vz #order-standard_cart .cc-input-container,
body.vz #order-standard_cart .secure-warning, body.vz #order-standard_cart .addon-products .panel-addon {
    background: var(--vz-card) !important;
    border: 1px solid var(--vz-border) !important;
    border-radius: var(--vz-radius) !important;
    color: var(--vz-text-2) !important;
}
body.vz #order-standard_cart .product-info .product-title { color: var(--vz-text); }
body.vz #order-standard_cart .domain-selection-options .option-selected { border-color: var(--vz-primary-border) !important; background: rgba(115, 45, 236, .1) !important; }
body.vz #order-standard_cart .prepend-icon .field-icon { color: var(--vz-muted); }
body.vz #order-standard_cart .prepend-icon .field { padding-left: 38px; }
body.vz #order-standard_cart .already-registered { background: transparent; border-color: var(--vz-border-soft); color: var(--vz-text-2); }
body.vz #order-standard_cart .btn-checkout, body.vz #order-standard_cart #btnCompleteOrder, body.vz #order-standard_cart .btn-continue {
    background: var(--vz-primary) !important;
    border: 1px solid var(--vz-primary-border) !important;
    color: #fff !important;
}
body.vz #order-standard_cart .empty-cart .btn, body.vz #order-standard_cart .btn-link { color: var(--vz-accent) !important; }
body.vz #order-standard_cart .order-summary .loader { color: var(--vz-accent); }
body.vz #order-standard_cart .text-muted { color: var(--vz-muted) !important; }
body.vz #order-standard_cart .panel-heading { background: var(--vz-card-2); color: var(--vz-text); border-color: var(--vz-border-soft); }
body.vz #order-standard_cart .panel-body { background: var(--vz-card); }

/* iCheck (used by twenty-one / standard_cart for radios and checkboxes) */
body.vz .icheckbox_square-blue, body.vz .iradio_square-blue { filter: invert(.9) hue-rotate(180deg) saturate(.6); }


/* ---------- Round 2 fixes ---------- */
.vz-container-probe { height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important; margin-bottom: 0 !important; overflow: hidden; visibility: hidden; pointer-events: none; }

/* DataTables header cells (sorting columns get their own backgrounds) and outer outline */
body.vz table.dataTable thead th, body.vz .table-list thead th,
body.vz table.dataTable thead .sorting, body.vz table.dataTable thead .sorting_asc, body.vz table.dataTable thead .sorting_desc,
body.vz table.dataTable thead .sorting_disabled { background-color: transparent !important; color: var(--vz-muted); }
body.vz table.dataTable, body.vz .table-list { border: 0 !important; border-collapse: separate; border-spacing: 0; }
body.vz table.dataTable.no-footer { border-bottom: 0 !important; }

/* Ticket view separators, markdown editor and file inputs */
body.vz .card hr, body.vz .card-body + .card-body, body.vz .card .border-top, body.vz .card .border-bottom { border-color: var(--vz-border-soft) !important; }
body.vz .md-footer, body.vz .markdown-editor-status, body.vz .md-editor .md-footer, body.vz .editor-statusbar {
    background: var(--vz-card-2) !important; color: var(--vz-muted) !important; border-color: var(--vz-border) !important;
}
body.vz .md-editor .md-preview, body.vz .md-editor .md-header { background: var(--vz-panel) !important; color: var(--vz-text-2) !important; }
body.vz .custom-file-label { background: var(--vz-panel); border: 1px solid var(--vz-border); color: var(--vz-muted); border-radius: var(--vz-radius-sm); }
body.vz .custom-file-label::after { background: var(--vz-card-2); color: var(--vz-text-2); border-left: 1px solid var(--vz-border); }
body.vz .custom-file-input:focus ~ .custom-file-label { border-color: var(--vz-primary-border); box-shadow: 0 0 0 3px rgba(115, 45, 236, .25); }

/* Order form: purple calls to action, dark promo/estimate tabs */
body.vz #order-standard_cart .btn-success, body.vz #order-standard_cart .btn-primary {
    background: var(--vz-primary) !important; border: 1px solid var(--vz-primary-border) !important; color: #fff !important;
}
body.vz #order-standard_cart .btn-success:hover, body.vz #order-standard_cart .btn-primary:hover { background: var(--vz-primary-hover) !important; }
body.vz #order-standard_cart .view-cart-tabs .nav-tabs { border-bottom: 1px solid var(--vz-border); }
body.vz #order-standard_cart .view-cart-tabs .nav-tabs a, body.vz #order-standard_cart .view-cart-tabs .nav-tabs .nav-link {
    background: transparent !important; color: var(--vz-muted) !important; border: 0 !important; border-bottom: 2px solid transparent !important;
}
body.vz #order-standard_cart .view-cart-tabs .nav-tabs .active a, body.vz #order-standard_cart .view-cart-tabs .nav-tabs a.active,
body.vz #order-standard_cart .view-cart-tabs .nav-tabs .nav-link.active { color: var(--vz-text) !important; border-bottom-color: var(--vz-primary-border) !important; }
body.vz #order-standard_cart .view-cart-tabs .tab-content {
    background: var(--vz-card) !important; border: 1px solid var(--vz-border) !important; border-top: 0 !important;
    border-radius: 0 0 var(--vz-radius) var(--vz-radius); color: var(--vz-text-2);
}
body.vz #order-standard_cart .view-cart-tabs .tab-content .btn-block { background: var(--vz-card-2) !important; border: 1px solid var(--vz-border) !important; color: var(--vz-text-2) !important; }
body.vz #order-standard_cart .products .product header .qty { font-style: normal; font-size: 12px; }

/* ---------- Round 3: leftovers found by scanning every page ---------- */
body.vz .list-group, body.vz .list-group-item, body.vz .list-group-flush > .list-group-item { border-color: var(--vz-border-soft) !important; }
body.vz .badge:not([class*="badge-"]):not(.vz-tinted) { background: var(--vz-card-2); color: var(--vz-text-3); border: 1px solid var(--vz-border-soft); }
body.vz .list-group-item.active .badge:not([class*="badge-"]) { background: rgba(115, 45, 236, .3); color: var(--vz-text); }

/* On/off switches (bootstrap-switch) */
body.vz .bootstrap-switch { background: var(--vz-panel); border-color: var(--vz-border); border-radius: 999px; }
body.vz .bootstrap-switch .bootstrap-switch-handle-off, body.vz .bootstrap-switch .bootstrap-switch-handle-on,
body.vz .bootstrap-switch .bootstrap-switch-label { background: var(--vz-card-2); color: var(--vz-text-3); }
body.vz .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, body.vz .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
body.vz .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info { background: var(--vz-primary); color: #fff; }
body.vz .bootstrap-switch.bootstrap-switch-focused { border-color: var(--vz-primary-border); box-shadow: 0 0 0 3px rgba(115, 45, 236, .25); }

/* Order form inputs carry an id-level white background */
body.vz #order-standard_cart .field, body.vz #order-standard_cart .form-control, body.vz #order-standard_cart select,
body.vz #order-standard_cart textarea, body.vz #order-standard_cart input[type="text"], body.vz #order-standard_cart input[type="email"],
body.vz #order-standard_cart input[type="password"], body.vz #order-standard_cart input[type="tel"] {
    background-color: var(--vz-panel) !important; border: 1px solid var(--vz-border) !important; color: var(--vz-text) !important;
}
body.vz #order-standard_cart .field:focus, body.vz #order-standard_cart .form-control:focus { border-color: var(--vz-primary-border) !important; box-shadow: 0 0 0 3px rgba(115, 45, 236, .25) !important; }

/* Announcements */
body.vz .announcements article, body.vz .primary-content article {
    background: var(--vz-card) !important; border: 1px solid var(--vz-border) !important; border-radius: var(--vz-radius);
    padding: 18px 20px; margin-bottom: 16px; color: var(--vz-text-2);
}
body.vz .primary-content article h1, body.vz .primary-content article h2, body.vz .primary-content article h3 { font-size: 18px; }
body.vz .primary-content article h1 a, body.vz .primary-content article h2 a, body.vz .primary-content article h3 a { color: var(--vz-text) !important; }
body.vz .primary-content article .article-items, body.vz .primary-content article .text-muted { color: var(--vz-muted) !important; }

/* ---------- Round 4: polish ---------- */
body.vz .client-home-cards .card .list-group, body.vz .client-home-cards .card .card-body { max-height: none !important; }
body.vz .client-home-cards .card-footer { background: transparent; border-top-color: var(--vz-border-soft); padding: 8px 18px; font-size: 12.5px; }
body.vz .client-home-cards .card-footer a { color: var(--vz-muted) !important; }
body.vz .client-home-cards .card-footer a:hover { color: var(--vz-accent) !important; }
body.vz .table-container { overflow-x: auto; -webkit-overflow-scrolling: touch; }
body.vz .card-sidebar .list-group-item { white-space: normal; overflow-wrap: anywhere; }

/* ---------- Round 5: guest pages ---------- */
/* Registration / checkout fields with a leading icon */
body.vz .prepend-icon .field, body.vz input.field, body.vz .field.form-control, body.vz #inputCaptcha, body.vz .captcha-container input {
    background-color: var(--vz-panel) !important; border: 1px solid var(--vz-border) !important; color: var(--vz-text) !important;
}
body.vz .prepend-icon .field-icon i, body.vz .prepend-icon .field-icon { color: var(--vz-muted); }
body.vz .intl-tel-input .selected-flag, body.vz .iti__selected-flag { background: var(--vz-card-2) !important; }
body.vz .intl-tel-input .country-list, body.vz .iti__country-list { background: var(--vz-card); border-color: var(--vz-border); color: var(--vz-text-2); }
body.vz .intl-tel-input .country-list .country.highlight, body.vz .iti__country.iti__highlight { background: var(--vz-card-2); }
body.vz .password-strength-meter .progress { background: var(--vz-card-2); }

/* Homepage domain search banner and action tiles */
body.vz .home-domain-search .input-group-wrapper, body.vz .domain-search-input .input-group-wrapper,
body.vz .home-domain-search .input-group, body.vz .domain-search-banner .input-group {
    background: var(--vz-panel) !important; border: 1px solid var(--vz-border) !important; border-radius: var(--vz-radius-sm); box-shadow: none !important;
}
body.vz .home-domain-search .form-control { background: transparent !important; border: 0 !important; }
body.vz .action-icon-btns a, body.vz .action-icon-btns .card {
    background: var(--vz-card) !important; border: 1px solid var(--vz-border) !important; border-radius: var(--vz-radius) !important;
    color: var(--vz-text-2) !important; box-shadow: none !important; transition: border-color .15s ease, transform .15s ease;
}
body.vz .action-icon-btns a:hover { border-color: var(--vz-border-hover) !important; transform: translateY(-2px); color: var(--vz-text) !important; }
body.vz .action-icon-btns .ico-container, body.vz .action-icon-btns a i, body.vz .action-icon-btns a svg { color: var(--vz-accent) !important; }
body.vz .card-columns.home .card, body.vz .card-columns .card { background: var(--vz-card); }
body.vz #inputPhone, body.vz .intl-tel-input input, body.vz .iti input { background-color: var(--vz-panel) !important; border: 1px solid var(--vz-border) !important; color: var(--vz-text) !important; }

/* ==========================================================================
   Path Firewall Manager addon (modules/addons/firewall, index.php?m=firewall)
   Its templates carry light-theme colours (written for production's light page
   body) in an inline <style>, some with !important. These rules override them
   for this theme only; the addon itself is unchanged.
   ========================================================================== */
/* The top bar already shows the page title */
body.vz .firewall-wrap .fw-header h2 { display: none; }
body.vz .firewall-wrap .fw-header { justify-content: flex-end; margin-bottom: 18px; flex-wrap: wrap; }
body.vz .firewall-wrap .fw-header > :only-child, body.vz .firewall-wrap .fw-header > p, body.vz .firewall-wrap .fw-header > .text-muted { margin-right: auto; }
body.vz .fw-ip-picker label { color: var(--vz-text-2); }

/* Rules / Filters / Rate Limiters tabs */
body.vz .fw-tabs { gap: 12px; margin-bottom: 22px; }
body.vz .fw-tab-btn {
    background: var(--vz-card) !important;
    border: 1px solid var(--vz-border) !important;
    border-radius: var(--vz-radius) !important;
    color: var(--vz-text-2) !important;
    box-shadow: none !important;
    padding: 16px 18px;
}
body.vz .fw-tab-btn:hover { border-color: var(--vz-border-hover) !important; color: var(--vz-text) !important; transform: translateY(-1px); }
body.vz .fw-tab-btn.active {
    background: rgba(115, 45, 236, .12) !important;
    border-color: var(--vz-primary-border) !important;
    color: var(--vz-text) !important;
    box-shadow: inset 0 0 0 1px var(--vz-primary-border) !important;
}
body.vz .fw-tab-icon {
    color: var(--vz-accent) !important;
    background: rgba(115, 45, 236, .16);
    width: 42px; height: 42px; border-radius: 10px;
    display: grid; place-items: center; font-size: 18px; flex-shrink: 0;
}
body.vz .fw-tab-btn.active .fw-tab-icon { background: var(--vz-primary); color: #fff !important; }
body.vz .fw-tab-title { color: inherit; }
body.vz .fw-tab-sub, body.vz .fw-help { color: var(--vz-muted) !important; }
body.vz .fw-accent { color: var(--vz-accent) !important; }
body.vz .fw-btn-primary { background: var(--vz-primary) !important; border: 1px solid var(--vz-primary-border) !important; color: #fff !important; }
body.vz .fw-btn-primary:hover { background: var(--vz-primary-hover) !important; }

/* Panels, tables, dividers */
body.vz .firewall-wrap .panel { border-color: var(--vz-border) !important; border-radius: var(--vz-radius) !important; box-shadow: none !important; overflow: hidden; }
body.vz .fw-section-head { border-bottom-color: var(--vz-border-soft) !important; }
body.vz .fw-section-head h4 { color: var(--vz-text); }
body.vz .firewall-wrap .table > thead > tr > th { border-bottom: 1px solid var(--vz-border) !important; color: var(--vz-muted) !important; }
body.vz .firewall-wrap .table-responsive, body.vz .firewall-wrap .panel-body { overflow-x: auto; }
body.vz .fw-id-code { border-bottom-color: var(--vz-muted-2) !important; }
body.vz .fw-filter-list { border-color: var(--vz-border) !important; background: var(--vz-panel); }
body.vz .fw-filter-popover { background: var(--vz-card) !important; border-color: var(--vz-border) !important; box-shadow: 0 16px 40px rgba(0, 0, 0, .45) !important; }
body.vz .fw-filter-popover li { color: var(--vz-text-2) !important; }

/* Modals (New Rule / New Filter / New Rate Limiter) */
body.vz .fw-modal .modal-header, body.vz .fw-modal .modal-footer { border-color: var(--vz-border-soft) !important; }

/* Phones: compact tab row instead of three tall stacked cards */
@media (max-width: 700px) {
    body.vz .fw-tabs { grid-template-columns: repeat(3, 1fr) !important; gap: 8px; }
    body.vz .fw-tab-btn { flex-direction: column; text-align: center; gap: 8px; padding: 12px 6px; }
    body.vz .fw-tab-sub { display: none; }
    body.vz .fw-tab-title { font-size: 13px; }
    body.vz .fw-tab-icon { width: 36px; height: 36px; font-size: 16px; }
    body.vz .fw-ip-picker { width: 100%; flex-wrap: wrap; }
    body.vz .fw-ip-picker select { min-width: 0; width: 100%; }
}

/* twenty-one paints modal headers light grey; keep them on the card colour (all modals) */
body.vz .modal-header { background: transparent !important; }
/* Bootstrap 3-style headers (close button before the title, as in the firewall addon):
   title on the left, close on the right */
body.vz .modal-header > .close:first-child { order: 2; margin: -1rem -1rem -1rem auto; }
body.vz .modal-header > .close:first-child ~ .modal-title { order: 1; }

/* ==========================================================================
   Custom server modules' client-area output (service details page). Their
   templates carry light-theme colours; overridden here, modules unchanged.
   ========================================================================== */
/* virtualized_mac: Mac connection details */
body.vz .vmac-box { background: var(--vz-card-2); border-color: var(--vz-border); font-family: inherit; max-width: 760px; }
body.vz .vmac-box h3 { color: var(--vz-text); }
body.vz .vmac-cred-grid { border-color: var(--vz-border); }
body.vz .vmac-cred-grid .row > div { background: var(--vz-panel); border-bottom-color: var(--vz-border-soft); color: var(--vz-text-2); }
body.vz .vmac-cred-grid .row > div:first-child { background: var(--vz-card); color: var(--vz-muted); }
body.vz .vmac-cred-grid .row > div:nth-child(2) { color: var(--vz-text); }
body.vz .vmac-cred-grid .row > div:nth-child(3) { background: var(--vz-panel); }
body.vz .vmac-copy-btn { border-color: var(--vz-border); color: var(--vz-text-3); }
body.vz .vmac-copy-btn:hover { background: var(--vz-card-2); border-color: var(--vz-border-hover); color: var(--vz-text); }
body.vz .vmac-copy-btn.copied { border-color: rgba(52, 211, 153, .5); color: var(--vz-green); }
body.vz .vmac-section-title { color: var(--vz-muted); }
body.vz .vmac-spec-chip { background: rgba(115, 45, 236, .16); color: var(--vz-accent); }
body.vz .vmac-notice { background: rgba(251, 191, 36, .08); border-left-color: var(--vz-amber); color: var(--vz-text-2); }
body.vz .vmac-notice.info { background: rgba(96, 165, 250, .08); border-left-color: var(--vz-blue); }
body.vz .vmac-quick-links { color: var(--vz-muted); }
body.vz .vmac-quick-links a { color: var(--vz-accent); }

/* virtualized_ai_vps: VPS overview stat boxes (styled inline, so matched by their style attribute) */
body.vz .primary-content div[style*="background:#f9fafb"] { background: var(--vz-card-2) !important; border-color: var(--vz-border) !important; color: var(--vz-text); }
body.vz .primary-content div[style*="color:#6b7280"] { color: var(--vz-muted) !important; }
/* Phones: the module's 140px label column leaves values ~60px wide (one character per line).
   Put each label on its own line above its value + Copy button instead. */
@media (max-width: 575.98px) {
    body.vz .vmac-box { padding: 16px; }
    body.vz .vmac-cred-grid { grid-template-columns: minmax(0, 1fr) auto; }
    body.vz .vmac-cred-grid .row > div:first-child {
        grid-column: 1 / -1; border-bottom: 0; padding-bottom: 0;
        background: var(--vz-panel); font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em;
    }
    body.vz .vmac-quick-links code { word-break: break-all; }
}