/*
 * Header y sidebar moderno / corporativo
 * Colores controlados por variables --brand / --brand-dark / --brand-soft
 * (definidas inline en layout.php según cliente)
 */

.main-header .navbar {
    background: var(--brand) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.14);
}

.main-header .logo {
    background: var(--brand) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    letter-spacing: 0.4px;
}

.main-header .logo:hover {
    background: var(--brand) !important;
}

.main-header .logo .fa-ambulance {
    font-size: 18px;
}

.main-header .logo b {
    font-weight: 700;
}

.main-header .logo b small {
    font-weight: 400;
    opacity: 0.7;
    font-size: 65%;
}

.main-header .sidebar-toggle {
    border-radius: 8px;
    transition: background 0.15s ease;
}

.main-header .sidebar-toggle:hover,
.main-header .sidebar-toggle:focus {
    background: rgba(255, 255, 255, 0.14) !important;
    color: #fff;
}

/* Selector de EPS */
.main-header .select-eps {
    margin-top: 9px;
    margin-left: 6px;
    max-width: 280px;
}

.main-header .select-eps .input-group-addon {
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-right: none;
    color: #fff;
    border-radius: 20px 0 0 20px;
    font-size: 12px;
    font-weight: 600;
}

.main-header .select-eps .form-control {
    background: rgba(255, 255, 255, 0.16) !important;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-left: none;
    color: #fff !important;
    border-radius: 0 20px 20px 0;
    box-shadow: none;
}

.main-header .select-eps .form-control:focus {
    border-color: rgba(255, 255, 255, 0.5);
}

@media (max-width: 767px) {
    .main-header .select-eps {
        display: none;
    }
}

/* Copia del selector de Cliente (EPS) dentro del menu lateral, solo para
   movil -- en el header angosto de movil no cabe (ver regla de arriba que
   lo oculta ahi). Se muestra al abrir el menu hamburguesa, justo debajo
   del usuario y antes de las opciones de menu. */
.select-eps-sidebar {
    display: none;
}
@media (max-width: 767px) {
    .select-eps-sidebar {
        display: block;
        padding: 0 15px 14px;
        margin-bottom: 8px;
        border-bottom: 1px solid #eef1f5;
    }
    .select-eps-sidebar label {
        display: block;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
        color: #8a94a6;
        margin-bottom: 5px;
    }
    .select-eps-sidebar select {
        height: 42px;
        font-size: 14px;
    }
}

/* Notificaciones y usuario */
.main-header .navbar-nav>li>a {
    transition: background 0.15s ease;
}

.main-header .navbar-nav>.notifications-menu>a {
    border-radius: 10px;
}

.main-header .navbar-nav>.user-menu>a {
    border-radius: 10px;
}

.main-header .navbar-nav>li>a:hover,
.main-header .navbar-nav>li>a:focus,
.main-header .navbar-nav>li.open>a {
    background: rgba(255, 255, 255, 0.14) !important;
}

.main-header .navbar-nav>.user-menu .user-image {
    border: 2px solid rgba(255, 255, 255, 0.5);
}

.main-header .navbar-nav .fa-angle-down {
    font-size: 11px;
    opacity: 0.85;
    margin-left: 2px;
}

/* Dropdowns */
.navbar-nav>.notifications-menu>.dropdown-menu,
.navbar-nav>.user-menu>.dropdown-menu {
    border: none;
    border-radius: 12px;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.18);
    overflow: hidden;
    margin-top: 12px;
}

.navbar-nav>.notifications-menu>.dropdown-menu>li.header {
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
    color: #fff;
    font-weight: 600;
    border-bottom: none;
}

.navbar-nav>.notifications-menu>.dropdown-menu>li.footer>a {
    font-weight: 600;
    color: var(--brand) !important;
}

.navbar-nav>.user-menu>.dropdown-menu>li.user-header {
    height: auto;
    padding: 24px 10px 18px;
    background: linear-gradient(135deg, var(--brand) 0%, var(--brand-dark) 100%);
}

