/**
Theme Name: TravCorp
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: travcorp
Template: astra
*/

/* ==========================================================
   TOKENS
   ========================================================== */

:root{
  --tc-navy: #1A245F;
  --tc-accent: #007CEE;
  --tc-radius: 10px;

  --tc-max: 1180px;
  --tc-gutter: 24px;
}

/* ==========================================================
   CAREERS LISTING GRID (3-up desktop)
   Requires your listing template that outputs:
   .tc-job-card__link, .tc-job-card__title, etc.
   ========================================================== */

ul.job_listings{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

@media (max-width: 1100px){
  ul.job_listings{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 700px){
  ul.job_listings{ grid-template-columns: 1fr !important; }
}

/* neutralise any older grid styles on the anchor */
ul.job_listings li.job_listing a{
  grid-template-columns: none !important;
  background: transparent !important;
}

ul.job_listings li.job_listing a.tc-job-card__link{
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;

  padding: 22px !important;
  border: 1px solid var(--tc-navy) !important;
  border-radius: 5px !important;
  background: #fff !important;
  text-decoration: none !important;
  height: 100%;
  box-sizing: border-box !important;
}

.tc-job-card__title{
  margin: 0 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--tc-navy) !important;
  line-height: 1.25 !important;
  text-transform: uppercase;
}

.tc-job-card__location{
  font-size: 14px !important;
  color: #6b7280 !important;
  margin-top: -6px !important;
}

.tc-job-card__type{
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  background: rgba(26,36,95,0.06) !important;
  color: var(--tc-navy) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
}

.tc-job-card__text{
  color: #4b5563 !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.tc-job-card__cta{
  margin-top: auto !important;
  padding-top: 10px !important;
}

.tc-job-card__button{
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 16px !important;
  border-radius: 999px !important;
  background: var(--tc-navy) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-decoration: none !important;
}

/* ==========================================================
   SINGLE JOB BASE
   (Your template outputs .tc-job-single__header/.grid/.sidebar)
   ========================================================== */

/* Remove Astra default title/header for job_listing */
.single-job_listing .entry-header,
.single-job_listing header.entry-header,
.single-job_listing h1.entry-title{
  display: none !important;
}

/* Allow Astra container to use your wider setting */
.single-job_listing .ast-container,
.single-job_listing .ast-container > .ast-row,
.single-job_listing #content .ast-container{
  max-width: var(--tc-max) !important;
  width: 100% !important;
}

/* Remove sidebar if Astra tries to add one */
.single-job_listing #secondary{ display:none !important; }
.single-job_listing #primary{ width:100% !important; max-width:none !important; }

/* Job wrapper */
.tc-job-single{
  max-width: var(--tc-max);
  margin: 0 auto;
  padding: 0 var(--tc-gutter);
}

/* Title font rules you requested */
.single-job_listing .tc-job-single__title{
  font-size: 43px !important;
  line-height: 1.1 !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  color: var(--tc-navy) !important;
}

@media (max-width: 700px){
  .single-job_listing .tc-job-single__title{
    font-size: 23px !important;
    line-height: 1.15 !important;
  }
}

/* Figma: title + body have NO borders */
.single-job_listing .tc-job-single__header{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 18px 0 18px !important;
}

.single-job_listing .tc-job-single__content{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* ==========================================================
   RIGHT SIDEBAR – 3 BOXES (Figma)
   1) Accent blue (location/type + apply)
   2) Navy (core benefits)
   3) White w/ navy border (additional benefits)
   ========================================================== */

.single-job_listing .tc-job-single__sidebar{
  display: grid;
  gap: 18px;
}

/* base */
.tc-sidebox{
  border-radius: var(--tc-radius);
  padding: 22px;
  box-shadow: none;
  border: 0;
}

/* BOX 1 */
.tc-sidebox--primary{
  background: var(--tc-accent);
  color: #fff;
}

/* icon + text rows (THIS fixes your 4-line issue) */
.tc-sidebox__row{
  display: grid !important;
  grid-template-columns: 28px 1fr !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
}

