body {
    background-color: #f4f5f7;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    min-height: 100vh;
    margin: 0;
    display: grid;

    justify-items: center;
    align-items: start;

    padding-top: 18px;
    box-sizing: border-box;

    overflow: hidden;
}

.wizard-container {
    background: #ffffff;
    width: 95vw; 
    max-width: 1250px; /* Más ancho para que quepan bien 5 o 6 productos en el grid */
    height: 90vh; 
    max-height: 850px;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
}

/* BARRA DE PROGRESO SUPERIOR */
.wizard-progress-bar {
    height: 4px;
    background: #e9ecef;
    width: 100%;
}
.wizard-progress-fill {
    height: 100%;
    background: var(--aizu-gold);
    width: 0%;
    transition: width 0.5s ease-in-out;
}

.wizard-header {
    padding: 30px 40px 10px;
    text-align: center;
}
.wizard-header h2 {
    color: #1d1d1f;
    margin: 0;
    font-size: 24px;
}

.wizard-body {
    flex-grow: 1;
    padding: 20px 50px 20px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* FOOTER GLOBAL DEL WIZARD */
.wizard-footer {
    flex-shrink: 0;
    padding: 18px 32px;
    border-top: 1px solid #e9ecef;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    position: relative;
    z-index: 20;
}

.footer-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
}

.wizard-footer-btn {
    min-height: 44px;
    padding: 10px 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}

.wizard-footer-back {
    padding-left: 16px;
    padding-right: 16px;
}

.wizard-footer-next {
    min-width: 170px;
}

.wizard-body {
    min-height: 0;
}

@media (max-width: 767px) {

    #preview-creditos-mobile {
        min-height: 44px;
        border-radius: 12px;
        font-size: 13px;
    }
}

@media (max-width: 576px) {

    body {
        display: block;
        overflow: hidden;
    }

    .wizard-container {
        width: 100%;
        max-width: none;
        height: 100vh;
        height: 100dvh;
        max-height: none;
        border-radius: 0;
    }

    .wizard-header {
        padding: 20px 16px 8px;
    }

    .wizard-header h2 {
        font-size: 1.5rem;
        line-height: 1.2;
    }

    .wizard-body {
        padding: 12px 14px 18px;
    }

    .wizard-footer {
        padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
        gap: 8px;
    }

    .footer-right {
        flex: 1;
        gap: 8px;
    }

    .wizard-footer-btn {
        height: 44px;
        min-height: 44px;
        padding: 0 9px;
        font-size: clamp(10.5px, 3vw, 13px);
        overflow: hidden;
        white-space: nowrap;
    }

    .wizard-footer-back {
        width: 44px;
        min-width: 44px;
        flex: 0 0 44px;
        padding: 0;
    }

    .wizard-footer-back-text {
        display: none;
    }

    .wizard-footer-back i,
    .wizard-footer-next i {
        margin-left: 0 !important;
        margin-right: 0 !important;
        flex-shrink: 0;
    }

    #btn-skip {
        flex: 0 1 auto;
        max-width: 48%;
    }

    #btn-next {
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
    }
}

@media (max-width: 576px) {

    .creditos-mode-tabs {
        gap: 4px;
        padding: 4px;
        margin-bottom: 16px !important;
        border-radius: 16px;
    }

    .creditos-mode-tab {
        min-height: 42px;
        padding: 9px 8px;
        border-radius: 12px;
        font-size: 13px;
    }

    .creditos-mode-tab i {
        margin-right: 5px !important;
        font-size: 12px;
    }

    #creditos-cartera-panel .card-body {
        padding: 16px !important;
    }
}

.fade-content { animation: fadeIn 0.4s ease-in-out forwards; width: 100%; }
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.import-options-container { width: 100%; max-width: 600px; margin: 0 auto 20px; }
.import-card { border-radius: 12px; border: 1px solid #dee2e6 !important; background-color: #ffffff; box-shadow: 0 4px 15px rgba(0,0,0,0.03); }

.search-pill {
    width: 100%; display: flex; align-items: center; background: #ffffff;
    border: 1px solid #d9e1ea; border-radius: 999px; overflow: hidden; transition: all .18s ease;
}
.search-pill:focus-within { border-color: #0071e3; box-shadow: 0 0 0 4px rgba(0, 113, 227, 0.15); }
.search-pill-icon { width: 46px; min-width: 46px; height: 46px; display: flex; align-items: center; justify-content: center; }
.search-pill-icon img { width: 19px; height: 19px; object-fit: contain; }
.search-pill-input { flex: 1; height: 46px; border: 0; outline: none; background: transparent; padding: 0 10px 0 2px; font-size: 15px; }
.search-pill-btn { height: 38px; margin: 4px; padding: 0 18px; border: 0; border-radius: 999px; background: #0071e3; color: #fff; font-weight: 600; transition: all .18s ease; }
.search-pill-btn:hover { background: #0077ed; }

/* Grid de Productos */
.scraping-results-container { width: 100%; margin-top: 10px; }
.scrollable-results { max-height: 50vh; overflow-y: auto; overflow-x: hidden; padding: 15px; background: #fcfcfc; border-radius: 10px; border: 1px solid #eee; }
.product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 15px; width: 100%; }

.product-card-mini {
    position: relative;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 14px;
    padding: 15px;
    text-align: center;
    transition: all .25s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.product-card-mini:hover { transform: translateY(-4px); box-shadow: 0 10px 22px rgba(0,0,0,0.08); }

/* Efecto de apagado cuando no está seleccionado */
.product-card-mini.deseleccionado {
    opacity: 0.45;
    filter: grayscale(100%);
    transition: all 0.3s ease;
}

/* Imagen del producto (Asegura que no afecte al logo) */
.product-card-mini > img:not(.source-badge img) {
    width: 100%;
    height: 130px;
    object-fit: contain;
    margin-bottom: 12px;
    border-radius: 8px;
}

/* Switch superior izquierdo */
.card-switch-top-left { position: absolute; top: 12px; left: 12px; z-index: 4; }
.card-switch-top-left .form-check-input { width: 2.2em; height: 1.1em; cursor: pointer; border-color: #d1d1d6; }
.card-switch-top-left .form-check-input:checked { background-color: #cda851; border-color: #cda851; } /* Color dorado como en tu imagen */

/* FIX: Logo de MercadoLibre (Pequeño en la esquina) */
.source-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #fff;
    border-radius: 50%;
    width: 32px !important;  /* Forzamos el ancho */
    height: 32px !important; /* Forzamos el alto */
    padding: 4px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 4;
}
.source-badge img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain;
}

.product-category-pill, .product-stock-pill { padding: 4px 8px; border-radius: 999px; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.product-category-pill { background: #f1f5f9; color: #111827; border: 1px solid #dbe3ef; }
.product-stock-pill { background: #eef7ff; color: #475569; border: 1px solid #dbeafe; }

.title.product-title { font-size: 13px; font-weight: 700; line-height: 1.2; color: #1f2937; margin-bottom: auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-card-mini .price { font-size: 1.1rem; font-weight: 800; color: #28a745; margin-top: 8px; }

.slide-out-left {
    animation: slideOutLeft 0.3s forwards cubic-bezier(0.4, 0.0, 0.2, 1);
}

.slide-in-right {
    animation: slideInRight 0.4s forwards cubic-bezier(0.4, 0.0, 0.2, 1);
}

@keyframes slideOutLeft {
    from { opacity: 1; transform: translateX(0); }
    to { opacity: 0; transform: translateX(-40px); }
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(40px); }
    to { opacity: 1; transform: translateX(0); }
}


.ai-welcome-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    flex-grow: 1; 
    min-height: 50vh;
}

.ai-avatar-container {
    position: relative;
    width: 320px;
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* CONTENEDOR DEL LOGO */
.ai-avatar-logo {
    width: 150px; 
    height: 150px;
    background: #ffffff;
    border-radius: 50%;
    z-index: 10;
   
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
   

    box-shadow: 0 10px 35px color-mix(in srgb, var(--aizu-gold) 20%, transparent);
    border: 1px solid color-mix(in srgb, var(--aizu-gold) 18%, transparent);
}

.ai-avatar-logo img {
    width: 180px; 
    height: 100px;
    object-fit: contain;
}

.corp-ring {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: 1;
}

.corp-ring.ring-track-1 {
    width: 185px;
    height: 185px;
    border: 1px solid color-mix(in srgb, var(--aizu-gold) 18%, transparent);
}

.corp-ring.ring-track-2 {
    width: 220px;
    height: 220px;
    border: 1px dashed color-mix(in srgb, var(--aizu-gold) 30%, transparent);
    animation: spin-corporate 30s linear infinite;
}

.corp-ring.ring-pulse-sharp {
    width: 150px;
    height: 150px;
    border: 1.5px solid color-mix(in srgb, var(--aizu-gold) 60%, transparent);
    animation: pulse-sharp 2.5s ease-out infinite;
}

@keyframes spin-corporate {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes pulse-sharp {
    0% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
    100% { transform: translate(-50%, -50%) scale(1.5); opacity: 0; }
}


.ai-avatar-container.muted .ring-pulse-sharp {
    display: none; 
}

.ai-avatar-container.muted .ring-track-1,
.ai-avatar-container.muted .ring-track-2 {
    border-color: rgba(108, 117, 125, 0.2);
}
/* BOTÓN DE MUTE */
.mute-btn {
    background: #ffffff;
    border: 1px solid #d2d2d7;
    color: #1d1d1f;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    font-size: 22px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.mute-btn:hover {
    background: #f5f5f7;
    transform: scale(1.05);
}

.step-content-wrapper {
    width: 100%;
    padding: 20px 0;
    justify-content: flex-start !important; 
    
    /* Quitamos el alto forzado para que la caja mida solo lo que necesita */
    flex-grow: 0 !important; 
    min-height: auto !important; 
    
    /* Esta es la magia: centra el contenido si hay poco, pero permite scroll si hay mucho */
    margin-top: auto !important;
    margin-bottom: auto !important;
}

/* Apagamos el truco anterior para que no estorbe */
.step-content-wrapper::before,
.step-content-wrapper::after {
    display: none !important;
}

.custom-checkbox-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    background: #ffffff;
    border: 2px solid #eaeaea;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    width: 100%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.02);
    margin: 0; /* Elimina márgenes de label por defecto */
}

/* Efecto al pasar el mouse */
.custom-checkbox-card:hover {
    border-color: #0071e3;
    background: #f8fbff;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0, 113, 227, 0.08);
}

/* Efecto Mágico: Cuando el input interno está marcado, se pinta toda la tarjeta */
.custom-checkbox-card:has(input:checked) {
    border-color: #0071e3;
    background: #f0f7ff;
    box-shadow: 0 4px 12px rgba(0, 113, 227, 0.12);
}

/* El Switch dentro de la tarjeta */
.custom-switch {
    width: 3em !important;
    height: 1.5em !important;
    cursor: pointer;
}

.custom-switch:checked {
    background-color: #0071e3;
    border-color: #0071e3;
}

.category-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.category-filter-chip {
    border: 1px solid #e5e5ea !important;
    background: #fff;
    color: #1d1d1f;
    border-radius: 999px;
    padding: 6px 12px;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.02);
    transition: all .2s ease;
}

/* Efecto hover estilo Mac */
.category-filter-chip:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
    border-color: #0071e3 !important;
}

/* AQUÍ ESTÁ LA MAGIA QUE ARREGLA EL TAMAÑO ENORME */
.category-filter-chip img {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 !important;
}

/* La burbujita con el número de stock/productos */
.category-filter-chip small {
    background: #f5f5f7;
    color: #86868b;
    border-radius: 999px;
    padding: 2px 7px;
    font-size: 11px;
    font-weight: 700;
}

/* Cuando la categoría está seleccionada */
.category-filter-chip.active {
    background: #0071e3;
    color: #fff;
    border-color: #0071e3 !important;
}

.category-filter-chip.active small {
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
}

.category-filter-chip:disabled {
    opacity: .5;
    cursor: not-allowed;
}

.history-source-item {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-top: 5px;
}

/* El círculo del logo */
.history-badge {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #ffffff;
    border: 1.5px solid rgba(0, 113, 227, 0.25); /* Borde sutil azul */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 113, 227, 0.12); /* Sombra difuminada */
    transition: all 0.2s ease;
}

.history-badge:hover {
    transform: scale(1.05);
    border-color: rgba(0, 113, 227, 0.5);
    box-shadow: 0 6px 16px rgba(0, 113, 227, 0.18);
}

/* La imagen dentro del círculo */
.history-badge img {
    width: 24px !important;
    height: 24px !important;
    object-fit: contain;
    margin: 0 !important;
}

/* Botón flotante de eliminar (X roja) */
.history-delete-btn {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: none;
    background: #ff3b30; /* Rojo vibrante de Apple */
    color: #ffffff;
    font-size: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(255, 59, 48, 0.4);
    cursor: pointer;
    opacity: 0; /* Oculto por defecto */
    transform: scale(0.8);
    transition: all 0.2s ease;
    z-index: 5;
}

/* Mostrar la tachita roja al hacer hover en todo el elemento */
.history-source-item:hover .history-delete-btn {
    opacity: 1;
    transform: scale(1);
}

/* Efecto al pasar el mouse directo en la tachita */
.history-delete-btn:hover {
    background: #d70015; /* Rojo más oscuro */
    transform: scale(1.15) !important;
}

/* =========================================
   TARJETAS DE OPCIONES (SELECCIÓN ÚNICA CON IMÁGENES)
========================================= */
.option-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 20px;
    width: 100%;
    max-width: 700px;
    margin-top: 20px;
}

.option-card {
    width: 190px;
    min-height: 120px;
    border: 1px solid #e5e5e5;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.2s ease;
    text-align: center;
    font-weight: 700;
    color: #1d1d1f;
}

.option-card:hover {
    border-color: #0071e3;
    box-shadow: 0 8px 20px rgba(0, 113, 227, 0.12);
    transform: translateY(-2px);
}

.option-card.selected {
    border-color: #0071e3;
    background: #eef7ff;
    box-shadow: 0 0 0 3px rgba(0, 113, 227, 0.12);
}

.option-card-img {
    width: 120px;
    height: 45px;
    object-fit: contain;
    display: flex;
    align-items: center;
    justify-content: center;
}

.option-card-img svg {
    width: 120px;
    height: auto;
    display: block;
}

.option-card-icon {
    font-size: 35px;
    color: #86868b;
    transition: color 0.2s ease;
}

.option-card:hover .option-card-icon,
.option-card.selected .option-card-icon {
    color: #0071e3;
}

.option-card span {
    font-weight: 700;
    color: #1d1d1f;
}


.product-card-mini {
    position: relative;
    padding-top: 58px;
}

.product-card-topbar {
    position: absolute;
    top: 16px;
    left: 18px;
    right: 18px;
    height: 38px;
    display: grid;
    grid-template-columns: 48px 1fr 48px;
    align-items: center;
    z-index: 5;
}

.product-card-topbar .card-switch-top-left {
    position: static !important;
    margin: 0;
}

.product-main-img {
    object-fit: contain;
}

.modal-edit-product .modal-content {
    border: 0;
    border-radius: 22px;
}

.modal-edit-product .modal-header,
.modal-edit-product .modal-footer {
    border-color: #f1f1f1;
}

.modal-edit-product .form-control {
    border-radius: 14px;
    min-height: 46px;
}

/* ==============================
   MODAL EDITAR PRODUCTO - FIX
============================== */

.modal-edit-product .modal-dialog {
    max-width: 860px;
}

.modal-edit-product .modal-content {
    max-height: 88vh;
}

.modal-edit-product .modal-body {
    overflow-y: auto;
}

.edit-product-img-box {
    width: 100%;
    height: 260px;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.edit-product-img-box img {
    width: 100%;
    height: 100%;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    display: block;
}

.modal-edit-product .btn {
    font-weight: 600;
}
.edit-product-img-click {
    cursor: pointer;
    transition: all 0.2s ease;
}

.edit-product-img-click:hover {
    border-color: #0d6efd;
    box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.08);
}

#panel_cambiar_imagen_producto .form-control {
    border-radius: 12px 0 0 12px;
}

#panel_cambiar_imagen_producto .input-group .btn {
    border-radius: 0 12px 12px 0;
}

/*EMPRESA*/

.empresa-review-card {
    background: #fff;
    border-radius: 26px;
    padding: 32px;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.06);
    border: 1px solid #edf0f4;
    max-width: 980px;
    margin: 0 auto;
}

.empresa-hero-simple {
    display: flex;
    align-items: center;
    gap: 28px;
    padding: 26px;
    border-radius: 24px;
    background: linear-gradient(135deg, #f8fbff 0%, #ffffff 100%);
    border: 1px solid #e8edf3;
}

.empresa-logo-edit {
    width: 190px;
    height: 190px;
    min-width: 190px;
    border-radius: 24px;
    background: #f5f5f7;
    border: 1px solid #dde2e8;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.empresa-logo-edit img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 10px;
}

.empresa-logo-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -46px;
    height: 46px;
    background: rgba(0, 0, 0, 0.62);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    transition: all 0.2s ease;
}

.empresa-logo-edit:hover .empresa-logo-overlay {
    bottom: 0;
}

.empresa-hero-info-simple {
    flex: 1;
    min-width: 0;
}

.empresa-hero-info-simple h3 {
    font-size: 2rem;
    line-height: 1.15;
}

.empresa-form-section .form-label {
    font-size: 14px;
    color: #343a40;
    margin-bottom: 6px;
}

.empresa-review-card .form-control {
    border-radius: 16px;
    border: 1px solid #dde2e8;
    min-height: 50px;
    font-size: 15px;
}

.empresa-review-card .form-control:focus {
    border-color: #0d6efd;
    box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.08);
}