.navbar-nav>.user-menu>.dropdown-menu>li.user-header>img {
    height: 72px;
    width: 72px;
    border: 3px solid rgba(255, 255, 255, 0.5);
}

.navbar-nav>.user-menu>.dropdown-menu>li.user-header>p {
    font-size: 15px;
    font-weight: 600;
    margin-top: 12px;
}

.navbar-nav>.user-menu>.dropdown-menu>.user-footer {
    background: #fff;
    padding: 12px;
}

.navbar-nav>.user-menu>.dropdown-menu>.user-footer .btn-default {
    border-radius: 20px;
    border-color: #e3e6ec;
    font-weight: 600;
}

.navbar-nav>.user-menu>.dropdown-menu>.user-footer .btn-default:hover {
    background: var(--brand-soft) !important;
    border-color: var(--brand);
    color: var(--brand-dark);
}

/* ==========================================================================
   Sidebar
   ========================================================================== */

.main-sidebar {
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.05);
}

.user-panel {
    padding: 16px 14px 14px;
    border-bottom: 1px solid #eef1f5;
    margin-bottom: 8px;
}

.user-panel>.image>img {
    border: 2px solid var(--brand-soft);
    padding: 2px;
}

.user-panel>.info {
    padding-top: 8px;
}

.user-panel>.info>p {
    font-weight: 700;
}

.user-panel>.info div {
    color: inherit !important;
    opacity: 0.65;
}

.sidebar-menu {
    padding: 0 10px;
}

.sidebar-menu>li {
    margin-bottom: 3px;
}

.sidebar-menu>li>a {
    border-radius: 10px;
    padding: 11px 12px;
    transition: background 0.15s ease, color 0.15s ease;
    white-space: normal;
    line-height: 1.3;
}

.sidebar-menu>li.treeview>a {
    padding-right: 30px;
}

.sidebar-menu>li.active>a,
.sidebar-menu>li.menu-open>a {
    border-left: none !important;
    box-shadow: 0 4px 12px var(--brand-soft);
}

.sidebar-menu>li.active>a>.fa,
.sidebar-menu>li.active>a>.glyphicon,
.sidebar-menu>li.active>a>.ion {
    color: #fff !important;
}

.sidebar-menu>li>a>.fa,
.sidebar-menu>li>a>.glyphicon,
.sidebar-menu>li>a>.ion {
    width: 22px;
    text-align: center;
}

.sidebar-menu li>a>.fa-angle-left {
    right: 14px;
}

.sidebar-menu .treeview-menu {
    padding-left: 14px;
    margin: 2px 0 3px;
}

.sidebar-menu .treeview-menu>li>a {
    border-radius: 8px;
    padding: 8px 10px;
    margin: 1px 0;
    white-space: normal;
    line-height: 1.3;
}

.sidebar-menu .treeview-menu>li.treeview>a {
    padding-right: 26px;
}

.sidebar-menu .treeview-menu>li>a>.fa:not(.fa-angle-left),
.sidebar-menu .treeview-menu>li>a>.glyphicon,
.sidebar-menu .treeview-menu>li>a>.ion {
    width: 20px;
    text-align: center;
}

/* Modo colapsado (solo iconos): volver a la alineación original de AdminLTE */
@media (min-width: 768px) {
    .sidebar-mini.sidebar-collapse .sidebar-menu {
        padding: 0;
    }

    .sidebar-mini.sidebar-collapse .sidebar-menu>li>a {
        padding: 12px 5px 12px 15px;
        border-radius: 0;
        margin: 0;
        box-shadow: none;
    }
}

/* ==========================================================================
   Footer
   ========================================================================== */

.main-footer {
    background: #fff;
    border-top: 3px solid var(--brand);
    padding: 12px 20px;
    color: #6b7280;
    font-size: 13px;
}

.main-footer strong {
    color: #2b2f33;
}