/*
 Theme Name:   Astra Child
 Theme URI:    https://wpastra.com/
 Description:  Child theme customized for Infinity SAS / Brazil Tour Operator
 Author:       ItyMkt 
 Author URI:   https://braziltouroperator.com
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child 

 ---style.css - version 1.0 --- */

/* ============================================================
   CONTROL PANEL - UPDATE HERE TO CHANGE EVERYTHING
   ============================================================ */
:root { 
    --gold-color: #D4AF37;        /* Primary color and accents */
    --dark-gold-color: #db9423;   /* Used for buttons and active states */
    --black-color: #000000;
    --white-color: #ffffff;
    --light-gray-color: #f9f9f9;
}


/* ================================================================
   SECTION 1: EDITING VISIBILITY MODE
   ================================================================ */ 
/* --- FORCES VISIBILITY ONLY INSIDE THE BLOCK EDITOR AND CUSTOMIZER --- */
.wp-admin .rlm-reveal-card,
.edit-post-visual-editor .rlm-reveal-card,
.customize-support .rlm-reveal-card {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
    border: 1px dashed var(--gold-color) !important; /* Dotted gold border for editing only */
}
/* =============================================================== */


/* ===============================================================
   SECTION 2: MASTER SPACING RLM (1200px Layout)
   =============================================================== */
/* --- RESET TOP MARGINS: PREVENT ASTRA ADDING EXTRA SPACES --- */
.ast-desktop .entry-content p, 
.ast-desktop .entry-content ul, 
.ast-desktop .entry-content ol,
.ast-desktop .entry-content blockquote {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* --- PARAGRAPHS: SPACE SEPARATING TEXT FROM NEXT BLOCK OR SUBTITLE --- */
.ast-desktop .entry-content p { 
    margin-bottom: 1.2em; /* Slightly increased for better readability */
}

/* --- LISTS AND QUOTES: SPACING FOR THE BLOCK CONTAINER --- */
.ast-desktop .entry-content ul, 
.ast-desktop .entry-content ol,
.ast-desktop .entry-content blockquote {
    margin-bottom: 0.8em !important;
}

/* --- LIST ITEMS: VERTICAL SPACE BETWEEN BULLETS --- */
.ast-desktop .entry-content li {
    margin-bottom: 0.3em !important;
}
/* =============================================================== */ 


/* ===============================================================
   SECTION 3: TEXT JUSTIFICATION & HYPHENATION (High Priority)
   =============================================================== */
/* --- APPLIED VIA CLASS 'text-justify' IN THE BLOCK SETTINGS --- */
#page .text-justify, 
#page .text-justify p, 
#page .text-justify blockquote,
#page div.txt-justify * {
    text-align: justify !important;        /* Forces block alignment */
    text-align-last: left;                 /* Prevents the last line from stretching awkwardly */
    text-justify: inter-word !important;   /* Premium spacing distribution between words */
    hyphens: auto !important;              /* Enables hyphenation to avoid large gaps in text */
    -webkit-hyphens: auto !important;
    -moz-hyphens: auto !important;         /* Firefox compatibility */ 
    -ms-hyphens: auto !important;
    word-break: break-word !important;     /* Safety net to prevent long words from breaking the layout */
} 
/* =============================================================== */ 


/* ===============================================================
   SECTION 4: NAVIGATION & MENU
   =============================================================== */
/* --- CONFIG BACKGROUND COLOR (FATHER) --- */
.main-header-bar, .ast-primary-header-bar {
    background-color: var(--black-color) !important;
    border-bottom: 0px !important;
    overflow: visible !important; 
}

/* --- MAIN HEADER TEXT --- */
.ast-desktop .main-header-menu > .menu-item > a {
    color: var(--white-color) !important; /* White letters */ 
    position: relative !important;
    height: 100% !important; 
    display: flex !important;
    align-items: center !important;
    transition: all 0.3s ease !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    font-size: 14px;
}

/* Gold Underline (Hover) */
.ast-desktop .main-header-menu > .menu-item > a::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0px !important; /* Adjusted to sit exactly at the bottom of the bar */
    left: 0 !important;
    width: 0;
    height: 3px !important;
    background-color: var(--gold-color) !important; /* Gold */
    transition: width 0.3s ease-in-out !important;
    z-index: 999 !important;
}

