/* PC-EXPERT public form/header hotfix v88.
   Loaded after the bundled stylesheet so static Hosting Ukraine pages use
   the same compact dialog as the local application. */

.light-order-modal,
.manual-order-modal {
  width: min(100%, 438px) !important;
  position: relative;
  overflow: hidden;
  padding: 28px 28px 23px !important;
  border: 1px solid #dbe7f2 !important;
  border-radius: 19px !important;
  box-shadow: 0 22px 54px rgba(5, 31, 58, .2) !important;
}

.light-order-modal::before,
.manual-order-modal::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  width: 100%;
  height: 3px;
  border-radius: 19px 19px 0 0;
  background: #ff7a1a;
}

.light-order-modal .modal-close,
.manual-order-modal > .modal-close {
  top: 16px !important;
  right: 16px !important;
  width: 34px !important;
  height: 34px !important;
  color: #5f7790 !important;
  background: #f3f7fb !important;
  font-size: 20px !important;
}

.light-order-modal h2,
.manual-order-modal > h2 {
  margin: 0 44px 5px 0 !important;
  font-size: 25px !important;
  line-height: 1.16 !important;
}

.light-order-modal .modal-intro,
.manual-order-modal > .modal-intro {
  margin-bottom: 13px !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}

.light-order-service {
  display: flex !important;
  justify-content: flex-start !important;
  margin-bottom: 11px !important;
}

.light-order-service > span {
  display: none !important;
}

.light-order-service b {
  width: auto !important;
  min-height: 32px !important;
  padding: 7px 12px 7px 27px !important;
  border: 1px solid #dbe7f2 !important;
  border-radius: 999px !important;
  background: #f5f8fc !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.light-order-service b::before {
  left: 12px !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #ff7a00 !important;
}

.light-order-modal .service-lead-form,
.manual-order-modal .modal-form {
  gap: 9px !important;
}

.light-order-modal .lead-field-label,
.manual-order-modal .manual-lead-label,
.light-order-modal .lead-field-icon,
.manual-order-modal .manual-input-icon {
  display: none !important;
}

.light-order-modal .lead-input-shell,
.manual-order-modal .manual-input-shell {
  min-height: 48px !important;
  border-color: #d9e4ee !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}

.light-order-modal .lead-input-shell:focus-within,
.manual-order-modal .manual-input-shell:focus-within {
  border-color: #7fb6dc !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(21, 126, 194, .08) !important;
}

.light-order-modal .service-lead-form input,
.manual-order-modal .modal-form .manual-input-shell input {
  min-height: 46px !important;
  padding-inline: 14px !important;
  font-size: 15px !important;
}

.light-order-modal .service-lead-form .button,
.manual-order-modal .modal-form .button {
  min-height: 48px !important;
  border: 1px solid #0d5f93 !important;
  border-radius: 9px !important;
  color: #fff !important;
  background: #0d5f93 !important;
  box-shadow: 0 7px 18px rgba(13, 95, 147, .15) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}

.light-order-modal .service-lead-form .button:hover,
.manual-order-modal .modal-form .button:hover {
  border-color: #0a527f !important;
  background: #0a527f !important;
  box-shadow: 0 8px 20px rgba(13, 95, 147, .2) !important;
}

.light-order-modal .service-lead-form > small,
.manual-order-modal .modal-form > small {
  display: block !important;
  margin-top: 4px !important;
  padding-top: 1px !important;
  text-align: center !important;
  font-size: 8px !important;
  line-height: 1.45 !important;
}

/* The notice belongs to the document flow; only the navigation remains sticky. */
.service-notice {
  position: relative !important;
  top: auto !important;
  transform: none !important;
  opacity: 1 !important;
  transition: none !important;
}

.service-notice.is-hidden {
  transform: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.site-header,
.service-page-header,
.site-header.notice-hidden,
.service-page-header.notice-hidden {
  top: 0 !important;
}

html.pc-in-app-browser .site-header,
html.pc-in-app-browser .service-page-header,
html.pc-in-app-browser .site-header.notice-hidden,
html.pc-in-app-browser .service-page-header.notice-hidden {
  top: var(--pc-in-app-top, 0px) !important;
}

@media (max-width: 620px) {
  .light-order-modal,
  .manual-order-modal {
    width: min(100%, 410px) !important;
    padding: 23px 18px 20px !important;
    border-radius: 17px !important;
  }

  .light-order-modal h2,
  .manual-order-modal > h2 {
    font-size: 23px !important;
  }
}