/**
 * Vores Kalundborg — /medlemmer indmeldelse form fixes.
 *
 * 1. Floating-label fix for <select> — :placeholder-shown doesn't fire on
 *    selects, so we use :invalid (no value selected) / :valid (value set)
 *    to drive the same float-up animation as the input variants.
 * 2. P-nummer modal styling.
 * 3. Toast notification.
 */

/* Floating-label fix for <select> (doesn't trigger :placeholder-shown) */
.ef-field select:invalid + label,
.ef-field select[value=""] + label {
    transform: translateY(0);
    font-size: 14px;
    color: var(--vk-muted);
}
.ef-field select:focus + label,
.ef-field select:valid + label {
    transform: translateY(-22px) scale(0.85);
    color: var(--vk-sage);
}

/* P-nummer modal */
.vk-pnummer-modal {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(31, 42, 36, .6);
    display: flex; align-items: center; justify-content: center;
    padding: 1rem;
}
.vk-pnummer-modal-inner {
    background: #fff; border-radius: 14px;
    max-width: 420px; width: 100%; padding: 24px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .2);
}
.vk-pnummer-list {
    list-style: none; padding: 0; margin: 12px 0;
    max-height: 300px; overflow-y: auto;
}
.vk-pnummer-list li label {
    display: block; padding: 12px;
    border: 1px solid var(--vk-border);
    border-radius: 8px; margin-bottom: 8px;
    cursor: pointer;
}
.vk-modal-actions {
    display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px;
}
.vk-toast {
    position: fixed; bottom: 24px; left: 50%;
    transform: translateX(-50%);
    background: var(--vk-dark); color: #fff;
    padding: 12px 20px; border-radius: 8px;
    z-index: 10000;
}