/* Hotel Yak & Yeti — matches https://www.yakandyeti.com (Joomla custom.css + Horizon less vars).
   Brand palette lives here until "Recompile style" writes theme.1.css from the customizer. */

@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@300;400;500;700&family=Roboto+Condensed:wght@200;300;400&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;1,300&family=Work+Sans:wght@500;700&display=swap");

/* —— Brand bridge (stock YOOtheme → Yak & Yeti) —— */
:root {
    --yny-navy: #41597a;
    --yny-gold: #be9f5d;
    --yny-gold-btn: #bc9d5d;
    --yny-cream: #fffef6;
    --yny-page: #fbede2;
    --yny-border: #f5e2d1;
    --yny-link: #435a7b;
    --yny-heading: #41597a;
    --yny-body: #1b1818;
    --yny-muted-text: #495560;
}

/* Typography — matched to live yakandyeti.com computed styles */
body,
html {
    font-family: Roboto, sans-serif;
    font-size: 15px;
    font-weight: 300;
    line-height: 1.6;
    color: var(--yny-body);
}

body {
    background: var(--yny-page);
}

.uk-h1, h1 {
    font-family: "Playfair Display", serif;
    font-size: 40px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--yny-heading);
}

.uk-h2, h2 {
    font-family: "Playfair Display", serif;
    font-size: 30px;
    font-weight: 300;
    line-height: 1.3;
    color: var(--yny-heading);
}

.uk-h3, h3 {
    font-family: "Playfair Display", serif;
    font-size: 24px;
    font-weight: 300;
    line-height: 1.4;
    color: var(--yny-heading);
}

.uk-h4, h4 {
    font-family: Roboto, sans-serif;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.4;
    color: var(--yny-muted-text);
}

.uk-h5, h5,
.uk-h6, h6 {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--yny-muted-text);
}

.uk-heading-primary {
    font-family: "Playfair Display", serif;
    font-size: 45px;
    font-weight: 100;
    line-height: 1.2;
    color: var(--yny-heading);
}

.uk-heading-medium,
.uk-heading-small {
    font-family: "Playfair Display", serif;
    color: var(--yny-heading);
}

.uk-text-small {
    font-size: 13px;
    line-height: 1.3;
}

/* Card / blog titles — live sets these via builder element CSS + uk-h3;
   local home cards use uk-h3/uk-h4, so nudge to the same computed sizes. */
a.uk-link-toggle .el-title.uk-h3,
.uk-link-toggle .el-title.uk-h3 {
    font-size: 18px;
    font-weight: 300;
    line-height: 1.4;
}

.el-title.uk-h4 {
    font-family: "Playfair Display", serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 1.4;
    letter-spacing: normal;
    text-transform: none;
    color: var(--yny-heading);
}

a {
    color: var(--yny-link);
}

.uk-link-heading:hover,
a.uk-link-heading:hover {
    color: var(--yny-gold);
}

/* Primary / secondary surfaces */
.uk-button-primary,
.uk-section-primary:not(.uk-preserve-color),
.uk-card-primary.uk-card-body,
.uk-card-primary > :not([class*="uk-card-media"]),
.uk-tile-primary,
.uk-background-primary {
    background-color: var(--yny-gold) !important;
}

.uk-button,
.uk-button-primary,
.uk-button-secondary,
.uk-button-default,
.uk-button-text {
    font-family: "Work Sans", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase;
}

.uk-button-primary {
    background-color: var(--yny-gold-btn) !important;
    color: #fff !important;
    border-color: transparent !important;
    border-radius: 0;
}

.uk-button-primary:hover,
.uk-button-primary:focus {
    background-color: #a8894f !important;
    color: #fff !important;
}

.uk-section-secondary:not(.uk-preserve-color),
.uk-card-secondary.uk-card-body,
.uk-tile-secondary,
.uk-background-secondary,
.uk-navbar-container:not(.uk-navbar-transparent),
.uk-offcanvas-bar,
.uk-navbar-dropdown {
    background-color: var(--yny-navy) !important;
}

.uk-overlay-primary {
    background: rgba(65, 89, 122, 0.8) !important;
}

