/* Fix: contact details in white box on dark-bg section */
.map-view-wrap .contact-details li,
.map-view-wrap .contact-details li a,
.map-view-wrap .contact-details li span {
    color: #192C55 !important;
}
/* Coffee-Inspired Color Overrides for Chai Coffee Company */
/* Warm browns and coffee tones to replace dark blacks/grays */

/* Main dark background - rich coffee brown */
.dark-bg {
    background: #192C55 !important;
    color: rgba(255, 255, 255, 0.90);
}

/* Contrast: ensure default body text is readable on dark sections */
.dark-bg p,
.dark-bg li,
.dark-bg .footer-widget-content p,
.dark-bg .footer-contacts li,
.dark-bg .footer-contacts li span,
.dark-bg .subcribe-form p,
.dark-bg .contact-details li,
.dark-bg .contact-details li a {
    color: rgba(255, 255, 255, 0.84);
}

/* Footer background - warm coffee tone */
footer.fixed-footer:before {
    background: #192C55 !important;
}

/* Overlays - warm semi-transparent brown instead of black */
.overlay {
    background: #192C55 !important;
}

/* Card flip backs - coffee brown */
.content-inner .content-back {
    background: #192C55 !important;
}

/* Hero slider buttons - medium coffee brown */
.hero-slider_btn {
    background: #A1CA3A !important;
}

.hero-slider_btn:hover {
    background: rgba(25, 44, 85, 0.7) !important;
}

/* Box media zoom overlays */
.box-media-zoom:before,
.hov_zoom:before {
    background: rgba(25, 44, 85, 0.6) !important;
}

/* Team social buttons */
.team-social li a {
    background: rgba(25, 44, 85, 0.6) !important;
}

/* Carousel buttons */
.tc-button,
.ec-button,
.fs-slider-button-next,
.fs-slider-button-prev {
    background: rgba(25, 44, 85, 0.7) !important;
}

/* Gallery overlays - lighter for better visibility */
.gallery-item:before,
.portfolio-item:before {
    background: rgba(25, 44, 85, 0.3) !important;
}

/* Menu items and food cards */
.hero-menu-item .overlay {
    background: rgba(25, 44, 85, 0.7) !important;
}

/* Quote boxes and testimonials */
.quote-box:before {
    background: rgba(25, 44, 85, 0.6) !important;
}

/* Header cart and share wrappers */
.header-cart_wrap,
.share-wrapper {
    background: #A1CA3A !important;
}

/* Contrast: cart + share content were designed for light backgrounds */
.header-cart_wrap,
.share-wrapper {
    color: rgba(255, 255, 255, 0.90);
    border-color: rgba(255, 255, 255, 0.12) !important;
}

.header-cart_title,
.header-cart_wrap_total_item {
    color: rgba(255, 255, 255, 0.92) !important;
}

.header-cart_title span,
.widget-posts-descr_calc {
    color: rgba(255, 255, 255, 0.72) !important;
}

.box-widget-content .widget-posts-descr a {
    color: rgba(255, 255, 255, 0.90) !important;
}

.share-container a {
    color: rgba(255, 255, 255, 0.88) !important;
}

/* Additional dark elements */
.nav-holder nav li ul {
    background: #192C55 !important;
}

.reservation-modal-wrap {
    background: #192C55 !important;
}

/* DO NOT override loader/animation layers - they use background images for reveal effect */
/* .cd-loader-layer .loader-layer and .cd-tabs-layer .tabs-layer use ink2.png background */

/* Media container overlays */
.media-container .overlay {
    background: rgba(25, 44, 85, 0.5) !important;
}

/* Column section backgrounds */
.column-section-wrap.dark-bg,
.column-text_inside.dark-bg {
    background: #192C55 !important;
}

/* Parallax section overlays */
section.parallax-section .overlay {
    background: rgba(25, 44, 85, 1) !important;
}

