
/* =========================================================
   WÖRTH SELECTION PORTAL V5
   ========================================================= */

:root{
    --v5-green:#0F3B2E;
    --v5-green-2:#0F493B;
    --v5-dark:#08271E;
    --v5-mint:#A7F3D0;
    --v5-mint-soft:#EDF5F1;
    --v5-cream:#F7F5EF;
    --v5-gold:#D6B37B;
    --v5-yellow:#FDE047;
    --v5-white:#FFFFFF;
    --v5-text:#163E34;
    --v5-muted:#667A73;
    --v5-border:#DCE6E1;

    --v5-serif:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif;

    --v5-sans:
        Barlow,"Helvetica Neue",Arial,sans-serif;
}


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

body.ws-v5{
    font-family:Barlow,"Helvetica Neue",Arial,sans-serif !important;

    color:var(--v5-text);

    -webkit-font-smoothing:antialiased;

    text-rendering:optimizeLegibility;
}

body.ws-v5 *,
body.ws-v5 *::before,
body.ws-v5 *::after{
    box-sizing:border-box;
}


/* =========================================================
   AUTH
   ========================================================= */

body.ws-v5-auth{
    background:#FFFFFF !important;
}


/*
 * V3 contiene el título editorial correcto.
 * V5 elimina por JS el título equivalente del formulario.
 */

body.ws-v5-auth
.ws-v3-auth-main{
    width:min(
        1060px,
        calc(100% - 48px)
    ) !important;

    min-height:615px !important;

    margin:0 auto !important;

    grid-template-columns:
        minmax(0,1.08fr)
        minmax(390px,.82fr) !important;

    border:0 !important;
    box-shadow:none !important;
}


/* LOGIN */

body.ws-v5-auth
.ws-v3-auth-login{
    padding:
        58px
        78px
        52px
        55px !important;

    background:#FFFFFF !important;
}


/* REGISTRO */

body.ws-v5-auth
.ws-v3-auth-register{
    padding:
        58px
        48px
        48px !important;

    background:#EAF3EE !important;
}


/* TITULO LOGIN */

body.ws-v5-auth
.ws-v3-auth-title{
    margin:
        0
        0
        20px !important;

    font-family:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif !important;

    font-size:
        clamp(
            42px,
            4vw,
            53px
        ) !important;

    font-weight:600 !important;

    line-height:.98 !important;

    letter-spacing:-.005em !important;

    color:var(--v5-green) !important;
}


/* DESCRIPCION */

body.ws-v5-auth
.ws-v3-auth-subtitle{
    max-width:440px !important;

    margin:
        0
        0
        31px !important;

    color:#687B75 !important;

    font-size:13px !important;

    font-weight:400 !important;

    line-height:1.65 !important;
}


/* TITULO REGISTRATE */

body.ws-v5-auth
.ws-v3-side-title{
    margin:
        0
        0
        29px !important;

    font-family:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif !important;

    font-size:40px !important;

    font-weight:600 !important;

    line-height:1 !important;

    letter-spacing:-.005em !important;

    color:var(--v5-green) !important;
}


/* FORMULARIO */

body.ws-v5-auth
.ws-v3-auth-form-mount{
    width:100% !important;
}


body.ws-v5-auth
.ws-v3-auth-form-mount form{
    width:100% !important;

    max-width:none !important;

    margin:0 !important;

    padding:0 !important;
}


body.ws-v5-auth
.ws-v3-auth-form-mount label{
    color:#123F35 !important;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-size:12px !important;

    font-weight:500 !important;
}


body.ws-v5-auth
.ws-v3-auth-form-mount
input[type="email"],

body.ws-v5-auth
.ws-v3-auth-form-mount
input[type="text"],

body.ws-v5-auth
.ws-v3-auth-form-mount
input[type="password"]{

    min-height:48px !important;

    border:
        1px solid #A8BAB2 !important;

    background:#FFFFFF !important;

    border-radius:0 !important;

    box-shadow:none !important;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-size:13px !important;

    font-weight:400 !important;

    color:#173F35 !important;
}