.empresa-color-input {
    width: 100% !important;
    height: 50px !important;
    padding: 6px !important;
    border-radius: 16px !important;
}

@media (max-width: 768px) {
    .empresa-hero-simple {
        flex-direction: column;
        text-align: center;
    }

    .empresa-logo-edit {
        width: 160px;
        height: 160px;
        min-width: 160px;
    }

    .empresa-hero-info-simple h3 {
        font-size: 1.6rem;
    }
}

.empresa-logo-modal-preview {
    width: 190px;
    height: 190px;
    border-radius: 26px;
    background: #f5f5f7;
    border: 1px solid #dde2e8;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.empresa-logo-modal-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 10px;
}

.empresa-logo-drop-zone {
    border: 2px dashed #ced4da;
    background: #f8f9fa;
    border-radius: 20px;
    padding: 28px;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.empresa-logo-drop-zone:hover,
.empresa-logo-drop-zone.is-dragover {
    border-color: #0d6efd;
    background: #f3f8ff;
}

.empresa-logo-drop-zone i {
    font-size: 36px;
    color: #0d6efd;
}

.product-meta-row {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
}

.item-type-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    text-transform: uppercase;
}

.item-type-product {
    background: #eef5ff;
    color: #0b5cad;
    border: 1px solid #d6e8ff;
}

.item-type-service {
    background: #f3efff;
    color: #5b35b1;
    border: 1px solid #e2d8ff;
}

.product-card-mini .product-main-img {
    width: 100%;
    height: 130px;
    object-fit: contain;
    margin-bottom: 12px;
    border-radius: 8px;
}

.clientes-config-wrap {
    width: 100%;
    max-width: 980px;
}

.clientes-tabs {
    background: #f6f6f6;
    border-radius: 16px;
    padding: 6px;
    font-size: 0.92rem;
}

.clientes-tabs .nav-link {
    color: #6e6e73;
    border-radius: 999px;
    padding: 12px 16px;
}

.clientes-tabs .nav-link.active {
    background: #1d1d1f;
    color: #fff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.14);
}

.clientes-options-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.clientes-option-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border: 1px solid #e5e5ea;
    border-radius: 20px;
    background: #fff;
    cursor: pointer;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.04);
}

.clientes-option-switch strong {
    display: block;
    color: #1d1d1f;
    font-size: 0.98rem;
    margin-bottom: 3px;
}

.clientes-option-switch span {
    display: block;
    color: #6e6e73;
    font-size: 0.82rem;
    line-height: 1.35;
}

.clientes-preview-container {
    background: #fff;
    border: 1px solid #e5e5ea;
    border-radius: 22px;
    padding: 18px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.05);
}

.clientes-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.clientes-count-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0 14px;
    border-radius: 999px;
    background: #f5f5f7;
    color: #1d1d1f;
    font-size: 0.82rem;
    font-weight: 700;
}

.clientes-preview-table thead th {
    font-size: 0.76rem;
    color: #86868b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid #e5e5ea;
    white-space: nowrap;
}

.clientes-preview-table td {
    border-bottom: 1px solid #f0f0f2;
    vertical-align: middle;
}

.cliente-input {
    min-width: 130px;
    border-radius: 12px;
    border-color: #e5e5ea;
    font-size: 0.86rem;
}

@media (max-width: 768px) {
    .clientes-tabs {
        font-size: 0.8rem;
    }

    .clientes-tabs .nav-link {
        padding: 10px 8px;
    }

    .clientes-preview-container {
        padding: 14px;
    }
}

.proveedores-config-wrap {
    width: 100%;
    max-width: 980px;
}

.proveedor-option-badge-static {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 0 14px;
    border-radius: 999px;
    background: #0071e3;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
}

.proveedores-info-box {
    padding: 14px 18px;
    border-radius: 18px;
    background: #f5f5f7;
    color: #6e6e73;
    font-size: 0.86rem;
    text-align: left;
}

.bank-config-wrap {
    width: 100%;
    max-width: 900px;
}

.bank-hero-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 24px;
    border-radius: 28px;
    background: linear-gradient(135deg, #ffffff 0%, #f7f9fc 100%);
    border: 1px solid #e5e5ea;
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.06);
    text-align: left;
}

.bank-hero-left {
    display: flex;
    align-items: center;
    gap: 18px;
}

.bank-icon-vault {
    width: 62px;
    height: 62px;
    min-width: 62px;
    border-radius: 22px;
    background: #1d1d1f;
    color: #c49a32;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.18);
}

.bank-security-pill {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    padding: 10px 16px;
    border-radius: 999px;
    background: #ecfdf3;
    color: #137333;
    font-weight: 800;
    font-size: 0.84rem;
}

.bank-info-strip {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    margin-top: 16px;
}

.bank-info-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-radius: 18px;
    background: #f5f5f7;
    color: #555;
    font-size: 0.88rem;
    font-weight: 600;
    text-align: left;
}

.bank-info-item i {
    color: #0071e3;
}

.bank-form-card {
    margin-top: 18px;
    padding: 24px;
    border-radius: 28px;
    background: #fff;
    border: 1px solid #e5e5ea;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.06);
    text-align: left;
}

.bank-form-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.bank-status-dot {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #f5f5f7;
    color: #555;
    font-size: 0.8rem;
    font-weight: 800;
}

.bank-status-dot span {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #34c759;
}

.bank-input-wrap {
    position: relative;
}

.bank-input-wrap i {
    position: absolute;
    top: 50%;
    left: 16px;
    transform: translateY(-50%);
    color: #86868b;
    z-index: 3;
}

.bank-input {
    min-height: 54px;
    border-radius: 18px;
    border: 1px solid #dedee3;
    padding-left: 46px;
    font-size: 1rem;
    background-color: #fff;
}

.bank-input:focus {
    border-color: #c49a32;
    box-shadow: 0 0 0 0.2rem rgba(196, 154, 50, 0.14);
}

/* RESUMEN DE CUENTA BANCARIA */
.bank-preview-panel {
    width: 100%;
    padding: 18px;
    border: 1px solid #dbe3ef;
    border-radius: 22px;
    background: linear-gradient(
        180deg,
        #f8fbff 0%,
        #f3f7fc 100%
    );
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06);
}

.bank-preview-toggle {
    width: 100%;
    min-height: 52px;
    padding: 0;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #1d1d1f;
}

.bank-preview-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 14px;
    background-color: #e7f1ff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.bank-preview-toggle-title {
    color: #1f2937;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.bank-preview-toggle-subtitle {
    display: block;
    margin-top: 3px;
    color: #6c757d;
    font-size: 12px;
    font-weight: 400;
}

.bank-preview-chevron {
    color: #6c757d;
    font-size: 13px;
    transition: transform 0.2s ease;
}

.bank-preview-toggle:not(.collapsed) .bank-preview-chevron {
    transform: rotate(180deg);
}

.bank-preview-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.bank-preview-item {
    min-width: 0;
    min-height: 82px;
    padding: 15px;
    border: 1px solid #e5eaf1;
    border-radius: 16px;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    gap: 12px;
}

.bank-preview-item-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 12px;
    background-color: #f1f5f9;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.bank-preview-item-info {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.bank-preview-item small {
    margin-bottom: 4px;
    color: #7b8491;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1;
    text-transform: uppercase;
}

.bank-preview-item strong {
    width: 100%;
    color: #212529;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bank-preview-grid div {
    padding: 14px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.08);
}


.bank-preview-panel .bank-preview-toggle-title {
    color: #212529 !important;
}

.bank-preview-panel .bank-preview-item small {
    color: #6c757d !important;
}

.bank-preview-panel .bank-preview-item strong {
    color: #212529 !important;
}

@media (max-width: 768px) {
    .bank-hero-panel {
        align-items: flex-start;
        flex-direction: column;
    }

    .bank-info-strip,
    .bank-preview-grid {
        grid-template-columns: 1fr;
    }
}

.creditos-config-wrap {
    width: 100%;
    max-width: 900px;
}

.creditos-hero-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px;
    border-radius: 28px;
    background: linear-gradient(135deg, #ffffff 0%, #f7f9fc 100%);
    border: 1px solid #e5e5ea;
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.06);
    text-align: left;
}

.creditos-hero-icon {
    width: 62px;
    height: 62px;
    min-width: 62px;
    border-radius: 22px;
    background: #1d1d1f;
    color: #c49a32;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
}

.creditos-options-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}

.credito-option-card {
    position: relative;
    min-height: 210px;
    padding: 24px;
    border: 1px solid #e5e5ea;
    border-radius: 28px;
    background: #fff;
    text-align: left;
    cursor: pointer;
    transition: all 0.18s ease;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.05);
}

.credito-option-card:hover {
    transform: translateY(-2px);
    border-color: #0071e3;
    box-shadow: 0 20px 48px rgba(0, 113, 227, 0.12);
}

.credito-option-card.selected {
    border-color: #0071e3;
    background: #eef6ff;
    box-shadow: 0 0 0 4px rgba(0, 113, 227, 0.12);
}

.credito-option-primary {
    background: linear-gradient(180deg, #ffffff 0%, #f6fbff 100%);
}

.credito-option-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    background: #f5f5f7;
    color: #0071e3;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    margin-bottom: 16px;
}

.credito-option-card h5 {
    font-size: 1.05rem;
    font-weight: 800;
    color: #1d1d1f;
    margin-bottom: 8px;
}

.credito-option-card p {
    font-size: 0.88rem;
    color: #6e6e73;
    line-height: 1.45;
    margin-bottom: 0;
}

.credito-option-badge {
    position: absolute;
    top: 18px;
    right: 18px;
    background: #0071e3;
    color: #fff;
    border-radius: 999px;
    padding: 5px 11px;
    font-size: 0.72rem;
    font-weight: 800;
}

@media (max-width: 768px) {
    .creditos-options-grid,
    .creditos-preview-grid {
        grid-template-columns: 1fr;
    }

    .creditos-hero-card {
        flex-direction: column;
        align-items: flex-start;
    }
}

.credito-custom-card {
    margin-top: 16px;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 22px;
    padding: 20px 22px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
    transition: all 0.22s ease;
}

.credito-custom-card:focus-within,
.credito-custom-card.active {
    border-color: #0071e3;
    background: #eef6ff;
    box-shadow: 0 0 0 4px rgba(0, 113, 227, 0.10);
}

.credito-custom-main {
    display: grid;
    grid-template-columns: 54px 1fr 260px;
    align-items: center;
    gap: 18px;
}

.credito-custom-icon {
    width: 54px;
    height: 54px;
    min-width: 54px;
    border-radius: 18px;
    background: #1d1d1f;
    color: #c49a32;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.credito-custom-copy h5 {
    margin: 0 0 3px 0;
    font-size: 1.1rem;
    font-weight: 800;
    color: #1d1d1f;
}

.credito-custom-copy p {
    margin: 0;
    font-size: 0.9rem;
    color: #6e6e73;
    line-height: 1.35;
}

.credito-custom-input-group {
    display: flex;
    align-items: stretch;
    border: 1.5px solid #dbe3ef;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
}

.credito-otro-input {
    border: 0 !important;
    box-shadow: none !important;
    font-size: 1rem;
    font-weight: 700;
    padding: 13px 15px;
    height: auto;
}

.credito-custom-suffix {
    min-width: 72px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f7;
    border-left: 1px solid #e5e7eb;
    font-weight: 800;
    color: #3a3a3c;
}

