/* ==========================================================================
   TAROHOSTING — Order Form standard_cart / custom.css
   Cargado automaticamente por common.tpl via {assetExists file="custom.css"}.
   Migracion de los antiguos <style> inline de configureproduct.tpl,
   viewcart.tpl, checkout.tpl y sidebar-categories-selector.tpl,
   actualizados a los tokens EXACTOS del design system de la landing
   (dark-mode only: #0B0B12 / #12121A / #FF25FF / Poppins / radios 12-16px).
   Generado por AGENTE 4 del proyecto de unificacion de diseno.
   ========================================================================== */

/* Tokens de respaldo (killa/css/custom.css ya los define; se duplican con
   los mismos valores por si el carrito se renderiza con otro theme). */
:root {
    --taro-primary-400: #FF66FF;
    --taro-primary-500: #FF25FF;
    --taro-primary-600: #E013E0;
    --taro-purple-600: #9333EA;
    --taro-bg: #0B0B12;
    --taro-bg-elevated: #12121A;
    --taro-surface: rgba(255, 255, 255, 0.05);
    --taro-surface-hover: rgba(255, 255, 255, 0.10);
    --taro-surface-active: rgba(255, 37, 255, 0.20);
    --taro-accent-tint: rgba(255, 37, 255, 0.10);
    --taro-text: #FFFFFF;
    --taro-text-secondary: rgba(255, 255, 255, 0.80);
    --taro-text-tertiary: rgba(255, 255, 255, 0.70);
    --taro-text-muted: rgba(255, 255, 255, 0.60);
    --taro-text-faint: rgba(255, 255, 255, 0.50);
    --taro-text-placeholder: rgba(255, 255, 255, 0.40);
    --taro-border: rgba(255, 255, 255, 0.10);
    --taro-border-hover: rgba(255, 37, 255, 0.30);
    --taro-border-focus: rgba(255, 37, 255, 0.60);
    --taro-gradient-cta: linear-gradient(to right, #FF25FF, #E013E0, #9333EA);
    --taro-gradient-cta-hover: linear-gradient(to right, #E013E0, #9333EA, #7E22CE);
    --taro-gradient-success: linear-gradient(to right, #22C55E, #10B981);
    --taro-shadow-cta: 0 10px 15px -3px rgba(255, 37, 255, 0.30), 0 4px 6px -4px rgba(255, 37, 255, 0.30);
    --taro-shadow-cta-hover: 0 20px 25px -5px rgba(255, 37, 255, 0.40), 0 8px 10px -6px rgba(255, 37, 255, 0.40);
    --taro-font-sans: 'Poppins', ui-sans-serif, system-ui, sans-serif;
    --taro-radius-lg: 0.75rem;   /* 12px botones/inputs */
    --taro-radius-xl: 1rem;      /* 16px cards */
    --taro-radius-full: 9999px;
    --taro-transition: 300ms ease;
}

/* --------------------------------------------------------------------------
   1. Base del carrito: fondo de pagina y texto blanco con opacidades
   -------------------------------------------------------------------------- */
#order-standard_cart,
#order-standard_cart .cart-body,
#order-standard_cart .secondary-cart-body,
#order-standard_cart .row,
#order-standard_cart .product-configurable-options,
#order-standard_cart .field-container,
#order-standard_cart #productAddonsContainer {
    background: transparent !important;
    color: var(--taro-text-secondary) !important;
    font-family: var(--taro-font-sans);
}
#order-standard_cart p,
#order-standard_cart li,
#order-standard_cart label,
#order-standard_cart small {
    color: var(--taro-text-secondary) !important;
}
#order-standard_cart h1,
#order-standard_cart h2,
#order-standard_cart h3,
#order-standard_cart h4,
#order-standard_cart .header-lined h1 {
    color: var(--taro-text) !important;
    font-family: var(--taro-font-sans) !important;
}
#order-standard_cart .header-lined h1 {
    font-weight: 800 !important;
    border-bottom: none;
}
#order-standard_cart .text-muted { color: var(--taro-text-faint) !important; }
#order-standard_cart hr { border-color: var(--taro-border) !important; }

/* --------------------------------------------------------------------------
   2. Sub-headings: linea magenta abajo, label uppercase #FF66FF
   -------------------------------------------------------------------------- */
