.elementor-kit-62{--e-global-color-primary:#00839C;--e-global-color-secondary:#54595F;--e-global-color-text:#252525;--e-global-color-accent:#0468AF;--e-global-color-b5ff667:#0468AF;--e-global-color-95411d0:#0468AF;--e-global-color-6249b95:#032B44;--e-global-color-41ca7fd:#666666;--e-global-color-5503cf1:#898989;--e-global-color-eca4bac:#D6D6D6;--e-global-typography-primary-font-family:"Source Sans Pro";--e-global-typography-primary-font-size:2em;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Source Sans Pro";--e-global-typography-secondary-font-size:1.4em;--e-global-typography-secondary-font-weight:600;--e-global-typography-text-font-family:"Source Sans Pro";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1em;--e-global-typography-accent-font-family:"Source Sans Pro";--e-global-typography-accent-font-size:1em;--e-global-typography-accent-font-weight:700;}.elementor-kit-62 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================================
   TUTOR LMS 4.0.4
   CUSTOM LEARNING AREA
============================================================ */

:root {

    --sst-bg: #0b4256;
    --sst-bg-dark: #073244;

    --sst-sidebar: #0b3b4d;
    --sst-sidebar-dark: #072f40;

    --sst-panel: #0f5268;

    --sst-text: #ffffff;
    --sst-text-soft: #c8e4ea;
    --sst-text-muted: #8fb4bd;

    --sst-accent: #26d9ed;
    --sst-accent-light: #aaf4f8;

    --sst-yellow: #ffd75a;

    --sst-border: rgba(84, 224, 240, .20);

    --sst-radius: 14px;
    --sst-radius-small: 10px;

}


/* ============================================================
   01. LEARNING AREA GENERAL
============================================================ */

.tutor-learning-area {
    background:
        linear-gradient(
            180deg,
            var(--sst-bg) 0%,
            var(--sst-bg-dark) 100%
        );

    color: var(--sst-text);
    background: url("https://evaluacioninduccionccb.com/wp-content/uploads/2026/08/Background_Curso.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}


/* Contenedor que contiene sidebar + contenido */

.tutor-learning-area-body {
    background: transparent;
}


/* Área derecha */

.tutor-learning-area-content {
    background: transparent;
}


/* Contenido interno */

.tutor-learning-area-container {
    background: transparent;
}


/* ============================================================
   02. HEADER
============================================================ */

.tutor-learning-header {

    background: rgba(7, 47, 64, .96);

    border-bottom:
        1px solid var(--sst-border);

    box-shadow:
        0 4px 20px rgba(0, 0, 0, .18);
}


/* contenedor interno */

.tutor-learning-header-inner {
    background: transparent;
}


/* título */

.tutor-learning-header-title {

    color: var(--sst-text) !important;

    font-weight: 700;

    letter-spacing: .2px;
}


/* botón regresar */

.tutor-learning-header-back .tutor-btn {

    color: var(--sst-text) !important;

    background: rgba(255,255,255,.05);

    border-radius: 10px;
}


.tutor-learning-header-back .tutor-btn:hover {

    background: rgba(255,255,255,.10);

}


/* ============================================================
   03. SIDEBAR
============================================================ */

.tutor-learning-sidebar {

    background:
        linear-gradient(
            180deg,
            var(--sst-sidebar) 0%,
            var(--sst-sidebar-dark) 100%
        );

    border-right:
        1px solid var(--sst-border);

    color: var(--sst-text);
}


/* Área curriculum */

.tutor-learning-sidebar-curriculum {

    background: transparent;

}


/* ============================================================
   04. PROGRESO
============================================================ */

.tutor-learning-progress {

    color: var(--sst-text);

    border-bottom:
        1px solid rgba(255,255,255,.08);
}


.tutor-learning-progress-text {

    color: var(--sst-text) !important;

    font-weight: 600;
}


/* Barra */

.tutor-learning-progress .tutor-progress-bar {

    height: 7px;

    background:
        rgba(255,255,255,.12);

    border-radius: 50px;

    overflow: hidden;
}


.tutor-learning-progress .tutor-progress-bar-fill {

    background:
        linear-gradient(
            90deg,
            #28e0ed,
            #21bfd7
        );

    border-radius: 50px;
}


/* ============================================================
   05. TEMA / MÓDULO
============================================================ */

.tutor-learning-nav-topic {

    margin-bottom: 8px;
}


/* cabecera del tema */

.tutor-learning-nav-header {

    color: var(--sst-text);

    border-radius: var(--sst-radius-small);

    transition: background .2s ease;
}


.tutor-learning-nav-header:hover {

    background:
        rgba(255,255,255,.05);
}


.tutor-learning-nav-header-title {

    color: var(--sst-text) !important;

    font-weight: 650;
}


/* ============================================================
   06. LECCIONES
============================================================ */

.tutor-learning-nav-body {

    padding-top: 5px;

}


/* Item */

.tutor-learning-nav-item {

    position: relative;

    margin: 5px 8px;

    padding: 10px 12px;

    border-radius: 10px;

    color: var(--sst-text-soft) !important;

    border:
        1px solid transparent;

    transition:
        background .2s ease,
        border .2s ease,
        box-shadow .2s ease;
}


/* textos internos */

.tutor-learning-nav-item * {

    color: inherit;

}


/* hover */

.tutor-learning-nav-item:hover {

    background:
        rgba(255,255,255,.06);

    color:
        var(--sst-text) !important;

}


/* =============================
   LECCIÓN ACTIVA
============================= */

.tutor-learning-nav-item.active {

    background:
        rgba(38,217,237,.13);

    border:
        1px solid rgba(38,217,237,.35);

    color:
        #ffffff !important;

    box-shadow:
        0 0 16px rgba(38,217,237,.08);
}


/* Línea cyan izquierda */

.tutor-learning-nav-item.active::before {

    content: "";

    position: absolute;

    left: -1px;

    top: 10px;

    bottom: 10px;

    width: 3px;

    border-radius: 0 5px 5px 0;

    background:
        var(--sst-accent);

    box-shadow:
        0 0 9px rgba(38,217,237,.7);
}


/* texto pequeño Video - duración */

.tutor-learning-nav-item .tutor-text-subdued {

    color:
        var(--sst-text-muted) !important;

}


/* ============================================================
   07. CONTENIDO DE LA LECCIÓN
============================================================ */

.tutor-lesson-content {

    color: var(--sst-text);

}


.tutor-lesson-content-tab {

    background: transparent;

}


/* ============================================================
   08. VIDEO
============================================================ */

.tutor-lesson-video-wrapper {

    max-width: 1100px;

    margin:
        45px auto;

    overflow: hidden;

    border:
        1px solid rgba(84,224,240,.22) !important;

    border-radius:
        16px;

    background:
        #061f2a;

    box-shadow:
        0 15px 40px rgba(0,0,0,.30);
}


/* Video / iframe */

.tutor-lesson-video-wrapper video,
.tutor-lesson-video-wrapper iframe {

    display: block;

    width: 100%;

}


/* ============================================================
   09. FOOTER DE LA LECCIÓN
============================================================ */

.tutor-learning-area-footer {

    background:
        rgba(7,47,64,.94);

    border-top:
        1px solid var(--sst-border);

}


/* Botones únicamente dentro del LMS */

.tutor-learning-area .tutor-btn {

    border-radius:
        10px;

    transition:
        background .2s ease,
        transform .2s ease;
}


.tutor-learning-area .tutor-btn:hover {

    transform:
        translateY(-1px);

}


/* ============================================================
   10. BOTÓN MARCAR COMPLETADO
============================================================ */

.tutor-mark-as-complete-button {

    border-radius:
        10px;

}


/* ============================================================
   11. BLOQUE "MÁS"
============================================================ */

.tutor-learning-sidebar-pages {

    background:
        var(--sst-sidebar-dark);

    border-top:
        1px solid rgba(255,255,255,.07);

}


/* ============================================================
   12. BOTÓN FULLSCREEN
============================================================ */

.tutor-expand-btn {

    background:
        rgba(255,255,255,.08) !important;

    border-color:
        rgba(255,255,255,.12) !important;

    color:
        #ffffff !important;

}


/* ============================================================
   RESPONSIVE
============================================================ */

@media (max-width: 1024px) {

    .tutor-lesson-video-wrapper {

        margin:
            25px 20px;

    }

}


@media (max-width: 767px) {

    .tutor-lesson-video-wrapper {

        margin:
            18px 12px;

        border-radius:
            10px;

    }

}


/* ==========================================================
   TUTOR LMS 4.0.4
   PATCH V2 - REMOVE WHITE SURFACES
========================================================== */


/* ==========================================================
   1. SIDEBAR COMPLETO
========================================================== */

.tutor-learning-area .tutor-learning-sidebar {
    background: #08384b !important;
    border-right: 1px solid rgba(60, 220, 240, .20) !important;
}


/* Zona principal del curriculum */

.tutor-learning-area .tutor-learning-sidebar-curriculum {
    background: transparent !important;
}


/* Progreso */

.tutor-learning-area .tutor-learning-progress {
    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;

    padding: 22px 20px !important;
}


/* Texto del progreso */

.tutor-learning-area .tutor-learning-progress-text,
.tutor-learning-area .tutor-learning-progress-text span {
    color: #ffffff !important;
}


/* Barra de progreso */

.tutor-learning-area .tutor-learning-progress .tutor-progress-bar {
    background: rgba(255,255,255,.12) !important;
}


/* ==========================================================
   2. NAVEGACIÓN / CURRICULUM
========================================================== */

.tutor-learning-area .tutor-learning-nav {
    background: transparent !important;
}


.tutor-learning-area .tutor-learning-nav-topic {
    background: transparent !important;
}


/* Cabecera del tema */

.tutor-learning-area .tutor-learning-nav-header {
    background: transparent !important;

    padding: 14px 18px !important;

    color: #ffffff !important;
}


.tutor-learning-area .tutor-learning-nav-header-title {
    color: #ffffff !important;
}


/* ==========================================================
   3. ITEMS / LECCIONES
========================================================== */

.tutor-learning-area .tutor-learning-nav-body {
    background: transparent !important;

    padding: 4px 12px 16px !important;
}


.tutor-learning-area .tutor-learning-nav-item {

    background: rgba(255,255,255,.04) !important;

    border: 1px solid transparent !important;

    border-radius: 10px !important;

    color: #cce9ef !important;

    margin: 5px 0 !important;
}


/* Iconos */

.tutor-learning-area .tutor-learning-nav-item svg {
    color: #9fdbe5 !important;
}


/* Hover */

.tutor-learning-area .tutor-learning-nav-item:hover {

    background: rgba(42,216,237,.08) !important;

    border-color: rgba(42,216,237,.15) !important;

    color: #ffffff !important;
}


/* Lección activa */

.tutor-learning-area .tutor-learning-nav-item.active {

    background: rgba(42,216,237,.14) !important;

    border-color: rgba(42,216,237,.32) !important;

    color: #ffffff !important;

    box-shadow:
        inset 3px 0 0 #29d8ed,
        0 0 14px rgba(41,216,237,.08) !important;
}


/* Información secundaria */

.tutor-learning-area
.tutor-learning-nav-item
.tutor-text-subdued {

    color: #7fc6d2 !important;
}


/* ==========================================================
   4. ZONA INFERIOR "MÁS"
========================================================== */

.tutor-learning-area .tutor-learning-sidebar-pages {

    background: #062f40 !important;

    border-top:
        1px solid rgba(255,255,255,.08) !important;

    padding: 10px !important;
}


.tutor-learning-area .tutor-learning-pages {

    background: transparent !important;
}


.tutor-learning-area .tutor-learning-pages-item {

    background: rgba(255,255,255,.04) !important;

    color: #d9f3f6 !important;

    border: 1px solid rgba(255,255,255,.06) !important;

    border-radius: 9px !important;
}


.tutor-learning-area .tutor-learning-pages-item:hover {

    background: rgba(42,216,237,.10) !important;

    color: #ffffff !important;
}


/* ==========================================================
   5. CONTENIDO DERECHO
========================================================== */

.tutor-learning-area .tutor-learning-area-content {

    background: transparent !important;
}


.tutor-learning-area .tutor-learning-area-container {

    background: transparent !important;
}


/* Wrapper general de la lección */

.tutor-learning-area .tutor-lesson-content {

    background: transparent !important;
}


/* MUY IMPORTANTE:
   Quita la gran tarjeta blanca
*/

.tutor-learning-area .tutor-lesson-content-tab {

    background: transparent !important;

    border: none !important;

    box-shadow: none !important;
}


/* ==========================================================
   6. VIDEO
========================================================== */

.tutor-learning-area .tutor-lesson-video-wrapper {

    background: transparent !important;

    border: 1px solid rgba(54,220,239,.22) !important;

    padding: 0 !important;

    max-width: 1050px !important;

    margin: 50px auto !important;

    border-radius: 16px !important;

    overflow: hidden !important;

    box-shadow:
        0 18px 55px rgba(0,0,0,.32) !important;
}


/* Video */

.tutor-learning-area
.tutor-lesson-video-wrapper video,

.tutor-learning-area
.tutor-lesson-video-wrapper iframe {

    display: block !important;

    width: 100% !important;

    border-radius: 15px !important;

    margin: 0 !important;
}


/* ==========================================================
   7. CONTENIDO DE LAS TABS
========================================================== */

.tutor-learning-area .tutor-tabs-content {

    background: transparent !important;

    color: #ffffff !important;
}


/* ==========================================================
   8. FOOTER DE LA LECCIÓN
========================================================== */

.tutor-learning-area .tutor-learning-area-footer {

    background: transparent !important;

    border-top:
        1px solid rgba(80,220,240,.14) !important;

    box-shadow: none !important;
}


/* ==========================================================
   9. BOTONES
========================================================== */

.tutor-learning-area .tutor-btn-primary {

    background: #23d2e8 !important;

    border-color: #23d2e8 !important;

    color: #063545 !important;

    border-radius: 9px !important;

    font-weight: 700 !important;
}


.tutor-learning-area .tutor-btn-primary:hover {

    background: #54e1f1 !important;

    border-color: #54e1f1 !important;
}


/* ==========================================================
   10. MOBILE
========================================================== */

@media(max-width: 767px) {

    .tutor-learning-area .tutor-lesson-video-wrapper {

        margin:
            20px 12px !important;

        border-radius:
            12px !important;
    }

}

/* ==========================================================
   TUTOR LMS 4.0.4
   PATCH V3 - "MÁS" / POPOVER / PAGES
========================================================== */

/* contenedor general inferior */
.tutor-learning-area .tutor-learning-sidebar-pages {
    background: #072f40 !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
    padding: 10px !important;
    overflow: visible !important;
}

.tutor-learning-area .tutor-learning-sidebar-pages .tutor-learning-pages {
    background: transparent !important;
    overflow: visible !important;
}

/* botón "Más" */
.tutor-learning-area .tutor-learning-sidebar-pages .tutor-learning-pages-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;

    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: 10px !important;

    color: #d6f3f7 !important;
    text-decoration: none !important;

    padding: 12px 14px !important;
    margin: 0 !important;

    box-shadow: none !important;
}

.tutor-learning-area .tutor-learning-sidebar-pages .tutor-learning-pages-item:hover {
    background: rgba(42,216,237,.10) !important;
    border-color: rgba(42,216,237,.25) !important;
    color: #ffffff !important;
}

.tutor-learning-area .tutor-learning-sidebar-pages .tutor-learning-pages-item.active {
    background: rgba(42,216,237,.14) !important;
    border-color: rgba(42,216,237,.32) !important;
    color: #ffffff !important;
    box-shadow: inset 3px 0 0 #29d8ed !important;
}

/* iconos de los items */
.tutor-learning-area .tutor-learning-sidebar-pages .tutor-learning-pages-item svg,
.tutor-learning-area .tutor-learning-sidebar-pages .tutor-learning-pages-item i {
    color: #9fe3ec !important;
    fill: currentColor !important;
    flex-shrink: 0 !important;
}

/* ==========================================================
   MODO 1: cuando Tutor lo muestra como lista inline
========================================================== */

.tutor-learning-area .tutor-learning-sidebar-pages .tutor-learning-pages-nav {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;

    background: linear-gradient(180deg, #0b4256 0%, #08384b 100%) !important;
    border: 1px solid rgba(60,220,240,.18) !important;
    border-radius: 14px !important;

    padding: 10px !important;
    margin-top: 8px !important;

    box-shadow: 0 16px 35px rgba(0,0,0,.28) !important;
}

/* ==========================================================
   MODO 2: cuando Tutor lo muestra como POPOVER
   Cubrimos varios wrappers porque Tutor usa un componente
   de popover propio y puede variar internamente.
========================================================== */

.tutor-learning-area .tutor-learning-sidebar-pages [class*="popover"],
.tutor-learning-area .tutor-learning-sidebar-pages [class*="dropdown"] {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* panel flotante del popover */
.tutor-learning-area .tutor-learning-sidebar-pages [class*="popover-content"],
.tutor-learning-area .tutor-learning-sidebar-pages [class*="popover-body"],
.tutor-learning-area .tutor-learning-sidebar-pages [class*="dropdown-content"],
.tutor-learning-area .tutor-learning-sidebar-pages [class*="dropdown-menu"],
.tutor-learning-area .tutor-learning-sidebar-pages [class*="popper"],
.tutor-learning-area .tutor-learning-sidebar-pages .tutor-card {
    background: linear-gradient(180deg, #0b4256 0%, #08384b 100%) !important;
    border: 1px solid rgba(60,220,240,.18) !important;
    border-radius: 14px !important;
    box-shadow: 0 18px 38px rgba(0,0,0,.30) !important;

    padding: 10px !important;
}

/* si el popover genera links sueltos, que se vean como lista */
.tutor-learning-area .tutor-learning-sidebar-pages [class*="popover-content"] .tutor-learning-pages-item,
.tutor-learning-area .tutor-learning-sidebar-pages [class*="popover-body"] .tutor-learning-pages-item,
.tutor-learning-area .tutor-learning-sidebar-pages [class*="dropdown-content"] .tutor-learning-pages-item,
.tutor-learning-area .tutor-learning-sidebar-pages [class*="dropdown-menu"] .tutor-learning-pages-item {
    margin-bottom: 8px !important;
}

.tutor-learning-area .tutor-learning-sidebar-pages [class*="popover-content"] .tutor-learning-pages-item:last-child,
.tutor-learning-area .tutor-learning-sidebar-pages [class*="popover-body"] .tutor-learning-pages-item:last-child,
.tutor-learning-area .tutor-learning-sidebar-pages [class*="dropdown-content"] .tutor-learning-pages-item:last-child,
.tutor-learning-area .tutor-learning-sidebar-pages [class*="dropdown-menu"] .tutor-learning-pages-item:last-child {
    margin-bottom: 0 !important;
}

/* ==========================================================
   AJUSTE EXTRA
========================================================== */

.tutor-learning-area .tutor-learning-sidebar-pages button,
.tutor-learning-area .tutor-learning-sidebar-pages .tutor-btn {
    border-radius: 10px !important;
}




/* ============================================================
   TUTOR LMS 4.0.4
   STUDENT DASHBOARD - SSTMA SKIN
============================================================ */

body:has(.tutor-dashboard-sidebar) {

    --dash-bg: #07384a;
    --dash-bg-deep: #052d3c;
    --dash-sidebar: #08394b;
    --dash-header: #073244;

    --dash-panel: rgba(10, 71, 90, .78);
    --dash-panel-hover: rgba(16, 92, 112, .88);

    --dash-text: #ffffff;
    --dash-text-soft: #c7e8ee;
    --dash-text-muted: #84bdc8;

    --dash-cyan: #29d8ed;
    --dash-cyan-soft: rgba(41, 216, 237, .14);

    --dash-border: rgba(63, 221, 239, .18);

    --dash-radius: 16px;
}


/* ============================================================
   01. FONDO GENERAL
============================================================ */

body:has(.tutor-dashboard-sidebar) {
    background:
        radial-gradient(
            circle at 70% 20%,
            rgba(16, 144, 166, .24),
            transparent 40%
        ),
        linear-gradient(
            135deg,
            var(--dash-bg) 0%,
            var(--dash-bg-deep) 100%
        ) !important;
}


/* Cubrir wrappers del theme si existen */

body:has(.tutor-dashboard-sidebar) main,
body:has(.tutor-dashboard-sidebar) .site-content {
    background: transparent !important;
}


/* ============================================================
   02. SIDEBAR PRINCIPAL
============================================================ */

.tutor-dashboard-sidebar {

    background:
        linear-gradient(
            180deg,
            #083e51 0%,
            #062f40 100%
        ) !important;

    border-right:
        1px solid var(--dash-border) !important;

    box-shadow:
        8px 0 30px rgba(0,0,0,.12);
}


/* ============================================================
   03. LOGO / NOMBRE DEL SITIO
============================================================ */

.tutor-dashboard-sidebar-logo {

    border-bottom:
        1px solid rgba(255,255,255,.07);

    color:
        var(--dash-text) !important;
}


.tutor-dashboard-sidebar-logo .site-title {

    color:
        var(--dash-text) !important;

    font-weight:
        700;

    line-height:
        1.35;
}


.tutor-dashboard-sidebar-logo img {

    max-height:
        60px;

    width:
        auto;
}


/* ============================================================
   04. NAVEGACIÓN
============================================================ */

.tutor-dashboard-sidebar-nav {

    padding:
        18px 10px;
}


.tutor-dashboard-sidebar-nav ul {

    display:
        flex;

    flex-direction:
        column;

    gap:
        6px;
}


/* Item */

.tutor-dashboard-sidebar-nav li a {

    display:
        flex !important;

    align-items:
        center;

    gap:
        12px;

    padding:
        11px 14px !important;

    border:
        1px solid transparent;

    border-radius:
        10px !important;

    background:
        transparent !important;

    color:
        var(--dash-text-soft) !important;

    font-weight:
        500;

    transition:
        .2s ease;
}


/* Iconos */

.tutor-dashboard-sidebar-nav li a svg {

    color:
        #9adce6 !important;

    fill:
        currentColor;
}


/* Hover */

.tutor-dashboard-sidebar-nav li a:hover {

    background:
        rgba(255,255,255,.055) !important;

    border-color:
        rgba(255,255,255,.06);

    color:
        #ffffff !important;
}


/* ACTIVE */

.tutor-dashboard-sidebar-nav li a.active {

    background:
        rgba(41,216,237,.13) !important;

    border-color:
        rgba(41,216,237,.28) !important;

    color:
        #ffffff !important;

    box-shadow:
        inset 3px 0 0 var(--dash-cyan),
        0 0 16px rgba(41,216,237,.07);
}


.tutor-dashboard-sidebar-nav li a.active svg {

    color:
        var(--dash-cyan) !important;
}


/* ============================================================
   05. EXPLORAR CURSOS - ABAJO
============================================================ */

.tutor-see-all-courses {

    color:
        var(--dash-text-soft) !important;

    border-top:
        1px solid rgba(255,255,255,.06);

    padding-top:
        18px;

    transition:
        .2s ease;
}


.tutor-see-all-courses:hover {

    color:
        var(--dash-cyan) !important;
}


/* ============================================================
   06. HEADER
============================================================ */

.tutor-dashboard-header {

    background:
        rgba(6,47,64,.96) !important;

    border-bottom:
        1px solid var(--dash-border) !important;

    box-shadow:
        0 4px 20px rgba(0,0,0,.14);
}


.tutor-dashboard-header-inner {

    background:
        transparent !important;
}


/* Saludo */

.tutor-dashboard-header-left,
.tutor-dashboard-header-left * {

    color:
        var(--dash-text) !important;
}


.tutor-dashboard-header-left .tutor-text-subdued {

    color:
        var(--dash-text-soft) !important;
}


/* ============================================================
   07. AVATAR
============================================================ */

.tutor-dashboard-header-user-avatar {

    background:
        rgba(255,255,255,.07) !important;

    border:
        1px solid rgba(255,255,255,.10) !important;

    border-radius:
        50px !important;
}


.tutor-dashboard-header-user-avatar:hover,
.tutor-dashboard-header-user-avatar.active {

    border-color:
        rgba(41,216,237,.40) !important;

    background:
        rgba(41,216,237,.10) !important;
}


/* ============================================================
   08. POPOVER DEL USUARIO
============================================================ */

.tutor-dashboard-header-user-popover {

    background:
        #083b4e !important;

    border:
        1px solid var(--dash-border) !important;

    border-radius:
        14px !important;

    box-shadow:
        0 20px 50px rgba(0,0,0,.35) !important;

    color:
        var(--dash-text) !important;
}


.tutor-dashboard-header-user-popover-profile {

    background:
        transparent !important;
}


.tutor-dashboard-header-user-popover-menu-wrapper {

    border-top:
        1px solid rgba(255,255,255,.07) !important;
}


.tutor-dashboard-header-user-popover-menu a {

    color:
        var(--dash-text-soft) !important;

    border-radius:
        8px;
}


.tutor-dashboard-header-user-popover-menu a:hover {

    color:
        #ffffff !important;

    background:
        rgba(41,216,237,.10) !important;
}


/* ============================================================
   09. WELCOME CARD
============================================================ */

.tutor-dashboard-welcome-card {

    position:
        relative;

    overflow:
        hidden;

    background:
        linear-gradient(
            135deg,
            rgba(10, 73, 92, .94),
            rgba(8, 56, 73, .94)
        ) !important;

    border:
        1px solid var(--dash-border) !important;

    border-radius:
        var(--dash-radius) !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,.16) !important;
}


/* glow decorativo */

.tutor-dashboard-welcome-card::before {

    content: "";

    position:
        absolute;

    width:
        300px;

    height:
        300px;

    right:
        -120px;

    top:
        -150px;

    border-radius:
        50%;

    background:
        rgba(41,216,237,.12);

    filter:
        blur(20px);

    pointer-events:
        none;
}


/* contenido */

.tutor-dashboard-welcome-content {

    position:
        relative;

    z-index:
        2;
}


.tutor-dashboard-welcome-content h3 {

    color:
        #ffffff !important;

    font-weight:
        700 !important;
}


.tutor-dashboard-welcome-content p {

    color:
        var(--dash-text-soft) !important;
}


/* Badge */

.tutor-dashboard-welcome-badge {

    background:
        rgba(41,216,237,.12) !important;

    border:
        1px solid rgba(41,216,237,.18);

    color:
        var(--dash-cyan) !important;

    border-radius:
        30px !important;
}


/* ilustración */

.tutor-dashboard-welcome-banner {

    position:
        relative;

    z-index:
        2;
}


/* ============================================================
   10. BOTÓN EXPLORAR CURSOS
============================================================ */

.tutor-dashboard-welcome-card .tutor-btn-primary {

    background:
        var(--dash-cyan) !important;

    border-color:
        var(--dash-cyan) !important;

    color:
        #063443 !important;

    border-radius:
        9px !important;

    font-weight:
        700 !important;

    box-shadow:
        0 8px 20px rgba(41,216,237,.18);
}


.tutor-dashboard-welcome-card .tutor-btn-primary:hover {

    background:
        #58e3f3 !important;

    border-color:
        #58e3f3 !important;

    transform:
        translateY(-1px);
}


/* ============================================================
   11. QUICK TIPS
============================================================ */

.tutor-dashboard-quick-tips-card {

    background:
        rgba(8,60,78,.78) !important;

    border:
        1px solid var(--dash-border) !important;

    border-radius:
        var(--dash-radius) !important;

    box-shadow:
        0 15px 35px rgba(0,0,0,.10) !important;

    color:
        #ffffff !important;
}


.tutor-dashboard-quick-tips-card .tutor-text-secondary {

    color:
        var(--dash-text-soft) !important;
}


.tutor-dashboard-quick-tips-card svg {

    color:
        var(--dash-cyan) !important;
}


/* ============================================================
   12. TEXTOS GENERALES DEL DASHBOARD
============================================================ */

body:has(.tutor-dashboard-sidebar)
.tutor-text-primary {

    color:
        #ffffff !important;
}


body:has(.tutor-dashboard-sidebar)
.tutor-text-secondary {

    color:
        var(--dash-text-soft) !important;
}


body:has(.tutor-dashboard-sidebar)
.tutor-text-subdued {

    color:
        var(--dash-text-muted) !important;
}


/* ============================================================
   13. ESTADÍSTICAS
   Aparecen cuando el usuario ya tiene cursos
============================================================ */

.tutor-student-dashboard-stats {

    color:
        #ffffff;
}


.tutor-stat-card {

    background:
        rgba(8, 61, 79, .82) !important;

    border:
        1px solid var(--dash-border) !important;

    border-radius:
        14px !important;

    color:
        #ffffff !important;

    text-decoration:
        none !important;

    box-shadow:
        0 12px 30px rgba(0,0,0,.12) !important;

    transition:
        transform .2s ease,
        background .2s ease,
        border .2s ease;
}


a.tutor-stat-card:hover {

    transform:
        translateY(-2px);

    background:
        rgba(13, 84, 104, .90) !important;

    border-color:
        rgba(41,216,237,.32) !important;
}


.tutor-stat-card-title {

    color:
        var(--dash-text-soft) !important;
}


.tutor-stat-card-value {

    color:
        #ffffff !important;

    font-weight:
        700;
}


.tutor-stat-card-icon {

    color:
        var(--dash-cyan) !important;
}


/* ============================================================
   14. CONTINUAR APRENDIENDO
============================================================ */

.tutor-student-dashboard-courses {

    color:
        #ffffff;
}


/* course card */

.tutor-progress-card {

    background:
        rgba(8, 61, 79, .82) !important;

    border:
        1px solid var(--dash-border) !important;

    border-radius:
        14px !important;

    overflow:
        hidden;

    box-shadow:
        0 14px 35px rgba(0,0,0,.13) !important;

    transition:
        transform .2s ease,
        border .2s ease;
}


.tutor-progress-card:hover {

    transform:
        translateY(-2px);

    border-color:
        rgba(41,216,237,.35) !important;
}


.tutor-progress-card-inner,
.tutor-progress-card-content,
.tutor-progress-card-actions {

    background:
        transparent !important;
}


.tutor-progress-card * {

    color:
        var(--dash-text-soft);
}


/* progreso */

.tutor-progress-card .tutor-progress-bar {

    background:
        rgba(255,255,255,.10) !important;

    border-radius:
        50px;
}


.tutor-progress-card .tutor-progress-bar-fill {

    background:
        var(--dash-cyan) !important;

    border-radius:
        50px;
}


/* ============================================================
   15. RESPONSIVE
============================================================ */

@media(max-width: 768px) {

    .tutor-dashboard-welcome-card {

        border-radius:
            12px !important;
    }


    .tutor-dashboard-quick-tips-card {

        border-radius:
            12px !important;
    }

}/* End custom CSS */