/*
Theme Name: Golden Harps
Description: Template für Golden Harps Gospel Choir
Author: ETRNL
Author URI: https://etrnl.de/
Author Email: daniel@etrnl.de
Version: 1.0.0
Text Domain: hello-elementor-child
Template: hello-elementor
*/
/*
Add your custom styles here
*/
body{overflow-x: hidden;}
.elementor-nav-menu--main .elementor-item:hover, .elementor-nav-menu--main .elementor-item-active{
	text-decoration: underline;
}

/*MP3 Player Startseite / HOME: */

/* Container für alles */
  .play-wrapper {
    position: relative;
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transform: scale(0.9);
  }

  /* Grauer Hintergrund-Ring (8px dick) */
  .play-border {
    position: absolute;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    /* Wir malen den Kreis per conic-gradient komplett in Grau */
    background: conic-gradient(#E0E0E0 360deg, #E0E0E0 0deg);
    /* Rotieren um -90°, damit 0° oben (12 Uhr) liegt */
    transform: rotate(-90deg);
    /* „Loch“ in der Mitte => 8px dicker Rand */
    mask: radial-gradient(farthest-side, transparent 75%, black 75%);
    -webkit-mask: radial-gradient(farthest-side, transparent 75%, black 75%);
    pointer-events: none; /* Klicks nicht blocken */
  }

  /* Blauer Fortschritts-Ring (überm Hintergrund-Ring), startet unsichtbar */
  .play-progress {
    position: absolute;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    transform: rotate(-90deg);
    /* Anfangszustand: 0 deg => Nichts gefüllt */
    background: conic-gradient(#0642A4 0deg, #0642A4 0deg, transparent 0deg, transparent 360deg);
    /* Gleiches 8px-„Loch“ in der Mitte */
    mask: radial-gradient(farthest-side, transparent 75%, black 75%);
    -webkit-mask: radial-gradient(farthest-side, transparent 75%, black 75%);
    pointer-events: none;
  }

  /* Play-/Pause-Icon in der Mitte */
  .play-icon {
    z-index: 1;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #EAD89E;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    color: #611622;
  }

/*POPUP*/
/*#elementor-popup-modal-2692{display: none;}*/
/*
#sbi_images {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

#sb_instagram #sbi_images .sbi_item {
  flex: 1 1 calc(50% - 10px)!important;
  margin-bottom: 10px !important;
}

#sb_instagram #sbi_images .sbi_item:nth-child(1) {
  margin-top: 50px !important;
} */

/*
#sbi_images {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 200px; 
  gap: 20px !important;
}

#sb_instagram #sbi_images .sbi_item {
  background-color: #D4AF37;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #333;
  border-radius: 8px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}


#sb_instagram #sbi_images .sbi_item:nth-child(odd) {
  grid-row: span 2;
}
#sb_instagram #sbi_images .sbi_item{
	padding: 15px !important;
}*/

.elementor-custom-embed-play svg{
	height: 80px;
    width: 80px;
}

/* Customizer Code */

.ticket-counter {
    background: #F8F8F8;
    padding: 10px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 15px;
    font-family: Arial, sans-serif;
}

.ticket-counter label {
    font-size: 16px;
    color: #611622;
}

.ticket-selector {
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #611622;
    overflow: hidden;
    width: 110px; /* Ensures it doesn't expand */
    justify-content: space-between;
}

.ticket-btn {
    background: transparent;
    border: none;
    padding: 8px;
    font-size: 18px;
    color: #611622;
    cursor: pointer;
    outline: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
}

.ticket-input {
    width: 40px;
    text-align: center;
    border: none;
    font-size: 16px;
    color: #611622;
    outline: none;
    background: transparent;
    appearance: textfield;
}

/* Hide number input arrows */
.ticket-input::-webkit-inner-spin-button,
.ticket-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.ticket-btn:hover {
    background: #611622;
    color: #fff;
}

/* Base styling for both sections */
#highlightVideo,
#highlightsimages {
  position: relative;
  overflow: hidden;
  border-radius: 8px; /* Matching the rounded corners from your image */
}

/* Make the second section match the height of the first */
#highlightsimages {
  height: 100%; /* This will make it fill its container */
}

/* Create a container for both sections to ensure equal heights */
.highlights-container {
  display: flex;
  gap: 20px; /* Space between the sections */
}

/* Make both sections take equal width */
.highlights-container > div {
  flex: 1;
}

/* For images inside the sections */
#highlightVideo img,
#highlightsimages img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* This ensures images cover the area without distortion */
}

/* For responsive design */
@media (max-width: 768px) {
  .highlights-container {
    flex-direction: column;
  }
  
  #highlightsimages {
    height: auto; /* On mobile, let it size naturally */
    aspect-ratio: 16/9; /* Maintain same aspect ratio as videos typically have */
  }
}
.jet-engine-listing-overlay-wrap .elementor-widget-image img, .type-special-events img{
	border-radius: 20px;
    max-height: 288px;
	max-width: 325px;
}
.jet-engine-listing-overlay-wrap .elementor-widget.elementor-widget-button a, .type-special-events .elementor-button-link{max-width:300px;}



