/*
 Theme Name:   Extendable-child
 Theme URL:    https://www.classecamper.nl/
 Description:  Extendable Child Theme
 Author:       Tom Classens
 Author URL:   https://www.classecamper.nl/
 Template:  extendable
 Version:      1.0.0
 Text Domain:  extendable-child
*/

/* =========================================
   Algemene tweaks
========================================= */

body .wp-block-post-date,
body .wp-block-post-date time {
  display: none !important;
}

/* Minder ruimte tussen header en eerste contentblok */
main#wp--skip-link--target {
  padding-top: 0 !important;
}

/* Eerste blok op homepage strakker tegen de header */
main#wp--skip-link--target > .entry-content > .wp-block-group:first-child {
  padding-top: 20px !important;
}


/* =========================================
   MotoPress knoppen (sitebreed)
========================================= */

[class*="mphb-"] .button,
[class*="mphb-"] button {
  background: #6f8f6b;
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 14px 28px;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.2px;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
}

[class*="mphb-"] .button:hover,
[class*="mphb-"] button:hover {
  background: #5d7a59;
  color: #fff;
  text-decoration: none;
}


/* =========================================
   Specifieke booking form styling
========================================= */

.mphb-booking-form input.mphb-reserve-btn.button[type="submit"] {
  background: #6f8f6b;
}

.mphb-booking-form input.mphb-reserve-btn.button[type="submit"]:hover {
  background: #5d7a59;
}

.mphb-booking-form .mphb-check-in-date-wrapper input,
.mphb-booking-form .mphb-check-out-date-wrapper input {
  font-size: 18px;
  padding: 16px 18px;
  height: auto;
  border-radius: 8px;
  border: 2px solid #6f8f6b;
  background-color: #f9fbf8;
}

form.mphb-recommendation button.mphb-recommendation-reserve-button {
  background: #6f8f6b;
}

.mphb-recommendation-reserve-button:hover {
  background: #5d7a59;
  color: #fff;
}

.mphb_sc_checkout-submit-wrapper input[type="submit"].button {
  background: #6f8f6b;
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 14px 28px;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.2px;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
}

.mphb_sc_checkout-submit-wrapper input[type="submit"].button:hover {
  background: #5d7a59;
  color: #fff;
  text-decoration: none;
}


/* =========================================
   Gallery (GRID) – FIXED
   👉 NIET toepassen op sliders!
========================================= */

.mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) .gallery-item {
  margin: 0 !important;
  width: 100% !important;
}

.mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) .gallery-icon {
  width: 100%;
}

.mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) .gallery-icon a,
.mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) .gallery-icon img {
  display: block;
  width: 100%;
}

.mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) .gallery-icon img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  height: auto;
  border-radius: 8px;
}


/* Responsive grid */

@media (max-width: 768px) {
  .mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .mphb-room-type-gallery-wrapper .gallery:not(.mphb-gallery-slider) {
    grid-template-columns: 1fr;
  }
}


/* =========================================
   SLIDER FIX (FlexSlider / MotoPress)
========================================= */

/* Forceer normale slider layout */
.mphb-gallery-slider,
.mphb-gallery-slider * {
  display: block !important;
}

/* Fix extreme height bug */
.mphb-gallery-main-slider .flex-viewport {
  height: auto !important;
  max-height: 500px !important;
  overflow: hidden;
}

/* Zorg dat images netjes schalen */
.mphb-gallery-main-slider img {
  width: 100%;
  height: 500px;
  object-fit: cover;
}

.mphb-regular-price,
.mphb-details-title,
.mphb-single-room-type-attributes,
.mphb-room-type-total-capacity {
  display: none !important;
}