/* --- 1. COLOR & FONT VARIABLES --- */
:root {
    /* Primary brand color (Deep Green) - used for accents, buttons, and text highlights */
    --color-primary: #008057; 
    /* Secondary accent color (Gold/Yellow) - used for hover effects */
    --color-secondary: #ab8e1e;
    /* Very dark gray/black - used for footer and header background */
    --color-dark-black: #212529; 

    /* Fonts based on source code analysis */
    --font-primary: 'Lato', sans-serif;
    --font-secondary: 'Arvo', serif;
    --font-button: 'Roboto', sans-serif;
}

/* Global Body and Typography */
body {
    font-family: var(--font-primary);
    color: #333;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-primary);
    font-weight: 700;
}

/* Custom Text Colors */
.text-dark-green {
    color: var(--color-primary) !important;
}

/* --- 2. HEADER & NAVIGATION STYLES --- */
.site-header {
    background-color: var(--color-dark-black);
    transition: background-color 0.3s ease;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    z-index: 1030; /* Above Bootstrap defaults */
}

/* Nav links */
.navbar-nav .nav-link {
    color: #fff;
    padding: 1rem 0.8rem;
    text-transform: uppercase;
    font-weight: 500;
    transition: color 0.3s ease;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: var(--color-primary); /* Primary color for hover/active */
}

/* Dropdown Menu Styling */
.dropdown-menu {
    background-color: var(--color-dark-black);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.dropdown-item {
    color: #fff;
    padding: 0.5rem 1rem;
    transition: background-color 0.3s ease;
}

.dropdown-item:hover {
    background-color: rgba(255, 255, 255, 0.05);
    color: var(--color-primary);
}

/* --- 3. CUSTOM BUTTON STYLES --- */

/* Primary Fill Button (e.g., Find More) */
.site-btn-fill {
    display: inline-block;
    padding: 10px 30px;
    background-color: var(--color-primary);
    color: #fff;
    text-transform: uppercase;
    font-size: 0.9rem;
    font-weight: 700;
    border: 1px solid var(--color-primary);
    transition: all 0.3s ease;
}

.site-btn-fill:hover {
    background-color: transparent;
    color: var(--color-primary);
    text-decoration: none;
}

/* Outline Button (e.g., Take a Tour) */
.site-btn-outline {
    display: inline-block;
    padding: 10px 30px;
    background-color: transparent;
    color: #fff;
    text-transform: uppercase;
    font-size: 0.9rem;
    font-weight: 700;
    border: 1px solid rgba(255, 255, 255, 0.5);
    transition: all 0.3s ease;
}

.site-btn-outline:hover {
    background-color: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
}

/* Book Now Button in Header */
.site-btn-booknow {
    padding: 8px 20px;
    background-color: var(--color-primary);
    color: #fff;
    text-transform: uppercase;
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.3s ease;
    border: 1px solid var(--color-primary);
}

.site-btn-booknow:hover {
    background-color: transparent;
    color: var(--color-primary);
}

/* --- 4. SECTION STYLES --- */

/* Pre-title Text */
.pre_title {
    font-family: var(--font-secondary);
    font-size: 1rem;
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 5px;
}

/* Hero Section Text Styling (mimicking Revolution Slider layers) */
.banner-pre-titleX {
    font-family: var(--font-secondary);
    font-size: 1.125rem; /* 18px */
    text-transform: uppercase;
    color: #fff;
}

.banner-title {
    font-family: var(--font-primary);
    font-size: 2.5rem; /* ~40px desktop */
    font-weight: 700;
    color: #f3f3f3;
}
/* Responsive adjustments for Hero Title */
@media (min-width: 768px) {
    .banner-title {
        font-size: 3.5rem; /* ~56px desktop */
    }
}


/* Room Card Styling */
.room-card {
    border-radius: 0;
    transition: transform 0.3s ease;
}

.room-card:hover {
    transform: translateY(-5px);
}

.room-card .card-body {
    padding: 1.5rem;
}

.room-card .tagline {
    color: var(--color-primary);
    transition: color 0.3s ease;
}

/* Room Card Hover Effect (Color #ab8e1e from source) */
.room-card:hover .tagline {
    color: var(--color-secondary);
}

/* View All Rooms Link */
.moreRoomsView {
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
}

.moreRoomsView:hover {
    color: var(--color-secondary) !important;
}

/* Facility List */
.facil_left i {
    color: var(--color-primary);
    font-size: 2rem;
}

.facility_box a {
    color: inherit;
    text-decoration: none;
}

/* --- 5. FOOTER STYLES --- */
.bg-dark-black {
    background-color: var(--color-dark-black);
}

.mostfooter {
    color: #ccc;
}

.mostfooter h6 {
    color: var(--color-primary) !important;
    font-weight: 700;
}


.welcome-bg{
    background-image: url("../img/welcome-bg.jpg");
    width: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 2;
}

.footer-link {
    color: #ccc;
    text-decoration: none;
    transition: color 0.3s ease;
    display: inline-block;
    margin-bottom: 5px;
}

.footer-link:hover {
    color: var(--color-primary);
}