/**
 * GagsShop.com Theme
 * Colors: Red/Orange, Yellow (Bright Energetic)
 * Primary: Orange-Red #FF4500
 * Secondary: Yellow #FCD34D
 * Accent: Bright Orange #FB923C
 */

:root {
    --theme-primary: #FF4500;
    --theme-primary-rgb: 255, 69, 0;
    --theme-primary-dark: #DC2626;
    --theme-primary-light: #FB923C;

    --theme-secondary: #FCD34D;
    --theme-secondary-dark: #FBBF24;
    --theme-secondary-light: #FDE68A;

    --theme-accent: #FB923C;
    --theme-accent-dark: #F97316;
    --theme-accent-light: #FDBA74;

    --theme-gradient-start: #FF4500;
    --theme-gradient-end: #FCD34D;
}

/* Header Navigation - Override Tailwind classes with !important */
header {
    background: linear-gradient(135deg, var(--theme-primary), var(--theme-accent)) !important;
}

/* Page Header (breadcrumb section) - Override Tailwind classes with !important */
.page-header {
    background: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary)) !important;
}

/* Buy Buttons */
.btn-buy {
    background: linear-gradient(to right, var(--theme-primary), var(--theme-secondary)) !important;
    color: #000;
}

.btn-buy:hover {
    background: linear-gradient(to right, var(--theme-primary-dark), var(--theme-secondary-dark)) !important;
}

/* Category Badges */
.category-badge {
    background: linear-gradient(to right, var(--theme-primary), var(--theme-accent));
}

/* Links - Add subtle theme color on hover */
a:hover {
    color: var(--theme-primary);
}

/* Navigation Links */
nav a:hover,
#mobile-menu a:hover {
    color: var(--theme-primary) !important;
}

/* Featured Card */
.featured-card {
    border-color: var(--theme-primary);
}

/* Product Cards Hover - Enhanced with prominent border and glow */
.product-card {
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.product-card:hover {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 20px rgba(var(--theme-primary-rgb), 0.5), 0 4px 12px rgba(var(--theme-primary-rgb), 0.3) !important;
    transform: translateY(-2px);
}

/* Stats Boxes - Apply theme colors */
.stat-box {
    border-color: var(--theme-primary) !important;
}

/* Category Pills/Tags */
.bg-yellow-100 {
    background-color: var(--theme-secondary-light) !important;
}

.bg-green-100 {
    background-color: var(--theme-accent-light) !important;
}

/* Footer accent color */
footer a:hover {
    color: var(--theme-primary) !important;
}

/* Product Image Hover Tooltip */
.group:hover .bg-gradient-to-r.from-yellow-400.to-green-400 {
    background: linear-gradient(to right, var(--theme-primary), var(--theme-accent)) !important;
}

/* Featured Item Section */
.bg-gradient-to-br.from-yellow-50.via-green-50.to-yellow-100 {
    background: linear-gradient(to bottom right, var(--theme-primary-light), var(--theme-accent-light), var(--theme-primary-light)) !important;
}

.border-yellow-400,
.border-2.border-yellow-400 {
    border-color: var(--theme-primary) !important;
}

.bg-yellow-400 {
    background-color: var(--theme-primary) !important;
}

/* Page Headers - All Categories, New Pranks */
.bg-gradient-to-r.from-yellow-400.via-green-400.to-yellow-400 {
    background: linear-gradient(to right, var(--theme-primary), var(--theme-accent), var(--theme-primary)) !important;
}

/* Search Button */
.bg-yellow-400.hover\:bg-yellow-500:hover {
    background-color: var(--theme-primary-dark) !important;
}

/* Text Colors */
.text-yellow-300 {
    color: var(--theme-primary-light) !important;
}

.text-yellow-500 {
    color: var(--theme-primary) !important;
}

.text-yellow-600 {
    color: var(--theme-primary-dark) !important;
}

.hover\:text-yellow-300:hover {
    color: var(--theme-primary-light) !important;
}

.hover\:text-yellow-500:hover {
    color: var(--theme-primary) !important;
}

.hover\:text-yellow-600:hover {
    color: var(--theme-primary-dark) !important;
}

/* Focus States */
.focus\:border-yellow-500:focus {
    border-color: var(--theme-primary) !important;
}

/* Stats Box - Bought Today */
.bg-gradient-to-r.from-green-500.to-green-600 {
    background: linear-gradient(to right, var(--theme-accent), var(--theme-accent-dark)) !important;
}

/* Product Description Box */
.bg-green-50 {
    background-color: var(--theme-accent-light) !important;
}

.border-green-200 {
    border-color: var(--theme-accent) !important;
}

/* Background Variations */
.from-yellow-50 {
    --tw-gradient-from: var(--theme-primary-light) !important;
}

.to-green-50 {
    --tw-gradient-to: var(--theme-accent-light) !important;
}

/* Header Stat Boxes - Border and Hover Animation */
.header-stat-box {
    border: 2px solid rgba(255, 255, 255, 0.3);
    transition: all 0.3s ease;
}

.header-stat-box:hover {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 15px rgba(var(--theme-primary-rgb), 0.6), 0 4px 8px rgba(var(--theme-primary-rgb), 0.4) !important;
    transform: translateY(-4px);
}

/* Search Input Hover/Focus Effects */
.search-input:hover {
    border-color: var(--theme-primary) !important;
}

.search-input:focus {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--theme-primary-rgb), 0.2) !important;
}

/* Category Filter Dropdown Hover/Focus Effects */
.category-filter:hover {
    border-color: var(--theme-primary) !important;
}

.category-filter:focus {
    border-color: var(--theme-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--theme-primary-rgb), 0.2) !important;
}