/*
Theme Name:     Plantisima
Theme URI:
Description:    Kadence child theme - Botanical Editorial brand.
Author:         Plantisima
Author URI:
Template:       kadence
Version:        1.0.0
*/

/* ============================================================
   PLANTISIMA - Botanical Editorial
   Forest green · cream · white cards · terracotta accent
   Headings: DM Serif Display · Body: Inter
   ============================================================ */

:root {
	/* Brand colours mapped onto Kadence's global palette.
	   !important guarantees they win over Kadence's dynamic defaults. */
	--global-palette1: #1B3A2B !important; /* forest    - primary (links, buttons) */
	--global-palette2: #142A20 !important; /* dark forest */
	--global-palette3: #14241B !important; /* darkest */
	--global-palette4: #1B3A2B !important; /* headings */
	--global-palette5: #2F3A33 !important; /* body text */
	--global-palette6: #6B7A6E !important; /* muted sage-grey */
	--global-palette7: #E3E0D2 !important; /* warm sand - borders / subtle bg */
	--global-palette8: #F7F3E8 !important; /* cream     - section backgrounds */
	--global-palette9: #FFFFFF !important; /* white     - cards / base surface */

	/* Brand tokens for custom work */
	--brand-canvas: #F7F3E8;   /* cream page */
	--brand-surface: #FFFFFF;  /* white cards */
	--brand-ink: #1B3A2B;      /* forest */
	--brand-accent: #C56B3E;   /* terracotta */
	--brand-forest: #1B3A2B;
	--brand-forest-dark: #142A20;
	--brand-cream: #F7F3E8;
	--brand-sand: #E3E0D2;
	--brand-sage: #E7EDDC;      /* soft sage - accent section band */

	/* Typography */
	--global-heading-font-family: 'DM Serif Display', Georgia, serif !important;
	--global-body-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
	/* DM Serif Display ships in a single heavy weight - pin headings to 400
	   so the browser never synthesises a muddy faux-bold. */
	--heading-weight: 400;
	--heading-weight-strong: 400;

	/* Surface treatment */
	--card-radius: 4px;
	--card-border-color: #E3E0D2;
	--card-shadow: none;

	/* Header */
	--header-bg: #F7F3E8;
	--header-ink: #1B3A2B;

	/* Buttons */
	--btn-bg: #1B3A2B;
	--btn-text: #F7F3E8;
	--btn-hover-bg: #C56B3E;
}

/* ---- Page canvas & base text ------------------------------------------- */
html,
body {
	background-color: var(--brand-canvas);
}

body {
	font-family: var(--global-body-font-family);
	color: var(--global-palette5);
}

/* ---- Typography --------------------------------------------------------- */
h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
	font-family: var(--global-heading-font-family);
	color: var(--brand-ink);
	font-weight: var(--heading-weight, 600);
	letter-spacing: -0.01em;
}

h1, .entry-title {
	font-weight: var(--heading-weight-strong, 700);
}

/* ---- Post cards --------------------------------------------------------- */
.entry.loop-entry,
article.loop-entry {
	background-color: var(--brand-surface);
	border: 1px solid var(--card-border-color);
	border-radius: var(--card-radius);
	box-shadow: var(--card-shadow);
	overflow: hidden;
}

.single .entry-content-wrap,
.page .entry-content-wrap {
	background-color: var(--brand-surface);
}

/* ---- Links & accent ----------------------------------------------------- */
a {
	color: var(--global-palette1);
	text-decoration-color: var(--card-border-color);
}

a:hover {
	color: var(--brand-accent);
}

.entry-title a {
	color: var(--brand-ink);
}
.entry-title a:hover {
	color: var(--brand-accent);
}

/* ---- Buttons ------------------------------------------------------------ */
.wp-block-button__link,
.button,
button:not(.menu-toggle):not(.search-toggle-open):not(.toggle):not(.drawer-toggle):not(.drawer-sub-toggle),
input[type="submit"],
.kb-button.button-style-fill {
	background-color: var(--btn-bg);
	border-color: var(--btn-bg);
	color: var(--btn-text);
	border-radius: 6px;
}

.wp-block-button__link:hover,
.button:hover,
input[type="submit"]:hover,
.kb-button.button-style-fill:hover {
	background-color: var(--btn-hover-bg);
	border-color: var(--btn-hover-bg);
	color: var(--btn-text);
}

/* ---- Header ------------------------------------------------------------- */
.site-header-wrap,
.site-main-header-wrap,
#masthead {
	background-color: var(--header-bg);
}

/* Hairline under the header so the cream menu has a clean edge against the
   equally-cream page, without introducing a competing colour block. */
#masthead {
	border-bottom: 1px solid var(--brand-sand);
}

/* Modern mobile menu trigger: hide Kadence's chunky icon and draw three thin,
   evenly spaced lines (each gradient layer is one 2px line). */
.menu-toggle-icon {
	display: inline-block;
	width: 26px;
	height: 16px;
	background-image:
		linear-gradient(currentColor, currentColor),
		linear-gradient(currentColor, currentColor),
		linear-gradient(currentColor, currentColor);
	background-size: 26px 2px;
	background-position: left top, left center, left bottom;
	background-repeat: no-repeat;
}
.menu-toggle-icon svg {
	display: none;
}
/* "Menu" label beside the icon (icon first, then the word). Light outline
   treatment in brand forest so the trigger matches the logo / palette instead
   of the default dark fill. !important overrides Kadence's generated colours. */
#mobile-toggle.menu-toggle-open {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1.15rem;
	background-color: transparent !important;
	color: var(--brand-ink) !important;
	border: 1.5px solid var(--brand-forest) !important;
	border-radius: 999px;
}
#mobile-toggle .menu-toggle-icon {
	order: -1;
	color: var(--brand-ink);
}
#mobile-toggle .menu-toggle-label {
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1;
	color: var(--brand-ink);
}

/* ---- Footer ------------------------------------------------------------- */
/* Link row above the copyright line (see plantisima_footer_html_content). */
.footer-html .footer-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem 0;
	margin-bottom: 0.85rem;
}
.footer-html .footer-links a {
	color: inherit;
	text-decoration: none;
	font-weight: 500;
	opacity: 0.85;
	transition: color 0.15s ease, opacity 0.15s ease;
}
/* "|" divider between links, not after the last one. */
.footer-html .footer-links a:not(:last-child)::after {
	content: "|";
	display: inline-block;
	margin: 0 0.9rem;
	opacity: 0.4;
}
.footer-html .footer-links a:hover,
.footer-html .footer-links a:focus {
	opacity: 1;
	color: var(--brand-accent);
}

#masthead .site-title,
#masthead .site-title a {
	color: var(--header-ink);
}

/* ---- Mobile: hide the sidebar -------------------------------------------- */
/* On phones/tablets the sidebar stacks below the article and adds clutter, so
   hide it and let the content use the full width. */
@media (max-width: 768px) {
	#secondary.primary-sidebar { display: none; }
}