/*
 * Abby Portal v48.1.26 — Visual Balance Hotfix
 *
 * Progressive correction layer for v48.1.25. It keeps Abby's green, blue,
 * red and existing workflows while improving surface separation, chat
 * readability and the compact Admin shipment-board geometry.
 */

:root {
  --abby-canvas: #e2eceb;
  --abby-canvas-deep: #d7e4e3;
  --abby-surface: #f8fbfa;
  --abby-surface-soft: #edf4f3;
  --abby-surface-muted: #e2eceb;
  --abby-border: #c5d5d5;
  --abby-border-strong: #aebfc2;
}

/* Give the portal clearer visual layers without changing Abby's identity. */
.compact-shell {
  background:
    linear-gradient(180deg, rgba(238, 245, 244, .99), rgba(220, 233, 232, .99));
}

.brand-box,
.summary-box,
.account-box,
.portal-box,
.trip-box,
.trip-complete-box {
  background: #f8fbfa;
}

.brand-box {
  background:
    linear-gradient(135deg, rgba(23, 111, 175, .055), transparent 56%),
    #f8fbfa;
}

.summary-box {
  background: #e7f0ef;
}

.summary-box span,
.trip-box span,
.trip-complete-box span {
  border-color: #cbdada;
  background: #f5f9f8;
}

.portal-tabs,
.reports-tabs {
  border-color: #bdcecf;
  background: #d9e6e5;
}

.portal-tab.active,
.report-tab.active {
  background: #f8fbfa !important;
}

.compact-panel,
.admin-reports-panel,
.client-form-section,
.client-route-card,
.route-stops-card,
.organized-notes-box,
.organized-equipment-box,
.client-create-card,
.productivity-tool-card,
.admin-client-box {
  border-color: #c5d5d5;
  background: #eaf2f1;
}