#order-standard_cart .sub-heading,
.sub-heading {
    display: block !important;
    position: static !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 37, 255, 0.30) !important;
    padding: 0 0 8px 0 !important;
    margin: 24px 0 14px !important;
    background: transparent !important;
    text-align: center !important;
    overflow: visible !important;
}
#order-standard_cart .sub-heading::before,
#order-standard_cart .sub-heading::after,
.sub-heading::before,
.sub-heading::after {
    display: none !important;
    content: none !important;
    border: none !important;
    width: 0 !important;
}
#order-standard_cart .sub-heading span,
.sub-heading span,
.sub-heading span.primary-bg-color {
    display: inline !important;
    position: static !important;
    top: auto !important;
    transform: none !important;
    background: transparent !important;
    background-color: transparent !important;
    color: var(--taro-primary-400) !important;
    font-weight: 700 !important;
    font-size: .82rem !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
    padding: 0 !important;
    margin: 0 !important;
    white-space: normal !important;
}

/* --------------------------------------------------------------------------
   3. Inputs / selects / textareas (patron landing: blanco 5%, borde 10%,
      radio 12px, focus magenta 60%)
   -------------------------------------------------------------------------- */
#order-standard_cart .field,
#order-standard_cart .form-control,
#order-standard_cart select.form-control {
    /* background-color (no shorthand): preserva la flecha SVG de taro-theme.css en selects */
    background-color: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
    height: 48px !important;
    font-family: var(--taro-font-sans) !important;
    transition: border-color var(--taro-transition), box-shadow var(--taro-transition) !important;
}
#order-standard_cart .field:focus,
#order-standard_cart .form-control:focus {
    border-color: var(--taro-border-focus) !important;
    box-shadow: 0 0 0 3px rgba(255, 37, 255, 0.12) !important;
    outline: none !important;
}
#order-standard_cart .field::placeholder,
#order-standard_cart .form-control::placeholder {
    color: var(--taro-text-placeholder) !important;
}
#order-standard_cart select.form-control option {
    background: var(--taro-bg-elevated) !important;
    color: #fff !important;
}
#order-standard_cart textarea.form-control,
#order-standard_cart textarea.field {
    height: auto !important;
    padding: 12px 16px !important;
}

/* Campos con icono (prepend-icon) */
#order-standard_cart .prepend-icon { position: relative !important; }
#order-standard_cart .prepend-icon > .field-icon {
    position: absolute !important;
    top: 50% !important;
    left: 14px !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important;
    pointer-events: none !important;
    color: var(--taro-primary-400) !important;
    font-size: 14px !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}
#order-standard_cart .prepend-icon .field,
#order-standard_cart .prepend-icon .form-control {
    padding-left: 44px !important;
    padding-right: 14px !important;
}

/* --------------------------------------------------------------------------
   4. Pagina de configuracion de producto
   -------------------------------------------------------------------------- */
#order-standard_cart .product-info {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-xl) !important;
    padding: 24px !important;
    margin-bottom: 16px !important;
}
#order-standard_cart .product-title {
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 1.25rem !important;
    margin-bottom: 8px !important;
}
#order-standard_cart .product-info p { color: var(--taro-text-tertiary) !important; }

/* Panel de addons */
#order-standard_cart .panel-addon {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-xl) !important;
    color: var(--taro-text-secondary) !important;
    transition: border-color var(--taro-transition), box-shadow var(--taro-transition) !important;
    overflow: hidden;
}
#order-standard_cart .panel-addon:hover {
    border-color: var(--taro-border-hover) !important;
}
#order-standard_cart .panel-addon-selected {
    border-color: var(--taro-border-focus) !important;
    background: var(--taro-accent-tint) !important;
}
#order-standard_cart .panel-addon .panel-body,
#order-standard_cart .panel-addon .card-body {
    background: transparent !important;
    color: var(--taro-text-secondary) !important;
}
#order-standard_cart .panel-addon .panel-body label { color: #fff !important; }
#order-standard_cart .panel-addon .panel-price {
    background: rgba(255, 255, 255, 0.03) !important;
    color: var(--taro-text-secondary) !important;
    border-top: 1px solid var(--taro-border) !important;
}
#order-standard_cart .panel-addon .panel-add {
    background: var(--taro-accent-tint) !important;
    color: var(--taro-primary-400) !important;
    border-top: 1px solid var(--taro-border) !important;
}

/* --------------------------------------------------------------------------
   5. Sumario de pedido (sidebar derecha)
   -------------------------------------------------------------------------- */
