/* Scoped to plugin markup. Fonts and outer page templates belong to the theme. */
.tin-jobs {
  --tin-accent: var(--brand-color, var(--wp--preset--color--primary, #0669ff));
  --tin-border: rgba(127, 127, 127, .25);
  color: inherit;
  font-family: inherit;
  line-height: 1.65;
  margin-block: 1.5rem;
}
.tin-jobs *, .tin-jobs *::before, .tin-jobs *::after { box-sizing: border-box; }
.tin-jobs [hidden] { display: none !important; }
.tin-jobs__filters { display: flex; flex-wrap: wrap; align-items: end; gap: 1rem; padding: 1.25rem; border: 1px solid var(--tin-border); border-radius: 12px; margin-bottom: 1rem; }
.tin-jobs__filters > div:first-child { flex: 2 1 220px; }
.tin-jobs__filters > div { flex: 1 1 140px; min-width: 0; }
.tin-jobs__filters label { display: block; font-weight: 600; margin-bottom: .3rem; font-size: .9em; }
.tin-jobs__filters input, .tin-jobs__filters select { display: block; width: 100%; max-width: 100%; min-height: 44px; border: 1px solid var(--tin-border); border-radius: 5px; padding: .6rem .8rem; font: inherit; color: inherit; background: transparent; }
.tin-jobs__filters select option { color: CanvasText; background: Canvas; }
.tin-jobs .button, .tin-jobs__apply { display: inline-flex; align-items: center; justify-content: center; gap: .8em; min-height: 44px; padding: .65rem 1.1rem; border-radius: 5px; border: 1px solid transparent; font: inherit; font-weight: 600; text-decoration: none; background: var(--tin-accent); color: #fff; cursor: pointer; white-space: normal; text-align: center; height: auto; }
.tin-jobs .button:hover { filter: brightness(.9); color: #fff; }
.tin-jobs :is(a, input, select, button):focus-visible { outline: 3px solid var(--tin-accent); outline-offset: 4px; }
.tin-jobs__count { font-size: .9em; margin: 1rem 0; }
.tin-jobs__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.tin-jobs__card, .tin-jobs__summary { border: 1px solid var(--tin-border); border-top: 3px solid var(--tin-accent); border-radius: 12px; padding: clamp(1rem, 3vw, 1.6rem); background: transparent; box-shadow: 0 5px 15px rgba(0, 0, 0, .035); overflow-wrap: anywhere; min-width: 0; }
.tin-jobs__card { display: flex; flex-direction: column; align-items: start; }
.tin-jobs__card .tin-jobs__title { font-size: 1.25em; line-height: 1.4; margin: .9rem 0 1rem; padding: 0; }
.tin-jobs__title a { color: inherit; text-decoration: none; }
.tin-jobs__title a:hover { color: var(--tin-accent); text-decoration: underline; }
.tin-jobs__status { display: inline-block; border-radius: 999px; padding: .15rem .65rem; font-size: .78em; font-weight: 700; line-height: 1.8; border: 1px solid currentColor; }
.tin-jobs__status--open { color: #176444; background: #eaf7ef; }
.tin-jobs__status--closed { color: #733027; background: #fff0ed; }
.tin-jobs__status--unavailable { color: #655011; background: #fff8de; }
.tin-jobs__facts { display: grid; gap: .6rem 1.5rem; margin: 1rem 0; width: 100%; }
.tin-jobs__summary .tin-jobs__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tin-jobs__facts dt { font-size: .75em; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; margin: 0; }
.tin-jobs__facts dd { margin: 0; }
.tin-jobs__details { margin-top: auto; padding-top: .8rem; font-weight: 600; color: inherit; text-underline-offset: 4px; }
.tin-jobs__notice, .tin-jobs__empty { padding: 1rem; border-inline-start: 3px solid currentColor; background: rgba(127, 127, 127, .07); }
.tin-jobs__small { font-size: .8em; margin-block: .6rem 0; }
.tin-jobs__pagination { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; }
.tin-jobs__pagination a { padding: .5rem 1rem; border: 1px solid var(--tin-border); border-radius: 5px; color: inherit; }
@media (max-width: 640px) {
  .tin-jobs__grid, .tin-jobs__summary .tin-jobs__facts { grid-template-columns: 1fr; }
  .tin-jobs__filters > div, .tin-jobs__filters > div:first-child, .tin-jobs__filters button { flex: 1 1 100%; }
}
@media print {
  .tin-jobs__filters, .tin-jobs__apply, .tin-jobs__pagination { display: none !important; }
  .tin-jobs__card, .tin-jobs__summary { break-inside: avoid; box-shadow: none; }
}
