/* Category listing + error pages. The banner itself now comes from the shared
   .hero-banner component in hero-banner.css; these are the controls inside it. */
.breadcrumb{
  display:flex;justify-content:center;align-items:center;gap:8px;
  color:#888;font-size:13px
}
.breadcrumb a{color:#555}
.breadcrumb a:hover{color:var(--offer)}

/* Search box on the listing page, styled like the subcategory chips */
.listing-search{display:flex;justify-content:center;gap:8px;margin-top:20px}
.listing-search input{
  width:min(360px,100%);border:1px solid #d8d8d8;border-radius:999px;background:#fff;
  padding:10px 16px;font-size:13px;outline:none
}
.listing-search input:focus{border-color:var(--green)}
.listing-search button{
  border:0;border-radius:999px;background:#1c1516;color:#fff;padding:10px 18px;cursor:pointer;
  font-size:11px;font-weight:800;letter-spacing:.9px;text-transform:uppercase
}
.listing-search button:hover{background:var(--green);color:#111}
.error-actions{margin-top:22px}
.error-actions a{
  display:inline-block;background:#fff;border:1px solid #d8d8d8;border-radius:999px;padding:10px 18px;
  font-size:11px;font-weight:800;letter-spacing:.9px;text-transform:uppercase
}
.error-actions a:hover{border-color:var(--green)}

/* Wishlist card actions. */
.wishlist-actions{display:flex;gap:8px;padding:0 12px 12px;border-top:0}
.wishlist-add,.wishlist-drop{
  flex:1;border-radius:999px;padding:10px 12px;cursor:pointer;
  font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  transition:background .2s ease,color .2s ease,border-color .2s ease
}
.wishlist-add{border:0;background:#c2456f;color:#fff}
.wishlist-add:hover:not(:disabled){background:#9c3257}
.wishlist-add:disabled{background:#ddd0c0;color:#fffdfa;cursor:not-allowed}
.wishlist-drop{border:1px solid #ddd0c0;background:#fffdfa;color:#6b4f58}
.wishlist-drop:hover{border-color:#c2456f;color:#c2456f}

/* ===== Cart page ===== */
.cart-wrap{
  max-width:1320px;margin:22px auto 70px;padding:0 20px;
  display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start
}
.cart-lines{display:flex;flex-direction:column;gap:12px}
.cart-loading{color:var(--muted);font-size:14px;padding:20px 2px}
.cart-line{
  display:grid;grid-template-columns:88px minmax(0,1fr) auto auto 34px;
  gap:16px;align-items:center;
  background:#fff;border:1px solid #e2e2e2;border-radius:var(--radius);padding:12px
}
.cart-line-photo{display:block;width:88px;height:104px;border-radius:4px;overflow:hidden;background:#f2efea}
.cart-line-photo img{width:100%;height:100%;object-fit:cover;display:block}
.cart-line-icon{display:grid;place-items:center;width:100%;height:100%;font-size:26px}
.cart-line-info{min-width:0}
.cart-line-name{font-size:13.5px;font-weight:700;color:#1c1516;margin-bottom:4px}
.cart-line-variant{font-size:12px;color:var(--muted);margin-bottom:3px}
.cart-line-unit{font-size:12px;color:var(--muted)}
.cart-qty{display:inline-flex;align-items:center;border:1px solid #ddd0c0;border-radius:999px;overflow:hidden}
.cart-qty-btn{
  width:32px;height:32px;border:0;background:#fffdfa;color:#c2456f;
  font-size:15px;line-height:1;cursor:pointer;transition:background .18s ease
}
.cart-qty-btn:hover:not(:disabled){background:#f4ebdf}
.cart-qty-btn:disabled{opacity:.35;cursor:not-allowed}
.cart-qty-value{min-width:34px;text-align:center;font-size:13px;font-weight:700;color:#1c1516}
.cart-line-total{font-size:14px;font-weight:800;color:#1c1516;min-width:86px;text-align:right}
.cart-line-remove{
  width:30px;height:30px;border:0;border-radius:50%;background:transparent;
  color:#9a8f85;font-size:14px;cursor:pointer;transition:background .18s ease,color .18s ease
}
.cart-line-remove:hover{background:#f4ebdf;color:var(--offer)}

.cart-summary{
  background:#fdfbf7;border:1px solid #e8dccb;border-radius:8px;padding:20px;
  position:sticky;top:120px
}
.cart-summary-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:13.5px;color:#5f5852}
.cart-summary-total{
  border-top:1px solid #e8dccb;margin-top:8px;padding-top:13px;
  font-size:16px;font-weight:800;color:#1c1516
}
.cart-summary-note{margin:12px 0 0;font-size:11.5px;color:var(--muted);line-height:1.6}

/* ===== Checkout ===== */
.checkout-form{display:flex;flex-direction:column;gap:14px;min-width:0}
.checkout-panel{background:#fff;border:1px solid #e2e2e2;border-radius:var(--radius);padding:20px}
.checkout-heading{
  margin:0 0 16px;font-family:Georgia,"Times New Roman",serif;font-size:19px;
  font-weight:400;color:#1c1516
}
.checkout-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.checkout-grid .field{display:flex;flex-direction:column;gap:6px;min-width:0}
.checkout-grid .field-wide{grid-column:1/-1}
.checkout-grid label{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#6b4f58}
.checkout-grid input{
  border:1px solid #ddd0c0;border-radius:6px;background:#fffdfa;padding:11px 13px;
  font-size:14px;color:#1c1516;outline:none;min-width:0
}
.checkout-grid input:focus{border-color:#c2456f}
/* :user-invalid, not :invalid — an untouched required field must not look like an error. */
.checkout-grid input:user-invalid{border-color:var(--offer)}

.pay-options{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.pay-option{
  display:flex;align-items:flex-start;gap:12px;cursor:pointer;
  border:1px solid #ddd0c0;border-radius:10px;padding:14px 16px;background:#fff;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease
}
.pay-option:hover{border-color:#c2456f}
.pay-option:has(input:checked){border-color:#c2456f;background:#fdf6f8;box-shadow:0 0 0 1px #c2456f}
.pay-option input{margin-top:2px;accent-color:#c2456f;flex:none;width:15px;height:15px}
.pay-option-body{display:flex;flex-direction:column;gap:3px}
.pay-option-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#1c1516}
.pay-option-icon{width:16px;height:16px;flex:none;fill:none;stroke:#c2456f;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pay-option-note{font-size:12px;color:var(--muted);line-height:1.5}

.checkout-error{
  margin:0 0 12px;padding:11px 14px;border-radius:6px;
  background:#fdecee;border:1px solid #f5c2c7;color:#a12836;font-size:13px;line-height:1.55
}
.checkout-submit{
  width:100%;border:0;border-radius:999px;background:#c2456f;color:#fff;
  padding:15px 24px;cursor:pointer;
  font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 10px 24px rgba(194,69,111,.26);transition:background .25s ease,transform .25s ease
}
.checkout-submit:hover:not(:disabled){background:#9c3257;transform:translateY(-1px)}
.checkout-submit:disabled{background:#c3b2a2;cursor:progress;box-shadow:none;transform:none}
.checkout-secure{margin:12px 0 0;font-size:11.5px;color:var(--muted);text-align:center;line-height:1.6}
.cart-summary-rule{border-top:1px solid #e8dccb;margin-top:8px;padding-top:12px}

/* Proceed to checkout, under the cart summary. */
.cart-checkout{
  display:block;width:100%;margin-top:16px;border:0;border-radius:999px;
  background:#c2456f;color:#fff;padding:14px 20px;cursor:pointer;text-align:center;
  font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 10px 24px rgba(194,69,111,.26);transition:background .25s ease,transform .25s ease
}
.cart-checkout:hover{background:#9c3257;transform:translateY(-1px)}

/* ===== Accounts ===== */
.auth-wrap{max-width:520px;margin:34px auto 80px;padding:0 20px}
.auth-panel{display:block}
.auth-hint{margin:12px 0 16px;font-size:12px;color:var(--muted);line-height:1.6}
.auth-ok{
  margin:0 0 14px;padding:12px 14px;border-radius:6px;
  background:#eef6ec;border:1px solid #cfe6cd;color:#2f6b3c;font-size:13px;line-height:1.6
}
.auth-ok a{color:#c2456f;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.auth-links{
  margin:16px 0 0;display:flex;flex-direction:column;gap:8px;
  text-align:center;font-size:13px;color:var(--muted)
}
.auth-links a{color:#c2456f;font-weight:700}
.auth-links a:hover{text-decoration:underline;text-underline-offset:3px}

.account-tabs{margin-bottom:0}
.account-tabs .type-chip{border:1px solid #ddd0c0;background:#fffdfa;cursor:pointer;font-family:inherit}
.account-tabs .type-chip.active{background:#c2456f;border-color:#c2456f;color:#fff}
.account-signout{margin-left:auto;color:#a12836}
.account-signout:hover{border-color:#a12836;color:#a12836}

.account-wrap{max-width:1320px;margin:18px auto 80px;padding:0 20px}
.account-subhead{margin-top:28px}
.account-muted{color:var(--muted);font-size:13px;margin:8px 0 0}
.account-empty{text-align:center;padding:40px 16px}
.account-feed{margin:0;padding:0;grid-template-columns:repeat(4,minmax(0,1fr))}

.account-order{background:#fff;border:1px solid #e2e2e2;border-radius:var(--radius);padding:16px;margin-bottom:12px}
.account-order-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.account-order-head b{font-size:14px;color:#1c1516}
.account-order-head .account-muted{margin:0 0 0 10px;display:inline}
.account-order-body{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:13px;color:#5f5852}
.account-order-body b{margin-left:auto;font-size:15px;color:#1c1516}
.account-status{
  font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;background:#f4ebdf;color:#c2456f;white-space:nowrap
}
.account-status.green{background:#eef6ec;color:#2f6b3c}
.account-status.grey{background:#efefef;color:#777}

/* Return / cancellation requests on an order */
.account-order-actions{margin-top:12px;padding-top:12px;border-top:1px solid #f1ebe4}
.account-link-btn{border:0;background:none;padding:0;color:#c2456f;font-size:13px;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.account-request{margin:12px 0 0;padding:9px 12px;border-radius:8px;background:#fbf1f4;color:#9c3257;font-size:13px}
.account-request-form{display:grid;gap:10px;max-width:460px}
.account-request-form label{display:grid;gap:5px;font-size:12.5px;font-weight:600;color:#3a2e36}
.account-request-form small{font-weight:400;color:var(--muted)}
.account-request-form select,.account-request-form textarea{font:inherit;font-size:13px;padding:9px 10px;border:1px solid #e3d3bf;border-radius:8px;background:#fff}
.account-request-buttons{display:flex;align-items:center;gap:16px}
.account-primary-btn{border:0;border-radius:999px;background:#c2456f;color:#fff;font-size:12.5px;font-weight:700;padding:10px 18px;cursor:pointer}
.account-primary-btn:disabled{opacity:.6;cursor:wait}
.account-form-error{margin:0;color:#a12836;font-size:12.5px}

.account-address-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.account-address{background:#fff;border:1px solid #e2e2e2;border-radius:var(--radius);padding:16px}
.account-address.is-default{border-color:#c2456f}
.account-address-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.account-address p{margin:0 0 12px;font-size:13px;line-height:1.7;color:#5f5852}
.account-address-actions{display:flex;gap:14px}
.account-address-actions button{
  border:0;background:none;padding:0;cursor:pointer;font-size:12px;font-weight:700;
  color:#c2456f;font-family:inherit
}
.account-address-actions button:hover{text-decoration:underline;text-underline-offset:3px}
.account-address-actions button[data-address-delete]{color:#a12836}

.account-address-form,.account-profile-form{
  background:#fff;border:1px solid #e2e2e2;border-radius:var(--radius);padding:20px;margin-top:12px;max-width:720px
}
.account-default{display:flex;align-items:center;gap:9px;margin:14px 0;font-size:13px;color:#5f5852;cursor:pointer}
.account-default input{accent-color:#c2456f}
.account-form-actions{display:flex;gap:10px}
.account-form-actions .wishlist-add,.account-form-actions .wishlist-drop,
.account-profile-form .wishlist-add{flex:0 0 auto;padding:11px 22px}

@media(max-width:1100px){.account-feed{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){
  .account-feed{grid-template-columns:repeat(2,minmax(0,1fr))}
  .account-wrap{padding:0 12px}
  .account-order-body b{margin-left:0;width:100%}
  .account-signout{margin-left:0}
}

/* ===== Order confirmation ===== */
.confirm-wrap{max-width:660px;margin:34px auto 80px;padding:0 20px}
.confirm-card{background:#fff;border:1px solid #e2e2e2;border-radius:var(--radius);padding:30px;text-align:center}
.confirm-tick{
  width:56px;height:56px;margin:0 auto 16px;border-radius:50%;
  background:#eef6ec;color:#3f8f4f;font-size:27px;line-height:56px
}
.confirm-title{margin:0 0 10px;font-family:Georgia,"Times New Roman",serif;font-size:25px;font-weight:400;color:#1c1516}
.confirm-note{margin:0 0 22px;color:var(--muted);font-size:14px;line-height:1.7}
.confirm-facts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;
  text-align:left;margin-bottom:22px
}
.confirm-facts div{background:#fdfbf7;border:1px solid #e8dccb;border-radius:8px;padding:12px 14px}
.confirm-facts span{display:block;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#6b4f58;margin-bottom:5px}
.confirm-facts b{font-size:13.5px;color:#1c1516;font-weight:700}
.confirm-lines{text-align:left;border-top:1px solid #e8dccb;padding-top:14px;margin-bottom:22px}

/* Empty wishlist. */
.wishlist-empty{
  max-width:560px;margin:60px auto 90px;padding:0 20px;text-align:center
}
.wishlist-empty-title{
  margin:0 0 10px;font-family:Georgia,"Times New Roman",serif;
  font-size:26px;color:#1c1516
}
.wishlist-empty-note{margin:0 0 24px;color:#8a8078;font-size:14px;line-height:1.65}
.wishlist-empty-cta{
  display:inline-block;background:#c2456f;color:#fff;border-radius:999px;
  padding:14px 28px;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 10px 24px rgba(194,69,111,.26);transition:background .25s ease,transform .25s ease
}
.wishlist-empty-cta:hover{background:#9c3257;transform:translateY(-2px)}

/* Types within the current category, shown under the banner. */
.type-chip-row{
  max-width:1320px;margin:0 auto;padding:18px 20px 4px;
  display:flex;flex-wrap:wrap;gap:8px
}
.type-chip{
  border:1px solid #ddd0c0;border-radius:999px;background:#fffdfa;
  padding:8px 16px;font-size:12px;color:#5f5852;white-space:nowrap;
  transition:border-color .18s ease,background .18s ease,color .18s ease
}
.type-chip:hover{border-color:#c2456f;color:#c2456f}
.type-chip.active{background:#c2456f;border-color:#c2456f;color:#fff;font-weight:700}

@media(max-width:1000px){
  .cart-wrap{grid-template-columns:1fr;gap:18px}
  .cart-summary{position:static}
}

@media(max-width:600px){
  .checkout-grid{grid-template-columns:1fr}
  .checkout-panel{padding:16px}
  .confirm-card{padding:22px 18px}
}

@media(max-width:760px){
  .type-chip-row{padding:14px 12px 2px;gap:7px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .type-chip-row::-webkit-scrollbar{display:none}
  .type-chip{padding:7px 13px;font-size:11.5px}

  /* Stack each line: photo + details on top, quantity and total beneath. */
  .cart-wrap{padding:0 12px;margin-top:14px}
  .cart-line{
    grid-template-columns:72px minmax(0,1fr) 30px;
    grid-template-areas:"photo info remove" "photo qty total";
    gap:8px 12px;row-gap:12px
  }
  .cart-line-photo{grid-area:photo;width:72px;height:88px}
  .cart-line-info{grid-area:info}
  .cart-qty{grid-area:qty;justify-self:start}
  .cart-line-total{grid-area:total;text-align:right;align-self:center}
  .cart-line-remove{grid-area:remove;justify-self:end;align-self:start}
  .wishlist-actions{padding:0 10px 10px;gap:6px}
  .wishlist-add,.wishlist-drop{padding:9px 8px;font-size:9.5px;letter-spacing:.07em}
}

@media(max-width:420px){
  .cart-line{grid-template-columns:60px minmax(0,1fr) 28px}
  .cart-line-photo{width:60px;height:74px}
  .cart-line-name{font-size:12.5px}
  .cart-qty-btn{width:29px;height:29px}
  .cart-line-total{min-width:0;font-size:13px}
}

/* Checkout when no payment option is open: order on WhatsApp instead */
.pay-option[hidden]{display:none}