

/* Botón internacional igual al botón normal de Agregar al carrito */
#internacionales .producto > button,
#internacionales .producto > button:not(:disabled),
#internacionales [data-international-cart] {
    min-height: 42px !important;
    width: 100% !important;
    padding: 10px 14px !important;
    background: #020914 !important;
    color: #ffffff !important;
    border: 1px solid #00aaff !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    font-family: Arial, sans-serif !important;
    font-size: 0.75rem !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
}
/* AJUSTE FINAL 3.4.9: reproductor rojo/negro, catálogo y campana. */
.radio-controls .control-btn,
.radio-controls .control-btn:hover,
.radio-controls .control-btn:focus,
.radio-controls .control-btn:active {
  background: #000 !important;
  color: #ff0000 !important;
  -webkit-text-fill-color: #ff0000 !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
}

#play-btn,
#play-btn:hover,
#play-btn:focus,
#play-btn:active {
  background: #ff0000 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-color: #000 !important;
}

.station-select,
.station-select:hover,
.station-select:focus {
  background: #000 !important;
  color: #fff !important;
  border-color: #ff0000 !important;
}

.volume-control,
.volume-control > span,
.volume-control svg {
  color: #ff0000 !important;
  fill: #ff0000 !important;
}

.volume-control input[type="range"] { accent-color: #ff0000 !important; }
#ms-news-button {
  background: transparent !important;
  background-color: transparent !important;
  border-width: .5px !important;
  box-shadow: none !important;
}

.producto > button,
.producto > button:hover,
.producto > button:focus,
.ms-course-buy,
.ms-course-buy:hover,
.ms-course-buy:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  padding: 8px 18px !important;
  background: #010b18 !important;
  background-color: #010b18 !important;
  color: #fff !important;
  border: 1px solid #00aaff !important;
  border-radius: 999px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

.producto > button svg,
.producto > button .cart-icon { display: none !important; }

.producto .precio,
.ms-course-card .precio,
#ms-balance,
.ms-balance,
#ms-account-balance,
#ms-mobile-balance-v27,
.balance-amount {
  color: #00ff00 !important;
  -webkit-text-fill-color: #00ff00 !important;
  font-weight: 700 !important;
}

@media (max-width: 768px) {
  .volume-control { margin-right: 7px !important; }
  #ms-header-actions,
  .ms-header-actions { margin-left: 7px !important; }
}

#internacionales .producto > button:hover,
#internacionales [data-international-cart]:hover {
    background: #000000 !important;
    color: #ffffff !important;
    border-color: #00aaff !important;
}

/* Apariencia de agotado sin dejar el botón opaco */
#internacionales .producto.out-stock > button:disabled,
#internacionales [data-international-cart]:disabled {
    background: #020914 !important;
    color: #ffffff !important;
    border-color: #00aaff !important;
    opacity: 1 !important;
    filter: none !important;
}

/* ESTRELLAS DEL PANEL: fondo negro y estrella naranja fuerte */
#ms-admin button.ms-pin-tab,
#ms-admin button.ms-pin-tab:hover,
#ms-admin button.ms-pin-tab:focus,
#ms-admin button.ms-pin-tab:active,
#ms-admin button[data-pin-tab] {
    background: #000000 !important;
    background-color: #000000 !important;
    background-image: none !important;
    color: #ff6600 !important;
    -webkit-text-fill-color: #00ff00 !important;
    border-color: #00aaff !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    font-size: 18px !important;
}


/* RESUMEN: fondo negro, números verdes y sin hover */
#ms-admin .ms-metrics .ms-metric,
#ms-admin .ms-metrics .ms-metric:hover,
#ms-admin .ms-metrics .ms-metric:focus,
#ms-admin .ms-metrics .ms-metric:active,
#ms-admin .ms-metrics .ms-metric-highlight,
#ms-admin .ms-metrics .ms-month-credit {
    background: #000000 !important;
    background-color: #000000 !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
}

/* Números del resumen en verde fuerte */
#ms-admin .ms-metrics .ms-metric > strong,
#ms-admin .ms-metrics .ms-metric:hover > strong,
#ms-admin .ms-metrics .ms-metric-highlight > strong {
    color: #00ff00 !important;
    -webkit-text-fill-color: #00ff00  !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}

/* Mantener textos secundarios blancos */
#ms-admin .ms-metrics .ms-metric > span,
#ms-admin .ms-metrics .ms-metric > small {
    color: #ffffff !important;
}

