/*
Theme Name: RC Hobby Pro
Theme URI: https://example.com/rc-hobby-pro
Author: Your Name
Author URI: https://example.com
Description: Professional WordPress theme for RC hobby affiliate marketing. Modern design inspired by AMain Hobbies - the leading RC retailer.
Version: 4.0.0
Requires at least: 5.8
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rc-hobby-pro
Tags: e-commerce, blog, custom-menu, featured-images, threaded-comments, translation-ready

RC Hobby Pro - AMain Hobbies Inspired Style
*/

/* ===================================
   COLOR PALETTE - AMAIN HOBBIES STYLE
   =================================== */
:root {
  /* Primary Brand Colors - AMain Orange + Black */
  --primary-orange: #FF6600;
  --primary-orange-dark: #E55A00;
  --primary-orange-light: #FF8533;
  --primary-black: #000000;
  --primary-dark-gray: #1A1A1A;
  
  /* Secondary Colors */
  --secondary-red: #D32F2F;
  --secondary-green: #388E3C;
  --secondary-blue: #1976D2;
  --secondary-yellow: #FBC02D;
  
  /* Neutral Colors */
  --white: #FFFFFF;
  --off-white: #FAFAFA;
  --light-gray: #F5F5F5;
  --medium-gray: #E0E0E0;
  --gray: #9E9E9E;
  --dark-gray: #424242;
  --near-black: #212121;
  
  /* Text Colors */
  --text-primary: #212121;
  --text-secondary: #757575;
  --text-muted: #9E9E9E;
  --text-white: #FFFFFF;
  
  /* Backgrounds */
  --bg-white: #FFFFFF;
  --bg-light: #FAFAFA;
  --bg-gray: #F5F5F5;
  --bg-dark: #212121;
  
  /* Borders */
  --border-light: #EEEEEE;
  --border-medium: #E0E0E0;
  
  /* Status */
  --sale-red: #D32F2F;
  --new-green: #43A047;
  --free-shipping: #1976D2;
  
  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.1);
  --shadow-md: 0 2px 6px rgba(0,0,0,0.12);
  --shadow-lg: 0 4px 12px rgba(0,0,0,0.15);
  
  /* Transitions */
  --transition: 0.25s ease;
  
  /* Radius */
  --radius: 4px;
}

/* ===================================
   TYPOGRAPHY
   =================================== */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&family=Open+Sans:wght@400;600;700&display=swap');

body {
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-primary);
  background: var(--white);
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 1rem;
  color: var(--text-primary);
}

h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.1rem; }
h6 { font-size: 1rem; }

a {
  color: var(--secondary-blue);
  text-decoration: none;
  transition: var(--transition);
}

a:hover {
  color: var(--primary-orange);
}

/* ===================================
   LAYOUT
   =================================== */
* { box-sizing: border-box; }

.container {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 15px;
}

.container-fluid {
  width: 100%;
  padding: 0 15px;
}

section {
  padding: 3rem 0;
}

/* ===================================
   UTILITIES
   =================================== */
.text-center { text-align: center; }
.text-right { text-align: right; }
.d-flex { display: flex; }
.justify-between { justify-content: space-between; }
.align-center { align-items: center; }
.mt-2 { margin-top: 2rem; }
.mb-2 { margin-bottom: 2rem; }

/* ===================================
   RESPONSIVE
   =================================== */
@media (max-width: 768px) {
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.5rem; }
  section { padding: 2rem 0; }
}