/*
Theme Name: VoltVape Informational Theme
Theme URI: https://example.com/voltvape-theme
Author: Your Studio
Author URI: https://example.com
Description: A modern, SEO-optimized, fully responsive informational WordPress theme for a single vape brand. Includes category-driven content architecture, dynamic latest-post queries, schema markup, and a native lead-capture form. Not an eCommerce theme.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: voltvape
Tags: blog, news, custom-menu, featured-images, full-width-template, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

-----------------------------------------------------------------------------
IMPORTANT — TAILWIND CSS BUILD
-----------------------------------------------------------------------------
This file intentionally does NOT contain the full compiled Tailwind output
inline (Tailwind's generated CSS for a real project is large and should be
built via the CLI against your actual templates so unused classes are
purged). Two ways to get the compiled CSS this theme expects at
assets/css/style.css:

1. RECOMMENDED — Build it yourself:
   npm install -D tailwindcss
   npx tailwindcss init
   // tailwind.config.js -> content: ["./**/*.php"]
   npx tailwindcss -i ./assets/css/tailwind-input.css -o ./assets/css/style.css --minify

2. QUICK START (development only) — swap the wp_enqueue_style() call in
   functions.php for the Tailwind Play CDN script in header.php:
   <script src="https://cdn.tailwindcss.com"></script>
   This is NOT recommended for production (no purging, larger payload,
   runtime compilation), but is useful to preview the theme immediately.

Below are the small custom rules that sit OUTSIDE Tailwind's utility
classes (accordion behavior, line-clamping fallback, focus rings, print
styles) — these load regardless of which Tailwind build method you use.
-----------------------------------------------------------------------------
*/

/* FAQ accordion panel toggle (paired with assets/js/main.js) */
.vv-faq-panel.hidden { display: none; }
.vv-faq-trigger[aria-expanded="true"] svg { transform: rotate(180deg); }

/* Mobile menu / search panel toggle states */
#mobile-menu.hidden,
#search-panel.hidden,
#vv-search-results.hidden { display: none; }

/* Smooth scroll for in-page anchors (e.g. skip link, FAQ) */
html { scroll-behavior: smooth; }

/* Respect reduced motion preference sitewide */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* Visible keyboard focus ring (accessibility) */
a:focus-visible,
button:focus-visible,
input:focus-visible {
	outline: 2px solid #16a34a;
	outline-offset: 2px;
}

/* Lazy-loaded image fade-in */
img[loading="lazy"] {
	background-color: #f3f4f6;
}

/* Print styles: hide nav/footer chrome */
@media print {
	header, footer, #vv-faq-cta { display: none !important; }
}
