
#renewal-form label,#review label,#review .form-help,#review .renewal-share p,.file-tools p {
  font-size:1rem;
  line-height:1.5;
}
#renewal-form input:not([type=checkbox]),#renewal-form select,#review input:not([type=checkbox]),#review textarea {
  font-size:1rem;
  min-height:44px;
}
#renewal-form button,#review button,.file-tools button,#review .renewal-invitations summary {
  min-height:44px;
}
#review .renewal-invitations summary {align-content:center}
#renewal-form :is(button,input,select,textarea):focus-visible,
#review :is(button,input,textarea,summary,a):focus-visible,.file-tools button:focus-visible {
  outline:3px solid #28604b;
  outline-offset:3px;
}
#review #signed-pdf:disabled {opacity:1;background:#e4ede6;color:#40574a;border-color:#aebfb3;cursor:default}

.renewal-steps {margin:1rem 0;padding:1rem;background:#f1f5ee;border:1px solid #b8c9b9;border-radius:8px;color:#203c32}
.renewal-steps[hidden],#az-sign-jump[hidden],#az-step-help[hidden] {display:none!important}
.renewal-steps ol {display:flex;flex-wrap:wrap;gap:.5rem 2.25rem;margin:0;padding-inline-start:1.5rem}
.renewal-steps li {padding:.3rem .25rem;line-height:1.4}
.renewal-steps [aria-current=step] {font-weight:750;text-decoration:underline;text-underline-offset:.22em}
.renewal-steps p {margin:.65rem 0 0;line-height:1.55}
#az-sign-jump a {display:inline-flex;align-items:center;min-height:44px;font-weight:700}
#sign-title {scroll-margin-block-start:5rem}
#errors strong {display:block;margin-block-end:.5rem}
@media(max-width:600px){.renewal-steps ol {flex-direction:column;gap:.15rem}}

/* Keep the document wider than a phone while the rest of the tool fits. */
@media (max-width: 700px) {
  .az-paper .renewal-paper-scroll {
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    margin-inline: 0;
  }
  .az-paper .renewal-paper-scroll .az-paper-sheet {
    min-width: 640px;
    margin-inline: 0;
  }
  .az-paper .az-start-area > .renewal-paper-scroll { grid-area: 1 / 1; }
  .renewal-paper-pan-help { margin: .5rem 10px; color: #40574a; }
  #review .signer-row:not(.signer-head) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    padding: 12px;
    gap: 8px;
  }
  #review .signer-person { grid-column: 1 / -1; }
  #review .signer-head { display: none; }
  #review .signer-action { width: 100%; min-height: 44px; }
  #review .renewal-invitations :is(input, textarea) {
    max-width: 100%;
    box-sizing: border-box;
  }
  #review .renewal-invitations :is(button, summary) { min-height: 44px; }
  #sign-dialog { box-sizing: border-box; overflow: auto; }
  #sign-dialog button { min-height: 44px; }
}
@media (min-width: 701px) {
  .renewal-paper-pan-help { display: none; }
}

.renewal-blank-link:not([hidden]) {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin: 0 10px .5rem;
  color: #214c3d;
  font-weight: 700;
  text-underline-offset: .18em;
}
@media (max-width: 700px) {
  #renewal-form.az-paper .renewal-paper-scroll .az-paper-sheet .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #renewal-form.az-paper .renewal-paper-scroll .az-paper-sheet .wide {
    grid-column: 1 / -1;
  }
  #renewal-form.az-paper .renewal-paper-scroll .grid > label {
    font-size: .875rem;
    gap: 3px;
  }
  #renewal-form.az-paper #term input[type="date"] {
    width: min(100%, 176px);
    min-height: 44px;
    padding-block: 4px;
  }
}


