/* ============================================================
   Casa Lago Booking - design tokens (ported from the Casa Lago
   design system, namespace CasaLagoDesignSystem_01e065).

   Scoped to .clb-booking (the booking widget) and .clb-villa
   (the landing page) so each renders in its own design language
   regardless of the surrounding theme, and never leaks its
   custom properties onto the global :root.

   Launch font route (Fraunces + Inter Tight) is enqueued
   separately by the shortcode. The premium route (PP Editorial
   New + PP Neue Montreal) falls back to the launch families
   until the licensed faces are added.
   ============================================================ */

.clb-booking,
.clb-villa,
.clb-villa-checkout {
	/* --- Raw palette - all warm, no cool greys ------------- */
	--color-limewash: #F3EEE5;
	--color-ink: #16150F;
	--color-stone: #CABFAD;
	--color-ochre: #A87C3D;
	--color-marine: #2F4858;
	--color-bronze: #9A7B4F;

	--color-limewash-deep: #ECE5D8;
	--color-paper: #FAF7F0;
	--color-ink-80: #3A382F;
	--color-ink-55: #6B675B;
	--color-stone-deep: #B3A78F;
	--color-ochre-deep: #8E6831;
	--color-marine-deep: #223642;
	--color-bronze-deep: #806641;

	/* --- Hairlines (the only dividers in the system) ------- */
	--line-ink: rgba(22, 21, 15, 0.14);
	--line-faint: rgba(22, 21, 15, 0.08);
	--line-paper: rgba(243, 238, 229, 0.22);

	/* --- Semantic surfaces --------------------------------- */
	--surface-base: var(--color-limewash);
	--surface-raised: var(--color-paper);
	--surface-sunk: var(--color-limewash-deep);
	--surface-ink: var(--color-ink);

	/* --- Semantic text ------------------------------------- */
	--text-primary: var(--color-ink);
	--text-secondary: var(--color-ink-80);
	--text-muted: var(--color-ink-55);
	--text-on-ink: var(--color-limewash);
	--text-on-image: #FFFFFF;

	/* --- Accent roles -------------------------------------- */
	--accent: var(--color-ochre);
	--accent-pressed: var(--color-ochre-deep);
	--link: var(--color-marine);
	--link-pressed: var(--color-marine-deep);

	/* --- Calendar day states (warm three-way read) --------- */
	/* Green = available, a soft warm gold = request only, a soft light red =
	   taken. All three sit in the warm palette so they read as siblings, not as
	   a warning. */
	--day-free: #BFD9A0;
	--day-free-hover: #AECC8A;
	--day-free-ink: #2F3E1F;
	--day-request: #EAD08A;
	--day-request-hover: #E2C46F;
	--day-request-ink: #5A4718;

	/* Booked / taken nights: a soft, warm light red. It reads clearly as
	   "taken" without shouting like a system error, a sibling to the green
	   available and gold request circles. */
	--day-booked: #E7B3A9;
	--day-booked-ink: #7A352B;

	/* --- Borders ------------------------------------------- */
	--border-hairline: var(--line-ink);
	--border-faint: var(--line-faint);

	/* --- Imagery treatment --------------------------------- */
	--image-warm: sepia(0.14) saturate(1.06) contrast(1.02) brightness(1.01);
	--image-warm-strong: sepia(0.22) saturate(1.08) contrast(1.03);

	/* --- Type ---------------------------------------------- */
	--font-display: 'Fraunces', 'PP Editorial New', Georgia, 'Times New Roman', serif;
	--font-body: 'Inter Tight', 'PP Neue Montreal', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;

	--display-opsz: 144;
	--display-wght: 340;
	--display-settings: "opsz" var(--display-opsz), "wght" var(--display-wght);

	--weight-display: 340;
	--weight-body: 400;
	--weight-light: 300;
	--weight-medium: 500;

	--text-display-xl: clamp(3.5rem, 9vw, 8.5rem);
	--text-display-l: clamp(2.75rem, 6vw, 5.5rem);
	--text-display-m: clamp(2.1rem, 4vw, 3.5rem);
	--text-display-s: clamp(1.6rem, 2.6vw, 2.25rem);
	--text-lead: 1.375rem;
	--text-body: 1.0625rem;
	--text-sm: 0.9375rem;
	--text-meta: 0.8125rem;
	--text-micro: 0.6875rem;

	--leading-display: 1.02;
	--leading-title: 1.08;
	--leading-body: 1.6;
	--leading-snug: 1.3;

	--tracking-display: -0.02em;
	--tracking-title: -0.015em;
	--tracking-body: -0.005em;
	--tracking-eyebrow: 0.22em;

	/* --- Spacing & layout (8px base) ----------------------- */
	--space-2xs: 0.25rem;
	--space-xs: 0.5rem;
	--space-sm: 0.75rem;
	--space-md: 1rem;
	--space-lg: 1.5rem;
	--space-xl: 2.5rem;
	--space-2xl: 4rem;
	--space-3xl: 6rem;
	--space-4xl: 9rem;
	--space-5xl: 13.5rem;

	--section-gap: clamp(5rem, 12vw, 13.5rem);
	--section-gap-tight: clamp(3.5rem, 7vw, 7rem);
	--margin-page: clamp(1.25rem, 6vw, 7.5rem);
	--margin-text: clamp(1.25rem, 4vw, 3rem);

	--measure-narrow: 34ch;
	--measure: 58ch;
	--measure-wide: 72ch;
	--container-max: 1680px;
	--container-text: 720px;

	--radius-none: 0;
	--radius-xs: 2px;
	--radius-pill: 999px;
	--border-width: 1px;

	/* --- Motion -------------------------------------------- */
	/* Craft easing for this plugin, per the build brief. The
	   design master ease is a close sibling, kept for parity. */
	--clb-ease: cubic-bezier(0.23, 1, 0.32, 1);
	--ease-master: cubic-bezier(0.23, 1, 0.32, 0.85);
	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

	--dur-instant: 120ms;
	--dur-quick: 320ms;
	--dur-base: 600ms;
	--dur-slow: 800ms;
	--dur-grand: 1000ms;
	--stagger-word: 60ms;

	--hover-image-scale: 1.03;
}

/* Premium type route - swap families at the token level only. */
.clb-booking[data-type-route="premium"],
.clb-villa[data-type-route="premium"] {
	--font-display: 'PP Editorial New', 'Fraunces', Georgia, serif;
	--font-body: 'PP Neue Montreal', 'Inter Tight', system-ui, sans-serif;
	--weight-display: 300;
	--display-wght: 300;
}

/* Inverted scope - ink surfaces with limewash text. */
.clb-booking[data-theme="ink"],
.clb-booking [data-theme="ink"],
.clb-villa[data-theme="ink"],
.clb-villa [data-theme="ink"] {
	--surface-base: var(--color-ink);
	--text-primary: var(--color-limewash);
	--text-secondary: rgba(243, 238, 229, 0.74);
	--text-muted: rgba(243, 238, 229, 0.50);
	--border-hairline: var(--line-paper);
	--link: #A9C2D0;
}