/* Découverte de débouchés — même gabarit que les rapports de croisements et de
   recherches (1360 px, en-tête titre + sous-titre) : ces écrans se consultent en
   alternance sur les mêmes gisements. */
.od-wrap { padding: 24px; max-width: 1360px; margin: 0 auto; }
.od-header h2 { margin: 0 0 4px; font-size: 1.25rem; }
.od-sub { color: #6b7280; font-size: 13px; margin: 0 0 16px; }

.od-gisement h3 { margin: 0 0 10px; font-size: 1.1rem; }
.od-gisement a { color: #2563eb; text-decoration: none; }

.od-banner { display: flex; gap: 12px; align-items: flex-start; padding: 12px 16px;
    border-radius: 10px; margin-bottom: 16px; font-size: 14px; }
.od-banner i { margin-top: 3px; }
.od-banner-dry { background: #eff6ff; border: 1px solid #bfdbfe; color: #1e3a8a; }
.od-banner-real { background: #dcfce7; border: 1px solid #86efac; color: #166534; }

.od-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
    padding: 16px 18px; margin-bottom: 16px; }
.od-card h3 { margin: 0 0 6px; font-size: 1.05rem; display: inline-flex; align-items: center; gap: 8px; }
.od-card ul { margin: 8px 0 0; padding-left: 20px; }
.od-card li { margin: 3px 0; }
.od-card-done { border-color: #86efac; }
.od-count { background: #f3f4f6; color: #475569; border-radius: 999px; padding: 1px 9px;
    font-size: 12px; font-weight: 600; }

.od-muted { color: #6b7280; font-size: 13px; }
.od-warn { color: #b45309; font-weight: 600; font-size: 13px; }
.od-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.od-lead { font-size: 15px; margin: 8px 0 14px; }

.od-criteria { display: grid; grid-template-columns: 190px 1fr; gap: 8px 16px; margin: 12px 0 0; }
.od-criteria dt { font-weight: 600; color: #475569; font-size: 13px; padding-top: 3px; }
.od-criteria dd { margin: 0; font-size: 14px; }
.od-chip-ok { background: #dcfce7 !important; border-color: #86efac !important; color: #166534; }
.od-chip { display: inline-block; background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 6px;
    padding: 2px 8px; font-size: 13px; margin: 1px 0; }

.od-sources { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.od-source { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 12px 14px; }
.od-source h4 { margin: 0; font-size: 14px; }

.od-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.od-tile { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 12px 14px;
    font-size: 13px; color: #475569; }
.od-tile span { display: block; font-size: 26px; font-weight: 700; color: #111827; line-height: 1.2; }
.od-tile-new { background: #dcfce7; border-color: #86efac; }
.od-tile-upd { background: #eff6ff; border-color: #bfdbfe; }
.od-tile-amb { background: #fef3c7; border-color: #fcd34d; }

.od-table-wrap { overflow-x: auto; margin-top: 10px; }
.od-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.od-table th { text-align: left; color: #6b7280; font-weight: 600; border-bottom: 1px solid #e5e7eb;
    padding: 6px 8px; white-space: nowrap; }
.od-table td { border-bottom: 1px solid #f3f4f6; padding: 8px; vertical-align: top; }
.od-table a, .od-list a { color: #2563eb; text-decoration: none; }

.od-change { margin: 2px 0; }
.od-field { font-weight: 600; margin-right: 4px; }
.od-before { color: #8a94a1; text-decoration: line-through; }
.od-after { color: #166534; }
.od-conflicts { margin-top: 4px; color: #b45309; font-size: 12px; }

.od-list { list-style: none; padding-left: 0; font-size: 14px; }
.od-list li { padding: 6px 0; border-bottom: 1px solid #f3f4f6; }
details summary { cursor: pointer; display: flex; align-items: center; gap: 12px; }
details summary h3 { margin: 0; }

.od-apply { display: flex; justify-content: space-between; align-items: center; gap: 16px;
    background: #f9fafb; }
.od-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.od-btn { display: inline-flex; align-items: center; gap: 6px; background: #2563eb; color: #fff;
    border: none; border-radius: 6px; padding: 8px 14px; font: inherit; font-weight: 600;
    cursor: pointer; text-decoration: none; white-space: nowrap; }
.od-btn:hover { background: #1d4ed8; }
.od-btn-ghost { background: #fff; color: #2563eb; border: 1px solid #bfdbfe; }
.od-btn-ghost:hover { background: #eff6ff; }

.od-progress-label { font-weight: 600; display: flex; gap: 10px; align-items: center; }
.od-bar { height: 8px; background: #f3f4f6; border-radius: 999px; overflow: hidden; margin: 10px 0; }
.od-bar div { height: 100%; background: #2563eb; transition: width .4s ease; }

.od-message { padding: 12px 16px; border-radius: 8px; margin-bottom: 12px; font-size: 14px; }
.od-info { background: #f9fafb; border: 1px solid #e5e7eb; }
.od-error { background: #fee2e2; border: 1px solid #fca5a5; color: #991b1b; }
.od-error ul { margin: 8px 0; }
.od-warning { background: #fef3c7; border: 1px solid #fcd34d; color: #92400e; }
.od-home { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 12px; }
.od-home input[type="text"], .od-home input:not([type]) { flex: 1; min-width: 240px; padding: 8px 10px;
    border: 1px solid #cfd6de; border-radius: 6px; font: inherit; }

.od-inline { display: inline; }
.od-inline summary { display: inline; color: #2563eb; cursor: pointer; font-size: 13px; }
.od-footer { color: #8a94a1; font-size: 12px; margin-top: 8px; }

@media (max-width: 720px) {
    .od-wrap { padding: 16px; }
    .od-criteria { grid-template-columns: 1fr; }
    .od-apply { flex-direction: column; align-items: stretch; }
}

/* --- Panneaux repliables (fermés par défaut) ---------------------------------------- */
.od-panel > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; }
.od-panel > summary::-webkit-details-marker { display: none; }
.od-panel > summary h3 { margin: 0; }
.od-caret { color: #6b7280; font-size: 12px; transition: transform .15s ease; }
.od-panel[open] > summary .od-caret { transform: rotate(90deg); }
.od-panel-body { margin-top: 12px; }
/* La barre collante ne doit pas masquer le titre du panneau atteint depuis un carré. */
.od-panel { scroll-margin-top: 84px; }

/* --- Carrés de synthèse : chacun mène à son panneau ---------------------------------- */
button.od-tile { font: inherit; text-align: left; cursor: pointer; transition: box-shadow .15s ease, transform .15s ease; }
button.od-tile:hover:not([disabled]) { box-shadow: 0 2px 8px rgba(17, 24, 39, .12); transform: translateY(-1px); }
button.od-tile[disabled] { cursor: default; opacity: .6; }

/* --- Barre d'actions collante : recherche + « Le résultat convient ? » ---------------- */
.od-toolbar { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 16px;
    flex-wrap: wrap; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
    padding: 10px 14px; margin-bottom: 16px; box-shadow: 0 4px 12px rgba(17, 24, 39, .08); }
.od-search { flex: 1 1 320px; display: flex; align-items: center; gap: 8px; color: #6b7280; }
.od-search input { flex: 1; min-width: 180px; padding: 8px 10px; border: 1px solid #cfd6de;
    border-radius: 6px; font: inherit; color: #111827; }
.od-search-count { white-space: nowrap; font-size: 12px; }
.od-toolbar-text { flex: 2 1 360px; display: flex; flex-direction: column; gap: 2px; font-size: 14px; }

/* --- Codes NAF / rubriques ICPE avec leur intitulé ------------------------------------ */
.od-card .od-codes { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.od-codes li { font-size: 14px; }
.od-codes .od-chip { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; margin-right: 6px; }

@media (max-width: 720px) {
    .od-toolbar { position: static; }
}

/* `.dashboard-view` est déclarée `overflow-y: auto` sans hauteur bornée : elle grandit avec son
   contenu et c'est la PAGE qui défile. Une barre `sticky` se colle à son plus proche ancêtre
   défilant : ici cette vue, qui ne défile jamais — la barre partait donc avec le reste.
   Sans overflow propre, la vue laisse la barre se coller au haut de la fenêtre. */
#outlet-discovery-view { overflow: visible; }

/* Coût du lancement, toujours visible dans la synthèse. */
.od-cost { margin: 10px 0 0; padding: 8px 12px; background: #f9fafb; border: 1px solid #e5e7eb;
    border-radius: 8px; font-size: 14px; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.od-cost i { color: #b45309; }