#crossing-report-view { padding: 24px; max-width: 1100px; margin: 0 auto; }

.cr-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px;
    flex-wrap: wrap; border-bottom: 1px solid #e3e6ea; padding-bottom: 16px; }
.cr-title h2 { margin: 0 0 8px; font-size: 20px; }
.cr-rules { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 13px; color: #5a6472; }
.cr-rules .cr-warn { color: #b26a00; font-weight: 600; }
.cr-actions { display: flex; gap: 8px; }
.cr-actions input { padding: 8px 10px; border: 1px solid #cfd6de; border-radius: 6px; min-width: 220px; }

.cr-warnings { margin-top: 12px; }
.cr-warning { background: #fff6e5; border-left: 3px solid #e8a33d; padding: 8px 12px;
    margin-bottom: 6px; font-size: 13px; color: #6b4d15; border-radius: 0 4px 4px 0; }

.cr-capacities { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; }
.cr-capa-btn { margin-left: 6px; border: 1px solid #cfd6de; background: #fff; border-radius: 6px;
    padding: 2px 8px; cursor: pointer; font-size: 12px; }
.cr-capa-btn:hover { background: #f2f4f7; }

.cr-search { margin: 20px 0; }
.cr-search input { width: 100%; padding: 12px 14px; font-size: 15px;
    border: 1px solid #cfd6de; border-radius: 8px; box-sizing: border-box; }
.cr-search-results { margin-top: 12px; }
.cr-hint { color: #5a6472; font-size: 13px; margin: 6px 0; }
.cr-nohit { color: #5a6472; font-style: italic; }

.cr-groups { margin-top: 8px; }
.cr-group > summary { font-size: 16px; font-weight: 600; cursor: pointer; padding: 12px 0;
    border-bottom: 1px solid #eef1f4; }
.cr-cause { margin: 8px 0 8px 16px; }
.cr-cause > summary { cursor: pointer; font-weight: 500; color: #37414f; padding: 6px 0; }

/* Une GRILLE, pas un flex : les colonnes gardent la même largeur d'une ligne à
   l'autre, quelle que soit la longueur du nom. Avant, chaque ligne se décalait.
   Colonnes : chevron · nom · filière · distance · score · badges. */
.cr-row { margin-left: 16px; border-left: 3px solid transparent; padding-left: 10px; }
.cr-row > summary {
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr) 190px 110px 44px auto;
    gap: 12px; align-items: baseline; cursor: pointer; padding: 6px 0; font-size: 14px;
    list-style: none;
}
.cr-row > summary::-webkit-details-marker { display: none; }
/* Chevron maison : le marqueur natif ne se place pas dans une grille. */
.cr-chevron { align-self: center; width: 14px; color: #8a94a1; font-size: 11px; transition: transform .12s; }
.cr-chevron::before { content: '▶'; }
.cr-row[open] > summary .cr-chevron { transform: rotate(90deg); }

/* Sous les 900 px, la filière et la distance passent à la ligne plutôt que de
   comprimer le nom jusqu'à l'illisible. */
@media (max-width: 900px) {
    .cr-row > summary { grid-template-columns: 14px minmax(0, 1fr) 44px auto; }
    .cr-row > summary .cr-type, .cr-row > summary .cr-dist { display: none; }
}
/* Vert : vérifié · orange : retenu par précaution · rouge : écarté · gris : déjà croisé */
.cr-row-RETENU   { border-left-color: #2e9e5b; }
.cr-row-RESERVE  { border-left-color: #e8a33d; }
.cr-row-ECARTE   { border-left-color: #c8453b; }
.cr-row-EXISTANT { border-left-color: #9aa5b1; }
/* Chaque cellule reste dans sa colonne : un nom trop long est tronqué, il ne
   pousse plus les suivantes. */
.cr-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-type { color: #5a6472; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-dist { color: #37414f; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.cr-score { background: #f2f4f7; border-radius: 10px; padding: 2px 8px; text-align: center;
    font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.cr-score-vide { color: #9aa5b1; background: transparent; font-weight: 400; }
.cr-tags { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.cr-bloc-titre { margin: 8px 0 2px 24px; font-size: 12px; font-weight: 600; color: #5a6472; }
/* Vert ce qui est prouvé, orange ce qui manque, rouge ce qui bloque. */
.cr-titre-ok { color: #2e9e5b; }
.cr-titre-reserve { color: #b07514; }
.cr-titre-ko { color: #c8453b; }
.cr-preuves li { color: #2f6b47; }
.cr-stale { background: #fdecea; color: #c8453b; border-radius: 10px; padding: 2px 8px; font-size: 11px; }
.cr-capa-tag { background: #e8f4ec; color: #2e9e5b; border-radius: 10px; padding: 2px 8px; font-size: 11px; }
/* Retenu faute d'information : proposé, mais conformité non établie. */
.cr-reserve { background: #fff5e0; color: #b07514; border-radius: 10px; padding: 2px 8px; font-size: 11px; }
.cr-reserves li { color: #b07514; }
.cr-cause-tag { background: #f2f4f7; color: #37414f; border-radius: 10px; padding: 2px 8px; font-size: 11px; }
.cr-reasons { margin: 4px 0 10px 24px; color: #37414f; font-size: 13px; }

.cr-status { margin-top: 20px; color: #5a6472; font-size: 13px; }
.cr-status.cr-error { color: #c8453b; font-weight: 600; }

/* --- Typeahead --- */
.cr-ta-wrap { position: relative; flex: 1; }
.cr-ta-list { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 50;
    background: #fff; border: 1px solid #cfd6de; border-radius: 8px; overflow: hidden auto;
    max-height: 320px; box-shadow: 0 8px 24px rgba(20, 30, 45, .12); }
.cr-ta-list.hidden { display: none; }
.cr-ta-item { padding: 8px 12px; cursor: pointer; font-size: 14px; border-bottom: 1px solid #f2f4f7; }
.cr-ta-item:last-child { border-bottom: none; }
.cr-ta-item:hover, .cr-ta-item.cr-ta-active { background: #eef4ff; }
.cr-ta-sub { color: #5a6472; font-size: 12px; margin-left: 6px; }
.cr-ta-flag { color: #c8453b; font-size: 11px; margin-left: 6px; }
.cr-ta-empty { padding: 10px 12px; color: #5a6472; font-size: 13px; font-style: italic; }
.cr-header .cr-actions { flex: 1; min-width: 320px; align-items: flex-start; }

/* Lien vers la fiche Airtable, posé dans les lignes de résultat */
.cr-link { color: #2f6fd0; text-decoration: none; font-size: 12px; font-weight: 600;
    border: 1px solid #d3e0f5; border-radius: 10px; padding: 1px 8px; white-space: nowrap; }
.cr-link:hover { background: #eef4ff; text-decoration: none; }
.cr-title h2 .cr-link { margin-left: 8px; vertical-align: middle; }

/* --- État de chargement --- */
.cr-loading { display: flex; align-items: center; gap: 14px; margin: 20px 0;
    padding: 16px 18px; background: #eef4ff; border: 1px solid #d3e0f5;
    border-left: 4px solid #2f6fd0; border-radius: 8px; }
.cr-loading.hidden { display: none; }
.cr-loading-text { display: flex; flex-direction: column; gap: 2px; }
.cr-loading-text strong { font-size: 15px; color: #1d4e91; }
.cr-loading-text span { font-size: 13px; color: #4a6285; }
.cr-spinner { width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%;
    border: 3px solid #cfe0f7; border-top-color: #2f6fd0; animation: cr-spin .8s linear infinite; }
@keyframes cr-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .cr-spinner { animation-duration: 2.4s; } }

/* Champs inactifs : recherche avant chargement, gisement pendant le calcul */
.cr-search.cr-inactive { opacity: .55; }
#cr-search-input:disabled, #cr-gisement-input:disabled { background: #f4f6f8; cursor: not-allowed; }
#cr-reload:disabled { opacity: .5; cursor: not-allowed; }