#order-standard_cart .secondary-cart-sidebar,
#order-standard_cart .order-summary {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-xl) !important;
    padding: 24px !important;
    color: var(--taro-text-secondary) !important;
}
#order-standard_cart .secondary-cart-sidebar .order-summary {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}
#order-standard_cart .order-summary h2 {
    color: #fff !important;
    font-weight: 800 !important;
    margin-bottom: 16px !important;
    border-bottom: 1px solid var(--taro-border) !important;
    padding-bottom: 12px !important;
}
#order-standard_cart #producttotal,
#order-standard_cart #producttotal *,
#order-standard_cart .summary-container span,
#order-standard_cart .summary-container div {
    color: var(--taro-text-secondary) !important;
    background: transparent !important;
}
#order-standard_cart #producttotal strong,
#order-standard_cart #producttotal b,
#order-standard_cart .cost,
#order-standard_cart #subtotal,
#order-standard_cart #discount,
#order-standard_cart #taxTotal1,
#order-standard_cart #taxTotal2 {
    color: #fff !important;
    font-weight: 600 !important;
}
#order-standard_cart .subtotal,
#order-standard_cart .recurring-totals {
    padding: 8px 0 !important;
    border-bottom: 1px solid var(--taro-border) !important;
}
#order-standard_cart .total-due-today {
    background: var(--taro-accent-tint) !important;
    border: 1px solid var(--taro-border-hover) !important;
    border-radius: var(--taro-radius-lg) !important;
    padding: 14px !important;
    margin: 14px 0 !important;
    text-align: center !important;
}
#order-standard_cart .total-due-today .amt {
    color: #fff !important;
    font-size: 1.8rem !important;
    font-weight: 800 !important;
    display: block !important;
}
#order-standard_cart .total-due-today span:not(.amt) {
    color: var(--taro-text-muted) !important;
    font-size: .85rem !important;
}

/* --------------------------------------------------------------------------
   6. Ver carrito: tabla de items
   -------------------------------------------------------------------------- */
#order-standard_cart .view-cart-items-header {
    background: var(--taro-surface-hover) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-lg) var(--taro-radius-lg) 0 0 !important;
    padding: 10px 16px !important;
    color: var(--taro-text-muted) !important;
    font-size: .75rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
}
#order-standard_cart .view-cart-items {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    border-top: none !important;
    border-radius: 0 0 var(--taro-radius-lg) var(--taro-radius-lg) !important;
}
#order-standard_cart .view-cart-items .item {
    border-bottom: 1px solid var(--taro-border) !important;
    padding: 14px 16px !important;
    background: transparent !important;
}
#order-standard_cart .view-cart-items .item:last-child { border-bottom: none !important; }
#order-standard_cart .item-title {
    color: #fff !important;
    font-weight: 600 !important;
}
#order-standard_cart .item-group,
#order-standard_cart .item-domain,
#order-standard_cart .item small {
    color: var(--taro-text-faint) !important;
    font-size: .85rem !important;
}
#order-standard_cart .item-price span {
    color: #fff !important;
    font-weight: 700 !important;
}
#order-standard_cart .item-price .cycle {
    color: var(--taro-text-faint) !important;
    font-size: .8rem !important;
    font-weight: 400 !important;
}
#order-standard_cart .view-cart-empty {
    color: var(--taro-text-faint) !important;
    padding: 24px !important;
    text-align: center !important;
}

/* Links tipo boton (editar / eliminar) */
#order-standard_cart .btn-link { color: var(--taro-primary-400) !important; padding: 0 6px !important; }
#order-standard_cart .btn-link:hover { color: var(--taro-primary-500) !important; }
#order-standard_cart .empty-cart .btn-link,
#order-standard_cart .btn-xs.btn-remove-from-cart,
#order-standard_cart button[onclick*="removeItem"] {
    color: var(--taro-text-faint) !important;
}
#order-standard_cart .btn-continue-shopping {
    color: var(--taro-text-muted) !important;
    font-size: .85rem !important;
}

/* --------------------------------------------------------------------------
   7. Tabs (codigo promocional / impuestos)
   -------------------------------------------------------------------------- */
#order-standard_cart .view-cart-tabs { margin-top: 20px !important; }
#order-standard_cart .view-cart-tabs .nav-tabs {
    border-bottom: 1px solid rgba(255, 37, 255, 0.30) !important;
    background: transparent !important;
}
#order-standard_cart .view-cart-tabs .nav-tabs .nav-item a,
#order-standard_cart .view-cart-tabs .nav-tabs .nav-link {
    color: var(--taro-text-muted) !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: var(--taro-radius-lg) var(--taro-radius-lg) 0 0 !important;
    padding: 10px 18px !important;
    font-weight: 500 !important;
    transition: all var(--taro-transition) !important;
}
#order-standard_cart .view-cart-tabs .nav-tabs .nav-link.active,
#order-standard_cart .view-cart-tabs .nav-tabs .nav-link:hover {
    color: #fff !important;
    background: var(--taro-surface-hover) !important;
    border-color: var(--taro-border-hover) var(--taro-border-hover) transparent !important;
}
#order-standard_cart .view-cart-tabs .tab-content {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    border-top: none !important;
    border-radius: 0 0 var(--taro-radius-lg) var(--taro-radius-lg) !important;
    padding: 20px !important;
}
#order-standard_cart .tab-pane label,
#order-standard_cart .tab-pane p,
#order-standard_cart .tab-pane span {
    color: var(--taro-text-secondary) !important;
}
#order-standard_cart #inputPromotionCode {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
}
#order-standard_cart #inputPromotionCode::placeholder { color: var(--taro-text-placeholder) !important; }
#order-standard_cart .tab-pane .btn-block.btn-default,
#order-standard_cart [name="validatepromo"] {
    background: var(--taro-gradient-cta) !important;
    border: none !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
    font-weight: 700 !important;
    margin-top: 10px !important;
    box-shadow: var(--taro-shadow-cta) !important;
}
#order-standard_cart .tab-pane .btn-block.btn-default:hover,
#order-standard_cart [name="validatepromo"]:hover {
    background: var(--taro-gradient-cta-hover) !important;
}

