/* Exposed filters: desktop zoals Gaspedaal
   links Zoek + Wis, rechts Meer/Minder filters */
@media (min-width: 768px){
  .views-exposed-form .s2b-actions{
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    column-gap: 16px;
    row-gap: 0;
    width: 100%;
  }

  .views-exposed-form .s2b-actions__left{
    grid-column: 1;
    width: auto;
    min-width: 0;
    display: block;
  }

  .views-exposed-form .s2b-actions__left .form-actions{
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: auto;
    max-width: none;
    margin: 0;
  }

  .views-exposed-form .s2b-actions__left .form-actions > *{
    width: auto;
    max-width: none;
    flex: 0 0 auto;
    margin: 0;
  }

  .views-exposed-form #edit-submit-schepen-verkoop{
    width: auto;
    min-width: 210px;
  }

  .views-exposed-form #edit-s2b-clear,
  .views-exposed-form .s2b-clear{
    width: auto;
    min-width: 150px;
  }

  .views-exposed-form .s2b-actions__right{
    grid-column: 3;
    justify-self: end;
    width: auto;
    min-width: 0;
    margin: 0;
    display: block;
  }

  .views-exposed-form .s2b-actions__right .s2b-toggle{
    width: auto;
    min-width: 220px;
    white-space: nowrap;
  }
}

/* FINAL desktop override: Zoek | Wis | Meer/Minder filters op 1 regel */
@media (min-width: 768px){
  body.path-schepen-verkoop .views-exposed-form .s2b-actions,
  body.path-schepen-verkoop-makelaar .views-exposed-form .s2b-actions,
  body.path-verkochte-schepen .views-exposed-form .s2b-actions,
  body.path-schepen-verkocht .views-exposed-form .s2b-actions,
  .view-schepen-verkoop .views-exposed-form .s2b-actions,
  .view-schepen-verkoop-makelaar .views-exposed-form .s2b-actions,
  .view-verkochte-schepen .views-exposed-form .s2b-actions,
  .view-schepen-verkocht .views-exposed-form .s2b-actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:16px !important;
    width:100% !important;
  }

  body.path-schepen-verkoop .views-exposed-form .s2b-actions__left,
  body.path-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__left,
  body.path-verkochte-schepen .views-exposed-form .s2b-actions__left,
  body.path-schepen-verkocht .views-exposed-form .s2b-actions__left,
  .view-schepen-verkoop .views-exposed-form .s2b-actions__left,
  .view-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__left,
  .view-verkochte-schepen .views-exposed-form .s2b-actions__left,
  .view-schepen-verkocht .views-exposed-form .s2b-actions__left{
    order:1 !important;
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
  }

  body.path-schepen-verkoop .views-exposed-form .s2b-actions__left .form-actions,
  body.path-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__left .form-actions,
  body.path-verkochte-schepen .views-exposed-form .s2b-actions__left .form-actions,
  body.path-schepen-verkocht .views-exposed-form .s2b-actions__left .form-actions,
  .view-schepen-verkoop .views-exposed-form .s2b-actions__left .form-actions,
  .view-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__left .form-actions,
  .view-verkochte-schepen .views-exposed-form .s2b-actions__left .form-actions,
  .view-schepen-verkocht .views-exposed-form .s2b-actions__left .form-actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:12px !important;
    width:auto !important;
    margin:0 !important;
  }

  body.path-schepen-verkoop .views-exposed-form .s2b-actions__left .form-actions > *,
  body.path-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__left .form-actions > *,
  body.path-verkochte-schepen .views-exposed-form .s2b-actions__left .form-actions > *,
  body.path-schepen-verkocht .views-exposed-form .s2b-actions__left .form-actions > *,
  .view-schepen-verkoop .views-exposed-form .s2b-actions__left .form-actions > *,
  .view-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__left .form-actions > *,
  .view-verkochte-schepen .views-exposed-form .s2b-actions__left .form-actions > *,
  .view-schepen-verkocht .views-exposed-form .s2b-actions__left .form-actions > *{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
  }

  body.path-schepen-verkoop .views-exposed-form .s2b-actions__right,
  body.path-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__right,
  body.path-verkochte-schepen .views-exposed-form .s2b-actions__right,
  body.path-schepen-verkocht .views-exposed-form .s2b-actions__right,
  .view-schepen-verkoop .views-exposed-form .s2b-actions__right,
  .view-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__right,
  .view-verkochte-schepen .views-exposed-form .s2b-actions__right,
  .view-schepen-verkocht .views-exposed-form .s2b-actions__right{
    order:2 !important;
    flex:0 0 auto !important;
    width:auto !important;
    margin-left:auto !important;
  }

  body.path-schepen-verkoop .views-exposed-form .s2b-actions__right .s2b-toggle,
  body.path-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__right .s2b-toggle,
  body.path-verkochte-schepen .views-exposed-form .s2b-actions__right .s2b-toggle,
  body.path-schepen-verkocht .views-exposed-form .s2b-actions__right .s2b-toggle,
  .view-schepen-verkoop .views-exposed-form .s2b-actions__right .s2b-toggle,
  .view-schepen-verkoop-makelaar .views-exposed-form .s2b-actions__right .s2b-toggle,
  .view-verkochte-schepen .views-exposed-form .s2b-actions__right .s2b-toggle,
  .view-schepen-verkocht .views-exposed-form .s2b-actions__right .s2b-toggle{
    width:auto !important;
    min-width:220px !important;
    white-space:nowrap !important;
  }

  body.path-schepen-verkoop .views-exposed-form #edit-submit-schepen-verkoop,
  body.path-schepen-verkoop-makelaar .views-exposed-form #edit-submit-schepen-verkoop,
  .view-schepen-verkoop .views-exposed-form #edit-submit-schepen-verkoop,
  .view-schepen-verkoop-makelaar .views-exposed-form #edit-submit-schepen-verkoop{
    width:auto !important;
    min-width:210px !important;
  }

  body.path-schepen-verkoop .views-exposed-form #edit-s2b-clear,
  body.path-schepen-verkoop-makelaar .views-exposed-form #edit-s2b-clear,
  .view-schepen-verkoop .views-exposed-form #edit-s2b-clear,
  .view-schepen-verkoop-makelaar .views-exposed-form #edit-s2b-clear,
  body.path-schepen-verkoop .views-exposed-form .s2b-clear,
  body.path-schepen-verkoop-makelaar .views-exposed-form .s2b-clear,
  .view-schepen-verkoop .views-exposed-form .s2b-clear,
  .view-schepen-verkoop-makelaar .views-exposed-form .s2b-clear{
    width:auto !important;
    min-width:120px !important;
  }
}

