/* =========================================================
   WÖRTH SELECTION
   SHARED WORDPRESS SHELL V11
   ========================================================= */


/*
 * Ya no recreamos el header.
 * Este archivo solamente protege la integración
 * entre WordPress y la aplicación VPS.
 */


:root{
    --ws-shell-green:#0F3B2E;
    --ws-shell-cream:#F7F5EF;
}


/* =========================================================
   HOST HEADER
   ========================================================= */

#ws-wordpress-header-host{

    width:100%;

    min-height:90px;

    position:relative;

    z-index:50000;

    background:#FFFFFF;
}


/* El header importado siempre usa todo el ancho */

#ws-wordpress-header-host
.site-header,

#ws-wordpress-header-host
#masthead{

    width:100% !important;

    position:relative !important;

    z-index:50000 !important;
}


/* evitar reglas antiguas del portal */

#ws-wordpress-header-host
button,

#ws-wordpress-header-host
a{

    box-shadow:none;
}


/* =========================================================
   MEGA MENU
   ========================================================= */

#ws-wordpress-header-host
.worth-dropdown-panel{

    z-index:51000 !important;
}


/* =========================================================
   HOST FOOTER
   ========================================================= */

#ws-wordpress-footer-host{

    width:100%;

    position:relative;

    z-index:100;

    clear:both;
}


#ws-wordpress-footer-host
#colophon,

#ws-wordpress-footer-host
.site-footer,

#ws-wordpress-footer-host
.worth-footer-final{

    width:100% !important;

    max-width:none !important;

    margin-left:0 !important;

    margin-right:0 !important;
}


/* =========================================================
   CONTEXTO WORDPRESS
   ========================================================= */

.ws-wordpress-body-context{

    width:100%;
}


/* =========================================================
   EL DASHBOARD NO HEREDA ESTRUCTURAS ASTRA
   ========================================================= */

.ws-v5-dashboard-shell,
.ws-v5-dashboard-main,
.ws-v5-sidebar{

    box-sizing:border-box;
}


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

@media(max-width:921px){

    #ws-wordpress-header-host{
        min-height:70px;
    }

}


/* =========================================================
   LOADING
   ========================================================= */

.ws-shell-loading{

    min-height:90px;

    background:#FFFFFF;
}


.ws-shell-fallback{

    min-height:88px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#FFFFFF;

    color:#0F3B2E;

    font-family:Inter,Arial,sans-serif;
}


/* =========================================================
   IMPORTANTE
   Ningún estilo del portal convierte botones del header
   ========================================================= */

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

    background-color:initial;

    border-radius:initial;

}


body.ws-v5-portal
#ws-wordpress-header-host
.worth-top-link{

    font-weight:inherit;
}



/* === WORTH V11 MODE SWITCH START === */


/* =========================================================
   ESTADO INICIAL
   Portal /worth/ abre como CANDIDATOS
   ========================================================= */

#ws-wordpress-header-host
.worth-top-nav-companies{
    display:none !important;
}


#ws-wordpress-header-host
.worth-top-nav-candidates{
    display:flex !important;
}


/* =========================================================
   MODO CANDIDATOS
   ========================================================= */

body.ws-header-mode-candidates
#ws-wordpress-header-host
.worth-top-nav-candidates{

    display:flex !important;
}


body.ws-header-mode-candidates
#ws-wordpress-header-host
.worth-top-nav-companies{

    display:none !important;
}



/* =========================================================
   MODO EMPRESAS
   ========================================================= */

body.ws-header-mode-companies
#ws-wordpress-header-host
.worth-top-nav-candidates{

    display:none !important;
}


body.ws-header-mode-companies
#ws-wordpress-header-host
.worth-top-nav-companies{

    display:flex !important;
}



/* =========================================================
   SWITCH
   ========================================================= */

#ws-wordpress-header-host
.worth-header-switch{

    display:flex !important;

    align-items:center !important;
}


#ws-wordpress-header-host
.worth-header-switch
.worth-switch-item{

    display:flex !important;

    align-items:center !important;

    justify-content:center !important;

    cursor:pointer !important;

    line-height:1 !important;
}



/* activo candidatos */

body.ws-header-mode-candidates
#ws-wordpress-header-host
.worth-header-switch
.worth-switch-item:first-child{

    background:#0F3B2E !important;

    color:#FFFFFF !important;
}


body.ws-header-mode-candidates
#ws-wordpress-header-host
.worth-header-switch
.worth-switch-item:last-child{

    background:transparent !important;

    color:#0F3B2E !important;
}



/* activo empresas */

