:root {
  --bg: #f4f6f8;
  --card: #ffffff;
  --text: #17202a;
  --muted: #6b7280;

  --primary: #1f4e78;
  --primary-dark: #163a5c;
  --primary-light: #e8f0f7;

  --border: #dfe3e8;

  --danger: #c0392b;
  --danger-light: #fdecea;

  --success: #198754;
  --success-light: #e8f5ee;

  --warning: #b7791f;

  --shadow: 0 8px 25px rgba(0, 0, 0, 0.06);
  --radius: 12px;
}


/* ==========================================
   GLOBAL
========================================== */

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;

  font-family:
    Inter,
    Arial,
    Helvetica,
    sans-serif;

  background: var(--bg);
  color: var(--text);
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  -webkit-tap-highlight-color: transparent;
}

[hidden] {
  display: none !important;
}


/* ==========================================
   HEADER
========================================== */

.app-header {
  background: #101820;
  color: white;

  padding: 32px 20px;
}

.header-content {
  max-width: 1250px;

  margin: auto;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 30px;
}

.eyebrow {
  margin: 0 0 6px;

  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 700;

  opacity: 0.7;
}

.app-header h1 {
  margin: 0;

  font-size: 30px;
}

.subtitle {
  margin: 8px 0 0;

  color: #c8d0d8;
}

.header-actions {
  display: flex;

  gap: 10px;

  flex-shrink: 0;
}


/* ==========================================
   MAIN CONTAINER
========================================== */

.container {
  max-width: 1250px;

  margin: 30px auto;

  padding: 0 20px;
}


/* ==========================================
   CARDS
========================================== */

.card {
  background: var(--card);

  border: 1px solid var(--border);
  border-radius: var(--radius);

  padding: 24px;

  margin-bottom: 20px;

  box-shadow: var(--shadow);
}


/* ==========================================
   SECTION HEADINGS
========================================== */

.section-heading {
  display: flex;

  justify-content: space-between;
  align-items: center;

  margin-bottom: 22px;
}

.section-heading > div {
  display: flex;

  align-items: center;

  gap: 12px;
}

.section-heading h2,
.totals-card h2 {
  margin: 0;

  font-size: 19px;
}

.step {
  width: 34px;
  height: 34px;

  border-radius: 8px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  background: var(--primary-light);

  color: var(--primary);

  font-size: 12px;
  font-weight: 800;
}


/* ==========================================
   FORM
========================================== */

.form-grid {
  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  gap: 18px;
}

.form-group {
  display: flex;

  flex-direction: column;

  gap: 7px;
}

.form-group.full-width {
  grid-column: 1 / -1;
}

label {
  font-size: 13px;
  font-weight: 700;

  color: #374151;
}

input,
select,
textarea {
  width: 100%;

  border: 1px solid #cfd5dc;
  border-radius: 8px;

  padding: 11px 12px;

  background: white;

  color: var(--text);

  outline: none;

  transition:
    border-color 0.2s,
    box-shadow 0.2s;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary);

  box-shadow:
    0 0 0 3px
    rgba(31, 78, 120, 0.1);
}

textarea {
  resize: vertical;

  line-height: 1.5;
}


/* ==========================================
   BUTTONS
========================================== */

.btn {
  border: 0;

  border-radius: 8px;

  padding: 11px 17px;

  font-weight: 700;

  cursor: pointer;

  transition:
    background 0.2s,
    transform 0.2s,
    opacity 0.2s;
}

.btn:hover {
  transform: translateY(-1px);
}

.btn:active {
  transform: translateY(0);
}

.btn:disabled {
  cursor: not-allowed;

  opacity: 0.6;

  transform: none;
}

.btn-primary {
  background: var(--primary);

  color: white;
}

.btn-primary:hover {
  background: var(--primary-dark);
}

.btn-secondary {
  background: #edf1f5;

  color: #24313d;
}

.btn-secondary:hover {
  background: #dfe6ec;
}

.app-header .btn-secondary {
  background: #26333f;

  color: white;
}

.app-header .btn-secondary:hover {
  background: #344553;
}


/* ==========================================
   ESTIMATE ITEMS TABLE
========================================== */

.table-wrapper {
  width: 100%;

  overflow-x: auto;
}

table {
  width: 100%;

  border-collapse: collapse;

  min-width: 900px;
}

th {
  text-align: left;

  padding: 10px 8px;

  font-size: 12px;

  color: var(--muted);

  text-transform: uppercase;

  letter-spacing: 0.4px;

  border-bottom:
    1px solid var(--border);
}

td {
  padding: 10px 8px;

  border-bottom:
    1px solid #edf0f2;
}

td input,
td select {
  min-width: 80px;
}

.item-description {
  min-width: 220px;
}

.item-total {
  font-weight: 800;

  white-space: nowrap;
}

.remove-item {
  width: 34px;
  height: 34px;

  border: 0;

  border-radius: 7px;

  background: var(--danger-light);

  color: var(--danger);

  font-size: 22px;

  cursor: pointer;
}

.remove-item:hover {
  background: #f8d5d1;
}


/* ==========================================
   PRICING
========================================== */

.pricing-layout {
  display: grid;

  grid-template-columns:
    1.4fr 0.8fr;

  gap: 20px;
}

.pricing-layout .card {
  margin-bottom: 20px;
}

.totals-card {
  padding: 26px;
}

.totals-card h2 {
  padding-bottom: 17px;

  border-bottom:
    1px solid var(--border);

  margin-bottom: 8px;
}

.summary-row,
.summary-input-row {
  min-height: 49px;

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 15px;

  border-bottom:
    1px solid #edf0f2;
}

.summary-row span,
.summary-input-row label {
  font-size: 14px;

  color: #4b5563;
}

.summary-row strong {
  font-size: 14px;
}


/* ==========================================
   MONEY / PERCENT INPUTS
========================================== */

.money-input,
.percent-input {
  display: flex;

  align-items: center;

  border:
    1px solid #cfd5dc;

  border-radius: 7px;

  background: white;

  overflow: hidden;

  width: 125px;
}

.money-input span,
.percent-input span {
  padding: 0 9px;

  color: var(--muted);
}

.money-input input,
.percent-input input {
  border: 0;

  box-shadow: none;

  border-radius: 0;

  padding: 8px;

  text-align: right;
}

.money-input input:focus,
.percent-input input:focus {
  box-shadow: none;
}


/* ==========================================
   GRAND TOTAL
========================================== */

.grand-total {
  margin-top: 20px;

  background: #101820;

  color: white;

  border-radius: 10px;

  padding: 20px;

  display: flex;

  align-items: center;
  justify-content: space-between;
}

.grand-total span {
  font-size: 12px;

  font-weight: 800;

  letter-spacing: 1px;
}

.grand-total strong {
  font-size: 25px;
}


/* ==========================================
   PAYMENT TERMS
========================================== */

.standalone-input {
  width: 160px;
}

.calculated-value {
  min-height: 44px;

  padding: 11px 13px;

  background: #f6f8fa;

  border:
    1px solid var(--border);

  border-radius: 8px;

  font-weight: 800;
}


/* ==========================================
   BOTTOM ACTIONS
========================================== */

.bottom-actions {
  display: flex;

  justify-content: flex-end;

  gap: 12px;

  margin: 10px 0 35px;
}


/* ==========================================
   SAVED ESTIMATES VIEW
========================================== */

.saved-estimates-view {
  animation:
    savedViewFade 0.2s ease;
}