/* Premium Header / Navbar */
.main-header .header-inner {
    background: transparent !important;
    opacity: 1 !important;
    border-bottom: 1px solid rgba(248, 153, 58, 0.18) !important;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.main-header .header-inner:before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(25, 44, 85, 0.92);
    z-index: -1;
}

.main-header .header-inner:after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.15'/%3E%3C/svg%3E");
    background-repeat: repeat;
    opacity: 0.6;
    mix-blend-mode: soft-light;
    pointer-events: none;
    z-index: -1;
}

.main-header .header-container {
    background: transparent !important;
}

.nav-holder nav li a {
    color: rgba(255, 255, 255, 0.88) !important;
    letter-spacing: 0.18em;
    font-size: 11px;
    padding: 8px 14px;
    transition: color 240ms ease, opacity 240ms ease, transform 240ms ease;
}

.nav-holder nav li a:after {
    content: '';
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 2px;
    height: 1px;
    background: rgba(248, 153, 58, 0.92);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.nav-holder nav li a:hover,
.nav-holder nav li a.act-link,
.nav-holder nav li a.act-scrlink {
    color: #F8993A !important;
}

.nav-holder nav li a:hover:after,
.nav-holder nav li a.act-link:after,
.nav-holder nav li a.act-scrlink:after {
    transform: scaleX(1);
}

/* Dropdown styling on dark header */
.nav-holder nav li ul {
    border: 1px solid rgba(248, 153, 58, 0.16) !important;
}

.nav-holder nav li ul a {
    color: rgba(255, 255, 255, 0.92) !important;
}

.nav-holder nav li ul a:hover {
    color: #F8993A !important;
}

.nav-holder nav li ul a:after {
    display: none;
}

/* Nav button (mobile) on dark header */
@media only screen and (max-width: 1064px) {
    .nav-button-wrap {
        border-left: 1px solid rgba(248, 153, 58, 0.14) !important;
    }

    .nav-button span {
        background: rgba(255, 255, 255, 0.9) !important;
    }

    .main-menu {
        background: rgba(25, 44, 85, 0.96) !important;
        border: 1px solid rgba(248, 153, 58, 0.18) !important;
        border-radius: 14px;
        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }

    .menusb a {
        letter-spacing: 0.16em;
    }
}

/* Premium Menu (grouped tabs + sections) */
.single-menu .hero-menu_header ul:before,
.single-menu .hero-menu_header ul:after {
    display: none !important;
}

.single-menu .hero-menu_header ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    padding: 18px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.9);
}

.single-menu .hero-menu_header li {
    margin: 0;
}

.single-menu .hero-menu_header li a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    border: 1px solid rgba(25, 44, 85, 0.16);
    background: rgba(255, 255, 255, 0.8);
    color: #192C55 !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    transition: transform 220ms ease, background 220ms ease, border-color 220ms ease, color 220ms ease;
}

.single-menu .hero-menu_header li.current a,
.single-menu .hero-menu_header li a:hover {
    background: rgba(25, 44, 85, 0.06);
    border-color: rgba(248, 153, 58, 0.55);
    color: #192C55 !important;
    transform: translateY(-1px);
}

.single-menu .hero-menu_header li a span {
    position: static;
    font-size: 12px;
    color: rgba(25, 44, 85, 0.6);
    letter-spacing: 0.22em;
}

.single-menu .hero-menu_content {
    border-radius: 18px;
}

/* Section headers inside tabs */
.single-menu .menu-section-title {
    grid-column: 1 / -1;
    margin: 18px 0 12px;
    padding-top: 14px;
    border-top: 1px solid rgba(25, 44, 85, 0.10);
}

.single-menu .menu-section-title:first-child {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}

.single-menu .menu-section-title h3 {
    margin: 0;
    font-family: 'Bebas Neue', sans-serif; font-weight: 400 !important;
    font-size: 22px;
    color: #192C55;
    letter-spacing: 0.02em;
}

/* Multi-column menu layout (reduces scrolling) */
.single-menu .tab-content {
    /* Keep template tab behavior (hidden by default), but when shown use grid */
    display: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    align-items: start;
}

