/**
 * layout-polish on C7/BN2 — typography/layout ONLY.
 * Does NOT replace index-BN2ZtJyR.css or index-C7BUmI7G.js.
 * Rollback: remove this <link> + certs inject <script> from index.html.
 */

/* —— 2) Header logo enlarge (C7 uses Tailwind w-24 = 96px; no storefront-chrome vars) —— */
@media (min-width: 768px) {
  #site-sticky-header a[href="/"] > div.flex.items-center.justify-center,
  #site-sticky-header a[href="/"] .w-10.h-10.md\:w-24.md\:h-24,
  #site-sticky-header a[href="/"] div.md\:w-24 {
    width: 7.5rem !important;   /* 120px */
    height: 7.5rem !important;
    min-width: 7.5rem !important;
    min-height: 7.5rem !important;
    max-width: 7.5rem !important;
    max-height: 7.5rem !important;
  }
}
@media (min-width: 1536px) {
  #site-sticky-header a[href="/"] > div.flex.items-center.justify-center {
    width: 8.5rem !important;  /* 136px */
    height: 8.5rem !important;
    min-width: 8.5rem !important;
    min-height: 8.5rem !important;
    max-width: 8.5rem !important;
    max-height: 8.5rem !important;
  }
}

/* —— 5) Hero side quick-link cards — preferred ~12 / 15 (beat BN2 13/20 rule) —— */
#main-content [class*="lg:grid-rows-4"] button[class*="min-h-[84px]"] {
  min-height: 0 !important;
  padding: 0.35rem 0.6rem !important;
}
#main-content [class*="lg:grid-rows-4"] button[class*="min-h-[84px]"] p:first-child {
  font-size: 0.75rem !important; /* 12px */
  line-height: 1rem !important;
  letter-spacing: 0.04em !important;
  font-weight: 600 !important;
}
#main-content [class*="lg:grid-rows-4"] button[class*="min-h-[84px]"] p:last-of-type {
  margin-top: 0.12rem !important;
  font-size: 0.9375rem !important; /* 15px */
  line-height: 1.25rem !important;
  font-weight: 600 !important;
}
#main-content [class*="lg:grid-rows-4"] button[class*="min-h-[84px]"] svg {
  width: 0.875rem !important;
  height: 0.875rem !important;
}

/* —— 1) Thông số đại diện: one param per row + blue frames —— */
/* Live home cards use flex-wrap pills; BN2 misses some arbitrary utilities → restore framed rows */
#main-content a[class*="min-h-[308px]"] > div.mt-1.flex.flex-wrap,
#main-content a[class*="min-h-[316px]"] > div.mt-1.flex.flex-wrap,
#main-content a[class*="min-h-[308px]"] > div.mt-1.flex.min-h-\[1\.2rem\],
#main-content a[class*="min-h-[316px]"] > div.mt-1.flex.min-h-\[1\.2rem\] {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 0.28rem !important;
  min-height: 0 !important;
}
#main-content a[class*="min-h-[308px]"] > div.mt-1.flex.flex-wrap > span,
#main-content a[class*="min-h-[316px]"] > div.mt-1.flex.flex-wrap > span,
#main-content a[class*="min-h-[308px]"] > div.mt-1.flex.min-h-\[1\.2rem\] > span,
#main-content a[class*="min-h-[316px]"] > div.mt-1.flex.min-h-\[1\.2rem\] > span {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  align-items: center !important;
  border: 1px solid rgba(0, 119, 182, 0.4) !important;
  background-color: #e8fbff !important;
  border-radius: 0.375rem !important;
  padding: 0.3rem 0.55rem !important;
  color: #0b4f6a !important;
  font-size: 0.6875rem !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  white-space: normal !important;
}
/* Nested truncate span inherits */
#main-content a[class*="min-h-[308px]"] > div.mt-1.flex > span > span,
#main-content a[class*="min-h-[316px]"] > div.mt-1.flex > span > span {
  color: inherit !important;
  font-size: inherit !important;
}

/* Optional: HomeSpecHighlightTable if present */
[data-giasy-spec-table="home-card"] {
  display: block !important;
  width: 100% !important;
  margin-top: 0.35rem !important;
}
[data-giasy-spec-table="home-card"] table {
  display: table !important;
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 0.2rem !important;
}
[data-giasy-spec-table="home-card"] .spec-value-btn {
  border: 1px solid rgba(0, 119, 182, 0.4) !important;
  background-color: #e8fbff !important;
  border-radius: 0.375rem !important;
  color: #0b4f6a !important;
  box-shadow: none !important;
}

