/*! ConcreteMix mobile-fix v6 — precise table rules */

/* === iPhone notch === */
@supports (padding: env(safe-area-inset-top)) {
  body { padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
}

/* === БЕЙДЖИ ТОП/НОВОЕ/ХИТ === */
span.rounded-full,
span[class*='rounded-full'],
.badge,
[class*='badge-'] {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
}

@media (max-width: 380px) {
  td span.rounded-full,
  td span[class*='rounded-full'] {
    margin-left: 0 !important;
    margin-top: 4px !important;
  }
}

/* === ШИРОКИЕ ТАБЛИЦЫ (прайс, сравнение) — горизонтальный скролл === */
@media (max-width: 768px) {
  /* Только таблицы внутри overflow-x контейнера */
  .overflow-x-auto > table,
  div[style*='min-width: 860px'] > table,
  div[style*='overflow-x: auto'] > table,
  table.table-fixed {
    font-size: 13px;
  }
  
  /* Таблицы с inline min-width — позволяем скроллиться */
  table[style*='min-width'] {
    min-width: max-content;
  }
  
  /* Прайс-таблица в карточке с overflow */
  div[class*='overflow-x'] {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
  
  /* Sticky первая колонка только для широких таблиц с >5 колонок */
  table.table-fixed thead th:first-child,
  table.table-fixed tbody td:first-child,
  div[style*='min-width: 860px'] table thead th:first-child,
  div[style*='min-width: 860px'] table tbody td:first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: inherit;
  }
  
  /* Тело — белый/серый фон */
  table.table-fixed tbody tr:nth-child(odd) td:first-child {
    background: #ffffff !important;
  }
  table.table-fixed tbody tr:nth-child(even) td:first-child {
    background: #f8fafc !important;
  }
}

/* === ПРОСТЫЕ ТАБЛИЦЫ (характеристики 2 колонки) — НЕ ТРОГАЕМ === */
@media (max-width: 768px) {
  /* Таблицы w-full text-sm БЕЗ table-fixed — нормальные двухколоночные */
  table.w-full:not(.table-fixed) {
    display: table !important;
    width: 100% !important;
    table-layout: auto;
  }
  
  table.w-full:not(.table-fixed) td,
  table.w-full:not(.table-fixed) th {
    white-space: normal !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }
}

/* === STICKY HEADER === */
@media (max-width: 1024px) {
  #main-header { min-height: 56px; }
  #main-header + section,
  #main-header + main > section:first-child {
    padding-top: clamp(16px, 3vw, 32px);
  }
}

/* === H1/H2 === */
@media (max-width: 768px) {
  h1 {
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    max-width: 100%;
    line-height: 1.25 !important;
    padding-right: 8px;
    hyphens: auto;
    -webkit-hyphens: auto;
  }
  
  h1[style*='clamp'], .hero h1, section h1 {
    font-size: clamp(22px, 6vw, 32px) !important;
    line-height: 1.25 !important;
    margin-top: 16px !important;
  }
  
  h2 {
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    max-width: 100%;
    line-height: 1.3 !important;
  }
}

@media (max-width: 380px) {
  h1 {
    font-size: clamp(20px, 5.5vw, 26px) !important;
  }
  .max-w-7xl, .max-w-6xl, .max-w-5xl {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* === ГЕО-СТРАНИЦЫ === */
@media (max-width: 768px) {
  [style*='overflow: clip'] {
    overflow: visible !important;
    overflow-x: clip !important;
  }
  
  [class*='grid-cols-'] {
    max-width: 100%;
  }
  
  [class*='grid'] > * {
    min-width: 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
}

/* === HERO === */
@media (max-width: 1024px) {
  section[class*='hero'], .hero, [class*='Hero'] {
    overflow-x: clip;
    overflow-y: visible;
  }
}

/* === ТЕКСТ === */
@media (max-width: 768px) {
  p, li {
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
    max-width: 100%;
  }
  
  picture, picture img, .hero img {
    max-width: 100% !important;
    height: auto;
  }
}

/* === HTML/BODY === */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
}

@media (max-width: 640px) {
  .hero-cta, .cta-button {
    width: 100%;
    margin-bottom: 8px;
  }
}

/* === НИЖНИЕ КНОПКИ === */
@media (max-width: 768px) {
  div[class*='fixed bottom-0'][class*='md:hidden'] {
    padding-bottom: env(safe-area-inset-bottom, 0) !important;
  }
  
  /* ScrollToTop поднимаем выше нижней панели */
  button[class*='fixed bottom-24'][class*='left-'] {
    bottom: max(100px, calc(80px + env(safe-area-inset-bottom, 0px))) !important;
  }
}

/* === Защита от overflow === */
section, main, header, footer, article {
  max-width: 100vw;
}
