/* Naso Restaurant custom theme - Burnt Orange (Terracotta) */
:root {
  --naso-primary: #C45A1A;          /* burnt orange */
  --naso-primary-dark: #9A4514;     /* deeper burnt */
  --naso-primary-contrast: #ffffff; /* text on primary */
  --naso-accent: #E0722A;           /* lighter accent */
  --naso-deep: #2a1a12;             /* dark background */
}

/* Primary text accents */
.text-primary {
  color: var(--naso-primary) !important;
}

/* Buttons */
.btn-primary {
  background-color: var(--naso-primary) !important;
  border-color: var(--naso-primary) !important;
  color: var(--naso-primary-contrast) !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--naso-primary-dark) !important;
  border-color: var(--naso-primary-dark) !important;
}

/* Links & nav */
.navbar-dark.bg-dark {
  backdrop-filter: saturate(120%) blur(6px);
  -webkit-backdrop-filter: saturate(120%) blur(6px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.navbar-dark .navbar-brand,
.navbar-dark .nav-link {
  color: rgba(255,255,255,0.85) !important;
}
.navbar-brand img { height: 64px; width: auto; margin-right: 12px; }
.navbar-dark .navbar-brand span { font-size: 1.5rem; font-weight: 700; }
.navbar-dark .nav-link:hover,
.navbar-dark .nav-link:focus,
.navbar-dark .nav-link.active {
  color: var(--naso-accent) !important;
}

/* Header-content like spacing and underline hover */
header .navbar { padding-top: 10px; padding-bottom: 10px; position: sticky; top: 0; z-index: 1030; }
.navbar > .container, .navbar > .container-fluid { flex-wrap: nowrap !important; }
/* On mobile, collapsed menu should drop below navbar without breaking layout */
@media (max-width: 991.98px) {
  .navbar-collapse { position: absolute; top: 100%; left: 0; right: 0; background: rgba(20, 12, 8, 0.95); padding: 1rem; backdrop-filter: saturate(120%) blur(6px); -webkit-backdrop-filter: saturate(120%) blur(6px); border-top: 1px solid rgba(255, 255, 255, 0.08); }
  .navbar-collapse.collapse:not(.show) { display: none; }
  .navbar-collapse.collapse.show { display: block; }
}
.navbar-nav.ml-auto.pl-lg-5 .nav-link { text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; padding: .75rem 1rem; position: relative; }
.navbar-nav.ml-auto.pl-lg-5 .nav-link:after { content: ""; position: absolute; left: 1rem; right: 1rem; bottom: .4rem; height: 2px; background: transparent; transition: background .2s ease; }
.navbar-nav.ml-auto.pl-lg-5 .nav-link:hover:after, .navbar-nav.ml-auto.pl-lg-5 .nav-link.active:after { background: var(--naso-accent); }
.cta-btn .nav-link { background: var(--naso-primary); color: var(--naso-primary-contrast) !important; border-radius: 999px; padding: .5rem 1rem; margin-left: .5rem; border: 1px solid var(--naso-primary); }
.cta-btn .nav-link:hover { background: var(--naso-primary-dark); border-color: var(--naso-primary-dark); }

/* Minor accents */
.back-text,
.back-text-dark {
  color: rgba(196, 90, 26, 0.12) !important; /* subtle background label */
}

/* Carousel dots / highlights (if present) */
.owl-theme .owl-dots .owl-dot span {
  background: rgba(196, 90, 26, 0.4) !important;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: var(--naso-primary) !important;
}

/* Footer links */
.site-footer a { color: #d8b9ab; }
.site-footer a:hover { color: var(--naso-accent); }

/* Price / badges if any */
.dishes-price,
.badge-primary {
  color: var(--naso-primary);
  border-color: var(--naso-primary);
}

/* Utility */
.border-primary { border-color: var(--naso-primary) !important; }
.bg-primary { background-color: var(--naso-primary) !important; color: var(--naso-primary-contrast) !important; }

/* Form controls */
select.form-control:not([size]):not([multiple]) {
  height: calc(3.25rem + 2px);
}

/* -------------------- Responsive tweaks -------------------- */
@media (max-width: 992px) {
  .navbar-brand img { height: 48px !important; }
  .navbar-dark .navbar-brand span { font-size: 1.25rem; }
  .navbar-nav.ml-auto.pl-lg-5 .nav-link { padding: .6rem .85rem; }
}

@media (max-width: 768px) {
  /* Explicitly relax full-viewport heights on mobile to allow page scroll */
  .owl-carousel.home-slider .slider-item,
  .owl-carousel.home-slider-loop-false .slider-item { height: auto; min-height: 360px; }
  .owl-carousel.home-slider .slider-item .slider-text,
  .owl-carousel.home-slider-loop-false .slider-item .slider-text { height: auto; min-height: 360px; }
  /* Hero slider height and overlay spacing */
  .home-slider, .home-slider-loop-false, .slider-item { min-height: 360px; }
  .slider-item .container { padding-top: 40px; padding-bottom: 40px; }
  .slider-item h1 { font-size: 2rem; line-height: 1.2; }
  .slider-item p.mb-5 { margin-bottom: 1rem !important; }
  .btn { padding: 0.5rem 0.9rem; font-size: 0.95rem; }

  /* Cards/sections spacing */
  .section { padding-top: 2rem; padding-bottom: 2rem; }
  .heading-wrap h2 { font-size: 1.6rem; }
  .heading-wrap .back-text, .heading-wrap .back-text-dark { font-size: 2.2rem; }

  /* Grid images used as backgrounds */
  .bg-image { min-height: 180px; background-size: cover; background-position: center; }

  /* Footer stacks cleanly */
  .site-footer .mb-5 { margin-bottom: 1.25rem !important; }
  .site-footer h3 { font-size: 1.05rem; }
}

@media (max-width: 576px) {
  .navbar-brand img { height: 36px !important; }
  .navbar-dark .navbar-brand span { font-size: 1.1rem; }
  .slider-item { min-height: 320px; }
  .slider-item h1 { font-size: 1.6rem; }
  .slider-item .btn { display: inline-block; }

  /* Make CTA buttons easier to tap */
  .btn, .nav-link { line-height: 1.4; }

  /* Newsletter form vertical stacking */
  .py-5 .row.align-items-center > [class^="col-"] { margin-bottom: 0.75rem; }
}

/* Prevent horizontal scroll lock and allow touch scrolling */
html, body { 
  overflow-x: hidden; 
  -webkit-overflow-scrolling: touch;
}
body { 
  -webkit-overflow-scrolling: touch; 
  touch-action: pan-y;
  -ms-touch-action: pan-y;
}

/* Enable touch/swipe on all carousels */
.home-slider,
.owl-carousel,
.centernonloop {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.home-slider,
.owl-carousel,
.owl-stage-outer,
.owl-stage,
.owl-item,
.item-dishes {
  touch-action: pan-y !important;
  -ms-touch-action: pan-y !important;
}

/* Allow horizontal drag on carousel containers */
.owl-carousel .owl-stage-outer {
  touch-action: pan-x pan-y !important;
  -ms-touch-action: pan-x pan-y !important;
  cursor: grab;
  cursor: -webkit-grab;
}

.owl-carousel .owl-stage-outer:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}

/* Our Story (About) mobile fixes to prevent horizontal overflow */
@media (max-width: 768px) {
  /* Keep carousel nav inside viewport */
  .owl-carousel.major-caousel .owl-nav .owl-prev { left: 8px !important; }
  .owl-carousel.major-caousel .owl-nav .owl-next { right: 8px !important; }

  /* Reduce huge background label to avoid edge bleed */
  .heading-wrap { overflow: hidden; }
  .heading-wrap .back-text,
  .heading-wrap .back-text-dark { font-size: 5rem; left: 50%; }

  /* Ensure padded columns don’t push content wider than screen */
  .pl-2 { padding-left: .5rem !important; }
}

/* Ensure dropdowns don't force fixed heights on mobile */
@media (max-width: 991px) {
  header .navbar { position: relative; background: #000 !important; }
  header { position: relative; }
}

/* -------------------- Locations Page Image Sizing -------------------- */
/* Make location images smaller on desktop */
@media (min-width: 1080px) {
  .img-fluid {
    max-width: 75%;
    height: auto;
  }
}

/* Make location images smaller and centered on mobile */
@media (max-width: 749px) {
  .img-fluid {
    max-width: 70%;
    height: auto;
    display: block;
    margin: 0 auto 1.5rem auto;
  }
}