/* Interior estimator summary rail actions
   Presentation only: contains the inspector and keeps the shared save and
   customer-approval actions readable with softly translucent treatments. */
.painting-reference-summary,
.painting-reference-summary > .paint-summary-card,
.painting-reference-summary > .paint-summary-card > *,
.painting-reference-summary .painting-financial-grid > label,
.painting-reference-summary .painting-financial-grid > div,
.painting-reference-summary .paint-room-breakdown,
.painting-reference-summary .painting-customer-display,
.painting-reference-summary .painting-summary-utilities,
.painting-reference-summary .summary-actions,
.painting-reference-summary .painting-summary-approval,
.painting-reference-summary .painting-summary-destinations {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.painting-reference-summary > .paint-summary-card {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-height: 100% !important;
  overflow: hidden !important;
}

.painting-reference-summary .painting-financial-grid > label,
.painting-reference-summary .painting-financial-grid > div {
  grid-template-columns: 32px minmax(0, 1fr) minmax(64px, 88px) !important;
  column-gap: 8px !important;
  width: auto !important;
}

.painting-reference-summary .painting-financial-grid span,
.painting-reference-summary .paint-room-breakdown span {
  min-width: 0 !important;
  overflow-wrap: anywhere;
}

.painting-reference-summary .painting-financial-grid :is(input, strong) {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 88px !important;
  box-sizing: border-box !important;
}

.painting-reference-summary .paint-room-breakdown > div {
  grid-template-columns: minmax(0, 1fr) auto !important;
  min-width: 0 !important;
}

.painting-reference-summary .summary-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.painting-reference-summary .summary-actions :is(.btn, .primary) {
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 42px !important;
  padding: 8px 9px !important;
  border: 1px solid #3b566b !important;
  border-radius: 6px !important;
  background: rgba(73, 109, 134, 0.14) !important;
  box-shadow: none !important;
  color: #eaf3f8 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
}

.painting-reference-summary .summary-actions .primary {
  border-color: #ff7a12 !important;
  background: rgba(255, 122, 18, 0.12) !important;
  color: #ff9a4f !important;
}

.painting-reference-summary .summary-actions :is(.btn, .primary):is(:hover, :focus-visible) {
  background: rgba(86, 136, 168, 0.22) !important;
  border-color: #f4f8fb !important;
  color: #ffffff !important;
  outline: none !important;
}

.painting-reference-summary .summary-actions .primary:is(:hover, :focus-visible) {
  background: rgba(255, 122, 18, 0.2) !important;
  border-color: #ff9a4f !important;
}

.painting-module-shell .painting-module-actions [data-estimate-save-draft] {
  border-color: #54748b !important;
  background: rgba(73, 109, 134, 0.14) !important;
  box-shadow: none !important;
  color: #eaf3f8 !important;
}

.painting-module-shell .painting-module-actions [data-estimate-save-return] {
  border-color: #ff7a12 !important;
  background: rgba(255, 122, 18, 0.12) !important;
  box-shadow: none !important;
  color: #ffb06b !important;
}

.painting-module-shell .painting-module-actions [data-estimate-save-draft]:is(:hover, :focus-visible) {
  border-color: #8bb7d1 !important;
  background: rgba(86, 136, 168, 0.22) !important;
  color: #ffffff !important;
}

.painting-module-shell .painting-module-actions [data-estimate-save-return]:is(:hover, :focus-visible) {
  border-color: #ff9a4f !important;
  background: rgba(255, 122, 18, 0.2) !important;
  color: #ffffff !important;
}

.painting-summary-approval {
  display: grid;
  gap: 10px;
  margin: 12px 11px 0 !important;
  padding: 13px 0 0;
  border-top: 1px solid #294356;
}

.painting-summary-approval > header {
  display: grid !important;
  gap: 3px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.painting-summary-approval > header small {
  color: #ff8a1f;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.painting-summary-approval > header strong {
  color: #f5f9fc;
  font-size: 13px;
  line-height: 1.25;
}

.painting-summary-approval-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.painting-summary-approval-actions .proposal-acceptance-actions {
  display: contents !important;
}

.painting-summary-approval-actions [aria-disabled="true"] {
  opacity: 0.62 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

.painting-summary-approval-actions :is(.btn, .primary, .proposal-flow-accepted) {
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 8px 11px !important;
  border-radius: 6px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 11.5px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  text-align: left !important;
  white-space: normal !important;
}

.painting-summary-approval-actions :is(.btn, .primary) svg,
.painting-summary-approval-actions .proposal-flow-accepted svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-flow-preview {
  border-color: #4d98ff !important;
  background: rgba(77, 152, 255, 0.1) !important;
  color: #d9eaff !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-flow-send {
  border-color: #ff7a12 !important;
  background: rgba(255, 122, 18, 0.12) !important;
  color: #ffb06b !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-accept-with-signature {
  border-color: #00d7ff !important;
  background: rgba(0, 215, 255, 0.1) !important;
  color: #b9f5ff !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-accept-without-signature {
  border-color: #b85cff !important;
  background: rgba(184, 92, 255, 0.1) !important;
  color: #ebccff !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-flow-accepted {
  border: 1px solid #1b9c56;
  background: rgba(27, 156, 86, 0.12) !important;
  color: #65e49a !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-flow-preview:is(:hover, :focus-visible) {
  background: rgba(77, 152, 255, 0.18) !important;
  border-color: #76afff !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-flow-send:is(:hover, :focus-visible) {
  background: rgba(255, 122, 18, 0.2) !important;
  border-color: #ff9a4f !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-accept-with-signature:is(:hover, :focus-visible) {
  background: rgba(0, 215, 255, 0.18) !important;
  border-color: #34e1ff !important;
}

.premium-app .painting-reference-summary .painting-summary-approval-actions .proposal-accept-without-signature:is(:hover, :focus-visible) {
  background: rgba(184, 92, 255, 0.18) !important;
  border-color: #cc85ff !important;
}

.painting-summary-destinations {
  display: grid;
  gap: 10px;
  margin: auto 11px 12px !important;
  padding: 14px 0 0;
  border-top: 1px solid #294356;
}

.painting-summary-destinations > header {
  display: grid;
  gap: 3px;
}

.painting-summary-destinations > header small {
  color: #ff8a1f;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.painting-summary-destinations > header strong {
  color: #f5f9fc;
  font-size: 13px;
  line-height: 1.25;
}

.painting-summary-destination-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.painting-summary-destination-actions .painting-summary-destination {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 9px 11px;
  border: 1px solid #18c7e8 !important;
  border-radius: 6px;
  background: transparent !important;
  box-shadow: none !important;
  color: #dffaff !important;
  font: inherit;
  font-size: 11.5px;
  font-weight: 750;
  line-height: 1.25;
  text-align: left;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
}

.painting-summary-destination-actions .painting-summary-destination::after {
  content: "\2192";
  flex: 0 0 auto;
  margin-left: 10px;
  font-size: 16px;
  line-height: 1;
}

.painting-summary-destination-actions .customer-preview {
  border-color: #a45cff !important;
  color: #eadcff !important;
}

.painting-summary-destination-actions .painting-summary-destination.active {
  background: transparent !important;
  border-color: #71e7fa !important;
  box-shadow: inset 3px 0 0 #18c7e8 !important;
  color: #ffffff !important;
}

.painting-summary-destination-actions .painting-summary-destination:is(:hover, :focus-visible) {
  background: rgba(24, 199, 232, 0.08) !important;
  border-color: #71e7fa !important;
  color: #ffffff !important;
  outline: none;
}

.painting-summary-destination-actions .customer-preview:is(:hover, :focus-visible) {
  background: rgba(164, 92, 255, 0.1) !important;
  border-color: #c799ff !important;
}

@media (max-width: 1320px) {
  .painting-reference-summary .summary-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Keep room-item labels on a native, fully opaque text layer at every width. */
.painting-module-shell.interior .painting-reference-room .paint-item-main strong {
  font-size: 14px !important;
  line-height: 1.2 !important;
  text-shadow: none !important;
  filter: none !important;
  transform: none !important;
  font-synthesis: none !important;
  text-rendering: auto !important;
  -webkit-font-smoothing: auto !important;
}

.painting-module-shell.interior .painting-reference-room .paint-item-row.is-off .paint-item-main {
  opacity: 1 !important;
}

/* Desktop readability balance
   The estimator remains the primary working surface while the inspector gains
   enough width and type size to scan totals, room scope, and approval actions. */
@media (min-width: 1321px) {
  .proposal-section-shell:has(.painting-module-shell) .pe-layout {
    grid-template-columns: minmax(0, 1fr) 390px !important;
    gap: 14px !important;
  }

  .painting-module-shell.interior {
    font-size: 14.25px !important;
  }

  .painting-module-title span,
  .painting-room-name-label,
  .painting-reference-room .paint-base-price span {
    font-size: 11px !important;
  }

  .painting-module-title h2 {
    font-size: 20px !important;
  }

  .painting-module-title p,
  .painting-module-title > div:last-child > b,
  .painting-module-workflow em,
  .painting-reference-tabs :is(button, a),
  .painting-reference-room .paint-room-top > div > span,
  .painting-reference-section > summary :is(span, b),
  .painting-room-actions :is(.btn, .primary, .outline-danger),
  .painting-module-footer :is(button, span) {
    font-size: 13px !important;
  }

  .painting-reference-rooms .paint-room-head strong,
  .painting-reference-rooms .paint-add-room,
  .painting-reference-rooms .paint-room-main strong,
  .painting-whole-home-card strong,
  .painting-reference-section > summary strong {
    font-size: 14px !important;
  }

  .painting-reference-rooms .paint-room-head span,
  .painting-reference-rooms .paint-room-main :is(span, small),
  .painting-whole-home-card :is(span, label),
  .painting-reorder-button {
    font-size: 12px !important;
  }

  .painting-reference-rooms .paint-room-main > b {
    font-size: 16px !important;
  }

  .painting-module-shell.interior .painting-grouped-table th {
    height: 32px !important;
    font-size: 12px !important;
  }

  .painting-module-shell.interior .painting-grouped-table .paint-item-row td {
    height: 40px !important;
    min-height: 40px !important;
    font-size: 13.5px !important;
  }

  .painting-module-shell .painting-section-row,
  .painting-module-shell .painting-section-row td {
    height: 32px !important;
    min-height: 32px !important;
  }

  .painting-module-shell.interior .painting-section-row strong,
  .painting-module-shell.interior .paint-item-main strong,
  .painting-module-shell.interior .paint-closet-head .paint-item-main strong {
    font-size: 14px !important;
    line-height: 1.2 !important;
    text-shadow: none !important;
    filter: none !important;
    transform: none !important;
    font-synthesis: none !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: auto !important;
  }

  .painting-module-shell.interior .painting-reference-room .paint-item-row.is-off .paint-item-main {
    opacity: 1 !important;
  }

  .painting-module-shell.interior .painting-section-row span,
  .painting-module-shell.interior .paint-item-main small,
  .painting-module-shell.interior .paint-closet-head .paint-item-main small,
  .painting-module-shell.interior .paint-closet-price small {
    font-size: 11.5px !important;
  }

  .painting-module-shell.interior :is(.paint-desc-input, .paint-price-input, .room-edit-input),
  .painting-module-shell.interior .paint-qty-stepper :is(button, input),
  .painting-module-shell.interior .paint-included,
  .painting-module-shell.interior .paint-door-side-options :is(label, button, span) {
    font-size: 13px !important;
  }

  .painting-reference-summary .painting-financial-grid > label,
  .painting-reference-summary .painting-financial-grid > div {
    grid-template-columns: 40px minmax(0, 1fr) minmax(96px, 124px) !important;
    column-gap: 10px !important;
  }

  .painting-reference-summary .painting-financial-grid :is(input, strong) {
    max-width: 124px !important;
  }

  /* Editable cost fields only need enough room for the number. Keeping these
     compact gives the labor and materials labels the readable space instead. */
  .painting-reference-summary .painting-financial-grid > label:is(.labor, .materials) {
    grid-template-columns: 40px minmax(0, 1fr) 84px !important;
  }

  .painting-reference-summary .painting-financial-grid > label:is(.labor, .materials) input[data-paint-cost] {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    justify-self: end !important;
  }

  .painting-reference-summary .painting-summary-head h3 {
    display: -webkit-box !important;
    max-width: 100% !important;
    overflow: hidden !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  .painting-reference-summary .paint-summary-lines > div,
  .painting-reference-summary .paint-room-breakdown > div,
  .painting-reference-summary .painting-financial-grid :is(span, label),
  .painting-reference-summary .pe-deposit :is(span, small),
  .painting-customer-display,
  .painting-customer-display select {
    font-size: 14.5px !important;
  }

  .painting-reference-summary .paint-room-breakdown h4,
  .painting-reference-summary .painting-summary-approval > header strong,
  .painting-reference-summary .painting-summary-destinations > header strong {
    font-size: 15.5px !important;
  }

  .painting-reference-summary .pe-investment strong {
    font-size: 32px !important;
  }

  .painting-reference-summary .painting-selected-total strong {
    font-size: 21px !important;
  }

  .painting-reference-summary .painting-internal-costs :is(label, span, input, strong),
  .painting-reference-summary .painting-summary-utilities button,
  .painting-reference-summary .summary-actions :is(.btn, .primary),
  .painting-reference-summary .painting-summary-approval-actions :is(.btn, .primary, .proposal-flow-accepted),
  .painting-reference-summary .painting-summary-destination-actions .painting-summary-destination {
    font-size: 14px !important;
  }

  .painting-reference-summary .painting-customer-safe,
  .painting-reference-summary .painting-internal-costs > small {
    font-size: 11.5px !important;
    line-height: 1.4 !important;
  }

  .painting-reference-summary .painting-summary-total span,
  .painting-reference-summary .painting-summary-total small,
  .painting-reference-summary .painting-summary-health small,
  .painting-reference-summary .painting-summary-health em {
    font-size: 11.5px !important;
  }

  .painting-reference-summary .painting-summary-health strong {
    font-size: 18px !important;
  }

  .painting-reference-summary .painting-summary-approval > header small {
    font-size: 11.5px !important;
  }

  .painting-reference-summary .painting-summary-approval-actions :is(.btn, .primary, .proposal-flow-accepted) {
    min-height: 48px !important;
    padding: 10px 13px !important;
    font-size: 14.5px !important;
  }
}

@media (min-width: 1321px) and (max-width: 1550px) {
  .proposal-section-shell:has(.painting-module-shell) .pe-layout {
    grid-template-columns: minmax(0, 1fr) 340px !important;
  }
}

/* Desktop rail balance
   Reclaim the space consumed by the inspector's redundant outer card. The
   useful summary sections keep their own boundaries, while the rail itself is
   slightly wider and the approved room editor remains the primary surface. */
@media (min-width: 1321px) {
  .proposal-section-shell:has(.painting-module-shell) .pe-layout,
  .painting-proposal-flow > .pe-layout:has(.painting-module-shell) {
    grid-template-columns: minmax(0, 1fr) clamp(390px, 29.5vw, 480px) !important;
    gap: 10px !important;
  }

  .painting-reference-summary {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .painting-reference-summary > .paint-summary-card {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}