/* —— 3) Product card text +2 sizes —— */
#main-content a[class*="min-h-[308px]"] > p.line-clamp-2,
#main-content a[class*="min-h-[316px]"] > p.line-clamp-2 {
  font-size: 1.125rem !important; /* 18px (was ~14) */
  line-height: 1.35 !important;
  min-height: 2.85rem !important;
}
#main-content a[class*="min-h-[308px]"] > p.mt-1.truncate,
#main-content a[class*="min-h-[316px]"] > p.mt-1.truncate {
  font-size: 0.875rem !important; /* 14px (was 11) */
  line-height: 1.3 !important;
}
#main-content a[class*="min-h-[308px]"] p.text-base.font-bold,
#main-content a[class*="min-h-[316px]"] p.text-base.font-bold {
  font-size: 1.25rem !important; /* 20px (was 16) */
  line-height: 1.3 !important;
}
#main-content a[class*="min-h-[308px]"] .mt-auto > span,
#main-content a[class*="min-h-[316px]"] .mt-auto > span {
  font-size: 0.9375rem !important; /* 15px (was 12) */
  line-height: 1.2 !important;
}

/* —— 4) Dealer cert strip (vanilla inject) — ~4.25–5 / row, readable thumbs —— */
[data-layout-polish-certs] {
  border-top: 1px solid var(--border, #e2e8f0);
  background: var(--bg-card, #fff);
  padding: 2.5rem 0;
}
[data-layout-polish-certs] .lpc-inner {
  max-width: 80rem;
  margin: 0 auto;
  padding: 0 1rem;
}
[data-layout-polish-certs] .lpc-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin: 0 0 0.5rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--primary, #0e7490);
}
[data-layout-polish-certs] .lpc-sub {
  text-align: center;
  color: var(--text-muted, #64748b);
  font-size: 0.875rem;
  margin: 0 0 1.25rem;
}
[data-layout-polish-certs] .lpc-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 1rem;
  overflow-x: auto;
  list-style: none;
  margin: 0;
  padding: 0 0 0.5rem;
  scrollbar-width: thin;
}
[data-layout-polish-certs] .lpc-row > li {
  flex: 0 0 calc((100% - 3.75rem) / 4.25);
  width: calc((100% - 3.75rem) / 4.25);
  max-width: calc((100% - 3.75rem) / 4.25);
  min-width: 0;
}
@media (max-width: 767px) {
  [data-layout-polish-certs] .lpc-row > li {
    flex-basis: calc((100% - 0.75rem) / 2);
    width: calc((100% - 0.75rem) / 2);
    max-width: 11rem;
  }
}
[data-layout-polish-certs] .lpc-row button {
  display: flex;
  width: 100%;
  flex-direction: column;
  padding: 0.4rem;
  border-radius: 0.75rem;
  border: 1px solid var(--border, #e2e8f0);
  background: #fff;
  cursor: pointer;
  text-align: left;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
[data-layout-polish-certs] .lpc-row button:hover {
  border-color: var(--primary, #0e7490);
  box-shadow: 0 4px 12px rgba(14, 116, 144, 0.12);
  transform: translateY(-1px);
}
[data-layout-polish-certs] .lpc-media {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 0.5rem;
  background: #fff;
  max-height: 11rem;
}
[data-layout-polish-certs] .lpc-media img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 11rem;
  object-fit: contain;
  padding: 0.35rem;
}
[data-layout-polish-certs] .lpc-more {
  text-align: center;
  margin-top: 1.25rem;
}
[data-layout-polish-certs] .lpc-more a {
  color: var(--primary, #0e7490);
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
}
[data-layout-polish-certs-lightbox] {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(15, 23, 42, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
[data-layout-polish-certs-lightbox][hidden] { display: none !important; }
[data-layout-polish-certs-lightbox] .lpc-lb-inner {
  position: relative;
  max-width: min(96vw, 1600px);
  max-height: 92vh;
  background: #fff;
  border-radius: 0.75rem;
  padding: 0.75rem;
  overflow: auto;
}
[data-layout-polish-certs-lightbox] img {
  display: block;
  max-width: 100%;
  max-height: 82vh;
  width: auto;
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}
[data-layout-polish-certs-lightbox] .lpc-lb-cap {
  text-align: center;
  font-size: 0.875rem;
  color: #64748b;
  margin-top: 0.5rem;
}
[data-layout-polish-certs-lightbox] .lpc-lb-close {
  position: absolute;
  top: 0.35rem;
  right: 0.5rem;
  border: 0;
  background: transparent;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  color: #334155;
}
