/* =====================================================
   SurgeNode Dark Theme for WHMCS Twenty-One
   Matches surgenode.net design system
   ===================================================== */

/* =====================================================
   Design Tokens
   ===================================================== */
:root {
    --sn-background: #080B14;
    --sn-card: #0E1220;
    --sn-secondary: #1A2035;
    --sn-border: #1A2035;
    --sn-border-light: #232a48;
    --sn-primary: #3B82F6;
    --sn-primary-hover: #2563EB;
    --sn-primary-glow: rgba(59, 130, 246, 0.25);
    --sn-accent: #06B6D4;
    --sn-text: #F1F5F9;
    --sn-text-muted: #94A3B8;
    --sn-text-secondary: #CBD5E1;
    --sn-success: #10B981;
    --sn-danger: #EF4444;
    --sn-warning: #F59E0B;
    --sn-radius: 10px;
    --sn-radius-sm: 6px;
    --sn-radius-md: 8px;
    --sn-radius-lg: 14px;
}

/* =====================================================
   Base
   ===================================================== */
body {
    background-color: var(--sn-background);
    color: var(--sn-text);
    font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.primary-bg-color {
    background-color: var(--sn-background);
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Sora", "Manrope", sans-serif;
    color: var(--sn-text);
}

a {
    color: var(--sn-primary);
    transition: color 0.2s ease;
}
a:hover {
    color: #60A5FA;
}

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

code, kbd, samp {
    font-family: "JetBrains Mono", SFMono-Regular, Menlo, Monaco, monospace;
    background-color: var(--sn-secondary);
    color: #E879F9;
}

pre {
    font-family: "JetBrains Mono", SFMono-Regular, Menlo, Monaco, monospace;
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
}

blockquote {
    border-left-color: var(--sn-primary);
    color: var(--sn-text-secondary);
}

/* =====================================================
   Header
   ===================================================== */
header.header {
    background-color: var(--sn-background);
    border-bottom: 1px solid var(--sn-border);
}

header.header .topbar {
    background-color: var(--sn-card);
    color: var(--sn-text-secondary);
    border-bottom: 1px solid var(--sn-border);
}
header.header .topbar .btn {
    color: var(--sn-text-secondary);
}
header.header .topbar .btn:hover {
    color: var(--sn-text);
}
header.header .topbar .active-client .input-group-text {
    color: var(--sn-text-muted);
    background-color: transparent;
}
header.header .topbar .active-client .btn {
    color: var(--sn-text-secondary);
}
header.header .topbar .active-client .btn.btn-active-client span {
    border-bottom-color: var(--sn-text-muted);
}

header.header .navbar {
    background-color: var(--sn-background);
}
header.header .navbar a {
    color: var(--sn-text-secondary);
}
header.header .navbar a:hover {
    color: var(--sn-text);
}

/* Search bar */
header.header .search {
    border-color: var(--sn-border);
    background-color: var(--sn-secondary);
    border-radius: var(--sn-radius-md);
}
header.header .search .form-control {
    background-color: transparent;
    color: var(--sn-text);
}
header.header .search .form-control::placeholder {
    color: var(--sn-text-muted);
}
header.header .search .btn {
    color: var(--sn-text-muted);
}
header.header .search:focus-within {
    border-color: var(--sn-primary);
    box-shadow: 0 0 0 3px var(--sn-primary-glow);
}

/* Toolbar icons */
header.header .toolbar .nav-link {
    color: var(--sn-text-secondary);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius-md);
    transition: all 0.2s ease;
}
header.header .toolbar .nav-link:hover {
    color: var(--sn-text);
    border-color: var(--sn-primary);
    background-color: rgba(59, 130, 246, 0.1);
}

/* Main navigation */
header.header .main-navbar-wrapper {
    background-color: var(--sn-background);
    border-top: 1px solid var(--sn-border);
}

header.header .dropdown-item {
    color: var(--sn-text-secondary);
}
header.header .dropdown-item:hover,
header.header .dropdown-item:focus {
    background-color: var(--sn-primary);
    color: #fff;
}
header.header .dropdown-item.active {
    background-color: var(--sn-primary);
    color: #fff;
}

/* =====================================================
   Breadcrumb
   ===================================================== */
.master-breadcrumb {
    background-color: var(--sn-card);
    border-bottom: 1px solid var(--sn-border);
}
.breadcrumb {
    background-color: transparent;
    color: var(--sn-text-muted);
}
.breadcrumb-item a {
    color: var(--sn-text-muted);
}
.breadcrumb-item a:hover {
    color: var(--sn-primary);
}
.breadcrumb-item.active {
    color: var(--sn-text-secondary);
}
.breadcrumb-item + .breadcrumb-item::before {
    color: var(--sn-text-muted);
}

/* =====================================================
   Main Body
   ===================================================== */
section#main-body {
    background-color: var(--sn-background);
}

.primary-content {
    color: var(--sn-text);
}

/* =====================================================
   Cards
   ===================================================== */
.card {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius-lg);
    color: var(--sn-text);
}
.card-header {
    background-color: var(--sn-card);
    border-bottom-color: var(--sn-border);
    color: var(--sn-text);
}
.card-footer {
    background-color: var(--sn-card);
    border-top-color: var(--sn-border);
    color: var(--sn-text-secondary);
}
.card-body {
    color: var(--sn-text);
}
.card-title {
    color: var(--sn-text);
}

.action-icon-btns a {
    color: var(--sn-text-muted);
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    transition: all 0.2s ease;
}
.action-icon-btns a:hover {
    color: var(--sn-primary);
    border-color: var(--sn-primary);
    background-color: rgba(59, 130, 246, 0.1);
}
.action-icon-btns a .ico-container i {
    color: var(--sn-text-muted);
}