@keyframes savedViewFade {
  from {
    opacity: 0;
    transform: translateY(4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* ==========================================
   SAVED PAGE HEADER
========================================== */

.saved-page-header {
  display: flex;

  justify-content: space-between;
  align-items: center;

  gap: 25px;

  margin-bottom: 22px;
}

.saved-page-header h2 {
  margin:
    4px 0 7px;

  font-size: 28px;
}

.saved-page-header p {
  margin: 0;

  color: var(--muted);
}

.saved-eyebrow {
  color: var(--primary);

  opacity: 1;
}


/* ==========================================
   SAVED ESTIMATE STATS
========================================== */

.estimate-stats {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 18px;

  margin-bottom: 20px;
}

.stat-card {
  background: white;

  border:
    1px solid var(--border);

  border-radius: var(--radius);

  padding: 22px 24px;

  box-shadow: var(--shadow);

  display: flex;

  flex-direction: column;

  gap: 9px;
}

.stat-card span {
  color: var(--muted);

  font-size: 13px;

  font-weight: 700;
}

.stat-card strong {
  font-size: 27px;

  color: var(--text);
}


/* ==========================================
   SAVED ESTIMATE CARD
========================================== */

.saved-estimates-card {
  padding: 0;

  overflow: hidden;
}


/* ==========================================
   SAVED TOOLBAR
========================================== */

.saved-toolbar {
  padding: 20px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  border-bottom:
    1px solid var(--border);
}

.estimate-search {
  flex: 1;

  max-width: 650px;
}

.estimate-search input {
  background: #f8fafb;

  padding: 12px 14px;
}


/* ==========================================
   SAVED ESTIMATES TABLE
========================================== */

.saved-estimates-table {
  min-width: 950px;
}

.saved-estimates-table th {
  background: #f8fafb;

  padding: 14px 16px;
}

.saved-estimates-table td {
  padding: 15px 16px;

  vertical-align: middle;
}

.saved-estimates-table tbody tr {
  transition:
    background 0.15s;
}

.saved-estimates-table tbody tr:hover {
  background: #f9fbfc;
}


/* ==========================================
   SAVED ESTIMATE INFORMATION
========================================== */

.estimate-number-link {
  color: var(--primary);

  font-weight: 800;

  cursor: pointer;
}

.estimate-number-link:hover {
  text-decoration: underline;
}

.saved-customer {
  display: flex;

  flex-direction: column;

  gap: 3px;
}

.saved-customer strong {
  font-size: 14px;
}

.saved-customer span {
  color: var(--muted);

  font-size: 12px;
}

.saved-project {
  display: flex;

  flex-direction: column;

  gap: 3px;
}

.saved-project strong {
  font-size: 14px;
}

.saved-project span {
  color: var(--muted);

  font-size: 12px;
}

.saved-total {
  font-weight: 800;

  white-space: nowrap;
}


/* ==========================================
   SAVED ESTIMATE ACTION BUTTONS
========================================== */

.saved-actions {
  display: flex;

  align-items: center;

  gap: 6px;

  white-space: nowrap;
}

.action-btn {
  border: 0;

  border-radius: 7px;

  padding: 8px 10px;

  font-size: 12px;

  font-weight: 700;

  cursor: pointer;

  transition:
    background 0.15s,
    transform 0.15s;
}

.action-btn:hover {
  transform: translateY(-1px);
}

.action-open {
  background: var(--primary-light);

  color: var(--primary);
}

.action-open:hover {
  background: #d8e7f3;
}

.action-duplicate {
  background: var(--success-light);

  color: var(--success);
}

.action-duplicate:hover {
  background: #d8eee2;
}

.action-delete {
  background: var(--danger-light);

  color: var(--danger);
}

.action-delete:hover {
  background: #f8d5d1;
}


/* ==========================================
   EMPTY STATE
========================================== */

.saved-empty {
  text-align: center;

  padding: 65px 20px;
}

.saved-empty h3 {
  margin:
    0 0 8px;

  font-size: 20px;
}

.saved-empty p {
  margin: 0;

  color: var(--muted);
}


/* ==========================================
   LOADING ROW
========================================== */

.saved-loading {
  text-align: center;

  padding: 40px !important;

  color: var(--muted);
}


/* ==========================================
   ERROR MESSAGE
========================================== */

.saved-error {
  margin: 20px;

  padding: 14px 16px;

  border:
    1px solid #f1c7c2;

  border-radius: 8px;

  background: #fff3f1;

  color: #9e3024;

  font-size: 14px;
}


/* ==========================================
   FOOTER
========================================== */

.app-footer {
  text-align: center;

  color: var(--muted);

  padding:
    10px 20px 35px;

  font-size: 13px;
}




/* ==========================================
   INVOICE SYSTEM
========================================== */

.invoice-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.invoice-table {
  min-width: 1450px;
}

.action-pdf {
  background: #eef2ff;
  color: #4338ca;
}

.action-pdf:hover {
  background: #e0e7ff;
}

.action-invoice {
  background: #fff7e6;
  color: #9a6700;
}

.action-invoice:hover {
  background: #ffedc2;
}

.action-payment {
  background: var(--success-light);
  color: var(--success);
}

.action-payment:hover {
  background: #d8eee2;
}

.invoice-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.status-draft {
  background: #eef1f4;
  color: #4b5563;
}

.status-sent {
  background: var(--primary-light);
  color: var(--primary);
}

.status-deposit-paid,
.status-partially-paid {
  background: #fff7e6;
  color: #9a6700;
}

.status-paid {
  background: var(--success-light);
  color: var(--success);
}

.status-overdue {
  background: var(--danger-light);
  color: var(--danger);
}

.status-cancelled {
  background: #f1f1f1;
  color: #6b7280;
  text-decoration: line-through;
}

.invoice-detail-header {
  margin-bottom: 22px;
}

.invoice-information {
  display: flex;
  flex-direction: column;
  gap: 7px;
  line-height: 1.5;
}

.invoice-information strong {
  font-size: 18px;
}

.invoice-information span,
.invoice-information p {
  color: var(--muted);
  margin: 0;
}

.invoice-notes {
  min-height: 80px;
  padding: 16px;
  background: #f8fafb;
  border: 1px solid var(--border);
  border-radius: 8px;
  white-space: pre-wrap;
  line-height: 1.6;
}

.payment-history {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 18px;
}

.payment-empty {
  margin: 0;
  padding: 18px;
  border: 1px dashed var(--border);
  border-radius: 8px;
  color: var(--muted);
  text-align: center;
  background: #fafbfc;
}

.payment-record {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 20px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: #fafbfc;
}

.payment-record strong {
  font-size: 15px;
}

.payment-record .payment-amount {
  font-size: 16px;
  color: var(--success);
  white-space: nowrap;
}

.payment-record small {
  color: var(--muted);
}

.payment-record .payment-note {
  grid-column: 1 / -1;
  color: #4b5563;
  font-size: 13px;
}

#invoiceAmountPaid {
  color: var(--success);
}

#invoiceBalanceDue {
  font-size: 25px;
}


/* ==========================================
   MODAL
========================================== */

.modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.modal[hidden] {
  display: none !important;
}

.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(16, 24, 32, 0.65);
  backdrop-filter: blur(2px);
}

.modal-dialog {
  position: relative;
  z-index: 1;
  width: min(100%, 520px);
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  background: white;
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 25px 70px rgba(0, 0, 0, 0.25);
}

.modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}

.modal-header h2 {
  margin: 4px 0 0;
  font-size: 22px;
}

.modal-header .eyebrow {
  color: var(--primary);
  opacity: 1;
}

.modal-close {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 8px;
  background: #edf1f5;
  color: #24313d;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}

.modal-close:hover {
  background: #dfe6ec;
}

.modal-dialog .form-group {
  margin-bottom: 17px;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
}


/* ==========================================
   INVOICE RESPONSIVE
========================================== */

@media (max-width: 1050px) {
  .invoice-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .invoice-stats {
    grid-template-columns: 1fr;
  }

  .payment-record {
    grid-template-columns: 1fr;
  }

  .payment-record .payment-note {
    grid-column: auto;
  }

  .modal {
    padding: 10px;
  }

  .modal-dialog {
    padding: 20px;
  }

  .modal-actions {
    flex-direction: column-reverse;
  }

  .modal-actions .btn {
    width: 100%;
  }
}


/* ==========================================
   INVOICE PRINT
========================================== */

@media print {
  #savedEstimatesView,
  #invoicesView,
  #paymentModal {
    display: none !important;
  }

  body.printing-invoice #estimatorView {
    display: none !important;
  }

  body.printing-invoice #invoiceDetailView {
    display: block !important;
  }

  body:not(.printing-invoice) #invoiceDetailView {
    display: none !important;
  }

  body.printing-invoice #invoiceDetailView .saved-page-header .header-actions,
  body.printing-invoice #recordPaymentBtn,
  body.printing-invoice #saveInvoiceBtn,
  body.printing-invoice #invoicePrintBtn {
    display: none !important;
  }

  body.printing-invoice .invoice-detail-header {
    display: block;
  }

  body.printing-invoice .invoice-detail-header .eyebrow {
    display: block !important;
    color: #333;
  }
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 900px) {

  .header-content {
    flex-direction: column;

    align-items: flex-start;
  }

  .header-actions {
    flex-wrap: wrap;
  }

  .form-grid {
    grid-template-columns:
      1fr 1fr;
  }

  .pricing-layout {
    grid-template-columns: 1fr;
  }

  .saved-page-header {
    align-items: flex-start;
  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .container {
    padding: 0 12px;

    margin-top: 15px;
  }

  .card {
    padding: 18px;
  }

  .app-header {
    padding: 24px 16px;
  }

  .app-header h1 {
    font-size: 24px;
  }

  .form-grid {
    grid-template-columns: 1fr;
  }

  .form-group.full-width {
    grid-column: auto;
  }

  .header-actions {
    width: 100%;

    display: grid;

    grid-template-columns:
      1fr 1fr;
  }

  .header-actions .btn {
    width: 100%;
  }

  #printEstimateBtn {
    grid-column: 1 / -1;
  }

  #newEstimateBtn {
    grid-column: 1 / -1;
  }

  .bottom-actions {
    width: 100%;
  }

  .bottom-actions .btn {
    flex: 1;
  }

  .line-item-heading {
    align-items: flex-start;

    gap: 15px;
  }

  .saved-page-header {
    flex-direction: column;

    align-items: stretch;
  }

  .saved-page-header .btn {
    width: 100%;
  }

  .estimate-stats {
    grid-template-columns: 1fr;
  }

  .saved-toolbar {
    flex-direction: column;

    align-items: stretch;
  }

  .estimate-search {
    max-width: none;
  }

  .saved-toolbar .btn {
    width: 100%;
  }

}


