/* WHERING 4.2.4 — slot de meias.
   Meias invisíveis são implícitas; este preview só aparece quando uma meia longa cadastrada é escolhida. */
.socks-slot .visual-slot-trigger .vsp-socks-default{
  background:#eef5ef;
  color:#3f6d4e;
  border-color:#c8d8cc;
}
.socks-preview-slot{
  position:absolute;
  z-index:6;
  left:14px;
  bottom:52px;
  width:92px;
  min-height:96px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7px;
  border:1px solid #e2e7e2;
  border-radius:11px;
  background:rgba(255,255,255,.88);
  box-shadow:0 8px 24px rgba(20,32,24,.08);
}
.socks-preview-slot.optional-empty{display:none}
.socks-preview-slot img{
  display:block;
  max-width:70px;
  max-height:72px;
  object-fit:contain;
  filter:drop-shadow(0 4px 7px rgba(0,0,0,.08));
}
.socks-preview-slot .stage-code{
  bottom:3px;
  max-width:76px;
  font-size:7px;
}
.socks-preview-slot .remove-piece{
  top:4px;
  right:4px;
}
.saved-stage{position:relative}
.saved-stage-socks{
  position:absolute;
  z-index:4;
  left:8px;
  bottom:8px;
  width:52px;
  height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #e4e9e4;
  border-radius:8px;
  background:rgba(255,255,255,.90);
}
.saved-stage-socks img{
  max-width:38px!important;
  max-height:39px!important;
  object-fit:contain;
}
.saved-stage-socks span{
  position:absolute;
  left:3px;
  right:3px;
  bottom:2px;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  text-align:center;
  font-size:5.5px;
  font-weight:750;
  color:#69716b;
}
@media(max-width:760px){
  .socks-preview-slot{
    left:8px;
    bottom:46px;
    width:72px;
    min-height:78px;
    padding:5px;
  }
  .socks-preview-slot img{max-width:54px;max-height:56px}
  .saved-stage-socks{width:46px;height:50px}
}


/* WHERING 4.2.6 — relógios como opcional visual discreto. */
.watch-preview-slot{
  position:absolute;z-index:6;right:14px;bottom:52px;width:92px;min-height:96px;
  display:flex;align-items:center;justify-content:center;padding:7px;
  border:1px solid #e2e7e2;border-radius:11px;background:rgba(255,255,255,.88);
  box-shadow:0 8px 24px rgba(20,32,24,.08)
}
.watch-preview-slot.optional-empty{display:none}
.watch-preview-slot img{display:block;max-width:70px;max-height:72px;object-fit:contain;filter:drop-shadow(0 4px 7px rgba(0,0,0,.08))}
.watch-preview-slot .stage-code{bottom:3px;max-width:76px;font-size:7px}
.watch-preview-slot .remove-piece{top:4px;right:4px}
.saved-stage-watch{
  position:absolute;z-index:4;right:8px;bottom:8px;width:52px;height:56px;display:flex;
  align-items:center;justify-content:center;border:1px solid #e4e9e4;border-radius:8px;background:rgba(255,255,255,.90)
}
.saved-stage-watch img{max-width:38px!important;max-height:39px!important;object-fit:contain}
.saved-stage-watch span{position:absolute;left:3px;right:3px;bottom:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;font-size:5.5px;font-weight:750;color:#69716b}
@media(max-width:760px){
  .watch-preview-slot{right:8px;bottom:46px;width:72px;min-height:78px;padding:5px}
  .watch-preview-slot img{max-width:54px;max-height:56px}
  .saved-stage-watch{width:46px;height:50px}
}