/* SEIS BOTONES SUPERIORES DEL PANEL */
#ms-admin .ms-admin-mainnav button,
#ms-admin .ms-admin-mainnav button:nth-child(n),
#ms-admin .ms-admin-mainnav button:hover,
#ms-admin .ms-admin-mainnav button:focus,
#ms-admin .ms-admin-mainnav button:active {
    background: hsl(0, 0%, 0%) !important;
    background-color: hsl(0, 0%, 0%) !important;
    background-image: none !important;
    color: #ffffff !important;
    border: 1px solid #ff6600 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transform: none !important;
    filter: none !important;
}













/* =====================================================
   STOCK BAJO / ALTO — DISEÑO ORGANIZADO
===================================================== */

#ms-admin .ms-stock-columns {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
  width: 100% !important;
}

/* Contenedores principales */
#ms-admin .ms-stock-columns .ms-admin-section-card {
  width: 100% !important;
  padding: 16px !important;
  background: #000 !important;
  background-image: none !important;
  border: 1px solid #00aaff !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

/* Rejilla ordenada */
#ms-admin .ms-stock-seven {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
}

/* Diseño general de las tarjetas */
#ms-admin .ms-stock-tile,
#ms-admin .ms-stock-tile:hover,
#ms-admin .ms-stock-tile:focus,
#ms-admin .ms-stock-tile:active {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 92px !important;
  padding: 10px 7px !important;
  background: #000 !important;
  background-color: #000 !important;
  background-image: none !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  filter: none !important;
  cursor: default !important;
}

/* Nombre del servicio */
#ms-admin .ms-stock-tile strong {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-align: center !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
}

/* Estado del inventario */
#ms-admin .ms-stock-tile span {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  white-space: normal !important;
}

/* AGOTADOS: fondo negro, letras y borde rojo fuerte */
#ms-admin .ms-stock-tile.empty,
#ms-admin .ms-stock-tile.empty:hover,
#ms-admin .ms-stock-tile.empty:focus,
#ms-admin .ms-stock-tile.empty:active {
  background: #000 !important;
  border: 1px solid #ff0000 !important;
  color: #ff0000 !important;
}

#ms-admin .ms-stock-tile.empty strong,
#ms-admin .ms-stock-tile.empty span {
  color: #ff0000 !important;
  -webkit-text-fill-color: #ff0000 !important;
}

/* DISPONIBLES: fondo negro, letras y borde verde fuerte */
#ms-admin .ms-stock-tile.ok,
#ms-admin .ms-stock-tile.ok:hover,
#ms-admin .ms-stock-tile.ok:focus,
#ms-admin .ms-stock-tile.ok:active {
  background: #000 !important;
  border: 1px solid #00ff00 !important;
  color: #ffffff !important;
}

#ms-admin .ms-stock-tile.ok strong,
#ms-admin .ms-stock-tile.ok span {
  color: #00ff00 !important;
  -webkit-text-fill-color: #00ff00 !important;
}

/* Sin efectos hover */
#ms-admin .ms-stock-tile:hover {
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

/* Tabletas */
@media (max-width: 1000px) {
  #ms-admin .ms-stock-seven {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* Celulares */
@media (max-width: 600px) {
  #ms-admin .ms-stock-columns .ms-admin-section-card {
    padding: 9px !important;
  }

  #ms-admin .ms-stock-seven {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  #ms-admin .ms-stock-tile {
    min-height: 86px !important;
    padding: 8px 5px !important;
  }

  #ms-admin .ms-stock-tile strong,
  #ms-admin .ms-stock-tile span {
    font-size: 11px !important;
  }
}


















































/* =====================================================
   REPRODUCTOR — DISEÑO VERDE FUERTE
===================================================== */

/* CONTENEDOR GENERAL */
.music-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 5px 8px !important;
  background: #000 !important;
  background-image: none !important;
  border: 1px solid #00ff00 !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

/* CONTENEDOR DE BOTONES */
.radio-controls {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
}

/* BOTONES ANTERIOR Y SIGUIENTE */
.radio-controls .control-btn,
.radio-controls .control-btn:hover,
.radio-controls .control-btn:focus,
.radio-controls .control-btn:active {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  background: #000 !important;
  background-color: #000 !important;
  background-image: none !important;
  color: #00ff00 !important;
  -webkit-text-fill-color: #00ff00 !important;
  border: 1px solid #00ff00 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}

/* BOTÓN PRINCIPAL DE REPRODUCCIÓN */
#play-btn,
#play-btn:hover,
#play-btn:focus,
#play-btn:active {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
  background: #00ff00 !important;
  background-color: #00ff00 !important;
  background-image: none !important;
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
  border: 2px solid #00ff00 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

/* ICONOS DE LOS BOTONES */
.radio-controls .control-btn svg,
.radio-controls .control-btn span {
  color: inherit !important;
  fill: currentColor !important;
}

/* =====================================================
   LISTA DE EMISORAS
===================================================== */

.station-select-label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
}