/* --------------------------------------------------------------------------
   8. Botones principales del flujo (CTA gradiente landing)
   -------------------------------------------------------------------------- */
#order-standard_cart .btn-checkout,
#order-standard_cart #checkout,
#order-standard_cart #btnCompleteOrder,
#order-standard_cart #btnCompleteProductConfig {
    background: var(--taro-gradient-cta) !important;
    border: none !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
    font-weight: 700 !important;
    font-family: var(--taro-font-sans) !important;
    box-shadow: var(--taro-shadow-cta) !important;
    transition: all var(--taro-transition) !important;
}
#order-standard_cart .btn-checkout,
#order-standard_cart #checkout {
    width: 100% !important;
    text-align: center !important;
    padding: 14px 24px !important;
    font-size: 1rem !important;
    margin-top: 4px !important;
}
#order-standard_cart #btnCompleteOrder {
    padding: 14px 40px !important;
    font-size: 1rem !important;
    min-width: 200px !important;
}
#order-standard_cart .btn-checkout:hover,
#order-standard_cart #checkout:hover,
#order-standard_cart #btnCompleteOrder:hover,
#order-standard_cart #btnCompleteProductConfig:hover {
    background: var(--taro-gradient-cta-hover) !important;
    box-shadow: var(--taro-shadow-cta-hover) !important;
    transform: translateY(-1px) !important;
}
#order-standard_cart #btnAlreadyRegistered {
    background: var(--taro-accent-tint) !important;
    border: 1px solid var(--taro-border-hover) !important;
    color: var(--taro-primary-400) !important;
    border-radius: var(--taro-radius-lg) !important;
    font-weight: 600 !important;
}
#order-standard_cart #btnAlreadyRegistered:hover {
    background: var(--taro-surface-active) !important;
    color: #fff !important;
}
#order-standard_cart #btnNewUserSignup {
    background: var(--taro-surface-hover) !important;
    border: 1px solid var(--taro-border) !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
    font-weight: 600 !important;
}
#order-standard_cart #btnNewUserSignup:hover {
    background: rgba(255, 255, 255, 0.20) !important;
}

/* --------------------------------------------------------------------------
   9. Checkout: total, credito, metodos de pago
   -------------------------------------------------------------------------- */
#order-standard_cart #totalDueToday.alert-success {
    background: var(--taro-accent-tint) !important;
    border: 1px solid rgba(255, 37, 255, 0.40) !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
}
#order-standard_cart #totalDueToday strong { color: #fff !important; font-size: 1.4rem !important; }

/* Tarjetas de seleccion de gateway (radios name="paymentmethod")
   Estilo selector de la landing: superficie blanco 5%, borde blanco 10%;
   seleccionado = borde magenta + tinte magenta. El logo va sobre un chip
   blanco para que cualquier PNG sea legible en dark. */
.gateway-card-label .iradio_square-blue,
.gateway-card-label .iCheck-helper { display: none !important; }
.gateway-cards-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    padding: 10px 0;
}
.gateway-card-label { cursor: pointer; margin: 0; }
.gateway-card-label input[type="radio"] { display: none; }
.gateway-card-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--taro-border);
    border-radius: var(--taro-radius-lg);
    padding: 14px 16px 16px;
    background: var(--taro-surface);
    min-width: 140px;
    min-height: 90px;
    transition: border-color var(--taro-transition), box-shadow var(--taro-transition), background var(--taro-transition);
    position: relative;
}
.gateway-card-label:hover .gateway-card-box { border-color: var(--taro-border-hover); }
.gateway-card-label input[type="radio"]:checked + .gateway-card-box {
    border-color: var(--taro-primary-500);
    background: var(--taro-accent-tint);
    box-shadow: 0 0 0 3px rgba(255, 37, 255, 0.25);
}
.gateway-card-box img {
    max-width: 120px;
    max-height: 60px;
    object-fit: contain;
    background: #fff;
    border-radius: 8px;
    padding: 4px 8px;
}
.gateway-card-box .gateway-name {
    margin-top: 8px;
    margin-bottom: 4px;
    font-size: 12px;
    color: var(--taro-text-tertiary);
    text-align: center;
    font-weight: 600;
}
.gateway-card-box .gateway-check-icon {
    display: none;
    position: absolute;
    bottom: 7px;
    right: 8px;
    color: var(--taro-primary-500);
    font-size: 14px;
    background: var(--taro-bg-elevated);
    border-radius: 50%;
    line-height: 1;
}
.gateway-card-label input[type="radio"]:checked + .gateway-card-box .gateway-check-icon { display: block; }