@media (max-width: 768px) {
    .credito-custom-main {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .credito-custom-input-group {
        width: 100%;
    }
}

.loan-section-title {
    width: 100%;
    max-width: 780px;
    margin: 18px auto 12px;
    padding: 18px 20px;
    border-radius: 22px;
    background: #1d1d1f;
    color: #fff;
    text-align: left;
    box-shadow: 0 18px 42px rgba(0,0,0,0.12);
}

.loan-section-title h5 {
    margin: 0 0 4px;
    font-size: 1.05rem;
    font-weight: 800;
    color: #fff;
}

.loan-section-title p {
    margin: 0;
    font-size: 0.9rem;
    color: rgba(255,255,255,0.65);
}

.loan-preview-card {
    width: 100%;
    max-width: 780px;
    margin: 18px auto 0;
    padding: 20px;
    border-radius: 24px;
    background: linear-gradient(135deg, #ffffff 0%, #f7f9fc 100%);
    border: 1px solid #e5e5ea;
    box-shadow: 0 16px 38px rgba(0,0,0,0.06);
    text-align: left;
}

.loan-preview-label {
    color: #c49a32;
    font-weight: 800;
    margin-bottom: 8px;
}

.loan-preview-value {
    font-size: 1.05rem;
    font-weight: 800;
    color: #1d1d1f;
    line-height: 1.4;
}

.loan-financing-form {
    max-width: 930px;
    margin: 30px auto 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
    align-items: flex-start;
    row-gap: 20px;
}

.loan-field-col {
    margin-bottom: 0 !important;
}

.loan-field-col label,
.loan-field-col small,
.loan-field-label {
    display: block;
    margin-bottom: 8px;
    color: #4f5358 !important;
    font-size: 0.98rem !important;
    font-weight: 800;
}
/* ==============================
   FIX FINAL - FORM FINANCIAMIENTO
============================== */

.loan-financing-form {
    max-width: 860px !important;
    margin: 18px auto 0 !important;
    row-gap: 18px !important;
    column-gap: 0 !important;
}

.loan-field-col {
    margin-bottom: 4px !important;
}

.loan-field-col label,
.loan-field-col small,
.loan-field-label {
    margin-bottom: 6px !important;
    font-size: 0.9rem !important;
    font-weight: 800 !important;
}

/* Inputs normales más compactos */
.loan-financing-form .form-control,
.loan-financing-form .form-select,
.loan-financing-form select {
    min-height: 46px !important;
    height: 46px !important;
    border-radius: 15px !important;
    font-size: 0.96rem !important;
    padding: 9px 14px !important;
}

/* FIX IMPORTANTE: evita que el % se baje */
.loan-financing-form .loan-input-group,
.loan-amort-content .loan-input-group {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    width: 100% !important;
}

.loan-financing-form .loan-input-group > .form-control,
.loan-amort-content .loan-input-group > .form-control {
    width: 1% !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.loan-financing-form .loan-input-group > .input-group-text,
.loan-amort-content .loan-input-group > .input-group-text {
    width: 54px !important;
    min-width: 54px !important;
    flex: 0 0 54px !important;
    height: 46px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0 15px 15px 0 !important;
    border: 1.5px solid #dfe3ea !important;
    border-left: 0 !important;
    background: #fff !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

/* Select más limpio */
.loan-financing-form select,
.loan-financing-form .form-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
}

/* Amortización más compacta */
.loan-amortization-wrap {
    margin-top: 4px !important;
}

.loan-amort-tabs {
    margin-top: 6px !important;
    padding: 6px !important;
}

.loan-amort-tabs .nav-link {
    padding: 10px 14px !important;
    font-size: 0.94rem !important;
}

.loan-amort-content {
    min-height: 128px !important;
    padding-top: 14px !important;
}

.loan-amort-content p {
    font-size: 0.94rem !important;
    line-height: 1.45 !important;
    margin-bottom: 12px !important;
}

.loan-amort-content .form-control {
    min-height: 46px !important;
    height: 46px !important;
}

/* Más separación vertical entre filas, sin verse tan gigante */
.loan-financing-form .col-md-6,
.loan-financing-form .col-md-12 {
    padding-left: 14px !important;
    padding-right: 14px !important;
}

/* Que el bloque no quede tan pegado al título */
.wizard-body .loan-financing-form {
    padding-top: 6px !important;
}

/* ==============================
   FINAL CONFIG BÁSICA
============================== */


.finish-progress-row + .finish-progress-row {
    margin-top: 16px;
}

.finish-progress-empty {
    width: 0%;
}

@media (max-width: 768px) {

    .finish-hero-card h3 {
        font-size: 1.55rem;
    }

    .finish-action-card {
        min-height: 170px;
    }
}

.finish-actions-compact{
    margin-top: 22px;
    padding: 18px 20px 10px;
    border-radius: 22px;
    border: 1px solid #e7eaf0;
    background: #fff;
    text-align: center;
}

.finish-actions-label{
    font-size: 1rem;
    font-weight: 700;
    color: #202124;
    margin-bottom: 14px;
}

.finish-actions-buttons{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.finish-btn{
    min-width: 260px;
    height: 54px;
    border-radius: 999px;
    border: 1px solid #d9dee7;
    font-size: 1rem;
    font-weight: 700;
    padding: 0 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all .2s ease;
    cursor: pointer;
    background: #fff;
    color: #202124;
}

.finish-btn i{
    font-size: .95rem;
}

.finish-btn:hover{
    transform: translateY(-1px);
}

.finish-btn-secondary{
    background: #fff;
    color: #202124;
    border: 1px solid #d8dde6;
}

.finish-btn-secondary:hover{
    background: #f6f8fb;
    border-color: #cfd6e2;
}

.finish-btn-primary{
    background: #1677ff;
    color: #fff;
    border: 1px solid #1677ff;
    box-shadow: 0 10px 24px rgba(22,119,255,.16);
}

.finish-btn-primary:hover{
    background: #0f6ae6;
    border-color: #0f6ae6;
    box-shadow: 0 12px 28px rgba(22,119,255,.20);
}

.finish-actions-help{
    margin-top: 12px;
    font-size: .92rem;
    color: #6b7280;
}

@media (max-width: 768px){
    .finish-actions-buttons{
        flex-direction: column;
    }

    .finish-btn{
        width: 100%;
        min-width: unset;
    }
}

.finish-config-wrap{
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    padding: 10px 0 0;
}

.finish-hero-card{
    background: #f8fafc;
    border: 1px solid #e6eaf0;
    border-radius: 32px;
    padding: 34px 28px 28px;
    text-align: center;
    margin-bottom: 22px;
}

.finish-check-ring{
    width: 96px;
    height: 96px;
    border-radius: 50%;
    background: rgba(22,119,255,.10);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
}

.finish-check-icon{
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background:var(--aizu-success);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.9rem;
    box-shadow: 0 12px 28px rgba(22,119,255,.20);
}

.finish-hero-card h3{
    font-size: 2.1rem;
    font-weight: 800;
    color: #18181b;
    margin-bottom: 10px;
}

.finish-hero-card p{
    max-width: 760px;
    margin: 0 auto;
    font-size: 1.08rem;
    line-height: 1.55;
    color: #666b75;
}

.finish-progress-card{
    background: #fff;
    border: 1px solid #e6eaf0;
    border-radius: 28px;
    padding: 22px 28px 18px;
    margin-bottom: 14px;
}

.finish-progress-row{
    margin-bottom: 14px;
}

.finish-progress-row:last-child{
    margin-bottom: 0;
}

.finish-progress-top{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.finish-progress-top strong{
    font-size: 1rem;
    font-weight: 800;
    color: #18181b;
}

.finish-progress-top span{
    font-size: .96rem;
    font-weight: 700;
    color: #6b7280;
}

.finish-progress-track{
    width: 100%;
    height: 12px;
    border-radius: 999px;
    background: #e9edf2;
    overflow: hidden;
}

.finish-progress-fill{
    height: 100%;
    border-radius: 999px;
    background: #191a1f;
}

.finish-progress-full{
    width: 100%;
}

.finish-progress-mid{
    width: 28%;
}

.finish-progress-empty{
    width: 0%;
}

.finish-inline-note{
    text-align: center;
    font-size: .98rem;
    color: #6b7280;
    margin: 6px 0 0;
}

/* FOOTER ACTIONS */
.finish-footer-actions{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.finish-footer-btn{
    height: 50px;
    min-width: 210px;
    padding: 0 20px;
    border-radius: 999px;
    border: 1px solid #d7dde7;
    font-size: 1rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: all .2s ease;
    text-decoration: none;
}

.finish-footer-btn:hover{
    transform: translateY(-1px);
}

.finish-footer-btn-secondary{
    background: #fff;
    color: #202124;
}

.finish-footer-btn-secondary:hover{
    background: #f8fafc;
}

.finish-footer-btn-primary{
    background: #1677ff;
    color: #fff;
    border-color: #1677ff;
    box-shadow: 0 10px 24px rgba(22,119,255,.18);
}

.finish-footer-btn-primary:hover{
    background: #0f6ae6;
    border-color: #0f6ae6;
}

@media (max-width: 768px){
    .finish-config-wrap{
        padding-top: 0;
    }

    .finish-hero-card{
        padding: 26px 18px 22px;
        border-radius: 26px;
    }

    .finish-check-ring{
        width: 84px;
        height: 84px;
        margin-bottom: 16px;
    }

    .finish-check-icon{
        width: 56px;
        height: 56px;
        font-size: 1.6rem;
    }

    .finish-hero-card h3{
        font-size: 1.55rem;
        line-height: 1.15;
    }

    .finish-hero-card p{
        font-size: 1rem;
        line-height: 1.5;
    }

    .finish-progress-card{
        padding: 18px 18px 14px;
        border-radius: 24px;
    }

    .finish-footer-actions{
        width: 100%;
        justify-content: stretch;
        flex-direction: column-reverse;
        gap: 10px;
    }

    .finish-footer-btn{
        width: 100%;
        min-width: unset;
    }
}

.terminales-mini-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.terminal-mini-card {
    border: 1px solid #e2e5ec;
    background: #fff;
    border-radius: 22px;
    min-height: 118px;
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: all .18s ease;
}

.terminal-mini-card:hover {
    transform: translateY(-2px);
    border-color: #0071e3;
    box-shadow: 0 12px 28px rgba(0, 113, 227, .12);
}

.terminal-mini-card.selected {
    border-color: #0071e3;
    background: #f4f9ff;
}

.terminal-mini-card img {
    max-width: 74px;
    max-height: 42px;
    object-fit: contain;
}

.terminal-mini-card strong {
    font-size: 14px;
    color: #1d1d1f;
}

.terminales-otra-wrap {
    display: flex;
    gap: 12px;
}

.terminales-otra-wrap .form-control {
    height: 52px;
    border-radius: 999px;
    text-align: center;
}

.comision-terminal-name small {
    display: block;
    color: #8b909b;
    font-size: 12px;
}

@media (max-width: 768px) {
    .terminales-mini-grid {
        grid-template-columns: 1fr;
    }

    .terminales-otra-wrap {
        flex-direction: column;
    }
}

.terminales-config-wrap {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
}

#modulo-terminales-comisiones .clientes-preview-container {
    width: 100%;
    max-width: 1120px;
}

#comisiones-terminales-container {
    max-width: 1120px !important;
}

#comisiones-terminales-container .table-responsive {
    overflow-x: auto;
}


.td-switch-comision {
    width: 70px;
}


.td-porcentaje-comision {
    width: 130px;
}

.td-iva-comision {
    width: 90px;
}

.td-delete-comision {
    width: 70px;
}



.comision-percent-pill,
.comision-iva-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    background: #f3f4f7;
    font-weight: 800;
}

.comision-iva-pill.has-iva {
    background: #fff4dd;
    color: #9b6a00;
}

.terminales-config-wrap {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
}

#modulo-terminales-comisiones > .clientes-preview-container:first-child {
    max-width: 880px;
    margin-left: auto;
    margin-right: auto;
}

#comisiones-terminales-container {
    width: 100%;
    max-width: 1180px !important;
}

.terminales-mini-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.terminal-mini-card {
    position: relative;
    min-height: 108px;
    padding: 14px 12px;
}

.terminal-mini-card img {
    max-width: 68px;
    max-height: 36px;
    object-fit: contain;
}

.terminal-mini-card strong {
    font-size: 13px;
}

.terminal-mini-card small {
    color: #8b909b;
    font-size: 11px;
    font-weight: 700;
}

.terminal-mini-card.selected {
    border-color: #0071e3;
    background: #f4f9ff;
    box-shadow: 0 12px 28px rgba(0, 113, 227, .12);
}

.terminal-mini-card.terminal-card-added {
    opacity: .58;
    cursor: not-allowed;
    background: #f7f8fb;
}

.terminal-card-switch {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
}

.td-switch-comision {
    width: 70px;
}

.td-terminal-comision {
    width: 260px;
}

.td-delete-comision {
    width: 70px;
}


/* ==============================
   TERMINALES - TABLA COMPACTA
============================== */

.td-terminal-comision {
    width: 105px !important;
}

.td-nombre-comision {
    width: auto !important;
}

.comision-terminal-compact {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.comision-terminal-logo {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border: 1px solid #e5e7ee;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    margin: 0;
}

.comision-terminal-logo img {
    max-width: 42px;
    max-height: 34px;
    object-fit: contain;
}

.comision-terminal-logo-generic {
    width: 74px;
    height: 58px;
    flex: 0 0 74px;
    flex-direction: column;
    gap: 3px;
    padding: 5px;
}

.comision-terminal-logo-generic i {
    font-size: 18px;
}

.comision-terminal-logo-generic small {
    display: block;
    max-width: 64px;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.1;
    color: #6e6e73;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

#comisiones-terminales-container table {
    min-width: 760px;
}

.comision-name-full {
    font-size: 1rem;
    font-weight: 800;
    color: #1d1d1f;
    line-height: 1.35;
    white-space: normal;
    word-break: normal;
}

/* ==============================
   PERFILES DE TRABAJADORES
============================== */

.worker-roles-wrap {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #e1e4eb;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 18px 45px rgba(20, 24, 35, 0.05);
}

.worker-roles-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.worker-roles-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.worker-role-card {
    min-height: 120px;
    border: 1px solid #e2e5ec;
    background: #fff;
    border-radius: 22px;
    padding: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    cursor: pointer;
    transition: all .18s ease;
}

.worker-role-card:hover {
    transform: translateY(-2px);
    border-color: #0071e3;
    box-shadow: 0 12px 28px rgba(0, 113, 227, .12);
}

.worker-role-card.selected {
    border-color: #d9dde7;
    background: #fafbfc;
    box-shadow: 0 10px 24px rgba(20, 24, 35, 0.06);
}

.worker-role-main {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

.worker-role-icon {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 17px;
    background: #f7f8fb;
    border: 1px solid #e6e8ee;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
}

.worker-role-copy {
    min-width: 0;
}

.worker-role-copy strong {
    display: block;
    font-size: 15px;
    font-weight: 900;
    color: #1d1d1f;
    line-height: 1.2;
}

.worker-role-copy small {
    display: block;
    color: #8b909b;
    font-size: 12px;
    margin-top: 4px;
    font-weight: 700;
}

.worker-role-card .form-switch {
    flex: 0 0 auto;
}

@media (max-width: 991px) {
    .worker-roles-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .worker-roles-grid {
        grid-template-columns: 1fr;
    }

    .worker-roles-head {
        flex-direction: column;
    }
}

.sucursales-copy-panel,
.sucursales-main-panel {
    border: 1px solid #e7e9ee !important;
}

.sucursales-panel-icon {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #1d1d1f;
    color: #ffc107;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    flex-shrink: 0;
}

.sucursales-copy-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.compact-copy-card {
    min-height: 70px;
    border: 1px solid #e7e9ee;
    border-radius: 22px;
    background: #fff;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    cursor: pointer;
    transition: all 0.22s ease;
}

.compact-copy-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(17, 24, 39, 0.06);
}

.compact-copy-card.selected {
    background: #fffdf8;
    border-color: #e7e9ee;
}

.compact-copy-card:not(.selected) {
    opacity: 0.55;
    background: #fafafa;
}

.compact-copy-left {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

.compact-copy-left strong {
    font-size: 15px;
    line-height: 1.15;
    color: #1d1d1f;
}

.compact-copy-icon {
    width: 42px;
    height: 42px;
    border-radius: 15px;
    background: #f7f8fb;
    border: 1px solid #e8ebf1;
    color: #4b5563;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sucursales-branch-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.sucursales-matriz-pill {
    border: 1px solid #e7e9ee;
    background: #f8fafc;
    color: #374151;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.sucursales-branch-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.sucursal-branch-card {
    border: 1px solid #e7e9ee;
    border-radius: 26px;
    background: linear-gradient(180deg, #ffffff 0%, #fcfcfd 100%);
    padding: 20px;
    transition: all 0.22s ease;
    position: relative;
    overflow: hidden;
}

.sucursal-branch-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 24px;
    width: 4px;
    height: 46px;
    background: #ffc107;
    border-radius: 0 999px 999px 0;
    opacity: 0.9;
}

.sucursal-branch-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(20, 32, 61, 0.08);
}

.sucursal-branch-top {
    display: flex;
    align-items: center;
    gap: 14px;
}

.sucursal-branch-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #1d1d1f;
    color: #ffc107;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sucursal-branch-card .form-control {
    border-radius: 18px;
    min-height: 48px;
}

@media (max-width: 991px) {
    .sucursales-branch-grid {
        grid-template-columns: 1fr;
    }

    .sucursales-branch-header {
        flex-direction: column;
        align-items: flex-start;
    }
}

.sucursal-flow-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(240px, 1fr));
    gap: 14px 18px;
    align-items: start;
    margin-top: 18px;
}

.sucursal-layout-1 {
    grid-template-columns: minmax(260px, 430px);
    justify-content: center;
}

.sucursal-layout-2 {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
}

.sucursal-layout-3 {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
}

.sucursal-layout-3 .sucursal-flow-card:nth-child(3) {
    grid-column: 1 / -1;
    width: calc(50% - 9px);
    justify-self: center;
}

.sucursal-layout-4 {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
}

.sucursal-layout-5 {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
}

.sucursal-layout-5 .sucursal-flow-card:nth-child(5) {
    grid-column: 1 / -1;
    width: calc(50% - 9px);
    justify-self: center;
}

.sucursal-flow-card {
    background: #fff;
    border: 1px solid #e7e9ee;
    border-radius: 22px;
    padding: 14px 16px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
    transition: all 0.22s ease;
}

.sucursal-flow-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.065);
}

.sucursal-flow-status {
    font-size: 12px;
    font-weight: 700;
    color: #98a2b3;
}

.sucursal-flow-main {
    display: flex;
    align-items: center;
    gap: 13px;
}

.sucursal-flow-body {
    flex: 1;
    min-width: 0;
}

.sucursal-flow-body strong {
    display: block;
    font-size: 16px;
    line-height: 1.1;
    color: #1d1d1f;
    margin-bottom: 5px;
}

.sucursal-flow-label {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: #8b95a5;
    margin-bottom: 5px;
}

.sucursal-flow-body .form-control {
    height: 40px;
    border-radius: 14px;
    font-size: 14px;
    padding: 8px 13px;
}

.sucursales-panel-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    background: #f3f4f6;
    color: #c49a2c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.copy-module-card,
.compact-copy-card {
    min-height: 62px;
    border: 1px solid #e7e9ee;
    border-radius: 18px;
    background: #fff;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    transition: all 0.22s ease;
}

.copy-module-card:hover,
.compact-copy-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.045);
}

.copy-module-card.is-on,
.compact-copy-card.selected {
    border-color: #e7e9ee;
}

.copy-module-card:not(.is-on),
.compact-copy-card:not(.selected) {
    opacity: 0.55;
    background: #fafafa;
}

.copy-module-icon,
.compact-copy-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 13px;
    background: #f3f4f6;
    border: 1px solid #e7e9ee;
    color: #667085;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
}

.copy-module-title,
.compact-copy-left strong {
    font-size: 14px;
    font-weight: 800;
    color: #1f2937;
    line-height: 1.15;
}

.compact-copy-left {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

/* Responsive */
@media (max-width: 991px) {
    .sucursal-flow-grid,
    .sucursal-layout-1,
    .sucursal-layout-2,
    .sucursal-layout-3,
    .sucursal-layout-4,
    .sucursal-layout-5 {
        grid-template-columns: 1fr;
    }

    .sucursal-layout-3 .sucursal-flow-card:nth-child(3),
    .sucursal-layout-5 .sucursal-flow-card:nth-child(5) {
        width: 100%;
        grid-column: auto;
    }
}

.sucursal-flow-card {
    background: #fff;
    border: 1px solid #e7e9ee;
    border-radius: 22px;
    padding: 14px 16px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
    transition: all 0.22s ease;
}

.sucursal-flow-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.065);
}

.sucursal-flow-main {
    display: flex;
    align-items: center;
    gap: 14px;
}


.sucursal-flow-body {
    flex: 1;
    min-width: 0;
}

.sucursal-flow-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
}

.sucursal-flow-label {
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: #8b95a5;
    margin: 0;
}

.sucursal-flow-status {
    font-size: 12px;
    font-weight: 800;
    color: #98a2b3;
    background: #f8fafc;
    border: 1px solid #e7e9ee;
    border-radius: 999px;
    padding: 3px 9px;
    white-space: nowrap;
}

.sucursal-flow-body .form-control {
    height: 40px;
    border-radius: 14px;
    font-size: 14px;
    padding: 8px 13px;
}

.sucursal-flow-card {
    background: #fff;
    border: 1px solid #e7e9ee;
    border-radius: 22px;
    padding: 14px 16px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.035);
    transition: all 0.22s ease;
}

.sucursal-flow-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.065);
}

.sucursal-flow-main {
    display: flex;
    align-items: center;
    gap: 14px;
}

.sucursal-flow-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 14px;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.sucursal-flow-body {
    flex: 1;
    min-width: 0;
}

.sucursal-flow-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 6px;
}

.sucursal-flow-label {
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: #8b95a5;
    margin: 0;
}

.sucursal-flow-status {
    font-size: 12px;
    font-weight: 800;
    color: #98a2b3;
    background: #f8fafc;
    border: 1px solid #e7e9ee;
    border-radius: 999px;
    padding: 3px 9px;
    white-space: nowrap;
}

.sucursal-flow-body .form-control {
    height: 40px;
    border-radius: 14px;
    font-size: 14px;
    padding: 8px 13px;
}

