/* All rules are isolated from Ecomall, TS Products and the draft's legacy CSS. */
.se-products {
  --se-button-bg:var(--se-ink); --se-button-ink:#fff; --se-cover-x:50%; --se-cover-y:50%;
  --se-cover-height:180px; --se-name-lines:3;
  position:relative; isolation:isolate; overflow:hidden; min-width:0;
  background:var(--se-surface); color:var(--se-ink); padding:20px;
  border:1px solid var(--se-line); border-radius:var(--se-section-radius);
  font-family:var(--se-font);
  line-height:1.4; text-align:start;
}
.se-products *, .se-products *::before, .se-products *::after { box-sizing:border-box; }
.se-products a { color:inherit; text-decoration:none; }
.se-products a:focus-visible,.se-products button:focus-visible {
  outline:3px solid var(--se-accent); outline-offset:3px;
}
.se-products .se-cover { position:absolute; inset:0; z-index:-2; pointer-events:none; }
.se-products .se-cover__image {
  width:100%; height:100%; max-width:none; display:block;
  object-fit:cover; object-position:var(--se-cover-x) var(--se-cover-y);
}
.se-products .se-cover-overlay { position:absolute; inset:0; background:rgba(246,248,249,.65); z-index:-1; pointer-events:none; }
.se-products .se-cover-stage { position:relative; margin-bottom:16px; }
.se-products.se-has-cover .se-cover-stage { min-height:var(--se-cover-height); display:flex; align-items:center; }
.se-products .se-section-header { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; }
.se-products .se-section-title { font:inherit; font-size:24px; font-weight:700; line-height:1.2; color:var(--se-ink); margin:0; }
.se-products .se-section-subtitle { font-size:13px; line-height:1.45; color:var(--se-muted); margin:6px 0 0; }
.se-products .se-section-cta { min-height:44px; display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; flex-shrink:0; }
.se-products .se-section-cta:hover { color:var(--se-hover); text-decoration:underline; }
.se-products .se-carousel-shell,.se-products .se-carousel { min-width:0; position:relative; }
.se-products .se-carousel { overflow:hidden; touch-action:pan-y; }
/* Functional grid if JavaScript or a shared Swiper cannot be loaded. */
.se-products .se-track { display:grid; grid-template-columns:repeat(var(--se-grid-desktop,4),minmax(0,1fr)); gap:20px; margin:0; padding:0; }
.se-products.se-is-carousel .se-track { display:flex; gap:0; align-items:stretch; }
.se-products .se-slide { min-width:0; height:auto; display:flex; padding:0; }
.se-products.se-is-carousel .se-slide { flex-shrink:0; }
.se-products .se-card {
  display:flex; flex-direction:column; min-width:0; width:100%; height:auto;
  background:var(--se-card-bg); border:1px solid var(--se-line); border-radius:var(--se-radius);
  overflow:hidden; color:var(--se-ink); box-shadow:none; transform:none;
  transition:border-color .18s ease,box-shadow .18s ease;
}
.se-products .se-card:hover,.se-products .se-card:focus-within { border-color:var(--se-hover); box-shadow:var(--se-shadow); transform:none; }
.se-products .se-card__media { position:relative; flex-shrink:0; background:var(--se-surface); }
.se-products .se-card__image { position:relative; display:block; aspect-ratio:4/3; background:var(--se-surface); overflow:hidden; }
.se-products .se-card__image img { position:absolute; inset:7% 7.5%; width:85%; height:86%; object-fit:contain; mix-blend-mode:multiply; margin:0; border:0; border-radius:0; }
.se-products .se-card__sku { position:absolute; top:9px; left:9px; max-width:calc(100% - 18px); padding:4px 7px; border:1px solid var(--se-line); border-radius:99px; background:var(--se-card-bg); color:var(--se-value); font-size:10px; line-height:1.25; overflow-wrap:anywhere; pointer-events:none; }
.se-products .se-card__body { padding:12px; display:flex; flex-direction:column; gap:7px; flex:1; min-width:0; }
.se-products .se-card__category { font-size:10px; font-weight:700; line-height:1.35; letter-spacing:.055em; text-transform:uppercase; color:var(--se-brand-ink); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.se-products .se-card__name { font:inherit; color:var(--se-ink); font-size:14px; font-weight:650; line-height:1.4; margin:0; min-width:0; }
.se-products .se-card__name a {
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:var(--se-name-lines);
  overflow:hidden; color:inherit; overflow-wrap:anywhere;
}
.se-products .se-attributes {
  margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:3px 20px; font-size:12px; line-height:1.4; min-width:0; position:relative;
}
/* Only two rendered values receive a short, decorative column divider. */
.se-products .se-attributes:has(> div:nth-child(2))::after {
  content:''; position:absolute; left:50%; top:50%; transform:translateY(-50%);
  width:1px; height:28px; max-height:100%; background:var(--se-line); pointer-events:none;
}
/* Shared label/value rows keep both values aligned even when a label wraps.
   The original dl > div > dt/dd grouping and complete source text stay intact. */
.se-products .se-attributes > div { display:contents; }
.se-products .se-attributes > div:first-child > * { grid-column:1; }
.se-products .se-attributes > div:nth-child(2) > * { grid-column:2; }
.se-products .se-attributes > div:only-child > * { grid-column:1 / -1; }
.se-products .se-attributes dt {
  grid-row:1; min-width:0; margin:0; color:var(--se-muted);
  font-size:11px; line-height:1.35; font-weight:400; overflow-wrap:anywhere;
}
.se-products .se-attributes dd {
  grid-row:2; min-width:0; margin:0; font-weight:400; color:var(--se-value); overflow-wrap:anywhere;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;
  line-clamp:2; max-height:2.8em; overflow:hidden;
}
.se-products .se-card__stock,.se-products .se-card__stock p { margin:0; font-size:12px; color:var(--se-muted); }
.se-products .se-card__footer { margin-top:auto; padding-top:8px; border-top:1px solid var(--se-line); display:flex; align-items:flex-end; flex-wrap:wrap; justify-content:space-between; gap:8px; }
.se-products .se-card__price { min-width:0; flex:1 1 70px; color:var(--se-ink); font-size:16px; font-weight:700; line-height:1.4; overflow-wrap:anywhere; }
.se-products .se-card__price * { color:inherit; white-space:normal; }
.se-products .se-card__price del { font-weight:400; font-size:.82em; opacity:.65; }
.se-products .se-card__price ins { background:none; text-decoration:none; }
.se-products .se-card__price .woocommerce-price-suffix { display:block; font-size:11px; font-weight:400; }
.se-products .se-card__action { flex:0 1 auto; min-width:0; max-width:100%; position:relative; }
.se-products .se-card__action .button {
  display:inline-flex; justify-content:center; align-items:center; min-height:44px;
  padding:9px 12px; margin:0; position:relative; border:1px solid var(--se-button-bg);
  border-radius:10px; background:var(--se-button-bg); color:var(--se-button-ink);
  font:inherit; font-size:12px; line-height:1.35; font-weight:600; text-align:center; text-transform:none;
  box-shadow:none; float:none; white-space:normal; max-width:100%; text-decoration:none;
}
.se-products .se-card__action--icon { flex:0 0 44px; width:44px; }
.se-products .se-card__action--icon .button { width:44px; height:44px; padding:0; }
.se-products .se-card__action .button::before,.se-products .se-card__action .button::after { content:none !important; }
.se-products .se-card__action .button:hover,.se-products .se-card__action .button:focus-visible { background:var(--se-accent); border-color:var(--se-accent); color:var(--se-ink); }
.se-products .se-card__action .added_to_cart { display:block; font-size:11px; margin-top:4px; text-decoration:underline; color:var(--se-ink); }
/* WooCommerce appends this link after AJAX success. Keep the 44px purchase row
   stable; the extra native cart link remains readable by AT and on keyboard focus. */
.se-products .se-card__action--icon .added_to_cart {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.se-products .se-card__action--icon .added_to_cart:focus-visible {
  inset:0; width:44px; height:44px; margin:0; padding:3px; clip:auto;
  white-space:normal; display:flex; align-items:center; justify-content:center;
  background:var(--se-button-bg); color:var(--se-button-ink); border-radius:10px; z-index:1;
}
.se-products .se-icon { display:block; width:20px; height:20px; flex:0 0 20px; }
.se-products .se-icon--check,.se-products .added .se-icon--cart { display:none; }
.se-products .added .se-icon--check { display:block; }
.se-products .loading .se-icon { opacity:.25; }
.se-products .se-card__action .button.loading::after {
  content:'' !important; position:absolute; inset:13px; border:2px solid currentColor;
  border-right-color:transparent; border-radius:50%; animation:se-spin .7s linear infinite;
}
.se-products .se-carousel-controls { display:none; align-items:center; gap:16px; margin-top:14px; }
.se-products.se-is-carousel .se-carousel-controls { display:flex; }
.se-products .se-carousel-controls:empty { display:none; }
.se-products .se-navigation { display:flex; gap:8px; }
.se-products .se-navigation button {
  display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
  padding:0; border:1px solid var(--se-line); border-radius:50%; color:var(--se-ink); background:var(--se-card-bg); cursor:pointer;
}
.se-products .se-navigation button:hover { border-color:var(--se-hover); }
.se-products .se-navigation button:disabled { opacity:.35; cursor:default; }
.se-products .se-scrollbar.swiper-scrollbar { position:relative; inset:auto; height:4px; width:auto; flex:1; background:#E1E6EA; border-radius:4px; overflow:hidden; }
.se-products .swiper-scrollbar-drag { height:100%; border-radius:inherit; background:var(--se-accent); transition:transform .35s ease; }
.se-products.se-is-grid .se-carousel-controls { display:none; }
.se-products.se-has-cover.se-is-mobile .se-carousel-shell { background:#F6F8F9; padding:10px; border-radius:12px; }
.se-products--empty { padding:20px; font-size:14px; }
.se-products .se-sr-only {
  position:absolute !important; width:1px !important; height:1px !important; padding:0 !important;
  margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important;
}
@keyframes se-spin { to { transform:rotate(360deg); } }
@media(max-width:1024px) { .se-products:not(.se-is-carousel) .se-track { grid-template-columns:repeat(var(--se-grid-tablet,2),minmax(0,1fr)); gap:16px; } }
@media(max-width:767px) {
  .se-products { padding:14px; --se-cover-height:110px; }
  .se-products .se-section-title { font-size:22px; }
  .se-products .se-section-header { flex-wrap:wrap; gap:6px 12px; }
  .se-products .se-cover-stage { margin-bottom:12px; }
  .se-products:not(.se-is-carousel) .se-track { grid-template-columns:1fr; }
  .se-products.se-has-cover .se-carousel-shell { background:#F6F8F9; padding:10px; border-radius:12px; }
  .se-products .se-card__body { padding:10px; gap:6px; }
  .se-products .se-card__name { font-size:13px; }
  .se-products .se-card__price { font-size:14px; }
}
@media(prefers-reduced-motion:reduce) {
  .se-products .se-card,.se-products .swiper-wrapper,.se-products .swiper-scrollbar-drag { transition:none !important; }
  .se-products .se-card__action .button.loading::after { animation:none; }
}
