/* =========================================================
   Tema SFE para Orchid – versión limpia
========================================================= */

/* Paleta */
:root{
    --sfe-primary:#293854;
    --sfe-primary-600:#27324a;
    --sfe-primary-700:#1f2a3f;
    --sfe-accent:#D3A23B;
    --sfe-accent-700:#8B7545;
    --sfe-base:#F5F7FA;
    --sfe-surface:#ffffff;
    --sfe-muted:#8b95a5;
    --sfe-line:#E6E9EF;
    --sfe-text:#101623;
}

/* Base */
body, .text-dark{ color:var(--sfe-text) !important; }
.bg-light, .bg-gray-100{ background-color:var(--sfe-base) !important; }

/* =========================================================
   Sidebar / Navbar
========================================================= */
.aside, .navbar.navbar-dark, .bg-dark{
    background-color:var(--sfe-primary) !important;
    color:#fff !important;
}
.navbar .nav-link, .aside .nav-link{ color:#e9edf5 !important; }
.navbar .nav-link:hover, .aside .nav-link:hover{ color:var(--sfe-accent) !important; }
.aside .nav-item.active > .nav-link, .aside .nav-link.active{
    background-color:var(--sfe-primary-700) !important;
    color:#fff !important;
    border-radius:.5rem;
}
.aside .nav-link .icon{ filter:brightness(1.3); }
.aside hr, .aside .divider{ border-color:rgba(255,255,255,.1) !important; }
.navbar .badge{ background-color:var(--sfe-accent) !important; color:#222 !important; }

/* ===== Brand/Header: “SFE” SIEMPRE BLANCO (incluye SVG con currentColor) */
.navbar .navbar-brand,
.navbar .navbar-brand *,
.aside .navbar-brand,
.aside .navbar-brand *,
.navbar .h2, .navbar .h2 *,
.aside .h2, .aside .h2 *{
    color:#fff !important;
    fill:#fff !important;
}

/* =========================================================
   Breadcrumbs / Títulos
========================================================= */
.breadcrumb .breadcrumb-item a{ color:var(--sfe-primary) !important; }
.breadcrumb .breadcrumb-item.active{ color:var(--sfe-muted) !important; }
.h2, h2, .display-6, .display-5, .page-header, .screen-header{ color:var(--sfe-primary) !important; }

/* =========================================================
   Cards / Contenedores
========================================================= */
.card{
    background-color:var(--sfe-surface) !important;
    border:1px solid var(--sfe-line) !important;
    box-shadow:0 6px 14px rgba(0,0,0,.04) !important;
    border-radius:.8rem !important;
}
.card-header{
    background:#fff !important;
    border-bottom:1px solid var(--sfe-line) !important;
    color:var(--sfe-primary);
    font-weight:600;
}

/* =========================================================
   Tablas (cabecera navy, texto SIEMPRE blanco)
========================================================= */
.table{ border-color:var(--sfe-line) !important; }
.table thead th{
    background-color:var(--sfe-primary) !important;
    border-color:var(--sfe-primary) !important;
    font-weight:600 !important;
}
.table thead th,
.table thead th *{
    color:#fff !important;
    fill:#fff !important;
}
.table tbody tr:nth-child(odd){ background-color:#fafbfd !important; }
.table tbody tr:hover{ background-color:#eef2f7 !important; }

/* =========================================================
   Botones
========================================================= */
.btn-primary{
    background-color:var(--sfe-primary) !important;
    border-color:var(--sfe-primary) !important;
    color:#fff !important;
}
.btn-primary:hover{ background-color:var(--sfe-primary-600) !important; }

.btn-outline-primary{
    color:var(--sfe-primary) !important;
    border-color:var(--sfe-primary) !important;
}
.btn-outline-primary:hover{
    background-color:var(--sfe-primary) !important;
    color:#fff !important;
}

.btn-warning, .badge.bg-warning{
    background-color:var(--sfe-accent) !important;
    border-color:var(--sfe-accent) !important;
    color:#222 !important;
}
.btn-warning:hover{
    background-color:var(--sfe-accent-700) !important;
    border-color:var(--sfe-accent-700) !important;
}

.btn-light{ color:var(--sfe-primary) !important; }
.btn-link{ color:var(--sfe-primary) !important; }
.btn-link:hover{ text-decoration:underline !important; color:var(--sfe-primary-600) !important; }

/* =========================================================
   Formularios / Inputs
========================================================= */
.form-control, .form-select, .tox-tinymce{
    border:1px solid var(--sfe-line) !important;
    background-color:#fff !important;
    color:var(--sfe-text) !important;
    border-radius:.6rem !important;
}
.form-control:focus, .form-select:focus, textarea:focus, .tox-tinymce:focus{
    border-color:var(--sfe-accent) !important;
    box-shadow:0 0 0 .2rem rgba(211,162,59,.25) !important;
}
.form-label, label{ color:#445065 !important; }
.form-check-input:checked{
    background-color:var(--sfe-primary) !important;
    border-color:var(--sfe-primary) !important;
}
/* choices.js select */
.is-open .choices__list--dropdown{ border-color:var(--sfe-accent) !important; }
.choices__item--selectable.is-highlighted{ background-color:#f9f2df !important; color:#222 !important; }

/* =========================================================
   Modales
========================================================= */
.modal-content{ border:1px solid var(--sfe-line) !important; border-radius:.8rem !important; }
.modal-header{ border-bottom:1px solid var(--sfe-line) !important; background:#fff !important; color:var(--sfe-primary) !important; font-weight:600; }
.modal-footer{ border-top:1px solid var(--sfe-line) !important; }

/* =========================================================
   Alertas / Toasts
========================================================= */
.toast, .alert{ border-radius:.6rem !important; }
.alert-info{ background:#e9eef6 !important; color:#2b3a55 !important; }
.alert-success{ background:#e5f6ee !important; color:#1b6b46 !important; }
.alert-warning{ background:#fdf4e0 !important; color:#7a5a18 !important; }
.alert-danger{ background:#fdeceb !important; color:#7a1f1b !important; }

/* =========================================================
   Login
========================================================= */
body.login, .login .bg-dark{
    background:linear-gradient(160deg, var(--sfe-primary) 0%, var(--sfe-primary-700) 100%) !important;
}
.login .card{
    border-top:4px solid var(--sfe-accent) !important;
    box-shadow:0 18px 40px rgba(0,0,0,.25) !important;
}
.login .btn-primary{
    background-color:var(--sfe-accent) !important;
    border-color:var(--sfe-accent) !important;
    color:#222 !important;
}
.login .btn-primary:hover{
    background-color:var(--sfe-accent-700) !important;
    border-color:var(--sfe-accent-700) !important;
}

/* =========================================================
   Misceláneo
========================================================= */
a, .text-primary{ color:var(--sfe-primary) !important; }
a:hover, .text-primary:hover{ color:var(--sfe-primary-600) !important; }

.aside .nav-title{
    color:#c7cfdd !important;
    text-transform:uppercase;
    letter-spacing:.04em;
    font-size:.78rem;
}


.profile-container {
    background: linear-gradient(135deg, var(--sfe-primary-700), var(--sfe-accent));
    color: #fff !important;
    border-radius: 0.9rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
    overflow: hidden;
    position: relative;
    will-change: transform, box-shadow, background;

    /* Suavidad total */
    transition:
        transform 0.4s cubic-bezier(0.25, 1, 0.5, 1),
        box-shadow 0.4s ease,
        background 0.8s ease;
}

/* Sutil brillo que aparece progresivamente */
.profile-container::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.18), transparent 60%);
    opacity: 0;
    transition: opacity 0.6s ease;
}

.profile-container:hover::before {
    opacity: 1;
}

/* Hover fluido */
.profile-container:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 10px 24px rgba(0,0,0,0.35);
    background: linear-gradient(135deg, var(--sfe-accent-700), var(--sfe-primary-600));
}

/* Avatar con animación más natural */
.profile-container img.avatar {
    border: 2px solid rgba(255, 255, 255, 0.85);
    border-radius: 50%;
    transition:
        border-color 0.4s ease,
        transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

.profile-container:hover img.avatar {
    border-color: var(--sfe-accent);
    transform: scale(1.06);
}

/* Texto claro y suave */
.profile-container small span {
    color: #fff !important;
    text-shadow: 0 1px 3px rgba(0,0,0,0.25);
}

.profile-container small span.text-muted {
    color: rgba(255,255,255,0.75) !important;
}




/* Scrollbar sutil */
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{ background:#aeb6c3; border-radius:6px; }
*::-webkit-scrollbar-thumb:hover{ background:#94a0b2; }