@charset "UTF-8";

/* src/styles.scss */
:root {
  color-scheme: light;
  --fond: #fafaf9;
  --surface: #ffffff;
  --surface-2: #f4f4f2;
  --trait: #e3e3df;
  --trait-fort: #c8c8c2;
  --grille: #ededea;
  --ombre-posee: 0 1px 2px rgb(41 37 33 / 7%), 0 3px 10px rgb(41 37 33 / 6%);
  --ombre-flottante: 0 4px 12px rgb(41 37 33 / 10%), 0 14px 32px rgb(41 37 33 / 8%);
  --arete: transparent;
  --encre: #191917;
  --encre-doux: #5a5a54;
  --encre-faible: #8d8d86;
  --vert: #2e7d32;
  --vert-fonce: #1b5e20;
  --encre-action: #ffffff;
  --barre-haut: #0c3a19;
  --barre-bas: #175c2c;
  --barre: #103f1d;
  --barre-trait: rgb(255 255 255 / 13%);
  --barre-encre: #f3f9f2;
  --barre-doux: #bcd6c0;
  --barre-faible: #85ad8c;
  --barre-actif-fond: rgb(255 255 255 / 14%);
  --barre-actif-encre: #ffffff;
  --barre-tuile: rgb(255 255 255 / 8%);
  --o1: #8dbf90;
  --o2: #5fa163;
  --o3: #38853d;
  --o4: #1b5e20;
  --c1: #2a78d6;
  --c2: #eb6834;
  --c3: #4a3aa7;
  --alerte: #b06000;
  --critique: #b91c1c;
  --critique-pale: #fdf2f2;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) {
    color-scheme: dark;
    --fond: #0c0c0b;
    --surface: #1c1c1a;
    --surface-2: #262624;
    --trait: #2f2f2c;
    --trait-fort: #45443f;
    --grille: #262624;
    --ombre-posee: 0 1px 2px rgb(0 0 0 / 34%);
    --ombre-flottante: 0 6px 18px rgb(0 0 0 / 46%), 0 18px 40px rgb(0 0 0 / 34%);
    --arete: rgb(255 255 255 / 5%);
    --encre: #ecebe8;
    --encre-doux: #adaca5;
    --encre-faible: #81807a;
    --vert: #7cc47f;
    --vert-fonce: #a3d6a5;
    --encre-action: #121211;
    --barre-haut: #072711;
    --barre-bas: #0e401e;
    --barre: #0a3115;
    --barre-trait: rgb(255 255 255 / 11%);
    --barre-encre: #e7f0e6;
    --barre-doux: #a9c3ad;
    --barre-faible: #789b7f;
    --barre-actif-fond: rgb(255 255 255 / 12%);
    --barre-actif-encre: #ffffff;
    --barre-tuile: rgb(255 255 255 / 7%);
    --o1: #2e6b33;
    --o2: #3d8942;
    --o3: #64a568;
    --o4: #93c295;
    --c1: #3987e5;
    --c2: #d95926;
    --c3: #9085e9;
    --alerte: #d99a3c;
    --critique: #f87171;
    --critique-pale: #2a1717;
  }
}
:root[data-theme=dark] {
  color-scheme: dark;
  --fond: #0c0c0b;
  --surface: #1c1c1a;
  --surface-2: #262624;
  --trait: #2f2f2c;
  --trait-fort: #45443f;
  --grille: #262624;
  --ombre-posee: 0 1px 2px rgb(0 0 0 / 34%);
  --ombre-flottante: 0 6px 18px rgb(0 0 0 / 46%), 0 18px 40px rgb(0 0 0 / 34%);
  --arete: rgb(255 255 255 / 5%);
  --encre: #ecebe8;
  --encre-doux: #adaca5;
  --encre-faible: #81807a;
  --vert: #7cc47f;
  --vert-fonce: #a3d6a5;
  --encre-action: #121211;
  --barre-haut: #072711;
  --barre-bas: #0e401e;
  --barre: #0a3115;
  --barre-trait: rgb(255 255 255 / 11%);
  --barre-encre: #e7f0e6;
  --barre-doux: #a9c3ad;
  --barre-faible: #789b7f;
  --barre-actif-fond: rgb(255 255 255 / 12%);
  --barre-actif-encre: #ffffff;
  --barre-tuile: rgb(255 255 255 / 7%);
  --o1: #2e6b33;
  --o2: #3d8942;
  --o3: #64a568;
  --o4: #93c295;
  --c1: #3987e5;
  --c2: #d95926;
  --c3: #9085e9;
  --alerte: #d99a3c;
  --critique: #f87171;
  --critique-pale: #2a1717;
}
.premier,
.second,
.danger {
  height: 32px;
  padding: 0 13px;
  border-radius: 3px;
  font: inherit;
  font-size: 12.5px;
  cursor: pointer;
  flex-shrink: 0;
  white-space: nowrap;
}
.premier:disabled,
.second:disabled,
.danger:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.premier {
  border: 1px solid var(--vert-fonce);
  background: var(--vert-fonce);
  color: var(--encre-action);
  font-weight: 600;
}
.second {
  border: 1px solid var(--trait-fort);
  background: var(--surface);
  color: var(--encre);
}
.danger {
  border: 1px solid var(--critique);
  background: transparent;
  color: var(--critique);
  font-weight: 500;
}
.fermer {
  border: 1px solid var(--trait);
  border-radius: 3px;
  background: transparent;
  color: var(--encre-doux);
  font: inherit;
  font-size: 11.5px;
  padding: 5px 10px;
  cursor: pointer;
  white-space: nowrap;
}
.fermer:hover:not(:disabled) {
  color: var(--encre);
}
.fermer:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.entete {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}
.entete h1 {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.entete .micro {
  margin: 0 0 3px;
}
.titre-panneau {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--trait);
}
.titre-panneau h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}
.titre-panneau .detail {
  margin: 3px 0 0;
  max-width: 74ch;
}
.corps {
  padding: 14px 16px;
}
.vide {
  position: relative;
  padding: 22px 16px;
  color: var(--encre-doux);
  font-size: 12.5px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 150' opacity='.14' fill='none' stroke='%232e7d32' stroke-width='3'%3E%3Cpolygon points='170,30 145,73.3 95,73.3 70,30 95,-13.3 145,-13.3'/%3E%3Cpolygon points='215,112 190,155.3 140,155.3 115,112 140,68.7 190,68.7'/%3E%3Cpath d='M170 30h40M95 73.3l-25 43.3'/%3E%3Ccircle cx='214' cy='30' r='6' fill='%232e7d32' stroke='none'/%3E%3Ccircle cx='66' cy='120' r='6' fill='%232e7d32' stroke='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right -14px center;
  background-size: auto 88%;
}
.vide p,
.vide .detail {
  position: relative;
}
.vide p {
  margin: 0;
}
.vide .detail {
  margin-top: 4px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) .vide {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 150' opacity='.16' fill='none' stroke='%237cc47f' stroke-width='3'%3E%3Cpolygon points='170,30 145,73.3 95,73.3 70,30 95,-13.3 145,-13.3'/%3E%3Cpolygon points='215,112 190,155.3 140,155.3 115,112 140,68.7 190,68.7'/%3E%3Cpath d='M170 30h40M95 73.3l-25 43.3'/%3E%3Ccircle cx='214' cy='30' r='6' fill='%237cc47f' stroke='none'/%3E%3Ccircle cx='66' cy='120' r='6' fill='%237cc47f' stroke='none'/%3E%3C/svg%3E");
  }
}
:root[data-theme=dark] .vide {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 150' opacity='.16' fill='none' stroke='%237cc47f' stroke-width='3'%3E%3Cpolygon points='170,30 145,73.3 95,73.3 70,30 95,-13.3 145,-13.3'/%3E%3Cpolygon points='215,112 190,155.3 140,155.3 115,112 140,68.7 190,68.7'/%3E%3Cpath d='M170 30h40M95 73.3l-25 43.3'/%3E%3Ccircle cx='214' cy='30' r='6' fill='%237cc47f' stroke='none'/%3E%3Ccircle cx='66' cy='120' r='6' fill='%237cc47f' stroke='none'/%3E%3C/svg%3E");
}
.note {
  margin: 0;
  padding: 11px 16px;
  border-top: 1px solid var(--trait);
  font-size: 11.5px;
  color: var(--encre-faible);
  line-height: 1.5;
}
.detail {
  font-size: 11.5px;
  color: var(--encre-faible);
  line-height: 1.5;
}
.quoi {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 600;
}
.etat {
  font-size: 12.5px;
}
.etat.erreur {
  color: var(--critique);
}
.etat.succes {
  color: var(--vert-fonce);
  font-weight: 600;
}
.lignes {
  margin: 0;
  padding: 0;
  list-style: none;
}
.lignes > li {
  padding: 11px 16px;
  border-bottom: 1px solid var(--trait);
}
.lignes > li:last-child {
  border-bottom: 0;
}
.lignes .qui {
  min-width: 0;
}
.lignes .nom {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
}
.lignes .detail {
  margin: 2px 0 0;
}
.etiquette {
  padding: 3px 9px;
  border: 1px solid var(--trait-fort);
  border-radius: 999px;
  font-size: 10.5px;
  color: var(--encre-doux);
  white-space: nowrap;
}
.marqueur {
  font-size: 10.5px;
  color: var(--critique);
  font-weight: 600;
  white-space: nowrap;
}
.champ {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.champ input,
.champ select,
.champ textarea {
  height: 32px;
  padding: 0 9px;
  border: 1px solid var(--trait-fort);
  border-radius: 3px;
  background: var(--surface);
  color: var(--encre);
  font: inherit;
  font-size: 12.5px;
  min-width: 0;
}
.champ input:focus,
.champ select:focus,
.champ textarea:focus {
  outline: 2px solid var(--vert-fonce);
  outline-offset: -1px;
}
.champ textarea {
  height: auto;
  padding: 9px;
  line-height: 1.6;
  resize: vertical;
}
.outils {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  background: var(--fond);
  color: var(--encre);
  font-family:
    "IBM Plex Sans",
    "Segoe UI",
    system-ui,
    -apple-system,
    sans-serif;
  font-size: 13px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
.mono {
  font-family:
    "IBM Plex Mono",
    ui-monospace,
    "Cascadia Mono",
    monospace;
  font-variant-numeric: tabular-nums;
}
.micro {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: var(--encre-faible);
}
.panneau {
  background: var(--surface);
  border: 1px solid var(--trait);
  border-radius: 4px;
  box-shadow: inset 0 1px 0 var(--arete), var(--ombre-posee);
}
a {
  color: var(--vert-fonce);
  text-decoration: none;
}
a:hover {
  color: var(--vert);
}
:focus-visible {
  outline: 2px solid var(--vert);
  outline-offset: 1px;
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */
