/*
Theme Name: DCJ Child
Theme URI: https://datacenterjob.net
Description: Child theme for datacenterjob.net (Kadence parent). Clean white (Apple-inspired) brand and job board styling.
Author: DataCenterJob
Template: kadence
Version: 0.9.16
Text Domain: dcj-child
*/

/* ===== Brand tokens: Clean White (Apple-inspired, approved 2026-10-24) ===== */
:root:root {
  --dcj-bg: #FFFFFF;          /* page background: white */
  --dcj-panel: #FFFFFF;       /* cards, inputs */
  --dcj-panel-2: #F5F5F7;     /* light gray sections, search box, hover */
  --dcj-border: #E8E8ED;
  --dcj-border-strong: #D2D2D7;
  --dcj-text: #1D1D1F;
  --dcj-heading: #1D1D1F;
  --dcj-muted: #6E6E73;
  --dcj-subtle: #86868B;
  --dcj-accent: #1D1D1F;      /* primary buttons (pill) */
  --dcj-accent-hover: #424245;
  --dcj-on-accent: #FFFFFF;
  --dcj-chip-bg: #F5F5F7;     /* tags / job types */
  --dcj-chip-text: #1D1D1F;
  --dcj-featured: #86868B;
  --dcj-radius: 18px;         /* soft, Apple-like cards */
  --dcj-pill: 980px;
  --dcj-tap: 44px;
  --dcj-font: "Roboto", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --dcj-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Kadence global palette mapped to the brand */
  --global-palette1: #1D1D1F;  /* accent */
  --global-palette2: #424245;  /* accent hover */
  --global-palette3: #1D1D1F;  /* headings */
  --global-palette4: #1D1D1F;  /* body text */
  --global-palette5: #6E6E73;  /* medium text */
  --global-palette6: #86868B;  /* subtle text */
  --global-palette7: #E8E8ED;  /* borders / subtle bg */
  --global-palette8: #FFFFFF;  /* site background */
  --global-palette9: #FFFFFF;  /* content background */
  --global-palette9rgb: 255, 255, 255;
}

html, body { background: var(--dcj-bg); color: var(--dcj-text); font-family: var(--dcj-font); -webkit-font-smoothing: antialiased; letter-spacing: 0; }
h1, h2, h3, .entry-title, .site-title { font-family: var(--dcj-font); letter-spacing: -0.01em; font-weight: 500; }
h1, .entry-title { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.08; }
a { color: var(--dcj-heading); text-decoration: none; }
.entry-content a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--dcj-muted); }
::selection { background: var(--dcj-accent); color: var(--dcj-on-accent); }
:focus-visible { outline: 3px solid var(--dcj-accent); outline-offset: 2px; }

/* Header / footer */
#masthead, .site-header-row-container-inner, .site-main-header-wrap .site-header-row-container-inner { background: rgba(255,255,255,0.85) !important; -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); }
.site-footer, .site-footer-row-container-inner { background: var(--dcj-panel-2) !important; }
.site-footer { font-size: 12px; }
.site-header-row-container-inner { border-bottom: 1px solid var(--dcj-border); }
.site-footer-row-container-inner { border-top: 1px solid var(--dcj-border); }
.site-branding .site-title { color: var(--dcj-heading) !important; letter-spacing: -0.01em; }
.main-navigation .primary-menu-container > ul > li.menu-item > a,
.mobile-navigation ul li a { color: var(--dcj-text) !important; }
.main-navigation .primary-menu-container > ul > li.menu-item > a:hover { color: var(--dcj-subtle) !important; }
.site-footer, .site-footer a { color: var(--dcj-subtle); }

/* "Post a Job" menu CTA */
.dcj-menu-cta > a {
  background: var(--dcj-accent); color: var(--dcj-on-accent) !important;
  border-radius: var(--dcj-pill); padding: 0.45em 1.1em !important; font-weight: 500; font-size: 14px;
}
.dcj-menu-cta > a:hover { background: var(--dcj-accent-hover); }
.main-navigation .primary-menu-container > ul > li.menu-item.dcj-menu-cta > a,
.main-navigation .primary-menu-container > ul > li.menu-item.dcj-menu-cta > a:hover,
.mobile-navigation ul li.dcj-menu-cta a { color: var(--dcj-on-accent) !important; }

