/* STS Core v0.5.3 — orderly multilingual jobs portal.
   Scope: only STS job filter/query elements plus the explicit language wrapper.
   Existing WordPress pages are not modified by this stylesheet. */

/* --------------------------------------------------
   Shared reading direction / typography
   DE + EN: left/start. AR: right/start through RTL.
   -------------------------------------------------- */
.sts-jobs-language-layout,
.sts-job-filter,
.sts-jobs-query {
  box-sizing: border-box;
}

.sts-jobs-language-layout {
  width: 100%;
  max-width: none !important;
}

.sts-jobs-language-layout > * {
  max-width: none;
}

/* Let the THEME control .sts-section-intro exactly like other STS subpages.
   v0.5.2 overrode its width/margins and made EN/AR look different from pages
   such as "Für Unternehmen". We intentionally do not override it here. */

.sts-jobs-language-layout,
.sts-job-filter,
.sts-jobs-query,
.sts-job-card,
.sts-jobs-query .sts-content-panel {
  text-align: start;
}

html[dir="rtl"] .sts-jobs-language-layout,
.sts-jobs-language-ar {
  direction: rtl;
  text-align: start;
}

/* --------------------------------------------------
   Filter bar — one orderly row on desktop
   -------------------------------------------------- */
.sts-job-filter {
  width: 100%;
  margin-block: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(.85rem, 1.6vw, 1.15rem);
  border: 1px solid rgba(23, 26, 30, .12);
  border-radius: 18px;
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 12px 32px rgba(15, 17, 19, .06);
}

.sts-job-filter-grid {
  display: grid !important;
  grid-template-columns:
    minmax(190px, 1.45fr)
    minmax(150px, 1fr)
    minmax(150px, 1fr)
    minmax(150px, 1fr)
    auto !important;
  gap: .8rem !important;
  align-items: end !important;
  width: 100%;
}

.sts-job-filter-grid > * {
  min-width: 0;
  margin: 0;
}

.sts-job-filter label {
  display: block;
  margin: 0 0 .42rem;
  font-size: clamp(.68rem, .25vw + .62rem, .76rem);
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: .035em;
  text-align: start;
  opacity: .76;
}

.sts-job-filter input,
.sts-job-filter select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 46px;
  margin: 0;
  padding: .65rem .8rem;
  box-sizing: border-box;
  border: 1px solid rgba(23, 26, 30, .18);
  border-radius: 11px;
  background: rgba(255, 255, 255, .94);
  color: inherit;
  font: inherit;
  line-height: 1.25;
  text-align: start;
}

.sts-job-filter input:focus,
.sts-job-filter select:focus {
  outline: 2px solid rgba(192, 145, 65, .28);
  outline-offset: 1px;
  border-color: rgba(192, 145, 65, .68);
}

.sts-job-filter-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: .55rem;
  align-items: center;
  justify-content: flex-start;
  min-height: 46px;
}

.sts-job-filter button,
.sts-job-filter .sts-filter-reset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  margin: 0;
  padding: .68rem .9rem;
  border-radius: 999px;
  white-space: nowrap;
  line-height: 1;
  text-decoration: none;
  box-sizing: border-box;
}

/* --------------------------------------------------
   Results / cards — same horizontal rhythm as filter
   -------------------------------------------------- */
.sts-jobs-query {
  width: 100%;
  max-width: none !important;
  margin-block-start: clamp(1.15rem, 2vw, 1.6rem);
}

.sts-jobs-query .wp-block-post-template {
  width: 100%;
  gap: clamp(1rem, 2vw, 1.5rem);
}

.sts-jobs-query .sts-job-card {
  height: 100%;
  box-sizing: border-box;
  text-align: start;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: auto;
}

.sts-jobs-query .sts-job-card > * {
  margin-inline-start: 0;
  margin-inline-end: 0;
}

/* Empty state should read like the cards on other STS subpages:
   DE/EN start on the left, AR starts on the right. */