body.ws-v5-auth
.ws-v3-auth-form-mount
input:focus{

    border-color:
        var(--v5-green-2) !important;

    box-shadow:
        0 0 0 2px
        rgba(15,73,59,.06) !important;

    outline:0 !important;
}


/* LOGIN CTA */

body.ws-v5-auth
.ws-v3-auth-form-mount
button[type="submit"],

body.ws-v5-auth
.ws-v3-auth-form-mount
input[type="submit"]{

    min-height:49px !important;

    margin-top:18px !important;

    border:0 !important;

    border-radius:999px !important;

    background:
        var(--v5-green-2) !important;

    color:#FFFFFF !important;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-size:12.5px !important;

    font-weight:500 !important;

    box-shadow:none !important;
}


/* IMAGEN / ILUSTRACION */

body.ws-v5-auth
.ws-v3-brand-visual{

    min-height:180px !important;

    margin-bottom:25px !important;

    background:#09624B !important;
}


body.ws-v5-auth
.ws-v3-brand-paper{

    width:61% !important;

    min-height:116px !important;

    padding:
        21px
        25px !important;
}


body.ws-v5-auth
.ws-v3-brand-paper img{

    width:142px !important;
}


body.ws-v5-auth
.ws-v3-benefits li{

    margin-bottom:10px !important;

    color:#17453A !important;

    font-size:12.5px !important;
}


/* CTA REGISTRO */

body.ws-v5-auth
.ws-v3-register-cta{

    min-height:48px !important;

    background:
        var(--v5-green-2) !important;

    font-size:12.5px !important;

    font-weight:500 !important;
}


/* =========================================================
   TEXTO LEGAL
   ========================================================= */

body.ws-v5-auth
.footer-legal,

body.ws-v5-auth
.legal-text,

body.ws-v5-auth
[class*="legal"]{

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-size:10.5px !important;

    line-height:1.5 !important;

    color:#36594F !important;
}


/* =========================================================
   PORTAL / DASHBOARD
   ========================================================= */

body.ws-v5-portal{

    background:
        #F5F6F2 !important;
}


/* CONTENEDOR MAESTRO */

.ws-v5-dashboard-shell{

    width:min(
        1240px,
        calc(100% - 48px)
    );

    margin:
        30px
        auto
        50px;

    display:grid;

    grid-template-columns:
        248px
        minmax(0,1fr);

    gap:24px;

    align-items:start;
}


/* =========================================================
   SIDEBAR
   ========================================================= */

.ws-v5-sidebar{

    width:100%;

    background:#FFFFFF;

    border:
        1px solid #E0E8E4;

    border-radius:0;

    box-shadow:
        0 5px 22px
        rgba(8,39,30,.025);

    overflow:hidden;

    position:sticky;

    top:115px;
}


.ws-v5-sidebar-head{

    min-height:64px;

    display:flex;

    align-items:center;

    gap:11px;

    padding:
        0
        23px;

    background:
        var(--v5-green-2);

    color:#FFFFFF;

    font-size:13px;

    font-weight:500;
}


.ws-v5-sidebar-head svg{

    width:18px;

    height:18px;

    fill:none;

    stroke:currentColor;

    stroke-width:1.7;
}


/* SIDEBAR EXISTENTE */

.ws-v5-sidebar
a,

.ws-v5-sidebar
button{

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;
}


.ws-v5-sidebar
a{

    color:#244D43 !important;

    font-size:12.5px !important;

    font-weight:400 !important;

    text-decoration:none !important;
}


.ws-v5-sidebar
a:hover{

    color:
        var(--v5-green-2) !important;
}


/* SECCIONES */

.ws-v5-sidebar
h2,

.ws-v5-sidebar
h3,

.ws-v5-sidebar
h4,

.ws-v5-sidebar
strong{

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-size:11.5px !important;

    font-weight:600 !important;

    color:#163F35 !important;
}


/* =========================================================
   LOGOUT
   ========================================================= */

