/*
 Theme Name: WorkScout Child
 Theme URI: https://vezife.az
 Description: Child theme for WorkScout — safe place for custom CSS/PHP overrides.
 Author: Faig Khidirov
 Author URI: https://vezife.az
 Template: workscout
 Version: 1.0.0
 Text Domain: workscout-child
*/

/* Compact + keep centered (page 129 — unique tighter settings, kept as-is) */
body.page-id-129 #titlebar{
  padding:16px 0 !important;
  margin-bottom:18px !important;
}

/* kill any inner spacing */
body.page-id-129 #titlebar .container,
body.page-id-129 #titlebar .sixteen.columns,
body.page-id-129 #titlebar .ten.columns{
  padding:0 !important;
}

/* ensure the grid column doesn't offset to the left */
body.page-id-129 #titlebar .sixteen.columns,
body.page-id-129 #titlebar .ten.columns{
  width:100% !important;
  float:none !important;
  margin:0 auto !important;        /* removes margin-left from the grid */
  text-align:center !important;
}

/* tight heading */
body.page-id-129 #titlebar h1{
  margin:0 !important;
  line-height:1.2;
  text-align:center !important;
}

/* Default site-wide titlebar compaction (~50% cut from parent theme's 60px / 50px).
   Applies to every page using the standard #titlebar design.
   Excluded:
     - page 129 (keeps its tighter custom settings above)
     - single job listings (.single-job_listing) — preserves the job header layout
     - job archive (.post-type-archive-job_listing) — keeps its own compact rule */
body:not(.page-id-129):not(.single-job_listing):not(.post-type-archive-job_listing) #titlebar{
  padding:30px 0 !important;
  margin-bottom:25px !important;
}
body:not(.page-id-129):not(.single-job_listing):not(.post-type-archive-job_listing) #titlebar h1,
body:not(.page-id-129):not(.single-job_listing):not(.post-type-archive-job_listing) #titlebar h2{
  margin:0 !important;
  line-height:1.2;
}

/* Mirror the same compact + centered titlebar for /is-elanlari/ (job archive) */
body.post-type-archive-job_listing #titlebar{
  padding:16px 0 !important;
  margin-bottom:18px !important;
}

body.post-type-archive-job_listing #titlebar .container,
body.post-type-archive-job_listing #titlebar .sixteen.columns,
body.post-type-archive-job_listing #titlebar .ten.columns{
  padding:0 !important;
}

body.post-type-archive-job_listing #titlebar .sixteen.columns,
body.post-type-archive-job_listing #titlebar .ten.columns{
  width:100% !important;
  float:none !important;
  margin:0 auto !important;
  text-align:center !important;
}

body.post-type-archive-job_listing #titlebar h1,
body.post-type-archive-job_listing #titlebar h2{
  margin:0 !important;
  line-height:1.2;
  text-align:center !important;
}

body.post-type-archive-job_listing #titlebar .six.columns{
  display:none !important;
}
/* Hide "Not rated yet" everywhere (single & archive) */
.company-not-rated,
.not-rated,
.minimum_votes_req,
.rating-badge.not-rated,
.company-rating .no-rating {
  display: none !important;
}

/* Extra safety: only on the Companies archive/list page */
body.post-type-archive-company .company-not-rated,
body.post-type-archive-company .not-rated,
body.page-template-template-companies .not-rated {
  display: none !important;
}
/* Companies archive/sidebar – hide "Orta maaş" and "Gəlir" widgets */
body.post-type-archive-company .widget:has(#company_average_salary),
body.post-type-archive-company .widget:has(#company_revenue){
  display: none !important;
}
.fieldset-job_tags .field .description { display: none !important; }
/* Hide the "Təcrübə: ..." job tags paragraph inside the job description */
.single_job_listing .job_description .job_tags {
    display: none !important;
}
/* Hide only "(əlavə)" for Minimum maaş field */
label[for="salary_min"] small {
    display: none !important;
}
/* Submit Company: hide "(əlavə)" only on selected fields */
#submit-company-form fieldset.fieldset-company_logo label small,
#submit-company-form fieldset.fieldset-company_phone label small,
#submit-company-form fieldset.fieldset-company_category label small,
#submit-company-form fieldset.fieldset-company_since label small,
#submit-company-form fieldset.fieldset-company_content label small {
  display: none !important;
}
/* Avatar hissəsini gizlət */
.my-profile label[for="workscout_core_avatar_id"],
.my-profile .workscout-avatar-form,
.my-profile .workscout-avatar-form + .clearfix {
    display: none !important;
}

