/*!
Theme Name: Hostinger AI theme
Author: Hostinger
Author URI: https://hostinger.com
Details URI: https://hostinger.com
Description: Hostinger AI theme built with SEO and mobile responsiveness in mind, this theme ensures optimal performance and a better online presence.
Version: 1.1.02
Tested up to: 6.5
Requires at least: 5.6
Requires PHP: 8.0
License: GPLv3
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: hostinger-ai-theme
Tags: ai-theme
*/

:root {
    /* Taddart Luxury Palette - Tailwind Compatible */
    --taddart-charcoal: #333333;
    --taddart-gold: #D4AF37;
    --taddart-cream: #F5F5DC;
    --taddart-burgundy: #8B0000;
    --taddart-slate: #4B5D67;

    /* UI / Functional Colors */
    --taddart-surface-subtle: #f3f4f6;
    --taddart-white: #ffffff;
    --taddart-black: #000000;
    --taddart-border-input: #dadce0;
    --taddart-disabled: #cccccc;
    --taddart-error: #ff0000;
    --taddart-gray-200: #e5e5e5;
    --taddart-gray-800: #1f2937;

    /* Overlays & Shadows */
    --taddart-overlay-texture: rgba(0, 0, 0, 0.02);
    --taddart-overlay-noise: rgba(0, 0, 0, 0.03);
    --taddart-shadow-sm: rgba(0, 0, 0, 0.04);
    --taddart-shadow-md: rgba(0, 0, 0, 0.08);
    --taddart-shadow-xs: rgba(0, 0, 0, 0.1);
    --taddart-overlay-dark: rgba(0, 0, 0, 0.6);
    --taddart-overlay-darker: rgba(0, 0, 0, 0.8);

    /* Legacy Mappings (Backward Compatibility) */
    --color-charcoal: var(--taddart-charcoal);
    --color-gold: var(--taddart-gold);
    --color-cream: var(--taddart-cream);
    --color-burgundy: var(--taddart-burgundy);
    --color-slate: var(--taddart-slate);
}

html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--taddart-cream) !important;
    color: var(--taddart-slate);
    font-family: 'Almarai', sans-serif !important;
    position: relative;
    direction: rtl;
    /* Arabic First */
}

/* SOVEREIGN FIX: Box Sizing & Wrapper Alignment */
*,
*::before,
*::after {
    box-sizing: border-box !important;
}

.wrap {
    max-width: 1200px;
    width: 95%;
    margin: 0 auto;
}

/* G-INJECTION: Missing Plugin Styles (Grid & Dock) */
.es-listing--grid {
    display: grid;
    /* Implements Liquid Grid - Realigned for 1200px constrained shell */
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

/* ... existing styles ... */

/* ALIGNMENT FIX: Grid Container Definition (Single Source of Truth) */
.taddart-grid-container.es-listings,
.es-listings.es-listings--grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
    gap: 2.5rem !important;
    width: 100% !important;
    margin: 0 !important;
    grid-auto-rows: 1fr;
}

/* Remove rigid media queries since we are using auto-fit */

/* ... existing styles ... */

/* WhatsApp Dock */
/* WhatsApp Dock */
.taddart-whatsapp-dock {
    position: fixed !important;
    bottom: 30px;
    right: 30px;
    z-index: 999;
    background-color: var(--taddart-charcoal);
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: none;
    /* JS Toggles This */
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
}

.es-listing--dock {
    display: flex;
}

/* Background Depth - Subtle Noise Overlay */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3%3Cfilter id='noiseFilter'%3%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3%3C/filter%3%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3%3C/svg%3");
    opacity: 0.03;
    /* Kept as literal for svg filter opacity match context, or use var if supported in filter but here it is opacity property */
    opacity: 0.03;
    /* var(--taddart-overlay-noise) is rgba, opacity property expects number. 
       However, the definition was rgba(0,0,0,0.03) for color, here it is opacity. 
       Let's stick to the color replacements where they are colors. */
}

body::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    background-image: radial-gradient(circle at center, transparent 0%, var(--taddart-overlay-texture) 100%);
}

/* Apple-style Selection Detail */
::selection {
    background-color: var(--taddart-burgundy) !important;
    color: var(--taddart-cream) !important;
}

/* Global "Apple Breathe" Spacing */
.wp-site-blocks>*+* {
    margin-top: 2rem !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--taddart-burgundy) !important;
    font-family: 'Almarai', sans-serif !important;
    font-weight: 700 !important;
}

