/* =============================================================================
 * Host palette · Teitco.com (company id = 1)  ·  https://teitco.com
 * Brand: blue #202F52 + yellow #FFCF0E.
 * ========================================================================== */
:root {
  /* ---- Colores base (EDITA AQUÍ) ---------------------------------------- */
  --c-primary: #ffcb00;         /* botones / CTA (amarillo de marca) */
  --c-primary-rgb: 255, 203, 0;
  --c-primary-hover: #e6b700;
  --c-accent: #ffcb00;          /* amarillo de marca */
  --c-accent-rgb: 255, 203, 0;
  --c-dark: #202f52;
  --c-dark-2: #16203a;
  --c-link: #202f52;            /* el amarillo es ilegible como texto; los links usan el azul */
  --c-link-hover: #b58f00;

  /* ---- Mapeo a tokens del tema (no editar) ------------------------------ */
  --brand-primary: var(--c-primary);
  --brand-primary-rgb: var(--c-primary-rgb);
  --brand-primary-hover: var(--c-primary-hover);
  --brand-accent: var(--c-accent);
  --brand-accent-rgb: var(--c-accent-rgb);

  --sidebar-bg: var(--c-dark);
  --sidebar-bg-gradient: linear-gradient(180deg, var(--c-dark) 0%, var(--c-dark-2) 100%);
  --cui-dark: var(--c-dark);
  --cui-dark-start: var(--c-dark);
  --cui-dark-stop: var(--c-dark-2);

  --link-color: var(--c-link);
  --link-hover-color: var(--c-link-hover);

  /* ---- Botones: marca amarilla para casi todo (danger queda rojo) ------- */
  --color-success: var(--c-primary);
  --color-success-rgb: var(--c-primary-rgb);
  --color-info: var(--c-primary);
  --color-info-rgb: var(--c-primary-rgb);
  --color-warning: var(--c-primary);
  --color-warning-rgb: var(--c-primary-rgb);
  --color-secondary: #202f52;
  --color-secondary-rgb: 32, 47, 82;

  /* Botones "light" (utilidad/secundarios) sólidos con la marca.
     Amarillo + blanco es ilegible, se usa el azul de marca como texto
     (mismo criterio que .btn-primary/.btn-success más abajo). */
  --btn-light-bg: var(--c-primary);
  --btn-light-color: var(--c-dark);
}

/* El amarillo necesita texto oscuro en primary/success (main.css los pone blancos).
   info/warning ya van con texto oscuro por defecto -> legibles sobre amarillo. */
.btn-primary, .btn-primary:hover,
.btn-success, .btn-success:hover { color: #212529 !important; }
