/* =========================================================
   FILE SELECT BUTTON
========================================================= */

input[type="file"]::file-selector-button {

    padding: 3px 12px;

    background-color: var(--link-hover);

    border: none;
    border-radius: 6px;

    color: #ffffff;

    font-size: 16px;
    font-weight: bold;

    cursor: pointer;

    margin-right: 10px;

    transition:
        transform 0.2s ease,
        filter 0.2s ease;
}

input[type="file"]::file-selector-button:hover {

    filter: brightness(1.1);

    transform: translateY(-1px);
}


/* =========================================================
   PRIMARY BUTTONS
========================================================= */

.submit-btn,
a.submit-btn {

    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 100%;

    padding: 14px;

    background-color: var(--link-hover);

    border: none;
    border-radius: 6px;

    color: #ffffff;

    font-size: 16px;
    font-weight: bold;

    cursor: pointer;

    text-decoration: none;

    box-sizing: border-box;

    transition:
        transform 0.2s ease,
        filter 0.2s ease;
}

.submit-btn:hover,
a.submit-btn:hover {

    filter: brightness(1.1);

    transform: translateY(-1px);

    color: #ffffff;

    text-decoration: none;
}


/* =========================================================
   INLINE BUTTON VARIANTE
========================================================= */

.submit-btn-inline {

    width: auto;
}


/* =========================================================
   CHECKBOXEN & RADIO BUTTONS
========================================================= */

.checkbox-group .remember-label {

    display: flex;

    align-items: center;

    gap: 8px;

    cursor: pointer;

    font-size: 0.9em;
}

.checkbox-group input[type="checkbox"],
.checkbox-group input[type="radio"] {

    margin: 0;

    width: 16px;
    height: 16px;

    cursor: pointer;

    accent-color: var(--link-hover);
}