/* Identité "Pétrole profond" — retenue après comparaison de plusieurs maquettes (couleurs + mise en
   page) en artefact avec l'utilisateur. Surcharge les variables CSS de Bootstrap 5.3 : tout ce qui
   utilise déjà bg-primary/btn-primary/text-primary/border-primary dans le code existant hérite
   automatiquement de la nouvelle couleur, sans avoir à changer une seule classe dans les pages. Les
   couleurs sémantiques (danger/warning/success pour statuts, retards, température...) restent les
   couleurs Bootstrap par défaut, volontairement non touchées ici pour ne jamais rivaliser avec l'accent. */
:root {
    --brand-nav-bg: #0c1f24;
    --brand-nav-ink: #8fb0b3;
    --brand-accent: #146670;
    --brand-accent-soft: #1c7a85;
    --brand-page-bg: #e6efee;
    --brand-card-bg: #fafdfc;
    --brand-line: #cddede;
    --brand-ink: #141f1f;
    --brand-muted: #5d7373;

    --bs-primary: var(--brand-accent);
    --bs-primary-rgb: 20, 102, 112;
    --bs-link-color: var(--brand-accent);
    --bs-link-color-rgb: 20, 102, 112;
    --bs-link-hover-color: var(--brand-accent-soft);
    --bs-link-hover-color-rgb: 28, 122, 133;
    --bs-body-font-family: "Jost", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
    --bs-body-bg: var(--brand-page-bg);
}
.btn-primary {
    --bs-btn-bg: var(--brand-accent);
    --bs-btn-border-color: var(--brand-accent);
    --bs-btn-hover-bg: var(--brand-accent-soft);
    --bs-btn-hover-border-color: var(--brand-accent-soft);
    --bs-btn-active-bg: var(--brand-accent-soft);
    --bs-btn-active-border-color: var(--brand-accent-soft);
}
.btn-outline-primary {
    --bs-btn-color: var(--brand-accent);
    --bs-btn-border-color: var(--brand-accent);
    --bs-btn-hover-bg: var(--brand-accent);
    --bs-btn-hover-border-color: var(--brand-accent);
    --bs-btn-active-bg: var(--brand-accent);
    --bs-btn-active-border-color: var(--brand-accent);
}
h1, h2, h3 {
    font-family: "Jost", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
    font-weight: 600;
}

