/*
 * Contratto cromatico condiviso.
 *
 * Ogni famiglia espone:
 * - --color-X: fondo pieno e riferimento cromatico;
 * - --color-X-soft: fondo chiaro e testo sul fondo pieno;
 * - --color-X-border: bordo;
 * - --color-X-text: testo sul fondo chiaro.
 *
 * .tone non disegna componenti: trasporta i quattro valori in --tone-*.
 * Ogni componente concreto collega poi --tone-* alle proprie variabili locali.
 */

:root {
  /* Magenta ABAFR: riferimento identitario non usato come fondo di testo. */
  --brand-magenta: #C542FF;

  /* Famiglie generiche e semantiche. */
  --color-default: #1A1A1A;
  --color-default-soft: #F1F1EF;
  --color-default-border: #DCDCD9;
  --color-default-text: #1A1A1A;

  --color-gray: #4D4C47;
  --color-gray-soft: #EBECED;
  --color-gray-border: #C8C9CA;
  --color-gray-text: #4D4C47;

  --color-brown: #6B3825;
  --color-brown-soft: #E9E5E3;
  --color-brown-border: #CDB6A9;
  --color-brown-text: #6B3825;

  --color-yellow: #8A5D00;
  --color-yellow-soft: #FBF3DB;
  --color-yellow-border: #E1C179;
  --color-yellow-text: #8A5D00;

  --color-purple: #6B478A;
  --color-purple-soft: #E8DEEE;
  --color-purple-border: #BEA1D2;
  --color-purple-text: #6B478A;

  --color-pink: #8E3061;
  --color-pink-soft: #F5E0E9;
  --color-pink-border: #DCA0BD;
  --color-pink-text: #8E3061;

  --color-ok: #2F5E44;
  --color-ok-soft: #DDEDEA;
  --color-ok-border: #9BC4B5;
  --color-ok-text: #2F5E44;

  --color-error: #A8302B;
  --color-error-soft: #FFE2DD;
  --color-error-border: #EE9D96;
  --color-error-text: #A8302B;

  --color-warning: #A55600;
  --color-warning-soft: #FFF1D3;
  --color-warning-border: #E9B787;
  --color-warning-text: #A55600;

  --color-info: #1F5D80;
  --color-info-soft: #D3E5EF;
  --color-info-border: #8DB8D6;
  --color-info-text: #1F5D80;

  /* Magenta operativo ABAFR, scurito per poter usare --color-primary-soft sul pieno. */
  --color-primary: #8C1AB3;
  --color-primary-soft: #F5DDFF;
  --color-primary-border: #E3A4FF;
  --color-primary-text: #5D0074;

  /* Trimestri. */
  --color-t1: #006D75;
  --color-t1-soft: #D8EFF0;
  --color-t1-border: #7DBEC3;
  --color-t1-text: #004B51;

  --color-t2: #4C55A5;
  --color-t2-soft: #E2E5F7;
  --color-t2-border: #A1A8DC;
  --color-t2-text: #323A73;

  --color-t3: #87446F;
  --color-t3-soft: #F1DFE9;
  --color-t3-border: #C99AB8;
  --color-t3-text: #5D294A;

  /* Fasce orarie. */
  --color-am: #1F5D80;
  --color-am-soft: #B9DEEC;
  --color-am-border: #8FC8DC;
  --color-am-text: #1F5D80;

  --color-pm: #6E4D2C;
  --color-pm-soft: #DCCBB9;
  --color-pm-border: #BEA083;
  --color-pm-text: #6E4D2C;

  --color-extra: #4D4187;
  --color-extra-soft: #D7D2EC;
  --color-extra-border: #ACA3D0;
  --color-extra-text: #4D4187;

  --color-empty: #596778;
  --color-empty-soft: #EEF1F7;
  --color-empty-border: #DBE1EC;
  --color-empty-text: #596778;
}

.tone {
  --tone-color: var(--color-default);
  --tone-soft: var(--color-default-soft);
  --tone-border: var(--color-default-border);
  --tone-text: var(--color-default-text);
}