/* Content surfaces */
.content-bg, .entry.content-bg, .site-content .content-area .entry, body.content-style-unboxed .site { background: var(--dcj-bg); }
.entry-hero-container-inner, .entry-hero .entry-header { background: var(--dcj-bg) !important; }
.entry-title, h1, h2, h3, h4 { color: var(--dcj-heading); }

.entry.content-bg, .content-bg, .entry.single-entry, .entry.loop-entry { box-shadow: none !important; border-radius: 0; }

/* Buttons */
.button, button, input[type=submit], .wp-block-button__link, .dcj-btn {
  background: var(--dcj-accent); color: var(--dcj-on-accent); border: 0;
  border-radius: var(--dcj-pill); font-weight: 500; padding-left: 1.4em; padding-right: 1.4em; min-height: var(--dcj-tap);
}
.button:hover, button:hover, input[type=submit]:hover, .wp-block-button__link:hover { background: var(--dcj-accent-hover); color: var(--dcj-on-accent); }

/* Form fields */
input[type=text], input[type=email], input[type=url], input[type=password], input[type=search],
input[type=number], input[type=tel], select, textarea {
  background: var(--dcj-panel); color: var(--dcj-text); border: 1px solid var(--dcj-border-strong);
  border-radius: 12px; min-height: var(--dcj-tap);
}
input::placeholder, textarea::placeholder { color: var(--dcj-subtle); }
input:focus, select:focus, textarea:focus { border-color: var(--dcj-accent); outline: none; box-shadow: 0 0 0 4px rgba(0,0,0,.06); }
label, .job-manager-form label { color: var(--dcj-text); }
.job-manager-form small.description, .job-manager-form .description { color: var(--dcj-muted); }

/* Mono "status" labels */
.dcj-eyebrow { font-family: var(--dcj-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--dcj-subtle); }
.dcj-eyebrow::before { content: "● "; color: var(--dcj-heading); }

/* ===== WP Job Manager ===== */
div.job_listings .search_jobs {
  background: var(--dcj-panel-2); border: 0;
  border-radius: var(--dcj-radius) var(--dcj-radius) 0 0; padding: 20px;
}
div.job_listings .job_filters { background: transparent; }
div.job_listings .job_filters .search_jobs .search_remote_position label,
div.job_listings .job_filters .search_jobs label { color: var(--dcj-text); }
div.job_listings .job_filters .job_types {
  background: var(--dcj-panel-2); border: 0; border-top: 1px solid var(--dcj-border);
  border-radius: 0 0 var(--dcj-radius) var(--dcj-radius);
}
div.job_listings .job_filters .job_types li label { color: var(--dcj-muted); }
div.job_listings .job_filters .showing_jobs { background: transparent; color: var(--dcj-muted); }
.no_job_listings_found { color: var(--dcj-muted); }

ul.job_listings { border-top: 0; }
ul.job_listings li.job_listing, ul.job_listings li.no_job_listings_found {
  background: var(--dcj-panel); border: 1px solid var(--dcj-border);
  border-radius: var(--dcj-radius); margin: 0 0 12px;
}
ul.job_listings li.job_listing a { padding: 16px; color: var(--dcj-text); }
ul.job_listings li.job_listing a:hover { background: var(--dcj-panel-2); border-radius: var(--dcj-radius); }
ul.job_listings li.job_listing { transition: border-color .2s; }
ul.job_listings li.job_listing:hover { border-color: var(--dcj-border-strong); }
ul.job_listings li.job_listing .position h3 { color: var(--dcj-heading); font-weight: 600; }
ul.job_listings li.job_listing .company, ul.job_listings li.job_listing .location,
ul.job_listings li.job_listing .meta .date { color: var(--dcj-muted); }
ul.job_listings li.job_listing.job_position_featured { border-color: var(--dcj-featured); border-width: 2px; }
.job-type, ul.job_listings li.job_listing .meta .job-type {
  background: var(--dcj-chip-bg); color: var(--dcj-chip-text); border-radius: 999px; font-size: 12px;
}
.job-manager-pagination ul li a, .job-manager-pagination ul li span { background: var(--dcj-panel); border-color: var(--dcj-border); color: var(--dcj-text); }
.load_more_jobs { background: var(--dcj-panel); color: var(--dcj-heading); border: 1px solid var(--dcj-border); }

