/* =========================================================
   Mirror — Cart UI
   ========================================================= */

/* ----- Mini-cart dropdown (top-right, after Add to cart) ----- */
#mirror-mini-cart {
  position: fixed; top: 70px; right: 24px; width: 340px;
  background: #fdfbf7; border: 1px solid #ece6d8;
  box-shadow: 0 8px 32px rgba(0,0,0,.08);
  font-family: inherit; z-index: 2147483000;
  padding: 18px 20px 16px; border-radius: 2px;
  transform: translateY(-10px); opacity: 0; pointer-events: none;
  transition: transform .25s ease, opacity .25s ease;
}
#mirror-mini-cart.is-open { transform: translateY(0); opacity: 1; pointer-events: auto; }
#mirror-mini-cart .mmc-head {
  font-size: 11px; letter-spacing: 1.5px; font-weight: 600;
  color: #2b2b2b; border-bottom: 1px solid #ece6d8;
  padding-bottom: 12px; margin-bottom: 14px;
}
#mirror-mini-cart .mmc-body {
  display: grid; grid-template-columns: 70px 1fr; gap: 14px; align-items: center;
  margin-bottom: 14px;
}
#mirror-mini-cart .mmc-img {
  width: 70px; height: 84px; object-fit: cover; background: #efe9db; border-radius: 2px;
}
#mirror-mini-cart .mmc-title { font-size: 12px; letter-spacing: 1px; font-weight: 600; color: #2b2b2b; }
#mirror-mini-cart .mmc-sub { font-size: 11px; letter-spacing: .5px; color: #88816e; margin-top: 2px; text-transform: uppercase; }
#mirror-mini-cart .mmc-price { font-size: 13px; margin-top: 8px; color: #2b2b2b; }
#mirror-mini-cart .mmc-cta {
  display: block; text-align: center; background: #2b2b2b; color: #fdfbf7;
  text-decoration: none; padding: 13px; font-size: 11px; letter-spacing: 1.5px;
  font-weight: 600; border-radius: 2px;
}
#mirror-mini-cart .mmc-cta:hover { background: #000; }

/* ----- Cart page header (above line items) ----- */
.cart-items__wrapper .mirror-cart-head {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 0 0 18px; border-bottom: 1px solid #ece6d8; margin-bottom: 4px;
}
.cart-items__wrapper .mirror-cart-head__title {
  font-size: 15px; letter-spacing: .5px; color: #2b2b2b; display: flex; align-items: center; gap: 10px;
}
.cart-items__wrapper .mirror-cart-head__title::before {
  content: ""; width: 14px; height: 16px; display: inline-block;
  background: no-repeat center / contain
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16' fill='none' stroke='%232b2b2b' stroke-width='1.2'><path d='M1 5h12v10H1z'/><path d='M4 5V3a3 3 0 0 1 6 0v2'/></svg>");
}
.cart-items__wrapper .mirror-cart-head__count {
  font-size: 11px; letter-spacing: 1.5px; color: #88816e; text-transform: uppercase;
}