/* Contenedores de datos de pago */
#order-standard_cart #paymentGatewayInput,
#order-standard_cart .cc-input-container,
#order-standard_cart #creditCardInputFields {
    background: var(--taro-bg-elevated) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-xl) !important;
    padding: 20px !important;
    margin-top: 12px !important;
}
#paymentGatewayInput:empty { display: none !important; }

/* Listas inyectadas por WHMCS/gateways dentro de creditCardInputFields
   (llegan con fondo gris claro rgb(241,241,241): se fuerzan a dark) */
#creditCardInputFields ul.selected,
#creditCardInputFields ul,
#order-standard_cart #creditCardInputFields ul.selected,
#order-standard_cart #creditCardInputFields ul {
    background-color: var(--taro-bg-elevated) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-lg) !important;
    padding: 6px 0 !important;
    margin: 10px 0 !important;
    list-style: none !important;
}
#creditCardInputFields ul.selected li,
#creditCardInputFields ul li,
#order-standard_cart #creditCardInputFields ul.selected li,
#order-standard_cart #creditCardInputFields ul li {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.85) !important;
    padding: 8px 16px !important;
    border-radius: 8px !important;
}
#creditCardInputFields ul.selected li label,
#creditCardInputFields ul li label,
#order-standard_cart #creditCardInputFields ul.selected li label,
#order-standard_cart #creditCardInputFields ul li label {
    color: rgba(255, 255, 255, 0.85) !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    margin-bottom: 0 !important;
}
#creditCardInputFields ul li:hover,
#order-standard_cart #creditCardInputFields ul li:hover {
    background-color: var(--taro-accent-tint) !important;
}

/* Mensaje de conexion segura */
#order-standard_cart .checkout-security-msg {
    background: rgba(34, 197, 94, 0.10) !important;
    border-color: rgba(34, 197, 94, 0.30) !important;
    color: #4ade80 !important;
    border-radius: var(--taro-radius-lg) !important;
    margin-top: 20px !important;
}

/* --------------------------------------------------------------------------
   10. Alertas dentro del carrito
   -------------------------------------------------------------------------- */
#order-standard_cart .alert-warning {
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1px solid rgba(245, 158, 11, 0.35) !important;
    color: #fbbf24 !important;
    border-radius: var(--taro-radius-lg) !important;
}
#order-standard_cart .alert-warning a { color: #fbbf24 !important; text-decoration: underline !important; }
#order-standard_cart .alert-danger {
    background: rgba(239, 68, 68, 0.12) !important;
    border: 1px solid rgba(239, 68, 68, 0.35) !important;
    color: #f87171 !important;
    border-radius: var(--taro-radius-lg) !important;
}
#order-standard_cart .alert-success {
    background: rgba(34, 197, 94, 0.12) !important;
    border: 1px solid rgba(34, 197, 94, 0.35) !important;
    color: #4ade80 !important;
    border-radius: var(--taro-radius-lg) !important;
}
#order-standard_cart .alert-info {
    background: rgba(59, 130, 246, 0.12) !important;
    border: 1px solid rgba(59, 130, 246, 0.35) !important;
    color: #93c5fd !important;
    border-radius: var(--taro-radius-lg) !important;
}

/* --------------------------------------------------------------------------
   11. Gateways express / PayPal en viewcart
   -------------------------------------------------------------------------- */
#order-standard_cart .view-cart-gateway-checkout,
#order-standard_cart .express-checkout-buttons {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-lg) !important;
    padding: 16px !important;
    margin: 12px 0 !important;
    color: var(--taro-text-secondary) !important;
}
#order-standard_cart .view-cart-gateway-checkout *:not(img):not(iframe):not(button):not(a) {
    color: var(--taro-text-secondary) !important;
    background: transparent !important;
}
#order-standard_cart .separator {
    color: var(--taro-text-faint) !important;
    text-align: center !important;
    margin: 8px 0 !important;
    font-size: .8rem !important;
}

