/* 1. Set the Container: Force everything to stack vertically */
.elementor-widget-sidebar ul li,
.widget_recent_entries li,
.rpwe-block li {
    width: 100%;           /* Fills the sidebar exactly */
    margin-bottom: 25px;   /* Space between articles */
    list-style: none;      /* Removes bullet points */
    padding: 0;
    border: none;          /* Removes border for a cleaner look */
}

/* 2. The Image: Force it to match the text width perfectly */
.elementor-widget-sidebar img, 
.rpwe-thumb,
.widget_recent_entries img {
    width: 100% !important;
    height: 160px !important;
    object-fit: cover;
    margin-bottom: 10px;
    border-radius: 12px !important;
    display: block;
}

/* 3. The Text: Cut it off after 2 lines */
.elementor-widget-sidebar h3, 
.elementor-widget-sidebar a,
.rpwe-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;    /* CHANGE THIS to '3' if you want more text */
    -webkit-box-orient: vertical;
    overflow: hidden;         /* Hides the rest of the text */
    text-overflow: ellipsis;  /* Adds the '...' */
    
    /* Styling to make it look neat */
    width: 100%;              /* Ensures text is exactly as wide as the image */
    margin: 0;
    font-size: 15px;          /* Readable text size */
    line-height: 1.4em;       /* Good spacing between lines */
    text-decoration: none;
    font-weight: 600;         /* Bold title */
}








/* GLOBAL PARAGRAPH SPACING */
/* This adds breathing room between paragraphs site-wide */
p {
    margin-bottom: 24px !important; /* The space between paragraphs */
    line-height: 1.6em !important;  /* The space between lines of text */
}

/* Optional: Ensures lists inside your content also have the same spacing */
.entry-content ul, 
.entry-content ol,
.elementor-widget-text-editor ul, 
.elementor-widget-text-editor ol {
    margin-bottom: 24px !important;
}






/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   MASTER JOB CARD STYLES (Clean Cards â€” replaces post-it notes)
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */

/* 1. BASE CARD SHAPE */
ul.job_listings li.job_listing {
    border: none !important;
    border-radius: 8px !important;
    background-color: #f0f7f0 !important;
    background-image: none !important;
    box-shadow: none !important;
    min-height: auto !important;
    height: auto !important;
    margin-bottom: 12px !important;
    padding: 0 !important;
    list-style: none !important;
    overflow: hidden !important;
    position: relative;
    z-index: 1;
    transform: none !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

/* 2. HOVER */
ul.job_listings li.job_listing:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    z-index: 100;
}

/* 3. PASTEL COLOUR ROTATION */
ul.job_listings li.job_listing:nth-child(4n+1) {
    background-color: rgba(128, 216, 255, 0.5) !important; /* Soft blue */
    transform: none !important;
}
ul.job_listings li.job_listing:nth-child(4n+2) {
    background-color: rgba(204, 255, 144, 0.55) !important; /* Soft green */
    transform: none !important;
}
ul.job_listings li.job_listing:nth-child(4n+3) {
    background-color: rgba(255, 241, 118, 0.55) !important; /* Soft yellow */
    transform: none !important;
}
ul.job_listings li.job_listing:nth-child(4n+4) {
    background-color: rgba(255, 128, 171, 0.5) !important; /* Soft pink */
    transform: none !important;
}
ul.job_listings li.job_listing:nth-child(4n+1):hover,
ul.job_listings li.job_listing:nth-child(4n+2):hover,
ul.job_listings li.job_listing:nth-child(4n+3):hover,
ul.job_listings li.job_listing:nth-child(4n+4):hover {
    transform: translateY(-2px) !important;
}

/* 4. FEATURED CARDS */
ul.job_listings li.job_listing.job_position_featured {
    background-color: #fdf8e8 !important;
    border: 2px solid #d4a843 !important;
    position: relative !important;
    overflow: hidden !important;
}

/* 5. FEATURED BANNER (diagonal ribbon) */
ul.job_listings li.job_listing.job_position_featured::after {
    content: "FEATURED JOB";
    position: absolute;
    top: 12px;
    right: -35px;
    background: #2d4a2d;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    padding: 3px 40px;
    transform: rotate(45deg);
    z-index: 10;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    white-space: nowrap;
    text-align: center;
}

/* 6. CARD CONTENT LAYOUT (Desktop) */
ul.job_listings li.job_listing a {
    display: flex;
    align-items: center;
    padding: 14px 80px 14px 80px !important;
    text-decoration: none;
    width: 100%;
    min-height: 80px;
    box-sizing: border-box;
    position: relative;
    background: transparent !important;
    background-image: none !important;
}

