/*
Theme Name: Rent4Natu Luxury
Theme URI: https://gas.travel
Description: Luxury vacation rental theme for Rent4Natu - Child theme of Twenty Twenty-Five
Author: GAS Travel
Author URI: https://gas.travel
Template: twentytwentyfive
Version: 1.0.2
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rent4natu-luxury
*/

/* ==========================================================================
   CSS Variables
   ========================================================================== */
:root {
    --r4n-black: #111111;
    --r4n-white: #FFFFFF;
    --r4n-gold: #C9A96E;
    --r4n-gold-light: #D4BA8A;
    --r4n-gold-dark: #A8884E;
    --r4n-cream: #F9F6F0;
    --r4n-grey-light: #F5F5F5;
    --r4n-grey: #888888;
    --r4n-grey-dark: #333333;
    --r4n-font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --r4n-font-body: 'Montserrat', 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
    --r4n-transition: all 0.3s ease;
}

/* ==========================================================================
   Global Typography
   ========================================================================== */
body {
    font-family: var(--r4n-font-body) !important;
    font-weight: 400;
    color: var(--r4n-black);
    -webkit-font-smoothing: antialiased;
}

h1, h2 {
    font-family: 'Lato', sans-serif !important;
    font-weight: 700;
}

h3, h4, h5, h6 {
    font-family: 'Lato', sans-serif !important;
    font-weight: 400;
}

p, a, li, span, div {
    font-family: sans-serif;
}

/* ==========================================================================
   Navigation / Header
   ========================================================================== */
.wp-block-navigation {
    font-family: var(--r4n-font-body) !important;
    font-weight: 500;
    font-size: 0.85rem !important;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.wp-block-navigation a {
    text-decoration: none !important;
    transition: var(--r4n-transition);
}

.wp-block-navigation a:hover {
    color: var(--r4n-gold) !important;
}

.wp-block-site-title a {
    text-decoration: none !important;
    font-weight: 600;
    letter-spacing: 1px;
}

/* ==========================================================================
   Inner Pages — Kill ALL spacing between header and content
   ========================================================================== */
body:not(.home) .wp-site-blocks {
    padding-top: 0 !important;
}

body:not(.home) .wp-site-blocks > * + * {
    margin-block-start: 0 !important;
}

body:not(.home) main.wp-block-group {
    margin: 0 !important;
    padding: 0 !important;
}

body:not(.home) .wp-block-post-content {
    margin-top: 0 !important;
    padding-top: 0.5rem !important;
}

/* Hide hero slider on inner pages */
body:not(.home) .r4n-hero-slider,
body:not(.home) .r4n-hero-overlay-content {
    display: none !important;
}

/* Hide separator on inner pages */
body:not(.home) .wp-block-separator.has-accent-1-color,
body:not(.home) main .wp-block-group.is-content-justification-center {
    display: none !important;
    margin: 0 !important;
}

/* ==========================================================================
   Buttons — Dark grey globally
   ========================================================================== */
.wp-block-button__link,
.wp-element-button,
button,
input[type="submit"] {
    background-color: #373737 !important;
    color: #ffffff !important;
    font-family: var(--r4n-font-body) !important;
    font-size: 0.8rem !important;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    border-radius: 0 !important;
    transition: var(--r4n-transition);
}

.wp-block-button__link:hover,
.wp-element-button:hover {
    background-color: #222222 !important;
}

/* ==========================================================================
   Hero Slider (Homepage only)
   ========================================================================== */
.r4n-hero-slider {
    position: relative;
    background: #111;
    margin: 0 !important;
    padding: 0 !important;
    max-height: 85vh;
    overflow: hidden;
}

.r4n-hero-slider .metaslider {
    line-height: 0 !important;
}

.r4n-hero-slider .metaslider .flexslider {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: none !important;
}

.r4n-hero-slider .metaslider .slides li {
    line-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.r4n-hero-slider .metaslider .slides li img {
    width: 100% !important;
    height: 85vh !important;
    object-fit: cover !important;
    display: block !important;
}

.r4n-hero-slider .r4n-hero-overlay-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.3);
    padding-bottom: 100px;
}

.r4n-hero-slider .r4n-hero-inner {
    text-align: center;
    max-width: 850px;
    padding: 2rem;
}

.r4n-hero-slider .gas-search-widget {
    position: absolute !important;
    bottom: 40px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 20 !important;
    width: 90% !important;
    max-width: 900px !important;
}

.r4n-hero-slider .flex-control-nav,
.r4n-hero-slider .flex-direction-nav {
    display: none !important;
}

.r4n-hero-slider .wp-block-shortcode {
    margin: 0 !important;
    padding: 0 !important;
}

.r4n-hero-slider > .wp-block-shortcode:first-child {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.r4n-hero-slider .is-layout-flow > * + * {
    margin-top: 0 !important;
}

.wp-block-template-part + .r4n-hero-slider {
    margin-top: -1px !important;
}

/* ==========================================================================
   GAS Plugin — Search Widget
   ========================================================================== */
.gas-search-widget {
    border-radius: 0 !important;
    font-family: var(--r4n-font-body) !important;
    background: #ffffff !important;
}

.gas-search-widget label {
    font-family: var(--r4n-font-body) !important;
    font-size: 0.75rem !important;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 600;
}

/* ==========================================================================
   GAS Plugin — Room Cards
   ========================================================================== */
.gas-room-card {
    border-radius: 0 !important;
    overflow: hidden;
    transition: var(--r4n-transition);
    border: none !important;
    box-shadow: 0 2px 15px rgba(0,0,0,0.06);
    background: #ffffff !important;
    margin-bottom: 0 !important;
}

.gas-room-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(0,0,0,0.12);
}