body.ws-header-mode-companies
#ws-wordpress-header-host
.worth-header-switch
.worth-switch-item:first-child{

    background:transparent !important;

    color:#0F3B2E !important;
}


body.ws-header-mode-companies
#ws-wordpress-header-host
.worth-header-switch
.worth-switch-item:last-child{

    background:#0F3B2E !important;

    color:#FFFFFF !important;
}



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

@media(max-width:921px){

    body.ws-header-mode-candidates
    #ws-wordpress-header-host
    .worth-top-nav-candidates,

    body.ws-header-mode-companies
    #ws-wordpress-header-host
    .worth-top-nav-companies{

        flex-direction:column !important;
    }

}


/* === WORTH V11 MODE SWITCH END === */


/* === WORTH MEGAMENU FIDELITY START === */


/* =========================================================
   ESTRUCTURA GENERAL
   ========================================================= */

#ws-wordpress-header-host
.worth-dropdown-panel{

    background:#FFFFFF !important;
}


#ws-wordpress-header-host
.worth-dropdown-inner{

    background:#FFFFFF !important;
}



/* =========================================================
   COLUMNA CENTRAL
   El portal estaba contaminando esta zona con verde oscuro.
   ========================================================= */

#ws-wordpress-header-host
.worth-menu-primary{

    background:#FFFFFF !important;

    color:#17443A !important;

    opacity:1 !important;
}



/* =========================================================
   ITEMS DE LA COLUMNA CENTRAL
   ========================================================= */

#ws-wordpress-header-host
.worth-submenu-trigger{

    display:flex !important;

    align-items:center !important;

    justify-content:space-between !important;

    width:100% !important;

    min-height:58px !important;

    margin:0 0 18px !important;

    padding:
        0
        4px !important;

    background:#FFFFFF !important;

    background-color:#FFFFFF !important;

    color:#17443A !important;

    border:0 !important;

    border-bottom:
        1px solid #DDE7E2 !important;

    border-radius:0 !important;

    box-shadow:none !important;

    opacity:1 !important;

    font-family:
        Inter,
        Arial,
        sans-serif !important;

    font-size:14px !important;

    font-weight:400 !important;

    line-height:1.2 !important;

    text-align:left !important;

    cursor:pointer !important;
}



/* ACTIVO */

#ws-wordpress-header-host
.worth-submenu-trigger.is-active{

    background:#F6FAF8 !important;

    background-color:#F6FAF8 !important;

    color:#0F493B !important;

    border-bottom-color:
        #A7F3D0 !important;
}



/* HOVER */

#ws-wordpress-header-host
.worth-submenu-trigger:hover{

    background:#F7FAF8 !important;

    background-color:#F7FAF8 !important;

    color:#0F493B !important;
}



/* FLECHA */

#ws-wordpress-header-host
.worth-menu-arrow{

    color:#55776E !important;

    opacity:1 !important;

    font-size:20px !important;

    font-weight:300 !important;
}



/* =========================================================
   COLUMNA DERECHA
   ========================================================= */

#ws-wordpress-header-host
.worth-menu-secondary{

    background:#FFFFFF !important;

    color:#17443A !important;
}


#ws-wordpress-header-host
.worth-menu-title{

    color:#91A49D !important;

    opacity:1 !important;
}


#ws-wordpress-header-host
.worth-submenu-panel a{

    color:#17443A !important;

    background:transparent !important;

    opacity:1 !important;
}


#ws-wordpress-header-host
.worth-submenu-panel a:hover{

    color:#08765E !important;
}



/* =========================================================
   IMPORTANTE:
   NO alteramos las tarjetas izquierdas.
   Sus colores dependen de cada sección:
   amarillo / mint / crema / verde.
   ========================================================= */


/* === WORTH MEGAMENU FIDELITY END === */


/* === MyWorth: alineación con marca (2026-10-16) === */
:root{
  --ws-brand:#0F3B2E; --ws-brand-2:#1B5E48; --ws-gold:#C5A880; --ws-text:#333333;
}
#loginForm input:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px #fff inset !important;
  -webkit-text-fill-color:var(--ws-text) !important;
}
#loginForm input:focus{
  border-color:var(--ws-brand) !important;
  box-shadow:0 0 0 3px rgba(15,59,46,.12) !important; outline:none !important;
}
#loginForm input[type=checkbox]{ accent-color:var(--ws-brand); width:18px; height:18px; }
#loginForm .btn-primary{
  background:var(--ws-brand) !important; border-color:var(--ws-brand) !important;
  font-weight:600 !important; transition:background .2s ease;
}
#loginForm .btn-primary:hover{ background:var(--ws-brand-2) !important; }
#loginForm .eye{
  font-size:0 !important; width:40px; height:40px; border:0 !important;
  background:transparent center/20px no-repeat !important; cursor:pointer;
  background-image:url("https://api.iconify.design/lucide/eye.svg?color=%230F3B2E") !important;
}

