/* =============================================================
   Mithila Theme Overrides — theme-overrides.css  v1.0.0
   Colour palette + typography aligned with mithilaarts.org
   ============================================================= */

/* ── Google Fonts loaded via functions.php wp_enqueue_style ── */

/* ── Mithila Design Tokens ──────────────────────────────────── */
:root {
	/* Override Creedy core tokens */
	--wdtPrimaryColor:    #9b2335;   /* Mithila vermillion / sindoor */
	--wdtSecondaryColor:  #2d3a2e;   /* Deep forest — warm near-black-green */
	--wdtTertiaryColor:   #fdf6e3;   /* Warm ivory / rice-paste white */
	--wdtBodyBGColor:     #ffffff;
	--wdtBodyTxtColor:    #2c1a10;   /* Warm earth-brown text */
	--wdtHeadAltColor:    #1a0f08;
	--wdtAccentTxtColor:  #ffffff;

	/* Custom Mithila palette */
	--ma-red:       #9b2335;
	--ma-red-deep:  #6e1422;
	--ma-gold:      #c4850a;
	--ma-gold-lt:   #e8a812;
	--ma-green:     #2c5f2e;
	--ma-cream:     #fdf6e3;
	--ma-cream-dk:  #f5e9cc;
	--ma-earth:     #7d4e24;
	--ma-dark:      #1a0f08;

	/* Font overrides */
	--wdtFontTypo_Base: 'Lato', sans-serif;
	--wdtFontTypo_Alt:  'Playfair Display', Georgia, serif;
}

/* ── Global typography ───────────────────────────────────────── */
body,
p, li, span, label, input, textarea, select, button {
	font-family: 'Lato', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Playfair Display', Georgia, serif;
}

/* ── Creedy nav / header link colour ────────────────────────── */
.wdt-primary-nav > li > a,
.wdt-primary-nav > li > a span {
	transition: color .2s ease;
}
.wdt-primary-nav > li > a:hover span,
.wdt-primary-nav > li.current-menu-item > a span,
.wdt-primary-nav > li.current-menu-ancestor > a span {
	color: #ffffff !important;
}

/* ── Creedy primary button ───────────────────────────────────── */
.wdt-btn,
.wdt-button,
a.wdt-btn,
a.wdt-button {
	background-color: var(--ma-red) !important;
	border-color: var(--ma-red) !important;
}
.wdt-btn:hover,
.wdt-button:hover {
	background-color: var(--ma-red-deep) !important;
	border-color: var(--ma-red-deep) !important;
}

/* Donate / header CTA button */
.wdt-header-btn a,
#header-wrapper .wdt-btn {
	background: var(--ma-red) !important;
	border-color: var(--ma-red) !important;
}

/* ── Scrollbar accent ────────────────────────────────────────── */
::-webkit-scrollbar-thumb { background: var(--ma-red); }

/* ── Selection highlight ─────────────────────────────────────── */
::selection { background: rgba(155,35,53,.18); color: var(--ma-dark); }

/* ── Global container = 1366px ──────────────────────────────── */
/* Creedy default is 1440px; 1281-1540px breakpoint shrinks it to
   1080px — both are overridden here so every screen uses 1366px max. */
.container {
	width: 100% !important;
	max-width: 1366px !important;
}
#primary {
	max-width: 1050px !important;
	width: 100% !important;
}
@media only screen and (min-width: 1281px) and (max-width: 1540px) {
	.container { width: 100% !important; max-width: 1366px !important; }
	#primary   { width: 100% !important; max-width: 1050px !important; }
}

/* ── Page title / breadcrumb banner — Mithila brown ─────────── */
.main-title-section-wrapper.dark-bg-breadcrumb > .main-title-section-bg {
	background-color: #834d22 !important;
}
/* Subtle Mithila diamond watermark pattern over the brown */
.main-title-section-wrapper.dark-bg-breadcrumb > .main-title-section-bg::after {
	background-color: transparent !important;
	background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 4L56 30L30 56L4 30Z' fill='none' stroke='rgba(255,255,255,.06)' stroke-width='1'/%3E%3Ccircle cx='30' cy='30' r='3' fill='rgba(255,255,255,.04)'/%3E%3C/svg%3E") !important;
	background-size: 60px 60px !important;
	opacity: 1 !important;
}
/* Text stays white — accent links get warm gold on hover */
.dark-bg-breadcrumb .breadcrumb a:hover {
	color: #f0d090 !important;
}
