/* ════════════════════════════════════════════════════ */
/* MODO CLARO - ESTILOS PARA TODAS LAS PÁGINAS */
/* ════════════════════════════════════════════════════ */

body.light-mode {
  background: #ffffff !important;
  color: #1a1a1a !important;
}

body.light-mode * {
  color: #1a1a1a !important;
}

body.light-mode .btn-primary,
body.light-mode .btn-primary *,
body.light-mode .btn-add,
body.light-mode .btn-add *,
body.light-mode .btn-guardar,
body.light-mode .btn-guardar *,
body.light-mode .nav-btn,
body.light-mode .nav-btn *,
body.light-mode button.nav-btn,
body.light-mode button.nav-btn *,
body.light-mode button.nav-btn[type="button"],
body.light-mode button.nav-btn[type="button"] *,
body.light-mode .nav-btn-left,
body.light-mode .nav-btn-left *,
body.light-mode button.nav-btn-left,
body.light-mode button.nav-btn-left *,
body.light-mode .nav-btn-theme,
body.light-mode .nav-btn-theme *,
body.light-mode #btn-argazkiak,
body.light-mode #btn-argazkiak *,
body.light-mode #btn-playlist,
body.light-mode #btn-playlist * {
  color: #ffffff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* Header */
body.light-mode header {
  background: linear-gradient(135deg, #ffffff 0%, #f0f9f4 100%) !important;
  border-bottom: 2px solid rgba(26, 92, 56, 0.2);
  box-shadow: 0 2px 8px rgba(26, 92, 56, 0.12);
}

body.light-mode header h1,
body.light-mode header p.subtitulo,
body.light-mode header h1 * {
  color: #1a5c38 !important;
}

/* Main */
body.light-mode main {
  background: #ffffff !important;
  color: #1a1a1a !important;
}

/* Elementos de contenido */
body.light-mode .contenido {
  background: #ffffff !important;
  color: #1a1a1a !important;
}

body.light-mode .contenido h2,
body.light-mode .contenido p {
  color: #1a1a1a !important;
}

/* Inputs y formularios */
body.light-mode .filter-control input,
body.light-mode .filter-control select,
body.light-mode .btn-dropdown,
body.light-mode input,
body.light-mode select,
body.light-mode textarea {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .filter-control input::placeholder,
body.light-mode input::placeholder,
body.light-mode textarea::placeholder {
  color: rgba(26, 92, 56, 0.5) !important;
}

body.light-mode .filter-control input:focus,
body.light-mode .filter-control select:focus,
body.light-mode .btn-dropdown:focus,
body.light-mode input:focus,
body.light-mode select:focus,
body.light-mode textarea:focus {
  border-color: #1a5c38 !important;
  box-shadow: 0 0 0 3px rgba(26, 92, 56, 0.15) !important;
}

/* Opciones de select */
body.light-mode select option {
  background: #ffffff !important;
  color: #1a1a1a !important;
}

body.light-mode select option:checked {
  background: linear-gradient(135deg, #1a5c38 0%, #0f3d25 100%) !important;
  color: #ffffff !important;
}

/* Dropdowns personalizados */
body.light-mode .dropdown,
body.light-mode [role="listbox"],
body.light-mode [role="combobox"] {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .dropdown-menu {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
  border: 1px solid rgba(26, 92, 56, 0.2) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .dropdown-search,
body.light-mode .dropdown-search input {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
  border-bottom: 1px solid rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .dropdown-search::placeholder,
body.light-mode .dropdown-search input::placeholder {
  color: rgba(26, 92, 56, 0.5) !important;
}

body.light-mode .dropdown-options {
  background: #ffffff !important;
}

body.light-mode .dropdown-options div,
body.light-mode .dropdown-item,
body.light-mode [role="option"] {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .dropdown-options div:hover,
body.light-mode .dropdown-options label:hover,
body.light-mode .dropdown-item:hover,
body.light-mode [role="option"]:hover {
  background: #f0f9f4 !important;
  color: #1a5c38 !important;
}

body.light-mode .dropdown-options div.active,
body.light-mode .dropdown-options label.active,
body.light-mode .dropdown-item.active,
body.light-mode [role="option"].active {
  background: rgba(26, 92, 56, 0.1) !important;
  color: #1a5c38 !important;
}

body.light-mode .dropdown-options label,
body.light-mode .dropdown-options input[type="checkbox"] + label {
  color: #1a1a1a !important;
}

body.light-mode [role="listbox"] > *,
body.light-mode .dropdown-menu,
body.light-mode .dropdown-item,
body.light-mode [role="option"] {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.1) !important;
}

/* Checkboxes en dropdowns */
body.light-mode input[type="checkbox"],
body.light-mode input[type="radio"] {
  accent-color: #1a5c38 !important;
  background: #ffffff !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
}

body.light-mode input[type="checkbox"]:checked,
body.light-mode input[type="radio"]:checked {
  background: #1a5c38 !important;
  border-color: #1a5c38 !important;
}

body.light-mode label {
  color: #1a1a1a !important;
}

/* Listas con items seleccionables */
body.light-mode .item-list,
body.light-mode ul,
body.light-mode ol {
  background: #ffffff !important;
  color: #1a1a1a !important;
}

body.light-mode .item-list li,
body.light-mode ul li,
body.light-mode ol li {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .item-list li:hover,
body.light-mode ul li:hover,
body.light-mode ol li:hover {
  background: #f0f9f4 !important;
  color: #1a5c38 !important;
}

body.light-mode .item-list li.selected,
body.light-mode ul li.selected,
body.light-mode ol li.selected {
  background: rgba(26, 92, 56, 0.1) !important;
  color: #1a5c38 !important;
  border-color: #1a5c38 !important;
}

/* Botones */
body.light-mode .btn-menu,
body.light-mode button.btn-menu {
  background: #ffffff !important;
  color: #1a5c38 !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
  box-shadow: 0 6px 28px rgba(26, 92, 56, 0.08) !important;
}

body.light-mode .btn-menu:hover,
body.light-mode button.btn-menu:hover {
  background: #f0f9f4 !important;
  border-color: #22774a !important;
  color: #22774a !important;
  box-shadow: 0 16px 48px rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .btn-primary {
  background: linear-gradient(135deg, #1a5c38 0%, #0f3d25 100%) !important;
  color: #ffffff !important;
  border-color: rgba(26, 92, 56, 0.5) !important;
}

body.light-mode .btn-primary:hover {
  background: linear-gradient(135deg, #22774a 0%, #145230 100%) !important;
  border-color: #22774a !important;
}

/* Toolbar */
body.light-mode .toolbar {
  background: rgba(26, 92, 56, 0.04) !important;
  border-bottom: 1px solid rgba(26, 92, 56, 0.1) !important;
  color: #1a1a1a !important;
}

body.light-mode .toolbar span.contador {
  color: rgba(26, 92, 56, 0.6) !important;
}

/* Botón de tema */
body.light-mode .nav-btn-theme {
  background: #1a5c38 !important;
  border-color: #1a5c38 !important;
  color: #ffffff !important;
}

body.light-mode .nav-btn-theme:hover {
  background: #22774a !important;
  border-color: #22774a !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(26, 92, 56, 0.4) !important;
}

/* Botones de navegación - MANTENER VERDE EN INDABA/LAGUARDIA/AURKEZPEN */
body.light-mode .nav-btn,
body.light-mode button.nav-btn,
body.light-mode button.nav-btn[type="button"],
body.light-mode .nav-grid button {
  background: linear-gradient(135deg, #1a5c38 0%, #0f3d25 100%) !important;
  color: #ffffff !important;
  border: 2px solid rgba(255,255,255,.25) !important;
  box-shadow: 0 4px 16px rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .nav-btn *,
body.light-mode button.nav-btn *,
body.light-mode button.nav-btn[type="button"] *,
body.light-mode .nav-grid button * {
  color: #ffffff !important;
}

body.light-mode .nav-btn:hover,
body.light-mode button.nav-btn:hover,
body.light-mode button.nav-btn[type="button"]:hover,
body.light-mode .nav-grid button:hover {
  background: linear-gradient(135deg, #22774a 0%, #145230 100%) !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,.4) !important;
  box-shadow: 0 8px 22px rgba(26, 92, 56, 0.3) !important;
  transform: translateY(-1px);
}

body.light-mode .nav-btn.current,
body.light-mode button.nav-btn.current,
body.light-mode button.nav-btn.current[type="button"],
body.light-mode .nav-grid button.current {
  background: linear-gradient(135deg, #22a866 0%, #0f5c33 100%) !important;
  border-color: rgba(76,255,154,.5) !important;
  box-shadow: 0 6px 20px rgba(34, 168, 102, 0.35) !important;
}

/* ════════════════════════════════════════════════════ */
/* ESTILOS PARA PÁGINAS CON TEMA VERDE (INDABA, LAGUARDIA, ETC) */
/* ════════════════════════════════════════════════════ */

/* Títulos de secciones */
body.light-mode .section-title {
  color: #1a5c38 !important;
}

body.light-mode .section-count {
  color: rgba(26, 92, 56, 0.6) !important;
}

body.light-mode .section-empty {
  background: rgba(26, 92, 56, 0.04) !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
  color: rgba(26, 92, 56, 0.6) !important;
}

/* Botones de añadir */
body.light-mode .btn-add {
  background: linear-gradient(135deg, #1a5c38 0%, #0f3d25 100%) !important;
  color: #ffffff !important;
  border-color: rgba(26, 92, 56, 0.4) !important;
  box-shadow: 0 4px 16px rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .btn-add,
body.light-mode .btn-add *,
body.light-mode .btn-add svg,
body.light-mode .btn-add svg * {
  color: #ffffff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.light-mode .btn-add:hover {
  background: linear-gradient(135deg, #22774a 0%, #145230 100%) !important;
  border-color: rgba(26, 92, 56, 0.6) !important;
  box-shadow: 0 8px 24px rgba(26, 92, 56, 0.25) !important;
}

body.light-mode .btn-add.btn-video {
  background: linear-gradient(135deg, #d97706 0%, #b45309 100%) !important;
}

body.light-mode .btn-add.btn-video:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  box-shadow: 0 8px 24px rgba(217, 119, 6, 0.25) !important;
}

/* Botón limpiar/vaciar */
body.light-mode .btn-clear {
  background: transparent !important;
  color: rgba(26, 92, 56, 0.5) !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
}

body.light-mode .btn-clear:hover {
  border-color: #1a5c38 !important;
  color: #1a5c38 !important;
}

/* Tarjetas de multimedia */
body.light-mode .foto-card {
  background: #f0f9f4 !important;
  box-shadow: 0 6px 28px rgba(26, 92, 56, 0.15) !important;
  border: 1px solid rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .foto-card .media-badge {
  background: rgba(26, 92, 56, 0.8) !important;
  color: #fff !important;
}

body.light-mode .foto-card .btn-del {
  background: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .foto-card .btn-del:hover {
  background: #1a5c38 !important;
}

/* Toolbar en light-mode */
body.light-mode .toolbar {
  background: rgba(26, 92, 56, 0.03) !important;
  border-bottom: 1px solid rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .nav-btn-left,
body.light-mode button.nav-btn-left {
  background: #1a5c38 !important;
  color: #ffffff !important;
  border-color: #1a5c38 !important;
}

body.light-mode .nav-btn-left:hover,
body.light-mode button.nav-btn-left:hover {
  background: #22774a !important;
  border-color: #22774a !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(26, 92, 56, 0.3) !important;
}

body.light-mode .nav-btn-left svg,
body.light-mode button.nav-btn-left svg {
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.2)) !important;
}

body.light-mode .nav-btn-member,
body.light-mode button.nav-btn-member {
  background: #ffffff !important;
  color: #1a5c38 !important;
  border-color: rgba(26, 92, 56, 0.4) !important;
}

body.light-mode .nav-btn-member:hover,
body.light-mode button.nav-btn-member:hover {
  background: #f0f9f4 !important;
  color: #22774a !important;
  border-color: #22774a !important;
}

body.light-mode .nav-btn-install,
body.light-mode button.nav-btn-install {
  background: #ffffff !important;
  color: #1a5c38 !important;
  border-color: rgba(26, 92, 56, 0.4) !important;
}

body.light-mode .nav-btn-install:hover,
body.light-mode button.nav-btn-install:hover {
  background: #f0f9f4 !important;
  color: #22774a !important;
  border-color: #22774a !important;
}

/* Redes sociales */
body.light-mode .sare-sozialak {
  background: rgba(26, 92, 56, 0.05) !important;
  border-top: 1px solid rgba(26, 92, 56, 0.15) !important;
  border-bottom: 1px solid rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .sare-sozialak h2 {
  color: #1a5c38 !important;
}

body.light-mode .sare-sozialak-enlaces a {
  background: #ffffff !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
  color: #1a5c38 !important;
}

body.light-mode .sare-sozialak-enlaces a:hover {
  background: #f0f9f4 !important;
  border-color: #22774a !important;
  color: #22774a !important;
}

/* Footer */
body.light-mode footer {
  color: rgba(26, 92, 56, 0.5) !important;
  background: rgba(26, 92, 56, 0.02) !important;
}

/* Panel de eventos (egutegia) */
body.light-mode .panel-dia-inner,
body.light-mode .modal,
body.light-mode .panel-detalle-inner {
  background: #f5f5f5 !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .panel-dia-inner h3,
body.light-mode .modal h3,
body.light-mode .panel-detalle-inner h3 {
  color: #1a5c38 !important;
}

body.light-mode .evento-item {
  background: rgba(26, 92, 56, 0.08) !important;
  color: #1a1a1a !important;
}

body.light-mode .evento-item.expandible-mobile.activo {
  background: rgba(26, 92, 56, 0.15) !important;
  box-shadow: inset 0 0 0 1px rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .evento-item-desc {
  color: rgba(26, 92, 56, 0.7) !important;
}

body.light-mode .evento-item-hora,
body.light-mode .evento-item-localidad {
  color: rgba(26, 92, 56, 0.6) !important;
}

/* Elementos del formulario modal */
body.light-mode .form-grupo label {
  color: rgba(26, 92, 56, 0.7) !important;
}

body.light-mode .form-grupo input,
body.light-mode .form-grupo textarea,
body.light-mode .form-grupo select {
  background: #ffffff !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
  color: #1a1a1a !important;
}

body.light-mode .btn-cancelar {
  background: rgba(26, 92, 56, 0.1) !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
  color: #1a5c38 !important;
}

body.light-mode .btn-cancelar:hover {
  background: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .btn-guardar {
  background: linear-gradient(135deg, #1a5c38 0%, #0f3d25 100%) !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
  color: #ffffff !important;
}

/* Tarjeta de categorías/eventos */
body.light-mode .evento-chip {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border: 1px solid rgba(26, 92, 56, 0.2) !important;
}

/* Overlay/backdrop modal */
body.light-mode .modal-overlay {
  background: rgba(6, 15, 10, 0.4) !important;
}

body.light-mode .panel-dia {
  background: rgba(6, 15, 10, 0.4) !important;
}

body.light-mode .lightbox {
  background: rgba(0, 0, 0, 0.75) !important;
}

/* Secciones específicas */
body.light-mode .info-alta {
  background: linear-gradient(135deg, rgba(26, 92, 56, 0.1) 0%, rgba(34, 119, 74, 0.08) 100%) !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
  color: #1a5c38 !important;
}

body.light-mode .kartela-placeholder {
  color: rgba(26, 92, 56, 0.5) !important;
}

body.light-mode .sin-eventos {
  color: rgba(26, 92, 56, 0.5) !important;
}

/* Modal de Bazkideak */
body.light-mode .bazkideak-modal {
  background: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .bazkideak-backdrop {
  background: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .bazkideak-panel {
  background: linear-gradient(135deg, #f0f9f4 0%, #ffffff 100%) !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.2) !important;
}

body.light-mode .bazkideak-close {
  background: rgba(26, 92, 56, 0.1) !important;
  color: #1a5c38 !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .bazkideak-close:hover {
  background: rgba(26, 92, 56, 0.2) !important;
  color: #0f3d25 !important;
}

body.light-mode .bazkideak-eyebrow {
  color: #1a5c38 !important;
  text-transform: uppercase;
}

body.light-mode .bazkideak-panel h2 {
  color: #1a5c38 !important;
  font-weight: 900;
}

body.light-mode .bazkideak-text,
body.light-mode .bazkideak-panel p {
  color: rgba(26, 92, 56, 0.7) !important;
}

body.light-mode .bazkideak-label {
  color: #1a5c38 !important;
  font-weight: 600;
}

body.light-mode .bazkideak-input {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
}

body.light-mode .bazkideak-input::placeholder {
  color: rgba(26, 92, 56, 0.5) !important;
}

body.light-mode .bazkideak-input:focus {
  border-color: #1a5c38 !important;
  box-shadow: 0 0 0 3px rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .bazkideak-submit {
  background: linear-gradient(135deg, #f4d454 0%, #f0ca27 100%) !important;
  color: #1a1a1a !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
  font-weight: 800;
}

body.light-mode .bazkideak-submit:hover {
  background: linear-gradient(135deg, #f5e081 0%, #f2d747 100%) !important;
  box-shadow: 0 6px 20px rgba(244, 212, 84, 0.3) !important;
}

body.light-mode .bazkideak-feedback {
  color: #d32f2f !important;
}

body.light-mode .bazkideak-session-text {
  color: #1a5c38 !important;
  font-weight: 600;
}

body.light-mode .bazkideak-session-email {
  color: #1a1a1a !important;
  background: rgba(26, 92, 56, 0.05) !important;
  border: 1px solid rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .bazkideak-session-actions {
  gap: 12px;
  flex-wrap: wrap;
}

body.light-mode .bazkideak-link {
  background: #ffffff !important;
  color: #1a5c38 !important;
  border: 2px solid rgba(26, 92, 56, 0.3) !important;
  font-weight: 700;
}

body.light-mode .bazkideak-link:hover {
  background: #f0f9f4 !important;
  border-color: #1a5c38 !important;
  color: #0f3d25 !important;
}

body.light-mode .bazkideak-logout {
  background: rgba(26, 92, 56, 0.1) !important;
  color: #1a5c38 !important;
  border: 2px solid rgba(26, 92, 56, 0.3) !important;
  font-weight: 700;
}

body.light-mode .bazkideak-logout:hover {
  background: rgba(26, 92, 56, 0.15) !important;
  border-color: #1a5c38 !important;
  color: #0f3d25 !important;
}

/* ════════════════════════════════════════════════════ */
/* ESTILOS ESPECÍFICOS PARA EKINTZAK EN LIGHT MODE */
/* ════════════════════════════════════════════════════ */

/* Título principal */
body.light-mode .page-title {
  color: #1a5c38 !important;
  text-align: center;
  margin-bottom: 40px;
}

body.light-mode .page-title h2 {
  color: #1a5c38 !important;
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 0;
}

/* Contenedor de menú de botones */
body.light-mode .menu-botones {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  max-width: 640px;
  width: min(640px, 92vw);
}

/* Botones del menú mejorados para light-mode */
body.light-mode .btn-menu,
body.light-mode a.btn-menu {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
  text-align: center;
  text-decoration: none;
  background: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%) !important;
  color: #1a5c38 !important;
  border: 2px solid rgba(26, 92, 56, 0.3) !important;
  border-radius: 16px;
  padding: 32px 20px;
  font-size: 1.25rem;
  font-weight: 900;
  letter-spacing: 2px;
  text-transform: uppercase;
  line-height: 1.3;
  cursor: pointer;
  box-shadow: 0 6px 28px rgba(26, 92, 56, 0.12) !important;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

body.light-mode .btn-menu:hover,
body.light-mode a.btn-menu:hover {
  transform: translateY(-5px) scale(1.03);
  box-shadow: 0 16px 48px rgba(26, 92, 56, 0.22) !important;
  background: linear-gradient(135deg, #f0f9f4 0%, #e8f5f0 100%) !important;
  border-color: #22774a !important;
  color: #22774a !important;
}

body.light-mode .btn-menu:active,
body.light-mode a.btn-menu:active {
  transform: translateY(-1px) scale(1.01);
}

body.light-mode .btn-menu .btn-icon {
  width: 38px;
  height: 38px;
  opacity: 0.88;
  flex-shrink: 0;
  color: #1a5c38 !important;
}

body.light-mode .btn-menu:hover .btn-icon {
  color: #22774a !important;
}

/* PESTAÑAS EN MUSIKARIAK - Light mode */
body.light-mode .pestanas {
  background: #e8f5e9 !important;
  border-bottom-color: rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .pestana {
  color: rgba(26, 92, 56, 0.85) !important;
  background: transparent !important;
}

body.light-mode .pestana:hover {
  color: #1a5c38 !important;
  background: rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .pestana.activa {
  color: #0f3d25 !important;
  border-bottom-color: #1a5c38 !important;
  background: rgba(26, 92, 56, 0.15) !important;
}

/* BOTONES DELETE EN TARJETAS - Light mode */
body.light-mode .foto-card .btn-del svg,
body.light-mode .video-card .btn-del svg,
body.light-mode .audio-card .btn-del svg {
  stroke: #ffffff !important;
}

/* ════════════════════════════════════════════════════ */
/* Para elementos con estilos inline que necesiten ser sobrescritos */
/* ════════════════════════════════════════════════════ */
body.light-mode {
  --text-color: #1a1a1a;
  --bg-color: #ffffff;
  --primary-color: #1a5c38;
  --border-color: rgba(26, 92, 56, 0.2);
}

/* ════════════════════════════════════════════════════ */
/* FORMULARIO INSCRIPCIÓN (bazkidea-izateko.html) */
/* ════════════════════════════════════════════════════ */
body.light-mode .form-section {
  border-color: rgba(26, 92, 56, 0.2) !important;
  background: #ffffff !important;
}

body.light-mode .form-body {
  background: #ffffff !important;
}

body.light-mode .adingabea-toggle {
  background: rgba(26, 92, 56, 0.04) !important;
}

body.light-mode .adingabea-content {
  border-top-color: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .form-firma {
  background: rgba(26, 92, 56, 0.03) !important;
  border-color: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .firma-box {
  background: rgba(26, 92, 56, 0.02) !important;
  border-color: rgba(26, 92, 56, 0.25) !important;
}

body.light-mode .firma-canvas {
  background: #f8f8f8 !important;
  border-color: rgba(26, 92, 56, 0.2) !important;
}

body.light-mode .firma-hint {
  color: rgba(26, 92, 56, 0.35) !important;
}

body.light-mode .firma-clear {
  border-color: rgba(26, 92, 56, 0.3) !important;
  color: rgba(26, 92, 56, 0.55) !important;
}

body.light-mode .firma-clear:hover {
  background: rgba(26, 92, 56, 0.08) !important;
  color: #1a5c38 !important;
}

body.light-mode .iban-input {
  background: rgba(26, 92, 56, 0.07) !important;
  border-color: rgba(26, 92, 56, 0.4) !important;
}

body.light-mode .firma-fecha input {
  border-bottom-color: rgba(26, 92, 56, 0.4) !important;
  color: #1a1a1a !important;
}

body.light-mode .field-error,
body.light-mode .firma-field-error {
  color: #c62828 !important;
}

body.light-mode #msg-exito {
  background: rgba(26, 92, 56, 0.08) !important;
  border-color: #1a5c38 !important;
  color: #1a1a1a !important;
}

body.light-mode #btn-atzera {
  background: rgba(26, 92, 56, 0.08) !important;
  color: #1a5c38 !important;
  border-color: rgba(26, 92, 56, 0.4) !important;
}

body.light-mode #btn-atzera:hover {
  background: rgba(26, 92, 56, 0.15) !important;
}

/* ════════════════════════════════════════════════════ */
/* GALERÍA DE FOTOS/VÍDEOS (aurkezpen-ekitaldia, aurzpen, bideoak) */
/* ════════════════════════════════════════════════════ */
body.light-mode .section-head {
  border-bottom-color: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .section-title .title-thumbnail {
  background: rgba(26, 92, 56, 0.08) !important;
  border-color: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .upload-status {
  background: rgba(26, 92, 56, 0.05) !important;
  border-color: rgba(26, 92, 56, 0.15) !important;
}

body.light-mode .upload-status-top {
  color: #1a1a1a !important;
}

body.light-mode .video-toolbar {
  background: rgba(26, 92, 56, 0.04) !important;
  border-bottom-color: rgba(26, 92, 56, 0.1) !important;
}

/* ════════════════════════════════════════════════════ */
/* INSTALAR-APP: fondo gradiente oscuro del body */
/* ════════════════════════════════════════════════════ */
body.light-mode.instalar-bg {
  background: #f0f9f4 !important;
}

/* ════════════════════════════════════════════════════ */
/* TARJETAS DE VÍDEO Y AUDIO (musikariak, bideoak, etc.) */
/* ════════════════════════════════════════════════════ */
body.light-mode .video-card {
  background: #f0f9f4 !important;
  box-shadow: 0 4px 18px rgba(26, 92, 56, 0.15) !important;
  border: 1px solid rgba(26, 92, 56, 0.12) !important;
}

body.light-mode .video-card:hover {
  box-shadow: 0 10px 32px rgba(26, 92, 56, 0.22) !important;
}

body.light-mode .audio-card {
  background: #f0f9f4 !important;
  border-color: rgba(26, 92, 56, 0.15) !important;
  box-shadow: 0 2px 10px rgba(26, 92, 56, 0.1) !important;
}

body.light-mode .audio-card:hover {
  background: #e8f5e9 !important;
  border-color: rgba(26, 92, 56, 0.3) !important;
}

body.light-mode .audio-card .audio-name {
  color: #1a1a1a !important;
}

/* ════════════════════════════════════════════════════ */
/* STICKY CONTROLS Y CONTROLES FIJOS (abeztiak, etc.) */
/* ════════════════════════════════════════════════════ */
body.light-mode .sticky-controls {
  background: #ffffff !important;
}

/* ════════════════════════════════════════════════════ */
/* FOTO-CARD SHIMMER ANIMATION EN LIGHT MODE */
/* ════════════════════════════════════════════════════ */
body.light-mode .foto-card {
  background: #f0f9f4 !important;
  box-shadow: 0 4px 18px rgba(26, 92, 56, 0.15) !important;
  border: 1px solid rgba(26, 92, 56, 0.1) !important;
  animation: none !important;
}

body.light-mode .foto-card.cargado {
  background: #f0f9f4 !important;
  animation: none !important;
}