/* =========================
   LOGO
========================= */
.nx-logo {
  flex-shrink: 0 !important;
  min-width: 80px !important;
}

.nx-logo a,
.nx-logo .custom-logo-link {
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

.nx-logo img,
.nx-logo .custom-logo {
  max-height: 90px !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
  flex-shrink: 0 !important;
}

@media (max-width: 1024px) {
  .nx-logo img,
  .nx-logo .custom-logo {
    max-height: 70px !important;
  }
}

@media (max-width: 768px) {
  .nx-logo img,
  .nx-logo .custom-logo {
    max-height: 55px !important;
  }
}

/* =========================
   HEADER
========================= */
.nx-header,
.nx-header-inner {
  overflow: visible !important;
}

@media (min-width: 901px) {
  .nx-cart-label {
    display: none !important;
  }
}

/* =========================
   SHOP
========================= */
ul.products::before,
ul.products::after {
  display: none !important;
  content: none !important;
}

.nx-shop-hero {
  padding-top: 60px !important;
  padding-bottom: 30px !important;
}

.nx-shop-hero h1.nx-page-title,
.nx-shop-hero .nx-page-title {
  font-size: clamp(48px, 8vw, 110px) !important;
  line-height: 1 !important;
  margin-bottom: 16px !important;
}

.nx-shop-layout {
  display: grid !important;
  grid-template-columns: 260px 1fr !important;
  gap: 32px !important;
  padding: 32px !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

@media (max-width: 900px) {
  .nx-shop-layout {
    grid-template-columns: 1fr !important;
  }

  .nx-shop-sidebar {
    display: none !important;
  }
}

/* =========================
   MOBILE FIXES
========================= */
.nx-mobile-nav-list .menu-item:has(.dgwt-wcas-search-wrapp) {
  display: none !important;
}

body:has(.nx-mobile-menu[data-nx-open]) .woocommerce-multi-currency {
  display: none !important;
}

/* =========================
   LOGO MOBILE UI
========================= */
@media (max-width: 768px) {
  .nx-logo-text {
    font-size: 11px !important;
    letter-spacing: 1.5px !important;
  }

  .nx-logo-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 17px !important;
  }

  .nx-logo-mark {
    gap: 7px !important;
  }

  .nx-header-inner {
    padding: 12px 16px !important;
    gap: 8px !important;
  }

  .nx-cart-btn {
    padding: 8px 12px 8px 10px !important;
    font-size: 11px !important;
    margin-left: 4px !important;
  }

  .nx-cart-count {
    padding: 1px 6px !important;
    font-size: 9px !important;
  }
}

/* =========================
   MOBILE MENU
========================= */
.nx-mobile-nav-item-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100%;
}

.nx-mobile-nav-item-row .nx-mobile-nav-link {
  flex: 1 1 auto !important;
}

.nx-submenu-toggle {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  flex-shrink: 0 !important;
  border: 1px solid var(--nx-line) !important;
  border-radius: 8px !important;
  color: var(--nx-ink) !important;
  transition: transform 0.3s, background 0.2s !important;
  cursor: pointer !important;
}

.nx-submenu-toggle:hover {
  background: var(--nx-bg-3) !important;
}

.nx-submenu-toggle[aria-expanded="true"] {
  transform: rotate(180deg) !important;
  background: var(--nx-bg-3) !important;
}

/* Submenú animado */
.nx-mobile-nav-list .nx-submenu {
  overflow: hidden !important;
  max-height: 0;
  transition: max-height 0.35s ease;
  display: block !important;
}

.nx-mobile-nav-list .nx-submenu:not([hidden]) {
  max-height: 600px !important;
  border-top: 1px solid var(--nx-line) !important;
  padding-bottom: 8px !important;
}

.nx-mobile-nav-list .nx-submenu a {
  font-size: 13px !important;
  padding: 10px 4px 10px 16px !important;
  color: var(--nx-ink-dim) !important;
  border-bottom: 1px solid var(--nx-line) !important;
  letter-spacing: 0.5px !important;
}

.nx-mobile-nav-list .nx-submenu a:hover {
  color: var(--nx-accent) !important;
}

/* =========================
   MOBILE MENU OPTIMIZADO
========================= */
.nx-mobile-nav-list > li > .nx-mobile-nav-item-row > .nx-mobile-nav-link,
.nx-mobile-nav-list > li > a {
  font-size: 12px !important;
  letter-spacing: 0.06em !important;
  padding: 10px 4px !important;
}

.nx-mobile-nav-list > li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
}

/* Submenú open fallback */
.nx-submenu-toggle[aria-expanded="true"] ~ .nx-submenu,
.nx-submenu-toggle[aria-expanded="true"] ~ .sub-menu,
li.is-open > .nx-submenu,
li.is-open > .sub-menu {
  max-height: 600px !important;
}

.nx-mobile-nav-list .nx-submenu a,
.nx-mobile-nav-list .sub-menu a {
  font-size: 11px !important;
  padding: 8px 12px 8px 26px !important;
}


/==== codigo para campos

/* ================================================================
 * NASUS RP STORE - Integración con Advanced Product Fields Pro
 * Plugin: StudioWombat APF Pro v3.1.1 (prefijo: wapf)
 * Pegar en: Apariencia → Personalizar → CSS adicional
 * ================================================================ */

