/* ═══════════════════════════════════════════════════════════════════════
   CAMALARM CRM — T172C : CSS "Ajouter au catalogue"
   ═══════════════════════════════════════════════════════════════════════
   Ajoute UNIQUEMENT :
     • Le footer "+ catalogue" dans le dropdown T172B
     • La modal d'ajout/mise à jour
   Aucune règle ne touche aux lignes ou au layout du devis.
   Couleurs : variables CRM (--crm-bl, --crm-or)
   ═══════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────
   1. Footer du dropdown T172B (ligne "Ajouter au catalogue")
   ─────────────────────────────────────────────────────────────────────── */
.t172b-dd-footer {
  border-top: 1px solid #e5e7eb;
  background: #f8fafc;
  padding: 6px;
  border-radius: 0 0 10px 10px;
  position: sticky;
  bottom: 0;
}
.t172b-dd-addbtn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 12px;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: #475569;
  background: #ffffff;
  border: 1px dashed #cbd5e1;
  border-radius: 7px;
  cursor: pointer;
  transition: color .12s ease, border-color .12s ease, background .12s ease;
}
.t172b-dd-addbtn:hover {
  color: var(--crm-or, #E65100);
  border-color: var(--crm-or, #E65100);
  border-style: solid;
  background: rgba(230, 81, 0, 0.04);
}
.t172b-dd-addicon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  border-radius: 50%;
  background: rgba(230, 81, 0, 0.10);
  color: var(--crm-or, #E65100);
}

/* ───────────────────────────────────────────────────────────────────────
   2. Modal "Ajouter au catalogue"
   ─────────────────────────────────────────────────────────────────────── */
.t172c-modal .ml {
  border-radius: 12px;
  overflow: hidden;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

.t172c-mbd {
  padding: 16px 18px !important;
}

.t172c-warn {
  margin-bottom: 14px;
  padding: 10px 12px;
  background: rgba(230, 81, 0, 0.08);
  border-left: 3px solid var(--crm-or, #E65100);
  border-radius: 4px;
  font-size: 12.5px;
  line-height: 1.5;
  color: #b33d00;
}
.t172c-warn strong {
  font-family: 'JetBrains Mono', 'SF Mono', 'Menlo', monospace;
  font-size: 12px;
  background: rgba(230, 81, 0, 0.12);
  padding: 1px 6px;
  border-radius: 3px;
  color: #b33d00;
}

/* Grille des champs : 2 colonnes sur desktop */
.t172c-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 14px;
}
.t172c-fullw { grid-column: 1 / -1; }

.t172c-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.t172c-field > span {
  font-size: 11px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.t172c-field > span em {
  color: var(--crm-or, #E65100);
  font-style: normal;
  font-weight: 700;
  margin-left: 2px;
}
.t172c-field input,
.t172c-field textarea,
.t172c-field select {
  font-family: inherit;
  font-size: 13.5px;
  padding: 8px 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 7px;
  background: #ffffff;
  color: #1e293b;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.t172c-field input:focus,
.t172c-field textarea:focus,
.t172c-field select:focus {
  border-color: var(--crm-bl, #0F3D67);
  box-shadow: 0 0 0 3px rgba(15, 61, 103, 0.08);
}
.t172c-field textarea {
  resize: vertical;
  line-height: 1.5;
  min-height: 60px;
}

/* Actions en bas */
.t172c-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding: 12px 18px;
  border-top: 1px solid #e5e7eb;
  background: #f8fafc;
}
.t172c-btn-ghost,
.t172c-btn-primary {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  font-family: inherit;
  border-radius: 7px;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.t172c-btn-ghost {
  background: transparent;
  color: #64748b;
  border: 1px solid #cbd5e1;
}
.t172c-btn-ghost:hover {
  background: #ffffff;
  border-color: #94a3b8;
  color: #1e293b;
}
.t172c-btn-primary {
  background: var(--crm-bl, #0F3D67);
  color: #ffffff;
  border: 1px solid var(--crm-bl, #0F3D67);
}
.t172c-btn-primary:hover {
  background: #0a2a48;
}

/* Responsive : grille 1 colonne sur mobile */
@media (max-width: 600px) {
  .t172c-grid {
    grid-template-columns: 1fr;
  }
}