/* ============================================================
   WÖRTH Selection · CONSULTOR VISUAL v2
   ============================================================ */

body.ws-role-recruiter{
    --worth-green:#07513e;
    --worth-green-2:#087258;
    --worth-soft:#e7f1ec;
    --worth-soft-2:#f1f6f3;
    --worth-sand:#c9a775;
    --worth-sand-soft:#f3e9da;
    --worth-cream:#f8f5ee;
    --worth-border:#dce4e0;
    --worth-muted:#74827c;

    background:var(--worth-cream) !important;
}


/* ============================================================
   CONTENIDO + FIGURAS DECORATIVAS
   ============================================================ */

body.ws-role-recruiter #content{
    position:relative !important;
    z-index:1;
    isolation:isolate;
}


/* círculo suave izquierdo */

body.ws-role-recruiter #content::before{
    content:"";

    position:absolute;

    z-index:-1;

    width:185px;
    height:185px;

    left:-95px;
    top:310px;

    border-radius:50%;

    background:
        rgba(203,233,218,.34);

    pointer-events:none;
}


/* cuadrado decorativo derecho */

body.ws-role-recruiter #content::after{
    content:"";

    position:absolute;

    z-index:-1;

    width:120px;
    height:120px;

    right:18px;
    bottom:45px;

    border:
        1.5px solid
        rgba(89,205,153,.28);

    border-radius:24px;

    transform:rotate(10deg);

    pointer-events:none;
}


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

body.ws-role-recruiter .sidebar{
    background:#fff !important;
    border-right:1px solid #e0e7e3 !important;
}


body.ws-role-recruiter .sidebar-title,
body.ws-role-recruiter #sidebarTitle{
    background:
        linear-gradient(
            135deg,
            #07513e,
            #08604a
        ) !important;

    color:#fff !important;
}


.ws-rec-nav-icon{
    width:30px;
    height:30px;

    flex:0 0 30px;

    display:grid;
    place-items:center;

    border-radius:8px;

    background:#eef5f2;
    color:#087258;

    transition:
        background .15s ease,
        transform .15s ease;
}


.ws-rec-nav-icon svg{
    width:16px;
    height:16px;
}


body.ws-role-recruiter .menu-item{
    display:flex !important;
    align-items:center !important;
    gap:9px !important;

    min-height:42px !important;

    border-radius:9px !important;

    transition:
        background .15s ease,
        color .15s ease,
        transform .15s ease !important;
}


body.ws-role-recruiter .menu-item:hover{
    background:#edf5f1 !important;
    color:#07513e !important;

    transform:translateX(2px);
}


body.ws-role-recruiter .menu-item:hover .ws-rec-nav-icon{
    background:#dcece4;
    transform:scale(1.04);
}


body.ws-role-recruiter .menu-item.active{
    background:#dcebe4 !important;
    color:#07513e !important;
    font-weight:700 !important;
}


body.ws-role-recruiter .menu-item.active .ws-rec-nav-icon{
    background:#fff;
}


/* ============================================================
   TÍTULOS
   ============================================================ */

body.ws-role-recruiter #content h1{
    color:#073f31 !important;

    font-family:
        Georgia,
        "Times New Roman",
        serif !important;

    font-weight:500 !important;

    letter-spacing:-.5px;
}


body.ws-role-recruiter #content h2,
body.ws-role-recruiter #content h3{
    color:#073f31 !important;
}


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

body.ws-role-recruiter .panel,
body.ws-role-recruiter .card,
body.ws-role-recruiter [class*="panel"],
body.ws-role-recruiter [class*="card"]{
    border-color:#dce4e0 !important;
}


body.ws-role-recruiter .ws-worth-card-hover{
    transition:
        transform .16s ease,
        box-shadow .16s ease,
        border-color .16s ease !important;
}


body.ws-role-recruiter .ws-worth-card-hover:hover{
    transform:translateY(-2px);

    border-color:#c9d8d1 !important;

    box-shadow:
        0 9px 24px
        rgba(27,61,48,.05) !important;
}


/* ============================================================
   ICONOS DE SECCIÓN
   ============================================================ */

.ws-rec-section-title{
    display:flex !important;
    align-items:center !important;
    gap:9px !important;
}


.ws-rec-section-icon{
    width:29px;
    height:29px;

    flex:0 0 29px;

    display:grid;
    place-items:center;

    border-radius:8px;

    background:#edf5f1;
    color:#087258;
}


.ws-rec-section-icon.sand{
    background:#f3e8d6;
    color:#a87837;
}


.ws-rec-section-icon svg{
    width:17px;
    height:17px;
}


/* ============================================================
   KPI
   ============================================================ */

.ws-rec-kpi-decorated{
    position:relative;

    overflow:hidden;
}


.ws-rec-kpi-decorated::after{
    content:"";

    position:absolute;

    width:48px;
    height:48px;

    right:-19px;
    bottom:-20px;

    border-radius:50%;

    background:
        rgba(192,229,210,.22);

    pointer-events:none;
}


.ws-rec-kpi-icon{
    width:37px;
    height:37px;

    display:grid;
    place-items:center;

    margin-bottom:8px;

    border-radius:50%;

    background:#edf5f1;
    color:#087258;
}


.ws-rec-kpi-icon svg{
    width:18px;
    height:18px;
}


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

body.ws-role-recruiter button,
body.ws-role-recruiter .btn{
    transition:
        transform .14s ease,
        background .14s ease,
        border-color .14s ease,
        box-shadow .14s ease;
}


body.ws-role-recruiter button:hover,
body.ws-role-recruiter .btn:hover{
    transform:translateY(-1px);
}


/* ============================================================
   TABLAS / FILAS
   ============================================================ */

body.ws-role-recruiter table tbody tr{
    transition:background .13s ease;
}


body.ws-role-recruiter table tbody tr:hover{
    background:#f6faf8 !important;
}


/* ============================================================
   NOTIFICACIONES
   ============================================================ */

body.ws-role-recruiter [class*="notification"]{
    transition:
        background .15s ease,
        border-color .15s ease,
        transform .15s ease;
}


body.ws-role-recruiter [class*="notification"]:hover{
    border-color:#cadbd2 !important;
}


/* ============================================================
   TOGGLES
   ============================================================ */

body.ws-role-recruiter input[type="checkbox"]:checked{
    accent-color:#07513e;
}


/* ============================================================
   TOP NAV
   ============================================================ */

body.ws-role-recruiter header a,
body.ws-role-recruiter header button,
body.ws-role-recruiter header span{
    transition:
        color .14s ease,
        background .14s ease;
}


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

@media(max-width:900px){

    body.ws-role-recruiter #content::before,
    body.ws-role-recruiter #content::after{
        display:none;
    }
}