/* ==========================================
   PRINT / PDF
========================================== */

@media print {

  body {
    background: white;
  }

  .app-header {
    background: white;

    color: black;

    padding:
      10px 0 20px;
  }

  .app-header .subtitle,
  .eyebrow,
  .header-actions,
  .bottom-actions,
  .remove-item,
  #addItemBtn,
  .app-footer,
  #savedEstimatesView,
  #invoicesView,
  #paymentModal {
    display: none !important;
  }

  #estimatorView {
    display: block !important;
  }

  .container {
    max-width: none;

    margin: 0;

    padding: 0;
  }

  .card {
    box-shadow: none;

    border:
      1px solid #ddd;

    break-inside: avoid;
  }

  input,
  select,
  textarea {
    border: none;

    padding-left: 0;

    box-shadow: none;
  }

  .step {
    display: none;
  }

  .pricing-layout {
    grid-template-columns:
      1fr 1fr;
  }

  .grand-total {
    background: #eee;

    color: black;
  }

}

/* ==========================================
   CUSTOMER SYSTEM
========================================== */

.customer-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 20px;
}

.customer-table {
  min-width: 1350px;
}

.customer-name-link {
  color: var(--primary);
  font-weight: 800;
  cursor: pointer;
}

.customer-name-link:hover {
  text-decoration: underline;
}

.customer-contact {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.customer-contact span {
  color: var(--muted);
  font-size: 12px;
}

.customer-project-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--primary-light);
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
}

.customer-profile-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.customer-profile-info {
  display: grid;
  gap: 14px;
}

.customer-profile-info > div {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-bottom: 13px;
  border-bottom: 1px solid #edf0f2;
}

.customer-profile-info > div:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.customer-profile-info span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.customer-profile-info strong {
  font-size: 15px;
}

.customer-address-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.customer-address {
  padding: 13px 15px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #f8fafb;
  line-height: 1.45;
}

.customer-address-empty {
  color: var(--muted);
  padding: 15px 0;
}

.customer-history-card {
  padding: 0;
  overflow: hidden;
}

.customer-history-heading {
  padding: 20px;
  border-bottom: 1px solid var(--border);
}

.customer-history-heading h2 {
  margin: 4px 0 0;
  font-size: 19px;
}

@media (max-width: 1050px) {
  .customer-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .customer-profile-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .customer-stats {
    grid-template-columns: 1fr;
  }
}

@media print {
  #customersView,
  #customerDetailView {
    display: none !important;
  }
}


/* ==================================================
   JOB MANAGEMENT
================================================== */
.job-table th, .job-table td { vertical-align: middle; }
.job-status { display:inline-flex; align-items:center; padding:6px 10px; border-radius:999px; font-size:.78rem; font-weight:800; background:rgba(59,130,246,.10); border:1px solid rgba(59,130,246,.22); white-space:nowrap; }
.job-status.status-completed { background:rgba(34,197,94,.10); border-color:rgba(34,197,94,.25); }
.job-status.status-in-progress { background:rgba(245,185,66,.12); border-color:rgba(245,185,66,.30); }
.job-status.status-on-hold, .job-status.status-cancelled { background:rgba(229,9,20,.08); border-color:rgba(229,9,20,.20); }
.job-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.action-job { border-color:rgba(34,197,94,.35); }
@media (max-width:760px){ .job-form-grid { grid-template-columns:1fr; } }
@media print { #jobsView, #jobDetailView { display:none !important; } }


/* ==================================================
   JOB EXPENSES & PROFIT
================================================== */
.job-profit-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.job-expense-table input, .job-expense-table select { min-width:120px; width:100%; }
.job-expense-table .job-expense-vendor { min-width:180px; }
.job-expense-table .job-expense-description { min-width:220px; }
.job-expense-table .job-expense-amount { min-width:110px; text-align:right; }
.job-expense-empty { padding:18px 0 2px; }
.job-expense-empty p { margin:0; }
@media (max-width:950px){ .job-profit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px){ .job-profit-grid { grid-template-columns:1fr; } }

/* JOB SCHEDULING, WORKERS & LABOR */
.job-labor-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.job-worker-table input, .job-worker-table select { width:100%; min-width:105px; }
.job-worker-table .job-worker-name { min-width:155px; }
.job-worker-table .job-worker-role { min-width:135px; }
.job-worker-table .job-worker-contact { min-width:180px; }
.job-worker-table .job-worker-notes { min-width:180px; }
.job-worker-cost { font-weight:800; white-space:nowrap; }
.job-help-text { color:var(--muted); margin:14px 0 0; font-size:.88rem; }
@media (max-width:950px){ .job-labor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px){ .job-labor-grid { grid-template-columns:1fr; } }

/* BUSINESS DASHBOARD */
.dashboard-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.dashboard-kpi small { display:block; margin-top:6px; color:var(--muted); font-size:.78rem; font-weight:600; }
.dashboard-grid-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:18px; }
.dashboard-panel { min-width:0; }
.dashboard-metric-list { display:grid; gap:2px; }
.dashboard-metric-list > div { display:flex; justify-content:space-between; gap:18px; padding:13px 0; border-bottom:1px solid var(--border); }
.dashboard-metric-list > div:last-child { border-bottom:0; }
.dashboard-metric-list span { color:var(--muted); }
.dashboard-metric-list strong { white-space:nowrap; }
.dashboard-note { margin:14px 0 0; color:var(--muted); font-size:.82rem; line-height:1.5; }
.dashboard-status-list { display:grid; gap:10px; }
.dashboard-status-row { display:grid; grid-template-columns:minmax(110px,1fr) 2fr 42px; gap:12px; align-items:center; }
.dashboard-status-track { height:10px; background:rgba(127,127,127,.16); border-radius:999px; overflow:hidden; }
.dashboard-status-fill { height:100%; background:currentColor; border-radius:999px; }
.dashboard-status-row strong { text-align:right; }
.dashboard-activity { display:grid; gap:10px; }
.dashboard-activity-item { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-bottom:1px solid var(--border); }
.dashboard-activity-item:last-child { border-bottom:0; }
.dashboard-activity-item span { color:var(--muted); font-size:.85rem; }
.dashboard-link { border:0; padding:0; background:transparent; color:inherit; font:inherit; font-weight:800; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:1050px){ .dashboard-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboard-grid-two { grid-template-columns:1fr; } }
@media (max-width:600px){ .dashboard-kpi-grid { grid-template-columns:1fr; } .dashboard-status-row { grid-template-columns:1fr 1.5fr 32px; } }

/* ==========================================================
   RL HOME FIX — PROFESSIONAL UI REFRESH
   Visual-only layer. Existing application behavior unchanged.
========================================================== */
:root{
  --bg:#f5f7fb;
  --card:#ffffff;
  --text:#142033;
  --muted:#687386;
  --primary:#173f67;
  --primary-dark:#0f2e4d;
  --primary-light:#eaf2f9;
  --accent:#d89a2b;
  --accent-soft:#fff6e5;
  --border:#e2e8f0;
  --success:#16835f;
  --success-light:#e8f7f1;
  --danger:#c5453a;
  --danger-light:#fff0ee;
  --warning:#a96c0b;
  --shadow:0 10px 30px rgba(15,46,77,.07);
  --shadow-hover:0 18px 42px rgba(15,46,77,.12);
  --radius:16px;
}