/* Logo (Pinned Left) */
ul.job_listings li.job_listing .job_listing-logo {
    position: absolute !important;
    left: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 50px !important;
    height: 50px !important;
    margin: 0 !important;
}
ul.job_listings li.job_listing .company_logo {
    width: 50px !important;
    height: 50px !important;
    object-fit: contain !important;
    background: transparent;
    border-radius: 6px;
}

/* Location â€” now visible */
ul.job_listings li.job_listing .location {
    display: block !important;
    font-size: 13px !important;
    color: #777 !important;
}

/* Date (Centered Right) */
ul.job_listings li.job_listing .meta {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    right: 15px !important;
    margin: 0 !important;
    text-align: right;
    font-size: 12px !important;
    color: #999 !important;
    width: 100px;
    padding: 0 !important;
}
ul.job_listings li.job_listing .meta li { display: inline-block; margin: 0; }

/* 7. TYPOGRAPHY */
ul.job_listings li.job_listing h3 {
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 700;
    color: #1a1a1a !important;
    margin: 0 0 2px 0 !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    overflow: hidden;
}

ul.job_listings li.job_listing .company {
    font-size: 13px !important;
    color: #555 !important;
    text-transform: none;
    font-weight: 400;
}

/* 8. SIDEBAR CARD FIXES */
.elementor-widget-sidebar ul.job_listings li.job_listing a,
.widget-area ul.job_listings li.job_listing a,
.widget_job_listing ul.job_listings li.job_listing a {
    padding: 14px !important;
    gap: 12px !important;
    justify-content: flex-start !important;
    min-height: auto !important;
}
.elementor-widget-sidebar .job_listing-logo,
.widget_job_listing .job_listing-logo {
    position: static !important;
    transform: none !important;
    flex-shrink: 0;
}
.single-job_listing .elementor-widget-sidebar .meta,
.single-job_listing .widget_job_listing .meta {
    display: none !important;
}

/* 9. MOBILE RESPONSIVENESS */
@media (max-width: 600px) {
    ul.job_listings li.job_listing {
        margin-bottom: 10px !important;
    }

    ul.job_listings li.job_listing a {
        padding: 14px 14px 14px 60px !important;
        gap: 12px !important;
        display: flex !important;
        justify-content: flex-start !important;
        position: relative !important;
    }
    ul.job_listings li.job_listing .job_listing-logo {
        position: absolute !important;
        left: 10px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
        flex-shrink: 0;
    }
    ul.job_listings li.job_listing .company_logo {
        width: 40px !important;
        height: 40px !important;
    }
    ul.job_listings li.job_listing .meta {
        display: none !important;
    }
    ul.job_listings li.job_listing .position,
    ul.job_listings li.job_listing .position h3 {
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
        font-size: 14px !important;
        line-height: 1.3 !important;
    }
}






