/* ============================================================
   MRMEDIA-ORDERFORM-v1 — WHMCS "standard_cart" Order-Form dark theme
   Loaded last via common.tpl {assetExists custom.css} → wins cascade.
   Self-sufficient: the order form's all.css loads after the client
   theme, so this file re-darkens EVERYTHING the cart/checkout shows.
   Fonts reused from the already-deployed twenty-one theme (absolute URL).
   ============================================================ */

/* Outfit-only (Brand-Guide, bestaetigt 2026-07-20) — Inter entfaellt. */
@font-face{font-family:'OutfitMR';src:url('/templates/twenty-one/css/fonts/outfit.woff2') format('woff2');font-weight:300 800;font-style:normal;font-display:swap}
@font-face{font-family:'JBMonoMR';src:url('/templates/twenty-one/css/fonts/jbmono.woff2') format('woff2');font-weight:400 500;font-style:normal;font-display:swap}

:root{
  /* Kanon: mrmedia-web/DESIGN.md (Frontmatter) ist die einzige Wahrheit fuer
     Hex-Werte. Namen bleiben pro Flaeche wie sie sind; die WERTE muessen mit
     DESIGN.md uebereinstimmen. Geprueft 2026-07-20 (T1): paper->#F3F4F6,
     slate-2->#222B40 (war #28324a = 4,01:1 mit --mist, jetzt 4,52:1). */
  --coral:#FF6B5B;--coral-deep:#E8533F;--coral-soft:#d79a92;
  --midnight:#111827;--ink:#0B0F19;--slate:#1E2636;--slate-2:#222B40;
  --mist:#8A91A3;--paper:#F3F4F6;--line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.15);
  --mr-sans:'OutfitMR',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --mr-mono:'JBMonoMR',ui-monospace,monospace;
  --primary:#FF6B5B;--bs-primary:#FF6B5B;
}

