/**
 * Trang chủ desktop: giữ lưới 3 cột (danh mục | hero | lối tắt)
 * khi header đã là desktop (md 768px). Không đụng theme hashed,
 * không đụng mapping ảnh theo tên file / hydrate.
 */
html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) {
  --giasy-home-desk-sidebar: 220px;
  --giasy-home-desk-tiles: 220px;
}

@media (min-width: 768px) {
  html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) {
    display: grid !important;
    grid-template-columns: minmax(0, var(--giasy-home-desk-sidebar)) minmax(0, 1fr) minmax(0, var(--giasy-home-desk-tiles)) !important;
    align-items: stretch !important;
  }

  html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) > [data-home-category-sidebar="1"] {
    order: 1 !important;
    max-width: none !important;
    width: auto !important;
  }

  html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) > [class*="lg:order-2"] {
    order: 2 !important;
    min-height: 360px !important;
    height: auto !important;
    position: relative !important;
  }

  html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) > [class*="lg:order-2"] > [class*="lg:absolute"] {
    position: absolute !important;
    inset: 0 !important;
    height: 100% !important;
    width: 100% !important;
  }

  html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) > [class*="lg:order-3"],
  html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) > [class*="lg:grid-rows-4"] {
    order: 3 !important;
    display: grid !important;
    grid-template-rows: repeat(4, minmax(0, 1fr)) !important;
    min-height: 360px !important;
  }

  html.storefront-root [data-home-category-sidebar="1"] button[aria-label^="Mở danh mục con"] {
    display: none !important;
  }

  html.storefront-root [data-home-category-sidebar="1"] [class*="lg:hidden"].border-b {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  html.storefront-root .public-light-scope .container > .grid.grid-cols-1.items-stretch:has([data-home-category-sidebar="1"]) {
    --giasy-home-desk-sidebar: 260px;
    --giasy-home-desk-tiles: 280px;
    grid-template-columns: minmax(0, 260px) minmax(0, 1fr) minmax(0, 280px) !important;
  }
}