/* استایل‌های اختصاصی سامانه CRM - مکمل main.css (Tailwind) قالب */

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  border-radius: 9999px;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 700;
}

.status-open, .status-unpaid, .status-pending { background: rgba(63,181,162,.15); color: #1a7a6d; }
.status-progress, .status-review { background: rgba(96,150,255,.15); color: #2952c9; }
.status-waiting, .status-mismatch { background: rgba(249,133,60,.18); color: #c0380c; }
.status-closed, .status-paid, .status-approved { background: rgba(37,184,101,.15); color: #1a7a4a; }
.status-cancelled, .status-rejected { background: rgba(232,77,12,.15); color: #a83a0c; }

.data-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.data-table thead th {
  text-align: start;
  font-size: .72rem;
  font-weight: 700;
  color: #8593ae;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .75rem 1rem;
  border-bottom: 1px solid rgba(213,218,227,.6);
}
.data-table tbody td {
  padding: .85rem 1rem;
  border-bottom: 1px solid rgba(236,238,242,.8);
  vertical-align: middle;
}
.data-table tbody tr:hover { background: rgba(240,250,248,.5); }

/* پیام‌های فلش (Flash Messages) */
.flash-success { border-color: rgba(63,181,162,.5); background: rgba(240,250,248,.9); color: #1a7a6d; }
.flash-error { border-color: rgba(249,133,60,.5); background: rgba(255,246,237,.9); color: #c0380c; }

/* حباب‌های چت تیکت */
.chat-bubble { max-width: 70%; border-radius: 1rem; padding: .75rem 1rem; font-size: .875rem; line-height: 1.6; }
.chat-bubble.staff { background: #1a7a6d; color: #fff; border-bottom-left-radius: .25rem; }
.chat-bubble.client { background: #f4f7f6; color: #343947; border-bottom-right-radius: .25rem; }
.chat-bubble.internal { background: rgba(249,133,60,.15); color: #a83a0c; border: 1px dashed rgba(249,133,60,.5); }

/* ورودی فرم یکدست (همسو با field-input قالب در صفحات settings.html) */
.field-input {
  width: 100%;
  border-radius: .75rem;
  border: 1px solid rgba(213,218,227,.7);
  background: rgba(255,255,255,.8);
  padding: .75rem 1rem;
  font-size: .875rem;
  color: #232735;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.field-input:focus {
  border-color: #3fb5a2;
  box-shadow: 0 0 0 4px rgba(63,181,162,.15);
}
textarea.field-input { resize: vertical; }