/* =====================================================
   Buttons
   ===================================================== */
.btn-primary {
    background-color: var(--sn-primary);
    border-color: var(--sn-primary);
    color: #fff;
    border-radius: var(--sn-radius-md);
    transition: all 0.2s ease;
}
.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--sn-primary-hover);
    border-color: var(--sn-primary-hover);
    color: #fff;
    box-shadow: 0 0 0 3px var(--sn-primary-glow);
}
.btn-primary:active,
.btn-primary.active {
    background-color: #1D4ED8;
    border-color: #1D4ED8;
}
.btn-primary:not(:disabled):not(.disabled):active:focus {
    box-shadow: 0 0 0 3px var(--sn-primary-glow);
}

.btn-default {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
    border-radius: var(--sn-radius-md);
    transition: all 0.2s ease;
}
.btn-default:hover,
.btn-default:focus {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border-light);
    color: var(--sn-text);
}
.btn-default:active,
.btn-default.active {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border-light);
    color: var(--sn-text);
}
.btn-default.disabled,
.btn-default:disabled {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border) !important;
    color: var(--sn-text-muted) !important;
}

.btn-secondary {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
}
.btn-secondary:hover {
    background-color: var(--sn-border-light);
    border-color: var(--sn-border-light);
    color: var(--sn-text);
}

.btn-success {
    background-color: var(--sn-success);
    border-color: var(--sn-success);
}
.btn-success:hover,
.btn-success:focus {
    background-color: #059669;
    border-color: #059669;
}

.btn-danger {
    background-color: var(--sn-danger);
    border-color: var(--sn-danger);
}
.btn-danger:hover,
.btn-danger:focus {
    background-color: #DC2626;
    border-color: #DC2626;
}

.btn-warning {
    background-color: var(--sn-warning);
    border-color: var(--sn-warning);
    color: #000;
}
.btn-warning:hover,
.btn-warning:focus {
    background-color: #D97706;
    border-color: #D97706;
    color: #000;
}

.btn-info {
    background-color: var(--sn-accent);
    border-color: var(--sn-accent);
    color: #fff;
}
.btn-info:hover,
.btn-info:focus {
    background-color: #0891B2;
    border-color: #0891B2;
    color: #fff;
}

.btn-light {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
}
.btn-light:hover {
    background-color: var(--sn-border-light);
    color: var(--sn-text);
}

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

.btn-outline-secondary {
    color: var(--sn-text-muted);
    border-color: var(--sn-border);
}
.btn-outline-secondary:hover {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border-light);
    color: var(--sn-text);
}

.btn-link {
    color: var(--sn-primary);
}
.btn-link:hover {
    color: #60A5FA;
}

.btn-return-to-admin {
    background-color: var(--sn-secondary);
    color: var(--sn-text-muted);
    border-color: var(--sn-border);
}
.btn-return-to-admin:hover {
    background-color: var(--sn-border-light);
    color: var(--sn-text);
}

.open > .dropdown-toggle.btn-default {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text);
}

/* =====================================================
   Forms
   ===================================================== */
.form-control {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text);
    border-radius: var(--sn-radius-md);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-control:focus {
    background-color: var(--sn-secondary);
    border-color: var(--sn-primary);
    color: var(--sn-text);
    box-shadow: 0 0 0 3px var(--sn-primary-glow);
}
.form-control::placeholder {
    color: var(--sn-text-muted);
}
.form-control:disabled,
.form-control[readonly] {
    background-color: #0a0e1a;
    color: var(--sn-text-muted);
}

select.form-control {
    background-color: var(--sn-secondary);
    color: var(--sn-text);
}

.input-group-text {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    color: var(--sn-text-muted);
}

.input-group .btn-reveal-pw {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text-muted);
}
.input-group .btn-reveal-pw:hover {
    background-color: var(--sn-card);
    color: var(--sn-primary);
    border-color: var(--sn-border);
}

label {
    color: var(--sn-text);
}

.form-text,
.help-block,
small.text-muted {
    color: var(--sn-text-muted) !important;
}

.custom-select {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text);
}

.custom-control-label {
    color: var(--sn-text);
}

form[data-role=json-form] .has-error input.form-control {
    background-color: rgba(239, 68, 68, 0.1);
    border-color: var(--sn-danger);
}

/* =====================================================
   Tables
   ===================================================== */
.table {
    color: var(--sn-text);
}
.table th,
.table td {
    border-top-color: var(--sn-border);
}
.table thead th {
    border-bottom-color: var(--sn-border);
    color: var(--sn-text-secondary);
    font-family: "Sora", sans-serif;
    font-weight: 500;
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(14, 18, 32, 0.5);
}
.table-hover tbody tr:hover {
    background-color: var(--sn-secondary);
    color: var(--sn-text);
}
.table-bordered {
    border-color: var(--sn-border);
}
.table-bordered th,
.table-bordered td {
    border-color: var(--sn-border);
}

/* =====================================================
   Sidebar
   ===================================================== */
.sidebar .card {
    border-radius: var(--sn-radius-lg);
}
.sidebar .card-title {
    color: var(--sn-text);
    font-family: "Sora", sans-serif;
}
.sidebar .list-group-item {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
    transition: all 0.2s ease;
}
.sidebar .list-group-item:hover {
    background-color: var(--sn-secondary);
    color: var(--sn-text);
}
.sidebar .list-group-item.active {
    background-color: var(--sn-primary);
    border-color: var(--sn-primary);
    color: #fff;
}
.sidebar .list-group-item .badge {
    background-color: var(--sn-secondary);
    color: var(--sn-text-muted);
}
.sidebar .list-group-item.active .badge {
    background-color: rgba(255, 255, 255, 0.2);
    color: #fff;
}
.sidebar .list-group-item > i.far.fa-circle {
    color: var(--sn-text-muted);
}