.tc-sidebox__icon{
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.tc-sidebox__icon svg{
  width: 20px;
  height: 20px;
  display:block;
  fill: none;
  stroke: #fff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* In Figma these are basically one text style */
.tc-sidebox__label{ display:none !important; } /* hide label if you output one */
.tc-sidebox__value{
  font-weight: 300;
  font-size: 18px;
  line-height: 31px;
  color: #fff;
}

/* Apply button: LEFT aligned */
.tc-sidebox--primary .job_application,
.tc-sidebox--primary .application,
.tc-sidebox--primary .job_application_details{
  margin: 0 !important;
}

.tc-sidebox--primary a,
.tc-sidebox--primary input[type="submit"],
.tc-sidebox--primary button{
  display: inline-flex;
  justify-content: center;
  align-items: center;

  background: var(--tc-navy);
  color: #fff;

  border: 0;
  border-radius: 25px;
  padding: 12px 22px;

  font-weight: 400;
  font-size: 17px;
  line-height: 26px;

  text-decoration: none;
  cursor: pointer;

  width: auto !important;
}

/* BOX 2 */
.tc-sidebox--dark{
  background: var(--tc-navy);
  color: #fff;
  border-radius: var(--tc-radius);
}

.tc-sidebox--dark .tc-sidebox__title{
  margin: 0 0 14px;
  font-weight: 300;
  font-size: 30px;
  line-height: 36px;
  color: #fff;
}

/* BOX 3 */
.tc-sidebox--light{
  background: #fff;
  border: 1px solid var(--tc-navy);
  border-radius: var(--tc-radius);
  color: var(--tc-navy);
}

.tc-sidebox--light .tc-sidebox__title{
  margin: 0 0 14px;
  font-weight: 300;
  font-size: 30px;
  line-height: 36px;
  color: var(--tc-navy);
}

/* Bullets – 17/26 */
.tc-bullets{
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
}

.tc-bullets li{
  font-weight: 300;
  font-size: 17px;
  line-height: 26px;
}

.tc-sidebox--dark .tc-bullets li{ color:#fff; }
.tc-sidebox--light .tc-bullets li{ color:var(--tc-navy); }

/* ==========================================================
   SINGLE JOB – restore full-bleed Elementor hero + 2-column layout
   ========================================================== */

/* 1) Full-bleed Elementor hero wrapper */
.single-job_listing .tc-job-hero-el{
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* 2) Restore the main single job grid (content + right sidebar) */
.single-job_listing .tc-job-single__grid{
  display: grid !important;
  grid-template-columns: 1fr 360px !important;
  gap: 24px !important;
  align-items: start !important;
}

/* Make sure sidebar actually sits as the right column */
.single-job_listing .tc-job-single__sidebar{
  display: grid !important;
  gap: 18px !important;
}

/* Responsive: stack on smaller screens */
@media (max-width: 980px){
  .single-job_listing .tc-job-single__grid{
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================
   BOX 1: button on the right + consistent spacing
   ========================================================== */

/* Consistent padding and type rhythm across all boxes */
.tc-sidebox{
  padding: 20px !important;       /* match all three */
}

.tc-sidebox__title{
  margin: 0 0 12px !important;
}

/* Bullet list spacing */
.tc-bullets{
  gap: 4px !important;
}
.tc-bullets li{
  font-size: 17px !important;
  line-height: 26px !important;
}

/* Box 1: two-column layout (info left, button right) */
.tc-sidebox--primary .tc-sidebox__top{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
}

.single-job_listing .tc-sidebox--primary .tc-sidebox__info{
  gap: 4px !important;
}

/* Row spacing + typography (matches Figma 18/31) */
.tc-sidebox__row{
  margin-bottom: 0 !important;
  grid-template-columns: 24px 1fr !important;
  gap: 12px !important;
}

.tc-sidebox__value{
  font-size: 18px !important;
  line-height: 31px !important;
  font-weight: 300 !important;
}

/* Apply button should size to content and sit right */
.tc-sidebox--primary .tc-sidebox__cta{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 0 !important;
}

/* If WPJM outputs a wrapper div, keep it from stretching */
.tc-sidebox--primary .job_application,
.tc-sidebox--primary .application,
.tc-sidebox--primary .job_application_details{
  width: auto !important;
}

/* Button sizing to match Figma */
.tc-sidebox--primary a,
.tc-sidebox--primary input[type="submit"],
.tc-sidebox--primary button{
  width: auto !important;
  min-width: 140px;
  padding: 12px 22px !important;
  border-radius: 25px !important;
  font-size: 17px !important;
  line-height: 26px !important;
}

/* Mobile: stack button under rows */
@media (max-width: 700px){
  .tc-sidebox--primary .tc-sidebox__top{
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .tc-sidebox--primary .tc-sidebox__cta{
    justify-content: flex-start;
  }
}

/* Apply button: no colour change on hover */
.single-job_listing .tc-sidebox--primary .tc-apply-btn,
.single-job_listing .tc-sidebox--primary .tc-apply-btn:visited,
.single-job_listing .tc-sidebox--primary .tc-apply-btn:hover,
.single-job_listing .tc-sidebox--primary .tc-apply-btn:focus,
.single-job_listing .tc-sidebox--primary .tc-apply-btn:active{
  color: #fff !important;
  background: var(--tc-navy) !important;
  text-decoration: none !important;
  opacity: 1 !important;
  filter: none !important;
}