/*
Theme Name: ProAlpin
Theme URI: jacor.de
Description: Theme für ProAlpin
Author: jacor.de
Author URI: jacor.de
Template: Divi
Version: v1.1
*/

.course-dates__table { width:100%; border-collapse:collapse; }
.course-dates__table th, .course-dates__table td { padding:12px; border-bottom:1px solid #e5e5e5; vertical-align:middle; }
.course-dates__bar { width:160px; height:10px; background:#eee; border-radius:999px; overflow:hidden; }
.course-dates__bar-fill { display:block; height:100%; background:#3aa655; }
.course-dates__text { margin-top:6px; font-size:13px; opacity:.8; }
.course-dates__btn { display:inline-block; padding:10px 14px; border-radius:6px; text-decoration:none; background:#f0c400; color:#111; font-weight:600; }
.course-dates__soldout { opacity:.7; }


/* =========================
   ProAlpin – Hero Facet Bar
   ========================= */


.hero-facetbar{
  display:flex;
  align-items:stretch;
  gap:0;
  background:#fff;
  border-radius:6px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  max-width:980px;
}

.hero-facetbar__item{
  padding:14px 18px;
  min-width:240px;
}

.hero-facetbar__label{
  font-weight:700;
  font-size:13px;
  line-height:1.1;
  margin-bottom:2px;
}

.hero-facetbar__divider{
  width:1px;
  background:rgba(0,0,0,.12);
}

.hero-facetbar__submit{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 22px;
  background:#f0c400;
  color:#111;
  text-decoration:none;
  font-weight:800;
  letter-spacing:.02em;
  white-space:nowrap;
  transition: background-color .3s ease;
}

.hero-facetbar__submit:hover{
  background-color:#cda909;
}

/* FacetWP-Felder in der Bar „clean“ wirken lassen */
.hero-facetbar .facetwp-facet{
  margin:0;
}
.hero-facetbar .facetwp-dropdown{
  width:100%;
  border:0;
  padding:6px 0;
  background:transparent;
  font-size:14px;
}
.hero-facetbar .facetwp-radio{
  margin-top:6px;
}

@media (max-width: 900px){
  .hero-facetbar{ flex-direction:column; }
  .hero-facetbar__divider{ display:none; }
  .hero-facetbar__submit{ padding:16px 18px; justify-content:center; }
  .hero-facetbar__item{ min-width:0; }
}

@media(max-width:900px) {
  .hero-facetbar .hero-facetbar__item {
    border-bottom:2px solid #3d3d3d;
  }
}


/* =========================
   ProAlpin – Tour Carousel
   ========================= */

.pak-tour-carousel {
  position: relative;
  width: 100%;
  max-width: 100%;
  padding: 0;
  box-sizing: border-box;
}

.pak-carousel__track {
  display: flex;
  flex-wrap: nowrap;
  gap: 32px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  /*scroll-snap-type: x mandatory;*/
  scroll-behavior: smooth;
  padding: 10px 24px 18px;
  margin: 0;
  box-sizing: border-box;
  cursor: grab;
  user-select: none;
}
.pak-carousel__track:active { cursor: grabbing; }

.pak-carousel__track::-webkit-scrollbar { display: none; }
.pak-carousel__track { scrollbar-width: none; -ms-overflow-style: none; }

.pak-tour-card {
  flex: 0 0 480px;
  width: 480px;
  max-width: 480px;
  background: #fff;
  border-radius: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease-in-out;
}

.pak-tour-card:hover {
  transform: translateY(-5px);
}

@media(max-width:767px) {
  .pak-tour-card:hover {
    transform: none !important;
  }
}

/* Bild */
.pak-tour-card__img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
}

/* Body */
.pak-tour-card__body {
  padding: 30px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}

.pak-tour-card__title {
  margin: 0;
  font-size: 24px;
  font-family: 'Figtree',Helvetica,Arial,Lucida,sans-serif;
  font-weight:700;
  text-transform: uppercase;
  color:#1d1e4e;
  padding-bottom:0px !important;
}

.pak-tour-card__text {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  color:#3d3d3d;
  font-weight:300;
  max-width: 55ch;
}

.pak-facts{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
  margin-top:8px;
}

/* Links: zwei Zeilen */
.pak-facts__left{
  display:grid;
  gap:10px;
}

.pak-fact{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:16px;
  color:#3d3d3d
}

.pak-fact__icon{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  line-height:1;
  opacity:.9;
}

.pak-fact__text{
  display:inline-block;
}

/* Rechts: Schwierigkeit */
.pak-facts__right{
  min-width:200px;
}

.pak-diff__label{
  font-size:16px;
  color:#3d3d3d;
  margin-bottom:20px;
}

/* Segment-Balken (5 Striche, 1 aktiv) */
.pak-diff{
  display:flex;
  gap:8px;
  align-items:center;
}

.pak-diff__seg{
  width:34px;
  height:4px;
  background:rgba(0,0,0,.25);
}

.pak-diff__seg.is-active{
  background:#2f8f2f; /* grün wie im Screenshot */
}

/* Footer/Button eckig */
.pak-tour-card__footer {
  padding: 0 30px 30px;
}

.pak-tour-card__btn {
  display: block;
  width: 100%;
  text-align: center;
  padding: 20px;
  border-radius: 0;
  background: #EABF3E;
  color: #1D1E4E;
  font-size:20px;
  font-weight: 700;
  text-decoration: none;
  transition: background-color .3s ease;
}

.pak-tour-card__btn:hover {
  background-color:#cda909;
}

/* Pfeile/Controls: komplett ausblenden (falls noch im Markup) */
.pak-carousel__prev,
.pak-carousel__next {
  display: none !important;
}

.pak-carousel__track.is-dragging{
  cursor: grabbing;
}


/* Während des Draggens: kein Snap, kein "Einrasten", keine Stufen */
.pak-carousel__track.is-dragging{
  scroll-snap-type: none !important;
  scroll-behavior: auto !important;
}

/* Verhindert Bild-Drag (Ghost-Image) und macht Drag auf der Card sauber */
.pak-tour-card__img{
  -webkit-user-drag: none;
  user-drag: none;
  user-select: none;
  pointer-events: none;
}

/* verhindert "Link ziehen" + Bild ghost-drag */
.pak-tour-card a,
.pak-tour-card__btn,
.pak-tour-card__img{
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-user-select: none;
  user-select: none;
}

.pak-tour-carousel { position: relative; }

/* Overlay */
.pak-drag-hint{
  position:absolute;
  left:16px;
  bottom:22px;
  z-index:20;
  pointer-events:none;
  opacity:0;
  transform:translateY(6px);
  transition:opacity .25s ease, transform .25s ease;
}

.pak-drag-hint.is-visible{
  opacity:1;
  transform:translateY(0);
}

.pak-drag-hint__text{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  background:rgba(0,0,0,.72);
  color:#fff;
  font-size:12px;
  letter-spacing:.02em;
  text-transform:uppercase;
}

/* kleines "↔" + Wischbewegung */
.pak-drag-hint__text::after{
  content:"↔";
  display:inline-block;
  animation: pakSwipe 1.2s ease-in-out infinite;
}

@keyframes pakSwipe{
  0%   { transform: translateX(0); opacity:.7; }
  50%  { transform: translateX(10px); opacity:1; }
  100% { transform: translateX(0); opacity:.7; }
}

/* optional: auf very small screens nach oben ziehen */
@media (max-width: 640px){
  .pak-drag-hint{ left:12px; bottom:14px; }
}


/* =========================
   Responsive
   ========================= */

@media (max-width: 1024px) {
  .pak-tour-card {
    flex: 0 0 420px;
    width: 420px;
    max-width: 420px;
  }
  .pak-tour-card__img { height: 220px; }

  /* Schwierigkeit etwas schmaler auf Tablet */
  .pak-facts__right{ min-width: 180px; }
  .pak-diff__seg{ width: 30px; }
}

@media (max-width: 640px) {
  .pak-tour-card {
    flex: 0 0 86vw;
    width: 86vw;
    max-width: 86vw;
  }
  .pak-tour-card__img { height: 200px; }

  /* Facts untereinander auf Mobile */
  .pak-facts{
    flex-direction:column;
    gap:14px;
  }
  .pak-facts__right{
    min-width:0;
  }
}