.sts-jobs-query .sts-jobs-empty,
.sts-jobs-query .sts-content-panel {
  width: 100%;
  min-height: 150px;
  box-sizing: border-box;
  padding: clamp(1.5rem, 3vw, 2.25rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-align: start;
}

.sts-jobs-query .sts-jobs-empty > *,
.sts-jobs-query .sts-content-panel > * {
  width: min(100%, 760px);
  margin-inline-start: 0 !important;
  margin-inline-end: 0 !important;
  text-align: start;
}

.sts-jobs-query .sts-jobs-empty h2,
.sts-jobs-query .sts-content-panel h2 {
  margin-block-end: .35rem;
}

.sts-jobs-query .sts-jobs-empty p,
.sts-jobs-query .sts-content-panel p {
  margin-block-start: 0;
}

/* --------------------------------------------------
   Arabic / RTL — mirror the same geometry, not a new layout
   -------------------------------------------------- */
html[dir="rtl"] .sts-job-filter,
.sts-jobs-language-ar .sts-job-filter,
html[dir="rtl"] .sts-jobs-query,
.sts-jobs-language-ar .sts-jobs-query {
  direction: rtl;
}

html[dir="rtl"] .sts-job-filter label,
html[dir="rtl"] .sts-job-filter input,
html[dir="rtl"] .sts-job-filter select,
html[dir="rtl"] .sts-jobs-query,
.sts-jobs-language-ar .sts-job-filter label,
.sts-jobs-language-ar .sts-job-filter input,
.sts-jobs-language-ar .sts-job-filter select,
.sts-jobs-language-ar .sts-jobs-query {
  text-align: start;
}

html[dir="rtl"] .sts-job-filter-actions,
.sts-jobs-language-ar .sts-job-filter-actions {
  justify-content: flex-start;
}

/* --------------------------------------------------
   Responsive ordering
   Desktop: 1 row
   Tablet: 2 columns + actions row
   Mobile: 1 field per row
   -------------------------------------------------- */
@media (max-width: 1100px) {
  .sts-job-filter-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  .sts-job-filter-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 782px) {
  .sts-job-filter {
    padding: .8rem;
    border-radius: 16px;
  }

  .sts-job-filter-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .7rem !important;
  }

  .sts-job-filter-actions {
    grid-column: auto;
    flex-wrap: wrap;
  }

  .sts-job-filter button,
  .sts-job-filter .sts-filter-reset {
    min-height: 44px;
  }

  .sts-jobs-query .wp-block-post-template.is-layout-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .sts-jobs-query .sts-jobs-empty,
  .sts-jobs-query .sts-content-panel {
    min-height: 130px;
    padding: 1.25rem;
  }
}

/* --------------------------------------------------
   Job-specific application form (v0.5.5)
   -------------------------------------------------- */
.sts-job-application-form{display:grid;gap:.85rem;margin-top:1.15rem}.sts-job-application-form p{margin:0}.sts-job-application-form label{display:block;margin:0 0 .35rem;color:#fff;font-size:.88rem;font-weight:700}.sts-job-application-form input[type="text"],.sts-job-application-form input[type="email"],.sts-job-application-form input[type="tel"],.sts-job-application-form input[type="file"],.sts-job-application-form textarea{width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.2);border-radius:11px;background:#fff;color:#171b1f;padding:.72rem .8rem;font:inherit}.sts-job-application-form textarea{resize:vertical;min-height:118px}.sts-job-application-form input:focus,.sts-job-application-form textarea:focus{outline:2px solid rgba(212,171,91,.5);outline-offset:1px}.sts-job-application-form input[type="file"]{padding:.55rem;font-size:.84rem}.sts-job-application-form .sts-form-help{display:block;margin-top:.35rem;color:rgba(255,255,255,.66);font-size:.78rem;line-height:1.35}.sts-job-privacy{display:flex!important;align-items:flex-start;gap:.55rem;margin:.25rem 0 0!important;color:rgba(255,255,255,.84)!important;font-weight:500!important;line-height:1.4}.sts-job-privacy input{margin-top:.23rem;flex:0 0 auto}.sts-job-privacy a{color:inherit;text-decoration:underline}.sts-job-application-form .sts-apply-button{border:0;cursor:pointer;font:inherit}.sts-job-application-notice{margin:.85rem 0;padding:.75rem .85rem;border-radius:10px;font-weight:650;line-height:1.4}.sts-job-application-notice.is-success{background:rgba(78,190,111,.18);border:1px solid rgba(104,219,137,.38);color:#e6ffed}.sts-job-application-notice.is-error{background:rgba(224,84,84,.16);border:1px solid rgba(245,120,120,.35);color:#fff0f0}.sts-job-external-apply{margin-top:1rem!important;font-size:.86rem}.sts-job-external-apply a{color:inherit;text-decoration:underline}.sts-job-honeypot{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
html[dir="rtl"] .sts-job-application-form,html[dir="rtl"] .sts-job-application-form label,html[dir="rtl"] .sts-job-privacy{direction:rtl;text-align:start}