/*
  MirNova Hub — create_form.css
  Core create form layout, fields, select styling and textarea scrollbar.
*/

#create-entry-form-wrap {
  width: min(980px, 100%) !important;
  margin-top: 22px !important;
}

#app-create-listing-form {
  width: 100% !important;
  max-width: 980px !important;
  gap: 12px !important;
}

#app-create-listing-form label {
  color: rgba(230,246,255,.78) !important;
  font-size: 12px !important;
  font-weight: 760 !important;
}

#app-create-listing-form input[type="text"],
#app-create-listing-form textarea,
#app-create-listing-form select {
  width: 100% !important;
  border-radius: 14px !important;
  border: 1px solid rgba(120,190,255,.16) !important;
  background: rgba(3,12,28,.42) !important;
  color: rgba(245,253,255,.94) !important;
  box-shadow: none !important;
}

#app-create-listing-form input[type="text"] {
  min-height: 40px !important;
  padding: 10px 12px !important;
}

#app-create-listing-form textarea {
  min-height: 150px !important;
  padding: 12px 14px !important;
  resize: vertical !important;
}

#app-create-listing-form input[type="text"]:focus,
#app-create-listing-form textarea:focus,
#app-create-listing-form select:focus {
  border-color: rgba(92,225,255,.42) !important;
  background: rgba(5,16,36,.58) !important;
  box-shadow:
    0 0 0 1px rgba(92,225,255,.06) inset,
    0 0 20px rgba(0,190,255,.10) !important;
}

#create-service-matching-box,
#create-listing-service-fields,
#create-listing-job-fields,
#create-helper-taxonomy-grid,
fieldset {
  border-radius: 18px !important;
  border: 1px solid rgba(120,190,255,.14) !important;
  background: rgba(5,12,28,.38) !important;
  box-shadow: none !important;
}

#create-service-matching-box {
  margin: 16px 0 14px !important;
  padding: 16px !important;
}

#create-service-matching-rows {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
}

#create-service-matching-rows > div {
  border-radius: 14px !important;
  border: 1px solid rgba(120,190,255,.12) !important;
  background: rgba(3,12,28,.34) !important;
  box-shadow: none !important;
}

#create-listing-service-fields:not([hidden]),
#create-listing-job-fields:not([hidden]) {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px 12px !important;
  padding: 14px !important;
}

#create-listing-service-fields[hidden],
#create-listing-job-fields[hidden] {
  display: none !important;
}

#create-listing-service-fields p,
#create-listing-job-fields p {
  grid-column: 1 / -1 !important;
}

#app-create-listing-form > div[style*="display:flex"][style*="gap:8px"] {
  margin-top: 14px !important;
}

#app-create-listing-form button[type="submit"],
#app-create-listing-form a[href*="/app/feed"] {
  min-height: 38px !important;
  padding: 9px 16px !important;
  border-radius: 14px !important;
  font-size: 13px !important;
  font-weight: 820 !important;
}

#app-create-listing-form select,
#app-create-listing-form select option {
  background: #071226 !important;
  color: #e9f6ff !important;
}

#app_work_format {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  border-radius: 14px !important;
  border: 1px solid rgba(92,225,255,.28) !important;
  background: rgba(3,12,28,.72) !important;
  color: #f4fdff !important;
  min-height: 42px !important;
  font-weight: 700 !important;
}

#app_work_format:focus {
  outline: none !important;
  border-color: rgba(92,225,255,.55) !important;
  box-shadow: 0 0 0 1px rgba(92,225,255,.10) inset, 0 0 22px rgba(0,190,255,.12) !important;
}

#app_work_format,
.hub-ac-cr-country-wrap,
#app_city,
#app-create-listing-form fieldset {
  max-width: 560px !important;
}

#app-create-listing-form fieldset {
  width: 100% !important;
}

.hub-lang-wl-cr-spoken-wrap {
  max-width: 520px !important;
}

#app_work_format {
  width: 100% !important;
}

.hub-ac-cr-country-wrap input,
.hub-lang-wl-cr-search-wrap input,
#app_city {
  width: 100% !important;
}

#app_work_format option {
  background: #071226 !important;
  color: #e9f6ff !important;
}

#app_desc {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(92,225,255,.45) rgba(3,12,28,.55) !important;
}

#app_desc::-webkit-scrollbar {
  width: 8px !important;
}

#app_desc::-webkit-scrollbar-track {
  background: rgba(3,12,28,.55) !important;
  border-radius: 999px !important;
}

#app_desc::-webkit-scrollbar-thumb {
  background: rgba(92,225,255,.45) !important;
  border-radius: 999px !important;
  border: 2px solid rgba(3,12,28,.55) !important;
}

#app_desc::-webkit-scrollbar-thumb:hover {
  background: rgba(92,225,255,.70) !important;
}

/* Create text field rules migrated from create_inline_rebuild.css */

.create-text-control {
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.15);
  background: #0e1420;
  color: #e9eef7;
  font-size: 14px;
}

.create-text-control--error {
  border-color: rgba(255,110,110,0.75);
}

.create-textarea-control {
  resize: vertical;
}

.create-field-error-inline {
  margin: 6px 0 2px;
  font-size: 13px;
  color: #f88;
}