/* ═══════════════════════════════════════════════════════════════════════════
   CocoThai — homepage hooks for the platform
   ---------------------------------------------------------------------------
   Only what the homepage needs around the main search engine and the two new
   header entries (Coco+, ה-Coco שלי). The engine's own styles live inside its
   Shadow DOM (coco-search.js). Removing the <link> to this file, the slot and
   the script reverts the homepage completely.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── The engine slot in the hero ────────────────────────────────────────── */
.coco-search-slot {
  position: relative;
  z-index: 3;
  width: min(1160px, calc(100vw - 40px));
  margin: 0 0 34px;
  scroll-margin-top: 120px;
}

/* The hero reveal animates its children with transform + filter. Either one
   turns the slot into a containing block, which would pin the engine's mobile
   bottom sheet to the slot instead of the screen — so the slot fades only. */
.hero-text > .coco-search-slot,
.hero-text.hero-in > .coco-search-slot {
  transform: none !important;
  filter: none !important;
}

/* ── Header: Coco+ in the menu, "ה-Coco שלי" beside the CTAs ───────────── */
#nav-list a.nav-coco-plus {
  color: #E2C99A;
  font-weight: 600;
}
#nav-list a.nav-coco-plus i {
  margin-inline-end: 5px;
  font-size: 0.7rem;
  color: #C9A96E;
}

.btn-my-coco {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  border: 1px solid rgba(201, 169, 110, 0.45);
  border-radius: 30px;
  color: #E2C99A;
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.25s, border-color 0.25s, color 0.25s;
}
.btn-my-coco:hover {
  background: rgba(201, 169, 110, 0.12);
  border-color: #C9A96E;
  color: #fff;
}
.btn-my-coco i {
  font-size: 0.95rem;
  color: #C9A96E;
}

@media (max-width: 768px) {
  .btn-my-coco {
    padding: 7px 10px;
  }
  .btn-my-coco span {
    display: none;
  }
}

/* ── While a picker is open as a bottom sheet on a phone ────────────────── */
html.coco-sheet-open body {
  overflow: hidden;
}
html.coco-sheet-open .cl-fab-rail,
html.coco-sheet-open .quote-fab,
html.coco-sheet-open .wa-float,
html.coco-sheet-open .access-btn {
  visibility: hidden !important;
}

/* Current CocoThai brand: scoped to the homepage navigation. */
header .logo-img { content: url('/cocothai-logo.png'); object-fit: contain; }
#nav-list a.nav-coco-plus, #nav-list a.nav-coco-plus i { color: #fff; }
.btn-my-coco { background: #093577; color: #fff; border-color: #fff; }
.btn-my-coco:hover { background: #d61934; color: #fff; }