.apps-step-wrap {
    width: 100%;
    max-width: 1200px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.apps-categories-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

.tools-category-card {
    border: 1px solid #e7e9ee;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.035);
    overflow: hidden;
}

.apps-category-left {
    display: flex;
    gap: 13px;
    min-width: 0;
}

.apps-category-icon {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 15px;
    background: #f6f8fc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.apps-category-body h4 {
    margin: 0 0 2px;
    font-size: 20px;
    font-weight: 850;
    color: #1d1d1f;
}

.apps-category-body p {
    margin: 0;
    color: #6b7280;
    font-size: 13px;
    line-height: 1.35;
}

.apps-category-ready {
    font-size: 11px;
    font-weight: 850;
    color: #9a6a00;
    background: #fff3d1;
    border: 1px solid #ead9ad;
    border-radius: 999px;
    padding: 4px 9px;
    white-space: nowrap;
}

.apps-category-chevron {
    width: 30px;
    height: 30px;
    border: none;
    background: #f5f6f8;
    color: #7b8492;
    border-radius: 999px;
}

.apps-mini-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.app-card-logo {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 14px;
    background: #f3f4f6;
    border: 1px solid #e7e9ee;
    color: #20242c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.app-card-info {
    min-width: 0;
    flex: 1;
}

.app-card-top {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 6px;
}

.app-card-top h4 {
    margin: 0;
    font-size: 15px;
    font-weight: 850;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 850;
    flex-shrink: 0;
}

.app-badge-available {
    background: #eef7ee;
    color: #2f7d32;
}

.app-badge-detected {
    background: #fff3d1;
    color: #9a6a00;
}

.app-badge-soon {
    background: #f1f2f4;
    color: #8a93a3;
}

.app-connect-preview {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.app-connect-data {
    min-width: 0;
}

.app-connect-data small {
    display: block;
    font-size: 10px;
    font-weight: 850;
    color: #9a6a00;
    line-height: 1.1;
}

.app-connect-data strong {
    display: block;
    max-width: 240px;
    font-size: 13px;
    font-weight: 850;
    color: #1f2937;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-connect-empty {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #8a93a3;
    font-size: 12px;
    font-weight: 700;
}

.app-connect-empty i {
    color: #9ca3af;
}

.app-card-has-detected {
    background: #fffdf8;
    border-color: #ead9ad;
}

.app-card-has-detected .app-card-logo {
    background: #fff6dc;
    border-color: #ead9ad;
    color: #c49a2c;
}

.app-card-disabled {
    opacity: .58;
}

@media (max-width: 991px) {
    .apps-categories-container {
        grid-template-columns: 1fr;
    }
}

.app-card-disabled {
    opacity: .58;
    cursor: not-allowed;
}

.app-card-left {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1;
}

.app-card-logo {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 13px;
    background: #f3f4f6;
    border: 1px solid #e7e9ee;
    color: #20242c;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
}

.app-card-info {
    min-width: 0;
    flex: 1;
}

.app-card-top {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 2px;
    min-width: 0;
}

.app-card-top h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 850;
    color: #1f2937;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-card-info p {
    margin: 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-card-has-detected .app-card-info p {
    margin-bottom: 0;
}

.app-card-has-detected {
    min-height: 92px;
}

.app-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    flex-shrink: 0;
}

.app-badge-available {
    background: #eef7ee;
    color: #2f7d32;
}

.app-badge-soon {
    background: #f1f2f4;
    color: #8a93a3;
}


/* RESPONSIVE */
@media (max-width: 991px) {
    .apps-categories-container {
        grid-template-columns: 1fr;
    }
}

.app-card-has-detected {
    background: #fffdf8;
    border-color: #ead9ad;
}

.app-card-has-detected .app-card-logo {
    background: #fff6dc;
    border-color: #ead9ad;
    color: #c49a2c;
}

.app-badge-detected {
    background: #fff3d1;
    color: #9a6a00;
}

.apps-category-ready {
    font-size: 11px;
    font-weight: 850;
    color: #9a6a00;
    background: #fff3d1;
    border: 1px solid #ead9ad;
    border-radius: 999px;
    padding: 4px 9px;
    white-space: nowrap;
}

.wa-qr-swal {
    border-radius: 26px !important;
}

.wa-qr-modal {
    text-align: center;
    padding: 4px 4px 0;
}

.wa-qr-phone {
    width: 58px;
    height: 58px;
    margin: 0 auto 12px;
    border-radius: 20px;
    background: #e9fbea;
    color: #25D366;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
}

.wa-qr-modal h4 {
    margin: 0 0 8px;
    font-weight: 900;
    color: #1d1d1f;
}

.wa-qr-modal p {
    margin: 0 auto 16px;
    max-width: 330px;
    font-size: 14px;
    color: #667085;
    line-height: 1.45;
}

.wa-qr-box {
    width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 24px;
    background: #fff;
    border: 1px solid #e7e9ee;
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
}

.wa-qr-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.wa-qr-note {
    margin: 16px auto 0;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #f6f7f9;
    color: #7b8492;
    font-size: 12px;
    font-weight: 750;
}

.app-card-has-detected {
    background: #ffffff !important;
    border-color: #dfe5ee !important;
}

.app-card-has-detected:hover {
    border-color: #b9d7ff !important;
    box-shadow: 0 10px 26px rgba(0, 113, 227, 0.08);
}

.app-card-has-detected .app-card-logo {
    background: #f5f7fb !important;
    border-color: #e3e8f0 !important;
    color: #344054 !important;
}

.app-badge-detected {
    background: #eef5ff !important;
    color: #0b66c3 !important;
    border: 1px solid #cfe3ff;
}

.apps-category-ready {
    background: #eef5ff !important;
    color: #0b66c3 !important;
    border: 1px solid #cfe3ff !important;
}

.app-connect-preview {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    min-width: 0;
}

.app-connect-data {
    min-width: 0;
}

.app-connect-data small {
    display: block;
    font-size: 11px;
    font-weight: 800;
    color: #667085 !important;
    line-height: 1.1;
}

.app-connect-data strong {
    display: block;
    font-size: 14px;
    font-weight: 850;
    color: #1d2939;
    max-width: 250px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-connect-empty {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
    color: #98a2b3;
    font-size: 12px;
    font-weight: 750;
}

.app-card-top {
    margin-bottom: 2px;
}

#modalLlamadasClientesWizard .modal-content {
    border-radius: 24px;
}

.cliente-call-item {
    transition: background-color .18s ease, transform .18s ease;
}

.cliente-call-item:hover {
    background-color: #f8fbff;
}

.btn-llamar-cliente-wizard {
    min-width: 96px;
}

#listaClientesLlamadasUI::-webkit-scrollbar {
    width: 8px;
}

#listaClientesLlamadasUI::-webkit-scrollbar-thumb {
    background: #cfd4dc;
    border-radius: 999px;
}

#listaClientesLlamadasUI::-webkit-scrollbar-track {
    background: #f3f4f6;
}

.credito-option-upload {
    grid-column: 1 / -1;
}

.creditos-options-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.credito-option-card {
    min-height: 155px;
}

.credito-option-card h5 {
    font-size: 18px;
    margin-bottom: 8px;
}

.credito-option-card p {
    font-size: 14px;
    line-height: 1.35;
}

.creditos-metodo-panel {
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    padding: 22px;
    background: #fff;
    box-shadow: 0 14px 40px rgba(15, 23, 42, 0.05);
}

.creditos-method-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.credito-method-card {
    border: 1px solid #e5e7eb;
    background: #fff;
    border-radius: 20px;
    padding: 18px;
    display: flex;
    align-items: center;
    gap: 14px;
    text-align: left;
    cursor: pointer;
    transition: 0.2s ease;
}

.credito-method-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.credito-method-card.selected {
    border-color: var(--bs-primary);
    background: rgba(13, 110, 253, 0.06);
}

.credito-method-icon {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: #f3f4f6;
    color: var(--bs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.credito-method-card h6 {
    margin: 0 0 4px;
    font-weight: 800;
    color: #212529;
}

.credito-method-card p {
    margin: 0;
    color: #6c757d;
    font-size: 13px;
    line-height: 1.35;
}

@media (max-width: 768px) {
    .creditos-options-grid,
    .creditos-method-grid {
        grid-template-columns: 1fr;
    }

    .credito-option-card {
        min-height: auto;
    }

    .creditos-metodo-panel {
        padding: 16px;
    }
}

.creditos-cartera-table-wrap {
    max-height: 360px;
    overflow: auto;
    background: #fff;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.creditos-cartera-table {
    min-width: 980px;
}

.creditos-cartera-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #f8f9fa;
    box-shadow: inset 0 -1px 0 #dee2e6;
}

.creditos-cartera-table-wrap::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.creditos-cartera-table-wrap::-webkit-scrollbar-thumb {
    background: #c7c7c7;
    border-radius: 20px;
}

.creditos-cartera-table-wrap::-webkit-scrollbar-track {
    background: transparent;
}

.worker-extra-settings {
    border-top: 1px solid #eef0f4;
    padding-top: 14px;
}

.worker-name-list {
    display: grid;
    gap: 10px;
}

.worker-caja-mini {
    background: #f8f9fb;
    border: 1px solid #e5e7ec;
    border-radius: 999px;
    padding: 8px 12px;
}

.worker-count-select {
    border-radius: 999px;
    font-weight: 700;
}

#workerRolesGrid {
    align-items: flex-start !important;
}

#workerRolesGrid .worker-role-card {
    align-self: flex-start !important;
    height: auto !important;
}

.worker-name-row {
    margin-bottom: 12px;
}

.worker-name-row .d-flex {
    align-items: center;
}

.worker-caja-row {
    min-width: 92px;
    background: #f8f9fb;
    border: 1px solid #e5e7ec;
    border-radius: 999px;
    padding: 7px 10px;
    white-space: nowrap;
}

.worker-name-input {
    min-height: 42px;
}

.worker-caja-master-line {
    width: 100%;
    border-top: 1px solid #eef0f4;
    border-bottom: 1px solid #eef0f4;
    padding: 10px 0;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.worker-caja-inline .form-check-input {
    margin: 0;
}

.worker-name-row {
    margin-bottom: 12px;
}

.worker-name-row label {
    font-size: 13px;
}

.worker-name-input {
    min-height: 40px;
}

.worker-extra-settings {
    border-top: 1px solid #eef0f4;
    padding-top: 14px;
}

#workerRolesGrid {
    align-items: flex-start !important;
}

#workerRolesGrid .worker-role-card {
    align-self: flex-start !important;
    height: auto !important;
}

.creditos-mode-tabs {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    display: flex;
    gap: 4px;
    padding: 4px;
    background-color: #f5f5f7;
    border: 1px solid #e5e5ea;
    border-radius: 16px;
}

.creditos-mode-tab {
    flex: 1;
    min-height: 44px;
    padding: 9px 16px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #6b7280;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    transition: all 0.2s ease;
}

.creditos-mode-tab i {
    font-size: 13px;
}

.creditos-mode-tab:hover {
    color: #212529;
    background: var(--aizu-gold);
}

.creditos-mode-tab.active {
    color: #ffffff;
    background: #212529;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.12);
}

.vehiculos-quick-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.vehiculo-quick-card {
    border: 1px solid #e5e7eb;
    border-radius: 22px;
    padding: 18px;
    cursor: pointer;
    min-height: 150px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    transition: all .2s ease;
    background: #fff;
}

.vehiculo-quick-card i {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f4f4f5;
    color: #0d6efd;
    margin-bottom: 12px;
    font-size: 18px;
}

.vehiculo-quick-card strong {
    display: block;
    font-size: 16px;
    margin-bottom: 4px;
}

.vehiculo-quick-card small {
    color: #6b7280;
    display: block;
}

.vehiculo-quick-card input {
    transform: scale(1.15);
}

.vehiculo-quick-card.selected {
    border-color: #0d6efd;
    background: #eef6ff;
    box-shadow: 0 10px 24px rgba(13, 110, 253, .12);
}

.worker-vehiculo-box {
    width: 100%;
}

.creditos-preview-pills {
    width: 100%;
    gap: 7px;
    padding: 7px;
    overflow-x: auto;
    border: 1px solid #e1e3e7;
    border-radius: 18px;
    background: #f7f8fa;
}

.creditos-preview-pills .nav-item {
    flex: 1 0 auto;
}

.creditos-preview-pills .nav-link {
    width: 100%;
    min-width: 145px;
    border: 0;
    border-radius: 13px;
    color: #646a72;
    font-weight: 600;
    padding: 12px 15px;
    white-space: nowrap;
    transition: all .2s ease;
}

.creditos-preview-pills .nav-link:hover {
    background: #fff;
    color: #1e1e20;
}

.creditos-preview-pills .nav-link.active {
    color: #fff;
    background: #1d1d1f;
    box-shadow: 0 7px 18px rgba(0, 0, 0, .14);
}

.preview-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 23px;
    height: 23px;
    margin-left: 6px;
    padding: 0 7px;
    border-radius: 50px;
    background: rgba(0, 0, 0, .07);
    font-size: 11px;
}

.creditos-preview-pills .nav-link.active .preview-tab-count {
    color: #1d1d1f;
    background: #fff;
}

.creditos-preview-contenido {
    min-height: 260px;
}

.creditos-resumen-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.creditos-resumen-card {
    position: relative;
    min-height: 135px;
    overflow: hidden;
    border: 1px solid #e3e5e8;
    border-radius: 18px;
    background: #fff;
    padding: 18px;
}

.creditos-resumen-card::after {
    content: "";
    position: absolute;
    right: -22px;
    bottom: -32px;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: rgba(190, 145, 35, .08);
}

.creditos-resumen-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 39px;
    margin-bottom: 15px;
    border-radius: 12px;
    color: #ad811c;
    background: #f5ecd7;
}

.creditos-resumen-numero {
    display: block;
    color: #1d1d1f;
    font-size: 25px;
    font-weight: 700;
    line-height: 1;
}

.creditos-resumen-texto {
    display: block;
    margin-top: 8px;
    color: #777d85;
    font-size: 13px;
}

.creditos-preview-lista {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.creditos-preview-item {
    display: grid;
    grid-template-columns: minmax(220px, 1.6fr) repeat(3, minmax(120px, 1fr));
    align-items: center;
    gap: 15px;
    border: 1px solid #e3e5e8;
    border-radius: 16px;
    background: #fff;
    padding: 15px 17px;
    transition: all .2s ease;
}

.creditos-preview-item:hover {
    border-color: #d4bd82;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .05);
}

.creditos-preview-titulo {
    color: #1e2023;
    font-weight: 700;
}

.creditos-preview-subtitulo {
    display: block;
    margin-top: 3px;
    color: #858b93;
    font-size: 12px;
}

.creditos-preview-label {
    display: block;
    margin-bottom: 3px;
    color: #9298a0;
    font-size: 11px;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.creditos-preview-valor {
    color: #30343a;
    font-size: 14px;
    font-weight: 600;
}

.creditos-preview-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 50px;
    color: #34383d;
    background: #f3f4f5;
    padding: 6px 11px;
    font-size: 12px;
    font-weight: 600;
}

.creditos-venta-card {
    overflow: hidden;
    border: 1px solid #e3e5e8;
    border-radius: 18px;
    background: #fff;
}

.creditos-venta-header {
    display: grid;
    grid-template-columns: auto minmax(220px, 1.5fr) minmax(150px, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding: 16px 18px;
    background: #fafafa;
}

.creditos-venta-detalles {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 12px;
    padding: 16px 18px;
}

.creditos-venta-dato {
    border-radius: 13px;
    background: #f7f8fa;
    padding: 12px 14px;
}

.creditos-abono-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin: 0 18px 17px;
    border: 1px solid #d3e7d8;
    border-radius: 14px;
    background: #f1faf3;
    padding: 13px 15px;
}

.creditos-abono-box.sin-abono {
    border-color: #e3e5e8;
    background: #f8f8f8;
}

.creditos-preview-vacio {
    border: 1px dashed #d6d9de;
    border-radius: 17px;
    color: #858b93;
    padding: 50px 20px;
    text-align: center;
}

@media (max-width: 1150px) {
    .creditos-resumen-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .creditos-venta-detalles {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .creditos-resumen-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .creditos-preview-item {
        grid-template-columns: 1fr 1fr;
    }

    .creditos-preview-item > div:first-child {
        grid-column: 1 / -1;
    }

    .creditos-venta-header {
        grid-template-columns: auto 1fr;
    }

    .creditos-venta-header > div:nth-child(3),
    .creditos-venta-header > div:nth-child(4) {
        grid-column: 2;
    }
}



.creditos-preview-pills {
    padding: 5px;
    gap: 5px;
    border-radius: 15px;
}

.creditos-preview-pills .nav-link {
    min-width: 130px;
    padding: 9px 12px;
    font-size: 13px;
    border-radius: 11px;
}

.preview-tab-count {
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    font-size: 10px;
}

.creditos-resumen-grid {
    gap: 9px;
}

.creditos-resumen-card {
    min-height: 108px;
    padding: 14px;
    border-radius: 15px;
}

/* Quita las burbujas decorativas */
.creditos-resumen-card::after {
    display: none;
}

.creditos-resumen-icon {
    width: 33px;
    height: 33px;
    margin-bottom: 10px;
    border-radius: 10px;
    font-size: 14px;
}

.creditos-resumen-numero {
    font-size: 21px;
}

.creditos-resumen-texto {
    margin-top: 5px;
    font-size: 12px;
}

.creditos-preview-item {
    gap: 11px;
    padding: 12px 14px;
    border-radius: 14px;
}

.creditos-preview-titulo {
    font-size: 15px;
}

.creditos-preview-valor {
    font-size: 13px;
}

.creditos-preview-subtitulo {
    font-size: 11px;
}

.creditos-venta-header {
    padding: 13px 15px;
}

.creditos-venta-detalles {
    gap: 9px;
    padding: 13px 15px;
}

.creditos-venta-dato {
    padding: 10px 12px;
}

.creditos-abono-box {
    margin: 0 15px 14px;
    padding: 11px 13px;
}

/* En escritorio el resumen siempre permanece visible */
@media (min-width: 768px) {

    .bank-preview-toggle {
        pointer-events: none;
        cursor: default;
    }
}

/* Resumen bancario en celular */
@media (max-width: 767px) {

    .bank-preview-panel {
        margin-top: 8px !important;
        padding: 12px;
        border-radius: 18px;
    }

    .bank-preview-toggle {
        min-height: 48px;
        cursor: pointer;
    }

    .bank-preview-icon {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
        border-radius: 12px;
        font-size: 15px;
    }

    .bank-preview-toggle-title {
        font-size: 14px;
    }

    .bank-preview-grid {
        grid-template-columns: 1fr;
        gap: 8px;
        margin-top: 12px;
    }

    .bank-preview-item {
        min-height: 66px;
        padding: 11px 12px;
        border-radius: 13px;
    }

    .bank-preview-item-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .bank-preview-item strong {
        font-size: 14px;
    }

    .bank-form-card {
        margin-top: 14px;
    }
}

/* Área reutilizable para subir archivos */
.import-drop-zone {
    width: 100%;
    min-height: 210px;
    padding: 34px 24px !important;
    border: 2px dashed #cbd2dc !important;
    border-radius: 18px;
    background-color: #fbfcfe;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        transform 0.2s ease;
}

.file-drop-zone.import-drop-zone:hover,
.file-drop-zone.import-drop-zone.drag-over,
.file-drop-zone.import-drop-zone.is-dragover,
#import-creditos-cartera:hover,
#drop-creditos-cartera:hover,
#drop-creditos-cartera.drag-over,
#drop-creditos-cartera.is-dragover {
    border-color: var(--aizu-gold) !important;

    background-color: #fffaf0 !important;
    background-color: color-mix(
        in srgb,
        var(--aizu-gold) 7%,
        #ffffff
    ) !important;

    box-shadow: 0 0 0 4px color-mix(
        in srgb,
        var(--aizu-gold) 14%,
        transparent
    );

    transform: none;
}

.import-upload-icon {
    width: 54px;
    height: 54px;
    margin-bottom: 14px;
    border-radius: 15px;

    background-color: #fff7e2;
    background-color: color-mix(
        in srgb,
        var(--aizu-gold) 13%,
        #ffffff
    );

    color: var(--aizu-gold) !important;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 25px;
}

.import-drop-zone h6 {
    font-size: 16px;
}

.import-drop-zone small {
    display: block;
    max-width: 680px;
    line-height: 1.4;
}

@media (max-width: 576px) {

    .creditos-mode-tabs {
        max-width: 100%;
    }

    .creditos-mode-tab {
        min-height: 40px;
        padding: 8px 10px;
        font-size: 13px;
    }

    .import-source-tabs .nav-link {
        min-height: 38px;
        padding: 7px 15px;
        font-size: 13px;
    }

    .import-drop-zone {
        min-height: 180px;
        padding: 26px 16px !important;
        border-radius: 15px;
    }

    .import-upload-icon {
        width: 46px;
        height: 46px;
        margin-bottom: 11px;
        border-radius: 13px;
        font-size: 21px;
    }

    .import-drop-zone h6 {
        font-size: 14px;
    }
}

/* Los módulos de clientes y proveedores ocupan todo el ancho disponible */
#modulo-importacion-clientes,
#modulo-proveedores {
    width: 100%;
    max-width: 100%;
}