/* "Haqqımda" label və textarea-nı gizlət */
.my-profile label[for="description"],
.my-profile #description {
    display: none !important;
}

/* Tooltipdə tarixdən sonrakı bütün rəqəmləri ağ et */
.jm-chart .jm-chart-bar .jm-chart-bar-tooltip .jm-ui-row:nth-child(n+2) strong {
    color: #ffffff !important;
}

/* Əlavə olaraq, tooltip mətni də ağ olsun desən: */
.jm-chart .jm-chart-bar .jm-chart-bar-tooltip,
.jm-chart .jm-chart-bar .jm-chart-bar-tooltip .jm-ui-row {
    color: #ffffff !important;
}
/* Job Types Styling - Transparent background, light gray border, dark gray text */
/* Only applies to single job post pages, NOT home page listings */
/* This matches the design: transparent background, light gray border, dark gray text, rounded corners */

/* Single job post - titlebar: h1 + badges wrapper.
   Badges sit as siblings of h1 (not children) for clean SEO markup.
   The wrapper keeps them on the same visual line. */
body.single-job_listing #titlebar .job-title-badges h1 {
  display: inline;
}

body.single-job_listing #titlebar span.job-type,
body.single-job_listing #titlebar span[class*="job-type"] {
  background-color: transparent !important;
  border: 1px solid #e0e0e0 !important;
  color: #888888 !important;
  padding: 4px 8px !important;
  margin-left: 8px;
  border-radius: 4px;
  display: inline-block;
  text-align: center;
  font-weight: 500;
  font-size: 12px;
  line-height: 24px;
  position: relative;
  top: -4px;
  text-transform: none;
}

body.single-job_listing #titlebar span.new_job {
  background-color: #ff8000 !important;
  color: #fff !important;
  padding: 4px 8px !important;
  margin-left: 8px;
  border-radius: 4px;
  display: inline-block;
  font-size: 12px;
  font-weight: 500;
  line-height: 24px;
  position: relative;
  top: -4px;
  text-transform: none;
}

/* Similar jobs block - job spotlight (only on single job post pages) */
body.single-job_listing .job-spotlight span.job-type,
body.single-job_listing .job-spotlight h4 span.job-type,
body.single-job_listing .job-spotlight span[class*="job-type"],
body.single-job_listing .job-spotlight h4 span[class*="job-type"] {
  background-color: transparent !important;
  border: 1px solid #e0e0e0 !important;
  color: #888888 !important;
  padding: 4px 8px !important;
  margin-left: 8px;
  border-radius: 4px;
  display: inline-block;
  text-align: center;
  font-weight: 500;
}

/* Submit-job preview step: parent CSS hides ALL h1s under .job_listing_preview
   (`.job_listing_preview h1 { display: none }`) which also hid the title inside
   #titlebar. Re-show the titlebar h1 so the preview matches the live single page. */
.job_listing_preview #titlebar h1 {
  display: inline !important;
}

/* Style the job-type badge on the preview to match the live single page
   (outlined pill, not the parent's filled grey one). */
.job_listing_preview #titlebar span.job-type,
.job_listing_preview #titlebar span[class*="job-type"] {
  background-color: transparent !important;
  border: 1px solid #e0e0e0 !important;
  color: #888888 !important;
  padding: 4px 8px !important;
  margin-left: 8px;
  border-radius: 4px;
  display: inline-block;
  text-align: center;
  font-weight: 500;
  font-size: 12px;
  line-height: 24px;
  position: relative;
  top: -4px;
  text-transform: none;
}

/* Specific job type slugs in similar jobs block (to override PHP-generated dynamic styles) */
body.single-job_listing .job-spotlight span.distant,
body.single-job_listing .job-spotlight span.hibrid,
body.single-job_listing .job-spotlight span.konullu,
body.single-job_listing .job-spotlight span.muveqqeti-layihə,
body.single-job_listing .job-spotlight span.tam-is-gunu,
body.single-job_listing .job-spotlight span.tecrube,
body.single-job_listing .job-spotlight span.yarim-is-gunu {
  background-color: transparent !important;
  border: 1px solid #e0e0e0 !important;
  color: #888888 !important;
  padding: 4px 8px !important;
  border-radius: 4px;
  text-align: center;
  font-weight: 500;
}
/* Keep H4 headings with normal spacing */
.single_job_listing .job_description h4{
  /* spacing (you can tweak) */
  margin-top: 26px !important;
  margin-bottom: 14px !important;
  line-height: 1.35;
}

/* Single job: tighten the gap above "Related Jobs".
   Parent theme bakes a 55px margin-top into the heading via the
   `.margin-top-55` utility (workscout/css/base.css). 24px reads more
   naturally now that `.job_tags` is hidden inside the description. */
