/*
Theme Name: Clean Brand
Theme URI: https://example.com/clean-brand
Author: Clean Brand
Author URI: https://example.com
Description: Professional cleaning-services theme (Perth). Elementor-ready, fully customizable from the WordPress Customizer, with Service & FAQ custom post types and one-click demo content. Converted 1:1 from the Clean Brand React design.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clean-brand
Tags: business, custom-logo, custom-menu, featured-images, full-width-template, theme-options, translation-ready, elementor
*/

/*
 * The full design system (compiled Tailwind + design tokens) is enqueued from
 * assets/css/theme.css via inc/enqueue.php. The rules below drive the
 * JS-controlled interaction states (sticky header, mobile menu, accordions)
 * and a few WordPress-specific bits.
 */

/* ---- Sticky header states ---- */
.site-header { transition: transform .3s ease; will-change: transform; }
.site-header.is-hidden { transform: translateY(-100%); }
.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

/* Offset page content so the fixed header never overlaps it. */
.site-content { padding-top: var(--cb-header-offset, 96px); }
body.home .site-content,
body.elementor-page .site-content { padding-top: 0; }

/* ---- Mega menu ---- */
[data-megamenu] { opacity: 0; transform: translateY(-.5rem); pointer-events: none; transition: all .2s ease; }
[data-megamenu].is-open { opacity: 1; transform: translateY(0); pointer-events: auto; }

/* ---- Mobile menu ---- */
[data-mobile-menu] { opacity: 0; pointer-events: none; transition: opacity .3s ease; }
[data-mobile-menu] .mobile-panel { transform: translateX(100%); transition: transform .3s ease; }
[data-mobile-menu].is-open { opacity: 1; pointer-events: auto; }
[data-mobile-menu].is-open .mobile-panel { transform: translateX(0); }
body.menu-open { overflow: hidden; }
[data-submenu] { display: none; }
[data-submenu].is-open { display: block; }
[data-submenu-toggle].is-open svg,
[data-megamenu-wrap].is-open .cb-chevron { transform: rotate(180deg); }

/* ---- Accordions ---- */
[data-accordion-item] [data-accordion-panel] { display: none; }
[data-accordion-item].is-open [data-accordion-panel] { display: block; }
[data-accordion-item].is-open .cb-accordion-chevron { transform: rotate(90deg); }

/* ---- FAQ filter pills ---- */
[data-faq-pill] { background: #ffffff; color: #6b5b4d; border: 1px solid rgba(120,90,60,0.14); box-shadow: 0 1px 2px rgba(30,20,10,0.04); }
[data-faq-pill]:hover { background: #FFF4E8; color: #F4933C; border-color: rgba(244,147,60,0.35); }
[data-faq-pill].is-active { background: #F4933C; color: #fff; border-color: #F4933C; box-shadow: 0 14px 40px -12px rgba(236,122,27,0.35); }

/* ---- Supplemental utilities used by PHP templates ---- */
/* (These arbitrary-value classes were not present in the original React
   source, so they are defined here to guarantee correct rendering.) */
.aspect-\[16\/10\] { aspect-ratio: 16 / 10; }
.aspect-\[4\/3\]   { aspect-ratio: 4 / 3; }
.top-28            { top: 7rem; }
.min-h-\[520px\]   { min-height: 520px; }
.line-clamp-3 {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.cb-footer-menu { list-style: none; margin: 0; padding: 0; }
.cb-footer-menu li { margin-bottom: .625rem; }

/* Prose/readability defaults for the_content() output. */
.cb-prose { color: #374151; line-height: 1.75; }
.cb-prose h2 { font-size: 1.75rem; margin: 1.75rem 0 .75rem; color: var(--color-dark); }
.cb-prose h3 { font-size: 1.35rem; margin: 1.5rem 0 .5rem; color: var(--color-dark); }
.cb-prose p { margin: 0 0 1.15rem; }
.cb-prose ul { list-style: disc; padding-left: 1.4rem; margin: 0 0 1.15rem; }
.cb-prose ol { list-style: decimal; padding-left: 1.4rem; margin: 0 0 1.15rem; }
.cb-prose li { margin-bottom: .4rem; }
.cb-prose a { color: var(--color-primary-600); text-decoration: underline; }
.cb-prose img { border-radius: 1rem; height: auto; max-width: 100%; }
.cb-prose blockquote { border-left: 4px solid var(--color-primary-400); padding-left: 1.25rem; font-style: italic; color: #4b5563; margin: 1.5rem 0; }

/* Non-sticky header: remove the fixed-header offset. */
body.cb-static-header .site-content { padding-top: 0; }

/* ---- WordPress core / WooCommerce basics ---- */
.wp-block-image img { height: auto; max-width: 100%; }
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}
.sticky, .gallery-caption, .bypostauthor { display: block; }
.alignwide { max-width: 1100px; }
.alignfull { max-width: 100%; }

