/* ==========================================================
   MEBUD CLOUD — CUSTOM.DARK.CSS (Client + Cart + Editor)
   Unifies colors, fixes dropdown z-index, cart readability,
   and makes Markdown editor input text black on white.
   ========================================================== */

/* System */
:root { color-scheme: dark; scrollbar-color: #2a3750 #0b0f16; }

/* Brand & palette */
:root{
  --bg:#0f1a25; --surface:#121420; --surface-2:#0b0f16; --surface-3:#151a28;
  --line:#1b2030; --focus:#2a3750; --shadow:0 10px 30px rgba(0,0,0,.35);
  --brand:#5fd1a9; --brand2:#6cb1ff; --on-brand:#0b0d12;

  --ink-strong:#d9efff; --ink:#dbe7f4; --ink-soft:#cfd6e3;
  --ink-muted:#9aa3b2; --ink-dim:#8190a6;
  --link:#6cb1ff; --link-hover:#8fc6ff;

  --ok:#24c58a; --ok-ink:#bff5e3;
  --warn:#e5b96b; --warn-ink:#ffe0a8;
  --bad:#ff7d7d;  --bad-ink:#ffd9d9;

  --mono-ink:#d6f0ff;
}

/* Base */
html,body{background:var(--bg)!important;color:var(--ink)!important}
*{box-sizing:border-box}
h1,h2,h3,h4,h5,h6{color:var(--ink-strong)!important;margin-top:0}
p,li,td,th{color:var(--ink)!important}
small,.text-muted,.muted,.help-block{color:var(--ink-muted)!important}
a{color:var(--link)!important;text-decoration:none}
a:hover{color:var(--link-hover)!important;opacity:.95}

/* Layout wrappers */
.container,.content-padded,.main-content,.main-body,.page-content,.section,.client-home-panels{
  background:transparent!important;color:var(--ink)!important;
}

/* Header/Footers */
.navbar,.navbar-default,.header,.topbar,.client-header,.footer{
  background:rgba(11,15,22,.85)!important; backdrop-filter:blur(8px);
  border-color:var(--line)!important; color:var(--ink)!important;
}
.navbar .navbar-nav>li>a,.navbar a,.dropdown-toggle{color:var(--ink)!important}

/* ===== NAV DROPDOWNS — ALWAYS ON TOP (z-index & overflow) ===== */
.navbar,
.navbar-main,
.client-header,
.header,
.navbar.navbar-fixed-top {
  position: relative;
  z-index: 5000 !important;
}
/* Prevent clipping by containers */
.navbar .container,
.navbar-main .container,
.client-header .container,
.navbar-collapse,
.navbar-nav {
  overflow: visible !important;
}
/* Menus above everything */
.navbar .dropdown-menu,
.navbar-main .dropdown-menu,
.client-header .dropdown-menu,
.header .dropdown-menu {
  z-index: 6000 !important;
  position: absolute !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.35) !important;
}
/* BS3 (.open) and BS4/5 (.show) */
.navbar .dropdown.open .dropdown-menu,
.navbar .dropdown.show .dropdown-menu,
.navbar-main .dropdown.open .dropdown-menu,
.navbar-main .dropdown.show .dropdown-menu,
.client-header .dropdown.open .dropdown-menu,
.client-header .dropdown.show .dropdown-menu { z-index: 6000 !important; }
/* Any large wrappers that might clip */
[id^="order-"], .main-content, .page-content, .content-padded,
.client-home-panels, .banner, .hero { overflow: visible !important; }
/* Keep panels below nav */
.panel, .card, .tile, .order-summary, .view-cart, .cart-sidebar, .cart-summary {
  position: relative; z-index: 1;
}

/* Cards / Panels / Tiles */
.card,.panel,.panel-default,.well,.list-group-item,
.order-summary,.product,.tile,.kb-article,.logincontainer,.announcement,.news-item{
  background:var(--surface)!important;color:var(--ink)!important;
  border:1px solid var(--line)!important;border-radius:14px;box-shadow:var(--shadow)
}
.card-header,.panel-heading,h3.panel-title,.order-heading,.cart-tabs{
  background:var(--surface-2)!important;color:var(--ink-strong)!important;border-color:var(--line)!important;
  border-top-left-radius:14px;border-top-right-radius:14px
}