.tone.primary,
.tone.institutional,
.tone.magenta {
  --tone-color: var(--color-primary);
  --tone-soft: var(--color-primary-soft);
  --tone-border: var(--color-primary-border);
  --tone-text: var(--color-primary-text);
}

.tone.default {
  --tone-color: var(--color-default);
  --tone-soft: var(--color-default-soft);
  --tone-border: var(--color-default-border);
  --tone-text: var(--color-default-text);
}

.tone.neutral,
.tone.gray {
  --tone-color: var(--color-gray);
  --tone-soft: var(--color-gray-soft);
  --tone-border: var(--color-gray-border);
  --tone-text: var(--color-gray-text);
}

.tone.earth,
.tone.brown {
  --tone-color: var(--color-brown);
  --tone-soft: var(--color-brown-soft);
  --tone-border: var(--color-brown-border);
  --tone-text: var(--color-brown-text);
}

.tone.highlight,
.tone.yellow {
  --tone-color: var(--color-yellow);
  --tone-soft: var(--color-yellow-soft);
  --tone-border: var(--color-yellow-border);
  --tone-text: var(--color-yellow-text);
}

.tone.secondary,
.tone.purple,
.tone.unavailable,
.tone.no-blocks {
  --tone-color: var(--color-purple);
  --tone-soft: var(--color-purple-soft);
  --tone-border: var(--color-purple-border);
  --tone-text: var(--color-purple-text);
}

.tone.accent,
.tone.pink {
  --tone-color: var(--color-pink);
  --tone-soft: var(--color-pink-soft);
  --tone-border: var(--color-pink-border);
  --tone-text: var(--color-pink-text);
}

.tone.success,
.tone.ok,
.tone.green {
  --tone-color: var(--color-ok);
  --tone-soft: var(--color-ok-soft);
  --tone-border: var(--color-ok-border);
  --tone-text: var(--color-ok-text);
}

.tone.danger,
.tone.error,
.tone.red {
  --tone-color: var(--color-error);
  --tone-soft: var(--color-error-soft);
  --tone-border: var(--color-error-border);
  --tone-text: var(--color-error-text);
}

.tone.warning,
.tone.orange {
  --tone-color: var(--color-warning);
  --tone-soft: var(--color-warning-soft);
  --tone-border: var(--color-warning-border);
  --tone-text: var(--color-warning-text);
}

.tone.info,
.tone.processing,
.tone.blue {
  --tone-color: var(--color-info);
  --tone-soft: var(--color-info-soft);
  --tone-border: var(--color-info-border);
  --tone-text: var(--color-info-text);
}

.tone.t1 {
  --tone-color: var(--color-t1);
  --tone-soft: var(--color-t1-soft);
  --tone-border: var(--color-t1-border);
  --tone-text: var(--color-t1-text);
}

.tone.t2 {
  --tone-color: var(--color-t2);
  --tone-soft: var(--color-t2-soft);
  --tone-border: var(--color-t2-border);
  --tone-text: var(--color-t2-text);
}

.tone.t3 {
  --tone-color: var(--color-t3);
  --tone-soft: var(--color-t3-soft);
  --tone-border: var(--color-t3-border);
  --tone-text: var(--color-t3-text);
}

.tone.am {
  --tone-color: var(--color-am);
  --tone-soft: var(--color-am-soft);
  --tone-border: var(--color-am-border);
  --tone-text: var(--color-am-text);
}

.tone.pm {
  --tone-color: var(--color-pm);
  --tone-soft: var(--color-pm-soft);
  --tone-border: var(--color-pm-border);
  --tone-text: var(--color-pm-text);
}

.tone.extra {
  --tone-color: var(--color-extra);
  --tone-soft: var(--color-extra-soft);
  --tone-border: var(--color-extra-border);
  --tone-text: var(--color-extra-text);
}

.tone.empty {
  --tone-color: var(--color-empty);
  --tone-soft: var(--color-empty-soft);
  --tone-border: var(--color-empty-border);
  --tone-text: var(--color-empty-text);
}