/**
 * Obsidian Lux — modales / dropdowns (Fase 2)
 */

html[data-theme="obsidian-lux"] .modal-backdrop.show {
  background-color: color-mix(in srgb, #020617 72%, transparent);
}

html[data-theme="obsidian-lux"] .modal-content {
  background-color: var(--bg-card);
  border: 1px solid var(--border-primary);
  border-radius: var(--radius-lg);
  color: var(--text-secondary);
  box-shadow: var(--shadow-soft);
}

html[data-theme="obsidian-lux"] .modal-header,
html[data-theme="obsidian-lux"] .modal-footer {
  background-color: var(--bg-card);
  border-color: var(--border-primary);
}

html[data-theme="obsidian-lux"] .modal-title {
  color: var(--text-primary);
  font-weight: 700;
}

html[data-theme="obsidian-lux"] .modal-body {
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .modal-body .form-label {
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .clientes-admin-saas .modal-cliente-saas .modal-content {
  background-color: var(--olx-card);
  border-color: var(--olx-border);
  box-shadow: var(--shadow-soft);
}

html[data-theme="obsidian-lux"] .clientes-admin-saas .modal-cliente-saas .modal-header {
  background-color: var(--olx-surface);
  border-bottom-color: var(--olx-border);
}

html[data-theme="obsidian-lux"] .clientes-admin-saas .modal-cliente-saas .modal-title {
  color: var(--olx-text);
}

html[data-theme="obsidian-lux"] .clientes-admin-saas .modal-cliente-saas .modal-body,
html[data-theme="obsidian-lux"] .clientes-admin-saas .modal-cliente-saas .modal-footer {
  background-color: var(--olx-card);
  border-color: var(--olx-border);
  color: var(--olx-text-secondary);
}

/* Dropdowns */
html[data-theme="obsidian-lux"] .dropdown-menu {
  background-color: var(--bg-elevated);
  border: 1px solid var(--border-primary);
  box-shadow: var(--shadow-soft);
  padding: 0.35rem 0;
}

html[data-theme="obsidian-lux"] .dropdown-header {
  color: var(--text-muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

html[data-theme="obsidian-lux"] .dropdown-item {
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .dropdown-item:hover,
html[data-theme="obsidian-lux"] .dropdown-item:focus {
  background-color: color-mix(in srgb, var(--text-primary) 5%, transparent);
  color: var(--text-primary);
}

html[data-theme="obsidian-lux"] .dropdown-item.active,
html[data-theme="obsidian-lux"] .dropdown-item:active {
  background-color: color-mix(in srgb, var(--accent-primary) 22%, var(--bg-elevated));
  color: var(--text-primary);
}

html[data-theme="obsidian-lux"] .dropdown-item.disabled,
html[data-theme="obsidian-lux"] .dropdown-item:disabled {
  color: var(--text-muted);
}

html[data-theme="obsidian-lux"] .dropdown-divider {
  border-color: var(--border-primary);
}

html[data-theme="obsidian-lux"] .alert {
  border-width: 1px;
  border-color: var(--border-primary);
  color: var(--text-secondary);
}

html[data-theme="obsidian-lux"] .alert-success {
  background-color: color-mix(in srgb, var(--success) 12%, var(--bg-card));
  border-color: color-mix(in srgb, var(--success) 28%, var(--border-primary));
  color: color-mix(in srgb, var(--accent-hover) 45%, var(--text-primary));
}

html[data-theme="obsidian-lux"] .alert-danger {
  background-color: color-mix(in srgb, var(--danger) 12%, var(--bg-card));
  border-color: color-mix(in srgb, var(--danger) 28%, var(--border-primary));
  color: color-mix(in srgb, #fca5a5 40%, var(--text-primary));
}

html[data-theme="obsidian-lux"] .alert-warning {
  background-color: color-mix(in srgb, var(--warning) 12%, var(--bg-card));
  border-color: color-mix(in srgb, var(--warning) 28%, var(--border-primary));
  color: color-mix(in srgb, var(--text-secondary) 85%, var(--text-primary));
}

html[data-theme="obsidian-lux"] .alert-info {
  background-color: color-mix(in srgb, var(--bg-elevated) 90%, var(--text-primary) 10%);
  border-color: var(--border-strong);
  color: var(--text-secondary);
}