/* DD_DIRECTORY_MASTER_LAYOUT_CSS_V1 */

/* =========================================================
   COMPLETE FILTERBOX
   ========================================================= */

body.dd-advertisements-page
.directory-filter-panel {
  padding: 18px 20px 16px !important;
  border-radius: 18px !important;
}

/* =========================================================
   BOVENBALK: ALLEEN CATEGORIEËN + ZOEKEN
   ========================================================= */

body.dd-advertisements-page
.directory-quickbar {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;

  gap: 12px !important;

  margin: 0 0 22px !important;
  padding: 8px 10px !important;

  overflow-x: auto !important;

  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 15px !important;

  background: rgba(13,12,19,.56) !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex-wrap: nowrap !important;
  flex: 0 1 auto !important;

  gap: 9px !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* DD_CATEGORY_MENU_STYLE_V1 */
body.dd-advertisements-page
.directory-quickbar
.directory-categories
.button {
  min-height: 40px !important;

  padding: 0 16px !important;

  border: 1px solid transparent !important;
  border-radius: 10px !important;

  background: transparent !important;

  color: #d7ccd5 !important;

  box-shadow: none !important;

  white-space: nowrap !important;

  transition:
    background-color .16s ease,
    color .16s ease,
    border-color .16s ease !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories
.button:hover {
  background: rgba(112, 38, 74, .34) !important;

  border-color: rgba(178, 78, 125, .18) !important;

  color: #fff !important;

  box-shadow: none !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories
.button[aria-current="page"] {
  background: rgba(112, 38, 74, .48) !important;

  border-color: rgba(178, 78, 125, .28) !important;

  color: #fff !important;

  box-shadow: none !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories
.button[aria-current="page"]:hover {
  background: rgba(126, 43, 84, .58) !important;
}

body.dd-advertisements-page
.directory-quick-submit {
  flex: 0 0 128px !important;

  min-height: 42px !important;

  margin: 0 !important;
}

/* =========================================================
   HOOFDGRID
   ========================================================= */

body.dd-advertisements-page
.directory-primary-filters {
  display: grid !important;

  grid-template-columns:
    120px
    180px
    minmax(280px, 1fr)
    130px
    235px !important;

  column-gap: 18px !important;
  row-gap: 20px !important;

  align-items: start !important;

  width: 100% !important;
}

/* =========================================================
   RIJ 1
   Geslacht | Zoeken | Gemeente + GPS | Afstand | Prijs
   ========================================================= */

body.dd-advertisements-page
.directory-filter-gender {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.dd-advertisements-page
.directory-filter-search {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

body.dd-advertisements-page
.directory-location-control {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

body.dd-advertisements-page
.directory-filter-distance {
  grid-column: 4 !important;
  grid-row: 1 !important;

  width: 130px !important;
  max-width: 130px !important;
}

body.dd-advertisements-page
.directory-range-control--minHourlyPrice {
  grid-column: 5 !important;
  grid-row: 1 !important;
}

/* =========================================================
   STANDAARD VELDHOOGTES
   ========================================================= */

body.dd-advertisements-page
.directory-primary-filters
label,

body.dd-advertisements-page
.directory-filter-gender,

body.dd-advertisements-page
.directory-filter-distance {
  min-width: 0 !important;
  margin: 0 !important;
}

body.dd-advertisements-page
.directory-primary-filters
input,

body.dd-advertisements-page
.directory-primary-filters
select {
  box-sizing: border-box !important;

  min-height: 44px !important;

  margin: 7px 0 0 !important;
}

/* Geslacht */
body.dd-advertisements-page
.directory-filter-gender select {
  width: 120px !important;
  max-width: 120px !important;
}

/* Zoekveld */
body.dd-advertisements-page
.directory-filter-search input {
  width: 180px !important;
  max-width: 180px !important;
}

/* =========================================================
   GEMEENTE + GPS
   ========================================================= */

body.dd-advertisements-page
.directory-location-input-row {
  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    44px !important;

  gap: 8px !important;

  width: 100% !important;
}

body.dd-advertisements-page
.directory-location-input-row input {
  width: 100% !important;
  min-width: 0 !important;
}

body.dd-advertisements-page
.directory-current-location {
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;

  height: 44px !important;

  margin-top: 7px !important;

  padding: 0 !important;
}

/* Afstand */
body.dd-advertisements-page
.directory-filter-distance select {
  width: 130px !important;
  max-width: 130px !important;
}

/* =========================================================
   RIJ 2
   Lengte | Leeftijd
   ========================================================= */

body.dd-advertisements-page
.directory-range-control--minHeight {
  grid-column: 1 / span 2 !important;
  grid-row: 2 !important;
}

body.dd-advertisements-page
.directory-range-control--minAge {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

/* =========================================================
   COMPACTE VAN/TOT
   ========================================================= */

body.dd-advertisements-page
.directory-range-control {
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
}

body.dd-advertisements-page
.directory-range-inputs {
  display: flex !important;

  align-items: center !important;

  width: max-content !important;

  gap: 7px !important;

  margin-top: 7px !important;
}

body.dd-advertisements-page
.directory-range-inputs input {
  flex:
    0 0 76px !important;

  width: 76px !important;
  min-width: 76px !important;
  max-width: 76px !important;

  margin: 0 !important;
}

body.dd-advertisements-page
.directory-range-separator {
  flex: 0 0 auto !important;

  width: auto !important;

  margin: 0 2px !important;
}

body.dd-advertisements-page
.directory-range-unit {
  margin-left: 7px !important;
}

/* prijs iets breder, maar nog compact */
body.dd-advertisements-page
.directory-range-control--minHourlyPrice
.directory-range-inputs input {
  flex-basis: 88px !important;

  width: 88px !important;
  min-width: 88px !important;
  max-width: 88px !important;
}

/* =========================================================
   RIJ 3
   Meer filters | Mogelijkheden
   ========================================================= */

body.dd-advertisements-page
.directory-extra-filters-control {
  grid-column: 1 / span 2 !important;
  grid-row: 3 !important;

  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    auto !important;

  align-items: center !important;

  gap: 12px !important;

  min-height: 78px !important;

  padding: 13px 15px !important;

  border:
    1px solid rgba(255,255,255,.09) !important;

  border-radius: 14px !important;

  background:
    rgba(255,255,255,.025) !important;
}

body.dd-advertisements-page
.directory-extra-filters-copy {
  display: grid !important;
  gap: 3px !important;
}

body.dd-advertisements-page
.directory-extra-filters-copy span {
  font-size: .72rem !important;
  opacity: .72 !important;
}

body.dd-advertisements-page
.directory-extra-filters-toggle {
  min-width: 150px !important;
  min-height: 44px !important;
}

body.dd-advertisements-page
.directory-possibilities-control {
  grid-column: 3 / -1 !important;
  grid-row: 3 !important;

  display: grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    auto !important;

  align-items: center !important;

  gap: 12px !important;

  min-height: 78px !important;

  padding: 13px 15px !important;

  border:
    1px solid rgba(255,255,255,.09) !important;

  border-radius: 14px !important;

  background:
    rgba(255,255,255,.025) !important;
}

body.dd-advertisements-page
.directory-possibilities-toggle {
  min-width: 220px !important;
  min-height: 44px !important;
}

/* =========================================================
   UITKLAPBARE EXTRA FILTERS
   ========================================================= */

body.dd-advertisements-page
.directory-extra-filters,

body.dd-advertisements-page
.directory-taxonomy {
  width: 100% !important;

  margin-top: 16px !important;

  padding: 16px !important;

  border:
    1px solid rgba(255,255,255,.08) !important;

  border-radius: 15px !important;

  background:
    rgba(16,14,21,.96) !important;
}

body.dd-advertisements-page
.directory-extra-filters[hidden],

body.dd-advertisements-page
.directory-taxonomy[hidden] {
  display: none !important;
}

body.dd-advertisements-page
.directory-extra-filters-grid {
  display: grid !important;

  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;

  gap: 14px !important;
}

/* =========================================================
   ONDERSTE KNOPPEN
   ========================================================= */



/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

  body.dd-advertisements-page
  .directory-primary-filters {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;
  }

  body.dd-advertisements-page
  .directory-filter-gender,

  body.dd-advertisements-page
  .directory-filter-search,

  body.dd-advertisements-page
  .directory-location-control,

  body.dd-advertisements-page
  .directory-filter-distance,

  body.dd-advertisements-page
  .directory-range-control--minHourlyPrice,

  body.dd-advertisements-page
  .directory-range-control--minHeight,

  body.dd-advertisements-page
  .directory-range-control--minAge,

  body.dd-advertisements-page
  .directory-extra-filters-control,

  body.dd-advertisements-page
  .directory-possibilities-control {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  body.dd-advertisements-page
  .directory-location-control,

  body.dd-advertisements-page
  .directory-extra-filters-control,

  body.dd-advertisements-page
  .directory-possibilities-control {
    grid-column: 1 / -1 !important;
  }
}

/* =========================================================
   MOBIEL
   ========================================================= */

@media (max-width: 700px) {

  body.dd-advertisements-page
  .directory-filter-panel {
    padding: 12px !important;
  }

  body.dd-advertisements-page
  .directory-quickbar {
    justify-content:
      flex-start !important;

    overflow-x:
      auto !important;
  }

  body.dd-advertisements-page
  .directory-quickbar
  .directory-categories {
    justify-content:
      flex-start !important;
  }

  body.dd-advertisements-page
  .directory-primary-filters {
    grid-template-columns:
      1fr !important;
  }

  body.dd-advertisements-page
  .directory-filter-gender,

  body.dd-advertisements-page
  .directory-filter-search,

  body.dd-advertisements-page
  .directory-location-control,

  body.dd-advertisements-page
  .directory-filter-distance,

  body.dd-advertisements-page
  .directory-range-control--minHourlyPrice,

  body.dd-advertisements-page
  .directory-range-control--minHeight,

  body.dd-advertisements-page
  .directory-range-control--minAge,

  body.dd-advertisements-page
  .directory-extra-filters-control,

  body.dd-advertisements-page
  .directory-possibilities-control {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  body.dd-advertisements-page
  .directory-extra-filters-grid {
    grid-template-columns:
      1fr !important;
  }

  body.dd-advertisements-page
  .directory-extra-filters-control,

  body.dd-advertisements-page
  .directory-possibilities-control {
    grid-template-columns:
      1fr !important;
  }

  body.dd-advertisements-page
  .directory-extra-filters-toggle,

  body.dd-advertisements-page
  .directory-possibilities-toggle {
    width: 100% !important;
    min-width: 0 !important;

    margin-top: 8px !important;
  }
}

</style>

<style>
/* DD_MUNICIPALITY_COMBOBOX_CSS_V1 */

body.dd-advertisements-page
.directory-municipality-combobox {
  position: relative;

  min-width: 0;
  width: 100%;
}

/*
  Het tekstveld zelf lijkt nu op
  de Geslacht-dropdown.
*/
body.dd-advertisements-page
.directory-municipality-combobox
input {
  box-sizing: border-box;

  width: 100% !important;

  padding-right:
    34px !important;

  border:
    1px solid rgba(
      216,
      64,
      131,
      .65
    ) !important;

  border-radius:
    11px !important;
}

body.dd-advertisements-page
.directory-municipality-combobox::after {
  content: '⌄';

  position: absolute;

  right: 12px;
  top: 50%;

  transform:
    translateY(-50%);

  color: #f0e7ed;

  font-size: 15px;
  line-height: 1;

  pointer-events: none;
}

/* =========================================================
   POPUP RECHT ONDER HET VELD
   ========================================================= */

body.dd-advertisements-page
.directory-municipality-menu {
  position: absolute !important;

  z-index: 5000 !important;

  top:
    calc(100% + 5px) !important;

  left: 0 !important;
  right: auto !important;

  box-sizing: border-box !important;

  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;

  max-height:
    290px !important;

  overflow-y:
    auto !important;
  overflow-x:
    hidden !important;

  margin: 0 !important;
  padding: 5px !important;

  border:
    1px solid rgba(
      255,
      255,
      255,
      .12
    ) !important;

  border-radius:
    8px !important;

  background:
    #151219 !important;

  box-shadow:
    0 14px 36px
    rgba(0,0,0,.55) !important;

  scrollbar-width:
    thin;
}

body.dd-advertisements-page
.directory-municipality-menu[hidden] {
  display: none !important;
}

/* =========================================================
   GEMEENTE-OPTIES
   ========================================================= */

body.dd-advertisements-page
.directory-municipality-option {
  appearance: none;

  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    auto;

  align-items: center;

  gap: 12px;

  box-sizing: border-box;

  width: 100%;

  min-height: 39px;

  margin: 0;
  padding:
    8px 10px;

  border: 0;
  border-radius: 4px;

  background:
    transparent;

  color:
    #fff;

  text-align: left;

  cursor: pointer;
}

body.dd-advertisements-page
.directory-municipality-option
strong {
  min-width: 0;

  overflow: hidden;

  font-size: .80rem;
  font-weight: 650;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

body.dd-advertisements-page
.directory-municipality-option
span {
  color:
    #a99da8;

  font-size:
    .70rem;

  white-space:
    nowrap;
}

/*
  Zelfde gevoel als de geselecteerde
  regel uit de Geslacht-dropdown.
*/
body.dd-advertisements-page
.directory-municipality-option:hover,

body.dd-advertisements-page
.directory-municipality-option.is-active {
  background:
    rgba(
      126,
      183,
      239,
      .88
    );

  color:
    #111018;
}

body.dd-advertisements-page
.directory-municipality-option:hover
span,

body.dd-advertisements-page
.directory-municipality-option.is-active
span {
  color:
    rgba(
      17,
      16,
      24,
      .72
    );
}

body.dd-advertisements-page
.directory-municipality-empty {
  padding:
    12px 10px;

  color:
    #a99da8;

  font-size:
    .78rem;
}

/* GPS-knop blijft gewoon rechts */
body.dd-advertisements-page
.directory-location-input-row {
  overflow:
    visible !important;
}

body.dd-advertisements-page
.directory-location-control {
  overflow:
    visible !important;
}

/* Zorg dat volgende rijen de popup niet afknippen */
body.dd-advertisements-page
.directory-filter-panel,

body.dd-advertisements-page
.directory-primary-filters,

body.dd-advertisements-page
.directory-filter-form {
  overflow:
    visible !important;
}

</style>

<style>
/* DD_VISIBLE_PROFILE_FILTERS_CSS_V1 */

/*
  Definitieve hoofdindeling:

  RIJ 1
  Geslacht | Zoeken | Gemeente + GPS | Afstand | Prijs

  RIJ 2
  Leeftijd | Lengte | Lichaamsbouw | Taal | Nationaliteit

  RIJ 3
  Meer filters | Mogelijkheden & voorkeuren
*/

body.dd-advertisements-page
.directory-primary-filters {
  grid-template-columns:
    170px
    200px
    minmax(260px, 1fr)
    165px
    220px !important;

  column-gap: 18px !important;
  row-gap: 20px !important;
}

/* =========================================================
   RIJ 2
   ========================================================= */

body.dd-advertisements-page
.directory-range-control--minAge {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

body.dd-advertisements-page
.directory-range-control--minHeight {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

body.dd-advertisements-page
.directory-visible-body-type {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

body.dd-advertisements-page
.directory-visible-language {
  grid-column: 4 !important;
  grid-row: 2 !important;
}

body.dd-advertisements-page
.directory-visible-nationality {
  grid-column: 5 !important;
  grid-row: 2 !important;
}

/* Zelfde styling als de andere normale filters */
body.dd-advertisements-page
.directory-visible-profile-filter {
  display: grid !important;
  align-content: start !important;

  gap: 7px !important;

  width: 100% !important;
  min-width: 0 !important;

  margin: 0 !important;

  color: #f2e9ef;

  font-size: .79rem;
  font-weight: 650;
}

body.dd-advertisements-page
.directory-visible-profile-filter select {
  box-sizing: border-box !important;

  width: 100% !important;
  min-width: 0 !important;

  min-height: 44px !important;

  margin: 0 !important;

  font-weight: 500;
}

/* =========================================================
   RIJ 3
   ========================================================= */

body.dd-advertisements-page
.directory-extra-filters-control {
  grid-column: 1 / span 2 !important;
  grid-row: 3 !important;
}

body.dd-advertisements-page
.directory-possibilities-control {
  grid-column: 3 / -1 !important;
  grid-row: 3 !important;
}

/* =========================================================
   MEER FILTERS PANEL
   Nu alleen de NIET zichtbare velden.
   ========================================================= */

body.dd-advertisements-page
.directory-extra-filters-grid {
  grid-template-columns:
    repeat(3, minmax(0, 1fr)) !important;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1050px) {

  body.dd-advertisements-page
  .directory-visible-profile-filter {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  body.dd-advertisements-page
  .directory-extra-filters-control,

  body.dd-advertisements-page
  .directory-possibilities-control {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }
}

/* =========================================================
   MOBIEL
   ========================================================= */

@media (max-width: 700px) {

  body.dd-advertisements-page
  .directory-visible-profile-filter {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  body.dd-advertisements-page
  .directory-extra-filters-grid {
    grid-template-columns:
      1fr !important;
  }
}

</style>

<style>
/* DD_AGE_HEIGHT_SPACING_V1 */

/* Leeftijd en Lengte: Van/Tot dichter bij elkaar */
body.dd-advertisements-page
.directory-range-control--minAge
.directory-range-inputs,

body.dd-advertisements-page
.directory-range-control--minHeight
.directory-range-inputs {
  gap: 3px !important;
  width: max-content !important;
}

/* De vakjes zelf iets smaller */
body.dd-advertisements-page
.directory-range-control--minAge
.directory-range-inputs input,

body.dd-advertisements-page
.directory-range-control--minHeight
.directory-range-inputs input {
  flex: 0 0 68px !important;
  width: 68px !important;
  min-width: 68px !important;
  max-width: 68px !important;
}

/* Streepje zo weinig mogelijk ruimte laten innemen */
body.dd-advertisements-page
.directory-range-control--minAge
.directory-range-separator,

body.dd-advertisements-page
.directory-range-control--minHeight
.directory-range-separator {
  margin: 0 1px !important;
  width: auto !important;
}

/* Iets meer visuele ruimte tussen Leeftijd en Lengte */
body.dd-advertisements-page
.directory-range-control--minAge {
  margin-right: 12px !important;
}

/* DD_CENTER_DISCLOSURE_HOST_CSS_V1 */

/*
  Centrale uitklapzone:
  onder Meer filters + Mogelijkheden,
  boven Toon resultaten / Wis filters.
*/
body.dd-advertisements-page
.directory-disclosure-host {
  box-sizing: border-box !important;
  display: block !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* Beide panelen gebruiken exact dezelfde positie */
body.dd-advertisements-page
.directory-disclosure-host >
.directory-extra-filters,

body.dd-advertisements-page
.directory-disclosure-host >
.directory-taxonomy {
  position: static !important;

  box-sizing: border-box !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  margin: 16px auto 0 !important;
}

/* Verborgen betekent echt verborgen */
body.dd-advertisements-page
.directory-disclosure-host >
.directory-extra-filters[hidden],

body.dd-advertisements-page
.directory-disclosure-host >
.directory-taxonomy[hidden] {
  display: none !important;
}

/* Inhoud netjes gecentreerd */
body.dd-advertisements-page
.directory-disclosure-host
.directory-extra-filters-grid,

body.dd-advertisements-page
.directory-disclosure-host
.directory-taxonomy-groups {
  box-sizing: border-box !important;

  width: 100% !important;
  max-width: none !important;

  margin-left: auto !important;
  margin-right: auto !important;
}

/*
  De actieknoppen komen NA de uitklapzone.
  Ze schuiven dus automatisch naar beneden.
*/


/* DD_FINAL_AD_LAYOUT_V2 */
/* DD_ADVERTENTIES_TOP_ALIGN_V1 */

/*
  Zelfde verticale start als de homepage:
  nauwelijks lege ruimte tussen hoofdheader en pagina-inhoud.
*/
body.dd-advertisements-page
#community-main.advertiser-page {
  margin-top: 0 !important;

  padding-top: 20px !important;
}

/* Op kleinere schermen nog iets compacter */
@media (max-width: 620px) {
  body.dd-advertisements-page
  #community-main.advertiser-page {
    margin-top: 0 !important;

    padding-top: 12px !important;
  }
}


/* =========================================================
   BASIS
   ========================================================= */

body.dd-advertisements-page
.directory-filter-form,
body.dd-advertisements-page
.directory-primary-filters,
body.dd-advertisements-page
.directory-primary-filters > *,
body.dd-advertisements-page
.directory-location-control,
body.dd-advertisements-page
.directory-location-input-row {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.dd-advertisements-page
.directory-filter-form {
  display: grid !important;
  gap: 12px !important;

  width: 100% !important;

  padding:
    18px 20px 14px !important;

  overflow: visible !important;
}

/* =========================================================
   CATEGORIEEN
   ========================================================= */

body.dd-advertisements-page
.directory-quickbar {
  box-sizing: border-box !important;

  width: 100% !important;

  margin: 0 0 2px !important;
  padding: 9px !important;

  border:
    1px solid rgba(255,255,255,.07) !important;

  border-radius:
    11px !important;

  background:
    rgba(12,11,17,.68) !important;

  overflow:
    hidden !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories {
  display: grid !important;

  grid-template-columns:
    repeat(7,minmax(0,1fr)) !important;

  gap: 8px !important;

  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories
.button {
  box-sizing: border-box !important;

  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;

  padding:
    0 8px !important;

  border:
    1px solid rgba(255,255,255,.075) !important;

  border-radius:
    9px !important;

  background:
    rgba(255,255,255,.035) !important;

  color:
    #ddd3dc !important;

  font-size:
    11px !important;

  font-weight:
    700 !important;

  white-space:
    nowrap !important;

  box-shadow:
    none !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories
.button:hover {
  background:
    rgba(112,38,74,.30) !important;

  border-color:
    rgba(178,78,125,.22) !important;

  color:
    #fff !important;
}

body.dd-advertisements-page
.directory-quickbar
.directory-categories
.button[aria-current="page"] {
  background:
    rgba(112,38,74,.48) !important;

  border-color:
    rgba(190,83,133,.30) !important;

  color:
    #fff !important;
}

/* =========================================================
   DESKTOP FILTERS
   ========================================================= */

body.dd-advertisements-page
.directory-primary-filters {
  display: grid !important;

  grid-template-columns:
    minmax(110px,.80fr)
    minmax(150px,1.05fr)
    minmax(250px,1.80fr)
    minmax(125px,.90fr)
    minmax(210px,1.25fr) !important;

  column-gap:
    16px !important;

  row-gap:
    12px !important;

  align-items:
    end !important;

  width:
    100% !important;
}

/* vaste volgorde */
body.dd-advertisements-page
.directory-filter-gender {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

body.dd-advertisements-page
.directory-filter-search {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

body.dd-advertisements-page
.directory-location-control {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

body.dd-advertisements-page
.directory-filter-distance {
  grid-column: 4 !important;
  grid-row: 1 !important;
}

body.dd-advertisements-page
.directory-range-control--minHourlyPrice {
  grid-column: 5 !important;
  grid-row: 1 !important;
}

/* oude vaste breedtes uitschakelen */
body.dd-advertisements-page
.directory-filter-gender select,

body.dd-advertisements-page
.directory-filter-search input,

body.dd-advertisements-page
.directory-filter-distance select {
  box-sizing:
    border-box !important;

  width:
    100% !important;

  max-width:
    none !important;
}

/* =========================================================
   GEMEENTE + GPS
   ========================================================= */

body.dd-advertisements-page
.directory-location-input-row {
  display:
    grid !important;

  grid-template-columns:
    minmax(0,1fr)
    44px !important;

  gap:
    8px !important;

  align-items:
    center !important;

  width:
    100% !important;

  overflow:
    visible !important;
}

body.dd-advertisements-page
.directory-location-input-row input {
  box-sizing:
    border-box !important;

  width:
    100% !important;

  min-width:
    0 !important;

  max-width:
    none !important;

  /*
    Gemeente is NIET standaard rood.
  */
  border-color:
    rgba(255,255,255,.12) !important;

  box-shadow:
    none !important;

  outline:
    none;
}

/* Ook wanneer met muis aangeklikt: geen permanente rode rand */
body.dd-advertisements-page
.directory-location-input-row input:focus {
  border-color:
    rgba(255,255,255,.18) !important;

  box-shadow:
    none !important;
}

/* Keyboard focus blijft toegankelijk */
body.dd-advertisements-page
.directory-location-input-row input:focus-visible {
  border-color:
    rgba(255,255,255,.20) !important;

  outline:
    2px solid rgba(243,169,190,.70) !important;

  outline-offset:
    2px !important;
}

body.dd-advertisements-page
.directory-current-location {
  box-sizing:
    border-box !important;

  width:
    44px !important;

  min-width:
    44px !important;

  max-width:
    44px !important;

  min-height:
    44px !important;
}

/* Geen lege statusregel ruimte laten innemen */
body.dd-advertisements-page
.directory-location-status:empty {
  display:
    none !important;

  min-height:
    0 !important;
}

/* =========================================================
   PRIJS
   ========================================================= */

body.dd-advertisements-page
.directory-range-control--minHourlyPrice {
  width:
    100% !important;

  min-width:
    0 !important;
}

body.dd-advertisements-page
.directory-range-control--minHourlyPrice
.directory-range-inputs {
  display:
    grid !important;

  grid-template-columns:
    minmax(0,1fr)
    auto
    minmax(0,1fr) !important;

  gap:
    7px !important;

  width:
    100% !important;
}

body.dd-advertisements-page
.directory-range-control--minHourlyPrice
.directory-range-inputs input {
  box-sizing:
    border-box !important;

  width:
    100% !important;

  min-width:
    0 !important;

  max-width:
    none !important;
}

/* =========================================================
   ADVANCED PANEL
   ========================================================= */

body.dd-advertisements-page
.directory-advanced-panel {
  box-sizing:
    border-box !important;

  width:
    100% !important;

  margin:
    2px 0 0 !important;

  padding:
    14px 0 2px !important;
}

body.dd-advertisements-page
.directory-advanced-panel[hidden] {
  display:
    none !important;
}

body.dd-advertisements-page
.directory-advanced-grid {
  display:
    grid !important;

  grid-template-columns:
    minmax(0,.85fr)
    minmax(0,.85fr)
    minmax(0,1.35fr)
    minmax(0,1fr)
    minmax(0,1.15fr) !important;

  gap:
    14px 16px !important;

  width:
    100% !important;
}

body.dd-advertisements-page
.directory-advanced-grid >
.directory-range-control,

body.dd-advertisements-page
.directory-advanced-grid >
.directory-visible-profile-filter,

body.dd-advertisements-page
.directory-advanced-grid >
.directory-extra-filters-control,

body.dd-advertisements-page
.directory-advanced-grid >
.directory-possibilities-control {
  grid-column:
    auto !important;

  grid-row:
    auto !important;

  min-width:
    0 !important;

  margin:
    0 !important;
}

body.dd-advertisements-page
.directory-advanced-grid >
.directory-extra-filters-control {
  grid-column:
    1 / span 2 !important;
}

body.dd-advertisements-page
.directory-advanced-grid >
.directory-possibilities-control {
  grid-column:
    3 / -1 !important;
}

/* =========================================================
   ONDERSTE RIJ
   ========================================================= */

body.dd-advertisements-page
.directory-filter-footer {
  display:
    grid !important;

  grid-template-columns:
    minmax(0,1fr)
    auto
    minmax(0,1fr) !important;

  gap:
    14px !important;

  align-items:
    center !important;

  width:
    100% !important;

  min-width:
    0 !important;

  margin:
    2px 0 0 !important;
}

body.dd-advertisements-page
.directory-filter-footer
.directory-location-source {
  grid-column:
    1 !important;

  justify-self:
    start !important;

  max-width:
    390px !important;

  margin:
    0 !important;

  color:
    rgba(208,197,207,.66) !important;

  font-size:
    10px !important;

  line-height:
    1.45 !important;
}

body.dd-advertisements-page
.directory-filter-footer
.directory-advanced-toggle {
  grid-column:
    2 !important;

  justify-self:
    center !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  gap:
    9px !important;

  width:
    auto !important;

  min-width:
    170px !important;

  min-height:
    38px !important;

  margin:
    0 !important;

  padding:
    0 16px !important;

  border:
    1px solid rgba(164,64,106,.24) !important;

  border-radius:
    9px !important;

  background:
    rgba(19,16,23,.78) !important;

  color:
    #ddd2db !important;

  font-size:
    12px !important;

  font-weight:
    700 !important;

  box-shadow:
    none !important;
}

body.dd-advertisements-page
.directory-filter-footer
.directory-filter-actions {
  grid-column:
    3 !important;

  justify-self:
    end !important;

  display:
    flex !important;

  align-items:
    center !important;

  gap:
    8px !important;

  margin:
    0 !important;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 960px) {

  body.dd-advertisements-page
  .directory-quickbar
  .directory-categories {
    grid-template-columns:
      repeat(4,minmax(0,1fr)) !important;
  }

  body.dd-advertisements-page
  .directory-primary-filters {
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    gap:
      14px !important;
  }

  body.dd-advertisements-page
  .directory-filter-gender {
    grid-column:
      1 !important;

    grid-row:
      1 !important;
  }

  body.dd-advertisements-page
  .directory-filter-search {
    grid-column:
      2 !important;

    grid-row:
      1 !important;
  }

  body.dd-advertisements-page
  .directory-location-control {
    grid-column:
      1 / -1 !important;

    grid-row:
      2 !important;
  }

  body.dd-advertisements-page
  .directory-filter-distance {
    grid-column:
      1 !important;

    grid-row:
      3 !important;
  }

  body.dd-advertisements-page
  .directory-range-control--minHourlyPrice {
    grid-column:
      2 !important;

    grid-row:
      3 !important;
  }

  body.dd-advertisements-page
  .directory-advanced-grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;
  }

  body.dd-advertisements-page
  .directory-advanced-grid >
  .directory-extra-filters-control,

  body.dd-advertisements-page
  .directory-advanced-grid >
  .directory-possibilities-control {
    grid-column:
      1 / -1 !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer {
    grid-template-columns:
      minmax(0,1fr)
      auto !important;

    row-gap:
      10px !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-location-source {
    grid-column:
      1 / -1 !important;

    grid-row:
      1 !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-advanced-toggle {
    grid-column:
      1 !important;

    grid-row:
      2 !important;

    justify-self:
      start !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-filter-actions {
    grid-column:
      2 !important;

    grid-row:
      2 !important;
  }
}

/* =========================================================
   MOBIEL
   ========================================================= */

@media (max-width: 620px) {

  body.dd-advertisements-page
  #community-main.advertiser-page {
    box-sizing:
      border-box !important;

    width:
      calc(100% - 16px) !important;

    min-width:
      0 !important;

    margin-left:
      auto !important;

    margin-right:
      auto !important;
  }

  body.dd-advertisements-page
  .directory-filter-panel {
    box-sizing:
      border-box !important;

    width:
      100% !important;

    max-width:
      100% !important;

    padding:
      0 !important;
  }

  body.dd-advertisements-page
  .directory-filter-form {
    padding:
      14px !important;
  }

  body.dd-advertisements-page
  .directory-quickbar
  .directory-categories {
    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;
  }

  body.dd-advertisements-page
  .directory-quickbar
  .directory-categories
  .button {
    min-height:
      42px !important;

    font-size:
      10px !important;
  }

  body.dd-advertisements-page
  .directory-primary-filters {
    grid-template-columns:
      minmax(0,1fr) !important;

    gap:
      14px !important;
  }

  body.dd-advertisements-page
  .directory-filter-gender {
    grid-column:
      1 !important;

    grid-row:
      1 !important;
  }

  body.dd-advertisements-page
  .directory-filter-search {
    grid-column:
      1 !important;

    grid-row:
      2 !important;
  }

  body.dd-advertisements-page
  .directory-location-control {
    grid-column:
      1 !important;

    grid-row:
      3 !important;
  }

  body.dd-advertisements-page
  .directory-filter-distance {
    grid-column:
      1 !important;

    grid-row:
      4 !important;
  }

  body.dd-advertisements-page
  .directory-range-control--minHourlyPrice {
    grid-column:
      1 !important;

    grid-row:
      5 !important;
  }

  body.dd-advertisements-page
  .directory-filter-gender select,

  body.dd-advertisements-page
  .directory-filter-search input,

  body.dd-advertisements-page
  .directory-filter-distance select {
    width:
      100% !important;

    max-width:
      none !important;
  }

  body.dd-advertisements-page
  .directory-advanced-grid {
    grid-template-columns:
      minmax(0,1fr) !important;
  }

  body.dd-advertisements-page
  .directory-advanced-grid >
  * {
    grid-column:
      1 !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer {
    grid-template-columns:
      minmax(0,1fr) !important;

    gap:
      10px !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-location-source,

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-advanced-toggle,

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-filter-actions {
    grid-column:
      1 !important;

    justify-self:
      stretch !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-location-source {
    grid-row:
      1 !important;

    max-width:
      none !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-advanced-toggle {
    grid-row:
      2 !important;

    width:
      100% !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-filter-actions {
    grid-row:
      3 !important;

    display:
      grid !important;

    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    width:
      100% !important;
  }

  body.dd-advertisements-page
  .directory-filter-footer
  .directory-filter-actions
  .button {
    width:
      100% !important;

    min-width:
      0 !important;
  }
}

/* DD_HIDE_PINK_TOP_SEARCH_EXTERNAL_V1 */
body.dd-advertisements-page .directory-quick-submit{display:none!important}
/* DD_AGE_HEIGHT_SELECTS_EXTERNAL_V1 */
body.dd-advertisements-page .directory-range-control--minAge .directory-range-inputs select,body.dd-advertisements-page .directory-range-control--minHeight .directory-range-inputs select{box-sizing:border-box!important;flex:0 0 68px!important;width:68px!important;min-width:68px!important;max-width:68px!important;min-height:44px!important;margin:0!important;padding:0 7px!important}
/* DD_AD_MOBILE_MORE_FILTERS_EXTERNAL_V1 */
@media (max-width:700px){body.dd-advertisements-page .directory-filter-footer .directory-advanced-toggle{display:inline-flex!important;grid-column:1!important;grid-row:2!important;justify-self:stretch!important;align-items:center!important;justify-content:center!important;width:100%!important;min-width:0!important}}
/* DD_RANGE_TITLE_ALIGN_EXTERNAL_V1 */
body.dd-advertisements-page .directory-range-control{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;column-gap:8px!important;row-gap:8px!important;align-content:start!important}
body.dd-advertisements-page .directory-range-title{grid-column:1!important;grid-row:1!important;align-self:center!important;min-width:0!important}
body.dd-advertisements-page .directory-range-unit{position:static!important;grid-column:2!important;grid-row:1!important;justify-self:end!important;align-self:center!important;margin:0!important;white-space:nowrap!important;line-height:1.2!important}
body.dd-advertisements-page .directory-range-inputs{grid-column:1/-1!important;grid-row:2!important;margin-top:0!important}