.ast-desktop .main-header-menu > .menu-item:hover > a::after {
    width: 100% !important;
}

/* Force container visibility for the line */
.site-header, .ast-primary-header-bar, .main-header-bar { 
    overflow: visible !important; 
}

/* --- DROPDOWN SUBMENU --- */
.ast-desktop .main-header-menu .sub-menu {
    top: 100% !important; /* Begins exactly where the black header ends */
    background-color: var(--white-color) !important;
    box-shadow: 0px 10px 30px rgba(0,0,0,0.5) !important;
    border-top: 3px solid var(--gold-color) !important; /* Golden line */
    padding: 5px 0 !important;
    border-radius: 0 0 8px 8px !important;
    margin-top: 0 !important; /* Zeroed to avoid gaps */ 
    min-width: 230px !important;
}

/* --- SUBMENU ITEMS & TEXT --- */ 
.ast-desktop .main-header-menu .sub-menu li a {
    color: var(--black-color) !important; /* Black letters for contrast on Gold */
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 12px 20px !important;
    display: block !important;
    transition: all 0.3s ease-in-out !important;
    border-bottom: 1px solid rgba(0,0,0,0.1) !important; /* Subtle line */
    background: transparent !important;
    text-transform: none;
}

/* Remove border from last item sub-menu */
.ast-desktop .main-header-menu .sub-menu li:last-child a {
    border-bottom: none !important;
}

/* --- SUBMENU HOVER (GOLD + MOTION) --- */
.ast-desktop .main-header-menu .sub-menu li a:hover {
    color: var(--gold-color) !important;
    font-weight: 600 !important;
    background-color: var(--light-gray-color) !important; /* Light gray or slightly darker */
    padding-left: 30px !important; /* Side push effect */
}

/* --- MOBILE TOGGLE FIX: BLINDED SVG DROPDOWN ARROW COLOR FOR ALL ASTRA VERSIONS --- */
@media (max-width: 992px) {
    /* Hard-targets the physical SVG graphic element and path vectors directly to bypass Astra inline filters */
    .ast-header-break-point .ast-menu-toggle,
    .ast-header-break-point .ast-menu-toggle *,
    .ast-header-break-point .ast-menu-toggle svg,
    .ast-header-break-point .ast-menu-toggle path,
    .ast-header-break-point .ast-arrow-svg,
    .ast-header-break-point .ast-arrow-svg path,
    .ast-mobile-menu-trigger .ast-button-wrap .ast-menu-toggle path,
    button.ast-menu-toggle span.ast-icon svg,
    button.ast-menu-toggle span.ast-icon svg path {
        color: #000000 !important;
        fill: #000000 !important; /* Physically forces the SVG vector mapping drawing to render in pure black */ 
    }
}
/* =============================================================== */


/* ===============================================================
   SECTION 5: GLOBAL ANIMATIONS & SLIDER SPEED - SECTRA FREE
   =============================================================== */
/* --- GLOBAL ANIMATION VARIABLES --- */ 
:root {
    --uag-animation-duration: 1.8s !important;
    --aos-duration: 1800ms !important;
    --animate-duration: 1.8s !important;
}

/* --- GLOBAL FORCE on DESKTOP - USE OF "Body" --- */ 
body [data-uag-animation], 
body .uagb-animated-delay, 
body .uag-animated,
body .aos-animate,
body .uagb-fadein, 
body .uagb-slide-up {
    animation-duration: 1.8s !important;
    transition-duration: 1.8s !important;
    -webkit-animation-duration: 1.8s !important;

    /* Luxury Curve RLM - Smooth & Fluid */
    animation-timing-function: cubic-bezier(0.15, 0, 0.15, 1) !important;
    transition-timing-function: cubic-bezier(0.15, 0, 0.15, 1) !important;
}

