/*
Theme Name: Bit of Comfort
Theme URI: https://bitofcomfort.com
Description: Custom classic theme for the Bit of Comfort WooCommerce storefront. Hand-coded, no framework, no page builder, no build step.
Author: Bit of Comfort
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: bitofcomfort
*/

/* ============================================================
   Design tokens — single source of truth for color, type, space.
   Tune these to the logo/comps; everything else references them.
   ============================================================ */
:root {
	/* Brand palette — UI colors sampled from the design comps; logo coral kept for harmony */
	--boc-blue: #2070c0;          /* primary blue: nav, headers (from comps) */
	--boc-blue-dark: #16548f;     /* utility bar / footer */
	--boc-blue-tint: #d6e6f6;     /* light blue: dropdown / hover backgrounds (from comps) */
	--boc-blue-gray: #a0b0c0;     /* logo "OF" gray accent */
	/* Light text/borders on blue/dark bands (utility bar, nav, breadcrumb, meta).
	   One small scale instead of ~9 near-identical hand-picked light blues. */
	--boc-on-blue: #dceaf7;       /* default light text on blue */
	--boc-on-blue-muted: #c9d6ec; /* secondary light text on blue */
	--boc-on-blue-faint: #9fb3d6; /* faint / placeholder light text on blue */
	--boc-red: #c8202a;           /* deals / savings / urgency accent (darkened from comp #e8262e to pass WCAG AA for small text + the cart badge) */
	--boc-red-logo: #c86058;      /* logo "COMFORT" coral */
	/* Commerce buy action (Add to Cart, Checkout, Place Order) — one source of
	   truth shared by .boc-btn--cart and the WooCommerce buttons. Blue per the
	   comps; reserve --boc-red for deals/savings accents. */
	--boc-cta: #2070c0;
	--boc-cta-hover: #16548f;
	--boc-star: #f5a623;          /* review rating stars */
	/* Shared hero/band gradient — one source for every blue hero band. */
	--boc-grad-hero: linear-gradient(120deg, var(--boc-blue) 0%, var(--boc-blue-dark) 100%);
	--boc-ink: #1d2733;
	--boc-muted: #5a6675;
	--boc-line: #e2e6eb;
	--boc-bg: #ffffff;
	--boc-bg-alt: #f4f6f8;

	/* Type — Causten Round Extra Bold (licensed webfont) for display/headings;
	   system sans for body (only the Extra Bold weight is web-licensed). */
	--boc-font-body: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--boc-font-head: "Causten Round", system-ui, -apple-system, "Segoe UI", sans-serif;

	/* Spacing scale */
	--boc-space-1: 0.25rem;
	--boc-space-2: 0.5rem;
	--boc-space-3: 1rem;
	--boc-space-4: 1.5rem;
	--boc-space-5: 2rem;
	--boc-space-6: 3rem;

	/* Layout */
	--boc-maxw: 1280px;
	--boc-radius: 6px;
	--boc-radius-pill: 999px;     /* full-round chips / tags / pills */
}

/* Brand display font — Causten Round Extra Bold (MyFonts webfont license).
   Only the Extra Bold weight is web-licensed, so it covers the bold range. */
@font-face {
	font-family: "Causten Round";
	src: url("assets/fonts/causten-round-extrabold.woff2") format("woff2"),
	     url("assets/fonts/causten-round-extrabold.woff") format("woff");
	font-weight: 700 900;
	font-style: normal;
	font-display: swap;
}

/* Minimal reset */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: var(--boc-font-body); color: var(--boc-ink); background: var(--boc-bg); line-height: 1.5; }
h1, h2, h3, h4, h5, h6 { font-family: var(--boc-font-head); line-height: 1.15; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--boc-blue); }
