@import "tailwindcss" source(none);
@config "./tailwind.config.js";
@source "./app";
@source "./components";
@source "./core";
@source "./hooks";
@source "./modules";
@source "./services";
@source "./shared";
@source "./stores";
@source "./theme";
@source "./index.tsx";
@source "./landing-entry.tsx";
@source "./index.html";

/* ===== App-specific global styles (not needed on landing page) ===== */

/* Timesheet Grid Styles */
.ts-grid {
  --col-emp: 250px;
  --col-day: 56px;
  --row-h: 52px;
  --header-h: 48px;
  position: relative;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  overflow: hidden;
}
.ts-grid__header-wrapper { position: sticky; top: 0; z-index: 2; }
.ts-grid__header { display: flex; background-color: var(--surface-subtle); }
.ts-grid__header__emp { width: var(--col-emp); min-width: var(--col-emp); height: var(--header-h); display: flex; align-items: center; padding: 0 12px; font-weight: 600; border-right: 1px solid var(--border); }
.ts-grid__header__days { overflow-x: hidden; flex-grow: 1; }
.ts-grid__header__days-inner { display: flex; }
.ts-grid__header__day { width: var(--col-day); min-width: var(--col-day); display: flex; flex-direction: column; align-items: center; justify-content: center; height: var(--header-h); font-weight: 500; border-left: 1px solid var(--border); font-size: 0.875rem; }
.ts-grid__body { position: relative; overflow-x: auto; }
.ts-grid__table { border-collapse: collapse; }
.ts-grid__table td { height: var(--row-h); border-bottom: 1px solid var(--border); text-align: center; vertical-align: middle; padding: 0; }
.ts-grid__table tr:last-child td { border-bottom: none; }
.ts-grid__table-emp-cell { position: sticky; left: 0; z-index: 1; width: var(--col-emp); padding: 0 12px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-right: 1px solid var(--border); background: var(--surface); }
.ts-grid__table-day-cell { width: var(--col-day); min-width: var(--col-day); border-left: 1px solid var(--border); }

