/* Painter Pro editor controls, scrolling, and first-time-user readability. */

body:has(.painting-template-modal) { overflow: hidden; }

.painting-template-modal-dialog {
  scrollbar-width: none;
  scroll-behavior: smooth;
}
.painting-template-modal-dialog::-webkit-scrollbar { width: 0; height: 0; }

.painting-scope-template-heading > div > span,
.painting-template-bottom p {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.painting-scope-template-heading > div > span svg,
.painting-template-bottom p svg { width: 17px; height: 17px; color: #55e893; }

.painting-template-item-type {
  display: grid;
  grid-template-columns: repeat(2,minmax(145px,1fr));
  gap: 8px;
  min-width: 330px;
  margin: 0;
  padding: 10px;
  border: 1px solid #40586a;
  border-radius: 10px;
}
.painting-template-item-type legend { padding: 0 5px; color: #b9c9d6; font-size: 13px; font-weight: 700; }
.painting-template-item-type label {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid #50687b;
  border-radius: 8px;
  color: #d9e4ec;
  cursor: pointer;
}
.painting-template-item-type label:has(input:checked) { border-color: #f58216; background: #20150d; color: #fff; }
.painting-template-item-type input { width: 19px !important; min-height: 19px !important; accent-color: #f58216; }
.painting-template-item-type label > span { margin: 0; }

/* Keep the helper where users look for the next writing action. */
.painting-template-scope > header { justify-content: space-between; }
.painting-template-scope > header [data-paint-template-improve] { margin-left: auto; }

/* The money control is one field, not a card inside another card. */
.painting-template-money input,
.painting-template-money input:focus {
  border: 0 !important;
  border-radius: 0 6px 6px 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}
.painting-template-money:focus-within {
  border-color: #f58216 !important;
  box-shadow: 0 0 0 3px rgba(245,130,22,.18) !important;
}

/* Important actions remain visible while the long editor scrolls. */
.painting-template-bottom {
  position: sticky;
  z-index: 15;
  bottom: 0;
  grid-template-columns: minmax(210px,auto) minmax(0,1fr);
  align-items: center;
  gap: 18px;
  margin: 14px 0 0;
  padding: 12px 14px;
  border: 1px solid #344d5f;
  border-radius: 11px;
  background: rgba(4,10,15,.97);
  box-shadow: 0 -16px 34px rgba(0,0,0,.36);
  backdrop-filter: blur(12px);
}
.painting-template-bottom > div:first-child,
.painting-template-bottom > div:last-child { display: flex; align-items: center; gap: 10px; }
.painting-template-bottom > div:first-child { justify-content: flex-start; }
.painting-template-bottom > div:last-child { justify-content: flex-end; }
.painting-template-bottom p { color: #8de9b5; font-weight: 750; }
.painting-template-bottom button { white-space: nowrap; }
.painting-template-bottom .btn {
  border-color: #41596c !important;
  background: #101d28 !important;
  color: #eef5fa !important;
}
.painting-template-bottom button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.painting-template-bottom .painting-template-delete {
  border-color: #723843 !important;
  color: #ffadb5 !important;
  background: #1b0d12 !important;
}

/* Make Included work and each saved service easier to scan. */
.review-checklist-group.included > header {
  min-height: 88px;
  padding-block: 14px;
}
.review-checklist-group.included > header h3 { font-size: 25px; line-height: 1.15; }
.review-checklist-group.included > header p { font-size: 15px; }
.review-checklist-group.included .review-checklist-row {
  min-height: 84px;
  padding-block: 13px;
}
.review-checklist-group.included .review-row-status { min-height: 42px; font-size: 14px; }
.review-checklist-group.included .review-row-service strong { font-size: 18px; line-height: 1.25; }
.review-checklist-group.included .review-row-service small,
.review-checklist-group.included .review-row-description { font-size: 14px; }
.review-checklist-group.included .review-row-price { font-size: 18px; color: #ff922f; }

@media (max-width: 900px) {
  .painting-template-item-type { min-width: 0; grid-template-columns: 1fr; }
  .painting-template-bottom { grid-template-columns: 1fr; }
  .painting-template-bottom > div:last-child { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .painting-template-bottom > div:last-child .primary { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
  .painting-template-modal-dialog > .painting-scope-template-shell { padding-bottom: 8px; }
  .painting-scope-template-heading { display: grid; grid-template-columns: minmax(0,1fr); }
  .painting-template-item-type { width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .painting-template-scope > header { align-items: flex-start; }
  .painting-template-scope > header [data-paint-template-improve] { max-width: 58%; text-align: left; }
  .painting-template-bottom { bottom: 0; padding: 10px; border-radius: 10px 10px 0 0; }
  .painting-template-bottom > div:first-child { justify-content: space-between; }
  .painting-template-bottom > div:last-child { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .painting-template-bottom > div:last-child .primary { grid-column: 1 / -1; }
  .painting-template-bottom button { min-width: 0 !important; width: 100%; padding-inline: 9px !important; }
  .review-checklist-group.included > header h3 { font-size: 23px; }
  .review-checklist-group.included .review-checklist-row { min-height: 0; padding-block: 16px; }
}