/* =====================================================================
   "Evinde Gör" — 3B görüntüleyici + artırılmış gerçeklik (includes/model3d.php, model3d.js)
   Görünüm 3B kart tasarımcısıyla (kart3d.css) aynı dilde. Telefonda pencere tam ekran.
   ===================================================================== */
.m3d-ac, .m3d-modal{
  --m3d-ink:#1f1c19; --m3d-ink2:#6c655d; --m3d-line:#e6e0d8; --m3d-soft:#f6f3ef; --m3d-vurgu:#9c7a44; --m3d-vurgu2:#c9a56a;
  --m3d-sahne:radial-gradient(120% 90% at 30% 20%, #f7f5f1 0%, #ece8e2 55%, #e2ddd5 100%);
}
.m3d-modal *{ box-sizing:border-box; }
.m3d-modal[hidden], .m3d-modal [hidden]{ display:none !important; }
html.m3d-kilit, html.m3d-kilit body{ overflow:hidden !important; }
/* pencere açıkken canlı destek / WhatsApp balonları sahneyi kapatmasın */
html.m3d-kilit #nzDestek, html.m3d-kilit #waWidget{ display:none !important; }

/* ---------- Düğmeler ---------- */
.m3d-ac{ font:inherit; cursor:pointer; }
.m3d-ac svg{ flex:none; }
.m3d-ac:focus-visible{ outline:2px solid var(--m3d-vurgu); outline-offset:2px; }
/* ürün görselinin sol üst köşesinde (uzun görsellerde de ilk bakışta görünsün) */
.m3d-ac--galeri{ position:absolute; left:14px; top:14px; z-index:12; display:inline-flex; align-items:center; gap:7px; padding:9px 15px 9px 11px; border:0; border-radius:999px;
  background:rgba(255,255,255,.9); color:var(--m3d-ink); font-size:13px; font-weight:600; letter-spacing:.01em; line-height:1;
  box-shadow:0 8px 22px -10px rgba(31,28,25,.5); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); transition:transform .15s, background .15s; }
