/* PRAASIA Classic Gold — 2 compact store carousels (stable filename).
   Does not change existing product grids, database records, or other pages. */
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel {
  box-sizing:border-box;width:100%;max-width:100%;overflow:hidden;
  background:linear-gradient(165deg,#46260f,#2b170b);color:#ffebc0;border:1px solid #a67839;
  border-radius:13px;margin:12px 0;padding:14px 12px 10px;
  box-shadow:0 8px 20px rgba(0,0,0,.15);
  font-family:'Noto Sans Thai','Sarabun',Tahoma,Arial,sans-serif;
}
body.pra-fw-home .pra-shop-carousel *,body.pra-fw-home .pra-shop-carousel *::before,
body.pra-fw-home .pra-shop-carousel *::after {box-sizing:border-box;}
body.pra-fw-home .pra-shop-carousel__header {display:flex;gap:8px;align-items:center;justify-content:space-between;margin-bottom:8px;min-height:27px;}
body.pra-fw-home .pra-shop-carousel__headline {min-width:0;display:flex;align-items:center;gap:8px;}
body.pra-fw-home .pra-shop-carousel__emblem {display:inline-grid;place-items:center;flex:0 0 22px;width:22px;height:22px;background:#664016;border-radius:7px;font-size:10px;color:#ffdc96;}
body.pra-fw-home .pra-shop-carousel__header h2 {margin:0!important;min-width:0;font-size:clamp(13px,1.4vw,17px)!important;line-height:1.5!important;font-weight:700!important;color:#ffe4a6!important;letter-spacing:0;}
body.pra-fw-home .pra-shop-carousel__controls {display:flex;align-items:center;gap:5px;}
body.pra-fw-home .pra-shop-carousel__arrow:not([hidden]) {display:grid;place-items:center;width:27px;height:27px;background:#4a2b16;border:1px solid #ac8246;color:#ffe4b0;border-radius:8px;cursor:pointer;}
body.pra-fw-home .pra-shop-carousel__arrow[hidden] {display:none!important;}
body.pra-fw-home .pra-shop-carousel__arrow span {font-size:24px;line-height:1;transform:translateY(-2px);}
body.pra-fw-home .pra-shop-carousel__arrow:disabled {opacity:.35;cursor:not-allowed;}
body.pra-fw-home .pra-shop-carousel__viewport {width:100%;max-width:100%;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain;scroll-behavior:smooth;}
body.pra-fw-home .pra-shop-carousel__viewport::-webkit-scrollbar {display:none;}
body.pra-fw-home .pra-shop-carousel__items {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;align-items:start;}
body.pra-fw-home .pra-shop-carousel__items.pra-shop-carousel__track {display:flex;gap:0;align-items:stretch;min-width:0;}
body.pra-fw-home .pra-shop-carousel__page {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,auto));gap:7px;min-width:100%;width:100%;max-width:100%;scroll-snap-align:start;scroll-snap-stop:always;align-content:start;}
body.pra-fw-home .pra-shop-carousel__card {display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;max-width:100%;padding:4px 2px 6px;border:1px solid transparent;border-radius:8px;color:#443021!important;text-decoration:none!important;background:rgba(255,234,182,.035)!important;line-height:1.25;position:relative;transition:background .15s,border-color .15s;}
body.pra-fw-home .pra-shop-carousel__card:hover {background:#603718!important;border-color:#c89b55;}
body.pra-fw-home .pra-shop-carousel__card:focus-visible,
body.pra-fw-home .pra-shop-carousel__dots button:focus-visible,
body.pra-fw-home .pra-shop-carousel__arrow:focus-visible,
body.pra-fw-home .pra-shop-carousel__viewport:focus-visible {outline:2px solid #f4c771;outline-offset:2px;}
body.pra-fw-home .pra-shop-carousel__image-box {width:clamp(44px,6vw,78px);height:clamp(44px,6vw,78px);max-width:100%;display:grid;place-items:center;overflow:hidden;border-radius:9px;background:#fff9ef;border:1px solid #d4b584;}
body.pra-fw-home .pra-shop-carousel__image-box img {width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;display:block!important;object-fit:contain!important;border:0!important;margin:0!important;}
body.pra-fw-home .pra-shop-carousel__name {display:-webkit-box;max-width:100%;width:100%;min-height:2.5em;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;overflow-wrap:anywhere;text-align:center;font-size:clamp(10px,.92vw,12px)!important;line-height:1.25!important;font-weight:600;color:#fce5be;}
body.pra-fw-home .pra-shop-carousel__rank-icons {
  display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:1px;
  width:60px;max-width:100%;min-height:16px;margin:0 auto;
}
body.pra-fw-home .pra-shop-carousel__rank-icons img {
  display:block!important;width:18px!important;height:15px!important;max-width:none!important;
  margin:0!important;padding:0!important;border:0!important;object-fit:contain!important;flex:none;
}
body.pra-fw-home .pra-shop-carousel__score {
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  width:100%;min-width:0;max-width:100%;font-weight:700;font-size:10px;line-height:1.2;
  color:#f5cd79!important;text-align:center;
}
body.pra-fw-home .pra-shop-carousel__score-label {color:#fce6bd;overflow-wrap:anywhere;font-size:10px;}
body.pra-fw-home .pra-shop-carousel__score-value {display:block;font-size:11px;color:#ffd45d;font-variant-numeric:tabular-nums;}
body.pra-fw-home .pra-shop-carousel__empty {grid-column:1/-1;margin:0;padding:24px 12px;text-align:center;color:#d6b98b;font-size:13px;}
body.pra-fw-home .pra-shop-carousel__dots {display:flex;align-items:center;justify-content:center;gap:7px;min-height:22px;padding-top:4px;}
body.pra-fw-home .pra-shop-carousel__dots button {width:7px;height:7px;border-radius:50%;background:#8e6d46;border:0;padding:0;cursor:pointer;transition:background .14s,transform .14s;}
body.pra-fw-home .pra-shop-carousel__dots button[aria-current="true"] {background:#f4c771;transform:scale(1.2);}
@media (min-width:701px) {body.pra-fw-home .pra-shop-carousel__arrow:not([hidden]){display:grid;}}
@media (max-width:700px) {
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel {margin:8px 0;padding:12px 6px 8px;border-radius:9px;box-shadow:none;}
  body.pra-fw-home .pra-shop-carousel__header {padding:0 7px;margin-bottom:9px;}
  body.pra-fw-home .pra-shop-carousel__header h2 {font-size:13px!important;}
  body.pra-fw-home .pra-shop-carousel__arrow {display:none!important;}
  body.pra-fw-home .pra-shop-carousel__page {gap:5px;}
  body.pra-fw-home .pra-shop-carousel__card {gap:3px;padding:3px 0 4px;}
  body.pra-fw-home .pra-shop-carousel__image-box {width:clamp(40px,14vw,60px);height:clamp(40px,14vw,60px);border-radius:8px;}
  body.pra-fw-home .pra-shop-carousel__name {font-size:10px!important;}
  body.pra-fw-home .pra-shop-carousel__rank-icons {width:44px;gap:0;min-height:13px;}
  body.pra-fw-home .pra-shop-carousel__rank-icons img {width:14px!important;height:12px!important;}
  body.pra-fw-home .pra-shop-carousel__score {font-size:9px!important;line-height:1.2;}
  body.pra-fw-home .pra-shop-carousel__score-label {font-size:8px;}
  body.pra-fw-home .pra-shop-carousel__score-value {font-size:9px;}
  body.pra-fw-home .pra-shop-carousel__dots {min-height:20px;}
}
@media (prefers-reduced-motion:reduce) {body.pra-fw-home .pra-shop-carousel__viewport {scroll-behavior:auto;}body.pra-fw-home .pra-shop-carousel__card,body.pra-fw-home .pra-shop-carousel__dots button{transition:none;}}

/* Ranked positions are explicit and independent of the raw score field. */
body.pra-fw-home .pra-shop-carousel__rank {
  position:absolute;top:0;left:0;min-width:19px;height:17px;padding:0 3px;
  display:grid;place-items:center;font:700 10px/1 Tahoma,Arial,sans-serif;
  border:1px solid #c3934e;border-radius:6px;color:#fce8b8;background:#603814;
}
/* Single theme for the full homepage: match the dark-brown and gold public shell. */
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__name,
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__header h2 {text-shadow:none!important;}

/* Desktop: keep five stores per row, but group the tiles instead of stretching
   them across a wide monitor. The page still fills the viewport for paging. */
@media (min-width:701px) {
  body.pra-fw-home .pra-shop-carousel__page {
    grid-template-columns:repeat(5,minmax(0,124px));
    justify-content:center;column-gap:10px;row-gap:12px;
  }
  body.pra-fw-home .pra-shop-carousel__card {padding:7px 4px 9px;gap:5px;}
  body.pra-fw-home .pra-shop-carousel__image-box {width:86px;height:86px;}
  body.pra-fw-home .pra-shop-carousel__name {font-size:12px!important;}
}
/* On wide desktop screens the entire shop showcase stays compact, including
   its frame, so the center-aligned cards do not sit in a very wide empty panel. */
@media (min-width:1000px) {
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel {
    max-width:850px;margin-left:auto;margin-right:auto;
  }
}

/* Responsive two-up shop showcase on large desktop.
   Keep the original mobile 5x2 paging, unchanged scores and independent sliders.
   This is the only place in the stylesheet that controls the two-section layout. */
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout {
  display:grid;
  width:100%;
  min-width:0;
  max-width:100%;
  grid-template-columns:minmax(0,1fr);
  gap:10px;
  align-items:stretch;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout > .pra-shop-carousel {
  min-width:0;
  width:100%;
  max-width:min(100%,850px);
  margin:8px auto;
}
@media (min-width:1200px) {
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout {
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:18px;
    row-gap:0;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout > .pra-shop-carousel {
    display:flex;
    flex-direction:column;
    max-width:none;
    height:100%;
    margin:0;
    padding:13px 10px 9px;
  }
  body.pra-fw-home .pra-shop-carousel-layout .pra-shop-carousel__viewport {
    min-width:0;
    flex:1 0 auto;
  }
  body.pra-fw-home .pra-shop-carousel-layout .pra-shop-carousel__dots {
    margin-top:auto;
  }
  body.pra-fw-home .pra-shop-carousel-layout .pra-shop-carousel__page {
    grid-template-columns:repeat(5,minmax(0,1fr));
    justify-content:center;
    column-gap:7px;
    row-gap:10px;
  }
  body.pra-fw-home .pra-shop-carousel-layout .pra-shop-carousel__card {
    min-width:0;
    padding:6px 2px 8px;
    gap:4px;
  }
  body.pra-fw-home .pra-shop-carousel-layout .pra-shop-carousel__image-box {
    width:clamp(61px,5.3vw,84px);
    height:clamp(61px,5.3vw,84px);
  }
  body.pra-fw-home .pra-shop-carousel-layout .pra-shop-carousel__name {
    font-size:clamp(10px,.83vw,12px)!important;
  }
}

/* Unfilled shop modules, framed like the three PC home panels.
   The homepage reference grid is 1 : 2.3 : 1 with 16px gutters.
   Split its center fraction into two halves to give the two existing
   carousels equal functional width without inventing a third section.
   No PHP, query, scores or autoplay changes. */
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout > .pra-shop-carousel {
  background:transparent;
  border:1px solid #a67839;
  border-radius:14px;
  box-shadow:0 10px 24px rgba(0,0,0,.15);
  padding:0;
  overflow:hidden;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__header {
  min-height:40px;
  margin:0;
  padding:7px 14px;
  background:linear-gradient(90deg,#61320e,#3a1c0a);
  border-bottom:1px solid #98703a;
  color:#ffe6a6;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__header h2 {
  color:#ffe6a6!important;
  font-size:14px!important;
  line-height:1.4!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__emblem {
  width:18px;height:18px;flex-basis:18px;
  background:transparent;color:#dbac57;border:1px solid #b78c50;
  border-radius:5px;font-size:9px;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__viewport {
  padding:12px 0 0;
}
/* Padding lives on each full-width page, not on the scroll viewport;
   prevents the first badge of the next page from peeking into view. */
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__page {
  padding:0 10px;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__dots {
  margin:0;padding:8px 8px 9px;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__card {
  background:transparent!important;
  border:1px solid transparent;
  border-radius:8px;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__card:hover,
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__card:focus-visible {
  background:rgba(124,78,25,.24)!important;
  border-color:#98703a;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout {
  gap:16px;
  align-items:stretch;
}
@media (min-width:1200px) {
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout {
    /* Shares the 1 : 2.3 : 1 proportions of .pra6-home-grid.
       The center 2.3 track is divided into 1.15 + 1.15. */
    grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1.15fr) minmax(0,1fr);
    gap:16px;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout > .pra-shop-carousel:first-child {
    grid-column:1 / span 2;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout > .pra-shop-carousel:last-child {
    grid-column:3 / span 2;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout > .pra-shop-carousel {
    padding:0;
    margin:0;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout .pra-shop-carousel__viewport {
    padding:12px 0 0;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout .pra-shop-carousel__dots {
    margin-top:auto;
  }
}
@media (max-width:700px) {
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel-layout > .pra-shop-carousel {
    padding:0;margin:8px 0;
    border-radius:10px;
    box-shadow:none;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__header {
    min-height:39px;
    margin:0;
    padding:7px 9px;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__header h2 {
    font-size:12px!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__viewport {
    padding:9px 0 0;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__page {
    padding:0 5px;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra-shop-carousel__dots {
    padding:7px 5px 8px;
  }
}