/* ==================== HEADER ==================== */
/* Header fijo arriba: solo el contenido hace scroll */
.main-header {
    background: linear-gradient(90deg, #4B1C71, #6D28D9) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    z-index: 1030 !important;
}

/* Contenido empuja hacia abajo para no quedar bajo el header fijo */
.content-wrapper {
    padding-top: 88px !important;
}

/* Mobile: header de 60px fijo, padding mínimo */
@media (max-width: 767px) {
    .content-wrapper {
        padding-top: 70px !important;
    }
}

.main-header .navbar,
.main-header .logo {
    background: transparent !important;
}

.main-header .navbar .nav > li > a,
.main-header .navbar .sidebar-toggle {
    color: #FFF !important;
}

.main-header .navbar .nav > li > a:hover,
.main-header .navbar .sidebar-toggle:hover {
    color: #EDE9FE !important;
    background-color: transparent !important;
}

.main-header .sidebar-toggle {
    z-index: 1031 !important;
    position: relative;
}

.main-header .sidebar-toggle:before {
    content: "" !important;
}

body.sidebar-open .main-header,
body.overflow-hidden .main-header {
    -webkit-transform: none !important;
    transform: none !important;
}

/* ==================== HEADER SKINS ==================== */
.skin-black .main-header, 
.skin-black-light .main-header {
  color: #525f7f !important;
}

.skin-black .main-header .navbar .nav .open>a {
  color: #999 !important;
}

.skin-black .main-header .navbar .nav>li>a:hover{
  color: #999 !important;
}

.skin-black .main-header .navbar > .sidebar-toggle:hover {
  color: #999 !important;
}

/* ==================== HEADER RESPONSIVE ==================== */
@media (max-width: 767px) {
    /* ── UNA SOLA FILA EN MÓVIL ─────────────────────────────────
       [≡] [clock?] [pill: scroll →]  [🔔👤]
       header-icons-wrap ocupa el espacio restante con scroll oculto.
    ──────────────────────────────────────────────────────────── */
    .main-header .navbar-custom-menu {
        float: none !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        flex-grow: 1 !important;
        align-items: center !important;
        height: 60px !important;
        padding: 0 6px !important;
        gap: 4px !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    .main-header .navbar-custom-menu .dropdown-menu {
        left: auto !important;
    }

    .skin-blue-light .main-header .navbar .dropdown-menu li a {
        color: #777;
    }

    .main-header .navbar {
        height: 60px !important;
        display: flex !important;
        align-items: center !important;
        padding: 0 !important;
    }
}
