/*
Theme Name: Blocksy Child
Theme URI: https://creativethemes.com/blocksy/
Author: Dein Name oder Firma
Author URI: https://deine-domain.at
Description: Child Theme für Anpassungen am Blocksy-Theme
Template: blocksy
Version: 1.0.0
Text Domain: blocksy-child
*/


/* --- 1️⃣ Hidden at page load on homepage --- */
body.home header.ct-header [data-row="top"] {
  display: none !important;
}

/* Header middle row off on Karte, Betriebe & Homepage */
body.page-id-1101 header.ct-header [data-row="middle"],
body.post-type-archive-betrieb header.ct-header [data-row="middle"],
body.single-betrieb header.ct-header [data-row="middle"],
body.home header.ct-header [data-row="middle"] {
  display: none !important;
}

/* Remove any leftover container space Blocksy reserves */
body.home .ct-header .ct-header-container[data-device="desktop"],
body.home .ct-sticky-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
  height: auto !important;
  min-height: 0 !important;
}

/* --- 2️⃣ When header gets 'show-topbar', make the topbar visible --- */
body.home header.ct-header.show-topbar [data-row="top"] {
  display: block !important;       /* re-enable it */
  animation: fadeSlideDown 0.4s ease forwards;
  background: white;                /* black background */
}

/* Simple fade + slight slide animation */
@keyframes fadeSlideDown {
  0% { opacity: 0; transform: translateY(-10px); }
  100% { opacity: 1; transform: translateY(0); }
}

article.betrieb {
  background-color: #f9f9f9;  /* deine Wunschfarbe */
  border-radius: 0px;        /* optional runde Ecken */
  box-shadow: 0 4px 10px rgba(0,0,0,0.08); /* optional Schatten */
  padding: 0px;              /* Abstand innen */
  margin-bottom: 0px;        /* Abstand nach außen */
  overflow: hidden;           /* sorgt dafür, dass Bilder auch runde Ecken haben */
}

article.betrieb h4 {
  line-height: 1.4;
  margin: 12px 0;         /* oben/unten Abstand */
  padding: 0 12px;        /* links/rechts Abstand */
}

/* Feedback and Partnerbetrieb - Form Layout */
.acf-partnerbetrieb-form .acf-form {
  background: #fff;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}

.acf-partnerbetrieb-form .acf-field {
  margin-bottom: 15px;
}

.acf-partnerbetrieb-form input,
.acf-partnerbetrieb-form select,
.acf-partnerbetrieb-form textarea {
  border-radius: 6px;
  border: 1px solid #ccc;
  padding: 8px 10px;
  width: 100%;
}

/* Match ACF field layout for custom taxonomy fields */
.acf-extra-fields {
  background: transparent;
  border: none;
  padding: 0;
}

.acf-extra-fields h3 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--heading-color, #222);
  margin-top: 1.5em;
  margin-bottom: 0.4em;
}

.acf-extra-fields p {
  font-size: 0.9rem;
  color: #555;
  margin-bottom: 0.6em;
}

.acf-extra-fields select,
.acf-extra-fields input[type="checkbox"] {
  border-radius: 6px;
  border: 1px solid #ccc;
  padding: 6px 10px;
  font-size: 15px;
}

.acf-extra-fields label {
  margin-right: 10px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.9rem;
}

/* Layout of the Dienstleistungen checkboxes inside the partner form */
.acf-extra-fields .dienstleistungen {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.5rem;  /* vertical | horizontal spacing between boxes */
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
}

/* Each label box (the checkbox + text) */
.acf-extra-fields .dienstleistungen label {
  display: flex;
  align-items: center;
  gap: 6px; /* distance between checkbox and label text */
  padding: 4px 8px;  /* inner spacing inside each label */
  background: #f9f9f9;  /* light background (optional) */
  border-radius: 6px;
  border: 1px solid #ddd;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* Hover effect (optional) */
.acf-extra-fields .dienstleistungen label:hover {
  background: #eef6fb;
  border-color: #0085CD;
}

/* Checkbox size + accent color */
.acf-extra-fields .dienstleistungen input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #0085CD; /* blue accent to match your theme */
  cursor: pointer;
}

