/* La Vega Rock – paleta base (docs/design/UI_UX_PROPUESTA_VISUAL.md) */
:root {
  --lavega-bg: #0d0d0d;
  --lavega-bg-secondary: #252525;
  --lavega-accent: #c41e3a;
  --lavega-text: #e0e0e0;
  --lavega-text-muted: #888;
  --lavega-border: #333;
}

html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

body {
  margin: 0;
  padding: 0;
  background-color: var(--lavega-bg);
  color: var(--lavega-text);
  overflow-x: hidden;
}

img, video, embed, object {
  max-width: 100%;
  height: auto;
}

iframe {
  max-width: 100%;
}

/* YouTube y otros vídeos 16:9 */
.news-content iframe[src*="youtube.com"],
.news-content iframe[src*="youtu.be"],
.news-body iframe[src*="youtube.com"],
.news-body iframe[src*="youtu.be"] {
  width: 100%;
  max-width: 560px;
  aspect-ratio: 16 / 9;
  height: auto;
}

/* Spotify y otros embeds (respeta height del iframe) */
.news-content iframe,
.news-body iframe {
  width: 100%;
  max-width: 560px;
  min-height: 152px;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem var(--lavega-bg), 0 0 0 0.25rem var(--lavega-accent);
}

.btn-primary {
  background-color: var(--lavega-accent);
  border-color: var(--lavega-accent);
}

.btn-primary:hover {
  background-color: #a01a30;
  border-color: #a01a30;
}

.lavega-nav {
  background-color: var(--lavega-bg) !important;
  border-color: var(--lavega-border) !important;
}

.lavega-nav .nav-link:hover {
  color: var(--lavega-accent) !important;
}

.lavega-nav .navbar-toggler {
  border-color: rgba(255, 255, 255, 0.3);
  min-width: 44px;
  min-height: 44px;
  padding: 0.4rem 0.6rem;
}

.lavega-nav .navbar-toggler:focus {
  box-shadow: 0 0 0 0.2rem var(--lavega-accent);
}

.lavega-nav .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28224,224,224,0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.table-responsive {
  -webkit-overflow-scrolling: touch;
}

.lavega-footer {
  background-color: var(--lavega-bg);
  border-color: var(--lavega-border) !important;
  padding: 0.6rem 0;
  margin-top: 2rem;
  font-size: 0.85rem;
  text-align: center;
}

.lavega-hero {
  background-color: var(--lavega-bg);
  color: #f5f5f5;
  padding: 3rem 0;
  margin-bottom: 2rem;
}

/* Hero portada: logo completo centrado a ancho completo (logo-blanco.png) */
.lavega-hero-portada {
  width: 100%;
  padding: 2.5rem 1rem 3rem;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0;
}
.lavega-hero-inner {
  text-align: center;
}
.lavega-logo-hero {
  max-width: 100%;
  width: min(280px, 90vw);
  height: auto;
  display: block;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .lavega-hero-portada {
    padding: 3rem 1rem 4rem;
    min-height: 280px;
  }
  .lavega-logo-hero {
    width: min(380px, 55vw);
  }
}

.lavega-card {
  background-color: var(--lavega-bg-secondary);
  border-color: var(--lavega-border);
  color: var(--lavega-text);
}

/* Logo en cabecera: solo letras en blanco (logo-la-vega-letras.png) */
.lavega-logo-header {
  max-height: 3rem;
  width: auto;
  max-width: 200px;
  display: block;
}
@media (min-width: 768px) {
  .lavega-logo-header {
    max-height: 3.5rem;
    max-width: 260px;
  }
}