/* Single job */
.single_job_listing .meta { color: var(--dcj-muted); }
.single_job_listing .company { background: var(--dcj-panel); border: 1px solid var(--dcj-border); border-radius: var(--dcj-radius); }
.single_job_listing .company .name, .single_job_listing .company strong { color: var(--dcj-heading); }
.application_button {
  background: var(--dcj-accent) !important; color: var(--dcj-on-accent) !important;
  font-weight: 500; border: 0; border-radius: var(--dcj-pill); min-height: var(--dcj-tap);
}
.application_button:hover { background: var(--dcj-accent-hover) !important; }
.single_job_listing .application .application_details { background: var(--dcj-panel); border: 1px solid var(--dcj-border); color: var(--dcj-text); }
@media (max-width: 767px) {
  .single_job_listing .application {
    position: sticky; bottom: 0; z-index: 20;
    background: var(--dcj-panel); padding: 12px 0; border-top: 1px solid var(--dcj-border);
  }
  .single_job_listing .application .application_button { width: 100%; }
}

/* Job dashboard / submit form */
#job-manager-job-dashboard table { border-color: var(--dcj-border); }
#job-manager-job-dashboard table th, #job-manager-job-dashboard table td { border-color: var(--dcj-border); color: var(--dcj-text); }
.job-manager-message { background: var(--dcj-panel-2); color: var(--dcj-heading); border: 0; }
.job-manager-error { background: #FEF2F2; color: #991B1B; border: 0; }
.job-manager-info { background: var(--dcj-panel-2); color: var(--dcj-text); border: 0; }
.job-manager-form fieldset { border-color: var(--dcj-border); }

/* Select2 / category picker */
.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple {
  background: var(--dcj-panel); border: 1px solid var(--dcj-border-strong); border-radius: 12px; min-height: var(--dcj-tap);
}
.select2-container--default .select2-selection__rendered, .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--dcj-text); line-height: 42px; }
.select2-container--default .select2-selection__placeholder { color: var(--dcj-subtle); }
.select2-container--default .select2-selection--multiple .select2-selection__choice { background: var(--dcj-chip-bg); color: var(--dcj-chip-text); border: 0; }
.select2-dropdown { background: var(--dcj-panel); border-color: var(--dcj-border); color: var(--dcj-text); }
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-results__option--highlighted { background: var(--dcj-accent) !important; color: var(--dcj-on-accent) !important; }
.select2-search__field { background: var(--dcj-panel-2) !important; color: var(--dcj-text) !important; }

/* Kadence font override */
body, button, input, select, textarea, .main-navigation, .site-title, .entry-content, .job_listings, .single_job_listing { font-family: var(--dcj-font) !important; }

