/*
Theme Name: Top Delivery
Theme URI: https://www.qlegy.com
Author: Qlegy
Author URI: https://www.qlegy.com
Description: Professional WordPress theme for Top Delivery with 10 custom Elementor widgets. Built by Qlegy - your partner in digital solutions. Features custom widgets for delivery services, driver recruitment, and fleet management. Full RTL Arabic support, responsive design, and modern UI components.
Version: 1.0.0
Requires at least: 6.0
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: top-delivery
Tags: rtl-language-support, custom-elementor-widgets, arabic, delivery, recruitment, qlegy, business

Top Delivery WordPress Theme, © 2024 Qlegy (www.qlegy.com)
Developed by Qlegy for Top Delivery
*/

/* Import Google Fonts - Arabic fonts */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&family=Cairo:wght@600;700;800;900&display=swap');

/* CSS Variables - Design System */
:root {
  /* Colors */
  --td-primary: #f59f0b;
  --td-primary-dark: #d97706;
  --td-primary-foreground: #ffffff;
  --td-secondary: #1e293b;
  --td-secondary-foreground: #ffffff;
  
  --td-background: #fcfcfc;
  --td-foreground: #1e293b;
  --td-card: #ffffff;
  --td-card-foreground: #1e293b;
  
  --td-muted: #f5f5f5;
  --td-muted-foreground: #64748b;
  --td-accent: #fef3c7;
  --td-accent-foreground: #f59f0b;
  
  --td-border: #e5e7eb;
  --td-input: #f1f5f9;
  
  /* Typography */
  --td-font-sans: 'Tajawal', system-ui, sans-serif;
  --td-font-display: 'Cairo', 'Tajawal', sans-serif;
  
  /* Radius */
  --td-radius: 1rem;
  --td-radius-sm: 0.75rem;
  --td-radius-md: 0.875rem;
  --td-radius-lg: 1rem;
  --td-radius-xl: 1.25rem;
  --td-radius-2xl: 1.5rem;
  --td-radius-3xl: 2rem;
  
  /* Shadows */
  --td-shadow-soft: 0 4px 20px -4px rgba(0, 0, 0, 0.08);
  --td-shadow-elevated: 0 20px 50px -12px rgba(245, 159, 11, 0.25);
  --td-shadow-glow: 0 0 60px -10px rgba(245, 159, 11, 0.45);
  
  /* Gradients */
  --td-gradient-primary: linear-gradient(135deg, #fbbf24 0%, #f59f0b 100%);
  --td-gradient-dark: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
  --td-gradient-hero: linear-gradient(120deg, rgba(30, 41, 59, 0.85) 0%, rgba(30, 41, 59, 0.55) 60%, rgba(245, 159, 11, 0.35) 100%);
}

/* Dark Mode */
.dark {
  --td-background: #0f172a;
  --td-foreground: #f8fafc;
  --td-card: #1e293b;
  --td-card-foreground: #f8fafc;
  --td-muted: #1e293b;
  --td-muted-foreground: #94a3b8;
  --td-border: rgba(255, 255, 255, 0.08);
  --td-input: rgba(255, 255, 255, 0.12);
}

/* Base Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--td-background);
  color: var(--td-foreground);
  font-family: var(--td-font-sans);
  font-feature-settings: "ss01", "kern";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  direction: rtl;
  text-align: right;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--td-font-display);
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

h1 { font-size: clamp(2rem, 5vw, 4rem); }
h2 { font-size: clamp(1.75rem, 4vw, 3rem); }
h3 { font-size: clamp(1.5rem, 3vw, 2rem); }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1.125rem; }

p {
  line-height: 1.75;
}

a {
  text-decoration: none;
  color: inherit;
  transition: all 0.3s ease;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Container */
.container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (min-width: 768px) {
  .container {
    padding: 0 2rem;
  }
}

/* Utility Classes */
.bg-gradient-primary {
  background: var(--td-gradient-primary);
}

.bg-gradient-dark {
  background: var(--td-gradient-dark);
}

.bg-gradient-hero {
  background: var(--td-gradient-hero);
}

.shadow-soft {
  box-shadow: var(--td-shadow-soft);
}

.shadow-elevated {
  box-shadow: var(--td-shadow-elevated);
}

.shadow-glow {
  box-shadow: var(--td-shadow-glow);
}

.text-balance {
  text-wrap: balance;
}

/* Animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in-up {
  animation: fadeInUp 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(100%);
  }
}

.animate-marquee {
  animation: marquee 40s linear infinite;
}

/* RTL Fixes */
[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select {
  text-align: right;
}

/* WordPress Core Compatibility */
.alignnone {
  margin: 1.5em 1.5em 1.5em 0;
}

.aligncenter,
div.aligncenter {
  display: block;
  margin: 1.5em auto;
}

.alignright {
  float: left;
  margin: 0.5em 1.5em 0.5em 0;
}

.alignleft {
  float: right;
  margin: 0.5em 0 0.5em 1.5em;
}

.wp-caption {
  max-width: 100%;
}

.wp-caption-text {
  text-align: center;
  margin-top: 0.5em;
  font-size: 0.875em;
  color: var(--td-muted-foreground);
}

.gallery-caption {
  display: block;
}

/* Screen Reader Text */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  right: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}