/* ─── 1. WRAPPER PRINCIPAL ─── */
.wapf-wrapper {
    margin: 24px 0 !important;
    padding: 24px !important;
    background: linear-gradient(180deg, #12121c 0%, #0d0d15 100%) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 16px !important;
    position: relative;
    overflow: hidden;
}
.wapf-wrapper::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, #00f0ff 30%, #b983ff 70%, transparent 100%);
    opacity: 0.6;
}
.wapf-field-group {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
}
.wapf-section {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
.wapf-section:last-child {
    padding-bottom: 0 !important;
    border-bottom: none !important;
}
.wapf-section-title,
.wapf-section > h3 {
    font-family: 'Anton', 'Space Grotesk', sans-serif !important;
    font-size: 18px !important;
    color: #f5f5f7 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.01em !important;
    margin: 0 0 4px 0 !important;
    padding: 0 0 8px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.04) !important;
    display: flex;
    align-items: center;
    gap: 10px;
}
.wapf-section-title::before,
.wapf-section > h3::before {
    content: '';
    width: 4px;
    height: 16px;
    background: #00f0ff;
    border-radius: 2px;
    box-shadow: 0 0 6px #00f0ff;
}

/* ─── 2. LABELS Y DESCRIPCIONES ─── */
.wapf-field-container {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}
.wapf-field-label,
.wapf-field-container > label,
label.wapf-field-input > span:first-child {
    display: block !important;
    font-family: 'JetBrains Mono', 'SF Mono', monospace !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #8a8a9e !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    margin-bottom: 10px !important;
    line-height: 1.3 !important;
}
.wapf-required,
.wapf-field-label .required {
    color: #ff3366 !important;
    font-weight: 700 !important;
}
.wapf-field-description,
.wapf-field-container .description {
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 12px !important;
    color: #8a8a9e !important;
    margin-top: 6px !important;
    line-height: 1.5 !important;
    opacity: 0.85;
}

/* ─── 3. INPUTS (text, email, number, textarea, select) ─── */
.wapf-wrapper input[type="text"],
.wapf-wrapper input[type="email"],
.wapf-wrapper input[type="tel"],
.wapf-wrapper input[type="number"],
.wapf-wrapper input[type="password"],
.wapf-wrapper input[type="url"],
.wapf-wrapper input[type="date"],
.wapf-wrapper input[type="time"],
.wapf-wrapper input[type="datetime-local"],
.wapf-wrapper textarea,
.wapf-wrapper select,
.wapf-field-input input[type="text"],
.wapf-field-input input[type="email"],
.wapf-field-input input[type="tel"],
.wapf-field-input input[type="number"],
.wapf-field-input input[type="password"],
.wapf-field-input input[type="url"],
.wapf-field-input input[type="date"],
.wapf-field-input textarea,
.wapf-field-input select {
    width: 100% !important;
    height: auto !important;
    min-height: 48px !important;
    background: rgba(255,255,255,0.03) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 12px !important;
    color: #f5f5f7 !important;
    padding: 12px 16px !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    transition: all 0.25s ease !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    vertical-align: middle !important;
}
/* Select necesita nowrap para que el texto seleccionado no se rompa */
.wapf-wrapper select,
.wapf-field-input select {
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    overflow: hidden !important;
}
.wapf-wrapper input:focus,
.wapf-wrapper textarea:focus,
.wapf-wrapper select:focus,
.wapf-field-input input:focus,
.wapf-field-input textarea:focus,
.wapf-field-input select:focus {
    border-color: #00f0ff !important;
    background: rgba(0,240,255,0.04) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(0,240,255,0.12) !important;
}
.wapf-wrapper input::placeholder,
.wapf-wrapper textarea::placeholder {
    color: #5a5a6e !important;
    opacity: 0.7;
}
.wapf-wrapper select,
.wapf-field-input select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M3 5.5L7 9.5L11 5.5' stroke='%2300f0ff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    background-size: 14px 14px !important;
    padding-right: 42px !important;
    cursor: pointer;
}
.wapf-wrapper select option {
    background: #0d0d15 !important;
    color: #f5f5f7 !important;
    padding: 8px;
}
.wapf-wrapper textarea,
.wapf-field-input textarea {
    min-height: 100px !important;
    resize: vertical !important;
    line-height: 1.5 !important;
}

/* ─── 4. CHECKBOXES Y RADIOS ─── */
.wapf-field-input input[type="checkbox"],
.wapf-field-input input[type="radio"],
.wapf-wrapper input[type="checkbox"],
.wapf-wrapper input[type="radio"] {
    accent-color: #00f0ff !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 10px 0 0 !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
}
.wapf-field-input > label,
label.wapf-field-input label,
.wapf-field-container label.wapf-label-option {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 14px !important;
    background: rgba(255,255,255,0.025) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 10px !important;
    color: #f5f5f7 !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    margin: 0 0 8px 0 !important;
}
.wapf-field-input > label:hover,
label.wapf-field-input label:hover {
    border-color: #00f0ff !important;
    background: rgba(0,240,255,0.04) !important;
}
.wapf-field-input > label:has(input:checked),
label.wapf-field-input label:has(input:checked) {
    border-color: #00f0ff !important;
    background: rgba(0,240,255,0.06) !important;
    box-shadow: 0 0 0 1px #00f0ff inset !important;
    color: #00f0ff !important;
}