body{
  background:
    radial-gradient(circle at 8% 0%, rgba(23,63,103,.055), transparent 28rem),
    linear-gradient(180deg,#f8fafc 0,#f4f7fb 100%);
  color:var(--text);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

.app-header{
  position:relative;
  overflow:hidden;
  padding:24px 24px;
  background:linear-gradient(125deg,#0c263e 0%,#123b61 55%,#1c527f 100%);
  border-bottom:1px solid rgba(255,255,255,.12);
  box-shadow:0 12px 34px rgba(8,31,51,.18);
}
.app-header::after{
  content:"";
  position:absolute;
  width:430px;height:430px;
  right:-140px;top:-300px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018);
  pointer-events:none;
}
.header-content{max-width:1380px;position:relative;z-index:1;align-items:flex-start;}
.header-content>div:first-child{position:relative;padding-left:58px;min-width:290px;}
.header-content>div:first-child::before{
  content:"RL";position:absolute;left:0;top:1px;width:44px;height:44px;
  display:grid;place-items:center;border-radius:12px;
  background:linear-gradient(145deg,#f0b74e,#cf8b19);color:#102d49;
  font-weight:900;font-size:16px;letter-spacing:-.5px;
  box-shadow:0 7px 18px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.45);
}
.eyebrow{color:#f3c76f;opacity:1;font-size:10px;letter-spacing:2.1px;margin-bottom:4px;}
.app-header h1{font-size:25px;letter-spacing:-.55px;font-weight:800;}
.subtitle{font-size:13px;color:#c8d7e5;margin-top:5px;}
.header-actions{flex-wrap:wrap;justify-content:flex-end;max-width:820px;gap:8px;}
.app-header .btn{min-height:40px;padding:9px 13px;border-radius:10px;font-size:12.5px;box-shadow:none;}
.app-header .btn-secondary{background:rgba(255,255,255,.075);color:#f7fbff;border-color:rgba(255,255,255,.16);backdrop-filter:blur(8px);}
.app-header .btn-secondary:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.27);transform:translateY(-1px);}
.app-header .btn-primary{background:#f0b74e;color:#17324d;border-color:#f0b74e;font-weight:800;}
.app-header .btn-primary:hover{background:#f5c66e;border-color:#f5c66e;transform:translateY(-1px);}

.container{max-width:1380px;margin:26px auto 46px;padding:0 24px;}
.card{
  border:1px solid rgba(211,220,230,.92);
  border-radius:18px;padding:24px;margin-bottom:20px;
  box-shadow:var(--shadow);transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.card:hover{border-color:#d5dee8;box-shadow:0 13px 34px rgba(15,46,77,.085);}
.section-heading{padding-bottom:15px;margin-bottom:20px;border-bottom:1px solid #edf1f5;}
.section-heading h2,.totals-card h2{font-size:18px;letter-spacing:-.25px;font-weight:800;}
.step{width:32px;height:32px;border-radius:9px;background:linear-gradient(145deg,#edf5fb,#e4eef7);box-shadow:inset 0 0 0 1px #d8e6f2;color:#17466f;}

label{font-size:12px;font-weight:750;color:#4b5a6c;letter-spacing:.01em;}
input,select,textarea{
  border:1px solid #d7e0e9!important;border-radius:10px!important;
  background:#fbfcfe;color:var(--text);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
input:hover,select:hover,textarea:hover{border-color:#bdcad7!important;background:#fff;}
input:focus,select:focus,textarea:focus{outline:none;border-color:#3e719e!important;background:#fff;box-shadow:0 0 0 3px rgba(46,105,156,.12)!important;}
textarea{line-height:1.55;}

.btn{border-radius:10px;font-weight:750;letter-spacing:.005em;transition:all .18s ease;box-shadow:0 2px 5px rgba(15,46,77,.05);}
.btn:hover{transform:translateY(-1px);box-shadow:0 7px 16px rgba(15,46,77,.11);}
.btn:active{transform:translateY(0);}
.btn-primary{background:linear-gradient(145deg,#1b527f,#173f67);border-color:#173f67;color:#fff;}
.btn-primary:hover{background:linear-gradient(145deg,#22628f,#153b60);}
.btn-secondary{background:#fff;color:#24415e;border-color:#d4dee8;}
.btn-secondary:hover{background:#f6f9fc;border-color:#b9c8d7;}

.table-wrapper{border:1px solid #e1e7ee;border-radius:13px;overflow:auto;background:#fff;}
.saved-estimates-table,.invoice-table,.customer-table,.job-table{border-collapse:separate;border-spacing:0;}
.saved-estimates-table th,.invoice-table th,.customer-table th,.job-table th{
  background:#f5f8fb;color:#506074;font-size:10.5px;text-transform:uppercase;letter-spacing:.065em;font-weight:800;
  border-bottom:1px solid #dfe7ef!important;padding-top:12px!important;padding-bottom:12px!important;
}
.saved-estimates-table td,.invoice-table td,.customer-table td,.job-table td{border-bottom-color:#edf1f5!important;}
.saved-estimates-table tbody tr,.invoice-table tbody tr,.customer-table tbody tr,.job-table tbody tr{transition:background .15s ease;}
.saved-estimates-table tbody tr:hover,.invoice-table tbody tr:hover,.customer-table tbody tr:hover,.job-table tbody tr:hover{background:#f8fbfd;}

.stat-card,.dashboard-kpi{
  position:relative;overflow:hidden;background:linear-gradient(145deg,#fff,#fbfdff);
  border:1px solid #dfe7ef!important;border-radius:15px!important;box-shadow:0 6px 18px rgba(15,46,77,.055)!important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.stat-card::before,.dashboard-kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(#1d5a8d,#e3a43a);opacity:.85;}
.stat-card:hover,.dashboard-kpi:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(15,46,77,.09)!important;border-color:#cfdae5!important;}
.stat-card span,.dashboard-kpi span{font-size:10.5px!important;text-transform:uppercase;letter-spacing:.055em;font-weight:800!important;color:#718095!important;}
.stat-card strong,.dashboard-kpi strong{font-size:22px!important;letter-spacing:-.55px;color:#17334f;}
.dashboard-kpi small{color:#8390a0!important;}
.dashboard-grid-two{gap:20px;}
.dashboard-panel{border-top:3px solid #dfeaf3;}
.dashboard-metric-list>div{padding:12px 2px;}
.dashboard-status-track{height:8px;background:#edf1f5;}
.dashboard-status-fill{background:linear-gradient(90deg,#245f90,#d9a23d);}
.dashboard-activity-item{padding:12px 2px;}
.dashboard-link{color:#185483;text-decoration-color:#9bbbd4;}
.dashboard-link:hover{color:#0f3556;text-decoration-color:#0f3556;}

.invoice-status,.job-status{font-size:10.5px!important;letter-spacing:.025em;padding:5px 9px!important;border-radius:999px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);}
.status-paid,.job-status.status-completed{color:#126448!important;background:#e8f7f1!important;border-color:#bce5d5!important;}
.status-overdue,.status-cancelled,.job-status.status-on-hold,.job-status.status-cancelled{color:#a93c33!important;background:#fff0ee!important;border-color:#f1c9c5!important;}
.status-sent,.status-deposit-paid,.status-partially-paid,.job-status.status-in-progress{color:#8a5a0b!important;background:#fff7e8!important;border-color:#efd59e!important;}

.totals-card{background:linear-gradient(145deg,#f8fbfd,#f2f7fb);border:1px solid #d9e5ef;border-radius:15px;padding:20px;}
.customer-profile-info,.customer-address,.customer-history-card{border-radius:13px!important;border-color:#e1e8ef!important;background:#fcfdff!important;}
.customer-name-link{color:#185483;font-weight:800;}

.modal-backdrop{background:rgba(8,25,41,.58);backdrop-filter:blur(3px);}
.modal-dialog{border-radius:18px!important;border:1px solid rgba(255,255,255,.65);box-shadow:0 28px 70px rgba(7,27,44,.25)!important;}
.modal-header{border-bottom:1px solid #e8edf2;padding-bottom:15px;}
.modal-close{border-radius:9px;background:#f3f6f9;color:#536275;}
.modal-close:hover{background:#e8eef4;color:#243b53;}

.saved-empty{border:1px dashed #d4dee8;border-radius:13px;background:#fafcfe;color:#748194;}
.remove-item{border-radius:8px!important;transition:all .15s ease;}

footer,.footer{color:#7a8796;}

@media(max-width:1050px){
  .header-content{flex-direction:column;align-items:stretch;}
  .header-actions{justify-content:flex-start;max-width:none;}
}
@media(max-width:720px){
  .app-header{padding:20px 16px;}
  .header-content>div:first-child{padding-left:52px;}
  .app-header h1{font-size:21px;}
  .subtitle{font-size:12px;}
  .header-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;}
  .app-header .btn{width:100%;}
  .container{padding:0 14px;margin-top:18px;}
  .card{padding:18px;border-radius:15px;}
  .section-heading{align-items:flex-start;gap:12px;}
}

@media print{
  body{background:#fff!important;}
  .app-header{background:#fff!important;color:#111!important;box-shadow:none!important;border:0!important;}
  .app-header::after,.header-content>div:first-child::before{display:none!important;}
  .header-content>div:first-child{padding-left:0!important;}
  .eyebrow,.subtitle{color:#444!important;}
  .card{box-shadow:none!important;border-color:#ddd!important;}
}


/* ==================================================
   CALENDAR & SCHEDULING
================================================== */
.calendar-page-header{align-items:center}.calendar-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px}.calendar-card{overflow:hidden}.calendar-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.calendar-nav{display:flex;align-items:center;gap:10px}.calendar-nav h2{margin:0;min-width:220px;font-size:1.25rem}.calendar-arrow{min-width:44px;padding:10px 12px}.calendar-view-switch{display:flex;padding:4px;background:#eef2f6;border:1px solid #dfe5ec;border-radius:12px}.calendar-switch{border:0;background:transparent;padding:9px 16px;border-radius:9px;font-weight:800;color:#596579;cursor:pointer}.calendar-switch.active{background:#fff;color:#10233f;box-shadow:0 2px 8px rgba(16,35,63,.12)}.calendar-legend{display:flex;flex-wrap:wrap;gap:18px;margin:0 0 15px;color:#667085;font-size:.84rem;font-weight:700}.calendar-legend span{display:flex;align-items:center;gap:7px}.calendar-dot{width:9px;height:9px;border-radius:50%;display:inline-block}.calendar-dot-start{background:#0f766e}.calendar-dot-work{background:#1d4ed8}.calendar-dot-target{background:#b7791f}.calendar-dot-overdue{background:#b42318}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid #e3e8ef;border-left:1px solid #e3e8ef;background:#fff}.calendar-weekday{padding:10px;text-align:center;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem;font-weight:900;color:#667085;background:#f7f9fc;border-right:1px solid #e3e8ef;border-bottom:1px solid #e3e8ef}.calendar-day{min-height:132px;padding:9px;border-right:1px solid #e3e8ef;border-bottom:1px solid #e3e8ef;background:#fff;overflow:hidden}.calendar-day.other-month{background:#fafbfc}.calendar-day.today{box-shadow:inset 0 0 0 2px #c59b48}.calendar-day-number{display:flex;align-items:center;justify-content:space-between;font-size:.8rem;font-weight:900;color:#344054;margin-bottom:7px}.calendar-day.other-month .calendar-day-number{color:#a8b0bd}.calendar-today-label{font-size:.62rem;color:#8a641c;text-transform:uppercase;letter-spacing:.05em}.calendar-event{display:block;width:100%;border:0;text-align:left;margin:0 0 5px;padding:6px 7px;border-radius:7px;font:inherit;font-size:.7rem;font-weight:800;line-height:1.2;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .15s ease,box-shadow .15s ease}.calendar-event:hover{transform:translateY(-1px);box-shadow:0 3px 8px rgba(16,35,63,.14)}.calendar-event small{display:block;font-size:.62rem;font-weight:650;opacity:.78;overflow:hidden;text-overflow:ellipsis}.calendar-event.start{background:#e8f6f3;color:#0b625b;border-left:3px solid #0f766e}.calendar-event.work{background:#eaf1ff;color:#1949a3;border-left:3px solid #1d4ed8}.calendar-event.target{background:#fff5dc;color:#8a641c;border-left:3px solid #b7791f}.calendar-event.overdue{background:#fff0ee;color:#9d261d;border-left:3px solid #b42318}.calendar-grid.week-view .calendar-day{min-height:390px}.calendar-agenda-card{margin-top:18px}.calendar-agenda{display:grid;gap:10px}.calendar-agenda-item{display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:14px;padding:12px 14px;border:1px solid #e3e8ef;border-radius:12px;background:#fff}.calendar-agenda-date{font-weight:900;color:#10233f}.calendar-agenda-main strong{display:block;color:#172b4d}.calendar-agenda-main span{display:block;color:#667085;font-size:.83rem;margin-top:2px}.calendar-agenda-item button{white-space:nowrap}.calendar-crew{font-size:.72rem!important;color:#7b8798!important}.calendar-overdue-text{color:#b42318!important;font-weight:800}.calendar-no-events{color:#98a2b3;font-size:.72rem;padding-top:4px}@media(max-width:900px){.calendar-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.calendar-day{min-height:110px;padding:6px}.calendar-event{font-size:.64rem;padding:5px}.calendar-event small{display:none}}@media(max-width:650px){.calendar-toolbar{align-items:flex-start;flex-direction:column}.calendar-nav h2{min-width:0;font-size:1.05rem}.calendar-grid{overflow-x:auto;min-width:700px}.calendar-card{overflow-x:auto}.calendar-summary-grid{grid-template-columns:1fr 1fr}.calendar-agenda-item{grid-template-columns:1fr}.calendar-agenda-item .btn{justify-self:start}}

/* =========================================================
   REPORTS & ANALYTICS
========================================================= */
.reports-view { max-width: 1500px; margin: 0 auto; padding: 28px 22px 54px; }
.reports-hero { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:26px 28px; margin-bottom:18px; }
.reports-hero h1 { margin:4px 0 6px; font-size:clamp(1.7rem,3vw,2.45rem); }
.reports-hero p { margin:0; color:var(--muted); max-width:760px; }
.eyebrow { text-transform:uppercase; letter-spacing:.14em; font-weight:800; font-size:.72rem; color:var(--primary, #17324d); }
.reports-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.reports-actions select { min-width:150px; padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:#fff; }
.reports-kpi-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.report-kpi { background:linear-gradient(180deg,#fff,#fbfcfe); border:1px solid var(--border); border-radius:16px; padding:18px; box-shadow:0 8px 24px rgba(15,35,55,.06); }
.report-kpi span { display:block; color:var(--muted); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.report-kpi strong { display:block; font-size:1.45rem; margin:8px 0 4px; color:var(--text); }
.report-kpi small { color:var(--muted); line-height:1.35; }
.reports-grid { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr); gap:18px; margin-bottom:18px; }
.report-panel { margin-bottom:18px; }
.report-chart { min-height:260px; display:flex; align-items:flex-end; gap:10px; padding:18px 8px 6px; overflow-x:auto; }
.report-month { min-width:72px; flex:1; display:flex; flex-direction:column; align-items:center; gap:8px; }
.report-bars { height:190px; width:100%; display:flex; align-items:flex-end; justify-content:center; gap:4px; border-bottom:1px solid var(--border); }
.report-bar { width:22%; min-width:8px; border-radius:5px 5px 2px 2px; background:var(--primary,#17324d); opacity:.9; }
.report-bar.collected { background:#2d7a57; }
.report-bar.costs { background:#b58a3a; }
.report-month-label { font-size:.75rem; color:var(--muted); font-weight:700; white-space:nowrap; }
.report-legend { display:flex; gap:18px; justify-content:center; color:var(--muted); font-size:.8rem; font-weight:700; padding:8px 0 4px; }
.report-legend span::before { content:""; display:inline-block; width:9px; height:9px; border-radius:3px; background:var(--primary,#17324d); margin-right:6px; }
.report-legend span:nth-child(2)::before { background:#2d7a57; }
.report-legend span:nth-child(3)::before { background:#b58a3a; }
.report-snapshot { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.report-snapshot > div { border:1px solid var(--border); border-radius:12px; padding:15px; background:#fbfcfe; }
.report-snapshot span { display:block; color:var(--muted); font-size:.8rem; font-weight:700; }
.report-snapshot strong { display:block; font-size:1.35rem; margin-top:4px; }
.report-status-list { display:grid; gap:10px; }
.report-status-row { display:grid; grid-template-columns:minmax(90px,1fr) 3fr auto; gap:10px; align-items:center; }
.report-status-name { font-weight:700; }
.report-status-track { height:10px; border-radius:99px; background:#eef1f4; overflow:hidden; }
.report-status-fill { height:100%; background:var(--primary,#17324d); border-radius:inherit; }
.report-status-count { font-weight:800; min-width:28px; text-align:right; }
.report-positive { color:#21724e !important; }
.report-negative { color:#a53a3a !important; }
.report-footnote { max-width:1100px; color:var(--muted); font-size:.82rem; line-height:1.5; margin:6px auto 0; text-align:center; }
@media (max-width:1200px){ .reports-kpi-grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:850px){ .reports-hero{align-items:flex-start;flex-direction:column}.reports-actions{justify-content:flex-start}.reports-grid{grid-template-columns:1fr}.reports-kpi-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .reports-kpi-grid{grid-template-columns:1fr}.report-snapshot{grid-template-columns:1fr}.reports-view{padding-left:12px;padding-right:12px} }
@media print {
  header, nav, .reports-actions, footer { display:none !important; }
  body { background:#fff !important; }
  .app-view { display:none !important; }
  #reportsView { display:block !important; padding:0 !important; }
  .card,.report-kpi { box-shadow:none !important; break-inside:avoid; }
  .reports-kpi-grid { grid-template-columns:repeat(3,1fr); }
}


/* =========================================================
   WORKERS & SUBCONTRACTORS MANAGEMENT
========================================================= */
.worker-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-bottom:20px}.worker-table{min-width:1280px}.worker-filter{width:auto;min-width:145px}.worker-profile-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.worker-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.worker-modal-dialog{width:min(100%,760px)}.worker-contact{display:flex;flex-direction:column;gap:3px}.worker-contact small{color:var(--muted)}.worker-status{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800}.worker-status.active{background:var(--success-light);color:var(--success)}.worker-status.inactive{background:#eef1f4;color:#6b7280}.worker-name-link{border:0;background:transparent;padding:0;color:var(--primary);font:inherit;font-weight:800;cursor:pointer;text-align:left}.worker-name-link:hover{text-decoration:underline}.worker-type-badge{display:inline-flex;padding:5px 8px;border-radius:8px;background:var(--primary-light);color:var(--primary);font-size:11px;font-weight:800}.worker-rate{font-weight:800;white-space:nowrap}@media(max-width:1100px){.worker-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:800px){.worker-profile-grid{grid-template-columns:1fr}.worker-form-grid{grid-template-columns:1fr}}@media(max-width:600px){.worker-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.worker-filter{width:100%}}@media print{#workersView,#workerDetailView,#workerModal{display:none!important}}


/* ==========================================================
   DOCUMENTS & RECEIPTS MANAGEMENT
========================================================== */
.document-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.document-toolbar{gap:12px}.document-filter{width:auto;min-width:165px}.document-table{min-width:1180px}.document-name{display:flex;flex-direction:column;gap:3px;max-width:260px}.document-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.document-name small,.document-job-sub{display:block;color:var(--muted);font-size:.72rem;margin-top:3px}.document-category{display:inline-flex;padding:5px 9px;border-radius:999px;background:var(--primary-light);color:var(--primary);font-size:.72rem;font-weight:800;white-space:nowrap}.document-job-link{border:0;background:transparent;padding:0;color:#185483;font:inherit;font-weight:850;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.document-amount{font-weight:800;white-space:nowrap}.document-expense-link{max-width:230px;color:var(--muted);font-size:.78rem}.document-modal-dialog{width:min(100%,760px)}.document-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.document-help{color:var(--muted);font-size:.75rem;margin-top:4px}.document-upload-progress{margin-top:14px;padding:11px 13px;border-radius:10px;background:#eef5fb;color:#17466f;font-weight:800;text-align:center}.documents-view .saved-empty{margin:18px}.documents-view .action-pdf{background:#eef2ff;color:#4338ca}@media(max-width:950px){.document-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.document-toolbar{align-items:stretch;flex-wrap:wrap}.document-filter{min-width:0;flex:1}}@media(max-width:600px){.document-stats{grid-template-columns:1fr}.document-form-grid{grid-template-columns:1fr}.document-filter{width:100%;flex:auto}.document-toolbar{flex-direction:column}}
@media print{#documentsView,#documentModal{display:none!important}}


/* =========================================================
   COMPANY SETTINGS
========================================================= */
.settings-view{animation:savedViewFade .2s ease}.settings-profile-grid{display:grid;grid-template-columns:220px 1fr;gap:28px;align-items:start}.settings-logo-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px;border:1px solid var(--border);border-radius:15px;background:#f8fbfd}.settings-logo-preview{width:128px;height:128px;border-radius:20px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#f0b74e,#cf8b19);color:#102d49;font-size:36px;font-weight:900;box-shadow:0 10px 24px rgba(15,46,77,.14)}.settings-logo-preview img{width:100%;height:100%;object-fit:contain;background:#fff}.settings-logo-button{cursor:pointer;text-align:center}.settings-logo-card small{color:var(--muted);text-align:center}.settings-view .bottom-actions{margin-top:0}@media(max-width:800px){.settings-profile-grid{grid-template-columns:1fr}.settings-logo-card{max-width:280px}}@media print{#settingsView{display:none!important}}

/* =========================================================
   BACKUP & RESTORE
========================================================= */
.backup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:20px}.backup-card{margin-bottom:0}.backup-description{color:var(--muted);margin:-2px 0 18px;line-height:1.65}.backup-includes{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}.backup-includes span{display:inline-flex;padding:7px 10px;border-radius:999px;background:var(--primary-light);color:var(--primary);font-size:.75rem;font-weight:800;border:1px solid #d8e6f2}.backup-help{margin:14px 0 0;color:var(--muted);font-size:.82rem;line-height:1.55}.backup-warning{padding:14px 16px;margin:0 0 18px;border:1px solid #efd59e;border-radius:11px;background:#fff8e9;color:#78520d;font-size:.86rem;line-height:1.55}.backup-file-info{margin:12px 0 16px;padding:11px 13px;border:1px solid var(--border);border-radius:10px;background:#f8fafc;color:var(--muted);font-size:.83rem}.backup-routine{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.backup-routine>div{padding:16px;border:1px solid var(--border);border-radius:12px;background:#fbfdff}.backup-routine strong{display:block;color:#17334f;margin-bottom:5px}.backup-routine span{display:block;color:var(--muted);font-size:.83rem;line-height:1.5}@media(max-width:850px){.backup-grid,.backup-routine{grid-template-columns:1fr}}


/* =========================================================
   LOGIN & SECURITY
========================================================= */
.auth-gate{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:22px;background:linear-gradient(135deg,#0b253d 0%,#123b61 58%,#1c527f 100%)}
.auth-gate[hidden]{display:none!important}.auth-panel{width:min(100%,430px);background:#fff;border:1px solid rgba(255,255,255,.5);border-radius:22px;padding:30px;box-shadow:0 30px 80px rgba(3,20,34,.35)}
.auth-brand{display:flex;align-items:center;gap:14px;margin-bottom:20px}.auth-logo{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,#f0b74e,#cf8b19);color:#102d49;font-weight:900;box-shadow:0 8px 20px rgba(15,46,77,.18)}
.auth-brand .eyebrow{margin:0 0 2px;color:#a66e13}.auth-brand h1{margin:0;font-size:24px;color:#17324d}.auth-intro{color:#687386;margin:0 0 22px}.auth-panel .form-group{margin-bottom:15px}.auth-submit{width:100%;min-height:46px;margin-top:4px}.auth-error{margin:14px 0 0;padding:10px 12px;border-radius:9px;background:#fff0ee;color:#a93c33;font-size:13px;font-weight:700}.auth-security-note{margin:18px 0 0;color:#7a8796;font-size:11.5px;line-height:1.5;text-align:center}
@media(max-width:520px){.auth-panel{padding:23px;border-radius:18px}}

/* Company logo in main application header */
.header-brand-wrap{display:flex;align-items:flex-start;gap:16px;min-width:0}
.header-brand-copy{min-width:0}
.header-company-logo{width:62px;height:62px;flex:0 0 62px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(145deg,#f0b74e,#cf8b19);color:#102d49;font-weight:900;font-size:22px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.16)}
.header-company-logo img{width:100%;height:100%;object-fit:contain;background:#fff}
@media(max-width:760px){.header-brand-wrap{align-items:center}.header-company-logo{width:52px;height:52px;flex-basis:52px;border-radius:14px}}
@media print{.header-company-logo{box-shadow:none;border:1px solid #ddd}}


/* Standalone invoice creator */
.invoice-create-modal{width:min(1100px,94vw);max-height:92vh;display:flex;flex-direction:column;}
.invoice-create-scroll{overflow:auto;padding-right:4px;}
.invoice-create-heading{margin-top:22px;}
.invoice-create-pricing{margin-top:18px;}
#newInvItems input{min-width:90px;width:100%;padding:9px 10px;border:1px solid var(--border,#d9e0e7);border-radius:8px;}
#newInvItems .new-inv-desc{min-width:220px;}
.new-inv-remove{border:0;background:transparent;font-size:20px;cursor:pointer;color:#a33;padding:5px 8px;}
@media(max-width:700px){.invoice-create-modal{width:96vw}.invoice-create-modal .form-grid{grid-template-columns:1fr}.invoice-create-scroll{overflow-x:hidden}}

/* ==================================================
   FIX4 — DOCUMENT-ONLY PRINTING
   Estimate/Invoice print actions must never include the dashboard,
   reports, calendar, lists, or application navigation.
================================================== */
@media print {
  body.printing-estimate .app-header,
  body.printing-invoice .app-header,
  body.printing-estimate .app-footer,
  body.printing-invoice .app-footer,
  body.printing-estimate #dashboardView,
  body.printing-estimate #savedEstimatesView,
  body.printing-estimate #customersView,
  body.printing-estimate #customerDetailView,
  body.printing-estimate #jobsView,
  body.printing-estimate #jobDetailView,
  body.printing-estimate #calendarView,
  body.printing-estimate #workersView,
  body.printing-estimate #workerDetailView,
  body.printing-estimate #documentsView,
  body.printing-estimate #settingsView,
  body.printing-estimate #backupView,
  body.printing-estimate #reportsView,
  body.printing-estimate #invoicesView,
  body.printing-estimate #invoiceDetailView,
  body.printing-invoice #dashboardView,
  body.printing-invoice #savedEstimatesView,
  body.printing-invoice #customersView,
  body.printing-invoice #customerDetailView,
  body.printing-invoice #jobsView,
  body.printing-invoice #jobDetailView,
  body.printing-invoice #calendarView,
  body.printing-invoice #workersView,
  body.printing-invoice #workerDetailView,
  body.printing-invoice #documentsView,
  body.printing-invoice #settingsView,
  body.printing-invoice #backupView,
  body.printing-invoice #reportsView,
  body.printing-invoice #invoicesView,
  body.printing-invoice #estimatorView,
  body.printing-estimate .modal,
  body.printing-invoice .modal {
    display: none !important;
  }
  body.printing-estimate #estimatorView { display:block !important; }
  body.printing-invoice #invoiceDetailView { display:block !important; }
  body.printing-estimate #estimatorView .header-actions,
  body.printing-estimate #estimatorView .bottom-actions,
  body.printing-estimate #addItemBtn,
  body.printing-estimate .remove-item,
  body.printing-invoice #invoiceDetailView .header-actions,
  body.printing-invoice #recordPaymentBtn,
  body.printing-invoice #saveInvoiceBtn,
  body.printing-invoice #invoicePrintBtn { display:none !important; }
}

/* ==================================================
   FIX4 — YEAR CALENDAR
================================================== */
.calendar-year-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.calendar-year-month{border:1px solid #e3e8ef;border-radius:14px;background:#fff;padding:14px;min-width:0}.calendar-year-month h3{margin:0 0 10px;color:#172b4d;font-size:.95rem}.calendar-mini-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.calendar-mini-weekday{text-align:center;font-size:.62rem;font-weight:900;color:#98a2b3;padding:3px 0}.calendar-mini-day{position:relative;min-width:0;aspect-ratio:1;border:0;border-radius:6px;background:transparent;color:#475467;font:inherit;font-size:.68rem;font-weight:750;cursor:pointer}.calendar-mini-day:hover{background:#eef4fb}.calendar-mini-day.blank{pointer-events:none}.calendar-mini-day.today{box-shadow:inset 0 0 0 2px #c59b48;color:#10233f}.calendar-mini-day.has-events{background:#eaf1ff;color:#1949a3;font-weight:900}.calendar-mini-day.has-events::after{content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:#1d4ed8;bottom:2px;left:50%;transform:translateX(-50%)}@media(max-width:1000px){.calendar-year-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.calendar-year-grid{grid-template-columns:1fr}}

/* =========================================================
   FIX5 — STANDALONE INVOICE CREATOR MODAL
   Keep the invoice editor isolated from the Invoice Center.
========================================================= */
#newInvoiceModal{
  position:fixed;
  inset:0;
  z-index:50000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(7,25,42,.68);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  overflow:hidden;
}
#newInvoiceModal[hidden]{display:none!important;}
#newInvoiceModal .invoice-create-modal{
  position:relative;
  z-index:50001;
  width:min(1180px,96vw);
  height:min(900px,92vh);
  max-height:92vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(255,255,255,.75);
  border-radius:20px;
  box-shadow:0 34px 90px rgba(3,20,34,.38);
}
#newInvoiceModal .modal-header{
  flex:0 0 auto;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding:22px 26px 18px;
  margin:0;
  background:linear-gradient(135deg,#0e3557,#175989);
  border:0;
  color:#fff;
}
#newInvoiceModal .modal-header .eyebrow{color:#f4bf59;margin:0 0 4px;}
#newInvoiceModal .modal-header h2{color:#fff;margin:0 0 4px;font-size:25px;}
#newInvoiceModal .modal-header p:last-child{margin:0;color:rgba(255,255,255,.78);}
#newInvoiceModal .modal-close{
  flex:0 0 auto;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:11px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-size:27px;
  line-height:1;
}
#newInvoiceModal .modal-close:hover{background:rgba(255,255,255,.22);color:#fff;}
#newInvoiceModal .invoice-create-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:24px 26px;
  background:#f7f9fc;
}
#newInvoiceModal .invoice-create-scroll>.form-grid,
#newInvoiceModal .invoice-create-scroll>.form-group,
#newInvoiceModal .invoice-create-scroll>.table-wrapper,
#newInvoiceModal .invoice-create-scroll>.invoice-create-pricing{
  background:#fff;
  border:1px solid #e1e8ef;
  border-radius:14px;
}
#newInvoiceModal .invoice-create-scroll>.form-grid{padding:18px;gap:16px;}
#newInvoiceModal .invoice-create-scroll>.form-group{padding:18px;margin-top:16px;}
#newInvoiceModal .invoice-create-heading{margin:18px 0 10px;}
#newInvoiceModal .table-wrapper{overflow-x:auto;padding:0;margin:0;}
#newInvoiceModal .saved-estimates-table{margin:0;min-width:850px;}
#newInvoiceModal .invoice-create-pricing{padding:18px;margin-top:16px;}
#newInvoiceModal .modal-actions{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin:0;
  padding:16px 26px;
  background:#fff;
  border-top:1px solid #e1e8ef;
  box-shadow:0 -8px 24px rgba(16,50,77,.06);
}
#newInvoiceModal .modal-actions .btn{min-width:120px;}
body.invoice-modal-open{overflow:hidden;}
@media(max-width:760px){
  #newInvoiceModal{padding:10px;align-items:stretch;}
  #newInvoiceModal .invoice-create-modal{width:100%;height:calc(100vh - 20px);max-height:none;border-radius:15px;}
  #newInvoiceModal .modal-header{padding:17px 18px;}
  #newInvoiceModal .invoice-create-scroll{padding:16px;}
  #newInvoiceModal .invoice-create-scroll>.form-grid{grid-template-columns:1fr;padding:14px;}
  #newInvoiceModal .modal-actions{padding:12px 16px;}
}
@media print{#newInvoiceModal{display:none!important;}}

/* ==================================================
   FIX6 — CONSISTENT DOCUMENT BRANDING
================================================== */
.print-company-brand{display:none}
@media print{
  .print-company-brand{display:flex!important;align-items:center;gap:14px;padding:0 0 16px;margin:0 0 18px;border-bottom:2px solid #173b5f;break-inside:avoid}
  .print-company-brand img{display:block;width:auto;max-width:92px;height:auto;max-height:72px;object-fit:contain}
  .print-company-brand div{display:flex;flex-direction:column;gap:3px}
  .print-company-brand strong{font-size:18px;color:#173b5f}
  .print-company-brand span{font-size:10px;color:#526273}
}

/* ==================================================
   FIX10 — ESTIMATE APPROVAL & E-SIGNATURE
================================================== */
.approval-modal-dialog{width:min(760px,calc(100vw - 28px));max-height:calc(100vh - 40px);overflow:hidden;display:flex;flex-direction:column;background:#fff;border-radius:18px;box-shadow:0 24px 70px rgba(8,30,48,.28)}
.approval-modal-body{padding:22px 24px;overflow:auto;background:#f7f9fc}
.approval-status-card{padding:14px 16px;margin-bottom:16px;border:1px solid #dbe5ee;border-radius:12px;background:#fff;font-weight:700;color:#173b5f}
.approval-consent{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;margin-top:16px;border:1px solid #dbe5ee;border-radius:12px;background:#fff;font-size:13px;line-height:1.5;color:#425466}
.approval-consent input{margin-top:3px;flex:0 0 auto}
.approval-lock-note{margin-top:14px;padding:12px 14px;border-radius:10px;background:#fff7e6;border:1px solid #f0d08a;color:#6d5316;font-size:12.5px;line-height:1.45}
.approval-actions{display:flex;justify-content:flex-end;gap:10px;padding:15px 24px;border-top:1px solid #e1e8ef;background:#fff}
.approval-badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}
.approval-badge.status-accepted{background:#e8f7ee;color:#176b3a}
.approval-badge.status-declined{background:#fdecec;color:#a12b2b}
.approval-badge.status-sent{background:#eaf2ff;color:#285d9c}
.approval-badge.status-draft{background:#eef2f6;color:#526273}
.action-approval{border-color:#c8d8e7!important;background:#f7fbff!important;color:#174d78!important}
@media(max-width:680px){.approval-actions{flex-wrap:wrap}.approval-actions .btn{flex:1 1 45%}.approval-modal-body{padding:16px}}
@media print{#estimateApprovalModal{display:none!important}}

/* ==================================================
   FIX10A — CUSTOMER APPROVAL MODAL LAYOUT REPAIR
   Keeps the approval form contained, readable and responsive.
================================================== */
#estimateApprovalModal{
  position:fixed!important;
  inset:0!important;
  z-index:5000!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  overflow:hidden!important;
}
#estimateApprovalModal[hidden]{display:none!important}
#estimateApprovalModal .modal-backdrop{
  position:absolute!important;
  inset:0!important;
  background:rgba(7,27,44,.64)!important;
  backdrop-filter:blur(4px)!important;
}
#estimateApprovalModal .approval-modal-dialog{
  position:relative!important;
  z-index:1!important;
  width:min(900px,calc(100vw - 48px))!important;
  max-width:900px!important;
  height:auto!important;
  max-height:calc(100vh - 48px)!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  background:#fff!important;
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:20px!important;
  box-shadow:0 30px 90px rgba(5,24,40,.34)!important;
}
#estimateApprovalModal .modal-header{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:20px!important;
  margin:0!important;
  padding:22px 24px!important;
  border-bottom:1px solid #dfe7ef!important;
  background:linear-gradient(135deg,#0d3a5e,#155f91)!important;
}
#estimateApprovalModal .modal-header .eyebrow{
  margin:0 0 4px!important;
  color:#f2bb4e!important;
  font-size:11px!important;
  letter-spacing:.14em!important;
}
#estimateApprovalModal .modal-header h2{
  margin:0 0 5px!important;
  color:#fff!important;
  font-size:24px!important;
  line-height:1.2!important;
}
#estimateApprovalModal #approvalEstimateLabel{
  margin:0!important;
  color:rgba(255,255,255,.82)!important;
  font-size:13px!important;
  line-height:1.45!important;
  overflow-wrap:anywhere!important;
}
#estimateApprovalModal .modal-close{
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:rgba(255,255,255,.12)!important;
  color:#fff!important;
}
#estimateApprovalModal .approval-modal-body{
  flex:1 1 auto!important;
  min-height:0!important;
  width:100%!important;
  padding:22px 24px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  background:#f6f9fc!important;
}
#estimateApprovalModal .approval-status-card{
  width:100%!important;
  box-sizing:border-box!important;
  padding:13px 15px!important;
  margin:0 0 18px!important;
  border:1px solid #d8e3ed!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#173b5f!important;
  line-height:1.5!important;
  overflow-wrap:anywhere!important;
}
#estimateApprovalModal .form-grid{
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:16px!important;
  align-items:start!important;
}
#estimateApprovalModal .form-group{
  min-width:0!important;
  width:100%!important;
  margin:0 0 16px!important;
}
#estimateApprovalModal .form-group label{
  display:block!important;
  margin:0 0 7px!important;
  color:#34495e!important;
  font-size:13px!important;
  font-weight:800!important;
}
#estimateApprovalModal input[type="text"],
#estimateApprovalModal input:not([type]),
#estimateApprovalModal textarea{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  border:1px solid #cbd9e6!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#172b3f!important;
  font:inherit!important;
}
#estimateApprovalModal input[type="text"],
#estimateApprovalModal input:not([type]){
  min-height:46px!important;
  padding:10px 12px!important;
}
#estimateApprovalModal textarea{
  min-height:92px!important;
  padding:11px 12px!important;
  resize:vertical!important;
}
#estimateApprovalModal .approval-consent{
  width:100%!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:22px minmax(0,1fr)!important;
  gap:11px!important;
  align-items:start!important;
  margin:2px 0 0!important;
  padding:14px 15px!important;
  border:1px solid #cfe0ee!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#425466!important;
  font-size:13px!important;
  line-height:1.55!important;
}
#estimateApprovalModal .approval-consent input[type="checkbox"]{
  appearance:auto!important;
  -webkit-appearance:checkbox!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  margin:2px 0 0!important;
  padding:0!important;
}
#estimateApprovalModal .approval-consent span{
  display:block!important;
  min-width:0!important;
  width:auto!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
#estimateApprovalModal .approval-lock-note{
  width:100%!important;
  box-sizing:border-box!important;
  margin:14px 0 0!important;
  padding:13px 15px!important;
  border-radius:11px!important;
  background:#fff7e6!important;
  border:1px solid #efd08b!important;
  color:#6d5316!important;
  font-size:13px!important;
  line-height:1.5!important;
  overflow-wrap:anywhere!important;
}
#estimateApprovalModal .approval-actions{
  flex:0 0 auto!important;
  width:100%!important;
  box-sizing:border-box!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:10px!important;
  margin:0!important;
  padding:16px 24px!important;
  border-top:1px solid #dfe7ef!important;
  background:#fff!important;
}
#estimateApprovalModal .approval-actions .btn{
  min-height:44px!important;
  padding:10px 18px!important;
  white-space:nowrap!important;
}
@media(max-width:720px){
  #estimateApprovalModal{padding:10px!important;align-items:stretch!important}
  #estimateApprovalModal .approval-modal-dialog{width:100%!important;max-width:none!important;max-height:calc(100vh - 20px)!important;margin:auto!important;border-radius:15px!important}
  #estimateApprovalModal .modal-header{padding:17px 18px!important}
  #estimateApprovalModal .modal-header h2{font-size:20px!important}
  #estimateApprovalModal .approval-modal-body{padding:16px!important}
  #estimateApprovalModal .form-grid{grid-template-columns:1fr!important;gap:0!important}
  #estimateApprovalModal .approval-actions{padding:12px 16px!important;flex-wrap:wrap!important}
  #estimateApprovalModal .approval-actions .btn{flex:1 1 145px!important}
}
@media print{#estimateApprovalModal{display:none!important}}

/* FIX11 Contracts + Change Orders */
.contract-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:16px 0}.contract-panel{padding:18px;border:1px solid var(--border);border-radius:16px;background:#f8fbff;margin:14px 0}.contract-actions{justify-content:flex-end;margin-top:12px}.change-order-heading{margin-top:24px}.co-action{white-space:nowrap}.co-status{font-weight:800}.co-approved{color:#087443}.co-draft{color:#8a5a00}.co-declined{color:#a52a2a}@media(max-width:900px){.contract-summary-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.contract-summary-grid{grid-template-columns:1fr}}

/* FIX13 — Customer Communication Center */
.communication-local-badge{font-size:.78rem;font-weight:800;letter-spacing:.03em;color:var(--muted);background:#f5f7fa;border:1px solid var(--border);border-radius:999px;padding:7px 11px}.communication-compose{padding-top:4px}.communication-actions{margin-top:14px;flex-wrap:wrap}.communication-history-heading{margin-top:28px;padding-top:22px;border-top:1px solid var(--border)}.communication-history-heading h3{margin:0}.communication-status{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:.75rem;font-weight:800;background:#eaf7ef;color:#19633a}.communication-card textarea{resize:vertical;min-height:150px}@media(max-width:720px){.communication-local-badge{display:none}.communication-actions .btn{width:100%}}
/* FIX14 — Live Gmail sending */
#gmailStatus{display:inline-flex;align-items:center;min-height:40px;font-weight:700}
#gmailAppPassword{letter-spacing:.08em}
.communication-local-badge{white-space:nowrap}
@media (max-width:720px){#gmailStatus{width:100%}.communication-local-badge{white-space:normal}}