/*
Theme Name: Спроси Тибо
Theme URI: https://asktibo.ru
Author: Тибо
Description: Тема «Спроси Тибо» — планировщик поездки с конкретным питомцем. Tibo DS с нуля (не Waggo / не Airbnb).
Version: 0.2.1
Text Domain: tibo
Requires at least: 6.4
Requires PHP: 8.2
*/

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--tibo-font-ui);
  font-size: var(--tibo-fs-body);
  line-height: var(--tibo-lh-body);
  color: var(--tibo-ink);
  background: var(--tibo-surface);
}

img { max-width: 100%; height: auto; display: block; }

a {
  color: var(--tibo-accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

a:hover { color: var(--tibo-accent-hover); }

h1, h2, h3, .tibo-wordmark, .tibo-quote {
  font-family: var(--tibo-font-display);
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.2;
}

h1 { font-size: var(--tibo-fs-hero); margin: 0 0 var(--s3); }
h2 { font-size: var(--tibo-fs-2xl); margin: 0 0 var(--s3); }
h3 { font-size: var(--tibo-fs-xl); margin: 0 0 var(--s2); }

p { margin: 0 0 var(--s4); }

.tibo-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.tibo-skip {
  position: absolute;
  left: var(--s4);
  top: -100px;
  z-index: 100;
  background: var(--tibo-ink);
  color: var(--tibo-accent-ink);
  padding: var(--s2) var(--s4);
  border-radius: var(--tibo-radius-sm);
}

.tibo-skip:focus { top: var(--s2); }

.tibo-site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s4);
  padding: var(--s3) var(--tibo-gutter);
  max-width: calc(var(--tibo-max) + 2 * var(--tibo-gutter));
  margin: 0 auto;
}

.tibo-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  color: var(--tibo-ink);
  text-decoration: none;
}

.tibo-brand:hover { color: var(--tibo-ink); }

.tibo-brand-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid var(--tibo-fur);
}

.tibo-wordmark {
  font-size: var(--tibo-fs-wordmark);
  font-weight: 600;
}

.tibo-site-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s3) var(--s4);
  font-size: var(--tibo-fs-sm);
}

.tibo-site-nav a {
  color: var(--tibo-ink-muted);
  text-decoration: none;
}

.tibo-site-nav a:hover { color: var(--tibo-ink); }

.tibo-main {
  min-height: 50vh;
}

body.tibo-app .tibo-main {
  padding: var(--s5) var(--tibo-gutter) var(--s8);
  max-width: calc(var(--tibo-max) + 2 * var(--tibo-gutter));
  margin: 0 auto;
}

.tibo-site-footer {
  border-top: 1px solid var(--tibo-fur);
  padding: var(--s6) var(--tibo-gutter) var(--s7);
  margin-top: var(--s8);
}

.tibo-footer-inner {
  max-width: var(--tibo-max);
  margin: 0 auto;
  display: grid;
  gap: var(--s4);
}

.tibo-footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s3) var(--s4);
  font-size: var(--tibo-fs-sm);
}

.tibo-footer-nav a {
  color: var(--tibo-ink-muted);
  text-decoration: none;
}

.tibo-footer-domain {
  margin: 0;
  font-size: var(--tibo-fs-xs);
  color: var(--tibo-ink-muted);
}

/* ——— Buttons ——— */
.tibo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--tibo-control-h);
  padding: 0 var(--s5);
  border-radius: var(--tibo-radius-sm);
  border: 1px solid transparent;
  font-family: var(--tibo-font-ui);
  font-size: var(--tibo-fs-md);
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
}

.tibo-btn-primary {
  background: var(--tibo-accent);
  color: var(--tibo-accent-ink);
}

.tibo-btn-primary:hover {
  background: var(--tibo-accent-hover);
  color: var(--tibo-accent-ink);
}

.tibo-btn-secondary {
  background: var(--tibo-card);
  color: var(--tibo-ink);
  border-color: var(--tibo-line-strong);
}

.tibo-card {
  background: var(--tibo-card);
  border: 1px solid var(--tibo-fur);
  border-radius: var(--tibo-radius);
  box-shadow: var(--tibo-shadow-card);
  padding: var(--s5);
}

.tibo-status {
  display: inline-flex;
  align-items: center;
  gap: var(--s1);
  padding: 2px 10px;
  border-radius: var(--tibo-radius-pill);
  border: 1px solid;
  font-size: var(--tibo-fs-sm);
  font-weight: 600;
}

.tibo-muted { color: var(--tibo-ink-muted); }
.tibo-error { color: var(--tibo-nofit); font-size: var(--tibo-fs-sm); }

.tibo-loading {
  display: flex;
  align-items: center;
  gap: var(--s3);
  color: var(--tibo-ink-muted);
}

.tibo-loading img {
  width: 56px;
  height: 56px;
  border-radius: var(--tibo-radius-sm);
  object-fit: cover;
}

/* ——— Companion (never covers primary CTA) ——— */
.tibo-bubble {
  display: flex;
  align-items: flex-start;
  gap: var(--s2);
  max-width: 36rem;
}

.tibo-bubble p {
  margin: 0;
  font-family: var(--tibo-font-display);
  font-size: var(--tibo-fs-md);
  font-style: italic;
  color: var(--tibo-ink);
}

.tibo-bubble img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

/* ——— Home hero ——— */
.tibo-hero {
  position: relative;
  min-height: min(78vh, 720px);
  display: flex;
  align-items: flex-end;
  color: var(--tibo-ink);
}

.tibo-hero-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 78% 38%;
}

.tibo-hero-veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(250, 250, 248, 0.15) 0%, rgba(250, 250, 248, 0.88) 62%, var(--tibo-surface) 100%);
}

