/* ============================================================
   WÖRTH · RECORDATORIO DE PERFIL CANDIDATO
   Solo modal. No modifica header, sidebar, logo ni footer.
   ============================================================ */

body.ws-profile-reminder-open{
    overflow:hidden !important;
}

.ws-profile-reminder-overlay{
    position:fixed;
    inset:0;
    z-index:9999999;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:28px;

    background:
        rgba(6,39,30,.58);

    backdrop-filter:
        blur(3px);

    -webkit-backdrop-filter:
        blur(3px);

    animation:
        wsProfileOverlayIn
        .20s
        ease-out;
}

.ws-profile-reminder-dialog{
    position:relative;

    width:min(
        100%,
        510px
    );

    max-height:
        calc(
            100vh - 44px
        );

    overflow:auto;

    padding:
        38px
        40px
        32px;

    background:
        #ffffff;

    border:
        1px solid
        rgba(7,81,62,.15);

    border-radius:
        18px;

    box-shadow:
        0 30px 80px
        rgba(5,45,34,.22);

    animation:
        wsProfileDialogIn
        .24s
        ease-out;
}

.ws-profile-reminder-close{
    position:absolute;

    top:18px;
    right:18px;

    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:0;
    border-radius:50%;

    background:
        #f2f6f3;

    color:
        #07513e;

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

    font-size:20px;
    line-height:1;

    cursor:pointer;

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

.ws-profile-reminder-close:hover{
    background:
        #e4efe9;

    transform:
        scale(1.04);
}

.ws-profile-reminder-eyebrow{
    margin:
        0
        0
        10px;

    color:
        #087258;

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

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        .14em;

    text-transform:
        uppercase;
}

.ws-profile-reminder-title{
    margin:
        0;

    color:
        #063f31;

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

    font-size:
        30px;

    font-weight:
        600;

    line-height:
        1.12;
}

.ws-profile-reminder-description{
    margin:
        13px
        0
        24px;

    max-width:
        420px;

    color:
        #60736c;

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

    font-size:
        13px;

    line-height:
        1.6;
}


/* ============================================================
   PROGRESO GENERAL
   ============================================================ */

.ws-profile-reminder-progress-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;

    gap:20px;

    margin-bottom:
        10px;
}

.ws-profile-reminder-progress-label{
    color:
        #244c40;

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

    font-size:
        12px;

    font-weight:
        600;
}

.ws-profile-reminder-progress-value{
    color:
        #07513e;

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

    font-size:
        26px;

    font-weight:
        600;

    line-height:
        1;
}

.ws-profile-reminder-track{
    width:100%;
    height:8px;

    margin-bottom:
        26px;

    overflow:hidden;

    border-radius:
        999px;

    background:
        #e8f0ec;
}

.ws-profile-reminder-fill{
    height:100%;

    border-radius:
        inherit;

    background:
        #087258;

    transition:
        width .5s ease;
}


/* ============================================================
   CATEGORÍAS
   ============================================================ */

.ws-profile-reminder-sections{
    display:flex;
    flex-direction:column;

    border-top:
        1px solid
        #e8eee9;
}

.ws-profile-reminder-row{
    display:grid;

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

    align-items:center;

    gap:12px;

    min-height:58px;

    border-bottom:
        1px solid
        #e8eee9;
}

.ws-profile-reminder-status{
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

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

    font-size:
        13px;

    font-weight:
        700;
}

.ws-profile-reminder-row.is-complete
.ws-profile-reminder-status{
    color:
        #087258;

    background:
        #e5f3ed;
}

.ws-profile-reminder-row.is-pending
.ws-profile-reminder-status{
    color:
        #8a6318;

    background:
        #faf1da;
}

.ws-profile-reminder-row-label{
    color:
        #173f34;

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

    font-size:
        13px;

    font-weight:
        600;
}

.ws-profile-reminder-row-score{
    color:
        #07513e;

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

    font-size:
        12px;

    font-weight:
        700;
}


/* ============================================================
   ACCIONES
   ============================================================ */

.ws-profile-reminder-actions{
    margin-top:
        28px;
}

.ws-profile-reminder-primary{
    width:100%;

    min-height:48px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:8px;

    padding:
        12px
        22px;

    border:
        1px solid
        #07513e;

    border-radius:
        999px;

    background:
        #07513e;

    color:
        #ffffff;

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

    font-size:
        13px;

    font-weight:
        700;

    cursor:pointer;

    transition:
        background .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.ws-profile-reminder-primary:hover{
    background:
        #063f31;

    transform:
        translateY(-1px);

    box-shadow:
        0 8px 24px
        rgba(7,81,62,.16);
}

.ws-profile-reminder-later{
    width:100%;

    margin-top:
        12px;

    padding:
        8px;

    border:0;

    background:
        transparent;

    color:
        #61756d;

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

    font-size:
        12px;

    font-weight:
        500;

    cursor:pointer;
}

.ws-profile-reminder-later:hover{
    color:
        #07513e;
}

.ws-profile-reminder-note{
    margin:
        14px
        0
        0;

    color:
        #87958f;

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

    font-size:
        10px;

    line-height:
        1.45;

    text-align:center;
}


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

@media(max-width:600px){

    .ws-profile-reminder-overlay{
        align-items:flex-end;

        padding:
            12px;
    }

    .ws-profile-reminder-dialog{
        width:100%;

        max-height:
            calc(
                100vh - 24px
            );

        padding:
            32px
            22px
            24px;

        border-radius:
            18px
            18px
            14px
            14px;
    }

    .ws-profile-reminder-title{
        font-size:
            27px;
    }
}


@keyframes wsProfileOverlayIn{

    from{
        opacity:0;
    }

    to{
        opacity:1;
    }
}


@keyframes wsProfileDialogIn{

    from{
        opacity:0;

        transform:
            translateY(14px)
            scale(.985);
    }

    to{
        opacity:1;

        transform:
            translateY(0)
            scale(1);
    }
}