/*
 * Casa Mirea Rina - Custom CSS
 * Overrides the Moonlit template with Mediterranean colors and brand styles
 */

/* ============================================================
   1. COLOR PALETTE - Mediterranean Blue replaces template gold
   ============================================================ */
:root {
    --btn-1: #1a7abf;         /* Mediterranean sea blue */
    --heading-color: #1a7abf;  /* Same blue for headings */
    --cmr-primary: #1a7abf;
    --cmr-primary-dark: #155f96;
    --cmr-sand: #f0e6d3;
    --cmr-white: #ffffff;
}

/* Override the dark theme variant too */
[data-theme=dark] {
    --btn-1: #2d99e0;
    --heading-color: #2d99e0;
}

/* ============================================================
   2. LOGO STYLES
   ============================================================ */
.cmr-logo-link {
    text-decoration: none !important;
}

.cmr-logo-text {
    font-family: 'Gilda Display', serif;
    font-size: 1.35rem;
    color: #ffffff;
    letter-spacing: 2px;
    display: inline-block;
    line-height: 1.2;
    white-space: nowrap;
}

.cmr-logo-footer {
    font-size: 1.5rem;
    display: block;
    margin-bottom: 5px;
}

/* Make logo visible on both light and dark header backgrounds */
.main__header .cmr-logo-text {
    color: #ffffff;
    text-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

/* ============================================================
   3. LANGUAGE SWITCHER
   ============================================================ */
.lang__switcher {
    display: flex;
    align-items: center;
    gap: 3px;
    margin-left: 10px;
    flex-wrap: nowrap;
}

.lang__btn {
    background: transparent;
    border: 1px solid rgba(255,255,255,0.4);
    color: rgba(255,255,255,0.70);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 2px 5px;
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: 'Jost', sans-serif;
    text-transform: uppercase;
    line-height: 1.4;
}

.lang__btn:hover,
.lang__btn.active {
    background: rgba(255,255,255,0.2);
    border-color: #ffffff;
    color: #ffffff;
}

/* ============================================================
   4. BANNER SUBTITLE
   is__home__three has a light grey background — text must be DARK
   ============================================================ */
.banner__slide__content p.banner__subtitle,
.banner__slide__content .banner__subtitle,
.banner__subtitle {
    font-size: 1.2rem;
    color: #111111 !important;
    margin-top: 15px;
    font-family: 'Jost', sans-serif;
    letter-spacing: 1px;
}

/* font-sm spans used as section descriptions (light backgrounds) */
.section__topbar .font-sm {
    color: #555f6e;
}

/* Section small labels above h2 (light backgrounds) */
.section__topbar .subtitle__icon__four,
.section__topbar .subtitle__icon__five {
    color: #333333;
}

/* facility__area cards — card text on light grey background */
.facility__area .card-text,
.facility__area .card-title {
    color: #333333 !important;
}

/* ============================================================
   5. APARTMENT CARD - add a bit more space for the CTA button
   ============================================================ */
.apartment__slide__content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.mt-15 {
    margin-top: 15px !important;
}

/* ============================================================
   6. FOOTER BOOKING BUTTONS
   ============================================================ */
.cmr-book-btn {
    display: block !important;
    width: 100%;
    text-align: center !important;
    padding: 10px 16px !important;
    font-size: 0.85rem;
    border-radius: 4px;
}

.gap-15 {
    gap: 15px !important;
}

/* ============================================================
   7. GALLERY - "see all" button margin
   ============================================================ */
.mt-40 {
    margin-top: 40px !important;
}

/* ============================================================
   8. SUBTITLE ICON COLORS - update to match Mediterranean palette
   ============================================================ */
.subtitle__icon__four::before,
.subtitle__icon__five::before {
    background-color: var(--cmr-primary) !important;
}

/* ============================================================
   9. HEADER TOP BAR - adjust layout for language switcher
   ============================================================ */
@media (max-width: 991px) {
    .header__top .location {
        display: none;
    }
    .lang__switcher {
        gap: 2px;
        margin-left: 6px;
    }
    .lang__btn {
        font-size: 9px;
        padding: 2px 4px;
    }
}
@media (max-width: 480px) {
    .header__top {
        display: flex !important;
        justify-content: flex-end;
        padding: 6px 15px;
    }
    .header__top .social__links {
        display: none;
    }
    .lang__switcher {
        margin-left: 0;
    }
}

/* ============================================================
   10. FOOTER — dark background + visible text (is__home__three uses light grey by default)
   ============================================================ */
.rts__footer.footer__background {
    background-color: #1c2b3a !important;
}
.rts__footer .widget__title {
    color: #ffffff !important;
}
.rts__footer p,
.rts__footer .font-sm {
    color: rgba(255,255,255,0.70) !important;
}
.rts__footer ul li a,
.rts__footer .link__item {
    color: rgba(255,255,255,0.70) !important;
}
.rts__footer ul li a:hover,
.rts__footer .link__item:hover {
    color: #ffffff !important;
}
.rts__footer .cmr-logo-text {
    color: #ffffff !important;
}
.copyright__text {
    border-top: 1px solid rgba(255,255,255,0.12) !important;
    background-color: rgba(0,0,0,0.2) !important;
}
.copyright__text p,
.copyright__text a {
    color: rgba(255,255,255,0.60) !important;
}

/* ============================================================
   11. DESKTOP NAVBAR — prevent word-wrap, compact spacing
   ============================================================ */
.navigation__menu--item__link {
    white-space: nowrap;
}
.navigation__menu--item {
    margin: 0 12px !important;
}
@media (min-width: 1200px) {
    .navigation__menu--item {
        margin: 0 16px !important;
    }
}

/* ============================================================
   12. APARTMENT RULES / NEARBY — remove double bullets
   ============================================================ */
.room__amenity .group__row .list__item {
    list-style: none;
    padding-left: 0;
}
.room__amenity .group__row .list__item li {
    list-style: none;
}

/* ============================================================
   13. PRINT / accessibility
   ============================================================ */
@media print {
    .lang__switcher,
    .rts__back__top,
    .loader-wrapper {
        display: none !important;
    }
}