/* First tab is visible on load (template uses .first-tab { display:block }) */
.single-menu .tab-content.first-tab {
    display: grid;
}

/* Template JS uses jQuery fadeIn(), which sets inline display:block; force grid when visible */
.single-menu .tab-content[style*="display: block"] {
    display: grid !important;
}

/* And preserve explicit inline hides */
.single-menu .tab-content[style*="display: none"] {
    display: none !important;
}

@media only screen and (min-width: 1200px) {
    .single-menu .tab-content {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.single-menu .hero-menu-item {
    width: auto !important;
    float: none !important;
    margin: 0;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(25, 44, 85, 0.10);
    border-radius: 14px;
    padding: 14px 16px;
}

/* The base template alternates padding via :nth-child(even); in our grid the presence of
   section headers makes that apply to seemingly "random" cards. Force uniform padding. */
.single-menu .tab-content > .hero-menu-item,
.single-menu .tab-content > .hero-menu-item:nth-child(odd),
.single-menu .tab-content > .hero-menu-item:nth-child(even) {
    padding: 14px 16px !important;
}

/* Completely isolated item header structure (prevents template floats/absolute rules) */
.single-menu .menu-item-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.single-menu .menu-item-name {
    margin: 0;
    min-width: 0;
    color: #192C55;
    font-weight: 600;
    line-height: 1.25;
}

.single-menu .menu-item-meta {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.single-menu .menu-item-price {
    white-space: nowrap;
    color: #192C55;
    font-family: 'Bebas Neue', sans-serif; font-weight: 400 !important;
    font-size: 18px;
}

.single-menu .menu-item-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 10px;
    border-radius: 999px;
    border: 1px solid rgba(248, 153, 58, 0.45);
    background: rgba(25, 44, 85, 0.04);
    color: #192C55;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    line-height: 1;
}

.single-menu .hero-menu-item-img {
    display: none !important;
}

.single-menu .hmi-dec {
    display: none !important;
}

.single-menu .hero-menu-item-title {
    float: none !important; /* neutralize .fl-wrap float so card height is stable */
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 8px;
    align-items: start;
}

.single-menu .hero-menu-item-title h6 {
    margin: 0;
    min-width: 0;
    color: #192C55;
    line-height: 1.25;
    font-weight: 600;
    grid-column: 1 / 2;
    grid-row: 1 / 3;
}

.single-menu .hero-menu-item-price {
    float: none;
    position: static;
    top: auto;
    white-space: nowrap;
    color: #192C55;
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    justify-self: end;
    font-size: 18px;
}

.single-menu .add_cart {
    float: none;
    position: static !important; /* override template absolute placement */
    opacity: 1 !important;
    visibility: visible !important;
    bottom: auto !important;
    right: auto !important;
    margin-left: 0;
    display: inline-flex;
    align-items: center;
    padding: 7px 10px;
    border-radius: 999px;
    border: 1px solid rgba(248, 153, 58, 0.45);
    background: rgba(25, 44, 85, 0.04);
    color: #192C55;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    justify-self: end;
    line-height: 1;
}

.single-menu .hero-menu-item-details p {
    max-width: none;
    margin-top: 8px;
    color: rgba(25, 44, 85, 0.80);
    line-height: 1.55;
}

@media only screen and (max-width: 768px) {
    .single-menu .hero-menu_header ul {
        gap: 8px;
        padding: 14px;
    }
    .single-menu .hero-menu_header li a {
        padding: 9px 12px;
        letter-spacing: 0.10em;
    }
    .single-menu .menu-section-title h3 {
        font-size: 20px;
    }

    .single-menu .tab-content {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

/* Adjust hero slider background position to move images down */
.fs-slider-item .bg {
    background-position: 50% 35%;
}


/* Dark Brush Decoration */
.brush-dec-dark {
    background: #192C55 !important;
    -webkit-mask-image: url(../images/bg/brush-dec.png);
    mask-image: url(../images/bg/brush-dec.png);
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat;
}