/* Precio extra: "+$5.000" */
.wapf-price-hint,
.wapf-price,
.wapf-field-input .price-hint {
    font-family: 'JetBrains Mono', 'SF Mono', monospace !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #00f0ff !important;
    background: rgba(0,240,255,0.1) !important;
    padding: 3px 9px !important;
    border-radius: 100px !important;
    margin-left: 6px !important;
    white-space: nowrap;
}

/* ─── 5. SWATCHES ─── */
.wapf-swatches,
.wapf-field-input.wapf-swatches,
.wapf-field-container .wapf-swatches {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    padding: 0 !important;
}
.wapf-swatch,
.wapf-swatches label,
.wapf-swatches .wapf-swatch-wrap {
    position: relative !important;
    cursor: pointer !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    transition: all 0.25s ease !important;
    border: 2px solid rgba(255,255,255,0.08) !important;
    background: rgba(255,255,255,0.025) !important;
    min-width: 60px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 16px !important;
    color: #f5f5f7 !important;
    font-family: 'JetBrains Mono', 'SF Mono', monospace !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    margin: 0 !important;
}
.wapf-swatch:hover,
.wapf-swatches label:hover {
    border-color: #00f0ff !important;
    transform: translateY(-1px) !important;
}
.wapf-swatch.wapf-swatch-active,
.wapf-swatch-selected,
.wapf-swatches label:has(input:checked) {
    border-color: #00f0ff !important;
    background: rgba(0,240,255,0.08) !important;
    color: #00f0ff !important;
    box-shadow: 0 0 16px rgba(0,240,255,0.2) !important;
}
.wapf-swatch.wapf-swatch-color,
.wapf-swatch[data-type="color"] {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    border-radius: 50% !important;
    padding: 0 !important;
}
.wapf-swatch.wapf-swatch-image,
.wapf-swatch[data-type="image"] {
    padding: 4px !important;
    width: 60px !important;
    height: 60px !important;
}
.wapf-swatch img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    display: block !important;
}
.wapf-swatch input[type="radio"],
.wapf-swatch input[type="checkbox"],
.wapf-swatches label input[type="radio"],
.wapf-swatches label input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
}

/* ─── 6. FILE UPLOAD ─── */
.wapf-field-input input[type="file"],
.wapf-wrapper input[type="file"] {
    display: block !important;
    width: 100% !important;
    padding: 14px 16px !important;
    background: rgba(255,255,255,0.025) !important;
    border: 2px dashed rgba(255,255,255,0.08) !important;
    border-radius: 12px !important;
    color: #8a8a9e !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-size: 13px !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
}
.wapf-field-input input[type="file"]:hover,
.wapf-wrapper input[type="file"]:hover {
    border-color: #00f0ff !important;
    background: rgba(0,240,255,0.03) !important;
    color: #f5f5f7 !important;
}
.wapf-field-input input[type="file"]::file-selector-button,
.wapf-wrapper input[type="file"]::file-selector-button {
    background: #00f0ff !important;
    color: #07070c !important;
    border: none !important;
    padding: 8px 16px !important;
    border-radius: 100px !important;
    font-family: 'JetBrains Mono', 'SF Mono', monospace !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    margin-right: 12px !important;
    transition: all 0.2s ease !important;
}
.wapf-field-input input[type="file"]::file-selector-button:hover,
.wapf-wrapper input[type="file"]::file-selector-button:hover {
    background: #b983ff !important;
}

