:root { --bg:var(--paper); --card:var(--paper-2); --muted:var(--ink-soft); --accent-dark:var(--accent-strong); --danger:var(--status-danger); }
* { box-sizing: border-box; }
body { margin:0; font-family:var(--sans); background:var(--bg); color:var(--ink); line-height:1.5; }
a { color:var(--accent-dark); }
.site-header { display:flex; justify-content:space-between; align-items:center; padding:18px clamp(16px, 4vw, 48px); background:color-mix(in srgb, var(--paper-2) 53%, transparent); border-bottom:1px solid var(--line); backdrop-filter: blur(10px); position:sticky; top:0; z-index:10; }
.brand { font-weight:800; text-decoration:none; color:var(--ink); }
.site-header nav { display:flex; gap:14px; align-items:center; }
.container { width:min(1120px, calc(100% - 32px)); margin:0 auto; padding:32px 0 64px; display:grid; gap:24px; }
.hero { padding:42px; border-radius:28px; background:linear-gradient(135deg,var(--paper-2),var(--cream)); }
.hero.compact { padding:28px; }
.eyebrow { color:var(--accent-dark); font-weight:700; text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; }
h1, h2, h3, h4 { font-family:var(--serif); font-weight:600; }
h1 { margin:.1em 0; font-size:clamp(2rem,5vw,4rem); line-height:1; }
h2 { margin-top:0; }
.muted { color:var(--muted); }
.offer-banner { display:inline-flex; margin-top:10px; padding:10px 14px; border-radius:999px; background:#fff3d6; color:#8a5a00; }
.flash { padding:12px 16px; border-radius:14px; background:var(--paper-2); border:1px solid var(--line); }
.flash.alert { border-color:#e2aaa5; color:var(--danger); }
.steps { display:grid; gap:24px; min-width:0; }
.card { background:var(--card); border:1px solid var(--line); border-radius:24px; padding:24px; box-shadow:0 16px 50px #3b24130a; min-width:0; max-width:100%; }
.auth-card { width:min(100%, 460px); justify-self:center; display:grid; gap:18px; }
.auth-card form { display:grid; gap:16px; }
.disabled { opacity:.64; }
.choices { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; min-width:0; }
.choice, .date-pill, .slot { display:flex; flex-direction:column; gap:4px; text-decoration:none; color:var(--ink); border:1px solid var(--line); border-radius:16px; padding:14px; background:var(--paper-2); }
.choice small { color:var(--muted); }
.choice em { color:var(--accent-dark); font-size:.85rem; font-style:normal; font-weight:800; }
.selected { border-color:var(--accent); outline:2px solid #8f6b4f22; background:var(--blush); }
.date-strip { display:flex; gap:10px; overflow-x:auto; overflow-y:hidden; padding-bottom:8px; max-width:100%; min-width:0; }
.date-pill { min-width:86px; align-items:center; }
.slot-grid { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.slot { display:inline-flex; padding:10px 14px; }
.summary { background:var(--cream); padding:12px 14px; border-radius:14px; }
.booking-form { display:grid; gap:16px; }
.booking-form .button { margin-top:4px; justify-self:start; }
label { display:flex; flex-direction:column; gap:6px; font-weight:700; }
input, textarea, select { width:100%; border:1px solid var(--line); border-radius:12px; padding:11px 12px; font:inherit; background:var(--paper-2); color:var(--ink); }
textarea { resize:vertical; }
.button, input[type=submit].button { width:auto; border:0; border-radius:999px; padding:12px 18px; background:var(--accent-strong); color:white; font-weight:800; cursor:pointer; text-decoration:none; display:inline-flex; justify-content:center; }
.button.secondary { background:#c3ab96; }
.button.small { padding:8px 13px; font-size:.9rem; }
.danger-button { background:var(--danger); }
.grid-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:18px 14px; align-items:end; }
.grid-form .button { margin-top:4px; justify-self:start; min-width:180px; }
.full { grid-column:1 / -1; }
.inline-form { display:flex; flex-wrap:wrap; gap:10px; align-items:end; margin-bottom:22px; }
.inline-form > * { width:auto; }
.week-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; }
.week-day h3 { display:flex; justify-content:space-between; align-items:center; gap:8px; min-height:34px; }
.week-day:hover > h3 .row-actions, .week-day:focus-within > h3 .row-actions { opacity:1; }
.week-add-form { display:none; grid-template-columns:1fr 1fr; gap:8px; margin:8px 0 10px; }
.week-add-form .edit-actions { grid-column:1 / -1; justify-content:flex-start; }
.edit-toggle:checked ~ .week-add-form { display:grid; }
.list-row { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:8px 0; border-bottom:1px solid var(--line); }
.week-slot-row { min-height:38px; padding:6px 0; border-bottom:1px solid var(--line); }
.week-slot-display { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.week-slot-confirm { display:none; justify-content:space-between; align-items:center; gap:8px; color:var(--danger); }
.week-slot-row:hover .row-actions, .week-slot-row:focus-within .row-actions { opacity:1; }
.delete-toggle:checked ~ .week-slot-display { display:none; }
.delete-toggle:checked ~ .week-slot-confirm { display:flex; }
.link-button { border:0; background:transparent; color:var(--accent-dark); text-decoration:underline; cursor:pointer; padding:0; font:inherit; }
.danger { color:var(--danger); }
.service-admin-list { display:grid; gap:12px; margin-top:18px; min-width:0; }
.service-admin-row { display:flex; gap:14px; align-items:center; border-top:1px solid var(--line); padding-top:16px; }
.editable-block, .add-block { display:grid; }
.add-buttons { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-start; }
.add-button { justify-self:start; margin-top:8px; }
.below-table { margin-top:16px; }
.add-form { display:none; margin-top:16px; }
.service-add-row { display:none; grid-template-columns:1.5fr .55fr .55fr .9fr 2fr 240px; gap:14px; align-items:center; padding:13px 0; border-top:1px solid var(--line); }
.special-add-row { display:none; grid-template-columns:1.2fr .7fr 2fr 240px; gap:14px; align-items:center; padding:13px 0; border-top:1px solid var(--line); }
.service-checkboxes { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; }
.service-checkboxes strong { flex-basis:100%; }
.service-checkboxes .checkbox { display:inline-flex; flex-direction:row; gap:6px; align-items:center; font-weight:600; }
.service-checkboxes input { width:auto; }
#add_service:checked ~ .add-buttons, #add_action:checked ~ .add-buttons { display:none; }
.edit-toggle:checked ~ .add-form { display:grid; }
#add_service:checked ~ .service-add-row { display:grid; }
#add_action:checked ~ .special-add-row { display:grid; }
.contact-display-row { display:flex; justify-content:space-between; gap:16px; align-items:center; padding:4px 0; }
.contact-display-row > div:first-child { display:grid; gap:4px; }
.contact-display-row small { color:var(--muted); }
.contact-display-row:hover .row-actions, .contact-display-row:focus-within .row-actions { opacity:1; }
.contact-edit-row { display:none; grid-template-columns:1fr 1fr 1.4fr 1fr .8fr 190px; gap:14px; align-items:end; }
.edit-toggle:checked ~ .contact-display-row { display:none; }
.edit-toggle:checked ~ .contact-edit-row { display:grid; }
.service-table, .special-table { display:grid; margin-top:20px; }
.service-table-head, .service-display-row { display:grid; grid-template-columns:1.5fr .55fr .55fr 2fr 86px; gap:14px; align-items:center; }
.service-edit-row { display:none; grid-template-columns:1.5fr .55fr .55fr .9fr 2fr 240px; gap:14px; align-items:center; }
.service-delete-row { display:none; grid-template-columns:1fr 220px; gap:14px; align-items:center; padding:13px 0; color:var(--danger); }
.special-table-head, .special-display-row { display:grid; grid-template-columns:1.2fr .9fr .5fr 2fr 86px; gap:14px; align-items:center; }
.special-edit-row { display:none; grid-template-columns:1.1fr .75fr .75fr .7fr 1.2fr 1.5fr 240px; gap:14px; align-items:center; }
.special-delete-row { display:none; grid-template-columns:1fr 220px; gap:14px; align-items:center; padding:13px 0; color:var(--danger); }
.service-table-head, .special-table-head { color:var(--muted); font-size:.82rem; font-weight:800; padding:0 0 8px; border-bottom:1px solid var(--line); }
.service-table-item, .special-table-item { position:relative; border-bottom:1px solid var(--line); }
.service-display-row, .special-display-row { padding:13px 0; }
.service-display-row small, .special-display-row small { color:var(--muted); }
.edit-toggle, .delete-toggle { display:none; }
.service-edit-row, .special-edit-row { padding:13px 0; }
.edit-toggle:checked ~ .service-display-row, .edit-toggle:checked ~ .special-display-row, .delete-toggle:checked ~ .service-display-row, .delete-toggle:checked ~ .special-display-row { display:none; }
.edit-toggle:checked ~ .service-edit-row, .edit-toggle:checked ~ .special-edit-row { display:grid; }
.delete-toggle:checked ~ .service-delete-row, .delete-toggle:checked ~ .special-delete-row { display:grid; }
.row-actions { display:flex; gap:8px; justify-content:flex-end; opacity:0; transition:opacity .15s ease; }
.service-table-item:hover .row-actions, .service-table-item:focus-within .row-actions, .special-table-item:hover .row-actions, .special-table-item:focus-within .row-actions { opacity:1; }
.edit-actions, .confirm-actions { display:flex; flex-wrap:nowrap; gap:10px; align-items:center; justify-content:flex-end; white-space:nowrap; }
.edit-actions .button, .confirm-actions .button { flex:0 0 auto; min-width:108px; }
.edit-actions .link-button, .confirm-actions .link-button { flex:0 0 auto; }
.confirm-actions form { display:inline-flex; }
.delete-message { align-self:center; }
.icon-button { border:0; background:#f7efe7; color:var(--accent-dark); width:34px; height:34px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; text-decoration:none; font:inherit; line-height:1; }
.service-admin { flex:1; display:grid; grid-template-columns:1.7fr .65fr .75fr 2fr auto auto; gap:14px; align-items:center; }
.offer-admin { flex:1; display:grid; grid-template-columns:1.5fr .9fr .9fr .65fr 1.8fr auto auto; gap:14px; align-items:center; }
.checkbox { flex-direction:row; align-items:center; font-weight:400; }
.checkbox input { width:auto; }
.consent-field { align-items:flex-start; gap:10px; }
.consent-field input { margin-top:.3em; flex:0 0 auto; }
.contact-pair { border:1px solid var(--line); border-radius:var(--r-md); padding:16px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.contact-pair legend { padding:0 6px; font-weight:800; }
.contact-pair legend small { color:var(--muted); font-weight:400; margin-left:6px; }
.appointment-list { display:grid; gap:10px; }
.appointment { border:1px solid var(--line); border-radius:16px; padding:14px; display:grid; gap:8px; }
.appointment-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.status { border-radius:999px; padding:4px 10px; font-size:.85rem; font-weight:800; background:#eee5dc; color:var(--accent-dark); }
.status.confirmed { background:#e7f4e7; color:#28703a; }
.status.pending { background:#fff3d6; color:#8a5a00; }
.status.declined, .status.cancelled { background:#f7e3e1; color:var(--danger); }
.honeypot { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.message-list { display:grid; gap:10px; }
.message { border:1px solid var(--line); border-radius:16px; padding:14px; display:grid; gap:8px; }
.message.handled { opacity:.6; }
.message-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.message small { color:var(--muted); }
.message p { white-space:pre-wrap; }
.choice-group { margin:18px 0 10px; font-size:1rem; color:var(--accent-dark); }
.choice-group:first-of-type { margin-top:8px; }
.category-tag { display:inline-block; padding:2px 8px; border-radius:999px; background:#f7efe7; color:var(--accent-dark); font-weight:700; }
.category-list { display:grid; margin-top:16px; }
.category-row { border-top:1px solid var(--line); padding:10px 0; }
.category-display-row { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.category-display-row > div:first-child { display:grid; gap:2px; }
.category-display-row small { color:var(--muted); }
.category-row:hover .row-actions, .category-row:focus-within .row-actions { opacity:1; }
.category-edit-row, .category-add-row { display:none; grid-template-columns:1.6fr .6fr 240px; gap:14px; align-items:center; padding:10px 0; }
.category-delete-row { display:none; grid-template-columns:1fr 240px; gap:14px; align-items:center; padding:10px 0; color:var(--danger); }
.edit-toggle:checked ~ .category-edit-row { display:grid; }
.delete-toggle:checked ~ .category-delete-row { display:grid; }
.delete-toggle:checked ~ .category-display-row { display:none; }
#add_category:checked ~ .add-buttons { display:none; }
#add_category:checked ~ .category-add-row { display:grid; }
.closure-list { display:grid; margin-top:16px; }
.closure-row { border-top:1px solid var(--line); padding:10px 0; }
.closure-display-row { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.closure-display-row > div:first-child { display:grid; gap:2px; }
.closure-display-row small { color:var(--muted); }
.closure-row:hover .row-actions, .closure-row:focus-within .row-actions { opacity:1; }
.closure-delete-row { display:none; grid-template-columns:1fr 240px; gap:14px; align-items:center; padding:10px 0; color:var(--danger); }
.delete-toggle:checked ~ .closure-delete-row { display:grid; }
.delete-toggle:checked ~ .closure-display-row { display:none; }
.closure-add-row { display:none; grid-template-columns:1fr 1fr 1.6fr 240px; gap:14px; align-items:end; padding:10px 0; }
#add_closure:checked ~ .add-buttons { display:none; }
#add_closure:checked ~ .closure-add-row { display:grid; }
.holiday-list { display:grid; margin-top:16px; }
.holiday-row { display:flex; justify-content:space-between; align-items:center; gap:12px; border-top:1px solid var(--line); padding:10px 0; }
.holiday-row > div:first-child { display:grid; gap:2px; }
.holiday-row small { color:var(--muted); }
.holiday-row.open { background:#fcfaf7; }
.holiday-state { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.status.done { background:#e9e4dd; color:var(--muted); }
.status.expired { background:#f0e6e5; color:var(--danger); }
.muted-row { opacity:.75; }
.history-filter { display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin:14px 0 4px; }
.history-filter label { flex:0 1 260px; }
.history-filter input[type=submit] { flex:0 0 auto; }
.customer-list { display:grid; gap:10px; margin-top:16px; }
.customer { border:1px solid var(--line); border-radius:16px; padding:14px; }
.customer-display-row { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.customer-display-row > div:first-child { display:grid; gap:3px; }
.customer-display-row small { color:var(--muted); }
.customer:hover .row-actions, .customer:focus-within .row-actions { opacity:1; }
.customer-note { margin:6px 0 0; padding:8px 12px; border-radius:12px; background:#f7efe7; white-space:pre-wrap; }
.customer-edit-row { display:none; gap:12px; margin-top:12px; }
.edit-toggle:checked ~ .customer-edit-row { display:grid; }
.status.hand { background:#e7eef4; color:#3c5a72; }
.badges { display:flex; gap:6px; align-items:center; flex:0 0 auto; }
.manual-booking-form { display:none; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; align-items:end; margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
#add_booking:checked ~ .add-buttons { display:none; }
#add_booking:checked ~ .manual-booking-form { display:grid; }
.countdown { color:var(--accent-dark); font-weight:700; }
.edit-toggle:checked ~ .customer-display-row .row-actions { opacity:1; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:4px; }
.appointment small { color:var(--muted); }
@media (max-width: 820px) { .hero { padding:24px; } .contact-edit-row, .service-admin, .offer-admin, .grid-form, .service-table-head, .service-display-row, .service-edit-row, .service-add-row, .special-add-row, .service-delete-row, .special-table-head, .special-display-row, .special-edit-row, .special-delete-row, .category-edit-row, .category-add-row, .category-delete-row, .closure-add-row, .closure-delete-row { grid-template-columns:1fr; } .service-admin-row { align-items:stretch; flex-direction:column; } .service-table-head, .special-table-head { display:none; } .row-actions, .edit-actions, .confirm-actions { justify-content:flex-start; opacity:1; } .edit-actions, .confirm-actions { flex-wrap:wrap; white-space:normal; } }
