/* BO KEE shared header/footer overrides.
   Loaded after myCss.css to avoid stale static-cache issues on production. */
:root {
    --bokee-green: #075642;
    --bokee-green-dark: #043a2e;
    --bokee-red: #d7241f;
    --bokee-yellow: #f1c33a;
    --bokee-cream: #fbf2d8;
    --bokee-paper: #fff7df;
    --bokee-ink: #14362e;
    --bokee-muted: #6d6a5f;
}

.bokee-header {
    background: var(--bokee-green);
}

.bokee-header .top-icon .top-icon-list.bokee-header__icons .top-icon-link > a {
    background: var(--bokee-red);
    color: #fff;
}

.bokee-header .top-icon .top-icon-list.bokee-header__icons .top-icon-link > a:hover {
    background: #f5d75b;
    color: var(--bokee-green);
}

.fx-btn-area .fx-btn {
    background: var(--bokee-red);
}

@media (max-width: 991px) {
    .bokee-header.header .top-header.bokee-header__nav .navbar {
        min-height: 48px;
        justify-content: flex-end;
    }

    .bokee-header .navbar-toggler {
        position: static !important;
        top: auto !important;
        right: auto !important;
        transform: none !important;
        display: inline-flex;
        width: 42px;
        height: 34px;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 4px;
        padding: 0;
        margin: 7px 0 7px auto;
        border: 2px solid #e5bf4c;
        border-radius: 999px;
        background: var(--bokee-red);
    }

    .bokee-header .navbar-toggler .icon-bar {
        display: block;
        width: 18px;
        height: 2px;
        margin: 0;
        background: #fff7df;
    }

    .bokee-header.header .top-header.bokee-header__nav .top-menu nav .navbar-collapse {
        position: static;
        inset: auto;
        width: 100%;
        max-height: none;
        flex-basis: 100%;
        padding: 0;
        overflow: visible;
        background: #064334;
        opacity: 1;
        text-align: left;
        transform: none;
        transition: none;
    }

    .bokee-header.header .top-header.bokee-header__nav .top-menu nav .navbar-collapse:not(.show) {
        display: none !important;
    }

    .bokee-header.header .top-header.bokee-header__nav .top-menu nav .navbar-collapse.show {
        display: block !important;
    }

    .bokee-header.header .top-header.bokee-header__nav .navbar-nav {
        padding: 0;
    }

    .bokee-header.header .top-header.bokee-header__nav .navbar-nav > li > a,
    .bokee-header.header .top-header.bokee-header__nav .top-menu .collapse .top-icon-list .top-icon-link a {
        min-height: 44px;
        justify-content: center;
        border-top: 1px solid rgba(255, 247, 223, .14);
        color: #fff7df;
        font-size: 15px;
        letter-spacing: 0;
    }
}

