/* V227 - System-wide UI cleanup: Task Management typography/table, plus
   Notification Report, Audit Logs, and User Management polish.
   UI-only. Loaded last (after ui-polish-v226.css) so it can safely refine
   V226's rules without touching routes, permissions, task data/titles,
   workflow, or import/export business logic. Regulatory Report V226
   behavior (fixed 18-column export, no column-config popover, date/table
   layout fixes) is left untouched here. Every selector below targets
   classes/attributes that already exist in the markup. */

/* =====================================================================
   1. Typography - final consistency pass (defensive; most of the app
   already uses Inter via global-typography-v200.css / enterprise-saas-
   v221.css / ui-polish-v226.css). Ensures no browser-default serif shows
   through anywhere, including the pages touched in this pass.
   ===================================================================== */
:root{
  --v227-font: Inter, "Be Vietnam Pro", Roboto, "Helvetica Neue", Arial, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html, body, button, input, select, textarea,
table, th, td, label, small, .hint, .muted,
.badge, .audit-action-badge{
  font-family: var(--v227-font) !important;
}

body{
  font-size: 14px;
  line-height: 1.5;
  color: #111827;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* =====================================================================
   2. Task list - Task cell: contract code + drug name share one row,
   compact meta line below. Renders real contract/crop/pest_target/
   province fields directly - the stored task.title is never changed,
   this is display only. (tasks.html wraps the code+name pair in a new
   .task-cell-primary div; V226's classes - contract-code-badge/
   task-title-main/task-title-meta - are kept so no other rule needs to
   change, just refined here.)
   ===================================================================== */
#taskDataGrid .task-title-cell{
  min-width: 320px;
  max-width: 460px;
}

#taskDataGrid .task-title-cell a{
  display: grid !important;
  gap: 4px !important;
  align-content: start !important;
  color: inherit;
  text-decoration: none;
  min-width: 0;
}

#taskDataGrid .task-cell-primary{
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  min-width: 0 !important;
  line-height: 1.35 !important;
}

/* Flat colored code instead of a pill badge - reads as part of the same
   line as the drug name rather than a separate row. */
#taskDataGrid .contract-code-badge{
  display: inline !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  color: #2563eb !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}

#taskDataGrid .task-title-main{
  display: block !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #111827 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

#taskDataGrid .task-title-cell a:hover .task-title-main{
  color: #1d4ed8 !important;
}

#taskDataGrid .task-title-meta{
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  color: #6b7280 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
}

/* =====================================================================
   3. Task list table - sticky checkbox/ID/actions verification pass.
   V226 already fixed the root cause (a generic table{overflow:hidden}
   rule was breaking position:sticky, plus border-collapse:separate) and
   confirmed sticky works live. This section only reinforces the exact
   widths/z-index/background so column-hide/show toggles never leave a
   stale sticky slot with a transparent background - no rules are
   duplicated blindly, only value refinements on the same selectors V226
   already established.
   ===================================================================== */
.task-saas-table-wrap,
.data-grid-wrap{
  width: 100%;
  max-width: 100%;
  overflow-x: auto !important;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: touch !important;
  position: relative !important;
}

#taskDataGrid th, #taskDataGrid td{
  box-sizing: border-box !important;
}

#taskDataGrid th[data-col="id"], #taskDataGrid td[data-col="id"]{
  min-width: 86px !important;
  width: 86px !important;
  max-width: 96px !important;
}

#taskDataGrid th.select-col, #taskDataGrid td.select-col,
#taskDataGrid th[data-col="id"], #taskDataGrid td[data-col="id"],
#taskDataGrid th[data-col="actions"], #taskDataGrid td[data-col="actions"]{
  background-color: #ffffff !important;
}

/* =====================================================================
   4. Status badges - already fully colored for all 7 statuses by V226
   (.status-badge.status-XXX / .reg-status-badge.status-XXX). Nothing to
   add here; left as a marker so a future pass knows this was checked.
   ===================================================================== */

/* =====================================================================
   5. Notification Report - long title/message/related-task text must
   never force full-page horizontal scroll; clamp to 2 lines instead,
   full text still available via the title="" tooltip.
   ===================================================================== */
.table-scroll{
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.notification-title,
.notification-message,
.notification-task-link{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 100%;
  word-break: break-word;
  overflow-wrap: anywhere;
  cursor: help;
}

.notification-title{
  white-space: normal;
}

.notification-task-cell{
  max-width: 260px;
}

.notification-task-link{
  display: -webkit-box;
}

/* =====================================================================
   6. Audit Logs - long User-Agent strings must not stretch the table
   past the viewport; action badges get a color per outcome.
   ===================================================================== */
.audit-user-agent,
td.audit-user-agent{
  max-width: 200px;
  width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: help;
}

.audit-action-badge{
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  border: 1px solid transparent;
}

.audit-action-login{
  color: #065f46;
  background: #d1fae5;
  border-color: #a7f3d0;
}

.audit-action-failed,
.audit-action-delete{
  color: #991b1b;
  background: #fee2e2;
  border-color: #fecaca;
}

.audit-action-export,
.audit-action-edit,
.audit-action-update{
  color: #1d4ed8;
  background: #dbeafe;
  border-color: #bfdbfe;
}

.audit-action-other{
  color: #374151;
  background: #f3f4f6;
  border-color: #e5e7eb;
}

/* =====================================================================
   7. User Management - soften overly bold/uppercase labels. Form
   structure and permission logic are untouched; this only relaxes the
   app-wide label{font-weight:700!important} rule on these two pages.
   ===================================================================== */
.saas-users-page label,
.users-modern-page label{
  font-weight: 500 !important;
  color: #374151 !important;
  text-transform: none !important;
}