/* Header Luxury Shell */
.wp-block-group.hostinger-ai-menu {
    background-color: var(--taddart-charcoal) !important;
    border-bottom: 4px solid var(--taddart-gold) !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.wp-block-group.hostinger-ai-menu .taddart-site-title a,
.wp-block-group.hostinger-ai-menu .wp-block-navigation-item__label {
    color: var(--taddart-gold) !important;
    font-family: 'Almarai', sans-serif !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

.wp-block-navigation .wp-block-navigation-item__label:hover {
    color: var(--taddart-cream) !important;
}

/* Container Refinement */
.wp-block-group.alignwide {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* --- SOVEREIGN TADDART REFINEMENTS --- */

/* High-Performance Skeleton Animation */
@keyframes taddart-pulse {

    0%,
    100% {
        opacity: 0.6;
    }

    50% {
        opacity: 1;
    }
}

.animate-pulse {
    animation: taddart-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite !important;
    background-color: var(--taddart-surface-subtle) !important;
}

.animate-pulse-subtle {
    animation: taddart-pulse 3s ease-in-out infinite !important;
}

/* Level 100: Top-tier Text and Critical Titles */
#taddart-hero-final h1,
#taddart-hero-final .hero-content,
#taddart-engine-elite h1,
#taddart-engine-elite .engine-content,
.taddart-site-title,
.taddart-navigation {
    position: relative;
    z-index: 100 !important;
}

/* Level 50: Glass Blurs and Frosted Overlays */
.glass-overlay,
#taddart-hero-final::after,
#taddart-engine-elite::after {
    z-index: 50 !important;
}

/* Level 1: Background Ken Burns and Texture Gradients */
#taddart-hero-final::before,
#taddart-engine-elite::before,
body::before,
body::after {
    z-index: 1 !important;
}

/* Cinematic Zoom: Hover State for Property Cards */
.taddart-elite-card:hover .es-listings__image__link div,
.taddart-elite-card:hover img {
    transform: scale(1.1) !important;
}

.taddart-elite-card .es-listings__image__link div,
.taddart-elite-card img {
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* ANTI-STACK: Critical Fix - Prevent uninitialized sliders from covering the page */
.es-listing__image__slider {
    display: flex;
    overflow: hidden;
    max-height: 250px;
    /* Constrain initial render height */
}

/* Hide all but first slide until initialized */
.es-listing__image__slider:not(.slick-initialized)>div:not(:first-child) {
    display: none !important;
}

/* Shadow Bloom Effect */
.taddart-elite-card {
    transition: box-shadow 0.5s ease, transform 0.5s ease !important;
}

.taddart-elite-card:hover {
    box-shadow: 0 20px 25px -5px var(--taddart-shadow-md), 0 10px 10px -5px var(--taddart-shadow-sm) !important;
    transform: translateY(-4px) !important;
}

/* GC FIX: Grid definition consolidated with primary rule at line 88.
   The duplicate here was overriding grid-template-columns to undefined,
   breaking the auto-fit layout. gap and grid-auto-rows are now on the primary rule. */

/* ALIGNMENT FIX: Uniform Grid Image Aspect Ratio */
.taddart-elite-card .taddart-card-media {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    /* Standardize aspect ratio */
    overflow: hidden;
}

.taddart-elite-card .taddart-card-media img,
.es-single-gallery img,
.es-property-slider img,
.es-single__left-slider img,
.js-es-single-property-layout img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* ALIGNMENT FIX: Pulse Mask Removal Transition */
.animate-pulse,
.animate-pulse-subtle {
    transition: opacity 0.5s ease-in-out, background-color 0.5s ease-in-out !important;
}

.animate-pulse.loaded,
.animate-pulse-subtle.loaded {
    opacity: 1 !important;
    background-color: transparent !important;
    animation: none !important;
}

/* ALIGNMENT FIX: Grid Item Height Enforcement */
.taddart-grid-container.es-listings .taddart-listing-item,
.es-listings.es-listings--grid .es-listing {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Almarai Force */
.font-almarai,
.taddart-card-body,
.taddart-search-sidebar,
.taddart-no-results,
.taddart-listing-item,
.es-btn {
    font-family: 'Almarai', sans-serif !important;
}

/* RTL Helpers */
[dir="rtl"] {
    text-align: right;
}

/* SHIMMER STABILITY: Single Gallery Masking */
.es-single-gallery,
.es-property-slider,
.es-single__left-slider,
.js-es-single-property-layout {
    background-color: var(--taddart-cream) !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Sidebar Fix */
@media (min-width: 1024px) {
    .taddart-sidebar-area {
        min-width: 300px;
    }
}

/* Imported Colors (Batch 2) */
:root {
    --taddart-blue-link: #0073aa;
    --taddart-gray-input: #f0f0f1;
    --taddart-border-light: #e2e4e7;
    --taddart-dark-bg: #1d2327;
    /* Verified common WordPress/Theme colors from analysis */
}