/**
 * INDeweb — capa visual (admin + auth).
 * Paleta alineada al logo: navy profundo, teal, acento cielo.
 * Carga después de skin-blue (u otros skins); prioriza .skin-blue.
 */
:root {
    --inde-navy: #061a2e;
    --inde-navy-mid: #0c3550;
    --inde-navy-soft: #134060;
    --inde-teal: #3d8f88;
    --inde-teal-hover: #4fb3a8;
    --inde-sky: #6eb4d6;
    --inde-sky-soft: #a8d4ef;
    --inde-surface: #eef2f7;
    --inde-elevated: #ffffff;
    --inde-text: #14232f;
    --inde-muted: #5a6f7f;
    --inde-border: rgba(10, 35, 71, 0.08);
    --inde-radius: 12px;
    --inde-radius-sm: 8px;
    --inde-shadow: 0 1px 2px rgba(10, 35, 71, 0.04), 0 8px 24px rgba(10, 35, 71, 0.06);
    --inde-shadow-hover: 0 4px 12px rgba(10, 35, 71, 0.08), 0 16px 40px rgba(10, 35, 71, 0.08);
    --inde-font-display: "Outfit", "Segoe UI", system-ui, sans-serif;
    --inde-font-body: "DM Sans", "Segoe UI", system-ui, sans-serif;
}

/* ——— Tipografía base (admin) ——— */
.skin-blue,
.skin-blue .main-sidebar,
.skin-blue .content-wrapper,
.skin-blue .wrapper {
    font-family: var(--inde-font-body);
    color: var(--inde-text);
    -webkit-font-smoothing: antialiased;
}

.skin-blue .main-header .logo,
.skin-blue .content-header > h1,
.skin-blue .content-header > h1 > small,
.skin-blue .sidebar-menu > li > a,
.skin-blue .sidebar-menu > li.header,
.skin-blue .box .box-title,
.skin-blue .nav-tabs-custom > .nav-tabs > li > a {
    font-family: var(--inde-font-display);
    letter-spacing: 0.01em;
}

.skin-blue .content-header > h1 {
    font-weight: 600;
    color: var(--inde-navy);
}

.skin-blue .content-header > h1 > small {
    font-weight: 400;
    color: var(--inde-muted);
}

