/* =============================================
   GARAGE PRO v3.0 - Design System
   Style: Apple / Samsung One UI
   ============================================= */

/* --- RESET & TOKENS --- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --c-bg:        #f2f2f7;
  --c-surface:   #ffffff;
  --c-surface2:  #f9f9fb;
  --c-border:    #e4e4e8;
  --c-text:      #1c1c1e;
  --c-text2:     #6c6c70;
  --c-text3:     #aeaeb2;
  --c-blue:      #007aff;
  --c-blue-dark: #0060df;
  --c-green:     #34c759;
  --c-orange:    #ff9500;
  --c-red:       #ff3b30;
  --c-gold:      #c9a84c;

  --r-sm:  8px;
  --r-md:  12px;
  --r-lg:  16px;
  --r-xl:  20px;

  --sh-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
  --sh-md: 0 4px 16px rgba(0,0,0,.10);
  --sh-lg: 0 12px 40px rgba(0,0,0,.14);

  --font: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

html { font-size: 16px; }
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
body {
  font-family: var(--font);
  background: var(--c-bg);
  color: var(--c-text);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--c-blue); text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: var(--font); cursor: pointer; }
input, select, textarea { font-family: var(--font); }

/* --- LAYOUT --- */
.app-wrap {
  min-height: 100vh;
  padding-top: 60px; /* header height */
  max-width: 100%;
  overflow-x: hidden;
}

.container {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
}

.page-body {
  padding: 24px 16px;
  max-width: 1100px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

/* --- HEADER --- */
.app-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 60px;
  background: rgba(255,255,255,0.88);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--c-border);
  z-index: 900;
  display: flex;
  align-items: center;
}

.header-inner {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.header-logo {
  font-size: 22px;
  font-weight: 700;
  color: var(--c-text);
  letter-spacing: -0.5px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.header-logo .logo-icon {
  width: 30px;
  height: 30px;
  background: var(--c-text);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}

/* --- GLOBAL SEARCH --- */
.header-search {
  flex: 1;
  max-width: 480px;
  position: relative;
}

.search-field {
  width: 100%;
  height: 36px;
  padding: 0 12px 0 36px;
  background: var(--c-bg);
  border: 1.5px solid var(--c-border);
  border-radius: 10px;
  font-size: 14px;
  color: var(--c-text);
  transition: border-color .2s, box-shadow .2s, background .2s;
  outline: none;
}

.search-field::placeholder { color: var(--c-text3); }

.search-field:focus {
  background: var(--c-surface);
  border-color: var(--c-blue);
  box-shadow: 0 0 0 3px rgba(0,122,255,.12);
}

.search-ico {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--c-text3);
  pointer-events: none;
}

/* DROPDOWN AUTOSUGGEST */
.search-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0; right: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-lg);
  overflow: hidden;
  z-index: 1000;
}
.search-dropdown.open { display: block; }

.sd-group-label {
  padding: 8px 14px 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: var(--c-text3);
}

.sd-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  cursor: pointer;
  transition: background .15s;
}
.sd-item:hover { background: var(--c-bg); }

.sd-item-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--c-bg);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.sd-item-text { min-width: 0; }
.sd-item-title { font-size: 14px; font-weight: 500; color: var(--c-text); }
.sd-item-sub { font-size: 12px; color: var(--c-text2); }

.sd-empty {
  padding: 20px;
  text-align: center;
  color: var(--c-text3);
  font-size: 14px;
}

.sd-loading {
  padding: 20px;
  text-align: center;
  color: var(--c-text3);
  font-size: 14px;
}

/* HEADER RIGHT */
.header-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
}

.header-user {
  font-size: 13px;
  color: var(--c-text2);
  display: none;
}
@media(min-width:640px){ .header-user { display: block; } }

.btn-logout {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: transparent;
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-sm);
  font-size: 13px;
  font-weight: 500;
  color: var(--c-text2);
  transition: all .2s;
}
.btn-logout:hover { background: var(--c-bg); color: var(--c-red); border-color: var(--c-red); }

/* Bouton Reset ACF dans le header (admin seulement) */
.btn-header-acf {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 11px;
  background: transparent;
  border: 1.5px solid rgba(220,38,38,.35);
  border-radius: var(--r-sm);
  font-size: 12px;
  font-weight: 600;
  color: var(--c-red);
  text-decoration: none;
  transition: all .2s;
  white-space: nowrap;
}
.btn-header-acf:hover { background: rgba(220,38,38,.08); border-color: var(--c-red); }
@media(max-width:640px) { .btn-header-acf span { display:none; } }

/* --- NAV TABS --- */
.nav-tabs {
  display: flex;
  gap: 4px;
  padding: 4px;
  background: var(--c-surface);
  border-radius: var(--r-lg);
  border: 1px solid var(--c-border);
  box-shadow: var(--sh-sm);
  margin-bottom: 24px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.nav-tab {
  flex: 1;
  min-width: max-content;
  padding: 8px 16px;
  border-radius: var(--r-md);
  background: transparent;
  border: none;
  font-size: 13px;
  font-weight: 500;
  color: var(--c-text2);
  text-align: center;
  transition: all .2s;
  text-decoration: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.nav-tab.active, .nav-tab:hover {
  background: var(--c-blue);
  color: #fff;
}

/* --- PAGE HEADER --- */
.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  gap: 12px;
  flex-wrap: wrap;
}

.page-title {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.6px;
  color: var(--c-text);
}

.page-subtitle {
  font-size: 14px;
  color: var(--c-text2);
  margin-top: 2px;
}

/* --- STATS ROW --- */
.stats-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}
@media(min-width:640px){ .stats-row { grid-template-columns: repeat(4, 1fr); } }

.stat-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  padding: 16px;
  box-shadow: var(--sh-sm);
}

.stat-value {
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -1px;
  line-height: 1;
  margin-bottom: 4px;
}

.stat-label {
  font-size: 12px;
  color: var(--c-text2);
  font-weight: 500;
}

.stat-icon {
  font-size: 20px;
  margin-bottom: 8px;
}

/* --- LISTINGS COMPACTS : 4 cartes sur desktop --- */
.cards-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media(min-width:560px){ .cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(min-width:900px){ .cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } }
@media(min-width:1180px){ .cards-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; } }

/* VEHICLE CARD */
.v-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--sh-sm);
  transition: box-shadow .25s, transform .25s;
  display: flex;
  flex-direction: column;
}
.v-card:hover { box-shadow: var(--sh-md); transform: translateY(-2px); }

.v-card-img {
  aspect-ratio: 16/9;
  background: var(--c-bg);
  overflow: hidden;
  position: relative;
}
.v-card-img img { width: 100%; height: 100%; object-fit: cover; }
.v-card-img-placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  font-size: 48px;
  color: var(--c-border);
}

.v-card-badge {
  position: absolute;
  top: 10px; right: 10px;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  backdrop-filter: blur(10px);
}
.badge-en-cours  { background: rgba(255,149,0,.9);  color: #fff; }
.badge-termine   { background: rgba(52,199,89,.9);  color: #fff; }
.badge-attente   { background: rgba(108,108,112,.7); color: #fff; }

.v-card-body { padding: 14px 16px; flex: 1; display: flex; flex-direction: column; gap: 4px; }
.v-card-immat { font-size: 17px; font-weight: 700; letter-spacing: .5px; }
.v-card-model { font-size: 13px; color: var(--c-text2); }

.v-card-actions {
  display: flex;
  gap: 8px;
  padding: 0 16px 14px;
  flex-wrap: wrap;
}

/* --- CLIENT CARD --- */
.client-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl);
  padding: 16px;
  box-shadow: var(--sh-sm);
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: box-shadow .25s, transform .25s;
}
.client-card:hover { box-shadow: var(--sh-md); transform: translateY(-2px); }

.client-card-top {
  display: flex;
  align-items: center;
  gap: 12px;
}

.client-avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--c-bg);
  border: 1.5px solid var(--c-border);
  overflow: hidden;
  flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
}
.client-avatar img { width: 100%; height: 100%; object-fit: cover; }

.client-info { min-width: 0; }
.client-name { font-size: 15px; font-weight: 600; }
.client-email { font-size: 12px; color: var(--c-text2); }

.client-badge {
  margin-left: auto;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  background: var(--c-bg);
  color: var(--c-text2);
  white-space: nowrap;
}
.client-badge.premium { background: rgba(201,168,76,.15); color: var(--c-gold); }

.client-stats {
  display: flex;
  gap: 16px;
}
.client-stat { font-size: 12px; color: var(--c-text2); }
.client-stat strong { color: var(--c-text); }

.client-card-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* --- BUTTONS --- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 16px;
  border-radius: var(--r-md);
  font-size: 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap;
  text-decoration: none;
}

.btn-primary   { background: var(--c-blue); color: #fff; }
.btn-primary:hover { background: var(--c-blue-dark); }

.btn-success   { background: var(--c-green); color: #fff; }
.btn-success:hover { filter: brightness(1.1); }

.btn-danger    { background: rgba(255,59,48,.1); color: var(--c-red); border: 1.5px solid rgba(255,59,48,.2); }
.btn-danger:hover { background: var(--c-red); color: #fff; }

.btn-ghost     { background: var(--c-bg); color: var(--c-text); border: 1.5px solid var(--c-border); }
.btn-ghost:hover { background: var(--c-border); }

.btn-sm { padding: 6px 12px; font-size: 12px; border-radius: var(--r-sm); }
.btn-icon { width: 34px; height: 34px; padding: 0; border-radius: var(--r-sm); }
.btn-full { width: 100%; }

/* --- FORMS --- */
.form-section { margin-bottom: 24px; }
.form-section-title { font-size: 13px; font-weight: 700; color: var(--c-text2); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 12px; }

.form-grid { display: grid; gap: 14px; }
.form-grid-2 { grid-template-columns: 1fr 1fr; }
@media(max-width:480px){ .form-grid-2 { grid-template-columns: 1fr; } }

.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-label { font-size: 13px; font-weight: 600; color: var(--c-text); }
.form-label .req { color: var(--c-red); }

.form-control {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  background: var(--c-bg);
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-md);
  font-size: 15px;
  color: var(--c-text);
  outline: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.form-control::placeholder { color: var(--c-text3); }
.form-control:focus {
  background: var(--c-surface);
  border-color: var(--c-blue);
  box-shadow: 0 0 0 3px rgba(0,122,255,.12);
}
textarea.form-control { height: auto; min-height: 90px; padding: 10px 12px; resize: vertical; }
select.form-control { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236c6c70' d='M6 8L0 0h12z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; }

/* PIECE SELECTOR */
.pieces-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.piece-row {
  display: grid;
  grid-template-columns: 1fr 80px 34px;
  gap: 8px;
  align-items: center;
}

/* ALERT STOCK */
.stock-alert {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--c-red);
  background: rgba(255,59,48,.08);
  padding: 2px 8px;
  border-radius: 20px;
}

/* --- MODAL --- */
.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(4px);
  z-index: 1000;
  align-items: flex-end;
  justify-content: center;
}
@media(min-width:640px){ .modal-overlay { align-items: center; } }
.modal-overlay.open { display: flex; }

/* =============================================
   MENU FLOTTANT — toggles statut (réparation/paiement/véhicule)
   ============================================= */

.gp-float-menu {
  position: fixed;
  z-index: 2000;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 12px;
  box-shadow: var(--sh-lg);
  padding: 6px;
  min-width: 170px;
  animation: gpFloatIn .15s ease;
}

@keyframes gpFloatIn {
  from { opacity: 0; transform: translateY(-4px) scale(.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.gp-float-menu-item {
  display: block;
  width: 100%;
  text-align: left;
  padding: 9px 12px;
  border: none;
  background: none;
  cursor: pointer;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--font);
  transition: background .12s;
}
.gp-float-menu-item:hover { background: var(--c-bg); }

/* Petite flèche pointant vers le bouton d'origine (desktop) */
.gp-float-menu::before {
  content: '';
  position: absolute;
  top: -6px;
  left: var(--arrow-left, 16px);
  width: 12px;
  height: 12px;
  background: var(--c-surface);
  border-left: 1px solid var(--c-border);
  border-top: 1px solid var(--c-border);
  transform: rotate(45deg);
}

.gp-float-menu.gp-float-up::before {
  top: auto;
  bottom: -6px;
  border-left: none;
  border-top: none;
  border-right: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
}

/* Sur mobile : bottom-sheet ancré en bas, plus simple à atteindre au doigt, aucun calcul de débordement nécessaire */
@media (max-width: 640px) {
  .gp-float-menu {
    left: 12px !important;
    right: 12px;
    bottom: max(16px, env(safe-area-inset-bottom));
    top: auto !important;
    width: auto;
    min-width: 0;
    padding: 8px;
    animation: gpFloatInMobile .2s ease;
  }
  .gp-float-menu::before { display: none; }
  .gp-float-menu-item { padding: 12px 14px; font-size: 14px; text-align: center; }
}

@keyframes gpFloatInMobile {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}

.gp-float-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.25);
  z-index: 1999;
}
@media (max-width: 640px) {
  .gp-float-backdrop.open { display: block; }
}

.modal-sheet {
  background: var(--c-surface);
  width: 100%;
  max-width: 520px;
  border-radius: var(--r-xl) var(--r-xl) 0 0;
  max-height: 95vh;
  overflow-y: auto;
  overflow-x: hidden;
  animation: slideUp .3s cubic-bezier(.25,.46,.45,.94);
  box-sizing: border-box;
}
@media(min-width:640px){
  .modal-sheet { border-radius: var(--r-xl); animation: scaleIn .25s cubic-bezier(.25,.46,.45,.94); }
}
@media(max-width:639px){
  .modal-sheet { max-height: 92vh; max-height: 92dvh; }
}

@keyframes slideUp   { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes scaleIn   { from { transform: scale(.95); opacity: 0; } to { transform: scale(1); opacity: 1; } }

.modal-handle {
  width: 36px; height: 4px;
  background: var(--c-border);
  border-radius: 2px;
  margin: 10px auto 0;
  display: block;
}
@media(min-width:640px){ .modal-handle { display: none; } }

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 20px 16px;
  border-bottom: 1px solid var(--c-border);
}
.modal-title { font-size: 18px; font-weight: 700; }
.modal-close {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--c-bg);
  border: none;
  font-size: 16px;
  color: var(--c-text2);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}

