/* ── MOBILE ADAPTATION ── */

/* Tablet ≤900px — minor adjustments */
@media (max-width: 900px) {
  .header { padding: 8px 14px; }
  .brand-nav { padding: 0 10px; overflow-x: auto; overflow-y: visible; -webkit-overflow-scrolling: touch; }
  .brand-tab { padding: 10px 12px; font-size: 11px; }
  .filters { padding: 8px 14px; flex-wrap: wrap; gap: 7px; }
  .catalog { padding: 10px 14px; }
  .col-photo { width: 100px; }
  .col-price { width: 80px; }
  .photo-wrap { width: 80px; height: 80px; }
  .prod-img { width: 80px; height: 80px; max-width: 80px; max-height: 80px; }
}

/* Mobile ≤600px — card layout */
@media (max-width: 600px) {

  /* Header */
  .header { padding: 8px 12px; }
  .logo img { height: 26px; }
  .logo-price { font-size: 14px; letter-spacing: 2px; }
  .header > div:last-child { display: none; }

  /* Brand nav */
  .brand-nav { padding: 0 6px; overflow-x: auto; overflow-y: visible; }
  .brand-tab { padding: 9px 10px; font-size: 10px; gap: 5px; white-space: nowrap; }

  /* PDF button */
  .pdf-btn { font-size: 11px; min-height: 30px; padding: 0 10px; }

  /* Filters */
  .filters { padding: 8px 12px; flex-direction: column; align-items: stretch; gap: 6px; }
  .filters label { font-size: 10px; margin-bottom: -2px; }
  .filters select, .filters input { width: 100%; font-size: 12px; padding: 7px 10px; }
  .filter-count { margin-left: 0; font-size: 10px; }

  /* Catalog */
  .catalog { padding: 12px 10px; }

  /* Cat block */
  .cat-block { margin-bottom: 10px; border-radius: 6px; }

  /* Cat header */
  .cat-header { padding: 12px 14px; }
  .cat-title { font-size: 13px; }
  .cat-count { font-size: 10px; }

  /* ── Convert table to vertical card stack ── */
  .ptable,
  .ptable thead,
  .ptable tbody,
  .ptable tr,
  .ptable td,
  .ptable th { display: block; width: 100%; box-sizing: border-box; }

  .ptable thead { display: none; }

  /* Card = flex column: td-name-mob → td-photo → td-info-mob → td-price */
  .ptable tbody tr.prod-row {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    border-bottom: 3px solid #eef0f4 !important;
    background: #fff;
    padding: 0;
  }
  .ptable td { border: none !important; padding: 0 !important; width: 100% !important; }

  /* 1 — Name */
  .td-name-mob {
    padding: 14px 16px 12px !important;
    border-bottom: 1px solid #f0f0f0;
  }
  .td-name-mob .prod-name-row { margin-bottom: 0; align-items: flex-start; gap: 8px; }
  .td-name-mob .prod-name-link { font-size: 15px; font-weight: 700; color: #1a1a2e; text-decoration: none; line-height: 1.4; }
  .td-name-mob .kit-badge { font-size: 9px; margin-top: 2px; }

  /* Original td-main: hidden on mobile */
  .td-main { display: none !important; }

  /* 2 — Photo centered */
  .td-photo {
    background: #f7f7f7 !important;
    border-bottom: 1px solid #ececec !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
  }
  .photo-wrap { width: 160px !important; height: 160px !important; }
  .prod-img { width: 160px !important; height: 160px !important; max-width: 160px !important; max-height: 160px !important; }
  .photo-placeholder,
  .photo-wrap.missing-photo::after { width: 160px !important; height: 160px !important; }

  /* 3 — Info block */
  .td-info-mob {
    padding: 14px 16px !important;
    display: block !important;
  }
  .td-info-mob .prod-specs { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 12px; }
  .td-info-mob .prod-specs span { font-size: 10px; padding: 3px 8px; line-height: 1.4; }
  .td-info-mob .kit-contents { margin-top: 0; padding: 10px 12px; }
  .td-info-mob .kit-label { font-size: 10px; margin-bottom: 6px; }
  .td-info-mob .kit-item { font-size: 11px; line-height: 1.8; }
  .td-info-mob .addons-block { margin-top: 10px; padding: 10px 12px; }
  .td-info-mob .addons-label { font-size: 10px; margin-bottom: 6px; }
  .td-info-mob .addon-name-cell { padding: 6px 10px; }
  .td-info-mob .addon-name { font-size: 11px; }
  .td-info-mob .addon-price-cell { font-size: 11px; width: 56px; padding: 6px 10px; }

  /* 4 — Price */
  .td-price {
    background: #f8f8f8 !important;
    border: none !important;
    border-top: 1px solid #e8e8e8 !important;
    text-align: right !important;
    padding: 12px 16px !important;
    vertical-align: middle !important;
  }
  .price-stack { align-items: flex-end; }
  .price-eur { font-size: 18px; }

  .footer { font-size: 10px; padding: 12px; }
}

/* Extra-small ≤400px */
@media (max-width: 400px) {
  .brand-tab { padding: 8px 7px; font-size: 9px; }
  .brand-dot { display: none; }
  .catalog { padding: 6px 4px; }
}