/* =========================================================
   2. FIXES GLOBALES (Prioridad Alta)
   ========================================================= */

/* FIX Z-INDEX: Forzar que los botones "Cotizar" siempre se vean */
.btn, button, a.btn, .sk__warped-button {
    position: relative !important;
    z-index: 999 !important;
    cursor: pointer !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* FIX LOGOS: Evitar que se expandan */
.navbar-brand img, #sk__main-logo, .sk__mobile-main-logo img {
    max-width: 150px !important;
    height: auto !important;
    width: auto !important;
}

/* =========================================================
   3. ESTILOS MODAL "PREMIUM DARK HIGH CONTRAST"
   Optimizados para legibilidad y espacio
   ========================================================= */

/* Variables de Alto Contraste */
:root {
    --brand-pink: #d63384;
    --bg-modal: #121212;
    --bg-element: #1e1e1e;
    --bg-input: #2a2a2a;
    --text-white: #ffffff;
    --text-silver: #d1d1d1; /* Gris muy claro para lectura */
    --border-dim: #333333;
}

/* 1. CONTENEDOR PRINCIPAL */
.modal-dark-premium {
    background-color: rgba(15, 15, 15, 0.98) !important;
    border: 1px solid var(--border-dim);
    border-radius: 20px;
    box-shadow: 0 50px 100px #000;
    color: var(--text-white);
}

/* 2. TEXTOS (Adiós al gris oscuro) */
.text-silver { color: var(--text-silver) !important; }
.text-white { color: #ffffff !important; }
.text-pink { color: var(--brand-pink) !important; text-shadow: 0 0 10px rgba(214, 51, 132, 0.4); }
.modal-title, h3, h4, h5 { font-weight: 700; letter-spacing: 0.5px; }

/* 3. INPUTS & SELECTS (Fondo Oscuro, Texto Claro) */
.input-dark, .form-control, .form-select {
    background-color: var(--bg-input) !important;
    border: 1px solid var(--border-dim) !important;
    color: #ffffff !important;
    border-radius: 50px !important; /* Forma de píldora */
    padding: 10px 20px !important;
    font-size: 0.95rem;
}
.input-dark:focus {
    border-color: var(--brand-pink) !important;
    background-color: #333 !important;
    box-shadow: 0 0 0 3px rgba(214, 51, 132, 0.2) !important;
}
.input-dark::placeholder { color: #888 !important; }
/* Calendario en blanco */
input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1); cursor: pointer; }

/* 4. TARJETAS COMPACTAS (High Contrast) */
.card-compact {
    background-color: var(--bg-element);
    border: 2px solid transparent;
    border-radius: 15px;
    padding: 15px 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}
.card-compact:hover {
    background-color: #252525;
    transform: translateY(-3px);
    border-color: #444;
}
/* Estado Seleccionado */
.btn-check:checked + .card-compact {
    background-color: rgba(214, 51, 132, 0.15);
    border-color: var(--brand-pink);
    box-shadow: 0 0 20px rgba(214, 51, 132, 0.1);
}

/* Iconos */
* Y CÁMBIALO por esto (nombre seguro): */
.size-xl { 
    font-size: 3.5rem; 
    color: #fff; 
    margin-bottom: 0;
    line-height: 1;
}
.size-xl i { color: #fff; }

/* Check Circle (Indicador) */
.check-circle {
    width: 22px; height: 22px; border-radius: 50%;
    background: var(--brand-pink); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 10px; opacity: 0; transform: scale(0.5); transition: 0.2s;
}
.center-check { position: absolute; top: 10px; right: 10px; }
.btn-check:checked + .card-compact .check-circle { opacity: 1; transform: scale(1); }

/* 5. RESUMEN */
.summary-box {
    background-color: #1a1a1a;
    border: 1px solid #333;
    border-radius: 15px;
}
.total-display {
    background-color: #000;
    border: 1px solid #333;
}

/* 6. BOTONES (Glow) */
.btn-pink-glow {
    background-color: var(--brand-pink); border: none; color: #fff;
    box-shadow: 0 0 15px rgba(214, 51, 132, 0.4); transition: 0.3s;
}
.btn-pink-glow:hover { background-color: #e64a9e; box-shadow: 0 0 25px rgba(214, 51, 132, 0.6); color: #fff; }

.btn-success-glow {
    background-color: #00e676; border: none; color: #000;
    box-shadow: 0 0 15px rgba(0, 230, 118, 0.4);
}

/* 7. PROGRESS BAR */
.progress-thin { height: 4px; background: #333; border-radius: 10px; }
.progress-bar.bg-pink { background-color: var(--brand-pink); box-shadow: 0 0 10px var(--brand-pink); }

/* 8. FIXES GENERALES */
.modal-backdrop { z-index: 2147483640 !important; background-color: rgba(0,0,0,0.9) !important; }
.modal { z-index: 2147483647 !important; }

/* Estilo para la caja del Rider Técnico */
.rider-box {
    background-color: rgba(0, 0, 0, 0.4) !important;
    border: 1px dashed #555 !important;
}
.rider-box h6 { letter-spacing: 1px; color: #fff !important; }
.rider-box p { color: #ccc !important; }

/* FIX: IGUALAR TAMAÑO DE BOTONES */
.btn-pink-glow, .btn-success-glow {
    border: 1px solid transparent !important; /* El secreto para igualar altura */
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* =========================================================
   FIX DEFINITIVO: BORRAR LA "M" DEL TEMA
   ========================================================= */

/* 1. Destruir el pseudo-elemento (la M) */
.navbar-brand::before,
.navbar-brand::after,
.sk__curtain-loader-logo::before,
.sk__curtain-loader-logo::after,
.sk__header-one .navbar-brand::before,  /* Específico del header */
header .navbar-brand::before {          /* Genérico */
    content: none !important;
    content: "" !important;             /* Doble seguridad */
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* 2. Hacer invisible cualquier texto residual (si la M es una letra) */
.navbar-brand,
.sk__curtain-loader-logo {
    font-size: 0 !important;        /* Hace la letra tamaño 0 */
    line-height: 0 !important;
    color: transparent !important;  /* La hace transparente */
}

/* 3. RESCATAR TU LOGO (Asegurar que tu imagen SÍ se vea) */
.navbar-brand img,
.sk__curtain-loader-logo img {
    font-size: initial !important;  /* Restaura tamaño normal */
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-width: 150px !important;    /* Ajuste de seguridad */
    height: auto !important;
}