/* ─── 7. DATE PICKER (flatpickr) ─── */
.wapf-datepicker,
.wapf-calendar,
.flatpickr-calendar {
    background: #0d0d15 !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.6) !important;
    color: #f5f5f7 !important;
    font-family: 'Space Grotesk', sans-serif !important;
}
.flatpickr-months,
.flatpickr-month,
.flatpickr-current-month {
    color: #f5f5f7 !important;
    background: transparent !important;
    font-family: 'Anton', sans-serif !important;
}
.flatpickr-day {
    color: #f5f5f7 !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}
.flatpickr-day:hover {
    background: rgba(0,240,255,0.1) !important;
    border-color: #00f0ff !important;
    color: #00f0ff !important;
}
.flatpickr-day.selected,
.flatpickr-day.today {
    background: #00f0ff !important;
    color: #07070c !important;
    border-color: #00f0ff !important;
}
.flatpickr-day.disabled {
    color: #5a5a6e !important;
    opacity: 0.3 !important;
}
.flatpickr-weekdays,
.flatpickr-weekday {
    color: #8a8a9e !important;
    background: transparent !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
}

/* ─── 8. PRICE DISPLAY ─── */
.wapf-price-display,
.wapf-total-price,
.wapf-calculation-result,
.wapf-label-total,
.price .amount.wapf-updated {
    font-family: 'JetBrains Mono', 'SF Mono', monospace !important;
    color: #00f0ff !important;
    font-weight: 700 !important;
}

/* ─── 9. MULTI-STEP (prev / next / progress) ─── */
.wapf_step_buttons,
.wapf-step-buttons {
    display: flex !important;
    gap: 10px !important;
    margin-top: 20px !important;
    padding-top: 16px !important;
    border-top: 1px solid rgba(255,255,255,0.08) !important;
}
.wapf_btn_prev,
.wapf_btn_next,
.wapf-btn-prev,
.wapf-btn-next {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 24px !important;
    font-family: 'JetBrains Mono', 'SF Mono', monospace !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    border-radius: 100px !important;
    cursor: pointer !important;
    border: 1px solid transparent !important;
    transition: all 0.25s ease !important;
}
.wapf_btn_next,
.wapf-btn-next {
    background: #00f0ff !important;
    color: #07070c !important;
    border-color: #00f0ff !important;
    margin-left: auto !important;
}
.wapf_btn_next:hover,
.wapf-btn-next:hover {
    background: #b983ff !important;
    border-color: #b983ff !important;
    transform: translateY(-1px);
}
.wapf_btn_prev,
.wapf-btn-prev {
    background: rgba(255,255,255,0.04) !important;
    color: #f5f5f7 !important;
    border-color: rgba(255,255,255,0.14) !important;
}
.wapf_btn_prev:hover,
.wapf-btn-prev:hover {
    background: rgba(0,240,255,0.05) !important;
    border-color: #00f0ff !important;
    color: #00f0ff !important;
}

.wapf-progress {
    position: relative !important;
    max-width: 450px !important;
    width: 100% !important;
    margin: 0 auto 24px !important;
}
.wapf-progress::before {
    content: '' !important;
    position: absolute !important;
    height: 3px !important;
    width: 100% !important;
    background: rgba(255,255,255,0.08) !important;
    top: 14px !important;
    left: 0 !important;
    border-radius: 2px !important;
}
.wapf-progress-bar {
    position: absolute !important;
    height: 3px !important;
    background: linear-gradient(90deg, #00f0ff, #b983ff) !important;
    top: 14px !important;
    left: 0 !important;
    border-radius: 2px !important;
    box-shadow: 0 0 10px #00f0ff !important;
    transition: width 0.3s ease !important;
}
.wapf-progress-steps {
    display: flex !important;
    justify-content: space-between !important;
    position: relative !important;
    z-index: 2 !important;
}
.wapf-progress-steps > div {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: #12121c !important;
    border: 2px solid rgba(255,255,255,0.08) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #8a8a9e !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    transition: all 0.3s ease !important;
}
.wapf-progress-steps > div.active {
    background: #00f0ff !important;
    color: #07070c !important;
    border-color: #00f0ff !important;
    box-shadow: 0 0 12px #00f0ff !important;
}

/* ─── 10. ERRORES ─── */
.wapf-error,
.wapf-validation-error,
.wapf-field-error {
    color: #ff3366 !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    margin-top: 6px !important;
    padding: 8px 12px !important;
    background: rgba(255,51,102,0.08) !important;
    border: 1px solid rgba(255,51,102,0.25) !important;
    border-radius: 8px !important;
    display: block !important;
}
.wapf-field-has-error input,
.wapf-field-has-error textarea,
.wapf-field-has-error select {
    border-color: #ff3366 !important;
    background: rgba(255,51,102,0.04) !important;
}

/* ─── 11. TOOLTIP (?) ─── */
.wapf-tooltip,
.wapf-field-tooltip {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 50% !important;
    background: rgba(0,240,255,0.1) !important;
    color: #00f0ff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    margin-left: 6px !important;
    cursor: help !important;
    transition: all 0.2s ease !important;
}
.wapf-tooltip:hover,
.wapf-field-tooltip:hover {
    background: #00f0ff !important;
    color: #07070c !important;
}

/* ─── 12. RESPONSIVE ─── */
@media (max-width: 640px) {
    .wapf-wrapper {
        padding: 20px 16px !important;
        margin: 20px 0 !important;
    }
    .wapf-section-title,
    .wapf-section > h3 {
        font-size: 16px !important;
    }
    .wapf-swatch,
    .wapf-swatches label {
        min-width: 50px !important;
        font-size: 11px !important;
        padding: 6px 12px !important;
    }
    .wapf_btn_prev,
    .wapf_btn_next {
        padding: 10px 18px !important;
        font-size: 11px !important;
    }
}




/* ==========================
 *    CATALOG MOBILE FIX
 *    ========================== */
@media (max-width: 768px) {
	.nx-shop-layout {
		        grid-template-columns: 1fr !important;
		        display: flex !important;
		        flex-direction: column !important;
	}
	.nx-shop-sidebar {
		        display: none !important;
	}
	.nx-shop-products {
		        width: 100% !important;
		        max-width: 100% !important;
		        overflow-x: hidden !important;
	}
	ul.products {
		        grid-template-columns: repeat(2, 1fr) !important;
		        width: 100% !important;
		        gap: 12px !important;
		        padding: 0 !important;
		        margin: 0 !important;
	}
	ul.products li.product {
		        width: 100% !important;
		        min-width: 0 !important;
		        max-width: 100% !important;
	}
}

/* ==========================
 *    LOGO NAV MAS PEQUENO
 *    ========================== */
.nx-logo-icon {
	    width: 22px !important;
	    height: 22px !important;
	    font-size: 13px !important;
}
.nx-logo-text {
	    font-size: 11px !important;
	    letter-spacing: 1.5px !important;
}
.nx-logo-mark {
	    gap: 5px !important;
}
@media (max-width: 768px) {
	.nx-logo-icon {
		        width: 20px !important;
		        height: 20px !important;
		        font-size: 12px !important;
	}
	.nx-logo-text {
		        font-size: 10px !important;
		        letter-spacing: 1px !important;
	}
}
	

/* ============================
   NX CARD - Index Product Cards
   (Same style as catalog .shop__item)
   ============================ */

/* Main card container - same as .shop__item */
.nx-card {
    background: linear-gradient(rgb(26, 26, 40) 0%, rgb(18, 18, 28) 100%);
    border: 1px solid var(--nx-line);
    border-radius: 18px;
    padding: 14px;
    position: relative;
    overflow: hidden;
    transition: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Gradient border effect on hover */
.nx-card::before {
    content: "";
    position: absolute;
    inset: -1px;
    background: linear-gradient(135deg, var(--nx-accent-2), var(--nx-accent), var(--nx-accent-hot));
    border-radius: 18px;
    z-index: -1;
    opacity: 0.6;
    transition: opacity 0.4s;
}
.nx-card:hover::before {
    opacity: 1;
}

/* Animated top line on hover */
.nx-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--nx-accent), var(--nx-accent-2), transparent);
    transition: left 0.8s;
    z-index: 2;
}
.nx-card:hover::after {
    left: 100%;
}