/* ===== Accounts: sign-up, sign-in, my account ===== */
.dcj-form { max-width: 480px; margin: 0 auto; }
.dcj-form label { display: block; font-weight: 500; margin-bottom: 6px; }
.dcj-form input[type=text], .dcj-form input[type=email], .dcj-form input[type=password] { width: 100%; }
.dcj-form small { display: block; color: var(--dcj-muted); margin-top: 6px; }
.dcj-form .dcj-btn, .dcj-login #wp-submit { width: 100%; }
.dcj-hp { position: absolute !important; left: -9999px !important; height: 0; overflow: hidden; }
.dcj-type { border: 0; padding: 0; margin: 0 0 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.dcj-type legend { font-weight: 500; margin-bottom: 8px; }
.dcj-type-option { position: relative; display: block; cursor: pointer; margin: 0 !important; }
.dcj-type-option input { position: absolute; opacity: 0; }
.dcj-type-option span { display: block; padding: 16px; border: 1px solid var(--dcj-border-strong); border-radius: 14px; background: var(--dcj-panel); }
.dcj-type-option strong { display: block; font-weight: 500; color: var(--dcj-heading); }
.dcj-type-option small { margin-top: 4px; }
.dcj-type-option input:checked + span { border: 2px solid var(--dcj-accent); padding: 15px; background: var(--dcj-panel-2); }
.dcj-type-option input:focus-visible + span { outline: 3px solid var(--dcj-accent); outline-offset: 2px; }
.dcj-alt { text-align: center; color: var(--dcj-muted); font-size: 14px; }
.dcj-alt a { text-decoration: underline; }
.dcj-notice { max-width: 480px; margin: 0 auto 20px; padding: 14px 16px; border-radius: 12px; background: var(--dcj-panel-2); color: var(--dcj-heading); }
.dcj-notice ul { margin: 0; padding-left: 18px; }
.dcj-notice-error { background: #FEF2F2; color: #991B1B; }
.dcj-login .login-username, .dcj-login .login-password { margin-bottom: 14px; }
.dcj-account-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin: 24px 0; }
.dcj-card { display: block; padding: 20px; border: 1px solid var(--dcj-border); border-radius: var(--dcj-radius); background: var(--dcj-panel); text-decoration: none !important; }
.dcj-card:hover { border-color: var(--dcj-border-strong); background: var(--dcj-panel-2); }
.dcj-card strong { display: block; font-weight: 500; font-size: 17px; color: var(--dcj-heading); }
.dcj-card span { display: block; color: var(--dcj-muted); margin-top: 4px; font-size: 14px; }
.dcj-card-soon { background: var(--dcj-panel-2); border-style: dashed; }
@media (max-width: 480px) { .dcj-type { grid-template-columns: 1fr; } }

/* ===== Homepage hero (full-screen cover) ===== */
.home .content-area { margin-top: 0; }
.home .entry-content-wrap { padding-top: 0; }
.dcj-cover.wp-block-cover {
  min-height: calc(100vh - 81px) !important; min-height: calc(100svh - 81px) !important;
  margin-top: 0; margin-bottom: 0; padding: 48px 24px; position: relative;
  display: flex; align-items: center; justify-content: center;
}
.admin-bar .dcj-cover.wp-block-cover { min-height: calc(100vh - 113px) !important; min-height: calc(100svh - 113px) !important; }
.dcj-cover .wp-block-cover__image-background { object-fit: cover; }
.dcj-cover::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(ellipse at center, rgba(0,0,0,.55) 0%, rgba(0,0,0,.40) 55%, rgba(0,0,0,.30) 100%);
}
.dcj-cover .wp-block-cover__inner-container { position: relative; z-index: 2; width: 100%; color: #fff; }
.dcj-hero { text-shadow: 0 1px 16px rgba(0,0,0,.35); }
.dcj-hero { text-align: center; max-width: 860px; margin: 0 auto; }
.dcj-hero-eyebrow { font-size: 17px; font-weight: 500; color: rgba(255,255,255,.85); margin: 0 0 10px; }
.dcj-hero-title { font-size: clamp(2.6rem, 7vw, 5rem); line-height: 1.04; letter-spacing: -0.025em; font-weight: 600; margin: 0 0 18px; color: #fff !important; }
.dcj-hero-sub { font-size: clamp(1.1rem, 2.2vw, 1.45rem); line-height: 1.45; color: rgba(255,255,255,.9); max-width: 660px; margin: 0 auto 32px; }
.dcj-hero-ctas { justify-content: center; gap: 12px; }
.dcj-btn-light .wp-block-button__link { background: #fff; color: #1D1D1F; }
.dcj-btn-light .wp-block-button__link:hover { background: #F5F5F7; color: #1D1D1F; }
.dcj-btn-ghost .wp-block-button__link, .wp-block-button.is-style-outline.dcj-btn-ghost .wp-block-button__link {
  background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.85);
}
.dcj-btn-ghost .wp-block-button__link:hover { background: rgba(255,255,255,.12); color: #fff; }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--dcj-accent); border: 1px solid var(--dcj-accent); }
.dcj-cover-credit { position: absolute; right: 0; bottom: -32px; margin: 0; font-size: 11px; color: rgba(255,255,255,.6); }
.dcj-section-title { font-size: clamp(1.6rem, 3vw, 2.2rem); letter-spacing: -0.02em; margin: 64px 0 20px; }
.dcj-more-links { margin-top: 20px; }
.dcj-more-links a { text-decoration: none; font-weight: 500; }
.home .post-thumbnail, .home .article-post-thumbnail { display: none; }
@media (max-width: 767px) {
  .dcj-cover.wp-block-cover { min-height: calc(100svh - 70px) !important; }
  .dcj-cover-credit { position: static; text-align: right; margin-top: 24px; }
}

/* Hero "Post a job" button: frosted white, always legible over the photo */
.dcj-cover .dcj-btn-ghost .wp-block-button__link,
.dcj-cover .wp-block-button.is-style-outline.dcj-btn-ghost .wp-block-button__link,
.dcj-cover .dcj-btn-ghost .wp-block-button__link:visited {
  background: rgba(255,255,255,.22) !important; color: #FFFFFF !important;
  border: 1.5px solid #FFFFFF !important; font-weight: 600;
  -webkit-backdrop-filter: blur(12px) saturate(160%); backdrop-filter: blur(12px) saturate(160%);
}
.dcj-cover .dcj-btn-ghost .wp-block-button__link:hover,
.dcj-cover .dcj-btn-ghost .wp-block-button__link:focus { background: rgba(255,255,255,.35) !important; color: #FFFFFF !important; }
.dcj-cover .dcj-btn-light .wp-block-button__link { font-weight: 600; }

/* ===== Single job header card ===== */
.single-job_listing .entry-header .entry-title { display: none; }
.dcj-job-header {
  display: flex; gap: 20px; align-items: flex-start;
  padding: 24px; margin: 0 0 32px;
  background: var(--dcj-panel); border: 1px solid var(--dcj-border); border-radius: var(--dcj-radius);
}
.dcj-job-logo img { width: 72px; height: 72px; object-fit: contain; border-radius: 14px; border: 1px solid var(--dcj-border); background: #fff; display: block; }
.dcj-job-main { flex: 1; min-width: 0; }
.dcj-job-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.dcj-job-title { font-size: clamp(1.6rem, 3.2vw, 2.25rem); line-height: 1.15; letter-spacing: -0.02em; font-weight: 600; margin: 0 0 4px; }
.dcj-job-website { flex: none; font-size: 14px; font-weight: 500; color: var(--dcj-heading); text-decoration: none; border: 1px solid var(--dcj-border-strong); border-radius: var(--dcj-pill); padding: 6px 14px; white-space: nowrap; }
.dcj-job-website:hover { background: var(--dcj-panel-2); color: var(--dcj-heading); }
.dcj-job-company { margin: 0 0 12px; color: var(--dcj-muted); font-size: 17px; }
.dcj-job-header ul.job-listing-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 0; padding: 0; list-style: none; background: none; border: 0; }
.dcj-job-header ul.job-listing-meta li { margin: 0; padding: 0; color: var(--dcj-muted); font-size: 15px; }
.dcj-job-header ul.job-listing-meta li a { color: var(--dcj-muted); }
.dcj-job-header ul.job-listing-meta li.job-type { background: var(--dcj-chip-bg); color: var(--dcj-chip-text) !important; border-radius: 999px; padding: 3px 10px; font-size: 13px; font-weight: 500; }
@media (max-width: 600px) {
  .dcj-job-header { flex-direction: column; gap: 14px; padding: 20px; }
  .dcj-job-top { flex-direction: column; gap: 8px; }
}

/* ===== Mobile menu drawer: white, dark text ===== */
#mobile-drawer .drawer-inner, #mobile-drawer .drawer-content, #mobile-drawer .drawer-header { background: #FFFFFF !important; color: var(--dcj-text) !important; }
#mobile-drawer .drawer-overlay { background: rgba(0,0,0,.25) !important; }
#mobile-drawer .menu-toggle-close, #mobile-drawer .menu-toggle-close .kadence-svg-iconset { color: var(--dcj-heading) !important; }
#mobile-drawer .mobile-navigation ul li > a, #mobile-drawer .mobile-navigation ul li .drawer-nav-drop-wrap > a { color: var(--dcj-heading) !important; font-size: 18px; font-weight: 500; padding: 14px 0; }
#mobile-drawer .mobile-navigation ul li > a:hover { color: var(--dcj-muted) !important; }
#mobile-drawer .mobile-navigation ul li, #mobile-drawer .mobile-navigation ul li .drawer-nav-drop-wrap { border-bottom: 1px solid var(--dcj-border) !important; border-color: var(--dcj-border) !important; }
#mobile-drawer .mobile-navigation ul li.dcj-menu-cta { border-bottom: 0 !important; padding-top: 16px; }
#mobile-drawer .mobile-navigation ul li.dcj-menu-cta > a { display: inline-block; background: var(--dcj-accent); color: var(--dcj-on-accent) !important; padding: 10px 22px !important; border-radius: var(--dcj-pill); font-size: 16px; }
.menu-toggle-open, .menu-toggle-open .kadence-svg-iconset { color: var(--dcj-heading) !important; }

/* ===== Newly added jobs grid ===== */
.dcj-new-jobs { margin: 56px 0 24px; }
.dcj-new-jobs-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 20px; }
.dcj-new-jobs-head .dcj-section-title { margin: 0; }
.dcj-new-jobs-all { font-weight: 500; text-decoration: none; white-space: nowrap; }
.dcj-new-jobs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.dcj-nj-card { display: flex; flex-direction: column; padding: 20px; background: var(--dcj-panel); border: 1px solid var(--dcj-border); border-radius: var(--dcj-radius); text-decoration: none !important; color: var(--dcj-text); transition: border-color .2s, transform .2s; }
.dcj-nj-card:hover { border-color: var(--dcj-border-strong); transform: translateY(-2px); color: var(--dcj-text); }
.dcj-nj-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 14px; }
.dcj-nj-logo img, .dcj-nj-logo span { width: 48px; height: 48px; border-radius: 12px; border: 1px solid var(--dcj-border); object-fit: contain; background: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600; color: var(--dcj-muted); }
.dcj-nj-badge { background: var(--dcj-accent); color: var(--dcj-on-accent); font-size: 12px; font-weight: 500; padding: 3px 10px; border-radius: 999px; }
.dcj-nj-title { font-size: 18px; line-height: 1.3; font-weight: 600; margin: 0 0 4px; color: var(--dcj-heading); }
.dcj-nj-company { margin: 0 0 8px; color: var(--dcj-muted); font-size: 15px; }
.dcj-nj-meta { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 12px; color: var(--dcj-muted); font-size: 14px; }
.dcj-nj-pay { margin: 10px 0 0; font-weight: 500; font-size: 15px; color: var(--dcj-heading); }
.dcj-nj-date { margin: auto 0 0; padding-top: 12px; color: var(--dcj-subtle); font-size: 13px; }
.dcj-all-jobs-title { margin-top: 56px; }

/* ===== Category search bar ===== */
.dcj-job-search { display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 10px; padding: 14px; background: var(--dcj-panel); border: 1px solid var(--dcj-border); border-radius: var(--dcj-radius); box-shadow: 0 8px 30px rgba(0,0,0,.06); }
.dcj-job-search select, .dcj-job-search input { width: 100%; margin: 0; }
.dcj-job-search select { appearance: none; -webkit-appearance: none; padding-right: 36px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231D1D1F' stroke-width='1.6' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; cursor: pointer; }
.dcj-job-search button { white-space: nowrap; }
.dcj-search-wrap { max-width: 900px; margin: -36px auto 0; position: relative; z-index: 5; }
.home .dcj-search-wrap + .dcj-new-jobs, .home .dcj-search-wrap ~ .wp-block-shortcode .dcj-new-jobs { margin-top: 40px; }
div.job_listings .search_jobs .search_categories { margin-top: 10px; }
div.job_listings .search_jobs .search_categories select { width: 100%; }
@media (max-width: 700px) { .dcj-job-search { grid-template-columns: 1fr; } .dcj-search-wrap { margin-top: 20px; } }

/* ===== Hero live job counter ===== */
.dcj-counter { margin: 28px auto 0; display: flex; flex-direction: column; align-items: center; gap: 2px; color: #fff; }
.dcj-counter-num { font-size: clamp(2.6rem, 6vw, 4rem); font-weight: 600; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: #fff; text-shadow: 0 2px 20px rgba(0,0,0,.35); }
.dcj-counter-label { font-size: 15px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; color: rgba(255,255,255,.85); }

/* Spacing: search bar sits below the hero (no overlap); no underline on hero buttons */
.home .dcj-search-wrap { margin: 40px auto 0 !important; }
@media (max-width: 700px) { .home .dcj-search-wrap { margin-top: 28px !important; } }
.dcj-hero-ctas .wp-block-button__link { text-decoration: none !important; }

/* 0.9.6 — logo/text gap in job results; country select (USA or Canada) above the Search button */
ul.job_listings li.job_listing a img.company_logo { left: 16px; border-radius: 8px; object-fit: contain; }
ul.job_listings li.job_listing a div.position { padding-left: 58px !important; }
div.job_listings .search_jobs .dcj-country-filter { margin-top: 10px; width: 100%; }
div.job_listings .search_jobs .dcj-country-filter select { width: 100%; }
@media (max-width: 767px) {
  ul.job_listings li.job_listing a div.position { padding-left: 56px !important; }
}

/* 0.9.8 — company dropdown: homepage search bar becomes 3 columns (category · company · country / location · button) */
.dcj-job-search { grid-template-columns: 1.3fr 1.2fr 0.9fr; }
.dcj-job-search #dcj_search_location { grid-column: span 2; }
div.job_listings .search_jobs .dcj-company-filter { margin-top: 10px; width: 100%; }
div.job_listings .search_jobs .dcj-company-filter select { width: 100%; }
@media (max-width: 700px) { .dcj-job-search { grid-template-columns: 1fr; } .dcj-job-search #dcj_search_location { grid-column: auto; } }

/* 0.9.9 — "all fields optional" note under the search bars */
.dcj-search-hint { margin: 10px 4px 0; font-size: 13px; line-height: 1.4; color: var(--dcj-muted); text-align: center; }
div.job_listings .search_jobs .dcj-search-hint { width: 100%; margin: 10px 0 0; text-align: left; }

/* 0.9.10 — salary in job results */
ul.job_listings li.job_listing .meta li.dcj-salary { display: block; font-size: 14px; font-weight: 500; color: var(--dcj-text); margin: 4px 0 2px; }
ul.job_listings li.job_listing .meta li.dcj-salary-unlisted { font-weight: 400; color: var(--dcj-muted); }

/* 0.9.11 — salary sits between the job type and the posted date */
ul.job_listings li.job_listing a ul.meta { display: flex; flex-direction: column; align-items: flex-end; }
ul.job_listings li.job_listing a ul.meta li.job-type { order: 1; }
ul.job_listings li.job_listing a ul.meta li.dcj-salary { order: 2; margin: 6px 0 2px; }
ul.job_listings li.job_listing a ul.meta li.date { order: 3; }
@media (max-width: 767px) { ul.job_listings li.job_listing a ul.meta { align-items: flex-start; } }

/* 0.9.12 — posted date matches the salary line */
ul.job_listings li.job_listing a ul.meta li.date, ul.job_listings li.job_listing a ul.meta li.date time { font-size: 14px; }

/* 0.9.13 — Sort by + Salary dropdowns on /jobs/ */
div.job_listings .search_jobs .dcj-sort-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; margin-top: 10px; }
div.job_listings .search_jobs .dcj-sort-row > div { display: flex; flex-direction: column; gap: 4px; }
div.job_listings .search_jobs .dcj-sort-row label { font-size: 13px; color: var(--dcj-muted); padding-left: 2px; }
div.job_listings .search_jobs .dcj-sort-row select { width: 100%; }
@media (max-width: 600px) { div.job_listings .search_jobs .dcj-sort-row { grid-template-columns: 1fr; } }

/* 0.9.14 — show the Sort by / Salary labels (WPJM hides filter labels) */
div.job_listings .job_filters .search_jobs .dcj-sort-row label { display: block !important; font-size: 13px; font-weight: 500; color: var(--dcj-text); margin: 0 0 2px 2px; }
div.job_listings .search_jobs .dcj-sort-row { margin-top: 14px; }

/* 0.9.15 — DCJ logo in the header (logo image already includes the "datacenterjob" wordmark) */
.site-branding .site-title-wrap { display: none !important; }
.site-branding a.brand img.custom-logo { height: 38px !important; width: auto !important; max-width: none !important; max-height: none !important; }
#mobile-header .site-branding a.brand img.custom-logo { height: 30px !important; }

/* 0.9.16 — email verification page */
.dcj-verify { max-width: 460px; margin: 0 auto; }
.dcj-verify h2 { margin-top: 0; }
.dcj-verify-form #dcj_code { font-size: 28px; letter-spacing: 10px; text-align: center; padding: 14px; width: 100%; font-weight: 500; }
.dcj-verify-form .dcj-btn { width: 100%; }
.dcj-link-btn { background: none !important; border: 0 !important; padding: 0 !important; color: var(--dcj-text) !important; text-decoration: underline; cursor: pointer; font: inherit; box-shadow: none !important; }