/* Офлайн-состояние встроено в обычные страницы, палитра — из темы сайта. */
.tf-connectivity[hidden],.tf-offline-orders[hidden],.tf-offline-contacts[hidden]{display:none!important}
.tf-connectivity{position:fixed;z-index:1050;left:14px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));max-width:680px;margin:0 auto;padding:12px 16px;border-radius:var(--radius-sm,12px);font-size:14px;line-height:1.4;font-weight:600;background:var(--surface,#fff);color:var(--ink,#222);border:1px solid var(--line,#ddd);box-shadow:0 12px 38px rgba(0,0,0,.2)}
.tf-connectivity[data-kind=offline]{border-color:var(--accent,#d9a441);background:color-mix(in srgb,var(--accent,#d9a441) 10%,var(--surface,#fff))}
.tf-connectivity[data-kind=online]{border-color:var(--primary,#256b4b);background:color-mix(in srgb,var(--primary,#256b4b) 9%,var(--surface,#fff))}
.tf-connectivity[data-kind=notice]{border-color:var(--primary,#256b4b);background:var(--primary,#256b4b);color:var(--primary-ink,#fff)}
.tf-offline-orders{margin:28px 0 45px;padding:20px;border:1px solid var(--line,#ddd);border-radius:var(--radius,16px);background:var(--surface,#fff)}
.tf-offline-orders h2{font-size:20px;margin:0 0 8px;color:var(--heading-color,var(--ink,#222))}
.tf-offline-orders p{margin:0 0 14px}
.tf-offline-order-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line,#ddd);padding:12px 0}
.tf-offline-order-row strong{flex:1 0 100%}
.tf-offline-order-row .muted{flex:1 0 100%}
.tf-offline-order-row button{cursor:pointer}
.tf-offline-contacts{border:1px solid var(--accent,#d9a441);border-radius:var(--radius-sm,12px);padding:15px;margin:14px 0;background:color-mix(in srgb,var(--accent,#d9a441) 7%,var(--surface,#fff))}
.tf-offline-contacts strong{display:block;margin:0 0 10px}
.tf-offline-contacts label{display:block;font-size:13px;font-weight:600;margin:9px 0}
.tf-offline-contacts input{display:block;width:100%;font:inherit;color:var(--ink,#222);background:var(--surface,#fff);border:1px solid var(--line,#ddd);border-radius:var(--radius-sm,10px);padding:10px;margin-top:5px}
.tf-offline-consent{display:flex;align-items:center;gap:10px;padding:12px;margin:10px 0;border:1px solid var(--line,#ddd);border-radius:var(--radius-sm,10px)}
@media(max-width:550px){.tf-connectivity{font-size:12px;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom))}.tf-offline-orders{padding:14px}}

/* Мобильная панель действий. На сайте одновременно могут быть колесо
   подарков, ИИ-чат, контакты и кнопка «Наверх». Они должны образовывать
   один компактный ряд НАД нижней навигацией, а не перекрывать услуги.
   Значение --float-bottom уже учитывает нижнее меню и safe-area телефона. */
@media (max-width:760px) {
  body.public .tfw-tab,
  body.public .chat-widget,
  body.public .fab-widget,
  body.public .fab,
  body.public .to-top {
    bottom:var(--float-bottom,78px);
  }
  body.public .tfw-tab,
  body.public .tfw-tab.tfw-tab-code {
    left:10px;
    width:46px;
    height:46px;
    min-width:46px;
    padding:0;
    justify-content:center;
    border-radius:50%;
    transform:none;
    gap:0;
  }
  body.public .tfw-tab .tfw-tab-l,
  body.public .tfw-tab.tfw-tab-code .tfw-tab-l {display:none}
  body.public .tfw-tab .tfw-gift {font-size:22px}
  body.public .chat-widget {left:64px}
  body.public .chat-fab {
    width:46px;
    height:46px;
    min-width:46px;
    border-radius:50%;
    padding:0;
    justify-content:center;
    font-size:20px;
  }
  body.public .chat-fab-label {display:none}
  body.public .fab-widget {right:10px}
  body.public .fab-widget .fab-btn {width:46px;height:46px;font-size:21px}
  body.public .fab {right:66px;width:42px;height:42px}
  body.public .to-top,
  html.has-fab body.public .to-top {right:118px;width:38px;height:38px}

  /* В нижней части документа оставляем место для кнопок, в том числе
     на страницах без стандартного класса .page. */
  body.public main.page {padding-bottom:max(150px,calc(var(--float-bottom,78px) + 68px))}
  body.public .site-footer {padding-bottom:max(95px,calc(var(--float-bottom,78px) + 55px))}

  /* Постоянный статус сети — в потоке документа после шапки.
     Подтверждение заказа остаётся кратким toast над кнопками. */
  body.public .tf-connectivity[data-kind=offline] {
    position:relative;
    z-index:1;
    box-sizing:border-box;
    width:auto;
    max-width:none;
    margin:10px 12px 8px;
    padding:10px 13px;
    font-size:12px;
    line-height:1.35;
    border-radius:12px;
    box-shadow:none;
  }
  body.public .tf-connectivity[data-kind=online],
  body.public .tf-connectivity[data-kind=notice] {
    position:fixed;
    z-index:170;
    left:12px;
    right:12px;
    bottom:calc(var(--float-bottom,78px) + 60px);
    box-sizing:border-box;
    width:auto;
    max-width:440px;
    margin:0 auto;
    padding:11px 14px;
    border-radius:12px;
    font-size:12px;
    line-height:1.35;
    pointer-events:none;
  }
}
@media(max-width:370px) {
  body.public .tfw-tab,body.public .tfw-tab.tfw-tab-code,
  body.public .chat-fab,body.public .fab-widget .fab-btn {width:42px;height:42px;min-width:42px}
  body.public .chat-widget {left:58px}
  body.public .fab {right:60px;width:38px;height:38px}
  body.public .to-top,html.has-fab body.public .to-top {right:108px;width:34px;height:34px}
}

/* На мобильном сайте с разделом «Ещё» реальные кнопки доступны в
   шторке меню. Плавающие триггеры не перекрывают карточки и CTA.
   Сам чат, меню контактов и модалка колеса продолжают работать. */
@media(max-width:760px) {
  body.public.tf-mobile-actions-ready .tfw-tab,
  body.public.tf-mobile-actions-ready .chat-widget > .chat-fab,
  body.public.tf-mobile-actions-ready .fab-widget > .fab-btn {
    display:none!important;
  }
  body.public .tf-mobile-actions {
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin:6px 0 10px;
    padding-top:14px;
    border-top:1px solid var(--line,#ddd);
  }
  body.public .tf-mobile-actions[hidden],
  body.public .tf-mobile-action[hidden] {display:none!important}
  body.public .tf-mobile-action {
    min-width:0;
    min-height:67px;
    padding:10px 4px;
    border:1px solid var(--line,#ddd);
    border-radius:12px;
    background:var(--surface-2,var(--surface,#fff));
    color:var(--ink,#222);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    font-family:inherit;
    font-weight:600;
    font-size:12px;
    line-height:1.2;
    cursor:pointer;
  }
  body.public .tf-mobile-action .tf-mobile-action-icon {font-size:23px;line-height:1.1}
  body.public .tf-mobile-action:focus-visible {outline:3px solid var(--primary,#6350e9);outline-offset:2px}
}
/* Offline clarity for real customers, without floating controls. */
.tf-offline-queue-summary{margin:8px 0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--primary,#5845ed) 8%,transparent);font-size:14px}
.tf-offline-error{margin:8px 0;color:#b45309;font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.tf-offline-catalog-date{margin:8px 0 12px;line-height:1.45}
.tf-offer-freshness{font-size:12px;line-height:1.4;margin-top:5px;color:var(--ink-2,#777)}