.modal-body { padding: 20px; }
.modal-footer { padding: 16px 20px; border-top: 1px solid var(--c-border); display: flex; gap: 10px; }

/* --- TABLE --- */
.table-wrap { overflow-x: auto; border-radius: var(--r-lg); border: 1px solid var(--c-border); box-shadow: var(--sh-sm); }
.gp-table { width: 100%; min-width: 640px; border-collapse: collapse; background: var(--c-surface); }
@media(max-width:640px){ .gp-table { min-width: 580px; } }

/* Tableau dense (beaucoup de colonnes) — padding réduit */
.gp-table.table-dense th,
.gp-table.table-dense td { padding: 8px 8px; font-size: 12px; }
.gp-table.table-dense th { font-size: 11px; }
.gp-table thead { background: var(--c-bg); }
.gp-table th { padding: 12px 14px; text-align: left; font-size: 12px; font-weight: 700; color: var(--c-text2); text-transform: uppercase; letter-spacing: .5px; border-bottom: 1px solid var(--c-border); white-space: nowrap; }
.gp-table td { padding: 12px 14px; border-bottom: 1px solid var(--c-border); font-size: 14px; vertical-align: middle; }
.gp-table tbody tr:last-child td { border-bottom: none; }
.gp-table tbody tr:hover { background: var(--c-bg); }
.gp-table td.low-stock { color: var(--c-red); font-weight: 600; }

/* --- SECTION CARD --- */
.section-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl);
  box-shadow: var(--sh-sm);
  overflow: hidden;
  margin-bottom: 16px;
}
.section-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--c-border);
}
.section-card-title { font-size: 16px; font-weight: 700; }
.section-card-body { padding: 20px; }

/* --- TIMELINE INTERVENTIONS --- */
.timeline { display: flex; flex-direction: column; gap: 0; }
.tl-item { display: flex; gap: 14px; padding-bottom: 20px; position: relative; }
.tl-item::before { content: ''; position: absolute; left: 15px; top: 32px; bottom: 0; width: 2px; background: var(--c-border); }
.tl-item:last-child::before { display: none; }
.tl-dot { width: 32px; height: 32px; border-radius: 50%; background: var(--c-blue); display: flex; align-items: center; justify-content: center; font-size: 14px; flex-shrink: 0; color: #fff; z-index: 1; }
.tl-content { flex: 1; background: var(--c-bg); border-radius: var(--r-md); padding: 12px 14px; min-width: 0; }
.tl-date { font-size: 11px; color: var(--c-text3); margin-bottom: 4px; }
.tl-desc { font-size: 14px; color: var(--c-text); margin-bottom: 6px; }
.tl-meta { font-size: 12px; color: var(--c-text2); display: flex; gap: 12px; flex-wrap: wrap; }
.tl-photos { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.tl-photo { width: 64px; height: 48px; border-radius: 6px; overflow: hidden; cursor: pointer; }
.tl-photo img { width: 100%; height: 100%; object-fit: cover; }

/* --- FILTERS BAR --- */
.filters-bar {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
  align-items: center;
}
.filters-bar .form-control { height: 36px; font-size: 13px; max-width: 180px; }
.filter-search { flex: 1; min-width: 200px; max-width: 100% !important; }

/* --- EMPTY STATE --- */
.empty-state {
  padding: 60px 20px;
  text-align: center;
  color: var(--c-text3);
}
.empty-icon { font-size: 52px; margin-bottom: 12px; }
.empty-title { font-size: 18px; font-weight: 600; color: var(--c-text2); margin-bottom: 6px; }
.empty-sub { font-size: 14px; }

/* --- NOTIFICATION TOAST --- */
.toast-wrap { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 2000; display: flex; flex-direction: column; align-items: center; gap: 8px; pointer-events: none; }
.toast { padding: 12px 20px; border-radius: 50px; background: var(--c-text); color: #fff; font-size: 14px; font-weight: 500; box-shadow: var(--sh-lg); opacity: 0; animation: toastIn .3s forwards, toastOut .3s 2.5s forwards; pointer-events: all; }
.toast.toast-success { background: var(--c-green); }
.toast.toast-error   { background: var(--c-red); }
@keyframes toastIn  { from { opacity:0; transform: translateY(10px); } to { opacity:1; transform: translateY(0); } }
@keyframes toastOut { from { opacity:1; } to { opacity:0; } }

/* --- BADGE --- */
.badge { display: inline-block; padding: 3px 8px; border-radius: 20px; font-size: 11px; font-weight: 600; }
.badge-blue   { background: rgba(0,122,255,.1);   color: var(--c-blue);   }
.badge-green  { background: rgba(52,199,89,.1);   color: var(--c-green);  }
.badge-orange { background: rgba(255,149,0,.1);   color: var(--c-orange); }
.badge-red    { background: rgba(255,59,48,.1);   color: var(--c-red);    }
.badge-gray   { background: var(--c-bg);           color: var(--c-text2);  }

/* --- PAGINATION --- */
.pagination { display: flex; gap: 4px; justify-content: center; margin-top: 24px; flex-wrap: wrap; }
.pagination .page-numbers { padding: 8px 14px; border-radius: var(--r-md); background: var(--c-surface); border: 1px solid var(--c-border); font-size: 14px; font-weight: 500; color: var(--c-text2); text-decoration: none; }
.pagination .current, .pagination .page-numbers:hover { background: var(--c-blue); color: #fff; border-color: var(--c-blue); }

/* --- LOGIN PAGE --- */
.login-page {
  min-height: 100vh;
  background: var(--c-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.login-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl);
  padding: 40px 32px;
  width: 100%;
  max-width: 380px;
  box-shadow: var(--sh-lg);
}

.login-logo-wrap {
  text-align: center;
  margin-bottom: 28px;
}
.login-logo-icon {
  width: 64px; height: 64px;
  background: var(--c-text);
  border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
  font-size: 32px;
  margin: 0 auto 12px;
}
.login-app-name { font-size: 24px; font-weight: 700; letter-spacing: -0.5px; }
.login-tagline { font-size: 13px; color: var(--c-text2); margin-top: 4px; }

.login-error {
  background: rgba(255,59,48,.08);
  border: 1px solid rgba(255,59,48,.2);
  border-radius: var(--r-md);
  padding: 10px 14px;
  font-size: 14px;
  color: var(--c-red);
  margin-bottom: 16px;
}

/* --- RESPONSIVE TWEAKS --- */
@media(max-width:640px) {
  .page-title { font-size: 22px; }
  .header-search { flex: none; position: absolute; left: 0; right: 0; top: 60px; padding: 8px 12px; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--c-border); display: none; }
  .header-search.mobile-open { display: block; }
  .btn-search-toggle { display: flex; }
  .stat-value { font-size: 26px; }
  .modal-sheet { max-height: 90vh; }
}

.btn-search-toggle {
  display: none;
  width: 36px; height: 36px;
  align-items: center; justify-content: center;
  background: var(--c-bg);
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-sm);
  font-size: 16px;
}
@media(max-width:640px){ .btn-search-toggle { display: flex; } }
@media(min-width:641px){ .header-search { display: block !important; } }

/* --- WHATSAPP BUTTON --- */
.btn-whatsapp {
  background: #25d366;
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border-radius: var(--r-md);
  font-size: 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: filter .2s;
  text-decoration: none;
}
.btn-whatsapp:hover { filter: brightness(1.1); }

/* --- MISE EN ÉVIDENCE ENVOI WA / ESPACE CLIENT --- */
.btn-wa-highlight {
  background: linear-gradient(135deg, #25d366, #1ebe57);
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border-radius: var(--r-md);
  font-size: 13px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 2px 10px rgba(37,211,102,.35);
  transition: transform .15s, box-shadow .15s, filter .15s;
  white-space: nowrap;
}
.btn-wa-highlight:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(37,211,102,.45);
  filter: brightness(1.05);
}
.btn-wa-highlight.btn-sm { padding: 7px 12px; font-size: 12px; }

@keyframes waPulseRing {
  0%   { box-shadow: 0 2px 10px rgba(37,211,102,.35), 0 0 0 0 rgba(37,211,102,.5); }
  70%  { box-shadow: 0 2px 10px rgba(37,211,102,.35), 0 0 0 8px rgba(37,211,102,0); }
  100% { box-shadow: 0 2px 10px rgba(37,211,102,.35), 0 0 0 0 rgba(37,211,102,0); }
}
.btn-wa-highlight.pulse { animation: waPulseRing 2.4s ease-out 1; }

.btn-wa-highlight.btn-icon {
  width: 32px;
  height: 32px;
  padding: 0;
  justify-content: center;
  border-radius: 50%;
  box-shadow: 0 1px 6px rgba(37,211,102,.35);
}

/* profil photo upload */
.avatar-upload { display: flex; align-items: center; gap: 12px; }
.avatar-preview {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: var(--c-bg);
  border: 1.5px solid var(--c-border);
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
}
.avatar-preview img { width:100%; height:100%; object-fit:cover; }

/* =============================================
   QUICK ACTIONS — Dashboard
   ============================================= */

.quick-actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

@media(min-width: 480px) {
  .quick-actions {
    grid-template-columns: repeat(4, 1fr);
  }
}

.quick-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 20px 12px;
  background: var(--c-bg);
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-lg);
  cursor: pointer;
  transition: all .2s;
  text-decoration: none;
  font-family: var(--font);
}

.quick-btn:hover {
  background: var(--c-blue);
  border-color: var(--c-blue);
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
}

.quick-btn:hover .quick-btn-icon,
.quick-btn:hover .quick-btn-label {
  color: #fff;
}

.quick-btn-icon {
  font-size: 28px;
  line-height: 1;
}

.quick-btn-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-text);
  white-space: nowrap;
}

/* =============================================
   CORRECTIONS DIVERSES
   ============================================= */

/* Formulaire recherche dans les pages */
.filters-bar input.form-control,
.filters-bar select.form-control {
  color: var(--c-text);
  background: white;
}

/* Garantir texte visible dans search header */
.search-field {
  color: var(--c-text) !important;
}

.search-field:focus {
  color: var(--c-text) !important;
}

/* =============================================
   LOADER GLOBAL
   ============================================= */

.gp-loader-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(4px);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn .2s ease;
}

.gp-loader-box {
  background: white;
  border-radius: var(--r-xl);
  padding: 28px 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  box-shadow: var(--sh-lg);
  min-width: 180px;
  animation: scaleIn .2s ease;
}

.gp-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid var(--c-border);
  border-top-color: var(--c-blue);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}

.gp-loader-msg {
  font-size: 14px;
  font-weight: 600;
  color: var(--c-text2);
}

.gp-loader-out .gp-loader-backdrop {
  animation: fadeOut .3s ease forwards;
}

/* Spinner inline pour search */
.sd-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid var(--c-border);
  border-top-color: var(--c-blue);
  border-radius: 50%;
  animation: spin .6s linear infinite;
  vertical-align: middle;
  margin-right: 6px;
}

@keyframes spin     { to { transform: rotate(360deg); } }
@keyframes fadeIn   { from { opacity:0; } to { opacity:1; } }
@keyframes fadeOut  { from { opacity:1; } to { opacity:0; } }

/* =============================================
   ANIMATIONS CARDS AU SCROLL
   ============================================= */

