/* Tutorial guiado del carrito - estilos encapsulados */
.dd-tutorial-backdrop,
.dd-tutorial-spotlight,
.dd-tutorial-guide{
  position:fixed;
  inset:0;
}
.dd-tutorial-backdrop{
  z-index:900;
  background:transparent;
  cursor:default;
}
.dd-tutorial-backdrop.is-centered{ background:rgba(0,0,0,.78); }
.dd-tutorial-spotlight{
  z-index:901;
  inset:auto;
  border:1px solid rgba(232,233,236,.9);
  border-radius:10px;
  box-shadow:
    0 0 0 9999px rgba(0,0,0,.72),
    0 0 24px rgba(199,202,209,.28),
    inset 0 0 0 1px rgba(255,255,255,.08);
  pointer-events:none;
  transition:top .35s ease, left .35s ease, width .35s ease, height .35s ease, opacity .25s ease;
}
.dd-tutorial-guide{
  z-index:910;
  inset:auto;
  width:min(390px, calc(100vw - 32px));
  pointer-events:none;
  transition:top .35s ease, left .35s ease, opacity .25s ease, transform .35s ease;
}
.dd-tutorial-guide.is-centered{
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}
.dd-tutorial-card{
  position:relative;
  overflow:visible;
  border:1px solid rgba(192,192,192,.45);
  border-radius:12px;
  background:linear-gradient(145deg, rgba(18,18,18,.98), rgba(0,0,0,.98));
  color:#c0c0c0;
  box-shadow:0 22px 60px rgba(0,0,0,.72), 0 0 24px rgba(192,192,192,.1);
  padding:24px 24px 20px 126px;
  pointer-events:auto;
}
.dd-tutorial-mascot{
  position:absolute;
  left:-24px;
  bottom:10px;
  width:144px;
  height:204px;
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.58));
  animation:dd-davi-float 3.4s ease-in-out infinite;
  pointer-events:none;
}
.dd-tutorial-mascot.is-changing{
  animation:dd-davi-change .34s ease-out, dd-davi-float 3.4s .34s ease-in-out infinite;
}
@keyframes dd-davi-float{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-7px); }
}
@keyframes dd-davi-change{
  0%{ opacity:.2; transform:translateY(8px) scale(.94); }
  100%{ opacity:1; transform:translateY(0) scale(1); }
}
.dd-tutorial-progress{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:9px;
  color:#8f9197;
  font-size:9px;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}
.dd-tutorial-progress::before{
  content:"";
  width:18px;
  height:1px;
  background:#c0c0c0;
}
.dd-tutorial-title{
  margin:0;
  color:#e8e9ec;
  font-family:var(--font-display);
  font-size:23px;
  font-weight:500;
  line-height:1.15;
}
.dd-tutorial-text{
  margin:10px 0 18px;
  color:#b1b4bc;
  font-size:12.5px;
  line-height:1.62;
}
.dd-tutorial-hint{
  display:none;
  margin:-8px 0 14px;
  color:#e8e9ec;
  font-size:11px;
  line-height:1.45;
}
.dd-tutorial-hint.is-visible{ display:block; }
.dd-tutorial-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.dd-tutorial-button{
  min-height:36px;
  border-radius:100px;
  padding:0 15px;
  font:700 10.5px/1 var(--font-body);
  letter-spacing:.03em;
  cursor:pointer;
  transition:background .25s ease, border-color .25s ease, color .25s ease, transform .25s ease;
}
.dd-tutorial-button:hover{ transform:translateY(-1px); }
.dd-tutorial-button:focus-visible{
  outline:2px solid #e8e9ec;
  outline-offset:3px;
}
.dd-tutorial-prev{
  border:1px solid rgba(192,192,192,.42);
  background:transparent;
  color:#c0c0c0;
}
.dd-tutorial-next{
  border:1px solid #e8e9ec;
  background:#e8e9ec;
  color:#0a0a0c;
}
.dd-tutorial-skip{
  min-height:36px;
  margin-right:auto;
  border:1px solid rgba(241,242,244,.72);
  border-radius:100px;
  background:rgba(241,242,244,.11);
  color:#fff;
  padding:0 14px;
  font:800 10.5px/1 var(--font-body);
  letter-spacing:.03em;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.dd-tutorial-skip:hover{
  border-color:#fff;
  background:rgba(241,242,244,.2);
  transform:translateY(-1px);
}
.dd-tutorial-skip:focus-visible{
  outline:3px solid #fff;
  outline-offset:3px;
}
.dd-tutorial-arrow{
  position:fixed;
  z-index:909;
  width:14px;
  height:14px;
  border-left:1px solid rgba(192,192,192,.55);
  border-top:1px solid rgba(192,192,192,.55);
  background:#111113;
  transform:rotate(45deg);
  pointer-events:none;
}
.dd-tutorial-restart{
  display:block;
  margin:12px auto 0;
  border:0;
  background:transparent;
  color:var(--silver-fog);
  font:700 10px/1.4 var(--font-body);
  letter-spacing:.08em;
  text-decoration:underline;
  text-underline-offset:4px;
  cursor:pointer;
}
.dd-tutorial-restart:hover{ color:var(--silver-bright); }

body[data-dd-tutorial-step="cart-review"] .cart-header-button{
  z-index:905;
  border-color:#fff;
  background:linear-gradient(145deg, #2b2d31, #0a0a0c);
  color:#fff;
  box-shadow:
    0 0 0 5px rgba(241,242,244,.24),
    0 0 30px rgba(241,242,244,.34),
    0 18px 38px -14px rgba(0,0,0,.92),
    inset 0 1px 0 rgba(255,255,255,.15);
}
body[data-dd-tutorial-step="cart-review"] .site-header{
  z-index:905;
}

@media (max-width: 640px){
  .dd-tutorial-guide,
  .dd-tutorial-guide.is-centered{
    position:fixed;
    left:12px !important;
    right:12px;
    top:auto !important;
    bottom:max(12px, env(safe-area-inset-bottom));
    width:auto;
    transform:none;
  }
  .dd-tutorial-card{ padding:20px 18px 18px 100px; }
  .dd-tutorial-mascot{
    left:-10px;
    bottom:8px;
    width:112px;
    height:164px;
  }
  .dd-tutorial-title{ font-size:20px; }
  .dd-tutorial-text{ font-size:12px; margin-bottom:15px; }
  .dd-tutorial-actions{ gap:6px; }
  .dd-tutorial-button{ min-height:40px; padding:0 13px; }
  .dd-tutorial-skip{
    order:3;
    width:100%;
    min-height:42px;
    margin:4px 0 0;
    font-size:11px;
  }
  .dd-tutorial-arrow{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  .dd-tutorial-spotlight,
  .dd-tutorial-guide,
  .dd-tutorial-button{ transition:opacity .15s ease; }
  .dd-tutorial-mascot,
  .dd-tutorial-mascot.is-changing{ animation:none; }
}