/*
Theme Name: PromptAnalytics Research
Theme URI: 
Author: Expert WordPress Architect
Description: A modern, responsive WordPress theme for the AI Prompting 2026 Research Report.
Version: 1.0
Requires at least: 5.8
Tested up to: 6.4
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

/* Base Styles */
body {
    font-family: 'Inter', sans-serif;
    scroll-behavior: smooth;
    background-color: #fafaf9; /* stone-50 */
    color: #292524; /* stone-900 */
}

/* Typography Customizations */
.code-font {
    font-family: 'JetBrains Mono', monospace;
}

/* Interactive Components */
.interactive-btn {
    transition: all 0.3s ease;
}

.interactive-btn.active {
    background-color: #d97706; /* amber-600 */
    color: white;
    border-color: #d97706;
    box-shadow: 0 4px 12px rgba(217, 119, 6, 0.2);
}

.tab-btn {
    transition: all 0.3s ease;
}

.tab-btn.active {
    border-bottom: 3px solid #0d9488; /* teal-600 */
    color: #0d9488;
    font-weight: 700;
}

/* UI Helpers */
.glass {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.card-shadow {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.hide {
    display: none !important;
}

/* Charts Container Constraint */
.chart-container {
    position: relative;
    width: 100%;
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
    height: 350px;
    max-height: 400px;
}

/* Custom Scrollbar specifically for horizontal tab areas */
.hide-scrollbar::-webkit-scrollbar {
    display: none;
}
.hide-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none;    /* Firefox */
}

/* WP Core Alignment Classes (Standard WordPress inclusions) */
.aligncenter { display: block; margin: 0 auto; clear: both; }
.alignleft { float: left; margin: 0 1.5em 1.5em 0; }
.alignright { float: right; margin: 0 0 1.5em 1.5em; }
img { max-width: 100%; height: auto; }

/* Mobile-First: Chart Responsiveness */
@media (max-width: 640px) {
    .chart-container {
        height: 250px;
        max-height: 280px;
    }
}

/* Hamburger Menu Animation */
#mobile-menu-btn.active .hamburger-line:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}
#mobile-menu-btn.active .hamburger-line:nth-child(2) {
    opacity: 0;
}
#mobile-menu-btn.active .hamburger-line:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
}