/* 1. CONTAINER: Vertical centering and removing theme grid restrictions */
.job_filters .search_jobs {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;     /* Centers everything top-to-bottom */
    justify-content: center !important; /* Pulls the remaining boxes together */
    gap: 12px !important;               /* Reduced gap to half as requested */
    padding: 20px !important;           /* Equal space from top and bottom edges */
    background: #f1f1f1 !important;     /* Maintains the grey box */
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 2. REMOVE GHOSTS: Total removal of the middle slot and its hidden container */
.search_location, .search_regions, .job-manager-region-filter,
.job_filters .search_jobs > div:nth-child(2) {
    display: none !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 0 !important;
}

/* 3. CENTER STRETCH: Force boxes to elongate and fill that middle empty space */
.job_filters .search_jobs > div.search_keywords, 
.job_filters .search_jobs > div.search_categories {
    flex: 1 1 auto !important;          /* This is the secretâ€”forces them to expand */
    margin: 0 !important;               /* Kills theme margins pushing boxes away */
    padding: 0 !important;              /* Kills theme padding */
    max-width: none !important;
    min-width: 0 !important;
}

/* 4. BUTTON: Maintain fixed size so it doesn't stretch */
.job_filters .search_jobs > div.search_submit {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 5. STYLING: High rounding (25px) and pixel-perfect height */
.job_filters .search_jobs input[type="text"],
.job_filters .search_jobs select,
.job_filters .search_jobs .select2-container--default .select2-selection--single,
.job_filters .search_jobs button {
    height: 50px !important;            /* Uniform height for a perfectly straight line */
    border-radius: 25px !important;     /* Matches your blog image style */
    border: 1px solid #ddd !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 !important;
}

/* 6. BUTTON COLOR & BRANDING */
.job_filters .search_jobs button {
    background-color: #344e36 !important; /* Your brand green */
    color: #ffffff !important;
    font-weight: 700 !important;
    border: none !important;
    cursor: pointer !important;
    padding: 0 35px !important;
}

/* Fix for Select2 category dropdown to ensure text is centered */
.job_filters .search_jobs .select2-container--default .select2-selection--single {
    display: flex !important;
    align-items: center !important;
}











/* 1. UNIVERSAL SELECTOR: Targets the base HTML tags for all buttons */
button, 
input[type="button"], 
input[type="submit"], 
input[type="reset"],
.button, 
.btn,
.wp-block-button__link {
    border-radius: 20px !important; /* Adjust this to match your feature images exactly */
    overflow: hidden !important;
}

/* 2. SPECIFIC TARGETS: For Subscribe forms, Mailchimp, and Job Manager buttons */
#submit, 
#searchsubmit,
.subscribe-button,
.newsletter-submit,
.job-manager-button,
.application_button,
.submit-job-button,
.load_more_jobs {
    border-radius: 20px !important;
}

/* 3. LINK BUTTONS: For links styled as buttons (very common in WP) */
a.button, 
a.btn, 
a.wp-block-button__link {
    border-radius: 20px !important;
    display: inline-block; /* Ensures rounding is visible on links */
}

















/* --- MASTER NOTEBOOK SKIN (RESPONSIVE & GLOBAL) --- */

/* 1. The Paper Background (Smart Responsive) */
body, html {
    background-color: #fdfbf7 !important; /* Cream Paper */
    background-attachment: fixed !important; /* Content scrolls, paper stays */
}

/* Desktop View (Standard Notebook) */
@media (min-width: 769px) {
    body, html {
        background-image: 
            /* Red Margin at 80px */
            linear-gradient(90deg, transparent 79px, #ffb3b3 80px, transparent 81px),
            /* Blue Lines every 30px */
            linear-gradient(#e1e8ed 1px, transparent 1px) !important;
        background-size: 100% 100%, 100% 30px !important;
    }
}

/* Mobile View (Phone Optimized) */
@media (max-width: 768px) {
    body, html {
        background-image: 
            /* Red Margin reduced to 20px so content fits */
            linear-gradient(90deg, transparent 19px, #ffb3b3 20px, transparent 21px),
            /* Blue Lines every 30px */
            linear-gradient(#e1e8ed 1px, transparent 1px) !important;
        background-size: 100% 100%, 100% 30px !important;
    }
}

/* 2. Global Transparency (The "X-Ray" Effect) */
/* Targets all layouts: Homepage, Blog Posts, Archives, etc. */
#page, .site, .site-content, .site-inner, .wrap, #content, 
.entry-content, article, main, .container, .wrapper,
.elementor-section, .elementor-column, .elementor-widget-wrap, 
.elementor-container, .elementor-widget, .widget-area, .widget,
.elementor-location-header, .elementor-location-footer,
.elementor-location-single, .elementor-location-archive,
#comments, #respond {
    background-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* 3. Search Box Styling (Sketched Look) */
form.job_search_form,
.elementor-search-form__container {
    background-color: rgba(255, 255, 255, 0.6) !important;
    border: 2px solid #333 !important;
}
.job_search_form input,
.elementor-search-form__input {
    background-color: transparent !important;
}

/* 4. Clean Up Titles */
.widget-title, h1, h2, h3, h4, h5, h6 {
    background: transparent !important;
}






















.home .post-thumbnail img,
.home article > img,
.home .entry-content > .wp-post-image {
    display: none;
}















.single_job_listing .jp-relatedposts,
.posttype-job_listing .jp-relatedposts,
body.single-job_listing .jp-relatedposts {
    display: none !important;
}















.widget-area ul.job_listings li.job_listing a {
    display: flex !important;
    align-items: center !important;
    padding: 14px !important;
    gap: 12px !important;
}

.widget-area ul.job_listings li.job_listing a img {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    object-fit: contain !important;
    border-radius: 6px !important;
}

.widget-area ul.job_listings li.job_listing a .position {
    margin-left: 0 !important;
    width: auto !important;
    flex: 1 !important;
}

.widget-area ul.job_listings li.job_listing a .position h3 {
    font-size: 14px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    font-weight: 700 !important;
    word-wrap: break-word !important;
    color: #1a1a1a !important;
}

.widget-area ul.job_listings li.job_listing a .date,
.widget-area ul.job_listings li.job_listing a .location,
.widget-area ul.job_listings li.job_listing a .company {
    display: none !important;
}
.widget-area ul.job_listings li.job_listing a .meta {
    display: none !important;
}
body.home .widget-area ul.job_listings li.job_listing a .meta {
    display: none !important;
}

















.job-listing-blog-posts .col-md-4 h4 {
    font-size: 16px !important;
}

.job-listing-blog-posts .col-md-4 img {
    min-height: 150px !important;
    object-fit: cover !important;
}

.job-listing-blog-posts h3 {
    font-size: 24px !important;
}


















@media (max-width: 767px) {

  /* Force the flex container to wrap vertically */
  .job_filters .search_jobs {
    flex-direction: column !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
  }

  /* Make each field full width */
  .job_filters .search_jobs .search_keywords,
  .job_filters .search_jobs .search_region,
  .job_filters .search_jobs .search_categories,
  .job_filters .search_jobs .search_submit {
    width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
  }

  /* Ensure inputs/selects fill their containers */
  .job_filters .search_jobs input[type="text"],
  .job_filters .search_jobs select,
  .job_filters .search_jobs .chosen-container {
    width: 100% !important;
    min-height: 44px;
    font-size: 16px;
  }

  /* Full-width tappable search button */
  .job_filters .search_jobs .search_submit input[type="submit"],
  .job_filters .search_jobs .search_submit button {
    width: 100% !important;
    min-height: 48px;
    font-size: 16px;
  }
}






















@media (max-width: 767px) {

  /* === HEADER & HERO TIGHTENING === */

  img.custom-logo {
    max-height: 70px !important;
    width: auto !important;
  }

  #content.page-section {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .home .entry-header {
    display: none !important;
  }

  h1.entry-title {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    padding: 0 !important;
    font-size: 24px !important;
  }

  .home .post-thumbnail {
    display: none !important;
  }

  .entry-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  .home .e-con {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .home .e-con-inner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .home .elementor-element-20ffd2a {
    margin: 0 !important;
    padding: 0 !important;
  }

  .home .elementor-element-4b704cd8 {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .home article.hentry {
    padding: 0 !important;
  }

  .home .main-job-feed {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .home .job_filters {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .home .job_listings[data-show_filters="true"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* === SEARCH FORM === */

  .job_filters .search_jobs {
    flex-direction: column !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
  }

  .job_filters .search_jobs .search_keywords,
  .job_filters .search_jobs .search_location,
  .job_filters .search_jobs .search_region,
  .job_filters .search_jobs .search_categories,
  .job_filters .search_jobs .search_submit {
    width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
  }

  .job_filters .search_jobs input[type="text"],
  .job_filters .search_jobs select,
  .job_filters .search_jobs .chosen-container {
    width: 100% !important;
    min-height: 44px;
    font-size: 16px;
  }

  .job_filters .search_jobs .search_submit input[type="submit"],
  .job_filters .search_jobs .search_submit button {
    width: 100% !important;
    min-height: 48px;
    font-size: 16px;
  }

  /* === EMAIL SIGNUP FORM ON MOBILE === */

  #mailpoet_form_3 {
    width: 100% !important;
    max-width: 100% !important;
  }

  #mailpoet_form_3 form.mailpoet_form {
    padding: 15px !important;
    box-sizing: border-box !important;
  }

  #mailpoet_form_3 .mailpoet_form_columns {
    flex-direction: column !important;
  }

  #mailpoet_form_3 .mailpoet_form_column {
    flex-basis: 100% !important;
    margin-left: 0 !important;
    width: 100% !important;
  }

  #mailpoet_form_3 .mailpoet_text,
  #mailpoet_form_3 .mailpoet_submit {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* === HIDE SIDEBAR ON MOBILE === */

  #secondary.widget-area {
    display: none !important;
  }
}





















/* Hide default featured image only in the main content area, not sidebars/widgets */
#primary img[alt="Default Featured Image of The Feed logo for the London Music Jobs website."],
.entry-content img[alt="Default Featured Image of The Feed logo for the London Music Jobs website."],
.entry-header img[alt="Default Featured Image of The Feed logo for the London Music Jobs website."] {
    display: none !important;
}
























/* 1. Rounded corners on ALL blog/post images sitewide */
.elementor-post__thumbnail img,
.elementor-posts-container img,
.rpwe-thumb,
.widget_recent_entries img,
.wp-post-image {
    border-radius: 12px !important;
}

/* 2. Fix job listings in ALL sidebars sitewide */
.elementor-location-single ul.job_listings li.job_listing a,
.widget-area ul.job_listings li.job_listing a,
.widget_job_listing ul.job_listings li.job_listing a,
.elementor-widget-sidebar ul.job_listings li.job_listing a {
    display: flex !important;
    align-items: center !important;
    padding: 14px !important;
    gap: 12px !important;
    min-height: auto !important;
    justify-content: flex-start !important;
}

.elementor-location-single ul.job_listings li.job_listing a img,
.widget-area ul.job_listings li.job_listing a img,
.widget_job_listing ul.job_listings li.job_listing a img,
.elementor-widget-sidebar ul.job_listings li.job_listing a img {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    object-fit: contain !important;
    position: static !important;
    transform: none !important;
    flex-shrink: 0 !important;
    border-radius: 6px !important;
}

.elementor-location-single ul.job_listings li.job_listing a .position,
.widget-area ul.job_listings li.job_listing a .position,
.widget_job_listing ul.job_listings li.job_listing a .position,
.elementor-widget-sidebar ul.job_listings li.job_listing a .position {
    margin-left: 0 !important;
    width: auto !important;
    flex: 1 !important;
}

.elementor-location-single ul.job_listings li.job_listing a .position h3,
.widget-area ul.job_listings li.job_listing a .position h3,
.widget_job_listing ul.job_listings li.job_listing a .position h3,
.elementor-widget-sidebar ul.job_listings li.job_listing a .position h3 {
    font-size: 14px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    font-weight: 700 !important;
    word-wrap: break-word !important;
    color: #1a1a1a !important;
}

.single-job_listing .elementor-location-single ul.job_listings li.job_listing a .meta,
.single-job_listing .elementor-location-single ul.job_listings li.job_listing a .date,
.elementor-location-single ul.job_listings li.job_listing a .location,
.elementor-location-single ul.job_listings li.job_listing a .company,
.single-job_listing .widget-area ul.job_listings li.job_listing a .meta,
.widget-area ul.job_listings li.job_listing a .date,
.widget-area ul.job_listings li.job_listing a .location,
.widget-area ul.job_listings li.job_listing a .company,
.single-job_listing .widget_job_listing ul.job_listings li.job_listing a .meta,
.widget_job_listing ul.job_listings li.job_listing a .date,
.widget_job_listing ul.job_listings li.job_listing a .location,
.widget_job_listing ul.job_listings li.job_listing a .company,
.single-job_listing .elementor-widget-sidebar ul.job_listings li.job_listing a .meta,
.elementor-widget-sidebar ul.job_listings li.job_listing a .date,
.elementor-widget-sidebar ul.job_listings li.job_listing a .location,
.elementor-widget-sidebar ul.job_listings li.job_listing a .company {
    display: none !important;
}

.elementor-location-single ul.job_listings li.job_listing,
.widget-area ul.job_listings li.job_listing,
.widget_job_listing ul.job_listings li.job_listing,
.elementor-widget-sidebar ul.job_listings li.job_listing {
    margin-bottom: 12px !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
    min-height: auto !important;
    height: auto !important;
}

/* 3. Circular social/share icons sitewide */
.elementor-share-btn,
.elementor-social-icon,
.elementor-icon,
a.elementor-social-icon {
    border-radius: 50% !important;
    min-width: 44px;
    min-height: 44px;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.elementor-share-btn__icon,
.elementor-social-icon-inner {
    border-radius: 50%;
    padding: 10px;
}

.elementor-share-btn:hover,
.elementor-social-icon:hover {
    transform: scale(1.1);
    opacity: 0.9;
}

.elementor-grid.elementor-grid-0 {
    gap: 8px;
}











/* Fix job title overlapping with posted date â€” main feed only */
body.home ul.job_listings li.job_listing > a {
    padding-right: 130px !important;
}

body.home ul.job_listings li.job_listing > a > .position,
body.home ul.job_listings li.job_listing > a > .position h3 {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
}

/* Undo for sidebar */
body.home .elementor-widget-sidebar ul.job_listings li.job_listing > a,
body.home .widget-area ul.job_listings li.job_listing > a,
body.home #secondary ul.job_listings li.job_listing > a {
    padding: 14px !important;
}

body.home .elementor-widget-sidebar ul.job_listings li.job_listing > a > .position,
body.home .elementor-widget-sidebar ul.job_listings li.job_listing > a > .position h3,
body.home .widget-area ul.job_listings li.job_listing > a > .position,
body.home .widget-area ul.job_listings li.job_listing > a > .position h3,
body.home #secondary ul.job_listings li.job_listing > a > .position,
body.home #secondary ul.job_listings li.job_listing > a > .position h3 {
    overflow: visible !important;
    text-overflow: unset !important;
    display: block !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    max-width: none !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}












img {
    border-radius: 8px !important;
}

.elementor-post__thumbnail,
.elementor-widget-sidebar .elementor-post__thumbnail,
.widget-area .elementor-post__thumbnail {
    border-radius: 8px !important;
    overflow: hidden !important;
}




















/* Override theme link colour */
a, a:visited {
    color: #335337 !important;
    font-weight: 700 !important;
}

a:hover {
    color: #54595F !important;
}

/* Keep button text white */
a.button, a.btn, a.wp-block-button__link,
button a, .button a, .btn a,
input[type="submit"],
.elementor-button a,
.elementor-button span,
.woocommerce a.button,
.job-manager-button,
.application_button,
a.job-manager-button,
.wp-block-button a,
.submit-job-button,
a.wp-element-button,
.wc-block-components-button,
a[class*="button"],
a[class*="btn"] {
    color: #ffffff !important;
    font-weight: 400 !important;
}

/* Blog titles: black like other headlines */
.entry-title a,
.entry-title a:visited,
.elementor-post__title a,
.elementor-post__title a:visited {
    color: #1a1a1a !important;
}



















/* Increase nav menu text size */
.main-navigation a,
.primary-menu a,
.menu-item a,
nav#site-navigation a {
    font-size: 18px !important;
}













/* Hide Logout when logged out */
body:not(.logged-in) .menu-item a[href*="logout"] {
    display: none !important;
}

/* Hide Login when logged in */
body.logged-in .menu-item a[href*="/login/"] {
    display: none !important;
}





















@media (max-width: 767px) {
    /* Reduce logo size */
    body.home img.custom-logo {
        max-height: 50px !important;
    }
    
    /* Kill all gaps between logo and content */
    body.home .site-header,
    body.home .site-branding {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    
    /* Reduce heading size and spacing */
    body.home h1.entry-title,
    body.home .entry-title {
        font-size: 22px !important;
        margin: 5px 0 !important;
        padding: 0 !important;
    }
    
    /* Tighten body text */
    body.home .entry-content p {
        margin-bottom: 10px !important;
        font-size: 14px !important;
    }
    
    /* Reduce search box padding */
    body.home .job_filters .search_jobs {
        padding: 10px !important;
    }
    
    /* Kill all container spacing */
    body.home #content,
    body.home .site-content,
    body.home main,
    body.home .entry-content,
    body.home article.hentry,
    body.home #primary {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
}







@media (max-width: 767px) {
    body.home .site-header {
        padding-bottom: 0 !important;
        margin-bottom: -30px !important;
    }
    
    body.home header#masthead {
        padding-bottom: 0 !important;
        margin-bottom: -30px !important;
    }
}



















@media (max-width: 1024px) {
    .elementor-location-header {
        position: relative !important;
        z-index: 99999 !important;
    }
    
    .elementor-menu-toggle {
        position: relative !important;
        z-index: 99999 !important;
        pointer-events: auto !important;
        cursor: pointer !important;
    }
    
    /* Nuclear option: hide anything from theme that might overlay */
    #masthead,
    .site-header,
    nav#site-navigation {
        display: none !important;
        pointer-events: none !important;
        position: absolute !important;
        z-index: -1 !important;
    }
}


















body.home ul.job_listings li.job_listing > a {
    padding-right: 180px !important;
}





















/* System font stack (matching The Needle Drop) */
body,
h1, h2, h3, h4, h5, h6,
p, li, a, span, div,
.entry-title, .entry-content,
.elementor-heading-title,
.elementor-widget-text-editor,
.widget-title,
ul.job_listings li.job_listing h3,
ul.job_listings li.job_listing .company,
ul.job_listings li.job_listing .location,
ul.job_listings li.job_listing .meta,
.job_filters .search_jobs input,
.job_filters .search_jobs select,
.job_filters .search_jobs button,
.main-navigation a,
.primary-menu a,
.menu-item a {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif !important;
}










/* Lighter blog titles in sidebar and bottom-of-page widgets */
.elementor-post__title,
.elementor-post__title a,
.rpwe-title,
.rpwe-title a,
.elementor-widget-sidebar h3,
.elementor-widget-sidebar h3 a,
.widget-area h3,
.widget-area h3 a {
    font-weight: 550 !important;
}



















/* Space Grotesk for all headings sitewide */
h1, h2, h3, h4, h5, h6,
.entry-title,
.elementor-heading-title,
.widget-title,
.elementor-post__title,
.elementor-post__title a,
ul.job_listings li.job_listing h3,
.widget-area ul.job_listings li.job_listing a .position h3,
.elementor-widget-sidebar ul.job_listings li.job_listing a .position h3,
.rpwe-title,
.rpwe-title a,
.elementor-widget-sidebar h3,
.elementor-widget-sidebar h3 a,
.widget-area h3,
.widget-area h3 a {
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 550 !important;
}





















@media (max-width: 600px) {
  body ul.job_listings li.job_listing.type-job_listing.status-publish a {
    display: block !important;
    position: relative !important;
    padding: 14px 74px 14px 14px !important;
    min-height: auto !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a .position {
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a h3 {
    font-size: 14px !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    -webkit-line-clamp: unset !important;
    display: block !important;
    font-weight: 600 !important;
    white-space: normal !important;
    height: auto !important;
    text-align: left !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a img.company_logo {
    position: absolute !important;
    right: 14px !important;
    left: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    float: none !important;
    border-radius: 8px !important;
    object-fit: contain !important;
    background: #fff !important;
    padding: 3px !important;
    visibility: visible !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a .company,
  body ul.job_listings li.job_listing.type-job_listing.status-publish a .location {
    display: none !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a ul.meta {
    display: block !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
    width: 100% !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
    font-size: 11px !important;
    opacity: 0.7 !important;
    height: auto !important;
    float: none !important;
    text-align: left !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a ul.meta li {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    width: auto !important;
    line-height: 1.4 !important;
    text-align: left !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a ul.meta li time,
  body ul.job_listings li.job_listing.type-job_listing.status-publish a ul.meta li label {
    text-align: left !important;
    float: none !important;
    display: inline !important;
  }
  body ul.job_listings li.job_listing.type-job_listing.status-publish a .featured_job_badge,
  body ul.job_listings li.job_listing.type-job_listing.status-publish a .ribbon {
    transform: scale(0.7) !important;
    transform-origin: top right !important;
  }
}













@media (max-width: 1024px) {
  /* Hide the menu widget's parent wrapper at mobile (kills the white space) */
  body .elementor-element.elementor-element-ab70c9b {
    display: none !important;
  }
  /* Hide the spacer between logo and page title on mobile */
  body .elementor-element.elementor-element-d01efe0 {
    display: none !important;
  }

  /* Branded hamburger button — top right, square, brand green with black border */
  #feed-hamburger-btn {
    position: fixed !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 99999 !important;
    width: 48px !important;
    height: 48px !important;
    border: 2px solid #1a1a1a !important;
    background: #335337 !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    padding: 0 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
  }
  #feed-hamburger-btn svg {
    width: 24px !important;
    height: 24px !important;
    stroke: #fff !important;
    fill: none !important;
    stroke-width: 2.5 !important;
    stroke-linecap: round !important;
  }
  body.feed-menu-open #feed-hamburger-btn .feed-ham-open { display: none !important; }
  body:not(.feed-menu-open) #feed-hamburger-btn .feed-ham-close { display: none !important; }

  /* Branded dropdown panel — cream bg, green border, anchored under the button */
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b {
    display: block !important;
    position: fixed !important;
    top: 72px !important;
    right: 14px !important;
    left: auto !important;
    width: auto !important;
    max-width: calc(100vw - 28px) !important;
    min-width: 260px !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 99998 !important;
    background: #faf6ed !important;
    border: 3px solid #335337 !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.22) !important;
    overflow: hidden !important;
    animation: feedMenuDrop 0.25s ease-out !important;
  }
  @keyframes feedMenuDrop {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
  }

  body.feed-menu-open .elementor-element.elementor-element-ab70c9b .elementor-element.elementor-element-bddb36d {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    height: auto !important;
  }
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown {
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    position: static !important;
    width: 100% !important;
    background: transparent !important;
  }
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu {
    display: block !important;
    padding: 6px !important;
    margin: 0 !important;
    background: transparent !important;
  }
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item {
    display: block !important;
    width: 100% !important;
    margin: 0 0 4px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
  }
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item:last-child {
    margin-bottom: 0 !important;
  }

  /* Menu items — bold black uppercase, white background, black border on all four sides */
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item a.elementor-item {
    display: block !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: #1a1a1a !important;
    background: #fff !important;
    border: 2px solid #1a1a1a !important;
    border-top: 2px solid #1a1a1a !important;
    border-right: 2px solid #1a1a1a !important;
    border-bottom: 2px solid #1a1a1a !important;
    border-left: 2px solid #1a1a1a !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    transition: background 0.15s ease, color 0.15s ease !important;
  }

  /* Current/active page — filled brand green with cream text */
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item.current-menu-item a.elementor-item,
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item a.elementor-item.elementor-item-active {
    background: #335337 !important;
    color: #faf6ed !important;
  }

  /* Tap/hover state — same as active */
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item a.elementor-item:hover,
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item a.elementor-item:active,
  body.feed-menu-open .elementor-element.elementor-element-ab70c9b nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item a.elementor-item:focus {
    background: #335337 !important;
    color: #faf6ed !important;
  }
}
@media (min-width: 1025px) {
  #feed-hamburger-btn { display: none !important; }
}



















@media (max-width: 1024px) {
  body div.job_listings > form.job_filters { display: none !important; }

  /* Floating search button — brand green with black border */
  #feed-search-btn {
    position: fixed !important;
    bottom: 20px !important;
    right: 14px !important;
    z-index: 99996 !important;
    width: 56px !important;
    height: 56px !important;
    border: 2px solid #1a1a1a !important;
    background: #335337 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    padding: 0 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
  }
  #feed-search-btn svg {
    width: 26px !important;
    height: 26px !important;
    stroke: #fff !important;
    fill: none !important;
    stroke-width: 2.5 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  /* Lighter backdrop */
  #feed-search-backdrop {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.2) !important;
    z-index: 99997 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.25s ease !important;
  }
  body.feed-search-open #feed-search-backdrop {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* Brand-styled bottom sheet — cream background, green outline */
  body.feed-search-open div.job_listings > form.job_filters {
    display: block !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 22px 18px 18px !important;
    background: #faf6ed !important;
    border: 3px solid #335337 !important;
    border-bottom: none !important;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: 0 -8px 32px rgba(0,0,0,0.18) !important;
    z-index: 99998 !important;
    overflow: visible !important;
    animation: feedSheetUp 0.3s ease-out !important;
  }
  @keyframes feedSheetUp {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
  }

  /* Sheet handle bar — green tinted */
  body.feed-search-open div.job_listings > form.job_filters::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 4px;
    background: #335337;
    border-radius: 2px;
    opacity: 0.4;
  }

  /* Reset inner WPJM container */
  body.feed-search-open form.job_filters .search_jobs {
    padding: 0 !important;
    gap: 10px !important;
    margin: 0 !important;
  }

  /* Hide WPJM extras */
  body.feed-search-open form.job_filters .showing_jobs,
  body.feed-search-open form.job_filters ul.job_types,
  body.feed-search-open form.job_filters label {
    display: none !important;
  }

  /* Inputs — black borders, white background, bold text */
  body.feed-search-open form.job_filters .search_keywords input,
  body.feed-search-open form.job_filters .select2-selection,
  body.feed-search-open form.job_filters select#search_categories {
    height: 44px !important;
    min-height: 44px !important;
    font-size: 16px !important;
    line-height: 44px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 0 14px !important;
    border: 2px solid #1a1a1a !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #1a1a1a !important;
    font-weight: 500 !important;
    font-family: inherit !important;
  }
  body.feed-search-open form.job_filters .search_keywords input {
    line-height: normal !important;
  }

  /* Select2 wrapper styling */
  body.feed-search-open form.job_filters .select2-container--default .select2-selection--single {
    border: 2px solid #1a1a1a !important;
    border-radius: 8px !important;
    background: #fff !important;
  }
  body.feed-search-open form.job_filters .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 44px !important;
    color: #1a1a1a !important;
    font-weight: 500 !important;
    padding-left: 14px !important;
  }
  body.feed-search-open form.job_filters .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
  }

  body.feed-search-open form.job_filters .search_keywords,
  body.feed-search-open form.job_filters .search_categories,
  body.feed-search-open form.job_filters .search_submit {
    margin: 0 !important;
    width: 100% !important;
  }

  /* Submit button — brand green with black border */
  body.feed-search-open form.job_filters .search_submit input[type="submit"],
  body.feed-search-open form.job_filters input.button {
    width: 100% !important;
    height: 46px !important;
    font-size: 15px !important;
    background: #335337 !important;
    color: #fff !important;
    border: 2px solid #1a1a1a !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    cursor: pointer !important;
    text-transform: uppercase !important;
  }

  /* === SCROLL FIX + brand styling for select2 dropdown === */
  .select2-container--open .select2-dropdown {
    z-index: 999999 !important;
    border: 2px solid #1a1a1a !important;
    border-radius: 8px !important;
  }
  .select2-container--open .select2-results__options {
    max-height: 280px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
  }
  .select2-container--open .select2-results__option {
    padding: 12px 14px !important;
    font-size: 15px !important;
    color: #1a1a1a !important;
  }
  .select2-container--open .select2-results__option--highlighted[aria-selected],
  .select2-container--open .select2-results__option[aria-selected="true"] {
    background: #335337 !important;
    color: #fff !important;
  }

  .chosen-container .chosen-drop {
    z-index: 999999 !important;
  }

  body.feed-search-open #feed-search-btn { display: none !important; }
}
@media (min-width: 1025px) {
  #feed-search-btn, #feed-search-backdrop { display: none !important; }
}


















/* Hide Login from MOBILE DROPDOWN MENU when user is logged in (desktop nav untouched) */
body.logged-in.logged-in.logged-in nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item:has(> a[href$="/login/"]) {
  display: none !important;
}
body.logged-in.logged-in.logged-in nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item:has(> a[href$="/login"]) {
  display: none !important;
}
/* Hide Logout from MOBILE DROPDOWN MENU when user is logged out */
body:not(.logged-in):not(.logged-in):not(.logged-in) nav.elementor-nav-menu--dropdown ul.elementor-nav-menu li.menu-item:has(> a[href*="wp-login.php"][href*="logout"]) {
  display: none !important;
}