.ws-v5-sidebar-logout{

    border-top:
        1px solid #E3EAE7;

    padding:
        16px
        20px;
}


.ws-v5-sidebar-logout
a,

.ws-v5-sidebar-logout
button{

    width:100%;

    min-height:40px;

    display:flex;

    align-items:center;

    gap:10px;

    padding:0;

    border:0;

    background:transparent;

    color:#31564C !important;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-size:12.5px !important;

    font-weight:400 !important;

    text-decoration:none !important;

    cursor:pointer;
}


.ws-v5-sidebar-logout
svg{

    width:17px;

    height:17px;

    fill:none;

    stroke:currentColor;

    stroke-width:1.7;
}


/* =========================================================
   MAIN DASHBOARD
   ========================================================= */

.ws-v5-dashboard-main{

    min-width:0;

    width:100%;
}


/* BIENVENIDO */

.ws-v5-welcome{

    min-height:64px;

    display:flex;

    align-items:center;

    padding:
        0
        27px;

    margin-bottom:0;

    background:
        var(--v5-green-2);

    color:#FFFFFF;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif;

    font-size:13px;

    font-weight:500;
}


/* =========================================================
   TARJETAS
   ========================================================= */

.ws-v5-dashboard-main
.ws-v3-detected-card,

.ws-v5-card{

    background:#FFFFFF !important;

    border:
        1px solid #E1E8E4 !important;

    border-radius:0 !important;

    box-shadow:
        0 5px 22px
        rgba(8,39,30,.025) !important;
}


.ws-v5-dashboard-main
h1{

    font-family:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif !important;

    color:
        var(--v5-green) !important;
}


.ws-v5-dashboard-main
h2,

.ws-v5-dashboard-main
h3{

    color:
        var(--v5-green) !important;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-weight:500 !important;
}


/* TEXTO */

.ws-v5-dashboard-main
p{

    color:#5B716A;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif;

    font-weight:400;
}


/* =========================================================
   BOTONES DASHBOARD
   ========================================================= */

.ws-v5-dashboard-main
button,

.ws-v5-dashboard-main
.btn,

.ws-v5-dashboard-main
a.button{

    border-radius:
        999px !important;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-weight:
        500 !important;
}


.ws-v5-dashboard-main
button:not(.ws-v3-modal-close),

.ws-v5-dashboard-main
.btn{

    background-color:
        var(--v5-green-2);
}


/* =========================================================
   PROGRESS
   ========================================================= */

.ws-v5-dashboard-main
progress{

    accent-color:
        var(--v5-gold);
}


/* =========================================================
   FORM INPUTS
   ========================================================= */

body.ws-v5-portal
input,

body.ws-v5-portal
select,

body.ws-v5-portal
textarea{

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;

    font-weight:
        400 !important;

    border-color:
        #BBCBC4 !important;
}


/* =========================================================
   CANDIDATE ONBOARDING
   ========================================================= */

body.ws-v5
.ws-v3-onboarding{

    border-radius:0 !important;
}


body.ws-v5
.ws-v3-onboarding-head{

    background:
        var(--v5-green-2) !important;
}


body.ws-v5
.ws-v3-onboarding-body h2{

    font-family:
        "Barlow Semi Condensed","Arial Narrow",Arial,sans-serif !important;

    font-weight:
        600 !important;

    color:
        var(--v5-green) !important;
}


body.ws-v5
.ws-v3-btn-primary{

    background:
        var(--v5-green-2) !important;

    border-color:
        var(--v5-green-2) !important;
}


/* =========================================================
   MOBILE DASHBOARD BUTTON
   ========================================================= */

.ws-v5-mobile-panel{

    display:none;

    width:100%;

    min-height:46px;

    margin:
        0
        0
        15px;

    padding:
        0
        18px;

    align-items:center;

    justify-content:space-between;

    border:
        1px solid #D8E4DE;

    background:#FFFFFF;

    color:#164238;

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif;

    font-size:12.5px;

    font-weight:500;

    cursor:pointer;
}


/* =========================================================
   AUTH TABLET
   ========================================================= */