/* =====================================================
   List Groups
   ===================================================== */
.list-group-item {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    color: var(--sn-text);
}
.list-group-item-action:hover,
.list-group-item-action:focus {
    background-color: var(--sn-secondary);
    color: var(--sn-text);
}
.list-group-item.active {
    background-color: var(--sn-primary);
    border-color: var(--sn-primary);
}

/* =====================================================
   Footer
   ===================================================== */
footer.footer {
    background-color: var(--sn-background);
    border-top: 1px solid var(--sn-border);
    color: var(--sn-text-muted);
}
footer.footer .nav-link {
    color: var(--sn-text-muted);
    transition: color 0.2s ease;
}
footer.footer .nav-link:hover {
    color: var(--sn-text);
}
footer.footer .btn {
    background-color: var(--sn-card);
    border: 1px solid var(--sn-border);
    color: var(--sn-text-secondary);
    border-radius: var(--sn-radius-md);
    transition: all 0.2s ease;
}
footer.footer .btn:hover {
    border-color: rgba(59, 130, 246, 0.3);
    color: var(--sn-primary);
}
footer.footer .copyright {
    color: var(--sn-text-muted);
}

/* =====================================================
   Modals
   ===================================================== */
.modal-content {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius-lg);
}
.modal-header {
    background-color: var(--sn-card);
    border-bottom-color: var(--sn-border);
}
.modal-title {
    color: var(--sn-text);
    font-family: "Sora", sans-serif;
}
.modal-body {
    color: var(--sn-text);
}
.modal-footer {
    border-top-color: var(--sn-border);
}
.modal-header > .close {
    color: var(--sn-text-muted);
    text-shadow: none;
}
.close {
    color: var(--sn-text-muted);
    text-shadow: none;
    opacity: 0.7;
}
.close:hover {
    color: var(--sn-text);
    opacity: 1;
}

.modal-localisation .modal-content {
    background-color: var(--sn-card);
}
.modal-localisation .modal-body {
    background-image: none;
    background-color: var(--sn-card);
}
.modal-localisation .h5 {
    color: var(--sn-text);
}
.modal-localisation .item-selector .item {
    color: var(--sn-text-secondary);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius-md);
    transition: all 0.2s ease;
}
.modal-localisation .item-selector .item:hover {
    background-color: var(--sn-secondary);
    color: var(--sn-text);
}
.modal-localisation .item-selector .item.active {
    background-color: var(--sn-primary);
    border-color: var(--sn-primary);
    color: #fff;
}

/* =====================================================
   Alerts
   ===================================================== */
.alert-success {
    background-color: rgba(16, 185, 129, 0.12);
    border-color: rgba(16, 185, 129, 0.3);
    color: #6EE7B7;
}
.alert-info {
    background-color: rgba(59, 130, 246, 0.12);
    border-color: rgba(59, 130, 246, 0.3);
    color: #93C5FD;
}
.alert-warning {
    background-color: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.3);
    color: #FCD34D;
}
.alert-danger {
    background-color: rgba(239, 68, 68, 0.12);
    border-color: rgba(239, 68, 68, 0.3);
    color: #FCA5A5;
}

.alert a { font-weight: 600; }
.alert-success a { color: #6EE7B7; }
.alert-info a { color: #93C5FD; }
.alert-warning a { color: #FCD34D; }
.alert-danger a { color: #FCA5A5; }

/* =====================================================
   Dropdown Menus
   ===================================================== */
.dropdown-menu {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4);
}
.dropdown-item {
    color: var(--sn-text-secondary);
    transition: all 0.15s ease;
}
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--sn-primary);
    color: #fff;
}
.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--sn-primary);
    color: #fff;
}
.dropdown-divider {
    border-top-color: var(--sn-border);
}
.dropdown-header {
    color: var(--sn-text-muted);
    font-family: "Sora", sans-serif;
    font-size: 0.75em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* =====================================================
   Pagination
   ===================================================== */
.page-link {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
    transition: all 0.2s ease;
}
.page-link:hover {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text);
}
.page-item.active .page-link {
    background-color: var(--sn-primary);
    border-color: var(--sn-primary);
    color: #fff;
}
.page-item.disabled .page-link {
    background-color: var(--sn-background);
    border-color: var(--sn-border);
    color: var(--sn-text-muted);
}

/* =====================================================
   Badges
   ===================================================== */
.badge-primary {
    background-color: var(--sn-primary);
}
.badge-secondary {
    background-color: var(--sn-secondary);
    color: var(--sn-text-secondary);
}
.badge-success {
    background-color: var(--sn-success);
}
.badge-danger {
    background-color: var(--sn-danger);
}
.badge-warning {
    background-color: var(--sn-warning);
    color: #000;
}
.badge-info {
    background-color: var(--sn-accent);
}
.badge-light {
    background-color: var(--sn-secondary);
    color: var(--sn-text-secondary);
}
.badge-dark {
    background-color: var(--sn-border-light);
}

/* =====================================================
   Domain Search (Homepage)
   ===================================================== */
.home-domain-search {
    background-color: var(--sn-card) !important;
    border-bottom: 1px solid var(--sn-border);
}
.home-domain-search h2 {
    color: var(--sn-text);
}
.home-domain-search .input-group-wrapper {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius);
}
.home-domain-search .form-control {
    background-color: transparent;
}
.home-domain-search .tld-logos {
    color: var(--sn-text-muted);
}

/* =====================================================
   Tabs & Nav
   ===================================================== */
