/* =====================================================================
   TheMinecraftHosting · tema WHMCS «tmh2026» (hijo de Twenty-One, WHMCS 8.4.1)
   css/custom.css — lo carga solo includes/head.tpl ({assetExists file="custom.css"}),
   después de all.min.css y theme.min.css de Twenty-One.
   Hecho por ws9-t3 (1-nov-2026) siguiendo whmcs-tema/plan/PLAN.md (2.2–2.6).
   Versión OSCURA (orden de Rafael, 1-nov: «un fondo acorde a la página nueva»): la zona de contenido es la zona
   oscura lisa de las páginas de planes (planes-r5.css: #0c1a2e, tarjetas #10233d, borde blanco al 11 %).
   La versión clara anterior está en custom.css.antes-oscuro.

   1. Tokens
   2. Base: fondo oscuro liso, texto, títulos, enlaces, foco
   3. Franja promo, menú de la web y carrito (blancos, como la web)
   4. Barra de WHMCS (oscura) y franja de cabecera (imagen de planes + título + migas)
   5. Bootstrap 4 de Twenty-One en oscuro: botones, campos, iCheck, tarjetas, barra lateral, alertas,
      insignias y estados, tablas, pestañas, paginación, modales
   6. Piezas que no se pueden pintar (reCAPTCHA, Stripe, PayPal): sobre tarjeta clara
   7. Login, registro, contraseña
   8. Pie de la web
   9. Responsive y movimiento reducido
   Lo del carrito (standard_cart) va en templates/orderforms/tmh2026_cart/css/custom.css.
   Contrastes medidos (WCAG): texto #c9d4e3 sobre tarjeta #10233d 10.5:1 · secundario #8fa3bd 6.1:1 · enlaces #9cc2ff 8.7:1 ·
   lima sobre tarjeta 13.4:1 · tinta sobre lima 14.9:1 · borde de campo #6f86a6 contra tarjeta 4.2:1 (AA pide 3:1).
   ===================================================================== */

/* ---------- 1. tokens ---------- */
:root {
  /* claros (cabecera blanca de la web) */
  --tmh-ink: #0c1a2e;
  --tmh-text: #3b4a5c;
  --tmh-muted: #5b6b7e;
  --tmh-paper: #ffffff;
  --tmh-paper-2: #f4f7fb;
  --tmh-line: #dde4ee;
  --tmh-line-2: #c9d3e0;
  --tmh-green: #009934;
  --tmh-green-ink: #007f2c;
  --tmh-green-soft: #e8f7ec;
  --tmh-blue: #2a6eeb;
  --tmh-blue-ink: #1f5fd6;
  --tmh-blue-soft: #e9f0fe;
  --tmh-logo-blue: #0065cc;
  --tmh-lime: #ccff00;
  --tmh-lime-2: #e4ff5c;
  /* zona oscura (planes-r5.css) */
  --tmh-zone: #0c1a2e;        /* fondo de la página */
  --tmh-card: #10233d;        /* tarjetas, barras laterales, resumen */
  --tmh-card-2: #142b4a;      /* cabeceras de tarjeta, filas alternas */
  --tmh-field-bg: #0a1626;    /* fondo de campos */
  --tmh-edge: rgba(255, 255, 255, .11);
  --tmh-edge-2: rgba(255, 255, 255, .22);
  --tmh-field: #6f86a6;       /* borde de campos: 4.2:1 contra la tarjeta */
  --tmh-tx: #c9d4e3;          /* texto: 10.5:1 */
  --tmh-tx-2: #8fa3bd;        /* secundario: 6.1:1 */
  --tmh-head: #ffffff;        /* títulos */
  --tmh-link: #9cc2ff;        /* enlaces: 8.7:1 */
  --tmh-ok: #7ef0a1;
  --tmh-warn: #ffd166;
  --tmh-bad: #ff8a80;
  --tmh-info: #9cc2ff;
  --tmh-font: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --tmh-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --tmh-r-s: 6px;
  --tmh-r-m: 10px;
  --tmh-r-l: 16px;
  --tmh-shadow: 0 24px 60px -24px rgba(12, 26, 46, .45), 0 2px 6px rgba(12, 26, 46, .08);
  --tmh-shadow-dark: 0 24px 60px -24px rgba(0, 0, 0, .7), 0 2px 6px rgba(0, 0, 0, .3);
  --tmh-ring: 0 0 0 3px rgba(156, 194, 255, .55);
  --tmh-nav-h: 72px;
}