/* --- CASCADE CONTROL - SEQUENCE DELAYS --- */ 
body .transition-1 { animation-delay: 0.05s !important; transition-delay: 0.05s !important; } 
body .transition-2 { animation-delay: 0.07s !important; transition-delay: 0.07s !important; } 
body .transition-3 { animation-delay: 0.09s !important; transition-delay: 0.09s !important; } 
body .transition-4 { animation-delay: 0.12s !important; transition-delay: 0.12s !important; } 
body .transition-5 { animation-delay: 0.2s !important; transition-delay: 0.2s !important; }

/* --- EXCEPTION: Fast elements (Typewriter / Icons / Quick UI) --- */
.rlm-no-slow, .rlm-typewriter, .animated-typing { 
    animation-duration: 0.1s !important; 
    transition-duration: 0.1s !important; 
}

/* --- SLIDER PROTECTION: PREVENT GLOBAL OVERRIDE --- */
/* NOTE: This rule acts as a global safety net to prevent the 1.8s luxury 
   animation (defined in Section 5) from slowing down the carousel's 
   internal mechanics. It ensures smooth transitions (0.6s) for all 
   Spectra/Slick sliders, even if specific classes are not applied. */
.uagb-slick-carousel, 
.uagb-slick-carousel *,
.slick-track, 
.slick-slide {
    animation-duration: 0.6s !important; 
    transition-duration: 0.6s !important;
    animation-timing-function: ease-out !important; 
}
/* =============================================================== */


/* ===============================================================
   SECTION 6: SPECTRA GALLERY: DOTS POSITION + ALIGNMENT
   --- LOCATED IN /astra-child/assets/css/galleries.css --- 
   ===============================================================  */


/* ===============================================================
   SECTION 7: COOKIES YES: STYLE CUSTOMISATION
   =============================================================== */
/* --- BANNER MAIN BUTTONS --- */ 
.cky-btn {
  border-radius: 13px !important; /* Rounded according to your preference */
  font-weight: bold !important;
  transition: all 0.3s ease; 
    padding: 6px 20px !important; 
  min-height: auto !important; /* Remove minimum heights forced by the plugin */
}

/* --- "Accept All" BUTTON --- */ 
.cky-btn-accept {
  background-color: var(--dark-gold-color) !important;
  border-color: var(--dark-gold-color) !important;
  color: var(--white-color) !important;
}

/* --- "Save My Preferences" BUTTON --- */ 
.cky-btn-preferences {
  background-color: var(--dark-gold-color) !important;
  color: var(--white-color) !important;
  border-radius: 13px !important;
}

/* --- COLOR SWITCHES - WHEN ACTIVE --- */ 
.cky-switch input:checked + .cky-slider {
  background-color: var(--dark-gold-color) !important;
}

/* --- TEXT STROKE EFFECT --- */ 
.cky-btn-accept, .cky-btn-preferences {
  -webkit-text-stroke: 0.2px var(--white-color);
}
/* =============================================================== */


/* ===============================================================
   SECTION 8: CUSTOM FADE - GUTENBERG GALLERY CONTROLS
   --- LOCATED IN /astra-child/assets/css/galleries.css --- 
   =============================================================== */


/* ===============================================================
   SECTION 9: UI ELEMENTS - DESTINATION CARDS (GEOMETRY & HOVER)
   =============================================================== */
/* USE: Container / Column: rlm-round-feature (activate hover) 
/* Imagem: rlm-circle-feature rlm-size-md (create circle) 
 * Imagem (Optiona): rlm-focus-top-rht (focus adjust) 
 * Separator: rlm-color-separator (separator animation) 
 * Title/Text: None (Astra / Spectra takes care of it) */

/* 1. GEOMETRY: Forces the perfect circle on any image ratio with High-Quality rendering */
.rlm-circle-feature img {
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    display: block !important;
    transition: all 0.4s ease-in-out !important; /* Smooth base for hover */
    object-position: center !important; /* object-position: center is the default here */
    width: 100%; /* Default to fill the column */ 
    
    /* --- PERFORMANCE & SMOOTHNESS BOOSTERS --- */
    -webkit-backface-visibility: hidden; /* Evita tremores no Safari/Chrome */
    backface-visibility: hidden;
    transform: translateZ(0); /* Força renderização via hardware */
    image-rendering: -webkit-optimize-contrast !important; /* Nitidez extra em fotos */
    
    /* Luxury Depth: Subtle shadow for a premium feel */
    box-shadow: 0px 4px 15px rgba(0,0,0,0.1);
}

