/*
 * ninja_modern — child theme de standard_cart
 * Replica la apariencia del template "modern" de hosting.cl
 * sobre la estructura HTML de WHMCS 9 standard_cart.
 */

/* =============================================
   1. Ocultar sidebar izquierdo (categorías/acciones)
   ============================================= */
.cart-sidebar {
    display: none !important;
}

/* =============================================
   2. Cart-body: full-width centrado (como modern)
   ============================================= */
.cart-body {
    width: 100% !important;
    max-width: 900px;
    margin: 0 auto;
    float: none !important;
    padding: 0 15px;
}

/* Quitar el layout flex/grid del contenedor padre */
.main-content > .row {
    display: block;
}

/* =============================================
   3. Encabezados: limpio y centrado
   ============================================= */
.header-lined {
    border: none !important;
    margin-bottom: 25px;
    text-align: center;
}

.header-lined h1,
h1.font-size-36 {
    font-size: 24px !important;
    font-weight: 400;
    margin: 0 0 10px 0;
    padding: 0;
    border: none;
    text-align: center;
}

.header-lined p {
    text-align: center;
    color: #666;
    margin-bottom: 20px;
}

/* =============================================
   4. Opciones de dominio: bordes redondeados
   ============================================= */
.domain-option-group,
.domainoptions {
    margin: 20px 0;
    padding: 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 10px;
    overflow: hidden;
}

.domain-option-group .domain-option,
.domainoptions .option {
    border-bottom: 1px solid #ccc;
    padding: 0;
}

.domain-option-group .domain-option:last-child,
.domainoptions .option:last-child {
    border-bottom: 0;
}

.domain-option-group .domain-option label,
.domainoptions .option label {
    display: block;
    padding: 10px 10px 10px 30px;
    margin: 0;
    cursor: pointer;
}

.domain-option-group .domain-option:hover,
.domainoptions .option:hover {
    background-color: #f8f9fa;
}

.domain-option-group .domain-option.selected,
.domainoptions .optionselected {
    background-color: #EDF1FE;
}

/* Inputs de dominio */
.domain-input-group,
.domainreginput {
    padding: 0 15px 15px 15px;
}

/* =============================================
   5. Botón "Comprobar" — más ancho
   ============================================= */
#btnCheckAvailability,
#useOwnDomain {
    white-space: nowrap;
    min-width: 120px;
    padding: 8px 16px;
    font-size: 14px;
}

/* Columna del botón: ampliar */
.domain-input-group .row > .col-sm-2,
.domainreginput .row > .col-sm-2,
.option .row > .col-sm-2 {
    min-width: 130px;
    flex: 0 0 auto;
    width: auto;
}

/* =============================================
   6. Select de extensiones (.cl .com) — no cortar
   ============================================= */
#registertld,
select.form-control {
    min-height: 38px;
    padding: 6px 8px;
    line-height: 1.4;
    overflow: visible;
}

#registertld option {
    padding: 4px 8px;
    line-height: 1.5;
}

#registertld {
    min-width: 80px;
}

/* =============================================
   7. OCULTAR pestaña "Estimar impuestos"
   (en Chile IVA es siempre 19%, no tiene sentido)
   ============================================= */
.view-cart-tabs .nav-tabs li:nth-child(2),
.view-cart-tabs .nav-item:nth-child(2) {
    display: none !important;
}

#calcTaxes {
    display: none !important;
}

/* Si queda solo la tab de promo, quitar el estilo de tabs */
.view-cart-tabs .nav-tabs {
    border-bottom: none;
}

.view-cart-tabs .nav-tabs .nav-link.active {
    border: none;
    background: transparent;
    font-weight: 600;
    color: #333;
    padding-left: 0;
}

/* =============================================
   8. Resumen del pedido — spacing y layout
   ============================================= */
#orderSummary {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    background: #fafafa;
}

#orderSummary h2 {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 15px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

/* Cada línea del resumen: flexbox para que no se peguen */
#orderSummary .subtotal,
#orderSummary .bordered-totals > .clearfix,
#orderSummary .recurring-totals {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    clear: both;
}

