/*
  Acta — registre d'entités.

  Parti pris : le référentiel est un REGISTRE, pas un explorateur de fichiers.
  Les fonds luxembourgeois se lisent sur des extraits RCS et des tableaux de
  compartiments, faits de codes (LEI, ISIN, RCS). Tout le registre est donc
  composé en monospace : les identifiants s'alignent d'eux-mêmes, colonne par
  colonne, comme sur les documents sources. L'interface (chrome, libellés,
  formulaires) reste en sans-serif système pour ne pas concurrencer les données.
*/

:root {
  --paper:    #E7EAED;
  --folio:    #F7F8FA;
  --ink:      #101922;
  --ink-2:    #55646F;
  --ink-3:    #8A98A3;
  --rule:     #CBD3D9;
  --rule-soft:#DFE5EA;
  --accent:   #0E5B55;
  --accent-2: #D6E3E1;
  --oxide:    #9E4023;
  --oxide-2:  #F0DFD8;

  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas,
          "Liberation Mono", monospace;
  --ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --rail-w: 1.45rem;
  --gutter-w: 5.25rem;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--ui);
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 2px; }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* ---------- Chrome ---------- */

.masthead {
  display: flex;
  align-items: baseline;
  gap: 1.25rem;
  padding: 1rem 1.75rem;
  border-bottom: 1px solid var(--rule);
  background: var(--folio);
}

.wordmark {
  font-family: var(--mono);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
}

.masthead__sub {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.masthead__spacer { flex: 1; }

.masthead__links {
  display: flex;
  gap: 1rem;
  font-size: 13px;
}

.shell {
  max-width: 1080px;
  margin: 0 auto;
  padding: 2rem 1.75rem 5rem;
}

/* ---------- Recherche ---------- */

.search {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: flex-end;
  margin-bottom: 1.5rem;
}

.field { display: flex; flex-direction: column; gap: 0.3rem; }

.field__label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}

input[type="search"], input[type="text"], input[type="date"], input[type="password"], select {
  font-family: var(--mono);
  font-size: 13px;
  color: var(--ink);
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: 0.45rem 0.6rem;
}

input[type="search"] { min-width: 18rem; }

.btn {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--folio);
  background: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 2px;
  padding: 0.5rem 0.9rem;
  cursor: pointer;
}

.btn--ghost { background: transparent; color: var(--accent); }

/* ---------- Liste d'entités ---------- */

.count {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 0.75rem;
}

.ledger {
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
}

.ledger__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 8rem 3rem 12rem;
  gap: 1rem;
  align-items: baseline;
  padding: 0.7rem 1rem;
  border-bottom: 1px solid var(--rule-soft);
  font-family: var(--mono);
  font-size: 13px;
}

.ledger__row:last-child { border-bottom: 0; }
.ledger__row:hover { background: #EFF3F4; }

.ledger__name { font-weight: 600; }
.ledger__name a { text-decoration: none; color: var(--ink); }
.ledger__name a:hover { text-decoration: underline; }

/* ---------- Folio : en-tête de structure ---------- */

.folio {
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
  overflow: hidden;
}

.folio__head {
  padding: 1.5rem 1.5rem 1.25rem;
  border-bottom: 1px solid var(--rule);
}

.folio__title {
  font-family: var(--mono);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 0.5rem;
}

.folio__ids {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.25rem;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--ink-2);
}

.folio__ids b {
  font-weight: 400;
  color: var(--ink-3);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 10px;
  margin-right: 0.35rem;
}

/* ---------- Barre de date ---------- */

.asof {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem 1.5rem;
  border-bottom: 1px solid var(--rule);
  background: #EDF1F2;
}

.asof__label {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.asof form { display: flex; gap: 0.5rem; align-items: center; }

.stamp {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.3rem 0.6rem;
  border: 1px solid var(--accent);
  color: var(--accent);
  border-radius: 2px;
}

/* Quand la date consultée n'est pas aujourd'hui, le folio devient une archive. */
.stamp--archive {
  border-color: var(--oxide);
  color: var(--oxide);
  background: var(--oxide-2);
}

.asof__spacer { flex: 1; }

.tally {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-2);
  letter-spacing: 0.04em;
}

/* ---------- Registre : l'arbre ---------- */

.register__head {
  display: flex;
  padding: 0.6rem 1.5rem 0.5rem;
  border-bottom: 1px solid var(--rule);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.register__head .eff { width: var(--gutter-w); text-align: right; padding-right: 1rem; }

.register { padding: 0.35rem 0 0.9rem; }

.row {
  display: flex;
  align-items: stretch;
  min-height: 2.05rem;
  padding: 0 1.5rem;
}

.row:hover { background: #EFF3F4; }

/* Gouttière de détention effective — la colonne qui rend la dilution lisible. */
.eff {
  width: var(--gutter-w);
  flex: none;
  padding: 0.3rem 1rem 0 0;
  text-align: right;
  font-family: var(--mono);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  color: var(--accent);
  font-weight: 600;
}

.eff--diluted { color: var(--oxide); }

.branch { display: flex; flex: none; }

.rail, .elbow {
  width: var(--rail-w);
  flex: none;
  position: relative;
}

.rail--on::before,
.elbow::before {
  content: "";
  position: absolute;
  left: 0.62rem;
  top: 0;
  bottom: 0;
  border-left: 1px solid var(--rule);
}

.elbow--last::before { bottom: auto; height: 1.03rem; }

.elbow::after {
  content: "";
  position: absolute;
  left: 0.62rem;
  top: 1.03rem;
  width: 0.6rem;
  border-top: 1px solid var(--rule);
}

.node {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 0.6rem;
  padding: 0.3rem 0 0.3rem 0.15rem;
  min-width: 0;
}

.disclose {
  font-family: var(--mono);
  font-size: 10px;
  line-height: 1;
  width: 1.15rem;
  height: 1.15rem;
  border: 1px solid var(--rule);
  background: var(--folio);
  color: var(--ink-2);
  border-radius: 2px;
  cursor: pointer;
  align-self: center;
}

.row.is-collapsed .disclose { background: var(--accent-2); color: var(--accent); }

/* Les feuilles réservent la place du bouton pour que les noms restent alignés. */
.disclose--empty { visibility: hidden; border-color: transparent; }

.name {
  font-family: var(--mono);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
}

.name:hover { text-decoration: underline; }

.tag {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
}

.tag--edge { color: var(--accent); }
.tag--code { letter-spacing: 0.02em; text-transform: none; font-size: 11px; }

/* ---------- États ---------- */

.notice {
  padding: 1.5rem;
  font-family: var(--mono);
  font-size: 13px;
  color: var(--ink-2);
}

.notice--alert { color: var(--oxide); }

.notice a { color: var(--accent); }

/* ---------- Connexion ---------- */

.login {
  max-width: 22rem;
  margin: 6rem auto;
  background: var(--folio);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: 2rem;
}

.login h1 {
  font-family: var(--mono);
  font-size: 15px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  margin: 0 0 1.5rem;
}

.login .field { margin-bottom: 1rem; }
.login input { width: 100%; }

/* ---------- Responsive ---------- */

@media (max-width: 760px) {
  :root { --gutter-w: 4rem; --rail-w: 1.1rem; }
  .shell { padding: 1.25rem 0.9rem 4rem; }
  .row, .register__head, .asof, .folio__head { padding-left: 0.9rem; padding-right: 0.9rem; }
  .ledger__row { grid-template-columns: minmax(0, 1fr) 5rem; }
  .ledger__row .ledger__hide { display: none; }
  .tag--code { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}