/* ---------- 2. base ---------- */
body {
  font-family: var(--tmh-font);
  color: var(--tmh-tx);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body, .primary-bg-color { background-color: var(--tmh-zone); }
section#main-body { padding: 36px 0 64px; background: var(--tmh-zone); color: var(--tmh-tx); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: var(--tmh-head); font-family: var(--tmh-font); }
h1, .h1, .font-size-36 { font-weight: 800; letter-spacing: -0.02em; line-height: 1.12; }
h2, h3, .h2, .h3 { font-weight: 700; letter-spacing: -0.01em; }
h4, h5, h6, .h4, .h5, .h6 { font-weight: 700; }
#main-body a:not(.btn):not(.list-group-item):not(.dropdown-item):not(.nav-link):not(.page-link) { color: var(--tmh-link); }
#main-body a:not(.btn):not(.list-group-item):not(.dropdown-item):not(.nav-link):not(.page-link):hover { color: #fff; text-underline-offset: .15em; }
#main-body .text-muted, #main-body small, #main-body .small { color: var(--tmh-tx-2) !important; }
#main-body strong, #main-body b { color: #fff; }
#main-body p a:not(.btn), #main-body label a:not(.btn), #main-body li > a.text-underline { text-decoration: underline; text-underline-offset: .15em; }   /* enlaces dentro de texto: no solo por color */
hr { border-top-color: var(--tmh-edge); }
::selection { background: var(--tmh-lime); color: var(--tmh-ink); }
:focus-visible { outline: 3px solid var(--tmh-blue); outline-offset: 3px; }
#main-body :focus-visible, .tmh-whmcs-bar :focus-visible, .tmh-page-hero :focus-visible, .modal :focus-visible { outline-color: #fff; }

.tmh-skip { position: absolute; left: 16px; top: -80px; z-index: 2000; background: var(--tmh-ink); color: #fff; padding: 10px 14px; border-radius: var(--tmh-r-s); font-weight: 600; }
.tmh-skip:focus { top: 10px; color: #fff; }
.tmh-icon { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; display: inline-block; vertical-align: middle; }
.tmh-wrap { width: 100%; margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; }
@media (min-width: 576px) { .tmh-wrap { max-width: 540px; } }
@media (min-width: 768px) { .tmh-wrap { max-width: 720px; } }
@media (min-width: 992px) { .tmh-wrap { max-width: 960px; } }
@media (min-width: 1200px) { .tmh-wrap { max-width: 1140px; } }

/* ---------- 3. franja promo (js/tmh-promo.js) ---------- */
.tmh-promo { background: var(--tmh-logo-blue); color: #fff; font-size: .92rem; font-weight: 600; line-height: 1.4; }
.tmh-promo > .tmh-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 18px; min-height: 42px; padding-top: 6px; padding-bottom: 6px; }
.tmh-promo p { margin: 0; }
.tmh-promo-text { display: inline-flex; align-items: center; gap: 8px; }
.tmh-promo-text .tmh-icon { width: 18px; height: 18px; }
.tmh-promo-right { display: inline-flex; align-items: center; gap: 10px; }
.tmh-promo-code {
  display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 0 10px 0 12px;
  border: 0; border-radius: var(--tmh-r-s); background: #fff; color: var(--tmh-logo-blue);
  font-family: var(--tmh-mono); font-weight: 600; font-size: .9rem; letter-spacing: .04em; cursor: pointer;
  transition: background-color .18s ease, color .18s ease;
}
.tmh-promo-code:hover { background: var(--tmh-blue-soft); }
.tmh-promo-code .tmh-icon { width: 15px; height: 15px; stroke-width: 2.4; }
.tmh-promo-code.is-copied { background: var(--tmh-green-ink); color: #fff; }
.tmh-promo .tmh-promo-code:focus-visible { outline-color: #fff; }

/* ---------- 3b. menú de la web (includes/tmh-header-*.tpl, js/tmh-nav.js): blanco, como en la web ---------- */
.tmh-nav { position: relative; z-index: 1030; background: var(--tmh-paper); border-bottom: 1px solid var(--tmh-line); font-family: var(--tmh-font); color: var(--tmh-ink); }
.tmh-nav > .tmh-wrap { display: flex; align-items: center; gap: 14px; min-height: var(--tmh-nav-h); }
.tmh-nav ul { margin: 0; padding: 0; list-style: none; }
.tmh-brand { flex: none; display: inline-flex; align-items: center; color: var(--tmh-ink); }
.tmh-brand:hover { text-decoration: none; }
.tmh-brand img { width: 44px; height: 41px; object-fit: contain; display: block; }
.tmh-menu { display: flex; align-items: center; gap: 2px; margin-left: auto !important; }
.tmh-menu > li { position: relative; }
.tmh-menu > li > a, .tmh-menu > li > button {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 11px;
  border: 0; border-radius: var(--tmh-r-s); background: none; color: var(--tmh-ink);
  font-family: inherit; font-weight: 600; font-size: .93rem; line-height: 1.2; white-space: nowrap; cursor: pointer;
  transition: background-color .15s ease;
}
.tmh-menu > li > a:hover, .tmh-menu > li > button:hover, .tmh-menu > li > button[aria-expanded="true"] { background: var(--tmh-paper-2); color: var(--tmh-ink); text-decoration: none; }
.tmh-caret { width: 14px; height: 14px; transition: transform .15s ease; }
.tmh-menu > li > button[aria-expanded="true"] .tmh-caret { transform: rotate(180deg); }
.tmh-sub {
  position: absolute; top: calc(100% + 6px); left: 0; min-width: 232px; padding: 8px !important;
  background: var(--tmh-paper); border: 1px solid var(--tmh-line); border-radius: var(--tmh-r-m); box-shadow: var(--tmh-shadow);
  opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .15s ease, transform .15s ease, visibility 0s linear .15s;
}
.tmh-menu > li > button[aria-expanded="true"] + .tmh-sub, .tmh-menu > li:hover > .tmh-sub, .tmh-menu > li:focus-within > .tmh-sub { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.tmh-sub-group { padding: 10px 10px 4px; font-size: .78rem; font-weight: 600; color: var(--tmh-muted); }
.tmh-sub a { display: flex; align-items: center; gap: 10px; min-height: 40px; padding: 8px 10px; border-radius: var(--tmh-r-s); color: var(--tmh-ink); font-weight: 500; }
.tmh-sub a:hover { background: var(--tmh-paper-2); color: var(--tmh-ink); text-decoration: none; }
.tmh-sub img, .tmh-flag { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex: none; display: inline-block; }
.tmh-nav-cta { margin-left: 6px; }
.tmh-menu > li > a.tmh-btn-client {
  min-height: 40px; padding: 0 16px; background: var(--tmh-paper); color: var(--tmh-ink); border: 1.5px solid var(--tmh-line-2);
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.tmh-menu > li > a.tmh-btn-client .tmh-icon { width: 18px; height: 18px; }
.tmh-menu > li > a.tmh-btn-client:hover { background: var(--tmh-green-soft); border-color: var(--tmh-green); color: var(--tmh-green-ink); box-shadow: 0 0 0 4px rgba(0, 153, 52, .18); }
.tmh-cart { position: relative; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--tmh-line-2); border-radius: var(--tmh-r-s); color: var(--tmh-ink); background: var(--tmh-paper); }
.tmh-cart:hover { background: var(--tmh-paper-2); color: var(--tmh-ink); text-decoration: none; }
.tmh-cart .tmh-icon { width: 22px; height: 22px; }
.tmh-cart-count { position: absolute; top: -7px; right: -7px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: var(--tmh-green-ink); color: #fff; font-size: .72rem; font-weight: 700; line-height: 20px; text-align: center; }
.tmh-nav-toggle { display: none; flex: none; width: 44px; height: 44px; border: 1px solid var(--tmh-line-2); border-radius: var(--tmh-r-s); background: var(--tmh-paper); color: var(--tmh-ink); align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.tmh-nav-toggle .tmh-icon { width: 22px; height: 22px; }
.tmh-nav-toggle .tmh-i-close { display: none; }
.tmh-nav-toggle[aria-expanded="true"] .tmh-i-menu { display: none; }
.tmh-nav-toggle[aria-expanded="true"] .tmh-i-close { display: block; }

/* ---------- 4. barra de WHMCS (header.tpl + navbar.tpl de Twenty-One): oscura, pegada a la franja de cabecera ---------- */
header.header { background: var(--tmh-zone); border-bottom: 1px solid var(--tmh-edge); }
header.header .topbar { background: #07111f; color: var(--tmh-tx); border-bottom: 1px solid var(--tmh-edge); }
header.header .topbar .btn, header.header .topbar .active-client .btn, header.header .topbar .active-client .input-group-text { color: var(--tmh-tx); }
header.header .main-navbar-wrapper { padding: 0; }
header.header .main-navbar-wrapper .navbar-collapse { padding: 4px 0; }
header.header .navbar a, header.header .navbar-nav a { color: var(--tmh-tx); font-size: .92rem; font-weight: 600; }
header.header .navbar-nav .nav-link { display: flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: var(--tmh-r-s); }
header.header .navbar-nav .nav-link:hover, header.header .navbar-nav .show > .nav-link { background: var(--tmh-card-2); color: #fff; }
header.header .navbar-nav .active > .nav-link { color: var(--tmh-lime); }
header.header .dropdown-menu { padding: 8px; background: var(--tmh-card); border: 1px solid var(--tmh-edge-2); border-radius: var(--tmh-r-m); box-shadow: var(--tmh-shadow-dark); font-size: .92rem; }
header.header .dropdown-item { display: flex; align-items: center; min-height: 40px; padding: 8px 12px; border-radius: var(--tmh-r-s); color: var(--tmh-tx); font-weight: 500; white-space: normal; }
header.header .dropdown-item:hover, header.header .dropdown-item:focus { background: var(--tmh-card-2); color: #fff; }
header.header .dropdown-item.active, header.header .dropdown-item:active { background: var(--tmh-card-2); color: var(--tmh-lime); }
header.header .dropdown-divider { border-color: var(--tmh-edge); }
.tmh-whmcs-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 6px 0; padding: 0 14px; border: 1px solid var(--tmh-edge-2); border-radius: var(--tmh-r-s); background: transparent; color: #fff; font-weight: 600; font-size: .92rem !important; }
.tmh-whmcs-toggle:hover, .tmh-whmcs-toggle[aria-expanded="true"] { background: var(--tmh-card-2); color: #fff; }

/* franja de cabecera: misma imagen (img/tmh-hero.webp = planes-r5/img/hero-plans.webp) y mismo oscurecido que el hero de planes
   (planes-r5.css, .pr-hero::after). Contraste medido por píxeles, peor punto de la foto detrás del texto: ver qa/resultado.json */
.tmh-page-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--tmh-zone); color: #fff; }
.tmh-page-hero-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 60%; }
.tmh-page-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(12, 26, 46, .34), rgba(12, 26, 46, .16) 50%, rgba(12, 26, 46, .42)); }
.tmh-page-hero > .container { display: flex; flex-direction: column; justify-content: center; min-height: clamp(150px, 15vw, 210px); padding-top: 28px; padding-bottom: 28px; }
.tmh-page-hero-title { margin: 0; color: #fff; font-size: clamp(1.8rem, 1.2rem + 2vw, 2.7rem); font-weight: 800; line-height: 1.08; letter-spacing: .01em; text-transform: uppercase; text-shadow: 0 2px 22px rgba(12, 26, 46, .6), 0 1px 2px rgba(12, 26, 46, .6); }
.master-breadcrumb { margin-top: 10px; background: transparent; }
.master-breadcrumb .breadcrumb { display: inline-flex; margin: 0; padding: 0; font-size: .9rem; font-weight: 600; background: none; text-shadow: 0 1px 2px rgba(12, 26, 46, .8); }
.master-breadcrumb .breadcrumb-item, .master-breadcrumb .breadcrumb-item.active { color: #e6edf6; }
.master-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: #e6edf6; }
.master-breadcrumb .breadcrumb-item a { color: #fff; text-decoration: underline; text-underline-offset: .15em; }
/* migas vacías (login) o de un solo paso que repite el título (carrito): no se muestran */
.master-breadcrumb:not(:has(.breadcrumb-item)), .master-breadcrumb:has(.breadcrumb-item:only-child) { display: none; }

/* ---------- 5. Bootstrap 4 / Twenty-One en oscuro ---------- */
/* botones: principal = lima de la web (como «Buy» de las tarjetas de planes), con texto tinta 14.9:1 */
.btn { font-family: var(--tmh-font); font-weight: 600; border-radius: var(--tmh-r-s); transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease; }
.btn:not(.btn-sm):not(.btn-xs):not(.btn-link):not(.close) { min-height: 44px; }
/* ojo: no tocar el display de botones que WHMCS esconde con .w-hidden / .hidden (los muestra su JS) */
.btn:not(.btn-sm):not(.btn-xs):not(.btn-link):not(.close):not(.btn-block):not(.w-hidden):not(.hidden):not(.d-none) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.w-hidden { display: none; }
.btn-lg { padding: .6rem 1.6rem; font-size: 1.1rem; }
.btn:focus, .btn.focus { box-shadow: none; }
.btn:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.btn-primary, .btn-success, .btn-checkout, .btn-order-now {
  background-color: var(--tmh-lime); border-color: var(--tmh-lime); color: var(--tmh-ink); font-weight: 800;
}
.btn-primary:hover, .btn-success:hover, .btn-checkout:hover, .btn-order-now:hover,
.btn-primary:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled):active,
.btn-primary:focus, .btn-success:focus {
  background-color: var(--tmh-lime-2); border-color: var(--tmh-lime-2); color: var(--tmh-ink);
}
.btn-primary.disabled, .btn-primary:disabled, .btn-success.disabled, .btn-success:disabled { background-color: var(--tmh-lime); border-color: var(--tmh-lime); color: var(--tmh-ink); opacity: .55; }
.btn-default, .btn-secondary, .btn-light, .btn-outline-secondary, .btn-outline-primary, .btn-info, .btn-warning {
  background-color: transparent; border: 1px solid var(--tmh-field); color: #fff;
}
.btn-default:hover, .btn-secondary:hover, .btn-light:hover, .btn-outline-secondary:hover, .btn-outline-primary:hover, .btn-info:hover, .btn-warning:hover,
.btn-default:focus, .btn-secondary:focus, .btn-info:focus, .btn-default:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled):active {
  background-color: var(--tmh-card-2); border-color: #fff; color: #fff;
}
.btn-danger { background-color: #b42318; border-color: #b42318; color: #fff; }
.btn-danger:hover, .btn-danger:focus { background-color: #8f1c13; border-color: #8f1c13; color: #fff; }
.btn-link, #main-body .btn-link { color: var(--tmh-link); font-weight: 600; }
.btn-link:hover { color: #fff; }
.btn-dark { background-color: #07111f; border-color: var(--tmh-edge-2); color: #fff; }

/* campos: fondo tinta, texto blanco, borde #6f86a6; los desplegables nativos en oscuro (color-scheme) para que se lean */
#main-body, .modal { color-scheme: dark; }
.form-control, .custom-select, select.form-control, .input-group-text {
  font-family: var(--tmh-font); font-size: 1rem; color: #fff; background-color: var(--tmh-field-bg);
  border: 1px solid var(--tmh-field); border-radius: var(--tmh-r-s);
}
.form-control:not(textarea):not([size]):not([multiple]), .custom-select { min-height: 44px; height: auto; }
select option, select optgroup { background-color: var(--tmh-card); color: #fff; }
select.form-control:not([multiple]):not([size]), .custom-select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23c9d4e3' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m6 9 6 6 6-6'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right 12px center; background-size: 14px; padding-right: 36px; }
.input-group-text { background: var(--tmh-card-2); color: var(--tmh-tx); }
.form-control::placeholder { color: var(--tmh-tx-2); opacity: 1; }
/* foco de campos: anillo claro de 3 px. !important porque Twenty-One y sus plugins ponen box-shadow:none en :focus */
.form-control:focus, .custom-select:focus, .field:focus, input:focus, select:focus, textarea:focus { color: #fff; background-color: var(--tmh-field-bg); border-color: var(--tmh-link); box-shadow: var(--tmh-ring) !important; outline: 0; }
.form-control:disabled, .form-control[readonly] { background-color: var(--tmh-card-2); color: var(--tmh-tx); }
input:-webkit-autofill, input:-webkit-autofill:focus { -webkit-text-fill-color: #fff; box-shadow: 0 0 0 1000px var(--tmh-field-bg) inset !important; caret-color: #fff; }
label, .col-form-label, .control-label { color: #fff; font-weight: 600; font-size: .95rem; }
.form-text, .field-help-text { color: var(--tmh-tx-2); }
.is-invalid, .form-control.is-invalid, .has-error .form-control { border-color: var(--tmh-bad) !important; }
.invalid-feedback, .has-error .help-block, .has-error .control-label { color: var(--tmh-bad); font-weight: 600; }
.custom-control-label { font-weight: 500; }
.custom-control-label::before { background-color: var(--tmh-field-bg); border-color: var(--tmh-field); }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--tmh-lime); border-color: var(--tmh-lime); }
.custom-control-input:focus ~ .custom-control-label::before { box-shadow: var(--tmh-ring); }
.selected-flag:focus-visible { outline: 3px solid #fff; outline-offset: 0; }
/* teléfono con banderas (intl-tel-input): la lista de países queda clara, con texto tinta */
.intl-tel-input .selected-flag { background: var(--tmh-card-2) !important; }
.intl-tel-input .selected-dial-code { color: #fff; }
.intl-tel-input .iti-arrow { border-top-color: var(--tmh-tx); }
.intl-tel-input .country-list { background: #fff; color: var(--tmh-ink); border-radius: var(--tmh-r-s); box-shadow: var(--tmh-shadow-dark); }
.intl-tel-input .country-list .dial-code { color: var(--tmh-muted); }

/* iCheck (casillas y radios de WHMCS): con CSS en lugar de la imagen azul.
   «body» delante: standard_cart/css/all.min.css se carga DESPUÉS de este archivo y trae sus reglas de iCheck */
body .icheckbox_square-blue, body .iradio_square-blue {
  display: inline-block; position: relative; width: 22px; height: 22px; margin: 0 8px 0 0; vertical-align: middle; flex: none;
  background: var(--tmh-field-bg) none !important; border: 2px solid var(--tmh-field); border-radius: 5px; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}
body .iradio_square-blue { border-radius: 50%; }
body .icheckbox_square-blue.hover, body .iradio_square-blue.hover { border-color: #fff; }
body .icheckbox_square-blue.checked, body .iradio_square-blue.checked { background-color: var(--tmh-lime) !important; border-color: var(--tmh-lime); }
body .icheckbox_square-blue.checked::after { content: ""; position: absolute; left: 6px; top: 2px; width: 6px; height: 11px; border: solid var(--tmh-ink); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
body .iradio_square-blue.checked::after { content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: var(--tmh-ink); }
body .icheckbox_square-blue.focus, body .iradio_square-blue.focus, body .icheckbox_square-blue:focus-within, body .iradio_square-blue:focus-within { outline: 3px solid #fff; outline-offset: 2px; }
body .icheckbox_square-blue.disabled, body .iradio_square-blue.disabled { opacity: .5; cursor: not-allowed; }

/* interruptor (bootstrap-switch: lista de correo) */
.bootstrap-switch { background: var(--tmh-field-bg) !important; border-color: var(--tmh-field) !important; border-radius: var(--tmh-r-s) !important; }
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success { background: var(--tmh-lime) !important; color: var(--tmh-ink) !important; font-weight: 700; }
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default { background: var(--tmh-card-2) !important; color: #fff !important; }
.bootstrap-switch .bootstrap-switch-label { background: var(--tmh-card) !important; }
.bootstrap-switch.bootstrap-switch-focused { box-shadow: var(--tmh-ring) !important; border-color: #fff !important; }

/* tarjetas y barra lateral */
.card, .panel { background-color: var(--tmh-card); border: 1px solid var(--tmh-edge); border-radius: var(--tmh-r-l); box-shadow: none; color: var(--tmh-tx); }
.card-header, .panel-heading { background: var(--tmh-card-2); border-bottom: 1px solid var(--tmh-edge); color: #fff; }
.card-header:first-child { border-radius: calc(var(--tmh-r-l) - 1px) calc(var(--tmh-r-l) - 1px) 0 0; }
.card-footer { background: var(--tmh-card-2); border-top: 1px solid var(--tmh-edge); color: var(--tmh-tx); }
.card-title, .panel-title { color: #fff; font-weight: 700; }
.card-sidebar { overflow: hidden; }
.card-sidebar .card-header .card-title, .card-sidebar .panel-title { font-size: 1rem; }
.card-sidebar .card-minimise { color: var(--tmh-tx-2); cursor: pointer; }
.list-group-item { background-color: transparent; border-color: var(--tmh-edge); color: var(--tmh-tx); }
.list-group-item-action { color: var(--tmh-tx); font-weight: 500; }
.list-group-item-action:hover, .list-group-item-action:focus { background: var(--tmh-card-2); color: #fff; }
.list-group-item.active, .card-sidebar .list-group-item.active {
  background: var(--tmh-card-2); border-color: var(--tmh-edge); color: var(--tmh-lime); font-weight: 700;
  box-shadow: inset 4px 0 0 var(--tmh-lime);
}
.list-group-item.active .badge { background: var(--tmh-lime); color: var(--tmh-ink); }

/* alertas: fondo de tarjeta, texto claro y borde izquierdo de color (todas ≥ 7:1) */
.alert { background: var(--tmh-card); border: 1px solid var(--tmh-edge); border-left-width: 4px; border-radius: var(--tmh-r-s); color: var(--tmh-tx); }
.alert-success { border-left-color: #2fe56e; color: #d9fbe4; }
.alert-info { border-left-color: var(--tmh-info); color: #e1ecff; }
.alert-warning { border-left-color: #f5b301; color: #fff1cc; }
.alert-danger { border-left-color: var(--tmh-bad); color: #ffe1de; }
.alert a, .alert .alert-link { color: #fff !important; font-weight: 700; text-decoration: underline; }

/* insignias y estados (plan 2.4, versión oscura): fondo traslúcido + texto claro, todas ≥ 6.8:1 sobre la tarjeta */
.badge { border-radius: 999px; font-weight: 600; padding: .3em .7em; }
.badge-primary, .badge-success { background: rgba(0, 153, 52, .18); color: var(--tmh-ok); }
.badge-info { background: rgba(42, 110, 235, .22); color: var(--tmh-info); }
.badge-warning { background: rgba(245, 179, 1, .15); color: var(--tmh-warn); }
.badge-danger { background: rgba(180, 35, 24, .28); color: #ff9c94; }
.badge-secondary, .badge-light, .badge-default { background: rgba(255, 255, 255, .08); color: #b8c4d4; }
.badge-dark { background: #fff; color: var(--tmh-ink); }
.label.status, .status { border-radius: 999px; font-weight: 600; font-size: .78rem; padding: 3px 10px; text-transform: none; }
.label.status-active, .label.status-open, .label.status-completed, .label.status-paid, .label.status-accepted,
.status-active, .status-open, .status-completed, .status-paid, .status-accepted { background: rgba(0, 153, 52, .18); color: #7ef0a1; }
.label.status-suspended, .label.status-refunded, .label.status-pending-transfer,
.status-suspended, .status-refunded, .status-pending-transfer { background: rgba(245, 179, 1, .15); color: #ffd166; }
.label.status-pending, .label.status-unpaid, .label.status-inprogress,
.status-pending, .status-unpaid, .status-inprogress { background: rgba(180, 35, 24, .28); color: #ff9c94; }
.label.status-onhold, .label.status-payment-pending, .label.status-delivered,
.status-onhold, .status-payment-pending, .status-delivered { background: rgba(42, 110, 235, .22); color: #9cc2ff; }
.label.status-answered, .status-answered { background: rgba(91, 63, 166, .3); color: #c7b3ff; }
.label.status-customer-reply, .label.status-grace, .label.status-redemption, .label.status-pending-registration,
.status-customer-reply, .status-grace, .status-redemption, .status-pending-registration { background: rgba(176, 72, 0, .28); color: #ffb380; }
.label.status-closed, .label.status-cancelled, .label.status-terminated, .label.status-expired, .label.status-transferred-away,
.status-closed, .status-cancelled, .status-terminated, .status-expired, .status-transferred-away { background: rgba(255, 255, 255, .08); color: #b8c4d4; }
.label.status-fraud, .label.status-collections, .label.status-lost, .label.status-dead,
.status-fraud, .status-collections, .status-lost, .status-dead { background: #fff; color: var(--tmh-ink); }

/* tablas */
.table { color: var(--tmh-tx); background: var(--tmh-card); }
.table thead th, .table-list thead th { background: var(--tmh-card-2); color: #fff; font-weight: 600; border-bottom: 1px solid var(--tmh-edge-2); border-top: 0; }
.table td, .table th { border-top-color: var(--tmh-edge); }
.table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, .03); }
.table-hover tbody tr:hover { background-color: var(--tmh-card-2); color: #fff; }
.table td.text-right, .table .price, .table .amount { font-variant-numeric: tabular-nums; }
.table-responsive { border-radius: var(--tmh-r-m); }

/* pestañas y paginación */
.nav-tabs { border-bottom-color: var(--tmh-edge-2); }
.nav-tabs .nav-link { color: var(--tmh-tx); font-weight: 600; border: 0; border-bottom: 3px solid transparent; }
.nav-tabs .nav-link:hover { color: #fff; border-bottom-color: var(--tmh-edge-2); }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: #fff; background: transparent; border-bottom-color: var(--tmh-lime); }
.page-link { background: var(--tmh-card); color: var(--tmh-link); border-color: var(--tmh-edge-2); min-width: 40px; text-align: center; }
.page-link:hover { background: var(--tmh-card-2); color: #fff; border-color: var(--tmh-edge-2); }
.page-item.active .page-link { background: var(--tmh-lime); border-color: var(--tmh-lime); color: var(--tmh-ink); }
.page-item.disabled .page-link { background: var(--tmh-card); color: var(--tmh-tx-2); border-color: var(--tmh-edge); }

/* modales */
.modal-content { background: var(--tmh-card); color: var(--tmh-tx); border: 1px solid var(--tmh-edge-2); border-radius: var(--tmh-r-l); box-shadow: var(--tmh-shadow-dark); overflow: hidden; }
.modal .modal-header { background: var(--tmh-card-2); border-bottom: 1px solid var(--tmh-edge); }
.modal .modal-footer { border-top-color: var(--tmh-edge); }
.modal-title { color: #fff; font-weight: 700; }
.modal .close { color: #fff; text-shadow: none; opacity: .85; }
.modal-localisation .modal-content { background-color: var(--tmh-zone); }
.modal-localisation .item-selector .item { color: var(--tmh-tx); border-radius: var(--tmh-r-s); }
.modal-localisation .item-selector .item:hover, .modal-localisation .item-selector .item.active { background: var(--tmh-lime); color: var(--tmh-ink); }
.modal-localisation .modal-body .h5, .modal-localisation .modal-body h5 { color: #fff; }
.popover { background: var(--tmh-card); border-color: var(--tmh-edge-2); }
.popover-body { color: var(--tmh-tx); }
.tooltip-inner { background: #fff; color: var(--tmh-ink); font-weight: 600; }

/* ---------- 6. piezas que no se pueden pintar: van sobre una tarjeta clara ---------- */
/* reCAPTCHA (iframe de Google, siempre claro) */
#main-body .recaptcha-container, #main-body [id^="google-recaptcha"], #main-body .g-recaptcha {
  display: inline-block; width: auto; padding: 8px; background: #fff; border-radius: var(--tmh-r-m); line-height: 0;
}
/* Stripe (campos de tarjeta en iframes) y PayPal (botones): tarjeta clara con texto tinta alrededor */
#main-body #stripeElements, #main-body .stripe-cards-inputs, #main-body #frmPayment .StripeElement, #main-body .StripeElement,
#main-body .paypal-buttons, #main-body [id^="paypal-button"], #main-body #paypal-button-container {
  background: #fff; color: var(--tmh-ink); border-radius: var(--tmh-r-s);
}
#main-body .StripeElement { padding: 12px; border: 1px solid #74849a; }
#main-body .StripeElement--focus { box-shadow: var(--tmh-ring); }
#main-body .StripeElement--invalid { border-color: #b42318; }
#main-body .paypal-buttons, #main-body #paypal-button-container { padding: 12px; }

/* ---------- 7. login, registro, contraseña (Twenty-One) ---------- */
.login-form .card, .primary-content .card.mw-540, .primary-content .card.mw-750 { border-radius: var(--tmh-r-l); }
.primary-content .card-body.extra-padding h6:not(.h3), .login-form h6:not(.h3) { color: var(--tmh-tx-2); }
.primary-content .card-title, .login-form .card-title { color: #fff; font-weight: 800; letter-spacing: -0.01em; }
.primary-content .card-footer { border-radius: 0 0 var(--tmh-r-l) var(--tmh-r-l); }
.input-group .btn-reveal-pw, .input-group .btn-default { background: var(--tmh-card-2); border-color: var(--tmh-field); color: #fff; }
.input-group .btn-reveal-pw:hover, .input-group .btn-reveal-pw:active { background: var(--tmh-card-2); color: var(--tmh-lime); border-color: var(--tmh-field); }
.input-group-merge .input-group-text, .input-group-merge .form-control { border-color: var(--tmh-field); }
.progress { background: var(--tmh-card-2); border-radius: 999px; }
.progress-bar.bg-success { background-color: #2fe56e !important; }
.progress-bar.bg-warning { background-color: #f5b301 !important; }
.progress-bar.bg-danger { background-color: var(--tmh-bad) !important; }
#main-body .sub-heading span, #main-body .sub-heading-borderless span { background: var(--tmh-zone); color: #fff; }
/* Twenty-One pone #registration label { color:#666; font-weight:300; font-size:13px } (2.75:1 en oscuro, y ya era flojo en claro) */
#registration label { color: var(--tmh-tx); font-weight: 500; font-size: .92rem; }
#registration .form-check, #registration .form-check-label { color: var(--tmh-tx); }
/* Twenty-One pinta los campos del registro con #registration .field/.form-control { background:#fff; color:#626262; height:36px; font-size:13px } */
#registration .field, #registration .form-control { min-height: 44px; height: auto; color: #fff; background: var(--tmh-field-bg); border: 1px solid var(--tmh-field); border-radius: var(--tmh-r-s); font-size: 1rem; }
#registration .prepend-icon .field { padding-left: 42px; }
#registration .prepend-icon .field-icon { width: 42px; height: 44px; line-height: 44px; color: var(--tmh-tx-2); }
#registration .sub-heading { border-top-color: var(--tmh-edge-2); }
#registration .sub-heading span { color: #fff; background: var(--tmh-card); font-weight: 700; }
/* título de las tarjetas de login / contraseña (<h6 class="h3">) */
#main-body .card h6.h3, #main-body .card .h3, #main-body .card .h4 { color: #fff; font-weight: 800; letter-spacing: -0.01em; }
/* «Remember Me»: checkbox de Bootstrap fuera de .form-check (queda absoluto y pisa el botón en español) */
#main-body label > .form-check-input { position: static; width: 18px; height: 18px; margin: 0 8px 0 0; vertical-align: -3px; accent-color: var(--tmh-lime); }

/* ---------- 8. pie de la web (includes/tmh-footer-*.tpl) ---------- */
.tmh-footer { background: #07111f; color: #b8c4d4; font-size: .95rem; line-height: 1.6; border-top: 1px solid var(--tmh-edge); }
.tmh-footer ul { margin: 0; padding: 0; list-style: none; }
.tmh-footer-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr; gap: 32px; padding-top: 56px; padding-bottom: 40px; }
.tmh-footer-title { color: #fff; font-size: .95rem; font-weight: 700; letter-spacing: 0; line-height: 1.3; margin: 0 0 14px; }
.tmh-footer li + li { margin-top: 8px; }
.tmh-footer a { color: #dbe4f0; }
.tmh-footer a:hover { color: #fff; }
.tmh-footer a:focus-visible, .tmh-footer button:focus-visible { outline-color: #fff; }
.tmh-footer .tmh-sub-group { padding: 10px 0 4px; color: #a3b1c4; font-size: .78rem; font-weight: 600; }
.tmh-footer .tmh-sub-group:first-child { padding-top: 0; }
.tmh-footer-brand .tmh-brand { color: #fff; }
.tmh-footer-brand p { margin: 14px 0 0; max-width: 30ch; color: #a3b1c4; font-size: .88rem; }
.tmh-tag { display: inline-block; margin-left: 6px; padding: 2px 9px; border-radius: 999px; font-size: .74rem; font-weight: 600; line-height: 1.4; background: rgba(255, 255, 255, .08); color: #c9d3e0; border: 1px solid rgba(255, 255, 255, .14); }
.tmh-social { display: inline-flex; align-items: center; gap: 8px; }
.tmh-social .tmh-icon { width: 18px; height: 18px; }
.tmh-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .1); }
.tmh-footer-bottom > .tmh-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding-top: 20px; padding-bottom: 24px; font-size: .85rem; color: #a3b1c4; }
.tmh-footer-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; }
.tmh-footer-links li + li { margin-top: 0; }
.tmh-footer-links a { display: inline-flex; align-items: center; min-height: 44px; }
.tmh-footer-legal { display: flex; flex-wrap: wrap; gap: 4px 24px; margin: 0; }
.tmh-locale-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 1px solid rgba(255, 255, 255, .22); border-radius: var(--tmh-r-s); background: rgba(255, 255, 255, .06); color: #fff; font-family: inherit; font-size: .88rem; font-weight: 600; cursor: pointer; }
.tmh-locale-btn:hover { background: rgba(255, 255, 255, .14); }
.tmh-locale-btn .iti-flag { display: inline-block; }

/* ---------- 9. responsive y movimiento reducido ---------- */
/* ws9-t1 (9-nov-2026): con «Minecraft Bedrock» (antes «PE») el menú en español no cabía entre 1200 y 1340 px (hasta 65 px de scroll
   lateral; 173 px si no cargan las fuentes de Google). Desde 1200 px el menú se compacta: menos relleno y letra un poco menor. */
@media (min-width: 1200px) {
  .tmh-nav > .tmh-wrap { gap: 8px; }
  .tmh-menu > li > a, .tmh-menu > li > button { padding: 0 7px; gap: 4px; font-size: .86rem; }
  .tmh-menu > li > a.tmh-btn-client { padding: 0 10px; }
  .tmh-nav-cta { margin-left: 2px; }
  .tmh-caret { width: 12px; height: 12px; }
}
/* ws9-t2 (9-nov-2026, ronda 2): «Minecraft PC» → «Minecraft Java» alarga 12 px el menú. En español ya se pasaba de la columna
   (6 px con Montserrat; 22 px de scroll lateral a 1200 px con la letra de respaldo de Linux) y con «Java» llegaba a 19 / 35 px.
   Solo en español y solo en escritorio: un poco menos de relleno y de letra. El inglés no cambia. */
@media (min-width: 1200px) {
  html[lang="es"] .tmh-nav > .tmh-wrap { gap: 6px; }
  html[lang="es"] .tmh-menu > li > a, html[lang="es"] .tmh-menu > li > button { padding: 0 5px; font-size: .84rem; }
  html[lang="es"] .tmh-menu > li > a.tmh-btn-client { padding: 0 8px; }
}
@media (max-width: 1199.98px) {
  /* menú de la web en hamburguesa (como la web, que cambia a 1180 px) */
  .tmh-nav-toggle { display: inline-flex; }
  .tmh-cart { margin-left: auto; }
  .tmh-menu {
    display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0;
    margin: 0 !important; padding: 8px 15px 16px !important; background: var(--tmh-paper); border-bottom: 1px solid var(--tmh-line); box-shadow: var(--tmh-shadow);
    max-height: calc(100vh - var(--tmh-nav-h)); overflow-y: auto; overscroll-behavior: contain;
  }
  .tmh-menu.is-open { display: flex; }
  .tmh-menu > li > a, .tmh-menu > li > button { width: 100%; justify-content: space-between; min-height: 48px; font-size: 1.02rem; }
  .tmh-sub { position: static; display: none; min-width: 0; padding: 0 0 8px 12px !important; border: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; transition: none; }
  .tmh-menu > li:hover > .tmh-sub, .tmh-menu > li:focus-within > .tmh-sub { display: none; }
  .tmh-menu > li > button[aria-expanded="true"] + .tmh-sub { display: block; }
  .tmh-menu > li > a.tmh-lang { justify-content: flex-start; gap: 10px; }
  .tmh-nav-cta { margin: 10px 0 0; }
  .tmh-menu > li > a.tmh-btn-client { width: 100%; justify-content: center; min-height: 48px; }
  header.header .main-navbar-wrapper .navbar-collapse { padding: 0 0 10px; }
  header.header .main-navbar-wrapper > .container { padding-left: 15px; padding-right: 15px; }   /* Bootstrap lo deja a 0 en .navbar-expand-xl */
  header.header .navbar-nav .nav-link { min-height: 48px; }
  .tmh-footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; }
  .tmh-footer-follow { grid-column: 1 / -1; }
}
@media (max-width: 991.98px) {
  .tmh-footer-grid { grid-template-columns: 1fr 1fr; }
  .tmh-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 767.98px) {
  section#main-body { padding: 24px 0 44px; }
  h1, .h1, .font-size-36 { font-size: 1.85rem; }
  .tmh-page-hero > .container { min-height: 120px; padding-top: 22px; padding-bottom: 22px; }
}
@media (max-width: 599.98px) {
  .tmh-promo > .tmh-wrap { padding-top: 8px; padding-bottom: 8px; gap: 4px 14px; }
  .tmh-promo { font-size: .84rem; }
  .tmh-promo-text .tmh-icon { display: none; }
  .tmh-footer-grid { grid-template-columns: 1fr; gap: 24px; padding-top: 40px; }
  .tmh-footer-bottom > .tmh-wrap { flex-direction: column; align-items: flex-start; }
}
/* ---- Sin dominios (orden de Rafael, 2-nov-2026: «no vendemos dominios, quítalo») ----
   Parche visual del tema. La vía limpia es apagar el registro/transferencia en el admin de WHMCS (ficha en el reporte
   REPORTE-ws9-t3-sin-dominios.md); con eso WHMCS ya no genera estos ítems y esta regla deja de tener efecto.
   Se ocultan por el nombre interno del menú (menuitemname/id), que es igual en inglés y en español.
   NO se oculta el menú «Domains» del cliente con sesión: si un cliente viejo tiene un dominio, debe poder verlo. */
#Primary_Navbar-Store-Register_a_New_Domain,
#Primary_Navbar-Store-Transfer_a_Domain_to_Us,
li[menuitemname="Register a New Domain"],
li[menuitemname="Transfer a Domain to Us"],
[menuitemname="Domain Registration"],
[menuitemname="Domain Transfer"] { display: none !important; }

/* ---- Sin VPS por ahora (orden de Rafael, 5-nov-2026: «quita VPS por ahora») — ws9-t1 ----
   Parche visual, igual que el de dominios. Oculta los grupos «Dallas VPS Hosting» y «Amsterdam VPS SSD» en el menú Store, en la
   barra «Categories» del carrito (lista y desplegable de celular) y en cualquier link a su tienda, por nombre interno del menú
   (menuitemname/id, igual en inglés y en español) y por la URL de la tienda (rp=/store/<slug>, que no cambia con el idioma).
   NO toca el área de cliente: un cliente que ya tiene un VPS lo sigue viendo en «Services» (esos links van a clientarea.php, no a
   /store/). La vía limpia es ocultar los 2 grupos en el admin (ficha en INSTALAR-TEMA-WHMCS.md, paso 7); con eso esta regla ya no
   encuentra nada. En iPhone/iPad un <option> oculto sigue saliendo en el desplegable (igual que con dominios): solo el admin lo quita. */
#Primary_Navbar-Store-Dallas_VPS_Hosting,
#Primary_Navbar-Store-Amsterdam_VPS_SSD,
[menuitemname="Dallas VPS Hosting"],
[menuitemname="Amsterdam VPS SSD"],
a[href*="rp=/store/dallas-vps-hosting"],
a[href*="rp=/store/amsterdam-vps-ssd"],
option[value*="rp=/store/dallas-vps-hosting"],
option[value*="rp=/store/amsterdam-vps-ssd"],
li:has(> a[href*="rp=/store/dallas-vps-hosting"]),
li:has(> a[href*="rp=/store/amsterdam-vps-ssd"]) { display: none !important; }

/* ---------- 10. Área de cliente con sesión (ws9-t3, 2-nov-2026) ----------
   Twenty-One pinta en claro (#fff / #f8f8f8 / #f6f6f6) piezas que solo salen con sesión: tiles de inicio, cabeceras de los paneles
   de inicio, tablas de DataTables (servicios, facturas, tickets), estado del producto, pestañas del servicio, respuestas de ticket,
   editor Markdown y adjuntos. Aquí se pasan a la zona oscura con los mismos tokens. La factura (viewinvoice.tpl) NO se toca: es una
   página suelta que no carga custom.css y se queda clara tipo papel (se imprime y se guarda en PDF). */
/* barra superior del cliente: «Logged in as:» alineado con el nombre */
@media (min-width: 768px) {
  header.header .topbar .active-client .input-group-prepend { display: flex !important; align-items: center; }
}
header.header .topbar .active-client .input-group-text { background: transparent; border: 0; padding-right: 4px; }
header.header .topbar .active-client .btn-active-client span { border-bottom-color: var(--tmh-tx-2); }
/* tiles de inicio */
.tiles { border: 1px solid var(--tmh-edge); border-radius: var(--tmh-r-l); overflow: hidden; }
.tiles .tile { background-color: var(--tmh-card); border-right-color: var(--tmh-edge); color: #fff; }
.tiles .tile:hover { background-color: var(--tmh-card-2); }
.tiles .tile .stat { color: #fff; font-weight: 700; }
.tiles .tile .title { color: var(--tmh-tx-2); letter-spacing: .04em; }
.tiles .tile i { color: rgba(255, 255, 255, .14); }
.tiles .tile:hover i { color: rgba(255, 255, 255, .26); }
.tiles div:nth-child(1) > .tile, .tiles div:nth-child(2) > .tile { border-bottom-color: var(--tmh-edge); }
/* paneles de inicio: cabecera oscura con título blanco; el color de cada panel queda en la raya de arriba (card-accent-*)
   y el botón de la cabecera pasa a contorno (blanco sobre el rojo/dorado/celeste de Twenty-One no llega a 4.5:1) */
.card.card-accent-red { border-top: 3px solid #d9534f; }
.card.card-accent-gold { border-top: 3px solid #f0ad4e; }
.card.card-accent-blue { border-top: 3px solid #5bc0de; }
.card.card-accent-green, .card.card-accent-emerald { border-top: 3px solid #2ecc71; }
.card.card-accent-teal { border-top: 3px solid #00aba9; }
.card.card-accent-asbestos { border-top: 3px solid #7f8c8d; }
.card.card-accent-midnight-blue { border-top: 3px solid #5b7da3; }
.client-home-cards .card-header { background: var(--tmh-card-2); border-bottom: 1px solid var(--tmh-edge); }
.client-home-cards .card-title { color: #fff; }
.client-home-cards .card-header .btn { background: transparent !important; border: 1px solid var(--tmh-edge-2); border-radius: var(--tmh-r-s); color: #fff; font-weight: 600; }
.client-home-cards .card-header .btn:hover, .client-home-cards .card-header .btn:focus { background: var(--tmh-lime) !important; border-color: var(--tmh-lime); color: var(--tmh-ink); }
.client-home-cards .list-group { border-top-color: var(--tmh-edge) !important; border-bottom-color: var(--tmh-edge) !important; }
.client-home-cards .list-group .list-group-item { border-bottom-color: var(--tmh-edge); }
.client-home-cards small, .client-home-cards .text-domain, .client-home-cards .text-last-updated { color: var(--tmh-tx-2); }
.client-home-cards .card-footer:empty { padding: 6px; }
/* tablas de DataTables (clientareaproducts / clientareainvoices / supportticketslist) */
.dataTables_wrapper table.table-list { border-color: var(--tmh-edge); background: var(--tmh-card); }
table.table-list thead th { background-color: var(--tmh-card-2); color: #fff; border-bottom-color: var(--tmh-edge-2); font-weight: 600; }
.dataTables_wrapper table.table-list thead th { border-bottom: 2px solid var(--tmh-edge-2); }
.dataTables_wrapper table.table-list thead th.sorting_asc, .dataTables_wrapper table.table-list thead th.sorting_desc { background-color: #1a3458; }
.table-list > tbody > tr > td { background-color: var(--tmh-card); border-top-color: var(--tmh-edge); color: var(--tmh-tx); }
.table-list > tbody > tr:hover > td { background-color: var(--tmh-card-2); color: #fff; }
.table-list strong, .table-list .ticket-subject.unread { color: #fff; }
.table-list .text-muted { color: var(--tmh-tx-2) !important; }
.table-list > tbody > tr > td a.border-left { border-left-color: var(--tmh-edge); }
.table-list .ticket-number { color: var(--tmh-tx-2); }
.dataTables_wrapper .dataTables_filter label .form-control {
  background: var(--tmh-field-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238fa3bd' stroke-width='2.5' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 16px 50%;
  color: #fff; border-color: var(--tmh-field);
}
.dataTables_info, .dataTables_length label { color: var(--tmh-tx); }
/* detalle de servicio */
div.product-details div.product-icon { background-color: var(--tmh-card-2); color: #fff; }
div.product-details div.product-icon .fa-circle { color: rgba(255, 255, 255, .12); }
div.product-details div.product-icon h3 { color: #fff; }
div.product-details div.product-icon h4 { color: var(--tmh-tx); font-weight: 600; }
.product-status-text { font-weight: 700; letter-spacing: .04em; }
.product-status-active { background-color: #1f7a3a; }
.product-details .col-md-6.text-center { color: #fff; }
.product-details .col-md-6.text-center h4 { margin: 14px 0 2px; color: var(--tmh-tx-2); font-size: .82rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.product-details .col-md-6.text-center h4:first-child { margin-top: 0; }
.product-details .btn-block { padding-left: 8px; padding-right: 8px; font-size: .9rem; white-space: normal; word-break: normal; overflow-wrap: normal; }
/* por debajo de 1200 px la columna es estrecha: Upgrade/Downgrade y Request Cancellation uno debajo del otro (sin cortar palabras) */
@media (max-width: 1199.98px) {
  .product-details .col-md-6 > .row > .col-6 { flex: 0 0 100%; max-width: 100%; }
  .product-details .col-md-6 > .row > .col-6 + .col-6 { margin-top: 8px; }
}
div.product-details-tab-container, .product-details-tab-container.bg-white { background-color: var(--tmh-card) !important; border-color: var(--tmh-edge); color: var(--tmh-tx); border-radius: 0 0 var(--tmh-r-l) var(--tmh-r-l); }
.responsive-tabs-sm-connector .channel, .responsive-tabs-sm-connector .bottom-border { border-color: var(--tmh-edge) !important; background: transparent; }
#main-body code { padding: 2px 6px; border-radius: 4px; background: rgba(255, 255, 255, .07); color: var(--tmh-lime-2); }
/* ver ticket */
.view-ticket .card-body { border-bottom-color: var(--tmh-edge); }
.view-ticket .posted-by { background-color: var(--tmh-card-2); color: #a9b8cc; }   /* 9-nov: #8fa3bd daba 4.1:1 en WebKit a 390 px */
.view-ticket .posted-by .posted-by-name { color: #fff; }
.view-ticket .ticket-reply.staff .posted-by { box-shadow: inset 4px 0 0 var(--tmh-info); }
.view-ticket .attachments { border-top-color: var(--tmh-edge-2); }
.view-ticket .attachment-list li span { border-color: var(--tmh-edge-2); border-radius: var(--tmh-r-s); }
.view-ticket .attachment-list li figure { background-color: var(--tmh-card-2); color: var(--tmh-link); }
.requestor-type-operator, .label.requestor-type-operator { background-color: rgba(42, 110, 235, .22); color: #9cc2ff; }
.requestor-type-owner, .label.requestor-type-owner { background-color: rgba(0, 153, 52, .18); color: #7ef0a1; }
.requestor-type-registereduser { background-color: rgba(245, 179, 1, .15); color: #ffd166; }
.requestor-type-authorizeduser, .requestor-type-subaccount, .requestor-type-guest { background-color: rgba(255, 255, 255, .08); color: #b8c4d4; }
.ticket-reply .rating span.star:before, .ticket-reply .rating-done span.star:before { color: var(--tmh-tx-2); }
.card-sidebar .ticket-details-children .title { color: var(--tmh-tx-2); font-size: .78rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
/* editor Markdown (respuesta de ticket) y campo de adjuntos */
.md-editor, div.md-editor.active { border-color: var(--tmh-field); border-radius: var(--tmh-r-s); background: var(--tmh-field-bg); overflow: hidden; }
.md-editor > .btn-toolbar, .md-editor > .md-header { background-color: var(--tmh-card-2) !important; }
.md-editor > textarea.markdown-editor, .md-editor > .md-preview { background-color: var(--tmh-field-bg) !important; color: #fff; border-color: var(--tmh-edge) !important; }
.md-editor > textarea:focus { background: var(--tmh-field-bg) !important; }
.md-editor .md-footer { background: var(--tmh-card-2); color: var(--tmh-tx-2); }
.md-editor .btn-toolbar .btn-default { background: transparent; border-color: var(--tmh-edge-2); color: var(--tmh-tx); }
.md-editor .btn-toolbar .btn-default:hover { background: var(--tmh-card); color: #fff; }
.md-editor .md-controls .md-control { color: var(--tmh-tx-2); }
.custom-file-label { background: var(--tmh-field-bg); border-color: var(--tmh-field); color: var(--tmh-tx); }
.custom-file-label::after { background: var(--tmh-card-2); border-left-color: var(--tmh-field); color: #fff; }
/* pestañas del servicio en celular (responsive-tabs-sm): Twenty-One las apila sobre fondo blanco */
.responsive-tabs-sm .nav-item a:hover { background-color: var(--tmh-card-2); }
@media (max-width: 767.98px) {
  .responsive-tabs-sm { background: var(--tmh-card); border-color: var(--tmh-edge) !important; }
  .responsive-tabs-sm .nav-item { border-bottom-color: var(--tmh-edge) !important; }
  .responsive-tabs-sm .nav-item a.active { background-color: var(--tmh-card-2) !important; color: var(--tmh-lime); }
  .responsive-tabs-sm-connector .channel { background: var(--tmh-card); }
}
/* tablas de DataTables en celular: Twenty-One no trae la extensión Responsive y la tabla se sale (en Twenty-One de serie también,
   68 px a 390). Se compacta y, como red de seguridad, el contenedor desplaza en horizontal en vez de la página */
@media (max-width: 575.98px) {
  .table-container { overflow-x: auto; }
  table.table-list thead th, table.table-list tbody td { padding: 8px 4px; font-size: .8rem; }
  table.table-list.dataTable thead > tr > th.sorting, table.table-list.dataTable thead > tr > th.sorting_asc, table.table-list.dataTable thead > tr > th.sorting_desc { padding-right: 16px; }
  table.table-list.dataTable thead .sorting::before, table.table-list.dataTable thead .sorting::after,
  table.table-list.dataTable thead .sorting_asc::before, table.table-list.dataTable thead .sorting_asc::after,
  table.table-list.dataTable thead .sorting_desc::before, table.table-list.dataTable thead .sorting_desc::after { right: 2px; }
  .table-list .label.status { padding: 2px 6px; font-size: .7rem; }
  .table-list > tbody > tr > td a.border-left { padding-left: 8px; }
}

/* ---------- 11. Piezas claras de Twenty-One que no estaban en la maqueta (ws9-t3, 6-nov-2026; respaldo: custom.css.antes-subir) ----------
   Renderizadas con Smarty real: anuncios, «Mass Payment» (pagar varias facturas), upgrade de servicio (upgrade-configure.tpl),
   valoración de ticket, avisos «verifica tu correo» / «valida tu identidad» y .continue-container. Twenty-One les pone fondo claro
   (#f5f5f5, #efefef, #f8f8f8, #f9f9f9, #fff) y con el texto claro del tema quedaban ilegibles (contraste 1.1–1.4). */
.announcements .announcement article { background-color: var(--tmh-card-2); border-left-color: var(--tmh-edge-2); color: var(--tmh-tx); }
tr.masspay-total td { background-color: var(--tmh-card-2); color: var(--tmh-head); }
.ticketfeedbackstaffcont { background-color: var(--tmh-card-2); color: var(--tmh-tx); }
.upgrade .product-to-be-upgraded { background-color: var(--tmh-card-2); color: var(--tmh-tx); }
.upgrade .products .product { background-color: var(--tmh-card); border: 1px solid var(--tmh-edge); }
.upgrade .products .product ul, .upgrade .products .product .footer { border-color: var(--tmh-edge); }
.upgrade .products .product ul li { color: var(--tmh-tx-2); border-bottom-color: var(--tmh-edge); }
.upgrade .products .product ul li span { color: var(--tmh-tx); }
.upgrade .products .product .current { color: var(--tmh-ink); }
.verification-banner { background-color: var(--tmh-card); border-bottom-color: var(--tmh-edge); color: var(--tmh-tx); }
.verification-banner .btn.close, .verification-banner .btn.close:hover { color: var(--tmh-tx); text-shadow: none; opacity: 1; }
.continue-container { background-color: var(--tmh-card); border-color: var(--tmh-edge); color: var(--tmh-tx); }
/* .text-primary de Bootstrap (#336699 !important) en la página 404 y en la invitación de usuario: 2.9:1 sobre el fondo oscuro */
#main-body .text-primary { color: var(--tmh-link) !important; }

/* ---------- 12. Revisión de colores y fondos de TODO WHMCS (ws9-t1, 9-nov-2026; respaldo: custom.css.antes-1109) ----------
   Orden de Rafael: «que no haya textos en colores que no se vean ni fondos sin diseñar que se vean en blanco».
   Lo encontró qa/detector-colores.cjs en las 122 plantillas de Twenty-One/standard_cart 8.4.1 renderizadas y en el muestrario de
   componentes (Chromium, Firefox y WebKit a 1440/768/390). Todo es CSS; ninguna .tpl cambia.
   12.1 desplegables, 12.2 tablas, 12.3 pestañas y pastillas, 12.4 paginación, 12.5 insignias y estados, 12.6 botones,
   12.7 utilidades de color de Bootstrap (bg-*, text-*), 12.8 popover/tooltip, 12.9 formularios, 12.10 otros */

/* 12.1 desplegables (Bootstrap .dropdown-menu fuera de la barra: acciones de facturas, servicios, idioma del teléfono…) */
.dropdown-menu { background-color: var(--tmh-card); border: 1px solid var(--tmh-edge-2); border-radius: var(--tmh-r-m); box-shadow: var(--tmh-shadow-dark); color: var(--tmh-tx); }
.dropdown-item { color: var(--tmh-tx); }
.dropdown-item:hover, .dropdown-item:focus { background-color: var(--tmh-card-2); color: #fff; }
.dropdown-item.active, .dropdown-item:active { background-color: var(--tmh-card-2); color: var(--tmh-lime); }
.dropdown-item.disabled, .dropdown-item:disabled { color: var(--tmh-tx-2); background-color: transparent; }
.dropdown-header { color: var(--tmh-tx-2); }
.dropdown-divider { border-top-color: var(--tmh-edge); }
/* lista de países del teléfono (intl-tel-input): antes clara; ahora oscura como el resto */
.intl-tel-input .country-list { background-color: var(--tmh-card); color: var(--tmh-tx); border: 1px solid var(--tmh-edge-2); }
.intl-tel-input .country-list .country.highlight { background-color: var(--tmh-card-2); color: #fff; }
.intl-tel-input .country-list .dial-code { color: var(--tmh-tx-2); }
.intl-tel-input .country-list .divider { border-bottom-color: var(--tmh-edge); }

/* 12.2 tablas: cabeceras «light/dark» y filas de color de Bootstrap (claras de serie) */
.table .thead-light th, .table .thead-dark th { background-color: var(--tmh-card-2); border-color: var(--tmh-edge-2); color: #fff; }
.table-bordered, .table-bordered td, .table-bordered th { border-color: var(--tmh-edge); }
.table-active, .table-active > td, .table-active > th { background-color: rgba(255, 255, 255, .06); color: #fff; }
.table-success, .table-success > td, .table-success > th { background-color: rgba(0, 153, 52, .2); color: #d9fbe4; }
.table-danger, .table-danger > td, .table-danger > th { background-color: rgba(180, 35, 24, .3); color: #ffe1de; }
.table-warning, .table-warning > td, .table-warning > th { background-color: rgba(245, 179, 1, .16); color: #fff1cc; }
.table-info, .table-info > td, .table-info > th { background-color: rgba(42, 110, 235, .22); color: #e1ecff; }
.table-primary, .table-primary > td, .table-primary > th, .table-secondary, .table-secondary > td, .table-secondary > th,
.table-light, .table-light > td, .table-light > th { background-color: var(--tmh-card-2); color: var(--tmh-tx); }
.table-dark, .table-dark > td, .table-dark > th { background-color: #07111f; color: #fff; }
.table tr.selected td, table.dataTable tbody tr.selected { background-color: var(--tmh-card-2); color: #fff; }

/* 12.3 pestañas y pastillas */
.nav-tabs .nav-link.disabled { color: var(--tmh-tx-2); background: transparent; }
.nav-pills .nav-link { color: var(--tmh-link); font-weight: 600; }
.nav-pills .nav-link:hover { color: #fff; background-color: var(--tmh-card-2); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: var(--tmh-lime); color: var(--tmh-ink); }
.nav-pills .nav-link.disabled { color: var(--tmh-tx-2); background: transparent; }

/* 12.4 paginación (DataTables usa .dataTables_paginate .page-link con un gris #444 de Twenty-One) */
#main-body .pagination .page-link, #main-body .dataTables_wrapper .pagination .page-link { background-color: var(--tmh-card); color: var(--tmh-link); border-color: var(--tmh-edge-2); }
#main-body .pagination .page-link:hover, #main-body .dataTables_wrapper .pagination .page-link:hover { background-color: var(--tmh-card-2); color: #fff; }
#main-body .pagination .page-item.active .page-link, #main-body .dataTables_wrapper .pagination .page-item.active .page-link { background-color: var(--tmh-lime); border-color: var(--tmh-lime); color: var(--tmh-ink); }
#main-body .pagination .page-item.disabled .page-link, #main-body .dataTables_wrapper .pagination .page-item.disabled .page-link { background-color: var(--tmh-card); color: var(--tmh-tx-2); }

/* 12.5 insignias y estados: ninguno en blanco */
.badge-dark { background: #07111f; color: #fff; box-shadow: inset 0 0 0 1px var(--tmh-edge-2); }
.badge-light { background: rgba(255, 255, 255, .08); color: #dfe6ef; }
.sidebar .badge, .card-sidebar .badge, .list-group-item .badge:not([class*="badge-"]) { background: rgba(255, 255, 255, .1); color: #fff; }
.label { color: #fff; }
.label-default, .label-grey { background: rgba(255, 255, 255, .1); color: #dfe6ef; }
.label-info { background: rgba(42, 110, 235, .22); color: var(--tmh-info); }
.label-success { background: rgba(0, 153, 52, .2); color: var(--tmh-ok); }
.label-danger { background: rgba(180, 35, 24, .3); color: #ff9c94; }
.label-warning { background: rgba(245, 179, 1, .16); color: var(--tmh-warn); }
.label-primary { background: var(--tmh-card-2); color: #fff; }
.label.status-overdue, .status-overdue { background: rgba(180, 35, 24, .42); color: #ffd2cc; }
.label.status-draft, .status-draft { background: rgba(255, 255, 255, .08); color: #b8c4d4; }
.label.status-fraud, .label.status-collections, .status-fraud, .status-collections { background: rgba(180, 35, 24, .5); color: #fff; box-shadow: inset 0 0 0 1px #ff9c94; }
.label.status-lost, .label.status-dead, .status-lost, .status-dead { background: rgba(255, 255, 255, .08); color: #b8c4d4; box-shadow: inset 0 0 0 1px var(--tmh-edge-2); }
/* estados de ticket con el color del admin de WHMCS (style="background-color:…" en línea): se oscurece ese color con una capa
   para que el texto blanco se lea con cualquier color (#779500, #ff6600, #888888, #cc0000…) sin perder el tono */
.label.status-custom, .status-custom { background-image: linear-gradient(rgba(12, 26, 46, .62), rgba(12, 26, 46, .62)) !important; color: #fff !important; box-shadow: inset 0 0 0 1px var(--tmh-edge-2); }
.label.requestor-type-owner, .label.requestor-type-operator, .label.requestor-type-user, .label.requestor-type-guest, .label.requestor-type-subaccount { background: rgba(255, 255, 255, .1); color: #fff; }

/* 12.6 botones: contornos, «activo», deshabilitados y el gris claro de Twenty-One */
.btn-outline-success, .btn-outline-danger, .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark {
  background-color: transparent; border: 1px solid var(--tmh-field); color: #fff;
}
.btn-outline-success:hover, .btn-outline-danger:hover, .btn-outline-warning:hover, .btn-outline-info:hover, .btn-outline-light:hover, .btn-outline-dark:hover,
.btn-outline-success:focus, .btn-outline-danger:focus, .btn-outline-warning:focus, .btn-outline-info:focus, .btn-outline-light:focus, .btn-outline-dark:focus {
  background-color: var(--tmh-card-2); border-color: #fff; color: #fff;
}
.btn-outline-danger { border-color: #ff8a80; color: #ffb4ad; }
.btn-default.active, .btn-default:not(:disabled):not(.disabled).active, .btn-secondary.active, .btn-light.active,
.btn-group > .btn.active, .show > .btn-default.dropdown-toggle { background-color: var(--tmh-card-2); border-color: var(--tmh-lime); color: var(--tmh-lime); box-shadow: none; }
.btn-primary.disabled, .btn-primary:disabled, .btn-success.disabled, .btn-success:disabled { opacity: .75; }
.btn-default:disabled, .btn-default.disabled, .btn-secondary:disabled, .btn-info:disabled, .btn-warning:disabled { color: var(--tmh-tx); opacity: .75; }
.btn-light { color: #fff; }
.close, .close:hover { color: #fff; text-shadow: none; }

/* 12.7 utilidades de color de Bootstrap que usan las .tpl (bg-white ×15, bg-light ×7, bg-primary ×9, bg-success ×7…):
   llevan !important en Bootstrap; se cambian solo dentro del área de WHMCS (#main-body y modales) */
#main-body .bg-white, #main-body .bg-light, #main-body .bg-default, .modal .bg-white, .modal .bg-light { background-color: var(--tmh-card) !important; color: var(--tmh-tx); }
#main-body .bg-primary, .modal .bg-primary { background-color: var(--tmh-card-2) !important; color: #fff; }
#main-body .bg-success, .modal .bg-success { background-color: #0f3d24 !important; color: #d9fbe4; }
#main-body .bg-warning, .modal .bg-warning { background-color: #3d3104 !important; color: #fff1cc; }
#main-body .bg-danger, .modal .bg-danger { background-color: #4a1410 !important; color: #ffe1de; }
#main-body .bg-info, .modal .bg-info { background-color: #10305e !important; color: #e1ecff; }
#main-body .bg-dark, .modal .bg-dark { background-color: #07111f !important; color: #fff; }
#main-body .text-danger { color: var(--tmh-bad) !important; }
#main-body .text-success { color: var(--tmh-ok) !important; }
#main-body .text-warning { color: var(--tmh-warn) !important; }
#main-body .text-info { color: var(--tmh-info) !important; }
#main-body .text-secondary, #main-body .text-black-50, #main-body .text-grey, #main-body .text-gray { color: var(--tmh-tx-2) !important; }
#main-body .text-dark, #main-body .text-body { color: var(--tmh-tx) !important; }
#main-body .progress { background-color: var(--tmh-field-bg); }
#main-body .progress-bar { background-color: var(--tmh-link); color: var(--tmh-ink); font-weight: 700; }
#main-body .progress-bar.bg-success { background-color: #2fe56e !important; color: var(--tmh-ink); }
#main-body .progress-bar.bg-warning { background-color: #f5b301 !important; color: var(--tmh-ink); }
#main-body .progress-bar.bg-danger { background-color: #ff8a80 !important; color: var(--tmh-ink); }
#main-body .jumbotron { background-color: var(--tmh-card); color: var(--tmh-tx); border: 1px solid var(--tmh-edge); }
#main-body .breadcrumb { background-color: var(--tmh-card); color: var(--tmh-tx); }
#main-body .breadcrumb-item.active { color: var(--tmh-tx-2); }
#main-body .breadcrumb-item + .breadcrumb-item::before { color: var(--tmh-tx-2); }

/* 12.8 popover y tooltip: oscuros como las tarjetas */
.popover { color: var(--tmh-tx); }
.popover-header { background-color: var(--tmh-card-2); border-bottom-color: var(--tmh-edge); color: #fff; }
.bs-popover-bottom > .arrow::after, .bs-popover-auto[x-placement^="bottom"] > .arrow::after, .bs-popover-bottom .popover-header::before { border-bottom-color: var(--tmh-card-2); }
.bs-popover-top > .arrow::after, .bs-popover-auto[x-placement^="top"] > .arrow::after { border-top-color: var(--tmh-card); }
.bs-popover-right > .arrow::after, .bs-popover-auto[x-placement^="right"] > .arrow::after { border-right-color: var(--tmh-card); }
.bs-popover-left > .arrow::after, .bs-popover-auto[x-placement^="left"] > .arrow::after { border-left-color: var(--tmh-card); }
.tooltip-inner { background: #07111f; color: #fff; border: 1px solid var(--tmh-edge-2); }
.bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before { border-top-color: #07111f; }
.bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before { border-bottom-color: #07111f; }
.bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before { border-left-color: #07111f; }
.bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before { border-right-color: #07111f; }

/* 12.9 formularios: válido, deshabilitado, archivo, rango */
.valid-feedback { color: var(--tmh-ok); font-weight: 600; }
.is-valid, .form-control.is-valid { border-color: #2fe56e !important; }
.custom-control-input:disabled ~ .custom-control-label, .custom-control-input[disabled] ~ .custom-control-label { color: var(--tmh-tx-2); }
.custom-control-input:disabled ~ .custom-control-label::before { background-color: var(--tmh-card-2); }
.custom-select:disabled, select.form-control:disabled { background-color: var(--tmh-card-2); color: var(--tmh-tx); }
.custom-file-label { background-color: var(--tmh-field-bg); border-color: var(--tmh-field); color: var(--tmh-tx); }
.custom-file-label::after { background-color: var(--tmh-card-2); color: #fff; border-left-color: var(--tmh-field); }
.list-group-item.disabled, .list-group-item:disabled { background-color: transparent; color: var(--tmh-tx-2); }
.list-group-item-success { background-color: rgba(0, 153, 52, .2); color: #d9fbe4; }
.list-group-item-danger { background-color: rgba(180, 35, 24, .3); color: #ffe1de; }
.list-group-item-warning { background-color: rgba(245, 179, 1, .16); color: #fff1cc; }
.list-group-item-info { background-color: rgba(42, 110, 235, .22); color: #e1ecff; }

/* 12.10 otros: texto marcado, código, citas */
#main-body mark, #main-body .mark { background-color: rgba(204, 255, 0, .22); color: #fff; }
#main-body pre { background-color: var(--tmh-field-bg); color: var(--tmh-tx); border: 1px solid var(--tmh-edge); border-radius: var(--tmh-r-s); padding: 12px; }
#main-body code { color: #ffb4d9; }
#main-body kbd { background-color: var(--tmh-card-2); color: #fff; }
#main-body .blockquote-footer { color: var(--tmh-tx-2); }
#main-body hr { border-top-color: var(--tmh-edge); }
/* modal de idioma/moneda: el color de los enlaces del área (#main-body a) no debe ganarle al lima del elegido */
.modal-localisation .item-selector .item:hover, .modal-localisation .item-selector .item.active { color: var(--tmh-ink) !important; }

/* 12.11 piezas de Twenty-One que solo salen en algunas páginas (renderizadas con Smarty: homepage, afiliados, invitación de usuario,
   pagar factura, anuncios con imagen, tienda de MarketConnect/SSL, oauth) */
/* botones sin variante («Buy», «Buy now» de la tienda SSL): de serie texto #212529 sobre el fondo oscuro */
#main-body .btn:not([class*="btn-primary"]):not([class*="btn-success"]):not([class*="btn-default"]):not([class*="btn-danger"]):not([class*="btn-info"]):not([class*="btn-warning"]):not([class*="btn-link"]):not([class*="btn-secondary"]):not([class*="btn-light"]):not([class*="btn-dark"]):not([class*="btn-outline"]):not(.btn-checkout):not(.btn-order-now):not([class*="bg-color"]):not(.close):not([class*="op1-"]):not([class*="tmh-"]) {
  background-color: transparent; border: 1px solid var(--tmh-field); color: #fff;
}
#main-body .btn:not([class*="btn-primary"]):not([class*="btn-success"]):not([class*="btn-default"]):not([class*="btn-danger"]):not([class*="btn-info"]):not([class*="btn-warning"]):not([class*="btn-link"]):not([class*="btn-secondary"]):not([class*="btn-light"]):not([class*="btn-dark"]):not([class*="btn-outline"]):not(.btn-checkout):not(.btn-order-now):not([class*="bg-color"]):not(.close):not([class*="op1-"]):not([class*="tmh-"]):hover {
  background-color: var(--tmh-card-2); border-color: #fff; color: #fff;
}
/* campos sin .form-control (configurar dominios, oauth…): como los demás */
#main-body input[type="text"]:not(.form-control), #main-body input[type="email"]:not(.form-control), #main-body input[type="password"]:not(.form-control),
#main-body input[type="number"]:not(.form-control), #main-body input[type="tel"]:not(.form-control), #main-body input[type="search"]:not(.form-control), #main-body textarea:not(.form-control) {
  background-color: var(--tmh-field-bg); border: 1px solid var(--tmh-field); border-radius: var(--tmh-r-s); color: #fff;
}
/* portada (homepage.tpl): accesos «Your account», «Announcements»… blancos de serie */
.action-icon-btns a { background-color: var(--tmh-card); border-right: 1px solid var(--tmh-edge); border-bottom: 1px solid var(--tmh-edge); border-left: 1px solid var(--tmh-edge); color: var(--tmh-tx); }   /* sin tocar border-top: es la raya de color de .card-accent-* */
.action-icon-btns a:hover { background-color: var(--tmh-card-2); color: #fff; }
.action-icon-btns a .ico-container i { color: var(--tmh-tx-2); }
/* afiliados: las 3 cifras llevan alert-* SIN .alert (no les llegaba la regla de alertas) */
.affiliate-stat.alert-success, .affiliate-stat.alert-info, .affiliate-stat.alert-warning, .affiliate-stat.alert-danger { background-color: var(--tmh-card); border: 1px solid var(--tmh-edge); border-radius: var(--tmh-r-m); color: var(--tmh-tx); }
.affiliate-stat.alert-success { border-top: 4px solid #2fe56e; } .affiliate-stat.alert-info { border-top: 4px solid var(--tmh-info); } .affiliate-stat.alert-warning { border-top: 4px solid #f5b301; }
.affiliate-stat span { color: #fff; }
/* invitación de usuario (user-invite-accept.tpl), pagar factura (invoice-payment.tpl), promo de MarketConnect, visor de imágenes */
.invite-box { background-color: var(--tmh-card); border-color: var(--tmh-edge); color: var(--tmh-tx); border-radius: var(--tmh-r-m); }
.invoice-summary-table td.total-row { background-color: var(--tmh-card-2); color: #fff; }
.promo-banner { background-color: var(--tmh-card); border: 1px solid var(--tmh-edge); border-radius: var(--tmh-r-m); color: var(--tmh-tx); }
#main-body .promo-banner a:not(.btn) { color: var(--tmh-link); }
.promo-banner .btn { background-color: var(--tmh-lime); color: var(--tmh-ink); }
.lb-outerContainer { background-color: var(--tmh-card); }
/* precios de dominios (domain-pricing.tpl y el carrito): cabeceras de columna claras de serie */
.domain-pricing .tld-pricing-header div:nth-child(odd), .domain-pricing .tld-pricing-header div { background-color: var(--tmh-card-2); border-color: var(--tmh-edge); color: #fff; }
/* interruptor (bootstrap-switch): la mitad «No» lleva -secondary en el checkout y -default en «Mis datos» */
.bootstrap-switch .bootstrap-switch-handle-off { background: var(--tmh-card-2) !important; color: #fff !important; }
.bootstrap-switch .bootstrap-switch-handle-on { background: var(--tmh-lime) !important; color: var(--tmh-ink) !important; font-weight: 700; }
/* tienda de MarketConnect (store.css de Twenty-One: SSL, SiteLock, Weebly…): menú de la tienda y franjas claras */
#main-body .navbar-light .navbar-nav .nav-link, #main-body .store-promoted-product .nav-link, #main-body .navbar .nav-link { color: var(--tmh-tx); }
#main-body .navbar-light .navbar-nav .nav-link:hover, #main-body .navbar-light .navbar-nav .active > .nav-link, #main-body .navbar-light .navbar-nav .nav-link.active { color: #fff; }

/* 12.12 tienda de MarketConnect (store.css de Twenty-One 8.4.1: SSL —que TMH vende—, y las páginas de servicios que hoy no vende).
   Bloque generado con qa/generar-css-marketconnect.py: cada regla de store.css con fondo claro o texto oscuro, con «#main-body» delante. */
#main-body .landing-page, #main-body .wp-toolkit { background-color: transparent; color: var(--tmh-tx); }
#main-body .landing-page h1, #main-body .landing-page h2, #main-body .landing-page h3, #main-body .landing-page h4, #main-body .landing-page h5,
#main-body .wp-toolkit h1, #main-body .wp-toolkit h2, #main-body .wp-toolkit h3, #main-body .wp-toolkit h4 { color: #fff; }
#main-body .landing-page p, #main-body .landing-page li, #main-body .wp-toolkit p, #main-body .wp-toolkit li { color: inherit; }
/* fondos claros de store.css → tarjeta oscura (48 reglas) */
#main-body .landing-page .product-options .item { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.mail-services .product-options .item { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .navbar .navbar-nav > li.active > a { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .light-grey-bg { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .nav-tabs > li > a, #main-body .landing-page .nav-tabs > li > a:focus { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .nav-tabs > li > a:hover { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .nav-tabs > li.active > a, #main-body .landing-page .nav-tabs > li.active > a:focus, #main-body .landing-page .nav-tabs > li.active > a:hover { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .tab-content { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .pricing-item .feature-heading { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.weebly .weebly-lite-plan { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page .features { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.weebly .faq { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ssl .validation-levels .item { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ssl .browser-notice .wrapper { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ssl .detailed-info { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ssl .detailed-info .card-body { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ssl ul.ssl-certs-all li.featured { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ssl .row-pricing-table ul li { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ssl .certificate-options .btn { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .sitebuilder-upgrade-container .promo-wrapper, #main-body .weebly-upgrade-container .promo-wrapper { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitelock .plans .plan { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitelock .emergency .btn { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.codeguard .faqs { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.codeguard .irs-line { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitelockvpn .feature.alternate-bg { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitelockvpn .feature.pricing .pricing-box { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitelockvpn .feature.pricing .cycle { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitelockvpn .dividing-line { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitelockvpn .feature.countries { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.marketgoo .feature-wrapper { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.marketgoo .plan.marketgoo_pro ul { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.marketgoo .carousel .carousel-indicators li { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.marketgoo .faqs { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ox .stand-out { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ox .pricing table tr:nth-child(even) td:first-child { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.ox .faqs { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitebuilder { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitebuilder .intro { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitebuilder .nav-tabs > li > a { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitebuilder .nav-tabs a.active, #main-body .landing-page.sitebuilder .nav-tabs a.active:focus, #main-body .landing-page.sitebuilder .nav-tabs a.active:hover { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitebuilder .pricing-table { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .landing-page.sitebuilder .pricing-table-row:not(.col-heading):nth-child(even) { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .wp-toolkit { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .wp-toolkit .hero-image { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .wp-toolkit .body-intro { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .wp-toolkit .cart-items .item:nth-child(odd) { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .wp-toolkit .service-selector .service .btn.disabled { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
#main-body .wp-toolkit .faqs .border-line { background-color: var(--tmh-card); border-color: var(--tmh-edge); }
/* textos oscuros de store.css → texto claro (40 reglas) */
#main-body .landing-page .hero { color: var(--tmh-tx); }
#main-body .landing-page .product-options p { color: var(--tmh-tx); }
#main-body .landing-page .product-options .price { color: var(--tmh-tx); }
#main-body .landing-page .light-grey-bg { color: var(--tmh-tx); }
#main-body .landing-page.mail-services .benefits i { color: var(--tmh-tx); }
#main-body .landing-page.ssl .validation-levels .item p { color: var(--tmh-tx); }
#main-body .landing-page.ssl .what-is-ssl .fas, #main-body .landing-page.ssl .what-is-ssl .far { color: var(--tmh-tx); }
#main-body .landing-page.ssl .help-me-choose .ideal { color: var(--tmh-tx); }
#main-body .landing-page.ssl .ideal-for.dv i { color: var(--tmh-tx); }
#main-body .landing-page.ssl .ssl-benefits .row { color: var(--tmh-tx); }
#main-body .landing-page.ssl .ssl-benefits i { color: var(--tmh-tx); }
#main-body .landing-page.ssl .standout-2 { color: var(--tmh-tx); }
#main-body .landing-page.ssl ul.ssl-certs-all .price span { color: var(--tmh-tx); }
#main-body .landing-page.ssl .row-pricing-table ul li { color: var(--tmh-tx); }
#main-body .landing-page.ssl .certificate-options .btn { color: var(--tmh-tx); }
#main-body .landing-page.sitelock .plans .plan ul li span { color: var(--tmh-tx); }
#main-body .landing-page.sitelock .features .fas, #main-body .landing-page.sitelock .features .far { color: var(--tmh-tx); }
#main-body .landing-page.codeguard .overview-features span { color: var(--tmh-tx); }
#main-body .landing-page.sitelockvpn .feature.pricing .cycle { color: var(--tmh-tx); }
#main-body .landing-page.sitelockvpn .feature.pricing .price { color: var(--tmh-tx); }
#main-body .landing-page.sitelockvpn .feature.world span { color: var(--tmh-tx); }
#main-body .landing-page.marketgoo .plan.marketgoo_pro .header h4 { color: var(--tmh-tx); }
#main-body .landing-page.marketgoo .plan .pricing { color: var(--tmh-tx); }
#main-body .landing-page.marketgoo .testimonials .testimonial { color: var(--tmh-tx); }
#main-body .landing-page.ox .stand-out { color: var(--tmh-tx); }
#main-body .landing-page.ox .stand-out h2 { color: var(--tmh-tx); }
#main-body .landing-page.ox h3 { color: var(--tmh-tx); }
#main-body .landing-page.ox .pricing table { color: var(--tmh-tx); }
#main-body .landing-page.sitebuilder .nav-tabs > li > a { color: var(--tmh-tx); }
#main-body .landing-page.sitebuilder .nav-tabs a.active, #main-body .landing-page.sitebuilder .nav-tabs a.active:focus, #main-body .landing-page.sitebuilder .nav-tabs a.active:hover { color: var(--tmh-tx); }
#main-body .landing-page.sitebuilder .features p { color: var(--tmh-tx); }
#main-body .landing-page.sitebuilder .templates .previews .tplname { color: var(--tmh-tx); }
#main-body .landing-page.sitebuilder .templates .previews a:hover .tplname { color: var(--tmh-tx); }
#main-body .wp-toolkit .feature-block .title { color: var(--tmh-tx); }
#main-body .wp-toolkit .pricing .starting-from { color: var(--tmh-tx); }
#main-body .wp-toolkit .cart-totals { color: var(--tmh-tx); }
#main-body .wp-toolkit .service-selector .product-name { color: var(--tmh-tx); }
#main-body .wp-toolkit .service-selector .domain-name { color: var(--tmh-tx); }
#main-body .wp-toolkit .service-selector .price { color: var(--tmh-tx); }
#main-body .wp-toolkit .faqs .faq-title { color: var(--tmh-tx); }

/* 12.13 «Autorizar app» (oauth/layout.tpl): página suelta; oauth.css se carga DESPUÉS de este archivo, por eso «html body» y el id */
html body:has(section#content .content-container) { background-color: var(--tmh-zone); color: var(--tmh-tx); }
section#content .content-container { background-color: var(--tmh-card); border: 1px solid var(--tmh-edge); color: var(--tmh-tx); }
section#content .content-container h1, section#content .content-container h2, section#content .content-container h3 { color: #fff; }
section#content .action-buttons { background-color: var(--tmh-card-2); border-top-color: var(--tmh-edge); color: var(--tmh-tx); }
html body section#header { border-bottom-color: var(--tmh-edge); color: var(--tmh-tx); }
html body section#footer { color: var(--tmh-tx-2); }
section#content input[type="text"], section#content input[type="email"], section#content input[type="password"] { background-color: var(--tmh-field-bg); border: 1px solid var(--tmh-field); color: #fff; }
section#content button:not(.btn-primary):not(.btn-success), section#content .btn-default { background-color: transparent; border: 1px solid var(--tmh-field); color: #fff; }
html body:has(section#content) { background-color: var(--tmh-zone); color: var(--tmh-tx); }
section#content a:not(.btn), section#header a:not(.btn), section#footer a:not(.btn) { color: var(--tmh-link); }

/* 12.14 bloques de color de marca de store.css con texto blanco (contraste 1.6–3.5 de serie): texto tinta o blanco según el fondo.
   Algunos con !important: el color general de los enlaces del área (#main-body a:not(...)) y el de los botones sin variante pesan más */
#main-body .landing-page.ssl .certificate-options.ov h1, #main-body .landing-page.ssl .certificate-options.ov h2, #main-body .landing-page.ssl .certificate-options.ov > .container > h3,
#main-body .landing-page.ssl .certificate-options.ev h1, #main-body .landing-page.ssl .certificate-options.ev h2, #main-body .landing-page.ssl .certificate-options.ev > .container > h3 { color: var(--tmh-ink); }
#main-body .landing-page.ssl .row-pricing-table ul li { color: var(--tmh-tx); }
#main-body .landing-page.ssl .standout-1 h2, #main-body .landing-page.ssl .standout-1 h3 { color: #fff; }
#main-body .landing-page.ssl .standout-1 .wrapper, #main-body .landing-page.ssl .browser-notice .wrapper { color: var(--tmh-tx); }
#main-body .landing-page.ssl p.help-me-choose a, #main-body .landing-page.ssl a.help-me-choose { color: #fff !important; text-decoration: underline; }
#main-body .landing-page.ssl .certificate-options.ov a.help-me-choose, #main-body .landing-page.ssl .certificate-options.ev a.help-me-choose { color: var(--tmh-ink) !important; }
#main-body .landing-page.ssl .certificate-options .btn { background-color: var(--tmh-ink) !important; border-color: var(--tmh-ink) !important; color: #fff !important; }
#main-body .landing-page.mail-services .product-options h1, #main-body .landing-page.mail-services .product-options h2, #main-body .landing-page.mail-services .product-options h3,
#main-body .landing-page.mail-services .product-options h4, #main-body .landing-page.mail-services .product-options h5, #main-body .landing-page.mail-services .product-options > .container > p,
#main-body .landing-page.mail-services .powered-by, #main-body .landing-page .get-started, #main-body .landing-page .get-started h2, #main-body .landing-page .get-started h3 { color: var(--tmh-ink); }
#main-body .landing-page.mail-services .product-options .item, #main-body .landing-page.mail-services .product-options .item h3, #main-body .landing-page.mail-services .product-options .item h4 { color: var(--tmh-tx); }
#main-body .landing-page.sitebuilder .btn-primary, #main-body .landing-page.sitelockvpn .btn-start, #main-body .landing-page.sitelockvpn .btn-signup.highlight2 { color: var(--tmh-ink) !important; }
#main-body .landing-page.mail-services .get-started h4, #main-body .landing-page.mail-services .get-started label { color: var(--tmh-ink); }
/* 12.15 celular (< 576 px): tablas simples que se salían (añadir fondos: 22 px) y botones de acciones masivas de dominios (95 px) */
@media (max-width: 575.98px) {
  #main-body .primary-content .table:not(.table-list) td, #main-body .primary-content .table:not(.table-list) th { overflow-wrap: anywhere; word-break: break-word; }
  #main-body .btn-group.btn-group-sm { flex-wrap: wrap; }
  #main-body .table-list { max-width: 100%; }
  #order-standard_cart .header-lined h1 { overflow-wrap: anywhere; }
}
/* enlace rojo en línea (style="color:#cc0000") de configuredomains.tpl: 2.97:1 sobre el fondo oscuro */
#order-standard_cart a[style*="#cc0000"] { color: var(--tmh-bad) !important; }
/* 12.16 últimos casos del detector (9-nov):
   - WebKit pinta la selección lima del tema dentro de los campos con el texto blanco del campo (1.8:1): en campos, selección azul oscura
   - fecha «Last updated» de los paneles de inicio sobre la fila resaltada (4.4:1 en WebKit)
   - a < 768 px los botones Upgrade/Cancel quedaban pegados al primer dato del servicio
   - tabla de cotizaciones en tableta (768 px): 216 px de scroll lateral de la página; ahora se desplaza solo la tabla */
input::selection, textarea::selection, select::selection { background: rgba(156, 194, 255, .25); color: #fff; }
.client-home-cards small, .client-home-cards .text-domain, .client-home-cards .text-last-updated { color: #a9b8cc; }
@media (max-width: 767.98px) { .product-details .col-md-6.text-center > h4:first-child { margin-top: 22px; } }
@media (max-width: 991.98px) { #main-body .table-container { max-width: 100%; overflow-x: auto; } }
#order-standard_cart #btnCheckAvailability { min-width: max-content; padding-left: 14px; padding-right: 14px; white-space: nowrap; }
/* aviso «navegador inseguro» de la tienda SSL: la franja naranja pasa a oscura con borde naranja (el título quedaba mitad sobre naranja) */
#main-body .landing-page.ssl .standout-1 { background-color: var(--tmh-card-2); border-top: 4px solid #f5a200; }

/* ---------- 13. standard_cart con el tema tmh2026 (ws9-t1, 10-nov-2026; respaldo: custom.css.antes-1110) ----------
   Los links con &carttpl=standard_cart (sesiones, marcadores, correos, socios) abren el carrito de serie, que NO carga
   tmh2026_cart/css/custom.css: el resumen, el título del producto, la pestaña y el botón del cupón y los desplegables del
   celular quedaban blancos con texto tenue. Aquí van las mismas reglas del carrito tmh2026_cart (secciones 1–8 y 10 de su
   custom.css; no la capa de configurar, que es JS propio de tmh2026_cart), pero SOLO cuando la página es de standard_cart.
   Cómo se distingue (HTML real de WHMCS 8.4.1, orderforms/standard_cart/common.tpl, el mismo en los dos carritos):
     tmh2026_cart:  <link …/standard_cart/css/all.min.css> <link …/tmh2026_cart/css/custom.css> <script …scripts.min.js>
     standard_cart: <link …/standard_cart/css/all.min.css> <script …scripts.min.js>
   → «link de all.min.css seguido DIRECTO de un <script>», hermano anterior de #order-standard_cart. Con tmh2026_cart el
   siguiente es el <link> de su custom.css y nada de esta sección aplica. El prefijo además da más peso que all.min.css, que se
   carga DESPUÉS de este archivo. Bloque generado por construccion/qa/generar-css-standard.py desde el custom.css del carrito
   (si ese archivo cambia, se vuelve a generar). */
/* tmh-standard-cart:inicio */
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart { font-family: var(--tmh-font, "Montserrat", system-ui, sans-serif); color: var(--tmh-tx, #c9d4e3); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .header-lined h1, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart h1.font-size-36 { margin: 0 0 12px; color: #fff; font-weight: 800; letter-spacing: -0.02em; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .header-lined { margin-bottom: 8px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sub-heading { margin: 30px 0 22px; border-top: 1px solid var(--tmh-edge-2, rgba(255, 255, 255, .22)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sub-heading span,
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sub-heading-borderless span {
  top: -12px; padding: 0 14px; color: #fff; font-size: 1.02rem; font-weight: 700; letter-spacing: -0.01em;
  background: var(--tmh-zone, #0c1a2e);
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sub-heading span small { display: inline-block; margin-top: 2px; font-size: .8rem; font-weight: 500; color: var(--tmh-tx-2, #8fa3bd); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sub-heading:has(small) { margin-bottom: 52px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .field-container { margin-bottom: 4px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart label { color: #fff; font-weight: 600; font-size: .95rem; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .form-control { min-height: 44px; height: auto; color: #fff; background-color: var(--tmh-field-bg, #0a1626); border: 1px solid var(--tmh-field, #6f86a6); border-radius: var(--tmh-r-s, 6px); font-size: 1rem; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .form-control:focus, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .field:focus { border-color: var(--tmh-link, #9cc2ff); box-shadow: 0 0 0 3px rgba(156, 194, 255, .55) !important; outline: 0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .form-control::placeholder { color: var(--tmh-tx-2, #8fa3bd); opacity: 1; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .select-inline { width: auto; min-width: min(100%, 320px); display: inline-block; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .info-text-sm, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .text-muted { color: var(--tmh-tx-2, #8fa3bd) !important; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .btn-lg { min-height: 52px; padding: 0 28px; font-size: 1.08rem; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cart-sidebar .card, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cart-sidebar .panel { border-radius: var(--tmh-r-m, 10px); overflow: hidden; background: var(--tmh-card, #10233d); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cart-sidebar .card-header { background: var(--tmh-card, #10233d); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cart-sidebar .panel-title, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cart-sidebar h3 { font-size: .98rem; font-weight: 700; color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cart-sidebar .panel-title > i:first-child { color: var(--tmh-lime, #ccff00); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cart-sidebar .list-group-item { padding: 10px 16px; font-size: .92rem; line-height: 1.35; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sidebar-collapsed .card { border-radius: var(--tmh-r-m, 10px); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sidebar-collapsed .panel-title { font-size: .95rem; font-weight: 700; color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product {
  display: flex; flex-direction: column; height: calc(100% - 24px); margin: 0 0 24px; padding: 0;
  background: var(--tmh-card, #10233d); border: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); border-radius: var(--tmh-r-l, 16px); overflow: hidden;
  transition: border-color .18s ease;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product:hover { border-color: var(--tmh-edge-2, rgba(255, 255, 255, .22)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .row-eq-height > [class*="col-"] { display: flex; flex-direction: column; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product header { margin: 0; padding: 20px 22px 6px; background: transparent; border-radius: 0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product header span { color: #fff; font-size: 1.35rem; font-weight: 800; letter-spacing: -0.02em; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product header .qty { color: var(--tmh-tx-2, #8fa3bd); font-size: .82rem; font-style: normal; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product div.product-desc { float: none; flex: 1 1 auto; padding: 4px 22px 10px; font-size: .92rem; line-height: 1.55; color: var(--tmh-tx, #c9d4e3); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product div.product-desc ul { margin: 12px 0 0; padding: 12px 0 0; list-style: none; border-top: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product div.product-desc li { position: relative; padding: 3px 0 3px 26px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product div.product-desc li::before {
  content: ""; position: absolute; left: 2px; top: 8px; width: 14px; height: 8px;
  border: solid var(--tmh-lime, #ccff00); border-width: 0 0 2.5px 2.5px; transform: rotate(-45deg);
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product span.feature-value, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product b, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product strong { color: #fff; font-weight: 700; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product footer {
  float: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
  width: auto; margin: 0; padding: 16px 22px 22px; border-top: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); font-size: .88rem; text-align: left;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product div.product-pricing { margin: 0; color: var(--tmh-tx-2, #8fa3bd); line-height: 1.3; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product div.product-pricing span.price { display: block; color: #fff; font-size: 1.7rem; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product footer .btn { display: inline-flex; align-items: center; gap: 6px; min-height: 48px; padding: 0 22px; font-size: 1rem; font-weight: 800; border-radius: var(--tmh-r-m, 10px); }   
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product footer .clearfix:empty { display: none; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .product-info {
  margin: 16px 0 8px; padding: 20px 22px; background: var(--tmh-card, #10233d);
  border: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); border-left: 4px solid var(--tmh-lime, #ccff00); border-radius: var(--tmh-r-m, 10px);
  font-size: .95rem; line-height: 1.6; color: var(--tmh-tx, #c9d4e3);
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .product-info .product-title { margin: 0 0 6px; color: #fff; font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .product-info p { margin-bottom: 0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .product-info b, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .product-info strong { color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .product-configurable-options .form-group, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .field-container .form-group { margin-bottom: 16px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .addon-products > [class*="col-"] { display: flex; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon {
  display: flex; flex-direction: column; width: 100%; margin-bottom: 20px; overflow: hidden; text-align: left;
  background: var(--tmh-card, #10233d); border: 1.5px solid var(--tmh-edge-2, rgba(255, 255, 255, .22)); border-radius: var(--tmh-r-m, 10px);
  transition: border-color .15s ease, box-shadow .15s ease;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon:hover { border-color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon .panel-body { flex: 1 1 auto; padding: 16px 18px; font-size: .9rem; line-height: 1.5; color: var(--tmh-tx, #c9d4e3); background: transparent; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon .panel-body label { display: flex; align-items: flex-start; gap: 4px; margin-bottom: 6px; color: #fff; font-size: .98rem; font-weight: 700; line-height: 1.35; cursor: pointer; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon .panel-body > br { display: none; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon .panel-price { padding: 10px 18px; background: var(--tmh-card-2, #142b4a); border-top: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); color: #fff; font-weight: 700; font-size: .95rem; font-variant-numeric: tabular-nums; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon .panel-add {
  display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 12px; border-radius: 0;
  background: transparent; border-top: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); color: var(--tmh-lime, #ccff00); font-weight: 700; font-size: .92rem;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon:hover .panel-add { background: var(--tmh-card-2, #142b4a); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon-selected { border-color: var(--tmh-lime, #ccff00); box-shadow: 0 0 0 3px rgba(204, 255, 0, .2); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon-selected .panel-add, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .panel-addon-selected:hover .panel-add { background: var(--tmh-lime, #ccff00); color: var(--tmh-ink, #0c1a2e); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .alert.info-text-sm { font-size: .9rem; color: #fff1cc !important; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary {
  margin: 0 0 20px; overflow: hidden; background: var(--tmh-card-2, #142b4a); border: 1px solid var(--tmh-edge-2, rgba(255, 255, 255, .22)); border-radius: var(--tmh-r-l, 16px);
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary h2 { padding: 18px 20px 12px; color: #fff; text-align: left; font-size: 1.15rem; font-weight: 800; letter-spacing: -0.01em; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .loader { color: var(--tmh-tx, #c9d4e3); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .summary-container { margin: 0; padding: 4px 20px 20px; background: transparent; color: #dbe4f0; font-size: .88rem; line-height: 1.55; border-radius: 0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .summary-container .clearfix:not(.w-hidden) { display: flex; justify-content: space-between; gap: 12px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .summary-container .clearfix::after { display: none; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .summary-container .float-left, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .summary-container .pull-left { float: none !important; min-width: 0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .summary-container .float-right, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .summary-container .pull-right { float: none !important; flex: none; font-variant-numeric: tabular-nums; color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .product-name { color: #fff; font-size: 1.15rem; font-weight: 800; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .product-group { margin-bottom: 10px; color: #a9b8cc; font-style: normal; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .summary-totals, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .bordered-totals { border-color: var(--tmh-edge-2, rgba(255, 255, 255, .22)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .subtotal { border-bottom-color: var(--tmh-edge-2, rgba(255, 255, 255, .22)); color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .total-due-today { margin-top: 12px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .total-due-today .amt { color: var(--tmh-lime, #ccff00); font-size: 2.1rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; font-variant-numeric: tabular-nums; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .total-due-today span:not(.amt) { color: #dbe4f0; font-size: .85rem; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary #totalCartPrice { display: block; color: var(--tmh-lime, #ccff00); font-size: 2.1rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .recurring-charges { color: #a9b8cc; font-style: normal; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .btn-continue-shopping, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary a:not(.btn) { color: #dbe4f0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .btn-continue-shopping:hover, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary a:not(.btn):hover { color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary :focus-visible { outline-color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .text-right .btn, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #btnCompleteProductConfig, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .btn-checkout { width: 100%; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary .btn-checkout { margin-top: 8px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items-header {
  margin: 0; padding: 12px 16px; background: var(--tmh-card-2, #142b4a); color: #fff; border: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); border-bottom: 0;
  border-radius: var(--tmh-r-m, 10px) var(--tmh-r-m, 10px) 0 0; font-weight: 700; font-size: .9rem;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items { margin-bottom: 24px; border: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); border-top: 0; border-bottom: 3px solid var(--tmh-lime, #ccff00); border-radius: 0 0 var(--tmh-r-m, 10px) var(--tmh-r-m, 10px); overflow: hidden; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item { padding: 16px; font-size: .92rem; background: var(--tmh-card, #10233d); color: var(--tmh-tx, #c9d4e3); border-color: var(--tmh-edge, rgba(255, 255, 255, .11)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item:nth-child(even) { background: var(--tmh-card-2, #142b4a); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item-title { color: #fff; font-size: 1.15rem; font-weight: 800; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item-group { color: var(--tmh-tx-2, #8fa3bd); font-size: .92rem; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item-domain { color: var(--tmh-link, #9cc2ff); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item-price span { color: #fff; font-size: 1.2rem; font-weight: 800; font-variant-numeric: tabular-nums; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item-price .cycle { color: var(--tmh-tx-2, #8fa3bd); font-size: .85rem; font-weight: 500; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .btn-remove-from-cart { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; color: var(--tmh-tx, #c9d4e3); border-radius: var(--tmh-r-s, 6px); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .btn-remove-from-cart:hover { color: #fff; background: rgba(180, 35, 24, .4); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .empty-cart { margin: -14px 0 0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .empty-cart .btn { min-height: 36px; padding: 0 12px; background: var(--tmh-card, #10233d); border: 1px solid var(--tmh-edge-2, rgba(255, 255, 255, .22)); border-top: 0; color: var(--tmh-bad, #ff8a80); font-size: .85rem; font-weight: 600; border-radius: 0 0 var(--tmh-r-s, 6px) var(--tmh-r-s, 6px); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .empty-cart .btn:hover { background: var(--tmh-card-2, #142b4a); color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs { margin-top: 8px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs .nav-tabs { padding-left: 0; font-size: .92rem; border-bottom-color: var(--tmh-edge-2, rgba(255, 255, 255, .22)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs .nav-tabs .nav-link { min-height: 44px; display: flex; align-items: center; color: var(--tmh-tx, #c9d4e3); font-weight: 600; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs .nav-tabs .nav-link.active, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs .nav-tabs > li.active > a { background: var(--tmh-card, #10233d); color: #fff; border-color: var(--tmh-edge-2, rgba(255, 255, 255, .22)) var(--tmh-edge-2, rgba(255, 255, 255, .22)) var(--tmh-card, #10233d); border-bottom: 3px solid var(--tmh-lime, #ccff00); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs .tab-content { padding: 20px; background: var(--tmh-card, #10233d); border: 1px solid var(--tmh-edge-2, rgba(255, 255, 255, .22)); border-top: 0; border-radius: 0 0 var(--tmh-r-m, 10px) var(--tmh-r-m, 10px); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-promotion-code { padding: 12px 14px; background: var(--tmh-card, #10233d); border-left: 4px solid var(--tmh-lime, #ccff00); border-radius: var(--tmh-r-s, 6px); color: #fff; font-weight: 600; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs .promo .form-control, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart input[name="promocode"] { font-family: var(--tmh-mono, monospace); letter-spacing: .04em; text-transform: uppercase; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-tabs .promo .form-control::placeholder, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart input[name="promocode"]::placeholder { font-family: var(--tmh-font, sans-serif); letter-spacing: 0; text-transform: none; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-empty { padding: 32px 16px; color: var(--tmh-tx-2, #8fa3bd); text-align: center; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .express-checkout-buttons .separator { color: var(--tmh-tx-2, #8fa3bd); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .already-registered { margin-bottom: 8px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .already-registered p { margin-bottom: 8px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .prepend-icon .field { padding-left: 42px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .prepend-icon .field-icon { width: 42px; height: 44px; line-height: 44px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .field-icon i { color: var(--tmh-tx-2, #8fa3bd); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .intl-tel-input { width: 100%; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .intl-tel-input .selected-flag { padding-left: 12px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #totalDueToday, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .alert-success.text-center { font-size: 1.05rem; font-weight: 600; text-align: center; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #totalDueToday strong, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #totalCartPrice { color: var(--tmh-lime, #ccff00); font-weight: 800; font-variant-numeric: tabular-nums; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #paymentGatewaysContainer { margin: 8px 0 4px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #paymentGatewaysContainer .radio-inline:not(.w-hidden), link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .radio-inline:not(.w-hidden) {
  display: inline-flex; align-items: center; min-height: 48px; margin: 4px 6px; padding: 8px 14px;
  background: var(--tmh-card, #10233d); border: 1.5px solid var(--tmh-edge-2, rgba(255, 255, 255, .22)); border-radius: var(--tmh-r-s, 6px);
  color: #fff; font-size: .92rem; font-weight: 600; cursor: pointer;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #paymentGatewaysContainer .radio-inline:hover { border-color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #paymentGatewaysContainer .radio-inline:has(.checked) { border-color: var(--tmh-lime, #ccff00); background: var(--tmh-card-2, #142b4a); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #paymentGatewaysContainer > p, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .small-text { color: var(--tmh-tx-2, #8fa3bd); font-size: .9rem; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container { padding: 16px; background: #fff; color: var(--tmh-ink, #0c1a2e); border: 1px solid #c9d3e0; border-radius: var(--tmh-r-m, 10px); color-scheme: light; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container label, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .radio-inline:not(.w-hidden) { color: var(--tmh-ink, #0c1a2e); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .radio-inline:not(.w-hidden) { background: #fff; border-color: #c9d3e0; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .form-control { background: #fff; color: var(--tmh-ink, #0c1a2e); border-color: #74849a; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .form-control::placeholder { color: #5b6b7e; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .field-icon i, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .text-muted { color: #5b6b7e !important; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .icheckbox_square-blue, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .iradio_square-blue { background-color: #fff !important; border-color: #74849a; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .iradio_square-blue.checked, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .icheckbox_square-blue.checked { background-color: #007f2c !important; border-color: #007f2c; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .iradio_square-blue.checked::after { background: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container .icheckbox_square-blue.checked::after { border-color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .cc-input-container :focus-visible { outline-color: var(--tmh-blue, #2a6eeb); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart textarea.form-control { min-height: 110px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .marketing-email-optin { margin-top: 28px; padding: 18px 20px; background: var(--tmh-card, #10233d); border: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); border-radius: var(--tmh-r-m, 10px); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .marketing-email-optin h4 { color: #fff; font-size: 1.05rem; font-weight: 700; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .marketing-email-optin p { font-size: .92rem; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #btnCompleteOrder { min-width: min(100%, 320px); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .checkout-security-msg {
  position: relative; margin: 24px 0; padding: 14px 16px 14px 56px; font-size: .85rem; line-height: 1.5;
  background: var(--tmh-card, #10233d); border: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); border-left: 4px solid var(--tmh-lime, #ccff00); border-radius: var(--tmh-r-s, 6px); color: var(--tmh-tx, #c9d4e3);
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .checkout-security-msg i { position: absolute; left: 18px; top: 50%; float: none; margin: -12px 0 0; font-size: 1.5rem; color: var(--tmh-lime, #ccff00); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .checkout-security-msg strong { color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .generate-password { min-height: 44px; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #inputTosAgree + label, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart label.checkbox-inline { color: var(--tmh-tx, #c9d4e3); font-weight: 500; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #btnNewUserSignup { margin-left: 10px; }
@media (max-width: 1199.98px) {
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sidebar-collapsed { margin: 0 0 16px; padding: 0; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sidebar-collapsed .card { margin-bottom: 10px; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sidebar-collapsed .card-header { padding: 10px 14px; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .sidebar-collapsed .card-body { padding: 10px 14px 14px; }
}
@media (max-width: 767.98px) {
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .products .product header span { font-size: 1.2rem; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .order-summary { border-radius: var(--tmh-r-m, 10px); }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .view-cart-items .item-price { text-align: left; margin-top: 8px; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #paymentGatewaysContainer .radio-inline:not(.w-hidden) { display: flex; margin: 6px 0; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .already-registered { text-align: left; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .already-registered .btn { margin-top: 8px; }
  link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart #btnNewUserSignup { margin-left: 0; }
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .btn:not([class*="btn-primary"]):not([class*="btn-success"]):not([class*="btn-default"]):not([class*="btn-danger"]):not([class*="btn-info"]):not([class*="btn-warning"]):not([class*="btn-link"]):not([class*="btn-secondary"]):not([class*="btn-light"]):not([class*="btn-dark"]):not([class*="btn-outline"]):not(.btn-checkout):not(.btn-order-now):not([class*="bg-color"]):not(.close):not([class*="op1-"]):not([class*="tmh-"]) {
  background-color: transparent; border: 1px solid var(--tmh-field, #6f86a6); color: #fff;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .btn:not([class*="btn-primary"]):not([class*="btn-success"]):not([class*="btn-default"]):not([class*="btn-danger"]):not([class*="btn-info"]):not([class*="btn-warning"]):not([class*="btn-link"]):not([class*="btn-secondary"]):not([class*="btn-light"]):not([class*="btn-dark"]):not([class*="btn-outline"]):not(.btn-checkout):not(.btn-order-now):not([class*="bg-color"]):not(.close):not([class*="op1-"]):not([class*="tmh-"]):hover {
  background-color: var(--tmh-card-2, #142b4a); border-color: #fff; color: #fff;
}
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-selection-options .option, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-selection-options .option-selected { background-color: var(--tmh-card, #10233d); color: var(--tmh-tx, #c9d4e3); border: 1px solid var(--tmh-edge, rgba(255, 255, 255, .11)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-selection-options .option-selected { border-color: var(--tmh-lime, #ccff00); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .default-captcha { background-color: var(--tmh-card, #10233d); border-color: var(--tmh-edge-2, rgba(255, 255, 255, .22)); color: var(--tmh-tx, #c9d4e3); box-shadow: none; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .default-captcha p { color: var(--tmh-tx, #c9d4e3); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-checker-container .input-group-box { background-color: var(--tmh-card, #10233d); border: 1px solid var(--tmh-edge-2, rgba(255, 255, 255, .22)); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-promo-box { background-color: var(--tmh-card, #10233d); border-color: var(--tmh-edge, rgba(255, 255, 255, .11)); color: var(--tmh-tx, #c9d4e3); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-promo-box h3, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-promo-box .font-size-22 { color: #fff; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .spotlight-tlds { background-color: var(--tmh-card-2, #142b4a); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .spotlight-tld { background-color: var(--tmh-card, #10233d); border-color: var(--tmh-edge, rgba(255, 255, 255, .11)); color: var(--tmh-tx, #c9d4e3); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .spotlight-tld .invalid, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .spotlight-tld .unavailable { background-color: var(--tmh-card-2, #142b4a); border-color: var(--tmh-edge, rgba(255, 255, 255, .11)); color: var(--tmh-tx-2, #8fa3bd); }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .suggested-domains .domain-lookup-suggestions-loader { background-color: var(--tmh-card, #10233d); color: var(--tmh-tx, #c9d4e3); opacity: 1; }
link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .domain-pricing .tld-pricing-header div, link[href*="/orderforms/standard_cart/css/all.min.css"] + script ~ #order-standard_cart .tld-pricing-header .tld-column { background-color: var(--tmh-card-2, #142b4a); color: #fff; }
/* tmh-standard-cart:fin */

/* ---------- 14. barrido del WHMCS REAL (ws9-t1, 10-nov-2026): lo que la maqueta no tenía ----------
   14.1 líneas de la barra lateral (captura de Rafael de la tienda real): Twenty-One (theme.min.css) pone
        .sidebar .list-group-item{border-color:#f5f5f5}: líneas BLANCAS entre los grupos de «Categories» y en las barras de
        Announcements, Knowledgebase, Downloads, Register… Más fuerte que .list-group-item de la sección 5. Aquí, el borde del tema. */
.sidebar .list-group-item, .card-sidebar .list-group-item { border-color: var(--tmh-edge); }
/* 14.2 lista de precios de dominios (cart.php?a=add&domain=register, los dos carritos): fila destacada celeste #f3f9fd con texto
        claro (1.06–2.4:1), línea #f5f5f5 entre filas e insignias Hot/New/Sale con texto blanco (1.9–3:1). «body» porque
        standard_cart/css/all.min.css se carga DESPUÉS de este archivo con el mismo peso. */
body .domain-pricing .tld-row { border-bottom-color: var(--tmh-edge); }
body .domain-pricing .tld-row.highlighted { background: var(--tmh-card-2); }
body .tld-sale-group-hot, body .tld-sale-group-new, body .tld-sale-group-sale { color: var(--tmh-ink); font-weight: 700; }
/* 14.3 páginas sin contenedor (404 y otras con $skipMainBodyContainer de Twenty-One): el <div class=""> deja la .row con
        márgenes de -15 px → 15 px de scroll lateral en todos los anchos. Se recorta sin mover el contenido. */
#main-body > div:not([class*="container"]) { overflow-x: clip; }