/*
 * Stilurile elementelor produse de plugin: pragul de donație, mesajele de
 * închidere, numărătoarea inversă și pagina de validare.
 *
 * Paleta este cea din materialele grafice ale evenimentului. O ținem aici, nu în
 * temă, pentru că elementele astea se afișează oriunde sunt puse shortcode-urile,
 * nu doar pe pagina de landing.
 */

.sohcs {
    --sohcs-portocaliu: #d33706;
    --sohcs-crem: #efe9db;
    --sohcs-albastru: #053ad4;
}

.sohcs-prag,
.sohcs-inchis,
.sohcs-countdown,
.sohcs-validare {
    --sohcs-portocaliu: #d33706;
    --sohcs-crem: #efe9db;
    --sohcs-albastru: #053ad4;
    font-family: inherit;
}

/* --- Pragul activ ------------------------------------------------------- */

.sohcs-prag {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 18px;
    font-size: clamp(1rem, 2.4vw, 1.25rem);
    line-height: 1.4;
}

.sohcs-prag__acum {
    color: var(--sohcs-portocaliu);
    font-weight: 700;
}

.sohcs-prag__acum strong {
    font-size: 1.35em;
    font-weight: 800;
}

.sohcs-prag__urmator {
    position: relative;
    padding-left: 18px;
    opacity: 0.75;
    font-size: 0.9em;
}

.sohcs-prag__urmator::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.45em;
    width: 8px;
    height: 8px;
    background: var(--sohcs-albastru);
}

.sohcs-prag--closed .sohcs-prag__acum,
.sohcs-prag--full .sohcs-prag__acum,
.sohcs-prag--gap .sohcs-prag__acum,
.sohcs-prag--before .sohcs-prag__acum {
    color: inherit;
}

/* --- Mesajul de înscrieri închise --------------------------------------- */

.sohcs-inchis {
    padding: 28px 24px;
    border: 3px solid var(--sohcs-portocaliu);
    background: var(--sohcs-crem);
    text-align: center;
}

.sohcs-inchis__titlu {
    margin: 0 0 8px;
    color: var(--sohcs-portocaliu);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.sohcs-inchis__mesaj {
    margin: 0;
}

/* --- Numărătoare inversă ------------------------------------------------ */

.sohcs-countdown {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.sohcs-countdown__unit {
    flex: 1 1 70px;
    min-width: 70px;
    padding: 10px 6px;
    background: var(--sohcs-portocaliu);
    color: var(--sohcs-crem);
    text-align: center;
}

.sohcs-countdown__unit span {
    display: block;
    font-size: clamp(1.5rem, 5vw, 2.25rem);
    font-weight: 800;
    line-height: 1;
    /* Cifrele tabulare împiedică lățimea să sară la fiecare secundă. */
    font-variant-numeric: tabular-nums;
}

.sohcs-countdown__unit em {
    display: block;
    margin-top: 4px;
    font-size: 0.75rem;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.85;
}

.sohcs-countdown__gata {
    padding: 14px 18px;
    width: 100%;
    background: var(--sohcs-albastru);
    color: #fff;
    font-weight: 800;
    text-align: center;
    text-transform: uppercase;
}

/* --- Pagina de validare ------------------------------------------------- */

/* Woodmart tratează ruta virtuală ca arhiva implicită și afișează bannerul
 * „Blog”. Pe pagina de scanare păstrăm headerul site-ului, dar eliminăm bannerul
 * și breadcrumb-ul fără să afectăm paginile reale de blog. */
.sohcs-validare-page .page-title {
    display: none !important;
}

.sohcs-validare {
    display: flex;
    justify-content: center;
    padding: 48px 20px;
}

.sohcs-validare__card {
    width: 100%;
    max-width: 420px;
    padding: 32px 28px;
    border: 3px solid var(--sohcs-portocaliu);
    background: var(--sohcs-crem);
    text-align: center;
}

.sohcs-validare__card--invalid {
    border-color: #8a8a8a;
}

.sohcs-validare__card h1 {
    margin: 0 0 12px;
    font-size: 1.5rem;
    text-transform: uppercase;
}

.sohcs-validare__code {
    margin: 0 0 16px;
    font-size: clamp(1.75rem, 7vw, 2.5rem);
    font-weight: 800;
    letter-spacing: 0.06em;
    color: var(--sohcs-portocaliu);
    font-variant-numeric: tabular-nums;
}

.sohcs-validare__already {
    margin-top: 16px;
    padding: 10px 12px;
    background: var(--sohcs-albastru);
    color: #fff;
    font-weight: 600;
}

.sohcs-validare__button {
    margin-top: 20px;
    width: 100%;
    padding: 16px 20px;
    border: 0;
    background: var(--sohcs-portocaliu);
    color: var(--sohcs-crem);
    font-size: 1.05rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
}

.sohcs-validare__button:hover,
.sohcs-validare__button:focus-visible {
    background: var(--sohcs-albastru);
    color: #fff;
}

/* --- Eticheta de tip din lista de participanți -------------------------- */

/* Distinge invitațiile de înscrierile plătite. Nu folosim doar culoarea:
   eticheta poartă și textul, ca informația să nu depindă de percepția culorii. */
.sohcs-eticheta {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 2px;
    background: #e6e6e6;
    color: #2c3338;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.sohcs-eticheta--invitat {
    background: var(--sohcs-albastru, #053ad4);
    color: #fff;
}