#modulo-importacion-clientes .tab-content,
#modulo-proveedores .tab-content,
#modulo-importacion-clientes .tab-pane,
#modulo-proveedores .tab-pane,
#modulo-importacion-clientes .card,
#modulo-proveedores .card {
    width: 100%;
}

/* =========================================
   PLAZOS DE CRÉDITO NORMALES
   No aplica para préstamos
========================================= */

.credito-plazos-wrap {
    width: 100%;
    max-width: 760px;
    margin: 0 auto 24px;
}

.credito-plazos-note {
    min-height: 44px;
    padding: 10px 14px;
    border: 1px solid #e5e7eb;
    border-radius: 13px;
    background-color: #f8f9fa;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    line-height: 1.35;
}

.credito-plazos-note i {
    color: var(--aizu-gold);
    font-size: 15px;
}

.credito-plazos-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

.credito-plazo-option {
    position: relative;
    min-width: 0;
    min-height: 126px;
    padding: 15px 10px 12px;
    border: 1px solid #dee2e6;
    border-radius: 17px;
    background-color: #ffffff;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    text-align: center;
    transition:
        border-color 0.18s ease,
        background-color 0.18s ease,
        box-shadow 0.18s ease;
}

/* Hover neutro, sin azul */
.credito-plazo-option:hover {
    border-color: #adb5bd;
    background-color: #ffffff;
}

/* Selección dorada */
.credito-plazo-option.selected {
    border-color: var(--aizu-gold);
    background-color: #fffaf0;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.06);
}

/* Mini calendario */
.credito-plazo-calendar {
    width: 58px;
    height: 64px;
    padding-top: 13px;
    border: 1px solid #dfe3e8;
    border-radius: 12px;
    background:
        linear-gradient(
            180deg,
            var(--aizu-gold) 0,
            var(--aizu-gold) 14px,
            #ffffff 14px,
            #ffffff 100%
        );
    color: #212529;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.04);
}

.credito-plazo-calendar strong {
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
}

.credito-plazo-label {
    color: #212529;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
}

.credito-plazo-selected-icon {
    position: absolute;
    top: 9px;
    right: 9px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: var(--aizu-gold);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    opacity: 0;
    transform: scale(0.75);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease;
}

.credito-plazo-option.selected
.credito-plazo-selected-icon {
    opacity: 1;
    transform: scale(1);
}

/* Otro plazo */
.credito-plazo-personalizado {
    width: 100%;
    margin-top: 14px;
    padding: 14px;
    border: 1px solid #dee2e6;
    border-radius: 17px;
    background-color: #ffffff;
    display: grid;
    grid-template-columns:
        58px
        minmax(0, 1fr)
        minmax(190px, 230px);
    align-items: center;
    gap: 14px;
}

.credito-plazo-calendar-custom {
    padding-top: 0;
    border-color: #1d1d1f;
    background: #1d1d1f;
    color: var(--aizu-gold);
    font-size: 18px;
}

.credito-plazo-personalizado-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    text-align: left;
}

.credito-plazo-personalizado-copy strong {
    color: #212529;
    font-size: 15px;
    font-weight: 800;
}

.credito-plazo-personalizado-copy small {
    margin-top: 2px;
    color: #6c757d;
    font-size: 12px;
    line-height: 1.3;
}

.credito-plazo-input-group {
    min-width: 0;
    height: 46px;
    border: 1px solid #d6dce5;
    border-radius: 13px;
    background-color: #ffffff;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.credito-plazo-input-group:focus-within {
    border-color: var(--aizu-gold);
    box-shadow: 0 0 0 3px #f7edcf;
}

.credito-plazo-input-group
.credito-otro-input {
    min-width: 0;
    height: 44px;
    padding: 8px 12px;
    border: 0 !important;
    box-shadow: none !important;
    background-color: transparent;
    font-size: 14px;
    font-weight: 700;
}

.credito-plazo-input-suffix {
    min-width: 62px;
    padding: 0 12px;
    border-left: 1px solid #e5e7eb;
    background-color: #f8f9fa;
    color: #495057;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}

@media (max-width: 767px) {

    .credito-plazos-wrap {
        max-width: 100%;
        margin-bottom: 16px;
    }

    .credito-plazos-note {
        align-items: flex-start;
        padding: 9px 11px;
        font-size: 12px;
    }

    .credito-plazos-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
        margin-top: 10px;
    }

    .credito-plazo-option {
        min-height: 108px;
        padding: 12px 8px 10px;
        border-radius: 14px;
        gap: 7px;
    }

    .credito-plazo-calendar {
        width: 50px;
        height: 56px;
        padding-top: 12px;
        border-radius: 10px;
        background:
            linear-gradient(
                180deg,
                var(--aizu-gold) 0,
                var(--aizu-gold) 12px,
                #ffffff 12px,
                #ffffff 100%
            );
    }

    .credito-plazo-calendar strong {
        font-size: 19px;
    }

    .credito-plazo-label {
        font-size: 12px;
    }

    .credito-plazo-selected-icon {
        top: 7px;
        right: 7px;
        width: 19px;
        height: 19px;
        font-size: 9px;
    }

    .credito-plazo-personalizado {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
        border-radius: 14px;
    }

    .credito-plazo-personalizado
    .credito-plazo-calendar {
        width: 48px;
        height: 52px;
    }

    .credito-plazo-input-group {
        grid-column: 1 / -1;
        width: 100%;
    }
}

/* =====================================================
   CRÉDITOS MANUALES: PLAZOS ACTIVOS E INACTIVOS
===================================================== */

.creditos-manual-loading {
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #6c757d;
    font-size: 14px;
}

.credito-plazos-wrap {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 24px;
}

.credito-plazos-note {
    min-height: 44px;
    padding: 10px 14px;
    border: 1px solid #e5e7eb;
    border-radius: 13px;
    background-color: #f8f9fa;
    color: #6c757d;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
}

.credito-plazos-note i {
    color: var(--aizu-gold);
    font-size: 15px;
}

.credito-plazos-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

/* Opción individual */
.credito-plazo-option {
    position: relative;
    min-width: 0;
    min-height: 145px;
    padding: 20px 12px 14px;
    border: 1px solid #dee2e6;
    border-radius: 17px;
    background-color: #f7f7f8;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    user-select: none;
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

/* Hover neutro, sin azul */
.credito-plazo-option:hover {
    border-color: #adb5bd;
    background-color: #fafafa;
    box-shadow: 0 7px 18px rgba(0, 0, 0, .045);
}

/* Apariencia inactiva, pero sigue siendo clickeable */
.credito-plazo-option:not(.selected) .credito-plazo-calendar,
.credito-plazo-option:not(.selected) .credito-plazo-label {
    opacity: .58;
}

/* Círculo tipo checkbox */
.credito-plazo-selector {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 27px;
    height: 27px;
    border: 2px solid #c8cbd0;
    border-radius: 50%;
    background-color: #ffffff;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    pointer-events: none;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

.credito-plazo-selector i {
    opacity: 0;
    transform: scale(.65);
    transition: opacity .18s ease, transform .18s ease;
}

/* Mini calendario */
.credito-plazo-calendar {
    width: 58px;
    height: 64px;
    padding-top: 13px;
    border: 1px solid #dfe3e8;
    border-radius: 12px;
    background: linear-gradient(180deg, #d5d7da 0, #d5d7da 14px, #ffffff 14px, #ffffff 100%);
    color: #212529;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 12px rgba(0, 0, 0, .04);
    transition: background .18s ease, border-color .18s ease, opacity .18s ease;
}

.credito-plazo-calendar strong {
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
}

.credito-plazo-label {
    color: #212529;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    transition: opacity .18s ease;
}

.credito-plazo-estado {
    color: #9a9da2;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1;
    text-transform: uppercase;
}

/* Opción activa */
.credito-plazo-option.selected {
    border-color: var(--aizu-gold);
    background-color: color-mix(in srgb, var(--aizu-gold) 7%, #ffffff);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .065);
}

.credito-plazo-option.selected .credito-plazo-calendar {
    opacity: 1;
    border-color: var(--aizu-gold);
    background: linear-gradient(180deg, var(--aizu-gold) 0, var(--aizu-gold) 14px, #ffffff 14px, #ffffff 100%);
}

.credito-plazo-option.selected .credito-plazo-label {
    opacity: 1;
}

.credito-plazo-option.selected .credito-plazo-selector {
    border-color: var(--aizu-gold);
    background-color: var(--aizu-gold);
    transform: scale(1.04);
}

.credito-plazo-option.selected .credito-plazo-selector i {
    opacity: 1;
    transform: scale(1);
}

.credito-plazo-option.selected .credito-plazo-estado {
    color: var(--aizu-gold);
}

/* Plazo personalizado */
.credito-plazo-personalizado {
    position: relative;
    width: 100%;
    margin-top: 14px;
    padding: 14px 50px 14px 14px;
    border: 1px solid #dee2e6;
    border-radius: 17px;
    background-color: #f7f7f8;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) minmax(190px, 230px);
    align-items: center;
    gap: 14px;
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.credito-plazo-personalizado-selector {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 27px;
    height: 27px;
    border: 2px solid #c8cbd0;
    border-radius: 50%;
    background-color: #ffffff;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    pointer-events: none;
    transition: background-color .18s ease, border-color .18s ease;
}

.credito-plazo-personalizado-selector i {
    opacity: 0;
    transform: scale(.65);
    transition: opacity .18s ease, transform .18s ease;
}

.credito-plazo-calendar-custom {
    padding-top: 0;
    border-color: #c8cbd0;
    background: #ffffff;
    color: #8a8d91;
    font-size: 18px;
}

.credito-plazo-personalizado-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    text-align: left;
}

.credito-plazo-personalizado-copy strong {
    color: #212529;
    font-size: 15px;
    font-weight: 800;
}

.credito-plazo-personalizado-copy small {
    margin-top: 2px;
    color: #6c757d;
    font-size: 12px;
    line-height: 1.3;
}

.credito-plazo-input-group {
    min-width: 0;
    height: 46px;
    border: 1px solid #d6dce5;
    border-radius: 13px;
    background-color: #ffffff;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.credito-plazo-input-group:focus-within {
    border-color: var(--aizu-gold);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--aizu-gold) 18%, transparent);
}

.credito-plazo-input-group .credito-otro-input {
    min-width: 0;
    height: 44px;
    padding: 8px 12px;
    border: 0 !important;
    background-color: transparent;
    box-shadow: none !important;
    font-size: 14px;
    font-weight: 700;
}

.credito-plazo-input-suffix {
    min-width: 62px;
    padding: 0 12px;
    border-left: 1px solid #e5e7eb;
    background-color: #f8f9fa;
    color: #495057;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}

/* Plazo personalizado activo */
.credito-plazo-personalizado.selected {
    border-color: var(--aizu-gold);
    background-color: color-mix(in srgb, var(--aizu-gold) 7%, #ffffff);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .065);
}

.credito-plazo-personalizado.selected .credito-plazo-personalizado-selector {
    border-color: var(--aizu-gold);
    background-color: var(--aizu-gold);
}

.credito-plazo-personalizado.selected .credito-plazo-personalizado-selector i {
    opacity: 1;
    transform: scale(1);
}

.credito-plazo-personalizado.selected .credito-plazo-calendar-custom {
    border-color: var(--aizu-gold);
    background-color: var(--aizu-gold);
    color: #ffffff;
}

/* Celular */
@media (max-width: 767px) {
    .credito-plazos-wrap {
        max-width: 100%;
        margin-bottom: 16px;
    }

    .credito-plazos-note {
        padding: 9px 11px;
        font-size: 12px;
    }

    .credito-plazos-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
        margin-top: 10px;
    }

    .credito-plazo-option {
        min-height: 125px;
        padding: 18px 8px 11px;
        border-radius: 14px;
        gap: 7px;
    }

    .credito-plazo-selector,
    .credito-plazo-personalizado-selector {
        top: 8px;
        right: 8px;
        width: 23px;
        height: 23px;
        font-size: 9px;
    }

    .credito-plazo-calendar {
        width: 50px;
        height: 56px;
        padding-top: 12px;
        border-radius: 10px;
        background: linear-gradient(180deg, #d5d7da 0, #d5d7da 12px, #ffffff 12px, #ffffff 100%);
    }

    .credito-plazo-option.selected .credito-plazo-calendar {
        background: linear-gradient(180deg, var(--aizu-gold) 0, var(--aizu-gold) 12px, #ffffff 12px, #ffffff 100%);
    }

    .credito-plazo-calendar strong {
        font-size: 19px;
    }

    .credito-plazo-label {
        font-size: 12px;
    }

    .credito-plazo-estado {
        font-size: 9px;
    }

    .credito-plazo-personalizado {
        padding: 12px 40px 12px 12px;
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 10px;
        border-radius: 14px;
    }

    .credito-plazo-personalizado .credito-plazo-calendar {
        width: 48px;
        height: 52px;
        padding-top: 0;
    }

    .credito-plazo-input-group {
        grid-column: 1 / -1;
        width: 100%;
    }
}
/* =========================================================
   PRODUCTOS / SERVICIOS - ESTILO UNIFICADO
   ========================================================= */

   #modulo-importacion-productos {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

#modulo-importacion-productos.import-options-container {
    max-width: 1080px;
    width: 100%;
}


/* Contenido general */
#modulo-importacion-productos .tab-content,
#modulo-importacion-productos .tab-pane {
    width: 100%;
}

#modulo-importacion-productos .import-card {
    width: 100%;
    border: 1px solid #e5e7eb !important;
    border-radius: 24px !important;
    background: #ffffff;
    box-shadow: none !important;
}

/* Tarjeta de Buscar Web */
#modulo-importacion-productos #tab-web .card-body {
    padding: 28px !important;
}

#modulo-importacion-productos #tab-web label {
    font-size: 16px;
    color: #1f2937;
}

#modulo-importacion-productos .search-pill {
    width: 100%;
    min-height: 56px;
    border: 1px solid #cfd7e3;
    border-radius: 999px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: none;
}