.nav-tabs {
    border-bottom-color: var(--sn-border);
}
.nav-tabs .nav-link {
    color: var(--sn-text-muted);
    border-radius: var(--sn-radius-md) var(--sn-radius-md) 0 0;
    transition: all 0.2s ease;
}
.nav-tabs .nav-link:hover {
    border-color: var(--sn-border);
    background-color: var(--sn-card);
    color: var(--sn-text);
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    background-color: var(--sn-card);
    border-color: var(--sn-border) var(--sn-border) var(--sn-card);
    color: var(--sn-text);
}

.nav-pills .nav-link {
    color: var(--sn-text-secondary);
    border-radius: var(--sn-radius-md);
}
.nav-pills .nav-link.active {
    background-color: var(--sn-primary);
    color: #fff;
}

.tab-content {
    background-color: var(--sn-card);
}

/* =====================================================
   Popovers & Tooltips
   ===================================================== */
.popover {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4);
}
.popover-header {
    background-color: var(--sn-secondary);
    border-bottom-color: var(--sn-border);
    color: var(--sn-text);
}
.popover-body {
    color: var(--sn-text-secondary);
}
.bs-popover-bottom > .arrow::after {
    border-bottom-color: var(--sn-card);
}
.bs-popover-top > .arrow::after {
    border-top-color: var(--sn-card);
}
.bs-popover-left > .arrow::after {
    border-left-color: var(--sn-card);
}
.bs-popover-right > .arrow::after {
    border-right-color: var(--sn-card);
}

.tooltip-inner {
    background-color: var(--sn-secondary);
    color: var(--sn-text);
    border-radius: var(--sn-radius-sm);
}
.bs-tooltip-top .arrow::before {
    border-top-color: var(--sn-secondary);
}
.bs-tooltip-bottom .arrow::before {
    border-bottom-color: var(--sn-secondary);
}
.bs-tooltip-left .arrow::before {
    border-left-color: var(--sn-secondary);
}
.bs-tooltip-right .arrow::before {
    border-right-color: var(--sn-secondary);
}

.client-alerts li a {
    color: var(--sn-text-secondary);
    transition: all 0.15s ease;
}
.client-alerts li a:hover {
    background-color: var(--sn-secondary);
    color: var(--sn-text);
}

/* =====================================================
   Client Home
   ===================================================== */
.card-columns.home .card {
    border-radius: var(--sn-radius-lg);
}

.select-account {
    border-top-color: var(--sn-border);
}
.select-account a:hover {
    background-color: var(--sn-secondary);
}

.continue-container,
.invite-box {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    border-radius: var(--sn-radius);
}

/* =====================================================
   Utility Overrides
   ===================================================== */
.bg-white {
    background-color: var(--sn-card) !important;
}
.bg-light {
    background-color: var(--sn-card) !important;
}
.text-dark {
    color: var(--sn-text) !important;
}
.text-muted {
    color: var(--sn-text-muted) !important;
}
.border {
    border-color: var(--sn-border) !important;
}
.border-top {
    border-top-color: var(--sn-border) !important;
}
.border-bottom {
    border-bottom-color: var(--sn-border) !important;
}

.jumbotron {
    background-color: var(--sn-card);
    color: var(--sn-text);
    border-radius: var(--sn-radius-lg);
}

#fullpage-overlay {
    background-color: rgba(8, 11, 20, 0.9);
}

/* =====================================================
   Store Page Overrides
   ===================================================== */
.landing-page .hero {
    color: var(--sn-text) !important;
    background-color: var(--sn-card) !important;
}
.landing-page .hero h2,
.landing-page .hero h3 {
    color: var(--sn-text) !important;
}
.landing-page .content-block {
    background-color: var(--sn-background) !important;
    color: var(--sn-text) !important;
}
.landing-page .content-block.alt-bg-color {
    background-color: var(--sn-card) !important;
}
.landing-page .btn-primary {
    background-color: var(--sn-primary) !important;
    border-color: var(--sn-primary) !important;
}
.landing-page .btn-primary:hover {
    background-color: var(--sn-primary-hover) !important;
    border-color: var(--sn-primary-hover) !important;
}

/* =====================================================
   Client Home Tiles
   ===================================================== */
.tiles .tile {
    background-color: var(--sn-card);
    border-right-color: var(--sn-border);
    color: var(--sn-text);
}
.tiles .tile:hover {
    background-color: var(--sn-secondary);
}
.tiles .tile .title {
    color: var(--sn-text-muted);
}
.tiles .tile i {
    color: var(--sn-secondary);
}
.tiles .tile:hover i {
    color: var(--sn-border-light);
}
@media (max-width: 1199.98px) {
    .tiles div:nth-child(1) > .tile,
    .tiles div:nth-child(2) > .tile {
        border-bottom-color: var(--sn-border);
    }
}

/* =====================================================
   Client Home Cards
   ===================================================== */
.client-home-cards .card-header {
    background-color: var(--sn-card);
    border-bottom: 1px solid var(--sn-border);
    color: var(--sn-text);
}
.client-home-cards .card-header .btn {
    color: #fff;
}
.client-home-cards .card-header .btn:hover {
    color: var(--sn-primary);
}
.client-home-cards .list-group {
    border-top: 1px solid var(--sn-border) !important;
    border-bottom: 1px solid var(--sn-border) !important;
}
.client-home-cards .list-group .list-group-item {
    border-color: var(--sn-border);
    background-color: var(--sn-card);
    color: var(--sn-text);
}
.client-home-cards small {
    color: var(--sn-text-muted);
}

/* =====================================================
   Markdown Editor
   ===================================================== */
