/*
 * TherapyBuilt — tokens.css
 *
 * Structural design tokens. These never change between palettes.
 * Brand colour tokens (--tb-primary, --tb-accent, etc.) live in the
 * Style Controller and are injected via wp_add_inline_style().
 *
 * Naming: --space-*, --text-*, --radius-*, --shadow-*, --transition-*
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Lora:ital,wght@0,400;0,600;1,400&display=swap');

:root {

	/* -----------------------------------------------------------------------
	 * Spacing scale (4px base)
	 * ---------------------------------------------------------------------- */
	--space-1:   0.25rem;   /*  4px */
	--space-2:   0.5rem;    /*  8px */
	--space-3:   0.75rem;   /* 12px */
	--space-4:   1rem;      /* 16px */
	--space-5:   1.25rem;   /* 20px */
	--space-6:   1.5rem;    /* 24px */
	--space-8:   2rem;      /* 32px */
	--space-10:  2.5rem;    /* 40px */
	--space-12:  3rem;      /* 48px */
	--space-16:  4rem;      /* 64px */
	--space-20:  5rem;      /* 80px */
	--space-24:  6rem;      /* 96px */
	--space-32:  8rem;      /* 128px */

	/* -----------------------------------------------------------------------
	 * Section padding shorthand
	 * ---------------------------------------------------------------------- */
	--section-gap:    var(--space-20);
	--section-gap-sm: var(--space-12);

	/* -----------------------------------------------------------------------
	 * Container
	 * ---------------------------------------------------------------------- */
	--container-max:     1200px;
	--container-padding: var(--space-6);

	/* -----------------------------------------------------------------------
	 * Type scale
	 * ---------------------------------------------------------------------- */
	--text-xs:   0.75rem;    /* 12px */
	--text-sm:   0.875rem;   /* 14px */
	--text-base: 1rem;       /* 16px */
	--text-lg:   1.125rem;   /* 18px */
	--text-xl:   1.25rem;    /* 20px */
	--text-2xl:  1.5rem;     /* 24px */
	--text-3xl:  1.875rem;   /* 30px */
	--text-4xl:  2.25rem;    /* 36px */
	--text-5xl:  3rem;       /* 48px */

	/* -----------------------------------------------------------------------
	 * Font families
	 * ---------------------------------------------------------------------- */
	--font-sans:  'Inter', system-ui, -apple-system, sans-serif;
	--font-serif: 'Lora', Georgia, serif;

	/* -----------------------------------------------------------------------
	 * Font weights
	 * ---------------------------------------------------------------------- */
	--weight-normal:   400;
	--weight-medium:   500;
	--weight-semibold: 600;

	/* -----------------------------------------------------------------------
	 * Line heights
	 * ---------------------------------------------------------------------- */
	--leading-tight:  1.25;
	--leading-snug:   1.375;
	--leading-normal: 1.5;
	--leading-relaxed: 1.625;

	/* -----------------------------------------------------------------------
	 * Border radius
	 * ---------------------------------------------------------------------- */
	--radius-sm:   0.25rem;   /*  4px */
	--radius-md:   0.5rem;    /*  8px */
	--radius-lg:   0.75rem;   /* 12px */
	--radius-xl:   1rem;      /* 16px */
	--radius-full: 9999px;

	/* -----------------------------------------------------------------------
	 * Shadows
	 * ---------------------------------------------------------------------- */
	--shadow-sm:  0 1px 2px 0 rgb(0 0 0 / 0.05);
	--shadow-md:  0 4px 6px -1px rgb(0 0 0 / 0.07), 0 2px 4px -2px rgb(0 0 0 / 0.05);
	--shadow-lg:  0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.05);
	--shadow-xl:  0 20px 25px -5px rgb(0 0 0 / 0.08), 0 8px 10px -6px rgb(0 0 0 / 0.04);

	/* -----------------------------------------------------------------------
	 * Transitions
	 * ---------------------------------------------------------------------- */
	--transition-fast:   150ms ease;
	--transition-base:   250ms ease;
	--transition-slow:   400ms ease;

	/* -----------------------------------------------------------------------
	 * Z-index scale
	 * ---------------------------------------------------------------------- */
	--z-below:   -1;
	--z-base:     0;
	--z-raised:   10;
	--z-dropdown: 100;
	--z-sticky:   200;
	--z-overlay:  300;
	--z-modal:    400;
	--z-toast:    500;
}
