/*
Theme Name: StrongBody Theme
Theme URI: https://github.com/strongbody-team/strongbody-theme
Description: A modern, responsive WordPress theme for fitness and gym businesses. Built with performance and user experience in mind. Features include custom post types for services and testimonials, modular component system, responsive design, and comprehensive customization options.
Author: StrongBody Team
Author URI: https://strongbody.com
Version: 2.0.1
Requires at least: 5.0
Tested up to: 6.4
Requires PHP: 7.4
Text Domain: strongbody-theme
Domain Path: /languages
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: fitness, gym, sports, responsive, custom-header, custom-logo, custom-menu, featured-images, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, two-columns, left-sidebar, right-sidebar, custom-colors, custom-background, editor-style, wide-blocks

StrongBody Theme, Copyright 2025 StrongBody Team
StrongBody Theme is distributed under the terms of the GNU GPL

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 2 of the GNU General Public License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR ANY PARTICULAR PURPOSE. See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/

/* 
 * THEME-SPECIFIC STYLES - StrongBody Theme
 * 
 * This file contains theme-specific styles that complement:
 * - modern-base.css (CSS variables và base styles)
 * - responsive.css (responsive utilities)
 * - sections/*.css (individual section styles)
 * 
 * Loaded via enqueue-scripts.php after modern-base.css
 */

/* ===================================
   THEME-SPECIFIC STYLES - StrongBody Theme
   =================================== */

/* Header Styles - Theme specific */
.site-header {
    background: var(--bg-primary);
    box-shadow: var(--shadow-md);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    padding: var(--spacing-sm) 0;
}

.header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--spacing-md);
}

.header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.header-logo {
    flex-shrink: 0;
}

.header-navigation {
    flex: 1;
    display: flex;
    justify-content: center;
}

/* Main navigation - visible by default on desktop */
.main-navigation {
    display: block;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-shrink: 0;
}

.site-logo {
    font-size: var(--text-2xl);
    font-weight: bold;
    color: var(--primary-color);
    text-decoration: none;
    display: flex;
    align-items: center;
}

.site-logo-img {
    max-height: 45px;
    width: auto;
    transition: transform var(--transition-normal);
}

.site-logo:hover .site-logo-img {
    transform: scale(1.05);
}

.logo-text {
    font-size: var(--text-2xl);
    font-weight: bold;
    color: var(--primary-color);
}

.site-logo::before {
    content: "";
    margin-right: var(--spacing-sm);
    font-size: var(--text-3xl);
}

/* Hide emoji when we have logo image */
.site-logo:has(.site-logo-img)::before {
    display: none;
}

.main-navigation .nav-menu-wrapper {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.main-navigation ul {
    display: flex;
    align-items: center;
    list-style: none;
    gap: var(--spacing-xl);
    margin: 0;
    padding: 0;
}

/* Navigation search item styling */
.main-navigation .menu-item-search {
    display: flex;
    align-items: center;
}

.main-navigation a {
    text-decoration: none;
    color: var(--text-primary);
    font-weight: 500;
    transition: color var(--transition-normal);
}

.main-navigation a:hover {
    color: var(--primary-color);
}

.cta-button {
    background: var(--primary-color);
    color: var(--text-light);
    padding: var(--spacing-sm) var(--spacing-md);
    border: none;
    border-radius: var(--radius-2xl);
    font-weight: 600;
    text-decoration: none;
    transition: background var(--transition-normal);
    cursor: pointer;
}

.cta-button:hover {
    background: var(--primary-dark);
    color: var(--text-light);
}

/* Main Content */
.site-main {
    /* margin-top: 80px; */
}

/* Hero Section - Đã chuyển sang assets/css/sections/hero-section.css */

/* Stats Section - Đã chuyển sang assets/css/sections/stats-section.css */

/* Mission Section - Đã chuyển sang assets/css/sections/mission-section.css */

/* Culture Section - Đã chuyển sang assets/css/sections/culture-section.css */

/* Testimonials Section - Đã chuyển sang assets/css/sections/testimonials-section.css */

/* CTA Section - Đã chuyển sang assets/css/sections/cta-section.css */

/* FAQ Section - Đã chuyển sang assets/css/sections/faq-section.css */

/* Footer - Đã chuyển sang assets/css/components/footer-layout.css */

/* Blog Section - Đã chuyển sang assets/css/components/blog-page.css */

/* Blog Section - Đã chuyển sang assets/css/components/blog-page.css */

/* Smooth Scrolling & Navigation - Theme specific */
html {
    scroll-behavior: smooth;
}

/* Active navigation link highlighting */
.nav-menu a.active {
    color: var(--primary-color);
    position: relative;
}

.nav-menu a.active::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--primary-color);
    border-radius: 1px;
}

/* Section padding adjustments for fixed header */
section {
    scroll-margin-top: 80px;
}

/* Smooth transitions for navigation */
.nav-menu a {
    transition: color var(--transition-normal), transform var(--transition-fast);
}

.nav-menu a:hover {
    color: var(--primary-color);
    transform: translateY(-1px);
}

/* Mobile Menu Toggle - Đã chuyển sang assets/css/components/mobile-menu-toggle.css */