/*
Theme Name: The Branded Coconut
Theme URI: https://thebrandedcoconut.com.au
Author: The Branded Coconut
Author URI: https://thebrandedcoconut.com.au
Description: Custom WordPress theme for The Branded Coconut - custom branded fresh coconuts for Sydney hotels, restaurants, weddings and events. Converted from the original Lovable-built site.
Version: 2.6.1
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: branded-coconut
*/

/* This file intentionally left minimal — all design tokens and utility
   classes ship in assets/css/tailwind-compiled.css (enqueued in
   functions.php) so the original site's compiled Tailwind output can be
   reused as-is. Only small WP-specific additions live below. */

/* WP core alignment helpers, kept minimal since this theme is single-column marketing content */
.alignwide { margin-left: 0; margin-right: 0; }
.alignfull { width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }
.screen-reader-text { position: absolute !important; clip: rect(1px,1px,1px,1px); overflow: hidden; height: 1px; width: 1px; word-wrap: normal !important; }
.screen-reader-text:focus { background:#fff; color:#000; display:block; height:auto; padding:15px 23px 14px; left:5px; top:5px; width:auto; z-index:100000; }

/* Skip link */
.skip-link { position:absolute; left:-9999px; top:0; z-index:999999; background:var(--forest,#4B6441); color:var(--cream,#FDFBF5); padding:1rem 1.5rem; border-radius:0 0 .5rem 0; }
.skip-link:focus { left:0; }

/* Make full-screen hero media fill the hero on narrow screens too. */
#top > img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 1023px) {
    #top { min-height: 0; }
    #top > picture { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
    #top > picture > img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
}

/* Header scrolled state (added by JS once the page scrolls) */
header.site-header.is-scrolled {
    background-color: color-mix(in oklab, var(--forest) 94%, transparent);
    backdrop-filter: blur(6px);
    box-shadow: 0 10px 30px -18px rgba(0,0,0,.6);
}

/* Hide legacy category badges in Elementor-imported blog cards. */
article span[class~="bg-sky/20"] { display: none; }

/* Keep single-post titles clear of the fixed navigation. */
.tbc-blog-hero { padding-top: 10rem; padding-bottom: 4rem; }
@media (min-width: 640px) {
    .tbc-blog-hero { padding-top: 11rem; padding-bottom: 5rem; }
}

/* Improve readability for single-post content when prose utilities are unavailable. */
body.single-post article.prose p { font-size: 1.125rem; line-height: 1.8; }
body.single-post article.prose h2 { font-size: 1.75rem; line-height: 1.25; }
body.single-post article.prose h3 { font-size: 1.4rem; line-height: 1.3; }

/* Keep FAQ and legal-page titles clear of the fixed navigation. */
.tbc-legal-hero { padding-top: 10rem; padding-bottom: 4rem; }
@media (min-width: 640px) {
    .tbc-legal-hero { padding-top: 11rem; padding-bottom: 5rem; }
}

/* Lightbox for gallery */
.tbc-lightbox { position:fixed; inset:0; z-index:9999; background:rgba(27,27,27,.92); display:flex; align-items:center; justify-content:center; padding:2rem; }
.tbc-lightbox[hidden] { display:none; }
.tbc-lightbox img { max-width:100%; max-height:90vh; border-radius:1rem; box-shadow:0 25px 60px -20px rgba(0,0,0,.8); }
.tbc-lightbox-close { position:absolute; top:1.5rem; right:1.5rem; background:var(--cream); color:var(--brown); border:none; border-radius:999px; width:44px; height:44px; display:grid; place-items:center; cursor:pointer; }

/* Conditional enquiry fields (shown via JS when reason matches) */
.tbc-form-group--event,
.tbc-form-group--resale,
[data-tbc-group="event"],
[data-tbc-group="resale"] { display: none; }

/* Elementor + imported HTML: never hide content behind scroll-reveal */
.elementor-page .reveal,
.elementor-editor-active .reveal,
.elementor-editor-preview .reveal {
	opacity: 1 !important;
	transform: none !important;
}
