
/* ============================================================
   WÖRTH · TALENT FLOW V2
   ============================================================ */

.ws-tf-card{
    border:
        1px solid #DDE7E2;

    border-radius:15px;

    background:#fff;

    box-shadow:
        0 8px 24px
        rgba(8,47,39,.035);

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


/* ============================================================
   CANDIDATO · TALENT POOL
   ============================================================ */

.ws-tf-candidate-pool{
    position:relative;

    overflow:hidden;

    margin:
        18px 0;

    padding:
        24px 25px;
}


.ws-tf-candidate-pool::after{
    content:"";

    position:absolute;

    width:170px;
    height:170px;

    right:-75px;
    top:-80px;

    border-radius:50%;

    background:
        rgba(
            167,
            243,
            208,
            .22
        );
}


.ws-tf-pool-layout{
    position:relative;

    z-index:1;

    display:grid;

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

    align-items:center;

    gap:25px;
}


.ws-tf-eyebrow{
    margin-bottom:7px;

    color:#16816A;

    font-size:9px;

    font-weight:600;

    letter-spacing:.15em;

    text-transform:uppercase;
}


.ws-tf-candidate-pool h2,
.ws-tf-company-requests h2,
.ws-tf-staff h2{
    margin:0;

    color:#0F3B2E;

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

    font-weight:600 !important;

    line-height:1.05;
}


.ws-tf-candidate-pool h2{
    font-size:
        clamp(27px,3vw,35px);
}


.ws-tf-candidate-pool p{
    max-width:690px;

    margin:
        8px 0 0;

    color:#71817B;

    font-size:11.5px;

    line-height:1.65;
}


.ws-tf-privacy-pills{
    display:flex;

    flex-wrap:wrap;

    gap:6px;

    margin-top:14px;
}


.ws-tf-pill{
    padding:
        6px 9px;

    border-radius:999px;

    background:#EFF6F2;

    color:#356054;

    font-size:9.5px;
}


/* SWITCH */

.ws-tf-switch-wrap{
    display:flex;

    flex-direction:column;

    align-items:center;

    gap:8px;

    min-width:140px;
}


.ws-tf-switch{
    position:relative;

    width:58px;
    height:31px;

    cursor:pointer;
}


.ws-tf-switch input{
    position:absolute;

    opacity:0;
}


.ws-tf-switch-track{
    position:absolute;

    inset:0;

    border-radius:999px;

    background:#D9E3DE;

    transition:
        .2s ease;
}


.ws-tf-switch-track::after{
    content:"";

    position:absolute;

    width:23px;
    height:23px;

    left:4px;
    top:4px;

    border-radius:50%;

    background:#fff;

    box-shadow:
        0 2px 6px
        rgba(0,0,0,.14);

    transition:
        .2s ease;
}


.ws-tf-switch input:checked
+
.ws-tf-switch-track{
    background:#0F493B;
}


.ws-tf-switch input:checked
+
.ws-tf-switch-track::after{
    transform:
        translateX(27px);
}


.ws-tf-pool-state{
    color:#5D756D;

    font-size:10px;

    text-align:center;
}


.ws-tf-pool-warning{
    margin-top:12px;

    padding:
        9px 11px;

    border-radius:8px;

    background:#FFF7E9;

    color:#745B2F;

    font-size:10px;

    line-height:1.5;
}


/* ============================================================
   EMPRESA · MIS SOLICITUDES
   ============================================================ */

.ws-tf-company-requests{
    margin:
        20px 0 28px;

    padding:
        25px;
}


.ws-tf-company-header,
.ws-tf-staff-header{
    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:20px;
}


.ws-tf-company-requests h2,
.ws-tf-staff h2{
    font-size:
        clamp(28px,3vw,37px);
}


.ws-tf-company-requests p,
.ws-tf-staff-subtitle{
    margin:
        7px 0 0;

    color:#74847E;

    font-size:11px;

    line-height:1.55;
}


.ws-tf-new-request{
    min-height:39px;

    padding:
        0 15px;

    border:0;

    border-radius:999px;

    background:#0F493B;

    color:#fff;

    font-size:10.5px;

    cursor:pointer;
}


.ws-tf-summary{
    display:grid;

    grid-template-columns:
        repeat(5,minmax(0,1fr));

    gap:8px;

    margin:
        20px 0;
}


.ws-tf-summary-card{
    padding:
        12px 13px;

    border:
        1px solid #E1E9E5;

    border-radius:10px;

    background:#F9FBFA;
}


.ws-tf-summary-card strong{
    display:block;

    color:#0F493B;

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

    font-size:24px;

    font-weight:600;

    line-height:1;
}


.ws-tf-summary-card span{
    display:block;

    margin-top:5px;

    color:#7A8984;

    font-size:9px;
}


.ws-tf-request-list{
    display:grid;

    gap:9px;
}


.ws-tf-request{
    padding:
        15px 16px;

    border:
        1px solid #E1E9E5;

    border-radius:11px;

    background:#fff;
}


.ws-tf-request-top{
    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:15px;
}


.ws-tf-request-title{
    color:#214D41;

    font-size:12.5px;

    font-weight:600;
}


.ws-tf-request-meta{
    margin-top:5px;

    color:#7A8A84;

    font-size:9.5px;

    line-height:1.5;
}


.ws-tf-status{
    flex:0 0 auto;

    padding:
        6px 9px;

    border-radius:999px;

    background:#EDF5F1;

    color:#22584A;

    font-size:9px;

    font-weight:600;
}


.ws-tf-progress{
    display:grid;

    grid-template-columns:
        repeat(5,1fr);

    gap:4px;

    margin-top:13px;
}


.ws-tf-progress span{
    height:4px;

    border-radius:999px;

    background:#E5ECE8;
}


.ws-tf-progress span.is-done{
    background:#0F493B;
}


.ws-tf-empty{
    padding:
        32px 18px;

    border:
        1px dashed #CDDAD4;

    border-radius:11px;

    color:#76867F;

    font-size:11px;

    text-align:center;
}


/* COMPANY NAV */

.ws-tf-company-nav{
    display:flex !important;

    align-items:center;

    gap:9px;
}


/* ============================================================
   STAFF INBOX
   ============================================================ */

.ws-tf-staff{
    margin:
        15px 0 28px;

    padding:
        25px;
}


.ws-tf-staff-refresh{
    min-height:37px;

    padding:
        0 14px;

    border:
        1px solid #D1DED8;

    border-radius:999px;

    background:#fff;

    color:#194C3F;

    font-size:10px;

    cursor:pointer;
}


.ws-tf-staff-grid{
    display:grid;

    gap:11px;
}


.ws-tf-staff-card{
    padding:
        18px;

    border:
        1px solid #E0E9E4;

    border-radius:12px;

    background:#fff;
}


.ws-tf-staff-card-top{
    display:flex;

    justify-content:space-between;

    gap:16px;
}


.ws-tf-company-name{
    color:#16816A;

    font-size:9px;

    font-weight:600;

    letter-spacing:.08em;

    text-transform:uppercase;
}


.ws-tf-staff-title{
    margin-top:4px;

    color:#173F35;

    font-size:14px;

    font-weight:600;
}


.ws-tf-staff-meta{
    margin-top:5px;

    color:#778781;

    font-size:9.5px;

    line-height:1.5;
}


.ws-tf-staff-controls{
    display:grid;

    grid-template-columns:
        minmax(160px,220px)
        minmax(180px,260px)
        auto;

    gap:8px;

    margin-top:14px;
}


.ws-tf-staff select,
.ws-tf-staff textarea{
    box-sizing:border-box;

    width:100%;

    border:
        1px solid #D7E2DC;

    border-radius:8px;

    background:#fff;

    color:#31584D;

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

    font-size:10.5px;
}


.ws-tf-staff select{
    height:38px;

    padding:
        0 9px;
}


.ws-tf-staff textarea{
    min-height:76px;

    padding:
        9px;

    resize:vertical;
}


.ws-tf-save,
.ws-tf-claim{
    min-height:38px;

    padding:
        0 13px;

    border:0;

    border-radius:999px;

    background:#0F493B;

    color:#fff;

    font-size:10px;

    cursor:pointer;
}


.ws-tf-details{
    margin-top:12px;

    border-top:
        1px solid #EDF1EF;

    padding-top:10px;
}


.ws-tf-details summary{
    color:#47675E;

    font-size:10px;

    cursor:pointer;
}


.ws-tf-note-label{
    display:block;

    margin:
        10px 0 5px;

    color:#60776F;

    font-size:9px;
}


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

@media(max-width:1100px){

    .ws-tf-summary{
        grid-template-columns:
            repeat(3,1fr);
    }


    .ws-tf-staff-controls{
        grid-template-columns:
            1fr 1fr;
    }

}


@media(max-width:720px){

    .ws-tf-pool-layout{
        grid-template-columns:1fr;
    }


    .ws-tf-switch-wrap{
        align-items:flex-start;
    }


    .ws-tf-company-header,
    .ws-tf-staff-header{
        flex-direction:column;
    }


    .ws-tf-summary{
        grid-template-columns:
            repeat(2,1fr);
    }


    .ws-tf-request-top,
    .ws-tf-staff-card-top{
        flex-direction:column;
    }


    .ws-tf-staff-controls{
        grid-template-columns:1fr;
    }


    .ws-tf-company-requests,
    .ws-tf-staff,
    .ws-tf-candidate-pool{
        padding:
            19px 16px;
    }

}

