:root {
    --bg-dark: #f5f5f4;
    --bg-card: #ffffff;
    --text-main: #1c1917;
    --text-muted: #78716c;
    --accent: #6b705c;
    --accent-hover: #4f553f;
    --success: #588157;
    --border: #e7e5e4;
}

body {
    background-color: var(--bg-dark);
    color: var(--text-main);
}

/* Nav & Buttons Palette */
nav {
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid var(--border);
}

.logo span { color: var(--accent); }

.nav-btn-reserve, .btn-primary, .btn-submit {
    background-color: var(--accent);
    color: white;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    transition: all 0.2s ease;
}

.nav-btn-reserve:hover, .btn-primary:hover, .btn-submit:hover {
    background-color: var(--accent-hover);
}

.btn-whatsapp {
    background: var(--success);
    color: white;
}

/* Cards & Forms Palette */
.card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    box-shadow: 0 6px 18px rgba(0,0,0,0.04);
}

.card-featured {
    border: 2px solid var(--accent);
}

.accent-text { color: var(--accent); }

.booking-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.booking-card input, .booking-card select {
    background-color: #ffffff;
    border: 1px solid var(--border);
    color: var(--text-main);
    transition: all 0.2s ease;
}

.booking-card input:focus, .booking-card select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(107,112,92,0.15);
}

.image-placeholder {
    background-color: #f0efe9;
    border: 1px solid var(--border);
    color: var(--text-muted);
}

/* Experience & Feedback */
.exp-badge {
    background: #f0efe9;
    border-left: 4px solid var(--accent);
}

.exp-number { color: var(--accent); }

.alert.error {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
}

.alert.success {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.main-footer {
    border-top: 1px solid var(--border);
    background: #ffffff;
    color: var(--text-muted);
}
/* Adaugă în site-pal-natcal.css */
.profile-image-wrapper {
    border: 1px solid var(--border);
    border-radius: 50px 5px 50px 5px; /* Formă organică, asimetrică */
    box-shadow: 0 15px 35px rgba(107,112,92,0.1); /* Umbră verde-olive */
}

.profile-main-img {
    filter: brightness(1.02) contrast(0.98); /* Aspect mai "soft", relaxant */
}

/* --- PAGINA OTP (PALETTE) --- */
.top-banner h1 {
    color: var(--text-main);
}

.tagline {
    color: var(--accent);
}

.otp-container {
    background: var(--bg-dark); 
    border: 1px solid var(--border);
}

.otp-container label, .helper-text, .bottom-banner {
    color: var(--text-muted);
}

.otp-prefix {
    color: var(--text-muted);
    /* Modificat pentru light theme: folosim bg-card pentru a face cardul alb, curat */
    background: var(--bg-card); 
    border: 1px solid var(--border);
}

.otp-dash {
    /* Modificat pentru light theme: border era prea deschis, acum e gri cald */
    color: var(--text-muted); 
}

#otp_input {
    color: var(--accent) !important;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 3px solid var(--accent) !important;
}

#otp_input:focus {
    box-shadow: none !important;
    border-bottom-color: var(--text-main) !important;
}

/* --- PAGINA MY_BOOKING (PALETTE) --- */
.booking-card h2 {
    color: var(--text-main);
}

.booking-card hr {
    background-color: var(--border);
}

.booking-details p {
    color: var(--text-main);
    border-bottom: 1px dashed var(--border);
    padding-bottom: 8px;
}

.booking-details span {
    color: var(--text-muted);
}

.time-highlight {
    background-color: var(--bg-dark);
    border: 1px solid var(--border);
}

.time-highlight strong {
    color: var(--accent);
}

.reminder-box {
    background-color: #fffbeb; /* Un fundal cald, ușor, care inspiră atenție, fără a fi strident */
    border-left: 4px solid #fcd34d;
    color: var(--text-main);
}

.contact-footer p {
    color: var(--text-muted);
}

.contact-method {
    background-color: var(--bg-card);
    color: var(--text-main);
    border: 1px solid var(--border);
    transition: all 0.2s ease;
}

.contact-method:hover {
    border-color: var(--accent);
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* Stil specific pentru butonul de WhatsApp ca să iasă în evidență constructiv */
.contact-method.whatsapp-link {
    background-color: var(--success);
    color: white;
    border-color: var(--success);
}

.contact-method.whatsapp-link:hover {
    background-color: #4a6c4a; /* O nuanță ușor mai închisă a culorii success */
    border-color: #4a6c4a;
}

.separator {
    color: var(--text-muted);
}

/* Link-urile simple (cum ar fi "Înapoi la prima pagină") */
.contact-links a:not(.contact-method) {
    color: var(--accent);
    transition: color 0.2s ease;
}

.contact-links a:not(.contact-method):hover {
    color: var(--accent-hover);
}
/* --- PAGINA ERROR / CONTACT (PALETTE) --- */
.msg-container {
    background-color: var(--bg-card);
    border: 1px solid var(--border);
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.msg-container .headline {
    color: var(--text-main);
}

.msg-container .sub-headline {
    color: var(--text-muted);
}

/* Facem ca textul îngroșat (strong) să iasă frumos în evidență față de textul muted */
.msg-container .sub-headline strong {
    color: var(--text-main);
}

.btn-phone {
    background-color: var(--accent);
    color: white;
    border: 1px solid var(--accent);
    transition: all 0.2s ease;
}

.btn-phone:hover {
    background-color: var(--accent-hover);
    border-color: var(--accent-hover);
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.btn-whatsapp {
    background-color: var(--success);
    color: white;
    border: 1px solid var(--success);
    transition: all 0.2s ease;
}

.btn-whatsapp:hover {
    background-color: #4a6c4a;
    border-color: #4a6c4a;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.msg-container .separator {
    color: var(--text-muted);
}

.back-link {
    color: var(--accent);
    transition: color 0.2s ease;
}

.back-link:hover {
    color: var(--accent-hover);
}