.gp-fade-in {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .4s ease, transform .4s ease;
}

.gp-fade-in.gp-visible {
  opacity: 1;
  transform: translateY(0);
}

/* =============================================
   TRANSITIONS MODALS — fusionné avec la règle de base
   ============================================= */
/* (transitions déjà gérées par .modal-overlay / .modal-sheet ci-dessus) */

/* =============================================
   BOUTON LOADER INLINE (dans btn)
   ============================================= */

.btn.loading {
  position: relative;
  pointer-events: none;
  opacity: .7;
}
.btn.loading::after {
  content: '';
  width: 14px; height: 14px;
  border: 2px solid rgba(255,255,255,.4);
  border-top-color: white;
  border-radius: 50%;
  animation: spin .6s linear infinite;
  margin-left: 8px;
  display: inline-block;
  vertical-align: middle;
}

/* =============================================
   PAGE TRANSITION
   ============================================= */

.page-body {
  animation: pageIn .35s ease;
}

@keyframes pageIn {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:translateY(0);    }
}

/* =============================================
   FICHE INTERVENTION IMPRIMABLE
   ============================================= */

.fiche-print {
  background: white;
  border: 1px solid var(--c-border);
  border-radius: var(--r-xl);
  padding: 32px;
  margin-top: 16px;
  box-shadow: var(--sh-sm);
  font-size: 14px;
}

.fiche-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 2px solid var(--c-text);
}

.fiche-logo { display: flex; align-items: center; gap: 12px; }
.fiche-meta { text-align: right; }
.fiche-num  { font-size: 22px; font-weight: 800; letter-spacing: -0.5px; }

.fiche-section-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
@media(max-width:640px) { .fiche-section-grid { grid-template-columns: 1fr; } }

.fiche-bloc {
  background: var(--c-bg);
  border-radius: var(--r-md);
  padding: 16px;
  border: 1px solid var(--c-border);
}

.fiche-bloc-title {
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--c-text2);
  margin-bottom: 12px;
}

.fiche-table-info { width: 100%; border-collapse: collapse; }
.fiche-table-info td { padding: 5px 4px; font-size: 13px; border-bottom: 1px solid var(--c-border); }
.fiche-table-info td:first-child { color: var(--c-text2); width: 50%; }

.fiche-desc {
  background: white;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  padding: 12px;
  font-size: 14px;
  line-height: 1.7;
  min-height: 60px;
}

.fiche-table-pieces {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.fiche-table-pieces th {
  background: var(--c-primary);
  color: white;
  padding: 8px 10px;
  text-align: left;
  font-size: 11px;
  text-transform: uppercase;
}
.fiche-table-pieces td { padding: 8px 10px; border-bottom: 1px solid var(--c-border); }
.fiche-table-pieces tfoot td { background: var(--c-bg); font-size: 14px; border-top: 2px solid var(--c-text); }

.fiche-couts { margin-top: 16px; }
.fiche-table-couts { width: 100%; border-collapse: collapse; }
.fiche-table-couts td { padding: 10px 0; border-bottom: 1px solid var(--c-border); font-size: 14px; }
.fiche-table-couts td:last-child { text-align: right; font-weight: 600; }
.fiche-total-row td { border-top: 2px solid var(--c-text); padding-top: 12px; font-size: 16px !important; }

.fiche-commentaires { margin-top: 16px; }
.fiche-lines { padding: 8px 0; }
.fiche-line {
  height: 32px;
  border-bottom: 1px solid var(--c-border);
  margin-bottom: 4px;
}

.fiche-photos { display: flex; flex-wrap: wrap; gap: 8px; }
.fiche-photo  { width: 120px; height: 90px; object-fit: cover; border-radius: 6px; border: 1px solid var(--c-border); cursor: pointer; }

.fiche-signatures {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
}
.fiche-signature-bloc { text-align: center; }
.fiche-signature-line { height: 60px; border-bottom: 1px solid var(--c-text); margin-bottom: 8px; }
.fiche-signature-label { font-size: 11px; color: var(--c-text2); }

.fiche-footer {
  display: flex;
  justify-content: space-between;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--c-border);
  font-size: 11px;
  color: var(--c-text3);
}

/* ── PRINT CSS ── */
@media print {
  .main-header, .nav-tabs, .page-header .btn, .print-hide,
  .modal-overlay, #toastWrap, #gpLoader {
    display: none !important;
  }

  body { background: white !important; }
  .app-wrap { padding-top: 0 !important; }
  .page-body { padding: 0 !important; animation: none !important; }

  .fiche-print {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 20px !important;
    page-break-inside: avoid;
  }

  .fiche-photo { width: 100px !important; height: 75px !important; }
  .fiche-photos { gap: 4px !important; }

  .page-header { display: none !important; }
}

/* =============================================
   SPLASH SCREEN — Bonjour
   ============================================= */

.gp-splash {
  position: fixed;
  inset: 0;
  background: var(--c-text);
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity .4s ease, visibility .4s;
}

.gp-splash.gp-splash-done {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.gp-splash-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  color: white;
}

.gp-splash-logo {
  font-size: 64px;
  animation: splashPop .5s cubic-bezier(.25,1.5,.5,1) both;
}

.gp-splash-hello {
  font-size: 18px;
  color: rgba(255,255,255,.6);
  animation: splashFade .4s .2s ease both;
}

.gp-splash-name {
  font-size: 36px;
  font-weight: 800;
  letter-spacing: -1px;
  animation: splashFade .4s .35s ease both;
}

.gp-splash-sub {
  font-size: 13px;
  color: rgba(255,255,255,.4);
  margin-top: 4px;
  animation: splashFade .4s .5s ease both;
}

.gp-splash-bar {
  width: 160px;
  height: 3px;
  background: rgba(255,255,255,.15);
  border-radius: 2px;
  margin-top: 20px;
  overflow: hidden;
  animation: splashFade .4s .5s ease both;
}

.gp-splash-progress {
  height: 100%;
  background: var(--c-blue);
  border-radius: 2px;
  width: 0;
  animation: splashProgress 1.4s .6s cubic-bezier(.4,0,.2,1) forwards;
}

@keyframes splashPop     { from { transform:scale(.5); opacity:0; } to { transform:scale(1); opacity:1; } }
@keyframes splashFade    { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes splashProgress{ from { width:0; } to { width:100%; } }

/* =============================================
   STAT CARDS CLIQUABLES
   ============================================= */

.stat-card-link {
  text-decoration: none;
  color: inherit;
  display: block;
  transition: box-shadow .2s, transform .2s, border-color .2s;
  cursor: pointer;
}

.stat-card-link:hover {
  box-shadow: var(--sh-md);
  transform: translateY(-3px);
  border-color: var(--c-blue);
}

.stat-hint {
  font-size: 11px;
  color: var(--c-text3);
  margin-top: 4px;
  transition: color .2s;
}

.stat-card-link:hover .stat-hint {
  color: var(--c-blue);
}

/* =============================================
   TIMELINE — améliorations photos
   ============================================= */

.tl-header-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.tl-date-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.tl-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

.tl-comment {
  background: rgba(0,122,255,.05);
  border-left: 3px solid var(--c-blue);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
  padding: 8px 12px;
  margin-top: 8px;
}

/* Photos avant/après dans timeline */
.tl-photos-section {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.tl-photos-group {}

.tl-photos-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--c-text3);
  margin-bottom: 6px;
}

.tl-photos {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tl-photo {
  width: 72px;
  height: 54px;
  border-radius: var(--r-sm);
  overflow: hidden;
  border: 1.5px solid var(--c-border);
  cursor: zoom-in;
  transition: transform .2s, box-shadow .2s;
  flex-shrink: 0;
}

.tl-photo:hover {
  transform: scale(1.08);
  box-shadow: var(--sh-md);
  border-color: var(--c-blue);
  z-index: 1;
}

.tl-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* =============================================
   LIGHTBOX
   ============================================= */

#gpLightboxOverlay {
  animation: fadeIn .2s ease;
}

#gpLightboxOverlay.open {
  display: flex !important;
}

@media print {
  .gp-splash, .nav-tabs, .main-header { display: none !important; }
  .page-body { animation: none !important; opacity: 1 !important; }
}

/* =============================================
   AUTO-SUGGEST IMMATRICULATION (modal intervention)
   ============================================= */

.gp-autosuggest {
  display: none;
  position: absolute;
  top: 100%;
  left: 0; right: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--sh-lg);
  z-index: 50;
  max-height: 220px;
  overflow-y: auto;
  margin-top: 4px;
}
.gp-autosuggest.open { display: block; }

.gp-autosuggest-item {
  padding: 10px 12px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid var(--c-border);
  font-size: 13px;
}
.gp-autosuggest-item:last-child { border-bottom: none; }
.gp-autosuggest-item:hover { background: var(--c-bg); }

.gp-autosuggest-immat { font-weight: 700; letter-spacing: 1px; }
.gp-autosuggest-meta  { font-size: 11px; color: var(--c-text2); text-align: right; }

.immat-owner-hint {
  font-size: 12px;
  color: var(--c-blue);
  margin-top: 6px;
  font-weight: 600;
  min-height: 16px;
}

/* =============================================
   STAT "À PRÉVOIR" — sidebar dashboard
   ============================================= */

.a-prevoir-item {
  background: var(--c-bg);
  border-radius: var(--r-md);
  padding: 12px;
  border-left: 3px solid var(--c-orange);
  margin-bottom: 8px;
}
.a-prevoir-item:last-child { margin-bottom: 0; }

.a-prevoir-veh {
  font-size: 12px;
  font-weight: 700;
  color: var(--c-text);
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.a-prevoir-owner { font-size: 11px; color: var(--c-text2); font-weight: 400; }
.a-prevoir-text  { font-size: 13px; color: var(--c-text2); line-height: 1.5; white-space: pre-wrap; }

/* Sur PC : items en grille horizontale compacte dans le .dashboard-side */
@media(min-width: 960px) {
  .dashboard-side .section-card-body {
    max-height: 220px;
    overflow-y: auto;
  }
  .dashboard-side .a-prevoir-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    margin-bottom: 4px;
  }
  .dashboard-side .a-prevoir-veh { margin-bottom: 0; flex: 1; min-width: 0; }
  .dashboard-side .a-prevoir-text { font-size: 12px; flex: 2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* =============================================
   À PRÉVOIR — page complète
   ============================================= */

.ap-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-left: 4px solid var(--c-orange);
  border-radius: var(--r-lg);
  padding: 16px;
  margin-bottom: 12px;
}
.ap-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.ap-card-title { font-weight: 700; font-size: 15px; }
.ap-card-sub   { font-size: 12px; color: var(--c-text2); }
.ap-card textarea { width: 100%; }
.ap-card-actions { display: flex; gap: 8px; margin-top: 10px; }

/* Owner badge dans cards véhicules / interventions */
.v-card-owner {
  font-size: 11px;
  color: var(--c-text2);
  display: flex;
  align-items: center;
  gap: 4px;
  margin-top: 2px;
}

/* =============================================
   DASHBOARD GRID (main + sidebar à prévoir)
   ============================================= */

/* Dashboard : colonne unique, à prévoir en haut puis interventions */
.dashboard-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

.dashboard-side  { min-width: 0; order: 1; }
.dashboard-main  { min-width: 0; order: 2; }

/* Sur PC et tablette : à prévoir reste en haut (compact), interventions dessous */
@media(min-width: 960px) {
  .dashboard-side { order: 1; }
  .dashboard-main { order: 2; }
}

/* 5 stat cards */
.stats-row-5 {
  grid-template-columns: repeat(2, 1fr);
}
@media(min-width: 640px) {
  .stats-row-5 { grid-template-columns: repeat(3, 1fr); }
}
@media(min-width: 1100px) {
  .stats-row-5 { grid-template-columns: repeat(5, 1fr); }
}

/* =============================================
   TABLEAU STOCK BAS — dashboard
   ============================================= */

.low-stock    { color: var(--c-red); font-weight: 700; }
.stock-alert  { font-size: 14px; }

/* =============================================
   LIGNES INTERVENTION CLIQUABLES
   ============================================= */

.gp-table tr.clickable-row {
  cursor: pointer;
  transition: background .15s;
}
.gp-table tr.clickable-row:hover {
  background: rgba(0,122,255,.04);
}

/* =============================================
   COUTS RECAP dans modal intervention
   ============================================= */

#coutsRecap {
  animation: fadeIn .2s ease;
}

/* =============================================
   MODAL WA — radio labels hover
   ============================================= */

#modalWA label:has(input[type="radio"]:checked) {
  border-color: var(--c-blue);
  background: rgba(0,122,255,.04);
}

/* stats-row-6 */
.stats-row-6 {
  grid-template-columns: repeat(2, 1fr);
}
@media(min-width: 640px)  { .stats-row-6 { grid-template-columns: repeat(3, 1fr); } }
@media(min-width: 1200px) { .stats-row-6 { grid-template-columns: repeat(6, 1fr); } }

