#promoView .form-page-head {
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  padding: 10px 14px;
  border-radius: 11px;
}

#promoView .form-page-head h2 { font-size: clamp(22px, 2.5vw, 27px); }
#promoView .back-button { width: 32px; height: 32px; border-radius: 8px; font-size: 17px; }
#promoView .promo-web-tabs { gap: 5px; margin-bottom: 9px; padding: 4px; border-radius: 11px; }
#promoView .promo-web-tabs button { min-height: 36px; padding: 6px 8px; border-radius: 8px; font-size: 10px; }
#promoView .rental-form { padding: 17px 19px; border-radius: 14px; }
#promoView .promo-web-form { gap: 9px; }
#promoView .form-section-title { gap: 8px; margin: 1px 0 4px; }
#promoView .form-section-title > span { width: 29px; height: 29px; border-radius: 8px; }
#promoView .form-section-title b { font-size: 16px; }
#promoView .form-section-title small { margin-top: 1px; font-size: 9px; }
#promoView .form-grid { gap: 8px 10px; }
#promoView .field { gap: 4px; font-size: 10px; }
#promoView .field input,
#promoView .field select { height: 41px; border-radius: 9px; font-size: 13px; }
#promoView .field textarea { min-height: 85px; padding: 10px 12px; border-radius: 9px; font-size: 12px; }
#promoView .field-error { min-height: 8px; font-size: 9px; }
#promoView .promo-date-builder { gap: 7px; }
#promoView .promo-date-builder .add-tower-web { height: 38px; min-width: 135px; border-radius: 8px; font-size: 10px; }
#promoView .promo-selected-dates { gap: 5px; min-height: 24px; }
#promoView .promo-selected-dates > button { min-height: 25px; padding: 3px 8px; border-radius: 7px; font-size: 9px; }
#promoView .promo-brochure-upload { min-height: 155px; border-radius: 12px; }
#promoView .promo-brochure-upload > span { gap: 4px; padding: 16px; }
#promoView .promo-brochure-upload > span b { font-size: 28px; }
#promoView .promo-brochure-upload img { max-height: 300px; }
#promoView .form-actions { gap: 7px; margin-top: 7px; }
#promoView .primary-button,
#promoView .secondary-button { min-width: 115px; height: 40px; border-radius: 9px; font-size: 11px; }
#promoView .promo-web-list { gap: 8px; }
#promoView .promo-web-card { min-height: 165px; border-radius: 13px; }
#promoView .promo-web-image,
#promoView .promo-web-image img { min-height: 165px; }
#promoView .promo-web-body { padding: 11px; }
#promoView .promo-web-body > p { margin: 7px 0; }
#promoView .promo-web-actions { gap: 5px; margin-top: 7px; }

.header-welcome > div:first-child { min-width: 0; flex: 1; }
.header-welcome h2 { font-size: clamp(20px, 2vw, 30px); white-space: nowrap; }

@media (min-width: 761px) {
  .topbar {
    min-height: 78px;
    align-items: center;
    padding: 10px 24px;
    border-bottom: 0;
    background: linear-gradient(110deg, #3d2706 0%, #785217 55%, #ae8129 100%);
  }
  .header-welcome {
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    overflow: visible;
  }
  .header-welcome::after { display: none; }
  .header-welcome h2 {
    color: #fff;
    font: 700 20px Arial, sans-serif;
    letter-spacing: -.02em;
  }
  .header-welcome h2 span { font-weight: 700; }
  .header-login-account {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 7px;
    color: #fff7e5;
    font-size: 12px;
  }
  .header-login-account > span { font-size: 16px; line-height: 1; }
}

#guestDataView .form-page-head {
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  padding: 10px 14px;
  border-radius: 11px;
}

#guestDataView .form-page-head h2 { font-size: clamp(22px, 2.5vw, 27px); }
#guestDataView .back-button { width: 32px; height: 32px; border-radius: 8px; font-size: 17px; }

#apartmentView .form-page-head {
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  padding: 10px 14px;
  border-radius: 11px;
}