@media (max-width: 767px) {
    .bokee-header__notice {
        min-height: 28px;
        padding: 5px 12px;
        text-align: center;
        font-size: 10px;
        line-height: 1.45;
    }

    .bokee-header__main {
        position: relative;
        padding: 8px 70px;
    }

    .bokee-header__main > .row {
        min-height: 62px;
        justify-content: center;
        margin-left: 0;
        margin-right: 0;
    }

    .bokee-header__main > .row > .position-relative {
        display: flex;
        max-width: 100%;
        flex: 0 0 100%;
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .bokee-header__main > .row > .text-right {
        display: none;
    }

    .bokee-header .bokee-header__logo {
        width: 148px;
        justify-content: center;
        margin: 0 auto;
    }

    .bokee-header .bokee-header__logo img {
        width: 148px;
        max-height: 52px;
    }

    .bokee-header__icons {
        gap: 5px;
    }

    .bokee-header .top-icon .top-icon-list.bokee-header__icons .top-icon-link > a {
        width: 28px;
        height: 28px;
        font-size: 12px;
    }

    .bokee-header .top-icon .top-icon-list.bokee-header__icons .top-icon-link > a i {
        font-size: 12px;
    }

    .bokee-header .top-icon .top-icon-list.bokee-header__icons .bag-number {
        right: -5px;
        bottom: -4px;
        min-width: 16px;
        height: 16px;
        padding: 0 3px;
        font-size: 10px;
        line-height: 16px;
    }

    .bokee-header .search-body {
        right: -72px;
        top: 38px;
        width: min(300px, calc(100vw - 24px));
        min-width: 0;
    }

    .bokee-header.header .top-header.bokee-header__nav {
        position: absolute;
        left: 0;
        right: 0;
        top: 28px;
        z-index: 40;
        height: 0;
        min-height: 0;
        border: 0;
        background: transparent;
        pointer-events: none;
    }

    .bokee-header.header .top-header.bokee-header__nav .container,
    .bokee-header.header .top-header.bokee-header__nav .top-menu,
    .bokee-header.header .top-header.bokee-header__nav .navbar {
        position: static;
        height: 0;
        min-height: 0;
        padding: 0;
        pointer-events: none;
    }

    .bokee-header.header .top-header.bokee-header__nav .navbar-toggler {
        position: absolute !important;
        top: 4px !important;
        right: 16px !important;
        width: 46px;
        height: 44px;
        margin: 0;
        border: 2px solid #fff !important;
        border-radius: 9px;
        background: #263039 !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
        pointer-events: auto;
    }

    .bokee-header.header .top-header.bokee-header__nav .navbar-toggler .icon-bar {
        width: 23px;
        height: 3px;
        background: #fff !important;
    }

    .bokee-header.header .top-header.bokee-header__nav .top-menu nav .navbar-collapse {
        position: absolute;
        left: 0;
        right: 0;
        top: 64px;
        width: 100%;
        max-height: calc(100vh - 104px);
        overflow-y: auto;
        border-top: 1px solid rgba(255, 247, 223, .18);
        border-bottom: 4px solid #d6aa28;
        background: #064334;
        box-shadow: 0 14px 28px rgba(0, 0, 0, .24);
        pointer-events: auto;
    }

    .bokee-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 34px 28px;
        padding: 44px 0 38px;
    }

    .bokee-home-page .bokee-footer,
    .bokee-footer {
        background-color: var(--bokee-green-dark) !important;
        background-image: url("../images/bokee/news-bg.jpg?v1.032") !important;
        background-repeat: repeat !important;
        background-size: 512px 512px !important;
        color: #fff7df !important;
    }

    .bokee-footer__brand {
        grid-column: 1 / -1;
    }

    .bokee-footer__brand-head {
        display: block;
        margin-bottom: 14px;
    }

    .bokee-footer__logo {
        display: none;
    }

    .bokee-footer h3 {
        margin-bottom: 14px;
        color: #f1c33a;
        font-size: 20px;
        line-height: 1.35;
    }

    .bokee-footer h4 {
        margin-bottom: 14px;
        color: #f1c33a;
        font-size: 18px;
        line-height: 1.35;
    }

    .bokee-footer__brand-head strong,
    .bokee-footer__social,
    .bokee-footer__links .bokee-footer__col:nth-child(2) {
        display: none;
    }

    .bokee-footer__links,
    .bokee-footer__contact {
        display: block;
        min-width: 0;
        padding-left: 0;
        border-left: 0;
    }

    .bokee-footer__contact h4 {
        font-size: 0;
    }

    .bokee-footer__contact h4:before {
        content: "聯絡我們";
        font-size: 18px;
    }

    .bokee-home-page .bokee-footer p,
    .bokee-home-page .bokee-footer li,
    .bokee-home-page .bokee-footer a,
    .bokee-footer p,
    .bokee-footer li,
    .bokee-footer a {
        color: rgba(255, 247, 223, .86) !important;
        font-size: 13px;
        line-height: 1.85;
    }

    .bokee-footer__contact li {
        display: block;
        margin-bottom: 6px;
        word-break: break-word;
    }

    .bokee-footer__contact i {
        display: none;
    }

    .bokee-footer__copyright {
        border-top: 1px solid rgba(255, 247, 223, .14);
        padding: 10px 14px;
        background: rgba(0, 0, 0, .18);
    }

    .bokee-footer__copyright p {
        color: #fff !important;
        font-size: 13px;
        line-height: 1.5;
    }

    .fx-btn-mo {
        display: none !important;
    }

    .fx-btn-area {
        right: 8px;
        bottom: 82px;
        width: 42px;
        opacity: 1;
        z-index: 9999;
    }

    .fx-btn-area .fx-btn {
        display: flex !important;
        width: 38px;
        height: 38px;
        align-items: center;
        justify-content: center;
        margin-bottom: 10px;
        border: 0;
        border-radius: 50%;
        background: #555 !important;
        line-height: 1;
        opacity: .95;
    }

    .fx-btn-area .fx-btn:not(.fx-btn-cart):not(.fx-btn-phone):not(.cd-top) {
        display: none !important;
    }

    .fx-btn-area .fx-btn i {
        color: #fff;
        font-size: 17px;
    }

    .fx-btn-area .cd-top {
        visibility: visible;
        opacity: .95;
    }
}

@media (max-width: 374px) {
    .bokee-header .bokee-header__logo,
    .bokee-header .bokee-header__logo img {
        width: 132px;
    }

    .bokee-header__icons {
        gap: 3px;
    }

    .bokee-header .top-icon .top-icon-list.bokee-header__icons .top-icon-link > a {
        width: 26px;
        height: 26px;
    }
}