/* ==========================================================================
   Modo oscuro — apps de estimación (MIR, EIR, FIR, BIR, PIR, ENURM, OPE Medicina, PNA)
   Solo se aplica con <html data-theme="dark"> (assets/js/theme.js, interruptor en Ajustes).
   Solo cambia colores: no toca tamaños, posiciones ni las reglas que muestran u
   ocultan elementos. Los colores de cada app (custom.min.css) se mantienen en
   las tarjetas destacadas y se usan como acento.
   ========================================================================== */

html[data-theme="dark"] {
  color-scheme: dark;
  --dm-bg: #0e1214;
  --dm-surface: #161b1f;
  --dm-surface-2: #1c2227;
  --dm-surface-3: #232a30;
  --dm-input: #12171a;
  --dm-line: #2a3238;
  --dm-line-soft: #20272c;
  --dm-ink: #eef2f4;
  --dm-text: #c3ccd2;
  --dm-muted: #8a979f;
  --dm-accent: var(--btlight, #cbd300);
  --dm-ok: #4cc38a;
  --dm-ko: #ff6b6b;
  --dm-shadow: 0 1px 2px rgba(0, 0, 0, .45), 0 10px 28px -16px rgba(0, 0, 0, .85);
}

/* acento de cada app en modo oscuro (más luminoso que su color base) */
html[data-theme="dark"] .stMIR,
html[data-theme="dark"] .stOPE_MEDICINA { --dm-accent: #cbd300; }
html[data-theme="dark"] .stEIR { --dm-accent: #54afe0; }
html[data-theme="dark"] .stBIR { --dm-accent: #ef6928; }
html[data-theme="dark"] .stFIR { --dm-accent: #1bce69; }
html[data-theme="dark"] .stPIR { --dm-accent: #3fb3c4; }
html[data-theme="dark"] .stENURM { --dm-accent: #4aa8dc; }
html[data-theme="dark"] .stPNA { --dm-accent: #e05aae; }

/* transición suave al pulsar el interruptor */
html.nx-theme-switching,
html.nx-theme-switching *,
html.nx-theme-switching *::before,
html.nx-theme-switching *::after {
  transition: background-color .3s ease, border-color .3s ease, color .3s ease, fill .3s ease !important;
}

/* ------------------------------------------------------------------ base */
html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] .mai-wrapper,
html[data-theme="dark"] .main-supercontainer,
html[data-theme="dark"] .main-content,
html[data-theme="dark"] .tab-content {
  background-color: var(--dm-bg);
  color: var(--dm-text);
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .tab-pane h1,
html[data-theme="dark"] .user-stats-indicator-counter,
html[data-theme="dark"] .user-stats-name {
  color: var(--dm-ink);
}

html[data-theme="dark"] a {
  color: var(--dm-accent);
}

html[data-theme="dark"] .text-muted {
  color: var(--dm-muted) !important;
}

html[data-theme="dark"] hr {
  border-color: var(--dm-line);
}

html[data-theme="dark"] ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb {
  border: 2px solid var(--dm-bg);
  border-radius: 10px;
  background: #343d44;
}

html[data-theme="dark"] ::-webkit-scrollbar-track {
  background: var(--dm-bg);
}

/* ------------------------------------------------------------------ tarjetas */
html[data-theme="dark"] .widget,
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-default,
html[data-theme="dark"] .user-stats,
html[data-theme="dark"] .usage:not(.usage-dark):not(.usage-primary):not(.usage-success):not(.usage-secondary) {
  background-color: var(--dm-surface);
  border-color: var(--dm-line-soft);
  color: var(--dm-text);
  box-shadow: var(--dm-shadow);
}

html[data-theme="dark"] .widget .user-stats,
html[data-theme="dark"] .card .card {
  box-shadow: none;
}

html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-header-divider,
html[data-theme="dark"] .widget-head {
  background-color: transparent;
  border-color: var(--dm-line);
  color: var(--dm-ink);
}

html[data-theme="dark"] .card-subtitle,
html[data-theme="dark"] .widget-head .description,
html[data-theme="dark"] .desc,
html[data-theme="dark"] .descblock,
html[data-theme="dark"] .user-stats-indicator-title,
html[data-theme="dark"] .user-stats-position {
  color: var(--dm-muted);
}

html[data-theme="dark"] .widget-head .title,
html[data-theme="dark"] .card-header .title {
  color: var(--dm-ink);
}

html[data-theme="dark"] .card-body,
html[data-theme="dark"] .widget-chart-container {
  background: transparent;
  color: var(--dm-text);
}

/* tarjetas de color de la app: se mantienen, con una sombra acorde */
html[data-theme="dark"] .usage.usage-dark,
html[data-theme="dark"] .usage.usage-primary {
  box-shadow: 0 16px 34px -22px rgba(0, 0, 0, .95);
}

html[data-theme="dark"] .progress {
  background-color: var(--dm-surface-3);
}

html[data-theme="dark"] .user-stats-avatar .icon,
html[data-theme="dark"] .user-stats-avatar .icon span {
  color: var(--dm-ink);
}

/* notificaciones */
html[data-theme="dark"] .carousel-inside {
  border-top-color: var(--dm-line);
}

html[data-theme="dark"] .carousel-item,
html[data-theme="dark"] .carousel-inside .header {
  color: var(--dm-text);
}

html[data-theme="dark"] .carousel-inside .header {
  color: var(--dm-ink);
}

html[data-theme="dark"] .carousel-indicators li {
  background-color: #4a545b;
}

html[data-theme="dark"] .carousel-indicators li.active {
  background-color: var(--dm-accent);
}

html[data-theme="dark"] .carousel-c-next,
html[data-theme="dark"] .carousel-c-prev {
  color: #5d6870;
}

html[data-theme="dark"] .carousel-c-next:hover,
html[data-theme="dark"] .carousel-c-prev:hover {
  color: var(--dm-ink);
}

/* ------------------------------------------------------------------ botones */
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-light {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-line);
  color: var(--dm-text);
}

html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .btn-secondary:focus,
html[data-theme="dark"] .btn-light:hover,
html[data-theme="dark"] .btn-secondary:not(:disabled):not(.disabled):active {
  background-color: var(--dm-surface-3);
  border-color: #3a444b;
  color: var(--dm-ink);
}

html[data-theme="dark"] .btn-dark {
  background-color: #2b343a;
  border-color: #3a444b;
  color: var(--dm-ink);
}

html[data-theme="dark"] .btn-dark:hover,
html[data-theme="dark"] .btn-dark:focus {
  background-color: #353f46;
  border-color: #4a555d;
  color: #fff;
}

/* ------------------------------------------------------------------ formularios */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .custom-select,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background-color: var(--dm-input);
  border-color: #333c43;
  color: var(--dm-ink);
}

html[data-theme="dark"] .custom-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%238a979f' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 8px 10px;
}

html[data-theme="dark"] select option {
  background-color: var(--dm-surface);
  color: var(--dm-ink);
}

html[data-theme="dark"] .form-control::placeholder {
  color: #66737b;
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .custom-select:focus {
  background-color: var(--dm-input);
  border-color: var(--dm-accent);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, .06);
  color: var(--dm-ink);
}

html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly] {
  background-color: var(--dm-surface-2);
}

html[data-theme="dark"] .col-form-label,
html[data-theme="dark"] label,
html[data-theme="dark"] .custom-control-label {
  color: var(--dm-text);
}

html[data-theme="dark"] .custom-control-label::before {
  background-color: var(--dm-input);
  border-color: #46525a;
}

html[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(.8);
}

html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:focus,
html[data-theme="dark"] input:-webkit-autofill:hover {
  -webkit-text-fill-color: var(--dm-ink);
  -webkit-box-shadow: 0 0 0 40px var(--dm-input) inset;
}

html[data-theme="dark"] .invalid-feedback {
  color: var(--dm-ko);
}

/* switches de la app (táctil, daltónico) */
html[data-theme="dark"] .switch-button {
  background-color: #3a444b;
  border-color: #3a444b;
}

/* ------------------------------------------------------------------ acceso, registro y recuperación */
html[data-theme="dark"] .main-supercontainer.page-login .splash-container .form-message,
html[data-theme="dark"] .splash-container .form-message {
  background-color: rgba(14, 18, 20, .88);
}

html[data-theme="dark"] .splash-container .input-group {
  border-color: #3a444b;
}

html[data-theme="dark"] .main-supercontainer.reg,
html[data-theme="dark"] .main-supercontainer.reg .main-content {
  background-color: var(--dm-bg);
}

html[data-theme="dark"] .fuelux .wizard,
html[data-theme="dark"] .fuelux .wizard > .steps-container,
html[data-theme="dark"] .fuelux .wizard > .step-content,
html[data-theme="dark"] .fuelux .wizard .steps li,
html[data-theme="dark"] .fuelux .wizard > .actions {
  background-color: var(--dm-surface);
  border-color: var(--dm-line);
  color: var(--dm-text);
}

html[data-theme="dark"] .fuelux .wizard .steps li .chevron::before {
  border-left-color: var(--dm-surface);
}

html[data-theme="dark"] .fuelux .wizard .steps li .chevron {
  border-left-color: var(--dm-line);
}

html[data-theme="dark"] .fuelux .wizard .steps li.active {
  background-color: var(--dm-surface-3);
  color: var(--dm-ink);
}

html[data-theme="dark"] .fuelux .wizard .steps li.active .chevron::before {
  border-left-color: var(--dm-surface-3);
}

/* ------------------------------------------------------------------ plantilla de respuestas */
html[data-theme="dark"] .responsesheet .card,
html[data-theme="dark"] #ver_form,
html[data-theme="dark"] #answ_form {
  background-color: var(--dm-surface);
}

html[data-theme="dark"] .pfila:nth-child(odd) {
  background-color: var(--dm-surface);
}

html[data-theme="dark"] .pfila:nth-child(even) {
  background-color: var(--dm-surface-2);
}

html[data-theme="dark"] .numtit,
html[data-theme="dark"] .titres,
html[data-theme="dark"] .titpart {
  color: var(--dm-ink);
}

html[data-theme="dark"] .square {
  background-color: var(--dm-input);
  border-color: #3a444b;
  color: #9aa6ad;
}

html[data-theme="dark"] .square:hover {
  border-color: var(--dm-accent);
  color: var(--dm-ink);
}

html[data-theme="dark"] .square.marked,
html[data-theme="dark"] .square.marked:hover {
  background: var(--dm-accent);
  border-color: var(--dm-accent);
  color: #0e1214;
  font-weight: 700;
}

html[data-theme="dark"] .inpval,
html[data-theme="dark"] .responsesheet.analogic .inpval {
  background-color: var(--dm-input);
  border-color: #3a444b;
  color: var(--dm-ink);
}

html[data-theme="dark"] .nav-answersSummary {
  background-color: var(--dm-surface);
  border-top-color: var(--dm-line) !important;
  color: var(--dm-text) !important;
}

/* ------------------------------------------------------------------ espera */
html[data-theme="dark"] .mai-error,
html[data-theme="dark"] .mai-error .error-container {
  background-color: var(--dm-bg);
  color: var(--dm-text);
}

html[data-theme="dark"] .mai-error .error-description,
html[data-theme="dark"] .mai-error .error-goback-text {
  color: var(--dm-ink);
}

/* ------------------------------------------------------------------ preguntas de reserva y desglose */
html[data-theme="dark"] .reserve_indicator {
  border-bottom-color: var(--dm-line);
}

html[data-theme="dark"] .reserve_indicator.questState_RIGHT {
  background-color: transparent;
}

html[data-theme="dark"] .reserve_question,
html[data-theme="dark"] .reserve_num {
  color: var(--dm-text);
}

html[data-theme="dark"] .reserve_correct,
html[data-theme="dark"] .reserve_selected {
  border-color: #46525a;
  color: var(--dm-ink);
}

html[data-theme="dark"] .questState_RIGHT .reserve_result,
html[data-theme="dark"] .indicator-item-icon .s7-RIGHT {
  color: var(--dm-ok);
}

html[data-theme="dark"] .questState_WRONG .reserve_result,
html[data-theme="dark"] .indicator-item-icon .s7-WRONG {
  color: var(--dm-ko);
}

html[data-theme="dark"] .questState_INVALIDATED .reserve_result,
html[data-theme="dark"] .indicator-item-icon .s7-INVALIDATED {
  color: #c9d2d7;
}

html[data-theme="dark"] .questState_WHITE .reserve_result,
html[data-theme="dark"] .indicator-item-icon .s7-WHITE {
  color: #66737b;
}

html[data-theme="dark"] .indicator-item,
html[data-theme="dark"] .widget-indicators .indicator-item {
  border-color: var(--dm-line);
  color: var(--dm-text);
}

html[data-theme="dark"] .indicator-value-counter,
html[data-theme="dark"] .indicator-item-value {
  color: var(--dm-ink);
}

/* ------------------------------------------------------------------ tablas */
html[data-theme="dark"] .table,
html[data-theme="dark"] table.dataTable {
  color: var(--dm-text);
  background-color: transparent;
}

html[data-theme="dark"] .table th,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered td,
html[data-theme="dark"] .table-bordered th {
  border-color: var(--dm-line-soft) !important;
}

html[data-theme="dark"] .table thead th {
  background-color: var(--dm-surface-2);
  color: var(--dm-muted);
}

html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, .025);
}

html[data-theme="dark"] .table-hover tbody tr:hover,
html[data-theme="dark"] table.dataTable th:hover {
  background-color: var(--dm-surface-3) !important;
  color: var(--dm-ink);
}

html[data-theme="dark"] .card-table tr td:first-child {
  color: var(--dm-ink);
}

/* ------------------------------------------------------------------ ajustes */
html[data-theme="dark"] .list-group-item {
  background-color: transparent;
  border-color: var(--dm-line-soft);
  color: var(--dm-text);
}

html[data-theme="dark"] .list-group-item-action:hover,
html[data-theme="dark"] .list-group-item-action:focus {
  background-color: var(--dm-surface-2);
  color: var(--dm-ink);
}

html[data-theme="dark"] .list-group-item .icon {
  color: var(--dm-accent);
}

/* ------------------------------------------------------------------ menú */
html[data-theme="dark"] .navMenu,
html[data-theme="dark"] .navMenu .nav-tabs.nav-darked,
html[data-theme="dark"] .nav-tabs.nav-darked {
  background-color: #0a0d0f;
  border-color: var(--dm-line-soft);
}

html[data-theme="dark"] .navMenu .nav-tabs.nav-darked .nav-link {
  color: var(--dm-muted);
  border-color: transparent;
}

html[data-theme="dark"] .navMenu .nav-tabs.nav-darked .nav-link:hover {
  color: var(--dm-ink);
}

html[data-theme="dark"] .navMenu .nav-tabs.nav-darked .nav-link.active {
  background-color: var(--dm-surface-2);
  color: var(--dm-ink);
  box-shadow: inset 3px 0 0 var(--dm-accent);
}

html[data-theme="dark"] .navMenu .nav-text-icon {
  color: var(--dm-accent);
}

@media (max-width: 699.98px) {
  html[data-theme="dark"] .navMenu .nav-tabs.nav-darked .nav-link.active {
    box-shadow: inset 0 3px 0 var(--dm-accent);
  }

  html[data-theme="dark"] .navMenu {
    border-top: 1px solid var(--dm-line-soft);
  }
}

/* ------------------------------------------------------------------ gráficos */
html[data-theme="dark"] .c3 text,
html[data-theme="dark"] .c3 .tick text,
html[data-theme="dark"] .c3-legend-item text {
  fill: var(--dm-text);
}

html[data-theme="dark"] .c3 path.domain,
html[data-theme="dark"] .c3 .tick line,
html[data-theme="dark"] .c3 line,
html[data-theme="dark"] .c3-grid line {
  stroke: var(--dm-line);
}

html[data-theme="dark"] .c3-chart-arc path {
  stroke: var(--dm-surface);
}

html[data-theme="dark"] .c3-chart-arcs-background {
  fill: #2a3238;
  stroke: none;
}

html[data-theme="dark"] .c3-chart-arcs-title,
html[data-theme="dark"] .c3-gauge-value {
  fill: var(--dm-ink) !important;
}

html[data-theme="dark"] .c3-chart-arc text {
  fill: #fff;
}

html[data-theme="dark"] .c3-tooltip {
  background-color: var(--dm-surface-2);
  color: var(--dm-ink);
}

html[data-theme="dark"] .c3-tooltip th {
  background-color: var(--dm-surface-3);
  color: var(--dm-ink);
}

html[data-theme="dark"] .c3-tooltip td {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-line);
  color: var(--dm-text);
}

