/* Alpine.js: oculta elementos con x-cloak hasta que Alpine inicializa */
[x-cloak] { display: none !important; }

/* ── DATAi brand variables ─────────────────────────────────────────────────── */
:root {
  --brand-dark:        #1E2330;
  --brand-mid:         #272D3B;
  --brand-accent:      #44D62C;
  --brand-accent-h:    #35A823;
  --brand-accent-xl:   #E8FAE3;
}

/* ── Overrides: reemplaza indigo primario con brand green ──────────────────── */
/* Botones primarios */
.bg-indigo-600       { background-color: var(--brand-accent)   !important; }
.hover\:bg-indigo-700:hover { background-color: var(--brand-accent-h) !important; }

/* Links y textos de acción */
.text-indigo-600     { color: var(--brand-accent-h) !important; }
.hover\:text-indigo-500:hover { color: var(--brand-accent) !important; }
.text-indigo-700     { color: #2DA820 !important; }

/* Badge de tipo presupuesto (indigo-50 / indigo-700) */
.bg-indigo-50        { background-color: var(--brand-accent-xl) !important; }
.text-indigo-700.bg-indigo-50,
span.bg-indigo-50    { color: #1E7015 !important; }

/* Focus rings en formularios */
.focus\:ring-indigo-500:focus  { --tw-ring-color: var(--brand-accent) !important; }
.focus\:border-indigo-500:focus { border-color: var(--brand-accent) !important; }

/* Semáforos y badges que usan indigo */
.bg-indigo-100       { background-color: #D7FAD0 !important; }
.text-indigo-800     { color: #1B6314 !important; }

/* ── Estilos genéricos heredados ───────────────────────────────────────────── */

/* Sticky primera columna en tablas anchas */
.sticky-col {
  position: sticky;
  left: 0;
  z-index: 1;
}

/* Celda de matriz guardando */
.cell-saving {
  opacity: 0.5;
  pointer-events: none;
}

/* Contenedor scroll horizontal de matriz */
.matrix-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Plotly responsive */
.js-plotly-plot {
  width: 100% !important;
}
