/* =====================================================
   LA — RESPONSIVE PATCH
   Append vào cuối mỗi file CSS tương ứng
   Covers: 768px (tablet) + 480px (phone) + 360px (small)
   ===================================================== */


/* ================================================================
   PATCH 1: linhanh__4_.css  (Trang chủ)
   ================================================================ */

/* ── Tablet ── */
@media (max-width: 768px) {

  /* Layout */
  .la-layout {
    flex-direction: column !important;
    padding: 0 12px !important;
    gap: 12px !important;
  }

  /* Sidebar — full width, không sticky */
  .la-sidebar {
    width: 100% !important;
    position: static !important;
    top: auto !important;
  }
  .la-sidebar.collapsed { width: 100% !important; }
  .la-sidebar.collapsed .la-cat-body { max-height: 0 !important; opacity: 0 !important; }

  /* Flyout sub-cat không ra ngoài màn hình */
  .la-flyout {
    position: static !important;
    width: 100% !important;
    border-left: none !important;
    box-shadow: none !important;
  }

  /* Cat tabs — scroll ngang */
  .la-cat-tabs {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 8px 10px !important;
    gap: 5px !important;
  }
  .la-cat-tabs::-webkit-scrollbar { display: none; }
  .la-tab { white-space: nowrap !important; font-size: 11px !important; padding: 4px 10px !important; }

  /* Promo 3 ô — 1 cột */
  .la-promo-row { grid-template-columns: 1fr !important; gap: 8px !important; }

  /* Hero */
  .la-hero {
    flex-direction: column !important;
    min-height: auto !important;
    padding: 22px 18px !important;
  }
  .la-hero-left { padding: 0 !important; }
  .la-hero-right { width: 100% !important; height: 180px !important; }
  .la-hero-blend-h {
    background: linear-gradient(to bottom, #132070 0%, rgba(19,32,112,0.5) 40%, transparent 70%) !important;
  }
  .la-hero-title { font-size: 24px !important; }
  .la-hero-stats { gap: 0 !important; flex-wrap: wrap !important; }
  .la-stat { padding-right: 16px !important; margin-right: 16px !important; min-width: 60px !important; }
  .la-hero-badge { font-size: 9px !important; padding: 4px 10px !important; }
  .la-hero-desc { font-size: 12.5px !important; }
  .la-hero-btn-main, .la-hero-btn-ghost { font-size: 12px !important; padding: 9px 18px !important; }

  /* Product grid — 2 cột */
  .la-prod-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .la-prod-card:nth-child(4n) { border-right: 1px solid var(--border) !important; }
  .la-prod-card:nth-child(2n) { border-right: none !important; }

  /* Block head subcats — ẩn trên mobile */
  .la-block-subcats a{ display: none}

  /* Divider ticker */
  .la-ticker { display:none; }
}

/* ── Phone nhỏ ── */
@media (max-width: 480px) {

  .la-page-wrapper { padding: 10px 0 32px !important; }
  .la-layout { padding: 0 10px !important; gap: 10px !important; }

  /* Hero */
  .la-hero { padding: 18px 14px !important; }
  .la-hero-title { font-size: 20px !important; letter-spacing: 0 !important; }
  .la-hero-right { height: 140px !important; }
  .la-hero-actions { flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; }
  .la-hero-btn-main { width: 100% !important; text-align: center !important; justify-content: center !important; }
  .la-hero-stats { padding-top: 14px !important; gap: 0 !important; }
  .la-stat strong, .la-stat-num { font-size: 18px !important; }
  .la-stat-lbl { font-size: 9px !important; }

  /* Product grid — 1 cột */
  .la-prod-grid { grid-template-columns: 1fr !important; }
  .la-prod-card:nth-child(2n) { border-right: 1px solid var(--border) !important; }

  /* Promo */
  .la-promo-card { padding: 12px !important; }
  .la-promo-icon { width: 34px !important; height: 34px !important; }

  /* Block head */
  .la-block-title { font-size: 11.5px !important; }
  .la-block-more { font-size: 11px !important; }

}

/* ── Rất nhỏ ── */
@media (max-width: 360px) {
  .la-hero-title { font-size: 18px !important; }
  .la-prod-grid { grid-template-columns: 1fr !important; }
  .la-layout { padding: 0 8px !important; }
}


/* ================================================================
   PATCH 2: linhanhproduct__1_.css  (Danh sách + Chi tiết SP)
   ================================================================ */

@media (max-width: 768px) {

  /* Archive */
  .la-archive-head { flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; }
  .la-archive-title { font-size: 13px !important; }
  .la-filter-bar { flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; }
  .la-filter-left { flex-wrap: wrap !important; gap: 5px !important; }
  .la-sort-form { width: 100% !important; }
  .la-sort-select { width: 100% !important; }

  /* Archive grid 2 cột */
  .la-archive-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* Product detail — stack dọc */
  .la-product-top { grid-template-columns: 1fr !important; }
  .la-product-gallery {
    border-right: none !important;
    border-bottom: 1px solid var(--border) !important;
    padding: 16px !important;
  }
  .la-product-main-img { max-height: 280px !important; aspect-ratio: auto !important; }
  .la-product-info-panel { padding: 16px !important; }
  .la-product-title { font-size: 17px !important; }
  .la-product-price-main { font-size: 18px !important; }
  .la-product-actions { flex-wrap: wrap !important; }
  .la-btn-contact, .la-btn-quote { font-size: 12px !important; padding: 9px 16px !important; }

  /* Catalog link */
  .la-catalog-link { width: 100% !important; max-width: 100% !important; }

  /* Tabs */
  .la-tabs-nav { flex-wrap: wrap !important; }
  .la-tab-nav-btn { font-size: 11.5px !important; padding: 9px 12px !important; }

  /* Related */
  .la-related-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .la-related-card:nth-child(3n) { border-right: 1px solid var(--border) !important; }
  .la-related-card:nth-child(2n) { border-right: none !important; }

  /* Spec table */
  .la-spec-table td:first-child { width: 130px !important; }

  /* Meta table */
  .la-product-meta-table td:first-child { width: 110px !important; }
  .la-product-meta-pills { flex-wrap: wrap !important; gap: 8px !important; }
  .la-product-main-meta { grid-template-columns: 1fr !important; }
}

@media (max-width: 480px) {

  /* Archive 1 cột */
  .la-archive-grid { grid-template-columns: 1fr !important; }
  .la-archive-block { overflow-x: hidden !important; }

  /* Category bar */
  .la-product-catbar-name { font-size: 11px !important; letter-spacing: 0.5px !important; }

  /* Product info */
  .la-product-title { font-size: 16px !important; }
  .la-product-price-main { font-size: 17px !important; }
  .la-btn-contact, .la-btn-quote {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  /* Thumbnails */
  .la-thumb { width: 50px !important; height: 50px !important; }

  /* Tabs */
  .la-tab-nav-btn { font-size: 11px !important; padding: 8px 10px !important; letter-spacing: 0 !important; }

  /* Related 1 cột */
  .la-related-grid { grid-template-columns: 1fr 1fr !important; }

  /* Pagination */
  .la-pagination ul { flex-wrap: wrap !important; justify-content: center !important; }
  .la-page-btn { width: 30px !important; height: 30px !important; font-size: 12px !important; }

  /* Breadcrumb */
  .la-breadcrumb { font-size: 11px !important; }
  .la-breadcrumb .current {
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 180px; display: inline-block;
  }
}


/* ================================================================
   PATCH 3: linhanhabout.css  (Giới thiệu / Giấy tờ)
   ================================================================ */

@media (max-width: 768px) {

  /* Hero */
  .la-about-hero {
    flex-direction: column !important;
    padding: 20px 16px !important;
    gap: 14px !important;
  }
  .la-about-logo { width: 68px !important; height: 68px !important; }
  .la-about-hero-title { font-size: 17px !important; }
  .la-about-hero-desc { font-size: 12px !important; max-width: 100% !important; }

  /* Info grid 1 cột */
  .la-info-grid { grid-template-columns: 1fr !important; gap: 0 !important; }
  .la-info-label { width: 110px !important; font-size: 12px !important; }
  .la-info-val { font-size: 12.5px !important; }

  /* Partners 2 cột */
  .la-partners-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .la-partner-card:nth-child(4n) { border-right: 1px solid var(--border) !important; }
  .la-partner-card:nth-child(2n) { border-right: none !important; }

  /* Docs 2 cột */
  .la-docs-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; padding: 14px !important; }

  /* Lightbox */
  .la-lb-prev, .la-lb-next { display: none !important; }
  .la-lb-inner { width: 96% !important; }
  .la-lb-caption { font-size: 11.5px !important; padding: 10px 14px !important; }

  /* Section title */
  .la-section-title { font-size: 11.5px !important; padding: 0 14px 0 14px !important; padding-right: 20px !important; }

  /* Sidebar contact */
  .la-about-contact-body { padding: 10px !important; gap: 8px !important; }
}

@media (max-width: 480px) {

  /* Hero */
  .la-about-hero { padding: 16px 12px !important; }
  .la-about-hero-title { font-size: 15px !important; }
  .la-about-logo { width: 56px !important; height: 56px !important; }

  /* Partners 2 cột */
  .la-partners-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .la-partner-logo { height: 44px !important; }
  .la-partner-name { font-size: 11px !important; }
  .la-partner-card { padding: 14px 10px !important; gap: 7px !important; }

  /* Docs 1 cột → 2 cột xếp chặt */
  .la-docs-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; padding: 12px !important; }
  .la-doc-caption h4 { font-size: 11.5px !important; }
  .la-doc-caption { padding: 8px 10px !important; }
  .la-doc-tag { font-size: 9px !important; padding: 2px 8px !important; }
  .la-doc-overlay-icon { width: 38px !important; height: 38px !important; }

  /* Lightbox full screen trên mobile */
  .la-lightbox { align-items: flex-end !important; }
  .la-lb-inner {
    width: 100% !important;
    max-height: 95vh !important;
    border-radius: 0 !important;
  }
  .la-lb-close { top: -40px !important; right: 8px !important; }
  .la-lb-img-wrap img { max-height: 70vh !important; }
}

