/**
 * Theme Name:       FA Creative Firm Ltd Theme
 * Theme URI:        https://facreative.biz/
 * Author:           FA Creative Firm Ltd Team
 * Author URI:       https://facreative.biz/
 * Description:      Professional Hello Elementor child theme with optimized PHP 7.4+ support, advanced social media sharing, and custom Elementor widgets. Lightweight, fast, and fully customizable for modern WordPress sites.
 * Template:         hello-elementor
 * Text Domain:      fa-creative-firm-ltd-theme
 * Domain Path:      /languages
 * Version:          26.01.02
 * Requires PHP:     7.4
 * Requires at least: 5.8
 * License:          GNU General Public License v3 or later
 * License URI:      https://www.gnu.org/licenses/gpl-3.0.html
 * Tags:             hello-elementor-child, elementor, lightweight, responsive, custom-widgets
 * GitHub Theme URI: https://github.com/facreative/fa-creative-firm-ltd-theme
 * GitHub Branch:    main
 */

/* Import parent theme styles */
@import url('../hello-elementor/style.css');

/* ========================================
   THEME VARIABLES & RESET
   ======================================== */

:root {
	--fa-primary-color: #0066cc;
	--fa-secondary-color: #333333;
	--fa-accent-color: #ff6600;
	--fa-light-gray: #f5f5f5;
	--fa-border-color: #e0e0e0;
	--fa-transition: all 0.3s ease;
}

* {
	box-sizing: border-box;
}

/* ========================================
   BASE STYLES
   ======================================== */

html {
	scroll-behavior: smooth;
}

body {
	line-height: 1.6;
	color: var(--fa-secondary-color);
	background-color: #ffffff;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', sans-serif;
}

/* ========================================
   TYPOGRAPHY
   ======================================== */

h1, h2, h3, h4, h5, h6 {
	line-height: 1.3;
	margin: 0.5em 0;
	font-weight: 600;
}

h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }

p {
	margin: 0 0 1em 0;
}

a {
	color: var(--fa-primary-color);
	text-decoration: none;
	transition: var(--fa-transition);
}

a:hover {
	color: var(--fa-accent-color);
}

/* ========================================
   ELEMENTOR OVERRIDES
   ======================================== */

.elementor-widget-container {
	padding: 0;
}

.elementor-widget-title {
	margin-bottom: 20px;
}

/* Elementor button styles */
.elementor-button {
	border-radius: 4px;
	transition: var(--fa-transition);
}

.elementor-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ========================================
   CUSTOM WIDGETS
   ======================================== */

/* FA Pro Copyright Widget */
.fa-copyright-wrapper {
	padding: 20px 0;
	font-size: 0.95rem;
	word-spacing: 2px;
}

.fa-copyright-wrapper a {
	color: var(--fa-primary-color);
	font-weight: 500;
}

.fa-copyright-wrapper a:hover {
	color: var(--fa-accent-color);
	text-decoration: underline;
}

.copyright-text {
	margin: 0 4px;
}

.separator {
	margin: 0 8px;
	opacity: 0.5;
}

/* ========================================
   RESPONSIVE DESIGN
   ======================================== */

/* Tablets (768px and down) */
@media (max-width: 768px) {
	h1 { font-size: 2rem; }
	h2 { font-size: 1.75rem; }
	h3 { font-size: 1.5rem; }
	h4 { font-size: 1.25rem; }
	h5 { font-size: 1.1rem; }
	h6 { font-size: 1rem; }

	.fa-copyright-wrapper {
		font-size: 0.9rem;
		word-spacing: 1px;
	}
}

/* Mobile (480px and down) */
@media (max-width: 480px) {
	h1 { font-size: 1.5rem; }
	h2 { font-size: 1.25rem; }
	h3 { font-size: 1.1rem; }
	h4 { font-size: 1rem; }
	h5 { font-size: 0.95rem; }
	h6 { font-size: 0.9rem; }

	.separator {
		display: none;
	}

	.fa-copyright-wrapper {
		font-size: 0.85rem;
		padding: 15px 0;
	}
}

/* ========================================
   ACCESSIBILITY
   ======================================== */

/* Focus states for keyboard navigation */
button:focus,
a:focus,
input:focus,
select:focus,
textarea:focus {
	outline: 2px solid var(--fa-primary-color);
	outline-offset: 2px;
}

/* Skip to content link */
.skip-to-content {
	position: absolute;
	top: -40px;
	left: 0;
	background: var(--fa-primary-color);
	color: white;
	padding: 8px;
	text-decoration: none;
	z-index: 100;
}

.skip-to-content:focus {
	top: 0;
}

/* ========================================
   PRINT STYLES
   ======================================== */

@media print {
	body {
		background: white;
	}

	a {
		text-decoration: underline;
	}

	.no-print,
	.elementor-widget-nav-menu,
	.hfe-header,
	.hfe-footer {
		display: none !important;
	}
}

/* ========================================
   ANIMATIONS
   ======================================== */

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.animated-element {
	animation: fadeIn 0.6s ease-out;
}

/* ========================================
   UTILITIES
   ======================================== */

.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }

.p-0 { padding: 0; }
.p-1 { padding: 0.5rem; }
.p-2 { padding: 1rem; }
.p-3 { padding: 1.5rem; }
.p-4 { padding: 2rem; }

.hidden { display: none !important; }
.visible { display: block !important; }
