@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');
@import url('https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css');
/* OffshoreDomains.com site-wide dark theme (company 2 only) */
:root{
  --od-bg:#060f18; --od-bg2:#0a1622; --od-surface:rgba(255,255,255,.04); --od-surface2:rgba(255,255,255,.07);
  --od-border:rgba(120,220,220,.14); --od-border2:rgba(120,220,220,.28);
  --od-text:#e7f2f1; --od-muted:#9db4b7; --od-faint:#5f7a80;
  --od-cyan:#38e0f0; --od-teal:#14b8a6; --od-emerald:#34d399;
  --od-grad:linear-gradient(120deg,#38e0f0 0%,#14b8a6 52%,#34d399 100%);
  --od-grad-soft:linear-gradient(120deg,rgba(56,224,240,.16),rgba(20,184,166,.14) 55%,rgba(52,211,153,.14));
  --od-font:'DM Sans',system-ui,Segoe UI,sans-serif; --od-mono:'Space Mono',monospace;
}
/* ===== GLOBAL (all pages) ===== */
body{background:var(--od-bg) !important;color:var(--od-text) !important;font-family:var(--od-font) !important;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:radial-gradient(1000px 600px at 82% -8%,rgba(56,224,240,.13),transparent 60%),
             radial-gradient(820px 560px at 4% 12%,rgba(52,211,153,.11),transparent 55%),
             radial-gradient(700px 700px at 60% 108%,rgba(20,184,166,.09),transparent 55%),var(--od-bg)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.45;
  background-image:linear-gradient(rgba(120,220,220,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(120,220,220,.03) 1px,transparent 1px);
  background-size:60px 60px;-webkit-mask-image:radial-gradient(circle at 50% 0,#000 34%,transparent 80%);mask-image:radial-gradient(circle at 50% 0,#000 34%,transparent 80%)}
a{color:var(--od-cyan);text-decoration:none}
a:hover{color:var(--od-emerald)}
h1,h2,h3,h4,h5,.title h3{color:var(--od-text)}
hr{border-color:var(--od-border) !important}
label,.control-label{color:var(--od-muted) !important}
p,.text-muted,small,.help-block{color:var(--od-muted)}
.container-md,.container,.container-fluid{color:var(--od-text)}
/* HEADER */
.header{background:transparent !important;padding:16px 0 0;border:0}
.header .container-md{display:flex;align-items:center}
.header .logo img{content:url('/assets/od-logo.svg');height:54px !important;width:auto;filter:drop-shadow(0 6px 18px rgba(56,224,240,.25))}
/* NAV */
.nav-content{position:sticky;top:0;z-index:100;margin-top:10px;
  background:rgba(8,18,26,.82) !important;backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
  border-top:1px solid var(--od-border);border-bottom:1px solid var(--od-border)}
.nav-content .navbar{padding:0;background:transparent !important;background-color:transparent !important}
.nav-content .container-md{display:flex;align-items:center;justify-content:space-between}
.nav-content .navbar-nav{display:flex;align-items:center;gap:2px}
.nav-content .nav-link{color:var(--od-muted) !important;font-weight:600;font-size:.9rem;padding:16px 15px !important;position:relative;transition:color .2s;display:inline-flex;align-items:center;gap:7px}
.nav-content .nav-link i{color:var(--od-teal);font-size:.95rem}
.nav-content .nav-item.active .nav-link,.nav-content .nav-link:hover{color:var(--od-text) !important}
.nav-content .nav-item.active > .nav-link::after,.nav-content .nav-item:not(.dropdown) .nav-link:hover::after{content:"";position:absolute;left:15px;right:15px;bottom:8px;height:2px;background:var(--od-grad);border-radius:2px}
.nav-content .navbar-nav:last-child .nav-link{color:#061018 !important;background:var(--od-grad);border-radius:10px;padding:9px 20px !important;margin-left:10px;font-weight:700;box-shadow:0 10px 24px -10px rgba(20,184,166,.6)}
.nav-content .navbar-nav:last-child .nav-link::after{display:none}
.nav-content .dropdown-menu{background:#0b1a24 !important;border:1px solid var(--od-border) !important;border-radius:12px;padding:8px;box-shadow:0 20px 50px -20px #000}
.nav-content .dropdown-item{color:var(--od-muted) !important;border-radius:8px;padding:9px 12px;font-size:.86rem}
.nav-content .dropdown-item:hover{background:var(--od-surface) !important;color:var(--od-text) !important}
.navbar-toggler{border:1px solid var(--od-border) !important;color:var(--od-text)}
/* TITLE BAR (inner pages show page title here) */
.title{background:transparent !important;border:0 !important;padding:26px 0 0}
.title h3,.title h1,.title h2{color:var(--od-text) !important;font-weight:800;letter-spacing:-.02em}
/* ===== BLESTA COMPONENTS (all pages) ===== */
.card:not(.color),.panel,.panel-blesta,.card-blesta,.well{background:var(--od-surface) !important;border:1px solid var(--od-border) !important;border-radius:16px !important;color:var(--od-text) !important;box-shadow:none !important}
.card-header,.panel-heading{background:transparent !important;border-bottom:1px solid var(--od-border) !important;color:var(--od-text) !important;font-weight:700;border-radius:16px 16px 0 0 !important}
.card-body,.card-content,.panel-body{background:transparent !important;color:var(--od-text) !important}
.panel-footer,.card-footer{background:rgba(255,255,255,.02) !important;border-top:1px solid var(--od-border) !important;border-radius:0 0 16px 16px !important}
.card-steps .card-header,.card-steps{border-color:var(--od-border) !important}
/* forms */
.form-control,.custom-select,select,textarea,input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],input[type=tel]{
  background:rgba(0,0,0,.28) !important;border:1px solid var(--od-border2) !important;color:var(--od-text) !important;border-radius:10px !important;box-shadow:none !important}
.form-control:focus,select:focus,textarea:focus,input:focus{border-color:var(--od-teal) !important;box-shadow:0 0 0 3px rgba(20,184,166,.18) !important;background:rgba(0,0,0,.34) !important;color:var(--od-text) !important}
.form-control::placeholder{color:var(--od-faint) !important}
.input-group-text,.input-group-addon{background:var(--od-surface2) !important;border:1px solid var(--od-border2) !important;color:var(--od-muted) !important}
/* buttons */
.btn{border-radius:999px !important;font-weight:700 !important;transition:transform .2s,box-shadow .2s,filter .2s}
.btn-success,.btn-primary,.btn-order,.btn-info{color:#061018 !important;background:var(--od-grad) !important;border:0 !important;box-shadow:0 10px 26px -12px rgba(20,184,166,.6) !important}
.btn-success:hover,.btn-primary:hover,.btn-order:hover,.btn-info:hover{transform:translateY(-2px);filter:brightness(1.05);color:#061018 !important}
.btn-light,.btn-default,.btn-secondary,.btn-outline-secondary{background:var(--od-surface) !important;border:1px solid var(--od-border2) !important;color:var(--od-text) !important}
.btn-light:hover,.btn-default:hover,.btn-secondary:hover{background:var(--od-surface2) !important;color:var(--od-text) !important;transform:translateY(-2px)}
.btn-danger{background:#ef5b6e !important;border:0 !important;color:#160709 !important}
/* tables */
.table{color:var(--od-text) !important;border-color:var(--od-border) !important}
.table thead th,.table th{color:var(--od-muted) !important;border-color:var(--od-border) !important;background:transparent !important;font-family:var(--od-mono);font-size:.78rem;letter-spacing:.05em;text-transform:uppercase}
.table td,.table tbody td{border-color:var(--od-border) !important;color:var(--od-text) !important}
.table-striped tbody tr:nth-of-type(odd),.table-striped>tbody>tr:nth-child(odd)>td{background:rgba(255,255,255,.02) !important}
.table-curved{border-radius:14px;overflow:hidden}
.table-hover tbody tr:hover td{background:rgba(20,184,166,.08) !important}
/* tabs */
.nav-tabs{border-bottom:1px solid var(--od-border) !important}
.nav-tabs .nav-link,.nav-tabs>li>a{color:var(--od-muted) !important;border:0 !important;background:transparent !important}
.nav-tabs .nav-link.active,.nav-tabs>li.active>a{color:var(--od-text) !important;background:transparent !important;border-bottom:2px solid var(--od-teal) !important}
.nav-pills .nav-link.active{background:var(--od-grad) !important;color:#061018 !important}
/* alerts */
.alert{border-radius:12px !important;border:1px solid var(--od-border2) !important}
.alert-info{background:rgba(56,224,240,.1) !important;color:#bdf0f5 !important}
.alert-success{background:rgba(52,211,153,.1) !important;color:#c4f5df !important}
.alert-warning{background:rgba(255,193,90,.1) !important;color:#ffe4ad !important}
.alert-danger,.alert-error{background:rgba(239,91,110,.12) !important;color:#ffc9d1 !important}
/* misc */
.badge{border-radius:8px}
.breadcrumb{background:transparent !important}
.pagination .page-link{background:var(--od-surface) !important;border:1px solid var(--od-border) !important;color:var(--od-muted) !important}
.pagination .page-item.active .page-link{background:var(--od-grad) !important;border:0 !important;color:#061018 !important}
.modal-content{background:var(--od-bg2) !important;border:1px solid var(--od-border) !important;color:var(--od-text) !important;border-radius:16px}
.modal-header,.modal-footer{border-color:var(--od-border) !important}
.list-group-item{background:var(--od-surface) !important;border-color:var(--od-border) !important;color:var(--od-text) !important}
.dropdown-menu{background:#0b1a24 !important;border:1px solid var(--od-border) !important}
.dropdown-item{color:var(--od-muted) !important}
.dropdown-item:hover{background:var(--od-surface) !important;color:var(--od-text) !important}
.text-primary{color:var(--od-teal) !important}
.text-success{color:var(--od-emerald) !important}
/* FOOTER */
.footer{margin-top:40px}
.footer hr{border-color:var(--od-border)}
.footer p{color:var(--od-faint);font-size:.82rem;line-height:1.7}
.footer a{color:var(--od-muted)}

/* ============================================================
   HOME PAGE ONLY (od- classes exist only on the CMS home page)
   ============================================================ */
.od-hero{padding:70px 0 26px;text-align:center;position:relative}
.od-eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--od-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--od-text);padding:8px 16px;border-radius:999px;background:var(--od-surface);border:1px solid var(--od-border)}
.od-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--od-grad);box-shadow:0 0 10px var(--od-cyan)}
.od-hero h1{font-size:clamp(2.3rem,5.5vw,4rem);font-weight:800;letter-spacing:-.03em;line-height:1.08;margin:22px 0 18px;color:var(--od-text)}
.od-grad-text{background:var(--od-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.od-hero p.lead{font-size:clamp(1.02rem,1.6vw,1.2rem);color:var(--od-muted);max-width:660px;margin:0 auto 30px;line-height:1.7}
.od-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}
.od-btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:.95rem;padding:15px 30px;border-radius:999px;transition:transform .25s,box-shadow .25s;border:0;cursor:pointer}
.od-btn-primary{color:#061018 !important;background:var(--od-grad);box-shadow:0 14px 34px -12px rgba(20,184,166,.6)}
.od-btn-primary:hover{transform:translateY(-3px);color:#061018 !important;box-shadow:0 22px 44px -12px rgba(20,184,166,.75)}
.od-btn-ghost{color:var(--od-text) !important;background:var(--od-surface);border:1px solid var(--od-border2)}
.od-btn-ghost:hover{transform:translateY(-3px);background:var(--od-surface2)}
.od-trust{display:flex;gap:10px 26px;justify-content:center;flex-wrap:wrap;color:var(--od-muted);font-size:.9rem;margin-top:6px}
.od-trust span{display:inline-flex;align-items:center;gap:8px}
.od-trust i{color:var(--od-emerald)}
.od-tlds{margin:34px 0 8px;overflow:hidden;border-top:1px solid var(--od-border);border-bottom:1px solid var(--od-border);padding:16px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.od-tlds .track{display:flex;gap:40px;width:max-content;animation:od-scroll 34s linear infinite;font-family:var(--od-mono);font-weight:700;color:var(--od-faint);font-size:1.05rem;white-space:nowrap}
.od-tlds .track b{color:var(--od-teal);opacity:.85;font-weight:700}
@keyframes od-scroll{to{transform:translateX(-50%)}}
.od-sec{padding:56px 0}
.od-sec-head{text-align:center;max-width:640px;margin:0 auto 40px}
.od-sec-head .k{font-family:var(--od-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--od-teal)}
.od-sec-head h2{font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:800;letter-spacing:-.02em;margin:10px 0 8px;color:var(--od-text)}
.od-sec-head p{color:var(--od-muted);margin:0}
.od-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.od-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.od-feat{position:relative;background:var(--od-surface);border:1px solid var(--od-border);border-radius:18px;padding:28px;overflow:hidden;transition:transform .35s,border-color .35s,background .35s}
.od-feat::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--od-grad);opacity:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transition:opacity .35s}
.od-feat:hover{transform:translateY(-6px);background:var(--od-surface2)}
.od-feat:hover::before{opacity:.9}
.od-feat .ic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:1.45rem;color:#061018;background:var(--od-grad);box-shadow:0 10px 24px -8px rgba(20,184,166,.5);margin-bottom:16px}
.od-feat h3{font-size:1.12rem;font-weight:700;margin:0 0 8px;color:var(--od-text)}
.od-feat p{color:var(--od-muted);font-size:.92rem;margin:0;line-height:1.6}
.od-portal{display:block;height:100%;background:var(--od-surface);border:1px solid var(--od-border);border-radius:18px;padding:30px 24px;text-align:center;transition:transform .35s,border-color .35s,background .35s}
.od-portal:hover{transform:translateY(-6px);border-color:var(--od-border2);background:var(--od-surface2)}
.od-portal i{font-size:2.3rem;color:var(--od-teal);display:block;margin-bottom:14px}
.od-portal h4{color:var(--od-text);font-weight:700;font-size:1.1rem;margin:6px 0 8px}
.od-portal p{color:var(--od-muted);font-size:.9rem;margin:0;line-height:1.6}
.od-ctaband{position:relative;border-radius:24px;padding:56px 40px;text-align:center;overflow:hidden;background:var(--od-grad-soft);border:1px solid var(--od-border2);margin:20px 0}
.od-ctaband h2{font-size:clamp(1.7rem,3.5vw,2.6rem);font-weight:800;margin:12px 0;color:var(--od-text)}
.od-ctaband p{color:var(--od-muted);max-width:520px;margin:0 auto 26px}
.payment-methods-logos{margin:44px auto 10px !important;padding:26px !important;background:var(--od-surface);border:1px solid var(--od-border);border-radius:18px;max-width:820px;align-items:center}
.payment-methods-logos img{width:44px !important;height:44px !important;object-fit:contain;opacity:.95}
.payment-methods-logos span{color:var(--od-muted) !important;width:100%;font-family:var(--od-mono);font-size:.85rem}
@media(max-width:900px){.od-grid,.od-grid4{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.od-grid,.od-grid4{grid-template-columns:1fr}.nav-content .navbar-nav{flex-wrap:wrap}}

/* order: neutralize white globe on .whois search box + order polish */
.whois{background:radial-gradient(320px 220px at 108% -30%,rgba(20,184,166,.16),transparent 62%),var(--od-surface) !important;background-image:radial-gradient(320px 220px at 108% -30%,rgba(20,184,166,.16),transparent 62%) !important;background-repeat:no-repeat !important;border:1px solid var(--od-border) !important;border-radius:16px !important}
.order-nav,.card-steps .completed,.card-steps .active{color:var(--od-teal) !important}
.domain-name,.tld{color:var(--od-text) !important}

/* FIX: home CMS content wrapped in Bootstrap .row - make full-width */
.plugin-cmsclient-main-index .container-md > .row{display:block !important;margin-left:0 !important;margin-right:0 !important}
.plugin-cmsclient-main-index .container-md > .row > *{width:100% !important;max-width:100% !important;flex:none !important;padding-left:0 !important;padding-right:0 !important}
.od-ctaband,.od-ctaband > div,.od-ctaband h2,.od-ctaband p{text-align:center !important}

/* FIX: table striped rows */
.table,.table>tbody,.table>thead,.table>tfoot{background:transparent !important;background-color:transparent !important}
.table>tbody>tr,.table>thead>tr,.table>tbody>tr>td,.table>tbody>tr>th,.table>thead>tr>th,.table th,.table td{background-color:transparent !important;color:var(--od-text) !important;border-color:var(--od-border) !important}
.table-striped>tbody>tr:nth-of-type(odd),.table-striped>tbody>tr:nth-of-type(odd)>td,.table-striped>tbody>tr:nth-of-type(odd)>th,.table-striped tbody tr:nth-of-type(odd),.table-striped tbody tr:nth-of-type(odd) td,.table-striped tbody tr:nth-of-type(odd) th,.table-striped>tbody>tr:nth-of-type(odd)>*{background-color:rgba(255,255,255,.035) !important;color:var(--od-text) !important}
.table-striped>tbody>tr:nth-of-type(odd) a{color:var(--od-cyan) !important}
.table thead th,.table>thead>tr>th{background-color:rgba(255,255,255,.02) !important;color:var(--od-muted) !important}
/* hide redundant page-title bar on HOME only (hero replaces it); keep on inner pages */
.plugin-cmsclient-main-index .title{display:none !important}

/* ============================================================
   FIXES 2026-09-24 22:00 (company 2 only; hostcay untouched)
   ============================================================ */
/* KB page: .card.bg-light was rendering white */
.bg-light{background:var(--od-surface) !important;color:var(--od-text) !important;border:1px solid var(--od-border) !important}
.card-kb,.card-kb *,.categories,.categories a,.categories li{color:var(--od-text)}
.card-kb a,.categories a{color:var(--od-cyan)}

/* Nav: Log In button not vertically centered (touched top line) */
.nav-content .container-md{align-items:center !important}
.nav-content .navbar-nav{align-items:center !important;align-self:center !important;margin-top:0 !important;margin-bottom:0 !important}
.nav-content .navbar-nav:last-child{display:flex !important;align-items:center !important}
.nav-content .navbar-nav:last-child .nav-item{display:flex;align-items:center}
.nav-content .navbar-nav:last-child .nav-link{margin-top:0 !important;margin-bottom:0 !important;align-self:center !important;line-height:1.2}

/* NameSilo domain-management UI (nameservers/whois/contacts/DNS) -> dark, via the module's own CSS vars. Only loads on offshoredomains, so hostcay keeps its light version. */
.ns-module{
  --ns-navy:#0a1622 !important; --ns-navy-soft:#0e2230 !important;
  --ns-accent:#14b8a6 !important; --ns-accent-dark:#0f8f83 !important; --ns-accent-soft:rgba(56,224,240,.10) !important;
  --ns-ink:#e7f2f1 !important; --ns-muted:#9db4b7 !important;
  --ns-line:rgba(120,220,220,.16) !important; --ns-line-soft:rgba(120,220,220,.07) !important;
  --ns-bg:#0a1622 !important; --ns-card:rgba(255,255,255,.045) !important;
  --ns-danger:#ef5b6e !important; --ns-danger-soft:rgba(239,91,110,.14) !important; --ns-amber:#e8a838 !important;
  --ns-shadow:0 10px 30px -18px rgba(0,0,0,.6) !important;
}
.ns-module input,.ns-module select,.ns-module textarea,.ns-module .form-control{background:rgba(0,0,0,.30) !important;color:var(--od-text) !important;border-color:var(--od-border2) !important}
.ns-module input::placeholder{color:var(--od-faint) !important}
.ns-module input:disabled,.ns-module input[readonly]{background:rgba(255,255,255,.03) !important;color:var(--od-muted) !important}
.ns-module table,.ns-module th,.ns-module td{color:var(--od-text) !important;border-color:var(--od-border) !important;background:transparent !important}

/* VPS Reseller API removed from offshoredomains nav (only Domain Reseller API offered) */
.nav-content .dropdown-item[href*="vps_reseller_api"]{display:none !important}

/* Sidemenu / service-manage hover white boxes (tooltips, submenus, list hovers) -> dark */
.tooltip-inner{background:#0b1a24 !important;color:var(--od-text) !important;border:1px solid var(--od-border)}
.tooltip.top .tooltip-arrow,.tooltip .arrow::before,.bs-tooltip-top .arrow::before{border-top-color:#0b1a24 !important}
.list-group-item:hover,.list-group-item-action:hover,.list-group-item.active{background:var(--od-surface2) !important;color:var(--od-text) !important;border-color:var(--od-border) !important}
.nav .open>.dropdown-menu,.submenu,.sub-menu,.tab-content .dropdown-menu{background:#0b1a24 !important;color:var(--od-text) !important}
.popover,.popover-body{background:#0b1a24 !important;color:var(--od-text) !important;border-color:var(--od-border) !important}

/* ===== FIXES 2026-09-24 22:20 ===== */
/* Staff "Return to Portal" badge overlapped the logo -> push to right, style as pill */
.header .container-md .badge{margin-left:auto !important;float:none !important;align-self:center}
.header .badge-info{background:var(--od-grad) !important;border-radius:999px;padding:7px 14px}
.header .badge-info a,.header .badge a{color:#061018 !important;font-weight:700}

/* service-manage left sidemenu: active item was white/unreadable */
.list-group-item.active,a.list-group-item.active,.list-group-item-action.active,.col-md-3 .list-group-item.active,.col-md-3 a.active,.list-group-item.active:hover,.list-group-item.active:focus{background:var(--od-surface2) !important;background-color:var(--od-surface2) !important;color:var(--od-text) !important;border-color:var(--od-border) !important;border-left:3px solid var(--od-teal) !important}
.list-group-item.active *{color:var(--od-text) !important}

/* dashboard count-cards (.card.color) keep their configured theme color + readable text */
.card.color .card-content,.card.color .card-title,.card.color h1,.card.color h2,.card.color h3,.card.color span,.card.color a{color:inherit !important}

/* leftover white boxes (contacts add page, wells, tab content) */
.well,.tab-content>.tab-pane,.contact-details,.tab-content{background:transparent !important;color:var(--od-text)}
.well{background:var(--od-surface) !important;border:1px solid var(--od-border) !important;border-radius:14px}

/* footer KB links */
.footer a{color:var(--od-muted) !important}
.footer a:hover{color:var(--od-cyan) !important}
/* ===== DEFINITIVE sidemenu active fix: beat theme.css `a.list-group-item.active{background:#fae6e1!important}` (0,2,1) with higher specificity (0,3,1) ===== */
.list-group a.list-group-item.active,
.list-group a.list-group-item.active:hover,
.list-group a.list-group-item.active:focus,
.list-group a.list-group-item.list-group-item-action.active,
.col-md-3 .list-group a.list-group-item.active{
  background:var(--od-surface2) !important;
  background-color:var(--od-surface2) !important;
  color:var(--od-text) !important;
  border-color:var(--od-border) !important;
  border-left:3px solid var(--od-teal) !important;
}
.list-group a.list-group-item.active i,.list-group a.list-group-item.active *{color:var(--od-text) !important}
/* ===== KB article rating box: kb.css sets .rate{background-color:#fff} ===== */
.rate{background-color:var(--od-surface) !important;background:var(--od-surface) !important;border:1px solid var(--od-border) !important;border-radius:12px !important;color:var(--od-text) !important}
.rate h5,.rate p,.rate .voted{color:var(--od-text) !important}
.rate a.btn-light{background:var(--od-surface2) !important;border:1px solid var(--od-border2) !important}
.rate a.green,.rate a.green span,.rate a.green i{color:var(--od-emerald) !important}
.rate a.red,.rate a.red span,.rate a.red i{color:#ef5b6e !important}
.rate a:hover{background:rgba(20,184,166,.10) !important}
/* ===== Ticket departments: theme.css colors a.list-group-item + its h4 headings brand-red (#d2032e). Force theme text. ===== */
.list-group a.list-group-item,.list-group a.list-group-item h4,.list-group a.list-group-item h1,.list-group a.list-group-item h2,.list-group a.list-group-item h3,.list-group a.list-group-item h5,.list-group a.list-group-item p,.list-group a.list-group-item .h4{color:var(--od-text) !important}
.list-group a.list-group-item:hover,.list-group a.list-group-item:hover h4{color:var(--od-text) !important;background:var(--od-surface2) !important;background-color:var(--od-surface2) !important}
.list-group a.list-group-item h4{font-weight:700}
/* ============================================================
   Toast UI Editor dark theme (ticket details, replies, etc.)
   Overrides all white backgrounds in application.min.css
   ============================================================ */
.toastui-editor-defaultUI{border:1px solid var(--od-border2) !important;border-radius:12px !important;overflow:hidden;background:var(--od-bg2) !important}
.toastui-editor-defaultUI .ProseMirror,
.toastui-editor-main,.toastui-editor-main-container,.toastui-editor,
.toastui-editor-ww-container,.toastui-editor-md-container,
.toastui-editor-md-preview,.toastui-editor-contents{
  background:var(--od-bg2) !important;background-color:var(--od-bg2) !important;color:var(--od-text) !important;
}
.toastui-editor-contents,.toastui-editor-contents *{color:var(--od-text) !important}
.toastui-editor-contents-placeholder,.toastui-editor .placeholder{color:var(--od-faint) !important}
/* toolbar */
.toastui-editor-defaultUI-toolbar,.toastui-editor-toolbar{background-color:#0b1a24 !important;border-color:var(--od-border) !important}

.toastui-editor-toolbar-divider{background:var(--od-border) !important}
.toastui-editor-toolbar-item-wrapper button:hover{background-color:var(--od-surface2) !important}
/* tabs (Write / Preview) */
.toastui-editor-md-tab-container,.toastui-editor-mode-switch{background:#0b1a24 !important;background-color:#0b1a24 !important;border-color:var(--od-border) !important;color:var(--od-muted) !important}
.toastui-editor-md-tab-container .tab-item,.toastui-editor-mode-switch .tab-item{color:var(--od-muted) !important;background:transparent !important;border-color:var(--od-border) !important}
.toastui-editor-md-tab-container .tab-item.active,.toastui-editor-mode-switch .tab-item.active{color:var(--od-text) !important;background:var(--od-bg2) !important;border-bottom-color:var(--od-teal) !important}
/* popups + dropdowns */
.toastui-editor-popup,.toastui-editor-dropdown-toolbar,.toastui-editor-context-menu{background:#0b1a24 !important;background-color:#0b1a24 !important;color:var(--od-text) !important;border:1px solid var(--od-border) !important}
.toastui-editor-popup input,.toastui-editor-popup textarea,.toastui-editor-popup select,.toastui-editor-popup .toastui-editor-file-name{background:rgba(0,0,0,.30) !important;color:var(--od-text) !important;border:1px solid var(--od-border2) !important}
.toastui-editor-popup label{color:var(--od-muted) !important}
.toastui-editor-close-button,.toastui-editor-file-select-button{background:var(--od-surface2) !important;color:var(--od-text) !important;border:1px solid var(--od-border2) !important}
.toastui-editor-ok-button{background:var(--od-grad) !important;color:#061018 !important;border:0 !important}
/* code blocks + tables inside content */
.toastui-editor-md-code,.toastui-editor-md-code-block-line-background{background:rgba(0,0,0,.30) !important;color:#c4f5df !important}
.toastui-editor-contents pre,.toastui-editor-contents code{background:rgba(0,0,0,.30) !important;color:#c4f5df !important;border:1px solid var(--od-border) !important;border-radius:8px}
.toastui-editor-contents table th,.toastui-editor-contents table td{background:var(--od-surface) !important;color:var(--od-text) !important;border-color:var(--od-border) !important}
.toastui-editor-table-cell{background:var(--od-surface) !important;border-color:var(--od-border) !important}
.toastui-editor-tooltip{background:#0b1a24 !important;color:var(--od-text) !important;border:1px solid var(--od-border)}
/* selection */
.toastui-editor-contents ::selection{background:rgba(20,184,166,.35) !important}
/* ===== FIXES 2026-09-24 22:50 (per Andrei screenshot) ===== */
/* form fields still white - Bootstrap .form-control{background-color:#fff}; force higher specificity + !important */
input.form-control,select.form-control,textarea.form-control,.form-group input.form-control,.form-group select,.form-group textarea,.form-group .form-control,body input.form-control,body select.form-control,body textarea.form-control,body .form-control,body .custom-select{
  background:rgba(0,0,0,.30) !important;background-color:rgba(0,0,0,.30) !important;color:var(--od-text) !important;border:1px solid var(--od-border2) !important;border-radius:10px !important;box-shadow:none !important;
}
body .form-control:focus,body input:focus,body select:focus,body textarea:focus{border-color:var(--od-teal) !important;box-shadow:0 0 0 3px rgba(20,184,166,.18) !important;background:rgba(0,0,0,.36) !important;color:var(--od-text) !important}
body .form-control::placeholder,body input::placeholder,body textarea::placeholder{color:var(--od-faint) !important;opacity:1}
body select.form-control option{background:#0b1a24 !important;color:var(--od-text) !important}

/* dropzone (drag-drop) was white — application.min.css .dropzone{bg:#fff} */
.dropzone,.form-control.dropzone,.form-control.drag-drop,.dropzone.dz-clickable{background:var(--od-surface) !important;background-color:var(--od-surface) !important;border:2px dashed var(--od-border2) !important;color:var(--od-muted) !important;border-radius:12px !important}
.dropzone .dz-message,.dropzone .dz-message *,.dropzone .dz-button{color:var(--od-muted) !important;background:transparent !important;font-weight:600}

/* Toast UI toolbar icons — the icons are a light PNG sprite; the whole toolbar was too dark so icon squares looked "invisible". Give the toolbar row a mid-dark surface so the sprite is visible + subtle bg on icon buttons */
.toastui-editor-defaultUI-toolbar,.toastui-editor-toolbar{background-color:#e7f2f1 !important;border-color:var(--od-border) !important}
.toastui-editor-toolbar-item-wrapper,.toastui-editor-toolbar-group{background-color:transparent !important}
.toastui-editor-defaultUI-toolbar button,.toastui-editor-toolbar-item-wrapper button{background-color:transparent !important;border-radius:6px}
.toastui-editor-defaultUI-toolbar button:hover,.toastui-editor-toolbar-item-wrapper button:hover{background-color:rgba(20,184,166,.20) !important}
.toastui-editor-toolbar-divider{background:rgba(0,0,0,.14) !important}

/* Toast UI bottom mode switch (WYSIWYG | Markdown) was still white/pill-shaped and unreadable */
.toastui-editor-mode-switch{background:#0b1a24 !important;background-color:#0b1a24 !important;color:var(--od-muted) !important;border-top:1px solid var(--od-border) !important}
.toastui-editor-mode-switch .tab-item,.toastui-editor-mode-switch button{background:transparent !important;background-color:transparent !important;color:var(--od-muted) !important;border-color:transparent !important;padding:4px 12px;border-radius:6px}
.toastui-editor-mode-switch .tab-item.active,.toastui-editor-mode-switch button.active{background:var(--od-surface2) !important;background-color:var(--od-surface2) !important;color:var(--od-text) !important}
/* ===== NameSilo module: force text/badges visible on dark ===== */
/* the module used --ns-navy (dark) as TEXT color on light cards. After my dark override, dark text sits on dark card = invisible. Force text to theme text; give badges visible surface. */
.ns-module,.ns-module *:not(.ns-btn-accent):not(.btn):not(.ns-ico){color:var(--od-text) !important}
.ns-module .ns-title,.ns-module h1,.ns-module h2,.ns-module h3,.ns-module h4,.ns-module h5{color:var(--od-text) !important;font-weight:700}
.ns-module .ns-sub,.ns-module .text-muted,.ns-module p,.ns-module label{color:var(--od-muted) !important}
.ns-module a{color:var(--od-cyan) !important}
/* domain-chip (top-right pill) — was dark navy bg + white text; now dark on dark = invisible */
.ns-module .ns-domain-chip,.ns-module .ns-suffix,.ns-module .ns-inline-host{background:var(--od-surface2) !important;background-color:var(--od-surface2) !important;border:1px solid var(--od-border2) !important;color:var(--od-text) !important;border-radius:999px;padding:5px 12px}
.ns-module .ns-domain-chip *,.ns-module .ns-suffix *,.ns-module .ns-inline-host *{color:var(--od-text) !important}
/* pills (type + status badges) — small dark rectangles that vanish; make them visible chips */
.ns-module .ns-pill{background:var(--od-surface2) !important;background-color:var(--od-surface2) !important;border:1px solid var(--od-border2) !important;color:var(--od-text) !important;border-radius:6px;padding:3px 10px;font-weight:700;font-family:var(--od-mono);font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;display:inline-block;min-width:30px;text-align:center}
.ns-module .ns-pill-ok{background:rgba(52,211,153,.18) !important;background-color:rgba(52,211,153,.18) !important;color:#c4f5df !important;border-color:rgba(52,211,153,.35) !important}
/* icon boxes stay teal-soft */
.ns-module .ns-ico{background:rgba(20,184,166,.14) !important;color:var(--od-teal) !important;border-radius:10px}
/* head area gradient (top decorative stripe of cards) — keep visible */
.ns-module .ns-head{background:transparent !important}

/* ns-module: .ns-module .table-responsive{background:#fff} wraps EVERY table + input-row (Email Forwarding, Register NS, Domain Forwarding, Manage Contacts, DNSSEC etc.) */
.ns-module .table-responsive{background:var(--od-surface) !important;background-color:var(--od-surface) !important;border:1px solid var(--od-border) !important;border-radius:12px !important}
.ns-module .odd_row,.ns-module .odd_row td,.ns-module .odd_row th{background:rgba(255,255,255,.03) !important;background-color:rgba(255,255,255,.03) !important;color:var(--od-text) !important}
.ns-module .heading_row,.ns-module .heading_row th,.ns-module .heading_row td{background:transparent !important;background-color:transparent !important;color:var(--od-muted) !important;font-family:var(--od-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}
.ns-module table.table{background:transparent !important;background-color:transparent !important;color:var(--od-text) !important}
.ns-module table.table thead th{background:transparent !important;background-color:transparent !important;color:var(--od-muted) !important;border-color:var(--od-border) !important}
.ns-module table.table tbody td,.ns-module table.table tbody th{background:transparent !important;color:var(--od-text) !important;border-color:var(--od-border) !important}
/* ns-module inputs: .ns-module .form-control{background:#fff} — need specificity + !important */
.ns-module .form-control,.ns-module input[type=text],.ns-module input[type=email],.ns-module input[type=password],.ns-module input[type=number],.ns-module input[type=search],.ns-module select,.ns-module textarea{background:rgba(0,0,0,.30) !important;background-color:rgba(0,0,0,.30) !important;color:var(--od-text) !important;border:1px solid var(--od-border2) !important;border-radius:10px !important}
.ns-module .form-control:focus,.ns-module input:focus,.ns-module select:focus,.ns-module textarea:focus{border-color:var(--od-teal) !important;box-shadow:0 0 0 3px rgba(20,184,166,.18) !important;background:rgba(0,0,0,.36) !important;color:var(--od-text) !important}
.ns-module .form-control::placeholder,.ns-module input::placeholder{color:var(--od-faint) !important;opacity:1}
.ns-module select option{background:#0b1a24 !important;color:var(--od-text) !important}
/* ===== v22: remaining hardcoded-light ns-module surfaces (these are the last white boxes) ===== */
/* .ns-verify-banner uses linear-gradient(180deg,#fff8f1,#fdecee) - light cream box */
.ns-module .ns-verify-banner{background:linear-gradient(180deg,rgba(224,78,90,.16),rgba(224,78,90,.07)) !important;background-color:rgba(224,78,90,.10) !important;border-color:var(--od-border2) !important;border-left-color:#ef5b6e !important;color:var(--od-text) !important}
.ns-module .ns-verify-banner *,.ns-module .ns-verify-banner p,.ns-module .ns-verify-banner strong,.ns-module .ns-verify-banner b,.ns-module .ns-verify-banner span{color:var(--od-text) !important}
/* .ns-vico is a 42x42 grid tile with background:#fff - shows as blank white box */
.ns-module .ns-verify-banner .ns-vico{background:rgba(224,78,90,.18) !important;background-color:rgba(224,78,90,.18) !important;color:#ef5b6e !important;box-shadow:none !important}
.ns-module .ns-verify-banner .btn{background:#ef5b6e !important;background-color:#ef5b6e !important;border-color:#ef5b6e !important;color:#160709 !important}
/* .ns-module .btn-danger uses background:#fff (white outline button) */
.ns-module .btn-danger{background:rgba(224,78,90,.14) !important;background-color:rgba(224,78,90,.14) !important;border:1px solid #ef5b6e !important;color:#ef5b6e !important}
.ns-module .btn-danger:hover{background:#ef5b6e !important;background-color:#ef5b6e !important;color:#160709 !important}
/* remap remaining light vars so anything var-driven also goes dark */
.ns-module{--ns-danger-soft:rgba(224,78,90,.14) !important;--ns-line-soft:rgba(120,220,220,.10) !important}