/**
 * Withdrawal function ("Ångerknapp") styles.
 *
 * The footer link must be permanent and visually distinct from
 * surrounding content (EU Directive 2023/2673).
 */

:root {
    --dunk-wd-brand: var(--brand, #ff3131);
    --dunk-wd-black: var(--black, #111);
}

/* Persistent, prominent footer link, reachable from every page. */
.dunk-withdrawal-footer-link {
    text-align: center;
    padding: 14px 16px;
    background: #f6f6f6;
    border-top: 2px solid var(--dunk-wd-brand);
}

.dunk-withdrawal-footer-link a {
    display: inline-block;
    font-weight: 700;
    text-decoration: underline;
    color: var(--dunk-wd-black);
}

.dunk-withdrawal-footer-link a:hover,
.dunk-withdrawal-footer-link a:focus {
    color: var(--dunk-wd-brand);
}

/* Withdrawal form / flow. */
.dunk-withdrawal {
    max-width: 640px;
    margin: 0 auto;
}

.dunk-withdrawal__intro {
    margin-bottom: 1.5em;
}

.dunk-withdrawal__form label {
    display: block;
    font-weight: 600;
    margin-bottom: 4px;
}

.dunk-withdrawal__form input[type="text"],
.dunk-withdrawal__form input[type="email"],
.dunk-withdrawal__form input[type="date"],
.dunk-withdrawal__form textarea {
    width: 100%;
}

.dunk-withdrawal__consent label {
    font-weight: 400;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.dunk-withdrawal__error {
    background: #fdeaea;
    border: 1px solid var(--dunk-wd-brand);
    color: #a30000;
    padding: 12px 16px;
    border-radius: 4px;
    margin-bottom: 1.5em;
}

.dunk-withdrawal__summary {
    list-style: none;
    margin: 0 0 1.5em;
    padding: 16px;
    background: #f6f6f6;
    border-radius: 4px;
}

.dunk-withdrawal__summary li {
    margin-bottom: 6px;
}

.dunk-withdrawal--success {
    text-align: center;
    padding: 24px;
    background: #eefaf0;
    border: 1px solid #4caf50;
    border-radius: 6px;
}

.dunk-withdrawal__reference {
    font-family: monospace;
    font-weight: 700;
}

.dunk-withdrawal__confirm {
    background: var(--dunk-wd-brand);
}

/* Honeypot: kept in the layout (not display:none) but off-screen, so bots
   that fill every field reveal themselves while humans never see it. */
.dunk-withdrawal__hp {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.dunk-withdrawal--notice {
    padding: 16px;
    background: #fff8e1;
    border: 1px solid #ffb300;
    border-radius: 4px;
}