/*
Theme Name: Tunaweza
Description: Child theme of Twenty Twenty-Five for Tunaweza Children's Centre.
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 7.4
Text Domain: tunaweza
*/

/* ---- Top bar ---- */
.tw-topbar a { color: inherit; text-decoration: none; }
.tw-topbar a:hover { text-decoration: underline; }

/* ---- Header ---- */
.tw-header { position: sticky; top: 0; z-index: 20; box-shadow: 0 1px 0 rgba(43, 35, 48, .08); }
.admin-bar .tw-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .tw-header { top: 46px; } }
.tw-header .wp-block-navigation a:hover { color: var(--wp--preset--color--accent-1); }
.tw-header .wp-block-navigation .current-menu-item > a,
.tw-header .wp-block-navigation a[aria-current="page"] { color: var(--wp--preset--color--accent-1); text-decoration: underline; text-underline-offset: .35em; text-decoration-thickness: 2px; }

/* ---- Eyebrow label above section headings ---- */
.is-style-tw-eyebrow {
	text-transform: uppercase;
	letter-spacing: .12em;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	color: var(--wp--preset--color--accent-3);
	font-family: var(--wp--preset--font-family--manrope);
}

/* ---- Cards ---- */
.is-style-tw-card {
	background: var(--wp--preset--color--base);
	border-radius: 14px;
	box-shadow: 0 1px 2px rgba(43, 35, 48, .06), 0 8px 24px rgba(43, 35, 48, .06);
	overflow: hidden;
}
/* Equal-height cards only where they sit side by side in a grid */
.wp-block-post-template > li > .is-style-tw-card,
.is-layout-grid > .is-style-tw-card { height: 100%; }
.wp-block-post-template > li { display: flex; flex-direction: column; }
.wp-block-query-pagination-numbers .page-numbers { padding: 0 .4em; }
.wp-block-post-navigation-link .post-navigation-link__label { font-weight: 700; margin-right: .35em; }
.is-style-tw-card .wp-block-image,
.is-style-tw-card .wp-block-post-featured-image { margin: 0; }
.is-style-tw-card .wp-block-image img,
.is-style-tw-card .wp-block-post-featured-image img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }

/* Columns used as cards: stretch to equal height (a percentage height would block flex stretch) */
.wp-block-column.is-style-tw-card { height: auto; align-self: stretch; }

/* Value cards get a coloured top edge, cycling through the logo colours */
.tw-values .wp-block-heading { font-size: 1.2rem; hyphens: none; overflow-wrap: normal; word-break: normal; }
@media (min-width: 782px) and (max-width: 1100px) {
	.tw-values { flex-wrap: wrap !important; }
	.tw-values > .wp-block-column { flex-basis: calc(33.333% - 2rem) !important; flex-grow: 1; }
}
.tw-values > .wp-block-column { border-top: 4px solid var(--wp--preset--color--accent-1); }
.tw-values > .wp-block-column:nth-child(5n+2) { border-top-color: var(--wp--preset--color--accent-3); }
.tw-values > .wp-block-column:nth-child(5n+3) { border-top-color: var(--wp--preset--color--green); }
.tw-values > .wp-block-column:nth-child(5n+4) { border-top-color: var(--wp--preset--color--blue); }
.tw-values > .wp-block-column:nth-child(5n+5) { border-top-color: var(--wp--preset--color--accent-1); }

/* Check-mark lists */
.is-style-tw-checklist { list-style: none; padding-left: 0; }
.is-style-tw-checklist li { position: relative; padding-left: 1.75em; margin-bottom: .5em; }
.is-style-tw-checklist li::before {
	content: "";
	position: absolute; left: 0; top: .35em;
	width: 1.05em; height: 1.05em; border-radius: 50%;
	background: var(--wp--preset--color--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M4 8.5l2.5 2.5L12 5.5'/%3E%3C/svg%3E") center / 80% no-repeat;
}

/* Rounded photos: fill their column even when the source image is narrower */
.is-style-tw-rounded img { border-radius: 14px; width: 100%; height: auto; }
.is-style-tw-card .is-style-tw-rounded img { border-radius: 0; }

/* Hero cover: keep text readable on photos */
.tw-hero .wp-block-cover__inner-container { max-width: 1200px; }
.tw-hero .is-style-tw-eyebrow { color: #F9D4E2; }
.tw-hero .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; border: 2px solid #fff; background: transparent; }
.tw-hero .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(255, 255, 255, .15); }

/* Light text on dark sections */
.has-accent-1-background-color .wp-block-heading,
.has-accent-1-dark-background-color .wp-block-heading { color: inherit; }

/* Footer */
.tw-footer a { color: inherit; text-decoration: none; }
.tw-footer a:hover { text-decoration: underline; }
.tw-footer .wp-block-navigation__container { gap: .5em; }

/* Contact Form 7 */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
	width: 100%;
	padding: .75em 1em;
	border: 1px solid #d9cfd6;
	border-radius: 10px;
	font: inherit;
	background: var(--wp--preset--color--base);
	box-sizing: border-box;
}
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: 2px solid var(--wp--preset--color--accent-1); outline-offset: 1px; }
.wpcf7 input[type="submit"] {
	background: var(--wp--preset--color--accent-1);
	color: var(--wp--preset--color--base);
	border: 0; border-radius: 999px;
	padding: .8em 2em; font: inherit; font-weight: 700; cursor: pointer;
}
.wpcf7 input[type="submit"]:hover { background: var(--wp--preset--color--accent-1-dark); }
.wpcf7 label { font-weight: 600; display: block; }