/* Buttons */
.btn{border-radius:12px!important;font-weight:700}
.btn-primary,.btn-success,#btnCheckout,#btnCompleteOrder,
.checkout .btn-primary,.order-summary .btn-primary,.products .product .btn,
.btn-order,.btn-buy,.btn-checkout{
  background:linear-gradient(135deg,var(--brand),var(--brand2))!important;
  border:0!important;color:var(--on-brand)!important; box-shadow:0 6px 18px rgba(108,177,255,.25)
}
.btn-primary:hover,#btnCheckout:hover,#btnCompleteOrder:hover{filter:saturate(1.05) brightness(1.02)}
.btn,.btn-default,.btn-secondary,.btn-outline-secondary,.btn-light,.btn-info,.btn-warning,.btn-danger{
  background:var(--surface-2)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:12px!important
}
.btn-outline-primary,.btn-outline-success{
  background:transparent!important;color:var(--link)!important;border:1px solid var(--link)!important
}

/* Forms & Inputs */
input[type="text"],input[type="email"],input[type="password"],
input[type="number"],input[type="url"],input[type="search"],
input[type="tel"],input[type="datetime-local"],input[type="date"],
textarea,select,.form-control,.custom-select,.form-select{
  background:var(--surface-2)!important;color:var(--ink)!important;
  border:1px solid var(--line)!important;border-radius:10px;box-shadow:none!important
}
.form-control:focus,select:focus,textarea:focus{
  border-color:var(--focus)!important; box-shadow:0 0 0 3px rgba(108,177,255,.22)!important; outline:0!important;
}
::placeholder{color:var(--ink-muted)!important;opacity:1}
.input-group-addon,.input-group-text{
  background:var(--surface-2)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:10px
}
input:-webkit-autofill,textarea:-webkit-autofill,select:-webkit-autofill{
  -webkit-text-fill-color:var(--ink)!important; box-shadow:0 0 0px 1000px var(--surface-2) inset!important;
  transition:background-color 9999s ease-in-out 0s;
}

/* Tables */
.table{color:var(--ink)!important;border-color:var(--line)!important;margin-bottom:0}
.table>thead>tr>th,.table thead th{
  background:var(--surface-2)!important;color:#cfe3ff!important;border-color:var(--line)!important
}
.table>tbody>tr>td{
  background:var(--surface)!important;color:var(--ink-soft)!important;border-top:1px solid var(--line)!important
}
.table-striped>tbody>tr:nth-of-type(odd){background:var(--surface-3)!important}
.table-hover>tbody>tr:hover{background:rgba(108,177,255,.06)!important}
.table-bordered>tbody>tr>td,.table-bordered>thead>tr>th{border-color:var(--line)!important}
.table-responsive{border:1px solid var(--line)!important;border-radius:12px}