.uk-overlay-default {
    background: rgba(255, 254, 246, 0.8) !important;
}

.uk-offcanvas-overlay::before {
    background: rgba(65, 89, 122, 0.79) !important;
}

.uk-background-muted,
.uk-section-muted:not(.uk-preserve-color),
.uk-tile-muted {
    background-color: #fff !important;
}

.uk-background-default,
.uk-section-default:not(.uk-preserve-color) {
    background-color: var(--yny-cream);
}

/* Nav (transparent header over hero) */
.tm-header .uk-navbar-nav > li > a,
.tm-header.uk-light .uk-navbar-nav > li > a {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 14px !important;
    font-weight: 200 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase;
    color: #fff !important;
}

.tm-header .uk-navbar-nav > li.uk-active > a,
.tm-header .uk-navbar-nav > li > a:hover,
.tm-header .uk-navbar-nav > li > a:focus {
    color: #fff !important;
}

/* Live Joomla style has navbar line mode off — no underline on hover/active */
.uk-navbar-nav > li > a::before,
.uk-navbar-nav > li.uk-active > a::before,
.uk-navbar-nav > li:hover > a::before,
.uk-navbar-nav > li > a:hover::before,
.uk-navbar-nav > li > a:focus::before,
.uk-navbar-nav > li > a::after,
.uk-navbar-nav > li.uk-active > a::after,
.uk-navbar-nav > li:hover > a::after {
    content: none !important;
    display: none !important;
    background: none !important;
    border: 0 !important;
    height: 0 !important;
    width: 0 !important;
}

.uk-navbar-dropdown-nav > li > a {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 12px !important;
    color: #fff !important;
}

.uk-navbar-dropdown-nav > li > a:hover,
.uk-navbar-dropdown-nav > li.uk-active > a {
    color: var(--yny-gold-btn) !important;
}

.uk-slidenav {
    color: #dbb66b !important;
}

.uk-slidenav:hover {
    color: #dbb66b !important;
}

/* Toolbar */
.tm-toolbar {
    position: relative;
    z-index: 990;
    padding-top: 10px;
    padding-bottom: 10px;
    background: rgba(236, 236, 236, 0);
    color: #fff;
    font-family: "Roboto Condensed", sans-serif;
    font-size: 13px;
    font-weight: 300;
}

/* Pages without a transparent header: solid toolbar so white links stay readable. */
.tm-toolbar-default,
.tm-header:not(.tm-header-overlay) .tm-toolbar {
    background: #41597a;
}

.tm-toolbar a,
.tm-toolbar a:hover,
.tm-toolbar .uk-icon {
    font-family: "Roboto Condensed", sans-serif;
    font-size: 11px;
    font-weight: 300;
    color: #fff;
    text-decoration: none;
}

.tm-toolbar a:hover {
    opacity: .8;
}

/* Header logo: white plaque overlapping the hero */
.tm-header .uk-navbar-container .uk-logo {
    position: relative;
    align-self: flex-start;
    padding: 0;
    width: 200px;
    min-height: 0;
    box-shadow: 0 0 5px -1px rgba(0, 0, 0, .61);
    z-index: 2;
}

.tm-header .uk-navbar-container .uk-logo img {
    width: 200px !important;
    background: rgba(255, 255, 255, .25) !important;
}

.tm-header .uk-navbar-sticky .uk-logo {
    align-self: center;
    width: 45px;
    height: 45px;
    box-shadow: none;
    background: url(../../../uploads/images/assets/icon.svg) center / contain no-repeat;
}

.tm-header .uk-navbar-sticky .uk-logo img {
    display: none;
}

/* Hero top fade — exact match to live Joomla custom.css */
.uk-position-cover,
.cnc-overlay .uk-position-cover {
    background: rgba(0, 0, 0, 0.87);
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.87) 0%,
        rgba(0, 0, 0, 0) 35%,
        rgba(0, 0, 0, 0) 100%
    ) !important;
}

/* Modals (packages, popups) */
.uk-modal-dialog {
    background: #41597a url(../img/pattern-modal.png) center / 600px no-repeat;
    color: #fff;
}

.uk-modal-dialog h2.uk-modal-title {
    color: #bc9d5d;
}

.uk-modal-dialog .uk-tab .uk-active a {
    color: #bc9d5d;
}

.uk-modal-dialog .uk-list-bullet > li::before {
    background-image: unset;
    background-color: rgba(255, 255, 255, 0.7);
    width: 4px;
    height: 4px;
    top: 10px;
    left: 1rem;
    border-radius: 50%;
}

/* Builder helpers used in the layouts */
.cnc-bread li {
    display: inline !important;
    text-align: center !important;
}

.cnc-booking-button {
    background: #bc9d5d;
}

.uk-card.uk-card-default.cnc-reserve {
    background: #fff;
}

.cnc-margin-small.uk-list > li:nth-child(n+2) {
    margin-top: 2px !important;
}

.reviews span {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-style: italic;
}

.cnc-fixed-height {
    min-height: 650px;
}

.cnc-card-black {
    background: rgba(0, 0, 0, .9);
    color: #fff;
}

.cnc-shadow-box {
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, .15);
}

.cnc-mobile-slideshow .uk-slideshow-items {
    margin-top: -15px !important;
}

/* Award badges (home) */
.award-badge-container {
    padding: 5px 0 5px 5px;
    border: 3px solid #96845e;
    border-right: none;
    border-radius: 58px 0 0 58px;
    background: #fff;
}

.award-badge-container img {
    height: 107px;
    border-radius: 50px 0 0 50px;
}

.header-award-logo {
    display: flex;
    align-items: center;
    height: 107px;
    padding: 0 13px;
    background-color: #a6946c;
    box-shadow: 0 0 5px -1px rgba(0, 0, 0, .61);
}

.uk-navbar-sticky .header-award-logo {
    display: none;
}

.header-award-logo img {
    height: 64px;
}

/* Widgetkit "Accomodation list" / "Dining list" grids, now YOOtheme grids */
.yny-room-grid .el-item {
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 6px 50px rgba(0, 0, 0, .05);
}

/* SynXis booking form (desktop + mobile) */
#bookingForm .booking-form > div,
#bookingForm-mobile .booking-form > div {
    display: inline-block;
    float: none;
    vertical-align: bottom;
}

.yny-booking .abs_parent {
    width: 80%;
    margin: auto;
}

#bookingForm .form-group.date-parameter-block,
#bookingForm-mobile .form-group.date-parameter-block {
    width: 19%;
    padding: 0 6px;
}

#bookingForm .adult-wrapper,
#bookingForm .child-wrapper,
#bookingForm-mobile .adult-wrapper,
#bookingForm-mobile .child-wrapper {
    width: 8%;
    padding: 0 6px;
}

#bookingForm .form-group.promo-block,
#bookingForm-mobile .form-group.promo-block {
    width: 15%;
    padding: 0 6px;
}

#bookingForm .adult-wrapper select,
#bookingForm .child-wrapper select,
#bookingForm-mobile .adult-wrapper select,
#bookingForm-mobile .child-wrapper select {
    padding: 5px 10px;
    height: 42px;
}

#bookingForm .form-control,
#bookingForm-mobile .form-control {
    font-size: 14px;
    height: 40px;
    cursor: pointer;
    width: 100%;
    box-shadow: none;
}

#bookingForm .btn-wrapper input.btn.btn-full-width,
#bookingForm-mobile .btn-wrapper input.btn.btn-full-width {
    height: 42px;
    padding: 0 16px;
    border: 0;
    color: #fff;
    background: #bc9d5d;
    cursor: pointer;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

#bookingForm .date-parameter-block .fa.fa-calendar:before,
#bookingForm-mobile .date-parameter-block .fa.fa-calendar:before {
    content: "\f073";
}

#bookingForm .dp-holder,
#bookingForm-mobile .dp-holder {
    width: 100%;
    position: relative;
    height: 40px;
    border-radius: 0;
    background-color: #fff;
}

#bookingForm .dp-holder .form-control,
#bookingForm-mobile .dp-holder .form-control {
    position: absolute;
    top: 0;
    left: 0;
    background-color: transparent;
    border: 1px solid #c8b4a4;
    z-index: 1;
}

#bookingForm .dp-holder span,
#bookingForm-mobile .dp-holder span {
    float: right;
    margin-top: 11px;
    margin-right: 10px;
}

#bookingForm .dp-holder input,
#bookingForm-mobile .dp-holder input {
    border: none;
}

#bookingForm .promo-block input,
#bookingForm-mobile .promo-block input {
    height: 42px;
    width: 100%;
    border: 1px solid #c8b4a4;
    padding: 0 10px;
    box-sizing: border-box;
}

#bookingForm .btn-wrapper,
#bookingForm-mobile .btn-wrapper {
    margin-left: 10px;
}

#booking-form,
#booking-form-mobile {
    position: relative;
    padding: 20px 0;
    float: none;
    text-align: left;
    margin: 0 auto;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.yny-booking--bar {
    padding: 25px 0;
}

.yny-booking--bar label {
    display: block;
    margin-bottom: 4px;
    font-family: Roboto, sans-serif;
    font-size: 15px;
    font-weight: 300;
    color: #41597a;
}

/* Home booking strip — white bar under the hero (not overlaid on the video) */
.uk-section:has(.banner-booking-form),
.uk-section:has(.yny-booking--banner),
.uk-section:has(.yny-booking-bar) {
    position: relative !important;
    background: #f5f5f5 !important;
    padding: 0 !important;
    z-index: 2;
}

.banner-booking-form,
.yny-booking--banner,
.yny-booking-bar {
    position: static;
    width: 100%;
    background: #f5f5f5;
}

.banner-booking-form .abs_parent,
.yny-booking-bar .abs_parent {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

.banner-booking-form #booking-form,
.banner-booking-form #booking-form-mobile,
.yny-booking-bar #booking-form,
.yny-booking-bar #booking-form-mobile {
    align-items: flex-end;
    justify-content: center;
    padding: 28px 0;
}

.banner-booking-form label,
.yny-booking--banner label,
.yny-booking-bar label {
    display: block;
    margin-bottom: 6px;
    padding-left: 0;
    font-family: Roboto, sans-serif;
    font-size: 15px;
    font-weight: 300;
    line-height: 1.6;
    color: #333 !important;
}

.banner-booking-form #bookingForm .form-group.date-parameter-block,
.banner-booking-form #bookingForm .adult-wrapper,
.banner-booking-form #bookingForm .child-wrapper,
.banner-booking-form #bookingForm .form-group.promo-block,
.banner-booking-form #bookingForm-mobile .form-group.date-parameter-block,
.banner-booking-form #bookingForm-mobile .adult-wrapper,
.banner-booking-form #bookingForm-mobile .child-wrapper,
.banner-booking-form #bookingForm-mobile .form-group.promo-block,
.yny-booking-bar #bookingForm .form-group.date-parameter-block,
.yny-booking-bar #bookingForm .adult-wrapper,
.yny-booking-bar #bookingForm .child-wrapper,
.yny-booking-bar #bookingForm .form-group.promo-block,
.yny-booking-bar #bookingForm-mobile .form-group.date-parameter-block,
.yny-booking-bar #bookingForm-mobile .adult-wrapper,
.yny-booking-bar #bookingForm-mobile .child-wrapper,
.yny-booking-bar #bookingForm-mobile .form-group.promo-block {
    margin: 0 8px;
    padding: 0;
    background: transparent;
}

.banner-booking-form #bookingForm .btn-wrapper input.btn.btn-full-width,
.banner-booking-form #bookingForm-mobile .btn-wrapper input.btn.btn-full-width,
.yny-booking-bar #bookingForm .btn-wrapper input.btn.btn-full-width,
.yny-booking-bar #bookingForm-mobile .btn-wrapper input.btn.btn-full-width {
    font-family: "Work Sans", sans-serif;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    background: #b6bac1;
    color: #1b1818;
    min-width: 120px;
}

