/* AI planners: access dialog, PLUS badge, mode picker and phone ergonomics.
   Loaded last on the planner pages so it can override the older ai-guide-* sheets. */

/* ---------- Access dialog (login / PLUS) ---------- */
.tp-gate { position: fixed; inset: 0; z-index: 10090; display: flex; align-items: flex-end; justify-content: center; padding: 16px; background: rgba(19, 32, 26, .55); backdrop-filter: blur(4px); }
.tp-gate[hidden] { display: none; }
.tp-gate__card { width: 100%; max-width: 440px; padding: 24px 22px calc(22px + env(safe-area-inset-bottom)); border-radius: 22px; background: var(--tp-card, #fff); color: var(--tp-ink, #13201a); box-shadow: 0 24px 60px rgba(0, 0, 0, .3); }
.tp-gate__card h2 { margin: 0 0 8px; font-size: 20px; line-height: 1.25; }
.tp-gate__card p { margin: 0 0 18px; font-size: 15px; line-height: 1.5; color: var(--tp-muted, #627067); }
.tp-gate__actions { display: grid; gap: 10px; }
.tp-gate__actions > * { justify-content: center; min-height: 48px; text-align: center; }
/* The dialog lives in <body>, outside .tp-studio, so it carries its own button styles. */
.tp-gate .tp-cta, .tp-gate .tp-ghost, .tp-gate .tp-link { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; padding: 0 20px; border-radius: 15px; font: inherit; font-size: 15px; font-weight: 800; text-decoration: none; cursor: pointer; }
.tp-gate .tp-cta { border: 0; background: linear-gradient(135deg, #ff7f30, #ef540c); color: #fff; box-shadow: 0 10px 22px rgba(239, 84, 12, .3); }
.tp-gate .tp-ghost { border: 1px solid var(--tp-line-2, rgba(19, 32, 26, .18)); background: transparent; color: var(--tp-ink, #13201a); }
.tp-gate .tp-link { border: 0; background: transparent; color: var(--tp-muted, #627067); font-weight: 700; }
body.tp-gate-open { overflow: hidden; }
@media (min-width: 721px) { .tp-gate { align-items: center; } }

/* ---------- PLUS marker on create buttons ---------- */
.tp-plus-badge { display: inline-block; padding: 2px 7px; border-radius: 999px; background: rgba(255, 255, 255, .28); font-size: 11px; font-style: normal; font-weight: 800; letter-spacing: .04em; line-height: 1.3; }

/* ---------- Hike: «Как пойдём?» ---------- */
.tp-quick-activity { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 4px 0 12px; }
.tp-quick-activity__label { flex: 0 0 100%; font-size: 13px; font-weight: 700; color: var(--tp-muted, #627067); }
.tp-quick-activity button { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border: 1px solid var(--tp-line-2, rgba(19, 32, 26, .15)); border-radius: 999px; background: var(--tp-card-2, #fbfaf6); color: var(--tp-ink, #13201a); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.tp-quick-activity button.is-active { border-color: var(--tp-forest, #1d4a37); background: var(--tp-forest, #1d4a37); color: #fff; }
.tp-quick-activity .tp-ico { width: 18px; height: 18px; }
.tp-prompt__title { display: block; margin: 0 0 6px; font-size: 13px; font-weight: 700; color: var(--tp-muted, #627067); }

/* ---------- Hub ---------- */
.hx-cost { margin: 10px 0 0; font-size: 14px; line-height: 1.45; color: inherit; opacity: .85; }
.hx-cost a { font-weight: 700; text-decoration: underline; }

/* Owner cover used by the updated hike renderer. */
.is-hike-mode .hc-owner-cover{margin:0 0 16px;order:0;width:100%;min-width:0}
.is-hike-mode .hc-owner-cover [data-planner-owner-cover]{display:block;width:100%;max-width:none;height:200px;aspect-ratio:auto;object-fit:cover;border-radius:12px;margin:0}
.is-hike-mode .hc-owner-cover figcaption{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 12px;min-height:44px;color:var(--tp-muted);font-size:12px}
.is-hike-mode:not(#hc-unused) .hc-owner-cover figcaption button{margin-left:auto;min-height:44px;white-space:normal;text-align:right}
@media(max-width:700px){.is-hike-mode .hc-owner-cover [data-planner-owner-cover]{height:160px}.is-hike-mode .hc-owner-cover figcaption{font-size:11px}}

/* ---------- Phones ---------- */
@media (max-width: 720px) {
    /* PLUS notice: one tappable line instead of a block that pushes the form off the first screen. */
    .tp-plus-access { margin-bottom: 8px; padding: 0; }
    .tp-plus-access__toggle { display: flex; align-items: center; min-height: 44px; padding: 0 14px; font-size: 14px; font-weight: 700; cursor: pointer; }
    .tp-plus-access__details { padding: 0 14px 14px; }

    /* Touch targets */
    .tp-studio .tp-examples button,
    .tp-studio .tp-link,
    .tp-studio .tp-ghost,
    .tp-studio .tp-studio-head__links a,
    .tp-studio .tp-studio-head__how,
    .tp-studio .tp-switch__item,
    .tp-studio .tp-modes button { min-height: 44px; }
    .page-ai-guide .site-footer a { display: inline-flex; align-items: center; min-height: 44px; }

    /* Main action stays reachable while the quick hike form is long. */
    .is-hike-mode .tp-composer__actions { position: sticky; bottom: calc(8px + env(safe-area-inset-bottom)); z-index: 6; padding: 10px; border-radius: 18px; background: var(--tp-card, #fff); box-shadow: 0 -6px 24px rgba(19, 32, 26, .12); }
    .is-hike-mode .tp-composer__actions .hike-planner__hint { display: none; }
    .is-hike-mode .tp-composer__actions .tp-cta { width: 100%; }

    /* Mode labels fit on one line. */
    .tp-modes button { white-space: nowrap; font-size: 14px; padding-inline: 10px; }
}