/* Tipografía Corporativa Sin Corbatas: Familia Ragtime / Syne / Unbounded */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=Unbounded:wght@700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

@font-face {
    font-family: 'Ragtime-ExtraBold';
    src: local('Ragtime-ExtraBold'), local('Ragtime ExtraBold'), local('Ragtime');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

:root {
    --sc-font-heading: 'Ragtime-ExtraBold', 'Unbounded', 'Syne', sans-serif;
}

.sc-hero-title,
.sc-brand-title,
.sc-main-title,
h1, h2, h3,
.page-header-headings h1,
.sc-navigation-bar h1,
.sc-navigation-bar .brand-name {
    font-family: var(--sc-font-heading) !important;
    font-weight: 800 !important;
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* MENÚ LATERAL IZQUIERDO FIJO */
#sc-fixed-sidebar {
    position: fixed !important;
    top: 60px !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 240px !important;
    background: #0d111a !important;
    color: #ffffff !important;
    z-index: 9999 !important;
    overflow-y: auto !important;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.2) !important;
    padding-top: 10px !important;
    transition: width 0.3s ease !important;
}

#sc-fixed-sidebar.collapsed {
    width: 60px !important;
}

#sc-fixed-sidebar .sc-sidebar-header {
    padding: 10px 15px !important;
    text-align: right !important;
}

#sc-fixed-sidebar #sc-toggle-btn {
    background: transparent !important;
    border: none !important;
    color: #f5c518 !important;
    font-size: 18px !important;
    cursor: pointer !important;
}

#sc-fixed-sidebar .sc-main-menu-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#sc-fixed-sidebar .sc-main-menu-list li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 20px !important;
    color: #cbd5e1 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-left: 3px solid transparent !important;
}

#sc-fixed-sidebar .sc-main-menu-list li a:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #f5c518 !important;
    border-left-color: #f5c518 !important;
}

#sc-fixed-sidebar.collapsed .menu-text,
#sc-fixed-sidebar.collapsed .badge-soon,
#sc-fixed-sidebar.collapsed .sc-sidebar-widget {
    display: none !important;
}

/* ==========================================================================
   LAYOUT EXCLUSIVO PARA USUARIOS LOGUEADOS (Margen 110px)
   ========================================================================== */

body.sc-logged-in-page:not(.pagelayout-login) #page-wrapper,
body.sc-logged-in-page:not(.pagelayout-login) #page,
body.sc-logged-in-page:not(.pagelayout-login) #page-header,
body.sc-logged-in-page:not(.pagelayout-login) #topofscroll,
body.sc-logged-in-page:not(.pagelayout-login) .pagelayout-mydashboard #page-wrapper {
    margin-left: 110px !important;
    padding-left: 0 !important;
    width: calc(100% - 110px) !important;
    max-width: calc(100% - 110px) !important;
    transition: margin-left 0.3s ease, width 0.3s ease !important;
}

body.sc-logged-in-page.sc-sidebar-is-collapsed:not(.pagelayout-login) #page-wrapper,
body.sc-logged-in-page.sc-sidebar-is-collapsed:not(.pagelayout-login) #page,
body.sc-logged-in-page.sc-sidebar-is-collapsed:not(.pagelayout-login) #page-header,
body.sc-logged-in-page.sc-sidebar-is-collapsed:not(.pagelayout-login) #topofscroll {
    margin-left: 60px !important;
    padding-left: 0 !important;
    width: calc(100% - 60px) !important;
    max-width: calc(100% - 60px) !important;
}

/* Anular contenedores internos para logged-in */
body.sc-logged-in-page:not(.pagelayout-login) #page-content,
body.sc-logged-in-page:not(.pagelayout-login) #region-main-box,
body.sc-logged-in-page:not(.pagelayout-login) #region-main,
body.sc-logged-in-page:not(.pagelayout-login) .main-content,
body.sc-logged-in-page:not(.pagelayout-login) .sc-dashboard-wrapper,
body.sc-logged-in-page:not(.pagelayout-login) .container,
body.sc-logged-in-page:not(.pagelayout-login) .container-fluid,
body.sc-logged-in-page:not(.pagelayout-login) .container-xl,
body.sc-logged-in-page:not(.pagelayout-login) .container-lg {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   LAYOUT PARA PORTADA PÚBLICA
   ========================================================================== */

body.sc-logged-out-page:not(.pagelayout-login) #page-wrapper,
body.sc-logged-out-page:not(.pagelayout-login) #page,
body.sc-logged-out-page:not(.pagelayout-login) #page-header,
body.sc-logged-out-page:not(.pagelayout-login) #topofscroll {
    margin-left: 0 !important;
    padding-left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

body.sc-logged-out-page:not(.pagelayout-login) {
    padding-top: 75px !important;
}

/* ==========================================================================
   ESTRUCTURA DE LOGIN PANTALLA COMPLETA (50% IMAGEN Y 50% FORMULARIO)
   ========================================================================== */

body.pagelayout-login {
    padding-top: 0 !important;
    margin: 0 !important;
}

body.pagelayout-login #sc-custom-sticky-header,
body.pagelayout-login #sc-fixed-sidebar {
    display: none !important;
}

body.pagelayout-login #page,
body.pagelayout-login #page-wrapper,
body.pagelayout-login #page-content {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 100vh !important;
}

body.pagelayout-login #page-content {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
}

/* Columna Izquierda (50% de la pantalla) */
body.pagelayout-login .login-layout-left {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    overflow: hidden !important;
    min-height: 100vh !important;
}

body.pagelayout-login .login-layout-left img,
body.pagelayout-login .login-layout-left aside {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Columna Derecha (50% con formulario centrado) */
body.pagelayout-login #region-main.login-layout-right,
body.pagelayout-login .login-layout-right-content {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 40px 30px !important;
    box-sizing: border-box !important;
    background: #f8fafc !important;
}

/* Control del Logo */
body.pagelayout-login #logoimage,
body.pagelayout-login #loginlogo img {
    max-width: 200px !important;
    width: 200px !important;
    height: auto !important;
    margin: 0 auto 15px auto !important;
    display: block !important;
}

body.pagelayout-login .loginform,
body.pagelayout-login #region-main-box {
    width: 100% !important;
    max-width: 420px !important;
}

/* RESPONSIVE MÓVIL */
@media (max-width: 991px) {
    body.pagelayout-login .login-layout-left {
        display: none !important;
    }

    body.pagelayout-login #region-main.login-layout-right,
    body.pagelayout-login .login-layout-right-content {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 100vh !important;
    }
}

/* HEADER FIJO PÚBLICO */
.sc-header-sticky {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 75px !important;
    background: #070913 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    z-index: 2147483646 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 40px !important;
    box-sizing: border-box !important;
}

.sc-nav-link { 
    color: #ffffff !important; 
    text-decoration: none !important; 
    font-size: 14px !important; 
    font-weight: 500 !important; 
}
.sc-nav-link:hover { color: #F5C518 !important; }

.sc-btn-login { 
    color: #ffffff !important; 
    text-decoration: none !important; 
    font-size: 14px !important; 
    font-weight: 600 !important; 
}

.sc-btn-register { 
    background: #F5C518 !important; 
    color: #070913 !important; 
    padding: 10px 20px !important; 
    border-radius: 12px !important; 
    font-weight: 700 !important; 
    font-size: 13px !important; 
    text-decoration: none !important; 
}