@media (max-width: 360px) {
  .la-about-hero-title { font-size: 14px !important; }
  .la-docs-grid { grid-template-columns: 1fr !important; }
  .la-partners-grid { grid-template-columns: 1fr 1fr !important; }
}


/* ================================================================
   SHARED — Dùng chung cho cả 3 file
   ================================================================ */

/* Sidebar luôn không sticky trên mobile */
@media (max-width: 768px) {
  .la-sidebar { position: static !important; top: auto !important; }
  .la-sidebar-extra { margin-top: 10px !important; }

  /* Page wrapper padding */
  .la-page-wrapper { padding: 10px 0 32px !important; }

  /* Breadcrumb */
  .la-breadcrumb { padding: 8px 0 10px !important; font-size: 11.5px !important; flex-wrap: wrap !important; }

  /* Cat heading toggle — dễ tap hơn */
  .la-cat-heading { padding: 13px 14px !important; min-height: 44px !important; }
  .la-sidebar-btn { width: 36px !important; height: 36px !important; }

  /* Support box avatar tap area */
  .la-supp-item { padding: 13px 12px !important; }
  .la-supp-social a { width: 34px !important; height: 34px !important; }
  .social-zalo, .social-email { padding: 5px 12px !important; font-size: 12px !important; }
}

/* Tất cả touch target tối thiểu 44px */
@media (max-width: 768px) {
  .la-cat-link { min-height: 44px !important; }
  .la-prod-btn, .la-btn-contact, .la-btn-quote,
  .la-banner-btn, .la-hero-btn-main { min-height: 44px !important; }
  .la-tab-nav-btn { min-height: 40px !important; }
}