/* Offer Editor Styles */

/* Trix editor container - scrollable with sticky toolbar */
.trix-editor-container {
  margin-top: 0.5rem;
  max-height: 70vh;
  overflow-y: auto;
  border: 1px solid var(--border-primary);
  border-radius: var(--radius-md);
  background-color: var(--surface-secondary);
}

.trix-editor-container trix-editor {
  min-height: 400px;
  background-color: var(--surface-secondary);
  border: none;
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  padding: 1rem;
  color: var(--text-primary);
}

.trix-editor-container trix-editor:focus {
  outline: none;
}

/* Heading styles in editor */
.trix-editor-container trix-editor h1 {
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-copper-light);
  margin: 1rem 0 0.5rem 0;
}

.trix-editor-container trix-editor h2 {
  font-family: var(--font-display);
  font-size: 1.375rem;
  font-weight: 600;
  color: var(--color-copper-light);
  margin: 0.875rem 0 0.5rem 0;
}

.trix-editor-container trix-editor h3 {
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--color-copper-light);
  margin: 0.75rem 0 0.375rem 0;
}

.trix-editor-container trix-editor blockquote {
  border-left: 3px solid var(--color-copper-light);
  padding-left: 1rem;
  margin: 1rem 0;
  color: var(--text-muted);
  font-style: italic;
}

.trix-editor-container trix-editor ul,
.trix-editor-container trix-editor ol {
  margin: 0.5rem 0;
  padding-left: 1.5rem;
}

.trix-editor-container trix-editor li {
  margin: 0.25rem 0;
}

/* Trix toolbar styling for dark theme */
.trix-editor-container trix-toolbar {
  position: sticky;
  top: 0;
  z-index: 100;
  background-color: #1a1f26;
  border-bottom: 1px solid var(--border-primary);
  padding: 0.75rem;
  opacity: 0;
  transition: opacity 0.15s ease;
}

/* Estimate insert button in toolbar */
.btn-estimate-insert {
  margin-left: auto;
}

.trix-editor-container.toolbar-ready trix-toolbar {
  opacity: 1;
}

.trix-editor-container trix-toolbar .trix-button-row {
  flex-wrap: wrap;
  gap: 0.5rem;
}

.trix-editor-container trix-toolbar .trix-button-group {
  display: flex;
  gap: 0;
  border: 1px solid var(--border-secondary);
  border-radius: var(--radius-sm);
  margin: 0;
  background: var(--surface-tertiary);
}

.trix-editor-container trix-toolbar .trix-button {
  position: relative;
  background-color: transparent;
  border: none;
  border-left: 1px solid var(--border-secondary);
  color: var(--text-secondary);
  padding: 0.375rem;
  width: 2rem;
  height: 2rem;
}

.trix-editor-container trix-toolbar .trix-button:first-child {
  border-left: none;
}

.trix-editor-container trix-toolbar .trix-button:hover {
  background-color: var(--surface-primary);
  color: var(--text-primary);
}

.trix-editor-container trix-toolbar .trix-button.trix-active {
  background-color: var(--accent-primary);
  color: white;
}

/* Make button icons visible in dark theme */
.trix-editor-container trix-toolbar .trix-button--icon::before {
  filter: invert(0.7);
  opacity: 1;
}

.trix-editor-container trix-toolbar .trix-button--icon:hover::before {
  filter: invert(0.9);
}

.trix-editor-container trix-toolbar .trix-button--icon.trix-active::before {
  filter: invert(1);
}

/* Hide indent/outdent buttons */
.trix-editor-container trix-toolbar .trix-button--icon-increase-nesting-level,
.trix-editor-container trix-toolbar .trix-button--icon-decrease-nesting-level {
  display: none;
}

/* Hide link and code buttons */
.trix-editor-container trix-toolbar .trix-button--icon-link,
.trix-editor-container trix-toolbar .trix-button--icon-code {
  display: none;
}

/* Lucide icons for consistent toolbar styling */
/* Heading icons scaled up to match visual weight of other icons */
.trix-editor-container trix-toolbar .trix-button--icon-heading-h1::before,
.trix-editor-container trix-toolbar .trix-button--icon-heading-h2::before,
.trix-editor-container trix-toolbar .trix-button--icon-heading-h3::before {
  background-size: 115%;
}