/* 2. SIZE PRESETS: Add these classes to the Image Block */
.rlm-size-sm img { width: 150px !important; height: 150px !important; } /* Small */ 
.rlm-size-mdsm img { width: 180px !important; height: 180px !important; } /* Medium Small */
.rlm-size-md img { width: 220px !important; height: 220px !important; } /* Medium */
.rlm-size-mdlg img { width: 300px !important; height: 300px !important; } /* Medium Large */ 
.rlm-size-lg img { width: 360px !important; height: 360px !important; } /* Large */ 

/* 3. FOCUS ADJUSTMENTS: Add these classes to the Image Block */
.rlm-focus-btm-rht img { object-position: 60% 65% !important; } /* Focus slightly DOWN and RIGHT */
.rlm-focus-top-rht img { object-position: 60% 35% !important; } /* Focus slightly UP and RIGHT */
.rlm-focus-btm-lft img { object-position: 40% 65% !important; } /* Focus slightly DOWN and LEFT */
.rlm-focus-top-lft img { object-position: 40% 35% !important; } /* Focus slightly UP and LEFT */ 

/* 4. DESTINATION CARD INTERACTION & HOVER: Add this classes to the Column/Container. */
.rlm-round-feature {
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    cursor: pointer;
}
/* Triggers when mouse enters the Column */
.rlm-round-feature:hover img {
    transform: scale(1.05);
    filter: brightness(1.1) saturate(1.2);
    box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.2); /* Stronger shadow on hover */
}

/* 5. INTERACTIVE SEPARATOR: Style and interactive growth */
.rlm-color-separator {
    margin-bottom: 15px !important;
    border-top-width: 2px !important;
    transition: all 0.4s ease-in-out !important;
    width: 30%; /* Starting width */
    margin-left: auto;
    margin-right: auto;
    opacity: 0.8;
} 

/* Tigth Layout: H6 + Separator spacing */
.rlm-round-feature h6 {
    margin-bottom: 5px !important; /* Reduce title bottom gap distance */
    padding-bottom: 0 !important;
} 

/* Reduce separator top gap distance */
.rlm-round-feature .rlm-color-separator {
    margin-top: 5px !important;  
}

/* Expansion on hover */
.rlm-round-feature:hover .rlm-color-separator {
    width: 60% !important; 
    opacity: 1;
}
/* =============================================================== */ 


/* ===============================================================
   SECTION 10: HERO EXCLUSIVE STYLE (FULL DYNAMIC & ISOLATED)
   --- LOCATED IN /astra-child/assets/css/hero-styles.css --- 
   =============================================================== 
   SECTION 11: HERO SLIDER LAYOUT ENGINE
   --- LOCATED IN /astra-child/assets/css/hero-styles.css --- 
   =============================================================== */


/* ===============================================================
   SECTION 12: UNIFIED MOBILE OPTIMIZATION (UNDER 767px)
   =============================================================== */
@media (max-width: 767px) { 
    /* --- FROM SECTION 5: GLOBAL ANIMATIONS SPEED --- */ 
    body [data-uag-animation], 
    body .uagb-animated-delay {
        animation-duration: 1.6s !important; 
        -webkit-animation-duration: 1.6s !important;
    }

    /* Delay animation between text rows to be percepted */
    body .transition-1 { animation-delay: 0.05s !important; transition-delay: 0.05s !important; }
    body .transition-2 { animation-delay: 0.07s !important; transition-delay: 0.07s !important; }
    body .transition-3 { animation-delay: 0.09s !important; transition-delay: 0.09s !important; }
    body .transition-4 { animation-delay: 0.12s !important; transition-delay: 0.12s !important; }
    body .transition-5 { animation-delay: 0.2s !important; transition-delay: 0.2s !important; }

    /* --- FROM SECTION 9: DESTINATION CARDS (GEOMETRY) --- */
    /* Resets all circles to a safe size on mobile */
    .rlm-circle-feature img {
        width: 180px !important; 
        height: 180px !important;
    }
}
/* =============================================================== */