/* Final shared action-button styling for all exposed filters */
.views-exposed-form .s2b-actions .form-actions :is(
  input[type="submit"],
  button[type="submit"],
  .button,
  .form-submit,
  .btn-primary
){
  background:#1e2b3a !important;
  border:1px solid #1e2b3a !important;
  color:#ffffff !important;
  border-radius:16px !important;
  font-weight:700 !important;
  box-shadow:none !important;
}

.views-exposed-form .s2b-actions .form-actions :is(
  input[type="submit"],
  button[type="submit"],
  .button,
  .form-submit,
  .btn-primary
):hover{
  background:#26384b !important;
  border-color:#26384b !important;
  color:#ffffff !important;
}

.views-exposed-form .s2b-actions .s2b-clear,
.views-exposed-form .s2b-actions a.s2b-clear,
.views-exposed-form .s2b-actions button.s2b-clear{
  background:#eef3f7 !important;
  border:1px solid #d7e0e8 !important;
  color:#1e2b3a !important;
  border-radius:16px !important;
  font-weight:700 !important;
  box-shadow:none !important;
}

.views-exposed-form .s2b-actions .s2b-clear:hover,
.views-exposed-form .s2b-actions a.s2b-clear:hover,
.views-exposed-form .s2b-actions button.s2b-clear:hover{
  background:#e6edf3 !important;
  border-color:#cfd9e2 !important;
  color:#1e2b3a !important;
}

.views-exposed-form .s2b-actions__right .s2b-toggle,
.views-exposed-form .s2b-actions__right button.s2b-toggle,
.views-exposed-form .s2b-actions__right a.s2b-toggle{
  background:#ffffff !important;
  border:2px solid #1e2b3a !important;
  color:#1e2b3a !important;
  border-radius:16px !important;
  font-weight:700 !important;
  box-shadow:none !important;
}