#orderSummary .subtotal span,
#orderSummary .bordered-totals span,
#orderSummary .recurring-totals span {
    float: none !important;
}

/* Bordes de la sección de impuestos */
#orderSummary .bordered-totals {
    border: none;
    padding: 0;
    margin: 0;
}

/* Ocultar la "@" en "IVA @ 19.00%" — reemplazar con texto limpio */
#orderSummary .bordered-totals .pull-left,
#orderSummary .bordered-totals .float-left {
    font-size: 0;
}

#orderSummary .bordered-totals .pull-left::before,
#orderSummary .bordered-totals .float-left::before {
    content: "IVA 19%";
    font-size: 14px;
}

/* Totales recurrentes */
#orderSummary .recurring-totals {
    font-weight: 600;
    border-bottom: none;
    padding-top: 10px;
}

#orderSummary .recurring-totals .recurring-charges span {
    display: none;
}

#orderSummary .recurring-totals .recurring-charges span[style*="display:block"],
#orderSummary .recurring-totals .recurring-charges span:not([style*="display:none"]):not([style*="display: none"]) {
    display: inline !important;
}

/* Total a abonar — destacado */
#orderSummary .total-due-today {
    text-align: center;
    padding: 15px 0 10px;
    margin-top: 10px;
    border-top: 2px solid #333;
}

#orderSummary .total-due-today .amt {
    display: block;
    font-size: 28px;
    font-weight: 700;
    color: #333;
    margin-bottom: 2px;
}

#orderSummary .total-due-today span:last-child {
    font-size: 13px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Botón Pagar */
#orderSummary .btn-checkout {
    margin-top: 15px;
    padding: 12px 30px;
    font-size: 16px;
    border-radius: 5px;
}

/* =============================================
   9. Cards y paneles: simplificar
   ============================================= */
.sidebar-collapsed {
    display: none !important;
}

.panel.card.panel-default,
.panel.card.card-sidebar {
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: none;
}

.panel-heading.card-header {
    background-color: #f8f9fa;
    border-bottom: 1px solid #ccc;
}

/* =============================================
   10. Formularios: estilo limpio
   ============================================= */
.form-control {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 8px 12px;
}

.form-control:focus {
    border-color: #4a90d9;
    box-shadow: 0 0 0 2px rgba(74, 144, 217, 0.15);
}

.btn-primary {
    background-color: #4a90d9;
    border-color: #4a90d9;
    border-radius: 4px;
    padding: 8px 20px;
}

.btn-primary:hover {
    background-color: #3a7bc8;
    border-color: #3a7bc8;
}

/* =============================================
   11. Billing cycle y configuración
   ============================================= */
.billing-cycle-options,
.billingcycle,
.config-options,
.configoptions,
.addons-container,
.addons {
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 1px;
    margin-bottom: 20px;
}

/* =============================================
   12. Resultados de dominio
   ============================================= */
.domain-checker-result-available {
    color: #779500;
    font-size: 1.4em;
    font-weight: bold;
    text-align: center;
}

.domain-checker-result-unavailable {
    color: #cc0000;
    font-size: 1.4em;
    font-weight: bold;
    text-align: center;
}

/* =============================================
   13. Carrito — tabla de items
   ============================================= */
.view-cart-items-header th {
    background-color: #666;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 3px 0;
    line-height: 26px;
    border-radius: 5px;
}

/* =============================================
   14. Recomendaciones de productos — ocultar
   ============================================= */
.product-recommendations-container {
    display: none !important;
}

/* =============================================
   15. Mobile responsive
   ============================================= */
@media (max-width: 768px) {
    .cart-body {
        padding: 0 10px;
    }

    h1.font-size-36,
    .header-lined h1 {
        font-size: 20px !important;
    }

    #btnCheckAvailability,
    #useOwnDomain {
        min-width: 100%;
        margin-top: 10px;
    }

    .domain-input-group .row > .col-sm-2,
    .domainreginput .row > .col-sm-2,
    .option .row > .col-sm-2 {
        width: 100%;
        min-width: 100%;
    }

    #orderSummary .total-due-today .amt {
        font-size: 24px;
    }
}