/* 
   Gendarmería Nacional Argentina - SIGESAN Theme
   Basado en la paleta Institucional de Bienestar y Sanidad
*/



body {
    background-color: var(--color-background);
    color: #2a3a39;
}

/* Overrides de Identidad */

.nombreSistema {
    
    line-height: 1.15;
    letter-spacing: -0.04rem;
    font-weight: var(--font-weight-bold);
    color: var(--color-primary) !important;
    margin: 0;
    font-size: var(--font-size-4xl);
    text-shadow: 0 1px 0 rgba(255,255,255,.7);
    font-family: 'Inter', sans-serif;

}

.subtitulo {
    margin-top: .55rem;
    font-family: 'Inter', sans-serif;
    font-size: .98rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .08rem;
    color: var(--color-text-secondary);
    text-transform: none;
}


@media (max-width:768px) {
    .nombreSistema {
        font-size: 1.5rem;
    }

    .subtitulo {
        font-size: 1rem;
        letter-spacing: 0.02rem;
    }
}
@media (min-width: 1px) {
    .text-small {
        font-size: var(--font-size-sm) !important;
    }
}

@media (min-width: 580px) {
    .text-small {
        font-size: var(--font-size-xs) !important;
    }
}

.card-body ul {
    list-style: none;
    padding-left: 0;
}

    .card-body ul li {
        margin-bottom: var(--spacing-2);
        color: var(--color-text-primary);
    }

        .card-body ul li::before {
            content: "\2022";
            color: var(--color-primary);
            font-weight: bold;
            display: inline-block;
            width: 1em;
            margin-left: 0;
        }
/* Botones Primarios */
.btn-primary {
    background-color: var(--gna-verde-primario) !important;
    border-color: var(--gna-verde-primario) !important;
    box-shadow: 0 2px 6px rgba(30, 77, 74, 0.3);
    color: #fff !important;
}

.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary:hover {
    background-color: #143533 !important;
    border-color: #143533 !important;
    color: #fff !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Reset global para evitar el "azul" de selección de Stisla/Bootstrap en links y botones */
a:focus,
button:focus,
.btn:focus,
.btn:active,
.btn.active {
    outline: none !important;
    box-shadow: none !important;
}

/* Botones de Acción Secundaria (Cian/Menta) */
.btn-info {
    background-color: var(--gna-verde-menta) !important;
    border-color: var(--gna-verde-menta) !important;
}

/* Alertas y Peligro (Rojo Sanidad) */
.btn-danger {
    background-color: var(--gna-rojo-sanidad) !important;
    border-color: var(--gna-rojo-sanidad) !important;
}

.text-danger {
    color: var(--gna-rojo-sanidad) !important;
}

/* Sidebar e Interfaz Segurizada */
/* .navbar-bg {
    background-color: var(--gna-verde-primario) !important;
} */

/*body.sidebar-mini .main-sidebar:after {
    background-color: var(--gna-verde-primario) !important;
}*/

/* .main-sidebar .sidebar-menu li.active a {
    color: var(--gna-verde-primario) !important;
    background-color: #f0f3f2 !important;
} */

/* .main-sidebar .sidebar-brand a {
    color: var(--gna-verde-primario) !important;
} */

/* Cards y Glassmorphism */
.card {
    border-radius: 12px !important;
    border: none !important;
    box-shadow: var(--gna-sombra-suave) !important;
}

.card.card-primary {
    border-top: 4px solid var(--gna-verde-primario) !important;
}

.login-brand a {
    color: var(--gna-verde-primario) !important;
}

/* Tabs y Navegación */
.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(--gna-verde-primario) !important;
    box-shadow: 0 4px 8px rgba(26, 108, 97, 0.4) !important;
    /* Sombra coherente con el verde primario */
    color: #ffffff !important;
}

.nav-pills .nav-link {
    transition: all 0.3s ease;
}

/* Badges y Beeps */
.beep:after {
    background-color: var(--gna-rojo-sanidad) !important;
}

/* Utilidades */
.text-primary {
    color: var(--gna-verde-primario) !important;
}

.bg-primary {
    background-color: var(--gna-verde-primario) !important;
}

/* Correcciones Adicionales Stisla (Links y Headers) */
a,
.nav-pills .nav-link:not(.active) {
    color: #6c757d;
    /* Gris profesional */
}

a:hover,
.nav-pills .nav-link:not(.active):hover {
    color: #495057;
    /* Gris más oscuro al hacer hover */
}

.card .card-header h4,
.card .card-header h4.step {
    color: #5a6268 !important;
    /* Gris pizarra para los títulos de pasos */
}

.page-item.active .page-link {
    background-color: var(--gna-verde-primario) !important;
    border-color: var(--gna-verde-primario) !important;
}

/**modal */
.hover-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

    .hover-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.08) !important;
    }

.avatar-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    letter-spacing: 0.5px;
}

.space-y-2 > * + * {
    margin-top: 0.5rem;
}

.fs-7 {
    font-size: 0.8rem;
}
/* Forzamos al modal a estar por encima */
.section-header-breadcrumb {
    flex-basis: 0 !important;
    margin-top: 0px !important;
}
/* Modern Modal Styles */
.modal-modern .modal-content {
    border-radius: 18px;
    border: none;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    overflow: hidden;
}

.modal-modern .modal-header {
    background: linear-gradient(135deg, #2c3e50 0%, #000000 100%);
    color: white;
    border-bottom: none;
    padding: 20px 30px;
}

.modal-modern .modal-title {
    font-weight: 700;
    font-size: 1.25rem;
    letter-spacing: 0.5px;
}

.modal-modern .close {
    color: white;
    text-shadow: none;
    opacity: 0.7;
    transition: all 0.3s ease;
}

    .modal-modern .close:hover {
        color: white;
        opacity: 1;
        transform: rotate(90deg);
    }

.modal-modern .modal-body {
    padding: 40px;
    background: #ffffff;
}

.modal-modern .brand-icon {
    background: #f4f6f9;
    width: 80px;
    height: 80px;
    line-height: 80px;
    border-radius: 50%;
    margin: 0 auto 20px;
    color: #2A8C5E;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.modal-modern .info-card {
    background: #f8fafc;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid #edf2f7;
    transition: transform 0.3s ease;
}

    .modal-modern .info-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    }

.modal-modern h6 {
    color: #2d3748;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1px;
    margin-bottom: 10px;
}

.modal-modern p {
    color: #4a5568;
    margin-bottom: 0;
    line-height: 1.6;
}

.modal-modern .badge-version {
    background: #e2e8f0;
    color: #4a5568;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

/* La mayoría de los estilos fueron migrados al design-system.css o limpiados */
/* Estilos específicos que se deban mantener temporalmente irán aquí */

.portal-del {
    font-family: 'Montserrat', var(--font-family-base);
    font-size: 14px;
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 2px;
}

.paciente {
    font-family: 'Montserrat', var(--font-family-base);
    font-size: 22px;
    font-weight: 900;
    color: var(--color-primary);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    line-height: 1.05;
}

.accent {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 18px;
}

.accent-line {
    width: 48px;
    height: 2px;
    border-radius: 1px;
    background: linear-gradient(90deg, transparent, var(--color-border));
}

    .accent-line.right {
        background: linear-gradient(90deg, var(--color-border), transparent);
    }

.accent-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--color-primary);
    opacity: 0.8;
}

/*  .modal-backdrop {
            z-index: 1050 !important;
        } */