@import url("fid-loads-form.css");

/* Loads: rate confirmation page and the revised rate con sheet (prefix pui-ratecon-). */

/* A row of charges on the revised rate con sheet. */
.pui-ratecon-row {
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
}

/* The grey stage the paper sits on, and the paper itself. The paper prints, so it never follows the theme. */
.pui-ratecon-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--muted);
  border-radius: 12px;
  padding: 28px 16px;
}

.pui-ratecon-paper {
  width: 100%;
  max-width: 816px;
  box-sizing: border-box;
  padding: 48px 52px;
  background: #fff;
  color: #111;
  border: 1px solid var(--border);
  border-radius: 4px;
  box-shadow: 0 1px 3px oklch(0.2 0.02 258 / 0.08);
}

.pui-ratecon-paper * {
  color: inherit;
}

.pui-ratecon-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  box-sizing: border-box;
  width: 56px;
  height: 56px;
  border: 1px dashed #aaa;
  border-radius: 6px;
  font-size: 10px;
  color: #777 !important;
  text-align: center;
}

.pui-ratecon-title {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.pui-ratecon-h {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #555 !important;
  margin-bottom: 6px;
}

.pui-ratecon-muted {
  font-size: 13px;
  color: #555 !important;
}

.pui-ratecon-line {
  font-size: 13px;
}

.pui-ratecon-chrome .cn-button {
  height: 36px;
  padding: 0 14px;
  font-size: 14px;
  border-radius: 8px;
}

.pui-ratecon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 24px;
}

.pui-ratecon-box {
  border: 1px solid #d6d9de;
  border-radius: 4px;
  padding: 14px 16px;
  font-size: 13px;
}

.pui-ratecon-band {
  border-top: 1px solid #d6d9de;
  border-bottom: 1px solid #d6d9de;
  padding: 14px 0;
}

.pui-ratecon-row-head {
  padding: 8px 0;
}

.pui-ratecon-row-line {
  padding: 10px 0;
}

.pui-ratecon-row-total {
  padding: 12px 0;
}

.pui-ratecon-row-head {
  border-bottom: 1px solid #111;
}

.pui-ratecon-row-line {
  border-bottom: 1px solid #e4e6ea;
}

.pui-ratecon-signature-line {
  height: 36px;
  border-bottom: 1px solid #111;
}

.pui-ratecon-footer {
  border-top: 1px solid #d6d9de;
  padding-top: 10px;
}

@media (max-width: 640px) {
  .pui-ratecon-paper {
    padding: 24px 18px;
  }
}

/* Print: the broker's copy is the paper alone. The shell (sidebar, top bar, page header, buttons) goes away and
   every scroll container above the paper lets it flow onto as many pages as it needs. */
@media print {
  .pui-sidebar,
  .pui-topbar,
  .pui-ratecon-chrome {
    display: none !important;
  }

  *:has(.pui-ratecon-paper):not(.pui-ratecon-paper) {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .pui-ratecon-stage {
    background: none !important;
    padding: 0 !important;
  }

  .pui-ratecon-paper {
    max-width: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  @page {
    size: letter;
    margin: 0.6in 0.7in;
  }
}