/* --------------------------------------------------------------------------
   12. Modales del carrito (confirmar eliminar / vaciar) — viven en <body>
   -------------------------------------------------------------------------- */
.modal-remove-item .modal-content {
    background: var(--taro-bg-elevated) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-xl) !important;
    color: var(--taro-text-secondary) !important;
}
.modal-remove-item .modal-title,
.modal-remove-item .modal-body { color: var(--taro-text-secondary) !important; }
.modal-remove-item .modal-title i { color: var(--taro-primary-400); }
.modal-remove-item .modal-footer {
    border-top: 1px solid var(--taro-border) !important;
    background: transparent !important;
}
.modal-remove-item .modal-footer .btn-default {
    background: var(--taro-surface-hover) !important;
    border: 1px solid var(--taro-border) !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
}
.modal-remove-item .modal-footer .btn-primary {
    background: var(--taro-gradient-cta) !important;
    border: none !important;
    color: #fff !important;
    border-radius: var(--taro-radius-lg) !important;
    font-weight: 700 !important;
}
.modal-remove-item .close { color: var(--taro-text-muted) !important; }

/* --------------------------------------------------------------------------
   13. Sidebar colapsado movil + selector de categorias
       (sustituye a los antiguos style="" inline del tpl)
   -------------------------------------------------------------------------- */
#order-standard_cart .sidebar-collapsed .panel,
#order-standard_cart .sidebar-collapsed .card {
    background-color: var(--taro-bg-elevated) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-lg) !important;
    overflow: hidden !important;
}
#order-standard_cart .sidebar-collapsed .panel-heading,
#order-standard_cart .sidebar-collapsed .card-header {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border-bottom: 1px solid var(--taro-border) !important;
}
#order-standard_cart .sidebar-collapsed .panel-body,
#order-standard_cart .sidebar-collapsed .card-body {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.85) !important;
}
#order-standard_cart .sidebar-collapsed .panel-heading,
#order-standard_cart .sidebar-collapsed .card-header,
#order-standard_cart .sidebar-collapsed .panel-title,
#order-standard_cart .sidebar-collapsed .card-title,
#order-standard_cart .sidebar-collapsed h1,
#order-standard_cart .sidebar-collapsed h2,
#order-standard_cart .sidebar-collapsed h3,
#order-standard_cart .sidebar-collapsed h4,
#order-standard_cart .sidebar-collapsed h5,
#order-standard_cart .sidebar-collapsed p,
#order-standard_cart .sidebar-collapsed a,
#order-standard_cart .sidebar-collapsed label,
#order-standard_cart .sidebar-collapsed li,
#order-standard_cart .sidebar-collapsed span,
#order-standard_cart .sidebar-collapsed i {
    color: rgba(255, 255, 255, 0.85) !important;
}
#order-standard_cart .sidebar-collapsed .list-group-item,
#order-standard_cart .sidebar-collapsed .list-group-item a {
    background-color: transparent !important;
    color: var(--taro-text-secondary) !important;
    border-color: var(--taro-border) !important;
}
#order-standard_cart .sidebar-collapsed .list-group-item:hover {
    background-color: var(--taro-accent-tint) !important;
    color: #fff !important;
}
/* Select del selector de categorias (antes inline en el tpl) */
#order-standard_cart .sidebar-collapsed select.form-control,
#order-standard_cart .sidebar-collapsed .custom-select {
    background-color: var(--taro-bg-elevated) !important;
    color: #fff !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-lg) !important;
}
#order-standard_cart .sidebar-collapsed select.form-control option,
#order-standard_cart .sidebar-collapsed .custom-select option {
    background-color: var(--taro-bg-elevated) !important;
    color: #fff !important;
}

/* Selector de divisa */
#order-standard_cart select[name="currency"],
select[name="currency"] {
    background-color: var(--taro-bg-elevated) !important;
    color: #fff !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-lg) !important;
    padding: 8px 12px !important;
    -webkit-appearance: auto !important;
    appearance: auto !important;
}
select[name="currency"] option {
    background-color: var(--taro-bg-elevated) !important;
    color: #fff !important;
}
select[name="currency"] option:checked,
select[name="currency"] option:hover {
    background-color: var(--taro-primary-500) !important;
    color: #fff !important;
}

/* --------------------------------------------------------------------------
   14. Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
    #order-standard_cart .secondary-cart-sidebar,
    #order-standard_cart .order-summary { padding: 16px !important; }
    #order-standard_cart .header-lined h1 { font-size: 1.75rem !important; }
    .gateway-cards-wrapper { gap: 10px; }
    .gateway-card-box { min-width: 120px; }
}


/* ==========================================================================
   AGENTE C - RONDA 2 (fixes CSS post-produccion)
   C3: service-renewals / domain-renewals ilegibles (fondo y texto blancos)
   C4: express checkout visible y bien presentado
   ========================================================================== */

