/*
Theme Name:   SimplePortugal (Kadence Child)
Theme URI:    https://simpleportugal.com
Description:  Custom child theme of Kadence for SimplePortugal — brand colours, typography, and the homepage build.
Author:       Fabio
Author URI:   https://simpleportugal.com
Template:     kadence
Version:      1.0.0
Text Domain:  sp-kadence-child
*/

/* -------------------------------------------------
   1. Brand variables
   ------------------------------------------------- */
:root {
	--sp-ink: #65312B;      /* dark brown, colour 2 */
	--sp-accent: #C97128;   /* burnt orange, colour 3 */
	--sp-gold: #D4952F;     /* gold, colour 1 */
	--sp-cream: #EFE5CF;    /* warm background, used sparingly (e.g. hero box) */
	--sp-paper: #FBF6EA;    /* near-white surface */
	--sp-text: #2A2A28;     /* body text, soft black */
	--sp-border: #E3D8BE;   /* hairline borders */
	--sp-radius: 6px;
	--sp-max-width: 1180px;
}

/* -------------------------------------------------
   2. Base / typography — generic selectors only.
   Header/footer/nav-specific rules are NOT included yet:
   they depend on Kadence's actual markup, which we haven't
   seen. Add those once header.php/footer.php are available.
   ------------------------------------------------- */
body {
	background: #ffffff;
	color: var(--sp-text);
	font-family: 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 17px;
	line-height: 1.7;
	letter-spacing: 0.1px;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--sp-ink) !important;
	font-weight: 700 !important;
}

h2, h3, h4, h5, h6 {
	font-weight: 600 !important;
}

h1,
.entry-title {
	font-family: Arial, Helvetica, sans-serif !important;
}

.category-links.term-links.category-style-pill,
.category-links.term-links.category-style-pill a,
.category-style-pill,
.category-style-pill a,
a.category-style-pill {
	background-color: #65312B !important;
}

a {
	color: var(--sp-ink);
	text-decoration: none;
	transition: color 0.15s ease;
}

a:hover,
a:focus {
	color: var(--sp-accent);
}

::selection {
	background: var(--sp-accent);
	color: #fff;
}

/* -------------------------------------------------
   3. Layout
   Kadence's header and footer are siblings of #inner-wrap
   (not nested inside it), so constraining #inner-wrap's width
   can never accidentally affect them — unlike OceanWP, where
   header/footer shared the same wrapper as main content.
   NOTE: Kadence has built-in boxed/full-width layout controls
   in Customize → General Settings/Layout. Worth checking there
   first — this CSS may be redundant with a built-in option.
   ------------------------------------------------- */
#inner-wrap.wrap {
	max-width: var(--sp-max-width);
	margin-left: auto;
	margin-right: auto;
}
/* -------------------------------------------------
   4. Buttons / inputs — generic element selectors.
   Kadence's own button classes (likely something like
   .kt-button or .wp-block-button__link) aren't targeted
   yet since we haven't confirmed the exact class names.
   ------------------------------------------------- */
button,
input[type="submit"],
.button {
	background: var(--sp-ink);
	border: none;
	border-radius: var(--sp-radius);
	color: #fff;
	font-family: 'Nunito Sans', sans-serif;
	font-weight: 600;
	letter-spacing: 0.02em;
	padding: 12px 26px;
	transition: background 0.15s ease, transform 0.15s ease;
	cursor: pointer;
}

button:hover,
input[type="submit"]:hover,
.button:hover {
	background: var(--sp-accent);
	color: #fff;
	transform: translateY(-1px);
}

/* -------------------------------------------------
   6. Remove shadow between post content and author box
   ------------------------------------------------- */
.entry-content,
.entry-content-wrap,
.entry.single-entry,
.author-box,
.kadence-author-info,
.entry-author,
.author-bio {
	box-shadow: none !important;
}

.entry-related {
	border-top: 1px solid #a3adbe;
	padding-top: 1rem;
}

#comments.comments-area {
	border-top: 1px solid #a3adbe;
	padding-top: 1rem;
	margin-top: 1rem;
}

img {
	border-radius: 10px !important;
}

/* -------------------------------------------------
   7. Small screens
   ------------------------------------------------- */
@media (max-width: 768px) {
	body {
		font-size: 16px;
	}
}