/* ----- Cart page line items injected into the site original DOM ----- */
.cart-items__wrapper .mirror-items { list-style: none; margin: 0; padding: 0; }
.cart-items__wrapper .mirror-line {
  display: grid;
  grid-template-columns: 120px 1fr auto;
  grid-template-areas:
    "thumb info price"
    "thumb info price";
  column-gap: 28px;
  padding: 28px 0; border-bottom: 1px solid #ece6d8;
  position: relative; align-items: start;
}
.cart-items__wrapper .mirror-line__thumb {
  grid-area: thumb;
  display: block; width: 120px; height: 150px; background: #f6f1e6;
  overflow: hidden; border-radius: 2px;
}
.cart-items__wrapper .mirror-line__thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.cart-items__wrapper .mirror-line__info { grid-area: info; min-width: 0; }
.cart-items__wrapper .mirror-line__title {
  font-size: 13px; letter-spacing: 1.5px; font-weight: 600; color: #2b2b2b;
  text-transform: uppercase;
}
.cart-items__wrapper .mirror-line__sub {
  font-size: 11px; letter-spacing: .8px; color: #88816e;
  text-transform: uppercase; margin-top: 4px;
}
.cart-items__wrapper .mirror-line__actions {
  display: flex; align-items: center; gap: 18px; margin-top: 28px;
}
.cart-items__wrapper .mirror-line__fav {
  width: 22px; height: 22px; border: 0; background: transparent; cursor: pointer; padding: 0;
  color: #2b2b2b;
}
.cart-items__wrapper .mirror-line__fav svg { width: 100%; height: 100%; display: block; }
.cart-items__wrapper .mirror-line__qty {
  display: inline-flex; align-items: center;
}
.cart-items__wrapper .mirror-line__qty button {
  width: 30px; height: 30px; border: 0; background: transparent; font-size: 16px;
  cursor: pointer; color: #2b2b2b;
}
.cart-items__wrapper .mirror-line__qty button:hover { color: #000; }
.cart-items__wrapper .mirror-line__q {
  display: inline-block !important; min-width: 30px; text-align: center;
  font-size: 14px !important; color: #2b2b2b !important;
  font-variant-numeric: tabular-nums; font-weight: 500;
  visibility: visible !important; opacity: 1 !important;
}
.cart-items__wrapper .mirror-line__price {
  grid-area: price;
  font-size: 14px; color: #2b2b2b; white-space: nowrap; font-variant-numeric: tabular-nums;
  align-self: end; padding-bottom: 4px;
}
.cart-items__wrapper .mirror-line__remove {
  position: absolute; top: 28px; right: 0; border: 0; background: none;
  color: #2b2b2b; font-size: 20px; line-height: 1; cursor: pointer; padding: 4px;
}
.cart-items__wrapper .mirror-line__remove:hover { color: #000; }
@media (max-width: 680px) {
  .cart-items__wrapper .mirror-line { grid-template-columns: 90px 1fr; column-gap: 16px; }
  .cart-items__wrapper .mirror-line__thumb { width: 90px; height: 108px; }
  .cart-items__wrapper .mirror-line__price { grid-column: 2; margin-top: 10px; align-self: start; padding-bottom: 0; }
}

/* ----- Summary box injected into .cart__inner--summary ----- */
.mirror-summary {
  background: transparent; padding: 0 0 24px; margin-bottom: 20px;
  font-family: inherit;
}
.mirror-summary .ms-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px 0; font-size: 12px; letter-spacing: 1.5px;
  color: #2b2b2b; border-top: 1px solid #ece6d8; text-transform: uppercase;
}
.mirror-summary .ms-row:first-child { border-top: 1px solid #2b2b2b; }
.mirror-summary .ms-row em { color: #88816e; font-style: normal; text-transform: lowercase; letter-spacing: .3px; font-size: 13px; }
.mirror-summary .ms-row strong { font-size: 15px; font-weight: 500; letter-spacing: 0; }
.mirror-summary .ms-cta {
  display: block; text-align: center; background: #111; color: #fff;
  text-decoration: none; padding: 18px; font-size: 12px; letter-spacing: 2px;
  margin-top: 16px; border-radius: 2px; font-weight: 600;
}
.mirror-summary .ms-cta:hover { background: #000; }
.mirror-summary .ms-pays {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px;
}
.mirror-summary .ms-pp, .mirror-summary .ms-gp {
  border: 0; padding: 14px; border-radius: 2px; cursor: pointer;
  font-size: 13px; font-weight: 700; letter-spacing: .3px;
  display: flex; align-items: center; justify-content: center; gap: 6px;
}
.mirror-summary .ms-pp { background: #ffc439; color: #253b80; }
.mirror-summary .ms-pp:hover { background: #ffb000; }
.mirror-summary .ms-gp { background: #000; color: #fff; }
.mirror-summary .ms-gp .gp-g {
  background: linear-gradient(90deg,#4285f4 0 25%,#ea4335 25% 50%,#fbbc04 50% 75%,#34a853 75% 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  font-weight: 800; font-size: 15px;
}

/* ----- Badges (30 days return / Track every step / 2 years warranty) ----- */
.mirror-summary .ms-badges {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  padding: 28px 0 24px; border-bottom: 1px solid #ece6d8;
  text-align: center;
}
.mirror-summary .ms-badge {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  font-size: 11px; letter-spacing: .4px; color: #2b2b2b;
}
.mirror-summary .ms-badge svg { width: 28px; height: 28px; stroke: #2b2b2b; fill: none; stroke-width: 1.2; }

/* ----- Secure payment ----- */
.mirror-summary .ms-secure {
  padding: 20px 0; border-bottom: 1px solid #ece6d8;
}
.mirror-summary .ms-secure__title {
  display: flex; align-items: center; gap: 10px;
  font-size: 12px; letter-spacing: .5px; color: #2b2b2b; margin-bottom: 14px;
}
.mirror-summary .ms-secure__title svg { width: 14px; height: 16px; stroke: #2b2b2b; fill: none; stroke-width: 1.2; }
.mirror-summary .ms-pay-logos {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  flex-wrap: wrap;
}
.mirror-summary .ms-pay-logos span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 42px; height: 26px; border: 1px solid #ece6d8; border-radius: 3px;
  padding: 0 6px; font-size: 10px; font-weight: 700; letter-spacing: .5px;
  color: #2b2b2b; background: #fff;
}

/* ----- Assistance ----- */
.mirror-summary .ms-assistance {
  padding: 18px 0;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; color: #2b2b2b; cursor: pointer;
}
.mirror-summary .ms-assistance__left { display: flex; align-items: center; gap: 10px; }
.mirror-summary .ms-assistance__left svg { width: 16px; height: 16px; stroke: #2b2b2b; fill: none; stroke-width: 1.2; }
.mirror-summary .ms-assistance__plus { font-size: 20px; color: #2b2b2b; }

/* ----- /checkout page style (reused by my checkout fallback) ----- */
.mirror-shell { background: #fdfbf7; min-height: 100vh; font-family: inherit; color: #2b2b2b; }
.mirror-topbar { display: flex; align-items: center; justify-content: space-between; padding: 22px 32px; border-bottom: 1px solid #ece6d8; }
.mirror-topbar a { color: #2b2b2b; text-decoration: none; font-size: 13px; letter-spacing: 1px; }
.mirror-topbar .mirror-brand { font-size: 22px; letter-spacing: 4px; text-transform: uppercase; }
.mirror-cart-page { max-width: 1100px; margin: 60px auto; padding: 0 24px; }
.mirror-cart-page h1 { font-size: 32px; font-weight: 400; letter-spacing: .5px; margin: 0 0 32px; }
.mcp-empty { padding: 60px 0; color: #88816e; text-align: center; font-size: 15px; }
.mcp-empty a { color: #2b2b2b; text-decoration: underline; }

/* =========================================================
   Pol�ne Mirror � Polyfill helpers (menus, modals, overlay)
   ========================================================= */
/* Make a toggled modal actually visible (component-modal is display:none by default in the stubbed theme state). */
component-modal.is-open { display: block !important; }
component-modal.is-open .component-modal__content { display: block !important; }
component-modal.is-open { position: fixed !important; inset: 0; background: rgba(0,0,0,.45); z-index: 2147482000; }
component-modal.is-open .component-modal__content {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  background: #fff; max-width: 92vw; max-height: 90vh; overflow: auto; padding: 32px; border-radius: 2px;
}
/* Search overlay */
theme-search-overlay.is-open, theme-search-overlay[aria-hidden="false"] {
  display: block !important; position: fixed; inset: 0; background: #fff; z-index: 2147481500;
  padding: 24px;
}
/* Header dropdown panel */
[data-ref="menu-panel"].is-open, [data-ref="menu-panel"][hidden="false"] { display: block !important; }
/* Mobile nav panel open */
[data-ref="nav-panel"].is-open { display: block !important; }
.no-scroll { overflow: hidden !important; }
/* Accordion content: default hide handled by hidden attribute */
component-accordion [hidden] { display: none !important; }
/* Mirror form success */
.mirror-form-success { animation: mfs 0.25s ease-out; }
@keyframes mfs { from { opacity: 0; transform: translateY(-4px);} to { opacity:1; transform:none; } }