/* ─── ADV CONTROL TOWER — Styles ─────────────────────────────────────────── */

:root {
    --adv-card-radius: 0.75rem;
    --adv-transition:  0.2s ease;
    --s3p-navy:        #1D3349;
    --s3p-gold:        #F7BE28;
    --s3p-light:       #E8ECF2;
}

body {
    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: var(--s3p-light) !important;
}

main { flex: 1; }

/* ─── Navbar ─────────────────────────────────────────────────────────────── */
.navbar-brand { letter-spacing: -0.3px; font-size: 1.05rem; }
.navbar .nav-link.active,
.navbar .nav-link:hover  { color: var(--s3p-gold) !important; }

/* ─── Bootstrap overrides ────────────────────────────────────────────────── */
.btn-primary, .bg-primary { background-color: var(--s3p-navy) !important; border-color: var(--s3p-navy) !important; }
.btn-primary:hover        { background-color: #152638 !important; border-color: #152638 !important; }
.btn-outline-primary      { color: var(--s3p-navy) !important; border-color: var(--s3p-navy) !important; }
.btn-outline-primary:hover{ background-color: var(--s3p-navy) !important; color: #fff !important; }
.text-primary             { color: var(--s3p-navy) !important; }
.border-primary           { border-color: var(--s3p-navy) !important; }
a                         { color: var(--s3p-navy); }
a:hover                   { color: #F7BE28; }

/* ─── Cartes ─────────────────────────────────────────────────────────────── */
.card {
    border-radius: var(--adv-card-radius) !important;
    transition: box-shadow var(--adv-transition);
}
.card-header {
    border-radius: calc(var(--adv-card-radius) - 1px) calc(var(--adv-card-radius) - 1px) 0 0 !important;
}

/* ─── Icônes catégorie ───────────────────────────────────────────────────── */
.icon-box {
    width: 52px; height: 52px;
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}

/* ─── Tableaux ───────────────────────────────────────────────────────────── */
.table > tbody > tr { transition: background-color var(--adv-transition); }
.table > tbody > tr:hover { background-color: rgba(13,110,253,.04); }

/* ─── KPI cards ──────────────────────────────────────────────────────────── */
.kpi-card {
    border-left: 4px solid;
    border-radius: var(--adv-card-radius) !important;
}
.kpi-card.kpi-draft        { border-left-color: #6c757d; }
.kpi-card.kpi-submitted    { border-left-color: #ffc107; }
.kpi-card.kpi-validated    { border-left-color: #198754; }
.kpi-card.kpi-rejected     { border-left-color: #dc3545; }
.kpi-card.kpi-pushed       { border-left-color: var(--s3p-navy); }
.kpi-card.kpi-deployed     { border-left-color: #0dcaf0; }
.kpi-card.kpi-in_deployment{ border-left-color: #0dcaf0; }

/* ─── Status badges ──────────────────────────────────────────────────────── */
.status-badge {
    font-size: 0.75rem;
    padding: 0.3rem 0.65rem;
    border-radius: 50px;
    font-weight: 600;
    white-space: nowrap;
}

/* ─── Wizard steps ───────────────────────────────────────────────────────── */
.wizard-steps {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 2rem;
    overflow-x: auto;
    padding-bottom: 4px;
}

.wizard-step {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 500;
    white-space: nowrap;
    color: #6c757d;
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    cursor: pointer;
    transition: all var(--adv-transition);
    flex-shrink: 0;
}
.wizard-step .step-num {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: #dee2e6;
    color: #6c757d;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    flex-shrink: 0;
}
.wizard-step.active {
    background: var(--s3p-navy);
    color: white;
    border-color: var(--s3p-navy);
}
.wizard-step.active .step-num {
    background: rgba(255,255,255,0.3);
    color: white;
}
.wizard-step.completed {
    background: #d1e7dd;
    color: #0a3622;
    border-color: #a3cfbb;
}
.wizard-step.completed .step-num {
    background: #198754;
    color: white;
}
.wizard-step.step-invalid {
    background: #f8d7da;
    color: #58151c;
    border-color: #f1aeb5;
}
.wizard-step.step-invalid .step-num {
    background: #dc3545;
    color: white;
    font-size: .65rem;
}
.wizard-connector {
    width: 2rem;
    height: 2px;
    background: #dee2e6;
    flex-shrink: 0;
}

/* ─── Client search ──────────────────────────────────────────────────────── */
.client-search-results {
    position: absolute;
    z-index: 1050;
    width: 100%;
    max-height: 260px;
    overflow-y: auto;
    background: white;
    border: 1px solid #dee2e6;
    border-top: none;
    border-radius: 0 0 0.5rem 0.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
}
.client-search-results .result-item {
    padding: 0.6rem 1rem;
    cursor: pointer;
    border-bottom: 1px solid #f0f2f5;
    font-size: 0.875rem;
    transition: background var(--adv-transition);
}
.client-search-results .result-item:last-child { border-bottom: none; }
.client-search-results .result-item:hover { background: #f0f4ff; }
.client-search-results .result-item .client-code { color: #6c757d; font-size: 0.78rem; }

/* ─── Lignes de devis ────────────────────────────────────────────────────── */
.ligne-row td { vertical-align: middle; }
.ligne-ref    { font-family: 'Courier New', monospace; font-size: 0.82rem; }
.total-line   { font-weight: 600; }

/* ─── Dossier sections ───────────────────────────────────────────────────── */
.section-title {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--s3p-navy);
    font-weight: 700;
    margin-bottom: 0.75rem;
    padding: 0.5rem 0.75rem;
    border-left: 3px solid var(--s3p-gold);
    background: rgba(29,51,73,.05);
    border-radius: 0 4px 4px 0;
}

/* ─── Repeatable rows (users / vehicles) ─────────────────────────────────── */
.repeat-row { position: relative; }
.repeat-row .btn-remove-row {
    position: absolute;
    top: 50%; right: -2rem;
    transform: translateY(-50%);
    opacity: 0.5;
    transition: opacity var(--adv-transition);
}
.repeat-row:hover .btn-remove-row { opacity: 1; }

/* ─── Loading overlay ────────────────────────────────────────────────────── */
.loading-overlay {
    position: absolute; inset: 0;
    background: rgba(255,255,255,.8);
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--adv-card-radius);
    z-index: 10;
}

/* ─── Footer ─────────────────────────────────────────────────────────────── */
.footer { margin-top: auto; }

/* ─── Animations ─────────────────────────────────────────────────────────── */
.fade-in { animation: fadeIn 0.3s ease-in-out; }
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 576px) {
    main { padding: 1rem !important; }
    .card-body.p-4 { padding: 1.25rem !important; }
    .wizard-steps  { gap: 0.25rem; }
    .wizard-connector { width: 1rem; }
}

/* ─── Print-header : invisible à l'écran, visible à l'impression ─────────── */
.print-header,
.print-cgv-wrapper {
    position: absolute;
    left: -9999px;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}

/* ─── Print (pour PDF devis) ─────────────────────────────────────────────── */
@media print {
    @page { size: A4 portrait; margin: 10mm 12mm; }
    /* Assure le rendu fidèle des couleurs */
    html { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

    /* ── Masquer l'interface ── */
    .navbar, .footer, .btn, .no-print,
    .alert, #formValidation,
    .col-lg-4, .d-flex.align-items-start { display: none !important; }

    main  { padding: 0 !important; }
    body  { font-size: 8pt; color: #000; background: #fff; }

    /* ── Mise en page pleine largeur ── */
    .row.g-4  { --bs-gutter-x: 0; --bs-gutter-y: 0; }
    .col-lg-8 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; padding: 0 !important; }

    /* ── Cards compactes ── */
    .card        { box-shadow: none !important; border: 1px solid #bbb !important; border-radius: 3pt !important; break-inside: avoid; margin-bottom: 5pt !important; }
    .card-header { background: #f2f2f2 !important; color: #000 !important; padding: 4pt 8pt !important; }
    .card-body   { padding: 5pt 8pt !important; }
    h6           { font-size: 8.5pt !important; margin: 0 !important; }

    /* ── Tableaux compacts ── */
    table  { break-inside: avoid; font-size: 7.5pt; width: 100%; }
    thead  { display: table-header-group; }
    th, td { padding: 2.5pt 5pt !important; }
    .ps-4  { padding-left: 6pt !important; }
    .pe-4  { padding-right: 6pt !important; }
    .fs-5  { font-size: 8.5pt !important; }
    .small, small { font-size: 7pt !important; }

    /* ── Sections print-only visibles ── */
    .print-header,
    .print-cgv-wrapper {
        position: static !important;
        left: 0 !important;
        height: auto !important;
        overflow: visible !important;
        visibility: visible !important;
        display: block !important;
    }

    /* ── Masquer tout sauf le document print ── */
    body > *:not(main) { display: none !important; }
    main > *:not(.print-header):not(.print-cgv-wrapper) { display: none !important; }
    main { padding: 0 !important; background: #fff !important; }

    /* ── CGV deux colonnes sur nouvelle page ── */
    .print-cgv   { font-size: 7pt; line-height: 1.35; columns: 2; column-gap: 14pt; }
    .print-cgv p { margin-bottom: 3pt; text-align: justify; break-inside: avoid; }
    .print-cgv h3,
    .print-cgv h4 { font-size: 8pt; font-weight: bold; margin-bottom: 3pt; break-after: avoid; }
    .print-cgv section { break-inside: avoid; margin-bottom: 6pt; }
}

.spin { animation: spin 1s linear infinite; display:inline-block; }
@keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }