/*
 * WA Escapes theme
 * Loaded after custom.css / stellar.css on the public layouts.
 * Palette taken from the WA Escapes logo set; teal is the base colour.
 * --wae-base is deep enough that every part of the green-white logo
 * (mint WA, all three map pieces, light "escapes") stays visible on it.
 */
:root {
    --wae-base: #1F6B61;
    --wae-base-dark: #175C53;
    --wae-teal: #47AD99;
    --wae-mint: #7ADDCA;
    --wae-mint-tint: #EAF8F5;
    --wae-ink: #123F39;
    --wae-light: #EDEDED;
    --wae-salmon: #D9493C;
}

/* ---------- General ---------- */
body {
    color: var(--wae-ink);
}
a {
    color: var(--wae-base);
}
a:hover {
    color: var(--wae-base-dark);
}

/* ---------- Header ---------- */
.nt-main-navbar,
.top-bar .hoa-main-navbar {
    background-color: var(--wae-base);
}
.nt-main-navbar .navbar-brand img,
.top-bar .hoa-main-navbar .navbar-brand img {
    max-height: 64px;
    width: auto;
}
.nt-main-navbar .navbar-toggler {
    background-color: transparent !important;
    border-color: var(--wae-mint) !important;
}
.nt-main-navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(122,221,202,1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.top-navigation-bar .nav-link,
.top-navigation-bar .nav-link:hover {
    color: #fff !important;
}
.nt-main-navbar .navbar .navbar-nav li:hover {
    background-color: var(--wae-base-dark);
}
.nt-main-navbar .navbar .navbar-nav li:hover > .nav-link {
    color: var(--wae-mint) !important;
}
.top-navigation-bar .dropdown-menu {
    border-top: 3px solid var(--wae-mint);
}
.top-navigation-bar .dropdown-item:hover,
.top-navigation-bar .dropdown-item:focus {
    color: #fff;
    background-color: var(--wae-base);
}
.additional-nav-links .nav-email a,
.additional-nav-links .nav-phone a {
    color: var(--wae-mint);
}
.additional-nav-links .nav-open-hours {
    color: #fff;
}

/* ---------- Buttons ---------- */
.btn-danger {
    color: #fff;
    background-color: var(--wae-base);
    border-color: var(--wae-base);
}
.btn-danger:hover,
.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active {
    color: #fff;
    background-color: var(--wae-base-dark);
    border-color: var(--wae-base-dark);
}
.btn-danger:focus,
.btn-danger.focus,
.btn-danger:not(:disabled):not(.disabled):active:focus {
    box-shadow: 0 0 0 0.2rem rgba(71, 173, 153, 0.5);
}
.btn-outline-danger {
    color: var(--wae-base);
    border-color: var(--wae-base);
}
.btn-outline-danger:hover {
    color: #fff;
    background-color: var(--wae-base);
    border-color: var(--wae-base);
}

/* ---------- Pre-footer & footer ---------- */
.pre-footer {
    background-color: var(--wae-base);
}
.pre-footer-bar .pre-footer.sdc .container .pre-footer-content .row.mb-0 .footerheadings {
    color: var(--wae-mint) !important;
}
.pre-footer .pre-footer-box ul.detail-list a:hover,
.pre-footer .pre-footer-box .copyright a:hover {
    color: var(--wae-mint);
}
.pre-footer .fa-facebook-square,
.pre-footer .fa-instagram {
    color: var(--wae-mint);
}
.footer-sign-up.btn-danger {
    color: var(--wae-ink);
    background-color: var(--wae-mint);
    border-color: var(--wae-mint);
    font-weight: 600;
}
.footer-sign-up.btn-danger:hover {
    color: var(--wae-ink);
    background-color: #fff;
    border-color: #fff;
}
.footer {
    background: var(--wae-base-dark);
    border-top: 1px solid rgba(122, 221, 202, 0.25);
}
.footer .footer-logo {
    max-width: 220px;
    height: auto;
    margin-bottom: 0.75rem;
}
.footer .footer-tagline {
    color: var(--wae-mint);
    font-weight: 600;
    margin-bottom: 0.5rem;
}

/* ---------- Grey surfaces -> mint tint ---------- */
.map-container {
    background-color: var(--wae-mint-tint);
    background-image: none;
    border-color: var(--wae-mint);
}
.map-carousel-indicators li {
    background-color: var(--wae-teal);
}
.map-carousel-indicators li.active {
    background-color: var(--wae-base);
}
.bg-darkgrey {
    background-color: var(--wae-mint-tint);
}

/* ---------- Explore Western Australia map ---------- */
.wa-map-wrapper {
    text-align: center;
}
.wa-map-heading {
    color: var(--wae-base);
    font-family: 'futura-pt', sans-serif;
    font-weight: 700;
    font-size: 1.8rem;
    text-transform: uppercase;
    text-align: left;
    margin-bottom: 1rem;
}
.wa-map {
    width: 100%;
    max-width: 380px;
    height: auto;
    overflow: visible;
}
.wa-region {
    stroke: #fff;
    stroke-width: 3;
    stroke-linejoin: round;
    cursor: pointer;
    transition: filter 0.15s ease, opacity 0.15s ease;
}
.wa-region:hover,
.wa-region.is-active {
    filter: brightness(1.12) drop-shadow(0 2px 4px rgba(18, 63, 57, 0.35));
}
.wa-nw { fill: var(--wae-base); }
.wa-cc { fill: var(--wae-teal); }
.wa-pe { fill: var(--wae-salmon); }
.wa-sw { fill: #2F8F80; }
.wa-go { fill: var(--wae-mint); }
.wa-labels {
    pointer-events: none;
}
.wa-label {
    fill: #fff;
    font-family: 'futura-pt', sans-serif;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0.5px;
    text-anchor: middle;
}
.wa-label-sm { font-size: 12px; }
.wa-label-xs { font-size: 10px; }
.wa-label-dark,
.wa-label-out { fill: var(--wae-ink); }
.wa-sublabel {
    fill: var(--wae-mint);
    font-family: 'futura-pt', sans-serif;
    font-size: 8px;
    letter-spacing: 0.5px;
    text-anchor: middle;
}
.wa-perth-dot {
    fill: #fff;
    stroke: var(--wae-ink);
    stroke-width: 1.5;
}
.wa-map-hint {
    color: var(--wae-base);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 0.5rem;
}
.carousel-text.wa-nw-bg { background-color: var(--wae-base); }
.carousel-text.wa-cc-bg { background-color: #2F8F80; }
.carousel-text.wa-pe-bg { background-color: #B83A2F; }
.carousel-text.wa-sw-bg { background-color: var(--wae-base-dark); }
.carousel-text.wa-go-bg { background-color: #2A7D71; }
.map-carousel .map-carousel-slick .carousel-item-link-wrapper a {
    color: #fff;
}

/* ---------- Subscribe modal ---------- */
#subscribe2NTNow .modal-logo {
    max-width: 200px;
    height: auto;
    margin-bottom: 0.75rem;
}