#apartmentView .form-page-head h2 { font-size: clamp(22px, 2.5vw, 27px); }
#apartmentView .form-page-head p:last-child { margin-top: 3px; font-size: 10px; }
#apartmentView .back-button { width: 32px; height: 32px; border-radius: 8px; font-size: 17px; }
#apartmentView .apartment-tabs { gap: 5px; margin-bottom: 9px; padding: 4px; border-radius: 11px; }
#apartmentView .apartment-tabs button { height: 36px; border-radius: 8px; font-size: 10px; }
#apartmentView .rental-form { padding: 17px 19px; border-radius: 14px; }
#apartmentView .form-section-title { gap: 8px; margin: 1px 0 9px; }
#apartmentView .form-section-title > span { width: 29px; height: 29px; border-radius: 8px; }
#apartmentView .form-section-title b { font-size: 16px; }
#apartmentView .form-section-title small { margin-top: 1px; font-size: 9px; }
#apartmentView .field { gap: 4px; font-size: 10px; }
#apartmentView .field input,
#apartmentView .field select { height: 41px; border-radius: 9px; font-size: 13px; }
#apartmentView .field-error { min-height: 8px; font-size: 9px; }
#apartmentView .apartment-tower-heading { margin: 13px 0 6px; }
#apartmentView .apartment-tower-fields { gap: 6px; }
#apartmentView .apartment-tower-row { padding: 9px 10px; border-radius: 11px; }
#apartmentView .apartment-tower-main { gap: 6px; }
#apartmentView .apartment-unit-heading { margin: 8px 0 5px; padding-top: 7px; }
#apartmentView .apartment-unit-fields { gap: 5px; }
#apartmentView .apartment-unit-row { gap: 5px; }
#apartmentView .add-tower-web { height: 36px; margin-top: 7px; border-radius: 8px; font-size: 10px; }
#apartmentView .form-actions { gap: 7px; margin-top: 13px; }
#apartmentView .primary-button,
#apartmentView .secondary-button { min-width: 115px; height: 40px; border-radius: 9px; font-size: 11px; }
#apartmentView .apartment-search-web { height: 40px; margin-bottom: 8px; border-radius: 10px; }
#apartmentView .apartment-list { gap: 7px; }

#rentalPriceView .form-page-head,
#facilityView .form-page-head {
  align-items: center;
  gap: 11px;
  margin-bottom: 10px;
  padding: 14px 17px;
  border-radius: 13px;
}

#rentalPriceView .form-page-head {
  gap: 9px;
  padding: 10px 14px;
  border-radius: 11px;
}

#rentalPriceView .form-page-head h2 { font-size: clamp(22px, 2.5vw, 27px); }
#rentalPriceView .back-button { width: 32px; height: 32px; border-radius: 8px; font-size: 17px; }

#facilityView .form-page-head {
  gap: 9px;
  padding: 10px 14px;
  border-radius: 11px;
}

#facilityView .form-page-head h2 { font-size: clamp(22px, 2.5vw, 27px); }
#facilityView .back-button { width: 32px; height: 32px; border-radius: 8px; font-size: 17px; }

#rentalPriceView .form-page-head h2,
#facilityView .form-page-head h2 {
  font-size: clamp(23px, 2.7vw, 29px);
}

#rentalPriceView .form-page-head p:last-child,
#facilityView .form-page-head p:last-child {
  margin-top: 3px;
  font-size: 10px;
}

#rentalPriceView .back-button,
#facilityView .back-button {
  width: 35px;
  height: 35px;
  border-radius: 9px;
  font-size: 18px;
}

#rentalPriceView .apartment-tabs,
#facilityView .apartment-tabs {
  gap: 5px;
  margin-bottom: 9px;
  padding: 4px;
  border-radius: 11px;
}

#rentalPriceView .apartment-tabs button,
#facilityView .apartment-tabs button {
  height: 36px;
  border-radius: 8px;
  font-size: 10px;
}

#rentalPriceView .rental-form,
#facilityView .rental-form {
  padding: 17px 19px;
  border-radius: 14px;
}

#rentalPriceView .form-section-title,
#facilityView .form-section-title {
  gap: 8px;
  margin: 1px 0 9px;
}

#rentalPriceView .form-section-title > span,
#facilityView .form-section-title > span {
  width: 29px;
  height: 29px;
  border-radius: 8px;
}

#rentalPriceView .form-section-title b,
#facilityView .form-section-title b { font-size: 16px; }
#rentalPriceView .form-section-title small,
#facilityView .form-section-title small { margin-top: 1px; font-size: 9px; }

#rentalPriceView .form-grid,
#facilityView .form-grid { gap: 9px 11px; }
#rentalPriceView .field,
#facilityView .field { gap: 4px; font-size: 10px; }

#rentalPriceView .field input,
#rentalPriceView .field select,
#facilityView .field input,
#facilityView .field select {
  height: 41px;
  border-radius: 9px;
  font-size: 13px;
}

#rentalPriceView .field select,
#facilityView .field select {
  background-position: calc(100% - 18px) 18px, calc(100% - 13px) 18px;
}