.trix-editor-container trix-toolbar .trix-button--icon-heading-h1::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h8'/%3E%3Cpath d='M4 18V6'/%3E%3Cpath d='M12 18V6'/%3E%3Cpath d='m17 12 3-2v8'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-heading-h2::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h8'/%3E%3Cpath d='M4 18V6'/%3E%3Cpath d='M12 18V6'/%3E%3Cpath d='M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-heading-h3::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h8'/%3E%3Cpath d='M4 18V6'/%3E%3Cpath d='M12 18V6'/%3E%3Cpath d='M17.5 10.5c1.7-1 3.5 0 3.5 1.5a2 2 0 0 1-2 2'/%3E%3Cpath d='M17 17.5c2 1.5 4 .3 4-1.5a2 2 0 0 0-2-2'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-bold::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-italic::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='19' x2='10' y1='4' y2='4'/%3E%3Cline x1='14' x2='5' y1='20' y2='20'/%3E%3Cline x1='15' x2='9' y1='4' y2='20'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-strike::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 4H9a3 3 0 0 0-2.83 4'/%3E%3Cpath d='M14 12a4 4 0 0 1 0 8H6'/%3E%3Cline x1='4' x2='20' y1='12' y2='12'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-quote::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 5H3'/%3E%3Cpath d='M21 12H8'/%3E%3Cpath d='M21 19H8'/%3E%3Cpath d='M3 12v7'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-bullet-list::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5h.01'/%3E%3Cpath d='M3 12h.01'/%3E%3Cpath d='M3 19h.01'/%3E%3Cpath d='M8 5h13'/%3E%3Cpath d='M8 12h13'/%3E%3Cpath d='M8 19h13'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-number-list::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 5h10'/%3E%3Cpath d='M11 12h10'/%3E%3Cpath d='M11 19h10'/%3E%3Cpath d='M4 4h1v5'/%3E%3Cpath d='M4 9h2'/%3E%3Cpath d='M6.5 20H3.4c0-1 2.6-1.925 2.6-3.5a1.5 1.5 0 0 0-2.6-1.02'/%3E%3C/svg%3E");
}

.trix-editor-container trix-toolbar .trix-button--icon-attach::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551'/%3E%3C/svg%3E");
}

/* Dialog styling for dark theme */
.trix-editor-container trix-toolbar .trix-dialog {
  background: var(--surface-secondary);
  border: 1px solid var(--border-primary);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

.trix-editor-container trix-toolbar .trix-input--dialog {
  background: var(--surface-primary);
  border: 1px solid var(--border-primary);
  color: var(--text-primary);
  border-radius: var(--radius-sm);
}

.trix-editor-container trix-toolbar .trix-button--dialog {
  background: var(--accent-primary);
  color: white;
  border-radius: var(--radius-sm);
  padding: 0.5rem 1rem;
}

/* ==========================================================================
   Estimate Table - Minimalist Document Style
   Matches text document typography, simple dividers only
   Used in both editor and PDF export

   Selectors target:
   - .estimate-inserted-table (class-based)
   - trix-editor table, .trix-content table (ActionText contexts)
   ========================================================================== */

.estimate-table-embed,
trix-editor .estimate-table-embed,
.trix-content .estimate-table-embed {
  margin: 1.5rem 0;
}

.estimate-inserted-table,
trix-editor table,
.trix-content table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

/* Base cell styles - matches document text */
.estimate-inserted-table th,
.estimate-inserted-table td,
trix-editor table th,
trix-editor table td,
.trix-content table th,
.trix-content table td {
  padding: 0.625rem 0;
  text-align: left;
  font-family: var(--font-body);
  font-size: 0.9375rem;
  color: var(--text-secondary);
  vertical-align: top;
  border: none;
}

/* Column widths */
.estimate-inserted-table th:nth-child(1),
.estimate-inserted-table td:nth-child(1),
trix-editor table th:nth-child(1),
trix-editor table td:nth-child(1),
.trix-content table th:nth-child(1),
.trix-content table td:nth-child(1) { width: 40%; padding-right: 1rem; }

.estimate-inserted-table th:nth-child(2),
.estimate-inserted-table td:nth-child(2),
trix-editor table th:nth-child(2),
trix-editor table td:nth-child(2),
.trix-content table th:nth-child(2),
.trix-content table td:nth-child(2) { width: 12%; }

.estimate-inserted-table th:nth-child(3),
.estimate-inserted-table td:nth-child(3),
trix-editor table th:nth-child(3),
trix-editor table td:nth-child(3),
.trix-content table th:nth-child(3),
.trix-content table td:nth-child(3) { width: 10%; }

.estimate-inserted-table th:nth-child(4),
.estimate-inserted-table td:nth-child(4),
trix-editor table th:nth-child(4),
trix-editor table td:nth-child(4),
.trix-content table th:nth-child(4),
.trix-content table td:nth-child(4) { width: 18%; }

.estimate-inserted-table th:nth-child(5),
.estimate-inserted-table td:nth-child(5),
trix-editor table th:nth-child(5),
trix-editor table td:nth-child(5),
.trix-content table th:nth-child(5),
.trix-content table td:nth-child(5) { width: 20%; }

/* Header row - uppercase labels with divider below */
.estimate-inserted-table thead tr,
trix-editor table thead tr,
.trix-content table thead tr {
  border-bottom: 1px solid rgba(212, 165, 116, 0.25);
}

.estimate-inserted-table th,
trix-editor table th,
.trix-content table th {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--color-copper-light);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding-bottom: 0.75rem;
}

