/* De Italiaanse Zanger — design system v1.0
   Laad na /assets/style.css. Componenten zijn opt-in via .ui-* classes. */
:root{--ui-forest:#203e31;--ui-forest-deep:#142b21;--ui-gold:#ad8244;--ui-cream:#faf7f1;--ui-paper:#fff;--ui-ink:#19231d;--ui-muted:#667168;--ui-border:#ded8cc;--ui-danger:#a43f39;--ui-success:#26704a;--ui-radius-sm:10px;--ui-radius:16px;--ui-radius-lg:24px;--ui-shadow:0 16px 44px rgba(20,43,33,.08);--ui-focus:0 0 0 4px rgba(173,130,68,.19)}
.ui-panel{background:var(--ui-paper);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow);padding:clamp(22px,4vw,44px)}
.ui-card{background:var(--ui-paper);border:1px solid var(--ui-border);border-radius:var(--ui-radius);padding:clamp(18px,3vw,30px)}
.ui-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.ui-field{display:flex;flex-direction:column;gap:8px;min-width:0}.ui-field--full{grid-column:1/-1}.ui-label{font-size:.86rem;font-weight:750;line-height:1.4;color:var(--ui-ink)}.ui-hint{font-size:.79rem;color:var(--ui-muted);line-height:1.55}
.ui-input,select.ui-select,.ui-textarea{display:block;width:100%;min-width:0;min-height:52px;border:1px solid var(--ui-border);border-radius:var(--ui-radius-sm);background:#fdfcf9;color:var(--ui-ink);padding:13px 16px;font:inherit;font-size:.94rem;transition:border-color .18s,box-shadow .18s,background .18s;appearance:none}
.ui-input:hover,select.ui-select:hover,.ui-textarea:hover{border-color:#bca98d}.ui-input:focus,select.ui-select:focus,.ui-textarea:focus{outline:none;border-color:var(--ui-gold);box-shadow:var(--ui-focus);background:#fff}.ui-input::placeholder,.ui-textarea::placeholder{color:#8c938d}.ui-input:disabled,select.ui-select:disabled,.ui-textarea:disabled{opacity:.6;cursor:not-allowed}
.ui-textarea{min-height:132px;resize:vertical}select.ui-select{padding-right:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23203e31' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 15px center;background-repeat:no-repeat}
.ui-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:12px 24px;border:1px solid var(--ui-forest);border-radius:999px;background:var(--ui-forest);color:#fff;font:700 .9rem 'Manrope',sans-serif;text-decoration:none;cursor:pointer;transition:transform .18s,background .18s,box-shadow .18s}.ui-button:hover{background:var(--ui-forest-deep);transform:translateY(-1px);box-shadow:0 10px 22px rgba(20,43,33,.15)}.ui-button:focus-visible{outline:none;box-shadow:var(--ui-focus)}.ui-button--secondary{background:#fff;color:var(--ui-forest);border-color:var(--ui-border)}.ui-button--secondary:hover{background:#f4f0e8}
.ui-alert{padding:18px 20px;border-radius:var(--ui-radius-sm);border:1px solid var(--ui-border);background:#f7f5f0;line-height:1.65}.ui-alert--error{border-color:#e9b9b4;background:#fff4f1;color:#812e28}.ui-alert--success{border-color:#b9d9c7;background:#eef9f1;color:#1c593a}
.ui-check{display:flex;gap:12px;align-items:flex-start;font-size:.87rem;line-height:1.6}.ui-check input{accent-color:var(--ui-forest);width:18px;height:18px;margin-top:4px;flex:none}
.ui-pill{display:inline-flex;align-items:center;border-radius:999px;padding:6px 12px;font-size:.75rem;font-weight:700;background:#edf2ec;color:var(--ui-forest)}
/* Flatpickr neemt deze tokens over; standaard native date/time blijft fallback. */
.flatpickr-calendar{font-family:'Manrope',sans-serif!important;border-radius:var(--ui-radius)!important;box-shadow:var(--ui-shadow)!important;border:1px solid var(--ui-border)!important;overflow:hidden}.flatpickr-day{border-radius:10px!important}.flatpickr-day.selected,.flatpickr-day.selected:hover{background:var(--ui-forest)!important;border-color:var(--ui-forest)!important}.flatpickr-day.today{border-color:var(--ui-gold)!important}.flatpickr-months .flatpickr-month{background:var(--ui-forest)!important;color:#fff!important}.flatpickr-current-month .flatpickr-monthDropdown-months{background:transparent!important}.flatpickr-weekdays{background:#f7f4ed!important}.flatpickr-time input:focus{background:#f3efe6!important}
@media(max-width:640px){.ui-grid{grid-template-columns:1fr}.ui-field--full{grid-column:auto}.ui-panel{border-radius:var(--ui-radius);padding:22px}.ui-button{width:100%}}
@media(prefers-reduced-motion:reduce){.ui-button,.ui-input,select.ui-select,.ui-textarea{transition:none}}

/* Formuliervelden: overal dezelfde vormgeving */
.offerte-field input,
.offerte-field select,
.offerte-field textarea {
    width: 100%;
    border: 1px solid #ded6c9;
    border-radius: 16px;
    background: #fdfcf9;
    color: #19231d;
    padding: 16px 20px;
    font: inherit;
    transition: border-color .2s, box-shadow .2s;
}

.offerte-field input,
.offerte-field select {
    min-height: 58px;
}

.offerte-field input:focus,
.offerte-field select:focus,
.offerte-field textarea:focus {
    border-color: #ad8244;
    outline: none;
    box-shadow: 0 0 0 4px rgba(173,130,68,.15);
}

.offerte-field textarea {
    min-height: 160px;
    resize: vertical;
}

/* Ruimte rondom privacyverklaring */
.offerte-check {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin: 32px 0 28px;
    line-height: 1.6;
}

.offerte-check input[type="checkbox"] {
    flex: 0 0 auto;
    width: 21px;
    height: 21px;
    min-height: 0;
    margin: 3px 0 0;
    accent-color: #203e31;
}

.offerte-check span {
    flex: 1;
}

/* Verzendknop en toelichting */
.offerte-panel form > .btn {
    margin-top: 4px;
    margin-bottom: 18px;
}

.offerte-panel form > .offerte-help {
    margin-top: 0;
    line-height: 1.6;
}

/* Herbruikbaar bevestigingsvenster */
.ui-confirm-dialog{border:1px solid var(--ui-border);border-radius:22px;padding:0;width:min(440px,calc(100vw - 32px));max-width:calc(100vw - 32px);background:var(--ui-paper);color:var(--ui-forest);box-shadow:0 24px 80px rgba(20,43,33,.22);font-family:Manrope,Arial,sans-serif}
.ui-confirm-dialog::backdrop{background:rgba(15,32,24,.48);backdrop-filter:blur(3px)}
.ui-confirm-dialog__inner{padding:30px}.ui-confirm-dialog__eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ui-gold);font-weight:800;margin:0 0 12px}.ui-confirm-dialog__title{font:500 25px/1.25 'Playfair Display',Georgia,serif;margin:0 0 12px}.ui-confirm-dialog__message{font-size:14px;line-height:1.7;color:#5e6c62;margin:0 0 26px}.ui-confirm-dialog__actions{display:flex;gap:12px;justify-content:flex-end;flex-wrap:wrap}.ui-confirm-dialog__actions .ui-button{width:auto;min-height:45px;padding:10px 19px}
@media(max-width:480px){.ui-confirm-dialog__inner{padding:23px}.ui-confirm-dialog__actions .ui-button{flex:1}}

/* Rode variant voor destructieve beheeracties */
.ui-button--danger{background:var(--ui-danger);border-color:var(--ui-danger);color:#fff}
.ui-button--danger:hover{background:#842f2b;border-color:#842f2b;color:#fff}

/* JS dropdown wrapper: geen extra rand, achtergrond of native pijl. */
.ui-select:not(select){position:relative;display:block;width:100%;min-width:0;min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;appearance:auto}
select.ui-select__native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%)!important}
.ui-select__trigger{width:100%;min-height:52px;border:1px solid var(--ui-border);border-radius:13px;background:#fdfcf9;color:var(--ui-forest);padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;font:600 .9rem 'Manrope',Arial,sans-serif;cursor:pointer}
.ui-select__trigger:focus-visible{outline:3px solid #ad824466;outline-offset:2px}
.ui-select__arrow{width:9px;height:9px;border-right:2px solid var(--ui-forest);border-bottom:2px solid var(--ui-forest);transform:rotate(45deg);flex:none;margin-right:3px}
.ui-select__trigger[aria-expanded=true] .ui-select__arrow{transform:rotate(225deg)}
.ui-select__menu{position:absolute;z-index:100;top:calc(100% + 7px);left:0;right:0;max-height:270px;overflow:auto;background:white;border:1px solid var(--ui-border);border-radius:15px;box-shadow:0 16px 40px #1b332726;padding:6px}
.ui-select__menu[hidden]{display:none!important}
.ui-select__option{display:block;width:100%;border:0;border-radius:10px;background:transparent;color:var(--ui-forest);padding:12px 13px;text-align:left;font:600 .86rem 'Manrope',Arial,sans-serif;cursor:pointer}
.ui-select__option:hover,.ui-select__option:focus-visible{background:#f5f0e6;outline:none}
.ui-select__option[aria-selected=true]{background:#e9f1eb;color:#1d4c32}