body.single-job_listing #related-job-container > h3.margin-top-55{
  margin-top: 24px !important;
}

/* --- Language-safe titles (Azerbaijani dotted/dotless I) ---
   Parent theme forces `text-transform: capitalize` on #titlebar headings,
   which breaks Azerbaijani casing (e.g. "İ" can become "I").
   Applied globally so every page renders titles exactly as stored. */
#titlebar h1,
#titlebar h2{
  text-transform: none !important;
}
/* ---------------------------------- */
/* Hide breadcrumbs + center titles on region & category archives
   and on Pre-Filtered Jobs landing pages (template-jobs-prefilter.php) */
/* ---------------------------------- */

/* Hide visible breadcrumbs only (schema stays via Rank Math JSON-LD) */
.tax-job_listing_region #breadcrumbs,
.tax-job_listing_category #breadcrumbs,
.page-template-template-jobs-prefilter #breadcrumbs{
  display:none !important;
}

/* Center the title */
.tax-job_listing_region #titlebar h1,
.tax-job_listing_category #titlebar h1,
.page-template-template-jobs-prefilter #titlebar h1{
  text-align:center !important;
}

/* Optional: also center any inline elements inside the titlebar column */
.tax-job_listing_region #titlebar .sixteen.columns,
.tax-job_listing_category #titlebar .sixteen.columns,
.page-template-template-jobs-prefilter #titlebar .sixteen.columns{
  text-align:center !important;
}
/* ---------------------------------- */
/* Expired job banner (single listing) */
/* ---------------------------------- */

.vezife-expired-banner{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px 12px;
  margin:0 0 16px 0;

  /* Keep banner format; match 2nd image colors */
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-bottom:3px solid #f59e0b;
  border-radius:10px;

  color:#6B6666;
  text-decoration:none !important;
  font-size:12.8px;
  line-height:1.35;
}

.vezife-expired-banner:hover{
  background:#ffffff;
  color:#7b808a;
  border-color:#d1d5db;
}

.vezife-expired-banner__icon{
  color:#f59e0b;
  font-size:16px;
  line-height:1;
  margin-top:2px;
  flex:0 0 auto;
}

.vezife-expired-banner__text{
  flex:1 1 auto;
  font-weight:600;
}

.vezife-expired-banner__arrow{
  color:#9aa3b2;
  font-size:18px;
  line-height:1;
  margin-top:1px;
  flex:0 0 auto;
}
/* Active variant: same banner shape, green accent + briefcase icon */
.vezife-expired-banner--active{ border-bottom-color:#1fa165; }
.vezife-expired-banner--active .vezife-expired-banner__icon{ color:#1fa165; }
.vezife-category-button-wrap{ margin-top:24px; }
.vezife-category-button-wrap .vezife-expired-banner{ margin-bottom:24px; }
/* ---------------------------------- */
/* Single job title layout (avoid Google title rewrites) */
/* ---------------------------------- */
.vezife-job-titlebar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}

.vezife-job-titlebar__title{
  margin:0;
  line-height:1.2;
}
/* ---------------------------------- */
/* Performance: reduce CLS on single job */
/* ---------------------------------- */

/* WP Job Manager outputs `.company_logo` without width/height, which can cause CLS.
   We reserve space via CSS as a safety net (HTML now also includes dimensions). */
.company-info-boxed-logo .company_logo{
  display:block;
  width:clamp(64px, 18vw, 96px);
  height:clamp(64px, 18vw, 96px);
  object-fit:contain;
}
/* ---------------------------------- */
/* Job preview: add breathing room when company badges wrap */
/* ---------------------------------- */
.job_listing_preview .company-info-boxed-links{
  display:flex;
  flex-wrap:wrap;
  column-gap:3px;
  row-gap:6px; /* tiny space between lines */
}
.job_listing_preview .company-info-boxed-links span a{
  margin-right:0; /* gap controls spacing in preview */
}
/* A11y: enlarge header tap targets (mobile) */
/* ---------------------------------- */
@media (max-width: 768px){
  .login-register-buttons a.login-btn,
  .login-register-buttons a.register-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:10px 14px;
    line-height:1.2;
  }

  .login-register-buttons a.login-btn + a.register-btn{
    margin-left:8px;
  }
}