/* Fix 2026-10-16: título duplicado en login (redesign v2) */
.ws-auth-v2-login #loginForm > .auth-title { display: none; }

/* === MyWorth: panel Regístrate alineado a marca (2026-10-16) === */
.ws-auth-v2-register-button,
#loginForm .btn-primary{
  min-height:56px !important; border-radius:999px !important;
  font-family:Inter,"Helvetica Neue",Arial,sans-serif !important;
  font-size:16px !important; font-weight:600 !important; letter-spacing:.01em !important;
}
.ws-auth-v2-register-button{
  background:var(--ws-brand) !important; border-color:var(--ws-brand) !important;
  color:#fff !important; transition:background .2s ease;
}
.ws-auth-v2-register-button:hover{ background:var(--ws-brand-2) !important; }
.ws-auth-v2-visual{ background:var(--ws-brand) !important; }
.ws-auth-v2-person-shape{ background:var(--ws-gold) !important; }
.ws-auth-v2-benefits li::before{ color:var(--ws-brand-2) !important; }

/* === MyWorth: botones alineados al fondo de cada columna (2026-10-16) === */
.ws-auth-v2-login, .ws-auth-v2-register{
  display:flex !important; flex-direction:column !important; padding-bottom:56px !important;
}
.ws-auth-v2-login-inner, #ws-auth-v2-form-mount, .ws-auth-v2-login #loginForm{
  flex:1 1 auto !important; display:flex !important; flex-direction:column !important;
}
.ws-auth-v2-login #loginForm .btn-primary,
.ws-auth-v2-register .ws-auth-v2-register-button{ margin-top:auto !important; margin-bottom:0 !important; }

