/* Venta Loca - Botones 3D para el menu movil. Sin efectos en navegacion desktop. */
@media screen and (max-width: 991px) {
  li.vl3d-menu-item {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }

  ul.vl3d-menu-list, ol.vl3d-menu-list {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    list-style: none !important;
  }

  a.vl3d-menu-link {
    -webkit-appearance: none !important;
    box-sizing: border-box !important;
    isolation: isolate !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    flex-direction: row !important;
    float: none !important;
    gap: 12px !important;
    width: calc(100% - 28px) !important;
    max-width: 640px !important;
    min-height: 62px !important;
    height: auto !important;
    margin: 15px 14px !important;
    padding: 11px 16px !important;
    border: 3px solid #fff !important;
    border-radius: 999px !important;
    outline-offset: 3px !important;
    color: #fff !important;
    font-family: inherit !important;
    font-size: clamp(17px, 5.3vw, 23px) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: left !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    text-shadow: 0 1px 3px rgba(0,0,0,.24) !important;
    box-shadow: 0 5px 16px rgba(20,27,39,.27),
                0 1px 1px rgba(0,0,0,.12),
                inset 0 1px 1px rgba(255,255,255,.65),
                inset 0 -4px 7px rgba(0,0,0,.10) !important;
    overflow: hidden !important;
    white-space: normal !important;
    -webkit-tap-highlight-color: transparent;
    transition: transform .15s ease, filter .15s ease, box-shadow .15s ease !important;
    cursor: pointer !important;
    z-index: 1 !important;
  }

  a.vl3d-menu-link.vl3d-cyan {
    background: linear-gradient(180deg, #21cfe8 0%, #05aee5 40%, #0089d9 70%, #0541b8 100%) !important;
  }
  a.vl3d-menu-link.vl3d-purple {
    background: linear-gradient(180deg, #a509ef 0%, #8b00e2 44%, #6700bb 74%, #380093 100%) !important;
  }
  a.vl3d-menu-link.vl3d-green {
    background: linear-gradient(180deg, #19dc55 0%, #06bf39 37%, #009c25 72%, #007518 100%) !important;
  }
  a.vl3d-menu-link.vl3d-orange {
    background: linear-gradient(180deg, #ffe245 0%, #ffbe0d 42%, #ffa100 73%, #ff7900 100%) !important;
  }

  a.vl3d-menu-link::before {
    content: "" !important;
    position: absolute !important;
    display: block !important;
    z-index: -1 !important;
    pointer-events: none !important;
    left: 5% !important;
    right: 5% !important;
    top: 6% !important;
    height: 39% !important;
    width: 90% !important;
    border-radius: 100px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.59), rgba(255,255,255,.15) 68%, rgba(255,255,255,.03)) !important;
    opacity: .85 !important;
    box-shadow: inset 0 1px 2px rgba(255,255,255,.30) !important;
  }
  a.vl3d-menu-link::after { content: none !important; }
  a.vl3d-menu-link:hover, a.vl3d-menu-link:focus-visible {
    color: #fff !important;
    text-decoration: none !important;
    filter: brightness(1.07) !important;
  }
  a.vl3d-menu-link:active { transform: translateY(2px) scale(.99) !important; }
  a.vl3d-menu-link:focus-visible { outline: 3px solid #182236 !important; }
  a.vl3d-menu-link > .vl3d-decor {
    display: inline-flex !important;
    flex: 0 0 31px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 31px !important;
    height: 32px !important;
    color: white !important;
    line-height: 0 !important;
    position: relative !important;
    z-index: 2 !important;
    pointer-events: none !important;
  }
  a.vl3d-menu-link > .vl3d-decor svg {
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.6 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
  a.vl3d-menu-link > .vl3d-decor.vl3d-arrow {
    flex-basis: 24px !important;
    width: 24px !important;
    margin-left: auto !important;
  }
  a.vl3d-menu-link > .vl3d-decor.vl3d-arrow svg {
    width: 23px !important;
    height: 23px !important;
  }
  /* Avoid duplicate theme arrows/icons, without hiding actual link labels. */
  a.vl3d-menu-link > i,
  a.vl3d-menu-link > svg:not(.vl3d-decor),
  a.vl3d-menu-link > .menu-icon,
  a.vl3d-menu-link > .fa,
  a.vl3d-menu-link > .fas,
  a.vl3d-menu-link > .far {
    display: none !important;
  }
  a.vl3d-menu-link .vl3d-decor + span { color: #fff !important; }
}

@media screen and (max-width: 359px) {
  a.vl3d-menu-link { gap: 8px !important; padding: 10px 12px !important; min-height: 58px !important; }
  a.vl3d-menu-link > .vl3d-decor { flex-basis: 27px !important; width: 27px !important; }
}

@media (prefers-reduced-motion: reduce) {
  a.vl3d-menu-link { transition: none !important; }
}

/* The preview is shown in wp-admin even on desktop screens. */
.vl3d-admin .vl3d-preview {
  box-sizing: border-box;
  background: #f8fafc;
  border: 1px solid #dde1e8;
  border-radius: 16px;
  padding: 16px 6px;
  max-width: 430px;
  margin: 15px 0 24px;
}
.vl3d-admin .vl3d-preview a.vl3d-menu-link {
  box-sizing: border-box;
  display: block;
  position: relative;
  border: 3px solid #fff;
  border-radius: 999px;
  padding: 15px 26px;
  margin: 13px;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  font-size: 19px;
  text-shadow: 0 1px 3px rgba(0,0,0,.3);
  box-shadow: 0 5px 14px rgba(0,0,0,.24);
  overflow: hidden;
}
.vl3d-admin .vl3d-preview .vl3d-cyan { background: linear-gradient(#27d7ed, #0092db, #004ab5); }
.vl3d-admin .vl3d-preview .vl3d-purple { background: linear-gradient(#b820f1, #8501ce, #410099); }
.vl3d-admin .vl3d-preview .vl3d-green { background: linear-gradient(#25ed60, #00b338, #00761c); }
.vl3d-admin .vl3d-preview .vl3d-orange { background: linear-gradient(#ffe754, #ffb100, #ff8100); }
.vl3d-admin .vl3d-preview a.vl3d-menu-link::before {
  content: "";
  position: absolute;
  top: 6%; left: 6%; width: 88%; height: 40%;
  background: linear-gradient(rgba(255,255,255,.50), rgba(255,255,255,.04));
  border-radius: 999px;
  pointer-events: none;
}

/* Versión 1.1: cinco acciones de cuenta — mismo acabado 3D brillante de la referencia. */
@media screen and (max-width: 991px) {
  a.vl3d-menu-link.vl3d-blue {
    background: linear-gradient(180deg,#52bdff 0%,#1684ff 40%,#075aef 70%,#003acf 100%) !important;
  }
  a.vl3d-menu-link.vl3d-red {
    background: linear-gradient(180deg,#ff626b 0%,#e51a22 42%,#d50008 74%,#98000b 100%) !important;
  }
  /* Preserve pill shape in themes that constrain nested menu items. */
  li.vl3d-extra-item, ul.vl3d-menu-list > li.vl3d-menu-item {
    list-style: none !important;
  }
}

/* Independent shortcode and admin preview, visible on mobile + desktop. */
.vl3d-user-actions {
  box-sizing: border-box;
  width: 100%;
  max-width: 680px;
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
  padding: 16px;
  background: #f0f2f4;
  border-radius: 19px;
  margin: 12px 0 24px;
}
.vl3d-user-actions a.vl3d-menu-link,
.vl3d-user-actions span.vl3d-menu-link {
  box-sizing: border-box !important;
  display: flex !important;
  position: relative !important;
  isolation: isolate !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: row !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 66px !important;
  margin: 0 !important;
  padding: 12px 15px !important;
  border: 4px solid #fff !important;
  border-radius: 999px !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: clamp(14px,3.8vw,20px) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 0 1px 2px #0005 !important;
  box-shadow: 0 5px 10px #151d2e44, inset 0 2px 2px #ffffffad, inset 0 -3px 5px #0002 !important;
  overflow: hidden !important;
  transition: transform .13s ease,filter .13s ease !important;
  -webkit-tap-highlight-color: transparent;
}
.vl3d-user-actions a.vl3d-menu-link::before,
.vl3d-user-actions span.vl3d-menu-link::before {
  content: '' !important;
  z-index: -1 !important;
  pointer-events: none !important;
  display: block !important;
  position: absolute !important;
  top: 6% !important;
  left: 7% !important;
  right: 7% !important;
  width: 86% !important;
  height: 39% !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #ffffffe8, #ffffff31 70%,#ffffff00) !important;
  opacity: .72 !important;
}
.vl3d-user-actions a.vl3d-menu-link::after,
.vl3d-user-actions span.vl3d-menu-link::after { content: none !important; }
.vl3d-user-actions a.vl3d-menu-link:focus-visible { outline: 3px solid #162b65 !important; outline-offset: 3px !important; }
.vl3d-user-actions a.vl3d-menu-link:hover { filter: brightness(1.08) !important; color: #fff !important; }
.vl3d-user-actions a.vl3d-menu-link:active { transform: translateY(2px) !important; }
.vl3d-user-actions .vl3d-cyan { background: linear-gradient(180deg,#24dfea,#00bfc9 48%,#01819e 100%) !important; }
.vl3d-user-actions .vl3d-purple { background: linear-gradient(180deg,#b34af7,#8400d9 48%,#4700aa 100%) !important; }
.vl3d-user-actions .vl3d-green { background: linear-gradient(180deg,#49eb68,#08bf37 48%,#007621 100%) !important; }
.vl3d-user-actions .vl3d-blue { background: linear-gradient(180deg,#5dc8ff,#137bff 48%,#003bd9 100%) !important; }
.vl3d-user-actions .vl3d-red { background: linear-gradient(180deg,#ff6b6e,#ec1c27 48%,#9b0007 100%) !important; }
.vl3d-user-actions .vl3d-orange { background: linear-gradient(180deg,#ffeb62,#ffb700 48%,#fb7d00 100%) !important; }
.vl3d-user-actions .vl3d-decor { display: inline-flex !important; flex: 0 0 22px !important; width: 22px !important; height: 22px !important; align-items: center !important; justify-content: center !important; z-index: 1 !important; pointer-events: none !important; }
.vl3d-user-actions .vl3d-decor svg { display: block; width: 20px; height: 20px; stroke: #fff; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.vl3d-user-actions .vl3d-arrow { display:none !important; }
.vl3d-user-actions .vl3d-action-label { color: inherit !important; }
.vl3d-user-actions .vl3d-red:last-child:nth-child(odd) { grid-column: 1 / -1; }
.vl3d-admin .vl3d-preview { max-width: 500px; grid-template-columns: repeat(2,minmax(0,1fr)); }
@media screen and (max-width: 480px) {
  .vl3d-user-actions { gap: 12px; padding: 13px; }
  .vl3d-user-actions a.vl3d-menu-link { min-height: 59px !important; padding: 9px !important; font-size: 15px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .vl3d-user-actions a.vl3d-menu-link { transition: none !important; }
}