#modulo-importacion-productos .search-pill:focus-within {
    border-color: var(--aizu-gold);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--aizu-gold) 14%, transparent);
}

#modulo-importacion-productos .search-pill-icon {
    width: 54px;
    min-width: 54px;
    height: 54px;
}

#modulo-importacion-productos .search-pill-input {
    height: 54px;
    font-size: 15px;
}

#modulo-importacion-productos .search-pill-btn,
#modulo-importacion-productos #btn-iniciar-scraping {
    width: 46px;
    min-width: 46px;
    height: 46px;
    margin: 4px;
    padding: 0;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--aizu-gold) !important;
    color: #ffffff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none !important;
}

#modulo-importacion-productos .search-pill-btn:hover,
#modulo-importacion-productos #btn-iniciar-scraping:hover {
    filter: brightness(.96);
}

/* Área Excel / CSV */
#modulo-importacion-productos #tab-csv .import-card,
#modulo-importacion-productos #tab-csv .card {
    width: 100%;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

#modulo-importacion-productos #tab-csv .file-drop-zone {
    width: 100%;
    min-height: 270px;
    padding: 36px 24px !important;
    border: 2px dashed #cbd2dc !important;
    border-radius: 24px !important;
    background: #fbfcfe !important;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

#modulo-importacion-productos #tab-csv .file-drop-zone:hover,
#modulo-importacion-productos #tab-csv .file-drop-zone.drag-over,
#modulo-importacion-productos #tab-csv .file-drop-zone.is-dragover {
    border-color: var(--aizu-gold) !important;
    background: color-mix(in srgb, var(--aizu-gold) 7%, #ffffff) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--aizu-gold) 14%, transparent) !important;
}

#modulo-importacion-productos #tab-csv .file-drop-zone i {
    width: 58px;
    height: 58px;
    margin-bottom: 14px !important;
    border-radius: 16px;
    background: color-mix(in srgb, var(--aizu-gold) 13%, #ffffff);
    color: var(--aizu-gold) !important;
    font-size: 26px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#modulo-importacion-productos #tab-csv .file-drop-zone h6 {
    font-size: 17px;
    font-weight: 700;
    color: #1f2937 !important;
    margin-bottom: 8px !important;
}

#modulo-importacion-productos #tab-csv .file-drop-zone p,
#modulo-importacion-productos #tab-csv .file-drop-zone small {
    margin-bottom: 0 !important;
    font-size: 14px !important;
    color: #6b7280 !important;
    line-height: 1.45;
}

/* Responsive */
@media (max-width: 768px) {
    #modulo-importacion-productos {
        max-width: 100%;
    }


    #modulo-importacion-productos #pills-tab .nav-link { min-height: 40px; padding: 7px 10px; font-size: 13px; }

    #modulo-importacion-productos #tab-web .card-body {
        padding: 18px !important;
    }

    #modulo-importacion-productos .search-pill {
        min-height: 50px;
    }

    #modulo-importacion-productos .search-pill-icon {
        width: 48px;
        min-width: 48px;
        height: 48px;
    }

    #modulo-importacion-productos .search-pill-input {
        height: 48px;
        font-size: 14px;
    }

    #modulo-importacion-productos .search-pill-btn,
    #modulo-importacion-productos #btn-iniciar-scraping {
        width: 40px;
        min-width: 40px;
        height: 40px;
    }

    #modulo-importacion-productos #tab-csv .file-drop-zone {
        min-height: 210px;
        padding: 28px 16px !important;
        border-radius: 18px !important;
    }

    #modulo-importacion-productos #tab-csv .file-drop-zone h6 {
        font-size: 15px;
    }

    #modulo-importacion-productos #tab-csv .file-drop-zone p,
    #modulo-importacion-productos #tab-csv .file-drop-zone small {
        font-size: 13px !important;
    }

  
}

.creditos-config-wrap { width: 100%; max-width: 1080px; margin: 0 auto; }
#creditos-cartera-panel, #creditos-manual-panel { width: 100%; max-width: none; }
.credito-plazos-wrap { width: 100%; max-width: none; margin-left: 0; margin-right: 0; }

/* =====================================================
   VISTA PREVIA DE CRÉDITOS EN CELULAR
===================================================== */

@media (max-width: 767px) {

    #creditos-cartera-preview-container {
        width: 100%;
    }

    #creditos-preview-contenido {
        min-height: 0;
    }

    .creditos-preview-lista {
        gap: 8px;
    }

    /* =========================
       RESUMEN
    ========================= */

    .creditos-resumen-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px;
    }

    .creditos-resumen-card {
        min-height: 82px;
        padding: 10px;
        border-radius: 14px;
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        grid-template-rows: auto auto;
        align-items: center;
        column-gap: 9px;
    }

    .creditos-resumen-card::after {
        display: none;
    }

    .creditos-resumen-icon {
        grid-column: 1;
        grid-row: 1 / 3;
        width: 34px;
        height: 34px;
        margin: 0;
        border-radius: 10px;
        font-size: 13px;
    }

    .creditos-resumen-numero {
        grid-column: 2;
        font-size: 19px;
        line-height: 1;
    }

    .creditos-resumen-texto {
        grid-column: 2;
        margin-top: 3px;
        font-size: 11px;
        line-height: 1.25;
    }

    .creditos-preview-item {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-items: start;
        gap: 9px 12px;
        padding: 12px;
        border-radius: 14px;
    }

    .creditos-preview-item > div {
        min-width: 0;
    }

    .creditos-preview-item > div:first-child {
        grid-column: 1 / -1 !important;
        padding-bottom: 9px;
        border-bottom: 1px solid #eef0f2;
    }

    .creditos-preview-item > div:last-child {
        grid-column: 1 / -1;
    }

    .creditos-preview-titulo {
        font-size: 14px;
        line-height: 1.25;
        overflow-wrap: anywhere;
    }

    .creditos-preview-subtitulo {
        margin-top: 2px;
        font-size: 11px;
    }

    .creditos-preview-label {
        margin-bottom: 2px;
        font-size: 9px;
        line-height: 1.2;
    }

    .creditos-preview-valor {
        font-size: 13px;
        line-height: 1.25;
        overflow-wrap: anywhere;
    }

    .creditos-preview-badge {
        padding: 5px 9px;
        font-size: 11px;
    }

    /* =========================
       VENTAS Y ABONOS
    ========================= */

    .creditos-venta-card {
        border-radius: 15px;
    }

    .creditos-venta-header {
        grid-template-columns: auto minmax(0, 1fr) auto !important;
        grid-template-rows: auto auto;
        align-items: start;
        gap: 7px 10px;
        padding: 12px;
    }

    .creditos-venta-header > div:nth-child(1) {
        grid-column: 1;
        grid-row: 1 / 3;
        align-self: center;
    }

    .creditos-venta-header > div:nth-child(2) {
        grid-column: 2;
        grid-row: 1;
    }

    .creditos-venta-header > div:nth-child(3) {
        grid-column: 2 / 4;
        grid-row: 2;
    }

    .creditos-venta-header > div:nth-child(4) {
        grid-column: 3;
        grid-row: 1;
    }

    .creditos-venta-header .badge {
        padding: 5px 8px !important;
        font-size: 10px;
        white-space: nowrap;
    }

    .creditos-venta-detalles {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px;
        padding: 10px 12px;
    }

    .creditos-venta-dato {
        min-width: 0;
        padding: 9px 10px;
        border-radius: 11px;
    }

    .creditos-abono-box {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        align-items: end;
        gap: 8px;
        margin: 0 12px 12px;
        padding: 10px 11px;
        border-radius: 12px;
    }

    .creditos-abono-box > div {
        min-width: 0;
    }

    .creditos-abono-box > div:last-child {
        text-align: right;
    }

    /* Reduce el espacio general de la vista previa */
    #creditos-cartera-preview-container .mb-3 {
        margin-bottom: 10px !important;
    }
}

.loan-amort-tabs {
    width: 100%;
    flex-wrap: nowrap !important;
}

.loan-amort-tabs .nav-item {
    flex: 1 1 0;
    min-width: 0;
}

.loan-amort-tabs .nav-link {
    width: 100%;
    white-space: nowrap;
}

.loan-amort-tabs .nav-link i {
    color: inherit !important;
}

.loan-amort-tabs .nav-link.active,
.loan-amort-tabs .nav-link.active i {
    color: #ffffff !important;
}

#creditos-manual-content {
    width: 100%;
}

#creditos-manual-content .loan-financing-form {
    width: 100% !important;
    max-width: none !important;
    margin: 18px 0 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    --bs-gutter-x: 24px;
}

#creditos-manual-content .loan-amortization-wrap {
    width: 100%;
}

@media (max-width: 767px) {
    #creditos-manual-content .loan-financing-form {
        --bs-gutter-x: 12px;
    }
}

.loan-control-icon-wrap {
    position: relative;
    width: 100%;
}

.loan-control-icon {
    position: absolute;
    top: 50%;
    left: 16px;
    width: 18px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--aizu-gold);
    font-size: 14px;
    pointer-events: none;
    z-index: 3;
}

.loan-control-icon-wrap .loan-control-has-icon {
    width: 100%;
    padding-left: 46px !important;
}

.loan-control-icon-wrap select.loan-control-has-icon {
    padding-right: 42px !important;
}

.loan-control-icon-wrap:focus-within .loan-control-icon {
    color: #1d1d1f;
}

.loan-icon-input-group {
    width: 100%;
    flex-wrap: nowrap !important;
}

.loan-icon-input-group .loan-leading-icon {
    width: 52px;
    min-width: 52px;
    height: 46px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    color: #86868b !important;
    border: 1.5px solid #dfe3ea;
    border-right: 0;
    border-radius: 15px 0 0 15px !important;
    font-size: 14px;
}

.loan-icon-input-group > .form-control,
.loan-icon-input-group > .form-select {
    min-width: 0;
    width: 1%;
    flex: 1 1 auto;
    padding-left: 14px !important;
    border-radius: 0 15px 15px 0 !important;
}

.loan-icon-input-group:focus-within .loan-leading-icon {
    color: #6c757d !important;
    border-color: #bfc5ce;
}

@media (max-width: 576px) {
    .loan-icon-input-group .loan-leading-icon {
        width: 46px;
        min-width: 46px;
    }
}

#creditos-manual-content .step-content-wrapper {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
}

#creditos-manual-content .loan-financing-form {
    margin-top: 10px !important;
}

@media (max-width: 576px) {
    #modulo-terminales-comisiones > .clientes-preview-container:first-child {
        padding: 14px;
    }

    .terminales-mini-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .terminal-mini-card {
        position: relative;
        min-width: 0;
        min-height: 148px;
        padding: 48px 6px 12px !important;
        gap: 5px;
        border-radius: 18px;
        justify-content: flex-start;
    }

    .terminal-card-switch {
        position: absolute !important;
        top: 9px;
        right: 8px;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 5;
    }

    .terminal-card-switch .form-check-input {
        width: 2.2em;
        height: 1.2em;
        margin: 0 !important;
    }

    .terminal-mini-card img {
        width: auto;
        max-width: 58px !important;
        height: 34px;
        max-height: 34px !important;
        object-fit: contain;
    }

    .terminal-mini-card > i {
        height: 34px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .terminal-mini-card strong {
        min-height: 30px;
        font-size: 12px !important;
        line-height: 1.2;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow-wrap: anywhere;
    }

    .terminal-mini-card small {
        font-size: 10px !important;
        line-height: 1.15;
    }

    .terminal-mini-card:disabled {
        opacity: 1 !important;
    }

    .terminales-otra-wrap {
        flex-direction: column;
        gap: 8px;
    }

    .terminales-otra-wrap #btn-agregar-terminal-personalizada {
        width: 100%;
        min-height: 46px;
    }
}

@media (max-width: 767px) {
    #comisiones-terminales-container {
        padding: 14px;
    }

    #comisiones-terminales-container .table-responsive {
        overflow-x: hidden;
    }

    #comisiones-terminales-container table {
        width: 100%;
        min-width: 0 !important;
        table-layout: auto;
    }

    #comisiones-terminales-container th:first-child,
    #comisiones-terminales-container td:first-child {
        width: 54px !important;
        padding-left: 8px;
        padding-right: 5px;
    }

    #comisiones-terminales-container th:nth-child(2),
    #comisiones-terminales-container td:nth-child(2) {
        width: 66px !important;
        padding-left: 4px;
        padding-right: 6px;
    }

    #comisiones-terminales-container th:nth-child(3),
    #comisiones-terminales-container td:nth-child(3) {
        width: auto !important;
        padding-left: 6px;
        padding-right: 8px;
    }

    #comisiones-terminales-container thead th {
        font-size: 10px;
    }

    #comisiones-terminales-container tbody td {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    #comisiones-terminales-container .comision-terminal-logo {
        width: 44px;
        height: 44px;
        min-width: 44px;
        margin-right: 0;
        border-radius: 12px;
    }

    #comisiones-terminales-container .comision-terminal-logo img {
        max-width: 34px;
        max-height: 30px;
    }

    #comisiones-terminales-container .comision-name-full {
        font-size: 13px;
        line-height: 1.3;
        overflow-wrap: anywhere;
    }
}

.worker-roles-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 10px;
}

.worker-master-switch {
    display: inline-flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 8px;
    margin: 0;
    white-space: nowrap;
    cursor: pointer;
}

.worker-master-switch .form-check {
    display: inline-flex;
    align-items: center;
    margin: 0;
}

.worker-master-switch .form-check-input {
    margin: 0 !important;
}

@media (max-width: 576px) {
    .worker-roles-head {
        align-items: flex-start;
        gap: 14px;
    }

    .worker-roles-actions {
        width: 100%;
        justify-content: flex-start;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
    }

    .worker-master-switch {
        width: auto !important;
        flex-direction: row !important;
    }
}

.worker-role-card.selected {
    border-color: var(--aizu-gold) !important;
    background: #fffdf8;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.07);
}

@media (max-width: 576px) {
    #workerRolesGrid {
        gap: 10px !important;
    }

    #workerRolesGrid .worker-role-card {
        min-height: 0 !important;
        padding: 14px !important;
        border-radius: 18px;
    }

    .worker-role-icon {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px;
        border-radius: 14px !important;
    }

    .worker-role-copy strong {
        font-size: 15px;
        line-height: 1.2;
    }

    .worker-role-copy small {
        font-size: 12px;
    }

    .worker-name-container {
        margin-top: 12px !important;
    }

    .worker-extra-settings {
        padding-top: 12px;
    }

    .worker-caja-master-line {
        gap: 12px;
        padding: 10px 0;
    }

    .worker-caja-master-line small:last-child {
        font-size: 11px;
        line-height: 1.3;
    }

    .worker-name-row {
        margin-bottom: 10px;
    }

    .worker-name-row > .d-flex {
        gap: 8px;
    }

    .worker-caja-inline {
        flex-shrink: 0;
        white-space: nowrap;
    }

    .worker-name-input {
        min-height: 40px;
    }
}

.call-self-compact {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 14px;
    border: 1px solid #e1e4e8;
    border-radius: 17px;
    background: #f8f9fa;
}

.call-self-compact-icon {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dfe3e8;
    border-radius: 50%;
    background: #ffffff;
    color: #6c757d;
    font-size: 17px;
}

.call-self-compact-info {
    min-width: 0;
}

.call-self-compact-info small {
    display: block;
    margin-bottom: 2px;
    color: #6c757d;
    font-size: 12px;
}

.call-self-compact-info strong {
    display: block;
    color: #1d1d1f;
    font-size: 17px;
    overflow-wrap: anywhere;
}

.call-client-separator {
    display: flex;
    align-items: center;
    gap: 14px;
    color: #6c757d;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

.call-client-separator::before,
.call-client-separator::after {
    content: "";
    height: 1px;
    flex: 1;
    background: #dfe3e8;
}

.call-search-grid {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 10px;
}

.call-search-grid .form-select,
.call-search-grid .form-control,
.call-search-grid .btn {
    min-height: 44px;
}

@media (max-width: 576px) {
    #modalLlamadasClientesWizard .modal-dialog {
        margin: 12px;
    }

    #modalLlamadasClientesWizard .modal-header {
        align-items: flex-start;
    }

    #modalLlamadasClientesWizard .modal-title {
        font-size: 20px;
        line-height: 1.2;
    }

    .call-self-compact {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
    }

    .call-self-compact-icon {
        width: 42px;
        height: 42px;
    }

    .call-self-compact #btnLlamarmeWizard {
        grid-column: 1 / -1;
        width: 100%;
        min-height: 44px;
    }

    .call-search-grid {
        grid-template-columns: 118px minmax(0, 1fr);
        gap: 7px;
    }

    .call-search-grid .form-select,
    .call-search-grid .form-control,
    .call-search-grid .btn {
        min-height: 42px;
        font-size: 13px;
    }

    .call-search-grid .form-control {
        padding-left: 10px;
        padding-right: 8px;
    }

    #listaClientesLlamadasUI {
        max-height: 250px !important;
    }
}