.views-exposed-form .s2b-actions__right .s2b-toggle:hover,
.views-exposed-form .s2b-actions__right button.s2b-toggle:hover,
.views-exposed-form .s2b-actions__right a.s2b-toggle:hover{
  background:#1e2b3a !important;
  border-color:#1e2b3a !important;
  color:#ffffff !important;
}

/* Final desktop widths for exposed-filter action buttons */
@media (min-width: 768px){
  .views-exposed-form .s2b-actions .form-actions :is(
    input[type="submit"],
    button[type="submit"],
    .button,
    .form-submit,
    .btn-primary
  ){
    width:auto !important;
    min-width:210px !important;
  }

  .views-exposed-form .s2b-actions .s2b-clear,
  .views-exposed-form .s2b-actions a.s2b-clear,
  .views-exposed-form .s2b-actions button.s2b-clear{
    width:auto !important;
    min-width:120px !important;
  }
}

/* Hard desktop widths so verkocht matches te koop exactly */
@media (min-width: 768px){
  .views-exposed-form #edit-submit-schepen-verkoop,
  .views-exposed-form .form-actions input[type="submit"],
  .views-exposed-form .form-actions .form-submit{
    width:210px !important;
    min-width:210px !important;
    max-width:210px !important;
  }

  .views-exposed-form #edit-s2b-clear,
  .views-exposed-form .s2b-clear{
    width:120px !important;
    min-width:120px !important;
    max-width:120px !important;
  }
}

/* Desktop filter fields a bit less high */
@media (min-width: 768px){
  .s2b-exposed input[type="text"],
  .s2b-exposed input[type="search"],
  .s2b-exposed input[type="number"],
  .s2b-exposed select,
  .s2b-cell .form-item > .form-autocomplete,
  .s2b-cell .form-item > select,
  .s2b-cell .form-item > input:not([type="checkbox"]):not([type="radio"]) {
    min-height: 52px !important;
    padding: 10px 16px !important;
    border-radius: 16px !important;
  }
}

/* Restore visible outer ring around exposed filter card */
.s2b-exposed.card{
  background:#ffffff !important;
  border:1px solid #dfe6ed !important;
  border-radius:18px !important;
  box-shadow:0 10px 26px rgba(30, 43, 58, 0.08) !important;
  overflow:hidden !important;
}

.s2b-exposed.card .card-body{
  background:#ffffff !important;
}

/* Stronger visible ring around exposed filter card */
.s2b-exposed.card{
  background:#ffffff !important;
  border:1px solid #cfd8e3 !important;
  border-radius:22px !important;
  box-shadow:
    0 0 0 1px rgba(207, 216, 227, 0.85),
    0 12px 28px rgba(30, 43, 58, 0.10) !important;
  overflow:hidden !important;
}

.s2b-exposed.card .card-body{
  background:#ffffff !important;
}

/* Stronger visible ring around exposed filter card */
.s2b-exposed.card{
  background:#ffffff !important;
  border:1px solid #cfd8e3 !important;
  border-radius:22px !important;
  box-shadow:
    0 0 0 1px rgba(207, 216, 227, 0.85),
    0 12px 28px rgba(30, 43, 58, 0.10) !important;
  overflow:hidden !important;
}

.s2b-exposed.card .card-body{
  background:#ffffff !important;
}

/* Strong visible outer ring around full filter block */
.s2b-exposed.card,
.views-exposed-form .s2b-exposed.card{
  background:#ffffff !important;
  border:2px solid #c8d2dd !important;
  border-radius:24px !important;
  box-shadow:
    0 0 0 2px rgba(200, 210, 221, 0.75),
    0 14px 34px rgba(30, 43, 58, 0.12) !important;
  overflow:hidden !important;
}

.s2b-exposed.card .card-body,
.views-exposed-form .s2b-exposed.card .card-body{
  background:#ffffff !important;
}

/* Real outer wrapper ring for exposed filters */
.views-exposed-form.bef-exposed-form{
  display:block !important;
  background:#ffffff !important;
  border:2px solid #cfd8e3 !important;
  border-radius:24px !important;
  box-shadow:
    0 0 0 1px rgba(207, 216, 227, 0.9),
    0 14px 34px rgba(30, 43, 58, 0.10) !important;
  padding:18px !important;
  overflow:hidden !important;
}

.views-exposed-form.bef-exposed-form .card-body{
  background:transparent !important;
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
}