/* Alerts */
.alert{border:1px solid var(--line)!important;border-radius:12px}
.alert-success{background:rgba(36,197,138,.18)!important;color:var(--ok-ink)!important;border-color:#1f624d!important}
.alert-warning{background:rgba(229,185,107,.18)!important;color:var(--warn-ink)!important;border-color:#6a5322!important}
.alert-danger,.alert-error{background:rgba(255,125,125,.18)!important;color:var(--bad-ink)!important;border-color:#6a2a2a!important}

/* Dropdowns / Modals / Tooltips */
.dropdown-menu,.modal-content,.popover{
  background:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important;border-radius:12px
}
.dropdown-menu>li>a,.dropdown-item{color:var(--ink)!important}
.dropdown-menu>li>a:hover,.dropdown-item:hover{background:var(--surface-3)!important}
.modal-backdrop{background:rgba(0,0,0,.7)!important}
.tooltip-inner{background:var(--surface-2)!important;color:var(--ink)!important}
.tooltip.top .tooltip-arrow,.tooltip .arrow{border-top-color:var(--surface-2)!important}

/* Tickets shells */
.ticket-reply .message,.reply-message,.message,.note{
  background:var(--surface)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:12px
}

/* Invoices */
.invoice-container,.invoice-container .well,.invoice-container .panel,
.invoice-recipient,.payment-details{
  background:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important;border-radius:14px
}
.invoice-container .total-due,.order-summary .total-due-today{color:var(--link-hover)!important}

/* Domain/Cart widgets shells */
.domain-pricing,.cart-sidebar,.cart-summary,.cart-totals{
  background:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important;border-radius:14px
}

/* ==========================================================
   ORDER FORMS / CART / PRODUCT (all)
   ========================================================== */
[id^="order-"] .products .product,
[id^="order-"] .product,[id^="order-"] .pricing-card,
[id^="order-"] .product .product-desc,[id^="order-"] .product .price{
  background:var(--surface)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:14px;box-shadow:var(--shadow)
}
[id^="order-"] .product:hover{transform:translateY(-2px);transition:transform .15s ease}

[id^="order-"] .view-cart,[id^="order-"] .summary-container,
[id^="order-"] .view-cart .panel,[id^="order-"] .summary-container .panel,
[id^="order-"] .view-cart .card,[id^="order-"] .summary-container .card{
  background:var(--surface)!important;color:var(--ink)!important;border-color:var(--line)!important;border-radius:14px
}
[id^="order-"] .view-cart .panel-heading,[id^="order-"] .summary-container .panel-heading,
[id^="order-"] .summary-container .card-header{
  background:var(--surface-2)!important;color:var(--ink-strong)!important;border-color:var(--line)!important
}
/* Some order templates keep cart rows white → make text black for readability */
[id^="order-"] .view-cart .table thead th{
  background:#fff !important;color:#000 !important;border-color:var(--line)!important
}
[id^="order-"] .view-cart .table tbody td{
  background:#fff !important;color:#000 !important;border-top:1px solid var(--line)!important
}
/* Links inside cart items also black */
[id^="order-"] .view-cart .table tbody td a:not(.btn),
[id^="order-"] .view-cart .item a:not(.btn){color:#000!important;text-decoration:underline}
[id^="order-"] .view-cart .table tbody td a:not(.btn):hover,
[id^="order-"] .view-cart .item a:not(.btn):hover{opacity:.85}

[id^="order-"] .view-cart .form-control,[id^="order-"] .view-cart select,
[id^="order-"] .summary-container .form-control,[id^="order-"] .summary-container select,
[id^="order-"] #inputPromoCode{
  background:var(--surface-2)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:10px
}

/* Product info & options */
[id^="order-"] .product-info,[id^="order-"] .configurable-options,
[id^="order-"] .configoptions,[id^="order-"] .addons,[id^="order-"] .addon-products,
[id^="order-"] .domain-prompt,[id^="order-"] .options-container,[id^="order-"] .configurable-option,
[id^="order-"] .pricing-config,[id^="order-"] .order-summary .total-due-today{
  background:var(--surface)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:14px
}
[id^="order-"] .product-info .panel-heading,[id^="order-"] .product-info .card-header{background:var(--surface-2)!important}
[id^="order-"] .configurable-options .form-control,
[id^="order-"] .product-info .form-control,[id^="order-"] .product-info select{
  background:var(--surface-2)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:10px
}

/* Checkout / Payment */
[id^="order-"] .payment-methods .panel,[id^="order-"] .payment-methods .card,
[id^="order-"] .checkout,[id^="order-"] .checkout .card{
  background:var(--surface)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:14px
}
[id^="order-"] .checkout .table thead th{background:var(--surface-2)!important;color:#cfe3ff!important}
[id^="order-"] .checkout .table tbody td{background:var(--surface)!important;color:var(--ink-soft)!important}

[id^="order-"] .btn-primary,[id^="order-"] .btn-success,[id^="order-"] #btnCheckout,[id^="order-"] #btnCompleteOrder{
  background:linear-gradient(135deg,var(--brand),var(--brand2))!important;border:0!important;color:var(--on-brand)!important;border-radius:12px!important;
  box-shadow:0 6px 18px rgba(108,177,255,.25)
}

/* Code blocks */
pre,code,.code-block{background:#0b0f16!important;color:var(--mono-ink)!important;border:1px solid var(--line)!important;border-radius:10px}

/* ===== Safety net: pure white backgrounds → black text for readability ===== */
*[style*="background:#fff"],*[style*="background: #fff"],
*[style*="background:#ffffff"],*[style*="background: #ffffff"],
*[style*="background-color:#fff"],*[style*="background-color: #fff"],
*[style*="background-color:#ffffff"],*[style*="background-color: #ffffff"],
*[style*="background:white"],*[style*="background: white"],
*[style*="background-color:white"],*[style*="background-color: white"],
*[style*="rgb(255, 255, 255)"],*[style*="rgba(255, 255, 255, 1)"]{
  color:#000 !important;
}
*[style*="background:#fff"] a, *[style*="background: #fff"] a,
*[style*="background:#ffffff"] a, *[style*="background: #ffffff"] a,
*[style*="background-color:#fff"] a, *[style*="background-color: #fff"] a,
*[style*="background-color:#ffffff"] a, *[style*="background-color: #ffffff"] a,
*[style*="background:white"] a, *[style*="background: white"] a,
*[style*="background-color:white"] a, *[style*="background-color: white"] a,
*[style*="rgb(255, 255, 255)"] a, *[style*="rgba(255, 255, 255, 1)"] a{
  color:#000 !important; text-decoration:underline;
}
*[style*="background:#fff"] ::placeholder, *[style*="background: #fff"] ::placeholder,
*[style*="background:#ffffff"] ::placeholder, *[style*="background: #ffffff"] ::placeholder,
*[style*="background-color:#fff"] ::placeholder, *[style*="background-color: #fff"] ::placeholder,
*[style*="background-color:#ffffff"] ::placeholder, *[style*="background-color: #ffffff"] ::placeholder,
*[style*="background:white"] ::placeholder, *[style*="background: white"] ::placeholder,
*[style*="background-color:white"] ::placeholder, *[style*="background-color: white"] ::placeholder{
  color:#555 !important; opacity:1 !important;
}

/* ==========================================================
   MARKDOWN EDITOR — Make INPUT text black on white
   (Bootstrap-Markdown `.md-editor` & CodeMirror)
   ========================================================== */

/* Wrapper chrome stays theme-ish */
.md-editor,
.md-editor .md-header,
.md-editor .md-footer {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* Toolbar buttons */
.md-editor .md-header .btn,
.md-editor .md-footer .btn {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
}
.md-editor .md-header .btn:hover,
.md-editor .md-footer .btn:hover,
.md-editor .md-header .btn.active,
.md-editor .md-footer .btn.active {
  background: var(--surface-3) !important;
  color: var(--link) !important;
  border-color: var(--focus) !important;
}

/* INPUT area → white bg + black text for clarity */
.md-editor .md-input {
  background: #ffffff !important;
  color: #000000 !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  caret-color: #000 !important;
  box-shadow: none !important;
}
.md-editor .md-input:focus {
  border-color: var(--focus) !important;
  box-shadow: 0 0 0 3px rgba(108,177,255,.22) !important;
}
.md-editor .md-input::placeholder { color: #555 !important; }

/* If any earlier rule forced inherited colors, neutralize for input text */
.md-editor .md-input, .md-editor .md-input * { color: #000 !important; }

/* SimpleMDE / EasyMDE / CodeMirror input area */
.CodeMirror, .CodeMirror-scroll, .CodeMirror-gutters {
  background: #ffffff !important;
  color: #000000 !important;
  border: 1px solid var(--line) !important;
}
.cm-s-default .CodeMirror-lines,
.cm-s-default .CodeMirror-linenumber,
.cm-s-default .CodeMirror-line { color: #000000 !important; }
.cm-s-default .cm-header, .cm-s-default .cm-strong { color: #000000 !important; }
.cm-s-default .cm-link { color: #0a58ca !important; } /* accessible blue on white */
.cm-s-default .cm-comment { color: #444 !important; }
.CodeMirror-cursor { border-left: 2px solid #000 !important; }
.CodeMirror-focused { box-shadow: 0 0 0 3px rgba(108,177,255,.22) inset !important; }

/* Preview can remain dark with theme (optional).
   If you prefer white preview too, uncomment the three lines below.

.md-editor .md-preview,
.editor-preview, .editor-preview-side {
  background: #ffffff !important; color: #000000 !important; border-color: var(--line) !important;
}
*/

/* END */


/* ==== NAV DROPDOWNS — TOPMOST & NOT CLIPPED ==== */

/* Keep header/nav above everything */
.navbar,
.navbar-main,
.client-header,
.header,
.topbar,
.navbar.navbar-fixed-top {
  position: relative;
  z-index: 2147483000 !important; /* max-ish */
}

/* The dropdown itself floats above all panels/modals */
.navbar .dropdown-menu,
.navbar-main .dropdown-menu,
.client-header .dropdown-menu,
.header .dropdown-menu,
.topbar .dropdown-menu {
  z-index: 2147483600 !important;
  position: absolute !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.35) !important;
}

/* Containers that may clip (overflow/transform/filter create stacking contexts) */
.banner, .hero, .pageheader,
.main-content, .page-content, .content-padded,
[id^="order-"], [id^="order-"] .view-cart,
[id^="order-"] .summary-container, .client-home-panels {
  overflow: visible !important;
  transform: none !important;
  filter: none !important;
  -webkit-transform: none !important;
  -webkit-filter: none !important;
}

/* Any “sticky” sidebars/cards that were jumping over nav */
.panel, .card, .tile, .order-summary, .view-cart, .cart-sidebar, .cart-summary {
  position: relative !important;
  z-index: 1 !important;
}

/* Keep client-area nav above everything */
.clientarea .navbar,
.client-header, .header, .topbar, .navbar-main {
  position: relative !important;
  z-index: 2147483000 !important;
  overflow: visible !important;
}

/* Ported menus live on top of the world */
.dropdown-menu[data-ported="1"]{
  position: fixed !important;
  z-index: 2147483600 !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.35) !important;
}

/* Neutralize typical clippers that hide menus */
.clientarea .main-content,
.clientarea .page-content,
.clientarea .content-padded,
.clientarea .client-home-panels,
[id^="order-"], [id^="order-"] .view-cart, [id^="order-"] .summary-container,
.cart-sidebar, .cart-summary, .order-summary,
.panel, .card, .tile {
  overflow: visible !important;
  transform: none !important;
  -webkit-transform: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  z-index: 1 !important;
}

/* Remove client-area title strip + breadcrumbs everywhere */
.clientarea .header-lined,
.clientarea .header-lined h1,
.clientarea .header-lined h2,
.clientarea .header-lined h3,
.clientarea ol.breadcrumb,
.clientarea nav.breadcrumb,
.clientarea .breadcrumb,
.clientarea #breadcrumb,
.clientarea .page-header,
.clientarea .page-title,
[id^="order-"] .header-lined,
[id^="order-"] .breadcrumb {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Optional: tighten spacing if your theme left a gap */
.clientarea .content-padded,
.clientarea .main-content,
.clientarea .page-content {
  padding-top: 12px !important;
}
/* Kill client-area titles & breadcrumbs across themes and order forms */
#main-body .header-lined,
.header-lined,
.page-header,
.page-header-title,
.page-title,
nav[aria-label="breadcrumb"],
#breadcrumb,
.breadcrumb,
ol.breadcrumb,
.breadcrumb-container,
.navbar-breadcrumbs,
.order-breadcrumb,
.order-breadcrumbs,
.cart-steps,
.cart-breadcrumbs,
.cart-nav,
#order-standard_cart .header-lined,
[id^="order-"] .breadcrumb,
[id^="order-"] nav[aria-label="breadcrumb"] {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Tighten the gap that strip usually leaves */
.clientarea .content-padded,
.clientarea .main-content,
.clientarea .page-content,
#main-body {
  padding-top: 12px !important;
}

/* ===== Mebud Cloud — Button Unifier (paste at END of custom.css) ===== */

/* Brand palette (uses your existing vars if present) */
:root{
  --brand:#5fd1a9; --brand2:#6cb1ff; --on-brand:#0b0d12;
  --line:#1b2030; --surface-2:#0b0f16;
}

/* Base: make ALL action buttons look like primary (except .btn-link & .btn-danger) */
body .btn:not(.btn-link):not(.btn-danger),
body .button:not(.btn-link):not(.btn-danger),
body input[type="submit"].btn,
body button[type="submit"].btn,
#btnLogin,#btnClientLogin,#login .btn,
#btnRegister,#registration .btn,
.logincontainer .btn,
.clientarea .btn,
.modal-footer .btn,
.panel .btn, .card .btn,
#order-standard_cart .btn,
[id^="order-"] .btn {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color: var(--on-brand) !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 18px rgba(108,177,255,.25) !important;
  text-shadow: none !important;
}

/* Cover Bootstrap variants that WHMCS uses all over the place */
body .btn-primary, body .btn-default, body .btn-info,
body .btn-success, body .btn-warning, body .btn-secondary,
body .btn-light, body .btn-outline-primary, body .btn-outline-secondary {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color: var(--on-brand) !important;
  border: 0 !important;
}

/* Hover/active/focus */
body .btn:not(.btn-link):hover,
body .btn:not(.btn-link):focus,
body .btn:not(.btn-link):active {
  filter: saturate(1.05) brightness(1.02);
  outline: none !important;
  box-shadow: 0 8px 22px rgba(108,177,255,.32) !important;
}

/* Keep destructive actions visually distinct */
body .btn-danger, body .btn-outline-danger {
  background: #7f2a2a !important;
  color: #ffd9d9 !important;
  border: 1px solid #6a2a2a !important;
  box-shadow: none !important;
}

/* Text-style buttons should remain links */
body .btn-link { background: transparent !important; border: 0 !important; }

/* Size & block variations keep the look */
body .btn-lg, body .btn-block, body .btn.btn-lg, body .btn.btn-block {
  border-radius: 14px !important;
}

/* Inputs styled as buttons (some modules use these) */
body input[type="submit"],
body input[type="button"],
body button[type="submit"],
body button[type="button"] {
  color: var(--on-brand) !important;
}

/* Login/Register forms sometimes get overridden by theme—force them */
.logincontainer .btn,
#login .btn,
#registration .btn {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color: var(--on-brand) !important;
}

/* Cart footer actions and “Update” buttons in order forms */
#order-standard_cart .btn,
[id^="order-"] .btn,
[id^="order-"] .btn-update,
[id^="order-"] .btn-continue,
[id^="order-"] .btn-checkout,
[id^="order-"] .btn-complete {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color: var(--on-brand) !important;
}

/* Disabled state (keep contrast) */
body .btn.disabled, body .btn:disabled {
  opacity: .65 !important;
  filter: none !important;
}

/* In case a theme hard-codes white buttons inline – neutralize */
body .btn[style*="background:#fff"],
body .btn[style*="background: #fff"],
body .btn[style*="background-color:#fff"],
body .btn[style*="background-color: #fff"] {
  background: linear-gradient(135deg, var(--brand), var(--brand2)) !important;
  color: var(--on-brand) !important;
  border: 0 !important;
}

/* === Product Details (client area): Server Information, Configurable Options, etc. === */
#tabOverview .panel,
#tabOverview .panel-heading,
#tabOverview .panel-body,
#tabOverview .server-info,
#tabOverview .server-info .table,
#tabOverview .server-info .table > tbody > tr > td,
#tabOverview .configurable-options,
#tabOverview .configurable-options .table,
#tabOverview .configurable-options .table > tbody > tr > td,
#tabOverview .product-details,
#tabOverview .content-box,
#tabOverview .content-box .body {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* Catch-all for stubborn Bootstrap defaults on those panels */
.panel,
.panel-default,
.panel-default > .panel-heading,
.panel-default > .panel-body,
.well,
.content-box,
.content-box .body,
.bg-white,
.card.bg-white {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* Tables inside those sections */
#tabOverview .table thead th,
#tabOverview .panel .table thead th {
  background: var(--surface-2) !important;
  color: #cfe3ff !important;
  border-color: var(--line) !important;
}
#tabOverview .table tbody td,
#tabOverview .panel .table tbody td {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-top-color: var(--line) !important;
}

/* === Order Forms / Cart (standard_cart): product info & configurable options === */
#order-standard_cart .product-info,
#order-standard_cart .configurable-options,
#order-standard_cart .configoptions,
#order-standard_cart .addons,
#order-standard_cart .addon-products,
#order-standard_cart .order-summary,
#order-standard_cart .summary-container .panel,
#order-standard_cart .view-cart .panel,
#order-standard_cart .checkout .card,
#order-standard_cart .panel,
#order-standard_cart .panel-heading,
#order-standard_cart .panel-body {
  background: var(--surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
#order-standard_cart .configurable-options .form-control,
#order-standard_cart .product-info .form-control,
#order-standard_cart .product-info select {
  background: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* If any element still hard-codes pure white inline, force readable text */
*[style*="background:#fff"],
*[style*="background: #fff"],
*[style*="background:#ffffff"],
*[style*="background: #ffffff"],
*[style*="background-color:#fff"],
*[style*="background-color: #fff"],
*[style*="background-color:#ffffff"],
*[style*="background-color: #ffffff"] {
  color: #000 !important;
}