/* ---------------------------------- */
/* Header: fix mobile logo clipping */
/* ---------------------------------- */
/* The wide wordmark logo (~434x90) collided with two parent-theme rules on
   mobile: (a) Kirki inline `max-height:36px !important; width:100%` at
   ≤1099px, and (b) parent `width:100% !important; height:auto !important`
   at ≤420px. With `#logo_nh` left unconstrained, the inline-block container
   resolved to the image's natural width and overflowed under the absolutely
   positioned hamburger. Fix: (1) reserve ~80px for the hamburger zone on the
   container, (2) size the image by height with width:auto so the aspect
   ratio is preserved, (3) add max-width:100% as a safety net for ≤320px
   phones where the natural width at 40px height (~193px) exceeds the
   reserved content area. */
@media (max-width: 768px){
  .new-header #header .right-side .header-widget{
    display:none !important; /* keep only hamburger; avoids logo being covered */
  }

  .new-header #header .right-side{
    background: transparent !important;
    right: 15px; /* reduce the reserved space on the right */
  }

  .new-header #logo_nh{
    /* Hamburger zone ≈ 56px button + 15px right offset + ~9px buffer = 80px */
    max-width: calc(100% - 80px) !important;
    border-right: 0 !important;
    padding-right: 12px !important;
    margin-right: 0 !important;
  }

  .new-header #logo_nh img{
    /* width:auto + !important defeats parent's `width:100% !important` at
       ≤420px. max-height:40px !important beats Kirki inline `36px !important`.
       max-width:100% lets the image scale down on tiny phones (≤320px). */
    width: auto !important;
    height: auto !important;
    max-height: 40px !important;
    max-width: 100%;
  }
}
/* ---------------------------------- */
/* Header: logged-out + login buttons OFF */
/* ---------------------------------- */
@media (max-width: 768px){
  /*
    IMPORTANT:
    Previously we hid the entire `.left-side` on mobile when login buttons are disabled
    for logged-out visitors. That also hides the site logo and makes it unclickable.
    Keep the logo, but hide the desktop nav inside the left-side.
  */
  body.ws-logged-out-no-login-buttons .new-header #header .left-side{
    display: flex !important;
  }

  body.ws-logged-out-no-login-buttons .new-header #header #navigation{
    display: none !important;
  }

  body.ws-logged-out-no-login-buttons .new-header #header .right-side{
    right: 15px;
    background: transparent !important;
  }
}
/* ---------------------------------- */
/* A11y: keep company heading styling when upgraded to h2 */
/* ---------------------------------- */
.company-info h2.company-info-boxed-name{
  font-size: 18px;
  line-height: 26px;
  margin-bottom: 0;
  margin-top: 2px;
}
/* ---------------------------------- */
/* SEO page-intent copy blocks */
/* ---------------------------------- */
.vezife-intro-kicker,
.vezife-company-eyebrow{
  display:inline-block;
  margin:0 0 10px;
  color:#f59e0b;
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.vezife-hero-copy h1{
  margin:0 0 14px;
  color:#fff;
}

.vezife-hero-copy p,
.vezife-titlebar-copy,
.vezife-titlebar-stat{
  max-width:780px;
  margin:0 auto 10px;
  line-height:1.7;
}

.vezife-hero-copy p{
  color:rgba(255,255,255,.92);
}

.vezife-titlebar-stat{
  color:#f59e0b;
  font-weight:600;
}

.vezife-page-intro-wrap{
  margin-top:26px;
}

.vezife-page-intro{
  margin:0 0 24px;
  padding:18px 22px;
  background:#fff8ef;
  border:1px solid #fde6c8;
  border-radius:12px;
}

.vezife-page-intro p,
.vezife-company-summary{
  margin:0;
  color:#4b5563;
  line-height:1.8;
}

.vezife-company-summary{
  margin-top:12px;
  max-width:820px;
}

@media (max-width: 768px){
  .vezife-page-intro{
    padding:16px;
  }

  .vezife-hero-copy h1{
    font-size:32px;
    line-height:1.2;
  }
}

/* ---------------------------------- */
/* Rank Math FAQ block – accordion    */
/* ---------------------------------- */
#rank-math-faq.rank-math-block{
  max-width:820px;
  margin:32px auto 40px;
  padding:0;
}

#rank-math-faq .rank-math-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}

#rank-math-faq .rank-math-list-item{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:10px;
  overflow:hidden;
  transition:border-color .2s ease, box-shadow .2s ease;
}

#rank-math-faq .rank-math-list-item:hover{
  border-color:#c8ead8;
  box-shadow:0 2px 8px rgba(31,161,101,.08);
}

#rank-math-faq .rank-math-question{
  position:relative;
  margin:0;
  padding:18px 52px 18px 22px;
  font-size:16px;
  font-weight:600;
  line-height:1.5;
  color:#1e293b;
  cursor:pointer;
  user-select:none;
  -webkit-user-select:none;
  transition:color .2s ease;
}