/* Files Library */
.files-wrapper { display: grid; grid-template-columns: 260px 1fr; gap: 16px; }
@media (max-width: 1024px) { .files-wrapper { grid-template-columns: 1fr; } }
.files-leftCol { position: sticky; top: 1.5rem; align-self: start; }
.files-rightCol { min-height: 400px; }
.files-filtersBar { display: flex; flex-direction: column; gap: 12px; }
.files-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.files-chip { padding: 4px 10px; border: 1px solid var(--border); border-radius: 9999px; cursor: pointer; font-size: 0.875rem; transition: all 0.2s; }
.files-chip:hover { border-color: var(--primary-500); }
.files-chipActive { background: var(--primary-100); border-color: var(--primary-500); color: var(--primary-700); font-weight: 500; }
.files-badge { font-size: 12px; padding: 2px 6px; border-radius: 4px; border: 1px solid transparent; font-weight: 500; }
.files-badgeWarn { background: #fff7ed; border-color: #fed7aa; color: #9a3412; }
.dark .files-badgeWarn { background: #78350f20; border-color: #78350f80; color: #fde68a; }
.files-badgeDanger { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.dark .files-badgeDanger { background: #7f1d1d20; border-color: #7f1d1d80; color: #fca5a5; }

/* File List */
.file-list-tableContainer { overflow-x: auto; }
.file-list-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; min-width: 1000px; table-layout: fixed; }
.file-list-table th, .file-list-table td { padding: 0.75rem 1rem; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
.file-list-table thead { background-color: var(--surface-subtle); }
.file-list-table th { font-weight: 600; color: var(--text-m); }
.file-list-table tbody tr:hover { background-color: var(--surface-subtle); }
.file-list-selectedRow { background-color: var(--primary-100) !important; }
.file-list-loading, .file-list-empty { text-align: center; padding: 4rem 2rem; color: var(--text-m); }
.file-list-checkboxCell { width: 4rem; padding: 0 1rem; }
.file-list-nameCell { font-weight: 500; color: var(--text-h); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.file-list-actionsCell { text-align: right; width: 5rem; }
.file-list-tagGroup { display: flex; gap: 0.25rem; align-items: center; flex-wrap: wrap; }
.file-list-tag { display: inline-block; background-color: var(--surface-subtle); border: 1px solid var(--border); padding: 0.125rem 0.5rem; border-radius: 999px; font-size: 0.75rem; }

/* Smart Folders */
.smart-folders-container { display: flex; flex-direction: column; gap: 0.25rem; }
.smart-folders-folderItem { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0.75rem; border-radius: 0.5rem; font-size: 0.875rem; font-weight: 500; color: var(--text-b); text-align: left; width: 100%; cursor: pointer; background: transparent; border: none; transition: background-color 0.2s, color 0.2s; }
.smart-folders-folderItem:hover { background-color: var(--surface-subtle); }
.smart-folders-active { background-color: var(--primary-100); color: var(--primary-700); font-weight: 600; }
.dark .smart-folders-active { background-color: var(--dark-primary-100); color: var(--dark-primary-500); }
.smart-folders-icon { width: 1.25rem; height: 1.25rem; flex-shrink: 0; opacity: 0.7; }
.smart-folders-active .smart-folders-icon { opacity: 1; }
.smart-folders-label { flex-grow: 1; }
.smart-folders-separator { margin: 0.5rem 0.75rem; border-color: var(--border); border-top-width: 1px; }

/* HR Quick Check */
.hr-check-title { font-size: 1rem; font-weight: 600; margin-bottom: 0.75rem; color: var(--text-h); }
.hr-check-form { display: flex; gap: 0.5rem; align-items: center; }
.hr-check-results { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.hr-check-resultsTitleError { font-weight: 600; color: var(--error); margin-bottom: 0.75rem; }
.hr-check-resultsTitleSuccess { font-weight: 600; color: var(--success); }
.hr-check-tagList { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.hr-check-missingTag { background-color: var(--error-100, #fee2e2); color: var(--error-800, #991b1b); padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.875rem; font-weight: 500; border: 1px solid var(--error-200, #fecaca); cursor: pointer; transition: background-color 0.2s; }
.hr-check-missingTag:hover { background-color: var(--error-200, #fecaca); }
.dark .hr-check-missingTag { background-color: #7f1d1d20; border-color: #7f1d1d80; color: #fca5a5; }

/* Upload Modal */
.upload-modal-container { display: flex; flex-direction: column; gap: 1rem; }
.upload-modal-dropzone { border: 2px dashed var(--border); border-radius: 0.75rem; padding: 2rem; text-align: center; color: var(--text-m); transition: all 0.2s ease-in-out; cursor: pointer; position: relative; }
.upload-modal-dropzone:hover { border-color: var(--primary-500); background-color: var(--surface-subtle); }
.upload-modal-dragging { border-color: var(--primary-600); background-color: var(--primary-100); }
.upload-modal-fileInput { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.upload-modal-fileList { max-height: 120px; overflow-y: auto; background-color: var(--surface-subtle); border-radius: 0.5rem; padding: 0.5rem; border: 1px solid var(--border); }
.upload-modal-fileItem { padding: 0.25rem 0.5rem; font-size: 0.875rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.upload-modal-formGrid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 640px) { .upload-modal-formGrid { grid-template-columns: 1fr 1fr; } }
.upload-modal-tagContainer { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; }
.upload-modal-tag { display: inline-flex; align-items: center; background-color: var(--primary-100); color: var(--primary-700); padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.875rem; font-weight: 500; }
.upload-modal-tag button { margin-left: 0.5rem; background: transparent; border: none; cursor: pointer; color: inherit; opacity: 0.7; }
.upload-modal-tag button:hover { opacity: 1; }
.upload-modal-footer { display: flex; justify-content: flex-end; gap: 0.5rem; padding-top: 1rem; margin-top: 1rem; border-top: 1px solid var(--border); }

/* Bulk Actions Toolbar */
.bulk-actions-toolbar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 40; background-color: var(--surface); border-top: 1px solid var(--border); box-shadow: 0 -4px 12px rgba(0,0,0,0.05); }
@media (min-width: 768px) { .bulk-actions-toolbar { left: 256px; } }
.bulk-actions-content { max-width: 1280px; margin: 0 auto; padding: 0.75rem 2rem; display: flex; justify-content: space-between; align-items: center; }
.bulk-actions-countLabel { font-weight: 500; color: var(--text-b); }
.bulk-actions-actions { display: flex; align-items: center; gap: 0.5rem; }

/* Share Modal */
.share-modal-container { display: flex; flex-direction: column; gap: 1.5rem; }
.share-modal-description { font-size: 0.875rem; color: var(--text-m); }
.share-modal-form { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 640px) { .share-modal-form { grid-template-columns: repeat(2, 1fr) auto; align-items: flex-end; } }
.share-modal-createdLink { display: flex; gap: 0.5rem; align-items: center; background: var(--surface-subtle); padding: 0.75rem; border-radius: 0.5rem; }
.share-modal-pastShares { margin-top: 1rem; }
.share-modal-pastSharesTitle { font-weight: 600; margin-bottom: 0.5rem; }
.share-modal-tableWrapper { max-height: 200px; overflow-y: auto; border: 1px solid var(--border); border-radius: 0.5rem; }
.share-modal-table { width: 100%; font-size: 0.875rem; border-collapse: collapse; }
.share-modal-table th, .share-modal-table td { padding: 0.5rem 0.75rem; text-align: left; border-bottom: 1px solid var(--border); }
.share-modal-table th { font-weight: 500; color: var(--text-m); }
.share-modal-table tr:last-child td { border-bottom: none; }
.share-modal-actionsCell { text-align: right; width: 1%; white-space: nowrap; }
.share-modal-status { padding: 0.125rem 0.5rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 500; }
.share-modal-active { background-color: var(--success-100, #dcfce7); color: var(--success-800, #166534); }
.dark .share-modal-active { background-color: #16653450; color: #bbf7d0; }
.share-modal-revoked { background-color: #f3f4f6; color: #4b5563; }
.dark .share-modal-revoked { background-color: #374151; color: #d1d5db; }

/* Recent Activity */
.recent-activity-container { background-color: var(--surface); border: 1px solid var(--border); border-radius: 1rem; padding: 1rem; }
.recent-activity-title { font-size: 1.125rem; font-weight: 600; margin-bottom: 1rem; color: var(--text-h); }
.recent-activity-list { list-style: none; padding: 0; margin: 0; max-height: 300px; overflow-y: auto; }
.recent-activity-item { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.75rem 0; border-bottom: 1px solid var(--surface-subtle); }
.recent-activity-item:last-child { border-bottom: none; }
.recent-activity-iconWrapper { flex-shrink: 0; width: 2.25rem; height: 2.25rem; border-radius: 9999px; background-color: var(--surface-subtle); display: flex; align-items: center; justify-content: center; }
.recent-activity-icon { width: 1.25rem; height: 1.25rem; color: var(--text-m); }
.recent-activity-content { flex-grow: 1; }
.recent-activity-text { font-size: 0.875rem; font-weight: 500; color: var(--text-b); }
.recent-activity-time { font-size: 0.75rem; color: var(--text-m); }
.recent-activity-empty { text-align: center; padding: 2rem 1rem; color: var(--text-m); }

/* Print Styles */
.quote-rich-text img {
  display: inline-block;
  max-width: 100%;
  max-height: 248mm;
  height: auto;
  object-fit: contain;
  vertical-align: top;
}
.quote-rich-text :is(figure, p:has(> img), li:has(> img)) {
  break-inside: avoid;
  page-break-inside: avoid;
}
.quote-rich-text :is(p, li, a, h2, h3),
.quote-preview-page {
  overflow-wrap: anywhere;
}
.quote-preview-page img[data-quote-image-state="error"] {
  display: none !important;
}
.quote-page-watermark {
  inset: 0;
  pointer-events: none;
  z-index: 10;
}
.quote-notes-card {
  box-sizing: border-box;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  box-shadow: inset 0 0 0 1px var(--pdf-border, #e5e7eb);
}
.quote-notes-card-compact {
  padding: 6px 12px;
}
.quote-notes-print { display: none; }
.quote-print-source {
  position: fixed;
  top: 0;
  left: -20000px;
  width: 794px;
  pointer-events: none;
}
.quote-paged-preview {
  width: 794px;
}
.quote-paged-preview .pagedjs_pages {
  display: flex;
  width: 794px;
  flex-direction: column;
  align-items: stretch;
  gap: 24px;
}
.quote-paged-preview .pagedjs_page {
  margin: 0 !important;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
  outline: 1px solid rgba(203, 213, 225, 0.75);
}
.quote-paged-preview .pagedjs_quote_page {
  --pagedjs-width: 210mm !important;
  --pagedjs-height: 297mm !important;
  --pagedjs-pagebox-width: 210mm !important;
  --pagedjs-pagebox-height: 297mm !important;
  --pagedjs-margin-right: 0mm !important;
  --pagedjs-margin-bottom: 12mm !important;
  --pagedjs-margin-left: 0mm !important;
  width: 210mm !important;
  height: 297mm !important;
}
.quote-paged-preview .pagedjs_quote_page > .pagedjs_sheet {
  width: 210mm !important;
  height: 297mm !important;
}
.quote-paged-preview .pagedjs_quote_page:not(.pagedjs_quote_first_page) {
  --pagedjs-margin-top: 8mm !important;
}
.quote-paged-preview .pagedjs_quote_first_page {
  --pagedjs-margin-top: 0mm !important;
}
.quote-paged-preview .quote-preview-page {
  width: auto !important;
  min-height: 0 !important;
}
.quote-paged-preview .quote-notes-screen {
  display: none !important;
}
.quote-paged-preview .quote-notes-print {
  display: contents !important;
}
[contenteditable].quote-rich-text img { cursor: pointer; }
[contenteditable].quote-rich-text img.rich-text-image-selected {
  outline: 2px solid var(--primary-500);
  outline-offset: 2px;
}

/* The shared quote page swaps the A4 sheet for a responsive rendering below
   `lg`, because the sheet only fits a phone at ~41% scale. Printing still needs
   the real sheet, so this hides it on screen and leaves print untouched — a
   Tailwind `hidden lg:block` would have hidden it from the printer too. */
@media screen and (max-width: 1023px) {
  .shared-quote-sheet { display: none; }
}

@media print {
  body * { visibility: hidden; }
  .printable-area, .printable-area * { visibility: visible; }
  .printable-area { position: absolute; left: 0; top: 0; width: 100%; margin: 0; padding: 0; }
  html:has(.quote-preview-stage),
  body:has(.quote-preview-stage) {
    page: quote;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
  }
  body:has(.quote-preview-stage) *:has(.quote-preview-stage) {
    position: static !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: none !important;
  }
  .quote-preview-stage {
    page: quote;
    position: absolute !important;
    inset: 0 auto auto 0 !important;
    width: 210mm !important;
    max-width: 210mm !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
  .quote-print-source {
    position: static !important;
    width: 210mm !important;
    pointer-events: auto;
  }
  .quote-preview-scale-frame,
  .quote-preview-scaled-page {
    display: block !important;
    width: 210mm !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .quote-preview-page {
    page: quote;
    box-sizing: border-box !important;
    width: 210mm !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    transform: none !important;
    transform-origin: top left !important;
  }
  .quote-notes-flow,
  .quote-notes-fragment,
  .quote-notes-fragment .quote-rich-text {
    break-inside: auto !important;
    page-break-inside: auto !important;
  }
  .quote-notes-screen {
    display: none !important;
  }
  .quote-notes-print {
    display: contents !important;
  }
  .quote-notes-page-break {
    break-before: page !important;
    page-break-before: always !important;
  }
  .quote-notes-flow {
    display: block !important;
  }
  .quote-notes-flow > * + * {
    margin-top: 6pt !important;
  }
  .quote-notes-fragment {
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
  }
  .quote-notes-fragment > h4,
  .quote-notes-fragment > h5,
  .quote-notes-fragment .quote-rich-text h2,
  .quote-notes-fragment .quote-rich-text h3 {
    break-after: avoid;
    page-break-after: avoid;
  }
  .quote-notes-fragment .quote-rich-text img {
    max-height: 248mm !important;
    object-fit: contain;
    break-inside: avoid;
    page-break-inside: avoid;
  }
  .quote-print-source .quote-page-decoration:not(.qs-stripe) {
    position: fixed !important;
  }
  .quote-page-watermark {
    inset: 0;
    pointer-events: none;
    z-index: 10;
  }
  .quote-print-footer {
    display: none !important;
  }
  .no-print { display: none !important; }
  body { background-color: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .print-friendly { box-shadow: none !important; border: none !important; background-color: #fff !important; }
  .print-monochrome,
  .print-monochrome * { color: #000 !important; }
  .quote-print-preserve-colors,
  .quote-print-preserve-colors * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    forced-color-adjust: none;
  }
  .watermark-print { opacity: 0.08 !important; }
  thead { display: table-header-group; }
  .card-print-break-avoid { page-break-inside: avoid; }
  tr, td, th, .item-row { page-break-inside: avoid; }
  tr[data-quote-oversized="true"],
  tr[data-quote-oversized="true"] > td,
  tr[data-quote-oversized="true"] > th {
    break-inside: auto !important;
    page-break-inside: auto !important;
  }
  .employee-ledger-printable { font-family: Arial, sans-serif; color: #000; background-color: #fff; padding: 20mm; }
  .employee-ledger-printable .ledger-header { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 2px solid #333; padding-bottom: 1rem; margin-bottom: 1.5rem; }
  .employee-ledger-printable .company-info h1 { font-size: 1.5rem; font-weight: bold; margin: 0; }
  .employee-ledger-printable .company-info p { font-size: 0.9rem; margin: 0; color: #555; }
  .employee-ledger-printable .report-info { text-align: right; }
  .employee-ledger-printable .report-info h2 { font-size: 1.2rem; font-weight: bold; margin: 0; }
  .employee-ledger-printable .report-info p { font-size: 0.9rem; margin: 2px 0; color: #555; }
  .employee-ledger-printable .ledger-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
  .employee-ledger-printable .ledger-table th, .employee-ledger-printable .ledger-table td { border: 1px solid #ddd; padding: 0.5rem; text-align: left; }
  .employee-ledger-printable .ledger-table th { background-color: #f2f2f2; font-weight: bold; }
  .employee-ledger-printable .ledger-table .text-right { text-align: right; }
  .employee-ledger-printable .ledger-summary { margin-top: 1.5rem; padding-top: 1rem; border-top: 2px solid #333; display: flex; justify-content: flex-end; }
  .employee-ledger-printable .ledger-summary table { width: 300px; font-size: 1rem; }
  .employee-ledger-printable .ledger-summary td:first-child { text-align: right; padding-right: 1rem; color: #555; }
  .employee-ledger-printable .ledger-summary td:last-child { text-align: right; font-weight: bold; }
  .employee-ledger-printable .ledger-summary .balance-row td { font-size: 1.2rem; padding-top: 0.5rem; border-top: 1px solid #ccc; }
  .customer-ledger-printable { font-family: Arial, sans-serif; color: #000; background-color: #fff; padding: 20mm; }
  .customer-ledger-printable .ledger-header { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 2px solid #333; padding-bottom: 1rem; margin-bottom: 1.5rem; }
  .customer-ledger-printable .company-info h1 { font-size: 1.5rem; font-weight: bold; margin: 0; }
  .customer-ledger-printable .company-info p { font-size: 0.9rem; margin: 0; color: #555; }
  .customer-ledger-printable .report-info { text-align: right; }
  .customer-ledger-printable .report-info h2 { font-size: 1.2rem; font-weight: bold; margin: 0; }
  .customer-ledger-printable .report-info p { font-size: 0.9rem; margin: 2px 0; color: #555; }
  .customer-ledger-printable .ledger-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
  .customer-ledger-printable .ledger-table th, .customer-ledger-printable .ledger-table td { border: 1px solid #ddd; padding: 0.5rem; text-align: left; }
  .customer-ledger-printable .ledger-table th { background-color: #f2f2f2; font-weight: bold; }
  .customer-ledger-printable .ledger-table .text-right { text-align: right; }
  .customer-ledger-printable .ledger-summary { margin-top: 1.5rem; padding-top: 1rem; border-top: 2px solid #333; display: flex; justify-content: flex-end; }
  .customer-ledger-printable .ledger-summary table { width: 300px; font-size: 1rem; }
  .customer-ledger-printable .ledger-summary td:first-child { text-align: right; padding-right: 1rem; color: #555; }
  .customer-ledger-printable .ledger-summary td:last-child { text-align: right; font-weight: bold; }
  .customer-ledger-printable .ledger-summary .balance-row td { font-size: 1.2rem; padding-top: 0.5rem; border-top: 1px solid #ccc; }
}
@page { size: A4; margin: 12mm; }
@page quote { size: A4 portrait; margin: 0; }
.is-exporting .recharts-tooltip-wrapper, .is-exporting .recharts-legend { display: none !important; }
.is-exporting .recharts-surface { animation: none !important; transition: none !important; }
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* ===== End app-specific styles ===== */

@layer base {
  html {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  body {
    background-color: var(--bg);
    color: var(--text-b);
  }

  ::selection {
    background: rgba(59, 130, 246, 0.20);
    color: inherit;
  }

  :focus-visible {
    outline: none;
  }

  button:not(:disabled),
  [role="button"]:not([aria-disabled="true"]) {
    cursor: pointer;
  }

  button:disabled,
  [role="button"][aria-disabled="true"] {
    cursor: not-allowed;
  }

  .overflow-x-auto,
  .overflow-auto {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  .overflow-x-auto > table,
  .overflow-auto > table {
    width: max-content;
    min-width: 100%;
  }

  .overflow-x-auto > table th,
  .overflow-x-auto > table td,
  .overflow-auto > table th,
  .overflow-auto > table td {
    vertical-align: middle;
  }
}

.tq-app-canvas {
  background-image: none;
}

.dark .tq-app-canvas {
  background-image: none;
}

* {
  scrollbar-width: thin;
  scrollbar-color: rgba(100, 116, 139, 0.34) transparent;
}

*::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

*::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgba(100, 116, 139, 0.34);
  background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
  background: rgba(71, 85, 105, 0.52);
  background-clip: padding-box;
}

.tq-skeleton-shimmer::after {
  position: absolute;
  inset: 0;
  content: '';
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.62), transparent);
  animation: tq-shimmer 1.7s ease-in-out infinite;
}

.dark .tq-skeleton-shimmer::after {
  background: linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.12), transparent);
}

@keyframes tq-shimmer {
  100% { transform: translateX(100%); }
}

/* ===== Print stylesheet =====
 * Hides chrome (sidebar, toaster, action bars, palette) so summary/profit pages
 * print cleanly. Charts and tables expand to full width.
 */
@media print {
  body {
    background: #fff !important;
    color: #000 !important;
  }
  .print\:hidden,
  nav,
  body:not(:has(.quote-preview-stage)) aside,
  [data-print-hide],
  [role="navigation"] {
    display: none !important;
  }
  main, .print-area {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  button {
    display: none !important;
  }
  .print-keep button {
    display: inline-flex !important;
  }
  table {
    page-break-inside: auto;
    break-inside: auto;
  }
  thead {
    display: table-header-group;
  }
  tr {
    page-break-inside: avoid;
    break-inside: avoid;
  }
  .recharts-wrapper {
    page-break-inside: avoid;
    break-inside: avoid;
  }
}

/* ===== Marketplace KPI gradient backdrop =====
 * Subtle gradient used by KPI cards on dashboard / cockpit pages.
 */
.mos-kpi-gradient {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.04) 0%, rgba(16, 185, 129, 0.04) 100%);
}
.dark .mos-kpi-gradient {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.10) 0%, rgba(16, 185, 129, 0.10) 100%);
}

/* ===== Sheet / dialog motion =====
 * Used by BottomSheet (slideUp) and overlay backdrops (fadeIn).
 */
@keyframes mos-slideUp {
  from { transform: translateY(8%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
@keyframes mos-fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.animate-slideUp { animation: mos-slideUp 220ms cubic-bezier(0.22, 1, 0.36, 1); }
.animate-fadeIn  { animation: mos-fadeIn 180ms ease-out; }

@media (prefers-reduced-motion: reduce) {
  .animate-slideUp,
  .animate-fadeIn,
  .tq-skeleton-shimmer::after { animation: none; }
}