.md-editor {
    border-color: var(--sn-border);
}
.md-editor > .btn-toolbar {
    background-color: var(--sn-secondary) !important;
}
.md-editor > textarea.markdown-editor,
.md-editor > .md-preview {
    border-color: var(--sn-border) !important;
    background-color: var(--sn-card) !important;
    color: var(--sn-text) !important;
}
.md-preview table,
.markdown-content table {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
}
.md-preview table > thead > tr > th,
.markdown-content table > thead > tr > th {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text);
}
.md-preview table > tbody > tr > td,
.markdown-content table > tbody > tr > td {
    border-color: var(--sn-border);
}
.md-preview blockquote,
.markdown-content blockquote {
    border-left-color: var(--sn-primary);
}

/* =====================================================
   Store Order Container
   ===================================================== */
.store-order-container .store-domain-tabs li a {
    background-color: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
}
.store-order-container .store-domain-tabs li.active a {
    background-color: var(--sn-card);
    color: var(--sn-text);
}
.store-order-container .store-domain-tab-content {
    border-color: var(--sn-border);
    background-color: var(--sn-card);
}

/* =====================================================
   Promo Containers
   ===================================================== */
.promo-container {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
}
.promo-banner {
    background-color: var(--sn-card);
}

/* =====================================================
   Product Details
   ===================================================== */
div.product-details-tab-container {
    background-color: var(--sn-card);
    border-color: var(--sn-border);
    color: var(--sn-text);
}
div.product-details div.product-icon {
    background-color: var(--sn-secondary);
    color: var(--sn-text-muted);
}

/* =====================================================
   Upgrade Products
   ===================================================== */
.upgrade .products .product {
    background-color: var(--sn-card);
    border-radius: var(--sn-radius);
    overflow: hidden;
}
.upgrade .products .product .header {
    background-color: var(--sn-primary);
}
.upgrade .products .product ul {
    border-color: var(--sn-border);
}
.upgrade .products .product ul li {
    border-bottom-color: var(--sn-border);
    color: var(--sn-text-muted);
}
.upgrade .products .product ul li span {
    color: var(--sn-text);
}
.upgrade .products .product .footer {
    border-color: var(--sn-border);
}
.upgrade .products .product .btn {
    background-color: var(--sn-primary);
}

/* =====================================================
   Registration Page
   ===================================================== */
#registration .sub-heading {
    border-top-color: var(--sn-border);
}
#registration .sub-heading span {
    color: var(--sn-primary);
    background-color: var(--sn-background);
}
#registration .field,
#registration .form-control {
    background: var(--sn-secondary);
    border-color: var(--sn-border);
    color: var(--sn-text);
}

/* =====================================================
   Domain Search (additional specificity)
   ===================================================== */
.home-domain-search .input-group-wrapper {
    background-color: var(--sn-secondary) !important;
    border-color: var(--sn-border) !important;
}

/* =====================================================
   Sidebar Badge Override (theme.css specificity)
   ===================================================== */
.sidebar .list-group-item .badge {
    background-color: var(--sn-secondary) !important;
    color: var(--sn-text-muted) !important;
}

/* =====================================================
   Password Reveal Button
   ===================================================== */
.input-group .btn-reveal-pw:hover {
    background-color: var(--sn-card) !important;
    color: var(--sn-primary) !important;
    border-color: var(--sn-border) !important;
}

/* =====================================================
   Ticket Replies
   ===================================================== */
.ticket-reply-container .card {
    background-color: var(--sn-card);
}
.ticket-reply-container .card-header {
    background-color: var(--sn-secondary);
}
.ticket-reply-container .card.staff .card-header {
    background-color: rgba(59, 130, 246, 0.15);
    border-bottom-color: rgba(59, 130, 246, 0.3);
}

/* =====================================================
   General catch-all for remaining white backgrounds
   ===================================================== */
.primary-bg-color {
    background-color: var(--sn-background) !important;
}

header.header {
    background-color: var(--sn-background) !important;
}

/* Override any remaining #fff backgrounds in card contexts */
.card .card-body,
.card .card-header,
.card .card-footer {
    background-color: var(--sn-card);
}

/* Text color fixes for elements that use dark text by default */
.text-body {
    color: var(--sn-text) !important;
}

p, li, span, div {
    color: inherit;
}

/* Ensure all #ddd and #ccc borders become dark */
.card,
.card-header,
.card-footer,
.list-group-item,
.table th,
.table td,
.table-bordered,
.input-group-text,
.form-control,
.modal-header,
.modal-footer {
    border-color: var(--sn-border);
}

/* =====================================================
   Order Form / Cart - Broad Nuclear Override
   Targets ALL elements inside any order container
   ===================================================== */
[id*="order-"] {
    color: var(--sn-text);
}
[id*="order-"] * {
    border-color: var(--sn-border) !important;
}
[id*="order-"] .product,
[id*="order-"] .products .product,
[id*="order-"] .product-header,
[id*="order-"] .product-pricing,
[id*="order-"] .product-info,
[id*="order-"] .product-feature,
[id*="order-"] .summary-container,
[id*="order-"] .order-summary,
[id*="order-"] .panel,
[id*="order-"] .panel-heading,
[id*="order-"] .panel-body,
[id*="order-"] .panel-footer,
[id*="order-"] .panel-addon,
[id*="order-"] .panel-price,
[id*="order-"] .tab-content,
[id*="order-"] .item,
[id*="order-"] .sub-heading span,
[id*="order-"] .well,
[id*="order-"] .configoption,
[id*="order-"] table,
[id*="order-"] th,
[id*="order-"] td,
[id*="order-"] .view-cart-items .item,
[id*="order-"] .view-cart-items-header,
[id*="order-"] .view-cart-tabs .tab-content {
    background-color: var(--sn-card) !important;
    color: var(--sn-text) !important;
}
[id*="order-"] .view-cart-items .item:nth-child(even),
[id*="order-"] .product-info,
[id*="order-"] .summary-container,
[id*="order-"] .panel-price {
    background-color: var(--sn-secondary) !important;
}