#rank-math-faq .rank-math-question::after{
  content:'';
  position:absolute;
  right:20px;
  top:50%;
  width:10px;
  height:10px;
  border-right:2px solid #9ca3af;
  border-bottom:2px solid #9ca3af;
  transform:translateY(-65%) rotate(45deg);
  transition:transform .25s ease, border-color .2s ease;
}

#rank-math-faq .rank-math-list-item.vezife-faq-open .rank-math-question{
  color:#1fa165;
}

#rank-math-faq .rank-math-list-item.vezife-faq-open .rank-math-question::after{
  transform:translateY(-30%) rotate(-135deg);
  border-color:#1fa165;
}

#rank-math-faq .rank-math-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease, padding .3s ease;
  padding:0 22px;
  color:#4b5563;
  font-size:15px;
  line-height:1.75;
}

#rank-math-faq .rank-math-list-item.vezife-faq-open .rank-math-answer{
  max-height:600px;
  padding:0 22px 20px;
}

#rank-math-faq .rank-math-answer p{
  margin:0 0 10px;
}

#rank-math-faq .rank-math-answer p:last-child{
  margin-bottom:0;
}

@media (max-width: 768px){
  #rank-math-faq.rank-math-block{
    margin:24px 0 32px;
  }

  #rank-math-faq .rank-math-question{
    font-size:15px;
    padding:16px 46px 16px 16px;
  }

  #rank-math-faq .rank-math-question::after{
    right:16px;
  }

  #rank-math-faq .rank-math-answer{
    padding:0 16px;
    font-size:14px;
  }

  #rank-math-faq .rank-math-list-item.vezife-faq-open .rank-math-answer{
    padding:0 16px 16px;
  }
}
/* ---------------------------------- */
/* Sidebar: semantic heading fix      */
/* ---------------------------------- */

/* Replaces <h4> widget labels that were removed from the heading outline.
   Matches the parent theme's `.widget h4` styling exactly. */
.sidebar .sidebar-heading{
  display:block;
  font-family:"Poppins","HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:20px;
  font-weight:500;
  margin-bottom:15px;
  line-height:1.3;
  color:#333;
}

/* ---------------------------------------- */
/* Category description — SEO content block */
/* ---------------------------------------- */
.category-description{
  margin-top:30px;
  padding:0 5px;
  font-size:15px;
  line-height:1.7;
  color:#555;
}
.category-description h2{
  font-size:22px;
  font-weight:700;
  margin:0 0 12px;
  color:#333;
}
.category-description h3{
  font-size:18px;
  font-weight:600;
  margin:24px 0 10px;
  color:#333;
}
.category-description h4{
  font-size:16px;
  font-weight:600;
  margin:20px 0 6px;
  color:#333;
}
.category-description ul{
  padding-left:20px;
  margin-bottom:16px;
}
.category-description ul li{
  margin-bottom:6px;
}

/* Salary / data table */
.category-description table{
  width:100%;
  border-collapse:collapse;
  margin:16px 0 20px;
  font-size:14px;
}
.category-description table th,
.category-description table td{
  padding:10px 14px;
  text-align:left;
  border-bottom:1px solid #e8e8e8;
}
.category-description table thead th{
  background:#f7f7f7;
  font-weight:600;
  color:#333;
  border-bottom:2px solid #ddd;
}
.category-description table tbody tr:hover{
  background:#fafafa;
}

/* Related categories links */
.category-description a{
  color:#2a41e8;
  text-decoration:none;
}
.category-description a:hover{
  text-decoration:underline;
}

/* ----------------------------------------------------------- */
/* Responsive salary / data tables                              */
/* Tablet (≤767px): horizontal scroll wrapper, cells nowrap.    */
/* Phone (≤600px): also override parent theme's data-label      */
/* stacking pattern (workscout/style.css ~31357), which hides   */
/* <th> and turns every <td> into a labelless block. Our tables */
/* don't use data-label attributes, so we restore table layout  */
/* and rely on horizontal scroll instead of stacking.           */
/* ----------------------------------------------------------- */
@media (max-width: 767px){
  .category-description table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    font-size:13px;
  }
  .category-description table th,
  .category-description table td{
    padding:8px 10px;
    white-space:nowrap;
  }
  .category-description table td:first-child,
  .category-description table th:first-child{
    white-space:normal;
    min-width:110px;
  }
}

