/* Compact registration layout; scoped to avoid changing other forms. */
.modal:has(.bootstrap-registration) { padding: 20px 24px; }
.modal:has(.bootstrap-registration) .modal-head { margin-bottom: 12px; }
.modal .bootstrap-registration > .button-row { margin: 0 0 8px; gap: 8px; }
.modal .bootstrap-registration .registration-fields > label { display: block; margin: 0 0 8px; }
.modal .bootstrap-registration .registration-names { gap: 12px; margin: 8px 0 0; }
.modal .bootstrap-registration .registration-names label { display: block; }
.modal .bootstrap-registration .registration-names label small { display: inline; margin: 0 0 0 6px; font-size: 11px; }
.modal .bootstrap-registration input,
.modal .bootstrap-registration select { margin-top: 4px; padding: 8px 10px; min-height: 38px; }
.modal .bootstrap-registration .registration-action-row { margin-top: 10px; gap: 8px; }
.modal .bootstrap-registration .registration-action-row label { display: block; }
.modal .bootstrap-registration .registration-action-row button { min-height: 38px; padding: 8px 12px; }
.modal .bootstrap-registration .registration-passwords { margin-top: 10px; gap: 12px; }
.modal .bootstrap-registration .registration-passwords label { display: block; }
.modal .bootstrap-registration .registration-hint { margin: 4px 0 6px; font-size: 12px; line-height: 1.4; }
.modal .bootstrap-registration .registration-passwords + .registration-hint { display: inline-block; max-width: calc(100% - 145px); vertical-align: middle; margin-right: 8px; }
.modal .bootstrap-registration .registration-fields > .text-button { display: inline-block; padding: 4px 0; margin: 0; font-size: 12px; vertical-align: middle; }
.modal .bootstrap-registration .registration-tariffs { margin: 8px 0; }
.modal .bootstrap-registration .registration-tariffs label { display: block; }
.modal .bootstrap-registration .tariff-benefits ul { margin: 6px 0 0; font-size: 13px; line-height: 1.4; }
.modal .bootstrap-registration .tariff-benefits li + li { margin-top: 2px; }
.modal .bootstrap-registration .registration-fields > .primary.full { margin-top: 10px; padding: 9px 12px; }
.modal .bootstrap-registration .access-help { margin-top: 12px; font-size: 13px; }
@media (max-width: 520px) {
  .modal:has(.bootstrap-registration) { padding: 16px; }
  .modal .bootstrap-registration .registration-names { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .modal .bootstrap-registration .registration-names label small { display: none; }
  .modal .bootstrap-registration .registration-passwords + .registration-hint { max-width: 100%; display: block; margin-right: 0; }
  .modal .bootstrap-registration .registration-action-row button { padding: 8px; }
}

/* Registration action: half-width on desktop, separated from promo entry. */
.modal .bootstrap-registration .registration-fields:has(.registration-tariffs) > .primary.full {
  width: 50%;
  min-width: 180px;
  max-width: 100%;
  display: block;
  margin: 20px auto 0;
}


/* Compact actions and support area, same rule for login and registration. */
.modal .bootstrap-registration .registration-fields > .primary.full,
.modal .bootstrap-registration .registration-fields:has(.registration-tariffs) > .primary.full {
 width: max-content; min-width: 0; max-width: 100%; padding: 9px 18px; margin: 16px auto 0;
}
.modal .bootstrap-registration .access-help { margin-top: 8px; }
.modal .bootstrap-registration .access-help p { margin: 6px 0; font-size: 12px; }
.modal .bootstrap-registration .access-help form > label { margin: 8px 0; }
.modal .bootstrap-registration .access-help textarea { min-height: 64px; }
.modal .bootstrap-registration .access-help form > button { padding: 8px 12px; margin-top: 4px; }
.modal:has(.bootstrap-registration) { padding-bottom: 14px; }
/* Hold-to-reveal controls: per field, mouse, touch and keyboard. */
.modal .bootstrap-registration .password-field { display:block; position:relative; margin-top:4px; }
.modal .bootstrap-registration .password-field input { width:100%; margin-top:0; padding-right:44px; }
.modal .bootstrap-registration .password-eye { position:absolute; right:2px; top:50%; bottom:auto; transform:translateY(-50%); width:38px; height:38px; margin:0; padding:0; display:flex; align-items:center; justify-content:center; background:transparent; border:0; color:var(--muted); user-select:none; }
.modal .bootstrap-registration .password-eye:focus-visible { outline:2px solid currentColor; outline-offset:-3px; }
.modal .bootstrap-registration .registration-passwords + .registration-hint { max-width:100%; display:block; margin-right:0; }
.modal .bootstrap-registration .access-help { margin-top:0; }
.modal .bootstrap-registration form { margin-bottom:0; }
.modal .profile-action { margin-bottom:10px; }
.admin-profile-editor { margin:16px 0; padding:12px 0; border-block:1px solid #78958344; }
.admin-profile-editor fieldset { border:0; margin:0; padding:0; }
.modal .bootstrap-registration .registration-names label { min-width:0; }
.modal .bootstrap-registration .registration-names { align-items:end; }
.customer-request-form { border-top:1px solid #78958344; margin-top:12px; padding-top:8px; }
.customer-request-form h3 { margin:4px 0; }
.customer-request-form label { display:block; margin:8px 0; }
.client-order { border:1px solid #4d9cc4; background:color-mix(in srgb, #3589be 8%, var(--panel, transparent)); }
.client-badge { display:inline-block; color:#3183b3; border:1px solid #4d9cc4; border-radius:6px; padding:3px 8px; font-size:12px; }
.customer-home .order-card { margin:12px 0; }
.customer-app .content-toolbar { display:none; }
.role-settings { margin-top:14px; }
.role-settings summary { cursor:pointer; }
.portfolio-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.portfolio-grid figure { margin:0; }
.portfolio-grid img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:10px; }
.portfolio-grid figcaption { font-size:13px; padding:6px 0; }
.profile-about { white-space:pre-wrap; }
.portfolio-editor { margin-top:14px; }
.portfolio-editor fieldset { padding:0; border:0; }
.demo-profile-label { color:var(--muted); font-size:12px; }
@media(max-width:520px) { .portfolio-grid { grid-template-columns:1fr; } }
.modal .bootstrap-registration .customer-request-form { margin-top:8px; padding-top:4px; }
.modal .bootstrap-registration .customer-request-form label { margin:5px 0; }
.modal .bootstrap-registration .customer-request-form textarea { min-height:68px; }
.customer-request-form .address-search-status:empty { display:none; }
.customer-request-form .address-search-status { margin:4px 0; }
.customer-request-form .address-map-action { margin:4px 0; padding:7px 10px; }
.customer-request-form .address-provider { display:block; margin:3px 0; }
.modal .bootstrap-registration .registration-phone-row { display:grid; grid-template-columns:minmax(155px,1fr) auto 90px auto; align-items:end; gap:8px; margin-top:8px; }
.modal .bootstrap-registration .registration-phone-row label { display:block; min-width:0; margin:0; }
.modal .bootstrap-registration .registration-phone-row button { padding:8px 10px; min-height:38px; white-space:nowrap; margin:0; }
.modal .bootstrap-registration .registration-phone-row input { width:100%; min-width:0; }
.modal .bootstrap-registration .sms-code-label input { text-align:center; letter-spacing:2px; }
.modal .bootstrap-registration .registration-phone-row:not(:has(.sms-code-label)) { grid-template-columns:minmax(0,1fr) auto; }
@media(max-width:640px) {
 .modal .bootstrap-registration .registration-phone-row { grid-template-columns:minmax(0,1fr) auto; }
 .modal .bootstrap-registration .sms-code-label { width:100px; }
 .modal .bootstrap-registration .sms-confirm { justify-self:start; }
}
