/*
Theme Name: Siam District
Theme URI: https://siamdistrict.com
Author: MardenDigital
Description: Custom hand-coded theme for Siam District — Thai boxing jerseys and vests, multi-brand retail.
Version: 0.1.0
Text Domain: siam-district
Requires PHP: 7.4
*/

:root {
	/* Brand colours — from live site customizer, 19 Aug 2026 */
	--sd-color-header-bg: #f0f0f0;
	--sd-color-header-text: #1a1a1a;
	--sd-color-header-border: rgba(0, 0, 0, 0.1);
	--sd-color-header-hover-bg: rgba(0, 0, 0, 0.05);
	--sd-color-brand: #354baf;
	--sd-color-brand-hover: #2b3d8f;
	--sd-color-button-text: #ffffff;
	--sd-color-body-text: #333333;
	--sd-color-white: #ffffff;
	--sd-color-border: #e5e5e5;
	--sd-color-overlay: rgba(0, 0, 0, 0.6);
	--sd-color-page-bg: #f0f0f0;
	--sd-color-banner-bg: #000000;
	--sd-color-banner-text: #ffffff;

	/* Layout */
	--sd-header-height: 88px;
	--sd-container-width: 1280px;
	--sd-radius: 2px;

	/* Type */
	--sd-font-heading: "Clash Display", -apple-system, "Helvetica Neue", Arial, sans-serif;
	--sd-font-button: "Kode Mono", "SF Mono", Menlo, Consolas, monospace;
	--sd-font-body: "Wix Madefor Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---- Self-hosted fonts ----
   One weight per file — the live site's font chain was already flagged as a
   speed issue (sequential .woff2 loads), so we're not repeating that here. */

@font-face {
	font-family: "Clash Display";
	src: url("assets/fonts/clash-display-500.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Clash Display";
	src: url("assets/fonts/clash-display-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Clash Display";
	src: url("assets/fonts/clash-display-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Kode Mono";
	src: url("assets/fonts/kode-mono-600.woff2") format("woff2");
	font-weight: 500 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Wix Madefor Display";
	src: url("assets/fonts/wix-madefor-display-400.woff2") format("woff2");
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	background: var(--sd-color-page-bg);
	color: var(--sd-color-body-text);
	font-family: var(--sd-font-body);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--sd-font-heading);
	margin: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

button {
	font-family: var(--sd-font-button);
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.screen-reader-text:focus {
	position: static;
	width: auto;
	height: auto;
	clip: auto;
}