/* DZ Atelier design tokens — imported from the Claude Design project
   (dz-atelier-design-system). Two theme scopes share one component set. */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,500&family=Manrope:wght@400;500;600;700;800&family=Dancing+Script:wght@500;700&display=swap');

:root,[data-theme="grey-pink"]{
--pink-50:#fbf7f9;--pink-100:#f5ecf0;--pink-200:#ead8df;--pink-300:#dcbfc9;--pink-400:#caa5b2;--pink-500:#bc92a2;--pink-600:#9c7083;--pink-700:#785465;--pink-800:#553b48;
--grey-50:#faf8f8;--grey-100:#f3efee;--grey-200:#e6dfde;--grey-300:#d2c8c7;--grey-400:#a99e9d;--grey-500:#7d7273;--grey-600:#5a4f51;--grey-700:#3c3335;--grey-800:#2b2426;--grey-900:#1c1718;
--gold-300:#e8cfa0;--gold-500:#c9a66b;--gold-700:#9c7c46;
--success:#5c8a6a;--danger:#c14b4b;--warning:#c99a3f;
--surface-page:var(--grey-50);--surface-card:#ffffff;--surface-alt:var(--grey-100);--surface-sunken:var(--pink-50);
--text-primary:var(--grey-800);--text-secondary:var(--grey-500);--text-muted:var(--grey-400);--text-inverse:#ffffff;--text-on-accent:#ffffff;
--border-subtle:var(--grey-200);--border-strong:var(--grey-300);
--accent-primary:var(--pink-500);--accent-primary-hover:var(--pink-600);--accent-primary-soft:var(--pink-100);
--accent-gold:var(--gold-500);
--focus-ring:var(--pink-400);
--shadow-color:220 20% 30%;
}
[data-theme="black-red"]{
--red-50:#fdeceb;--red-100:#f9d0cd;--red-200:#f0a19b;--red-300:#e6746b;--red-400:#ec4c48;--red-500:#e23b4e;--red-600:#c22239;--red-700:#8f1a2c;--red-800:#5c121d;
--grey-50:#efeaea;--grey-100:#241e20;--grey-200:#332a2c;--grey-300:#4a3e40;--grey-400:#6b5b5e;--grey-500:#b7a9ac;--grey-600:#d8cdce;--grey-700:#ece5e6;--grey-800:#f5edee;--grey-900:#121012;
--gold-300:#e8cfa0;--gold-500:#c9a66b;--gold-700:#9c7c46;
--success:#5fae76;--danger:#ff5468;--warning:#e0ac4f;
--surface-page:var(--grey-900);--surface-card:#1b1719;--surface-alt:var(--grey-100);--surface-sunken:#0d0b0c;
--text-primary:var(--grey-800);--text-secondary:var(--grey-500);--text-muted:var(--grey-400);--text-inverse:#1c1718;--text-on-accent:#ffffff;
--border-subtle:var(--grey-200);--border-strong:var(--grey-300);
--accent-primary:var(--red-500);--accent-primary-hover:var(--red-600);--accent-primary-soft:var(--red-800);
--accent-gold:var(--gold-500);
--focus-ring:var(--red-400);
--shadow-color:0 0% 0%;
}

/* --- additional beauty-salon palette variations ---
   Each block below sets the final semantic tokens directly (no
   intermediate hue scale) since every component already reads only the
   semantic names (--surface-*, --text-*, --accent-*, --border-*). */

/* ще сіріше сіро-рожевий: nearly-neutral mauve-grey, very low saturation */
[data-theme="grey-pink-deep"]{
--surface-page:#f6f4f4;--surface-card:#ffffff;--surface-alt:#efebea;--surface-sunken:#f1ecec;
--text-primary:#2e2a2b;--text-secondary:#6f6567;--text-muted:#a79d9e;--text-inverse:#ffffff;--text-on-accent:#ffffff;
--border-subtle:#e2dcdb;--border-strong:#cdc4c3;
--accent-primary:#a08e92;--accent-primary-hover:#8a7579;--accent-primary-soft:#ece6e7;
--accent-gold:#c9a66b;
--focus-ring:#b6a4a7;
--success:#5c8a6a;--danger:#c14b4b;--warning:#c99a3f;
--shadow-color:220 8% 30%;
}

/* біло-рожевий: bright white surfaces, crisp clean pink accent */
[data-theme="white-pink"]{
--surface-page:#ffffff;--surface-card:#ffffff;--surface-alt:#fdf6f8;--surface-sunken:#fef2f6;
--text-primary:#33262b;--text-secondary:#85727a;--text-muted:#bfa8b1;--text-inverse:#ffffff;--text-on-accent:#ffffff;
--border-subtle:#f4dee6;--border-strong:#eec2d1;
--accent-primary:#e18aa8;--accent-primary-hover:#cf6d8e;--accent-primary-soft:#fbebf1;
--accent-gold:#c9a66b;
--focus-ring:#e18aa8;
--success:#5c8a6a;--danger:#c14b4b;--warning:#c99a3f;
--shadow-color:335 30% 40%;
}

/* персиковий: warm peach/apricot accent on cream surfaces */
[data-theme="peach"]{
--surface-page:#fdf8f3;--surface-card:#ffffff;--surface-alt:#f8ede3;--surface-sunken:#fbe9dd;
--text-primary:#3a2b21;--text-secondary:#8a6f5e;--text-muted:#c3ab99;--text-inverse:#ffffff;--text-on-accent:#ffffff;
--border-subtle:#f0ddcb;--border-strong:#e2c3a7;
--accent-primary:#e0956a;--accent-primary-hover:#c97a4f;--accent-primary-soft:#fbe9dd;
--accent-gold:#c9a66b;
--focus-ring:#e0956a;
--success:#5c8a6a;--danger:#c14b4b;--warning:#c99a3f;
--shadow-color:25 35% 35%;
}