.tibo-hero-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: calc(var(--tibo-max) + 2 * var(--tibo-gutter));
  margin: 0 auto;
  padding: var(--s8) var(--tibo-gutter) var(--s6);
}

.tibo-hero-lead {
  max-width: 36rem;
  font-size: var(--tibo-fs-lg);
  color: var(--tibo-ink-muted);
  margin-bottom: var(--s5);
}

/* Search bar — own DS, not Airbnb pill */
.tibo-search {
  margin-top: var(--s4);
}

.tibo-search-bar {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--tibo-card);
  border: 1px solid var(--tibo-fur);
  border-radius: var(--tibo-radius);
  box-shadow: var(--tibo-shadow-bar);
  overflow: hidden;
}

.tibo-seg {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-height: 64px;
  padding: var(--s3) var(--s4);
  border: 0;
  background: transparent;
  font-family: var(--tibo-font-ui);
  text-align: left;
  cursor: pointer;
}

.tibo-seg:focus-visible {
  outline: 2px solid var(--tibo-accent);
  outline-offset: -2px;
}

.tibo-seg-label {
  font-size: var(--tibo-fs-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--tibo-ink-muted);
}

.tibo-seg-value {
  font-size: var(--tibo-fs-md);
  color: var(--tibo-ink);
}

.tibo-btn-search {
  min-height: 52px;
  margin: var(--s2);
  border: 0;
  border-radius: var(--tibo-radius-sm);
  background: var(--tibo-accent);
  color: var(--tibo-accent-ink);
  font-family: var(--tibo-font-ui);
  font-size: var(--tibo-fs-md);
  font-weight: 600;
  cursor: pointer;
}

.tibo-btn-search:hover { background: var(--tibo-accent-hover); }

.tibo-btn-search-full { display: none; }
.tibo-btn-search-short { display: inline; }

@media (min-width: 900px) {
  .tibo-btn-search-full { display: inline; }
  .tibo-btn-search-short { display: none; }
}

.tibo-search-hint {
  margin: var(--s3) 0 0;
}

.tibo-home-below {
  padding: var(--s8) var(--tibo-gutter);
  max-width: calc(var(--tibo-max) + 2 * var(--tibo-gutter));
  margin: 0 auto;
}

@media (min-width: 900px) {
  .tibo-search-bar {
    grid-template-columns: 1.1fr 1.1fr 1.2fr 0.9fr 1fr auto;
    align-items: stretch;
  }

  .tibo-seg {
    border-right: 1px solid var(--tibo-fur);
  }

  .tibo-btn-search {
    min-width: 140px;
    margin: var(--s2) var(--s2) var(--s2) 0;
  }
}

/* 404 */
.tibo-404 {
  max-width: 32rem;
  margin: var(--s8) auto;
  padding: 0 var(--tibo-gutter);
  text-align: center;
}

.tibo-404 img {
  width: min(280px, 80%);
  margin: 0 auto var(--s5);
  border-radius: var(--tibo-radius);
}

/* Islands overrides: Tibo bar (not Airbnb pill), CTA ≠ FIT, map width */
.tibo-home .pte-search-pill,
.tibo-search-bar.pte-search-pill {
  border-radius: var(--tibo-radius);
  border: 1px solid var(--tibo-fur);
  background: var(--tibo-card);
  box-shadow: var(--tibo-shadow-bar);
  padding: 0;
  overflow: hidden;
}

.tibo-home .pte-seg {
  border-radius: 0;
  min-height: 64px;
}

.tibo-home .pte-seg.is-active,
.tibo-home .pte-seg:hover {
  background: var(--tibo-warm);
}

.tibo-home .pte-btn-search {
  width: auto;
  height: auto;
  min-height: 52px;
  min-width: auto;
  border-radius: var(--tibo-radius-sm);
  margin: var(--s2);
  padding: 0 var(--s5);
  color: var(--tibo-accent-ink);
}

@media (max-width: 899px) {
  .tibo-home .pte-btn-search {
    width: 100%;
    min-height: var(--tibo-control-h);
  }
}

.tibo-home .pte-panel-pop {
  border-radius: var(--tibo-radius);
}

body.pte-panel-open .tibo-hero,
body.pte-modal-open .tibo-hero {
  z-index: 60;
}

.tibo-results-chip {
  font-family: var(--tibo-font-display);
  font-size: var(--tibo-fs-lg);
  font-weight: 600;
  margin: 0 0 var(--s4);
}

.tibo-hotel-says {
  margin: var(--s3) 0 0;
}

.tibo-hotel-voice {
  margin: var(--s2) 0 0;
  font-family: var(--tibo-font-display);
  font-style: italic;
  font-size: var(--tibo-fs-md);
}

body.tibo-home .tibo-main {
  max-width: none;
  padding: 0;
}

body.tibo-view-results.tibo-app .tibo-main,
body.tibo-view-hotel.tibo-app .tibo-main,
body.tibo-view-trip.tibo-app .tibo-main {
  max-width: none;
  padding-top: var(--s3);
}

@media (min-width: 960px) {
  body.tibo-view-results.tibo-app .tibo-main {
    padding-left: var(--tibo-gutter);
    padding-right: var(--tibo-gutter);
  }
}

.pte-btn-primary {
  background: var(--tibo-accent);
  color: var(--tibo-accent-ink);
}

.pte-btn-primary:hover {
  background: var(--tibo-accent-hover);
  color: var(--tibo-accent-ink);
}

.tibo-home .pte-home .pte-site-nav a,
.tibo-site-nav a {
  color: var(--tibo-ink-muted);
}

/* Don't paint homepage nav white (leftover islands rule). */
.tibo-home .tibo-site-nav a {
  color: var(--tibo-ink-muted);
}

.tibo-home .tibo-site-nav a:hover {
  color: var(--tibo-ink);
}