/* ——— Cabecera superior ——— */
.skin-blue .main-header .navbar {
    background: linear-gradient(105deg, var(--inde-navy-mid) 0%, #15607a 52%, var(--inde-teal-hover) 100%);
    border: 0;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset;
}

.skin-blue .main-header .navbar .nav > li > a {
    font-weight: 500;
    letter-spacing: 0.02em;
}

.skin-blue .main-header .logo {
    background: linear-gradient(180deg, var(--inde-navy) 0%, var(--inde-navy-mid) 100%);
    color: #fff;
    border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.skin-blue .main-header .logo:hover {
    background: linear-gradient(180deg, #071f38 0%, #0f3d5c 100%);
}

.skin-blue .main-header li.user-header {
    background: linear-gradient(135deg, var(--inde-navy-mid), #1a6b7a);
}

.skin-blue.layout-top-nav .main-header > .logo {
    background: linear-gradient(105deg, var(--inde-navy-mid) 0%, #15607a 55%, var(--inde-teal) 100%);
}

.skin-blue.layout-top-nav .main-header > .logo:hover {
    filter: brightness(1.05);
}

.skin-blue .navbar-search-form .tt-menu h3 {
    background: rgba(110, 180, 214, 0.2);
    color: var(--inde-navy);
}

.skin-blue .navbar-search-form .tt-menu .tt-suggestion:hover,
.skin-blue .navbar-search-form .tt-menu .tt-suggestion.tt-cursor {
    background-color: var(--inde-teal);
}

/* ——— Sidebar ——— */
.skin-blue .wrapper,
.skin-blue .main-sidebar,
.skin-blue .left-side {
    background: linear-gradient(180deg, #0a1624 0%, #0d1f2e 40%, #0f2433 100%);
}

.skin-blue .sidebar-menu > li.header {
    color: rgba(168, 212, 239, 0.55);
    background: rgba(0, 0, 0, 0.22);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 600;
}

.skin-blue .sidebar a {
    color: rgba(210, 226, 235, 0.82);
}

.skin-blue .sidebar-menu > li > a {
    border-radius: 0 var(--inde-radius-sm) var(--inde-radius-sm) 0;
    margin-right: 8px;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

.skin-blue .sidebar-menu > li:hover > a,
.skin-blue .sidebar-menu > li.active > a {
    background: rgba(77, 161, 150, 0.12);
    border-left-color: var(--inde-teal-hover) !important;
    color: #fff;
}

.skin-blue .sidebar-menu > li > .treeview-menu {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 0 var(--inde-radius-sm) var(--inde-radius-sm) 0;
}

.skin-blue .treeview-menu > li > a {
    color: rgba(184, 199, 206, 0.85);
}

.skin-blue .treeview-menu > li.active > a,
.skin-blue .treeview-menu > li > a:hover {
    color: #fff;
}

.skin-blue .user-panel > .info,
.skin-blue .user-panel > .info > a {
    color: rgba(255, 255, 255, 0.92);
}

/* ——— Área de contenido ——— */
.skin-blue .content-wrapper,
.skin-blue .right-side {
    background: var(--inde-surface);
}

.skin-blue .content {
    padding-top: 22px;
}

.skin-blue .box {
    border: 1px solid var(--inde-border);
    border-radius: var(--inde-radius);
    box-shadow: var(--inde-shadow);
    overflow: hidden;
    transition: box-shadow 0.22s ease, border-color 0.22s ease;
}

.skin-blue .box:hover {
    box-shadow: var(--inde-shadow-hover);
    border-color: rgba(77, 161, 150, 0.2);
}

.skin-blue .box.box-solid.box-primary > .box-header {
    background: linear-gradient(90deg, var(--inde-navy-mid), #1a6b7a) !important;
}

.skin-blue .box-header.with-border {
    border-bottom-color: var(--inde-border);
    background: var(--inde-elevated);
}

.skin-blue .box-header .box-title {
    font-weight: 600;
    color: var(--inde-navy);
}

.skin-blue .box-footer {
    background: rgba(238, 242, 247, 0.6);
    border-top-color: var(--inde-border);
}

/* ——— Botones primarios ——— */
.skin-blue .btn-primary {
    background: linear-gradient(180deg, var(--inde-teal-hover) 0%, var(--inde-teal) 100%);
    border-color: #2f7a73;
    font-family: var(--inde-font-display);
    font-weight: 600;
    letter-spacing: 0.03em;
    border-radius: var(--inde-radius-sm);
    box-shadow: 0 2px 6px rgba(61, 143, 136, 0.35);
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.skin-blue .btn-primary:hover,
.skin-blue .btn-primary:focus {
    background: linear-gradient(180deg, #5ac4b8 0%, var(--inde-teal-hover) 100%);
    border-color: #3a9a91;
    filter: brightness(1.02);
    box-shadow: 0 4px 14px rgba(61, 143, 136, 0.45);
}

.skin-blue .btn-default {
    border-radius: var(--inde-radius-sm);
    border-color: rgba(10, 35, 71, 0.12);
}

.skin-blue .form-control {
    border-radius: var(--inde-radius-sm);
    border-color: rgba(10, 35, 71, 0.12);
    box-shadow: none;
}

.skin-blue .form-control:focus {
    border-color: var(--inde-teal);
    box-shadow: 0 0 0 3px rgba(77, 161, 150, 0.2);
}

/* ——— Tablas ——— */
.skin-blue .table > thead > tr > th {
    border-bottom-color: var(--inde-border);
    font-family: var(--inde-font-display);
    font-weight: 600;
    color: var(--inde-navy-soft);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.skin-blue .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(238, 242, 247, 0.65);
}

/* ——— Footer ——— */
.skin-blue .main-footer {
    border-top: 1px solid var(--inde-border);
    background: var(--inde-elevated);
    color: var(--inde-muted);
    font-size: 13px;
}

/* ——— Login / registro (sin clase skin) ——— */
.login-page,
.register-page {
    font-family: var(--inde-font-body);
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
    background: linear-gradient(145deg, #040f1c 0%, #0a2347 55%, #0e4a5c 100%);
}

.login-page .bg-image,
.register-page .bg-image {
    background: none;
    background-image:
        radial-gradient(ellipse 90% 60% at 15% 20%, rgba(110, 180, 214, 0.35), transparent 55%),
        radial-gradient(ellipse 70% 50% at 85% 80%, rgba(77, 161, 150, 0.25), transparent 50%),
        linear-gradient(145deg, #040f1c 0%, #0a2347 38%, #0e4a5c 72%, #134f62 100%);
}

.login-page .login-box,
.register-page .login-box,
.login-page .register-box,
.register-page .register-box {
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: -12px 0 48px rgba(6, 26, 46, 0.18);
    border-left: 1px solid rgba(255, 255, 255, 0.5);
}

.login-page .login-logo,
.register-page .login-logo,
.login-page .register-logo,
.register-page .register-logo {
    text-align: center;
}

.login-page .login-box-msg,
.register-page .login-box-msg,
.login-page .register-box-msg,
.register-page .register-box-msg {
    color: var(--inde-muted);
    font-weight: 500;
}

.login-page .login-box-body .form-control,
.register-page .register-box-body .form-control,
.login-page .register-box-body .form-control {
    border-radius: var(--inde-radius-sm);
    height: 42px;
    border-color: rgba(10, 35, 71, 0.12);
}

.login-page .btn-primary,
.register-page .btn-primary {
    background: linear-gradient(180deg, var(--inde-teal-hover) 0%, var(--inde-teal) 100%);
    border: 0;
    border-radius: var(--inde-radius-sm);
    font-family: var(--inde-font-display);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: none;
    box-shadow: 0 4px 14px rgba(61, 143, 136, 0.4);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.login-page .btn-primary:hover,
.register-page .btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(61, 143, 136, 0.5);
}

.login-page a,
.register-page a {
    color: var(--inde-navy-soft);
    font-weight: 500;
}

.login-page a:hover,
.register-page a:hover {
    color: var(--inde-teal);
}

.login-page .register-box-footer p,
.login-page .login-box-footer p,
.register-page .register-box-footer p {
    color: var(--inde-muted);
    font-size: 13px;
}

/* Ajuste logo auth (ya definido en LaraAdmin; refuerzo) */
.login-logo .inde-brand-logo--auth,
.register-logo .inde-brand-logo--auth {
    max-height: 76px;
}

/* ——— Breadcrumb ——— */
.skin-blue .breadcrumb {
    background: transparent;
    padding-left: 0;
}

.skin-blue .breadcrumb > li + li:before {
    color: rgba(90, 111, 127, 0.5);
}

.skin-blue .breadcrumb > .active {
    color: var(--inde-muted);
}

/* ——— Alerts ——— */
.skin-blue .alert-success {
    border-radius: var(--inde-radius-sm);
    border: 0;
    background: rgba(77, 161, 150, 0.12);
    color: #1e4d47;
}

.skin-blue .alert-danger {
    border-radius: var(--inde-radius-sm);
    border: 0;
}

/* ——— Paginación / pagers ——— */
.skin-blue .pagination > .active > a,
.skin-blue .pagination > .active > span {
    background: var(--inde-teal);
    border-color: #2f7a73;
}