@media (max-width: 600px){
  /* Restore table semantics that parent theme strips at ≤600px */
  .category-description table thead{ display:table-header-group !important; }
  .category-description table tbody{ display:table-row-group !important; }
  .category-description table tr{ display:table-row !important; }
  .category-description table thead th,
  .category-description table tbody th,
  .category-description table tbody td{
    display:table-cell !important;
    text-align:left !important;
    border-bottom:1px solid #e8e8e8;
  }
  /* Parent theme injects content:attr(data-label) on td::before — kill it */
  .category-description table th::before,
  .category-description table td::before{
    content:none !important;
  }
  /* Parent theme hides <th> on mobile — show it again */
  .category-description table thead th{
    background:#f7f7f7;
    font-weight:600;
    color:#333;
  }
  /* Keep number ranges (e.g. "1 500 – 2 500", "5 000 – 15 000+") on one line */
  .category-description table tbody td{
    white-space:nowrap;
  }
  /* First column = role/region/sector — allow wrap for long labels
     ("Regional satış meneceri", "Kommersiya direktoru") */
  .category-description table td:first-child,
  .category-description table th:first-child{
    white-space:normal !important;
    min-width:130px;
  }
}

/* Print — revert to a standard full-width table, no horizontal scroll */
@media print{
  .category-description table{
    display:table !important;
    overflow:visible !important;
    width:100% !important;
    font-size:12px;
  }
  .category-description table th,
  .category-description table td{
    white-space:normal !important;
  }
}

