
:root{
  --bms-accent:#fcb900; --bms-bg:#fff9e6;
  --border:#e0d8c0; --ink:#2b2100; --r:14px; --shadow:0 10px 28px rgba(0,0,0,.18);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bms-bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,sans-serif;font-size:14px}
.container{max-width:1400px;margin:0 auto;padding:14px}
/* Header */
.bms-header{position:sticky;top:0;z-index:10;background:var(--bms-accent); color:#2b2100; padding:10px 16px; box-shadow:0 6px 18px rgba(0,0,0,.12); display:flex; align-items:center; justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px}
.brand h1{margin:0;font-size:16px}
.brand img{height:30px}
.nav{display:flex;gap:8px}
.nav a{color:#2b2100;text-decoration:none;padding:8px 10px;border-radius:10px;font-weight:700;opacity:.9;cursor:pointer}
.nav a:hover{opacity:1;background:rgba(0,0,0,.06)}
.nav a.active{background:#fff;color:#2b2100}
/* Panel recherche */
.panel{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.05);padding:10px 12px;margin:10px 0 14px}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.search-wrap{position:relative;width:300px;min-width:260px}
.search-input{width:100%; background:#fff;border:1px solid var(--border);border-radius:999px;padding:8px 12px 8px 36px; box-shadow:0 1px 6px rgba(0,0,0,.04)}
.search-input::placeholder{color:#8e7f4a}
.search-wrap .search-ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);opacity:.7}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filter-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);padding:5px 10px;border-radius:999px;background:#fff9e6;cursor:pointer;font-size:13px}
.filter-chip.active{outline:2px solid #d8c27a}
.filter-reset{border-style:dashed;background:#fff}
/* Cards/table */
.card{background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.card .hd{padding:10px 12px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.card .bd{padding:10px 12px}
.badge{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--border);padding:2px 8px;border-radius:999px;font-size:12px}
.layout{display:grid;grid-template-columns:7fr 3fr;gap:14px;align-items:start}
@media (max-width:980px){  .layout{grid-template-columns:1fr} }
.tablehead{display:grid;grid-template-columns:44px 1.1fr 1.2fr 140px 90px 90px 120px;gap:8px;font-size:11px;text-transform:uppercase;color:#6a5a2a;padding:0 4px}
.row{background:#fffdf6;border:1px solid var(--border);border-radius:12px;display:grid;grid-template-columns:44px 1.1fr 1.2fr 140px 90px 90px 120px;align-items:center;gap:8px;padding:8px;margin:8px 0;cursor:pointer;transition:transform .08s ease, box-shadow .12s ease}
.row:hover{box-shadow:0 6px 16px rgba(0,0,0,.08);transform:translateY(-1px)}
.row.selected{outline:2px solid #d8c27a}
.cell{padding:0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
/* Side panel */
.side{position:sticky; top:78px; align-self:start; height:calc(100vh - 92px); display:flex; flex-direction:column; border-left:1px solid var(--border);}
.side .actions-top{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px; border-bottom:1px solid var(--border); background:#fff; position:sticky; top:0; z-index:1;}
.id-badge{display:inline-flex; align-items:center; gap:8px; font-size:12px; color:#6a5a2a; background:#fff9e6; border:1px solid var(--border); border-radius:999px; padding:6px 10px;}
.side .form-wrap{flex:1; overflow:auto; padding:10px}
.form-grid{display:grid;gap:10px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.label{font-size:11px;color:#6a5a2a;margin-bottom:6px;display:flex;align-items:center;gap:6px}
.text, .textarea, .text-sm, select{width:100%;background:#fff;border:1px solid var(--border);border-radius:10px;padding:8px}
.textarea{min-height:120px;resize:vertical}
.text-sm{padding:7px;font-size:13px}
.hidden{display:none}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);padding:5px 10px;border-radius:999px;background:#fff9e6;font-size:12px}
.chip .x{width:16px;height:16px;line-height:14px;border-radius:999px;border:1px solid var(--border);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-weight:800}
.group-add{display:flex;gap:6px;margin-top:6px}
.btn{background:#fff;border:1px solid var(--border);padding:8px 10px;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13px}
.btn.primary{background:var(--bms-accent);border-color:#d5b24a;color:#1b1500}
.btn.danger{border-color:#dba; background:#fff;color:#a00}
.btn:hover{background:#fff7da}
/* Toast centré */
.toast{position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); z-index:12000; background:#2b2100; color:#fff; padding:14px 16px; border-radius:12px; box-shadow:var(--shadow); opacity:0; transition: opacity .18s ease; max-width:90%; text-align:center;}
.toast.show{opacity:1}
/* Tabs */
.tab{display:none}
.tab.active{display:block}
.toolbar { display:flex; align-items:center; gap:12px; }
.toolbar .spacer { flex:1; }
.btn.outline { border:1px solid #d0c6a6; background:#fff; color:#634f1a; padding:8px 12px; border-radius:10px; }
.btn.outline:hover { background:#fff7e5; }


/* ===== Correction du saut de ligne dans la liste Tickets ===== */

/* 1️⃣  Empêcher les cellules de casser la ligne */
#tkRows .row {
  display: grid;
  grid-template-columns: 40px 150px 1fr 140px 120px 80px 100px 130px;
  align-items: center;
  border-bottom: 1px solid #f0e6c8;
  white-space: nowrap;           /* empêche le retour ligne */
  overflow: hidden;
}

/* 2️⃣  Autoriser la colonne Sujet à s'étirer (c’est la seule qui peut wrap) */
#tkRows .row .cell:nth-child(3) {
  white-space: normal;
  overflow-wrap: break-word;
}

/* 3️⃣  Le badge de statut (évite qu’il descende tout seul) */
.status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;  /* reste sur une ligne */
}

.st-open { background: #fff3f3; color: #a00; border: 1px solid #e0b0b0; }
.st-pending { background: #fffbe6; color: #6a5a2a; border: 1px solid #e2d5a8; }
.st-solved { background: #e7f8ee; color: #0b6b2e; border: 1px solid #6cc38a; }