/* ========= Sektionen / Überschriften ========= */
.wpcf7 form .section{
  margin:0 0 22px;
  padding:16px;
  border:1px solid #e6e6e6;
  background:#fafafa;
  border-radius:12px;
}
.wpcf7 form h3{ margin:0 0 14px; }
.wpcf7 form h4{ margin:8px 0 10px; }

/* ========= Grid-Layouts ========= */
.wpcf7 form .grid-2{
  display:grid;
  gap:14px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.wpcf7 form .grid-2.tight{ gap:10px; }
.wpcf7 form .field{ margin:0 0 14px; }
.wpcf7 form .field > label{
  display:block;
  font-weight:600;
  margin:0 0 6px;
  color:#20262c;
}
.wpcf7 form .hint{
  margin:2px 0 12px;
  font-size:.95rem;
  color:#555;
}

/* (Optional) Fallbacks, falls irgendwo .form-grid/.row noch genutzt werden */
.wpcf7 form .form-grid{
  display:grid;
  gap:20px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.wpcf7 form .col{
  background:#fafafa;
  padding:16px;
  border:1px solid #eee;
  border-radius:12px;
}
.wpcf7 form .row{
  display:grid;
  gap:14px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}

/* ========= Preiszeilen ========= */
.wpcf7 form .price-list{
  display:grid;
  gap:6px;
  margin:0 0 12px;
}
.wpcf7 form .price-list .muted{
  opacity:.85;
}

/* ========= Mengenfelder kompakt ========= */
.wpcf7 form .qty-grid{
  display:grid;
  gap:12px 18px; /* etwas mehr Luft horizontal */
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:center;
}
.wpcf7 form .qty-item{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  gap:12px;
  margin:0;
}
.wpcf7 form .qty-label{ white-space:nowrap; }
.wpcf7 form input.qty-input{
  max-width:7ch;
  text-align:right;
  padding:8px 10px;
}

/* ========= Zusammenfassung ========= */
.wpcf7 form .summary{
  margin:12px 0 0;
  padding:10px 12px;
  background:#f3f7ff;
  border:1px solid #e0e8ff;
  border-radius:8px;
}

/* ========= Radio / Checkbox: Luft & Klickfläche ========= */
.wpcf7-form .wpcf7-checkbox,
.wpcf7-form .wpcf7-radio{
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  margin:6px 0 12px;
}
.wpcf7-form span.wpcf7-list-item{ margin:0; }
.wpcf7-form span.wpcf7-list-item > label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border:1px solid #ddd;
  border-radius:8px;
  line-height:1.2;
  background:#fff;
}
.wpcf7-form span.wpcf7-list-item input[type="checkbox"],
.wpcf7-form span.wpcf7-list-item input[type="radio"]{
  margin:0;
}
.wpcf7-form span.wpcf7-list-item label:hover{ border-color:#cbd5e1; }

/* ========= Responsiv ========= */
@media (max-width:900px){
  .wpcf7 form .grid-2{ grid-template-columns:1fr; }
  .wpcf7 form .qty-grid{ grid-template-columns:1fr; }
  .wpcf7 form .form-grid{ grid-template-columns:1fr; } /* Fallback */
}
@media (max-width:560px){
  .wpcf7 form input.qty-input{ max-width:8ch; }
}
/* Inline-Stepper um die Number-Inputs */
.wpcf7 form .qty-stepper{
  display:inline-grid;
  grid-template-columns:auto auto auto;
  gap:6px;
  align-items:center;
}
.wpcf7 form .qty-stepper .qty-btn{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid #ddd;
  background:#fff;
  width:2.2rem; height:2.2rem;
  border-radius:6px;
  font-weight:700;
  line-height:1; padding:0;
}
.wpcf7 form .qty-stepper .qty-btn:active{ transform:translateY(1px); }
.wpcf7 form .qty-stepper .qty-btn:disabled{ opacity:.5; cursor:not-allowed; }
.wpcf7 form .qty-stepper input.qty-input{
  max-width:6.5ch; text-align:center; padding:6px 8px;
}
input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea{
	background-color: var(--e-global-color-6f7ec9d);
    border-width: 0px 0px 0px 0px;
    border-radius: 15px 15px 15px 15px;
    font-family: "Manrope", Sans-serif;
    font-size: 12px;
    font-style: italic;
    color: #611622 !important;
	height: 44px;
}
textarea{
	height: 200px;
}

.clear{clear: none !important;}
.wpcf7-turnstile{margin-bottom: 20px;}

.red-button{
    background-color: var(--e-global-color-text) !important;
    color: #ffffff !important;
    border-color: var(--e-global-color-text)  !important;
	line-height: 1;
}
.red-button:hover{color: #fff !important; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.15);}
.summary p{margin:0;}
.wpcf7-acceptance .wpcf7-list-item-label::after {
  content: " *";
  color: red;
}