@media (max-width: 700px) {
  #renewal-form.az-paper .renewal-paper-scroll .grid > label {
    font-size: 12px;
    line-height: 1.35;
  }
  #renewal-form.az-paper #term input[type="date"] {
    padding-inline-end: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23214c3d' stroke-width='1.7'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M8 3v5m8-5v5M4 10h16'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 9px center;
    background-size: 18px;
  }
  #renewal-form.az-paper #term input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
  }
}
@media (prefers-reduced-motion: no-preference) {
  #renewal-form.az-paper .az-active-field :is(input,select,textarea) {
    animation: az-field-pulse 1.6s ease-in-out infinite;
  }
}
/* Keep the guide centered beneath the agreement, with a readable text measure. */
main :is(#state-guidance, #az-renewal-guide).az-renewal-guide {
  width: min(920px, calc(100% - 20px));
  max-width: none;
  margin-inline: auto;
  padding-inline: clamp(16px, 5vw, 48px);
}
main :is(#state-guidance, #az-renewal-guide).az-renewal-guide > * {
  max-width: 72ch;
  margin-inline: auto;
}
/* State pages already opened from the directory have their state preselected. */
body[data-renewal-state] #scope > legend,
body[data-renewal-state] #scope > .grid:has(> label > #state) {
  display: none;
}
/* Match the contract's printed palette. Interactive controls keep their accents. */
#renewal-form.az-paper .az-paper-sheet {
  background: #fff;
  color: #161616;
  border-color: #bdbdbd;
  border-top-color: #262626;
  box-shadow: 0 2px 6px #00000014;
}
#renewal-form.az-paper .az-paper-sheet :is(.az-sheet-header,.az-sheet-subtitle,.az-sheet-section,legend) {
  color: #161616;
}
#renewal-form.az-paper .az-paper-sheet .az-sheet-section { background: #f0f0f0; }
#renewal-form.az-paper .az-paper-sheet .grid { background: #ccc; }
#renewal-form.az-paper .az-paper-sheet .grid > label { box-shadow: 0 0 0 1px #ccc; }
#renewal-form.az-paper .az-paper-sheet :is(input:not([type=checkbox]),select,textarea) {
  color: #161616;
  border-color: #888;
  background-color: #f7f7f7;
}
#renewal-form.az-paper .az-paper-sheet #term input[type="date"] {
  background-color: #f7f7f7;
}
#renewal-form.az-paper .az-paper-sheet :is(input,select,textarea):focus { background-color: #edf6ee; }
#review.az-review :is(#review-content,#signers) { color: #161616; }
#review.az-review #signers { border-top-color: #262626; }
#review.az-review .signer-role { color: #161616; }
@media (max-width: 700px) {
  #renewal-form.az-paper #term label:has(> input[type="date"]) {
    position: relative;
  }
  #renewal-form.az-paper #term label:has(> input[type="date"])::before {
    content: "";
    position: absolute;
    inset-inline-start: min(166px, calc(100% - 28px));
    inset-block-end: 21px;
    width: 18px;
    height: 17px;
    border: 2px solid #214c3d;
    border-radius: 3px;
    background: linear-gradient(#214c3d, #214c3d) 0 4px / 100% 2px no-repeat;
    pointer-events: none;
    z-index: 1;
  }
  #renewal-form.az-paper .az-paper-sheet #term input[type="date"] {
    background-image: none;
    padding-inline-end: 32px;
  }
}
.renewal-date-control { position: relative; width: min(100%, 176px); }
#renewal-form.az-paper #term .renewal-date-control input[type="date"] {
  width: 100%;
  padding-inline-end: 34px;
}
.renewal-calendar-icon { display: none; }
@media (max-width: 700px) {
  .renewal-calendar-icon {
    display: block;
    position: absolute;
    inset-inline-end: 9px;
    inset-block-start: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 17px;
    border: 2px solid #214c3d;
    border-radius: 3px;
    background: linear-gradient(#214c3d, #214c3d) 0 4px / 100% 2px no-repeat;
    pointer-events: none;
  }
}
@media (min-width: 701px) {
  .renewal-date-control { width: 100%; }
}
#sign-dialog .signature-dialog-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
#sign-dialog .signature-close {
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  font-size: 24px;
}
@media (max-width: 700px) {
  #sign-dialog { padding: 12px; }
  #sign-dialog h2 { font-size: 1.15rem; }
  #sign-dialog p, #sign-dialog label { font-size: .875rem; line-height: 1.4; }
  #sign-dialog canvas { height: clamp(130px, 27dvh, 220px); }
  #sign-dialog .confirmation { margin-block: 9px; }
  #sign-dialog .actions .primary { flex: 1; }
}
