
/* =========================================================
   MULTIKA — SATIN PRO 2026
   Rediseño global SIN efecto liquid.
   Más contraste, menos blanco, más presencia visual.
   ========================================================= */

:root{
    --mk-ink:#26384a;
    --mk-text:#3f5368;
    --mk-muted:#718296;

    --mk-navy:#2f4b66;
    --mk-steel:#4f6f8e;
    --mk-blue:#5e8fb8;
    --mk-sky:#8eb9d8;

    --mk-teal:#4f9d98;
    --mk-mint:#7fc2b8;

    --mk-violet:#776da8;
    --mk-lav:#a49acb;

    --mk-gold:#c7a85c;
    --mk-gold-light:#dec883;

    --mk-slate:#657488;
    --mk-graphite:#485667;

    --mk-bg:#dde5ec;
    --mk-bg-soft:#e7edf2;
    --mk-surface:#edf2f6;
    --mk-surface-2:#e4ebf0;
    --mk-border:#c6d1db;

    --mk-shadow:0 10px 28px rgba(37,53,70,.12);
    --mk-shadow-hover:0 14px 34px rgba(37,53,70,.17);
}

/* =========================================================
   BASE GLOBAL
   ========================================================= */

html,body{
    background:var(--mk-bg)!important;
    color:var(--mk-text)!important;
}

