/*
Theme Name:   Raft Child - OnlyStudio
Theme URI:    https://onlystudio.ro
Description:  Temă child pentru Raft cu sistem CSS modular DRY
Author:       OnlyStudio
Author URI:   https://onlystudio.ro
Template:     raft
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  raft-child
*/

/**
 * ═══════════════════════════════════════════════════════════
 * OnlyStudio - Custom Styles (Modular System)
 * ═══════════════════════════════════════════════════════════
 *
 * 📁 STRUCTURĂ MODULARĂ:
 * ├── css/
 * │   ├── _fonts.css          → Declarații @font-face pentru fonturi custom
 * │   ├── _variables.css      → Culori, spacing, fonts, breakpoints
 * │   ├── _animations.css     → Animații reusabile (fadeUp, fadeIn, etc.)
 * │   ├── _components.css     → Componente UI (buttons, icons, cards)
 * │   ├── _utilities.css      → Helper classes (m-*, p-*, text-*, etc.)
 * │   ├── _navigation.css     → Navigation menu (header)
 * │   ├── _footer.css         → Footer section
 * │   ├── _responsive.css     → Media queries consolidate
 * │   └── pages/
 * │       ├── fonts/          → Fișiere font (.ttf)
 * │       ├── homepage.css    → Homepage sections (hero, stats, CTA)
 * │       ├── thank-you.css   → Stiluri specifice Thank You page
 * │       └── venituri.css    → Stiluri specifice pagina Venituri
 * └── style.css               → Fișier principal (acest fișier)
 *
 * 📚 DOCUMENTAȚIE:
 * Pentru detalii despre cum să folosești sistemul, vezi:
 * - README-CSS-SYSTEM.md (ghid complet)
 * - Comentariile din fiecare fișier CSS
 *
 * ═══════════════════════════════════════════════════════════
 */


/* ═══════════════════════════════════════════════════════════
   IMPORT MODULES - Ordine importantă!
   ═══════════════════════════════════════════════════════════ */

/**
 * 1. Fonts - Trebuie încărcat primul!
 * Declarații @font-face pentru fonturile custom
 */

/**
 * 2. Variables
 * Definește toate variabilele CSS folosite în restul fișierelor
 */
@import url('./css/_variables.css');

/**
 * 3. Animations - Animații reusabile
 * Definește @keyframes și clase de animație
 */
@import url('./css/_animations.css');

/**
 * 4. Components - Componente UI reusabile
 * Butoane, iconițe, carduri, logo, dividers, steps
 */
@import url('./css/_components.css');

/**
 * 5. Utilities - Helper classes
 * Spacing (m-*, p-*), typography, layout, display
 */
@import url('./css/_utilities.css');

/**
 * 6. Navigation - Header menu
 * Stiluri pentru meniul de navigare
 */
@import url('./css/_navigation.css');

/**
 * 7. Footer - Site footer
 * Stiluri pentru footer
 */
@import url('./css/_footer.css');

/**
 * 8. Responsive - Media queries consolidate
 * Toate breakpoint-urile într-un singur loc
 */
@import url('./css/_responsive.css');

/**
 * 9. Pages - Stiluri specifice paginilor
 * Încarcă doar paginile necesare
 */
@import url('./css/pages/homepage.css');
@import url('./css/pages/thank-you.css');
@import url('./css/pages/venituri.css');


/* ═══════════════════════════════════════════════════════════
   BACKWARD COMPATIBILITY
   Legacy classes pentru compatibilitate cu codul existent
   ═══════════════════════════════════════════════════════════ */

/**
 * WhatsApp Buttons - Aliasuri pentru clasele noi
 * Păstrează clasele vechi pentru backward compatibility
 */

/* Buton WhatsApp inline */
.onlystudio-whatsapp-btn {
  background: var(--color-whatsapp);
  border-color: var(--color-whatsapp);
  color: var(--color-white);
  display: inline-block;
  padding: var(--space-px-14) var(--space-px-28);
  border-radius: var(--radius-full);
  font-family: var(--font-sans);
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-tight);
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: var(--transition-all);
  border: var(--border-width) solid transparent;
}

.onlystudio-whatsapp-btn:hover {
  background: var(--color-whatsapp-dark);
  border-color: var(--color-whatsapp-dark);
  transform: scale(1.05);
}

/* Buton WhatsApp flotant (alias pentru .whatsapp-float) */
.onlystudio-whatsapp-floating {
  position: fixed;
  bottom: var(--space-px-20);
  right: var(--space-px-20);
  width: 60px;
  height: 60px;
  background: var(--color-whatsapp);
  border-radius: var(--radius-circle);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-lg);
  z-index: var(--z-fixed);
  transition: var(--transition-all);
}

.onlystudio-whatsapp-floating:hover {
  background: var(--color-whatsapp-dark);
  transform: scale(1.1);
}