@media (max-width: 768px) {
    #booking-form,
    #booking-form-mobile {
        display: flex;
        flex-wrap: wrap;
    }

    #bookingForm .form-group.date-parameter-block,
    #bookingForm-mobile .form-group.date-parameter-block {
        width: 45%;
    }

    #bookingForm .booking-form .btn-wrapper,
    #bookingForm-mobile .booking-form .btn-wrapper {
        width: 100%;
        text-align: center;
        margin-left: 0;
        margin-top: 12px;
    }

    #bookingForm .adult-wrapper,
    #bookingForm .child-wrapper,
    #bookingForm-mobile .adult-wrapper,
    #bookingForm-mobile .child-wrapper {
        width: 25%;
    }

    #bookingForm .form-group.promo-block,
    #bookingForm-mobile .form-group.promo-block {
        width: 34%;
    }

    .yny-booking .abs_parent {
        width: 94%;
    }
}

@media (max-width: 480px) {
    #bookingForm .form-group.promo-block,
    #bookingForm-mobile .form-group.promo-block {
        width: 45%;
    }

    #bookingForm .adult-wrapper,
    #bookingForm .child-wrapper,
    #bookingForm-mobile .adult-wrapper,
    #bookingForm-mobile .child-wrapper {
        width: 20%;
    }
}

/* Forms (RSForm replacements) */
.yny-form .uk-form-label,
.yny-fieldset legend {
    margin-bottom: 4px;
    font-size: 13px;
    color: #41597a;
}

.yny-fieldset {
    border: 0;
    padding: 0;
    margin: 0;
}

.yny-choices {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 24px;
}

.yny-choices label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.yny-required {
    color: #c0392b;
}

.yny-form__heading {
    margin: 16px 0 0;
    padding-bottom: 6px;
    border-bottom: 1px solid #f5e2d1;
    font-size: 1.15rem;
}

.yny-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.uk-modal-dialog .yny-form .uk-form-label {
    color: #fff;
}

/* Mobile / tablet — match live Joomla custom.css @max-width 960px */
@media (max-width: 959px) {
    .tm-header-mobile {
        background: #41597a;
    }

    .tm-header-mobile .uk-navbar-container,
    .tm-header-mobile .uk-navbar-container.uk-navbar-transparent {
        background: #41597a !important;
    }

    .tm-header-mobile .uk-logo,
    .tm-header .uk-navbar-container .uk-logo,
    .uk-navbar-container .uk-logo {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: auto !important;
        height: 50px !important;
        padding: 0 !important;
        box-shadow: none !important;
        align-self: center;
        min-height: 0;
    }

    .tm-header-mobile .uk-logo img,
    .tm-header .uk-navbar-container .uk-logo img,
    .uk-navbar-container .uk-logo img {
        width: 60px !important;
        max-width: 60px !important;
        height: auto !important;
        margin-top: 0;
        background: transparent !important;
    }

    .tm-header-mobile .uk-navbar-toggle,
    .tm-header-mobile .uk-navbar-toggle-icon,
    .tm-header-mobile .uk-navbar-item {
        color: #fff !important;
    }
}

/* Mobile offcanvas menu — match live (Roboto 22/300, white / 50% white) */
#tm-dialog-mobile .uk-offcanvas-bar,
.uk-offcanvas-bar {
    background-color: var(--yny-navy) !important;
}

#tm-dialog-mobile .uk-nav > li > a,
.uk-offcanvas-bar .uk-nav > li > a,
#tm-dialog-mobile .uk-nav-default > li > a {
    font-family: Roboto, sans-serif !important;
    font-size: 22px !important;
    font-weight: 300 !important;
    line-height: 1.6;
    text-align: center;
    text-transform: none;
    color: rgba(255, 255, 255, 0.5) !important;
}

#tm-dialog-mobile .uk-nav > li.uk-active > a,
.uk-offcanvas-bar .uk-nav > li.uk-active > a,
#tm-dialog-mobile .uk-nav > li > a:hover,
.uk-offcanvas-bar .uk-nav > li > a:hover {
    color: #fff !important;
}

#tm-dialog-mobile .uk-nav .uk-nav-sub a,
.uk-offcanvas-bar .uk-nav .uk-nav-sub a {
    font-family: "Roboto Condensed", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #fff !important;
}

.alert-danger,
.alert-error {
    display: none !important;
}