/* лавандовий: soft lilac accent, airy surfaces */
[data-theme="lavender"]{
--surface-page:#faf8fd;--surface-card:#ffffff;--surface-alt:#f2edf9;--surface-sunken:#ede4f6;
--text-primary:#2b2635;--text-secondary:#756c8a;--text-muted:#ada2c2;--text-inverse:#ffffff;--text-on-accent:#ffffff;
--border-subtle:#e5ddf1;--border-strong:#d2c3e6;
--accent-primary:#a68fc9;--accent-primary-hover:#8b72b0;--accent-primary-soft:#ede7f7;
--accent-gold:#c9a66b;
--focus-ring:#a68fc9;
--success:#5c8a6a;--danger:#c14b4b;--warning:#c99a3f;
--shadow-color:265 25% 35%;
}

/* нюд: neutral beige/tan, minimal elegant */
[data-theme="nude"]{
--surface-page:#faf6f1;--surface-card:#ffffff;--surface-alt:#f3ebe2;--surface-sunken:#efe2d3;
--text-primary:#372e26;--text-secondary:#85715f;--text-muted:#bda992;--text-inverse:#ffffff;--text-on-accent:#ffffff;
--border-subtle:#ecdfd0;--border-strong:#ddc7ac;
--accent-primary:#b99274;--accent-primary-hover:#9c785d;--accent-primary-soft:#f2e6da;
--accent-gold:#c9a66b;
--focus-ring:#b99274;
--success:#5c8a6a;--danger:#c14b4b;--warning:#c99a3f;
--shadow-color:30 25% 30%;
}

/* шавлієвий (spa): muted sage green, calm/clinical-spa feel */
[data-theme="sage"]{
--surface-page:#f7f9f5;--surface-card:#ffffff;--surface-alt:#eef2ea;--surface-sunken:#e9efe4;
--text-primary:#26302a;--text-secondary:#6c7a63;--text-muted:#a3b096;--text-inverse:#ffffff;--text-on-accent:#ffffff;
--border-subtle:#dfe7d8;--border-strong:#c7d5bd;
--accent-primary:#8fa583;--accent-primary-hover:#74886a;--accent-primary-soft:#e7ede3;
--accent-gold:#c9a66b;
--focus-ring:#8fa583;
--success:#5c8a6a;--danger:#c14b4b;--warning:#c99a3f;
--shadow-color:100 20% 30%;
}

:root{
--font-display:'Cormorant Garamond',ui-serif,Georgia,serif;
--font-body:'Manrope',ui-sans-serif,system-ui,sans-serif;
--font-script:'Dancing Script',cursive;
--text-xs:12px;--text-sm:14px;--text-base:16px;--text-md:18px;--text-lg:22px;--text-xl:28px;--text-2xl:36px;--text-3xl:48px;--text-4xl:64px;--text-5xl:88px;
--leading-tight:1.1;--leading-snug:1.3;--leading-normal:1.5;--leading-relaxed:1.7;
--tracking-tight:-0.01em;--tracking-normal:0;--tracking-wide:0.04em;--tracking-wider:0.12em;
--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;

--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--space-32:128px;
--radius-sm:4px;--radius-md:8px;--radius-lg:14px;--radius-xl:24px;--radius-pill:999px;
--container-max:1180px;

--shadow-sm:0 1px 2px hsl(var(--shadow-color)/0.08);
--shadow-md:0 6px 20px hsl(var(--shadow-color)/0.12);
--shadow-lg:0 16px 40px hsl(var(--shadow-color)/0.18);
--shadow-gold:0 4px 16px hsl(38 45% 55%/0.25);
--ease-standard:cubic-bezier(.4,0,.2,1);
--ease-out:cubic-bezier(0,0,.2,1);
--duration-fast:120ms;--duration-base:200ms;--duration-slow:360ms;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--surface-page);color:var(--text-primary);font-family:var(--font-body);margin:0;transition:background var(--duration-base) var(--ease-standard),color var(--duration-base) var(--ease-standard)}
a{color:var(--accent-primary);text-decoration:none}
a:hover{color:var(--accent-primary-hover)}
img{max-width:100%;display:block}

.container{max-width:var(--container-max);margin:0 auto;padding:0 var(--space-6)}

.btn{font-family:var(--font-body);font-weight:var(--weight-semibold);font-size:var(--text-base);border-radius:var(--radius-pill);padding:14px 32px;border:1px solid transparent;cursor:pointer;transition:background var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),opacity var(--duration-fast) var(--ease-standard);display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn-primary{background:var(--accent-primary);color:var(--text-on-accent)}
.btn-primary:hover{background:var(--accent-primary-hover)}
.btn-primary:disabled{opacity:0.5;cursor:not-allowed}
.btn-ghost{background:transparent;border-color:var(--border-strong);color:var(--text-primary)}
.btn-ghost:hover{background:var(--surface-alt)}

.card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}

input,select,textarea{font-family:var(--font-body);font-size:var(--text-base);color:var(--text-primary);background:var(--surface-card);border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:12px 16px;width:100%;transition:border-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-primary-soft)}
label{font-size:var(--text-sm);color:var(--text-secondary);font-weight:var(--weight-medium);display:block;margin-bottom:var(--space-2)}

.badge{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;border-radius:var(--radius-pill);padding:4px 12px}
.badge-gold{background:var(--accent-gold);color:#3c2f14}
.badge-pending{background:var(--warning);color:#3c2f14}
.badge-confirmed{background:var(--success);color:#fff}

.pill{display:inline-block;border:1px solid var(--accent-primary);border-radius:var(--radius-pill);padding:10px 22px;font-size:var(--text-sm);color:var(--accent-primary)}