/* Layout of the Dienstleistungen checkboxes inside the partner form */
.acf-extra-fields .betriebsarten {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.5rem;  /* vertical | horizontal spacing between boxes */
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;
}

/* Each label box (the checkbox + text) */
.acf-extra-fields .betriebsarten label {
  display: flex; !important;
  align-items: center;
  gap: 6px; /* distance between checkbox and label text */
  padding: 4px 8px;  /* inner spacing inside each label */
  background: #f9f9f9;  /* light background (optional) */
  border-radius: 6px;
  border: 1px solid #ddd;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* Hover effect (optional) */
.acf-extra-fields .betriebsarten label:hover {
  background: #eef6fb;
  border-color: #0085CD;
}

/* Checkbox size + accent color */
.acf-extra-fields .betriebsarten input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: #0085CD; /* blue accent to match your theme */
  cursor: pointer;
	}
	
.g-recaptcha {
  margin-top: 1em;
  margin-bottom: 1em;
  transform: scale(0.95);
  transform-origin: left top;
}

.acf-honeypot {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* === 🖼 BETRIEB CAROUSEL – FINAL VERSION === */

/* === Base container === */
.betrieb-carousel {
  position: relative;
  overflow: hidden;
  width: 100%;
  display: block;
}

/* Each carousel item (the background image slide) */
.betrieb-carousel .carousel-item {
  background-size: cover;
  background-position: center;
  aspect-ratio: 4 / 3;         /* keeps consistent height */
  position: relative;
  width: 100%;
  display: block;
}

/* --- Counter top-right --- */
.betrieb-carousel .carousel-counter {
  position: absolute;
  top: 10px;
  right: 12px;
  background: rgba(0,0,0,0.6);
  color: #fff;
  font-size: 13px;
  padding: 3px 8px;
  border-radius: 12px;
  font-weight: 600;
  z-index: 2;
}

/* --- multi-image carousel arrows --- */
.betrieb-carousel.multi .splide__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.4);
  color: white;
  border-radius: 50%;
  width: 28px;
  height: 28px;
  transition: background 0.2s;
  z-index: 2;
}

.betrieb-carousel.multi .splide__arrow:hover {
  background: rgba(0,0,0,0.7);
}

/* Hide arrows on mobile */
@media (max-width: 768px) {
  .betrieb-carousel.multi .splide__arrow {
    display: none !important;
  }
}

/* White arrow icons */
.betrieb-carousel .splide__arrow svg {
  fill: white !important;
  width: 18px;
  height: 18px;
}

/* === single-image layout (fallback if only 1 image) === */
.betrieb-carousel.single {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  display: block;
}

.betrieb-carousel.single img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* === 📱 Responsive adjustments === */
@media (max-width: 480px) {
  .betrieb-carousel .carousel-counter {
    font-size: 12px;
    padding: 2px 6px;
  }
}

/* === Fixes for single Betrieb pages (prevent collapse) === */
.single-betrieb .betrieb-carousel {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.single-betrieb .betrieb-carousel .splide__track {
  height: auto !important;
}

.single-betrieb .betrieb-carousel .splide__slide,
.single-betrieb .betrieb-carousel .carousel-item {
  min-height: 320px !important;
  aspect-ratio: 4 / 3;
  background-size: cover;
  background-position: center;
}

/* === Compact layout for archive/overview === */
.post-type-archive-betrieb .betrieb-carousel .splide__slide,
.post-type-archive-betrieb .betrieb-carousel .carousel-item,
.blog .betrieb-carousel .splide__slide,
.blog .betrieb-carousel .carousel-item {
  aspect-ratio: 4 / 3;
  min-height: auto !important;
  height: auto;
  background-size: cover;
  background-position: center;
}


/* === Extend archive carousel layout to taxonomy archives === */
.tax-dienstleistungen .betrieb-carousel .splide__slide,
.tax-betriebsart .betrieb-carousel .splide__slide,
.tax-ort .betrieb-carousel .splide__slide,
.tax-dienstleistungen .betrieb-carousel .carousel-item,
.tax-betriebsart .betrieb-carousel .carousel-item,
.tax-ort .betrieb-carousel .carousel-item {
  aspect-ratio: 4 / 3;
  min-height: auto !important;
  height: auto;
  background-size: cover;
  background-position: center;
}