/* Theme override for coach card B */

/* Card container */
.coach-cards-b .coach-card-b {
  position: relative;
  width: 100%;
  aspect-ratio: 2/3;
  max-width: 420px;
  margin-inline: auto;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  /* unified height of the bottom information bar (used for docking popover & link cover) */
  --coach-info-height: 97px; /* desktop default */
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
}

/* Remove Bootstrap grid gutters for this row to avoid thin lines between cards */
/* gutters restored (previous override removed) */

/* Full-card link cover (excludes bottom overlay area for interactions) */
.coach-cards-b .coach-card-b__link-cover {
  position: absolute;
  inset: 0 0 var(--coach-info-height) 0; /* leave space for bottom overlay */
  z-index: 3;
}

/* When popover is open, also leave space for its area so backdrop-filter can sample */
@supports selector(.coach-card-b:has(.coach-card-b__popover[aria-hidden="false"])) {
  .coach-cards-b .coach-card-b:has(.coach-card-b__popover[aria-hidden="false"]) .coach-card-b__link-cover {
    /* extend the excluded bottom area by estimated popover height */
    inset: 0 0 calc(var(--coach-info-height) + 130px) 0;
  }
}

/* Full-bleed background */
.coach-cards-b .coach-card-b__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  filter: none;
  transform: none; /* allow backdrop-filter to sample this layer in Chrome/Firefox */
}

/* Optional <img> variant for better lazy loading */
.coach-cards-b .coach-card-b__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Online/Offline badge (icon background-image set via inline or future class) */
.coach-cards-b .coach-card-b__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  width: 50px; /* groesser oder kleiner */
  height: 50px; /* groesser oder kleiner */
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  z-index: 5;
  transition: transform .15s ease, filter .15s ease;
  display: block; /* ensure anchor behaves like original div */
}

/* Badge color via classes; image is provided inline-style or via mask */
.coach-cards-b .coach-card-b__badge.is-online {
  background-image: url('/themes/custom/mycoachz_theme/assets/mycoachz-online.png');
}
.coach-cards-b .coach-card-b__badge.is-offline {
  background-image: url('/themes/custom/mycoachz_theme/assets/mycoachz-offline.png');
}

/* Bottom overlay untere Infofläche */
.coach-cards-b .coach-card-b__bottom {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 8px 64px 12px 14px; /* leave space right for plus button */
  background: rgba(0,0,0,.12); /* solid background without gradient */
  color: #fff;
  background-clip: padding-box; /* match popover compositing to avoid seam */
  z-index: 7; /* above link-cover (z-index:3) and badge (5) so clicks work */
  cursor: pointer;
  min-height: var(--coach-info-height);
}

/* Plus button trigger Zusatzinformationen oberhalb der unteren Infofläche */
.coach-cards-b .coach-card-b__plus {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background-color: rgba(0,0,0,.12);
  background-image: url('/themes/custom/mycoachz_theme/assets/plus.png');
  background-repeat: no-repeat;
  background-size: 100% 100%; /* fill the circle with the plus graphic */
  background-position: center;
  border: 1px solid transparent; /* suppress thin white ring in closed state */
  box-shadow: 0 4px 10px rgba(0,0,0,.25);
  pointer-events: auto; /* ensure independent clickability above overlay */
  z-index: 8;
  transition: transform .15s ease, filter .15s ease; /* match badge behavior */
}
.coach-cards-b .coach-card-b__plus:hover,
.coach-cards-b .coach-card-b__plus:focus {
  outline: none;
  transform: scale(1.06);
  filter: brightness(1.05);
}
.coach-cards-b .coach-card-b__plus[aria-expanded="true"] {
  background-image: url('/themes/custom/mycoachz_theme/assets/minus.png');
  background-color: transparent; /* keep PNG look, avoid light halo */
  border-color: transparent;     /* remove thin white ring when open */
}
.coach-cards-b .coach-card-b__plus[aria-expanded="true"]:hover,
.coach-cards-b .coach-card-b__plus[aria-expanded="true"]:focus {
  border-color: transparent;     /* also suppress on hover/focus while open */
}