/* ---------- Base ---------- */
html,body,.primary-bg-color,body.primary-bg-color{background-color:var(--mr-ink,#0B0F19)!important;background-color:#0B0F19!important;color:#F3F4F6!important}
body,.body,#order-standard_cart,.cart-body,.secondary-cart-body{font-family:var(--mr-sans)!important;color:var(--paper)}
a{color:var(--coral)}
a:hover,a:focus{color:var(--coral-deep)}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5{color:var(--paper)!important;font-family:var(--mr-sans)!important}
.text-muted,small,.help-block{color:var(--mist)!important}
hr{border-color:var(--line)}

/* ---------- Header / navbar (re-asserted dark on cart pages) ---------- */
#header,.header,.topbar,.navbar,.navbar-light,.main-navbar-wrapper{background-color:var(--midnight)!important;border:0!important}
.topbar,.main-navbar-wrapper{border-bottom:1px solid var(--line)!important}
.navbar-brand,.navbar-brand *{color:var(--paper)!important}
.navbar .logo-img{max-height:36px;width:auto}
.navbar-nav .nav-link,.navbar .btn,.navbar-nav>li>a{color:var(--paper)!important}
.navbar-nav .nav-link:hover,.navbar-nav .active>.nav-link,.navbar-nav .open>a{color:var(--coral)!important}
.master-breadcrumb{background-color:var(--midnight)!important;border-bottom:1px solid var(--line)!important}
.master-breadcrumb,.breadcrumb,.breadcrumb a,.breadcrumb-item,.breadcrumb-item a{color:var(--mist)!important;background:transparent!important}
.breadcrumb-item.active{color:var(--paper)!important}

/* ---------- Headings on the cart ---------- */
.header-lined{border-color:var(--line)!important}
.header-lined h1,.font-size-36{color:var(--paper)!important}

/* ---------- Panels / cards (summary box, promo box, sidebar) ---------- */
.panel,.card,.well,.panel-default,.order-summary,.summary-container{background-color:var(--midnight)!important;border:1px solid var(--line)!important;border-radius:12px!important;color:var(--paper)!important;box-shadow:none!important}
.panel-heading,.card-header{background-color:transparent!important;border:0!important;border-bottom:1px solid var(--line)!important;color:var(--paper)!important;border-radius:12px 12px 0 0!important}
.panel-title,.card-title,.panel-heading h3,.panel-heading h4{color:var(--paper)!important;font-weight:700;font-size:.98rem!important}
.panel-heading i,.card-header i,.panel-title i,.panel-heading .fas,.panel-heading .far{color:var(--coral)!important}
.card-minimise,.panel-minimise{color:var(--mist)!important}
.panel-body,.card-body{background:transparent!important;color:var(--paper)!important}
.panel-footer,.card-footer{background:transparent!important;border-color:var(--line)!important}
.nav-tabs{border-color:var(--line)!important}
.nav-tabs>li>a,.nav-tabs .nav-link{color:var(--mist)!important;background:transparent!important;border-color:transparent!important}
.nav-tabs>li.active>a,.nav-tabs .nav-link.active{color:var(--coral)!important;background:var(--midnight)!important;border-color:var(--line) var(--line) var(--midnight)!important}

/* ---------- Cart items table ---------- */
.view-cart-items-header{background-color:var(--slate)!important;color:var(--mist)!important;border-radius:10px 10px 0 0!important;
  font-family:var(--mr-mono)!important;font-size:.72rem!important;letter-spacing:.08em!important;text-transform:uppercase!important}
.view-cart-items{border:1px solid var(--line)!important;border-top:0!important;border-radius:0 0 10px 10px!important;background:var(--midnight)!important}
.view-cart-items .item{border-bottom:1px solid var(--line)!important;background:transparent!important}
.view-cart-items .item:last-child{border-bottom:0!important}
.item-title{color:var(--paper)!important;font-weight:600}
.item-group,.item-domain{color:var(--mist)!important}
.item-price,.item-price span{color:var(--paper)!important;font-family:var(--mr-mono)!important}
.item-price .cycle,.cycle{color:var(--mist)!important}

/* promo / apply code box */
.apply-promo,.promo-code,.card .input-group .form-control{background-color:var(--slate)!important}

/* ---------- Konfigurieren-Schritt: die Produktbox war UNSICHTBAR ----------
   all.css setzt .product-info auf #f8f8f8. Auf dem dunklen Theme stand darin
   paper-Text (#F3F4F6) auf Fast-Weiss = 1,01:1 — der Kasten, der dem Kunden sagt,
   WAS er gerade kauft (Tarifname + Specs), war schlicht nicht lesbar. Mitten auf
   dem Bestellweg. */
.product-info{background:var(--slate)!important;border:1px solid var(--line)!important;
  border-radius:12px!important;color:var(--paper)!important}
.product-info *{color:var(--paper)!important;background:transparent!important}
.product-info small,.product-info .text-muted,.product-info p,
.product-info .product-desc,.product-info .product-group{color:var(--mist)!important}

/* ---------- Order summary totals ---------- */
.summary-totals{border-top:1px solid var(--line)!important;color:var(--paper)}
.summary-totals .clearfix,.clearfix .float-left,.clearfix .float-right,.pull-left,.pull-right{color:var(--paper)}
.product-name{color:var(--paper)!important;font-weight:700}
.product-group{color:var(--mist)!important}
.total-due-today{border-top:1px solid var(--line-2)!important;color:var(--paper)}
.total-due-today .amt{color:var(--coral)!important;font-family:var(--mr-mono)!important;font-weight:700}

/* ---------- Buttons ---------- */
.btn-success,.btn-checkout,#checkout{background-color:var(--coral)!important;border-color:var(--coral)!important;color:var(--midnight)!important;font-weight:600!important}
.btn-success:hover,.btn-checkout:hover,#checkout:hover{background-color:var(--coral-deep)!important;border-color:var(--coral-deep)!important;color:var(--midnight)!important;box-shadow:0 6px 20px rgba(255,107,91,.28)!important}
.btn-primary{background-color:var(--coral)!important;border-color:var(--coral)!important;color:var(--midnight)!important}
.btn-primary:hover{background-color:var(--coral-deep)!important;border-color:var(--coral-deep)!important}
.btn-default,.btn-secondary,.btn:not(.btn-link):not(.btn-success):not(.btn-primary):not(.btn-checkout){background-color:var(--slate)!important;border-color:var(--line-2)!important;color:var(--paper)!important}
.btn-default:hover,.btn-secondary:hover{background-color:var(--slate-2)!important;border-color:var(--coral)!important;color:var(--paper)!important}
.btn-link{color:var(--coral)!important}
.btn-continue-shopping{color:var(--mist)!important}
.btn-remove-from-cart{color:var(--mist)!important}
.btn-remove-from-cart:hover{color:var(--coral)!important}

/* ---------- Sidebar categories (list-group) ---------- */
.card-sidebar,.panel-sidebar{background-color:var(--midnight)!important}
.list-group{background:transparent!important}
.list-group-item{background-color:transparent!important;color:var(--paper)!important;border-color:var(--line)!important}
.list-group-item-action:hover,.list-group-item:hover{background-color:var(--slate)!important;color:var(--paper)!important}
.list-group-item.active{background-color:rgba(255,107,91,.12)!important;border-color:transparent!important;color:var(--coral)!important;box-shadow:inset 3px 0 0 var(--coral)!important}
.card-minimise,.panel-minimise{color:var(--mist)!important}

/* ---------- Forms ---------- */
.form-control,.custom-select,select,textarea,input[type=text],input[type=email],input[type=password],input[type=number]{background-color:var(--slate)!important;border:1px solid var(--line-2)!important;color:var(--paper)!important}
.form-control:focus,select:focus,textarea:focus{background-color:var(--slate)!important;border-color:var(--coral)!important;color:var(--paper)!important;box-shadow:0 0 0 3px rgba(255,107,91,.2)!important}
.form-control::placeholder{color:var(--mist)!important}
label,.control-label,.form-control-label{color:var(--paper)!important}
.input-group-text,.input-group-addon{background:var(--slate)!important;color:var(--mist)!important;border-color:var(--line-2)!important}

/* ---------- Alerts ---------- */
/* Seitenstreifen raus (DESIGN.md-Bann), Ampel auf die kanonischen Tokens — identisch
   zum Client-Theme, damit Warenkorb und Kundenbereich dieselbe Meldung gleich zeigen. */
.alert{background-color:var(--midnight)!important;border:1px solid var(--line-2)!important;color:var(--paper)!important;border-radius:8px!important}
.alert-success{border-color:rgba(52,211,153,.35)!important;background-color:rgba(52,211,153,.08)!important}
.alert-info{border-color:rgba(255,107,91,.35)!important;background-color:rgba(255,107,91,.08)!important}
.alert-warning{border-color:rgba(245,166,35,.35)!important;background-color:rgba(245,166,35,.08)!important}
.alert-danger{border-color:rgba(255,91,106,.35)!important;background-color:rgba(255,91,106,.08)!important}

/* ---------- Modals ---------- */
.modal-content{background-color:var(--midnight)!important;color:var(--paper)!important;border:1px solid var(--line-2)!important}
.modal-header,.modal-footer{border-color:var(--line)!important}
.close{color:var(--paper)!important;text-shadow:none!important;opacity:.7}
.close:hover{color:var(--coral)!important;opacity:1}

/* ---------- Misc ---------- */
.badge{background-color:rgba(255,107,91,.15)!important;color:var(--coral)!important;font-family:var(--mr-mono)!important}
.table,.table td,.table th{color:var(--paper)!important;border-color:var(--line)!important}
.bg-light,.bg-white,.well{background-color:var(--midnight)!important}
.text-dark{color:var(--paper)!important}
#footer,.footer{background-color:var(--ink)!important;border-top:1px solid var(--line)!important;color:var(--mist)!important}
#footer a,.footer a{color:var(--mist)!important}
#footer a:hover,.footer a:hover{color:var(--coral)!important}
.separator{color:var(--mist)!important}

/* ---------- Promo / tax tabs — kill the white box ---------- */
.view-cart-tabs .tab-content{background:var(--midnight)!important;border:1px solid var(--line)!important;border-top:0!important;border-radius:0 0 10px 10px!important;padding:16px!important}
.tab-content,.tab-pane,.tab-pane.promo,.tab-pane.active{background:transparent!important;color:var(--paper)!important}
.view-cart-tabs .nav-tabs{border-color:var(--line)!important;margin-bottom:0!important}
.view-cart-tabs .nav-tabs .nav-link,.view-cart-tabs .nav-tabs>li>a{background:transparent!important;color:var(--mist)!important;border-color:transparent!important;border-bottom:0!important}
.view-cart-tabs .nav-tabs .nav-link.active,.view-cart-tabs .nav-tabs>li.active>a{background:var(--midnight)!important;color:var(--coral)!important;border:1px solid var(--line)!important;border-bottom:0!important}
.view-cart-promotion-code{color:var(--paper)!important}
.field-icon,.prepend-icon .field-icon i{color:var(--mist)!important}

/* ---------- No domains (wir verkaufen/reselln keine Domains) ---------- */
a[href*="domain=register"],a[href*="domain=transfer"],a[href*="domainchecker"],a[href*="/domain/register"],a[href*="/domain/transfer"]{display:none!important}

/* ---------- Knowledgebase entfernt → Suchfeld ausblenden ---------- */
.navbar .input-group.search,form[action*="knowledgebase"]{display:none!important}

/* ---------- Product listing cards (cart.php?gid) — waren weiß ---------- */
.products .product{background-color:var(--midnight)!important;border:1px solid var(--line)!important;border-radius:12px!important;color:var(--paper)!important;overflow:hidden}
.products .product header{background:transparent!important;border-bottom:1px solid var(--line)!important;color:var(--paper)!important}
.products .product header span,.products .product [id$="-name"]{color:var(--paper)!important;font-weight:700}
.products .product-desc,.products .product-desc p,.products .product-desc li,.products .product-desc ul,.products .product-desc span,.products .product-desc small{color:var(--mist)!important;background:transparent!important}
.products .feature-value{color:var(--paper)!important;font-family:var(--mr-mono)!important}
.products .product footer{background:transparent!important;border-top:1px solid var(--line)!important}
.products .product-pricing,.products .product-pricing span,.products .product-pricing small{color:var(--paper)!important}
.products .product .price{color:var(--coral)!important;font-family:var(--mr-mono)!important;font-weight:700}

/* ---------- Dropdown menus (Shop etc.) — Einträge waren zu blass ---------- */
.dropdown-menu{background-color:var(--slate)!important;border:1px solid var(--line-2)!important;border-radius:10px!important;box-shadow:0 14px 34px rgba(0,0,0,.4)!important}
.dropdown-menu>li>a,.dropdown-menu .dropdown-item,.dropdown-menu a{color:var(--paper)!important;opacity:1!important}
.dropdown-menu>li>a:hover,.dropdown-menu .dropdown-item:hover,.dropdown-menu a:hover,.dropdown-menu .dropdown-item:focus{background-color:var(--slate-2)!important;color:var(--coral)!important}
.dropdown-menu .divider,.dropdown-divider{background-color:var(--line)!important;border-color:var(--line)!important}
.dropdown-header{color:var(--mist)!important}

/* ---------- MRMEDIA-ORDERFORM-v2: Kasse "Konto auswaehlen"-Panel dunkel (2026-07-18) ---------- */
/* all.css faerbt #order-standard_cart .account-select-container div.account #f6f6f6
   (aktiv #fff) -> weisse Box + heller Markentext = unlesbar. plain-class + !important
   schlaegt die ID-Regel. Kinder auf paper + Rest-Hintergruende neutralisieren
   (die coral getoenten Text-Boxen), Badges (EUR) behalten ihren Hintergrund. */
.account-select-container{ border-right-color:var(--line)!important; }
.account-select-container div.account,
.account-select-container div.account.active{
  background:var(--midnight)!important; border-color:var(--line)!important; color:var(--paper)!important;
}
.account-select-container div.account.active{
  background:rgba(255,107,91,.08)!important; box-shadow:inset 3px 0 0 var(--coral)!important;
}
.account-select-container div.account *:not(.badge):not(.label){
  color:var(--paper)!important; background-color:transparent!important;
}
.account-select-container div.account .text-muted,
.account-select-container div.account small{ color:var(--mist)!important; }