body {
    background-color: var(--brand-page-bg);
    color: var(--brand-ink);
}
.table-hover tbody tr {
    cursor: pointer;
}
.card {
    border: none;
    background-color: var(--brand-card-bg);
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.badge {
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
/* Affichage en majuscules de tous les menus déroulants (demande générale) — purement visuel,
   ne change pas les valeurs stockées ni l'ordre des options. */
select, select option {
    text-transform: uppercase;
}
.text-truncate-cell {
    max-width: 125px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.text-truncate-cell-lg {
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* .prospection-table .adresses-preview (pas .adresses-preview seul) : la règle générale
   ".prospection-table td" (0.8rem) est plus spécifique qu'une simple classe et l'écrasait sinon —
   trouvé en vérifiant dans le navigateur après coup (12,8px affiché au lieu du plus petit voulu). */
.prospection-table .adresses-preview {
    font-size: 0.6rem;
    max-width: 300px;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
/* Adresse complète, jamais tronquée (2026-08-31, demande explicite) : passe à la ligne au lieu de
   couper avec "..." — surcharge le nowrap/ellipsis hérité de .text-truncate-cell (colonne partagée
   avec Locataires, qui garde son propre comportement tronqué). */
.adresses-preview .text-truncate-cell {
    max-width: 300px;
    margin-bottom: 5px;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
}
.adresses-preview .text-truncate-cell:last-child {
    margin-bottom: 0;
}
.locataires-preview {
    font-size: 0.68rem;
    max-width: 130px;
}
.locataires-preview .text-truncate-cell {
    max-width: 130px;
}
/* Nom de société sur 2 lignes (2026-08-30, demande explicite) : plus lisible qu'une seule ligne
   tronquée à "..." — le titre complet reste dans l'attribut title au survol. */
.text-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    max-width: 105px;
}
/* Colonnes Contact/Enrichissement de la liste Prospection (2026-08-30) : mêmes contraintes que
   les autres colonnes pour que le tableau tienne sur un seul écran (demande explicite de Yona,
   "je dois décaler vers la droite pour tout voir"). */
.contact-cell {
    max-width: 95px;
}
.contact-cell a {
    max-width: 95px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    vertical-align: bottom;
}
.enrichissement-cell {
    max-width: 78px;
}
/* Colonne "Action" (ex-"Prochaine action", renommée le 2026-08-31, demande explicite : "écris
   Prochaine action en Action") — resserrée comme les autres colonnes de cette table. */
.prospection-table .action-cell {
    max-width: 110px;
    font-size: 0.68rem;
}
.enrichissement-cell .badge {
    white-space: normal;
    font-size: 0.62rem;
    line-height: 1.2;
}
/* Table Prospection resserrée (2026-08-30) : 14 colonnes avec beaucoup d'infos, tenir sur un seul
   écran sans avoir à décaler la page entière vers la droite (le <div class="table-responsive">
   autour de cette table absorbe un éventuel reste, mais ne doit jamais servir de solution
   principale). */
.prospection-table th, .prospection-table td {
    font-size: 0.8rem;
    padding: 0.35rem 0.45rem;
}
.prospection-table .btn-sm {
    padding: 0.15rem 0.3rem !important;
    line-height: 1.1;
}
/* Opportunités (enseignes nationales, rues denses) : plusieurs actifs d'un même prospect affichés
   sur plusieurs lignes avec société/dirigeant/score/statut fusionnés (rowspan) sur la 1re ligne du
   groupe — évite la répétition tout en gardant un vrai tableau (une colonne par info). */
.group-end td {
    border-bottom: 2px solid #dee2e6 !important;
}
.table-opportunites {
    font-size: 0.8rem;
}
.table-opportunites td, .table-opportunites th {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

/* Page d'accueil */
.hero-banner {
    background: linear-gradient(135deg, var(--brand-nav-bg) 0%, var(--brand-accent) 100%);
    color: #fff;
    border-radius: 1rem;
    padding: 1.75rem 2rem;
}
.hero-banner .text-muted {
    color: rgba(255, 255, 255, 0.7) !important;
}
.stat-tile {
    border-left: 4px solid var(--tile-color, var(--brand-accent));
    border-radius: 0.75rem;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.stat-tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
}
.stat-tile .stat-icon {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    background: var(--tile-bg, rgba(20, 102, 112, 0.1));
}
.section-card h2 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Opportunités : file d'attente affichée ligne par ligne plutôt qu'en tuiles côte à côte — le
   titre de la catégorie (ce qu'il faut traiter) prend le pas visuellement sur le chiffre (combien),
   qui reste secondaire même s'il est toujours visible. */
.opportunite-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-radius: 0.75rem;
    background: var(--brand-card-bg, #fff);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border-left: 4px solid var(--tile-color, var(--brand-accent));
    text-decoration: none;
    color: inherit;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.opportunite-row:hover {
    transform: translateX(3px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    color: inherit;
}
.opportunite-row-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    background: var(--tile-bg, rgba(20, 102, 112, 0.1));
}
.opportunite-row-title {
    flex: 1;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--brand-ink, #1a1a1a);
}
.opportunite-row-count {
    font-size: 1.35rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.quick-tile {
    border-radius: 0.75rem;
    padding: 1.1rem 1.25rem;
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: center;
    gap: 0.9rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
    background: var(--tile-bg, #fff);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.quick-tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
    color: inherit;
}
.quick-tile .quick-icon {
    width: 46px;
    height: 46px;
    min-width: 46px;
    border-radius: 0.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    background: rgba(255, 255, 255, 0.6);
}
.agenda-row-retard {
    border-left: 3px solid var(--bs-danger);
}
.agenda-row-ok {
    border-left: 3px solid transparent;
}

/* Accent de ligne générique (tableaux) : signale un prospect/investisseur qui mérite une attention
   immédiate (urgent, action en retard) sans avoir à lire chaque cellule. */
.row-accent-danger {
    border-left: 3px solid var(--bs-danger);
}
.row-accent-warning {
    border-left: 3px solid var(--bs-warning);
}

/* Fiche prospect : cartes dirigeants/associés (public/prospection/view.php) — regroupées ici pour
   que toute la fiche partage la même échelle de police (0.8rem) au lieu du mélange texte par défaut
   / .small Bootstrap qui donnait une impression de tailles incohérentes entre sections. */
.fiche-dirigeant-card {
    font-size: 0.8rem;
    padding: 0.5rem 0.65rem !important;
}
.fiche-dirigeant-card .fw-bold,
.fiche-dirigeant-card strong {
    font-size: 0.82rem;
}
.fiche-dirigeant-card .badge {
    font-size: 0.62rem;
}

/* Numéros/emails secondaires affichés en petites puces juste sous le champ principal, plutôt qu'en
   liste séparée plus bas dans le formulaire (demande explicite : les avoir "juste en dessous"). */
.coordonnee-chip {
    font-size: 0.72rem;
    background: var(--bs-secondary-bg);
    border-radius: 1rem;
    padding: 0.1rem 0.55rem;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}
.coordonnee-chip button {
    font-size: 0.7rem;
    line-height: 1;
    padding: 0;
}

/* Coquille d'application : barre de navigation sombre fixe à gauche + contenu clair à droite,
   remplace l'ancienne barre horizontale. Retenue après comparaison de plusieurs maquettes : le
   repère spatial constant aide plus que la couleur seule sur un usage de plusieurs heures. */
.app-shell {
    display: flex;
    align-items: stretch;
    min-height: 100vh;
}
.app-sidebar {
    width: 222px;
    flex: 0 0 222px;
    background: var(--brand-nav-bg);
    color: var(--brand-nav-ink);
    display: flex;
    flex-direction: column;
    padding: 1.15rem 0.85rem;
    position: sticky;
    top: var(--chrono-barre-hauteur, 0px);
    height: calc(100vh - var(--chrono-barre-hauteur, 0px));
    overflow-y: auto;
}

/* Chronomètre de discipline (2026-08-19) : barre persistante en haut de CHAQUE page, quel que soit
   l'onglet — demande explicite. Sticky au-dessus de la sidebar (qui redescend d'autant via la
   variable --chrono-barre-hauteur, définie inline juste en dessous). */
.chrono-barre {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: #1a2e22;
    color: #eef3ee;
    font-size: 0.82rem;
    /* PAS de overflow:hidden ici (2026-08-31, bug trouvé par Yona : "le menu déroulant est invisible")
       — c'était un reste de l'ancien fond de barre pleine largeur (.chrono-barre-progression,
       supprimé), qui coupait tout ce qui dépasse en dessous, dont le menu "changer de catégorie". */
}
/* Jauge d'avancement de la session en cours (2026-08-31) — pilule visible avec pourcentage centré,
   remplace l'ancien fond de barre à peine teinté (invisible en pratique, demande explicite avec
   image de référence à l'appui). */
.chrono-barre-jauge {
    position: relative;
    display: inline-block;
    width: 130px;
    height: 20px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 999px;
    overflow: hidden;
    flex: 0 0 auto;
}
.chrono-barre-jauge-remplissage {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #4caf6d, #8de3a8);
    transition: width 0.4s ease;
}
.chrono-barre-jauge-texte {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 0.68rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0,0,0,0.45);
}
.chrono-barre-jauge-texte.chrono-temps-ecoule { color: #ffe1b0; }
.chrono-barre-contenu {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.4rem 1rem;
    flex-wrap: wrap;
}
.chrono-barre-module { font-weight: 600; margin-left: auto; }
.chrono-barre-jour { opacity: 0.75; }
.chrono-barre-btn {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.25);
    color: #eef3ee;
    border-radius: 6px;
    padding: 0.15rem 0.6rem;
    font-size: 0.78rem;
    cursor: pointer;
}
.chrono-barre-btn:hover { background: rgba(255,255,255,0.22); }
.chrono-barre-btn-discret { background: transparent; border-color: transparent; opacity: 0.6; }
.chrono-barre-fini {
    padding: 0.4rem 1rem;
    background: #1a2e22;
    color: #eef3ee;
    font-size: 0.82rem;
}
.chrono-barre-fini a { color: #9fd8b4; }
.chrono-barre.chrono-barre-pause { background: #2e2517; }
.chrono-barre.chrono-barre-pause .chrono-barre-jauge-remplissage { background: linear-gradient(90deg, #c98a3a, #e6b464); }
/* Bandeau de pause MANUELLE, plein écran et centré (2026-08-31, demande explicite : "reprendre qui
   doit s'afficher au milieu de notre écran") — volontairement plus intrusif qu'une pause programmée
   (fond assombri par-dessus tout le reste de l'app) : une interruption manuelle doit se remarquer,
   la reprise doit être un choix conscient, pas un détail dans un coin de l'écran. */
.chrono-pause-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: rgba(20, 16, 8, 0.82);
    display: flex;
    align-items: center;
    justify-content: center;
}
.chrono-pause-overlay-carte {
    background: #2e2517;
    color: #eef3ee;
    border-radius: 16px;
    padding: 2.5rem 3rem;
    text-align: center;
    box-shadow: 0 12px 40px rgba(0,0,0,0.4);
}
.chrono-pause-overlay-icone { font-size: 3rem; line-height: 1; margin-bottom: 0.5rem; }
.chrono-pause-overlay-titre { font-size: 1.1rem; font-weight: 600; opacity: 0.85; margin-bottom: 0.25rem; }
.chrono-pause-overlay-temps {
    font-size: 2.2rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    margin-bottom: 1.5rem;
}
.chrono-pause-overlay-btn {
    background: #4caf6d;
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 0.85rem 2.5rem;
    font-size: 1.05rem;
    font-weight: 600;
    cursor: pointer;
}
.chrono-pause-overlay-btn:hover { background: #5cc07e; }
@media (max-width: 900px) {
    .app-sidebar { position: static; height: auto; }
}
.app-brand {
    display: block;
    font-family: "Jost", sans-serif;
    font-weight: 600;
    font-size: 1.02rem;
    color: #fff;
    text-decoration: none;
    letter-spacing: 0.02em;
    margin: 0.2rem 0 1rem 0.5rem;
}
.app-brand span {
    display: block;
    font-size: 0.66rem;
    font-weight: 400;
    letter-spacing: 0.08em;
    opacity: 0.6;
    text-transform: uppercase;
}
.app-stat {
    font-size: 0.72rem;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 0.5rem;
    padding: 0.5rem 0.65rem;
    margin: 0 0.1rem 1rem;
    color: var(--brand-nav-ink);
}
.app-nav-list {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.app-nav-link {
    display: block;
    padding: 0.5rem 0.65rem;
    border-radius: 0.4rem;
    font-size: 0.85rem;
    color: var(--brand-nav-ink);
    text-decoration: none;
}
.app-nav-link:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
}
.app-nav-link.active {
    background: var(--brand-accent);
    color: #fff;
    font-weight: 600;
}
.app-nav-label {
    font-size: 0.64rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    opacity: 0.55;
    margin: 0.9rem 0.65rem 0.35rem;
}
.app-nav-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 0.85rem;
    margin-top: 0.85rem;
}
.app-nav-user {
    font-size: 0.78rem;
    color: var(--brand-nav-ink);
    margin-bottom: 0.5rem;
    padding: 0 0.1rem;
}
.app-content {
    flex: 1;
    min-width: 0;
    background: var(--brand-page-bg);
    padding-top: 1.6rem;
}
.sidebar-toggle {
    display: none;
}
.sidebar-backdrop {
    display: none;
}
@media (max-width: 991.98px) {
    .app-shell {
        display: block;
    }
    .app-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        z-index: 1050;
        transform: translateX(-100%);
        transition: transform 0.2s ease;
        box-shadow: 2px 0 12px rgba(0, 0, 0, 0.2);
    }
    .app-sidebar.open {
        transform: translateX(0);
    }
    .app-content {
        padding-top: 4rem;
        min-height: 100vh;
    }
    .sidebar-toggle {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 4px;
        position: fixed;
        top: 0.85rem;
        left: 0.9rem;
        z-index: 1060;
        width: 38px;
        height: 38px;
        border-radius: 0.5rem;
        border: none;
        background: var(--brand-nav-bg);
        padding: 0;
    }
    .sidebar-toggle span {
        display: block;
        height: 2px;
        background: #fff;
        border-radius: 2px;
        margin: 0 7px;
    }
    .sidebar-toggle.is-hidden {
        opacity: 0;
        pointer-events: none;
    }
    .sidebar-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.35);
        z-index: 1040;
    }
    .sidebar-backdrop.show {
        display: block;
    }
}

/* Fiche Prospect : Activité (agenda + échanges) mise en avant à gauche, Suivi/Historique en colonne
   latérale à droite — retenu après comparaison de plusieurs mises en page avec l'utilisateur. En
   dessous de ~900px la colonne latérale repasse sous l'Activité plutôt que de s'écraser. */
.fiche-grid-activite {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 1rem;
    align-items: start;
}
.fiche-grid-side {
    position: sticky;
    top: 1rem;
}
@media (max-width: 900px) {
    .fiche-grid-activite {
        grid-template-columns: 1fr;
    }
    .fiche-grid-side {
        position: static;
    }
}

/* Bootstrap collapse cible display:block par défaut, ce qui casse l'alignement des colonnes sur
   une <tr> (voir public/contacts_a_qualifier/index.php, ligne "Contacté aujourd'hui") — corrige
   pour que la ligne dépliée reste une vraie ligne de tableau. */
tr.collapse:not(.show) {
    display: none;
}
tr.collapse.show, tr.collapsing {
    display: table-row;
}