/* Category header - styled like h3 in document */
.estimate-inserted-table .category-row td,
trix-editor table .category-row td,
.trix-content table .category-row td {
  padding-top: 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(212, 165, 116, 0.15);
}

.estimate-inserted-table .category-row td strong,
trix-editor table .category-row td strong,
.trix-content table .category-row td strong,
.estimate-inserted-table .category-row strong,
trix-editor table .category-row strong,
.trix-content table .category-row strong {
  font-family: var(--font-display);
  color: var(--color-copper-light);
  font-size: 1rem;
  font-weight: 600;
}

/* Regular item rows */
.estimate-inserted-table tbody tr:not(.category-row):not(.subtotal-row) td,
trix-editor table tbody tr:not(.category-row):not(.subtotal-row) td,
.trix-content table tbody tr:not(.category-row):not(.subtotal-row) td {
  padding: 0.5rem 0;
}

/* Subtotal rows - italic with divider */
.estimate-inserted-table .subtotal-row td,
trix-editor table .subtotal-row td,
.trix-content table .subtotal-row td {
  padding-top: 0.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(212, 165, 116, 0.1);
}

.estimate-inserted-table .subtotal-row td em,
trix-editor table .subtotal-row td em,
.trix-content table .subtotal-row td em,
.estimate-inserted-table .subtotal-row em,
trix-editor table .subtotal-row em,
.trix-content table .subtotal-row em {
  color: var(--text-muted);
  font-size: 0.875rem;
}

.estimate-inserted-table .subtotal-row td:last-child,
trix-editor table .subtotal-row td:last-child,
.trix-content table .subtotal-row td:last-child {
  font-weight: 600;
  color: var(--text-primary);
}

/* Footer summary rows */
.estimate-inserted-table tfoot tr td,
trix-editor table tfoot tr td,
.trix-content table tfoot tr td {
  padding: 0.375rem 0;
}

.estimate-inserted-table tfoot tr:first-child td,
trix-editor table tfoot tr:first-child td,
.trix-content table tfoot tr:first-child td {
  padding-top: 1rem;
  border-top: 1px solid rgba(212, 165, 116, 0.2);
}

.estimate-inserted-table tfoot tr td:nth-child(4),
trix-editor table tfoot tr td:nth-child(4),
.trix-content table tfoot tr td:nth-child(4) {
  text-align: right;
  color: var(--text-muted);
  font-size: 0.875rem;
}

.estimate-inserted-table tfoot tr td:last-child,
trix-editor table tfoot tr td:last-child,
.trix-content table tfoot tr td:last-child {
  font-weight: 600;
  color: var(--text-primary);
}

