@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Manrope:wght@400;500;600;700&display=swap');

/* ============================================================================
   Bitcoin Offshore Hosting — WHMCS Twenty-One design system
   Rebuilds the Twenty-One client area to match bitcoinoffshorehosting.com.

   HOW THIS WORKS
   - Auto-loaded LAST by includes/head.tpl via {assetExists file="custom.css"},
     so it wins the cascade over the compiled all.min.css / theme.min.css.
   - Every rule is scoped under `body.boh-whmcs` (class added in header.tpl) so
     third-party module markup is never clobbered by bare-element selectors.
   - No WHMCS core files, no compiled CSS, and no Smarty logic are modified.
   Palette + tokens are documented in whmcs/DESIGN-AUDIT.md.
   ========================================================================== */

:root{
  --boh-bg-primary:#070908;    --boh-bg-secondary:#090C0A;
  --boh-bg-panel:#0D120F;      --boh-bg-elevated:#111713;
  --boh-text-primary:#E8F0EA;  --boh-text-secondary:#B4C0B8;  --boh-text-muted:#8A9A90;
  --boh-accent-terminal:#39FF88; --boh-green-dark:#20C96B;
  --boh-accent-bitcoin:#F7931A;  --boh-orange-hover:#FFAA3B;
  --boh-warning:#FFB020; --boh-danger:#FF4D4D; --boh-success:#39FF88; --boh-info:#39FF88;
  --boh-border:rgba(57,255,136,.12);      --boh-border-strong:rgba(57,255,136,.16);
  --boh-border-btn:rgba(57,255,136,.30);  --boh-border-orange:rgba(247,147,26,.45);
  --boh-tint:rgba(57,255,136,.08);        --boh-tint-2:rgba(57,255,136,.12);
  --boh-tint-orange:rgba(247,147,26,.12);
  --boh-danger-tint:rgba(255,77,77,.12);  --boh-warning-tint:rgba(255,176,32,.12);
  --boh-radius-sm:3px; --boh-radius-md:5px; --boh-radius-lg:6px;
  --boh-shadow-panel:0 0 0 1px rgba(57,255,136,.05),0 10px 34px rgba(0,0,0,.5);
  --boh-container-width:1160px;
  --boh-font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --boh-font-sans:Manrope,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

/* ---------------------------------------------------------------- base */
body.boh-whmcs,
body.boh-whmcs.primary-bg-color{
  background:var(--boh-bg-primary);
  color:var(--boh-text-primary);
  font-family:var(--boh-font-sans);
  -webkit-font-smoothing:antialiased;
}
body.boh-whmcs a{color:var(--boh-accent-terminal);text-decoration:none}
body.boh-whmcs a:hover,body.boh-whmcs a:focus{color:var(--boh-green-dark);text-decoration:none}
body.boh-whmcs img{max-width:100%}
body.boh-whmcs hr{border-top:1px solid var(--boh-border)}
body.boh-whmcs .text-muted{color:var(--boh-text-muted)!important}
body.boh-whmcs .text-secondary{color:var(--boh-text-secondary)!important}
body.boh-whmcs .container{max-width:var(--boh-container-width)}
body.boh-whmcs ::selection{background:rgba(57,255,136,.25);color:#fff}

body.boh-whmcs h1,body.boh-whmcs h2,body.boh-whmcs h3,
body.boh-whmcs h4,body.boh-whmcs h5,body.boh-whmcs h6,
body.boh-whmcs .h1,body.boh-whmcs .h2,body.boh-whmcs .h3,
body.boh-whmcs .h4,body.boh-whmcs .h5,body.boh-whmcs .h6{
  font-family:var(--boh-font-mono);
  color:var(--boh-text-primary);
  letter-spacing:-.02em;
  font-weight:700;
}
body.boh-whmcs .lead{color:var(--boh-text-secondary);font-family:var(--boh-font-sans)}
body.boh-whmcs .page-header h1,body.boh-whmcs .page-header h2{margin-bottom:.35rem}
body.boh-whmcs code,body.boh-whmcs kbd,body.boh-whmcs pre,body.boh-whmcs samp{font-family:var(--boh-font-mono)}
body.boh-whmcs code{color:var(--boh-accent-terminal);background:var(--boh-tint);padding:.1em .4em;border-radius:var(--boh-radius-sm)}
body.boh-whmcs pre{background:var(--boh-bg-panel);border:1px solid var(--boh-border);color:var(--boh-text-secondary);border-radius:var(--boh-radius-md);padding:14px 16px}

/* Keyboard focus — terminal green ring everywhere */
body.boh-whmcs :focus-visible{outline:2px solid var(--boh-accent-terminal);outline-offset:2px}
body.boh-whmcs input::placeholder,body.boh-whmcs textarea::placeholder{color:var(--boh-text-muted)}

/* ---------------------------------------------------- status rail (top) */
body.boh-whmcs .boh-rail{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:8px 40px;background:var(--boh-accent-terminal);color:#070908;
  font:500 11px/1.4 var(--boh-font-mono);flex-wrap:wrap;
}
body.boh-whmcs .boh-rail span{white-space:nowrap}
@media (max-width:680px){body.boh-whmcs .boh-rail{gap:10px;font-size:10px;padding:8px 20px}}

/* ------------------------------------------------------------ header */
body.boh-whmcs #header,body.boh-whmcs .header{background:var(--boh-bg-primary)}
body.boh-whmcs .header .topbar{
  background:var(--boh-bg-secondary);
  border-bottom:1px solid var(--boh-border);
  font-family:var(--boh-font-mono);
}
body.boh-whmcs .header .topbar .btn{color:var(--boh-text-secondary);font-family:var(--boh-font-mono);font-size:12px}
body.boh-whmcs .header .topbar .btn:hover{color:var(--boh-accent-terminal)}
body.boh-whmcs .header .topbar .input-group-text{
  background:transparent;border:0;color:var(--boh-text-muted);
  font-family:var(--boh-font-mono);font-size:11.5px;
}
body.boh-whmcs .btn-active-client{
  color:var(--boh-accent-terminal)!important;font-family:var(--boh-font-mono);font-weight:500;
}
body.boh-whmcs .active-client .btn{color:var(--boh-text-secondary)}
body.boh-whmcs .btn-return-to-admin{
  background:var(--boh-accent-bitcoin);color:#070908!important;border:0;
  font-family:var(--boh-font-mono);font-weight:700;border-radius:var(--boh-radius-sm);
}

/* main navbar rows */
body.boh-whmcs .header .navbar{background:var(--boh-bg-primary);padding-top:14px;padding-bottom:14px}
body.boh-whmcs .header .navbar-brand{padding:0}
body.boh-whmcs .header .navbar-brand .logo-img{height:46px;width:auto}
body.boh-whmcs .main-navbar-wrapper{
  background:var(--boh-bg-primary);
  border-top:1px solid var(--boh-border);
  border-bottom:1px solid var(--boh-border);
  padding-top:0;padding-bottom:0;
}

/* nav links — real Twenty-One markup is `#nav > li > a` / `.navbar-nav > li > a`
   (navbar.tpl emits <li class="d-block"><a class="pr-4">…</a>), NOT .nav-item/.nav-link.
   Target both real structure and .nav-link (toolbar/footer) for full coverage. */
body.boh-whmcs .main-navbar-wrapper .navbar-nav > li > a,
body.boh-whmcs #nav > li > a,
body.boh-whmcs .main-navbar-wrapper .nav-link{
  font-family:var(--boh-font-mono);font-size:12.5px;font-weight:400;
  color:var(--boh-text-secondary);padding-top:14px;padding-bottom:14px;
  border-bottom:2px solid transparent;text-transform:lowercase;
}
body.boh-whmcs .main-navbar-wrapper .navbar-nav > li > a:hover,
body.boh-whmcs #nav > li > a:hover,
body.boh-whmcs .main-navbar-wrapper .nav-link:hover{color:var(--boh-accent-terminal)}
/* terminal ~/ slug prefix on top-level items (not dropdown children) */
body.boh-whmcs .main-navbar-wrapper .navbar-nav > li > a::before{content:"~/";opacity:.5}
/* active page — WHMCS flags the current top-level <li> (or <a>) with .active */
body.boh-whmcs .main-navbar-wrapper .navbar-nav > li.active > a,
body.boh-whmcs #nav > li.active > a,
body.boh-whmcs .main-navbar-wrapper .navbar-nav > li > a.active,
body.boh-whmcs #nav > li > a.active{
  color:var(--boh-accent-terminal);border-bottom-color:var(--boh-accent-terminal);
}
/* dropdown child items keep normal casing, no slug */
body.boh-whmcs .dropdown-menu a{text-transform:none}
body.boh-whmcs .navbar-nav > li > a .badge,body.boh-whmcs .navbar-nav .nav-link .badge{
  background:var(--boh-accent-bitcoin);color:#070908;font-family:var(--boh-font-mono);
}

/* header search */
body.boh-whmcs .header .search .form-control{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border);
  color:var(--boh-text-primary);font-family:var(--boh-font-sans);
}
body.boh-whmcs .header .search .btn{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border);
  border-right:0;color:var(--boh-text-muted);
}
body.boh-whmcs .header .search .form-control:focus{border-color:var(--boh-accent-terminal);box-shadow:none}