/* Addon & product text - ensure readability */
[id*="order-"] h2, [id*="order-"] h3, [id*="order-"] h4, [id*="order-"] h5,
[id*="order-"] .panel-addon h4,
[id*="order-"] .panel-addon .panel-title,
[id*="order-"] .panel-addon label,
[id*="order-"] .panel-addon p,
[id*="order-"] .addon-name,
[id*="order-"] .product-name,
[id*="order-"] label,
[id*="order-"] legend {
    color: var(--sn-text) !important;
}
[id*="order-"] .product-desc,
[id*="order-"] small,
[id*="order-"] .text-muted {
    color: var(--sn-text-muted) !important;
}

/* Order form inputs */
[id*="order-"] .form-control,
[id*="order-"] textarea,
[id*="order-"] select {
    background-color: var(--sn-secondary) !important;
    border-color: var(--sn-border) !important;
    color: var(--sn-text) !important;
}
[id*="order-"] .cc-input-container {
    background-color: var(--sn-card) !important;
    border: 1px solid var(--sn-border-light) !important;
    color: var(--sn-text) !important;
}
[id*="order-"] .cc-input-container input,
[id*="order-"] .cc-input-container iframe {
    color: var(--sn-text) !important;
}

/* Cart review/checkout content padding */
[id*="order-"] .main-content,
[id*="order-"] .cart-body,
[id*="order-"] > .clearfix,
[id*="order-"] > div > .row {
    padding: 20px !important;
}

/* =====================================================
   Product Card Restyling (WHMCS core order forms)
   Makes product cards look unique & match SurgeNode
   ===================================================== */

/* Card container */
[id*="order-"] .products .product {
    background: var(--sn-card) !important;
    border: 1px solid var(--sn-border) !important;
    border-radius: 14px !important;
    overflow: hidden;
    transition: all 0.25s ease;
    position: relative;
}
[id*="order-"] .products .product:hover {
    border-color: rgba(59, 130, 246, 0.3) !important;
    transform: translateY(-3px);
    box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.4),
                0 0 0 1px rgba(59, 130, 246, 0.1);
}

/* Kill the white header bar - make seamless */
[id*="order-"] .products .product .product-header,
[id*="order-"] .products .product > h3,
[id*="order-"] .products .product > .header,
[id*="order-"] .products .product > div:first-child,
[id*="order-"] .products .product > *:first-child {
    background: var(--sn-secondary) !important;
    border-bottom: 1px solid var(--sn-border) !important;
    padding: 20px 20px 15px !important;
    margin: 0 !important;
    color: var(--sn-text) !important;
}

/* Product name - Sora font, white text */
[id*="order-"] .products .product .product-name,
[id*="order-"] .products .product h3,
[id*="order-"] .products .product .header h4,
[id*="order-"] .products .product > *:first-child h3,
[id*="order-"] .products .product > *:first-child span,
[id*="order-"] .products .product > *:first-child a,
[id*="order-"] .products .product > *:first-child {
    font-family: "Sora", sans-serif !important;
    font-weight: 600 !important;
    font-size: 1.05rem !important;
    color: #fff !important;
    background: transparent !important;
    margin: 0 !important;
    letter-spacing: -0.01em;
}
/* Re-apply the header background (transparent override above kills it) */
[id*="order-"] .products .product > div:first-child {
    background: var(--sn-secondary) !important;
}

/* Price - prominent accent color */
[id*="order-"] .products .product .product-pricing,
[id*="order-"] .products .product .pricing,
[id*="order-"] .products .product .price {
    font-family: "Sora", sans-serif !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    color: var(--sn-primary) !important;
    background: transparent !important;
    padding: 10px 20px !important;
    white-space: nowrap !important;
}
[id*="order-"] .products .product .product-pricing span,
[id*="order-"] .products .product .pricing small,
[id*="order-"] .products .product .billing-cycle {
    font-size: 0.75rem !important;
    font-weight: 400 !important;
    color: var(--sn-text-muted) !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Feature list / product info */
[id*="order-"] .products .product .product-feature,
[id*="order-"] .products .product .product-info,
[id*="order-"] .products .product .feature-list,
[id*="order-"] .products .product ul {
    background: transparent !important;
    padding: 10px 20px !important;
    margin: 0 !important;
    border: none !important;
}
[id*="order-"] .products .product .product-feature li,
[id*="order-"] .products .product ul li {
    color: var(--sn-text-muted) !important;
    padding: 4px 0 !important;
    border-bottom: 1px solid rgba(26, 32, 53, 0.6) !important;
    font-size: 0.85rem !important;
    list-style: none !important;
}
[id*="order-"] .products .product ul li:last-child {
    border-bottom: none !important;
}
[id*="order-"] .products .product ul li span {
    color: var(--sn-text-secondary) !important;
}

/* Order button - full width, primary blue, rounded */
[id*="order-"] .products .product .btn-order-now,
[id*="order-"] .products .product .btn-success,
[id*="order-"] .products .product .btn-primary,
[id*="order-"] .products .product .btn[type="submit"],
[id*="order-"] .products .product .footer .btn,
[id*="order-"] .products .product a.btn {
    background: var(--sn-primary) !important;
    border: none !important;
    border-radius: 10px !important;
    color: #fff !important;
    font-family: "Sora", sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    padding: 10px 20px !important;
    margin: 15px 20px 20px !important;
    display: block !important;
    width: calc(100% - 40px) !important;
    text-align: center !important;
    transition: all 0.2s ease !important;
    letter-spacing: 0.02em;
    white-space: nowrap !important;
}
[id*="order-"] .products .product .btn-order-now:hover,
[id*="order-"] .products .product .btn-success:hover,
[id*="order-"] .products .product .btn-primary:hover,
[id*="order-"] .products .product .btn[type="submit"]:hover,
[id*="order-"] .products .product .footer .btn:hover,
[id*="order-"] .products .product a.btn:hover {
    background: var(--sn-primary-hover) !important;
    box-shadow: 0 0 0 3px var(--sn-primary-glow) !important;
    transform: none !important;
}

/* Product footer area */
[id*="order-"] .products .product .footer,
[id*="order-"] .products .product .product-footer {
    background: transparent !important;
    border-top: 1px solid var(--sn-border) !important;
    padding: 0 !important;
    text-align: center !important;
}
/* Also center the button's direct parent */
[id*="order-"] .products .product > *:last-child {
    text-align: center !important;
}

/* =====================================================
   Announcements - fix white background
   ===================================================== */
.announcements .announcement article {
    background-color: var(--sn-card) !important;
    border-left: 4px solid var(--sn-primary) !important;
    border-radius: 0 var(--sn-radius-md) var(--sn-radius-md) 0 !important;
    color: var(--sn-text) !important;
    padding: 1rem !important;
}
.announcements .announcement article p {
    color: var(--sn-text-secondary) !important;
}

/* =====================================================
   Nuclear Override - Kill ALL remaining white backgrounds
   These use !important to beat Bootstrap's compiled specificity
   ===================================================== */
.card,
.card-body,
.card-header,
.card-footer,
.mc-promo-manage,
.mc-promo-login,
.mc-promo-manage .content,
.mc-promo-login .content {
    background-color: var(--sn-card) !important;
    color: var(--sn-text);
}

.primary-content .card-body,
.primary-content .mc-promo-manage .content,
.primary-content .mc-promo-login .content {
    background-color: var(--sn-card) !important;
}

.client-home-cards .card-header {
    background-color: var(--sn-card) !important;
}

/* Sidebar card headers with !important in theme.css */
.sidebar .card-header,
.sidebar .card-collapsable > .card-header {
    background-color: var(--sn-card) !important;
}

/* Table list rows */
.table-list > tbody > tr > td {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border);
    color: var(--sn-text);
}
.table-list > thead > tr > th {
    background-color: var(--sn-secondary) !important;
    border-color: var(--sn-border);
    color: var(--sn-text-secondary);
}

