/*
Theme Name: Mom Life Podcast
Theme URI: https://example.com/mom-life-theme
Template: astra
Author: Sonia Flores / Developer
Author URI: https://example.com
Description: Custom WordPress Child Theme for Mom Life Podcast. Features custom post types for Podcasts, Resources, and Community Submissions.
Tags: custom-colors, custom-menu, custom-logo, editor-style, featured-images, translation-ready
Version: 1.0.0
Updated: 2026-04-18
*/

/* ---------------------------------------------------------
   1. CSS Variables & Design Tokens
--------------------------------------------------------- */
:root {
	/* Brand Colors */
	--momlife-primary: #b26cff; /* Purple */
	--momlife-secondary: #292072; /* Dark Blue */
	--momlife-text: #2e2e38; /* Dark Text */
	
	/* Neutral & Background Colors */
	--momlife-bg-light: #fdf8f5; /* Soft Cream */
	--momlife-bg-darker: #f5ede8; /* Darker Cream for sidebars/forms */
	--momlife-text-light: #8a7a72; /* Subheadings, meta */
	--momlife-white: #ffffff;

	/* Typography */
	--momlife-font-heading-main: 'Prata', serif;
	--momlife-font-heading-sub: 'Poppins', sans-serif;
	--momlife-font-body: 'Poppins', sans-serif;

	/* Shapes & Spacing */
	--momlife-border-radius: 40px; /* Pill shape buttons */
	--momlife-container-width: 1200px;
	--momlife-gap: 48px;
}

/* ---------------------------------------------------------
   2. Base Typography & Global Styles
--------------------------------------------------------- */
body, 
button, 
input, 
select, 
textarea {
	font-family: var(--momlife-font-body);
	color: var(--momlife-text);
	background-color: var(--momlife-bg-light);
}

h1, h2, h3 {
	font-family: var(--momlife-font-heading-main);
	color: var(--momlife-secondary);
	font-weight: 400; /* Prata is typically a single weight */
	margin-bottom: 24px;
}

h4, h5, h6 {
	font-family: var(--momlife-font-heading-sub);
	font-weight: 700; /* Poppins Bold */
	color: var(--momlife-secondary);
}

a {
	color: var(--momlife-primary);
	text-decoration: none;
	transition: color 0.3s ease;
}

a:hover {
	color: var(--momlife-secondary);
}

/* ---------------------------------------------------------
   3. Buttons
--------------------------------------------------------- */
.button,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.wp-block-button__link {
	background-color: var(--momlife-primary);
	color: var(--momlife-white);
	border-radius: var(--momlife-border-radius);
	padding: 12px 32px;
	border: none;
	font-family: var(--momlife-font-body);
	font-weight: 600;
	transition: background-color 0.3s ease, transform 0.2s ease;
	cursor: pointer;
	text-align: center;
	display: inline-block;
}

.button:hover,
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover {
	background-color: var(--momlife-secondary);
	color: var(--momlife-white);
}

/* ---------------------------------------------------------
   4. Layout Utilities
--------------------------------------------------------- */
.container {
	max-width: var(--momlife-container-width);
	margin: 0 auto;
	padding: 40px;
}

@media (max-width: 768px) {
	.container {
		padding: 20px;
	}
}

.section-gap {
	margin-top: var(--momlife-gap);
	margin-bottom: var(--momlife-gap);
}

/* Cards & Sidebars */
.card, .sidebar-box {
	background-color: var(--momlife-bg-darker);
	border-radius: 12px;
	padding: 30px;
	margin-bottom: 30px;
}

/* Form Styles */
input[type="text"],
input[type="email"],
textarea,
select {
	width: 100%;
	padding: 12px;
	margin-bottom: 15px;
	border: 1px solid #ddd;
	border-radius: 8px;
	font-family: var(--momlife-font-body);
}

/* Custom Grid for Archive Pages */
.momlife-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 30px;
}