/* cart button */
body.boh-whmcs .cart-btn{color:var(--boh-text-secondary)}
body.boh-whmcs .cart-btn:hover{color:var(--boh-accent-terminal)}
body.boh-whmcs .cart-btn .badge,body.boh-whmcs #cartItemCount{
  background:var(--boh-accent-bitcoin);color:#070908;font-family:var(--boh-font-mono);
}
body.boh-whmcs .navbar .btn .fa-bars{color:var(--boh-accent-terminal)}

/* dropdown menus */
body.boh-whmcs .dropdown-menu{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border-strong);
  border-radius:var(--boh-radius-md);box-shadow:var(--boh-shadow-panel);padding:6px 0;
}
body.boh-whmcs .dropdown-item,body.boh-whmcs .dropdown-menu a{color:var(--boh-text-secondary)}
body.boh-whmcs .dropdown-item:hover,body.boh-whmcs .dropdown-menu a:hover{
  background:var(--boh-tint);color:var(--boh-accent-terminal);
}
body.boh-whmcs .dropdown-divider{border-top-color:var(--boh-border)}

/* --------------------------------------------------------- breadcrumb */
body.boh-whmcs .master-breadcrumb{
  background:var(--boh-bg-secondary);border-bottom:1px solid var(--boh-border);
}
body.boh-whmcs .master-breadcrumb .breadcrumb{background:transparent;font-family:var(--boh-font-mono);font-size:12px}
body.boh-whmcs .breadcrumb-item,body.boh-whmcs .breadcrumb-item a{color:var(--boh-text-muted)}
body.boh-whmcs .breadcrumb-item a:hover{color:var(--boh-accent-terminal)}
body.boh-whmcs .breadcrumb-item.active{color:var(--boh-text-secondary)}
body.boh-whmcs .breadcrumb-item + .breadcrumb-item::before{color:var(--boh-text-muted);content:"/"}

/* ------------------------------------------------------------- buttons */
body.boh-whmcs .btn{
  font-family:var(--boh-font-mono);font-weight:500;border-radius:var(--boh-radius-sm);
  letter-spacing:.01em;
}
body.boh-whmcs .btn-primary,
body.boh-whmcs .btn-order,
body.boh-whmcs .btn-checkout{
  background:var(--boh-accent-bitcoin);border-color:var(--boh-accent-bitcoin);
  color:#070908;font-weight:700;
}
body.boh-whmcs .btn-primary:hover,body.boh-whmcs .btn-primary:focus,
body.boh-whmcs .btn-primary:active,body.boh-whmcs .btn-primary.active,
body.boh-whmcs .btn-order:hover,body.boh-whmcs .btn-checkout:hover{
  background:var(--boh-orange-hover);border-color:var(--boh-orange-hover);color:#070908;
}
body.boh-whmcs .btn-primary:disabled,body.boh-whmcs .btn-primary.disabled{background:var(--boh-accent-bitcoin);border-color:var(--boh-accent-bitcoin);opacity:.55}

