* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Nunito Sans', sans-serif; background: #f5f5f5; }

/* ══ TOP NAVBAR ══ */
.navbar-top {
  background: #fff;
  padding: 0 32px;
  height: 68px;
  display: flex;
  align-items: center;
  gap: 20px;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
  position: sticky;
  top: 0;
  z-index: 400;
}
.logo {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none; flex-shrink: 0;
}
.logo-icon {
  width: 38px; height: 38px;
  background: #00c853; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.logo-text {
  font-family: 'Nunito', sans-serif;
  font-weight: 900; font-size: 18px;
  color: #212121; letter-spacing: -0.3px;
  white-space: nowrap;
}
.logo-text span { color: #00c853; }

.search-bar {
  flex: 1; max-width: 520px; position: relative;
}
.search-bar input {
  width: 100%;
  padding: 11px 16px 11px 42px;
  border: 1.5px solid #e0e0e0; border-radius: 10px;
  font-size: 14px; font-family: 'Nunito Sans', sans-serif;
  color: #333; outline: none; background: #fafafa;
  transition: border-color .2s;
}
.search-bar input:focus { border-color: #00c853; background: #fff; }
.search-bar input::placeholder { color: #aaa; }
.search-icon {
  position: absolute; left: 13px; top: 50%;
  transform: translateY(-50%); color: #aaa;
}
.navbar-right {
  display: flex; align-items: center; gap: 16px;
  margin-left: auto; flex-shrink: 0;
}
.location-btn {
  display: flex; align-items: center; gap: 5px;
  font-size: 13px; font-weight: 600; color: #444;
  cursor: pointer; background: none; border: none;
  font-family: 'Nunito Sans', sans-serif;
}
.btn-login {
  background: #00c853; color: #fff; border: none;
  padding: 10px 22px; border-radius: 8px;
  font-weight: 700; font-size: 14px; cursor: pointer;
  font-family: 'Nunito Sans', sans-serif;
  transition: background .2s;
}
.btn-login:hover { background: #00b248; }

.hamburger {
  display: none; flex-direction: column; gap: 5px;
  cursor: pointer; padding: 6px; margin-left: auto;
  background: none; border: none;
}
.hamburger span {
  display: block; width: 22px; height: 2px;
  background: #333; border-radius: 2px; transition: all .3s;
}
.hamburger.open span:nth-child(1) { transform: rotate(45deg) translate(5px,5px); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); }

/* ══ MENU BAR ══ */
.navbar-menu {
  background: #fff;
  border-top: 1px solid #f0f0f0;
  border-bottom: 1px solid #eee;
  padding: 0 32px;
  display: flex; align-items: center; gap: 0;
  position: sticky; top: 68px; z-index: 390;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.menu-item { position: relative; }
.menu-btn {
  display: flex; align-items: center; gap: 4px;
  padding: 15px 13px;
  font-size: 13.5px; font-weight: 600; color: #333;
  background: none; border: none; cursor: pointer;
  font-family: 'Nunito Sans', sans-serif;
  white-space: nowrap;
  border-bottom: 2.5px solid transparent;
  transition: color .2s, border-color .2s;
}
.menu-btn:hover { color: #00c853; border-bottom-color: #00c853; }
.menu-item.open > .menu-btn { color: #00c853; border-bottom-color: #00c853; }
.menu-btn .chevron { font-size: 10px; transition: transform .2s; }
.menu-item.open > .menu-btn .chevron { transform: rotate(180deg); }

/* ══ DROPDOWN BASE ══ */
.dropdown {
  position: absolute; top: 100%; left: 0;
  background: #fff;
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  border-radius: 0 0 14px 14px;
  display: none; z-index: 500;
  animation: fadeDown .18s ease;
}
.menu-item.open > .dropdown { display: flex; }
@keyframes fadeDown {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Simple dropdown */
.dropdown.simple { flex-direction: column; min-width: 200px; padding: 8px 0; }
.simple-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 18px;
  font-size: 13.5px; font-weight: 600; color: #333;
  text-decoration: none; cursor: pointer;
  transition: background .12s, color .12s;
}
.simple-item:hover { background: #f0fdf4; color: #00c853; }
.simple-divider { border: none; border-top: 1px solid #f0f0f0; margin: 4px 0; }

/* ══ MEGA DROPDOWN ══ */
.dropdown.mega { flex-direction: row; min-width: 580px; }

/* Left panel */
.dd-left {
  width: 220px; flex-shrink: 0;
  border-right: 1px solid #f0f0f0;
  padding: 10px 0;
  background: #fff;
}
.dd-section-lbl {
  font-size: 10.5px; font-weight: 700; color: #aaa;
  letter-spacing: .9px; text-transform: uppercase;
  padding: 8px 18px 6px;
}
.dd-left-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 14px 11px 18px;
  font-size: 13.5px; font-weight: 600; color: #333;
  cursor: pointer; border-left: 3px solid transparent;
  transition: background .12s, color .12s, border-color .12s;
}
.dd-left-item:hover,
.dd-left-item.active {
  background: #f0fdf4; color: #00c853;
  border-left-color: #00c853;
}
.dd-left-item .arr { font-size: 12px; color: #ccc; }
.dd-left-item:hover .arr,
.dd-left-item.active .arr { color: #00c853; }
.dd-left-link {
  display: block; padding: 10px 18px;
  font-size: 13px; font-weight: 700; color: #00c853;
  text-decoration: none; cursor: pointer;
}
.dd-left-link:hover { text-decoration: underline; }
.dd-left-divider { border: none; border-top: 1px solid #f0f0f0; margin: 4px 0; }

/* Right panel */
.dd-right {
  flex: 1; padding: 20px 22px;
  display: none; min-width: 320px;
  background: #fff;
}
.dd-right.show { display: block; }
.dd-right-header {
  font-size: 11px; font-weight: 700; color: #aaa;
  letter-spacing: .8px; text-transform: uppercase;
  margin-bottom: 16px;
}
.dd-section-title {
  font-size: 14px; font-weight: 800; color: #212121;
  margin-bottom: 8px; margin-top: 16px;
}
.dd-section-title:first-of-type { margin-top: 0; }
.dd-right-link {
  display: flex; align-items: center;
  padding: 7px 8px; border-radius: 8px;
  font-size: 13.5px; font-weight: 600; color: #444;
  text-decoration: none; cursor: pointer;
  transition: background .12s, color .12s;
}
.dd-right-link:hover { background: #f0fdf4; color: #00c853; }
.dd-right-link.green { color: #00c853; font-weight: 700; }
.dd-right-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }

/* ══ MOBILE SEARCH BAR ══ */
.mobile-search-bar {
  display: none; background: #fff;
  padding: 10px 14px; border-bottom: 1px solid #eee;
}
.msb-inner {
  display: flex; align-items: center; gap: 10px;
  background: #f5f5f5; border-radius: 10px; padding: 10px 14px;
}
.msb-inner input {
  border: none; background: transparent; outline: none;
  font-size: 14px; color: #555; width: 100%;
  font-family: 'Nunito Sans', sans-serif;
}

/* ══ MOBILE DRAWER ══ */
.mobile-drawer {
  display: none; position: fixed;
  inset: 0; z-index: 1000;
}
.mobile-drawer.open { display: block; }
.drawer-overlay {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.45);
}
.drawer-panel {
  position: absolute; top: 0; left: 0;
  width: 82%; max-width: 320px; height: 100%;
  background: #fff; overflow-y: auto;
  transform: translateX(-100%);
  transition: transform .3s cubic-bezier(.4,0,.2,1);
  padding-bottom: 50px;
}
.mobile-drawer.open .drawer-panel { transform: translateX(0); }
.drawer-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid #f0f0f0;
  background: #f9fdf9; position: sticky; top: 0; z-index: 2;
}
.drawer-logo { font-family: 'Nunito', sans-serif; font-weight: 900; font-size: 17px; color: #212121; }
.drawer-logo span { color: #00c853; }
.drawer-close {
  background: none; border: none; font-size: 20px;
  cursor: pointer; color: #666; width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
}
.drawer-close:hover { background: #f0f0f0; }

/* Drawer location */
.drawer-loc-row {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 18px; cursor: pointer;
  background: #f9fdf9; border-bottom: 2px solid #e8fdf0;
  transition: background .15s;
}
.drawer-loc-row:hover { background: #f0fdf4; }
.drawer-loc-label { font-size: 11px; font-weight: 600; color: #999; }
.drawer-loc-city { font-size: 14px; font-weight: 700; color: #00c853; }
.drawer-loc-arrow { margin-left: auto; font-size: 11px; color: #aaa; }

/* Drawer section label */
.drawer-section {
  padding: 10px 18px 4px;
  font-size: 10.5px; font-weight: 700; color: #aaa;
  letter-spacing: .9px; text-transform: uppercase;
  background: #fafafa; border-bottom: 1px solid #f0f0f0;
}

/* Drawer item */
.drawer-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 13px 18px;
  font-size: 14px; font-weight: 600; color: #333;
  border-bottom: 1px solid #f5f5f5; cursor: pointer;
  transition: background .12s, color .12s; user-select: none;
}
.drawer-item:hover { background: #f0fdf4; color: #00c853; }
.drawer-item .di-arr {
  font-size: 12px; color: #ccc;
  transition: transform .2s, color .2s;
}
.drawer-item.open-sub .di-arr { transform: rotate(90deg); color: #00c853; }
.drawer-item.open-sub { color: #00c853; }

/* Drawer sub */
.drawer-sub {
  display: none; background: #fafafa;
}
.drawer-sub.open { display: block; }
.drawer-sub-lbl {
  padding: 7px 18px 4px 28px;
  font-size: 10px; font-weight: 700; color: #bbb;
  letter-spacing: .8px; text-transform: uppercase;
}
.drawer-sub .drawer-item {
  padding-left: 28px;
  font-size: 13.5px; font-weight: 600; color: #555;
  border-bottom: 1px solid #f0f0f0;
}
.drawer-sub .drawer-item:hover { color: #00c853; background: #f0fdf4; }
.drawer-sub .drawer-item.green { color: #00c853; font-weight: 700; }

/* ══ LOCATION MODAL ══ */
.loc-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(0,0,0,.45); z-index: 2000;
  align-items: flex-start; justify-content: center;
}
.loc-overlay.open { display: flex; }
.loc-modal {
  background: #fff; width: 100%; max-width: 100%;
  border-radius: 0 0 24px 24px;
  padding: 26px 60px 36px;
  animation: slideDown .25s cubic-bezier(.4,0,.2,1);
  max-height: 88vh; overflow-y: auto;
  box-shadow: 0 8px 40px rgba(0,0,0,.16);
}
@keyframes slideDown {
  from { opacity: 0; transform: translateY(-16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.loc-modal-inner { max-width: 900px; margin: 0 auto; }
.loc-modal-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 22px;
}
.loc-modal-logo { display: flex; align-items: center; gap: 8px; }
.loc-modal-logo .logo-icon { width: 30px; height: 30px; }
.loc-modal-logo .logo-text { font-size: 17px; }
.loc-close {
  background: none; border: none; font-size: 22px; cursor: pointer;
  color: #555; width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; transition: background .15s;
}
.loc-close:hover { background: #f0f0f0; }
.loc-search-box {
  display: flex; align-items: center; gap: 12px;
  border: 1.5px solid #e0e0e0; border-radius: 12px;
  padding: 13px 16px; background: #fafafa;
  transition: border-color .2s; margin-bottom: 28px;
}
.loc-search-box:focus-within { border-color: #00c853; background: #fff; }
.loc-search-box input {
  flex: 1; border: none; background: transparent; outline: none;
  font-size: 15px; color: #333; font-family: 'Nunito Sans', sans-serif;
}
.loc-search-box input::placeholder { color: #aaa; }
.loc-search-btn { background: none; border: none; cursor: pointer; display: flex; }
.loc-search-btn svg { color: #00c853; }
.loc-cities-title { font-size: 14px; font-weight: 700; color: #333; margin-bottom: 18px; }
.loc-cities-grid {
  display: grid; grid-template-columns: repeat(9,1fr);
  gap: 8px; margin-bottom: 24px;
}
.loc-city {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  cursor: pointer; padding: 10px 4px; border-radius: 12px;
  transition: background .15s;
}
.loc-city:hover { background: #f0fdf4; }
.city-wrap {
  width: 72px; height: 72px; border-radius: 50%;
  border: 2px solid #e8e8e8; background: #f9f9f9;
  display: flex; align-items: center; justify-content: center;
  transition: border-color .2s, background .2s; overflow: hidden;
}
.loc-city:hover .city-wrap { border-color: #00c853; background: #f0fdf4; }
.loc-city.selected .city-wrap { border-color: #00c853; background: #e8fdf0; }
.city-wrap svg { width: 52px; height: 52px;  display: block; }
.city-nm {
  font-size: 12px; font-weight: 600; color: #444; text-align: center;
}
.loc-city.selected .city-nm { color: #00c853; font-weight: 700; }
.loc-view-all {
  display: block; text-align: center; color: #00c853;
  font-size: 14px; font-weight: 700; cursor: pointer;
  padding: 10px; border: none; background: none;
  font-family: 'Nunito Sans', sans-serif; width: 100%;
}
.loc-view-all:hover { color: #00b248; }

/* ══ SLIDER ══ */
.slider-wrapper { max-width: 1280px; margin: 24px auto; padding: 0 24px; }
.slider-inner { position: relative; border-radius: 16px; overflow: hidden; }
.slides-track { display: flex; transition: transform .55s cubic-bezier(.77,0,.18,1); }
.slide {
  min-width: 100%; height: 360px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 40px 60px; position: relative; overflow: hidden;
}
.slide-1 { background: linear-gradient(125deg,#e53935,#ef5350); }
.slide-2 { background: linear-gradient(125deg,#1565c0,#1e88e5); }
.slide-3 { background: linear-gradient(125deg,#2e7d32,#43a047); }
.slide::before {
  content:''; position:absolute; width:340px; height:340px;
  border-radius:50%; background:rgba(255,255,255,.06); top:-90px; right:220px;
}
.slide::after {
  content:''; position:absolute; width:200px; height:200px;
  border-radius:50%; background:rgba(255,255,255,.05); bottom:-60px; right:90px;
}
.slide-content { flex:1; z-index:1; }
.slide-tag {
  display:inline-block; background:rgba(255,255,255,.25); color:#fff;
  font-size:11px; font-weight:700; letter-spacing:1px;
  text-transform:uppercase; padding:4px 12px; border-radius:20px; margin-bottom:14px;
}
.slide-title {
  font-family:'Nunito',sans-serif; font-size:40px; font-weight:900;
  color:#fff; line-height:1.15; margin-bottom:12px;
}
.slide-sub {
  font-size:15px; color:rgba(255,255,255,.88);
  line-height:1.65; margin-bottom:28px; max-width:420px;
}
.slide-sub strong { color:#fff; font-weight:700; }
.btn-book {
  background:#212121; color:#fff; border:none;
  padding:12px 28px; border-radius:10px;
  font-family:'Nunito',sans-serif; font-weight:800; font-size:14px;
  cursor:pointer; transition:transform .18s;
}
.btn-book:hover { transform:translateY(-2px); }
.slide-image {
  flex:0 0 280px; display:flex; align-items:flex-end;
  justify-content:center; z-index:1; height:100%;
}
.phone-img {
  width:200px; height:250px;
  filter:drop-shadow(0 20px 40px rgba(0,0,0,.3));
  transform:rotate(-4deg);
}
.arrow {
  position:absolute; top:50%; transform:translateY(-50%);
  z-index:10; background:rgba(255,255,255,.92);
  border:none; width:38px; height:38px; border-radius:50%;
  font-size:20px; cursor:pointer; color:#333;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 12px rgba(0,0,0,.15);
  transition:background .2s, transform .2s;
}
.arrow:hover { background:#fff; transform:translateY(-50%) scale(1.1); }
.arrow-left { left:10px; }
.arrow-right { right:10px; }
.dots { display:flex; justify-content:center; gap:6px; margin-top:12px; }
.dot {
  width:7px; height:7px; border-radius:50%;
  background:#ccc; cursor:pointer;
  transition:background .3s, width .3s;
}
.dot.active { background:#444; width:22px; border-radius:4px; }

/* ══ RESPONSIVE ══ */
@media (max-width: 960px) {
  .navbar-top { padding: 0 16px; height: 56px; }
  .search-bar, .navbar-right { display: none; }
  .hamburger { display: flex; }
  .navbar-menu { display: none; }
  .mobile-search-bar { display: block; }
  .slider-wrapper { margin: 12px auto; padding: 0 12px; }
  .slide { height: auto; min-height: 190px; padding: 20px 18px; }
  .slide-title { font-size: 22px; margin-bottom: 8px; }
  .slide-sub { font-size: 12px; margin-bottom: 14px; max-width: 100%; }
  .btn-book { padding: 9px 18px; font-size: 13px; }
  .slide-image { flex: 0 0 120px; }
  .phone-img { width: 110px; height: 130px; }
  .arrow { display: none; }
  .loc-modal { padding: 20px 18px 28px; border-radius: 0 0 16px 16px; }
  .loc-cities-grid { grid-template-columns: repeat(3,1fr); gap: 10px; }
  .city-wrap { width: 72px; height: 72px; }
}   
.dropdown.mega {
  display: none;
}

.menu-item.open .dropdown.mega {
  display: flex;
}

.dd-right {
  display: none;
}

.dd-right.show {
  display: block;
}
.dropdown.mega {
  display: none;
  background: #fff;
}

.menu-item.open .dropdown.mega {
  display: flex;
}

/* LEFT PANEL */
.dd-left {
  width: 260px;
  border-right: 1px solid #eee;
}

/* RIGHT PANEL CONTAINER */
.dd-right {
  display: none;
  flex: 1;
  padding: 20px;
}

.dd-right.show {
  display: block;
}
.dropdown.mega {
   min-height: 300px; /* remove if exists */
}





/* new changes*/

/* ══════════════════════════════════════════
   ADD THIS TO YOUR EXISTING css/style.css
   (Paste at the bottom)
══════════════════════════════════════════ */

/* ── TS Navbar Top ── */
.ts-navbar-top {
  display: flex;
  align-items: center;
  padding: 0 20px;
  height: 64px;
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
  position: sticky;
  top: 0;
  z-index: 1000;
  gap: 16px;
  box-shadow: 0 1px 8px rgba(0,0,0,.06);
}
.ts-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  flex-shrink: 0;
}
.ts-logo-icon {
  width: 36px; height: 36px;
  background: linear-gradient(135deg, #00c853, #00a846);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
}
.ts-logo span {
  font-family: 'Nunito', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #1a1a1a;
}
.ts-logo strong { color: #00c853; }

.ts-search-bar {
  flex: 1;
  max-width: 600px;
  position: relative;
}
.ts-search-bar svg {
  position: absolute; left: 13px; top: 50%; transform: translateY(-50%);
}
.ts-search-bar input {
  width: 100%;
  padding: 10px 16px 10px 38px;
  border: 1.5px solid #ebebeb;
  border-radius: 50px;
  font-size: 14px;
  font-family: 'Nunito Sans', sans-serif;
  outline: none;
  background: #f7f7f7;
  transition: border-color .2s;
}
.ts-search-bar input:focus { border-color: #00c853; background: #fff; }

.ts-nav-right { display: flex; align-items: center; gap: 10px; margin-left: auto; }

.ts-btn-login {
  padding: 8px 22px;
  background: #00c853;
  color: #fff;
  border: none;
  border-radius: 50px;
  font-family: 'Nunito', sans-serif;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: background .2s;
}
.ts-btn-login:hover { background: #00a846; }

.ts-hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  margin-left: auto;
}
.ts-hamburger span {
  display: block; width: 24px; height: 2px;
  background: #333; border-radius: 2px;
  transition: all .25s;
}

/* ── Navbar Menu ── */
.ts-navbar-menu {
  display: flex;
  align-items: center;
  padding: 0 20px;
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
  gap: 4px;
  position: sticky;
  top: 64px;
  z-index: 999;
}
.ts-menu-item { position: relative; }
.ts-menu-btn {
  display: flex; align-items: center; gap: 4px;
  padding: 14px 14px;
  background: none; border: none;
  font-family: 'Nunito Sans', sans-serif;
  font-size: 14px; font-weight: 600;
  color: #333; cursor: pointer;
  white-space: nowrap;
  border-bottom: 2.5px solid transparent;
  transition: color .15s, border-color .15s;
}
.ts-menu-btn:hover, .ts-menu-item:hover .ts-menu-btn {
  color: #00c853;
  border-bottom-color: #00c853;
}
.ts-chev { font-size: 10px; margin-top: 1px; }

/* ── Dropdowns ── */
.ts-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #ebebeb;
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0,0,0,.12);
  z-index: 1001;
  min-width: 200px;
  animation: tsDropIn .15s ease;
}
@keyframes tsDropIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ts-menu-item:hover .ts-dropdown { display: flex; }

/* Mega dropdown */
.ts-mega {
  width: 580px;
  flex-direction: row;
}
.ts-dd-left {
  width: 190px;
  border-right: 1px solid #f0f0f0;
  padding: 16px 0;
  flex-shrink: 0;
}
.ts-dd-section-lbl {
  font-size: 11px;
  font-weight: 700;
  color: #aaa;
  text-transform: uppercase;
  letter-spacing: .7px;
  padding: 0 16px 8px;
}
.ts-dd-left-item {
  display: flex; align-items: center;
  padding: 9px 16px;
  font-size: 13.5px;
  font-weight: 600;
  color: #333;
  cursor: pointer;
  transition: background .12s;
}
.ts-dd-left-item:hover, .ts-dd-left-item.active {
  background: #f0fff5;
  color: #00c853;
}
.ts-arr { margin-left: auto; color: #ccc; font-size: 12px; }
.ts-dd-divider { margin: 8px 16px; border: none; border-top: 1px solid #f0f0f0; }
.ts-dd-left-link {
  display: block;
  padding: 8px 16px;
  font-size: 13px;
  color: #00c853;
  font-weight: 700;
  text-decoration: none;
}
.ts-dd-left-link:hover { text-decoration: underline; }

/* Right panel */
.ts-dd-right {
  display: none;
  flex: 1;
  padding: 16px;
  flex-direction: column;
}
.ts-dd-right.active, .ts-dd-right:first-of-type { display: flex; }
.ts-dd-right-header {
  font-family: 'Nunito', sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: #1a1a1a;
  margin-bottom: 12px;
}
.ts-dd-section-title {
  font-size: 11px;
  font-weight: 700;
  color: #aaa;
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 8px;
}
.ts-dd-right-link {
  display: block;
  padding: 5px 0;
  font-size: 13.5px;
  color: #444;
  text-decoration: none;
  font-weight: 500;
  transition: color .12s;
}
.ts-dd-right-link:hover { color: #00c853; }
.ts-green { color: #00c853 !important; font-weight: 700; }

/* Simple dropdown */
.ts-simple { flex-direction: column; padding: 8px 0; min-width: 180px; }
.ts-simple-item {
  display: block;
  padding: 10px 18px;
  font-size: 14px;
  color: #444;
  text-decoration: none;
  font-weight: 500;
  transition: background .12s;
}
.ts-simple-item:hover { background: #f5f5f5; color: #00c853; }

/* ── Mobile Drawer ── */
.ts-mobile-drawer { display: none; }
.ts-drawer-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 1998;
}
.ts-drawer-panel {
  position: fixed;
  top: 0; left: 0;
  width: 300px;
  height: 100vh;
  background: #fff;
  z-index: 1999;
  overflow-y: auto;
  transform: translateX(-100%);
  transition: transform .3s ease;
}
.ts-mobile-drawer.open .ts-drawer-panel { transform: translateX(0); }
.ts-drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 18px;
  border-bottom: 1px solid #f0f0f0;
  font-family: 'Nunito', sans-serif;
  font-size: 16px;
  font-weight: 700;
}
.ts-drawer-header button {
  background: none; border: none;
  font-size: 18px; cursor: pointer; color: #888;
}
.ts-drawer-section {
  padding: 12px 18px 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .7px;
  color: #aaa;
}
.ts-drawer-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 18px;
  font-size: 14px;
  font-weight: 600;
  color: #333;
  cursor: pointer;
  text-decoration: none;
  border-bottom: 1px solid #fafafa;
}
.ts-drawer-item:hover { background: #f5f5f5; }
.ts-di-arr { color: #ccc; }
.ts-drawer-sub {
  display: none;
  background: #fafafa;
  padding: 4px 0;
}
.ts-drawer-sub.open { display: block; }
.ts-drawer-sub .ts-drawer-item {
  padding-left: 30px;
  font-size: 13px;
  font-weight: 500;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .ts-search-bar { display: none; }
  .ts-nav-right { display: none; }
  .ts-hamburger { display: flex; }
  .ts-navbar-menu { display: none; }
  .ts-mobile-drawer { display: block; }
}

/* dd-right panel hover switch */
.ts-dd-left-item:hover + .ts-dd-right,
.ts-dd-left-item.active ~ .ts-dd-right.active { display: flex; }
.city-wrap {
  position: relative;
}

.city-wrap svg * {
  vector-effect: non-scaling-stroke;
}