/* ---- C3: bloques de renovacion legibles ----------------------------------
   Causa raiz: all.min.css (base de standard_cart) pinta los listados con
   fondos claros: ".service-renewals, .domain-renewals { background-color:
   #f8f8f8 }" y ":nth-child(even) { #f4f4f4 }" (all.css:1441-1461), y
   ".div-renewal-period-label { color:#666 }" (all.css:95-101). El theme
   oscuro killa pone el texto en blanco -> blanco sobre blanco.
   Selectores anclados a #order-standard_cart + clases propias del markup
   de renewals (service-renewals.tpl / service-renewal-item.tpl /
   domain-renewals.tpl), asi que no afectan a otras paginas. */
#order-standard_cart .service-renewals,
#order-standard_cart .domain-renewals {
    background-color: var(--taro-bg-elevated) !important;   /* #12121A */
    border: 1px solid var(--taro-border) !important;         /* blanco 10% */
    border-radius: var(--taro-radius-xl) !important;         /* 16px */
    overflow: hidden !important;
}
#order-standard_cart .service-renewals .service-renewal,
#order-standard_cart .domain-renewals .domain-renewal,
#order-standard_cart .addon-renewals .service-renewal {
    background-color: transparent !important;
    border-bottom: 1px solid var(--taro-border) !important;
    color: var(--taro-text-secondary) !important;            /* blanco 80% */
    padding: 20px !important;
}
#order-standard_cart .service-renewals .service-renewal:nth-child(even),
#order-standard_cart .domain-renewals .domain-renewal:nth-child(even),
#order-standard_cart .addon-renewals .service-renewal:nth-child(even) {
    background-color: var(--taro-surface) !important;        /* blanco 5% */
}
#order-standard_cart .service-renewals .service-renewal:last-child,
#order-standard_cart .domain-renewals .domain-renewal:last-child,
#order-standard_cart .addon-renewals .service-renewal:last-child {
    border-bottom: none !important;
}
/* Nombre del paquete / dominio */
#order-standard_cart .service-renewal h3,
#order-standard_cart .service-renewal h4,
#order-standard_cart .domain-renewal h3,
#order-standard_cart .addon-renewals h4 {
    color: var(--taro-text) !important;
}
/* "Proximo vencimiento", "Periodo de renovacion", precio y descripciones */
#order-standard_cart .service-renewal p,
#order-standard_cart .service-renewal .div-renewal-period-label,
#order-standard_cart .service-renewal .clearfix .pull-left div,
#order-standard_cart .service-renewal .clearfix .float-left div,
#order-standard_cart .domain-renewal p,
#order-standard_cart p.domain-renewal-desc {
    color: var(--taro-text-secondary) !important;
}
#order-standard_cart .service-renewal .div-renewal-period-label {
    font-weight: 600 !important;
    color: var(--taro-text-muted) !important;
}
#order-standard_cart .service-renewals .div-renewal-ineligible {
    color: var(--taro-text-muted) !important;
}
/* Sub-listado de addons */
#order-standard_cart .addon-renewals > div {
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-lg) !important;
    overflow: hidden !important;
}
/* Badges "Renueva en X dias" / "Renovacion no disponible" */
#order-standard_cart .service-renewal .label {
    border-radius: var(--taro-radius-full) !important;
    padding: 4px 12px !important;
    font-weight: 600 !important;
}
#order-standard_cart .service-renewal .label-warning {
    background: rgba(245, 158, 11, 0.15) !important;
    color: #fbbf24 !important;
    border: 1px solid rgba(245, 158, 11, 0.35) !important;
}
#order-standard_cart .service-renewal .label-info {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #93c5fd !important;
    border: 1px solid rgba(59, 130, 246, 0.35) !important;
}

/* ---- C4: Express checkout visible y presentable ---------------------------
   El display:none del FIX 4 de killa/css/custom.css se retiro (ahora solo
   se oculta el contenedor cuando esta vacio). El panel oscuro base ya lo da
   la seccion 11 de este archivo (lineas ~641-649: superficie, borde,
   radio 12px). Aqui: botones centrados, separador "o" legible y sin el
   margin-left:70px legacy de all.css:854. */
