/*
 Theme Name:   Your Counselling
 Theme URI:    https://yourcounselling.com
 Description:  Custom GeneratePress child theme for Your Counselling
 Author:       Brad Morris @ Welby Consulting
 Author URI:   https://welbyconsulting.com
 Template:     generatepress
 Version:      1.0
*/

.list--checks li {
	position: relative;
	margin-bottom: 0.375rem
}
.list--checks li::before {
	display: block;
	content: " ";
	position:absolute;
	background-image: url(/wp-content/uploads/2026/05/check.svg);
	width: 16px;
	height: 16px;
	left: -24px;
	top: 4px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 50%;
	background-color: transparent;
}

.list--checks {
	padding-left: 24px;
	margin: 12px 0 6px;
	list-style-type: none;
}

.top-bar .widget {
	width: 100%
}

.site-sticky-header {
	position: sticky;
	top: 0;
	z-index: 8000;
}

body.admin-bar .site-sticky-header {
	top: 32px;
}

/* =====================================================================
   Mobile + blog QA cleanup (Julian's Jul 2026 list). Added 2026-08-11.
   Kept in the child stylesheet on purpose: deploys with the code,
   makes no database change, and avoids the GenerateBlocks CSS-regen
   issue that comes with editing the blocks directly.
   ===================================================================== */

/* Task 8. The sticky top bar was translucent (rgba .95), so the page
   showed through it while scrolling. Make it fully opaque. */
.top-bar {
	background-color: #7DB8AC !important;
}

/* Task 1. Homepage "Our Blog" thumbnails were stretched (object-fit:
   fill). Crop to a consistent ratio instead of distorting them. */
.gb-element-3764611b .gb-loop-item img {
	object-fit: cover;
	aspect-ratio: 3 / 2;
	width: 100%;
	height: auto;
}

@media (max-width: 768px) {
	/* Task 5. Logo rendered ~300px wide, wrapping the burger onto its
	   own line. Shrink the logo so the toggle sits beside it. */
	.site-header .header-image {
		max-height: 44px;
		width: auto;
	}

	/* Task 6. Service-page FAQ accordion ran edge to edge. Inset the
	   accordion while leaving any full-width band untouched. */
	.gb-accordion {
		margin-left: 12px;
		margin-right: 12px;
	}

	/* Task 7. Single blog-post body text touched both screen edges. */
	.single-post .dynamic-entry-content {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media (max-width: 480px) {
	/* Task 4. Top-bar phone number and Book button wrapped to two lines
	   on narrower iPhones. Keep each on a single line. */
	.top-bar a[href^="tel:"],
	.top-bar .gb-text.btn {
		white-space: nowrap;
	}
}
