/* Common, non-critical CSS shared across pages */

/* Ad slot helper reused across views */
.wdeftksssa { width: 410px; height: 770px; }
@media (min-width:500px){ .wdeftksssa { width:420px; height:150px } }
@media (min-width:800px){ .wdeftksssa { width:728px; height:200px } }

.ad-container-style,
.ad2-container-style,
.ad3-container-style,
.ad4-container-style,
.ad5-container-style { width:100%; height:auto; margin:auto; display:block }

/* Generic dividers and headings */
.dividers{ margin:9px 0; border-top:1px solid #e5e7eb }
.diivider{ --line:#e5e7eb; --text:#172526; display:flex; align-items:center; gap:12px; color:var(--text); font-size:14px; font-weight:600; line-height:1; text-align:center; margin:16px 0 }
.diivider:before, .diivider:after{ content:""; height:1px; background:var(--line); flex:1; opacity:.9; border-radius:1px }

/* Job card atoms (list/detail shared) */
.job-card{ background:#FCF9F4; border:1px solid #E8E4DA; border-radius:16px }
.job-card__header{ display:flex; align-items:center; gap:12px }
.job-card__title{ font-size:1rem; margin:0 }
.job-card__logo{ width:60px; height:60px; object-fit:cover; border-radius:8px }
.job-card__footer{ display:flex; align-items:center; gap:12px; flex-wrap:wrap }
.job-card__category{ display:inline-flex; align-items:center; gap:6px }
.job-card__cat-icon{ flex:0 0 auto }
.job-card__status{ display:inline-flex; align-items:center; justify-content:center; padding:2px 8px; border-radius:6px; font-size:12px; color:#fff; font-weight:600 }
.job-card__footer .job-card__status.available{ background:#1fc16b }
.job-card__footer .job-card__status.is-live{ background:#1fc16b }
.job-card__footer .job-card__status.is-important{ background:#fb3748 }
.job-card__footer .job-card__status.is-closing-soon{ background:#ff9800 }
.job-card__footer .job-card__status.is-end{ background:#fb3748 }
.job-card__footer .job-card__status.soon{ background:#fcf9f4; color:#172526 }
.job-card__meta-text{ display:inline-flex; align-items:center; gap:6px; font-size:13px; color:#6b7280; font-weight:600; white-space:nowrap }

/* Ensure category chip text color is consistent */
.job-card__category-wrapper{ color:#172526 }
.job-card__category-wrapper a{ color:inherit; text-decoration:none }
.job-card__category-wrapper a:hover{ color:#E75724 }

/* Actions under details */
.job-card__actions{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center }
/* Unified button styles (apply + source) */
.btn-apply,
.btn-source{
  display:inline-flex;
  padding:10px;
  justify-content:center;
  align-items:center;
  gap:4px;
  align-self:stretch;
  min-height:44px;
  border-radius:var(--radius-10, 10px);
  border:1px solid var(--linear-12, rgba(255, 255, 255, 0.12));
  background:linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.00) 100%), #E85B29;
  box-shadow:0 1px 2px 0 rgba(14, 18, 27, 0.24), 0 0 0 1px #E85F2E;
  color:#fff;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  font-family:"Somar Sans", sans-serif;
}
.btn-apply:hover,
.btn-source:hover{ filter:brightness(.98) }
/* Ensure apply button text stays white */
.btn-apply, .btn-apply:visited{ color:#fff !important }
.btn-apply:hover{ color:#fff }
/* Ensure source button text stays white */
.btn-source, .btn-source:visited{ color:#fff !important }
.btn-source:hover{ color:#fff }
/* Source button: dark neutral variant */
.btn-source{
  background:linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.00) 100%), var(--bg-strong-950, #0E121B);
  box-shadow:0 1px 2px 0 rgba(27, 28, 29, 0.48), 0 0 0 1px #242628;
}
/* Button icons alignment */
.btn-apply svg,.btn-source svg,.btn-apply i,.btn-source i{ width:16px; height:16px; flex:0 0 16px; color:currentColor }
/* Button states (accessibility + feedback) */
.btn-apply:focus-visible,.btn-source:focus-visible{ outline:2px solid rgba(232,95,46,.35); outline-offset:2px }
.btn-apply:active,.btn-source:active{ transform:translateY(.5px) }
.btn-apply[aria-disabled="true"],.btn-source[aria-disabled="true"],
.btn-apply.is-disabled,.btn-source.is-disabled,
.btn-apply:disabled,.btn-source:disabled{ opacity:.65; cursor:not-allowed; pointer-events:none; filter:none }

/* Follow buttons (Telegram/X/Snap) */
.follow-buttons-vertical{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end }
.follow-btn{ display:inline-flex; align-items:center; gap:6px; padding:8px 10px; border:1px solid #E8E4DA; border-radius:10px; background:#F4F0E8; color:#172526; text-decoration:none }
.follow-btn span{ font-size:14px; font-weight:600 }

/* Share icons at bottom */
.f-socials{ display:flex; gap:12px; justify-content:center; align-items:center }
.f-socials a{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; background:#F4F0E8; color:#172526; text-decoration:none; border:1px solid #E8E4DA }

/* Pager (category/listing) */
.pager{ display:flex; align-items:center; justify-content:center; gap:8px; margin:16px 0; flex-wrap:wrap }
.pager-btn{ padding:6px 10px; border:1px solid #E8E4DA; border-radius:8px; background:#F4F0E8; color:#172526; text-decoration:none }
.pager-btn.is-disabled{ opacity:.5; pointer-events:none }
.pager-list{ display:flex; list-style:none; gap:6px; padding:0; margin:0 }
.pager-page{ padding:6px 10px; border:1px solid #E8E4DA; border-radius:8px; text-decoration:none; color:#172526; background:#FCF9F4 }
.pager-page.is-active{ background:#172526; color:#fff; border-color:#172526 }
.pager-ellipsis{ color:#9ca3af }

/* Utilities */
.center{ display:flex; align-items:center }

/* Progressive enhancement for header CTA (applied after idle) */
.enhanced-ui .site-header__cta{
  box-shadow:0 1px 4px rgba(0,0,0,.06);
  border:1px solid var(--Primary-Persimmon-Netural);
}