/* === Íconos del header (accesibilidad y cuenta) === */
div:has(> .ws-auth-v2-icon){ display:flex !important; align-items:center !important; gap:8px !important; }
.ws-auth-v2-icon{
  width:44px; height:44px; display:inline-flex !important; align-items:center; justify-content:center;
  border:0; border-radius:50%; background:transparent; color:var(--ws-brand) !important; cursor:pointer;
  transition:background .2s ease;
}
.ws-auth-v2-icon:hover, .ws-auth-v2-icon:focus-visible{ background:#e6efea; outline:none; }
.ws-auth-v2-icon svg{ width:28px !important; height:28px !important; stroke:currentColor; stroke-width:1.8; }

/* === MyWorth: panel de accesibilidad estilo cajón lateral (2026-10-16) === */
.ws-worth-guide{
  position:fixed !important; top:0 !important; right:0 !important; left:auto !important; bottom:0 !important;
  width:min(400px,100vw) !important; height:100vh !important; max-height:none !important; margin:0 !important;
  background:#fff !important; border:0 !important; border-radius:0 !important;
  box-shadow:-12px 0 40px rgba(15,59,46,.18) !important; z-index:10000 !important;
  overflow-y:auto !important; transform:translateX(100%); visibility:hidden;
  transition:transform .3s ease, visibility .3s ease !important;
  font-family:Inter,"Helvetica Neue",Arial,sans-serif !important; color:var(--ws-text) !important;
}
.ws-worth-guide.is-open{ transform:none !important; visibility:visible !important; opacity:1 !important; }
.ws-worth-guide-header{
  background:var(--ws-brand) !important; color:#fff !important; padding:24px !important;
  display:flex !important; align-items:center !important; justify-content:space-between !important;
}
.ws-worth-guide-header-title strong{
  font-family:"Cormorant Garamond",Georgia,serif !important; font-size:28px !important;
  font-weight:600 !important; color:#fff !important;
}
.ws-worth-guide-header-title span{ color:rgba(255,255,255,.8) !important; }
.ws-worth-guide-close{
  width:40px !important; height:40px !important; border-radius:50% !important; border:0 !important;
  background:rgba(255,255,255,.12) !important; color:#fff !important; cursor:pointer;
}
.ws-worth-guide-close:hover{ background:rgba(255,255,255,.25) !important; }
.ws-worth-guide-body{ padding:24px !important; }
.ws-worth-guide-section h3{
  font-size:13px !important; letter-spacing:.08em !important; text-transform:uppercase !important;
  color:var(--ws-brand-2) !important; margin:0 0 12px !important;
}
.ws-worth-guide-tools{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:12px !important; }
.ws-worth-guide-tool{
  min-height:88px !important; padding:14px !important; border:1.5px solid #d7e3dc !important;
  border-radius:14px !important; background:#f6faf8 !important; color:var(--ws-brand) !important;
  font-weight:600 !important; text-align:left !important; cursor:pointer;
  transition:border-color .2s, background .2s !important;
}
.ws-worth-guide-tool:hover{ border-color:var(--ws-brand-2) !important; background:#edf4f0 !important; }
.ws-worth-guide-tool.is-active{
  background:var(--ws-brand) !important; border-color:var(--ws-brand) !important; color:#fff !important;
}
#wsWorthResetA11y{
  width:100% !important; margin-top:16px !important; min-height:48px !important; border-radius:999px !important;
  border:1.5px solid var(--ws-brand) !important; background:#fff !important; color:var(--ws-brand) !important;
  font-weight:600 !important; cursor:pointer;
}
.ws-worth-guide-step-number{ background:var(--ws-gold) !important; color:var(--ws-brand) !important; }

/* === MyWorth: centrado y botones idénticos (2026-10-16) === */
.ws-auth-v2 .ws-auth-v2-login .ws-auth-v2-login-inner{
  align-self:center !important; width:min(462px,100%) !important;
  margin-left:auto !important; margin-right:auto !important;
}
.ws-auth-v2 .ws-auth-v2-login #loginForm button.btn.btn-primary,
.ws-auth-v2 .ws-auth-v2-register button.ws-auth-v2-register-button{
  height:58px !important; min-height:58px !important; width:100% !important;
  background:var(--ws-brand) !important; border:0 !important; color:#fff !important;
  font-family:Inter,"Helvetica Neue",Arial,sans-serif !important;
  font-size:16px !important; font-weight:600 !important; border-radius:999px !important;
}
.ws-auth-v2 .ws-auth-v2-login #loginForm button.btn.btn-primary:hover,
.ws-auth-v2 .ws-auth-v2-register button.ws-auth-v2-register-button:hover{
  background:var(--ws-brand-2) !important;
}

/* === MyWorth: decoración de fondo en columna login (2026-10-16) === */
.ws-auth-v2 .ws-auth-v2-login{ position:relative !important; overflow:hidden !important; isolation:isolate; }
.ws-auth-v2 .ws-auth-v2-login::before{
  content:""; position:absolute; z-index:-1; pointer-events:none;
  width:520px; height:520px; border-radius:50%; left:-220px; bottom:-240px;
  background:radial-gradient(circle at center, rgba(197,168,128,.30) 0%, rgba(197,168,128,.12) 45%, rgba(197,168,128,0) 70%);
}
.ws-auth-v2 .ws-auth-v2-login::after{
  content:""; position:absolute; z-index:-1; pointer-events:none;
  width:300px; height:300px; border-radius:50%; top:60px; left:-170px;
  border:1.5px solid rgba(15,59,46,.12);
  box-shadow:calc(100% + 0px) 0 0 0 transparent;
}
.ws-auth-v2 .ws-auth-v2-login-inner{ position:relative; }
.ws-auth-v2 .ws-auth-v2-login-inner::before{
  content:""; position:absolute; z-index:-1; pointer-events:none;
  width:14px; height:14px; border-radius:50%; background:var(--ws-gold);
  top:28px; right:-40px;
}
.ws-auth-v2 #loginForm input[type=email],
.ws-auth-v2 #loginForm input[type=password],
.ws-auth-v2 #loginForm input[type=text]{ background:#fff !important; }
@media (max-width:900px){
  .ws-auth-v2 .ws-auth-v2-login::before,
  .ws-auth-v2 .ws-auth-v2-login::after,
  .ws-auth-v2 .ws-auth-v2-login-inner::before{ display:none; }
}

/* === MyWorth: ajuste de composición columna login (2026-10-16) === */
.ws-auth-v2 .ws-auth-v2-login::after,
.ws-auth-v2 .ws-auth-v2-login-inner::before{ display:none !important; }
.ws-auth-v2 .ws-auth-v2-login #loginForm{ justify-content:space-between !important; }
.ws-auth-v2 .ws-auth-v2-login #loginForm .btn-primary{ margin-top:12px !important; }
.ws-auth-v2 #loginForm .error:empty{ display:none !important; }
.ws-auth-v2 .ws-auth-v2-login-inner > h1::after,
.ws-auth-v2 .ws-auth-v2-register > h2::after{
  content:""; display:block; width:56px; height:2px; margin:18px auto 0;
  background:var(--ws-gold); border-radius:2px;
}

/* Fix: panel de accesibilidad por encima del layout (2026-10-16) */
.ws-worth-guide{ z-index:1000002 !important; }

/* === Login: logo y header iguales a la web principal (2026-10-16) === */
body .ws-auth-v2 .ws-auth-v2-header{
  height:90px !important; min-height:90px !important; max-width:none !important; box-sizing:border-box !important;
  padding:0 max(18px, calc((100% - 1140px) / 2)) !important;
  display:flex !important; align-items:center !important; justify-content:space-between !important;
}
body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-logo,
body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-logo-mount{
  display:flex !important; align-items:center !important; margin:0 !important; padding:0 !important; height:auto !important;
}
body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-logo-mount img{
  width:165px !important; height:auto !important; max-width:none !important; max-height:none !important;
  margin:0 !important; position:static !important; transform:none !important;
}
@media (max-width:921px){
  body .ws-auth-v2 .ws-auth-v2-header{ height:77px !important; min-height:77px !important; }
  body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-logo-mount img{ width:130px !important; }
}
@media (max-width:544px){
  body .ws-auth-v2 .ws-auth-v2-header{ height:71px !important; min-height:71px !important; }
  body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-logo-mount img{ width:105px !important; }
}

/* === Login: logo igual al inicio, prioridad por ID (2026-10-16 v2) === */
html body div.ws-auth-v2 header.ws-auth-v2-header{
  height:100px !important; min-height:100px !important; max-width:none !important; box-sizing:border-box !important;
  padding:0 max(18px, calc((100% - 1254px) / 2)) !important;
  display:flex !important; align-items:center !important; justify-content:space-between !important;
}
html body div.ws-auth-v2 header.ws-auth-v2-header a.ws-auth-v2-logo span.ws-auth-v2-logo-mount img#wsWorthCleanLogo.custom-logo{
  width:187px !important; min-width:0 !important; max-width:none !important;
  height:auto !important; max-height:none !important;
  margin:0 !important; position:static !important; transform:none !important;
}
@media (max-width:921px){
  html body div.ws-auth-v2 header.ws-auth-v2-header{ height:77px !important; min-height:77px !important; }
  html body div.ws-auth-v2 header.ws-auth-v2-header a.ws-auth-v2-logo span.ws-auth-v2-logo-mount img#wsWorthCleanLogo.custom-logo{ width:130px !important; }
}
@media (max-width:544px){
  html body div.ws-auth-v2 header.ws-auth-v2-header{ height:71px !important; min-height:71px !important; }
  html body div.ws-auth-v2 header.ws-auth-v2-header a.ws-auth-v2-logo span.ws-auth-v2-logo-mount img#wsWorthCleanLogo.custom-logo{ width:105px !important; }
}

