html.mbar-lock, html.mbar-lock body { overflow: hidden !important; }

.mbar-gallery-trigger {
  position: absolute; left: 14px; bottom: 14px; z-index: 30;
  display: inline-flex; align-items: center; gap: 8px; min-height: 38px;
  padding: 9px 13px; border: 0; border-radius: 999px;
  background: rgba(255,255,255,.92); color: #111;
  box-shadow: 0 5px 18px rgba(0,0,0,.10); backdrop-filter: blur(8px);
  font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease;
}
.woocommerce-product-gallery, .ct-product-gallery, [data-product-gallery] { position: relative; }
.mbar-gallery-trigger:hover { transform: translateY(-1px); box-shadow: 0 7px 20px rgba(0,0,0,.12); }
.mbar-cube-icon { font-size: 17px; line-height: 1; }

.mbar-root { position: fixed; inset: 0; z-index: 999999; pointer-events: none; visibility: hidden; }
.mbar-root.is-open { pointer-events: auto; visibility: visible; }
.mbar-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.22); opacity: 0; transition: opacity .28s ease; }
.mbar-root.is-open .mbar-backdrop { opacity: 1; }
.mbar-drawer {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: min(620px, 46vw); min-width: 420px;
  display: grid; grid-template-rows: auto 1fr auto;
  background: #fff; transform: translate3d(102%,0,0);
  transition: transform .34s cubic-bezier(.22,.7,.22,1);
  box-shadow: -20px 0 50px rgba(0,0,0,.12); outline: none;
}
.mbar-root.is-open .mbar-drawer { transform: translate3d(0,0,0); }
.mbar-drawer-head { height: 64px; display:flex; align-items:center; justify-content:space-between; padding: 0 22px; border-bottom:1px solid #eee; }
.mbar-drawer-head strong { font-size: 15px; }
.mbar-close { border:0; background:transparent; width:40px; height:40px; border-radius:50%; font-size:28px; line-height:1; cursor:pointer; }
.mbar-close:hover { background:#f4f4f4; }
.mbar-sheet-handle { display:none; }

.mbar-viewer-area { min-height:0; position:relative; overflow:hidden; background:#f7f7f5; }
.mbar-model-viewer {
  width:100%; height:100%; background:#f7f7f5; --poster-color:#f7f7f5;
  opacity:0; transition:opacity .28s ease;
}
.mbar-model-viewer.is-ready { opacity:1; }
.mbar-loader {
  position:absolute; inset:0; z-index:2; display:grid; place-items:center;
  overflow:hidden; background:#f7f7f5; transition:opacity .28s ease;
}
.mbar-loader.is-hidden { opacity:0; pointer-events:none; }
.mbar-loader-poster { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:1; transition:opacity .28s ease; }
.mbar-spinner {
  position:relative; z-index:2; width:28px; height:28px;
  border:2px solid rgba(20,20,20,.16); border-top-color:#111; border-radius:50%;
  animation:mbar-spin .75s linear infinite; background:rgba(255,255,255,.35);
}
@keyframes mbar-spin { to { transform:rotate(360deg); } }
.mbar-error { position:relative; z-index:3; padding:12px 16px; color:#8b1d1d; background:rgba(255,255,255,.9); border-radius:4px; }
.mbar-loader .screen-reader-text { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }

.mbar-viewer-hint {
  position:absolute; left:50%; bottom:18px; z-index:3; transform:translate(-50%,8px);
  padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.88);
  color:#555; box-shadow:0 3px 14px rgba(0,0,0,.08); backdrop-filter:blur(7px);
  font-size:12px; white-space:nowrap; opacity:0; pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.mbar-root.mbar-show-hint:not(.mbar-hide-hint) .mbar-viewer-hint { opacity:1; transform:translate(-50%,0); }

.mbar-drawer-foot { padding: 14px 20px calc(14px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid #eee; }
.mbar-ar-button { width:100%; min-height:50px; border:1px solid #111; background:#111; color:#fff; border-radius:3px; font:inherit; font-weight:600; cursor:pointer; }
.mbar-ar-button:disabled { opacity:.4; cursor:wait; }

@media (min-width: 769px) {
  .mbar-drawer-foot { display:none; }
}

@media (max-width: 768px) {
  .mbar-gallery-trigger { left:10px; bottom:10px; min-height:36px; padding:8px 11px; font-size:12px; }
  .mbar-backdrop { background:rgba(0,0,0,.28); }
  .mbar-drawer {
    top:auto; left:0; right:0; bottom:0; width:100%; min-width:0; height:min(94dvh, 900px);
    border-radius:18px 18px 0 0; grid-template-rows:auto 1fr auto;
    transform:translate3d(0,102%,0); box-shadow:0 -20px 50px rgba(0,0,0,.14);
  }
  .mbar-sheet-handle { display:block; position:absolute; top:8px; left:50%; width:40px; height:4px; transform:translateX(-50%); background:#c9c9c9; border-radius:99px; z-index:2; }
  .mbar-drawer-head { height:56px; padding:8px 14px 0; }
  .mbar-close { width:38px; height:38px; }
  .mbar-viewer-hint { bottom:14px; }
}

@media (prefers-reduced-motion: reduce) {
  .mbar-drawer, .mbar-backdrop, .mbar-model-viewer, .mbar-loader, .mbar-viewer-hint { transition:none; }
}

/* v0.1.4: visible confirmation that the 3D model inherited the current Woo color. */
.mbar-head-left { display:flex; align-items:center; gap:10px; min-width:0; }
.mbar-color-chip { display:inline-flex; align-items:center; gap:6px; min-width:0; max-width:220px; padding:5px 8px; border-radius:999px; background:#f2f2f0; color:#555; font-size:11px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mbar-color-dot { width:10px; height:10px; border-radius:50%; border:1px solid rgba(0,0,0,.12); flex:0 0 auto; }
#mbar-color-text { overflow:hidden; text-overflow:ellipsis; }
@media (max-width: 768px) { .mbar-color-chip { max-width:150px; } }

/* v0.1.7 - Front-end 3D color customizer + WooCommerce purchase bridge */
.mbar-drawer { grid-template-rows:auto minmax(0,1fr) auto auto; }
.mbar-customizer { background:#fff; border-top:1px solid #ececec; }
.mbar-customizer-toggle {
  width:100%; min-height:48px; padding:0 20px; border:0; background:#fff; color:#111;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  font:inherit; font-size:13px; font-weight:600; cursor:pointer; text-align:left;
}
.mbar-customizer-toggle:hover { background:#fafafa; }
.mbar-customizer-toggle span:last-child { font-size:20px; font-weight:400; color:#666; }
.mbar-customizer-body { padding:14px 20px 18px; border-top:1px solid #f0f0f0; max-height:42vh; overflow:auto; overscroll-behavior:contain; }
.mbar-customizer-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:14px; }
.mbar-customizer-head strong, .mbar-customizer-head small { display:block; }
.mbar-customizer-head strong { font-size:14px; }
.mbar-customizer-head small { margin-top:4px; max-width:390px; color:#777; font-size:11px; line-height:1.4; }
.mbar-customizer-reset { border:0; background:transparent; color:#666; padding:2px 0; font:inherit; font-size:11px; cursor:pointer; white-space:nowrap; }
.mbar-customizer-reset:hover { color:#111; text-decoration:underline; }
.mbar-customizer-material { padding:11px 0 13px; border-top:1px solid #f0f0f0; }
.mbar-customizer-material:first-child { border-top:0; padding-top:0; }
.mbar-customizer-material-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:9px; }
.mbar-customizer-material-head strong { font-size:12px; }
.mbar-customizer-selected-color { max-width:55%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#777; font-size:11px; }
.mbar-customizer-palette { display:flex; flex-wrap:wrap; gap:8px; }
.mbar-customizer-chip {
  width:30px; height:30px; padding:3px; border:1px solid #ddd; border-radius:50%;
  background:#fff; cursor:pointer; display:grid; place-items:center;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.mbar-customizer-chip:hover { border-color:#777; transform:translateY(-1px); }
.mbar-customizer-chip.is-selected { border-color:#111; box-shadow:0 0 0 1px #111; }
.mbar-customizer-chip > span { display:block; width:100%; height:100%; border-radius:50%; border:1px solid rgba(0,0,0,.10); }
.mbar-customizer-total { min-height:34px; margin-top:4px; padding-top:12px; border-top:1px solid #eee; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; }
.mbar-customizer-total strong { font-size:12px; }
.mbar-customizer-apply { width:100%; min-height:46px; margin-top:10px; border:1px solid #111; border-radius:3px; background:#111; color:#fff; font:inherit; font-weight:600; cursor:pointer; }
.mbar-customizer-apply:disabled { opacity:.35; cursor:not-allowed; }

.mbar-product-custom-summary {
  margin:10px 0 14px; padding:11px 12px; border:1px solid #e3e3e3; border-radius:5px; background:#fafafa;
  font-size:12px;
}
.mbar-product-custom-summary-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:8px; }
.mbar-product-custom-summary-head strong { font-size:12px; }
.mbar-product-custom-summary-head button { border:0; background:transparent; padding:0; color:#666; font:inherit; font-size:11px; cursor:pointer; }
.mbar-product-custom-summary-head button:hover { color:#111; text-decoration:underline; }
.mbar-product-custom-summary-item { display:flex; align-items:center; gap:7px; margin-top:5px; color:#555; }
.mbar-product-custom-dot { width:11px; height:11px; border-radius:50%; border:1px solid rgba(0,0,0,.12); flex:0 0 auto; }
.mbar-product-custom-price { margin-top:8px; padding-top:7px; border-top:1px solid #e8e8e8; font-weight:600; color:#222; }

@media (max-width:768px) {
  .mbar-drawer { grid-template-rows:auto minmax(180px,1fr) auto auto; }
  .mbar-customizer-body { max-height:44dvh; padding:12px 14px calc(16px + env(safe-area-inset-bottom)); }
  .mbar-customizer-toggle { min-height:46px; padding:0 14px; }
  .mbar-root.is-customizing .mbar-viewer-area { min-height:210px; }
  .mbar-root.is-customizing .mbar-drawer-foot { padding-top:10px; }
}