@media(max-width:950px){

    body.ws-v5-auth
    .ws-v3-auth-main{

        width:100% !important;

        grid-template-columns:
            1fr
            minmax(340px,.8fr) !important;
    }


    body.ws-v5-auth
    .ws-v3-auth-login{

        padding:
            48px
            38px !important;
    }


    body.ws-v5-auth
    .ws-v3-auth-register{

        padding:
            48px
            30px !important;
    }


    .ws-v5-dashboard-shell{

        width:
            calc(100% - 32px);

        grid-template-columns:
            220px
            minmax(0,1fr);

        gap:18px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    body.ws-v5-auth
    .ws-v3-auth-main{

        display:block !important;
    }


    body.ws-v5-auth
    .ws-v3-auth-login{

        padding:
            40px
            22px !important;
    }


    body.ws-v5-auth
    .ws-v3-auth-register{

        padding:
            42px
            22px !important;
    }


    body.ws-v5-auth
    .ws-v3-auth-title{

        font-size:
            40px !important;
    }


    .ws-v5-dashboard-shell{

        display:block;

        width:
            calc(100% - 28px);

        margin-top:20px;
    }


    .ws-v5-mobile-panel{

        display:flex;
    }


    .ws-v5-sidebar{

        display:none;

        position:fixed;

        z-index:50000;

        top:78px;

        left:0;

        bottom:0;

        width:
            min(310px,88vw);

        overflow:auto;

        border:0;

        box-shadow:
            20px
            0
            50px
            rgba(0,0,0,.18);
    }


    body.ws-v5-sidebar-open
    .ws-v5-sidebar{

        display:block;
    }


    .ws-v5-welcome{

        min-height:58px;

        padding:
            0
            20px;
    }

}


/* === WORTH UI PRECISION V6 START === */


/* =========================================================
   EL PORTAL V5 NO DEBE CONVERTIR LOS BOTONES DEL HEADER
   EN BOTONES DEL DASHBOARD
   ========================================================= */

body.ws-v5-portal
.ws-v4-header
button.worth-submenu-trigger{

    background:#FFFFFF !important;

    background-color:#FFFFFF !important;

    color:#17443A !important;

    border-radius:0 !important;

    box-shadow:none !important;
}


body.ws-v5-portal
.ws-v4-header
button.worth-submenu-trigger:hover,

body.ws-v5-portal
.ws-v4-header
button.worth-submenu-trigger.is-active{

    background:#F7FAF8 !important;

    background-color:#F7FAF8 !important;

    color:#0F493B !important;
}


body.ws-v5-portal
.ws-v4-header
button.ws-v4-menu-button{

    background:transparent !important;

    background-color:transparent !important;

    border-radius:50% !important;

    box-shadow:none !important;
}


/* ninguna regla global del dashboard entra al footer */

body.ws-v5-portal
.ws-v4-footer-host button{

    box-shadow:none !important;
}


/* === WORTH UI PRECISION V6 END === */


/* === WORTH SHARED SHELL V11 GUARD START === */

/*
 * Ningún botón importado desde WordPress debe recibir
 * el estilo genérico de botones del portal.
 */

body.ws-v5-portal
#ws-wordpress-header-host button,

body.ws-v5-portal
#ws-wordpress-footer-host button{

    box-shadow:initial !important;
}


/*
 * Los estilos funcionales del portal quedan dentro
 * de la aplicación, no dentro del shell WordPress.
 */

body.ws-v5-portal
.ws-v5-dashboard-shell button,

body.ws-v5-portal
.ws-v5-dashboard-shell .btn{

    font-family:
        Barlow,"Helvetica Neue",Arial,sans-serif !important;
}


/* === WORTH SHARED SHELL V11 GUARD END === */


/* === WORTH SIDEBAR UX V12 START === */


/* =========================================================
   DESKTOP
   ========================================================= */