/* Grand total - bold with top divider */
.estimate-inserted-table .grand-total-row td,
trix-editor table .grand-total-row td,
.trix-content table .grand-total-row td {
  padding-top: 0.75rem;
  border-top: 2px solid var(--color-copper-light);
}

.estimate-inserted-table .grand-total-row td:nth-child(4),
trix-editor table .grand-total-row td:nth-child(4),
.trix-content table .grand-total-row td:nth-child(4) {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1rem;
  color: var(--text-primary);
}

.estimate-inserted-table .grand-total-row td:last-child,
trix-editor table .grand-total-row td:last-child,
.trix-content table .grand-total-row td:last-child {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.125rem;
  color: var(--color-copper-light);
}

/* Right-align numeric columns */
.estimate-inserted-table td:nth-child(2),
.estimate-inserted-table td:nth-child(4),
.estimate-inserted-table td:nth-child(5),
.estimate-inserted-table th:nth-child(2),
.estimate-inserted-table th:nth-child(4),
.estimate-inserted-table th:nth-child(5),
trix-editor table td:nth-child(2),
trix-editor table td:nth-child(4),
trix-editor table td:nth-child(5),
trix-editor table th:nth-child(2),
trix-editor table th:nth-child(4),
trix-editor table th:nth-child(5),
.trix-content table td:nth-child(2),
.trix-content table td:nth-child(4),
.trix-content table td:nth-child(5),
.trix-content table th:nth-child(2),
.trix-content table th:nth-child(4),
.trix-content table th:nth-child(5) {
  text-align: right;
}

/* Center align unit column */
.estimate-inserted-table td:nth-child(3),
.estimate-inserted-table th:nth-child(3),
trix-editor table td:nth-child(3),
trix-editor table th:nth-child(3),
.trix-content table td:nth-child(3),
.trix-content table th:nth-child(3) {
  text-align: center;
}

/* Modal for estimate selection */
.modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal.hidden {
  display: none;
}

.modal-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(15, 20, 25, 0.85);
  backdrop-filter: blur(8px);
}

.modal-content {
  position: relative;
  z-index: 9999;
  width: 90%;
  max-width: 500px;
  background: rgba(26, 31, 38, 0.95);
  backdrop-filter: blur(20px);
  border: 2px solid rgba(212, 165, 116, 0.2);
  border-radius: var(--radius-lg);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.6),
    0 0 60px rgba(212, 165, 116, 0.15),
    inset 0 1px 1px rgba(212, 165, 116, 0.1);
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem;
  border-bottom: 1px solid rgba(212, 165, 116, 0.1);
}

.modal-title {
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: #FFFFFF;
  margin: 0;
}

.modal-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: transparent;
  border: 1px solid var(--border-primary);
  border-radius: var(--radius-sm);
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s ease;
}

.modal-close:hover {
  background: var(--surface-tertiary);
  border-color: var(--accent-primary);
  color: var(--text-primary);
}

.modal-close svg {
  width: 16px;
  height: 16px;
}

.modal-body {
  padding: 1.5rem;
}

.estimate-list {
  max-height: 300px;
  overflow-y: auto;
  margin-top: 1rem;
}

.estimate-item {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 0.125rem 1rem;
  width: 100%;
  padding: 0.875rem 1rem;
  background-color: var(--surface-secondary);
  border: 1px solid var(--border-primary);
  border-radius: var(--radius-md);
  margin-bottom: 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease;
  text-align: left;
}

.estimate-item:hover {
  background-color: var(--surface-tertiary);
  border-color: var(--color-copper-light);
}

.estimate-number {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--color-copper-light);
  font-size: 1rem;
  grid-column: 1;
  grid-row: 1;
}

.estimate-client {
  color: var(--text-primary);
  font-size: 0.9375rem;
  grid-column: 1;
  grid-row: 2;
}

.estimate-total {
  color: var(--text-secondary);
  font-size: 0.875rem;
  font-weight: 500;
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
}

/* Helper text classes */
.text-muted {
  color: var(--text-muted);
  font-size: 0.875rem;
}

.text-error {
  color: var(--error);
  font-size: 0.875rem;
}