/* ==========================================================================
   AF Pharmacy V2 — design tokens
   Values transcribed from the approved design canvas. Light is the exact
   match; dark keeps the same hues on an ink ground.
   ========================================================================== */

html,
html[data-theme="light"] {
	--af-bg: #f4f7f7;
	--af-bg-soft: #ffffff;
	--af-surface: #ffffff;
	--af-surface-2: #f4f7f7;
	--af-surface-3: #eef3f3;

	--af-text-1: #0b1f23;
	--af-text-2: #3d5257;
	--af-text-3: #6c8085;
	--af-text-4: #9aafb3;

	--af-border: #e2eaea;
	--af-border-soft: #eef3f3;
	--af-border-strong: #cfdede;

	/* Teal: -deep carries white text (4.9:1); the brighter one is for ink. */
	--af-accent: #03989e;
	--af-accent-deep: #027177;
	--af-accent-text: #027177;
	--af-accent-soft: #e6f4f5;
	--af-accent-border: #bfe0e2;
	--af-on-accent: #ffffff;

	/* Offers / urgency — the only warm colour in the system. */
	--af-warm: #c2610a;
	--af-warm-soft: #fdf1e3;
	--af-warm-border: #f0d9bc;
	--af-warm-text: #6b4113;

	--af-ink: #0b1f23;
	--af-ink-2: #063e43;
	--af-on-ink: #ffffff;
	--af-on-ink-2: #b9cccf;
	--af-on-ink-3: #9fb3b6;
	--af-ink-glow: #7fd4d8;
	--af-ink-badge: #9fe3e7;
	--af-ink-surface: rgba(255, 255, 255, 0.07);
	--af-ink-border: rgba(255, 255, 255, 0.14);
	--af-on-ink-accent: #04282b;

	--af-shadow-card: 0 1px 2px rgba(11, 31, 35, 0.04);
	--af-shadow-float: 0 18px 40px -22px rgba(0, 0, 0, 0.6);
	--af-shadow-hover: 0 18px 38px -22px rgba(11, 31, 35, 0.35);
	--af-scrim: rgba(11, 31, 35, 0.45);
}

html[data-theme="dark"] {
	--af-bg: #061418;
	--af-bg-soft: #0b1f23;
	--af-surface: #0e262b;
	--af-surface-2: #123036;
	--af-surface-3: #16383f;

	--af-text-1: #f2f7f7;
	--af-text-2: #c3d4d6;
	--af-text-3: #9fb3b6;
	--af-text-4: #7e9498;

	--af-border: #1d454c;
	--af-border-soft: #163740;
	--af-border-strong: #26575f;

	--af-accent: #4fd0d6;
	--af-accent-deep: #03989e;
	--af-accent-text: #6fdde2;
	--af-accent-soft: rgba(79, 208, 214, 0.12);
	--af-accent-border: rgba(79, 208, 214, 0.32);
	--af-on-accent: #04282b;

	--af-warm: #f0a45a;
	--af-warm-soft: rgba(240, 164, 90, 0.14);
	--af-warm-border: rgba(240, 164, 90, 0.32);
	--af-warm-text: #f6cfa4;

	--af-shadow-card: none;
	--af-shadow-float: 0 18px 40px -24px rgba(0, 0, 0, 0.9);
	--af-shadow-hover: 0 18px 40px -24px rgba(0, 0, 0, 0.8);
	--af-scrim: rgba(2, 10, 12, 0.72);
}

/* Type, radii, layout, motion */
html {
	--af-font-body: 'IBM Plex Sans Arabic', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--af-font-display: 'Almarai', 'IBM Plex Sans Arabic', system-ui, sans-serif;

	--af-radius-sm: 8px;
	--af-radius-input: 12px;
	--af-radius-btn: 14px;
	--af-radius-card-sm: 16px;
	--af-radius-card: 20px;
	--af-radius-hero: 28px;
	--af-radius-pill: 999px;

	--af-container: 1312px;
	--af-gutter: 64px;

	--af-ease-micro: 0.22s;
	--af-ease-theme: 0.35s;
	--af-ease-reveal: 0.6s;
}

@media (max-width: 1100px) {
	html {
		--af-gutter: 32px;
	}
}

@media (max-width: 640px) {
	html {
		--af-gutter: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}

	.card,
	.af-cat-card,
	.woocommerce ul.products li.product,
	.button {
		transform: none !important;
	}
}