/* Action icon buttons */
.action-icon-btns a {
    background-color: var(--sn-secondary) !important;
    color: var(--sn-text-muted) !important;
}
.action-icon-btns a:hover {
    background-color: rgba(59, 130, 246, 0.1) !important;
    color: var(--sn-primary) !important;
}

/* View ticket */
.view-ticket .card-body,
.view-ticket .mc-promo-manage .content,
.view-ticket .mc-promo-login .content {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border);
}

/* Cart / order pages */
.order-summary,
.order-details,
.cart-body,
.sub-heading span {
    background-color: var(--sn-card) !important;
}

/* List group items (Bootstrap base) */
.list-group-item {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border) !important;
    color: var(--sn-text);
}
.list-group-item.active {
    background-color: var(--sn-primary) !important;
    border-color: var(--sn-primary) !important;
    color: #fff;
}
.list-group-item-action:hover,
.list-group-item-action:focus {
    background-color: var(--sn-secondary) !important;
    color: var(--sn-text);
}

/* Modal override */
.modal-content {
    background-color: var(--sn-card) !important;
}
.modal-header {
    background-color: var(--sn-card) !important;
}

/* Tab active state */
.nav-tabs .nav-link.active {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border) var(--sn-border) var(--sn-card) !important;
    color: var(--sn-text);
}

/* Page link / pagination */
.page-link {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border) !important;
}

/* Form control forced override */
.form-control {
    background-color: var(--sn-secondary) !important;
    border-color: var(--sn-border) !important;
    color: var(--sn-text) !important;
}
.form-control:focus {
    background-color: var(--sn-secondary) !important;
    border-color: var(--sn-primary) !important;
}

/* Custom select */
.custom-select {
    background-color: var(--sn-secondary) !important;
    border-color: var(--sn-border) !important;
    color: var(--sn-text) !important;
}

/* Dropdown */
.dropdown-menu {
    background-color: var(--sn-card) !important;
}

/* Popover */
.popover {
    background-color: var(--sn-card) !important;
}

/* Domain search wrapper */
.home-domain-search,
.home-domain-search .input-group-wrapper {
    background-color: var(--sn-secondary) !important;
}

/* Promo / store containers */
.promo-container,
.promo-banner {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border) !important;
}

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

/* Upgrade products */
.upgrade .products .product {
    background-color: var(--sn-card) !important;
}

/* Registration sub-heading */
#registration .sub-heading span {
    background-color: var(--sn-background) !important;
}
#registration .form-control {
    background: var(--sn-secondary) !important;
}

/* Btn default disabled with !important in theme.css */
.btn-default.disabled,
.btn-default:disabled,
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default.disabled:focus,
.btn-default.disabled.focus {
    background-color: var(--sn-card) !important;
    border-color: var(--sn-border) !important;
    color: var(--sn-text-muted) !important;
}

/* Password reveal hover override */
.input-group .btn-reveal-pw:hover,
.input-group .btn-reveal-pw:active {
    background-color: var(--sn-card) !important;
    color: var(--sn-primary) !important;
}

/* Store domain tabs */
.store-order-container .store-domain-tabs li.active a {
    background-color: var(--sn-card) !important;
}

/* Markdown tables/editor with !important in theme */
.md-editor > .btn-toolbar {
    background-color: var(--sn-secondary) !important;
}
.md-editor > textarea.markdown-editor,
.md-editor > .md-preview {
    background-color: var(--sn-card) !important;
    color: var(--sn-text) !important;
    border-color: var(--sn-border) !important;
}

