/* ==========================================================================
   Atelier — woo.css (WooCommerce)
   01 Shop archive · 02 Product page layout · 03 Gallery · 04 Summary & form
   05 Local nav & buy bar · 06 Sections & specs · 07 Reviews · 08 Notices
   09 Forms (account, classic) · 10 Cart & checkout blocks · 11 Comparator
   12 Responsive
   ========================================================================== */

/* 01 · Shop archive -------------------------------------------------------- */
.crumbs, .woocommerce-breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; font-size: 12px; color: var(--ash); }
.crumbs a, .woocommerce-breadcrumb a { color: var(--ash); }
.crumbs a:hover { color: var(--text); }
.shop-wrap { padding-bottom: clamp(80px, 10vw, 140px); }
.shop-bar { position: sticky; top: var(--gnav-h); z-index: 20; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0; margin-bottom: 28px; background: color-mix(in srgb, var(--stage) 84%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.woocommerce-ordering select, .atelier select {
  appearance: none; -webkit-appearance: none; min-height: 40px; padding: 0 40px 0 18px; border-radius: var(--r-pill);
  border: 0; box-shadow: var(--keyline-2); background: rgba(255, 255, 255, .04) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f5f5f7' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 14px;
  color: var(--text); font-size: 14px; cursor: pointer;
}
.woocommerce-ordering { margin: 0; }
.pgrid { display: grid; gap: 20px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.woocommerce-pagination ul { list-style: none; display: flex; justify-content: center; gap: 6px; padding: 0; margin: 48px 0 0; }
.woocommerce-pagination .page-numbers { display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 12px; border-radius: var(--r-pill); color: var(--text); box-shadow: var(--keyline-2); }
.woocommerce-pagination .page-numbers.current { background: var(--text); color: var(--stage); }

/* 02 · Product page layout ------------------------------------------------- */
.pdp { padding-bottom: clamp(64px, 8vw, 120px); }
.pdp .crumbs, .pdp .woocommerce-breadcrumb { margin-top: 24px; }
.pdp div.product { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.pdp div.product > .pdp-section, .pdp div.product > section { grid-column: 1 / -1; }
.pdp .onsale { position: absolute; z-index: 3; top: 20px; left: 20px; padding: 6px 12px; border-radius: var(--r-pill); background: var(--accent); color: var(--accent-ink); font-size: 12px; font-weight: 600; }

/* 03 · Gallery ------------------------------------------------------------- */
.pdp .woocommerce-product-gallery { position: relative; margin: 0; border-radius: var(--r-tile); overflow: hidden; background: var(--panel); opacity: 1 !important; }
.pdp .woocommerce-product-gallery__wrapper { margin: 0; }
.pdp .woocommerce-product-gallery__image img { width: 100%; height: auto; }
.pdp .woocommerce-product-gallery__trigger { position: absolute; z-index: 4; top: 16px; right: 16px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(66, 66, 69, .72); color: transparent; font-size: 0; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.pdp .woocommerce-product-gallery__trigger::before { content: ""; width: 16px; height: 16px; border: 2px solid var(--text); border-radius: 50%; }
.pdp .flex-control-thumbs { list-style: none; display: flex; gap: 10px; margin: 0; padding: 14px; overflow-x: auto; background: var(--panel); }
.pdp .flex-control-thumbs li { flex: none; width: 72px; }
.pdp .flex-control-thumbs img { border-radius: 14px; opacity: .5; cursor: pointer; transition: opacity .25s; }
.pdp .flex-control-thumbs img.flex-active, .pdp .flex-control-thumbs img:hover { opacity: 1; }

/* 04 · Summary & form ------------------------------------------------------ */
.pdp .summary { position: sticky; top: calc(var(--gnav-h) + 72px); display: grid; gap: 14px; }
.pdp .product_title { font-size: clamp(32px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -.005em; }
.pdp-eyebrow { margin: 0; }
.pdp .woocommerce-product-rating { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--ash); }
.pdp .summary > .price { display: inline-flex; justify-self: start; align-self: start; align-items: center; gap: 8px; margin: 4px 0; padding: 10px 18px; border-radius: var(--r-capsule); background: color-mix(in srgb, var(--steel) 80%, transparent); color: var(--text); font-size: 19px; }
.pdp .summary > .price del { color: var(--ash); font-size: 15px; }
.pdp .summary > .price ins { text-decoration: none; }
.pdp .woocommerce-product-details__short-description { color: var(--ash); font-size: 17px; }
.pdp .woocommerce-product-details__short-description p { margin: 0; }
.pdp form.cart { display: grid; gap: 16px; margin: 8px 0 0; }
.pdp .variations { width: 100%; border-collapse: collapse; }
.pdp .variations tr { display: grid; gap: 8px; margin-bottom: 14px; }
.pdp .variations th { text-align: left; font-weight: 600; font-size: 14px; }
.pdp .variations td { padding: 0; }
.pdp .variations select { width: 100%; min-height: 48px; }
.pdp .reset_variations { display: inline-block; margin-top: 8px; font-size: 13px; }
.pdp .woocommerce-variation-price .price { color: var(--text); font-size: 19px; }
.pdp .woocommerce-variation-add-to-cart, .pdp form.cart:not(.variations_form) { display: flex; flex-wrap: nowrap; gap: 12px; align-items: center; }
.pdp .quantity { flex: none; }
.quantity .qty { width: 84px; min-height: 48px; padding: 0 12px; border: 0; border-radius: var(--r-pill); box-shadow: var(--keyline-2); background: rgba(255, 255, 255, .04); color: var(--text); text-align: center; }
.atelier .button, .atelier button.button, .pdp .single_add_to_cart_button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 28px; border: 0; border-radius: var(--r-pill);
  background: var(--accent); color: var(--accent-ink); font: 400 17px/1 var(--font-text); letter-spacing: -.022em; cursor: pointer;
  transition: background-color .3s, box-shadow .3s, transform .4s var(--ease-out);
}
.pdp .single_add_to_cart_button { flex: 1; min-width: 200px; }
.atelier .button:hover, .pdp .single_add_to_cart_button:hover { background: var(--accent-hover); box-shadow: 0 0 0 6px var(--glow); text-decoration: none; }
.atelier .button.disabled, .atelier .button:disabled { opacity: .5; box-shadow: none; }
.atelier .button.alt { background: var(--accent); }
.pdp-promises { list-style: none; margin: 10px 0 0; padding: 18px 0 0; border-top: 1px solid var(--steel); display: grid; gap: 10px; font-size: 14px; color: var(--ash); }
.pdp-promises li { display: flex; align-items: center; gap: 10px; }
.pdp-promises .ic { color: var(--accent); }
.stock { font-size: 14px; color: var(--ash); }

/* 05 · Local nav & buy bar ------------------------------------------------- */
.lnav { position: sticky; top: var(--gnav-h); z-index: 40; margin: 12px 0 0; }
.lnav-inner { display: flex; align-items: center; gap: 20px; min-height: 52px; padding: 0 10px 0 22px; border-radius: var(--r-nav); background: color-mix(in srgb, var(--chrome) 84%, transparent); box-shadow: var(--keyline); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); }
.lnav-name { font: 600 19px/1.21 var(--font-display); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 32ch; }
.lnav-links { display: flex; gap: 20px; margin-left: auto; }
.lnav-links a { color: rgba(245, 245, 247, .8); font-size: 14px; }
.lnav-links a:hover, .lnav-links a.is-active { color: var(--text); text-decoration: none; }
.lnav-price { font-size: 14px; color: var(--ash); white-space: nowrap; }
.lnav-price del { display: none; }
.lnav-price ins, .buybar-info ins { text-decoration: none; }
.buybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--panel-2) 88%, transparent); box-shadow: var(--keyline); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); transform: translateY(110%); transition: transform .45s var(--ease-out); }
.buybar.is-on { transform: none; }
.buybar-inner { max-width: var(--wrap); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.buybar-info { display: grid; min-width: 0; font-size: 14px; }
.buybar-info b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.buybar-info span { color: var(--ash); }
.buybar-info del { display: none; }

/* 06 · Sections & specs ---------------------------------------------------- */
.pdp-section { padding-top: clamp(56px, 7vw, 96px); }
.pdp-section-head { margin-bottom: 28px; }
.specs { margin: 0; border-radius: var(--r-tile); background: var(--panel); overflow: hidden; }
.spec-row { display: grid; grid-template-columns: minmax(140px, 1fr) 2fr; gap: 24px; padding: 18px 28px; border-top: 1px solid var(--steel); transition: background-color .25s; }
.spec-row:first-child { border-top: 0; }
.spec-row:hover { background: rgba(255, 255, 255, .03); }
.spec-row dt { color: var(--ash); font-size: 15px; }
.spec-row dd { margin: 0; color: var(--text); font-size: 17px; }
.fit-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fit-grid .tile { background: var(--panel); }

/* 07 · Reviews ------------------------------------------------------------- */
.reviews-wrap { max-width: 860px; }
#reviews .commentlist { list-style: none; margin: 0 0 32px; padding: 0; display: grid; gap: 14px; }
#reviews .commentlist li .comment_container { padding: 22px 24px; border-radius: var(--r-tile); background: var(--panel); }
#reviews .commentlist img.avatar { display: none; }
#reviews .meta { color: var(--ash); font-size: 13px; }
#reviews .woocommerce-noreviews { color: var(--ash); }
.star-rating { position: relative; display: inline-block; width: 5.4em; height: 1em; font-size: 14px; line-height: 1; overflow: hidden; }
.star-rating::before { content: "★★★★★"; position: absolute; inset: 0; color: var(--steel); letter-spacing: .1em; }
.star-rating span { position: absolute; inset: 0; overflow: hidden; padding-top: 1.5em; }
.star-rating span::before { content: "★★★★★"; position: absolute; top: 0; left: 0; color: var(--accent); letter-spacing: .1em; }
#review_form_wrapper { padding: 28px; border-radius: var(--r-tile); background: var(--panel); }
.comment-form-rating .stars a { color: var(--accent); }

/* 08 · Notices ------------------------------------------------------------- */
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner {
  list-style: none; margin: 16px 0; padding: 16px 20px; border-radius: 18px; background: var(--panel) !important; color: var(--text) !important; box-shadow: var(--keyline); font-size: 15px;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
}
.woocommerce-error { box-shadow: 0 0 0 1px var(--accent); }
.woocommerce-message .button { min-height: 36px; padding: 0 16px; font-size: 14px; }

/* 09 · Forms (account, classic) -------------------------------------------- */
.atelier .input-text, .atelier input[type="text"], .atelier input[type="email"], .atelier input[type="password"], .atelier input[type="tel"], .atelier input[type="number"], .atelier textarea {
  width: 100%; min-height: 48px; padding: 12px 20px; border: 0; border-radius: 14px; box-shadow: var(--keyline-2);
  background: rgba(255, 255, 255, .04); color: var(--text); font-size: 17px; transition: box-shadow .2s;
}
.atelier textarea { min-height: 120px; }
.atelier .input-text:focus, .atelier input:focus, .atelier textarea:focus { outline: none; box-shadow: 0 0 0 2px var(--accent); }
.atelier label { font-size: 14px; color: var(--ash); }
.woocommerce-account .flow { display: grid; gap: 28px; }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.woocommerce-MyAccount-navigation a { display: inline-flex; min-height: 36px; align-items: center; padding: 0 16px; border-radius: var(--r-pill); color: var(--text); box-shadow: var(--keyline-2); font-size: 14px; }
.woocommerce-MyAccount-navigation .is-active a { background: var(--text); color: var(--stage); box-shadow: none; }
.woocommerce form .form-row { margin: 0 0 16px; }
.woocommerce-form-login, .woocommerce-form-register { padding: 28px; border-radius: var(--r-tile); background: var(--panel); }
.u-columns { display: grid; gap: 20px; grid-template-columns: 1fr 1fr; }
.woocommerce table.shop_table { width: 100%; border-collapse: collapse; border-radius: var(--r-tile); background: var(--panel); overflow: hidden; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { padding: 14px 18px; border-top: 1px solid var(--steel); text-align: left; }

/* 10 · Cart & checkout blocks (dark) ---------------------------------------- */
.flow .wp-block-woocommerce-cart, .flow .wp-block-woocommerce-checkout { color: var(--text); }
.flow .wc-block-components-sidebar-layout { gap: 32px; }
.flow .wc-block-components-sidebar, .flow .wc-block-checkout__sidebar {
  padding: 24px !important; border-radius: var(--r-tile); background: var(--panel);
}
.flow .wc-block-components-button:not(.is-link) {
  min-height: 52px; border-radius: var(--r-pill) !important; background: var(--accent) !important; color: var(--accent-ink) !important; border: 0 !important; font-size: 17px; font-weight: 400;
  transition: background-color .3s, box-shadow .3s;
}
.flow .wc-block-components-button:not(.is-link):hover { background: var(--accent-hover) !important; box-shadow: 0 0 0 6px var(--glow); }
.flow .wc-block-components-text-input input, .flow .wc-block-components-combobox .components-combobox-control__input,
.flow .wc-blocks-components-select__select, .flow .wc-block-components-textarea, .flow .wc-block-components-form .wc-block-components-text-input input {
  background: rgba(255, 255, 255, .04) !important; color: var(--text) !important; border: 1px solid var(--slate) !important; border-radius: 14px !important;
}
.flow .wc-block-components-text-input label, .flow .wc-blocks-components-select__label, .flow .wc-block-components-combobox label { color: var(--ash) !important; }
.flow .wc-block-components-text-input.is-active input, .flow .wc-block-components-text-input input:focus { border-color: var(--accent) !important; box-shadow: 0 0 0 1px var(--accent) !important; }
.flow .wc-block-components-totals-item, .flow .wc-block-components-product-name, .flow .wc-block-components-formatted-money-amount { color: var(--text) !important; }
.flow .wc-block-cart-items, .flow .wc-block-cart-items td, .flow .wc-block-cart-items th { border-color: var(--steel) !important; }
.flow .wc-block-components-product-metadata, .flow .wc-block-components-totals-footer-item-tax { color: var(--ash) !important; }
.flow .wc-block-components-quantity-selector { border-radius: var(--r-pill) !important; border: 1px solid var(--slate) !important; }
.flow .wc-block-components-quantity-selector input, .flow .wc-block-components-quantity-selector button { color: var(--text) !important; background: transparent !important; }
.flow .wc-block-components-radio-control__option, .flow .wc-block-components-radio-control-accordion-option { border-color: var(--steel) !important; border-radius: 14px !important; }
.flow .wc-block-components-checkbox__input[type=checkbox], .flow .wc-block-components-radio-control__input { background: transparent !important; border-color: var(--slate) !important; }
.flow .wp-block-woocommerce-empty-cart-block h2 { font-family: var(--font-display); }
.flow a { color: var(--link); }
.flow .wc-block-grid__product { background: var(--panel); border-radius: var(--r-tile); padding: 16px; }

/* 11 · Comparator ----------------------------------------------------------- */
.cmp-wrap { padding-bottom: clamp(80px, 10vw, 140px); display: grid; gap: 28px; }
.cmp-pick { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.cmp-opt { position: relative; display: flex; align-items: center; gap: 12px; padding: 12px; border: 0; border-radius: 20px; background: var(--panel); color: var(--text); text-align: left; transition: box-shadow .25s, transform .4s var(--ease-out); }
.cmp-opt:hover { transform: translateY(-3px); }
.cmp-opt[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--accent); }
.cmp-opt img { width: 56px; height: 56px; border-radius: 12px; object-fit: cover; background: #fff; flex: none; }
.cmp-opt b { font-size: 15px; line-height: 1.25; }
.cmp-opt span { display: block; font-size: 13px; color: var(--ash); }
.cmp-opt:disabled { opacity: .4; cursor: default; transform: none; }
.cmp-table-wrap { overflow-x: auto; }
.cmp-table { width: 100%; min-width: 560px; border-collapse: collapse; table-layout: fixed; }
.cmp-table th, .cmp-table td { padding: 16px; border-top: 1px solid var(--steel); text-align: left; vertical-align: top; font-size: 15px; }
.cmp-table thead th { border-top: 0; vertical-align: bottom; }
.cmp-table tbody th { width: 170px; color: var(--ash); font-weight: 400; }
.cmp-head { display: grid; gap: 10px; justify-items: start; }
.cmp-head img { width: 120px; height: 120px; border-radius: 18px; object-fit: cover; background: #fff; }
.cmp-head a.cmp-name { color: var(--text); font: 600 19px/1.2 var(--font-display); }
.cmp-table td.is-best { color: var(--accent); }

/* 12 · Responsive ----------------------------------------------------------- */
@media (max-width: 1068px) {
  .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 833px) {
  .pdp div.product { grid-template-columns: 1fr; }
  .pdp .summary { position: static; }
  .lnav-links, .lnav-price { display: none; }
  .lnav-inner { justify-content: space-between; }
  .fit-grid, .u-columns { grid-template-columns: 1fr; }
  .spec-row { grid-template-columns: 1fr; gap: 4px; padding: 16px 20px; }
}
@media (max-width: 560px) {
  .pgrid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .pgrid .pcard-body { padding: 14px; }
  .pgrid .pcard-title { font-size: 16px; }
  .pgrid .link-more { display: none; }
  .shop-bar { position: static; }
}
@media (min-width: 834px) { .buybar { display: none !important; } }

/* 10b · Block select fields, quantity and summary card on dark ------------- */
.flow .wc-blocks-components-select__container { background: rgba(255, 255, 255, .04) !important; border-radius: 14px !important; }
.flow .wc-blocks-components-select__select { color: var(--text) !important; background: transparent !important; }
.flow .wc-blocks-components-select__select option { color: #1d1d1f; }
.flow .wc-blocks-components-select__expand { fill: var(--text) !important; }
.flow .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input { border: 0 !important; box-shadow: none !important; }
.flow .wc-block-checkout__sidebar { padding: 0 !important; background: none !important; }
.flow .wp-block-woocommerce-checkout-order-summary-block { border: 0 !important; border-radius: var(--r-tile); background: var(--panel); }
.flow .wc-block-components-order-summary-item__quantity { background: var(--text) !important; color: var(--stage) !important; border: 0 !important; box-shadow: none !important; }

/* 13 · Fixes: quantity width, review form ---------------------------------- */
.atelier .quantity .qty { width: 84px; padding: 0 8px; }
.pdp .single_add_to_cart_button { min-width: 0; }
.comment-form-rating p.stars { margin: 6px 0 0; }
.comment-form-rating p.stars span { display: inline-flex; gap: 4px; }
.comment-form-rating p.stars a { position: relative; width: 26px; height: 26px; font-size: 0; color: transparent; text-decoration: none; }
.comment-form-rating p.stars a::before { content: "★"; position: absolute; inset: 0; font-size: 24px; line-height: 26px; color: var(--steel); transition: color .15s; }
.comment-form-rating p.stars:hover a::before, .comment-form-rating p.stars.selected a::before { color: var(--accent); }
.comment-form-rating p.stars a:hover ~ a::before, .comment-form-rating p.stars.selected a.active ~ a::before { color: var(--steel); }
#respond .form-submit input[type="submit"], #respond .submit {
  min-height: 48px; padding: 0 28px; border: 0; border-radius: var(--r-pill); background: var(--accent); color: var(--accent-ink); font: 400 17px/1 var(--font-text); cursor: pointer;
}
#respond .comment-form-cookies-consent { display: flex; gap: 10px; align-items: flex-start; }
#respond .comment-reply-title { font: 600 19px/1.3 var(--font-display); }

/* 14 · Size chart & care ---------------------------------------------------- */
.size-chart { margin-bottom: 24px; padding: 20px; border-radius: var(--r-tile); background: var(--panel); }
.size-chart-note { margin: 0 0 12px; color: var(--ash); font-size: 14px; }
.size-chart-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.size-chart table { width: 100% !important; min-width: 560px; border-collapse: collapse; }
.size-chart td, .size-chart th { padding: 10px 12px !important; border: 0 !important; border-top: 1px solid var(--steel) !important; background: transparent !important; color: var(--text) !important; font-size: 14px; text-align: center; width: auto !important; white-space: nowrap; }
.size-chart tr:first-child td { border-top: 0 !important; font-weight: 600; }
.size-chart tr:nth-child(2) td { color: var(--ash) !important; font-size: 12px; }
.size-chart td:first-child { text-align: left; color: var(--ash) !important; }
.care { margin-top: 20px; padding: 22px 28px; border-radius: var(--r-tile); background: var(--panel); }
.care h3 { font-size: 17px; margin-bottom: 10px; }
.care ul { margin: 0; padding-left: 1.1em; display: grid; gap: 6px; color: var(--ash); font-size: 15px; }