:root {
  /* Marca CIDTI: la paleta institucional gobierna estados, énfasis y superficies. */
  --cidti-cyan: #33cccc;
  --cidti-gray: #636569;
  --cidti-white: #ffffff;
  --cidti-orange: #ea5b13;
  --cidti-gradient-blue: #5183c4;
  --cidti-blue: var(--cidti-gradient-blue);

  --color-brand-primary: var(--cidti-cyan);
  --color-brand-primary-dark: #249c9c;
  --color-brand-primary-soft: #e4fbfb;
  --color-brand-accent: var(--cidti-orange);
  --color-brand-accent-soft: #fff0e8;
  --color-brand-gradient:
    linear-gradient(
      135deg,
      var(--color-brand-primary) 0%,
      var(--color-brand-primary) 80%,
      var(--cidti-gradient-blue) 100%
    );
  --color-brand-gradient-soft:
    linear-gradient(
      135deg,
      rgb(51 204 204 / 0.14) 0%,
      rgb(51 204 204 / 0.14) 80%,
      rgb(81 131 196 / 0.14) 100%
    );
  --color-brand-support: var(--cidti-blue);
  --color-brand-support-soft: #edf5ff;
  --color-batch-support: var(--color-brand-support);
  --color-batch-support-soft: var(--color-brand-support-soft);
  --color-batch-support-border: #bad5f2;
  --color-batch-accent: var(--color-brand-primary-dark);
  --color-batch-accent-soft: color-mix(in srgb, white 84%, var(--color-brand-primary) 16%);
  --color-batch-panel: color-mix(in srgb, white 90%, var(--color-brand-primary) 10%);
  --color-batch-panel-strong: color-mix(in srgb, white 82%, var(--color-brand-support) 18%);
  --color-batch-zip-surface:
    linear-gradient(
      180deg,
      color-mix(in srgb, white 96%, var(--color-brand-support) 4%) 0%,
      color-mix(in srgb, white 90%, var(--color-brand-primary) 10%) 100%
    );
  --color-batch-rules-surface:
    linear-gradient(
      180deg,
      color-mix(in srgb, white 96%, var(--color-brand-accent) 4%) 0%,
      color-mix(in srgb, white 90%, var(--color-brand-support) 10%) 100%
    );
  --color-batch-rules-border: color-mix(in srgb, var(--color-brand-accent) 34%, white);

  --color-text: #263238;
  --color-text-muted: var(--cidti-gray);
  --color-text-subtle: #7a7d80;
  --color-surface: var(--cidti-white);
  --color-surface-muted: #f6f8f9;
  --color-surface-raised: #ffffff;
  --color-border: #dce3e5;
  --color-border-strong: #b8c5c9;
  --color-overlay: rgb(38 50 56 / 0.58);

  --color-info: var(--cidti-blue);
  --color-info-bg: var(--color-brand-support-soft);
  --color-info-border: #bad5f2;
  --color-success: #15803d;
  --color-success-bg: #e8f7ee;
  --color-success-border: #a8dfbb;
  --color-batch-success: var(--color-success);
  --color-batch-success-bg: var(--color-success-bg);
  --color-batch-success-border: var(--color-success-border);
  --color-warning: #b45309;
  --color-warning-bg: #fff7df;
  --color-warning-border: #f3d37b;
  --color-batch-warning: var(--color-warning);
  --color-batch-warning-bg: var(--color-warning-bg);
  --color-batch-warning-border: var(--color-warning-border);
  --color-error: #b42318;
  --color-error-bg: #fff0ed;
  --color-error-border: #f0b5ad;
  --color-batch-error: var(--color-error);
  --color-batch-error-bg: var(--color-error-bg);
  --color-batch-error-border: var(--color-error-border);
}