/* Checkbox/switch backgrounds - keep functional */
.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--sn-primary);
    border-color: var(--sn-primary);
}

/* =====================================================
   Scrollbar
   ===================================================== */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: var(--sn-background);
}
::-webkit-scrollbar-thumb {
    background: var(--sn-secondary);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--sn-border-light);
}

/* =====================================================
   Selection
   ===================================================== */
::selection {
    background-color: var(--sn-primary);
    color: #fff;
}
::-moz-selection {
    background-color: var(--sn-primary);
    color: #fff;
}

/* =====================================================
   Smooth Transitions
   ===================================================== */
a,
.btn,
.form-control,
.nav-link,
.list-group-item {
    transition: all 0.2s ease;
}

/* =====================================================
   SurgeNode Logo Text
   ===================================================== */
.sn-logo-text {
    font-family: "Sora", sans-serif;
    font-weight: 700;
    font-size: 1.25rem;
    letter-spacing: -0.02em;
    color: var(--sn-text) !important;
    white-space: nowrap;
}
.sn-logo-accent {
    color: var(--sn-primary) !important;
}

/* =====================================================
   Header Restyling (original WHMCS markup)
   ===================================================== */
header.header {
    background-color: var(--sn-background) !important;
    border-bottom: 1px solid var(--sn-border);
}
header.header .navbar-brand {
    font-family: "Sora", sans-serif;
}

/* Main nav links */
header.header .main-navbar-wrapper {
    background-color: var(--sn-background) !important;
    border-top: 1px solid var(--sn-border);
}
header.header .main-navbar-wrapper .navbar-nav .nav-link {
    color: var(--sn-text-secondary) !important;
    font-family: "Manrope", sans-serif;
    font-weight: 500;
    font-size: 0.9rem;
    padding: 8px 16px !important;
    border-radius: 8px;
}
header.header .main-navbar-wrapper .navbar-nav .nav-link:hover {
    color: var(--sn-text) !important;
    background: var(--sn-secondary);
}

/* =====================================================
   SN Custom Footer
   ===================================================== */
footer.footer.sn-footer {
    padding: 48px 0 0 !important;
}
.sn-footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 32px;
    margin-bottom: 40px;
}
@media (max-width: 767px) {
    .sn-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }
}
@media (max-width: 480px) {
    .sn-footer-grid {
        grid-template-columns: 1fr;
    }
}
.sn-footer-brand {
    display: flex;
    flex-direction: column;
}
.sn-footer-tagline {
    color: var(--sn-text-muted);
    font-size: 0.85rem;
    font-style: italic;
    margin-bottom: 16px;
}
.sn-footer-heading {
    font-family: "Sora", sans-serif;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--sn-text) !important;
    margin-bottom: 16px;
}
.sn-footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}
.sn-footer-links li {
    margin-bottom: 8px;
}
.sn-footer-links a {
    color: var(--sn-text-muted) !important;
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.2s ease;
}
.sn-footer-links a:hover {
    color: var(--sn-text) !important;
}
.sn-lang-btn {
    background: var(--sn-card) !important;
    border: 1px solid var(--sn-border) !important;
    color: var(--sn-text-muted) !important;
    border-radius: 8px !important;
    font-size: 0.8rem;
    padding: 6px 12px !important;
    display: inline-block;
}
.sn-lang-btn:hover {
    border-color: rgba(59, 130, 246, 0.3) !important;
    color: var(--sn-primary) !important;
}
.sn-footer-bottom {
    border-top: 1px solid var(--sn-border);
    padding: 20px 0;
    text-align: center;
    font-size: 0.8rem;
    color: var(--sn-text-muted);
}

/* Breadcrumb - keep visible */
.master-breadcrumb {
    background-color: var(--sn-card) !important;
    border-bottom: 1px solid var(--sn-border);
}

/* =====================================================
   Card Hover Effects (distinctive)
   ===================================================== */
.card {
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.primary-content .card:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.3);
    border-color: var(--sn-border-light);
}

/* Sidebar cards don't need hover lift */
.sidebar .card:hover {
    transform: none;
    box-shadow: none;
}

/* =====================================================
   Domain Search (Homepage hero style)
   ===================================================== */
.home-domain-search {
    background: linear-gradient(180deg, var(--sn-card) 0%, var(--sn-background) 100%) !important;
    border-bottom: 1px solid var(--sn-border) !important;
    padding: 48px 0 !important;
}
.home-domain-search h2 {
    font-family: "Sora", sans-serif;
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: 8px;
    color: var(--sn-text) !important;
}
.home-domain-search .input-group-wrapper {
    background: var(--sn-secondary) !important;
    border: 1px solid var(--sn-border) !important;
    border-radius: 12px !important;
    padding: 6px !important;
}
.home-domain-search .input-group-wrapper .form-control {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    font-size: 1rem;
}
.home-domain-search .input-group-wrapper .btn {
    border-radius: 8px !important;
    padding: 8px 24px !important;
    font-weight: 600;
}

/* =====================================================
   Page Titles
   ===================================================== */
.primary-content h1,
.primary-content h2,
.primary-content h3 {
    font-family: "Sora", sans-serif;
    font-weight: 600;
}

/* =====================================================
   Improved Alert Styling
   ===================================================== */
.alert {
    border-radius: var(--sn-radius) !important;
    border-left-width: 4px !important;
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
}

/* =====================================================
   Global Subtle Glow on Focus
   ===================================================== */
.btn:focus,
.btn:active:focus {
    box-shadow: 0 0 0 3px var(--sn-primary-glow) !important;
}
.btn-success:focus {
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.25) !important;
}
.btn-danger:focus {
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.25) !important;
}
.btn-warning:focus {
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.25) !important;
}