/* PRAASIA - stable stylesheet; update this file in place, no numbered releases. */

/* ---- praasia_show_product.css ---- */
/* PRAASIA Public Show Product V27 — three-column storefront shell. */
body.sp-shop-products-v27 {background:#20130e!important;color:#f5e6cb;font:14px/1.55 Tahoma,Arial,sans-serif}
body.sp-shop-products-v27 .sp27-shell {width:calc(100% - 32px);max-width:none;margin:0 auto 25px;min-width:0}
body.sp-shop-products-v27 .sp27-layout {display:grid;grid-template-columns:minmax(230px,20%) minmax(0,1fr) minmax(230px,20%);gap:14px;align-items:start;padding:14px}
body.sp-shop-products-v27 .sp27-layout > * {min-width:0}
body.sp-shop-products-v27 .psi-storefront-center .sp27-products {margin:0;min-width:0;overflow:hidden;border-radius:12px}
body.sp-shop-products-v27 .sp27-products .section-card {margin:0;border:0;border-radius:0;box-shadow:none;max-width:100%;width:100%;background:#fffaf2}
body.sp-shop-products-v27 .sp27-products .section-hero {padding:10px 13px}
body.sp-shop-products-v27 .sp27-products .section-hero .section-title {font-size:17px}
body.sp-shop-products-v27 .sp27-products .product-toolbar {margin:0;max-width:100%;min-width:0}
body.sp-shop-products-v27 .sp27-products .product-grid-wrap {width:100%;min-width:0;max-width:100%}
body.sp-shop-products-v27 .sp27-products .product-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;width:100%;max-width:100%;margin:0 auto;min-width:0}
body.sp-shop-products-v27 .sp27-products .product-card {min-width:0;max-width:100%;width:100%;overflow:hidden}
body.sp-shop-products-v27 .sp27-products .product-info,body.sp-shop-products-v27 .sp27-products .product-footer {min-width:0}
body.sp-shop-products-v27 .sp27-products .product-image {width:100%;aspect-ratio:1;overflow:hidden}
body.sp-shop-products-v27 .sp27-products .product-image img {width:100%;height:100%;object-fit:cover}
body.sp-shop-products-v27 .psi-storefront-left .psi-section,body.sp-shop-products-v27 .psi-storefront-right .psi-section {margin:0}
body.sp-shop-products-v27 .psi-storefront-right .psi-welcome-copy {overflow-wrap:anywhere;white-space:normal}
body.sp-shop-products-v27 .psi-storefront-right .psi-warranty ul {margin-bottom:0}
body.sp-shop-products-v27 .psi-storefront-left .psi-data-row dd {overflow-wrap:anywhere}
body.sp-shop-products-v27 .sp27-products .score-popover {z-index:30}
@media (max-width:1500px){body.sp-shop-products-v27 .sp27-products .product-grid {grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:1199px){body.sp-shop-products-v27 .sp27-layout {grid-template-columns:230px minmax(0,1fr);grid-template-areas:"left center" "right center"}body.sp-shop-products-v27 .psi-storefront-left{grid-area:left}body.sp-shop-products-v27 .psi-storefront-center{grid-area:center}body.sp-shop-products-v27 .psi-storefront-right{grid-area:right}body.sp-shop-products-v27 .sp27-products .product-grid {grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:750px){body.sp-shop-products-v27 .sp27-layout {grid-template-columns:1fr;grid-template-areas:"left" "center" "right";padding:10px;gap:10px}body.sp-shop-products-v27 .sp27-products .product-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}body.sp-shop-products-v27 .sp27-shell {width:calc(100% - 12px)}body.sp-shop-products-v27 .psi-storefront-left .psi-hero {padding:12px}body.sp-shop-products-v27 .sp27-products .product-grid-wrap {padding:5px}}
@media (max-width:380px){body.sp-shop-products-v27 .sp27-products .product-name {font-size:9px}body.sp-shop-products-v27 .sp27-products .product-footer {font-size:9px}}

/* Scope the 3-column page's product cards to its flexible center rather than viewport. */
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-bar {flex:none}
body.sp-shop-products-v27 .sp27-products .product-card {font-size:11px}
body.sp-shop-products-v27 .sp27-products .product-footer {white-space:normal}
@media(max-width:750px){body.sp-shop-products-v27 .psi-site-header .ps-main-nav {min-width:0}}

/* V28: fix the shop info card having a light background with light text.
   This left-side section is a direct child, unlike the nested section on shop_index.php. */
body.sp-shop-products-v27 .sp27-layout .psi-storefront-left > .psi-section {
  background:#37261b;
  color:#f6e3c4;
  border:1px solid #856340;
  box-shadow:0 7px 16px rgba(0,0,0,.13);
}
body.sp-shop-products-v27 .sp27-layout .psi-storefront-left > .psi-section .psi-heading {
  background:#4e3321;
  color:#ffe4ae;
  border-bottom:1px solid #84603d;
}
body.sp-shop-products-v27 .sp27-layout .psi-storefront-left > .psi-section .psi-data-rows {
  background:transparent;
}
body.sp-shop-products-v27 .sp27-layout .psi-storefront-left > .psi-section .psi-data-row {
  border-bottom-color:#6d5038;
}
body.sp-shop-products-v27 .sp27-layout .psi-storefront-left > .psi-section .psi-data-row dt {
  color:#f0cfa1;
}
body.sp-shop-products-v27 .sp27-layout .psi-storefront-left > .psi-section .psi-data-row dd {
  color:#fff2d8;
  font-weight:600;
}
body.sp-shop-products-v27 .sp27-layout .psi-storefront-left > .psi-section .psi-data-row dt i {
  background:#60432c;
  color:#f6d49a;
}

/* V28: central PRAASIA communication helper, below the shop notice on the right. */
body.sp-shop-products-v27 .psi-storefront-right .sp28-trade-help {
  background:#37261b;
  color:#f5dfba;
  border:1px solid #856340;
}
body.sp-shop-products-v27 .sp28-trade-help .psi-heading {
  background:#4e3321;
  color:#ffe4ae;
  border-bottom:1px solid #84603d;
}
body.sp-shop-products-v27 .sp28-trade-content {padding:13px 13px 11px;min-width:0;}
body.sp-shop-products-v27 .sp28-trade-note {
  margin:0 0 10px;color:#dfc7a4;line-height:1.55;
  font-size:12px;overflow-wrap:anywhere;
}
body.sp-shop-products-v27 .sp28-trade-list {margin:0;}
body.sp-shop-products-v27 .sp28-trade-row {
  display:grid;grid-template-columns:minmax(0,42%) minmax(0,1fr);
  gap:8px;align-items:center;padding:10px 0;
  border-top:1px solid #705139;
}
body.sp-shop-products-v27 .sp28-trade-row dt {
  display:flex;gap:8px;align-items:center;min-width:0;
  font-size:12px;font-weight:700;color:#f4d6a5;
}
body.sp-shop-products-v27 .sp28-trade-row dt i {
  display:grid;place-items:center;width:27px;height:27px;
  border-radius:8px;flex:none;background:#63442d;color:#f5d499;font-size:14px;
}
body.sp-shop-products-v27 .sp28-trade-row dd {
  display:flex;justify-content:flex-end;align-items:center;gap:6px;
  min-width:0;margin:0;text-align:right;
  font-size:12px;font-weight:700;color:#fff1d7;
  overflow-wrap:anywhere;
}
body.sp-shop-products-v27 .sp28-trade-row dd span,
body.sp-shop-products-v27 .sp28-trade-row dd a {min-width:0;overflow-wrap:anywhere;}
body.sp-shop-products-v27 .sp28-trade-row dd a {color:#ffe09a;text-decoration:underline;text-underline-offset:3px;}
body.sp-shop-products-v27 .sp28-copy {
  flex:none;display:grid;place-items:center;width:29px;height:29px;
  padding:0;border:1px solid #92704b;border-radius:7px;
  background:#503623;color:#f5d7a5;cursor:pointer;
}
body.sp-shop-products-v27 .sp28-copy:hover,
body.sp-shop-products-v27 .sp28-copy:focus-visible {background:#6b492e;outline:2px solid #f1c980;outline-offset:1px;}
body.sp-shop-products-v27 .sp28-copy-status {margin:0;min-height:0;font-size:11px;line-height:1.4;color:#ffe09a;}
body.sp-shop-products-v27 .sp28-copy-status:empty {display:none;}
@media (max-width:380px) {
  body.sp-shop-products-v27 .sp28-trade-row {grid-template-columns:minmax(0,40%) minmax(0,1fr);gap:4px;}
  body.sp-shop-products-v27 .sp28-trade-row dd {font-size:11px;}
}

/* ---- praasia_show_product.css ---- */
/* PRAASIA Public V30 — native popover for score: independent from JavaScript. */
body.sp-shop-products-v27 .sp27-products .sp30-score-button {
  display:inline-flex;align-items:center;gap:3px;min-width:0;max-width:100%;
  padding:0;margin:0;border:0;border-radius:4px;background:none;
  font:inherit;line-height:1.25;color:inherit;text-align:left;cursor:pointer;
}
body.sp-shop-products-v27 .sp30-score-button .score-icon {display:inline-flex;align-items:center;justify-content:center;flex:none;}
body.sp-shop-products-v27 .sp30-score-button .product-code {min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
body.sp-shop-products-v27 .sp30-score-button:focus-visible {outline:2px solid #e6bd76;outline-offset:2px;}
/* [popover] is rendered in the browser top layer and never clipped by an overflowing card. */
body.sp-shop-products-v27 .sp30-score-popover {
  position:fixed;inset:0;margin:auto;box-sizing:border-box;
  width:min(380px, calc(100vw - 24px));max-width:calc(100vw - 24px);
  max-height:min(80dvh,560px);padding:0;
  overflow-x:hidden;overflow-y:auto;
  border:1px solid #c99a52;border-radius:14px;
  background:linear-gradient(160deg,#4c2b18,#271508);color:#fff0d6;
  box-shadow:0 24px 70px rgba(0,0,0,.62);
  font:13px/1.55 Tahoma,Arial,sans-serif;
  overscroll-behavior:contain;
}
body.sp-shop-products-v27 .sp30-score-popover:not(:popover-open) {display:none;}
body.sp-shop-products-v27 .sp30-score-popover:popover-open {display:block;}
body.sp-shop-products-v27 .sp30-score-popover::backdrop {background:rgba(12,6,1,.48);}
body.sp-shop-products-v27 .sp30-score-popover-title {
  position:sticky;top:0;z-index:1;
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:10px 12px;background:#53321d;border-bottom:1px solid #a37c47;
  color:#ffe3af;font-weight:700;font-size:14px;
}
body.sp-shop-products-v27 .sp30-score-close {
  display:grid;place-items:center;flex:none;width:32px;height:32px;padding:0;
  border:1px solid #bc8b4f;border-radius:8px;background:#69462b;
  color:#ffe3af;cursor:pointer;font:23px/1 Tahoma,Arial,sans-serif;
}
body.sp-shop-products-v27 .sp30-score-close:focus-visible {outline:2px solid #f5d495;outline-offset:2px;}
body.sp-shop-products-v27 .sp30-score-popover .score-popover-body {
  display:block!important;padding:15px;min-width:0;box-sizing:border-box;
}
body.sp-shop-products-v27 .sp30-score-popover .score-progress-wrap {width:100%;min-width:0;}
body.sp-shop-products-v27 .sp30-score-popover .score-progress-text {font-size:12px;white-space:nowrap;color:#1e120a;}
body.sp-shop-products-v27 .sp30-score-popover .score-note {font-size:12px;line-height:1.65;overflow-wrap:anywhere;color:#ffe5b6;}
@media(max-width:600px){
 body.sp-shop-products-v27 .sp30-score-popover {width:calc(100vw - 20px);max-width:calc(100vw - 20px);max-height:78dvh;}
 body.sp-shop-products-v27 .sp30-score-popover .score-popover-body {padding:12px;}
}

/* ---- praasia_show_product_language.css ---- */
/* PRAASIA Public V31: language dropdown in Show Product's shop-style navigation.
   Scoped to this page; other Shop and Public pages are not changed.
   The regular Shops V15.8 stylesheet is linked first when available. These rules
   keep the control usable if the Shops CSS is missing or legacy page CSS conflicts. */
body.sp-shop-products-v27 .psi-site-header .ps-main-nav {
  overflow:visible;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav > .pra-shops-lang-bar.pra-shops-lang-inline {
  position:relative;
  z-index:30;
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:auto!important;
  min-width:0;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-wrap {
  position:relative;
  min-width:0;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-trigger {
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:0;
  min-height:40px;
  padding:7px 12px;
  border:1px solid #7385a0;
  border-radius:999px;
  background:linear-gradient(180deg,#465b79,#30425f);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  color:#fff;
  font:700 13px/1.35 Tahoma,"Noto Sans Thai",Arial,sans-serif;
  cursor:pointer;
  white-space:nowrap;
  box-sizing:border-box;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-trigger:hover,
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-trigger[aria-expanded="true"] {
  background:linear-gradient(180deg,#536b8a,#354c6a);
  border-color:#a9bfd9;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-icon,
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-chevron {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  color:#eef5ff;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-icon svg,
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-chevron svg {
  display:block;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-label {
  display:block;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-menu {
  position:absolute;
  top:calc(100% + 7px);
  right:0;
  z-index:100;
  display:block;
  width:190px;
  max-width:min(90vw,240px);
  padding:5px;
  border:1px solid #7389a7;
  border-radius:12px;
  background:#2c3c55;
  box-shadow:0 12px 28px rgba(0,0,0,.3);
  max-height:min(60vh,300px);
  overflow-y:auto;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-menu[hidden] {
  display:none!important;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-choice {
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  min-height:41px;
  padding:8px 10px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#fff;
  font:600 13px/1.45 Tahoma,"Noto Sans Thai",Arial,sans-serif;
  text-align:left;
  cursor:pointer;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-choice:hover,
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-choice.is-selected {
  background:#465e7c;
  color:#fff;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-choice-flag {
  flex:none;
  font-size:16px;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-choice-check {
  margin-left:auto;
  color:#f3d193;
  font-weight:700;
}
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-trigger:focus-visible,
body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-choice:focus-visible {
  outline:2px solid #f1c77e;
  outline-offset:2px;
}
@media(max-width:690px) {
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav > .pra-shops-lang-bar.pra-shops-lang-inline {
    flex:initial;
    width:100%!important;
    min-width:0;
  }
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-wrap,
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-trigger {
    width:100%!important;
    min-width:0;
  }
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-trigger {
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:1px;
    height:43px;
    min-height:43px;
    padding:2px 3px;
    border-radius:9px;
    font-size:10.5px;
    line-height:1.12;
  }
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-icon svg {
    width:16px;
    height:16px;
  }
  /* The fourth mobile nav tile has no room for a second chevron below its label. */
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-chevron {
    display:none!important;
  }
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-menu {
    right:0;
    width:min(190px,calc(100vw - 32px));
  }
}
@media(prefers-reduced-motion:reduce) {
  body.sp-shop-products-v27 .psi-site-header .ps-main-nav .pra-shops-lang-trigger {transition:none;}
}

/* ---- praasia_show_product_id.css ---- */
/* PRAASIA Public V32 — Show Product product IDs: never truncate digits.
   Scoped to this page. Does not change the trust score popover behavior. */
body.sp-shop-products-v27 .sp27-products .product-id-row {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  max-width:100%;
  white-space:nowrap;
}
body.sp-shop-products-v27 .sp27-products .product-id-row button.sp30-score-button {
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  flex:0 1 auto;
  gap:3px;
  min-width:0;
  width:auto;
  max-width:100%;
  white-space:nowrap;
}
body.sp-shop-products-v27 .sp27-products .product-id-row .score-icon {
  flex:0 0 auto;
  margin-right:0;
}
body.sp-shop-products-v27 .sp27-products .sp30-score-button .product-code {
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  gap:2px;
  width:auto;
  min-width:max-content;
  max-width:none;
  padding:1px 3px;
  overflow:visible;
  text-overflow:clip;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
  letter-spacing:0;
}
body.sp-shop-products-v27 .sp27-products .product-code .sp32-id-prefix,
body.sp-shop-products-v27 .sp27-products .product-code .sp32-id-number {
  display:inline;
  flex:none;
  min-width:0;
  white-space:nowrap;
}
@media (max-width:600px) {
  body.sp-shop-products-v27 .sp27-products .product-id-row button.sp30-score-button {gap:2px;}
  body.sp-shop-products-v27 .sp27-products .sp30-score-button .product-code {
    font-size:9px;
    line-height:1.3;
    gap:1px;
    padding:0 1px;
  }
}
@media (max-width:380px) {
  body.sp-shop-products-v27 .sp27-products .sp30-score-button .product-code {
    font-size:8.5px;
    gap:1px;
    padding:0;
  }
}