html[data-theme="dark"] .c3-tooltip-container {
  background-color: var(--dm-surface-3);
}

/* ------------------------------------------------------------------ ventanas */
html[data-theme="dark"] .modal-backdrop.show {
  background-color: #000;
  opacity: .65;
}

html[data-theme="dark"] .modal-content {
  background-color: var(--dm-surface);
  border: 1px solid var(--dm-line);
  color: var(--dm-text);
  box-shadow: 0 26px 60px -24px rgba(0, 0, 0, .95);
}

html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
  border-color: var(--dm-line);
}

html[data-theme="dark"] .modal-title,
html[data-theme="dark"] .modal-body h3,
html[data-theme="dark"] .modal-body h5 {
  color: var(--dm-ink);
}

html[data-theme="dark"] .modal .close {
  color: var(--dm-ink);
  text-shadow: none;
  opacity: .7;
}

html[data-theme="dark"] .modal .close:hover {
  opacity: 1;
}

html[data-theme="dark"] .tooltip-inner {
  background-color: var(--dm-surface-3);
  color: var(--dm-ink);
}

html[data-theme="dark"] .list-group-item .badge,
html[data-theme="dark"] .badge-primary {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-accent);
  color: var(--dm-ink);
}

/* pies de tarjeta (indicadores, avisos) */
html[data-theme="dark"] .widget-indicators,
html[data-theme="dark"] .widget-info,
html[data-theme="dark"] .widget-footer,
html[data-theme="dark"] .widget .widget-indicators .indicator-item,
html[data-theme="dark"] .card-footer {
  background-color: var(--dm-surface-2);
  border-color: var(--dm-line-soft);
  color: var(--dm-text);
}