@media (max-width: 390px) {
    .call-search-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   CONECTAR HERRAMIENTAS - AJUSTE FINAL RESPONSIVE
   Debe permanecer al final del archivo CSS
========================================================= */

.apps-step-content {
    justify-content: flex-start !important;
    padding-top: 0 !important;
}

.apps-step-wrap {
    width: 100% !important;
    max-width: 1100px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    gap: 12px !important;
}

.apps-step-caption {
    width: 100% !important;
    margin: 0 0 12px !important;
    color: #5f6368 !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
}

#appsCategoriesContainer,
#appsCategoriesContainer *,
#appsCategoriesContainer *::before,
#appsCategoriesContainer *::after {
    box-sizing: border-box;
}

#appsCategoriesContainer {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: start !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

#appsCategoriesContainer .tools-category-card {
    align-self: start !important;
}

/* Cuando exista una cantidad impar, la última categoría ocupa ambas columnas */
#appsCategoriesContainer .tools-category-card:last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

@media (max-width: 991.98px) {
    #appsCategoriesContainer {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    #appsCategoriesContainer .tools-category-card:last-child:nth-child(odd) {
        grid-column: auto;
    }
}

/* Encabezado compacto y chevron alineado */

#appsCategoriesContainer .apps-category-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 14px 16px !important;
}

#appsCategoriesContainer .apps-category-left {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

#appsCategoriesContainer .apps-category-icon {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    margin: 0 !important;
    border-radius: 13px !important;
    font-size: 17px !important;
}

#appsCategoriesContainer .apps-category-body {
    width: 100% !important;
    min-width: 0 !important;
}

#appsCategoriesContainer .apps-category-body h4 {
    margin: 0 0 2px !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
}

#appsCategoriesContainer .apps-category-body p {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere !important;
}

/* Evita que el chevron se vaya a una fila inferior */

#appsCategoriesContainer .apps-category-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    align-self: center !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 7px !important;
}

#appsCategoriesContainer .apps-category-chevron {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
}

/* CONTENIDO EXPANDIDO */

#appsCategoriesContainer .apps-category-content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 12px 12px !important;
    overflow: hidden !important;
}

#appsCategoriesContainer .apps-mini-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
}

/* TARJETA DE CADA INTEGRACIÓN */

#appsCategoriesContainer .app-card-connect {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    border-radius: 15px !important;
    overflow: hidden !important;
}

#appsCategoriesContainer .app-card-main {
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
}

#appsCategoriesContainer .app-card-logo {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    margin: 0 !important;
    border-radius: 12px !important;
    font-size: 16px !important;
}

#appsCategoriesContainer .app-card-info {
    width: 100% !important;
    min-width: 0 !important;
}

#appsCategoriesContainer .app-card-top {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 3px 7px !important;
    width: 100% !important;
    min-width: 0 !important;
}

#appsCategoriesContainer .app-card-top h4 {
    min-width: 0 !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    overflow-wrap: anywhere !important;
}

#appsCategoriesContainer .app-card-top .badge,
#appsCategoriesContainer .app-card-top span {
    flex-shrink: 0;
}

#appsCategoriesContainer .app-connect-empty {
    min-width: 0 !important;
    margin-top: 2px !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

/* El botón ya no podrá salirse de la tarjeta */

#appsCategoriesContainer .btn-app-connect {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 7px 8px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

@media (max-width: 576px) {
    .apps-step-content {
        width: 100% !important;
        padding: 0 !important;
    }

    .apps-step-wrap {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        gap: 10px !important;
    }

    .apps-step-caption {
        margin-bottom: 8px !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
    }

    #appsCategoriesContainer .tools-category-card {
        border-radius: 16px !important;
    }

    #appsCategoriesContainer .apps-category-head {
        grid-template-columns: minmax(0, 1fr) 34px !important;
        gap: 8px !important;
        padding: 11px 12px !important;
    }

    #appsCategoriesContainer .apps-category-left {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        gap: 9px !important;
    }

    #appsCategoriesContainer .apps-category-icon {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        border-radius: 11px !important;
        font-size: 15px !important;
    }

    #appsCategoriesContainer .apps-category-body h4 {
        font-size: 16px !important;
    }

    #appsCategoriesContainer .apps-category-body p {
        font-size: 11px !important;
        line-height: 1.3 !important;
    }

    #appsCategoriesContainer .apps-category-actions {
        width: auto !important;
        align-self: center !important;
    }

    #appsCategoriesContainer .apps-category-chevron {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        font-size: 13px !important;
    }

    #appsCategoriesContainer .apps-category-content {
        padding: 0 8px 8px !important;
    }

    #appsCategoriesContainer .apps-mini-grid {
        gap: 7px !important;
    }

    #appsCategoriesContainer .app-card-connect {
        grid-template-columns: minmax(0, 1fr) 86px !important;
        gap: 6px !important;
        padding: 9px !important;
        border-radius: 13px !important;
    }

    #appsCategoriesContainer .app-card-main {
        grid-template-columns: 36px minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    #appsCategoriesContainer .app-card-logo {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
    }

    #appsCategoriesContainer .app-card-top {
        gap: 2px 5px !important;
    }

    #appsCategoriesContainer .app-card-top h4 {
        font-size: 13px !important;
        line-height: 1.15 !important;
    }

    #appsCategoriesContainer .app-card-top .badge,
    #appsCategoriesContainer .app-card-top span {
        font-size: 9px !important;
    }

    /* Se oculta esta leyenda en celular para reducir la altura */
    #appsCategoriesContainer .app-connect-empty {
        display: none !important;
    }

    #appsCategoriesContainer .btn-app-connect {
        width: 86px !important;
        min-width: 86px !important;
        max-width: 86px !important;
        min-height: 34px !important;
        padding: 6px 5px !important;
        font-size: 11px !important;
    }
}

/* Solo en teléfonos extremadamente angostos el botón baja */

@media (max-width: 360px) {
    #appsCategoriesContainer .app-card-connect {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    #appsCategoriesContainer .btn-app-connect {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }
}

/* MOSTRAR Y OCULTAR CATEGORÍAS DE APPS */

#appsCategoriesContainer .apps-category-chevron {
    cursor: pointer !important;
    transform: none !important;
}

#appsCategoriesContainer .apps-category-chevron i {
    transition: transform .2s ease;
}

#appsCategoriesContainer .tools-category-card.is-open .apps-category-chevron i {
    transform: rotate(180deg);
}

#appsCategoriesContainer .apps-category-content.d-none {
    display: none !important;
}

/* SUCURSALES: visible siempre en computadora y colapsable en móvil */
@media (min-width: 992px) {
    .sucursales-copy-panel .collapse,
    .sucursales-copy-panel .collapsing {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
        overflow: visible !important;
        transition: none !important;
    }

    #sucursalesCopiasGrid {
        display: flex !important;
        flex-direction: column;
        visibility: visible !important;
    }

    .sucursales-copy-panel [data-bs-toggle="collapse"] {
        pointer-events: none;
        cursor: default;
    }

    .sucursales-copy-panel [data-bs-toggle="collapse"] .fa-chevron-down,
    .sucursales-copy-panel [data-bs-toggle="collapse"] .fa-chevron-up,
    .sucursales-copy-panel [data-bs-toggle="collapse"] .fa-angle-down,
    .sucursales-copy-panel [data-bs-toggle="collapse"] .fa-angle-up {
        display: none !important;
    }
}

.app-card-connected {
    background: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
}

.app-card-connected .app-card-logo {
    background: var(--bs-body-bg);
    border-color: var(--bs-border-color);
}

.app-badge-connected {
    display: inline-flex;
    align-items: center;
    padding: .25rem .55rem;
    border-radius: 999px;
    background: var(--bs-success-bg-subtle);
    color: var(--bs-success-text-emphasis);
    font-size: .68rem;
    font-weight: 700;
    line-height: 1;
}

.app-connection-state {
    width: 100%;
    margin-top: .3rem;
}

.app-connected-account {
    display: flex;
    align-items: center;
    gap: .55rem;
    min-width: 0;
}

.app-connected-avatar {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--bs-success-bg-subtle);
    color: var(--bs-success-text-emphasis);
    font-size: .65rem;
}

.app-connected-copy {
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: .45rem;
    row-gap: .1rem;
}

.app-connected-name {
    color: var(--bs-body-color);
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.25;
}

.app-connected-email {
    color: var(--bs-secondary-color);
    font-size: .75rem;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 220px;
}

.app-connected-detail {
    width: 100%;
    color: var(--bs-secondary-color);
    font-size: .68rem;
    line-height: 1.25;
}

.btn-app-connected {
    min-width: 112px;
    border: 1px solid var(--bs-border-color) !important;
    background: var(--bs-body-bg) !important;
    color: var(--bs-secondary-color) !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

.app-card-connected .btn-app-connected:disabled {
    opacity: 1;
}

/* Evita que la información empuje al botón */
.app-card-main {
    min-width: 0;
}

.app-card-info {
    min-width: 0;
    flex: 1;
}

/* Mantener las filas compactas */
.app-card-connect {
    min-height: 72px;
}

@media (max-width: 767px) {

    .app-connected-copy {
        display: block;
    }

    .app-connected-email {
        margin-top: .1rem;
        max-width: 180px;
    }

    .app-connected-detail {
        margin-top: .1rem;
    }
}

#modalMarketplaceWizard .modal-content {
    height: 100vh;
}

#modalMarketplaceWizard .modal-body {
    min-height: 0;
    overflow: hidden;
}

#iframeMarketplaceWizard {
    width: 100%;
    height: 100%;
    min-height: 0;
}

.creditos-totales-panel {
    margin-top: 14px;
    padding: 18px 20px;
    border: 1px solid #e3e5e8;
    border-radius: 18px;
    background: #f7f8fa;
}

.creditos-totales-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 20px;
    align-items: center;
}

.creditos-total-item {
    min-width: 0;
}

.creditos-total-item .creditos-preview-label {
    margin-bottom: 7px;
    font-size: 11px;
    line-height: 1.2;
}

.creditos-total-item .creditos-preview-valor {
    display: block;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
}

@media (max-width: 767px) {

    .creditos-totales-panel {
        padding: 12px;
        margin-top: 10px;
        border-radius: 15px;
    }

    .creditos-totales-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
    }

    .creditos-total-item {
        padding: 12px 10px;
        min-width: 0;
    }

    .creditos-total-item:nth-child(odd) {
        border-right: 1px solid #e6e8eb;
    }

    .creditos-total-item:nth-child(-n + 4) {
        border-bottom: 1px solid #e6e8eb;
    }

    .creditos-total-item .creditos-preview-label {
        margin-bottom: 5px;
        font-size: 9px;
        line-height: 1.25;
    }

    .creditos-total-item .creditos-preview-valor {
        font-size: clamp(14px, 4.2vw, 18px);
        line-height: 1.15;
        white-space: nowrap !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    .creditos-total-deuda {
        grid-column: 1 / -1;
        border-right: 0 !important;
        border-bottom: 0 !important;
        padding-top: 14px;
        text-align: center;
    }

    .creditos-total-deuda .creditos-preview-label {
        font-size: 10px;
    }

    .creditos-total-deuda .creditos-preview-valor {
        font-size: 20px;
    }
}

/* =========================================================
   TOPBAR CONFIGURACIÓN INICIAL
   ========================================================= */

   .config-page {
    width: 95vw;
    max-width: 1250px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.config-topbar {
    width: 100%;
    min-height: 54px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 6px;

    position: relative;
    z-index: 1000;
}


/* Logo Aizu */

.config-brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.config-brand img {
    display: block;
    width: 155px;
    height: 48px;
    object-fit: contain;
    object-position: left center;
}


/* Selector idioma */

.config-language-switch {
    position: relative;
}

.config-language-btn {
    min-height: 52px;
    padding: 0 22px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    border: 0;
    border-radius: 999px;

    background: #f1efe8;
    color: #1d1d1f;

    font-size: 16px;
    font-weight: 700;

    box-shadow: none;
}

.config-language-btn:hover,
.config-language-btn:focus,
.config-language-btn.show {
    background: #ebe6d8;
    color: #1d1d1f;
}

.config-language-btn i {
    font-size: 18px;
}

.config-language-btn::after {
    margin-left: 2px;
}


/* Menú */

.config-language-menu {
    min-width: 210px;
    padding: 10px;

    border: 1px solid #e3e5e8;
    border-radius: 20px;

    background: #ffffff;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, 0.12);

    overflow: hidden;
}

.config-language-menu .dropdown-item {
    padding: 12px 16px;

    border-radius: 14px;

    color: #1d1d1f;

    font-size: 16px;
    font-weight: 500;

    transition:
        background-color 0.18s ease,
        color 0.18s ease;
}

.config-language-menu .dropdown-item:hover {
    background: #f5f3ed;
}

.config-language-menu .dropdown-item.active {
    background: #f0ede4;
    color: var(--aizu-gold);
    font-weight: 700;
}


/*
 * El wizard ahora ocupa todo el ancho del wrapper.
 */
.config-page .wizard-container {
    width: 100%;
    max-width: none;

    height: calc(90vh - 64px);
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 576px) {

    .config-page {
        width: 100%;
        max-width: none;
        height: 100dvh;
        gap: 0;
    }

    .config-topbar {
        min-height: 60px;
        padding: 8px 14px;

        background: #f4f5f7;

        flex-shrink: 0;
    }

    .config-brand img {
        width: 112px;
        height: 38px;
    }

    .config-language-btn {
        min-height: 42px;
        padding: 0 15px;

        gap: 7px;

        font-size: 14px;
    }

    .config-language-btn i {
        font-size: 16px;
    }

    .config-language-menu {
        min-width: 185px;
        border-radius: 17px;
    }

    .config-language-menu .dropdown-item {
        padding: 11px 14px;
        font-size: 15px;
    }

    .config-page .wizard-container {
        width: 100%;
        height: calc(100dvh - 60px);
        max-height: none;
        border-radius: 0;
    }
}

.aizu-orders-modal {
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 30px 90px rgba(15, 23, 42, .28);
}

.aizu-orders-header {
    padding: 18px 22px;
    background: #fff;
}

.aizu-orders-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 14px;
    background: #f1f5f9;
    color: #111827;
    font-size: 20px;
}

.aizu-orders-info-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 22px;
    border-top: 1px solid #eef1f5;
    border-bottom: 1px solid #eef1f5;
    background: #fafbfc;
    font-size: 13px;
}

.aizu-orders-benefits {
    padding: 18px 22px;
    border-bottom: 1px solid #e9edf2;
    background: #fff;
}

.aizu-orders-benefit {
    height: 100%;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 14px;
    border: 1px solid #e7eaf0;
    border-radius: 16px;
    background: #fff;
}

.aizu-orders-benefit-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 11px;
    background: #f1f5f9;
    color: #111827;
}

.aizu-orders-benefit strong {
    display: block;
    color: #111827;
    font-size: 13px;
    margin-bottom: 3px;
}

.aizu-orders-benefit small {
    display: block;
    color: #64748b;
    line-height: 1.4;
}

.aizu-orders-domain-note {
    margin-top: 14px;
    padding: 10px 13px;
    border-radius: 12px;
    background: #f8fafc;
    color: #64748b;
    font-size: 12px;
}

.aizu-orders-preview-wrap {
    position: relative;
    height: 68vh;
    min-height: 480px;
    background: #f8fafc;
}

.aizu-orders-iframe {
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
    background: #fff;
}

.aizu-orders-loading {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #64748b;
    font-size: 14px;
}

.aizu-orders-demo-short,
.aizu-orders-benefits-mobile-head {
    display: none;
}

.aizu-orders-demo-message {
    display: flex;
    align-items: center;
    gap: 8px;
}

.aizu-orders-demo-short,
.aizu-orders-benefits-mobile-head {
    display: none;
}

@media (max-width: 768px) {
    .aizu-orders-header {
        padding: 12px 14px;
        min-height: 70px;
    }

    .aizu-orders-header .d-flex.align-items-center.gap-3 {
        gap: 10px !important;
        min-width: 0;
    }

    .aizu-orders-icon {
        width: 40px;
        height: 40px;
        border-radius: 12px;
        font-size: 18px;
    }

    .aizu-orders-header .modal-title {
        font-size: 18px;
        line-height: 1.15;
        margin: 0 !important;
    }

    .aizu-orders-subtitle {
        display: none;
    }

    .aizu-orders-header .btn-close {
        flex: 0 0 auto;
        margin-left: auto;
    }

    .aizu-orders-info-bar {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        padding: 9px 12px;
        min-height: 54px;
    }

    .aizu-orders-demo-message {
        display: flex;
        align-items: center;
        gap: 6px;
        min-width: 0;
        font-size: 12px;
    }

    .aizu-orders-demo-long {
        display: none;
    }

    .aizu-orders-demo-short {
        display: inline;
        white-space: nowrap;
    }

    #btnToggleAizuOrdersBenefits {
        flex: 0 0 auto;
        padding: 7px 11px !important;
        font-size: 12px;
    }

    .aizu-orders-preview-wrap {
        flex: 1 1 auto;
        min-height: 0;
        height: auto;
    }

    .aizu-orders-benefits {
        position: absolute;
        z-index: 50;
        top: 132px;
        left: 10px;
        right: 10px;
        max-height: calc(100vh - 150px);
        overflow-y: auto;
        padding: 16px;
        border: 1px solid rgba(15, 23, 42, .10);
        border-radius: 20px;
        background: rgba(255, 255, 255, .98);
        box-shadow: 0 22px 60px rgba(15, 23, 42, .28);
        backdrop-filter: blur(16px);
    }

    .aizu-orders-benefits-mobile-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 14px;
    }

    .aizu-orders-benefits-close {
        width: 36px;
        height: 36px;
        display: grid;
        place-items: center;
        flex: 0 0 auto;
        padding: 0;
    }

    .aizu-orders-benefits-grid {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-left: -4px;
        margin-right: -4px;
        padding: 2px 4px 10px;
        scroll-snap-type: x mandatory;
    }

    .aizu-orders-benefits-grid::-webkit-scrollbar {
    height: 5px;
}