#rentalPriceView .currency-input { height: 41px; border-radius: 9px; }
#rentalPriceView .currency-input input { height: 39px; }
#rentalPriceView .field-error,
#facilityView .field-error { min-height: 8px; font-size: 9px; }

#rentalPriceView .form-actions,
#facilityView .form-actions { gap: 7px; margin-top: 13px; }
#rentalPriceView .primary-button,
#rentalPriceView .secondary-button,
#facilityView .primary-button,
#facilityView .secondary-button { min-width: 115px; height: 40px; border-radius: 9px; font-size: 11px; }

#rentalPriceView .rental-price-list { gap: 7px; }
#rentalPriceView .rental-price-card { gap: 8px; padding: 10px; border-radius: 12px; }
#rentalPriceView .rental-price-icon { width: 36px; height: 36px; border-radius: 9px; font-size: 15px; }
#rentalPriceView .rental-price-card h3 { font-size: 14px; }
#rentalPriceView .rental-price-card p { margin-top: 3px; font-size: 11px; }

#facilityView .facility-stored-panel { margin-bottom: 9px; padding: 12px 14px; border-radius: 12px; }
#facilityView .facility-stored-panel h3 { margin-bottom: 8px; font-size: 17px; }
#facilityView .facility-stored-panel h4 { margin: 8px 0 5px; font-size: 10px; }
#facilityView .facility-inline-status { padding: 11px 8px; font-size: 10px; }
#facilityView .facility-chip-list { gap: 5px; min-height: 22px; }
#facilityView .facility-chip { min-height: 25px; padding: 3px 8px; border-radius: 7px; font-size: 9px; }
#facilityView .facility-name-fields { gap: 3px; }
#facilityView .add-tower-web { margin-top: 7px; min-height: 37px; }
#facilityView .facility-category-actions { gap: 7px; margin-top: 13px; }
#facilityView .facility-assigned-panel { margin: 4px 0 10px; padding: 10px; border-radius: 10px; }
#facilityView .facility-assigned-panel h4 { margin-bottom: 6px; }
#facilityView .facility-choice-field { padding: 10px; border-radius: 10px; }
#facilityView .facility-choice-list { gap: 5px; }
#facilityView .facility-choice { min-height: 36px; padding: 6px 8px; border-radius: 8px; }

#apartmentView .apartment-tower-builder {
  display: flex;
  align-items: flex-start;
  gap: 7px;
}
#apartmentView .apartment-tower-fields {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
#apartmentView .apartment-tower-row {
  flex: 1 1 300px;
  max-width: calc(50% - 4px);
  min-width: 260px;
  padding: 8px;
}
#apartmentView .apartment-tower-main input,
#apartmentView .apartment-unit-row input { height: 40px; }
#apartmentView .apartment-unit-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 5px;
}
#apartmentView .apartment-unit-row {
  flex: 1 1 135px;
  min-width: 125px;
  grid-template-columns: minmax(75px, 1fr) 32px;
}
#apartmentView .apartment-unit-row .field { margin: 0; }
#apartmentView .remove-unit-web {
  width: 32px;
  height: 40px;
  border-radius: 8px;
  font-size: 18px;
}
#apartmentView .remove-tower-web {
  width: 40px;
  height: 40px;
  border-radius: 9px;
  font-size: 20px;
}
#apartmentView .add-unit-web,
#apartmentView .compact-add-button {
  flex: 0 0 40px;
  width: 40px;
  min-width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border-radius: 8px;
  font-size: 19px;
}

@media (max-width: 760px) {
  .topbar {
    grid-template-columns: 38px minmax(0, 1fr);
    background: linear-gradient(110deg, #3d2706 0%, #785217 58%, #ae8129 100%);
  }
  .header-welcome {
    padding: 7px 8px;
    border: 0;
    background: none;
    box-shadow: none;
  }
  .header-welcome::after { display: none; }
  .header-welcome h2 { color: #fff; font-size: 14px; white-space: normal; }
  .header-welcome h2 span { font-weight: 700; }
  .header-login-account { display: flex; align-items: center; gap: 5px; margin-top: 4px; color: #fff7e5; font-size: 9px; }
  #promoView .rental-form { padding: 15px; }
  #promoView .promo-web-form { gap: 8px; }
  #apartmentView .rental-form,
  #rentalPriceView .rental-form,
  #facilityView .rental-form { padding: 15px; }
  #apartmentView .apartment-tower-row { padding: 8px; }
  #apartmentView .apartment-tower-row { max-width: 100%; min-width: 100%; }
  #rentalPriceView .form-grid,
  #facilityView .form-grid { gap: 7px; }
}