/* === Login: check de beneficios sin caracteres rotos (2026-10-16) === */
html body .ws-auth-v2 .ws-auth-v2-benefits li::before{ content:"\2713" !important; color:#C5A880 !important; font-family:Inter, Arial, sans-serif !important; font-weight:600 !important; }

/* === Login: logo igual al inicio, valores finales (2026-10-16 v3) === */
@media (min-width:922px){
  html body div.ws-auth-v2 header.ws-auth-v2-header{ height:90px !important; min-height:90px !important; padding:0 max(18px, calc((100% - 1140px) / 2)) !important; }
  html body div.ws-auth-v2 header.ws-auth-v2-header a.ws-auth-v2-logo span.ws-auth-v2-logo-mount img#wsWorthCleanLogo.custom-logo{ width:180px !important; }
}

/* === Login: sin salto al cargar (2026-10-16) === */
body:has(#loginForm):not(:has(.ws-auth-v2)){ visibility:hidden; animation:wsAuthReveal 0s 1.5s forwards; }
@keyframes wsAuthReveal{ to{ visibility:visible; } }
.ws-auth-v2{ animation:wsAuthFade .3s ease-out both; }
@keyframes wsAuthFade{ from{ opacity:0; } to{ opacity:1; } }

/* === Login: icono de usuario relleno, igual al inicio (2026-10-16) === */
html body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-icon[aria-label^="Iniciar ses"] svg,
html body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-icon[aria-label^="Iniciar ses"] i{ display:none !important; }
html body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-icon[aria-label^="Iniciar ses"]::before{
  content:""; display:block; width:20px; height:22px; background:#0F3B2E;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512h388.6c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512h388.6c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* === Login: iconos del header con el tamaño y color del inicio (2026-10-16) === */
html body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-icon{ color:#000 !important; }
html body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-icon svg{ width:18px !important; height:18px !important; }
html body .ws-auth-v2 .ws-auth-v2-header .ws-auth-v2-icon[aria-label^="Iniciar ses"]::before{ width:18px !important; height:18px !important; background:#000 !important; }