.aizu-orders-benefits-grid::-webkit-scrollbar-track {
    background: #e5e7eb;
    border-radius: 999px;
}

.aizu-orders-benefits-grid::-webkit-scrollbar-thumb {
    background: #aeb4bd;
    border-radius: 999px;
}

    .aizu-orders-benefits-grid > div {
        flex: 0 0 84%;
        max-width: 84%;
        scroll-snap-align: start;
    }

    .aizu-orders-benefit {
        min-height: 130px;
        padding: 14px;
    }

    .aizu-orders-domain-note {
        margin-top: 8px;
    }

    .aizu-orders-iframe {
        width: 100%;
        height: 100%;
    }
}


/* =========================================================
   MODAL LLAMADAS CLIENTES
   ========================================================= */

   .routes-inline-step{
    width:100%;
    max-width:1400px;
    display:flex;
    flex-direction:column;
}

.routes-inline-map{
    position:relative;
    width:100%;
    height:clamp(520px, 62vh, 820px);
    border:1px solid #e5e7eb;
    border-radius:20px;
    overflow:hidden;
    background:#f8fafc;
    box-shadow:0 8px 28px rgba(15,23,42,.06);
}

.routes-inline-map .rutas-setup-iframe{
    width:100%;
    height:100%;
    border:0;
    display:block;
}

.rutas-setup-status{
    font-size:13px;
    color:#64748b;
    display:flex;
    align-items:center;
    gap:7px;
}

.rutas-setup-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#c49a32;
    display:inline-block;
}

@media(max-width:768px){
    .routes-inline-map{
        height:65vh;
        min-height:500px;
        border-radius:16px;
    }
}

/* =========================================================
   ACCESO ADMINISTRADOR
   ========================================================= */

.admin-access-wrap {
    max-width: 760px;
    margin: 0 auto;
}

.admin-access-intro {
    display: flex;
    align-items: flex-start;
    gap: 1rem;

    padding: 1.4rem;

    border: 1px solid var(--bs-border-color);
    border-radius: 1.25rem;

    background: var(--bs-tertiary-bg);
}

.admin-access-intro-icon {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 1rem;

    background: rgba(194, 151, 49, .12);
    color: var(--aizu-gold);

    font-size: 1.35rem;
}

.admin-access-intro-title {
    margin: 0 0 .35rem;

    color: var(--bs-body-color);

    font-size: 1.25rem;
    font-weight: 700;
}

.admin-access-intro-text {
    max-width: 580px;
    margin: 0;

    color: var(--bs-secondary-color);

    font-size: .92rem;
    line-height: 1.55;
}

.admin-access-form {
    margin-top: 1.6rem;
}

.admin-password-field {
    display: flex;
    align-items: stretch;

    overflow: hidden;

    border: 1px solid var(--bs-border-color);
    border-radius: 1rem;

    background: var(--bs-body-bg);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.admin-password-field:focus-within {
    border-color: var(--aizu-gold);
    box-shadow: 0 0 0 .2rem rgba(194, 151, 49, .10);
}

.admin-password-field .form-control {
    min-height: 54px;

    border: 0 !important;
    border-radius: 0;

    box-shadow: none !important;

    background: transparent;

    font-size: .95rem;
}

.admin-password-toggle {
    width: 56px;
    flex: 0 0 56px;

    border: 0;
    border-left: 1px solid var(--bs-border-color);

    background: transparent;
    color: var(--bs-secondary-color);

    font-size: 1rem;

    transition:
        background .2s ease,
        color .2s ease;
}

.admin-password-toggle:hover {
    background: var(--bs-tertiary-bg);
    color: var(--bs-body-color);
}

.admin-access-help {
    margin-top: .45rem;

    color: var(--bs-secondary-color);

    font-size: .75rem;
}

.admin-security-note {
    display: flex;
    align-items: center;
    gap: .6rem;

    margin-top: 1.4rem;
    padding: .8rem 1rem;

    border-radius: .9rem;

    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);

    font-size: .78rem;
}

.admin-security-note i {
    color: var(--aizu-gold);
}

@media (max-width: 575px) {

    .admin-access-intro {
        padding: 1rem;
    }

    .admin-access-intro-icon {
        width: 46px;
        height: 46px;
        flex-basis: 46px;

        font-size: 1.1rem;
    }

    .admin-access-intro-title {
        font-size: 1.05rem;
    }

    .admin-access-intro-text {
        font-size: .82rem;
    }
}

/* =========================================================
   FIX MOBILE - LAYOUT GENERAL CONFIGURACIÓN
   ========================================================= */

@media (max-width: 576px) {

    html,
    body {
        width: 100%;
        height: 100%;
        min-height: 100%;
        margin: 0;
        padding: 0 !important;
        overflow: hidden;
    }

    body {
        display: block;
    }

    .config-page {
        width: 100%;
        max-width: none;

        height: 100vh;
        height: 100dvh;

        min-height: 0;

        display: flex;
        flex-direction: column;

        gap: 0;

        overflow: hidden;
    }


    /* TOPBAR */
    .config-topbar {
        width: 100%;

        height: 60px;
        min-height: 60px;

        flex: 0 0 60px;

        padding: 6px 14px;

        box-sizing: border-box;

        background: #f4f5f7;
    }

    .config-brand img {
        width: 108px;
        height: 36px;
    }

    .config-language-btn {
        min-height: 40px;
        padding: 0 12px;
        gap: 6px;
        font-size: 14px;
    }


    /* WIZARD: ocupa exactamente el espacio restante */
    .config-page .wizard-container {
        width: 100%;

        flex: 1 1 auto;

        height: auto !important;
        min-height: 0;
        max-height: none;

        border-radius: 0;

        overflow: hidden;
    }


    /* TÍTULO */
    .wizard-header {
        flex: 0 0 auto;
        padding: 18px 14px 8px;
    }

    .wizard-header h2 {
        font-size: 1.45rem;
        line-height: 1.2;
    }


    /* SOLO EL CONTENIDO HACE SCROLL */
    .wizard-body {
        flex: 1 1 auto;

        min-height: 0;

        padding: 10px 14px 14px;

        overflow-x: hidden;
        overflow-y: auto;

        -webkit-overflow-scrolling: touch;
    }


    /* FOOTER SIEMPRE VISIBLE */
    .wizard-footer {
        flex: 0 0 auto;

        position: relative;
        bottom: auto;

        padding:
            10px
            12px
            calc(10px + env(safe-area-inset-bottom));

        background: #fff;

        z-index: 20;
    }
}

/* =========================================================
   EMPRESA - UBICACIÓN PARA ROUTES
   ========================================================= */

.empresa-review-card-routes {
    padding: 24px;
}

.empresa-review-card-routes .empresa-hero-simple {
    gap: 18px;
    padding: 16px 18px;
    border-radius: 18px;
}

.empresa-review-card-routes .empresa-logo-edit {
    width: 96px;
    height: 96px;
    min-width: 96px;
    border-radius: 18px;
}

.empresa-review-card-routes .empresa-logo-edit img {
    padding: 6px;
}

.empresa-review-card-routes .empresa-hero-info-simple h3 {
    margin: 0 !important;
    font-size: 1.45rem;
}

.empresa-review-card-routes .empresa-form-section {
    margin-top: 1rem !important;
}


/* PANEL */

.empresa-location-panel {
    margin-top: .35rem;
    padding: 18px;

    border: 1px solid var(--bs-border-color);
    border-radius: 20px;

    background: var(--bs-body-bg);

    box-shadow: 0 8px 26px rgba(0, 0, 0, .04);
}

.empresa-location-header {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 16px;

    margin-bottom: 14px;
}

.empresa-location-title-wrap {
    min-width: 0;

    display: flex;
    align-items: center;

    gap: 12px;
}

.empresa-location-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 13px;

    background: rgba(194, 151, 49, .12);
    color: var(--aizu-gold);

    font-size: 1rem;
}

.empresa-location-info-btn {
    width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border: 0;
    border-radius: 50%;

    background: transparent;
    color: var(--bs-secondary-color);

    transition: .2s ease;
}

.empresa-location-info-btn:hover {
    background: var(--bs-tertiary-bg);
    color: var(--bs-body-color);
}

.empresa-location-help {
    display: flex;
    align-items: flex-start;

    gap: 9px;

    margin-bottom: 14px;
    padding: 11px 13px;

    border-radius: 13px;

    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);

    font-size: .78rem;
    line-height: 1.45;
}

.empresa-location-help i {
    margin-top: 2px;
    color: var(--aizu-gold);
}

.empresa-location-coordinates {
    margin-bottom: 12px;
}

.empresa-location-coordinates .form-control {
    min-height: 39px;
    border-radius: 11px;

    background: var(--bs-tertiary-bg);

    font-size: .78rem;
    font-variant-numeric: tabular-nums;
}

/* =========================================================
   MAPA EMPRESA - ROUTES
   ========================================================= */

#empresaRoutesMap {
    width: 100%;
    height: 270px;

    position: relative;

    overflow: hidden;

    border: 1px solid var(--bs-border-color);
    border-radius: 17px;

    background: #eef1f4;

    cursor: grab;

    isolation: isolate;
}

#empresaRoutesMap.leaflet-dragging {
    cursor: grabbing;
}

#empresaRoutesMap:focus {
    outline: none;
}

#empresaRoutesMap:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(194, 151, 49, .16);
}


/* =========================================================
   ZOOM
   ========================================================= */

#empresaRoutesMap .leaflet-control-zoom {
    margin-right: 14px !important;
    margin-bottom: 14px !important;

    overflow: hidden;

    border: 0 !important;
    border-radius: 12px !important;

    box-shadow: 0 6px 20px rgba(0, 0, 0, .16) !important;
}

#empresaRoutesMap .leaflet-control-zoom a {
    width: 40px !important;
    height: 40px !important;

    display: flex !important;
    align-items: center;
    justify-content: center;

    border: 0 !important;

    background: rgba(255, 255, 255, .97) !important;
    color: #1f2022 !important;

    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1 !important;

    transition:
        background .18s ease,
        color .18s ease;
}

#empresaRoutesMap .leaflet-control-zoom-in {
    border-bottom: 1px solid #e5e7eb !important;
}

#empresaRoutesMap .leaflet-control-zoom a:hover {
    background: #1f2022 !important;
    color: #fff !important;
}


/* =========================================================
   ATRIBUCIÓN OSM / CARTO
   ========================================================= */

#empresaRoutesMap .leaflet-control-attribution {
    margin-left: 10px !important;
    margin-bottom: 9px !important;

    padding: 3px 7px !important;

    border: 0 !important;
    border-radius: 7px !important;

    background: rgba(255, 255, 255, .90) !important;
    color: #6b7280 !important;

    font-size: 9px !important;
    font-weight: 500 !important;

    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

#empresaRoutesMap .leaflet-control-attribution a {
    color: #4b5563 !important;
    text-decoration: none !important;
}


/* =========================================================
   MARCADOR AIZU
   ========================================================= */

.aizu-company-marker-wrapper {
    background: transparent !important;
    border: 0 !important;
}

.aizu-company-marker {
    position: relative;

    width: 48px;
    height: 54px;

    display: flex;
    justify-content: center;

    filter: drop-shadow(0 7px 9px rgba(0, 0, 0, .22));
}

.aizu-company-marker-icon {
    position: relative;
    z-index: 2;

    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 3px solid #fff;
    border-radius: 50%;

    background: #1f2022;
    color: var(--aizu-gold);

    font-size: 16px;
}

.aizu-company-marker-tip {
    position: absolute;

    left: 50%;
    bottom: 3px;

    width: 17px;
    height: 17px;

    transform: translateX(-50%) rotate(45deg);

    border-radius: 2px;

    background: #1f2022;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    #empresaRoutesMap {
        height: 220px;
        border-radius: 14px;
    }

    #empresaRoutesMap .leaflet-control-zoom {
        margin-right: 10px !important;
        margin-bottom: 10px !important;
    }

    #empresaRoutesMap .leaflet-control-zoom a {
        width: 36px !important;
        height: 36px !important;
        font-size: 19px !important;
    }
}

/* =========================================================
   UBICACIÓN EMPRESA - CARD
   ========================================================= */

.empresa-location-card {
    padding: 18px;
    border: 1px solid var(--bs-border-color);
    border-radius: 24px;
    background: var(--bs-body-bg);
}

.empresa-location-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.empresa-location-head-main {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-width: 0;
    flex: 1;
}

.empresa-location-icon {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: #f6efdf;
    color: var(--aizu-gold);
    font-size: 22px;
}

.empresa-location-copy {
    min-width: 0;
    flex: 1;
}

.empresa-location-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.empresa-location-title {
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.2;
    color: var(--bs-body-color);
}

.empresa-location-info-btn {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    padding: 0;
    transition: background .18s ease, color .18s ease;
}

.empresa-location-info-btn:hover {
    background: #f3f4f6;
    color: #111827;
}

.empresa-location-desc {
    color: #5f6672;
    font-size: .97rem;
    line-height: 1.45;
}

.empresa-location-desc-mobile {
    display: none;
}

#btn-empresa-gps {
    min-height: 44px;
    white-space: nowrap;
}

.empresa-location-help {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    margin: 4px 0 14px;
    border-radius: 14px;
    background: #f8f9fb;
    color: #5f6672;
    font-size: .92rem;
    line-height: 1.45;
}

.empresa-location-help i {
    margin-top: 2px;
    color: var(--aizu-gold);
}

.empresa-location-coordinates {
    margin-bottom: 14px;
}

.empresa-location-status {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 12px;
    color: #4b5563;
    font-size: .96rem;
    line-height: 1.4;
}

.empresa-location-status i {
    margin-top: 2px;
    color: var(--aizu-gold);
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .empresa-location-card {
        padding: 14px;
        border-radius: 18px;
    }

    .empresa-location-head {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .empresa-location-head-main {
        gap: 12px;
    }

    .empresa-location-icon {
        width: 50px;
        height: 50px;
        flex: 0 0 50px;
        border-radius: 14px;
        font-size: 19px;
    }

    .empresa-location-title-row {
        gap: 8px;
        margin-bottom: 2px;
    }

    .empresa-location-title {
        font-size: 1rem;
        line-height: 1.18;
    }

    .empresa-location-desc-desktop {
        display: none;
    }

    .empresa-location-desc-mobile {
        display: block;
        font-size: .92rem;
        line-height: 1.38;
    }

    #btn-empresa-gps {
        width: 100%;
        justify-content: center;
        min-height: 46px;
    }

    .empresa-location-coordinates .col-12 {
        width: 100%;
    }

    #empresaRoutesMap {
        height: 220px;
        border-radius: 16px;
    }

    .empresa-location-status {
        font-size: .92rem;
        line-height: 1.35;
    }
}

@media (max-width: 767px) {

    .empresa-location-coordinates {
        margin-top: 14px;
        margin-bottom: 12px;
    }

    .empresa-location-coordinates .form-label {
        font-size: .78rem;
        margin-bottom: 5px !important;
    }

    .empresa-location-coordinates .form-control {
        width: 100%;
        min-width: 0;
        min-height: 44px;

        padding: .55rem .7rem;

        font-size: .82rem;
        font-variant-numeric: tabular-nums;

        border-radius: 12px;
    }
}

/* =========================================================
   MARCADOR EMPRESA - ROUTES
   ========================================================= */

.aizu-company-marker-wrapper {
    background: transparent !important;
    border: 0 !important;
}

.aizu-company-marker {
    position: relative;

    width: 52px;
    height: 60px;

    display: flex;
    justify-content: center;

    filter: drop-shadow(0 7px 10px rgba(0, 0, 0, .24));
}


/* ICONO GENÉRICO */

.aizu-company-marker-icon {
    position: relative;
    z-index: 2;

    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    border: 3px solid #fff;
    border-radius: 50%;

    background: #1f2022;
    color: var(--aizu-gold);

    font-size: 17px;

    box-shadow: 0 2px 5px rgba(0, 0, 0, .12);
}


/* SI EXISTE LOGO */

.aizu-company-marker-icon.has-logo {
    padding: 5px;

    background: #fff;
    border-color: #fff;
}

.aizu-company-marker-logo {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: contain;

    border-radius: 50%;
}


/* FALLBACK SI FALLA EL LOGO */

.aizu-company-marker-fallback {
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #1f2022;
    color: var(--aizu-gold);

    font-size: 17px;
}


/* PUNTA DEL MARCADOR */

.aizu-company-marker-tip {
    position: absolute;

    left: 50%;
    bottom: 3px;

    width: 18px;
    height: 18px;

    transform: translateX(-50%) rotate(45deg);

    border-radius: 2px;

    background: #1f2022;
}

.products-setup-description {
    max-width: none !important;
    width: 100%;
}