/* ===== GetYourRide Dispatch - CSS Polish ===== */
/* Version propre - 27/09/2026 */

/* ---------- FOND CAHIER ---------- */
html:not(.gyr-dark) body{background-color:#f5f6f2;background-image:linear-gradient(rgba(180,190,180,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(180,190,180,.16) 1px,transparent 1px);background-size:40px 40px;background-attachment:fixed}
html.gyr-dark body{background-color:#0a0d14;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:40px 40px;background-attachment:fixed}
html:not(.gyr-dark) .card{background:rgba(255,255,255,.94)}

/* ---------- BOUTONS ---------- */
button:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.btn-primary{background:linear-gradient(180deg,#1a1f2e 0%,#0b0f19 100%);color:#fff;box-shadow:0 2px 8px rgba(11,15,25,.18)}
.btn-primary:hover{box-shadow:0 6px 18px rgba(11,15,25,.28);transform:translateY(-1px)}

/* ---------- TABLEAU ADMIN ---------- */
html:not(.gyr-dark) table.admin-table thead th{background:#f1f5f9;color:#475569}
html:not(.gyr-dark) table.admin-table tbody td{border-bottom:1px solid #e2e8f0}
html:not(.gyr-dark) table.admin-table tbody tr:nth-child(even) td{background:#f8fafc}
html:not(.gyr-dark) table.admin-table tbody tr:hover td{background:#f0fdf4}
table.admin-table{table-layout:fixed;width:100%;min-width:0;font-size:11px}
table.admin-table th,table.admin-table td{padding:6px 4px;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;word-break:break-word}
table.admin-table th{font-size:9.5px;letter-spacing:.02em}
table.admin-table .btn-icon-action{width:22px;height:22px;font-size:11px}
table.admin-table .driver-quote-badge{font-size:8px;padding:1px 4px;max-width:60px;overflow:hidden;text-overflow:ellipsis;display:inline-block;white-space:nowrap}

/* ---------- CHAT / MESSAGES ---------- */
.chat-layout{min-width:0}
.chat-layout > *{min-width:0}
.chat-msg{word-break:break-word;overflow-wrap:anywhere}

/* ---------- IPHONE / MOBILE ---------- */
@media(max-width:860px){
  html,body{overflow-x:clip}
  .wrap{overflow-x:clip;padding-left:8px;padding-right:8px}
  .chat-layout{grid-template-columns:1fr;gap:10px}
  .chat-layout > *{max-width:100%}
  .chat-panel{height:auto;min-height:400px;max-height:70vh}
  .chat-header{display:flex;flex-direction:column;gap:8px;padding:10px}
  .chat-header > div:last-child{display:flex;flex-wrap:wrap;gap:6px;width:100%}
  .chat-header button{flex:1 1 auto;padding:8px 10px;font-size:12px;white-space:nowrap}
  .chat-msg{max-width:88%;font-size:13px}
  .chat-input-bar{padding:8px;gap:6px}
  .chat-input-bar textarea{font-size:15px;min-width:0;flex:1}
  .chat-input-bar button{flex:0 0 auto;padding:8px 12px;font-size:12px}
  .chat-conv-list{max-height:240px}
  .chat-conv .cc-avatar{width:32px;height:32px}
  .chat-conv .cc-name,.chat-conv .cc-last{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* Tableau compact mobile */
  table.admin-table{font-size:12px}
}

/* ---------- DEVIS ---------- */
.devis-indicator{display:inline-block;margin-right:5px;font-size:14px;vertical-align:middle}
.devis-count{display:inline-block;background:#dc2626;color:#fff;font-size:9px;font-weight:800;padding:1px 5px;border-radius:8px;margin-left:5px;vertical-align:middle}
/* Fin CSS */

/* === v18 : Cloche au-dessus de la coccinelle sur PC === */
@media(min-width:721px){
  .gyr-push-btn{
    top:auto !important;
    bottom:66px !important;
    right:18px !important;
    width:38px !important;
    height:38px !important;
  }
  .gyr-bug-fab{
    bottom:18px !important;
    right:18px !important;
    width:38px !important;
    height:38px !important;
  }
}