.gas-room-card h3 {
    font-family: var(--r4n-font-heading) !important;
    font-weight: 500;
}

.gas-view-button {
    background-color: var(--r4n-black) !important;
    color: var(--r4n-white) !important;
    transition: var(--r4n-transition) !important;
    border-radius: 0 !important;
}

.gas-view-button:hover {
    background-color: var(--r4n-gold) !important;
}

/* ==========================================================================
   GAS Plugin — Room Detail & Checkout
   ========================================================================== */
.gas-room-widget h1,
.gas-room-widget h2 {
    font-family: var(--r4n-font-heading) !important;
}

.gas-gallery,
.gas-gallery-main,
.gas-gallery-thumb {
    border-radius: 0 !important;
}

.gas-checkout-container {
    font-family: var(--r4n-font-body) !important;
}

.gas-checkout-container h2 {
    font-family: var(--r4n-font-heading) !important;
}

.gas-room-price {
    font-family: var(--r4n-font-heading) !important;
    color: var(--r4n-gold-dark);
}

.gas-amenity-tag {
    border-radius: 0 !important;
    font-family: var(--r4n-font-body) !important;
    font-size: 0.75rem !important;
}

.gas-filter-bar {
    font-family: var(--r4n-font-body) !important;
}

.gas-filter-bar select,
.gas-filter-bar input {
    border-radius: 0 !important;
    font-family: var(--r4n-font-body) !important;
}

.gas-map-container {
    border-radius: 0 !important;
}

/* ==========================================================================
   GAS Plugin — Grid Layout
   ========================================================================== */
.gas-rooms-page-wrapper {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
}

.gas-rooms-wrapper,
.gas-rooms-list,
.gas-rooms-grid {
    padding: 0 !important;
    margin: 0 !important;
}

/* Respect inline column settings */
.gas-rooms-grid[style*="repeat(3"] {
    grid-template-columns: repeat(3, 1fr) !important;
}

.gas-rooms-grid[style*="repeat(2"] {
    grid-template-columns: repeat(2, 1fr) !important;
}

/* Homepage: hide filters/headers from shortcode grids */
.home .gas-rooms-page-wrapper .gas-rooms-header,
.home .gas-rooms-page-wrapper h2,
.home .gas-rooms-page-wrapper .gas-filter-bar {
    display: none !important;
}

/* Homepage: remove gap between sections */
.home .wp-block-group.alignfull + .wp-block-group.alignfull {
    margin-top: 0 !important;
}

/* ==========================================================================
   Sections & Cards
   ========================================================================== */
.r4n-section {
    padding: clamp(3rem, 8vw, 6rem) 0;
}

.r4n-gold-divider {
    width: 50px;
    height: 2px;
    background: var(--r4n-gold);
    margin: 1.25rem auto;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.r4n-footer a {
    color: rgba(255,255,255,0.7) !important;
    text-decoration: none !important;
    transition: var(--r4n-transition);
}

.r4n-footer a:hover {
    color: var(--r4n-gold) !important;
}

/* ==========================================================================
   Language Switcher
   ========================================================================== */
.r4n-lang-switcher a {
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--r4n-grey);
    transition: var(--r4n-transition);
}

.r4n-lang-switcher a:hover,
.r4n-lang-switcher a.active {
    color: var(--r4n-gold);
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 768px) {
    .r4n-hero-slider .metaslider .slides li img {
        height: 70vh !important;
    }

    .gas-rooms-grid,
    .gas-rooms-grid[style*="repeat(3"],
    .gas-rooms-grid[style*="repeat(2"] {
        grid-template-columns: 1fr !important;
    }

    .wp-block-navigation {
        font-size: 0.8rem !important;
    }
}

@media (max-width: 480px) {
    .r4n-hero-slider .metaslider .slides li img {
        height: 60vh !important;
    }
}

/* Ensure nav links are visible */
.wp-block-navigation a {
    color: var(--r4n-black) !important;
}

/* Fix gap on book-now page */
body:not(.home) .wp-block-post-content {
    margin-top: 0 !important;
    padding-top: 0rem !important;
}
.gas-rooms-page-wrapper {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    padding: 20px 40px !important;
    padding-top: 0px !important;
}
.gas-rooms-page-wrapper > .gas-date-filter:first-child {
    margin-top: 0px !important;
}

/* Fix navigation links visibility */
.wp-block-navigation-item__content,
.wp-block-navigation-item__label {
    color: #111111 !important;
}
.wp-block-navigation-item__content:hover,
.wp-block-navigation-item__label:hover {
    color: #C9A96E !important;
}

/* Force navigation to show on desktop */
.wp-block-navigation__responsive-container {
    display: block !important;
    position: relative !important;
    overflow: visible !important;
    height: auto !important;
    width: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
}
.wp-block-navigation__responsive-container-open {
    display: none !important;
}
.wp-block-navigation__responsive-container-close {
    display: none !important;
}
.wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content {
    display: block !important;
}

/* Hero slider with overlay */
.r4n-hero-slider {
    position: relative;
    min-height: 85vh;
    overflow: hidden;
}
.r4n-hero-slider .metaslider {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.r4n-hero-slider .metaslider .slides li img,
.r4n-hero-slider .metaslider img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.r4n-hero-overlay {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 85vh;
    background: rgba(0,0,0,0.35);
}
