/* ============================================================
   simplify.css — Herramienta Simplificar (bg-success)
   ARQUITECTURA: ver ARQUITECTURA_CSS.md + GUIA_DARK_MODE_ARQUITECTURA.md
   ============================================================ */

/* ------------------------------------------------------------
   1. VARIABLES
   ------------------------------------------------------------ */
:root {
  --simplify-primary: #198754;
  --simplify-primary-hover: #1da362;
  --simplify-surface: #f0fff4;
  --simplify-border: #a3cfbb;
  --simplify-on-primary: #fff;
}

/* ------------------------------------------------------------
   2. BOTÓN PRINCIPAL
   ------------------------------------------------------------ */
.btn-tool-primary {
  background: var(--simplify-primary);
  color: var(--simplify-on-primary);
  border: 2px solid var(--simplify-primary);
}
.btn-tool-primary:hover,
.btn-tool-primary:focus {
  background: var(--simplify-primary-hover);
  border-color: var(--simplify-primary-hover);
  color: var(--simplify-on-primary);
}

/* Botones de tolerancia rápida */
.tolerance-quick-select {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

/* ------------------------------------------------------------
   3. DARK MODE
   ------------------------------------------------------------ */
[data-bs-theme='dark'] {
  --simplify-primary: #32c759;
  --simplify-primary-hover: #4dd96e;
  --simplify-surface: #0a2218;
  --simplify-border: #198754;
  --simplify-on-primary: #fff;
}

[data-bs-theme='dark'] .btn-tool-primary {
  box-shadow: 0 0 20px rgba(50, 199, 89, 0.3);
}
[data-bs-theme='dark'] .btn-tool-primary:hover {
  box-shadow: 0 0 28px rgba(50, 199, 89, 0.5);
}

[data-bs-theme='dark'] .tool-card {
  background-color: var(--color-surface-variant);
  border-color: var(--simplify-border);
}

[data-bs-theme='dark'] .card-header.bg-success {
  background-color: #0a3520 !important;
  color: var(--simplify-primary) !important;
}

[data-bs-theme='dark'] .tolerance-quick-select .btn-outline-secondary {
  color: var(--color-on-surface-variant);
  border-color: var(--color-outline-variant);
}
