/* SalonSuite — Marble (wit marmer met goud, high-end spa) */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;600;700&family=EB+Garamond:wght@400;500;600&display=swap');

:root {
    --color-primary:    #1A1A2E;
    --color-secondary:  #C9A96E;
    --color-accent:     #E8D5A8;
    --color-bg:         #FAFAFA;
    --color-text:       #1A1A2E;
    --color-text-muted: #6E6E80;
    --color-border:     #E8E4DC;
    --color-surface:    #FFFFFF;
    --color-surface-alt:#F5F3EE;
    --color-success:    #4A7A5A;
    --color-error:      #B83232;
    --color-info:       #3A6A8A;
    --font-heading:     'EB Garamond', Georgia, serif;
    --font-body:        'Raleway', system-ui, sans-serif;
    --radius:           4px;
    --radius-lg:        8px;
    --shadow:           0 4px 24px rgba(26,26,46,0.10);
    --shadow-sm:        0 1px 6px rgba(26,26,46,0.07);
    --transition:       0.2s ease;
    --max-width:        1200px;
}

.hero {
    background: linear-gradient(135deg, #1A1A2E 0%, #2E2E4E 60%, #3A3A5E 100%);
}

.hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    pointer-events: none;
}

.btn-hero-primary {
    background: linear-gradient(135deg, #C9A96E, #E8D5A8);
    color: #1A1A2E;
    border-color: transparent;
    font-weight: 600;
}

.btn-hero-outline {
    border-color: rgba(201,169,110,0.6);
    color: #E8D5A8;
}

.btn-hero-outline:hover {
    background: rgba(201,169,110,0.15);
    border-color: #C9A96E;
    color: #E8D5A8;
}

.site-header {
    background: rgba(250, 250, 250, 0.97);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid #E8E4DC;
}

.navbar-brand {
    font-family: 'EB Garamond', serif;
    font-size: 1.7rem;
    letter-spacing: 0.06em;
    color: #1A1A2E;
}

.btn-primary {
    background: linear-gradient(135deg, #1A1A2E, #2E2E4E);
    border-color: transparent;
    box-shadow: 0 2px 12px rgba(26,26,46,0.2);
}

.btn-primary:hover {
    background: linear-gradient(135deg, #C9A96E, #B8946A);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(201,169,110,0.35);
    opacity: 1;
}

.service-card {
    border-radius: var(--radius);
    border: 1px solid #E8E4DC;
    border-top: 2px solid transparent;
    transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s;
}

.service-card:hover {
    border-top-color: #C9A96E;
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(26,26,46,0.12);
}

.features-strip {
    background: #F5F3EE;
    border-bottom: 1px solid #E8E4DC;
}

.feature-icon {
    background: #fff;
    border: 1px solid #E8E4DC;
    color: #C9A96E;
}

.reviews-section {
    background: linear-gradient(180deg, #F5F3EE 0%, #FAFAFA 100%);
}

.review-card {
    border: 1px solid #E8E4DC;
    border-radius: var(--radius);
}

.section-header h2::after {
    background: linear-gradient(90deg, #1A1A2E, #C9A96E);
}

.site-footer {
    background: #1A1A2E;
    border-top: 3px solid #C9A96E;
}

.site-footer,
.site-footer h3,
.site-footer .footer-col a,
.footer-bottom {
    color: #E8D5A8;
}

.site-footer .footer-col a:hover { color: #fff; }

.footer-bottom {
    border-top-color: rgba(232,213,168,0.15);
}

.checkout-summary {
    background: #F5F3EE;
    border-radius: var(--radius);
    padding: 1.75rem;
    border: 1px solid #E8E4DC;
    color: #1A1A2E;
}

input,select,textarea { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
input:focus,select:focus,textarea:focus { border-color: #C9A96E; box-shadow: 0 0 0 2px rgba(201,169,110,0.15); }
label { color: #1A1A2E; }
.order-summary-item,.order-summary-total,.order-summary-subtotal,.order-summary-discount { border-bottom-color: #E8E4DC; color: #1A1A2E; }

/* ── Booking wizard ── */
.booking-step h2 { color: #1A1A2E; }
.booking-steps::before { background: #E8E4DC; }
.step-number { background: #E8E4DC; color: #6E6E80; }
.step-label { color: #6E6E80; }
.service-option { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.service-option strong { color: #1A1A2E; }
.service-option .service-desc { color: #6E6E80; }
.service-option-meta { color: #6E6E80; }
.service-option-meta .service-price { color: #C9A96E; }
.service-option:hover { border-color: #C9A96E; background: #F5F3EE; }
.service-option.selected { border-color: #1A1A2E; background: rgba(201,169,110,0.08); color: #1A1A2E; }
.staff-option { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.staff-option strong { color: #1A1A2E; }
.staff-option span { color: #6E6E80; }
.staff-option:hover { border-color: #C9A96E; }
.staff-option.selected { border-color: #1A1A2E; background: rgba(201,169,110,0.08); }
.date-picker-wrapper { background: #FFFFFF; border-color: #E8E4DC; }
.calendar-header { border-bottom-color: #E8E4DC; }
.cal-month-label { color: #1A1A2E; }
.cal-weekdays { color: #6E6E80; }
.cal-day--available { color: #1A1A2E; }
.cal-day--available:hover { background: #F5F3EE; }
.cal-day--disabled { color: #D4D0C8; }
.time-slots-wrapper h3 { color: #1A1A2E; }
.time-slot { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.time-slot:hover { border-color: #C9A96E; color: #C9A96E; }
.time-slot.selected { background: #1A1A2E; color: #E8D5A8; border-color: #1A1A2E; }
.booking-summary { background: #F5F3EE; border: 1px solid #E8E4DC; color: #1A1A2E; }
.summary-list dt { color: #6E6E80; }
.summary-list dd { color: #1A1A2E; }
.customer-form { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.customer-form h3 { color: #1A1A2E; }
.booking-vouchers { background: #FFFFFF; border-color: #E8E4DC; }
.voucher-row label { color: #6E6E80; }
.booking-option-group { border-color: #E8E4DC; }
.booking-option-group legend { color: #1A1A2E; }
.booking-option-item:hover { background: #F5F3EE; }
.opt-price-tag { background: rgba(201,169,110,0.12); color: #C9A96E; }
.pay-badge--none    { background: rgba(74,122,90,0.12);  color: #4A7A5A; }
.pay-badge--deposit { background: rgba(201,169,110,0.12); color: #C9A96E; }
.pay-badge--full    { background: rgba(58,106,138,0.12); color: #3A6A8A; }

/* ── Team & Vacatures ── */
.team-card { background: #FFFFFF; border-color: #E8E4DC; }
.team-photo--placeholder { background: #F5F3EE; }
.team-role { color: #C9A96E; }
.team-bio { color: #6E6E80; }
.vacancy-card { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.vacancy-meta { color: #6E6E80; }
.vacancy-tag { background: rgba(201,169,110,0.1); color: #C9A96E; }
.vacancy-excerpt { color: #6E6E80; }
.vacancy-content-block { background: #FFFFFF; border-color: #E8E4DC; }
.vacancy-content-block-header { background: #F5F3EE; border-bottom-color: #E8E4DC; }
.vacancy-content-body { color: #1A1A2E; }
.vacancy-info-card { background: #FFFFFF; border-color: #E8E4DC; }
.vacancy-apply-card { background: #FFFFFF; border-color: #E8E4DC; }
.vacancy-apply-form input,.vacancy-apply-form textarea { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.cv-upload-zone { background: #F5F3EE; border-color: #E8E4DC; }
.cv-upload-label { color: #6E6E80; }

/* ── Cadeaubon ── */
.gc-step { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.gc-step--order { background: #FAFAFA; border-color: #E8E4DC; }
.gc-step-title { color: #1A1A2E; }
.gc-fields-legend { color: #6E6E80; }
.gc-type-tabs { border-color: #E8E4DC; }
.gc-tab { background: #F5F3EE; color: #6E6E80; border-right-color: #E8E4DC; }
.gc-tab:hover { background: #EAE6DE; color: #1A1A2E; }
.gc-tab.active { background: #1A1A2E; color: #E8D5A8; }
.gc-amount-btn { background: #FFFFFF; border-color: #E8E4DC; color: #1A1A2E; }
.gc-amount-btn:hover { border-color: #C9A96E; color: #C9A96E; }
.gc-amount-btn[aria-pressed="true"] { background: #C9A96E; border-color: #C9A96E; color: #1A1A2E; }
.gc-service-option { border-color: #E8E4DC; }
.gc-service-option:has(input:checked) { border-color: #C9A96E; background: rgba(201,169,110,0.06); }
.gc-service-info strong { color: #1A1A2E; }
.gc-service-info span { color: #6E6E80; }
.gc-summary { background: #F5F3EE; border-color: #E8E4DC; }
.gc-summary-placeholder { color: #6E6E80; }
.gc-summary-row,.gc-summary-total { color: #1A1A2E; }
.gc-summary-total { border-top-color: #E8E4DC; }

/* ── Auth & misc ── */
.auth-card { background: #FFFFFF; border: 1px solid #E8E4DC; }
.auth-card h1 { color: #1A1A2E; }
.auth-links { color: #6E6E80; }
.section-header h2 { color: #1A1A2E; }
.section-subtitle { color: #6E6E80; }
.contact-detail h3 { color: #6E6E80; }
.contact-detail p { color: #1A1A2E; }
.toast { background: #FFFFFF; color: #1A1A2E; border-left-color: #C9A96E; }
.hamburger-bar { background: #1A1A2E; }
.alert-success { background: rgba(74,122,90,0.12);  color: #4A7A5A; border-color: rgba(74,122,90,0.3); }
.alert-error   { background: rgba(184,50,50,0.1);   color: #B83232; border-color: rgba(184,50,50,0.3); }
.alert-info    { background: rgba(58,106,138,0.12); color: #3A6A8A; border-color: rgba(58,106,138,0.3); }
