/* Global Font & Direction Rules */
[dir="rtl"], [dir="rtl"] *, body.rtl, body.rtl *, [lang="ar"], [lang="ar"] * {
    font-family: 'Cairo', sans-serif !important;
}

/* Global Theme Colors Overrides */
body {
    background: radial-gradient(circle at 50% 30%, #171A21 0%, #0B0D10 100%) !important;
    color: #F8F9FA !important;
}

/* Form controls */
input, select, textarea {
    background-color: #1C1F26 !important;
    border-color: rgba(255,255,255,0.08) !important;
    color: #F7F5EF !important;
}
input:focus, select:focus, textarea:focus {
    border-color: #17B89D !important;
    box-shadow: 0 0 0 1px #17B89D !important;
}

/* Premium Luxury Buttons */
.qurby-theme-btn-gradient {
    background: linear-gradient(135deg, #17B89D 0%, #28E1C2 100%) !important;
    color: #0E1014 !important;
    box-shadow: 0 4px 15px rgba(40, 225, 194, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.qurby-theme-btn-gradient:hover {
    color: #0E1014 !important;
    transform: translateY(-1.5px) !important;
    box-shadow: 0 6px 20px rgba(40, 225, 194, 0.4) !important;
    opacity: 0.95;
}
.qurby-theme-btn-gold {
    background: linear-gradient(135deg, #C9A46A 0%, #E0BE7A 100%) !important;
    color: #0E1014 !important;
    box-shadow: 0 4px 15px rgba(201, 164, 106, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.qurby-theme-btn-gold:hover {
    color: #0E1014 !important;
    transform: translateY(-1.5px) !important;
    box-shadow: 0 6px 20px rgba(201, 164, 106, 0.4) !important;
    opacity: 0.95;
}

/* Legacy bootstrap classes alignment */
.card, .modal-content {
    background-color: #1C1F26 !important;
    border-color: rgba(255,255,255,0.08) !important;
    color: #F7F5EF !important;
}
.text-muted, .text-secondary {
    color: #D8D6CF !important;
    opacity: 0.7;
}

.article-content img {
    max-width: 100%;
    border-radius: 0.5rem;
    margin: 2rem 0;
}

.article-content iframe {
    border-radius: 0.5rem;
    margin: 2rem 0;
    max-width: 100%;
    height: auto;
}

/* Force Cairo on Arabic/RTL elements and remove text underlines from nav links */
[dir="rtl"], [dir="rtl"] *, [lang="ar"], [lang="ar"] *, .font-cairo {
    font-family: 'Cairo', sans-serif !important;
}
#front-navbar a, .header a, #front-navbar ul li a, .nav-link-1 {
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* Custom Scrollbars */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #0E1014;
}
::-webkit-scrollbar-thumb {
    background: #C9A46A;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: #17B89D;
}

/* Hide scrollbar on phone preview screens */
.phone-mockup-screen::-webkit-scrollbar {
    display: none !important;
}
.phone-mockup-screen {
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
}

/* Products Grid Fallback/Override */
.products-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 2rem !important;
}

@media (max-width: 1024px) {
    .products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 1.5rem !important;
    }
}

@media (max-width: 768px) {
    .products-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
        gap: 1.25rem !important;
    }
}

.products-grid .product-card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    background: #1C1F26 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 24px !important;
    padding: 1.5rem !important;
    transition: all 0.3s ease !important;
}

.products-grid .product-card:hover {
    border-color: #C9A46A !important;
    transform: translateY(-4px) !important;
}

/* Force hide all scrollbars inside the phone mockup preview on all browsers */
.phone-mockup-screen,
.phone-mockup-screen *,
.phone-mockup-screen::-webkit-scrollbar,
.phone-mockup-screen *::-webkit-scrollbar {
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
    overflow-y: scroll;
}
.phone-mockup-screen::-webkit-scrollbar,
.phone-mockup-screen *::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* Prevent text disappearing in both normal and hover states for all gold/yellow and premium CTAs */
a[class*="champagne-gold"], 
button[class*="champagne-gold"],
a[class*="yellow-"], 
button[class*="yellow-"],
a[class*="warm-gold"],
button[class*="warm-gold"],
a.qurby-theme-btn-gold,
button.qurby-theme-btn-gold,
a.qurby-theme-btn-gradient,
button.qurby-theme-btn-gradient,
a[class*="champagne-gold"]:hover, 
button[class*="champagne-gold"]:hover,
a[class*="yellow-"]:hover, 
button[class*="yellow-"]:hover,
a[class*="warm-gold"]:hover,
button[class*="warm-gold"]:hover,
a.qurby-theme-btn-gold:hover,
button.qurby-theme-btn-gold:hover,
a.qurby-theme-btn-gradient:hover,
button.qurby-theme-btn-gradient:hover {
    color: #0E1014 !important;
}