@import url('https://fonts.googleapis.com/css2?family=Urbanist:wght@300;400;500;600;700&display=swap');

/* 0) HARD RESET samo za plugin */
.mv-job-wrap,
.mv-job-wrap * {
  box-sizing: border-box !important;
}

/* 1) WRAP: full width + padding do ivica */
.mv-job-wrap {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 24px 14px !important;
  font-family: "Urbanist", Arial, sans-serif !important;

  /* zaštita od tema koje prave overflow */
  overflow-x: hidden !important;
}

/* 2) CARD: centrirano, ali 100% širine unutar wrapa */
.mv-job-card {
  width: 100% !important;
  max-width: 1100px !important;
  margin: 0 auto !important;

  padding: 18px !important;
  border: 1px solid #ddd !important;
  background: #fff !important;
}

/* 3) Naslovi */
.mv-job-title {
  margin: 0 0 8px 0 !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
}

.mv-job-subtitle {
  margin: 0 0 18px 0 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}

/* 4) Alerti */
.mv-job-alert {
  margin: 0 0 14px 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #ccc !important;
}

.mv-job-alert--success { border-color: #2e7d32 !important; }
.mv-job-alert--error { border-color: #c62828 !important; }

/* 5) Forma */
.mv-job-form {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 6) “Grid” preko flexa — 2 kolone desktop, 1 kolona mobile */
.mv-job-grid {
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
}

/* svako polje u gridu */
.mv-job-grid > .mv-field {
  flex: 0 0 calc(50% - 7px) !important; /* 2 kolone */
  width: calc(50% - 7px) !important;
  min-width: 260px !important;          /* da ne bude premalo */
  margin: 0 !important;
}

/* pojedinačno polje (npr select “pozicija” van grida) */
.mv-field {
  width: 100% !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
}

/* label */
.mv-field label {
  display: block !important;
  margin: 0 0 6px 0 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* input/select/textarea */
.mv-field input,
.mv-field select,
.mv-field textarea {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;

  padding: 10px 12px !important;
  border: 1px solid #ccc !important;
  background: #fff !important;
  color: #111 !important;

  font-size: 14px !important;
  line-height: 1.2 !important;

  /* tema često stavi border-radius/height čudno */
  border-radius: 6px !important;
  height: auto !important;
  margin: 0 !important;
}

/* file input da bude normalan */
.mv-field input[type="file"] {
  padding: 8px 10px !important;
}

/* help text */
.mv-help {
  display: block !important;
  margin-top: 6px !important;
  font-size: 12px !important;
}

/* dugme */
.mv-submit-btn {
  display: block !important;
  width: 100% !important;

  padding: 12px !important;
  border: none !important;
  border-radius: 8px !important;

  background: #013840 !important;
  color: #fff !important;

  font-size: 16px !important;
  cursor: pointer !important;
}

/* note */
.mv-note {
  margin: 12px 0 0 0 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

/* 7) MOBILE: sve u 1 kolonu */
@media (max-width: 720px) {
  .mv-job-wrap {
    padding: 18px 12px !important;
  }

  .mv-job-card {
    padding: 14px !important;
  }

  .mv-job-grid {
    gap: 12px !important;
  }

  .mv-job-grid > .mv-field {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
}