.panel-title-row,
.client-form-section-title,
.client-route-card-title,
.route-stops-header,
.admin-client-heading {
  border-bottom-color: #c5d5d5;
  background: linear-gradient(180deg, #edf4f3, #e2eceb);
}

.inline-entry {
  border-color: #c5d5d5;
  background: #e1eceb;
}

.equipment-checks,
.quote-equipment-checks,
.organized-equipment-box,
.organized-notes-box,
.client-route-card-body,
.client-form-grid {
  background-color: #f4f8f7;
}

.needs-attention-dashboard {
  border-color: #c3d3d3;
  background: #e1ebea;
}

.attention-card {
  border-color: #c9d8d8;
  background:
    linear-gradient(145deg, rgba(23, 111, 175, .035), transparent 68%),
    #f7faf9;
}

.attention-card.active {
  border-color: #72aad4;
  background: #e7f3fb;
}

.reports-toolbar,
.report-metric-card,
.report-panel {
  background-color: #f7faf9;
}

.reports-content,
.reports-message,
.admin-reports-panel {
  background-color: #e6efee;
}

.report-panel-header,
.load-more-row {
  background: #e7efef;
}

/* Operational tables now read as layers instead of one large white block. */
.table-wrap,
.admin-table-wrap,
.quote-table-wrap,
.report-table-wrap {
  border-color: #bdcecf;
  background: #dce8e7;
}

.compact-table,
.report-table {
  background: #dce8e7;
}

.compact-table th,
.report-table th {
  border-bottom-color: #b7cbcc;
  background: #dbe7e6;
  color: #3b5968;
}

.compact-table td,
.report-table td {
  border-bottom-color: #d2dfdf;
  background: #f7faf9;
}

.compact-table tr:nth-child(even) td {
  background: #eaf2f1;
}

.compact-table tr.row-complete td {
  background: #e6f4ea;
}

.compact-table tbody tr:hover td,
.report-table tbody tr:hover td {
  background: #e5f0f5;
}

.ln-cell {
  background: #e1eaea !important;
}

.empty-cell {
  background: #edf4f3 !important;
}

/* Inputs remain the brightest layer so editable controls are obvious. */
.compact-shell input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.compact-shell select,
.compact-shell textarea,
.access-panel input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.access-panel select,
.access-panel textarea {
  border-color: #aebfc2;
  background: #fffdf8;
}

.compact-shell input::placeholder,
.compact-shell textarea::placeholder,
.access-panel input::placeholder,
.access-panel textarea::placeholder {
  color: #5b7480;
  opacity: 1;
}

.compact-shell input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.compact-shell select:focus,
.compact-shell textarea:focus,
.access-panel input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus {
  background: #fff;
}

/* Chat: explicit foregrounds prevent light-on-light and dark-on-dark text. */
.chat-card {
  border-color: rgba(213, 232, 231, .92);
  background: #e9f1f0;
}

.chat-header {
  background: linear-gradient(115deg, #073f3e 0%, #0a5553 60%, #176faf 135%);
}

.chat-header strong {
  color: #ffffff;
}

.chat-header span {
  color: #c9e4e2;
}

.chat-close {
  border: 1px solid rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .13);
  color: #ffffff;
}

.chat-close:hover {
  background: rgba(255, 255, 255, .21);
}

.chat-pdf-btn {
  border-color: rgba(255, 255, 255, .58);
  background: #f7fbfa;
  color: #073f3e;
}

.chat-pdf-btn:hover {
  border-color: #ffffff;
  background: #ffffff;
  color: #042f31;
}

.chat-thread {
  background:
    radial-gradient(circle at 92% 8%, rgba(23, 111, 175, .08), transparent 17rem),
    linear-gradient(180deg, #e3edec, #dce8e7);
}

.chat-message.own .chat-bubble {
  border-color: #0e558f;
  background: linear-gradient(145deg, #1b78b9, #12599a);
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(18, 89, 154, .20);
}

.chat-message.own .chat-bubble strong,
.chat-message.own .chat-bubble p {
  color: #ffffff;
  opacity: 1;
}

.chat-message.own .chat-bubble span {
  color: #e3f2ff;
  opacity: .92;
}

.chat-message.other .chat-bubble {
  border-color: #c5d5d5;
  background: #f8fbfa;
  color: #102c3b;
}

.chat-message.other .chat-bubble strong,
.chat-message.other .chat-bubble p {
  color: #102c3b;
}

.chat-message.other .chat-bubble span {
  color: #526a77;
  opacity: 1;
}

.chat-compose {
  border-top-color: #c5d5d5;
  background: #edf4f3;
}

.chat-compose textarea {
  border-color: #9eb5b7;
  background: #fffdf8;
  color: #0a1f2b;
}

.chat-compose textarea::placeholder {
  color: #5b7480;
}

.chat-attachment-picker {
  border-color: #b9cbcd;
  background: #e3ecec;
}

.chat-compose-actions span,
.chat-upload-status {
  color: #455f6e;
}

/* Center the full Status control group vertically in each shipment row. */
.admin-table td.admin-status-cell {
  vertical-align: middle !important;
}

.admin-status-cell .status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding-block: 2px;
  line-height: 1;
}

/* Restore comfortable space for ten-character Trip numbers. */
.admin-table td.admin-trip-cell {
  padding-right: 2px;
  padding-left: 2px;
}

.admin-table .admin-trip-cell .trip-input {
  box-sizing: border-box;
  padding-right: 3px;
  padding-left: 3px;
  font-size: clamp(9px, 1vw, 10.5px);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
}

@media (min-width: 821px) {
  .admin-table:not(.admin-quote-table) th:nth-child(1),
  .admin-table:not(.admin-quote-table) td:nth-child(1) { width: 4.9% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(2),
  .admin-table:not(.admin-quote-table) td:nth-child(2) { width: 8% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(3),
  .admin-table:not(.admin-quote-table) td:nth-child(3) { width: 9% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(4),
  .admin-table:not(.admin-quote-table) td:nth-child(4) { width: 10.6% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(5),
  .admin-table:not(.admin-quote-table) td:nth-child(5),
  .admin-table:not(.admin-quote-table) th:nth-child(6),
  .admin-table:not(.admin-quote-table) td:nth-child(6) { width: 13.1% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(7),
  .admin-table:not(.admin-quote-table) td:nth-child(7) { width: 8.3% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(8),
  .admin-table:not(.admin-quote-table) td:nth-child(8) { width: 10% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(9),
  .admin-table:not(.admin-quote-table) td:nth-child(9) { width: 13% !important; }

  .admin-table:not(.admin-quote-table) th:nth-child(10),
  .admin-table:not(.admin-quote-table) td:nth-child(10) { width: 10% !important; }
}

/* The Docs count returns to a compact numeric indicator. */
.mini-docs .doc-count-badge {
  width: auto;
  min-width: 15px;
  height: 15px;
  min-height: 15px;
  padding: 0 4px;
  border: 0;
  font-size: 8px;
  line-height: 1;
}

.client-table .mini-docs .doc-count-badge {
  min-width: 13px;
  height: 13px;
  min-height: 13px;
  padding: 0 3px;
  font-size: 7px;
}

.access-panel,
.portal-home-card {
  background: #f8fbfa;
}

@media (max-width: 820px) {
  .compact-table tbody tr {
    background: #f7faf9;
  }

  .compact-table td,
  .compact-table tr:nth-child(even) td,
  .compact-table tr.row-complete td {
    border-bottom-color: #d2dfdf;
    background: #f7faf9;
  }
}

@media (forced-colors: active) {
  .chat-message.own .chat-bubble,
  .chat-message.other .chat-bubble {
    border: 1px solid CanvasText;
    background: Canvas;
    color: CanvasText;
  }

  .chat-message.own .chat-bubble :is(strong, p, span),
  .chat-message.other .chat-bubble :is(strong, p, span) {
    color: CanvasText;
  }
}