/* Hover lift effect */
.nx-card:hover {
    transform: translateY(-10px);
    box-shadow: rgba(0, 240, 255, 0.2) 0px 24px 60px, rgba(0, 240, 255, 0.3) 0px 0px 0px 1px;
}

/* Inner container */
.nx-card-inner {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
}

/* Thumbnail - same as .shop__item-thumb */
.nx-card-thumb {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    background: linear-gradient(135deg, rgb(30, 41, 56) 0%, rgb(10, 16, 24) 100%);
    margin-bottom: 14px;
    aspect-ratio: 1 / 1;
    display: block;
    width: 100%;
}

.nx-card-thumb::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 30%, rgba(185, 131, 255, 0.15), transparent 60%),
                radial-gradient(circle at 70% 70%, rgba(0, 240, 255, 0.12), transparent 60%);
    z-index: 1;
    pointer-events: none;
    opacity: 0.8;
    transition: opacity 0.4s;
}

.nx-card-thumb::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(45deg, transparent 48%, rgba(0, 240, 255, 0.08) 48%, rgba(0, 240, 255, 0.08) 52%, transparent 52%);
    background-size: 20px 20px;
    opacity: 0;
    transition: opacity 0.5s;
    z-index: 1;
    pointer-events: none;
}

.nx-card:hover .nx-card-thumb::after {
    opacity: 1;
}

/* Product image */
.nx-card-img {
    position: relative;
    z-index: 2;
    border-radius: 10px !important;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    margin: 0 !important;
    display: block !important;
}

.nx-card:hover .nx-card-img {
    transform: scale(1.08) !important;
}

/* Badge (onsale / discount) */
.nx-card-badge {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    background: linear-gradient(135deg, var(--nx-accent-hot), #dc2626) !important;
    color: rgb(255, 255, 255) !important;
    font-family: var(--nx-font-display) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    padding: 6px 14px !important;
    border-radius: 100px !important;
    box-shadow: rgba(255, 46, 99, 0.5) 0px 6px 20px !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    z-index: 5 !important;
    line-height: 1.2 !important;
    border: none !important;
    margin: 0 !important;
    min-height: auto !important;
    min-width: auto !important;
    animation: nxBadgeFloat 3s ease-in-out infinite !important;
}

/* Content area */
.nx-card-content {
    padding: 0 4px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Title */
.nx-card-title {
    min-height: 42px;
    text-align: center;
    margin: 0 0 10px !important;
}

.nx-card-title a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--nx-ink) !important;
    font-family: var(--nx-font-display) !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
    letter-spacing: -0.01em !important;
    text-decoration: none !important;
    transition: color 0.3s !important;
}

.nx-card-title a:hover {
    color: var(--nx-accent) !important;
}

/* Price */
.nx-card-price {
    text-align: center;
    padding: 8px 0;
    font-family: var(--nx-font-mono) !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    margin-bottom: 10px !important;
}

.nx-card-price .price {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    color: var(--nx-accent) !important;
    margin: 0 !important;
}

.nx-card-price .woocommerce-Price-currencySymbol {
    margin-right: 2px;
    opacity: 1;
    font-size: 0.75em !important;
    color: var(--nx-ink-dim) !important;
    font-weight: 400 !important;
}