/* Top status point Online/Offline */
.coach-cards-b .coach-card-b__top { display: none; }
.coach-cards-b .coach-card-b__status {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,.08);
  background: #6c757d; /* default grey */
}
.coach-cards-b .coach-card-b__status.is-online { background: #2ecc71; }
.coach-cards-b .coach-card-b__status.is-offline { background: #6c757d; }

/* Popover Zusatzinformationen oberhalb der unteren Infofläche */
.coach-cards-b .coach-card-b__popover {
  position: absolute;
  left: 0; /* align text via internal padding to match bottom overlay */
  right: 0;
  bottom: var(--coach-info-height); /* meet exactly; unified blur layer removes seam */
  background: rgba(0, 0, 0, 0.12); /* slightly lighter */
  color: #fff;
  border-radius: 10px 10px 0 0; /* no rounded corners at the bottom edge */
  padding: 10px 14px 2px 14px; /* align text with bottom overlay left padding */
  font-size: .9rem; /* match tags */
  line-height: 1.3; /* match tags */
  box-shadow: none; /* seamless connection without shadow */
  display: none;
  z-index: 20; /* ensure above link-cover (3) and bottom (7) in all engines */
  min-height: 80px; /* ensure visible area even during async load */
}
/* Inhalt des fields field_kurzbeschreibung */
.coach-cards-b .coach-card-b__desc {
  margin-bottom: 6px;
  font-size: 1.25rem;
  line-height: 1.45;
  font-style: italic;
  font-weight: 600;
}
.coach-cards-b .coach-card-b__meta { font-size: .95rem; line-height: 1.3; opacity: .95; }
.coach-cards-b .coach-card-b__sep { padding: 0 6px; opacity: .9; }
.coach-cards-b .coach-card-b__popover strong { font-weight: 400; }
.coach-cards-b .coach-card-b__popover[aria-hidden="false"] {
  display: block;
}
.coach-cards-b .coach-card-b__popover-inner { pointer-events: none; }

/* Progressive enhancement: uniform light blur for bottom overlay and popover */
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  /* Bottom overlay: uniform light blur */
  .coach-cards-b .coach-card-b__bottom {
    background: rgba(0,0,0,.12);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
  }

  /* Popover: pure ::before blur (element stays crisp) */
  .coach-cards-b .coach-card-b__popover {
    /* ensure paint in all engines; color tuned to match bottom overlay */
    background: rgba(0,0,0,.12);
    z-index: 9;
    overflow: hidden; /* confine ::before to rounded corners */
    background-clip: padding-box;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
  }
  /* Additional internal layer to improve Chrome/Firefox rendering */
  .coach-cards-b .coach-card-b__popover::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    /* tiny tint to trigger compositing in Chrome/Firefox without visible darkening */
    background: rgba(0,0,0,0.001);
    z-index: 0; /* below content, above element background */
    border-radius: inherit;
  }
  .coach-cards-b .coach-card-b__popover-inner { position: relative; z-index: 1; }
  /* Remove any pseudo-element blur (not needed when blurring the element itself) */
  .coach-cards-b .coach-card-b__popover::before { content: none; }

  /* Unified blur layer across bottom + popover to eliminate seams */
  .coach-cards-b .coach-card-b::after { content: none; }
  .coach-cards-b .coach-card-b:has(.coach-card-b__popover[aria-hidden="false"])::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: calc(var(--coach-info-height) + var(--popover-height, 0px));
    pointer-events: none;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    z-index: 6; /* sits below bottom (7) and popover (20) */
  }
  /* When unified layer is active, suppress per-element blur to avoid double-processing */
  .coach-cards-b .coach-card-b:has(.coach-card-b__popover[aria-hidden="false"]) .coach-card-b__bottom,
  .coach-cards-b .coach-card-b:has(.coach-card-b__popover[aria-hidden="false"]) .coach-card-b__popover {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

.coach-cards-b .coach-card-b__name {
  font-weight: 400;
  font-size: 1.625rem;
  line-height: 1.25;
  margin-bottom: 4px;
  white-space: nowrap; /* keep to one line for consistent height */
  overflow: hidden;
  text-overflow: ellipsis;
}
.coach-cards-b .coach-card-b__name .coach-card-b__status { vertical-align: middle; margin-left: 8px; width: 12px; height: 12px; }

.coach-cards-b .coach-card-b__tags {
  font-size: .9rem;
  line-height: 1.3;
  opacity: .95;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* Reserve two lines of height even if only one line of text is present */
  min-height: calc(2 * 1.3em);
}
.coach-cards-b .coach-card-b__tag { white-space: nowrap; }

@media (max-width: 575.98px) {
  .coach-cards-b .coach-card-b { max-width: 100%; aspect-ratio: 2/3; }
  .coach-cards-b .coach-card-b__name { font-size: 1.5rem; font-weight: 600; }
  .coach-cards-b .coach-card-b__tags { font-size: .88rem; }
  .coach-cards-b .coach-card-b__desc { font-size: 1.15rem; }
  .coach-cards-b .coach-card-b__meta { font-size: .9rem; }
  /* mobile: smaller typography -> smaller info bar */
  .coach-cards-b .coach-card-b { --coach-info-height: 100px; }
}

/* XL and up (Bootstrap ≥1200px) */
@media (min-width: 1200px) {
  .coach-cards-b .coach-card-b { --coach-info-height: 100px; }
}

/* XXL and up (Bootstrap ≥1400px) */
@media (min-width: 1400px) {
  .coach-cards-b .coach-card-b { --coach-info-height: 102px; }
}

/* Hover animation for badge */
.coach-cards-b .coach-card-b__badge:hover { transform: scale(1.06); filter: brightness(1.05); }

/* Bootstrap table background/border neutralization for coaches view page_1 */
.view-id-coaches.view-display-id-page_1 .table,
.view-id-coaches.view-display-id-page_1 .table > :not(caption) > * > *,
.view-id-coaches.view-display-id-page_1 .table-primary > :not(caption) > * > *,
.view-id-coaches.view-display-id-page_1 .table-striped > tbody > tr:nth-of-type(odd) > *,
.view.view--coaches.view-display-id-page_1 .table,
.view.view--coaches.view-display-id-page_1 .table > :not(caption) > * > *,
.view.view--coaches.view-display-id-page_1 .table-primary > :not(caption) > * > *,
.view.view--coaches.view-display-id-page_1 .table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: transparent !important;
  box-shadow: none !important;
}
.view-id-coaches.view-display-id-page_1 .table,
.view-id-coaches.view-display-id-page_1 .table *,
.view.view--coaches.view-display-id-page_1 .table,
.view.view--coaches.view-display-id-page_1 .table * {
  border-color: transparent !important;
}