#order-standard_cart .express-checkout-buttons {
    text-align: center !important;
}
#order-standard_cart .express-checkout-buttons > div:not(.separator),
#order-standard_cart .express-checkout-buttons > form {
    max-width: 320px !important;
    margin: 0 auto !important;
}
#order-standard_cart .express-checkout-buttons img {
    max-width: 100% !important;
    height: auto !important;
    display: inline-block !important;
}
#order-standard_cart .express-checkout-buttons .separator {
    margin: 12px auto 4px !important;
    padding: 0 !important;
    color: var(--taro-text-faint) !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-align: center !important;
}
/* Si no hay gateways express, no mostrar un panel vacio */
#order-standard_cart .express-checkout-buttons:empty {
    display: none !important;
}
#order-standard_cart .express-checkout-buttons:not(:has(*)) {
    display: none !important;
}
@media (max-width: 767.98px) {
    #order-standard_cart .express-checkout-buttons { padding: 12px !important; }
    #order-standard_cart .express-checkout-buttons > div:not(.separator),
    #order-standard_cart .express-checkout-buttons > form {
        max-width: 100% !important;
    }
    #order-standard_cart .service-renewal .pull-right,
    #order-standard_cart .service-renewal .float-right {
        float: none !important;
        display: block !important;
        margin-bottom: 8px !important;
    }
}

/* ==========================================================================
   FIN AGENTE C - RONDA 2
   ========================================================================== */

/* ==========================================================================
   RONDA 3 (2026-07-07)
   R1: cart.php?gid=addons ilegible (contenedores blancos, texto blanco)
   Causa raiz: all.min.css pinta los boxes de addons.tpl con fondo claro:
   ".products .product { background:#fff; border:1px solid #ddd }" y
   ".products .product header { background:#f8f8f8 }" con texto #333; el
   texto blanco global del theme killa los dejaba blanco sobre blanco.
   Selectores anclados a #order-standard_cart .products, el mismo markup
   que usa addons.tpl (y products.tpl base si algun dia se usa).
   ========================================================================== */
#order-standard_cart .products .product {
    background: var(--taro-surface) !important;
    border: 1px solid var(--taro-border) !important;
    border-radius: var(--taro-radius-xl) !important;
    overflow: hidden !important;
}
#order-standard_cart .products .product header {
    background: var(--taro-bg-elevated) !important;
    border-bottom: 1px solid var(--taro-border) !important;
    border-radius: 0 !important;
    margin: 0 !important;
}
#order-standard_cart .products .product header span {
    color: var(--taro-text) !important;
    font-weight: 700 !important;
}
#order-standard_cart .products .product header .qty {
    color: var(--taro-text-muted) !important;
}
#order-standard_cart .products .product .product-desc,
#order-standard_cart .products .product .product-desc p {
    color: var(--taro-text-tertiary) !important;
}
#order-standard_cart .products .product .product-pricing {
    color: var(--taro-text-secondary) !important;
}
#order-standard_cart .products .product .product-pricing .price {
    color: var(--taro-primary-400) !important;
    font-weight: 800 !important;
}
#order-standard_cart .products .product span.feature-value {
    color: var(--taro-text) !important;
}
#order-standard_cart .products .product footer {
    background: transparent !important;
}

/* ---- R2: esquinas rectangulares en los paneles del sidebar ----------------
   Categorias/Acciones se veian con esquinas cuadradas: el panel tiene
   border-radius 16px pero overflow visible, y el ultimo .list-group-item
   (fondo opaco #181821, o magenta cuando esta activo) sobresalia tapando
   las esquinas inferiores redondeadas. Verificado en vivo 2026-07-07. */
#order-standard_cart .cart-sidebar .panel,
#order-standard_cart .cart-sidebar .card {
    overflow: hidden !important;
}
#order-standard_cart .cart-sidebar .list-group-item:last-child {
    border-bottom-left-radius: 15px !important;
    border-bottom-right-radius: 15px !important;
}

/* ==========================================================================
   FIN RONDA 3
   ========================================================================== */

/* ============================================================
   R5 — Switch "Suscribase a nuestra lista de correo" (checkout)
   bootstrap-switch renderizaba caja blanca sin estilo en dark.
   ============================================================ */
.marketing-email-optin { margin: 18px 0; }
.marketing-email-optin h4 { color: #fff; }
.marketing-email-optin p { color: rgba(255, 255, 255, 0.70); }
.marketing-email-optin .bootstrap-switch {
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.05);
    box-shadow: none;
}
.marketing-email-optin .bootstrap-switch .bootstrap-switch-label {
    background: #12121A;
    color: rgba(255, 255, 255, 0.85);
}
.marketing-email-optin .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.75);
}
.marketing-email-optin .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
    background: linear-gradient(to right, #FF25FF, #E013E0);
    color: #fff;
}
/* Fallback si el plugin no inicializa: checkbox nativo decente */
.marketing-email-optin > input[name="marketingoptin"] {
    width: 20px;
    height: 20px;
    accent-color: #FF25FF;
    cursor: pointer;
}