/* ==========================================================================
   Tema claro / oscuro (assets/css/tema.css). Lo carga partials/head-comun.html DESPUES de style.css y datatables.
   - El modo claro es style.css tal cual: aqui solo estan el boton de la cabecera y lo que cambia en oscuro.
   - El tema lo pone assets/js/tema.js en <html data-bs-theme="dark|light"> (Bootstrap 5.3 hace el resto).
   - Paleta "pergamino de noche": marrones muy oscuros, texto crema y el dorado de siempre (#ffc451).
   - Si en style.css se cambia un fondo o un color de texto, revisar aqui su equivalente oscuro.
   ========================================================================== */

/* ---------- Boton sol/luna de la cabecera (los dos temas) ---------- */
.ua-tema-btn {
  background: transparent;
  border: 0;
  color: #fff;
  font-size: 1.2rem;
  line-height: 1;
  width: 38px;
  height: 38px;
  margin-right: 10px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: color .2s, background-color .2s;
  flex-shrink: 0;
}
.ua-tema-btn:hover, .ua-tema-btn:focus-visible { color: #ffc451; background: rgba(255, 255, 255, .10); outline: none; }

/* ---------- Paleta oscura ---------- */
[data-bs-theme="dark"] {
  --ua-fondo: #15110b;
  --ua-superficie: #1f1810;
  --ua-superficie-2: #2a2116;
  --ua-borde: #3d3123;
  --ua-texto: #e3d8c4;
  --ua-texto-suave: #b2a58c;
  --ua-titulo: #f3e8d2;
  --ua-oro-suave: #e0b350;
  --ua-rojo: #ef8a74;

  /* Bootstrap 5.3 con la misma paleta */
  --bs-body-bg: var(--ua-fondo);
  --bs-body-bg-rgb: 21, 17, 11;
  --bs-body-color: var(--ua-texto);
  --bs-body-color-rgb: 227, 216, 196;
  --bs-emphasis-color: var(--ua-titulo);
  --bs-emphasis-color-rgb: 243, 232, 210;
  --bs-heading-color: var(--ua-titulo);
  --bs-secondary-color: var(--ua-texto-suave);
  --bs-secondary-bg: var(--ua-superficie-2);
  --bs-tertiary-bg: var(--ua-superficie);
  --bs-border-color: var(--ua-borde);
  --bs-border-color-translucent: rgba(255, 230, 190, .12);
  --bs-link-color: #ffc451;
  --bs-link-color-rgb: 255, 196, 81;
  --bs-link-hover-color: #ffd584;
  --bs-link-hover-color-rgb: 255, 213, 132;
}

/* ---------- Pagina ---------- */
[data-bs-theme="dark"] body {
  color: var(--ua-texto);
  background-color: var(--ua-fondo);
  background-image: linear-gradient(rgba(21, 17, 11, .93), rgba(21, 17, 11, .93)), url("../img/IAWEB/optimizado/FONDOUA.webp");
}
[data-bs-theme="dark"] .bg-white { background-color: var(--ua-superficie) !important; }
[data-bs-theme="dark"] .card { --bs-card-bg: var(--ua-superficie); --bs-card-cap-bg: var(--ua-superficie-2); --bs-card-border-color: var(--ua-borde); }
[data-bs-theme="dark"] .modal { --bs-modal-bg: var(--ua-superficie); }
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select { background-color: var(--ua-superficie-2); border-color: var(--ua-borde); color: var(--ua-texto); }
[data-bs-theme="dark"] .form-control::placeholder { color: var(--ua-texto-suave); }

/* Barra de titulo de las paginas interiores (textura de pergamino, ahora en penumbra) */
[data-bs-theme="dark"] .breadcrumbs { background-color: #1c160e; }
[data-bs-theme="dark"] .breadcrumbs:before { opacity: .10; }
[data-bs-theme="dark"] .breadcrumbs h1,
[data-bs-theme="dark"] .breadcrumbs h2,
[data-bs-theme="dark"] .breadcrumbs ol li+li { color: var(--ua-titulo); }
[data-bs-theme="dark"] .breadcrumbs ol a { color: var(--ua-rojo); }
[data-bs-theme="dark"] .titulo_background {
  background: linear-gradient(rgba(21, 17, 11, .82), rgba(21, 17, 11, .82)), url("../img/UA/fondo.webp") center / cover;
  color: var(--ua-titulo);
}

/* Menu movil (en claro es blanco) */
[data-bs-theme="dark"] .navbar-mobile ul,
[data-bs-theme="dark"] .navbar-mobile .dropdown ul { background-color: var(--ua-superficie); box-shadow: 0 0 30px rgba(0, 0, 0, .5); }
[data-bs-theme="dark"] .navbar-mobile a,
[data-bs-theme="dark"] .navbar-mobile a:focus,
[data-bs-theme="dark"] .navbar-mobile .dropdown ul a { color: var(--ua-texto); }
[data-bs-theme="dark"] .navbar-mobile a:hover,
[data-bs-theme="dark"] .navbar-mobile .active,
[data-bs-theme="dark"] .navbar-mobile li:hover > a,
[data-bs-theme="dark"] .navbar-mobile .dropdown ul a:hover,
[data-bs-theme="dark"] .navbar-mobile .dropdown ul .active:hover,
[data-bs-theme="dark"] .navbar-mobile .dropdown ul li:hover > a { color: #312000; background-color: #ffc451; }

/* ---------- Secciones de la portada ---------- */
[data-bs-theme="dark"] .section-title p { color: var(--ua-titulo); }
[data-bs-theme="dark"] .features .icon-box p { color: var(--ua-texto-suave); }
[data-bs-theme="dark"] .services .icon-box { background: var(--ua-superficie); border-color: var(--ua-borde); }
[data-bs-theme="dark"] .services .icon-box:hover { border-color: #ffc451; box-shadow: 0 0 25px rgba(0, 0, 0, .5); }
[data-bs-theme="dark"] .services .icon-box a,
[data-bs-theme="dark"] .services .icon-box h4 a { color: var(--ua-titulo); }
[data-bs-theme="dark"] .services .icon-box a:hover,
[data-bs-theme="dark"] .services .icon-box h4 a:hover { color: #ffc451; }
[data-bs-theme="dark"] .counts .content h3,
[data-bs-theme="dark"] .counts .content .count-box span { color: var(--ua-titulo); }
[data-bs-theme="dark"] .counts .content .count-box p,
[data-bs-theme="dark"] .counts .content .count-box a { color: var(--ua-texto); }
[data-bs-theme="dark"] .counts .content .count-box a:hover { color: #ffc451; }
[data-bs-theme="dark"] .portfolio #portfolio-flters li { color: var(--ua-texto); }
[data-bs-theme="dark"] .portfolio #portfolio-flters li:hover,
[data-bs-theme="dark"] .portfolio #portfolio-flters li.filter-active { color: #312000; }
[data-bs-theme="dark"] .portfolio-details .portfolio-info h3 { border-bottom-color: var(--ua-borde); }

/* Redes sociales de la portada: en claro, las imagenes de marca en gris (style.css); en oscuro esas imagenes
   (cuadradas, con fondo propio) desentonan, asi que se ven sus iconos vectoriales en crema, dorados al pasar */
.clients .ua-rrss-icono { display: none; }
[data-bs-theme="dark"] .clients .swiper-slide img { display: none; }
[data-bs-theme="dark"] .clients .ua-rrss-icono {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 12px;
  font-size: 28px;
  color: var(--ua-texto-suave);
  background: rgba(255, 255, 255, .03);
  border: 1px solid var(--ua-borde);
  transition: .3s;
}
[data-bs-theme="dark"] .clients a:hover .ua-rrss-icono,
[data-bs-theme="dark"] .clients a:focus-visible .ua-rrss-icono { color: #ffc451; border-color: #ffc451; background: rgba(255, 196, 81, .08); }

/* Staff */
[data-bs-theme="dark"] .team { background: transparent; }
[data-bs-theme="dark"] .team .member { background: var(--ua-superficie); box-shadow: 0 2px 15px rgba(0, 0, 0, .45); }
[data-bs-theme="dark"] .team .member .social a { background: rgba(255, 255, 255, .08); color: var(--ua-texto); }
[data-bs-theme="dark"] .team .member .social a:hover { background: #ffc451; color: #312000; }
[data-bs-theme="dark"] .team .member .member-info h4 { color: var(--ua-titulo); }
[data-bs-theme="dark"] .team .member .member-info span,
[data-bs-theme="dark"] .team .member .member-info p { color: var(--ua-texto-suave); }

/* Contacto y formularios de plantilla */
[data-bs-theme="dark"] .contact .info,
[data-bs-theme="dark"] .contact .php-email-form,
[data-bs-theme="dark"] .contact .php-email-form .loading { background: var(--ua-superficie); }
[data-bs-theme="dark"] .contact .info h4 { color: var(--ua-titulo); }
[data-bs-theme="dark"] .contact .info p { color: var(--ua-texto); }

/* Pie: caja del boletin (en claro, blanca) */
[data-bs-theme="dark"] #footer .footer-top .footer-newsletter form { background: var(--ua-superficie-2); }
[data-bs-theme="dark"] #footer .footer-top .footer-newsletter form input[type=email] { background: transparent; color: var(--ua-texto); }

/* ---------- Cuentas (crear / recuperar) ---------- */
[data-bs-theme="dark"] #crear_cuenta input:not([type=submit]),
[data-bs-theme="dark"] #recupera_pass input:not([type=submit]) {
  background: var(--ua-superficie-2);
  color: var(--ua-texto);
  border: 1px solid var(--ua-borde);
}
[data-bs-theme="dark"] .card-footer.border-danger { background-color: #3b211d; color: #f6d2cc !important; }
/* Ilustraciones con vineta blanca en el propio fichero: en oscuro van en marco dorado (como las de Normas),
   asi el blanco se lee como el papel de un grabado enmarcado y no como un recuadro suelto */
[data-bs-theme="dark"] img[src$="crear_cuenta.webp"],
[data-bs-theme="dark"] img[src$="candado_completo.webp"],
[data-bs-theme="dark"] img[src$="recuperar_cuenta.webp"] {
  padding: 7px;
  background: linear-gradient(135deg, #ffc451, #ffbb38);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .5);
}
[data-bs-theme="dark"] .fechaHora { color: var(--ua-rojo); }
[data-bs-theme="dark"] a.Ntooltip { color: #6cbcff !important; }

/* ---------- Estado, PvP y facciones ---------- */
[data-bs-theme="dark"] .ua-status-nav .ua-status-btn { background: var(--ua-superficie); color: var(--ua-texto); }
[data-bs-theme="dark"] .ua-status-nav .ua-status-btn:hover { background: rgba(255, 196, 81, .15); color: var(--ua-titulo); }
[data-bs-theme="dark"] .ua-status-nav .ua-status-btn.active { background: linear-gradient(135deg, #ffc451, #ffbb38); color: #343a40; }
[data-bs-theme="dark"] .ua-section-title { color: var(--ua-titulo); }

[data-bs-theme="dark"] .torneo-card,
[data-bs-theme="dark"] .fortaleza-card { background: var(--ua-superficie); box-shadow: 0 3px 10px rgba(0, 0, 0, .4); }
[data-bs-theme="dark"] .torneo-hora,
[data-bs-theme="dark"] .fortaleza-hora { color: var(--ua-titulo); }
[data-bs-theme="dark"] .torneo-nombre,
[data-bs-theme="dark"] .fortaleza-nombre { color: var(--ua-texto-suave); }
[data-bs-theme="dark"] .torneo-card.next,
[data-bs-theme="dark"] .fortaleza-card.next { background: linear-gradient(135deg, #ffc451, #ffbb38); }
[data-bs-theme="dark"] .torneo-card.next .torneo-hora,
[data-bs-theme="dark"] .fortaleza-card.next .fortaleza-hora { color: #343a40; }
[data-bs-theme="dark"] .torneo-card.pasado,
[data-bs-theme="dark"] .fortaleza-card.pasado { border-color: var(--ua-borde); }
[data-bs-theme="dark"] .torneo-card.pasado .torneo-hora,
[data-bs-theme="dark"] .fortaleza-card.pasado .fortaleza-hora,
[data-bs-theme="dark"] .torneo-card.pasado .torneo-nombre,
[data-bs-theme="dark"] .fortaleza-card.pasado .fortaleza-nombre { color: #8c8170; }
[data-bs-theme="dark"] .torneo-bar,
[data-bs-theme="dark"] .fortaleza-bar { background-image: linear-gradient(90deg, rgba(255, 196, 81, .12) 0%, #ffc451 50%, rgba(255, 196, 81, .12) 100%); }

[data-bs-theme="dark"] .lb-card-ua { background: var(--ua-superficie); box-shadow: 0 3px 10px rgba(0, 0, 0, .4); }
[data-bs-theme="dark"] .lb-card-ua ol li { border-bottom-color: rgba(255, 255, 255, .06); }
[data-bs-theme="dark"] .lb-card-ua .lb-val { color: #e9ad45; }
[data-bs-theme="dark"] .lb-card-ua .lb-empty { color: var(--ua-texto-suave); }

/* Tablas: la cebra dorada se mantiene; la fila "blanca" pasa a superficie oscura */
[data-bs-theme="dark"] .table { --bs-table-color: var(--ua-texto); --bs-table-bg: transparent; }
[data-bs-theme="dark"] .table.table-striped tbody tr:nth-of-type(even) > *,
[data-bs-theme="dark"] table.dataTable tbody tr:nth-of-type(even) > * { background-color: var(--ua-superficie) !important; }
[data-bs-theme="dark"] .table.table-striped tbody tr:nth-of-type(odd) > *,
[data-bs-theme="dark"] table.dataTable tbody tr:nth-of-type(odd) > * { background-color: #2b2214 !important; }
[data-bs-theme="dark"] .table tbody tr:hover > *,
[data-bs-theme="dark"] table.dataTable tbody tr:hover > * { background-color: rgba(255, 187, 56, .22) !important; }
[data-bs-theme="dark"] table.dataTable tbody td,
[data-bs-theme="dark"] .table tbody td { color: var(--ua-texto); }

/* DataTables: paginacion y buscador */
[data-bs-theme="dark"] .dt-container .pagination .page-link { color: var(--ua-texto); background-color: var(--ua-superficie); border-color: var(--ua-borde); }
[data-bs-theme="dark"] .dt-container .pagination .page-link:hover { background-color: rgba(255, 196, 81, .18); color: var(--ua-titulo); }
[data-bs-theme="dark"] .dt-container .pagination .page-item.active .page-link { background-color: #ffc451; border-color: #ffc451; color: #312000; }
[data-bs-theme="dark"] .dt-container .pagination .page-item.disabled .page-link { color: #6f6555; }

/* Bestiario */
[data-bs-theme="dark"] .ua-cat-filtros-box { background: rgba(255, 255, 255, .04); }
[data-bs-theme="dark"] .ua-cat-chip { background: var(--ua-superficie-2); color: var(--ua-texto); }
[data-bs-theme="dark"] .ua-cat-chip.active { background: var(--cat-color, #888); color: #000; }
[data-bs-theme="dark"] .ua-bestiario-ficha { border-color: var(--ua-borde); }
[data-bs-theme="dark"] #bestiario tbody tr.ua-npc-seleccionado > *,
[data-bs-theme="dark"] #bestiario tbody tr.ua-npc-seleccionado { background-color: rgba(255, 196, 81, .22) !important; }
[data-bs-theme="dark"] .ua-ficha-card { border-color: var(--ua-borde); }
[data-bs-theme="dark"] .ua-stat-chip { background: var(--ua-superficie-2); border-color: var(--ua-borde); }
[data-bs-theme="dark"] .ua-stat-label { color: var(--ua-texto-suave); }
[data-bs-theme="dark"] .ua-stat-valor { color: var(--ua-titulo); }

/* ---------- Desplegables (changelog, servidor, preguntas frecuentes) ---------- */
/* Cerrado: flecha dorada (Bootstrap la pone azul en oscuro). Abierto: fondo dorado con texto e icono oscuros, como en claro */
[data-bs-theme="dark"] .accordion-button {
  color: var(--ua-texto);
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffc451' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
  color: #343a40;
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .faq .accordion-item { background: var(--ua-superficie); border-color: var(--ua-borde); }
[data-bs-theme="dark"] .faq .accordion-button { background: var(--ua-superficie); color: var(--ua-titulo); }
[data-bs-theme="dark"] .faq .accordion-button:not(.collapsed) {
  background: rgba(255, 196, 81, .12);
  color: var(--ua-titulo);
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffc451' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}
[data-bs-theme="dark"] .faq .accordion-body { color: var(--ua-texto); }
[data-bs-theme="dark"] .faq .accordion-body a { color: var(--ua-oro-suave); }

/* ---------- Normas (las tarjetas se definen en el <style> de normas.html) ---------- */
[data-bs-theme="dark"] .norma-card { background: var(--ua-superficie); box-shadow: 0 2px 6px rgba(0, 0, 0, .4); }
[data-bs-theme="dark"] .norma-card:hover,
[data-bs-theme="dark"] .norma-card.abierta { box-shadow: 0 8px 20px rgba(0, 0, 0, .55); }
[data-bs-theme="dark"] .ua-normas-toolbar { background: var(--ua-superficie); border-color: var(--ua-borde); box-shadow: 0 4px 14px rgba(0, 0, 0, .5); }
[data-bs-theme="dark"] #normas-indice .idx-titulo { color: var(--ua-titulo); }
[data-bs-theme="dark"] #normas-indice .indice-link { color: var(--ua-oro-suave); }
[data-bs-theme="dark"] #normas-indice .indice-link:hover { color: #ffd584; }