@media(min-width:1101px){

    /*
     * La columna queda pegada justo debajo
     * del header WordPress.
     */

    body.ws-v5-portal
    .ws-v5-sidebar{

        position:sticky !important;

        top:88px !important;

        align-self:start !important;

        height:
            calc(100vh - 88px) !important;

        max-height:
            calc(100vh - 88px) !important;

        overflow-y:auto !important;

        overflow-x:hidden !important;

        overscroll-behavior:contain;

        scrollbar-width:thin;

        z-index:90 !important;

        background:#FFFFFF !important;

        border-right:
            1px solid #DCE6E1 !important;

        box-shadow:none !important;
    }


    /*
     * Si el navegador ya está abajo,
     * la cabecera Administración queda visible.
     */

    body.ws-v5-portal
    .ws-v5-sidebar-head{

        position:sticky !important;

        top:0 !important;

        z-index:5 !important;

        background:#075846 !important;
    }


    /*
     * Logout permanece accesible al final.
     */

    body.ws-v5-portal
    .ws-v5-sidebar-logout{

        background:#FFFFFF !important;

        border-top:
            1px solid #E2EAE6 !important;
    }


    /*
     * Ocultar botón móvil en escritorio.
     */

    body.ws-v5-portal
    .ws-v5-mobile-panel{

        display:none !important;
    }

}


/* =========================================================
   SCROLLBAR SUTIL
   ========================================================= */

body.ws-v5-portal
.ws-v5-sidebar::-webkit-scrollbar{

    width:6px;
}


body.ws-v5-portal
.ws-v5-sidebar::-webkit-scrollbar-track{

    background:transparent;
}


body.ws-v5-portal
.ws-v5-sidebar::-webkit-scrollbar-thumb{

    background:#CBDDD5;

    border-radius:999px;
}


/* =========================================================
   TABLET / MOBILE
   Sidebar drawer
   ========================================================= */

@media(max-width:1100px){

    body.ws-v5-portal
    .ws-v5-dashboard-shell{

        display:block !important;

        width:
            calc(100% - 28px) !important;

        margin:
            18px
            auto
            40px !important;
    }


    body.ws-v5-portal
    .ws-v5-mobile-panel{

        display:flex !important;

        align-items:center !important;

        justify-content:space-between !important;

        width:100% !important;

        min-height:48px !important;

        margin:
            0
            0
            15px !important;

        padding:
            0
            17px !important;

        border:
            1px solid #D8E4DE !important;

        border-radius:8px !important;

        background:#FFFFFF !important;

        color:#0F493B !important;

        font-size:13px !important;

        font-weight:500 !important;

        box-shadow:none !important;
    }


    body.ws-v5-portal
    .ws-v5-sidebar{

        display:block !important;

        position:fixed !important;

        top:78px !important;

        left:0 !important;

        bottom:0 !important;

        width:
            min(320px,88vw) !important;

        height:
            calc(100vh - 78px) !important;

        max-height:none !important;

        overflow-y:auto !important;

        background:#FFFFFF !important;

        z-index:60000 !important;

        transform:
            translateX(-105%) !important;

        transition:
            transform .25s ease !important;

        box-shadow:
            18px
            0
            48px
            rgba(8,39,30,.18) !important;
    }


    body.ws-v5-sidebar-open
    .ws-v5-sidebar{

        transform:
            translateX(0) !important;
    }


    /*
     * Overlay oscuro detrás del drawer
     */

    body.ws-v5-sidebar-open::after{

        content:"";

        position:fixed;

        inset:78px 0 0 0;

        background:
            rgba(8,39,30,.28);

        z-index:59000;
    }


    /*
     * Mantener menú por encima del overlay.
     */

    body.ws-v5-sidebar-open
    .ws-v5-sidebar{

        z-index:60001 !important;
    }

}


/* =========================================================
   MOBILE PEQUEÑO
   ========================================================= */

@media(max-width:600px){

    body.ws-v5-portal
    .ws-v5-dashboard-shell{

        width:
            calc(100% - 20px) !important;
    }


    body.ws-v5-portal
    .ws-v5-sidebar{

        width:
            min(300px,92vw) !important;
    }

}


/* === WORTH SIDEBAR UX V12 END === */