/* =============================================
   FAB — Bouton flottant actions rapides
   ============================================= */

/* =============================================
   FAB — Bouton flottant "couteau suisse" en arc
   ============================================= */

#gpFAB {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 1000;
}

.fab-main {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: var(--c-blue);
  color: white;
  border: none;
  font-size: 28px;
  font-weight: 300;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(0,122,255,.4);
  transition: transform .25s, background .2s;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
}
.fab-main:hover { background: #0056cc; }
.fab-main.open  { transform: rotate(45deg); }

/* Menu en liste verticale, texte toujours visible, se déploie au-dessus du bouton */
.fab-menu {
  position: fixed;
  bottom: 92px;
  right: 24px;
  z-index: 1001;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  pointer-events: none;
}

.fab-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: 14px;
  padding: 12px 16px;
  box-shadow: var(--sh-md);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  color: var(--c-text);
  cursor: pointer;
  font-family: var(--font);
  white-space: nowrap;
  opacity: 0;
  transform: translateY(10px) scale(.96);
  transition: transform .22s cubic-bezier(.34,1.56,.64,1), opacity .18s;
  pointer-events: none;
}

.fab-menu.open .fab-item {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: all;
}

/* Décalage progressif pour un effet de cascade à l'ouverture */
.fab-menu.open .fab-item:nth-child(1) { transition-delay: .02s; }
.fab-menu.open .fab-item:nth-child(2) { transition-delay: .05s; }
.fab-menu.open .fab-item:nth-child(3) { transition-delay: .08s; }
.fab-menu.open .fab-item:nth-child(4) { transition-delay: .11s; }
.fab-menu.open .fab-item:nth-child(5) { transition-delay: .14s; }

.fab-item:hover { background: var(--c-blue); color: white; border-color: var(--c-blue); }

.fab-item-icon { font-size: 19px; flex-shrink: 0; width: 22px; text-align: center; }
.fab-item-text { font-size: 14px; }

/* Backdrop semi-opaque pour fermer au tap à côté, et délimiter visuellement le menu actif */
.fab-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0);
  z-index: 999;
  display: none;
}
.fab-backdrop.open { display: block; background: rgba(0,0,0,.15); transition: background .2s; }

@media (max-width: 600px) {
  #gpFAB { bottom: max(20px, env(safe-area-inset-bottom)); right: 18px; }
  .fab-menu {
    bottom: max(86px, calc(env(safe-area-inset-bottom) + 86px));
    right: 18px;
    left: 18px;
  }
  .fab-item { padding: 14px 16px; font-size: 15px; }
  .fab-item-text { font-size: 15px; }
}

/* =============================================
   MODAL WA — destinataires & types docs
   ============================================= */

.wa-dest-group,
.wa-doc-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 6px;
}

.wa-dest-option {
  display: flex;
  cursor: pointer;
}
.wa-dest-option input[type="radio"] { display: none; }
.wa-dest-label {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-md);
  flex: 1;
  transition: border-color .15s, background .15s;
  font-size: 14px;
}
.wa-dest-option input:checked + .wa-dest-label {
  border-color: var(--c-blue);
  background: rgba(0,122,255,.05);
}
.wa-dest-icon { font-size: 22px; }

/* =============================================
   RÉCAP COÛTS MODAL
   ============================================= */

.cout-recap {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  background: var(--c-bg);
  border-radius: var(--r-md);
  padding: 10px 14px;
  font-size: 13px;
  margin-top: 8px;
  border: 1px solid var(--c-border);
}

/* =============================================
   TR CLIQUABLE
   ============================================= */

.tr-link:hover { background: var(--c-bg) !important; }
.tr-link:hover td:first-child { border-left: 3px solid var(--c-blue); }

/* =============================================
   PRIX ACHAT / VENTE dans fiche intervention
   ============================================= */

.prix-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 12px;
}

.prix-bloc {
  text-align: center;
  padding: 14px;
  border-radius: var(--r-md);
  border: 1px solid var(--c-border);
  background: var(--c-bg);
}
.prix-bloc-label { font-size: 11px; color: var(--c-text3); text-transform: uppercase; letter-spacing: .5px; }
.prix-bloc-value { font-size: 22px; font-weight: 800; margin-top: 4px; }

@media print {
  #gpFAB { display: none !important; }
}

/* =============================================
   BARRE D'ACTIONS FICHE INTERVENTION
   ============================================= */

.fiche-action-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  padding: 10px 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
  box-shadow: var(--sh-sm);
}

.fiche-action-bar-left  { display: flex; align-items: center; gap: 8px; }
.fiche-action-bar-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

@media print {
  .fiche-action-bar { display: none !important; }
}

/* =============================================
   NOTIFICATION MÉCANICIEN
   ============================================= */

.mecano-notif-banner {
  background: linear-gradient(135deg, #1a2a3a, #2d4a6a);
  color: white;
  border-radius: var(--r-lg);
  padding: 16px 20px;
  margin-bottom: 16px;
  animation: slideDown .4s ease;
}

.mecano-notif-inner {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.mecano-notif-icon {
  font-size: 28px;
  animation: bell .5s ease .2s both;
  flex-shrink: 0;
}

@keyframes slideDown {
  from { opacity:0; transform:translateY(-10px); }
  to   { opacity:1; transform:translateY(0); }
}

@keyframes bell {
  0%,100% { transform:rotate(0); }
  20%      { transform:rotate(-20deg); }
  40%      { transform:rotate(20deg); }
  60%      { transform:rotate(-10deg); }
  80%      { transform:rotate(10deg); }
}

/* Indicateur dans la timeline */
.tl-mecano-updated {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(0,122,255,.1);
  color: var(--c-blue);
  border-radius: 12px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  margin-left: 8px;
}

@media print {
  .mecano-notif-banner { display: none !important; }
}

/* =============================================
   LISTE ABONNÉS — sélectionnable
   ============================================= */

.abonnes-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.abonne-row {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--c-surface);
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-lg);
  padding: 12px 14px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background .15s;
}

.abonne-row:hover {
  border-color: var(--c-blue);
  box-shadow: var(--sh-sm);
  background: rgba(0,122,255,.03);
}

.abonne-row-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--c-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  overflow: hidden;
  border: 1px solid var(--c-border);
}
.abonne-row-avatar img { width:100%; height:100%; object-fit:cover; }