.m3d-ac--galeri:hover{ transform:translateY(-1px); background:#fff; }
/* QR'dan telefona gelince düğme dikkat çeker */
.m3d-ac--vurgu{ animation:m3dVurgu 1.4s ease-in-out 3; }
@keyframes m3dVurgu{ 0%, 100%{ box-shadow:0 8px 22px -10px rgba(31,28,25,.5), 0 0 0 0 rgba(156,122,68,.6); } 60%{ box-shadow:0 8px 22px -10px rgba(31,28,25,.5), 0 0 0 12px rgba(156,122,68,0); } }
.m3d-ac--galeri svg{ width:19px; height:19px; color:var(--m3d-vurgu); }
/* satın alma alanında */
.m3d-ac--satin{ display:flex; align-items:center; gap:12px; width:100%; margin:10px 0 0; padding:12px 16px; border-radius:12px; text-align:left; color:var(--m3d-ink);
  background:linear-gradient(#fff,#fff) padding-box, linear-gradient(120deg, var(--m3d-vurgu2), var(--m3d-vurgu)) border-box; border:1.5px solid transparent;
  box-shadow:0 8px 24px -14px rgba(156,122,68,.55); transition:transform .15s, box-shadow .15s; }
.m3d-ac--satin:hover{ transform:translateY(-1px); box-shadow:0 14px 30px -14px rgba(156,122,68,.7); }
.m3d-ac--satin svg{ width:26px; height:26px; color:var(--m3d-vurgu); }
.m3d-ac--satin span{ display:block; font-weight:700; font-size:14px; line-height:1.2; }
.m3d-ac--satin small{ display:block; font-size:12px; color:var(--m3d-ink2); margin-top:2px; }

/* ---------- Pencere ---------- */
.m3d-modal{ position:fixed; inset:0; z-index:99990; display:flex; align-items:center; justify-content:center;
  padding:max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
.m3d-modal__arka{ position:absolute; inset:0; background:rgba(20,17,14,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.m3d-modal__pencere{ position:relative; width:min(980px, 100%); height:min(760px, 100%); display:flex; flex-direction:column; background:#fff; border-radius:16px;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.6); overflow:hidden; animation:m3dGir .28s cubic-bezier(.2,.8,.2,1); }
@keyframes m3dGir{ from{ opacity:0; transform:translateY(14px) scale(.985); } to{ opacity:1; transform:none; } }
.m3d-modal__bas{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 18px; border-bottom:1px solid var(--m3d-line); }
.m3d-modal__bas h2{ font-family:"Cormorant Garamond", Georgia, serif; font-weight:600; font-size:22px; margin:0; color:var(--m3d-ink); line-height:1.1; }
.m3d-modal__bas p{ margin:3px 0 0; font-size:12.5px; color:var(--m3d-ink2); }
.m3d-olcu{ white-space:nowrap; font-weight:600; color:var(--m3d-vurgu); }
.m3d-modal__kapat{ width:40px; height:40px; border-radius:50%; border:1px solid var(--m3d-line); background:#fff; color:var(--m3d-ink); font-size:22px; line-height:1; cursor:pointer; display:grid; place-items:center; flex:none; }
.m3d-modal__kapat:hover{ background:var(--m3d-soft); }

.m3d-sahne{ position:relative; flex:1; min-height:0; background:var(--m3d-sahne); }
.m3d-sahne model-viewer{ display:block; width:100%; height:100%; background:transparent; --poster-color:transparent; --progress-bar-color:var(--m3d-vurgu); }
.m3d-yukleniyor{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:20px; text-align:center; font-size:13px; color:var(--m3d-ink2); pointer-events:none; }
.m3d-yukleniyor i{ width:34px; height:34px; border-radius:50%; border:3px solid rgba(156,122,68,.22); border-top-color:var(--m3d-vurgu); animation:m3dDon .9s linear infinite; }
@keyframes m3dDon{ to{ transform:rotate(360deg); } }
.m3d-ipucu{ position:absolute; left:50%; top:12px; transform:translateX(-50%); max-width:calc(100% - 24px); padding:6px 12px; border-radius:999px; font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  background:rgba(255,255,255,.78); color:var(--m3d-ink2); pointer-events:none; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }

.m3d-modal__alt{ padding:14px 18px calc(14px + env(safe-area-inset-bottom)); border-top:1px solid var(--m3d-line); background:#fff; }
.m3d-ar-alan{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; }
.m3d-ar{ display:inline-flex; align-items:center; justify-content:center; gap:10px; width:min(420px, 100%); padding:15px 22px; border:0; border-radius:12px; cursor:pointer;
  font:inherit; font-weight:700; font-size:15px; color:#fff; background:linear-gradient(120deg, var(--m3d-vurgu), #7d6136); box-shadow:0 14px 30px -12px rgba(125,97,54,.6); }
.m3d-ar svg{ width:22px; height:22px; flex:none; }
.m3d-ar:focus-visible{ outline:2px solid var(--m3d-vurgu); outline-offset:3px; }
.m3d-ar-alan p{ margin:0; max-width:460px; font-size:12.5px; color:var(--m3d-ink2); }
.m3d-qr-alan{ display:flex; align-items:center; gap:18px; }
.m3d-qr{ flex:none; width:148px; height:148px; padding:8px; border-radius:12px; background:#fff; border:1px solid var(--m3d-line); }
.m3d-qr img, .m3d-qr canvas{ display:block; width:100% !important; height:auto !important; }
.m3d-qr-alan b{ display:block; margin-bottom:4px; font-size:15px; color:var(--m3d-ink); }
.m3d-qr-alan p{ margin:0; max-width:520px; font-size:13px; color:var(--m3d-ink2); }
.m3d-destek-yok{ margin:0; text-align:center; font-size:13px; color:var(--m3d-ink2); }

@media (max-width: 640px){
  .m3d-modal{ padding:0; }
  .m3d-modal__pencere{ width:100%; height:100%; border-radius:0; }
  .m3d-ac--galeri{ left:10px; top:10px; padding:8px 13px 8px 10px; font-size:12.5px; }
  .m3d-qr-alan{ flex-direction:column; text-align:center; }
}
@media (prefers-reduced-motion: reduce){ .m3d-modal__pencere{ animation:none; } .m3d-yukleniyor i{ animation-duration:3s; } }