body.boh-whmcs .btn-secondary,
body.boh-whmcs .btn-default,
body.boh-whmcs .btn-outline-secondary,
body.boh-whmcs .btn-outline-primary{
  background:transparent;border:1px solid var(--boh-border-btn);
  color:var(--boh-accent-terminal);
}
body.boh-whmcs .btn-secondary:hover,body.boh-whmcs .btn-default:hover,
body.boh-whmcs .btn-outline-secondary:hover,body.boh-whmcs .btn-outline-primary:hover,
body.boh-whmcs .btn-secondary:focus,body.boh-whmcs .btn-default:focus{
  background:var(--boh-tint-2);border-color:var(--boh-accent-terminal);color:var(--boh-accent-terminal);
}
body.boh-whmcs .btn-success{background:var(--boh-accent-terminal);border-color:var(--boh-accent-terminal);color:#070908;font-weight:700}
body.boh-whmcs .btn-success:hover{background:var(--boh-green-dark);border-color:var(--boh-green-dark);color:#070908}
body.boh-whmcs .btn-danger{background:var(--boh-danger);border-color:var(--boh-danger);color:#0b0b0b;font-weight:700}
body.boh-whmcs .btn-danger:hover{background:#ff6b6b;border-color:#ff6b6b}
body.boh-whmcs .btn-info{background:transparent;border:1px solid var(--boh-border-btn);color:var(--boh-accent-terminal)}
body.boh-whmcs .btn-info:hover{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .btn-warning{background:var(--boh-warning);border-color:var(--boh-warning);color:#070908}
body.boh-whmcs .btn-link{color:var(--boh-accent-terminal)}
body.boh-whmcs .btn-link:hover{color:var(--boh-green-dark)}

/* --------------------------------------------------------------- cards */
body.boh-whmcs .card{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border-strong);
  border-radius:var(--boh-radius-md);color:var(--boh-text-secondary);
}
body.boh-whmcs .card-header{
  background:var(--boh-bg-elevated);border-bottom:1px solid var(--boh-border);
  color:var(--boh-text-primary);font-family:var(--boh-font-mono);
}
body.boh-whmcs .card-title{color:var(--boh-text-primary);font-family:var(--boh-font-mono);font-weight:700}
body.boh-whmcs .card-body{color:var(--boh-text-secondary)}
body.boh-whmcs .card-footer{background:var(--boh-bg-elevated);border-top:1px solid var(--boh-border);color:var(--boh-text-muted)}
body.boh-whmcs .card-footer a,body.boh-whmcs .card-body a{color:var(--boh-accent-terminal)}

/* accent stripes on dashboard/home cards */
body.boh-whmcs .card-accent-primary{border-top:2px solid var(--boh-accent-bitcoin)}
body.boh-whmcs .card-accent-success,body.boh-whmcs .card-accent-green{border-top:2px solid var(--boh-accent-terminal)}
body.boh-whmcs .card-accent-info{border-top:2px solid var(--boh-accent-terminal)}
body.boh-whmcs .card-accent-warning,body.boh-whmcs .card-accent-gold{border-top:2px solid var(--boh-warning)}
body.boh-whmcs .card-accent-danger,body.boh-whmcs .card-accent-red{border-top:2px solid var(--boh-danger)}

/* generic bg helpers used by WHMCS accents */
body.boh-whmcs .bg-color-blue{background:var(--boh-accent-terminal)!important}
body.boh-whmcs .bg-color-green{background:var(--boh-accent-terminal)!important}
body.boh-whmcs .bg-color-red{background:var(--boh-danger)!important}
body.boh-whmcs .bg-color-gold{background:var(--boh-warning)!important}
body.boh-whmcs .bg-light{background:var(--boh-bg-panel)!important;color:var(--boh-text-secondary)}
body.boh-whmcs .bg-white{background:var(--boh-bg-panel)!important}

/* ----------------------------------------------- dashboard stat tiles */
body.boh-whmcs .tiles .tile{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border-strong);
  border-radius:var(--boh-radius-md);color:var(--boh-text-primary);
  margin:6px;overflow:hidden;position:relative;transition:border-color .18s ease,background .18s ease;
}
body.boh-whmcs .tiles .tile:hover{border-color:var(--boh-border-orange);background:var(--boh-bg-elevated)}
body.boh-whmcs .tiles .tile i{color:var(--boh-accent-terminal)}
body.boh-whmcs .tiles .tile .stat{font-family:var(--boh-font-mono);font-weight:700;color:var(--boh-text-primary)}
body.boh-whmcs .tiles .tile .title{font-family:var(--boh-font-mono);font-size:12px;color:var(--boh-text-muted);text-transform:uppercase;letter-spacing:.04em}
body.boh-whmcs .tiles .tile .highlight{height:3px}

/* --------------------------------------------------------------- forms */
body.boh-whmcs .form-control,
body.boh-whmcs .custom-select,
body.boh-whmcs textarea.form-control{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border);
  color:var(--boh-text-primary);border-radius:var(--boh-radius-sm);
}
body.boh-whmcs .form-control:focus,body.boh-whmcs .custom-select:focus{
  background:var(--boh-bg-panel);border-color:var(--boh-accent-terminal);
  color:var(--boh-text-primary);box-shadow:0 0 0 .12rem rgba(57,255,136,.18);
}
body.boh-whmcs .form-control:disabled,body.boh-whmcs .form-control[readonly]{background:var(--boh-bg-secondary);color:var(--boh-text-muted)}
body.boh-whmcs .form-control-label,body.boh-whmcs label,body.boh-whmcs .control-label{
  color:var(--boh-text-secondary);font-family:var(--boh-font-mono);font-size:12.5px;
}
body.boh-whmcs .input-group-text{
  background:var(--boh-bg-elevated);border:1px solid var(--boh-border);color:var(--boh-text-muted);
}
body.boh-whmcs .input-group-merge .input-group-text{background:var(--boh-bg-panel)}
body.boh-whmcs .custom-control-label{color:var(--boh-text-secondary);font-family:var(--boh-font-sans)}
body.boh-whmcs .custom-control-input:checked ~ .custom-control-label::before{
  background:var(--boh-accent-terminal);border-color:var(--boh-accent-terminal);
}
body.boh-whmcs .custom-control-input:focus ~ .custom-control-label::before{box-shadow:0 0 0 .12rem rgba(57,255,136,.25)}
body.boh-whmcs .form-check-input:checked{background-color:var(--boh-accent-terminal);border-color:var(--boh-accent-terminal)}
/* switches */
body.boh-whmcs .custom-switch .custom-control-input:checked ~ .custom-control-label::after{background:#070908}
body.boh-whmcs .invalid-feedback{color:var(--boh-danger)}
body.boh-whmcs .is-invalid,body.boh-whmcs .form-control.is-invalid{border-color:var(--boh-danger)}
body.boh-whmcs .is-valid,body.boh-whmcs .form-control.is-valid{border-color:var(--boh-accent-terminal)}
body.boh-whmcs .btn-reveal-pw{background:var(--boh-bg-panel);border:1px solid var(--boh-border);color:var(--boh-text-muted)}
body.boh-whmcs .btn-reveal-pw:hover{color:var(--boh-accent-terminal)}

/* password strength */
body.boh-whmcs .password-strength .progress-bar,
body.boh-whmcs #pwstrength .progress-bar{background:var(--boh-accent-terminal)}

/* --------------------------------------------------------------- tables */
body.boh-whmcs .table,
body.boh-whmcs .table-list{color:var(--boh-text-secondary)}
body.boh-whmcs .table thead th,
body.boh-whmcs .table-list thead th{
  background:var(--boh-bg-elevated);color:var(--boh-text-muted);
  border-bottom:1px solid var(--boh-border);border-top:0;
  font-family:var(--boh-font-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;
}
body.boh-whmcs .table td,body.boh-whmcs .table th,
body.boh-whmcs .table-list td,body.boh-whmcs .table-list th{
  border-top:1px solid var(--boh-border);vertical-align:middle;
}
body.boh-whmcs .table-hover tbody tr:hover,
body.boh-whmcs .table-list tbody tr:hover{background:var(--boh-bg-elevated);color:var(--boh-text-primary)}
body.boh-whmcs .table-list tbody tr{cursor:pointer}
body.boh-whmcs .table-striped tbody tr:nth-of-type(odd){background:rgba(255,255,255,.015)}
body.boh-whmcs .table a{color:var(--boh-accent-terminal)}
body.boh-whmcs .table td strong{color:var(--boh-text-primary)}
/* DataTables shell */
body.boh-whmcs .dataTables_wrapper .dataTables_filter input,
body.boh-whmcs .dataTables_wrapper .dataTables_length select{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border);color:var(--boh-text-primary);
}
body.boh-whmcs .dataTables_wrapper .dataTables_info,
body.boh-whmcs .dataTables_wrapper .dataTables_length,
body.boh-whmcs .dataTables_wrapper .dataTables_filter{color:var(--boh-text-muted)}
/* DataTables render (services/invoices/domains/tickets lists) — DataTables' own CSS
   uses high-specificity table.dataTable selectors (white header + striped/hover rows),
   so these need matching specificity + !important. */
body.boh-whmcs table.dataTable thead th,
body.boh-whmcs table.dataTable thead td{
  background:var(--boh-bg-elevated)!important;color:var(--boh-text-muted)!important;
  border-color:var(--boh-border)!important;font-family:var(--boh-font-mono);text-transform:uppercase;font-size:11.5px;
}
body.boh-whmcs table.dataTable tbody tr,
body.boh-whmcs table.dataTable tbody tr.odd,
body.boh-whmcs table.dataTable tbody tr.even,
body.boh-whmcs table.dataTable.stripe tbody tr.odd,
body.boh-whmcs table.dataTable.display tbody tr.odd{background:var(--boh-bg-panel)!important;color:var(--boh-text-secondary)!important}
body.boh-whmcs table.dataTable.stripe tbody tr.even,
body.boh-whmcs table.dataTable.display tbody tr.even{background:var(--boh-bg-secondary)!important}
body.boh-whmcs table.dataTable tbody tr:hover,
body.boh-whmcs table.dataTable.hover tbody tr:hover,
body.boh-whmcs table.dataTable.display tbody tr:hover{background:var(--boh-bg-elevated)!important;color:var(--boh-text-primary)!important}
body.boh-whmcs table.dataTable tbody td,
body.boh-whmcs table.dataTable tbody th{border-color:var(--boh-border)!important}
body.boh-whmcs table.dataTable tbody td a{color:var(--boh-accent-terminal)!important}
body.boh-whmcs table.dataTable tbody strong{color:var(--boh-text-primary)}
/* the ACTUAL culprit: theme.min.css paints the <td> white, not the <tr>.
   Override the exact same td-targeted selectors. */
body.boh-whmcs table.table-list thead th{background-color:var(--boh-bg-elevated)!important;color:var(--boh-text-muted)!important;border-bottom-color:var(--boh-border)!important}
body.boh-whmcs .dataTables_wrapper table.table-list thead th.sorting_asc,
body.boh-whmcs .dataTables_wrapper table.table-list thead th.sorting_desc{background-color:var(--boh-bg-elevated)!important}
body.boh-whmcs .table-list>tbody>tr>td{background-color:var(--boh-bg-panel)!important;color:var(--boh-text-primary)!important;border-color:var(--boh-border)!important}
body.boh-whmcs .table-list>tbody>tr:hover>td{background-color:var(--boh-bg-elevated)!important}
body.boh-whmcs .table-list>tbody>tr>td a{color:var(--boh-accent-terminal)!important}
body.boh-whmcs .table-list>tbody>tr>td .text-muted{color:var(--boh-text-muted)!important}

/* ---------------------------------------- markdown / CodeMirror editor
   (ticket reply, new ticket) — renders a white .CodeMirror box by default. */
body.boh-whmcs .CodeMirror,body.boh-whmcs .editor-preview,body.boh-whmcs .editor-preview-side{
  background:var(--boh-bg-panel)!important;color:var(--boh-text-primary)!important;border-color:var(--boh-border)!important;
}
body.boh-whmcs .CodeMirror-cursor{border-left-color:var(--boh-accent-terminal)!important}
body.boh-whmcs .CodeMirror-selected,body.boh-whmcs .CodeMirror-line::selection{background:rgba(57,255,136,.18)!important}
body.boh-whmcs .CodeMirror-gutters{background:var(--boh-bg-elevated)!important;border-color:var(--boh-border)!important}
body.boh-whmcs .editor-toolbar{background:var(--boh-bg-elevated)!important;border-color:var(--boh-border)!important;opacity:1}
body.boh-whmcs .editor-toolbar a{color:var(--boh-text-secondary)!important}
body.boh-whmcs .editor-toolbar a.active,body.boh-whmcs .editor-toolbar a:hover{background:var(--boh-tint-2)!important;border-color:var(--boh-border)!important;color:var(--boh-accent-terminal)!important}
body.boh-whmcs .editor-toolbar i.separator{border-color:var(--boh-border)}
body.boh-whmcs .editor-toolbar a.fa-search,body.boh-whmcs .editor-toolbar button.preview{color:var(--boh-accent-bitcoin)!important}
body.boh-whmcs .editor-statusbar{color:var(--boh-text-muted)!important}
body.boh-whmcs .CodeMirror-placeholder{color:var(--boh-text-muted)!important}

/* ticket reply header strip stays dark (customer bubble) */
body.boh-whmcs .ticket-reply .posted-by{background:var(--boh-bg-elevated)!important}

/* ----------------------------------------------- status labels / badges */
body.boh-whmcs .label,body.boh-whmcs .badge{
  font-family:var(--boh-font-mono);font-weight:500;border-radius:99px;letter-spacing:.02em;
}
body.boh-whmcs .badge{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .badge-info{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .badge-primary{background:var(--boh-tint-orange);color:var(--boh-accent-bitcoin)}
body.boh-whmcs .badge-success{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .badge-warning{background:var(--boh-warning-tint);color:var(--boh-warning)}
body.boh-whmcs .badge-danger{background:var(--boh-danger-tint);color:var(--boh-danger)}
body.boh-whmcs .badge-secondary{background:rgba(138,154,144,.16);color:var(--boh-text-secondary)}

/* WHMCS status pills — text label always present, colour is secondary signal */
body.boh-whmcs .status{display:inline-block;padding:.28em .8em;border-radius:99px;font-family:var(--boh-font-mono);font-size:11px}
body.boh-whmcs .status-active,body.boh-whmcs .status-paid,body.boh-whmcs .status-completed,
body.boh-whmcs .status-accepted,body.boh-whmcs .status-open{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .status-pending,body.boh-whmcs .status-unpaid,body.boh-whmcs .status-draft,
body.boh-whmcs .status-onhold,body.boh-whmcs .status-awaiting,body.boh-whmcs .status-payment{background:var(--boh-warning-tint);color:var(--boh-warning)}
body.boh-whmcs .status-overdue,body.boh-whmcs .status-suspended,body.boh-whmcs .status-terminated,
body.boh-whmcs .status-cancelled,body.boh-whmcs .status-canceled,body.boh-whmcs .status-fraud,
body.boh-whmcs .status-refunded,body.boh-whmcs .status-collections,body.boh-whmcs .status-expired,
body.boh-whmcs .status-closed,body.boh-whmcs .status-rejected{background:var(--boh-danger-tint);color:var(--boh-danger)}

/* --------------------------------------------------------------- alerts */
body.boh-whmcs .alert{border-radius:var(--boh-radius-md);border:1px solid var(--boh-border);font-family:var(--boh-font-sans)}
body.boh-whmcs .alert-success{background:var(--boh-tint);border-color:rgba(57,255,136,.3);color:var(--boh-text-primary)}
body.boh-whmcs .alert-success .fas,body.boh-whmcs .alert-success .far{color:var(--boh-accent-terminal)}
body.boh-whmcs .alert-info{background:var(--boh-tint);border-color:rgba(57,255,136,.25);color:var(--boh-text-primary)}
body.boh-whmcs .alert-info .fas,body.boh-whmcs .alert-info .far{color:var(--boh-accent-terminal)}
body.boh-whmcs .alert-warning{background:var(--boh-warning-tint);border-color:rgba(255,176,32,.35);color:var(--boh-text-primary)}
body.boh-whmcs .alert-warning .fas,body.boh-whmcs .alert-warning .far{color:var(--boh-warning)}
body.boh-whmcs .alert-danger{background:var(--boh-danger-tint);border-color:rgba(255,77,77,.35);color:var(--boh-text-primary)}
body.boh-whmcs .alert-danger .fas,body.boh-whmcs .alert-danger .far{color:var(--boh-danger)}
body.boh-whmcs .alert a{color:var(--boh-accent-terminal);text-decoration:underline}

/* --------------------------------------------------------- list groups */
body.boh-whmcs .list-group-item{
  background:var(--boh-bg-panel);border-color:var(--boh-border);color:var(--boh-text-secondary);
}
body.boh-whmcs .list-group-item-action:hover{background:var(--boh-bg-elevated);color:var(--boh-text-primary)}
body.boh-whmcs .list-group-item.active{
  background:var(--boh-tint-2);border-color:var(--boh-border-strong);color:var(--boh-accent-terminal);
}
body.boh-whmcs .list-group-item.active .sidebar-menu-item-label{color:var(--boh-accent-terminal)}
body.boh-whmcs .sidebar-menu-item-icon{color:var(--boh-text-muted)}
body.boh-whmcs .list-group-item.active .sidebar-menu-item-icon{color:var(--boh-accent-terminal)}

/* sidebar cards */
body.boh-whmcs .card-sidebar .card-header{background:var(--boh-bg-elevated)}
body.boh-whmcs .card-sidebar .card-title{font-size:14px}
body.boh-whmcs .card-minimise{color:var(--boh-text-muted)}

/* --------------------------------------------------------------- modals */
body.boh-whmcs .modal-content{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border-strong);
  border-radius:var(--boh-radius-lg);box-shadow:var(--boh-shadow-panel);color:var(--boh-text-secondary);
}
body.boh-whmcs .modal-header{border-bottom:1px solid var(--boh-border)}
body.boh-whmcs .modal-footer{border-top:1px solid var(--boh-border)}
body.boh-whmcs .modal-title{color:var(--boh-text-primary);font-family:var(--boh-font-mono)}
body.boh-whmcs .modal .close{color:var(--boh-text-primary);text-shadow:none;opacity:.8}
body.boh-whmcs .modal .close:hover{color:var(--boh-accent-terminal);opacity:1}
body.boh-whmcs .modal-localisation .item-selector .item{
  background:var(--boh-bg-elevated);border:1px solid var(--boh-border);color:var(--boh-text-secondary);
  border-radius:var(--boh-radius-sm);display:block;padding:8px 10px;
}
body.boh-whmcs .modal-localisation .item-selector .item.active,
body.boh-whmcs .modal-localisation .item-selector .item:hover{
  border-color:var(--boh-accent-terminal);color:var(--boh-accent-terminal);background:var(--boh-tint);
}
body.boh-whmcs .modal-backdrop{background:#000}
body.boh-whmcs .modal-backdrop.show{opacity:.7}

/* ------------------------------------------------------ tabs & pills */
body.boh-whmcs .nav-tabs{border-bottom:1px solid var(--boh-border)}
body.boh-whmcs .nav-tabs .nav-link{color:var(--boh-text-muted);font-family:var(--boh-font-mono);border:0;border-bottom:2px solid transparent}
body.boh-whmcs .nav-tabs .nav-link:hover{color:var(--boh-text-primary);border-color:transparent}
body.boh-whmcs .nav-tabs .nav-link.active{
  background:transparent;color:var(--boh-accent-terminal);border-bottom-color:var(--boh-accent-terminal);
}
body.boh-whmcs .nav-pills .nav-link.active{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .tab-content{color:var(--boh-text-secondary)}

/* ------------------------------------------------------- pagination */
body.boh-whmcs .page-link{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border);color:var(--boh-text-secondary);
}
body.boh-whmcs .page-link:hover{background:var(--boh-bg-elevated);color:var(--boh-accent-terminal);border-color:var(--boh-border-strong)}
body.boh-whmcs .page-item.active .page-link{
  background:var(--boh-tint-2);border-color:var(--boh-accent-terminal);color:var(--boh-accent-terminal);
}
body.boh-whmcs .page-item.disabled .page-link{background:var(--boh-bg-secondary);color:var(--boh-text-muted)}

/* --------------------------------------------------------- tooltips */
body.boh-whmcs .tooltip-inner{background:var(--boh-bg-elevated);color:var(--boh-text-primary);font-family:var(--boh-font-mono);font-size:11.5px;border:1px solid var(--boh-border)}
body.boh-whmcs .popover{background:var(--boh-bg-panel);border:1px solid var(--boh-border-strong)}
body.boh-whmcs .popover-body{color:var(--boh-text-secondary)}
body.boh-whmcs .popover-header{background:var(--boh-bg-elevated);color:var(--boh-text-primary);border-bottom-color:var(--boh-border)}

/* progress */
body.boh-whmcs .progress{background:var(--boh-bg-elevated)}
body.boh-whmcs .progress-bar{background:var(--boh-accent-terminal);color:#070908}
body.boh-whmcs .progress-bar.bg-danger{background:var(--boh-danger)}
body.boh-whmcs .progress-bar.bg-warning{background:var(--boh-warning)}

/* ---------------------------------------------- terminal panel helpers
   Reusable BOH terminal look — used on auth cards, dashboard, empty states. */
body.boh-whmcs .boh-terminal{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border-strong);
  border-radius:var(--boh-radius-lg);overflow:hidden;
}
body.boh-whmcs .boh-terminal-bar{
  display:flex;align-items:center;gap:8px;padding:10px 16px;
  background:var(--boh-bg-elevated);border-bottom:1px solid var(--boh-border);
  font:400 11px var(--boh-font-mono);color:var(--boh-text-muted);
}
body.boh-whmcs .boh-dot{width:8px;height:8px;border-radius:50%;display:block}
body.boh-whmcs .boh-dot-r{background:var(--boh-danger)}
body.boh-whmcs .boh-dot-y{background:var(--boh-warning)}
body.boh-whmcs .boh-dot-g{background:var(--boh-accent-terminal)}
body.boh-whmcs .boh-terminal-status{margin-left:auto;color:var(--boh-green-dark);font-size:10.5px}
body.boh-whmcs .boh-prompt{color:var(--boh-accent-terminal);font-family:var(--boh-font-mono)}
body.boh-whmcs .boh-eyebrow{font:500 12px var(--boh-font-mono);color:var(--boh-text-muted);letter-spacing:.06em;margin-bottom:6px}
body.boh-whmcs .boh-terminal-summary-body{padding:13px 16px;font:400 12.5px var(--boh-font-mono);color:var(--boh-text-muted)}
body.boh-whmcs .boh-terminal-summary-body b{color:var(--boh-accent-terminal);font-weight:700}

/* ------------------------------------------------------- auth pages */
body.boh-whmcs .login-form .card,
body.boh-whmcs .register-form .card{
  background:var(--boh-bg-panel);border:1px solid var(--boh-border-strong);
  box-shadow:var(--boh-shadow-panel);
}
body.boh-whmcs .login-form .card-footer,
body.boh-whmcs .register-form .card-footer{background:var(--boh-bg-elevated)}

/* -------------------------------------------- OAuth standalone shell */
body.boh-whmcs section#header{background:var(--boh-bg-primary);border-bottom:1px solid var(--boh-border);padding:16px 0}
body.boh-whmcs section#header .logo-img{height:40px;width:auto}
body.boh-whmcs section#content{background:transparent}
body.boh-whmcs section#content .panel,
body.boh-whmcs section#content .card,
body.boh-whmcs section#content > .container > *{color:var(--boh-text-secondary)}
body.boh-whmcs section#footer{background:var(--boh-bg-secondary);border-top:1px solid var(--boh-border);color:var(--boh-text-muted);font-family:var(--boh-font-mono);font-size:11.5px}

/* ---------------------------------------------------- footer (chrome) */
body.boh-whmcs #footer,body.boh-whmcs .footer{
  background:var(--boh-bg-primary);border-top:1px solid var(--boh-border-strong);
  color:var(--boh-text-muted);padding-top:52px;padding-bottom:24px;
}
body.boh-whmcs .boh-footer-grid{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:32px;
}
body.boh-whmcs .boh-footer-brand img{height:44px;width:auto;display:block;margin-bottom:16px}
body.boh-whmcs .boh-footer-tag{margin:0 0 14px;font:400 13.5px/1.65 var(--boh-font-sans);color:var(--boh-text-muted);max-width:34ch}
body.boh-whmcs .boh-footer-meta{margin:0;font:400 11.5px/1.9 var(--boh-font-mono);color:var(--boh-text-muted)}
body.boh-whmcs .boh-footer-meta .btc{color:var(--boh-accent-bitcoin)}
body.boh-whmcs .boh-footer-meta .kyc{color:var(--boh-accent-terminal)}
body.boh-whmcs .boh-footer-col h2{margin:0 0 14px;font:700 11.5px var(--boh-font-mono);color:var(--boh-text-primary);letter-spacing:.06em;text-transform:uppercase}
body.boh-whmcs .boh-footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;font:400 13px var(--boh-font-sans)}
body.boh-whmcs .boh-footer-col a{color:var(--boh-text-secondary)}
body.boh-whmcs .boh-footer-col a:hover{color:var(--boh-accent-terminal)}
body.boh-whmcs .boh-footer-bottom{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  margin-top:40px;padding-top:20px;border-top:1px solid var(--boh-border);flex-wrap:wrap;
}
body.boh-whmcs .boh-footer-bottom,body.boh-whmcs .footer .copyright{
  font:400 11.5px var(--boh-font-mono);color:var(--boh-text-muted);margin:0;
}
body.boh-whmcs .boh-footer-bottom .links{display:flex;gap:20px;flex-wrap:wrap}
body.boh-whmcs .boh-footer-bottom a{color:var(--boh-text-muted)}
body.boh-whmcs .boh-footer-bottom a:hover{color:var(--boh-accent-terminal)}
body.boh-whmcs .footer .nav-link{color:var(--boh-text-secondary);font-family:var(--boh-font-mono);font-size:12px}
body.boh-whmcs .footer .nav-link:hover{color:var(--boh-accent-terminal)}
body.boh-whmcs .footer .iti-flag{margin-right:4px}

/* -------------------------------------------------- order form / store
   The order-form all.min.css uses ID selectors (#order-standard_cart .products
   .product{background:#fff}) that outrank class selectors, so these use the same
   #id scope + !important. The cart's own custom.css may not load on every store
   route, so the full store theme lives here in the always-loaded template CSS.
   ($carttpl wrapper id stays "order-standard_cart" regardless of folder name.) */
body.boh-whmcs #order-standard_cart .products .product,
body.boh-whmcs .packages .package,
body.boh-whmcs .cart .product{
  background:var(--boh-bg-panel)!important;border:1px solid var(--boh-border-strong)!important;
  border-radius:var(--boh-radius-md)!important;color:var(--boh-text-secondary)!important;
}
body.boh-whmcs #order-standard_cart .products .product:hover{border-color:var(--boh-border-orange)!important;background:var(--boh-bg-elevated)!important}
body.boh-whmcs .packages .package.featured,
body.boh-whmcs #order-standard_cart .product.featured{background:var(--boh-bg-elevated)!important;border-color:var(--boh-border-orange)!important}
/* product card text — headers, feature list, descriptions all light */
body.boh-whmcs #order-standard_cart .product h1,body.boh-whmcs #order-standard_cart .product h2,
body.boh-whmcs #order-standard_cart .product h3,body.boh-whmcs #order-standard_cart .product .product-name{color:var(--boh-text-primary)!important;font-family:var(--boh-font-mono)}
body.boh-whmcs #order-standard_cart .product,
body.boh-whmcs #order-standard_cart .product-desc,
body.boh-whmcs #order-standard_cart .product-desc *,
body.boh-whmcs #order-standard_cart .feature-value,
body.boh-whmcs #order-standard_cart .product li{color:var(--boh-text-secondary)!important}
body.boh-whmcs #order-standard_cart .product .price,
body.boh-whmcs #order-standard_cart .font-size-36,
body.boh-whmcs .packages .package .price,
body.boh-whmcs .cartbox .amount{color:var(--boh-accent-bitcoin)!important;font-family:var(--boh-font-mono);font-weight:700}
body.boh-whmcs .summary-container,body.boh-whmcs .order-summary{background:var(--boh-bg-panel)!important;border:1px solid var(--boh-border-strong)}

/* --- configure page: product-info preview box (theme.css paints it white) --- */
body.boh-whmcs #order-standard_cart .product-info{
  background:var(--boh-bg-panel)!important;border:1px solid var(--boh-border-strong)!important;border-radius:var(--boh-radius-md)!important;
}
body.boh-whmcs #order-standard_cart .product-info,
body.boh-whmcs #order-standard_cart .product-info *{color:var(--boh-text-secondary)!important}
body.boh-whmcs #order-standard_cart .product-title{color:var(--boh-text-primary)!important;font-family:var(--boh-font-mono);font-weight:700}

/* --- domain registration / TLD pricing --- */
body.boh-whmcs .domain-checker-bg,body.boh-whmcs .domain-checker-container{
  background:var(--boh-bg-panel)!important;border:1px solid var(--boh-border-strong)!important;border-radius:var(--boh-radius-lg)!important;
  background-image:radial-gradient(ellipse 70% 120% at 50% 0%,rgba(57,255,136,.08),transparent 70%)!important;
}
body.boh-whmcs .domain-checker-result-headline,body.boh-whmcs .domain-checker-container h1,body.boh-whmcs .domain-checker-container h2{color:var(--boh-text-primary)!important}
body.boh-whmcs .tld-pricing-header{color:var(--boh-text-muted)!important;font-family:var(--boh-font-mono);border-bottom:1px solid var(--boh-border)!important;background:var(--boh-bg-elevated)!important}
body.boh-whmcs .tld-row,body.boh-whmcs .tld-row *{color:var(--boh-text-secondary)!important;background:transparent!important}
body.boh-whmcs .tld-row{border-bottom:1px solid var(--boh-border)!important}
body.boh-whmcs .tld-row:hover{background:var(--boh-bg-elevated)!important}
body.boh-whmcs .tld-row .price,body.boh-whmcs .tld-row .price *,body.boh-whmcs .domain-price{color:var(--boh-accent-bitcoin)!important;font-family:var(--boh-font-mono)}
body.boh-whmcs .featured-tld,body.boh-whmcs .spotlight-tld,body.boh-whmcs .featured-tlds-container .tld-column>*{
  background:var(--boh-bg-elevated)!important;border:1px solid var(--boh-border)!important;border-radius:var(--boh-radius-md)!important;color:var(--boh-text-secondary)!important;
}
body.boh-whmcs .featured-tld .extension,body.boh-whmcs .spotlight-tld .extension{color:var(--boh-text-primary)!important;font-family:var(--boh-font-mono)}
body.boh-whmcs .featured-tld .price,body.boh-whmcs .spotlight-tld .price{color:var(--boh-accent-bitcoin)!important}
body.boh-whmcs .domain-promo-box{background:var(--boh-bg-elevated)!important;border:1px solid var(--boh-border)!important;color:var(--boh-text-secondary)!important}
body.boh-whmcs .domain-lookup-result,body.boh-whmcs .domain-suggestion{background:var(--boh-bg-panel)!important;border-color:var(--boh-border)!important;color:var(--boh-text-secondary)!important}

/* misc money/price emphasis used across billing */
body.boh-whmcs .invoice-amount,body.boh-whmcs .total-due,body.boh-whmcs .balance{color:var(--boh-accent-bitcoin);font-family:var(--boh-font-mono)}

/* jumbotron / homepage hero used by some pages */
body.boh-whmcs .jumbotron{background:var(--boh-bg-panel);border:1px solid var(--boh-border);border-radius:var(--boh-radius-lg)}

/* well / panel legacy */
body.boh-whmcs .well,body.boh-whmcs .panel{background:var(--boh-bg-panel);border:1px solid var(--boh-border);color:var(--boh-text-secondary)}
body.boh-whmcs .panel-heading{background:var(--boh-bg-elevated);border-bottom:1px solid var(--boh-border);color:var(--boh-text-primary)}

/* ===================================================================
   DEEP TERMINAL CHROME — makes every panel read as a terminal window,
   mirroring the website's signature "traffic-light" panels. Applied to
   card/panel headers with left padding so header content never overlaps
   the dots (robust even for module headers without .card-title).
   =================================================================== */
body.boh-whmcs .card > .card-header,
body.boh-whmcs .panel > .panel-heading{position:relative;padding-left:58px}
body.boh-whmcs .card > .card-header::before,
body.boh-whmcs .panel > .panel-heading::before{
  content:"";position:absolute;left:20px;top:50%;transform:translateY(-50%);
  width:7px;height:7px;border-radius:50%;background:var(--boh-danger);
  box-shadow:12px 0 0 var(--boh-warning),24px 0 0 var(--boh-accent-terminal);
}
/* keep the sidebar minimise chevron and any right-floated header button clear */
body.boh-whmcs .card-sidebar .card-header .card-minimise{color:var(--boh-text-muted)}

/* (eyebrow text is authored per-instance in the templates, incl. its own prompt) */

/* `>` prefix on the signature call-to-action buttons (text buttons only) */
body.boh-whmcs #login::before,
body.boh-whmcs .btn-order-now::before,
body.boh-whmcs .btn-checkout::before,
body.boh-whmcs .btn.btn-primary.btn-block::before{content:"> "}

/* -------------------------------------------------- button text guard
   Contextual link rules like `.card-body a` (0,3,1) would otherwise override a
   button's text colour when a .btn sits inside a card/table/alert. These
   two-class selectors (0,3,1) placed late in the file reclaim button colours in
   every container. Keep this block AFTER all contextual `a{}` rules. */
body.boh-whmcs .btn.btn-primary,body.boh-whmcs .btn.btn-success,
body.boh-whmcs .btn.btn-danger,body.boh-whmcs .btn.btn-warning,
body.boh-whmcs .btn.btn-order,body.boh-whmcs .btn.btn-checkout{color:#070908}
body.boh-whmcs .btn.btn-primary:hover,body.boh-whmcs .btn.btn-success:hover,
body.boh-whmcs .btn.btn-danger:hover,body.boh-whmcs .btn.btn-warning:hover{color:#070908}
body.boh-whmcs .btn.btn-secondary,body.boh-whmcs .btn.btn-default,
body.boh-whmcs .btn.btn-info,body.boh-whmcs .btn.btn-link,
body.boh-whmcs .btn.btn-outline-secondary,body.boh-whmcs .btn.btn-outline-primary{color:var(--boh-accent-terminal)}
/* header search button keeps its muted look (higher-specificity context rule) */

/* ===================================================================
   DETAIL PAGES — view ticket / view service / view invoice
   =================================================================== */

/* --- support ticket conversation --- */
body.boh-whmcs .view-ticket .card-title{font-family:var(--boh-font-mono)}
body.boh-whmcs .ticket-reply{
  border-left:3px solid var(--boh-text-muted);background:var(--boh-bg-panel);
  border-radius:0 var(--boh-radius-sm) var(--boh-radius-sm) 0;margin-bottom:2px;
}
body.boh-whmcs .ticket-reply.staff{
  border-left-color:var(--boh-accent-terminal);background:var(--boh-bg-elevated);
}
body.boh-whmcs .ticket-reply .posted-by{
  padding:10px 16px;border-bottom:1px solid var(--boh-border);
  font:400 12px var(--boh-font-mono);color:var(--boh-text-muted);
}
body.boh-whmcs .ticket-reply .posted-by-name{color:var(--boh-text-primary);font-weight:700}
body.boh-whmcs .ticket-reply.staff .posted-by-name{color:var(--boh-accent-terminal)}
body.boh-whmcs .ticket-reply .posted-on{color:var(--boh-text-muted)}
body.boh-whmcs .ticket-reply .message{color:var(--boh-text-secondary);line-height:1.7}
body.boh-whmcs .requestor-badge{
  font-family:var(--boh-font-mono);font-size:10.5px;border-radius:99px;padding:.28em .8em;
  background:rgba(138,154,144,.16);color:var(--boh-text-secondary);
}
body.boh-whmcs .requestor-type-client,body.boh-whmcs .requestor-type-owner{background:var(--boh-tint-orange);color:var(--boh-accent-bitcoin)}
body.boh-whmcs .requestor-type-admin,body.boh-whmcs .requestor-type-operator{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .ticket-reply .attachments{border-top:1px solid var(--boh-border);color:var(--boh-text-muted)}
body.boh-whmcs .attachment-list a{color:var(--boh-accent-terminal)}
body.boh-whmcs .rating .star,body.boh-whmcs .rating-done .star{color:var(--boh-text-muted)}
body.boh-whmcs .rating-done .star.active{color:var(--boh-warning)}

/* --- new ticket: terminal department menu --- */
body.boh-whmcs .boh-dept-item{
  display:flex;align-items:center;gap:14px;padding:16px 18px;margin-bottom:10px;
  background:var(--boh-bg-elevated);border:1px solid var(--boh-border);
  border-left:2px solid var(--boh-border-strong);border-radius:var(--boh-radius-sm);
  color:var(--boh-text-secondary);transition:border-color .18s ease,background .18s ease;
}
body.boh-whmcs .boh-dept-item:hover{border-color:var(--boh-border-orange);border-left-color:var(--boh-accent-terminal);background:var(--boh-bg-panel)}
body.boh-whmcs .boh-dept-name{font:700 14px var(--boh-font-mono);color:var(--boh-text-primary);white-space:nowrap}
body.boh-whmcs .boh-dept-item:hover .boh-dept-name{color:var(--boh-accent-terminal)}
body.boh-whmcs .boh-dept-desc{font:400 13px var(--boh-font-sans);color:var(--boh-text-muted)}
body.boh-whmcs .boh-dept-go{margin-left:auto;font:700 20px var(--boh-font-mono);color:var(--boh-accent-bitcoin)}
@media (max-width:576px){body.boh-whmcs .boh-dept-item{flex-wrap:wrap;gap:6px}body.boh-whmcs .boh-dept-go{display:none}}

/* --- view service (product details) --- */
body.boh-whmcs .product-status{
  background:var(--boh-bg-elevated);border:1px solid var(--boh-border);
  border-radius:var(--boh-radius-md);padding:22px;text-align:center;
}
body.boh-whmcs .product-status .product-icon .fa-stack .fa-circle{color:var(--boh-bg-panel)}
body.boh-whmcs .product-status .product-icon .fa-stack-1x{color:var(--boh-accent-terminal)}
body.boh-whmcs .product-status h3{font-family:var(--boh-font-mono);color:var(--boh-text-primary);margin-top:10px}
body.boh-whmcs .product-status h4{font-family:var(--boh-font-mono);color:var(--boh-text-muted);font-size:13px}
body.boh-whmcs .product-status-text{
  margin-top:12px;display:inline-block;font-family:var(--boh-font-mono);font-size:12px;
  padding:.3em 1em;border-radius:99px;
}
body.boh-whmcs .product-status-active .product-status-text{background:var(--boh-tint-2);color:var(--boh-accent-terminal)}
body.boh-whmcs .product-status-active .product-icon .fa-stack-1x{color:var(--boh-accent-terminal)}
body.boh-whmcs .product-status-pending .product-status-text{background:var(--boh-warning-tint);color:var(--boh-warning)}
body.boh-whmcs .product-status-pending .product-icon .fa-stack-1x{color:var(--boh-warning)}
body.boh-whmcs .product-status-suspended .product-status-text,
body.boh-whmcs .product-status-terminated .product-status-text,
body.boh-whmcs .product-status-cancelled .product-status-text,
body.boh-whmcs .product-status-fraud .product-status-text{background:var(--boh-danger-tint);color:var(--boh-danger)}
body.boh-whmcs .product-status-suspended .product-icon .fa-stack-1x,
body.boh-whmcs .product-status-terminated .product-icon .fa-stack-1x,
body.boh-whmcs .product-status-cancelled .product-icon .fa-stack-1x{color:var(--boh-danger)}

/* --- view invoice (standalone document) --- */
body.boh-whmcs .invoice-container{background:var(--boh-bg-primary);color:var(--boh-text-secondary);padding:28px}
body.boh-whmcs .invoice-header h2,body.boh-whmcs .invoice-header h3{font-family:var(--boh-font-mono);color:var(--boh-text-primary)}
body.boh-whmcs .invoice-container address,body.boh-whmcs .invoice-container .small-text{color:var(--boh-text-secondary)}
body.boh-whmcs .invoice-container strong{color:var(--boh-text-primary)}
body.boh-whmcs .invoice-container hr{border-top-color:var(--boh-border)}
body.boh-whmcs .invoice-status span{
  display:inline-block;font-family:var(--boh-font-mono);font-weight:700;font-size:15px;
  padding:.35em 1.1em;border-radius:99px;border:1px solid transparent;text-transform:uppercase;letter-spacing:.04em;
}
body.boh-whmcs .invoice-status .paid{background:var(--boh-tint-2);color:var(--boh-accent-terminal);border-color:rgba(57,255,136,.3)}
body.boh-whmcs .invoice-status .unpaid,body.boh-whmcs .invoice-status .draft{background:var(--boh-warning-tint);color:var(--boh-warning);border-color:rgba(255,176,32,.35)}
body.boh-whmcs .invoice-status .refunded,body.boh-whmcs .invoice-status .cancelled,body.boh-whmcs .invoice-status .collections{background:var(--boh-danger-tint);color:var(--boh-danger);border-color:rgba(255,77,77,.35)}
body.boh-whmcs .invoice-container .total-row{border-top:1px solid var(--boh-border);font-family:var(--boh-font-mono)}
body.boh-whmcs .invoice-container .total-row strong{color:var(--boh-accent-bitcoin)}
body.boh-whmcs .invoice-container .table td{border-color:var(--boh-border)}

/* --- homepage nav shortcut cards (.action-icon-btns > a.card-accent-*) ---
   These are <a> tiles, NOT .card, so theme.css `.action-icon-btns a{background:#fff}`
   applied. Same class scope + one extra class beats it (no !important needed, but kept
   for safety against the accent rules). */
body.boh-whmcs .action-icon-btns a{
  background:var(--boh-bg-panel)!important;border:1px solid var(--boh-border-strong)!important;
  color:var(--boh-text-secondary)!important;border-radius:var(--boh-radius-md);transition:border-color .18s ease,background .18s ease;
}
body.boh-whmcs .action-icon-btns a:hover{background:var(--boh-bg-elevated)!important;border-color:var(--boh-border-orange)!important}
body.boh-whmcs .action-icon-btns a i,body.boh-whmcs .action-icon-btns a .fas,body.boh-whmcs .action-icon-btns a .far{color:var(--boh-text-muted)!important}
body.boh-whmcs .action-icon-btns a:hover i{color:var(--boh-accent-terminal)!important}
body.boh-whmcs .action-icon-btns a h3,body.boh-whmcs .action-icon-btns a .title,body.boh-whmcs .action-icon-btns a span{color:var(--boh-accent-terminal)!important;font-family:var(--boh-font-mono)}

/* hide the "Powered by WHMCompleteSolution" line (requires a branded/owned WHMCS license) */
body.boh-whmcs .primary-content > p:has(> a[href*="whmcs.com"]),
body.boh-whmcs .primary-content > p:has(a[href*="whmcs.com"]){display:none!important}

/* ------------------------------------------------- responsive footer */
@media (max-width:992px){
  body.boh-whmcs .boh-footer-grid{grid-template-columns:1fr 1fr;gap:26px}
}
@media (max-width:680px){
  body.boh-whmcs .boh-footer-grid{grid-template-columns:1fr;gap:22px}
  body.boh-whmcs #footer,body.boh-whmcs .footer{padding-left:20px;padding-right:20px}
  body.boh-whmcs .boh-footer-bottom{flex-direction:column;align-items:flex-start;gap:10px}
}

/* --------------------------------------- responsive data tables (stack) */
@media (max-width:576px){
  body.boh-whmcs .table-responsive-stack thead{display:none}
  body.boh-whmcs .table-responsive-stack tbody tr{display:block;margin-bottom:12px;border:1px solid var(--boh-border);border-radius:var(--boh-radius-md)}
  body.boh-whmcs .table-responsive-stack tbody td{display:flex;justify-content:space-between;border:0;border-bottom:1px solid var(--boh-border)}
  body.boh-whmcs .table-responsive-stack tbody td:last-child{border-bottom:0}
}

/* ------------------------------------------------------ reduced motion */
@media (prefers-reduced-motion:reduce){
  body.boh-whmcs *,body.boh-whmcs *::before,body.boh-whmcs *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* =========================================================================
   PRINT — invoices & quotes must be readable on white paper, ink-friendly.
   Overrides the dark theme for the printable content only.
   ========================================================================= */
@media print{
  body.boh-whmcs,body.boh-whmcs.primary-bg-color{background:#fff!important;color:#111!important}
  body.boh-whmcs .boh-rail,body.boh-whmcs #header,body.boh-whmcs .header,
  body.boh-whmcs #footer,body.boh-whmcs .footer,body.boh-whmcs .master-breadcrumb,
  body.boh-whmcs .sidebar,body.boh-whmcs .btn,body.boh-whmcs .no-print{display:none!important}
  body.boh-whmcs .card,body.boh-whmcs .table,body.boh-whmcs .invoice-container,
  body.boh-whmcs .modal-content{background:#fff!important;color:#111!important;border-color:#ccc!important;box-shadow:none!important}
  body.boh-whmcs .card-header,body.boh-whmcs .table thead th{background:#f2f2f2!important;color:#111!important}
  body.boh-whmcs .table td,body.boh-whmcs .table th{border-color:#ccc!important;color:#111!important}
  body.boh-whmcs h1,body.boh-whmcs h2,body.boh-whmcs h3,body.boh-whmcs h4,body.boh-whmcs .card-title{color:#111!important}
  body.boh-whmcs a{color:#111!important;text-decoration:none}
  body.boh-whmcs .status,body.boh-whmcs .label,body.boh-whmcs .badge{border:1px solid #999!important;color:#111!important;background:#fff!important}
  body.boh-whmcs .invoice-amount,body.boh-whmcs .total-due,body.boh-whmcs .amount{color:#111!important}
  /* standalone invoice: white paper, ink-friendly */
  body.boh-whmcs .invoice-container{background:#fff!important;color:#111!important;padding:0!important}
  body.boh-whmcs .invoice-container strong,body.boh-whmcs .invoice-container address,
  body.boh-whmcs .invoice-container .small-text,body.boh-whmcs .invoice-header h2,
  body.boh-whmcs .invoice-header h3,body.boh-whmcs .invoice-container .total-row strong{color:#111!important}
  body.boh-whmcs .invoice-status span{background:#fff!important;color:#111!important;border:1px solid #999!important}
  body.boh-whmcs .invoice-container hr,body.boh-whmcs .invoice-container .total-row,
  body.boh-whmcs .invoice-container .table td{border-color:#ccc!important}
}