/* Nexus Bootstrap component contract. Loaded after page CSS in every customer layout.
   Keep service-specific diagrams/layouts local; put reusable visual rules here. */
:root {
 --nx-radius: .75rem; --nx-control-radius: .5rem; --nx-space: 1.25rem;
 --nx-small: .875rem; --nx-label: .75rem; --nx-title: 1.5rem;
 --nx-shadow: 0 1px 3px rgb(15 23 42 / 6%);
 --gh-surface: #fff; --gh-surface-muted: #f1f5f9; --gh-primary: #8f1017;
 --nx-success: #047857; --nx-warning: #92400e; --nx-danger: #b91c1c; --nx-info: #1d4ed8; --nx-muted: #475569;
}
[data-bs-theme="dark"] { --gh-surface: #1c2738; --gh-surface-muted: #263345; --gh-primary: #ffb4c0; }
body { color: var(--gh-text); }
#content { font-size: .9375rem; line-height: 1.6; }
#content :is(.card,.stat-card,.dashboard-hero,.dashboard-stat,.dashboard-action,.billing-mobile-invoice,.ticket-row) {
 border-radius: var(--nx-radius); border-color: var(--gh-border); box-shadow: var(--nx-shadow);
 background-color: var(--gh-card-bg); color: var(--gh-text);
}
#content .card-header { padding: 1rem var(--nx-space); background-color: var(--gh-card-bg); color: var(--gh-text); font-weight: 600; }
#content .card-body { padding: var(--nx-space); }
#content .card-footer { padding: .75rem var(--nx-space); background-color: var(--gh-surface-muted); border-color: var(--gh-border); }
#content :is(.card-header h2,.card-header h3,.card-header h5,.card-header h6) { font-size: 1rem; line-height: 1.4; font-weight: 600; }
#content :is(.billing-page-head,.ticket-page-head,.orders-intro) { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; }
#content :is(.billing-page-head,.ticket-page-head) h1,
#content :is(.ticket-detail-title,.order-detail-title) { font-size:var(--nx-title); font-weight:600; line-height:1.3; overflow-wrap:anywhere; }
#content :is(.billing-page-head,.ticket-page-head,.orders-intro) p { font-size:.9375rem; color:var(--gh-text-muted); margin:.375rem 0 0; }
#content :is(.domain-header,.voip-header,.service-detail-brand) { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; min-width:0; }
#content .btn:not(.note-btn) { border-radius:var(--nx-control-radius); font-size:var(--nx-small); font-weight:600; min-height:44px; padding:.625rem 1rem; line-height:1.4; }
#content .btn-sm { padding:.5rem .75rem; }
#content :is(.form-control,.form-select) { border-radius:var(--nx-control-radius); min-height:44px; font-size:.9375rem; border-color:var(--gh-border); background-color:var(--gh-card-bg); color:var(--gh-text); }
#content .form-label { font-size:var(--nx-small); font-weight:600; margin-bottom:.375rem; }
#content :is(.form-text,.invalid-feedback,.valid-feedback) { font-size:var(--nx-small); line-height:1.5; }
#content :is(.text-muted,.form-text) { color:var(--gh-text-muted) !important; }
#content :is(.ticket-tabs,.billing-filter-tabs,.service-filter-bar) { gap:.5rem; flex-wrap:wrap; }
#content :is(.ticket-tab,.billing-filter-tab,.service-filter-bar .btn) { min-height:44px; padding:.5rem .875rem; border:1px solid var(--gh-border); border-radius:var(--nx-control-radius); background:var(--gh-card-bg); color:var(--gh-text); font-size:var(--nx-small); font-weight:600; }
#content :is(.ticket-tab.active,.billing-filter-tab.is-active,.service-filter-bar .btn-primary) { background:var(--gh-red); border-color:var(--gh-red); color:#fff; }
#content :is(.ticket-tab,.billing-filter-tab):hover { border-color:var(--gh-primary); }
#content :is(.badge,.ticket-status,.service-type-pill) { font-size:var(--nx-label); font-weight:600; line-height:1.4; padding:.3rem .6rem; border-radius:999px; white-space:normal; }
#content :is(.badge-paid,.badge-active,.badge-track-done,.badge.bg-success,.ticket-status.done) { background:var(--nx-success) !important; color:#fff !important; }
#content :is(.badge-pending,.badge-unpaid,.badge-track-attention,.badge.bg-warning,.ticket-status.attention) { background:var(--nx-warning) !important; color:#fff !important; }
#content :is(.badge-overdue,.badge-suspended,.badge.bg-danger) { background:var(--nx-danger) !important; color:#fff !important; }
#content :is(.badge-track-progress,.badge.bg-info,.ticket-status.progress) { background:var(--nx-info) !important; color:#fff !important; }
#content :is(.badge-expired,.badge-cancelled,.badge-draft,.badge-track-cancelled,.badge-track-received,.badge.bg-secondary,.ticket-status.muted) { background:var(--nx-muted) !important; color:#fff !important; }
#content .ticket-status.progress { height:auto; overflow:visible; }
#content .alert { border-radius:var(--nx-radius); padding:1rem var(--nx-space); font-size:var(--nx-small); line-height:1.6; }
#content :is(.ticket-empty,.billing-empty) { padding:3rem var(--nx-space); text-align:center; color:var(--gh-text-muted); }
#content .table { font-size:var(--nx-small); --bs-table-color:var(--gh-text); --bs-table-bg:var(--gh-card-bg); --bs-table-border-color:var(--gh-border); }
#content .table > :not(caption) > * > * { padding:.875rem 1rem; vertical-align:middle; }
#content .table th { font-weight:600; }
#content .pagination { gap:.25rem; flex-wrap:wrap; }
#content .page-link { min-height:44px; min-width:44px; display:grid; place-items:center; border-radius:var(--nx-control-radius); }
#content :is(button,a,input,select,textarea):focus-visible { outline:3px solid #2684c7; outline-offset:3px; }
.auth-left,.order-page,.order-main { background-color:var(--gh-body-bg); color:var(--gh-text); }
.auth-card,.order-topbar { background-color:var(--gh-card-bg); color:var(--gh-text); border-color:var(--gh-border); }
.order-footer { color:var(--gh-text-muted); border-color:var(--gh-border); }
@media(max-width:575.98px) {
 :root { --nx-space:1rem; --nx-title:1.25rem; }
 #content :is(.form-control,.form-select) { font-size:1rem; }
 #content :is(.billing-page-head,.ticket-page-head,.orders-intro) { align-items:stretch; flex-direction:column; }
 #content :is(.billing-page-head,.ticket-page-head,.orders-intro) > .btn { width:100%; }
 #content .table > :not(caption) > * > * { padding:.75rem; }
}
@media(prefers-reduced-motion:reduce) { #content :is(.card,.btn,.ticket-row) { transition:none; } }
/* Authentication uses a centred form rather than a nested content card. */
.auth-left .auth-card { background:transparent; }
[data-bs-theme="dark"] :is(.auth-mobile-nexus,.auth-mobile-gh,.order-brand-logo) { filter:brightness(0) invert(1); }
[data-bs-theme="dark"] #content a:not(.btn):not(.ticket-row):not(.page-link) { color:var(--gh-primary); }
/* Auth composition: a padded form surface with readable branding in both themes. */
.auth-left > #content { width:100%; max-width:480px; }
.auth-left .auth-card { max-width:none; padding:2rem; border:1px solid var(--gh-border); border-radius:1rem; background:var(--gh-card-bg); box-shadow:var(--nx-shadow); }
.auth-card h1 { font-size:1.75rem; line-height:1.25; margin-bottom:.75rem; }
.auth-card .auth-subtitle { color:var(--gh-text-muted); font-size:.9375rem; line-height:1.6; margin-bottom:1.75rem; }
.auth-mobile-brands { max-width:360px; margin-bottom:1.75rem; }
[data-bs-theme="dark"] :is(.auth-mobile-nexus,.auth-card .auth-logo) { content:url('/images/nexus-logo-dark.svg'); filter:none; }
[data-bs-theme="dark"] :is(.auth-mobile-gh,.order-brand-logo) { content:url('/images/logo-dark.png'); filter:none; }
[data-bs-theme="dark"] .auth-card a:not(.btn) { color:var(--gh-primary) !important; }
.auth-card > p:last-child { margin-bottom:0; }
@media(max-width:575.98px) { .auth-left { padding:1.5rem 1rem; } .auth-left .auth-card { padding:1.5rem; } }
/* Verified portal and checkout refinements. */
#content .service-filter-types { flex-wrap:wrap; overflow-x:visible; gap:.5rem; }
#content .service-filter-types .btn { white-space:normal; }
#content .card-header p { font-weight:400; color:var(--gh-text-muted); font-size:.875rem; }
#content :is(.order-summary,.order-intent-option) { background:var(--gh-surface-muted); color:var(--gh-text); border-color:var(--gh-border); }
#content :is(.order-intent-note,.order-summary-note) { color:var(--gh-text-muted); }
#content :is(.order-summary-row.is-total,.order-rate strong,.order-intent-title) { color:var(--gh-text); }
#content .order-intent-option[aria-checked="true"] { background:var(--gh-red-light); border-color:var(--gh-primary); }
#content .order-intent-option[aria-checked="true"] .order-intent-title { color:var(--gh-primary); }
#content code { background:var(--gh-surface-muted); color:var(--gh-text); border-radius:.25rem; overflow-wrap:anywhere; }
[data-bs-theme="dark"] #content :is(.settings-card-icon,.order-topbar-note i,.hosting-resource-label i) { color:var(--gh-primary); }
[data-bs-theme="dark"] #content [style*="color:var(--gh-red)"] { color:var(--gh-primary) !important; }
[data-bs-theme="dark"] #content [style*="color: var(--gh-red)"] { color:var(--gh-primary) !important; }
#content #maintenanceOrdering { padding:0 !important; }
#maintenanceForm fieldset { padding:var(--nx-space); border:1px solid var(--gh-border); border-radius:var(--nx-radius); background:var(--gh-card-bg); }
#maintenanceForm legend { float:none; width:auto; font-size:1rem; font-weight:600; padding:0 .5rem; }
@media(max-width:575.98px) {
 .nexus-topbar { grid-template-columns:44px minmax(0,1fr) auto; padding-left:1rem; padding-right:1rem; }
 .nexus-theme-select { width:96px; font-size:.8125rem; padding-left:.5rem; }
 .nexus-topbar-title { font-size:.875rem; }
}
#content .card.referral-hero { color:#fff; }
#content .card.referral-hero :is(h1,h2,h3,p) { color:inherit; }
[data-bs-theme="dark"] #content :is(.service-choice-icon,.service-add-icon) { color:var(--gh-primary); }
[data-bs-theme="dark"] .order-rate strong { color:var(--gh-text); }
#content :is(.order-summary-row,.hosting-summary-row,.authority-list,.order-facts li) { color:var(--gh-text); }
#content :is(.hosting-resource-price,.hosting-order-summary,.hosting-domain-choice,.triage-opt,.device-option,.bill-drop,.billing-detail-hero) { background:var(--gh-card-bg); color:var(--gh-text); border-color:var(--gh-border); }
#content .billing-detail-hero { border-radius:var(--nx-radius); }
[data-bs-theme="dark"] #content :is(.checkout-page-icon,.service-family-icon,.checkout-summary-icon,.summary-amount,.hosting-resource-icon) { color:var(--gh-primary); }
[data-bs-theme="dark"] #addressSearchBtn { color:var(--gh-primary); }
#content .checkout-panel { border-color:var(--gh-border); border-radius:var(--nx-radius); box-shadow:var(--nx-shadow); }
#content .checkout-stage-title:focus { outline:3px solid #2684c7; outline-offset:3px; }
#content .gh-payments { --gp-ink:var(--gh-text); --gp-muted:var(--gh-text-muted); font-family:inherit; padding:0 0 2rem; }
#content .gp-panel { background:var(--gh-card-bg); border-color:var(--gh-border); border-radius:var(--nx-radius); padding:var(--nx-space); }
#content :is(.gp-form-grid input,.gp-form-grid select,.gp-actions select,.gp-secondary,.gp-operator) { background:var(--gh-card-bg); color:var(--gh-text); border-color:var(--gh-border); }
#content :is(.gp-info,.gp-empty,.gp-detail,.gp-tag) { background:var(--gh-surface-muted); color:var(--gh-text); }
#content .gp-operator strong { color:var(--gh-text); }
#content .gp-banner { color:#533f0d; }
#content .gp-hero h1 { font-size:1.75rem; letter-spacing:normal; }
[data-bs-theme="dark"] #content :is(.gp-eyebrow,#gpMessage) { color:var(--gh-primary); }
@media(max-width:575.98px) { #content .checkout-body { padding:1rem; } }
#content :is(.hosting-resource-availability,.hosting-resource-formula,.hosting-resource-price-row,.hosting-resource-price-row strong) { color:var(--gh-text); }
[data-bs-theme="dark"] #content :is(.hosting-resource-price-kicker,.hosting-resource-price-row.is-total strong,.hosting-resource-field label i,.billing-detail-icon) { color:var(--gh-primary); }
[data-bs-theme="dark"] :is(.order-footer a,.order-topbar-note i) { color:var(--gh-primary); }
/* Direct appearance choices: selection reflects the preference, including System. */
.nexus-theme-switch { display:inline-flex; flex-shrink:0; gap:2px; padding:3px; border:1px solid var(--gh-border); border-radius:.65rem; background:var(--gh-body-bg); }
.nexus-theme-switch button { display:inline-flex; justify-content:center; align-items:center; gap:.45rem; min-width:44px; min-height:44px; border:0; border-radius:.4rem; padding:.5rem .7rem; background:transparent; color:var(--gh-text-muted); font:inherit; font-size:.8125rem; cursor:pointer; }
.nexus-theme-switch button:hover { background:var(--gh-surface-muted); color:var(--gh-text); }
.nexus-theme-switch button[aria-pressed="true"] { background:var(--gh-red); color:#fff; box-shadow:0 1px 3px rgb(0 0 0 / 15%); }
.nexus-theme-switch button:focus-visible { outline:3px solid #2684c7; outline-offset:2px; }
@media(max-width:1199.98px) { .nexus-theme-switch button span { display:none; } .nexus-theme-switch button { padding:.5rem; } }
@media(max-width:575.98px) { .nexus-theme-switch { padding:2px; gap:0; } .nexus-topbar { column-gap:.4rem; } .nexus-topbar .topbar-user { gap:.35rem; } }