/**
 * theron-brand-patch.css — aurelio travels (Pvt) Ltd
 * ============================================================
 * Load this AFTER main.css and all template CSS files.
 * Overrides any inherited blue gradient variables and buttons
 * to match the aurelio travels brand color system:
 *
 *   Fire orange: #e8600a  — primary CTA / active states
 *   Deep navy:   #0b1535  — backgrounds / base
 *   Teal cyan:   #2dd4bf  — secondary accent / icons
 * ============================================================
 */

/* ── RE-MAP CORE GRADIENT VARIABLES ──────────────────────────
   main.css had these pointing to blue (#1e3a8a → #3b82f6).
   We remap them to Theron's fire orange gradient.
   All templates using var(--gradient-primary) will
   automatically inherit the correct brand color.
──────────────────────────────────────────────────────────── */
:root {
  --gradient-primary:  linear-gradient(135deg, #e8600a 0%, #f5793a 100%);
  --gradient-button:   linear-gradient(135deg, #e8600a 0%, #f5793a 100%);
  --gradient-hero:     linear-gradient(135deg, rgba(11,21,53,0.92) 0%, rgba(232,96,10,0.18) 100%);

  /* Fix glow shadows to orange */
  --shadow-gold:       0 8px 25px rgba(232, 96, 10, 0.35);
  --glow-gold:         0 0 20px rgba(232, 96, 10, 0.4);
  --glow-blue:         0 0 20px rgba(232, 96, 10, 0.3); /* repurpose to orange */

  /* Primary blue now maps to Theron navy */
  --primary-blue: #0b1535;
}

/* ── GLOBAL .btn-primary ──────────────────────────────────────
   Overrides the blue gradient on "View All Destinations",
   "View All Reviews", and any other .btn-primary buttons.
──────────────────────────────────────────────────────────── */
.btn-primary {
  background: #e8600a !important;
  background-color: #e8600a !important;
  border-color: #e8600a !important;
  color: #ffffff !important;
  box-shadow: 0 4px 20px rgba(232, 96, 10, 0.28) !important;
  border-radius: 50px;
  font-weight: 600;
  transition: all 0.35s cubic-bezier(0.23, 1, 0.32, 1);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background: #f5793a !important;
  background-color: #f5793a !important;
  border-color: #f5793a !important;
  color: #ffffff !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(232, 96, 10, 0.42) !important;
}

/* Also fix .btn-gold which was accidentally mapped to blue in main.css */
.btn-gold {
  background: linear-gradient(135deg, #e8600a 0%, #f5793a 100%) !important;
  border-color: #e8600a !important;
  color: #ffffff !important;
}
.btn-gold:hover {
  background: linear-gradient(135deg, #f5793a 0%, #fbbf24 100%) !important;
  box-shadow: 0 8px 28px rgba(232, 96, 10, 0.4) !important;
}

/* ── SECTION "VIEW ALL" BUTTONS ───────────────────────────────
   Specifically target the view-all / discover-all buttons
   used at the bottom of destinations and testimonials sections.
──────────────────────────────────────────────────────────── */
#destinations .btn-primary,
#testimonials .btn-primary,
#testimonials .btn,
#featuredPackages .btn-primary,
#featuredPackages .btn-lg {
  background: #e8600a !important;
  border-color: #e8600a !important;
  color: #ffffff !important;
  box-shadow: 0 4px 20px rgba(232, 96, 10, 0.28) !important;
}

#destinations .btn-primary:hover,
#testimonials .btn-primary:hover,
#testimonials .btn:hover,
#featuredPackages .btn-primary:hover,
#featuredPackages .btn-lg:hover {
  background: #f5793a !important;
  border-color: #f5793a !important;
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(232, 96, 10, 0.4) !important;
}

/* ── CAROUSEL CONTROLS ────────────────────────────────────────
   Some carousel control icons may inherit blue.
   Keep the gold border style but fix any blue backgrounds.
──────────────────────────────────────────────────────────── */
.carousel-control-prev:hover .control-icon,
.carousel-control-next:hover .control-icon,
.destinations-control:hover .control-icon,
.featured-control:hover .control-icon,
.testimonial-control:hover .control-icon {
  background-color: #e8600a !important;
  border-color: #e8600a !important;
  box-shadow: 0 6px 20px rgba(232, 96, 10, 0.35) !important;
}

/* ── FOOTER MAP LINK ──────────────────────────────────────────
   The "View on Google Maps" link default teal → orange on hover.
──────────────────────────────────────────────────────────── */
.office-map-link {
  color: #2dd4bf; /* teal default — ok as subtle link */
}
.office-map-link:hover {
  color: #e8600a !important;
}

/* ── SPINNER / LOADING STATES ─────────────────────────────── */
.spinner-border {
  color: #e8600a !important;
  border-color: rgba(232, 96, 10, 0.25) !important;
  border-top-color: #e8600a !important;
}

/* ── FOCUS OUTLINES ───────────────────────────────────────── */
.btn:focus-visible,
a:focus-visible {
  outline: 2px solid #e8600a;
  outline-offset: 3px;
}

/* ── DESTINATION CARD EXPLORE BUTTON ──────────────────────── */
.destination-card .btn-outline-primary {
  border-color: #e8600a !important;
  color: #e8600a !important;
}
.destination-card .btn-outline-primary:hover {
  background-color: #e8600a !important;
  border-color: #e8600a !important;
  color: #ffffff !important;
}