html:has(#recruitcrmModal[style="display: block;"]),
html:has(#applFormModal[style="display: block;"]) {
  overflow-y: hidden;
}

.recruitcrm-wrapper {
  display: grid;
  grid-template-columns: 25% 1fr 25%;
  width: 100%;
  gap: 1.625em;
  padding: 1.625em;
  margin-bottom: 1.625em;
  border-radius: .5em;
  box-shadow: 0 0 0 1px #e1e4e6;
}
.recruitcrm-region-filters {
  padding: 10px;
  border: 1px solid #e1e4e6;
  border-radius: .25em;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.recruitcrm-region-filters label {
  margin-right: 10px;
  font-size: .75em;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.recruitcrm-region-filters input[type="checkbox"] {
  margin-top: .125em;
}

.filter-clear-link {
  display: inline-block;
  margin-top: .25em;
  font-size: .875em;
  cursor: pointer;
}

.recruitcrm-sidebar {
  position: relative;
  border-right: 1px solid #e1e4e6;
  padding-right: 1.625em;
  z-index: 0;
}
.recruitcrm-sidebar-right {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.625em;
  border-left: 1px solid #e1e4e6;
  padding-left: 1.625em;
  z-index: 0;
}
.recruitcrm-joblist-search {
  max-width: 100%;
  margin: .5em 0 1em 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.recruitcrm-joblist-search input,
.recruitcrm-joblist-search select {
  border-radius: .25em !important;
  flex-grow: 1;
  flex-shrink: 1;
  min-width: 100px;
  max-width: 100%;
  transition: 0.2s;
  padding-left: 1em !important;
}
.recruitcrm-joblist-search input:focus,
.recruitcrm-joblist-search select:focus {
  border-color: #1da0f1;
}

@media (min-width: 768px) {
  .recruitcrm-joblist-search input,
  .recruitcrm-joblist-search select {
    padding: .5em 1em !important;
    height: auto;
  }
}

#joblist-no-jobs {
  font-weight: 600;
}

.recruitcrm-joblist ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.recruitcrm-joblist li {
  font-size: .875em;
  font-weight: 500;
  padding: .75em 1em;
  border: 1px solid #1da0f1;
  border-radius: .25em;
  background-color: #ffffff;
  margin-bottom: 6px;
  cursor: pointer;
  transition: background 0.2s;
}
.recruitcrm-joblist li:hover,
.recruitcrm-joblist li.active {
  background-color: #d9f0ff;
}

.recruitcrm-content h3 {
  margin-top: 0;
  font-size: 1.25em;
  padding-right: .75em;
  padding-top: 0;
}
.recruitcrm-content .meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 1.625em;
}
.recruitcrm-content .meta div {
  padding: .375em .75em;
  border-radius: .25em;
  font-size: .875em;
  border: 1px solid #e1e4e6;
}


/* buttons in content */

.recruitcrm-content a {
  display: inline-block;
  font-size: 0.875em;
  line-height: 1.5em;
  margin: 0;
  padding-top: 1.125em;
  padding-bottom: 1.125em;
  padding-left: 1.5em;
  padding-right: 1.5em;
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.0625em;
  text-align: center;
  text-decoration: none;
  word-break: break-word;
  border: 1px solid;
  border-color: rgba(0, 0, 0, 0.05);
  border-top-color: rgba(255, 255, 255, 0.05);
  border-bottom-color: rgba(0, 0, 0, 0.15);
  border-radius: 0;
  box-shadow: inset 0 100vh 0 0 rgba(255, 255, 255, 0);
  transition: box-shadow 0.1s cubic-bezier(0.455, 0.03, 0.515, 0.955), background-color 0.1s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-color 0.1s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.1s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  cursor: pointer;
  color: white;
  background-color: #1da0f1;
}
.recruitcrm-content a:hover,
.recruitcrm-content a:focus {
  color: white;
  box-shadow: inset 0 100vh 0 0 rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.1);
  border-bottom-color: rgba(0, 0, 0, 0.15);
}

/* search area */

.recruitcrm-search-area {
  border: 1px solid #1da0f1;
  border-radius: .25em;
  min-width: 100px;
  transition: 0.2s;
  padding:10px;
  margin-bottom: 1em;
}
.recruitcrm-joblist-search + .recruitcrm-text-small,
.recruitcrm-search-title {
  font-size: .875em;
}
.recruitcrm-search-title {
  cursor: pointer
}

.recruitcrm-filter-container {
  display: none;
}
.recruitcrm-filter-container.visible {
  display: block;
}
.recruitcrm-filter-toggle::after {
  content: '▼';
  position: absolute;
  right: 5px;
  color: #1da0f1;
}

.recruitcrm-filter-toggle.expanded::after {
  content: '▲';
}

.recruitcrm-filter-clear {
  display: none;
}
.recruitcrm-filter-clear.visible {
  display: block;
}

/* Job-application modal popup  */

.ez-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  padding-top: var(--modpadd, 60px);
  padding-bottom: var(--modpadd, 60px);
  left: 0; 
  top: 0;
  width: 100%; 
  height: 100%;
  overflow: auto;
  background-color: rgba(1, 10, 16, 0.9);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.ez-modal-content {
  background-color: #fff;
  margin: 2% auto;
  padding: var(--modpadd, 1.625em);
  width: 90%;
  max-width: 740px;
  border-radius: .5em;
  position: relative;
}
.ez-modal-content h2,
.ez-modal-content h3 {
  padding-top: 0;
}
.ez-modal-content .recruitcrm-content {
  width: 100%;
}

.ez-close {
  color: #babec0;
  position: absolute;
  right: 15px; top: 10px;
  font-size: 28px;
  font-weight: bold;
  line-height: 1;
  cursor: pointer;
}
.ez-close:hover {
  color: #1c2328;
}

/* job details modal for mobile devices */

.recruitcrm-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  padding-top: var(--modpadd, 60px);
  padding-bottom: var(--modpadd, 60px);
  left: 0; 
  top: 0;
  width: 100%; 
  height: 100%;
  overflow: auto;
  background-color: rgba(1, 10, 16, 0.9);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.recruitcrm-modal-content {
  background-color: #fff;
  margin: auto;
  padding: 1.625em;
  padding: var(--modpadd, 1.625em);
  border-radius: .5em;
  width: 90%;
  max-width: 740px;
  position: relative;
}
.recruitcrm-modal-content .recruitcrm-content {
  width: 100%;
}

.recruitcrm-modal-close {
  color: #babec0;
  position: absolute;
  top: 10px; right: 15px;
  font-size: 28px;
  font-weight: bold;
  line-height: 1;
  cursor: pointer;
}
.recruitcrm-modal-close:hover {
  color: #1c2328;
}

/* map modal for mobile devices */

.map-modal {
  display: none;
  position: fixed;
  z-index: 9999;
  padding-top: var(--modpadd, 60px);
  padding-bottom: var(--modpadd, 60px);
  left: 0; 
  top: 0;
  width: 100%; 
  height: 100%;
  overflow: auto;
  background-color: rgba(1, 10, 16, 0.9);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

/* application form */

#ez_appl_form input:not([type="checkbox"]):not([type="radio"]) {
  width: 100%;
}
#ez_appl_form p {
  margin-bottom: 1em;
}