.public-site,
.admin-site,
.aula-site{
    background:
        linear-gradient(180deg,#e3eaf0 0%,#d9e2e9 100%)!important;
    color:var(--mk-text)!important;
}

/* Quitar transparencias, blur y pseudo efectos liquid */
.public-site *,
.admin-site *,
.aula-site *{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}

button::before,
button::after,
.btn::before,
.btn::after,
[class*="btn-"]::before,
[class*="btn-"]::after,
a[class*="btn-"]::before,
a[class*="btn-"]::after,
.auth-submit::before,
.auth-submit::after,
.nav-pill::before,
.nav-pill::after,
.certificate-btn::before,
.certificate-btn::after{
    display:none!important;
}

/* =========================================================
   BOTONES GLOBALES — SÓLIDOS Y MODERNOS
   ========================================================= */

button:not(.hamburger):not(.password-toggle),
input[type="submit"],
input[type="button"],
.btn,
[class*="btn-"],
a[class*="btn-"],
.auth-submit,
.nav-pill,
.certificate-btn{
    border:1px solid rgba(38,56,74,.10)!important;
    border-radius:12px!important;
    box-shadow:0 6px 16px rgba(41,58,76,.12)!important;
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        filter .18s ease!important;
    font-weight:700!important;
    text-decoration:none!important;
}

button:not(.hamburger):not(.password-toggle):hover,
.btn:hover,
[class*="btn-"]:hover,
a[class*="btn-"]:hover,
.auth-submit:hover,
.nav-pill:hover,
.certificate-btn:hover{
    transform:translateY(-1px)!important;
    box-shadow:0 10px 22px rgba(41,58,76,.16)!important;
    filter:brightness(1.04)!important;
}

/* Azul: crear, editar, guardar */
.admin-site :is(
    .editar,.btn-crear-curso,.btn-crear-leccion,.btn-crear-modulo,
    .btn-crear-exam,.btn-crear-pregunta,.btn-crear-usuario,
    .btn-editar-pregunta,.btn-primary,.btn-outline-primary,
    .btn-guardar,.btn-modal-guardar,.btn-editor,.btn-agregar-firma,
    .btn-asignar-cursos,.usuario-btn,.btn-icon
),
.public-site :is(
    .auth-submit,.nav-pill-primary,.btn-primary,.btn-gradient,
    .btn-login,.vivid-btn-main
){
    background:#5c88b2!important;
    color:#fff!important;
}

/* Eliminar: grafito azulado, sin rojo */
.admin-site :is(
    .eliminar,.btn-eliminar-pregunta,.btn-danger,.btn-outline-danger,
    .btn-delete,.btn-eliminar
),
.aula-site :is(.btn-danger,.btn-delete,.btn-eliminar){
    background:#536273!important;
    color:#fff!important;
}

/* Módulos / éxito: turquesa */
.admin-site :is(.btn-modulos,[class*="btn-modulo"]),
.aula-site :is(.btn-complete,.btn-success){
    background:#4f9d98!important;
    color:#fff!important;
}

/* Exámenes: lavanda profunda */
.admin-site :is(
    .btn-examen,[class*="btn-exam"],.examen-volver,.btn-crear-pregunta
),
.aula-site :is(.btn-examen,.btn-siguiente,.btn-finalizar){
    background:#776da8!important;
    color:#fff!important;
}

/* Certificados: dorado sobrio */
.admin-site :is(.btn-certificado,[class*="btn-certif"]),
.aula-site .certificate-btn-print{
    background:#c7a85c!important;
    color:#443919!important;
}

/* Secundarios */
.admin-site :is(
    .btn-cancelar,.btn-modal-cancelar,.btn-secondary,
    .btn-outline-secondary,.btn-volver
),
.aula-site :is(.btn-anterior,.certificate-btn-back){
    background:#c8d2dc!important;
    color:#40566a!important;
}

/* =========================================================
   PÚBLICO
   ========================================================= */

.public-site .public-header{
    background:#dce5ec!important;
}

.public-site .public-nav-wrap{
    background:#e9eef3!important;
    border:1px solid #c7d2dc!important;
    box-shadow:0 8px 24px rgba(41,60,78,.10)!important;
}

.public-site .public-nav>a{
    color:#40566d!important;
}

.public-site .public-nav>a:hover,
.public-site .public-nav>a.active{
    color:#4c789e!important;
}

.public-site .hero-modern,
.public-site .page-hero{
    background:
        linear-gradient(135deg,#e0e8ef 0%,#d3e0e9 50%,#ddd9e9 100%)!important;
}

.public-site .hero-orb,
.public-site .auth-vivid-orb{
    opacity:.28!important;
    filter:none!important;
}

.public-site :is(
    .course-card,.feature-card,.service-card,.glass-card,
    .detail-card,.aside-card,.login-container
){
    background:#edf2f6!important;
    border:1px solid #cbd5de!important;
    box-shadow:0 10px 28px rgba(42,61,79,.10)!important;
}

/* Login / registro */
.public-site .auth-vivid-page{
    background:
        linear-gradient(135deg,#dce6ed 0%,#d5e2e9 48%,#ddd9e7 100%)!important;
}

.public-site .auth-vivid-shell{
    background:#e9eff4!important;
    border:1px solid #c6d1db!important;
    box-shadow:0 18px 50px rgba(42,61,79,.14)!important;
}

.public-site .auth-vivid-showcase{
    background:#4d6b87!important;
}

.public-site .auth-register-showcase{
    background:#4f8586!important;
}

.public-site .auth-input-wrap{
    background:#dfe7ed!important;
    border:1px solid #becbd6!important;
}

.public-site .auth-input-wrap:focus-within{
    border-color:#7196b5!important;
    box-shadow:0 0 0 3px rgba(92,136,178,.14)!important;
}

.public-site .auth-form-meta a,
.public-site .auth-switch a{
    color:#526f8a!important;
}

/* Footer */
.public-site .public-footer{
    background:#cfd9e1!important;
    border-top:1px solid #b8c6d1!important;
    color:#40546a!important;
}

.public-site .public-footer a{
    color:#50677e!important;
}

.public-site .public-footer a:hover{
    color:#365d7c!important;
}

/* =========================================================
   AULA ESTUDIANTE — TEAL / CELESTE
   ========================================================= */

.aula-site{
    background:#dce8eb!important;
}

.aula-site .aula-layout .sidebar{
    background:#b8d9dd!important;
    color:#2e5666!important;
    border-right:1px solid #a9cbd0!important;
    box-shadow:12px 0 28px rgba(44,92,105,.13)!important;
}

.aula-site .sidebar-header{
    border-bottom-color:rgba(47,90,103,.18)!important;
}

.aula-site .sidebar-header h2{
    color:#2d5a6c!important;
}

.aula-site .sidebar-header small{
    color:#557b89!important;
}

.aula-site .perfil{
    background:#c9e0e3!important;
    border:1px solid #afd0d5!important;
    box-shadow:0 6px 16px rgba(43,92,105,.08)!important;
}

.aula-site .avatar{
    background:#e5eef1!important;
    color:#4a7180!important;
}

.aula-site .menu-aula a{
    color:#315f70!important;
}

.aula-site .menu-aula a i{
    background:#cee3e6!important;
    color:#4d7b8b!important;
}

.aula-site .menu-aula a:hover{
    background:#c9e3e5!important;
}

.aula-site .menu-aula .activo{
    background:#4f9d98!important;
    color:#fff!important;
    box-shadow:0 7px 18px rgba(45,116,111,.18)!important;
}

.aula-site .menu-aula .activo i{
    background:rgba(255,255,255,.18)!important;
    color:#fff!important;
}

.aula-site .menu-aula .salir{
    background:#aecbd0!important;
    color:#385b69!important;
}

.aula-site .menu-aula .salir:hover{
    background:#657c8d!important;
    color:#fff!important;
}

.aula-site .btn-menu-aula{
    background:#4f9d98!important;
}

.aula-site .content{
    background:#dfe8ec!important;
}

.aula-site :is(.card,[class*="-card"]){
    background:#e9eff2!important;
    border:1px solid #cad6dc!important;
    box-shadow:0 10px 26px rgba(42,70,82,.09)!important;
}

/* =========================================================
   ADMIN — AZUL ACERO / LAVANDA
   ========================================================= */

.admin-site{
    background:#d8e0e8!important;
}

.admin-site .sidebar-admin{
    background:#455f7d!important;
    color:#f3f6f9!important;
    border-right:1px solid #3c5570!important;
    box-shadow:14px 0 30px rgba(36,53,74,.18)!important;
}

.admin-site .admin-logo small,
.admin-site .admin-perfil span{
    color:#cfdae5!important;
}

.admin-site .admin-perfil{
    background:#506c8b!important;
    border:1px solid #607d9c!important;
}

.admin-site .admin-avatar{
    background:#c8d4e2!important;
    color:#485c77!important;
}

.admin-site .menu-admin a,
.admin-site .menu-dropdown .dropdown-btn,
.admin-site .menu-dropdown .dropdown-btn-firmas{
    color:#edf2f7!important;
}

.admin-site .menu-admin > a i,
.admin-site .menu-dropdown .dropdown-btn > i:first-child,
.admin-site .menu-dropdown .dropdown-btn-firmas > i:first-child{
    background:#587391!important;
    color:#fff!important;
}

.admin-site .menu-admin a:hover,
.admin-site .menu-dropdown .dropdown-btn:hover,
.admin-site .menu-dropdown .dropdown-btn-firmas:hover{
    background:#587391!important;
}

.admin-site .menu-admin .activo,
.admin-site .menu-dropdown.abierto .dropdown-btn,
.admin-site .menu-dropdown.firmas-abierto .dropdown-btn-firmas{
    background:#776da8!important;
    color:#fff!important;
    box-shadow:0 7px 18px rgba(49,45,93,.18)!important;
}

.admin-site .submenu-admin{
    border-left-color:#7188a2!important;
}

.admin-site .submenu-admin a:hover{
    background:#647d9a!important;
}

.admin-site .btn-menu-admin{
    background:#5b7190!important;
}

.admin-site .admin-content{
    background:#dfe6ed!important;
}

.admin-site :is(
    .admin-card,.curso-card,.leccion-card,.modulo-card,
    .card,[class*="-card"],.form-card
){
    background:#edf1f5!important;
    border:1px solid #c8d2dc!important;
    box-shadow:0 10px 26px rgba(41,58,77,.10)!important;
}

.admin-site table{
    background:#eaf0f4!important;
}

.admin-site table thead{
    background:#cfdbe5!important;
    color:#3c5368!important;
}

.admin-site table tbody tr{
    border-color:#cbd5de!important;
}

.admin-site table tbody tr:hover{
    background:#dde7ee!important;
}

/* Formularios */
.admin-site input,
.admin-site select,
.admin-site textarea,
.aula-site input,
.aula-site select,
.aula-site textarea{
    background:#e2e9ef!important;
    border:1px solid #bdc9d4!important;
    color:#344b60!important;
}

.admin-site input:focus,
.admin-site select:focus,
.admin-site textarea:focus,
.aula-site input:focus,
.aula-site select:focus,
.aula-site textarea:focus{
    border-color:#7695b0!important;
    box-shadow:0 0 0 3px rgba(91,125,155,.12)!important;
}

/* =========================================================
   REPRODUCTOR DEL CURSO
   ========================================================= */

.aula-site .course-player{
    background:#dbe6ea!important;
}

.aula-site .course-sidebar{
    background:#e4ecef!important;
    border:1px solid #bfd0d6!important;
    box-shadow:0 14px 36px rgba(44,78,91,.12)!important;
}

.aula-site .course-sidebar-header{
    background:#5d8ca8!important;
}

.aula-site .course-progress{
    background:#dce6ea!important;
}

.aula-site .progress-track{
    background:#c6d4db!important;
}

.aula-site .progress-fill{
    background:#4f9d98!important;
}

.aula-site .certificate-item{
    background:#eadfbf!important;
    border:1px solid #d8c486!important;
}

.aula-site .course-modules{
    background:#dfe8eb!important;
}

.aula-site .course-module{
    background:#e8eef1!important;
    border:1px solid #cad5db!important;
}

.aula-site .module-header{
    background:#6a84a4!important;
}

.aula-site .module-lessons{
    background:#e2eaee!important;
}

.aula-site .lesson-item{
    color:#526b7d!important;
}

.aula-site .lesson-item:hover{
    background:#d7e5ea!important;
}

.aula-site .lesson-item.active{
    background:#cfe3e6!important;
    color:#35687a!important;
    box-shadow:inset 3px 0 0 #4f9d98!important;
}

.aula-site .exam-item{
    background:#ddd8e9!important;
    border:1px solid #c4bdd9!important;
}

.aula-site .lesson-body{
    background:#e9eff2!important;
    border:1px solid #c9d4dc!important;
    box-shadow:0 14px 36px rgba(45,69,88,.10)!important;
}

.aula-site .lesson-video{
    border:1px solid #b9c8d2!important;
}

/* =========================================================
   CERTIFICADO
   ========================================================= */

.aula-site .certificate-page{
    background:#dce5eb!important;
}

.aula-site .certificate-toolbar,
.aula-site .certificate-side-selector{
    background:#e7edf1!important;
    border:1px solid #c4d0d9!important;
    box-shadow:0 10px 28px rgba(43,61,79,.10)!important;
}

.aula-site .certificate-side-btn.active{
    background:#776da8!important;
    color:#fff!important;
}

/* =========================================================
   ESTADOS
   ========================================================= */

.estado-activo,
.text-success{
    color:#397f72!important;
}

.estado-inactivo,
.text-danger,
.badge-danger{
    color:#687788!important;
}

.bg-danger,
.badge-danger{
    background:#687788!important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:900px){
    .admin-site .admin-content,
    .aula-site .content{
        background:#dfe6eb!important;
    }
}

@media(prefers-reduced-motion:reduce){
    button,.btn,[class*="btn-"]{
        transition:none!important;
    }
}


/* =========================================================
   MULTIKA — VIVID PRO
   Más vivo, menos satinado. Colores sólidos y claros.
   ========================================================= */
:root{
    --v-bg:#d9e6ef;
    --v-bg2:#cfdde8;
    --v-surface:#eef4f8;
    --v-surface2:#e4edf3;
    --v-blue:#2f86c9;
    --v-blue2:#4da4df;
    --v-red:#d94f5c;
    --v-red2:#ef6874;
    --v-green:#2fa88b;
    --v-green2:#58bea5;
    --v-purple:#745fc4;
    --v-purple2:#9681dd;
    --v-gold:#ddb84e;
    --v-gold2:#efd276;
    --v-dark:#2c4358;
}

/* Fondo general más vivo */
.public-site,
.admin-site,
.aula-site{
    background:
      radial-gradient(circle at 8% 8%,rgba(77,164,223,.16),transparent 25%),
      radial-gradient(circle at 92% 12%,rgba(150,129,221,.12),transparent 27%),
      linear-gradient(180deg,var(--v-bg) 0%,var(--v-bg2) 100%)!important;
}

/* Tarjetas y paneles con más contraste */
.admin-site :is(.admin-card,.curso-card,.leccion-card,.modulo-card,.card,[class*="-card"],.form-card),
.aula-site :is(.card,[class*="-card"],.lesson-body,.course-sidebar),
.public-site :is(.course-card,.feature-card,.service-card,.glass-card,.detail-card,.aside-card,.login-container){
    background:var(--v-surface)!important;
    border-color:#b8c9d6!important;
    box-shadow:0 10px 24px rgba(42,66,88,.13)!important;
}

/* Crear / Editar / Guardar = AZUL */
.admin-site :is(
    .editar,
    .btn-crear-curso,.btn-crear-leccion,.btn-crear-modulo,.btn-crear-exam,
    .btn-crear-pregunta,.btn-crear-usuario,.btn-editar-pregunta,
    .btn-primary,.btn-outline-primary,.btn-guardar,.btn-modal-guardar,
    .btn-editor,.btn-agregar-firma,.btn-asignar-cursos,.usuario-btn,.btn-icon
),
.public-site :is(.auth-submit,.nav-pill-primary,.btn-primary,.btn-gradient,.btn-login,.vivid-btn-main){
    background:linear-gradient(135deg,var(--v-blue),var(--v-blue2))!important;
    color:#fff!important;
    border-color:#2477b5!important;
}

/* Eliminar y Cancelar = ROJO */
.admin-site :is(
    .eliminar,.btn-eliminar-pregunta,.btn-danger,.btn-outline-danger,
    .btn-delete,.btn-eliminar,.btn-cancelar,.btn-modal-cancelar
),
.aula-site :is(.btn-danger,.btn-delete,.btn-eliminar,.btn-cancelar),
.public-site :is(.btn-cancelar){
    background:linear-gradient(135deg,var(--v-red),var(--v-red2))!important;
    color:#fff!important;
    border-color:#c74250!important;
}

/* Módulos / completar = VERDE */
.admin-site :is(.btn-modulos,[class*="btn-modulo"]),
.aula-site :is(.btn-complete,.btn-success){
    background:linear-gradient(135deg,var(--v-green),var(--v-green2))!important;
    color:#fff!important;
    border-color:#278e77!important;
}

/* Exámenes = MORADO */
.admin-site :is(.btn-examen,[class*="btn-exam"],.examen-volver,.btn-crear-pregunta),
.aula-site :is(.btn-examen,.btn-siguiente,.btn-finalizar){
    background:linear-gradient(135deg,var(--v-purple),var(--v-purple2))!important;
    color:#fff!important;
    border-color:#6653b0!important;
}

/* Certificados = DORADO */
.admin-site :is(.btn-certificado,[class*="btn-certif"]),
.aula-site .certificate-btn-print{
    background:linear-gradient(135deg,var(--v-gold),var(--v-gold2))!important;
    color:#493b13!important;
    border-color:#c8a53f!important;
}

/* Volver/secundarios no cancel = azul gris */
.admin-site :is(.btn-secondary,.btn-outline-secondary,.btn-volver),
.aula-site :is(.btn-anterior,.certificate-btn-back){
    background:#aebfce!important;
    color:#31485c!important;
    border-color:#99adbd!important;
}

/* Sidebars con más vida */
.aula-site .aula-layout .sidebar{
    background:linear-gradient(165deg,#bfe9f4 0%,#82cddd 48%,#68c8b5 100%)!important;
    color:#204f62!important;
    border-right-color:#72b9c7!important;
}
.aula-site .menu-aula .activo{
    background:linear-gradient(135deg,#258ebd,#34aa9a)!important;
    color:#fff!important;
}
.aula-site .btn-menu-aula{
    background:linear-gradient(135deg,#258ebd,#34aa9a)!important;
}

.admin-site .sidebar-admin{
    background:linear-gradient(165deg,#315f91 0%,#4d72ad 50%,#705fa8 100%)!important;
    color:#fff!important;
    border-right-color:#3d5f8b!important;
}
.admin-site .menu-admin .activo,
.admin-site .menu-dropdown.abierto .dropdown-btn,
.admin-site .menu-dropdown.firmas-abierto .dropdown-btn-firmas{
    background:linear-gradient(135deg,#318fd0,#806ac3)!important;
}
.admin-site .btn-menu-admin{
    background:linear-gradient(135deg,#357eb7,#7666ac)!important;
}

/* Inputs */
.admin-site input,
.admin-site select,
.admin-site textarea,
.aula-site input,
.aula-site select,
.aula-site textarea,
.public-site input,
.public-site select,
.public-site textarea{
    background:#e9f1f6!important;
    border-color:#adc1cf!important;
}
.admin-site input:focus,
.admin-site select:focus,
.admin-site textarea:focus,
.aula-site input:focus,
.aula-site select:focus,
.aula-site textarea:focus,
.public-site input:focus,
.public-site select:focus,
.public-site textarea:focus{
    border-color:#5798c8!important;
    box-shadow:0 0 0 3px rgba(47,134,201,.13)!important;
}

/* SweetAlert visual integrado */
.swal2-popup.multika-swal{
    border-radius:20px!important;
    background:#eef4f8!important;
    color:#2c4358!important;
    border:1px solid #b9cad7!important;
    box-shadow:0 22px 60px rgba(35,55,73,.22)!important;
}
.swal2-popup.multika-swal .swal2-title{
    color:#2b4358!important;
    font-size:24px!important;
}
.swal2-popup.multika-swal .swal2-html-container{
    color:#63788a!important;
}
.swal2-popup.multika-swal .swal2-confirm{
    background:#2f86c9!important;
    border-radius:11px!important;
    box-shadow:none!important;
}
.swal2-popup.multika-swal .swal2-cancel{
    background:#d94f5c!important;
    border-radius:11px!important;
    box-shadow:none!important;
}
.swal2-popup.multika-swal.swal-delete .swal2-confirm{
    background:#d94f5c!important;
}
.swal2-popup.multika-swal.swal-cancel-action .swal2-confirm{
    background:#d94f5c!important;
}


/* SweetAlert total */
.swal2-popup.multika-swal-toast{
    background:#eef4f8!important;
    color:#2c4358!important;
    border:1px solid #b9cad7!important;
    box-shadow:0 12px 30px rgba(35,55,73,.18)!important;
    border-radius:14px!important;
}
.swal2-container{
    z-index:999999!important;
}


/* =========================================================
   SWEETALERT — CANCELAR OPERACIÓN
   Continuar aquí = verde / Sí cancelar = rojo
   ========================================================= */

.swal2-popup.multika-swal.swal-cancel-action .swal2-confirm{
    background:#d94f5c!important;
    color:#fff!important;
}

.swal2-popup.multika-swal.swal-cancel-action .swal2-cancel{
    background:#35a779!important;
    color:#fff!important;
}

.swal2-popup.multika-swal.swal-cancel-action .swal2-cancel:hover{
    background:#2d9169!important;
}