/* Prefer CSS variable override to catch all Bootstrap table backgrounds/borders */
.view-id-coaches.view-display-id-page_1 .table,
.view.view--coaches.view-display-id-page_1 .table {
  --bs-table-bg: transparent !important;
  --bs-table-border-color: transparent !important;
  --bs-table-accent-bg: transparent !important;
  --bs-table-striped-bg: transparent !important;
  --bs-table-hover-bg: transparent !important;
}

/* Hard reset: remove any residual backgrounds/borders on view wrappers and grid */
.view.view--coaches.view-display-id-page_1,
.view.view--coaches.view-display-id-page_1 .view-content,
.view.view--coaches.view-display-id-page_1 .views-bootstrap-grid,
.view.view--coaches.view-display-id-page_1 .views-bootstrap-cards,
.view.view--coaches.view-display-id-page_1 .row,
.view.view--coaches.view-display-id-page_1 [class^="col-"],
.view.view--coaches.view-display-id-page_1 [class*=" col-"] {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Ensure equal vertical and horizontal spacing; use flex row-gap for reliability */
.view.view--coaches.view-display-id-page_1 .coach-cards-b.row {
  /* neutralize Bootstrap's margin-based vertical gutter */
  --bs-gutter-y: 0 !important;
  /* set vertical spacing via flex gap equal to horizontal gutter */
  row-gap: var(--bs-gutter-x) !important;
  column-gap: 0 !important; /* avoid doubling horizontal spacing */
}

/* Neutralize Bootstrap card styling inside the coaches view grid */
.view.view--coaches.view-display-id-page_1 .coach-cards-b .card {
  --bs-card-bg: transparent !important;
  --bs-card-border-color: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Background image for coaches view (page_1) */
.view.view--coaches.view-display-id-page_1,
.view-id-coaches.view-display-id-page_1 {
  position: relative; /* anchor pseudo-element */
}
.view.view--coaches.view-display-id-page_1::before,
.view-id-coaches.view-display-id-page_1::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url('/themes/custom/mycoachz_theme/assets/coaches-hintergrund.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: .25; /* subtle; adjust as needed */
  z-index: 0;
  pointer-events: none;
}
/* ensure view content sits above the background */
.view.view--coaches.view-display-id-page_1 .view-content,
.view.view--coaches.view-display-id-page_1 .views-bootstrap-grid,
.view.view--coaches.view-display-id-page_1 .views-bootstrap-cards,
.view.view--coaches.view-display-id-page_1 .coach-cards-b.row,
.view-id-coaches.view-display-id-page_1 .view-content,
.view-id-coaches.view-display-id-page_1 .views-bootstrap-grid,
.view-id-coaches.view-display-id-page_1 .views-bootstrap-cards,
.view-id-coaches.view-display-id-page_1 .coach-cards-b.row {
  position: relative;
  z-index: 1;
}
/* Disable coaches view background, wenn wieder ein Hintergrund angezeigt werden soll, diesen Block loeschen */
.view.view--coaches.view-display-id-page_1::before,
.view-id-coaches.view-display-id-page_1::before {
  content: none !important;
}