/* ============================================================
   WorldSkills Shop — shop listing + single product
   Brand red: #a6192e
   ============================================================ */

/* Clear the theme's fixed header + give the page room to breathe */
.ws-shop, .ws-single { padding: 110px 15px 80px; max-width: 1240px; }
@media (max-width: 991px) { .ws-shop, .ws-single { padding-top: 95px; } }
@media (max-width: 767px) { .ws-shop, .ws-single { padding-top: 80px; } }

/* ---------------- SHOP LISTING ---------------- */
.ws-shop-header { margin-bottom: 40px; padding-bottom: 22px; border-bottom: 1px solid #eee; }
.ws-shop-header h1 { color: #a6192e; margin: 0 0 12px; font-weight: 700; }
.ws-shop-intro { color: #555; font-size: 16px; line-height: 1.6; margin: 0; max-width: 760px; }
.ws-shop-body { margin-top: 8px; }

/* Filters sidebar */
.ws-filters { background: #faf7f8; border: 1px solid #eee; border-radius: 10px; padding: 24px; }
.ws-filters h3 { margin: 0 0 6px; color: #a6192e; font-size: 20px; }
.ws-filters > h3 { border-bottom: 2px solid #a6192e; padding-bottom: 12px; margin-bottom: 8px; }
.ws-filter-group { margin: 22px 0; }
.ws-filter-group h4 { font-size: 13px; text-transform: uppercase; letter-spacing: .8px; color: #888; margin: 0 0 12px; }
.ws-filter-row { display: flex; align-items: center; gap: 10px; font-weight: normal; cursor: pointer; padding: 8px 0; color: #444; margin: 0; line-height: 1.2; }
.ws-filter-row input[type="checkbox"] { width: 16px !important; height: 16px !important; min-width: 16px;
  margin: 0 !important; padding: 0 !important; flex: 0 0 auto; vertical-align: middle !important;
  position: static !important; top: auto !important; }
.ws-filter-row span { display: block; }
.ws-clear { background: #a6192e; color: #fff; border: 0; border-radius: 6px; padding: 11px 14px; cursor: pointer; width: 100%; margin-top: 8px; font-weight: 600; transition: background .2s; }
.ws-clear:hover { background: #7e1322; }

/* Product grid */
.ws-grid-row { display: flex; flex-wrap: wrap; margin: 0 -12px; }
.ws-card-col { padding: 0 12px; margin-bottom: 30px; display: flex; }
.ws-card { background: #fff; border: 1px solid #ececec; border-radius: 12px; overflow: hidden; width: 100%;
           display: flex; flex-direction: column; transition: box-shadow .22s, transform .22s; }
.ws-card:hover { box-shadow: 0 12px 30px rgba(166,25,46,.14); transform: translateY(-4px); }
.ws-card-out { opacity: .85; }
.ws-card-img { position: relative; display: block; background: #f3f3f3; line-height: 0; }
.ws-card-img img { width: 100%; height: auto; display: block; }
.ws-badge { position: absolute; top: 12px; left: 12px; background: #a6192e; color: #fff; font-size: 11px;
            text-transform: uppercase; letter-spacing: .6px; padding: 5px 11px; border-radius: 20px; font-weight: 600; }
.ws-badge-out { position: absolute; top: 12px; right: 12px; background: #333; color: #fff; font-size: 11px;
                text-transform: uppercase; letter-spacing: .6px; padding: 5px 11px; border-radius: 20px; }
.ws-card-body { padding: 18px 20px 22px; display: flex; flex-direction: column; flex: 1; }
.ws-card-title { margin: 0 0 8px; font-size: 18px; line-height: 1.3; }
.ws-card-title a { color: #222; text-decoration: none; }
.ws-card-title a:hover { color: #a6192e; }
.ws-card-sizes { color: #999; font-size: 13px; margin-bottom: 12px; }
.ws-card-stock { font-size: 13px; font-weight: 600; margin-bottom: 18px; }
.ws-card-stock.in { color: #1a7f37; }
.ws-card-stock.out { color: #b42318; }
.ws-card .ws-buy-btn { margin-top: auto; }
.ws-noresults { color: #888; padding: 30px 0; font-size: 16px; }

/* ---------------- BUY BUTTON ---------------- */
.ws-buy-btn { display: inline-block; background: #a6192e; color: #fff !important; text-decoration: none;
              padding: 12px 26px; border-radius: 8px; font-weight: 700; text-transform: uppercase;
              letter-spacing: .5px; border: 0; text-align: center; cursor: pointer; transition: background .2s, transform .1s; }
.ws-buy-btn:hover { background: #7e1322; transform: translateY(-1px); }
.ws-buy-lg { padding: 16px 44px; font-size: 16px; border-radius: 10px; }
.ws-buy-disabled, .ws-buy-disabled:hover { background: #c7c7c7; cursor: not-allowed; transform: none; }

/* ---------------- SINGLE PRODUCT (modern) ---------------- */
.ws-breadcrumb { font-size: 13px; color: #999; margin-bottom: 24px; }
.ws-breadcrumb a { color: #a6192e; text-decoration: none; }
.ws-breadcrumb span { margin: 0 8px; color: #ccc; }
.ws-single-grid { display: flex; flex-wrap: wrap; }
.ws-single-media, .ws-single-info { margin-bottom: 30px; }

/* Image + zoom */
.ws-zoom { position: relative; overflow: hidden; border: 1px solid #eee; border-radius: 14px;
           background-repeat: no-repeat; background-size: 0; cursor: zoom-in; background-color: #f6f6f6; }
.ws-zoom img { width: 100%; height: auto; display: block; transition: opacity .15s; }
.ws-zoom.zooming { background-size: 220%; }
.ws-zoom.zooming img { opacity: 0; }
.ws-zoom-hint { position: absolute; bottom: 12px; left: 12px; background: rgba(0,0,0,.6); color: #fff;
                font-size: 12px; padding: 6px 12px; border-radius: 20px; pointer-events: none; transition: opacity .15s; }
.ws-zoom.zooming .ws-zoom-hint { opacity: 0; }

/* Info column */
.ws-single-info { padding-left: 30px; }
.ws-single-info .ws-badge { position: static; display: inline-block; margin-bottom: 14px; }
.ws-badge-link { text-decoration: none; }
.ws-single-title { color: #1a1a1a; font-weight: 700; margin: 0 0 12px; line-height: 1.2; }
.ws-trust { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.ws-stars { color: #f5a623; letter-spacing: 2px; font-size: 16px; }
.ws-trust-text { color: #777; font-size: 13px; }
.ws-single-desc { color: #444; line-height: 1.75; font-size: 15.5px; margin: 0 0 28px;
                  padding-bottom: 28px; border-bottom: 1px solid #eee; }

/* Size picker */
.ws-size-picker { margin-bottom: 24px; }
.ws-size-picker-label { font-weight: 600; color: #333; margin-bottom: 12px; }
.ws-selected-size { color: #a6192e; }
.ws-size-options { display: flex; flex-wrap: wrap; gap: 10px; }
.ws-size-btn { min-width: 52px; padding: 12px 16px; border: 2px solid #ddd; background: #fff; border-radius: 8px;
               font-weight: 700; color: #333; cursor: pointer; transition: all .15s; }
.ws-size-btn:hover:not(:disabled) { border-color: #a6192e; color: #a6192e; }
.ws-size-btn.selected { border-color: #a6192e; background: #a6192e; color: #fff; }
.ws-size-btn.is-out, .ws-size-btn:disabled { opacity: .45; cursor: not-allowed; text-decoration: line-through; background: #f5f5f5; }
.ws-size-stock-line { margin-top: 12px; font-size: 14px; color: #1a7f37; font-weight: 600; min-height: 18px; }

/* Availability + perks */
/* Buy requires a size selection first */
.ws-buy-needsize:not(.is-enabled) { background: #c7c7c7; cursor: not-allowed; }
.ws-buy-needsize:not(.is-enabled):hover { background: #c7c7c7; transform: none; }
.ws-buy-note { color: #888; font-size: 13px; margin: 10px 0 0; }
.ws-buy-note.warn { color: #b42318; font-weight: 700; }
.ws-size-picker.ws-shake { animation: wsShake .45s; }
@keyframes wsShake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-7px); }
  40%, 80% { transform: translateX(7px); }
}

.ws-availability { font-weight: 700; font-size: 15px; margin-bottom: 22px; }
.ws-availability.in { color: #1a7f37; }
.ws-availability.out { color: #b42318; }
.ws-buy-row { margin-bottom: 28px; }
.ws-perks { list-style: none; padding: 20px 0 0; margin: 0; border-top: 1px solid #eee; }
.ws-perks li { display: flex; align-items: center; gap: 12px; padding: 8px 0; color: #555; font-size: 14.5px; }
.ws-perks li span { font-size: 18px; }

/* ---------------- RESPONSIVE ---------------- */
@media (max-width: 991px) {
  .ws-single-info { padding-left: 15px; }
}
@media (max-width: 767px) {
  .ws-filters { margin-bottom: 30px; }
  .ws-single-info { padding-left: 0; }
  .ws-zoom { cursor: default; }            /* no hover-zoom on touch */
  .ws-buy-lg { width: 100%; }
  .ws-single-title { font-size: 26px; }
}

/* ---------------- PRICE ---------------- */
.ws-card-price { font-size: 22px; font-weight: 800; color: #a6192e; margin-bottom: 10px; }
.ws-single-price { font-size: 32px; font-weight: 800; color: #a6192e; margin: 4px 0 22px;
                   padding-bottom: 22px; border-bottom: 1px solid #eee; }

/* ---------------- GALLERY (single product) ---------------- */
.ws-gallery { display: flex; flex-direction: column; gap: 14px; }
.ws-thumbs { display: flex; flex-wrap: wrap; gap: 12px; }
.ws-thumb { padding: 0; border: 2px solid #e6e6e6; border-radius: 10px; overflow: hidden;
            cursor: pointer; background: #fff; width: 74px; height: 74px; line-height: 0; transition: border-color .15s; }
.ws-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ws-thumb:hover { border-color: #d6a0a8; }
.ws-thumb.active { border-color: #a6192e; }
@media (max-width: 767px) {
  .ws-single-price { font-size: 26px; }
  .ws-thumb { width: 60px; height: 60px; }
}