.abonne-row-info  { flex: 1; min-width: 0; }
.abonne-row-name  { font-weight: 700; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.abonne-row-sub   { font-size: 12px; color: var(--c-text2); margin-top: 2px; }

.abonne-row-stats {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.abonne-row-montant {
  font-size: 14px;
  font-weight: 700;
  color: var(--c-blue);
  white-space: nowrap;
}

.abonne-row-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

/* =============================================
   NOTIFICATION MÉCANICIEN — Dashboard bulle
   ============================================= */

.mecano-dash-notif {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: linear-gradient(135deg, #4c1d95, #6d28d9);
  color: white;
  border-radius: var(--r-xl);
  padding: 14px 20px;
  margin-bottom: 16px;
  animation: slideDown .35s ease;
  flex-wrap: wrap;
}

.mecano-dash-notif-left {
  display: flex;
  align-items: center;
  gap: 14px;
}

.mecano-dash-notif-bell {
  font-size: 28px;
  animation: bell .6s ease .1s both;
}

.mecano-dash-notif-btn {
  background: rgba(255,255,255,.2);
  color: white;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
}
.mecano-dash-notif-btn:hover { background: rgba(255,255,255,.3); }

/* Stat mécanicien (violette) */
.stat-card-mecano { border-color: #8b5cf6 !important; }

/* Icône notif mécanicien dans la timeline */
.tl-mecano-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #ede9fe;
  color: #6d28d9;
  border-radius: 12px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  margin-left: 6px;
}

/* Ligne de tableau signalée — remarque mécanicien non lue */
.gp-table tr.row-has-notif {
  background: rgba(139,92,246,.06);
  box-shadow: inset 3px 0 0 #8b5cf6;
}
.gp-table tr.row-has-notif:hover { background: rgba(139,92,246,.1); }

/* Pastilles d'alerte bien visibles — mécanicien / à prévoir */
.alert-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 800;
  padding: 4px 9px;
  border-radius: 14px;
  white-space: nowrap;
  letter-spacing: .2px;
}

.alert-pill-mecano {
  background: #8b5cf6;
  color: white;
  box-shadow: 0 2px 6px rgba(139,92,246,.4);
  animation: pillPulse 2s ease-in-out infinite;
}

.alert-pill-aprevoir {
  background: var(--c-orange);
  color: white;
  box-shadow: 0 2px 6px rgba(255,149,0,.4);
}

@keyframes pillPulse {
  0%, 100% { box-shadow: 0 2px 6px rgba(139,92,246,.4); }
  50%      { box-shadow: 0 2px 10px rgba(139,92,246,.7); }
}

/* =============================================
   MODAL WA SIMPLIFIÉE — 2 options
   ============================================= */

.wa-options {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.wa-option-card {
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-lg);
  padding: 16px;
}

.wa-option-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.wa-option-icon { font-size: 28px; flex-shrink: 0; }

.wa-option-info small {
  display: block;
  font-size: 12px;
  color: var(--c-text2);
  margin-top: 2px;
}

.wa-option-desc {
  font-size: 13px;
  color: var(--c-text2);
  margin-bottom: 12px;
  line-height: 1.5;
}

.wa-send-btn {
  width: 100%;
  justify-content: center;
}

/* =============================================
   STATUT PAIEMENT — badges + boutons
   ============================================= */

.paiement-en-attente { color: #d97706; font-weight: 700; }
.paiement-paye       { color: #16a34a; font-weight: 700; }
.paiement-annule     { color: var(--c-red); font-weight: 700; }

.paiement-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-radius: 20px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  border: 1.5px solid;
  background: transparent;
  transition: all .15s;
  font-family: var(--font);
}
.paiement-toggle.en-attente { border-color: #d97706; color: #d97706; }
.paiement-toggle.paye       { border-color: #16a34a; color: #16a34a; }
.paiement-toggle.annule     { border-color: var(--c-red); color: var(--c-red); }
.paiement-toggle:hover      { filter: brightness(.9); }


/* =============================================
   PIÈCES — modal intervention (stock + libre)
   ============================================= */

.gp-piece-row {
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-md);
  padding: 10px 12px;
  margin-bottom: 8px;
  background: var(--c-bg);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.gp-piece-row-stock { border-left: 3px solid var(--c-blue); }
.gp-piece-row-libre { border-left: 3px solid #f59e0b;       }

/* En-tête de la ligne (nom stock ou input libre) */
.gp-pr-header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.gp-pr-libre-badge {
  font-size: 11px;
  font-weight: 700;
  background: #fef3c7;
  color: #92400e;
  padding: 2px 8px;
  border-radius: 10px;
  white-space: nowrap;
  flex-shrink: 0;
}
.gp-pr-label { flex: 1; min-width: 160px; }

/* Info pièce stock sélectionnée */
.gp-pr-nom-stock {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  flex: 1;
  padding: 6px 10px;
  background: rgba(0,122,255,.06);
  border: 1px solid rgba(0,122,255,.2);
  border-radius: var(--r-sm);
  font-size: 13px;
}
.gp-pr-name  { font-weight: 700; }
.gp-pr-ref   { font-size: 11px; background: var(--c-bg); padding: 1px 5px; border-radius: 3px; font-family: monospace; }
.gp-pr-empl  { font-size: 11px; color: var(--c-text3); }
.gp-pr-stock { font-size: 11px; color: var(--c-text3); }
.gp-pr-stock-low { color: var(--c-red) !important; font-weight: 700; }
.gp-pr-change-btn {
  margin-left: auto;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 12px;
  color: var(--c-text3);
  padding: 0 4px;
  flex-shrink: 0;
}
.gp-pr-change-btn:hover { color: var(--c-red); }

/* Champs prix/qté */
.gp-pr-fields {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.gp-pr-field {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.gp-pr-field label {
  font-size: 11px;
  font-weight: 600;
  color: var(--c-text2);
}
.gp-pr-achat,
.gp-pr-vente { width: 88px; }
.gp-pr-qty   { width: 64px; }
.gp-pr-del   {
  padding: 6px 10px;
  background: rgba(255,59,48,.08);
  border: 1px solid rgba(255,59,48,.25);
  border-radius: var(--r-sm);
  color: var(--c-red);
  cursor: pointer;
  font-size: 14px;
  align-self: flex-end;
}
.gp-pr-del:hover { background: var(--c-red); color: white; }

/* Barre de recherche stock (avant sélection) */
.gp-pr-search-wrap { position: relative; flex: 1; }
.gp-pr-search      { width: 100%; }

.gp-pr-drop {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0; right: 0;
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  box-shadow: var(--sh-lg);
  z-index: 2200;
  max-height: 260px;
  overflow-y: auto;
}
.gp-pr-drop.open { display: block; }

.gp-pr-drop-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  cursor: pointer;
  border-bottom: 1px solid var(--c-border);
  flex-wrap: wrap;
  transition: background .1s;
}
.gp-pr-drop-item:last-child { border-bottom: none; }
.gp-pr-drop-item:hover      { background: rgba(0,122,255,.06); }
.gp-pr-drop-low             { border-left: 3px solid var(--c-red); }

@media (max-width: 480px) {
  .gp-pr-achat, .gp-pr-vente { width: 72px; }
  .gp-pr-qty { width: 56px; }
}

/* =============================================
   AUTOSUGGEST ABONNÉS — page abonnés
   ============================================= */

.abonnes-search-wrap {
  position: relative;
  margin-bottom: 16px;
}

.abonnes-search-input {
  width: 100%;
  padding: 10px 14px 10px 38px;
  border: 1.5px solid var(--c-border);
  border-radius: var(--r-lg);
  font-size: 14px;
  background: var(--c-surface);
  color: var(--c-text);
  font-family: var(--font);
  transition: border-color .15s;
}
.abonnes-search-input:focus {
  outline: none;
  border-color: var(--c-blue);
}

.abonnes-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
  pointer-events: none;
}

.client-card.hidden { display: none; }

.abonnes-empty-search {
  text-align: center;
  padding: 32px;
  color: var(--c-text3);
  font-size: 14px;
  display: none;
}
.abonnes-empty-search.visible { display: block; }

/* =============================================
   PIÈCE LIBRE — saisie manuelle dans modal intervention
   ============================================= */

.piece-row-libre {
  grid-template-columns: 1fr 70px 34px;
}

.piece-libre-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  background: rgba(251,191,36,.08);
  border: 1.5px solid #f59e0b;
  border-radius: var(--r-md);
  flex-wrap: wrap;
}

.piece-libre-badge {
  font-size: 11px;
  font-weight: 700;
  background: #fef3c7;
  color: #92400e;
  padding: 2px 7px;
  border-radius: 10px;
  white-space: nowrap;
  flex-shrink: 0;
}

.piece-libre-label {
  flex: 1;
  min-width: 120px;
}

.piece-libre-achat,
.piece-libre-vente {
  width: 85px !important;
  flex-shrink: 0;
}

@media (max-width: 480px) {
  .piece-libre-achat,
  .piece-libre-vente { width: 70px !important; }
  .piece-libre-label { min-width: 80px; }
}

/* =============================================
   GARAGE PRO V2 — UX POLISH
   Conserve la palette V1, améliore profondeur,
   hiérarchie et interactions sans changer le métier.
   ============================================= */
:root { --gp-v2-shadow: 0 10px 30px rgba(15,23,42,.07); }
.btn { box-shadow: 0 1px 1px rgba(15,23,42,.03); }
.btn-primary { box-shadow: 0 7px 18px rgba(0,122,255,.16); }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,122,255,.22); }
.btn-success:hover,.btn-danger:hover,.btn-ghost:hover { transform: translateY(-1px); }
.section-card { box-shadow: var(--gp-v2-shadow); transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease; }
.section-card:hover { box-shadow: 0 14px 36px rgba(15,23,42,.09); }
.page-header { align-items: flex-end; }
.page-title { letter-spacing: -1px; }
.header-logo { transition: transform .2s ease, opacity .2s ease; }
.header-logo:hover { transform: translateY(-1px); opacity: .9; }
.gp-v2-pill { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border-radius:999px; background:rgba(0,122,255,.08); color:var(--c-blue); font-size:10px; font-weight:800; letter-spacing:.04em; border:1px solid rgba(0,122,255,.12); }
@media(max-width:640px){ .gp-v2-pill { display:none; } }

/* Paiement fictif — visible uniquement dans l'espace client */
.facture-card-wrap { display:flex; flex-direction:column; gap:7px; }
.client-pay-btn { display:flex; align-items:center; justify-content:space-between; gap:10px; text-decoration:none; padding:11px 13px; border-radius:12px; background:linear-gradient(135deg,var(--c-blue),var(--c-blue-dark)); color:#fff; font-size:12px; font-weight:800; box-shadow:0 7px 16px rgba(0,122,255,.16); transition:transform .18s ease, box-shadow .18s ease; }
.client-pay-btn:hover { color:#fff; transform:translateY(-1px); box-shadow:0 10px 22px rgba(0,122,255,.23); }
.client-pay-btn span { opacity:.85; font-weight:700; }
.client-pay-mini { display:inline-flex; align-items:center; padding:4px 8px; border-radius:8px; background:rgba(0,122,255,.08); color:var(--c-blue); text-decoration:none; font-size:10px; font-weight:800; }
.client-pay-mini:hover { background:var(--c-blue); color:#fff; }


/* =========================================================
   GARAGE PRO V2 — UX / NAVIGATION / FACTURATION
   ========================================================= */
.gp-v2-pill{display:inline-flex;align-items:center;margin-left:6px;padding:2px 6px;border-radius:999px;background:rgba(0,122,255,.10);color:var(--c-blue,#007aff);font-size:9px;font-weight:900;letter-spacing:.04em}
.gp-menu-toggle{width:36px;height:36px;border:1px solid var(--c-border);background:var(--c-card,#fff);border-radius:10px;display:grid;place-content:center;gap:4px;cursor:pointer;transition:.2s;box-shadow:0 2px 8px rgba(15,23,42,.05)}
.gp-menu-toggle:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(15,23,42,.10)}
.gp-menu-toggle span{display:block;width:15px;height:1.7px;background:var(--c-text);border-radius:2px}
.gp-drawer-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.35);backdrop-filter:blur(3px);z-index:10020;opacity:0;pointer-events:none;transition:opacity .22s}
.gp-drawer{position:fixed;z-index:10021;top:0;left:0;height:100dvh;width:min(350px,92vw);background:var(--c-card,#fff);border-right:1px solid var(--c-border);box-shadow:20px 0 55px rgba(15,23,42,.18);transform:translateX(-102%);transition:transform .25s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;padding:22px 16px 14px}
.gp-drawer.open{transform:none}.gp-drawer-backdrop.open{opacity:1;pointer-events:auto}.gp-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 20px}.gp-drawer-kicker,.gp-eyebrow{font-size:10px;letter-spacing:.12em;font-weight:900;color:var(--c-blue,#007aff)}.gp-drawer-title{font-size:20px;font-weight:850;letter-spacing:-.4px;margin-top:3px}.gp-drawer-close{width:34px;height:34px;border:0;border-radius:10px;background:var(--c-bg);font-size:25px;line-height:1;cursor:pointer;color:var(--c-text)}
.gp-drawer-section-label{font-size:10px;font-weight:850;letter-spacing:.1em;color:var(--c-text3);padding:12px 8px 7px}.gp-drawer-nav,.gp-drawer-actions{display:grid;gap:4px}.gp-drawer-nav a,.gp-drawer-actions button,.gp-drawer-actions a{display:flex;align-items:center;gap:12px;width:100%;padding:11px 12px;border:0;border-radius:11px;background:transparent;color:var(--c-text);text-decoration:none;text-align:left;font-size:13px;font-weight:650;cursor:pointer}.gp-drawer-nav a:hover,.gp-drawer-nav a.active,.gp-drawer-actions button:hover,.gp-drawer-actions a:hover{background:var(--c-bg);color:var(--c-blue,#007aff)}.gp-drawer-nav a:first-letter,.gp-drawer-actions button:first-letter{font-size:17px}.gp-drawer-foot{margin-top:auto;border-top:1px solid var(--c-border);padding:12px 8px 0;font-size:10px;color:var(--c-text3);display:flex;justify-content:space-between}.gp-drawer-foot span:last-child{color:#22c55e}
.gp-dashboard-hero{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:stretch;margin:0 0 18px;padding:22px;border:1px solid rgba(0,122,255,.12);border-radius:20px;background:radial-gradient(circle at 100% 0,rgba(0,122,255,.11),transparent 38%),linear-gradient(135deg,var(--c-card,#fff),rgba(248,250,252,.95));box-shadow:0 10px 30px rgba(15,23,42,.055)}.gp-dashboard-hero h1{margin:4px 0 6px;font-size:clamp(22px,3vw,30px);letter-spacing:-.8px}.gp-dashboard-hero p{margin:0;color:var(--c-text2);font-size:13px;max-width:560px}.gp-quick-actions{display:grid;grid-template-columns:repeat(2,minmax(145px,1fr));gap:8px;min-width:330px}.gp-quick-action{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:76px;padding:11px 12px;border:1px solid var(--c-border);border-radius:13px;background:var(--c-card,#fff);color:var(--c-text);text-decoration:none;cursor:pointer;transition:.2s;text-align:left}.gp-quick-action:hover{transform:translateY(-2px);border-color:rgba(0,122,255,.25);box-shadow:0 9px 20px rgba(15,23,42,.08)}.gp-quick-action span{font-size:17px}.gp-quick-action b{font-size:12px}.gp-quick-action small{font-size:10px;color:var(--c-text3)}.gp-quick-primary{background:linear-gradient(135deg,#007aff,#005ecb);border-color:#007aff;color:#fff;box-shadow:0 9px 20px rgba(0,122,255,.18)}.gp-quick-primary small{color:rgba(255,255,255,.72)}
.gp-page-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.gp-card-caption{font-size:11px;color:var(--c-text3);margin-top:3px}.gp-billing-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.gp-money-card{padding:16px;border-radius:16px;background:linear-gradient(135deg,#eff6ff,#fff);border:1px solid rgba(0,122,255,.12);display:flex;flex-direction:column;gap:5px}.gp-money-card span{font-size:11px;color:var(--c-text2);font-weight:700}.gp-money-card strong{font-size:23px;letter-spacing:-.5px}.gp-money-pending{background:linear-gradient(135deg,#fff7ed,#fff);border-color:rgba(217,119,6,.16)}.gp-money-paid{background:linear-gradient(135deg,#f0fdf4,#fff);border-color:rgba(22,163,74,.16)}.gp-invoice-list{display:grid}.gp-invoice-row{display:grid;grid-template-columns:1.4fr .65fr auto;align-items:center;gap:14px;padding:14px 18px;border-top:1px solid var(--c-border)}.gp-invoice-main{display:flex;align-items:center;gap:12px;min-width:0}.gp-invoice-icon{width:38px;height:38px;border-radius:11px;background:var(--c-bg);display:grid;place-items:center}.gp-invoice-main strong{font-size:13px}.gp-invoice-main div div{font-size:11px;color:var(--c-text3);margin-top:3px}.gp-invoice-amount{display:flex;align-items:center;gap:9px;justify-content:flex-end}.gp-invoice-amount strong{font-size:14px;white-space:nowrap}.gp-invoice-actions{display:flex;gap:5px;justify-content:flex-end}.gp-modal-overlay{position:fixed;inset:0;z-index:10030;background:rgba(15,23,42,.42);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:16px}.gp-modal{background:var(--c-card,#fff);color:var(--c-text,#111827);border-radius:20px;box-shadow:0 24px 70px rgba(15,23,42,.22);overflow:hidden;width:min(720px,100%);max-height:calc(100vh - 32px);overflow-y:auto}.gp-invoice-modal{width:min(560px,100%);background:var(--c-card,#fff);border-radius:20px;box-shadow:0 24px 70px rgba(15,23,42,.22);overflow:hidden}.gp-modal-head{display:flex;justify-content:space-between;gap:15px;padding:20px;border-bottom:1px solid var(--c-border)}.gp-modal-head h3{margin:4px 0;font-size:20px}.gp-modal-head p{margin:0;color:var(--c-text2);font-size:12px}.gp-modal-close{width:32px;height:32px;border:0;border-radius:9px;background:var(--c-bg);font-size:22px;cursor:pointer}.gp-invoice-modal-body{padding:20px}.gp-invoice-choice{display:flex;gap:11px;align-items:flex-start;padding:13px;border-radius:13px;background:var(--c-bg);margin-bottom:12px}.gp-choice-icon{font-size:20px}.gp-invoice-choice strong,.gp-invoice-choice span{display:block}.gp-invoice-choice strong{font-size:13px}.gp-invoice-choice span{font-size:11px;color:var(--c-text3);margin-top:3px;line-height:1.45}.gp-invoice-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px}.gp-demo-note,.gp-no-filiale{margin-top:12px;padding:10px 12px;border-radius:10px;background:#fffbeb;color:#92400e;font-size:11px;line-height:1.4}
@media(max-width:900px){.gp-dashboard-hero{grid-template-columns:1fr}.gp-quick-actions{min-width:0}.gp-invoice-row{grid-template-columns:1fr}.gp-invoice-amount{justify-content:flex-start}.gp-invoice-actions{justify-content:flex-start;flex-wrap:wrap}.gp-admin-chip{display:none}}
@media(max-width:600px){.gp-dashboard-hero{padding:17px;border-radius:16px}.gp-quick-actions{grid-template-columns:1fr 1fr}.gp-quick-action{min-height:68px}.gp-billing-stats{grid-template-columns:1fr}.gp-invoice-action-grid{grid-template-columns:1fr}.gp-drawer{width:min(330px,94vw)}.header-user{display:none}}

body.gp-drawer-lock,body.gp-modal-lock{overflow:hidden}

/* =========================================================
   V2.1 — ergonomie terrain / actions intervention
   ========================================================= */
.gp-context-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:999px;background:var(--c-surface2,#f4f5f7);color:var(--c-text2);font-size:12px;font-weight:600}
.gp-fiche-main-actions{position:sticky;top:8px;z-index:20;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.gp-invoice-summary{margin:14px 0 18px;padding:15px 16px;border:1px solid rgba(255,149,0,.28);border-radius:16px;background:linear-gradient(135deg,rgba(255,149,0,.08),rgba(255,255,255,.94));display:flex;align-items:center;justify-content:space-between;gap:16px;box-shadow:0 8px 24px rgba(0,0,0,.04)}
.gp-invoice-summary.is-paid{border-color:rgba(52,199,89,.24);background:linear-gradient(135deg,rgba(52,199,89,.07),rgba(255,255,255,.94))}
.gp-invoice-summary-main{display:flex;align-items:center;gap:12px;min-width:0}.gp-invoice-summary-icon{width:44px;height:44px;border-radius:13px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 4px 12px rgba(0,0,0,.06)}
.gp-invoice-summary-main strong{display:block;font-size:16px}.gp-invoice-summary-main span{display:block;margin-top:3px;font-size:12px;color:var(--c-text2)}
.gp-invoice-summary-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.gp-pay-btn{font-weight:800;box-shadow:0 8px 18px rgba(0,122,255,.18)}.gp-paid-badge{padding:8px 12px}
.gp-document-modal{max-width:720px}.gp-document-grid{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.gp-document-card{border:1px solid var(--c-border,#e5e7eb);border-radius:16px;padding:15px;background:var(--c-surface,#fff);box-shadow:0 5px 16px rgba(0,0,0,.035)}
.gp-document-card-head{display:flex;gap:11px;align-items:flex-start}.gp-document-card-head>span{font-size:25px}.gp-document-card-head strong{display:block;font-size:14px}.gp-document-card-head small{display:block;margin-top:4px;color:var(--c-text2);line-height:1.4}.gp-document-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.gp-document-card-actions .btn{flex:1;min-width:130px}.gp-small-modal{max-width:460px}.gp-modal-body-pad{padding:18px}.gp-muted{font-size:12px;color:var(--c-text3)}
.gp-quick-action{cursor:pointer}.gp-quick-action:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(0,0,0,.08)}
@media(max-width:720px){.gp-fiche-main-actions{position:static}.gp-fiche-main-actions .fiche-action-bar-left{width:100%}.gp-fiche-main-actions .fiche-action-bar-right{width:100%;display:grid;grid-template-columns:1fr 1fr}.gp-fiche-main-actions .fiche-action-bar-right .btn:first-child{grid-column:1/-1}.gp-invoice-summary{align-items:flex-start;flex-direction:column}.gp-invoice-summary-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.gp-invoice-summary-actions .btn,.gp-invoice-summary-actions a{width:100%;text-align:center}.gp-document-grid{grid-template-columns:1fr;padding:12px}.gp-context-chip{display:none}}

/* V2.3 — indicateurs financiers du dashboard */
.gp-dashboard-money-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 22px}
.gp-dashboard-money-card{display:flex;flex-direction:column;gap:6px;text-decoration:none!important;transition:transform .18s ease,box-shadow .18s ease}
.gp-dashboard-money-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(15,23,42,.10)}
.gp-dashboard-money-card strong{font-size:26px;line-height:1.1}
.gp-dashboard-money-card small{font-size:12px;font-weight:700;opacity:.7}
.gp-invoice-summary-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
@media(max-width:700px){.gp-dashboard-money-grid{grid-template-columns:1fr}.gp-invoice-summary-actions{width:100%;justify-content:stretch}.gp-invoice-summary-actions .btn{flex:1}}

/* V2.4 — finances placées directement sous l'accroche du dashboard */
.gp-dashboard-hero-copy{min-width:0}.gp-dashboard-money-inline{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0 0;max-width:620px}.gp-dashboard-money-inline .gp-dashboard-money-card{min-height:74px;padding:11px 13px;border-radius:14px}.gp-dashboard-money-inline .gp-dashboard-money-card span{font-size:11px;font-weight:700;color:var(--c-text2)}.gp-dashboard-money-inline .gp-dashboard-money-card strong{font-size:22px;line-height:1}.gp-dashboard-money-inline .gp-dashboard-money-card small{font-size:10px}.gp-dashboard-money-inline .gp-money-card{box-shadow:0 6px 16px rgba(15,23,42,.05)}
@media(max-width:900px){.gp-dashboard-money-inline{max-width:none}}
@media(max-width:600px){.gp-dashboard-money-inline{grid-template-columns:1fr 1fr;gap:7px}.gp-dashboard-money-inline .gp-dashboard-money-card{min-height:68px;padding:9px 10px}.gp-dashboard-money-inline .gp-dashboard-money-card strong{font-size:19px}}

/* V2.5 — listings véhicule/abonné : denses, lisibles, tactiles */
@media(min-width:1180px){
  .v-card-img{aspect-ratio: 16/8.5;}
  .v-card-body{padding:12px 13px;}
  .v-card-actions{padding:9px 11px;gap:5px;}
  .v-card-actions .btn{font-size:11px;min-height:34px;}
  .client-card{padding:13px;}
  .client-card-actions{gap:5px;}
  .client-card-actions .btn{font-size:11px;min-height:32px;}
}
@media(max-width:559px){
  .v-card-actions{flex-wrap:wrap;}
  .v-card-actions .btn:first-child,.v-card-actions .btn:nth-child(2){flex:1 1 calc(50% - 4px)!important;}
  .v-card-actions .btn-icon{flex:0 0 34px!important;}
}

/* --- NAVIGATION V2.6 : Accueil/Dashboard clairement identifiable --- */
.nav-tabs .nav-tab-dashboard {
  position: relative;
  flex: 0 0 auto;
  min-width: 116px;
  border: 1px solid rgba(0,122,255,.28);
  background: rgba(0,122,255,.055);
  color: var(--c-blue);
  font-weight: 750;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}
.nav-tabs .nav-tab-dashboard:hover {
  background: rgba(0,122,255,.11);
  color: var(--c-blue-dark);
  border-color: rgba(0,122,255,.42);
}
.nav-tabs .nav-tab-dashboard.active {
  background: linear-gradient(180deg,#0a84ff,#007aff);
  border-color: #007aff;
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,122,255,.22), inset 0 0 0 1px rgba(255,255,255,.14);
}
.nav-tabs.dashboard-nav-tabs {
  margin-top: 0;
  margin-bottom: 18px;
}
@media (max-width: 700px) {
  .nav-tabs .nav-tab-dashboard { min-width: 102px; }
  .nav-tabs.dashboard-nav-tabs { margin-bottom: 16px; }
}

/* V2.8 — sélecteur de filiale facture compact */
.gp-invoice-quick-modal{max-width:460px!important}
.gp-invoice-quick-modal .gp-modal-head{padding-bottom:12px}
.gp-invoice-quick-modal .gp-invoice-modal-body{padding-top:4px}
.gp-invoice-quick-modal .gp-invoice-action-grid{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gp-invoice-quick-modal .gp-invoice-action-grid .btn:first-child{grid-column:1/-1}
@media(max-width:520px){.gp-invoice-quick-modal{width:calc(100% - 24px)!important}.gp-invoice-quick-modal .gp-invoice-action-grid{grid-template-columns:1fr}.gp-invoice-quick-modal .gp-invoice-action-grid .btn:first-child{grid-column:auto}}

/* V2.13 — hiérarchie financière et actions intervention */
.gp-dashboard-money-3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}.gp-dashboard-money-3 .gp-dashboard-money-card{min-height:78px}.gp-edit-intervention-btn{font-weight:800;box-shadow:0 8px 18px rgba(0,122,255,.16)}.gp-client-outstanding{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:13px 16px;border:2px solid #111827;border-radius:14px;background:linear-gradient(135deg,rgba(255,149,0,.10),rgba(255,255,255,.98));color:var(--c-text);text-decoration:none;box-shadow:0 6px 18px rgba(15,23,42,.045)}.gp-client-outstanding-label{font-size:12px;font-weight:800;flex:1}.gp-client-outstanding strong{font-size:20px;white-space:nowrap}.gp-client-outstanding-link{font-size:11px;font-weight:800;color:var(--c-blue)}
@media(max-width:800px){.gp-dashboard-money-3{grid-template-columns:1fr 1fr}.gp-client-outstanding{flex-wrap:wrap}.gp-client-outstanding-link{margin-left:auto}}
@media(max-width:560px){.gp-dashboard-money-3{grid-template-columns:1fr 1fr}.gp-dashboard-money-3 .gp-dashboard-money-card:first-child{grid-column:1/-1}.gp-client-outstanding{display:grid;grid-template-columns:1fr auto;gap:5px 10px}.gp-client-outstanding-label{grid-column:1/-1}.gp-client-outstanding-link{margin-left:0}}

/* V2.14 — UX paiement / recherches / actions intervention */
.gp-fiche-main-actions .fiche-action-bar-right{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.gp-fiche-main-actions .gp-edit-intervention-btn{background:#0b74e8;border-color:#0b74e8;box-shadow:0 7px 18px rgba(11,116,232,.20);font-weight:800}
.gp-fiche-main-actions .gp-edit-intervention-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.gp-action-spacer{flex:1;min-width:18px}
.gp-client-billing-history .section-card-header{gap:10px}
.gp-payer-profile{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}
.gp-payer-profile b{width:17px;height:17px;border-radius:50%;display:grid;place-items:center}
.gp-payer-good{background:#ecfdf3;color:#15803d}.gp-payer-good b{background:#22c55e;color:#fff}
.gp-payer-watch{background:#fff7ed;color:#c2410c}.gp-payer-watch b{background:#f97316;color:#fff}
.gp-payer-bad{background:#fef2f2;color:#b91c1c}.gp-payer-bad b{background:#ef4444;color:#fff}
.gp-payer-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 16px;border-bottom:1px solid var(--c-border)}
.gp-payer-summary>div{padding:10px 11px;border-radius:12px;background:var(--c-bg);min-width:0}
.gp-payer-summary span{display:block;font-size:10px;color:var(--c-text2);font-weight:700}.gp-payer-summary strong{display:block;margin-top:3px;font-size:14px}.gp-paid-text{color:#16a34a}.gp-unpaid-text{color:#dc2626}
.gp-billing-history-list{display:flex;flex-direction:column}
.gp-billing-history-row{display:grid;grid-template-columns:8px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:11px 16px;border-top:1px solid var(--c-border)}
.gp-billing-status-dot{width:8px;height:8px;border-radius:50%}.gp-billing-history-row.is-paid .gp-billing-status-dot{background:#22c55e}.gp-billing-history-row.is-unpaid .gp-billing-status-dot{background:#ef4444}.gp-billing-history-row.is-cancelled .gp-billing-status-dot{background:#94a3b8}
.gp-billing-history-main{min-width:0}.gp-billing-history-main strong{display:block;font-size:12px}.gp-billing-history-main span{display:block;font-size:10px;color:var(--c-text3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gp-billing-history-amount{text-align:right}.gp-billing-history-amount strong{display:block;font-size:12px}.gp-billing-history-amount span{font-size:10px;font-weight:800}.is-paid .gp-billing-history-amount span{color:#16a34a}.is-unpaid .gp-billing-history-amount span{color:#dc2626}.is-cancelled .gp-billing-history-amount span{color:#64748b}
.gp-compact-filters{gap:7px}.gp-search-control{position:relative;flex:1;min-width:220px}.gp-search-control .filter-search{width:100%}.gp-list-suggest{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:1200;background:var(--c-card,#fff);border:1px solid var(--c-border);border-radius:12px;box-shadow:0 15px 35px rgba(15,23,42,.14);display:none;overflow:hidden}.gp-list-suggest.open{display:block}.gp-list-suggest-item{display:block;width:100%;border:0;background:transparent;text-align:left;padding:10px 12px;font-size:12px;cursor:pointer;color:var(--c-text)}.gp-list-suggest-item:hover{background:var(--c-bg)}.gp-list-suggest-empty{padding:10px 12px;font-size:11px;color:var(--c-text3)}.gp-compact-search{position:relative}.gp-compact-search .gp-list-suggest{left:0;right:0;top:calc(100% + 5px)}
@media(max-width:760px){
 .gp-fiche-main-actions .fiche-action-bar-right{flex-wrap:wrap}.gp-action-spacer{display:none}.gp-fiche-main-actions .gp-edit-intervention-btn{order:-2;width:100%;justify-content:center}.gp-fiche-main-actions .fiche-action-bar-right .btn{min-height:38px}
 .gp-payer-summary{grid-template-columns:repeat(2,1fr)}
 .gp-billing-history-row{grid-template-columns:8px minmax(0,1fr) auto}.gp-billing-history-row>.btn{grid-column:2/-1;justify-self:start}.gp-billing-history-amount{grid-column:3;grid-row:1;text-align:right}
}
.gp-intervention-filters .gp-date-filter{min-width:145px}.gp-client-filter-control{min-width:220px;max-width:320px}.gp-intervention-filters .form-control{height:38px}
@media(max-width:760px){.gp-intervention-filters{display:grid;grid-template-columns:1fr 1fr;gap:7px}.gp-intervention-filters .gp-client-filter-control,.gp-intervention-filters .btn,.gp-intervention-filters .gp-client-filter-control+.form-control{grid-column:1/-1;max-width:none;width:100%}.gp-intervention-filters .gp-search-control{min-width:0}.gp-compact-filters .gp-search-control{min-width:0}.gp-compact-filters{flex-wrap:wrap}}


/* V2.15 — fiche intervention : barre d'actions stable et lisible */
.gp-fiche-main-actions .fiche-action-bar-right{display:grid;grid-template-columns:auto auto 1fr auto auto auto;align-items:center;gap:8px;flex:1;min-width:0}
.gp-fiche-main-actions .gp-edit-intervention-btn{grid-column:1;background:#0b74e8!important;border-color:#0b74e8!important;color:#fff!important;font-weight:800;white-space:nowrap}
.gp-fiche-main-actions .gp-send-client-btn{grid-column:2;background:#0b74e8!important;border-color:#0b74e8!important;color:#fff!important;font-weight:800;white-space:nowrap}
.gp-fiche-main-actions .gp-action-spacer{display:none}
.gp-fiche-main-actions .fiche-action-bar-right .btn{white-space:nowrap}
.gp-fiche-main-actions .fiche-action-bar-right .btn:nth-last-child(1){justify-self:end}
@media(max-width:980px){.gp-fiche-main-actions .fiche-action-bar-right{grid-template-columns:1fr 1fr 1fr 1fr}.gp-fiche-main-actions .gp-edit-intervention-btn,.gp-fiche-main-actions .gp-send-client-btn{grid-column:auto}.gp-fiche-main-actions .fiche-action-bar-right .btn{width:100%;justify-content:center}.gp-fiche-main-actions .fiche-action-bar-right .btn:last-child{justify-self:stretch}}
@media(max-width:760px){.gp-fiche-main-actions .fiche-action-bar-right{display:grid;grid-template-columns:1fr 1fr;gap:8px}.gp-fiche-main-actions .gp-edit-intervention-btn,.gp-fiche-main-actions .gp-send-client-btn{width:100%;grid-column:auto}.gp-fiche-main-actions .fiche-action-bar-right .btn{min-height:42px}.gp-fiche-main-actions .fiche-action-bar-right .btn:nth-child(4),.gp-fiche-main-actions .fiche-action-bar-right .btn:nth-child(5),.gp-fiche-main-actions .fiche-action-bar-right .btn:nth-child(6){width:100%}}

/* V2.16 — recherche factures compacte */
.gp-invoice-search{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(160px,1fr) minmax(140px,.8fr) auto auto;gap:8px;align-items:center;margin:0 0 5px;padding:10px 12px;background:rgba(255,255,255,.72);border:1px solid var(--c-border);border-radius:12px}
.gp-invoice-search-main,.gp-invoice-search-field{position:relative}.gp-invoice-search input{width:100%;height:38px;padding:0 11px;border:1px solid var(--c-border);border-radius:9px;background:#fff;color:var(--c-text);font-size:13px;outline:none}.gp-invoice-search input:focus{border-color:var(--c-blue);box-shadow:0 0 0 3px rgba(37,99,235,.09)}.gp-search-icon{position:absolute;left:10px;top:8px;z-index:1;color:var(--c-text3);font-size:19px;pointer-events:none}.gp-invoice-search-main input{padding-left:31px}.gp-invoice-search-hint{font-size:11px;color:var(--c-text3);margin:0 2px 12px}@media(max-width:760px){.gp-invoice-search{grid-template-columns:1fr 1fr}.gp-invoice-search-main{grid-column:1/-1}.gp-invoice-search button,.gp-invoice-search a{width:100%;justify-content:center}.gp-invoice-search-hint{margin-bottom:10px}}


/* V2.17 — alignement terrain : top bar et actions de fiche intervention */
.app-header .header-inner{height:60px;min-width:0}
.app-header .header-logo{flex:0 0 auto;min-width:0}
.app-header .header-search{flex:1 1 360px;min-width:160px;max-width:520px;margin:0 auto}
.app-header .header-right{flex:0 0 auto;min-width:0;display:flex;align-items:center;gap:8px}
.app-header .header-user{white-space:nowrap}
.gp-fiche-main-actions{display:grid;grid-template-columns:minmax(220px,1fr) auto auto;align-items:center;gap:12px;padding:10px 12px}
.fiche-action-context{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden}
.fiche-action-context .gp-context-chip{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gp-intervention-status{white-space:nowrap;flex:0 0 auto}
.fiche-action-primary,.fiche-action-secondary{display:flex;align-items:center;gap:8px;white-space:nowrap}
.fiche-action-primary .btn{min-height:42px}
.gp-edit-intervention-btn{background:linear-gradient(135deg,#ff9f0a,#ff7a00);border-color:#ff8a00;color:#fff;font-weight:800;box-shadow:0 7px 16px rgba(255,126,0,.22)}
.gp-edit-intervention-btn:hover{background:linear-gradient(135deg,#ffad22,#ff8500);color:#fff;transform:translateY(-1px)}
.gp-send-client-btn{font-weight:750;min-height:42px}
.fiche-action-secondary .btn{min-height:38px}
.fiche-action-secondary .btn-icon{width:38px;padding:0;justify-content:center}
.gp-invoice-summary{display:flex;align-items:center;justify-content:space-between;gap:18px}
.gp-invoice-summary-main{min-width:0;display:flex;align-items:center;gap:12px}
.gp-invoice-summary-actions{display:flex!important;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:nowrap!important;white-space:nowrap}
.gp-invoice-summary-actions .btn{min-height:38px}
@media (max-width:980px){.gp-fiche-main-actions{grid-template-columns:1fr auto}.fiche-action-context{grid-column:1/-1}.fiche-action-secondary{justify-content:flex-end}}
@media (max-width:760px){.app-header .header-inner{gap:8px}.app-header .header-search{display:none}.app-header .header-logo{font-size:18px}.app-header .header-right{margin-left:auto}.gp-fiche-main-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:9px}.fiche-action-context{grid-column:1/-1}.fiche-action-primary,.fiche-action-secondary{display:contents}.fiche-action-primary .btn:first-child{grid-column:1}.fiche-action-primary .gp-send-client-btn{grid-column:2}.fiche-action-secondary .btn{min-width:0;width:100%;justify-content:center}.fiche-action-secondary .btn-icon{width:100%}.gp-invoice-summary{align-items:stretch;flex-direction:column;gap:12px}.gp-invoice-summary-actions{display:grid!important;grid-template-columns:1fr 1fr 1fr;gap:7px;white-space:normal!important}.gp-invoice-summary-actions .btn{width:100%;padding-left:7px;padding-right:7px;font-size:11px}}
@media (max-width:430px){.header-logo .gp-v2-pill{display:none}.gp-fiche-main-actions{grid-template-columns:1fr 1fr}.fiche-action-primary .btn,.fiche-action-secondary .btn{font-size:11px;padding-left:8px;padding-right:8px}.gp-invoice-summary-actions{grid-template-columns:1fr 1fr}.gp-invoice-summary-actions .gp-pay-btn{grid-column:1/-1}}

/* V2.18 — recherche contextuelle + filtres rapides interventions */
.sd-item-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:5px;font-size:10px;color:var(--c-text2)}
.sd-item-meta span{padding:2px 6px;border-radius:999px;background:var(--c-bg);font-weight:700}
.gp-intervention-tabs{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:0 0 14px;padding:4px;background:rgba(15,23,42,.035);border:1px solid var(--c-border);border-radius:12px;width:max-content;max-width:100%;overflow-x:auto}
.gp-intervention-tab{border:0;background:transparent;color:var(--c-text2);font:inherit;font-size:11px;font-weight:800;padding:8px 11px;border-radius:9px;cursor:pointer;white-space:nowrap}
.gp-intervention-tab span{display:inline-grid;place-items:center;min-width:19px;height:19px;margin-left:4px;padding:0 5px;border-radius:999px;background:rgba(15,23,42,.07);font-size:10px}
.gp-intervention-tab:hover{color:var(--c-text);background:rgba(255,255,255,.7)}
.gp-intervention-tab.active{background:#fff;color:var(--c-blue);box-shadow:0 3px 10px rgba(15,23,42,.08)}
.gp-intervention-tab.active span{background:rgba(0,122,255,.10);color:var(--c-blue)}
@media(max-width:600px){.gp-intervention-tabs{width:100%;flex-wrap:nowrap}.gp-intervention-tab{flex:0 0 auto}}

/* V2.19 — lecture immédiate des impayés, alertes et stabilité mobile */
.nav-tab-billing{background:rgba(37,99,235,.08);border-color:rgba(37,99,235,.18);font-weight:800}.nav-tab-billing:hover,.nav-tab-billing.active{background:#2563eb!important;color:#fff!important;border-color:#2563eb!important}
.gp-card-financial-line{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:9px;padding-top:8px;border-top:1px solid var(--c-border);font-size:12px}.gp-card-financial-line span{color:var(--c-text2)}.gp-card-financial-line strong{font-size:14px;white-space:nowrap}.gp-card-financial-line .is-due{color:#dc2626}.gp-card-financial-line .is-clear{color:#16a34a}.gp-card-alerts{margin-top:7px}.gp-card-alert-pill{display:inline-flex;padding:4px 7px;border-radius:999px;background:#fff7ed;color:#c2410c;font-size:10px;font-weight:800}.gp-send-mecano-btn{background:rgba(124,58,237,.09)!important;color:#6d28d9!important;border-color:rgba(124,58,237,.25)!important;font-weight:800}.gp-send-mecano-btn:hover{background:#7c3aed!important;color:#fff!important}
@media(max-width:760px){.page-body{width:100%;max-width:100vw;overflow-x:hidden}.fiche-print,.fiche-section-grid,.fiche-bloc,.fiche-desc,.gp-invoice-summary{max-width:100%;min-width:0}.fiche-section-grid{grid-template-columns:1fr!important}.fiche-table-info{width:100%;table-layout:fixed}.fiche-table-info td{padding:7px 6px;font-size:12px;overflow-wrap:anywhere;word-break:break-word}.fiche-table-info td:first-child{width:42%}.fiche-desc{overflow-wrap:anywhere;word-break:break-word}.gp-invoice-summary-main{min-width:0;width:100%}.gp-invoice-summary-main>div:last-child{min-width:0}.gp-invoice-summary-main strong,.gp-invoice-summary-main span{overflow-wrap:anywhere}.nav-tabs{max-width:100%;overflow-x:auto;flex-wrap:nowrap}.nav-tab{flex:0 0 auto}}

/* V2.20 UX — lisibilité dashboard, filtres et pagination */
.gp-dashboard-hero{background:linear-gradient(135deg,#eef3f8 0%,#e5ecf3 100%);border-color:#d3dde7;}
.gp-dashboard-hero .gp-dashboard-money-card{background:rgba(255,255,255,.94);border-color:#d7e0e9;}
.nav-tab-billing{background:rgba(0,122,255,.08)!important;border-color:rgba(0,122,255,.25)!important;color:var(--c-blue)!important;font-weight:800;}
.gp-intervention-tabs{width:100%;max-width:100%;background:#f2f6f9;border-color:#d8e1e9;box-shadow:0 2px 8px rgba(15,23,42,.04);}
.gp-intervention-tab{min-height:40px;padding:9px 13px;color:#334155;}
.gp-intervention-tab span{min-width:23px;height:23px;background:#e2e8f0;color:#334155;}
.gp-intervention-tab[data-tab-filter="en_cours"] span{background:#fff1d6;color:#a15c00;}
.gp-intervention-tab[data-tab-filter="aprevoir"] span{background:#fff0d8;color:#a15c00;}
.gp-intervention-tab[data-tab-filter="mecano"] span{background:#efe6ff;color:#7041a8;}
.gp-intervention-tab.active{outline:2px solid rgba(0,122,255,.14);}
.gp-pagination{display:flex;justify-content:center;margin:22px 0 8px;}
.gp-pagination .page-numbers{display:flex;gap:6px;list-style:none;margin:0;padding:0;align-items:center;}
.gp-pagination .page-numbers a,.gp-pagination .page-numbers span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border:1px solid var(--c-border);border-radius:9px;text-decoration:none;background:var(--c-card,#fff);color:var(--c-text);font-size:12px;font-weight:700;}
.gp-pagination .page-numbers .current{background:var(--c-blue);border-color:var(--c-blue);color:#fff;}
@media(max-width:600px){.gp-pagination .page-numbers a,.gp-pagination .page-numbers span{min-width:34px;height:34px}.gp-dashboard-hero{background:linear-gradient(135deg,#edf3f8,#e5ecf3)}}

/* V2.22 — solde en attente visible en rouge dans l'autosuggest global */
.sd-item-meta .sd-balance-pending{color:#dc2626!important;font-weight:800;}

/* V2.24 — Tarification intervention : lecture immédiate du prix TTC */
.gp-price-note{margin:-4px 0 12px;padding:10px 12px;border:1px solid rgba(37,99,235,.18);border-radius:10px;background:rgba(37,99,235,.07);color:var(--c-text2);font-size:12px;line-height:1.4}
.gp-price-note strong{color:var(--c-blue)}
.gp-price-achat,.gp-price-ttc{min-height:44px;font-size:15px;font-weight:650}
.gp-price-ttc{border:2px solid var(--c-blue)!important;box-shadow:0 0 0 3px rgba(37,99,235,.08);background:rgba(37,99,235,.035)}
.gp-price-ttc:focus{box-shadow:0 0 0 4px rgba(37,99,235,.14)}
.gp-price-help{font-size:11px;color:var(--c-text3);margin-top:7px;line-height:1.4}
.gp-price-help strong{color:var(--c-blue)}
@media(max-width:600px){.gp-price-note{font-size:11px;padding:9px 10px}.gp-price-achat,.gp-price-ttc{min-height:46px;font-size:16px}}

/* =========================================================
   V2.25 — FICHE INTERVENTION : lecture mobile + montant client
   ========================================================= */
.gp-intervention-total-card{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin:14px 0;padding:14px 18px;border:1px solid rgba(0,122,255,.16);
  background:linear-gradient(135deg,rgba(0,122,255,.07),rgba(99,102,241,.035));
  border-radius:14px;box-shadow:0 4px 14px rgba(15,23,42,.05);
}
.gp-intervention-total-card .gp-total-label{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--c-text2)}
.gp-intervention-total-card .gp-total-title{font-size:15px;font-weight:800;color:var(--c-text);margin-top:2px}
.gp-intervention-total-card .gp-total-amount{font-size:24px;font-weight:900;color:var(--c-blue);white-space:nowrap}
.gp-watermark{font-size:10px;letter-spacing:1.8px;font-weight:800;color:rgba(71,85,105,.32);text-align:center;margin:-2px 0 10px;user-select:none}

/* Statistiques */
.gp-header-stats-link{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--c-text2);font-weight:700}
.gp-stats-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}
.gp-stat-kpi{background:var(--c-card);border:1px solid var(--c-border);border-radius:14px;padding:15px;box-shadow:0 4px 12px rgba(15,23,42,.04)}
.gp-stat-kpi span{display:block;color:var(--c-text2);font-size:12px;font-weight:700;margin-bottom:6px}
.gp-stat-kpi strong{font-size:22px;font-weight:900;color:var(--c-text)}
.gp-stat-kpi strong.is-green{color:var(--c-green)}
.gp-stat-kpi strong.is-red{color:#dc2626}
.gp-stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.gp-chart-wide{grid-column:1/-1}
.gp-chart-legend{font-size:11px;color:var(--c-text2);display:inline-flex;gap:6px;align-items:center}.gp-chart-legend i{width:8px;height:8px;border-radius:50%;background:var(--c-blue);display:inline-block}
.gp-bars{height:205px;display:flex;align-items:flex-end;gap:9px;padding:18px 10px 4px;border-top:1px solid var(--c-border)}
.gp-bar-col{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px}.gp-bar{width:min(34px,75%);background:linear-gradient(180deg,var(--c-blue),rgba(0,122,255,.42));border-radius:7px 7px 3px 3px;min-height:4px}.gp-bar-value{height:14px;font-size:9px;color:var(--c-text2);white-space:nowrap}.gp-bar-col small{font-size:10px;color:var(--c-text3)}
.gp-donut-wrap{display:flex;align-items:center;gap:18px;min-height:170px}.gp-donut{width:128px;height:128px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--c-green) var(--paid),#e5e7eb 0);position:relative;flex:0 0 auto}.gp-donut:after{content:"";position:absolute;inset:14px;background:var(--c-card);border-radius:50%}.gp-donut strong{position:relative;z-index:1;font-size:23px}.gp-donut-meta{display:grid;gap:13px}.gp-donut-meta b{display:block;font-size:17px}.gp-donut-meta span{font-size:11px;color:var(--c-text2)}
.gp-status-list{display:grid;gap:12px;padding:10px 2px}.gp-status-list>div{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--c-border);padding-bottom:10px}.gp-status-list>div:last-child{border-bottom:0}.gp-status-list span{font-size:13px}.gp-status-list b{font-size:17px}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}.dot-blue{background:var(--c-blue)}.dot-green{background:var(--c-green)}.dot-red{background:#ef4444}.dot-gray{background:#94a3b8}
.gp-client-bars{display:grid;gap:12px;padding:8px 0}.gp-client-row{display:grid;grid-template-columns:minmax(110px,180px) 1fr auto;gap:10px;align-items:center}.gp-client-name{font-size:12px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gp-client-track{height:9px;background:#eef2f7;border-radius:99px;overflow:hidden}.gp-client-track span{display:block;height:100%;background:var(--c-blue);border-radius:99px}.gp-client-row strong{font-size:12px;white-space:nowrap}

@media (max-width:700px){
  .gp-watermark{display:none}
  .gp-intervention-total-card{padding:12px 14px;margin:10px 0}.gp-intervention-total-card .gp-total-amount{font-size:21px}.gp-intervention-total-card .gp-total-title{font-size:14px}
  .fiche-table-pieces{display:block;overflow:visible;font-size:12px}.fiche-table-pieces thead{display:none}.fiche-table-pieces tbody,.fiche-table-pieces tfoot{display:block}.fiche-table-pieces tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px 8px;padding:10px 0;border-bottom:1px solid var(--c-border)}.fiche-table-pieces tbody td{border:0!important;padding:0;min-width:0}.fiche-table-pieces tbody td:nth-child(1){grid-column:1/-1;font-weight:750}.fiche-table-pieces tbody td:nth-child(2),.fiche-table-pieces tbody td:nth-child(3),.fiche-table-pieces tbody td:nth-child(5){display:none}.fiche-table-pieces tbody td:nth-child(4){grid-column:1}.fiche-table-pieces tbody td:nth-child(6){grid-column:2;color:var(--c-blue);font-weight:800}.fiche-table-pieces tbody td:nth-child(7){grid-column:3;color:var(--c-blue);font-weight:900}.fiche-table-pieces tfoot tr{display:grid;grid-template-columns:1fr auto;gap:5px;border-bottom:1px solid var(--c-border)}.fiche-table-pieces tfoot td{padding:7px 4px!important;border:0!important}.fiche-table-pieces tfoot td:first-child{grid-column:1}.fiche-table-pieces tfoot td:last-child{grid-column:2}.fiche-table-pieces tfoot td[colspan]{text-align:left!important}
  .gp-stats-kpis{grid-template-columns:1fr 1fr;gap:9px}.gp-stat-kpi{padding:12px}.gp-stat-kpi strong{font-size:18px}.gp-stats-grid{grid-template-columns:1fr}.gp-chart-wide{grid-column:auto}.gp-bars{gap:4px;height:180px}.gp-bar{width:70%}.gp-bar-value{display:none}.gp-donut-wrap{min-height:145px}.gp-donut{width:108px;height:108px}.gp-client-row{grid-template-columns:1fr auto;gap:6px}.gp-client-track{grid-column:1/-1;grid-row:2}.gp-client-row strong{grid-column:2;grid-row:1}
}

/* V2.26 — fiche intervention : mobile stable et hiérarchie des actions */
@media (max-width:760px){
  .gp-fiche-main-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;align-items:stretch!important;}
  .gp-fiche-main-actions .fiche-action-context{grid-column:2;grid-row:1;justify-content:flex-end;min-width:0;overflow:visible;}
  .gp-fiche-main-actions .fiche-action-context .gp-context-chip{display:none;}
  .gp-fiche-main-actions .fiche-action-primary{display:contents;}
  .gp-fiche-main-actions .gp-edit-intervention-btn{grid-column:1;grid-row:1;width:100%;min-height:44px;}
  .gp-fiche-main-actions .gp-send-client-btn{grid-column:1/-1;grid-row:2;width:100%;min-height:42px;}
  .gp-fiche-main-actions .fiche-action-secondary{display:contents;}
  .gp-fiche-main-actions .fiche-action-secondary .btn{min-height:42px;width:100%;}
  .gp-fiche-main-actions .fiche-action-secondary .gp-send-mecano-btn{grid-column:1;grid-row:3;}
  .gp-fiche-main-actions .fiche-action-secondary .btn:nth-child(2){grid-column:2;grid-row:3;}
  .gp-fiche-main-actions .fiche-action-secondary .btn:nth-child(3){grid-column:1;grid-row:4;}
  .gp-fiche-main-actions .fiche-action-secondary .btn:nth-child(4){grid-column:2;grid-row:4;}
  .gp-intervention-total-card{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;}
  .gp-intervention-total-card .gp-total-amount{font-size:22px;}
}

/* ==============================
   V2.27 — Statistiques renforcées
   ============================== */
.gp-stats-kpis-main{grid-template-columns:repeat(4,minmax(0,1fr))}.gp-stat-kpi{display:flex;flex-direction:column;justify-content:center;min-height:82px;text-decoration:none}.gp-stat-kpi span{font-size:11px}.gp-stat-kpi strong{font-size:25px}.gp-stats-grid{align-items:start}.gp-bars-double{height:190px;display:flex;align-items:flex-end;justify-content:center;gap:3px}.gp-double-bars{height:170px;display:flex;align-items:flex-end;gap:2px}.gp-double-bars .gp-bar{width:13px;min-height:0;border-radius:4px 4px 0 0}.gp-bar-paid{background:#16a34a}.gp-bar-pending{background:#ef4444}.gp-chart-legend .legend-paid,.gp-chart-legend .legend-pending{display:inline-block;width:9px;height:9px;border-radius:50%;margin-left:7px}.gp-chart-legend .legend-paid{background:#16a34a}.gp-chart-legend .legend-pending{background:#ef4444}.gp-client-bars-highlight{padding:4px 0}.gp-client-row-dual{display:grid;grid-template-columns:145px minmax(120px,1fr) 85px;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--c-border)}.gp-client-row-dual small{grid-column:2/-1;font-size:11px;margin-top:-5px}.gp-client-track-dual{position:relative;height:12px;background:#eef2f7;border-radius:999px;overflow:hidden;display:flex}.gp-client-track-dual span{display:block;height:100%}.gp-paid-fill{background:#16a34a}.gp-pending-fill{background:#ef4444}.text-paid{color:#15803d}.text-pending{color:#dc2626}.gp-payment-summary{display:grid;gap:13px}.gp-payment-summary>div{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--c-border)}.gp-payment-summary>div:last-child{border-bottom:0}.gp-payment-summary span{font-size:12px;color:var(--c-text2)}.gp-payment-summary strong{font-size:22px}
@media(max-width:900px){.gp-stats-kpis-main{grid-template-columns:repeat(2,minmax(0,1fr))}.gp-client-row-dual{grid-template-columns:1fr auto}.gp-client-row-dual .gp-client-track-dual{grid-column:1/-1;grid-row:2}.gp-client-row-dual small{grid-column:1/-1;grid-row:3}}
@media(max-width:600px){.gp-stats-kpis-main{grid-template-columns:1fr 1fr;gap:8px}.gp-stat-kpi{min-height:72px;padding:11px}.gp-stat-kpi strong{font-size:19px}.gp-bars-double{height:160px}.gp-double-bars{height:140px}.gp-double-bars .gp-bar{width:9px}.gp-client-row-dual{grid-template-columns:1fr auto}.gp-client-name{font-size:12px}}