html[data-theme="dark"] .widget-indicators .indicator-value-title,
html[data-theme="dark"] .widget-indicators span {
  color: var(--dm-text);
}

html[data-theme="dark"] .tab-pane p,
html[data-theme="dark"] .card-body p,
html[data-theme="dark"] .widget p {
  color: var(--dm-text);
}

/* ------------------------------------------------------------------ interruptor «Modo oscuro» (los dos modos) */
.list-group-item.nx-theme-item {
  align-items: center;
  cursor: pointer;
  user-select: none;
}

.nx-theme-item .nx-theme-label {
  flex: 1;
}

.nx-theme-item .nx-theme-state {
  margin-left: 8px;
  color: #8a979f;
  font-size: .85em;
  white-space: nowrap;
}

.nx-theme-item .nx-switch {
  position: relative;
  flex: 0 0 auto;
  width: 40px;
  height: 22px;
  margin-left: 10px;
  border-radius: 99px;
  background-color: #c9cfd3;
  transition: background-color .2s ease;
}

.nx-theme-item .nx-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  transition: transform .2s ease;
}

.nx-theme-item[aria-checked="true"] .nx-switch {
  background-color: var(--dm-accent, var(--btlight, #cbd300));
}

.nx-theme-item[aria-checked="true"] .nx-switch::after {
  transform: translateX(18px);
}

.nx-theme-item:focus-visible {
  outline: 2px solid var(--dm-accent, var(--btlight, #cbd300));
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  html.nx-theme-switching,
  html.nx-theme-switching * {
    transition: none !important;
  }
}