/*
===============================================
 POLSKAELITA.PL - REKRUTACJA
 Green Dark | MyBB 1.8.41
 Plik: pe_rekrutacja.css

 Zielona klodka - rekrutacja ON
 Czerwona klodka - rekrutacja OFF
===============================================
*/

/* AKTUALNY STATUS - ON */

a[href*="forumdisplay.php?fid=17"] {
    --pe-rekrutacja-bg: #168c43;
    --pe-rekrutacja-border: #36ce72;
    --pe-rekrutacja-icon: "\f09c";
    --pe-rekrutacja-glow: rgba(43, 211, 105, .18);

    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 4px 11px 4px 5px;
    margin: 3px 5px 3px 0;

    max-width: 100%;
    box-sizing: border-box;

    color: #e7f8ec !important;
    background: rgba(16, 43, 28, .65);
    border: 1px solid rgba(71, 139, 88, .45);
    border-radius: 7px;

    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none !important;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

/* IKONA KLODKI */

a[href*="forumdisplay.php?fid=17"]::before {
    content: var(--pe-rekrutacja-icon);

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

    flex-shrink: 0;

    width: 31px;
    height: 31px;

    box-sizing: border-box;

    background: var(--pe-rekrutacja-bg);
    color: #ffffff;

    border: 1px solid var(--pe-rekrutacja-border);
    border-radius: 5px;

    font-family: "Font Awesome 5 Free", "FontAwesome";
    font-size: 16px;
    font-weight: 900;
    line-height: 1;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 0 8px var(--pe-rekrutacja-glow);
}

/* NAJECHANIE MYSZKA */

a[href*="forumdisplay.php?fid=17"]:hover {
    color: #ffffff !important;
    background: #193e29;
    border-color: var(--pe-rekrutacja-border);

    box-shadow:
        0 0 12px var(--pe-rekrutacja-glow);
}

/* KLAWIATURA */

a[href*="forumdisplay.php?fid=17"]:focus-visible {
    outline: 2px solid var(--pe-rekrutacja-border);
    outline-offset: 3px;
}

/*
===============================================
 GOTOWY WYGLAD DLA OFF

 Gdy zamkniemy rekrutacje, zamienimy
 cztery zmienne w sekcji ON na:

 --pe-rekrutacja-bg: #ad303c;
 --pe-rekrutacja-border: #ef6671;
 --pe-rekrutacja-icon: "\f023";
 --pe-rekrutacja-glow: rgba(235, 67, 82, .20);

 Czerwona klodka bedzie zamknieta.
===============================================
*/

/* KLASA DLA PRZYSZLYCH REKRUTACJI OFF */

.pe-rekrutacja-off {
    --pe-rekrutacja-bg: #ad303c;
    --pe-rekrutacja-border: #ef6671;
    --pe-rekrutacja-icon: "\f023";
    --pe-rekrutacja-glow: rgba(235, 67, 82, .20);
}

/* TELEFONY */

@media screen and (max-width: 600px) {
    a[href*="forumdisplay.php?fid=17"] {
        gap: 6px;
        padding: 4px 8px 4px 4px;
        font-size: 11px;
        white-space: normal;
    }

    a[href*="forumdisplay.php?fid=17"]::before {
        width: 28px;
        height: 28px;
        font-size: 14px;
    }
}

/* DOSTEPNOSC */

@media (prefers-reduced-motion: reduce) {
    a[href*="forumdisplay.php?fid=17"] {
        transition: none;
    }
}