/* application form (files)  */
span.info::after {
  content: ' ℹ️';
  /*position: absolute;*/
  right: 5px;
  color: #1da0f1;
}

.upload-container {
  border: 1px solid;
  border-color: #e2e5e6;
  padding-top: .5em;
  padding-left: 1.25em;
  padding-right: 1.25em;
  padding-bottom: .25em;
/*  margin-bottom: 10px;*/
}


.upload-title {
  cursor:pointer;
}

.upload-title label::after {
  content: '▼';
  position: absolute;
  right: -5px;
  color: #1da0f1;
}

.upload-area-toggle::after {
  font-size: 1.2em;
  content: '▼';
  position: absolute;
  right: 5px;
  color: #1da0f1;
}
.upload-area-toggle.expanded::after {
  content: '▲';
}
div.upload-area {
  display: none;
}
div.upload-area.visible {
  display: inline-block;
}
.filelist {
  display: flex;
  flex-wrap: wrap;
  gap: .25em;
  width: 100%;
  margin-bottom: 1em;
}
.ez-file-tag {
  font-size: .75em;
  padding: .5em;
  border: 1px solid #e2e5e6;
  line-height: 1;
}
.ez-file-remove {
  text-decoration: none;
  margin-right: 0.5em;
  margin-left: 0.5em;
  font-weight: bold;
  cursor: pointer;
}
input.button.file-selector-button {
  width: auto !important;
  font-size: .75em;
  text-transform: revert !important;
  padding: .5em .75em;
}

.privacy-consent-area {
  display:inline-flex;
  margin-top:20px;
  padding-top: 5px;
}

label[for="datenschutz"] {
  /*display: block;*/
  padding-top: 0;
  margin-bottom: 1em;
  margin-top: -2px;
  vertical-align: top;
}
input#docs {
  height: auto;
  border: none;
  padding: 0;
}

/* Google-Maps */

.map-container {
  display: inline;
}
.map-title {
  /*display: none;*/
  font-size: .875em;
}
#map {
  height:300px;
  width: 100%;
}

.recruitcrm-show-modal-map {
  display: none;
}

/* consultant-info */

.consultant-info {
  display: grid;
  column-gap: 1em;
  grid-template-columns: 80px 1fr;
  grid-template-areas:
  "image title"
  "image contact";
}
.consultant-image {
  position: relative;
  grid-area: image;
  width: 80px;
  height: 80px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid #e1e4e6;
}
.consultant-image img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.consultant-name {
  grid-area: title;
  font-size: 1em;
  margin: auto 0 0 0;
  padding: 0;
}
.consultant-tel {
  grid-area: contact;
  font-size: .875em;
}

.consultant-info a {
  text-decoration: none;
  font-weight: 600;
}
svg.ez-icon {
  display: none;
  /* pointer-events: none;
  display: inline-block;
  width: 1em;
  height: 1em;
  fill: #1da0f1; */
}

/* media querys */

@media (max-width: 768px) {
  .recruitcrm-wrapper {
    grid-template-columns: 1fr;
  }
  .recruitcrm-sidebar-right {
    display: none;
  }
  #map {
    height:500px;
    width: 100%;
  }
  .recruitcrm-show-modal-map {
       display: inline-block;
  }
  .show-modal-map {
    display: inline-block;
    margin-top: .25em;
    font-size: .875em;
    cursor: pointer;
  }

  .recruitcrm-content {
    display: none;
  }
  .recruitcrm-sidebar {
    width:100%;
    border-right: none;
    padding-right: 0;
  }
  .recruitcrm-modal {
    height: 100%;
  }
}