/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Keep the responsive mobile navigation out of document flow until opened. */
dialog:not([open]) {
  display: none;
}

/* Report Writer POC 1: the browser is the canonical printable page. */
@page {
  size: A4 portrait;
  margin: 15mm 15mm 18mm 15mm;
}

.report-page {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: 210mm;
  min-height: 297mm;
  margin: 1rem auto;
  padding: 0;
  background: white;
}

.report-page__body {
  flex: 1;
}

.report-table {
  width: 100%;
  border-collapse: collapse;
}

.report-table th,
.report-table td {
  border-bottom: 1px solid #e2e8f0;
  padding: 0.35rem 0.5rem;
  text-align: left;
}

.report-table th:not(:first-child),
.report-table td:not(:first-child) {
  text-align: right;
}

.report-page[data-report-variant="kah_standard"] {
  font-family: Arial, Helvetica, sans-serif;
  color: #111827;
  font-size: 10pt;
}

.report-page[data-report-variant="kah_standard"] .report-page__header {
  border-bottom: 2px solid #111827;
  margin-bottom: 0.35rem;
  padding: 0.25rem 0 0.45rem;
}

.report-page[data-report-variant="kah_standard"] .report-page__header h1 {
  font-size: 1.15rem;
  margin: 0;
}

.report-page[data-report-variant="kah_standard"] .report-page__header p { display: none; }

.report-page[data-report-variant="kah_standard"] .report-work-package {
  margin-bottom: 1.6rem;
  break-inside: auto;
  page-break-inside: auto;
}

.report-page[data-report-variant="kah_standard"] .report-work-package__header {
  border-bottom: 2px solid #111827;
  padding: 0.3rem 0.25rem 0.4rem;
}

.report-page[data-report-variant="kah_standard"] .report-work-package__header h2 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0;
}

.report-page[data-report-variant="kah_standard"] .report-work-package__header h2::before { content: "- "; }

.report-page[data-report-variant="kah_standard"] .report-table { table-layout: fixed; }

.report-page[data-report-variant="kah_standard"] .report-table thead {
  display: table-header-group;
}

.report-page[data-report-variant="kah_standard"] .report-table tbody tr {
  break-inside: avoid;
  page-break-inside: avoid;
}

.report-page[data-report-variant="kah_standard"] .report-table th,
.report-page[data-report-variant="kah_standard"] .report-table td {
  border-bottom: 1px solid #9ca3af;
  padding: 0.18rem 0.3rem;
  vertical-align: middle;
}

.report-page[data-report-variant="kah_standard"] .report-table th { font-weight: 700; }

.report-page[data-report-variant="kah_standard"] .report-table th:first-child,
.report-page[data-report-variant="kah_standard"] .report-table td:first-child {
  width: 42%;
  text-align: left;
}

.report-page[data-report-variant="kah_standard"] .report-table th:nth-child(2),
.report-page[data-report-variant="kah_standard"] .report-table td:nth-child(2) { width: 8%; }
.report-page[data-report-variant="kah_standard"] .report-table th:nth-child(3),
.report-page[data-report-variant="kah_standard"] .report-table td:nth-child(3) { width: 7%; }

.report-page[data-report-variant="kah_standard"] .report-table__groups th {
  border: 1px solid #111827;
  padding: 0.15rem;
  text-align: center;
}

.report-page[data-report-variant="kah_standard"] .report-table__labels th {
  border-bottom: 2px solid #111827;
  text-align: right;
}

.report-page[data-report-variant="kah_standard"] .report-table tbody tr[data-report-depth="0"] {
  border-top: 2px solid #111827;
  font-weight: 700;
}

.report-page[data-report-variant="kah_standard"] .report-table tbody tr[data-report-depth]:last-child { border-bottom: 2px solid #111827; }

.report-page[data-report-variant="kah_standard"] .report-table tfoot td {
  border-top: 1px solid #111827;
  padding: 0.18rem 0.3rem;
  text-align: right;
}

.report-page[data-report-variant="kah_standard"] .report-table tfoot td:first-child { text-align: left; }

.report-page[data-report-variant="kah_standard"] [data-report-work-package-total] {
  border-top: 1px solid #111827;
  margin: 0;
  padding: 0.25rem 0.3rem;
  text-align: right;
}

@media screen {
  .report-page {
    box-shadow: 0 0 0.75rem rgb(15 23 42 / 0.15);
  }
}

@media print {
  html,
  body {
    margin: 0;
    background: white;
  }

  .report-page {
    width: auto;
    min-height: 0;
    margin: 0;
    box-shadow: none;
  }
}

body[data-estimate-workspace] [data-estimate-workspace-sidebar] {
  display: none !important;
}

body[data-estimate-workspace] [data-estimate-workspace-mobile-nav] {
  display: none !important;
}

/* The desktop navigation is the only sidebar at the large-screen breakpoint. */
@media (min-width: 64rem) {
  dialog#sidebar {
    display: none !important;
  }

  [data-estimate-workspace-mobile-sidebar] {
    display: none !important;
  }
}

#contacts_table_body:focus,
#contacts_table_body:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border-color: transparent !important;
}

.cursor-row {
  background-color: var(--color-gray-100);
}

.focused-card-element {
  background-color: var(--color-slate-50);
}

/* Reserve the four-rem footer and matching 1.25rem top/bottom gaps. */
[data-workspace-keyboard-target="workItems"] {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 6.5rem);
  height: calc(100dvh - 6.5rem);
  min-width: 0;
  overflow: hidden;
}