/* ---------------------------------------- */
/* FAQ disclosure — WorkScout accordion look */
/* ---------------------------------------- */
.category-description .vezife-faq{
  margin:20px 0 10px;
}
.category-description .vezife-faq__item{
  margin:0;
  background:transparent;
}
.category-description .vezife-faq__heading{
  margin:0 0 14px;
  padding:0;
  font-size:15px;
  font-weight:500;
  line-height:1.5;
}
.category-description .vezife-faq__q{
  display:block;
  width:100%;
  margin:0;
  padding:16px 22px;
  background-color:#f6f6f6;
  border:0;
  border-radius:4px;
  box-shadow:none;
  text-align:left;
  font:inherit;
  color:#666;
  cursor:pointer;
  text-transform:none;
  transition:background-color .2s ease-in-out, color .2s ease-in-out;
}
@media (hover: hover){
  .category-description .vezife-faq__q:hover{
    background-color:#eaeaea;
  }
}
.category-description .vezife-faq__q:active{
  background-color:#e2e2e2;
}
.category-description .vezife-faq__q[aria-expanded="true"]:active{
  background-color:#1f9152;
}
.category-description .vezife-faq__q:focus-visible{
  outline:2px solid #26ae61;
  outline-offset:-2px;
}
.category-description .vezife-faq__q[aria-expanded="true"]{
  background-color:#26ae61;
  color:#fff;
  border-radius:4px 4px 0 0;
}
@media (hover: hover){
  .category-description .vezife-faq__q[aria-expanded="true"]:hover{
    background-color:#26ae61;
  }
}
.category-description .vezife-faq__icon{ display:none; }
.category-description .vezife-faq__a{
  padding:18px 22px 8px;
  margin:-14px 0 18px;
  background:#fff;
  border:1px solid #eee;
  border-top:0;
  border-radius:0 0 4px 4px;
  color:#555;
  line-height:1.7;
}
.category-description .vezife-faq__a p,
.category-description .vezife-faq__a ul,
.category-description .vezife-faq__a ol{
  margin:0 0 12px;
}
.category-description .vezife-faq__a > *:last-child{ margin-bottom:10px; }
@media print{
  .category-description .vezife-faq__a[hidden]{ display:block !important; }
  .category-description .vezife-faq__q{ background:transparent !important; color:#000 !important; padding:6px 0; border-radius:0; }
  .category-description .vezife-faq__a{ padding:0; margin:0 0 14px; border:0; }
}

/* ---------------------------------------- */
/* Related categories — pill chips          */
/* ---------------------------------------- */
.category-description .vezife-related-head{
  margin-top:32px;
}
.category-description .vezife-related{
  display:block;
  margin:14px 0 4px;
  padding:0;
}
.category-description .vezife-related a{
  display:inline-block;
  padding:8px 16px;
  margin:0 6px 8px 0;
  background-color:#f4f4f4;
  color:#333;
  border-radius:999px;
  font-size:14px;
  font-weight:500;
  line-height:1.4;
  text-decoration:none;
  transition:background-color .15s ease, color .15s ease, transform .1s ease;
}
@media (hover: hover){
  .category-description .vezife-related a:hover{
    background-color:#26ae61;
    color:#fff;
    text-decoration:none;
  }
  .category-description .vezife-related a:hover .vezife-related__count{
    background:rgba(255,255,255,0.22);
    color:#fff;
  }
}
.category-description .vezife-related a:active{
  background-color:#26ae61;
  color:#fff;
  text-decoration:none;
  transform:scale(0.97);
}
.category-description .vezife-related a:active .vezife-related__count{
  background:rgba(255,255,255,0.22);
  color:#fff;
}
.category-description .vezife-related a:focus-visible{
  outline:2px solid #26ae61;
  outline-offset:2px;
}
.category-description .vezife-related__count{
  display:inline-block;
  margin-left:8px;
  padding:0 7px;
  min-width:18px;
  height:18px;
  line-height:18px;
  border-radius:999px;
  background:rgba(0,0,0,0.06);
  font-size:11px;
  font-weight:600;
  color:#888;
  text-align:center;
  vertical-align:1px;
  transition:background-color .15s ease, color .15s ease;
}
@media print{
  .category-description .vezife-related a{
    background:transparent;
    color:#000;
    padding:0;
    margin:0 10px 4px 0;
    text-decoration:underline;
  }
  .category-description .vezife-related__count{
    background:transparent;
    color:#000;
    padding:0 0 0 4px;
  }
}

/* Category/region box labels: <h3> replaced with <span> for heading hygiene.
   Mirror all parent-theme styles that targeted .category-box-content h3 */
.new-category-box .category-box-content .box-title {
  display: block;
  font-size: 15px;
  font-weight: 400;
  color: #333;
  margin: 0;
  padding: 0;
  padding-right: 90px;
  line-height: 23px;
  transition: 0.35s;
  font-family: "Poppins", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.new-category-box:hover .category-box-content .box-title { color: #fff; }
.category-small-box .box-title {
  display: block;
  font-size: 15px;
  font-weight: 400;
  color: #333;
  margin: 0;
  padding: 0;
  font-family: "Poppins", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* H2 override for [centered_headline] shortcode — mirrors parent h3.centered-headline styles */
h2.centered-headline {
  text-align: center;
  font-size: 24px;
  margin: 20px 0 15px 0;
  padding: 40px 0;
  display: block;
  background-color: #f6f6f6;
  font-family: "Poppins", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
h2.centered-headline span {
  display: block;
  font-size: 20px;
  color: #888;
  font-weight: 500;
  position: relative;
  margin-top: -10px;
  font-family: "Poppins", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Chevron arrow on "Browse all categories/regions" buttons — matches expired-banner arrow */
.browse-all-cat-btn .button.centered{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.browse-all-cat-btn__arrow{
  font-size: 18px;
  line-height: 1;
  transition: transform .25s;
}
.browse-all-cat-btn .button.centered:hover .browse-all-cat-btn__arrow{
  transform: translateX(4px);
}

/* Fix broken calendar icon on companies list (company_since meta).
   The loaded Linearicons WOFF is missing the calendar glyph (\eceb), so the browser
   falls back to Times New Roman and renders an empty square. Switch this single icon
   to Font Awesome (already loaded by the parent theme). \f073 = calendar. */
body ul.wpjmc-companies #company-meta #company-meta-company_since:before {
  font-family: "FontAwesome", "Font Awesome 5 Free" !important;
  font-weight: 900 !important;
  content: "\f073" !important;
  font-size: 14px !important;
  display: inline-block !important;
  width: 18px !important;
  text-align: center !important;
  margin-right: 8px !important;
}

/* Lighter placeholder hint text across all forms.
   Parent theme (workscout/style.css:16614 + :23061) sets
   `::placeholder { color:#808080; opacity:1; }`, which makes
   placeholders look almost like real values. Drop opacity to 0.5
   so they read clearly as hints. Vendor prefixes cover older browsers;
   each prefix needs its own block (combining them invalidates the rule).
   Selectors are body-prefixed to beat the parent's `input::placeholder`
   specificity. Includes textarea and select2 search field. */
body ::placeholder,
body input::placeholder,
body textarea::placeholder,
body .select2-container .select2-search--inline .select2-search__field::placeholder {
  color: #808080;
  opacity: 0.6;
}
body ::-webkit-input-placeholder { color: #808080; opacity: 0.6; }
body ::-moz-placeholder          { color: #808080; opacity: 0.6; }
body :-ms-input-placeholder      { color: #808080; opacity: 0.6; }
body ::-ms-input-placeholder     { color: #808080; opacity: 0.6; }

/* "İlk elan pulsuz" promo banner — replaces the messy 4th pricing card.
   Lives above the Standart/Plus/Pro grid inside #job_package_selection.
   Hidden radio carries the free package ID; the <label> CTA checks it
   and inline JS clicks the form's continue button. */
.vezife-free-radio {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
}

.vezife-free-banner {
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  border: 1px solid #a7f3d0;
  border-radius: 10px;
  padding: 22px 26px;
  margin: 0 0 28px 0;
  box-shadow: 0 1px 2px rgba(16, 185, 129, 0.08);
}

.vezife-free-banner-icon {
  font-size: 38px;
  line-height: 1;
  flex: 0 0 auto;
}

.vezife-free-banner-text {
  flex: 1 1 280px;
  min-width: 0;
}

.vezife-free-banner-title {
  margin: 0 0 4px 0;
  font-size: 20px;
  font-weight: 700;
  color: #065f46;
  line-height: 1.25;
}

.vezife-free-banner-sub {
  margin: 0;
  font-size: 14px;
  color: #047857;
  line-height: 1.45;
}

.vezife-free-banner-cta {
  flex: 0 0 auto;
  display: inline-block;
  background: #10b981;
  color: #fff !important;
  font-weight: 600;
  font-size: 15px;
  padding: 12px 22px;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, transform 0.05s ease;
  user-select: none;
  border: 0;
  line-height: 1.2;
}
.vezife-free-banner-cta:hover,
.vezife-free-banner-cta:focus {
  background: #059669;
  color: #fff !important;
  text-decoration: none;
  outline: none;
}
.vezife-free-banner-cta:active {
  transform: translateY(1px);
}

/* Mobile: stack icon + text, then full-width CTA */
@media (max-width: 600px) {
  .vezife-free-banner {
    padding: 18px;
    gap: 14px;
  }
  .vezife-free-banner-text {
    flex: 1 1 100%;
  }
  .vezife-free-banner-cta {
    width: 100%;
    text-align: center;
  }
}

/* Inline validation error when user submits without choosing a package
   (only fires when the free banner is visible — banner mode requires an
   explicit selection). */
.vezife-package-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
  padding: 12px 16px;
  border-radius: 8px;
  margin: 0 0 18px 0;
  font-size: 14px;
  font-weight: 500;
}

/* Dashboard fun-fact cards: parent theme hides .fun-fact:last-child between
   1365-1600px (designed for a 4-card layout where the 4th was Bookmarks).
   With Bookmarks/Applications plugins off, this hides "Total Jobs Views".
   Only keep the parent's hide rule when there are 4+ cards. */
@media (min-width: 1365px) and (max-width: 1600px) {
  .fun-facts-container .fun-fact:last-child {
    display: flex;
  }
  .fun-facts-container .fun-fact:last-child:nth-child(n+4) {
    display: none;
  }
}

/* ---------------------------------------- */
/* WhatsApp + Telegram social-links pill buttons */
/* ---------------------------------------- */
/* WordPress 6.x wraps the block's background AND `fill: currentColor` rules
   in :where(), dropping specificity to 0,1,0 — so on mobile they lose to
   theme rules and the icons/labels render dark instead of white. Restore
   brand colors and force white on anchor, label span, and SVG fill directly
   (specificity 0,2,2+). Desktop sizing stays at WP core defaults. Mobile
   gets a proportional bump so the pills don't look lost next to the bigger
   mobile heading and CTA above them. */
ul.wp-block-social-links li.wp-social-link-whatsapp { background-color: #25d366; }
ul.wp-block-social-links li.wp-social-link-telegram { background-color: #2aabee; }
ul.wp-block-social-links li.wp-social-link { border-radius: 9999px; }
ul.wp-block-social-links li.wp-social-link a,
ul.wp-block-social-links li.wp-social-link a:hover,
ul.wp-block-social-links li.wp-social-link a:visited,
ul.wp-block-social-links li.wp-social-link a:focus { color: #fff; }
ul.wp-block-social-links li.wp-social-link a .wp-block-social-link-label { color: #fff; }
ul.wp-block-social-links li.wp-social-link a svg,
ul.wp-block-social-links li.wp-social-link a svg path { fill: #fff; }

@media (max-width: 768px) {
  ul.wp-block-social-links { gap: 12px; }
  ul.wp-block-social-links li.wp-social-link a {
    padding: 10px 20px;
    min-height: 44px;
    box-sizing: border-box;
  }
  ul.wp-block-social-links li.wp-social-link a svg {
    width: 20px;
    height: 20px;
  }
  ul.wp-block-social-links li.wp-social-link a .wp-block-social-link-label {
    font-size: 14px;
  }
}

/* Hide company count on /sirketler/ until 50+ companies — restore by deleting this block */
body.post-type-archive-company #titlebar .ten.columns > span {
  display: none;
}