.nx-card-price del,
.nx-card-price del .amount {
    color: var(--nx-ink-low) !important;
    text-decoration: line-through !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

.nx-card-price ins,
.nx-card-price ins .amount {
    color: var(--nx-accent) !important;
    background: transparent !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

.nx-card-price .amount {
    color: var(--nx-accent) !important;
    font-weight: 700 !important;
}

.nx-card-price .screen-reader-text {
    display: none;
}

/* Add to cart button */
.nx-card-cart-btn {
    cursor: pointer;
    position: absolute !important;
    bottom: 14px !important;
    right: 14px !important;
    width: 48px !important;
    height: 48px !important;
    background: var(--nx-ink) !important;
    color: var(--nx-bg) !important;
    border: none !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    transition: all 0.3s !important;
    z-index: 10 !important;
    font-size: 0 !important;
    padding: 0 !important;
}

.nx-card-cart-btn:hover {
    background: var(--nx-accent) !important;
    transform: scale(1.1) !important;
    box-shadow: rgba(0, 240, 255, 0.4) 0px 8px 24px !important;
}

.nx-card-cart-btn svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

/* Footer area */
.nx-card-footer {
    padding: 0 4px;
    margin-top: auto;
}

/* Category tag */
.nx-card-cat {
    display: inline-flex !important;
    align-items: center !important;
    margin-top: 10px !important;
}

.nx-card-cat a {
    transition: 0.3s;
    display: inline-block !important;
    padding: 6px 14px !important;
    background: rgba(0, 240, 255, 0.1) !important;
    border: 1px solid rgba(0, 240, 255, 0.3) !important;
    border-radius: 100px !important;
    font-family: var(--nx-font-mono) !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    color: var(--nx-accent) !important;
    text-decoration: none !important;
}

.nx-card-cat a:hover {
    background: var(--nx-accent) !important;
    color: var(--nx-bg) !important;
}

/* nx-card fixes */
.nx-card-inner {
    overflow: hidden;

}

.nx-card-content {
    padding-bottom: 70px;
}

.nx-card-line {
    height: 1px;
    background: var(--nx-line, rgba(255,255,255,0.08));
    margin: 10px 0;
}

@media (max-width: 768px) {

    .nx-home-products {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important; 
        gap: 12px !important;
    }

    .nx-home-products > * {
        width: calc(50% - 12px) !important;
        max-width: 180px;
        flex: 0 0 auto !important;
    }
}
@media (max-width: 768px) {

    .woocommerce div.product {
        display: flex;
        flex-direction: column;
        gap: 14px;
        padding: 10px;
    }

    .woocommerce div.product div.images {
        width: 100% !important;
        margin: 0 !important;
    }

    .summary.entry-summary {
        width: 100% !important;
        padding: 0 !important;
    }

    .summary.entry-summary h1 {
        font-size: 22px !important;
        line-height: 1.2;
        margin-bottom: 8px !important;
    }

    .summary.entry-summary .price {
        font-size: 20px !important;
        margin-bottom: 10px !important;
    }
    .summary.entry-summary .woocommerce-product-details__short-description {
        font-size: 14px;
        line-height: 1.5;
        padding: 12px !important;
        border-radius: 12px;
    }

    .variations_form {
        margin-top: 10px;
    }

    .variations_form .variable-items-wrapper {
        gap: 8px;
    }

    .variable-item {
        padding: 6px 10px !important;
        font-size: 12px !important;
    }

    .single_add_to_cart_button {
        width: 100% !important;
        border-radius: 12px !important;
        padding: 14px !important;
        font-size: 16px !important;
    }
}


/* ==========================
   PRODUCTOS RELACIONADOS
========================== */

/* Desktop grande: 4 columnas si hay suficiente espacio */
@media (min-width: 1101px) {
    .related.products ul.products {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 16px !important;
    }
}

/* Desktop medio (768px - 1100px): 3 columnas para related */
@media (min-width: 768px) and (max-width: 1100px) {
    .related.products ul.products {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 14px !important;
    }
}

/* Mobile: 2 columnas para related */
@media (max-width: 767px) {
    .related.products ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
}

/* ============================
   PRODUCTOS RELACIONADOS - TARJETAS MAS GRANDES EN DESKTOP
   ============================ */

@media (min-width: 1101px) {
    body.single-product section.related.products,
    body.single-product section.up-sells.products {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 40px !important;
    }
    body.single-product section.related.products ul.products {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 20px !important;
        width: 100% !important;
    }
}

@media (min-width: 1400px) {
    body.single-product section.related.products,
    body.single-product section.up-sells.products {
        padding: 0 60px !important;
    }
    body.single-product section.related.products ul.products {
        gap: 24px !important;
    }
}

@media (min-width: 1101px) {
  body.single-product section.related.products ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

body.single-product #nx-content .nasus-acc-wrap {
  grid-column: 1 / span 2 !important;
  width: 100% !important;
  max-width: 100% !important;
}


/* ============================================
   ENVIO INSTA - LAYOUT / CENTRADO (nei-*)
   ============================================ */
:root{
  --nei-bg:#07070c; --nei-bg-2:#0d0d16;
  --nei-line:#22222f; --nei-line-soft:#1a1a26;
  --nei-cyan:#00f0ff; --nei-purple:#b983ff; --nei-yellow:#ffd166;
  --nei-red:#ff3366; --nei-green:#5ee6a0;
  --nei-text:#e8e8f0; --nei-text-soft:#cfcfe0; --nei-muted:#666;
  --nei-w:720px;
  --nei-mono:"JetBrains Mono",ui-monospace,monospace;
  --nei-font:"Space Grotesk",system-ui,sans-serif;
  --nei-display:Anton,Impact,sans-serif;
}

/* centra la columna del tema solo en la pagina de Envio Insta */
body.page-id-163698 .nx-page-content,
.nx-page-content:has(.nei-page-wrap){
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
}

.nei-page-wrap,
.nei-page-wrap *{box-sizing:border-box;}
.nei-page-wrap{width:100%;max-width:var(--nei-w);margin:0 auto;padding:0 16px;}

.nei-page-intro{text-align:center;padding:24px 0 4px;}
.nei-page-title{font-family:var(--nei-display);font-size:clamp(30px,7vw,44px);letter-spacing:2px;margin:0;color:#fff;text-transform:uppercase;line-height:1;}
.nei-page-sub{color:var(--nei-purple);font-size:clamp(12px,2.8vw,14px);font-family:var(--nei-mono);margin:10px auto 0;max-width:54ch;line-height:1.6;}

.nei-box{background:var(--nei-bg);border:1px solid rgba(0,240,255,.25);border-radius:4px;padding:clamp(18px,4vw,26px);color:var(--nei-text);font-family:var(--nei-font);width:100%;max-width:100%;margin:24px auto;box-shadow:0 0 40px rgba(0,240,255,.08);position:relative;}
.nei-box::before{content:"// ENVIO INSTA";position:absolute;top:-9px;left:20px;background:var(--nei-bg);padding:0 8px;font-family:var(--nei-mono);font-size:10px;letter-spacing:2px;color:var(--nei-cyan);font-weight:700;}

.nei-header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;}
.nei-box h3{font-family:var(--nei-display);font-size:clamp(22px,5.5vw,30px);letter-spacing:1px;margin:0;color:#fff;text-transform:uppercase;line-height:1.05;}
.nei-tag{flex:0 0 auto;background:var(--nei-yellow);color:var(--nei-bg);font-weight:700;font-size:10px;padding:5px 11px;border-radius:2px;letter-spacing:1px;font-family:var(--nei-mono);white-space:nowrap;}

.nei-notice{border-radius:2px;padding:13px 15px;margin:12px 0;font-size:clamp(13px,2.6vw,14px);line-height:1.6;}
.nei-notice-warn{background:rgba(255,209,102,.08);border-left:3px solid var(--nei-yellow);}
.nei-notice-info{background:rgba(0,240,255,.06);border-left:3px solid var(--nei-cyan);}
.nei-notice-danger{background:rgba(255,51,102,.08);border-left:3px solid var(--nei-red);}

.nei-search-wrap{display:flex;align-items:center;gap:10px;margin:14px 0;flex-wrap:wrap;}
.nei-search{flex:1 1 220px;min-width:0;background:var(--nei-bg-2);border:1px solid var(--nei-line);border-radius:2px;padding:12px 14px;color:#fff;font-size:15px;font-family:var(--nei-mono);}
.nei-search:focus{outline:none;border-color:var(--nei-cyan);box-shadow:0 0 0 2px rgba(0,240,255,.15);}
.nei-search::placeholder{color:var(--nei-muted);}
.nei-search-count{font-family:var(--nei-mono);font-size:11px;color:var(--nei-purple);letter-spacing:1px;white-space:nowrap;}

.nei-form{margin-top:18px;}
.nei-form label{display:block;font-size:11px;margin:14px 0 6px;color:var(--nei-purple);font-weight:700;letter-spacing:1px;text-transform:uppercase;font-family:var(--nei-mono);}
.nei-form input[type="text"],
.nei-form input[type="email"],
.nei-form input[type="tel"],
.nei-form input[type="search"]{display:block;width:100%;max-width:100%;background:var(--nei-bg-2);border:1px solid var(--nei-line);border-radius:2px;padding:13px;color:#fff;font-size:15px;font-family:var(--nei-mono);}
.nei-form input[type="text"]:focus,
.nei-form input[type="email"]:focus,
.nei-form input[type="tel"]:focus,
.nei-form input[type="search"]:focus{outline:none;border-color:var(--nei-cyan);box-shadow:0 0 0 2px rgba(0,240,255,.15);}
.nei-form input::placeholder{color:var(--nei-muted);}
.nei-form small{display:block;margin-top:7px;color:var(--nei-muted);font-size:11px;font-family:var(--nei-mono);line-height:1.6;}
.nei-check{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--nei-text-soft) !important;font-weight:400 !important;letter-spacing:0 !important;text-transform:none !important;font-family:var(--nei-font) !important;}
.nei-check input{margin-top:3px;accent-color:var(--nei-cyan);}

.nei-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--nei-cyan);color:var(--nei-bg);border:0;border-radius:2px;padding:13px 24px;font-weight:800;font-size:13px;letter-spacing:1px;line-height:1;cursor:pointer;text-transform:uppercase;margin-top:16px;text-decoration:none;font-family:var(--nei-font);transition:background .15s,color .15s,transform .15s;}
.nei-btn:hover{background:var(--nei-purple);color:#fff;transform:translateY(-1px);}
.nei-btn:focus-visible{outline:2px solid var(--nei-purple);outline-offset:2px;}
.nei-msg{margin-top:11px;font-size:13px;font-family:var(--nei-mono);line-height:1.5;}
.nei-msg.ok{color:var(--nei-green);}
.nei-msg.err{color:var(--nei-red);}

.nei-list{margin-top:22px;border-top:1px solid var(--nei-line-soft);padding-top:16px;}
.nei-empty{color:var(--nei-muted);font-size:14px;font-family:var(--nei-mono);margin:0;}
.nei-item{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:var(--nei-bg-2);border:1px solid var(--nei-line-soft);border-radius:2px;padding:12px 14px;margin-bottom:8px;}
.nei-item:hover{border-color:#2a2a3a;}
.nei-item > *{min-width:0;}
.nei-riot{font-family:var(--nei-mono);color:var(--nei-cyan);font-weight:700;font-size:15px;overflow-wrap:anywhere;}
.nei-item small{display:block;color:var(--nei-muted);font-size:11px;margin-top:3px;font-family:var(--nei-mono);}
.nei-badge{display:inline-block;font-size:9px;padding:2px 7px;border-radius:2px;font-weight:700;font-family:var(--nei-mono);letter-spacing:.5px;vertical-align:middle;}
.nei-pub{background:var(--nei-green);color:var(--nei-bg);}
.nei-solis-ok{background:var(--nei-purple);color:var(--nei-bg);}
.nei-mini{background:transparent;border:1px solid var(--nei-line);color:#aaa;border-radius:2px;padding:6px 12px;font-size:11px;cursor:pointer;margin:2px 0 2px 4px;font-family:var(--nei-mono);text-transform:uppercase;letter-spacing:.5px;transition:border-color .15s,color .15s;}
.nei-mini:hover{border-color:var(--nei-cyan);color:var(--nei-cyan);}
.nei-del:hover{border-color:var(--nei-red);color:var(--nei-red);}

.nei-product-notice{background:rgba(94,230,160,.08);border:1px solid rgba(94,230,160,.4);border-radius:2px;padding:12px 15px;margin:14px 0;font-size:14px;line-height:1.6;color:#d8ffe8;font-family:var(--nei-font);}
.nei-login-required .nei-btn{margin-top:10px;}

.nei-hr{border:0;border-top:1px solid var(--nei-line-soft);margin:22px 0;}
.nei-access-title{font-size:13px;color:var(--nei-text-soft);margin:0 0 10px;line-height:1.6;}
.nei-access-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.nei-access-row input{flex:1 1 220px;min-width:0;background:var(--nei-bg-2);border:1px solid var(--nei-line);border-radius:2px;padding:12px;color:#fff;font-size:14px;font-family:var(--nei-mono);}
.nei-access-row input:focus{outline:none;border-color:var(--nei-purple);box-shadow:0 0 0 2px rgba(185,131,255,.15);}
.nei-btn-alt{background:var(--nei-purple);white-space:nowrap;margin-top:0 !important;}
.nei-btn-alt:hover{background:var(--nei-cyan);color:var(--nei-bg);}

.nei-pin-box{margin-top:12px;padding:14px;background:var(--nei-bg-2);border:1px solid var(--nei-line);border-radius:4px;}
.nei-pin-box label{display:block;font-size:11px;color:var(--nei-purple);font-weight:700;letter-spacing:1px;text-transform:uppercase;font-family:var(--nei-mono);margin-bottom:6px;}
.nei-pin-box input{width:100%;background:var(--nei-bg);border:1px solid var(--nei-line);border-radius:2px;padding:12px;color:var(--nei-cyan);font-size:20px;letter-spacing:6px;text-align:center;font-family:var(--nei-mono);}
.nei-pin-box input:focus{outline:none;border-color:var(--nei-cyan);}

@media (max-width:640px){
  .nei-page-wrap{padding:0 12px;}
  .nei-page-intro{padding:18px 0 2px;}
  .nei-box{padding:18px 16px;margin:18px auto;}
  .nei-box::before{left:14px;}
  .nei-header{flex-direction:column;align-items:flex-start;gap:8px;}
  .nei-form .nei-btn{width:100%;}
  .nei-access-row{flex-direction:column;align-items:stretch;}
  .nei-access-row input,
  .nei-access-row .nei-btn{flex:0 0 auto;width:100%;}
  .nei-search-wrap{flex-direction:column;align-items:stretch;}
  .nei-search{flex:0 0 auto;width:100%;}
}

/* =========================
   NAV BAR RESPONSIVE
   ========================= */
/* 1301px - 1400px: se comprime un poco el menu */
@media (min-width: 1301px) and (max-width: 1400px) {
  .nx-header-inner { gap: 14px; padding: 18px 20px; }
  .nx-nav-list > li > a { padding: 10px 10px; letter-spacing: .5px; }
}
/* 1201px - 1300px: se comprime mas para que no se monte sobre el logo ni los iconos */
@media (min-width: 1201px) and (max-width: 1300px) {
  .nx-header-inner { gap: 12px; padding: 18px 16px; }
  .nx-nav-list > li > a { padding: 10px 7px; font-size: 12px; letter-spacing: .2px; }
}
/* Hasta 1200px: menu hamburguesa (drawer) en vez del menu horizontal */
@media (max-width: 1200px) {
  .nx-nav-main { display: none; }
  .nx-menu-toggle { display: flex; }
}
/* El drawer nunca mas ancho que la pantalla */
.nx-mobile-menu { max-width: min(360px, 90vw); }