[data-workspace-keyboard-target="workItems"] > div,
[data-workspace-keyboard-target="workItems"] > p {
  flex-shrink: 0;
}

#estimate_work_items_list,
#estimate_work_packages_list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  scrollbar-width: none;
}

#estimate_work_items_list::-webkit-scrollbar,
#estimate_work_packages_list::-webkit-scrollbar {
  display: none;
}

#estimate_work_items_list > [data-columns] {
  position: sticky;
  top: 0;
  z-index: 1;
  background-color: var(--color-white, #fff);
}

.focused-card-element #estimate_work_items_list > [data-columns] {
  background-color: var(--color-slate-50, #f8fafc);
}

.estimate-workspace-left-column {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  height: calc(100vh - 6.5rem);
  height: calc(100dvh - 6.5rem);
  min-width: 0;
}

.estimate-workspace-left-column > :first-child {
  flex-shrink: 0;
}

.estimate-workspace-left-column > [data-workspace-keyboard-target="workPackages"] {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

[data-workspace-keyboard-target="workPackages"] > div {
  flex-shrink: 0;
}

/* Catalogue cards share the viewport; their lists scroll below fixed headers. */
.estimate-catalogue-column {
  display: grid;
  grid-auto-rows: minmax(0, 1fr);
  gap: 1.25rem;
  height: calc(100vh - 6.5rem);
  height: calc(100dvh - 6.5rem);
}

.estimate-catalogue-column > [data-workspace-keyboard-target] {
  min-height: 0;
}

[data-workspace-keyboard-target="catalogues"],
[data-workspace-keyboard-target="catalogueGroups"],
[data-workspace-keyboard-target="catalogueEntries"] {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}

:is([data-workspace-keyboard-target="catalogues"],
    [data-workspace-keyboard-target="catalogueGroups"],
    [data-workspace-keyboard-target="catalogueEntries"]) > div {
  flex-shrink: 0;
}

:is([data-workspace-keyboard-target="catalogues"],
    [data-workspace-keyboard-target="catalogueGroups"],
    [data-workspace-keyboard-target="catalogueEntries"]) > ul {
  min-height: 0;
  overflow-y: auto;
}

/* Keep scrolling available without displaying scrollbar tracks or thumbs. */
:is([data-workspace-keyboard-target="catalogues"],
    [data-workspace-keyboard-target="catalogueGroups"],
    [data-workspace-keyboard-target="catalogueEntries"]),
:is([data-workspace-keyboard-target="catalogues"],
    [data-workspace-keyboard-target="catalogueGroups"],
    [data-workspace-keyboard-target="catalogueEntries"]) > ul {
  scrollbar-width: none;
}

:is([data-workspace-keyboard-target="catalogues"],
    [data-workspace-keyboard-target="catalogueGroups"],
    [data-workspace-keyboard-target="catalogueEntries"])::-webkit-scrollbar,
:is([data-workspace-keyboard-target="catalogues"],
    [data-workspace-keyboard-target="catalogueGroups"],
    [data-workspace-keyboard-target="catalogueEntries"]) > ul::-webkit-scrollbar {
  display: none;
}

/* Workspace focus is communicated by background color only. */
body[data-estimate-workspace] [data-workspace-keyboard-target]:focus,
body[data-estimate-workspace] [data-workspace-keyboard-target]:focus-visible,
body[data-estimate-workspace] [data-workspace-list-item]:focus,
body[data-estimate-workspace] [data-workspace-list-item]:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* Shrink text first, then unit, then time; preserve numeric prices and actions. */
.work-item-grid {
  display: grid;
  --work-item-price-width: 9rem;
  /* Quantity + four detail columns + two price groups + travel + actions. */
  --work-item-fixed-width: calc(4.67rem + 4 * 4.5rem + var(--work-item-price-width) + var(--work-item-price-width) + 3.5rem + 2rem);
  --work-item-unit-width: clamp(0rem, calc(100% - var(--work-item-fixed-width) - 3.5rem), 4.67rem);
  --work-item-time-width: clamp(0rem, calc(100% - var(--work-item-fixed-width)), 3.5rem);
  grid-template-columns: 0 minmax(0, 1fr) 4.67rem var(--work-item-unit-width) repeat(4, 4.5rem) var(--work-item-price-width) var(--work-item-price-width) 4.5rem var(--work-item-time-width) 2rem;
  column-gap: 0.5rem;
}

.work-item-grid[data-footer-totals] {
  --work-item-footer-price-width: calc(var(--work-item-price-width) * 0.6);
  grid-template-columns: 0 minmax(0, 1fr) 4.67rem var(--work-item-unit-width) repeat(4, 4.5rem) var(--work-item-footer-price-width) var(--work-item-footer-price-width) 4.5rem var(--work-item-time-width) 2rem;
}

.work-item-form-grid {
  width: 100%;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) 4.67rem var(--work-item-unit-width) var(--work-item-price-width) var(--work-item-price-width) var(--work-item-time-width) var(--work-item-price-width) 2rem;
}

.work-item-price-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  text-align: right;
}

.work-item-detail-grid {
  grid-template-columns: 0 minmax(0, 1fr) 4.67rem var(--work-item-unit-width) repeat(4, 4.5rem) var(--work-item-price-width) var(--work-item-price-width) 4.5rem var(--work-item-time-width) 2rem;
}

/* Match Tailwind's 2xl screen breakpoint. */
@media (min-width: 96rem) {
  .work-item-grid {
    --work-item-price-width: 11.25rem;
  }
}