/* SELECTOR CERRADO */
.station-select,
.station-select:hover,
.station-select:focus,
.station-select:active {
  width: 260px !important;
  max-width: 260px !important;
  height: 38px !important;
  padding: 0 38px 0 13px !important;
  background: #000 !important;
  background-color: #000 !important;
  color: #fff !important;
  border: 1px solid #00ff00 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  outline: none !important;
  font-family: Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 38px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

/* LISTA DESPLEGABLE DE EMISORAS */
.station-select option {
  min-height: 34px !important;
  padding: 10px 12px !important;
  background: #000 !important;
  background-color: #000 !important;
  color: #00ff00 !important;
  font-family: Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

/* EMISORA SELECCIONADA */
.station-select option:checked {
  background: #003d20 !important;
  background-color: #003d20 !important;
  color: #fff !important;
}

/* =====================================================
   ESTADO Y NOMBRE DE LA EMISORA
===================================================== */

.player-status,
.radio-status,
.status-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  padding: 3px 9px !important;
  background: #000 !important;
  color: #00ff00 !important;
  border: 1px solid #00ff00 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

.live-dot {
  width: 7px !important;
  height: 7px !important;
  background: #00ff00 !important;
  border-radius: 50% !important;
  box-shadow: 0 0 6px #00ff00 !important;
}

#station-name {
  color: #fff !important;
  font-family: Arial, sans-serif !important;
  font-weight: 400 !important;
  text-shadow: none !important;
}

/* =====================================================
   CONTROL DE VOLUMEN
===================================================== */

.volume-control {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 82px !important;
  color: #00ff00 !important;
}

/* ICONO DE VOLUMEN */
.volume-control svg,
.volume-control span {
  color: #00ff00 !important;
  fill: #00ff00 !important;
}

/* BARRA GENERAL */
.volume-control input[type="range"] {
  width: 62px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  accent-color: #00ff00 !important;
  cursor: pointer !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

/* BARRA EN CHROME, EDGE Y BRAVE */
.volume-control input[type="range"]::-webkit-slider-runnable-track {
  width: 100% !important;
  height: 5px !important;
  background: #003d20 !important;
  border: 1px solid #00ff00 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

/* BOTÓN DESLIZABLE */
.volume-control input[type="range"]::-webkit-slider-thumb {
  width: 15px !important;
  height: 15px !important;
  margin-top: -6px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background: #00ff00 !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

/* FIREFOX */
.volume-control input[type="range"]::-moz-range-track {
  height: 5px !important;
  background: #003d20 !important;
  border: 1px solid #00ff00 !important;
  border-radius: 999px !important;
}

.volume-control input[type="range"]::-moz-range-progress {
  height: 5px !important;
  background: #00ff00 !important;
  border-radius: 999px !important;
}

.volume-control input[type="range"]::-moz-range-thumb {
  width: 13px !important;
  height: 13px !important;
  background: #00ff00 !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

/* TEXTO INFERIOR */
.music-bar + small,
.radio-helper,
.radio-hint {
  color: #ffffff !important;
  font-family: Arial, sans-serif !important;
  font-weight: 400 !important;
  text-shadow: none !important;
}

/* =====================================================
   ADAPTACIÓN PARA CELULARES
===================================================== */

@media (max-width: 760px) {
  .music-bar {
    width: 100% !important;
    max-width: 310px !important;
    gap: 5px !important;
    padding: 4px 6px !important;
  }

  .radio-controls {
    gap: 4px !important;
  }

  .radio-controls .control-btn {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
  }

  #play-btn {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
  }

  .station-select {
    width: 125px !important;
    max-width: 125px !important;
    height: 34px !important;
    padding-left: 9px !important;
    padding-right: 25px !important;
    font-size: 12px !important;
  }

  .volume-control {
    min-width: 54px !important;
    gap: 3px !important;
  }

  .volume-control input[type="range"] {
    width: 42px !important;
  }
}



/* Reproductor azul compacto: pegar al final de public/final-348.css */
.music-bar,
.music-bar:hover,
.music-bar:focus-within {
  width: auto !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.radio-controls {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-width: 0 !important;
}

.radio-controls .control-btn,
.radio-controls .control-btn:hover,
.radio-controls .control-btn:focus,
.radio-controls .control-btn:active {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  background: #03182f !important;
  background-image: none !important;
  color: #00aaff !important;
  -webkit-text-fill-color: #00aaff !important;
  border: 1px solid #00aaff !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

#play-btn,
#play-btn:hover,
#play-btn:focus,
#play-btn:active {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  background: #00aaff !important;
  background-color: #00aaff !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: 1px solid #00aaff !important;
  box-shadow: none !important;
}

.station-select-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

.station-select,
.station-select:hover,
.station-select:focus,
.station-select:active {
  width: 260px !important;
  max-width: 260px !important;
  height: 35px !important;
  min-width: 0 !important;
  padding: 0 34px 0 12px !important;
  background: #020c19 !important;
  background-color: #020c19 !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid #00aaff !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  outline: none !important;
  font-family: Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

.station-select option {
  background: #020c19 !important;
  color: #fff !important;
  font-family: Arial, sans-serif !important;
  font-weight: 400 !important;
}

.station-select option:checked {
  background: #00aaff !important;
  color: #fff !important;
}

.volume-control {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-width: 82px !important;
  color: #00aaff !important;
}

.volume-control > span,
.volume-control svg {
  color: #00aaff !important;
  fill: #00aaff !important;
}

.volume-control input[type="range"] {
  width: 62px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  accent-color: #00aaff !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
}

.volume-control input[type="range"]::-webkit-slider-runnable-track {
  height: 5px !important;
  background: #00aaff !important;
  border: 1px solid #00aaff !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

.volume-control input[type="range"]::-webkit-slider-thumb {
  width: 14px !important;
  height: 14px !important;
  margin-top: -5px !important;
  background: #00aaff !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.volume-control input[type="range"]::-moz-range-track {
  height: 5px !important;
  background: #00aaff !important;
  border: 1px solid #00aaff !important;
  border-radius: 999px !important;
}

.volume-control input[type="range"]::-moz-range-progress {
  height: 5px !important;
  background: #00aaff !important;
  border-radius: 999px !important;
}

.volume-control input[type="range"]::-moz-range-thumb {
  width: 12px !important;
  height: 12px !important;
  background: #00aaff !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
}

.live-badge {
  background: #07111d !important;
  color: #ffffff !important;
  border: 1px solid #00aaff !important;
  box-shadow: none !important;
}

.live-dot {
  background: #00aaff !important;
  box-shadow: none !important;
}

@media (max-width: 768px) {
  .music-bar {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .radio-controls {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 34px 34px minmax(120px, 1fr) 48px !important;
    gap: 5px !important;
  }

  #prev-btn {
    display: none !important;
  }

  #play-btn,
  #next-btn {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
  }

  .station-select {
    width: 100% !important;
    max-width: none !important;
    height: 34px !important;
    padding-left: 9px !important;
    padding-right: 24px !important;
    font-size: 12px !important;
  }

  .volume-control {
    width: 48px !important;
    min-width: 0 !important;
    gap: 2px !important;
    overflow: hidden !important;
  }

  .volume-control > span {
    font-size: 11px !important;
  }

  .volume-control input[type="range"] {
    width: 34px !important;
    min-width: 34px !important;
  }
}

/* CAPA FINAL: debe permanecer al final del archivo. */
.radio-controls .control-btn,
.radio-controls .control-btn:hover,
.radio-controls .control-btn:focus,
.radio-controls .control-btn:active {
  background: #000 !important;
  background-color: #000 !important;
  color: #ff0000 !important;
  -webkit-text-fill-color: #ff0000 !important;
  border-color: #000 !important;
  box-shadow: none !important;
}

#play-btn,
#play-btn:hover,
#play-btn:focus,
#play-btn:active {
  background: #ff0000 !important;
  background-color: #ff0000 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-color: #000 !important;
}

.station-select,
.station-select:hover,
.station-select:focus,
.station-select:active {
  background: #000 !important;
  background-color: #000 !important;
  color: #fff !important;
  border-color: #ff0000 !important;
}

.station-select option { background: #000 !important; color: #fff !important; }
.volume-control,
.volume-control > span,
.volume-control svg { color: #ff0000 !important; fill: #ff0000 !important; }
.volume-control input[type="range"] { accent-color: #ff0000 !important; }
.volume-control input[type="range"]::-webkit-slider-runnable-track { background: #ff0000 !important; border-color: #ff0000 !important; }
.volume-control input[type="range"]::-webkit-slider-thumb { background: #ff0000 !important; border-color: #000 !important; }
.volume-control input[type="range"]::-moz-range-track { background: #ff0000 !important; border-color: #ff0000 !important; }
.volume-control input[type="range"]::-moz-range-progress,
.volume-control input[type="range"]::-moz-range-thumb { background: #ff0000 !important; }
.live-dot { background: #ff0000 !important; }

#ms-news-button {
  background: transparent !important;
  background-color: transparent !important;
  border-width: .5px !important;
  box-shadow: none !important;
}

.producto > button,
.producto > button:hover,
.producto > button:focus,
.ms-course-buy,
.ms-course-buy:hover,
.ms-course-buy:focus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  padding: 8px 18px !important;
  background: #010b18 !important;
  background-color: #010b18 !important;
  color: #fff !important;
  border: 1px solid #00aaff !important;
  border-radius: 999px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

.producto > button svg,
.producto > button .cart-icon { display: none !important; }

.producto .precio,
.ms-course-card .precio,
#ms-balance,
.ms-balance,
#ms-account-balance,
#ms-mobile-balance-v27,
.balance-amount {
  color: #00ff00 !important;
  -webkit-text-fill-color: #00ff00 !important;
  font-weight: 700 !important;
}

@media (max-width: 768px) {
  .radio-controls {
    grid-template-columns: 34px 34px minmax(105px, 1fr) 42px !important;
    gap: 4px !important;
  }
  .volume-control { width: 42px !important; margin-right: 7px !important; }
  .volume-control input[type="range"] { width: 28px !important; min-width: 28px !important; }
  #ms-header-actions,
  .ms-header-actions { margin-left: 7px !important; }
}

















/* ================================================================
   CAPA DEFINITIVA 3.4.9 — PALETA INTENSA Y SIN DEPENDENCIA DE HOVER
   Esta sección debe permanecer al final de final-348.css.
================================================================ */

:root {
  --ms-final-red: #ff0000;
  --ms-final-green: #00ff00;
  --ms-final-blue: #00aaff;
  --ms-final-navy: #000814;
  --ms-final-black: #000000;
  --ms-final-white: #ffffff;
  --ms-final-orange: #ff6600;
}

/* Reproductor rojo sangre y negro. */
.radio-controls .control-btn,
.radio-controls .control-btn:hover,
.radio-controls .control-btn:focus,
.radio-controls .control-btn:active {
  background: var(--ms-final-black) !important;
  background-color: var(--ms-final-black) !important;
  background-image: none !important;
  color: var(--ms-final-red) !important;
  -webkit-text-fill-color: var(--ms-final-red) !important;
  border: 1px solid var(--ms-final-black) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

#play-btn,
#play-btn:hover,
#play-btn:focus,
#play-btn:active {
  background: var(--ms-final-red) !important;
  background-color: var(--ms-final-red) !important;
  background-image: none !important;
  color: var(--ms-final-white) !important;
  -webkit-text-fill-color: var(--ms-final-white) !important;
  border: 1px solid var(--ms-final-black) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}

.station-select,
.station-select:hover,
.station-select:focus,
.station-select:active {
  background: var(--ms-final-black) !important;
  background-color: var(--ms-final-black) !important;
  background-image: none !important;
  color: var(--ms-final-white) !important;
  border: 1px solid var(--ms-final-red) !important;
  box-shadow: none !important;
  outline: none !important;
}

.station-select option,
.station-select option:checked {
  background: var(--ms-final-black) !important;
  color: var(--ms-final-white) !important;
}

.volume-control,
.volume-control > span,
.volume-control svg {
  color: var(--ms-final-red) !important;
  fill: var(--ms-final-red) !important;
}

.volume-control input[type="range"] {
  accent-color: var(--ms-final-red) !important;
}

.volume-control input[type="range"]::-webkit-slider-runnable-track,
.volume-control input[type="range"]::-moz-range-track {
  background: var(--ms-final-red) !important;
  border: 1px solid var(--ms-final-black) !important;
}

.volume-control input[type="range"]::-webkit-slider-thumb,
.volume-control input[type="range"]::-moz-range-thumb,
.volume-control input[type="range"]::-moz-range-progress {
  background: var(--ms-final-red) !important;
  border-color: var(--ms-final-black) !important;
  box-shadow: none !important;
}

.live-dot {
  background: var(--ms-final-red) !important;
  box-shadow: 0 0 7px var(--ms-final-red) !important;
}

/* Botones de compra: azul muy oscuro, borde verde y sin iconos. */
.producto > button,
.producto > button:not(:disabled),
.producto > button:disabled,
.producto > button:hover,
.producto > button:focus,
.producto > button:active,
#internacionales [data-international-cart],
#internacionales [data-international-cart]:hover,
#internacionales [data-international-cart]:focus,
#internacionales [data-international-cart]:active,
.ms-course-buy,
.ms-course-buy:hover,
.ms-course-buy:focus,
.ms-course-buy:active {
  background: var(--ms-final-navy) !important;
  background-color: var(--ms-final-navy) !important;
  background-image: none !important;
  color: var(--ms-final-white) !important;
  -webkit-text-fill-color: var(--ms-final-white) !important;
  border: 1px solid var(--ms-final-green) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  transform: none !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}

.producto > button::before,
.producto > button::after,
#internacionales [data-international-cart]::before,
#internacionales [data-international-cart]::after,
.ms-course-buy::before,
.ms-course-buy::after,
.producto > button svg,
.producto > button .cart-icon,
#internacionales [data-international-cart] svg,
#internacionales [data-international-cart] .cart-icon,
.ms-course-buy svg,
.ms-course-buy .cart-icon {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  animation: none !important;
}

/* Precios y saldos con verde puro. */
.producto .precio,
.producto .precio small,
.ms-course-card .precio,
#ms-balance,
.ms-balance,
#ms-account-balance,
#ms-mobile-balance,
#ms-mobile-balance-v27,
.balance-amount,
.ms-wallet-card strong {
  color: var(--ms-final-green) !important;
  -webkit-text-fill-color: var(--ms-final-green) !important;
  text-shadow: none !important;
}

/* Estados y puntos de inventario. */
.ms-stock.available,
.ms-stock:not(.out),
.stock-pill.ok,
.stock-option-ok,
.ms-active {
  color: var(--ms-final-green) !important;
  -webkit-text-fill-color: var(--ms-final-green) !important;
  background-color: transparent !important;
  text-shadow: none !important;
}

.ms-stock.out,
.stock-pill.empty,
.stock-option-empty,
.ms-expired {
  color: var(--ms-final-red) !important;
  -webkit-text-fill-color: var(--ms-final-red) !important;
  background-color: transparent !important;
  text-shadow: none !important;
}

.ms-stock.available::before,
.ms-stock:not(.out)::before,
.ms-service-status-dot.available,
.presence-dot.online {
  display: inline-block !important;
  background: var(--ms-final-green) !important;
  color: var(--ms-final-green) !important;
  box-shadow: 0 0 8px var(--ms-final-green) !important;
}

.ms-stock.out::before,
.ms-service-status-dot.out,
.presence-dot.offline {
  display: inline-block !important;
  background: var(--ms-final-red) !important;
  color: var(--ms-final-red) !important;
  box-shadow: 0 0 8px var(--ms-final-red) !important;
}

/* Preguntas frecuentes: azul muy oscuro y bordes sólidos. */
body:has(#faq.active),
#faq,
#faq .ms-public-faq {
  background: var(--ms-final-navy) !important;
  background-color: var(--ms-final-navy) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#faq details,
#faq details:hover,
#faq details:focus-within {
  background: var(--ms-final-black) !important;
  background-color: var(--ms-final-black) !important;
  background-image: none !important;
  border: 1px solid var(--ms-final-blue) !important;
  border-style: solid !important;
  box-shadow: none !important;
}

#faq summary,
#faq summary:hover,
#faq summary:focus {
  color: var(--ms-final-green) !important;
  -webkit-text-fill-color: var(--ms-final-green) !important;
  border-style: solid !important;
}

#faq h2,
#faq details p {
  color: var(--ms-final-white) !important;
  -webkit-text-fill-color: var(--ms-final-white) !important;
}

/* Saldo del menú hamburguesa. */
#menu .ms-mobile-client-state,
.ms-mobile-client-state {
  background: var(--ms-final-black) !important;
  background-color: var(--ms-final-black) !important;
  color: var(--ms-final-white) !important;
  border: 2px solid var(--ms-final-green) !important;
  border-style: solid !important;
  box-shadow: none !important;
}

#menu .ms-mobile-client-state strong,
.ms-mobile-client-state strong {
  color: var(--ms-final-green) !important;
  -webkit-text-fill-color: var(--ms-final-green) !important;
  text-shadow: none !important;
}

/* Punto pequeño y palpitante del acceso a tickets. */
#menu [data-ticket-shortcut] .ms-ticket-count,
.ms-ticket-count {
  display: inline-block !important;
  width: 9px !important;
  min-width: 9px !important;
  height: 9px !important;
  min-height: 9px !important;
  margin-left: 8px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--ms-final-red) !important;
  color: transparent !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: 0 0 7px var(--ms-final-red) !important;
  animation: ms-final-ticket-pulse 1s ease-in-out infinite !important;
}

#menu [data-ticket-shortcut] .ms-ticket-count[hidden],
.ms-ticket-count[hidden] {
  display: inline-block !important;
}

@keyframes ms-final-ticket-pulse {
  0%, 100% { transform: scale(0.72); opacity: 0.45; }
  50% { transform: scale(1); opacity: 1; }
}

/* Acceso: colores fuertes en el estado normal y sin cambios al interactuar. */
#ms-auth .ms-auth-submit.login,
#ms-auth .ms-auth-submit.login:hover,
#ms-auth .ms-auth-submit.login:focus,
#ms-auth .ms-auth-submit.login:active,
#ms-auth button.login,
#ms-auth button.login:hover,
#ms-auth button.login:focus,
#ms-auth button.login:active {
  background: var(--ms-final-black) !important;
  background-color: var(--ms-final-black) !important;
  color: var(--ms-final-red) !important;
  -webkit-text-fill-color: var(--ms-final-red) !important;
  border: 2px solid var(--ms-final-red) !important;
  border-style: solid !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

#ms-auth .ms-auth-alternate.register,
#ms-auth .ms-auth-alternate.register:hover,
#ms-auth .ms-auth-alternate.register:focus,
#ms-auth .ms-auth-alternate.register:active,
#ms-auth button.register,
#ms-auth button.register:hover,
#ms-auth button.register:focus,
#ms-auth button.register:active {
  background: var(--ms-final-black) !important;
  background-color: var(--ms-final-black) !important;
  color: var(--ms-final-green) !important;
  -webkit-text-fill-color: var(--ms-final-green) !important;
  border: 2px solid var(--ms-final-green) !important;
  border-style: solid !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

@media (max-width: 768px) {
  .volume-control {
    margin-right: 9px !important;
  }
}

/* ===== CIERRE PROFESIONAL 3.4.9: CAMPANA, FAQ Y PANEL ADMINISTRATIVO ===== */

/* En celulares la campana se mueve al reproductor y permanece visible. */
@media (max-width: 760px) {
  .music-bar > #ms-news-button {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    margin: 0 0 0 5px !important;
    padding: 0 !important;
    position: relative !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: 1px solid var(--ms-final-blue) !important;
    border-radius: 9px !important;
    color: #ffd200 !important;
    z-index: 80 !important;
  }
}

/* Preguntas FAQ: borde azul claro, sólido y delgado. */
#faq details,
#faq details:hover,
#faq details:focus-within {
  border: 1px solid #66ccff !important;
  border-style: solid !important;
}

/* Clientes: resumen visible y acciones plegadas con flecha. */
#ms-admin .ms-client-collapsible {
  padding: 0 !important;
  overflow: hidden !important;
}
#ms-admin .ms-client-collapsible > summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 28px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 13px !important;
  cursor: pointer !important;
  list-style: none !important;
  background: #000000 !important;
}
#ms-admin .ms-client-collapsible > summary::-webkit-details-marker { display: none !important; }
#ms-admin .ms-client-summary { min-width: 0 !important; }
#ms-admin .ms-client-summary small { display: block !important; margin-top: 5px !important; overflow-wrap: anywhere !important; }
#ms-admin .ms-client-arrow {
  display: inline-grid !important;
  place-items: center !important;
  width: 27px !important;
  height: 27px !important;
  color: #00aaff !important;
  border: 1px solid #00aaff !important;
  border-radius: 50% !important;
  font-size: 1.15rem !important;
  font-style: normal !important;
  transition: transform .18s ease !important;
}
#ms-admin .ms-client-collapsible[open] .ms-client-arrow { transform: rotate(180deg) !important; }
#ms-admin .ms-client-actions {
  padding: 11px 13px 13px !important;
  border-top: 1px solid #00aaff !important;
  background: #000000 !important;
}

/* Gestión de tickets con estados de alto contraste. */
#ms-admin .ms-ticket-warranty,
#ms-admin .ms-ticket-solved,
#ms-admin .ms-ticket-closed {
  color: #ffffff !important;
  border: 1px solid #000000 !important;
  font-weight: 800 !important;
}
#ms-admin .ms-ticket-warranty { background: #ff6600 !important; }
#ms-admin .ms-ticket-solved { background: #00aa00 !important; }
#ms-admin .ms-ticket-closed { background: #ff0000 !important; }
.ticket-status.warranty { color: #ff6600 !important; border-color: #ff6600 !important; }
.ticket-status.solved { color: #00ff00 !important; border-color: #00ff00 !important; }
.ticket-status.closed { color: #ff0000 !important; border-color: #ff0000 !important; }

/* Historial de recargas en tabla clara y desplazable. */
.ms-topup-table-wrap {
  width: 100% !important;
  overflow-x: auto !important;
  border: 1px solid #00aaff !important;
  border-radius: 10px !important;
  background: #000000 !important;
}
.ms-recharge-table { width: 100% !important; min-width: 850px !important; border-collapse: collapse !important; color: #ffffff !important; }
.ms-recharge-table th {
  padding: 10px !important;
  color: #00aaff !important;
  background: #001326 !important;
  border-bottom: 1px solid #00aaff !important;
  text-align: left !important;
  font-size: .7rem !important;
}
.ms-recharge-table td { padding: 10px !important; border-bottom: 1px solid #00aaff !important; vertical-align: top !important; }
.ms-recharge-table tbody tr:last-child td { border-bottom: 0 !important; }
.ms-recharge-table td:last-child strong { color: #00ff00 !important; }

/* Búsqueda histórica de cuentas internas. */
.ms-account-history-group {
  border: 1px solid #00aaff !important;
  border-radius: 10px !important;
  background: #000000 !important;
  overflow: hidden !important;
}
.ms-account-history-group > summary {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 12px !important;
  color: #00aaff !important;
  cursor: pointer !important;
}
.ms-account-history-event { margin: 8px !important; padding: 11px !important; border: 1px solid #00aaff !important; border-radius: 8px !important; background: #001326 !important; }
.ms-account-history-event.inventory_added .ms-row-head b { color: #00aaff !important; }
.ms-account-history-event.sold .ms-row-head b { color: #00ff00 !important; }
.ms-account-history-event.warranty .ms-row-head b { color: #ff6600 !important; }

/* Ajustes autorizados: campana móvil dentro de la fila del reproductor. */
@media (max-width: 760px) {
  .radio-controls { grid-template-columns: 34px 34px minmax(92px,1fr) 42px 34px !important; }
  .radio-controls > #ms-news-button {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    background: transparent !important;
    border: 1px solid #00aaff !important;
    border-radius: 9px !important;
    color: #ffd200 !important;
    z-index: 80 !important;
  }
}

/* Colores nuevos autorizados exclusivamente para BUSCAR CUENTA y DATOS. */
.ms-account-buyer-name { color: #ff6600 !important; -webkit-text-fill-color: #ff6600 !important; }
#ms-admin [data-admin-tab="data"] { color: #ff0000 !important; -webkit-text-fill-color: #ff0000 !important; }
.ms-data-panel h3 { color: #ff0000 !important; -webkit-text-fill-color: #ff0000 !important; }
.ms-data-save { background: #00aa00 !important; color: #ffffff !important; border: 1px solid #00ff00 !important; }
.ms-data-delete { background: #ff0000 !important; color: #ffffff !important; border: 1px solid #ff0000 !important; }
.ms-data-edit { background: #0066ff !important; color: #ffffff !important; border: 1px solid #00aaff !important; }
.ms-data-cancel { background: #000000 !important; color: #ffffff !important; border: 1px solid #00aaff !important; }
.ms-data-entry pre { white-space: pre-wrap !important; overflow-wrap: anywhere !important; margin: 10px 0 !important; color: #ffffff !important; }

/* Conversaciones de tickets sin alterar la paleta general. */
.ms-ticket-conversation { display: grid !important; gap: 7px !important; margin: 10px 0 !important; }
.ms-ticket-message { padding: 9px !important; border: 1px solid #00aaff !important; border-radius: 8px !important; background: #000000 !important; }
.ms-ticket-message.admin { border-color: #00ff00 !important; }
.ms-ticket-message.customer { border-color: #00aaff !important; }
.ms-ticket-message p { margin: 5px 0 !important; white-space: pre-wrap !important; overflow-wrap: anywhere !important; }
