/*** T3SB identifier: t3sbs_footerSticky */

html {
	position:relative;
	min-height:100%
}
#page-footer {
	position:absolute;
	bottom:0;
	width:100%
}



/*** T3SB identifier: customCss_3087 */

/* ==========================================================================
   Event timetable styles for the atac_pvc TYPO3 site (t3sbootstrap / BS5)
   Companion markup: timetable-content-element.html (TYPO3 HTML content element)
   See TIMETABLE-README.md for documentation.
   ========================================================================== */

/* ==========================================================================
   TIMETABLE — prefixed "pvc-" (no clash with tt_news / tt_address).
   Later: move this block into the atac_pvc sitepackage CSS
   (or the page-specific CSS content element while prototyping).
   Mobile-first: default = chronological list per day (no grid required).
   Desktop >= 992px (Bootstrap 5 "lg"): CSS Grid with named lines.
   No JavaScript. No subgrid / round() / mod() needed.

   FULL-MATRIX SWITCH: change <div class="pvc"> to <div class="pvc pvc--full">
   and every day shows all 8 space columns incl. empty ones.

   EMPTY SLOTS: empty grid cells are not elements, so CSS alone cannot paint
   them. Add one <div class="pvc-slot"></div> per empty cell, placed like an
   event (grid-column / grid-row). They are hidden on mobile.
   ========================================================================== */

.pvc {
  /* Brand palette (from Bootstrap variables) */
  --pvc-accent: #8080FF;        /* $secondary / indigo */
  --pvc-accent-text: #5757d1;   /* darkened indigo — #8080FF fails WCAG AA on white for text */
  --pvc-dark: #141414;          /* $dark / night-black */
  --pvc-light: #f4f4f8;         /* $light / glacier-white */
  --pvc-muted-bg: #d5d5e4;      /* $muted — background use only (too weak for text) */
  --pvc-card-bg: #ffffff;       /* $white */
  --pvc-text-muted: #62626e;    /* contrast-safe gray for small text */
  --pvc-sticky-top: 0px;        /* raise if the site has a fixed navbar */

  /* Location colors — pastel set. Note: as 4px border + 7% tint these sit
     below the 3:1 non-text contrast threshold on white; the column head and
     .pvc-event-space carry the actual space name. */
  --pvc-loc-walks: #b9ffb7;
  --pvc-loc-tents: #fbfda6;
  --pvc-loc-assembly: #eab7ae;
  --pvc-loc-assembly2: #e29a8d;
  --pvc-loc-tower: #b8b8cc;
  --pvc-loc-forest: #8ee1e0;
  --pvc-loc-gathering: #fe9c72;
  --pvc-loc-medulla: #c98bb9;

  color: var(--pvc-dark);
  line-height: 1.4;
}

/* ---- Day section ---- */
.pvc-day { 
	margin-block: 2.5rem; 
	padding: 1.5rem;
    background: #ffffff;
}

.pvc-day > h2 {
  font-size: 1.4rem;
  margin: 0 0 1rem;
  padding-bottom: .4rem;
  border-bottom: 0;
}

/* ---- Event cards (shared, both layouts) ---- */
.pvc-event {
  background: var(--pvc-card-bg);
  border: 1px solid var(--pvc-muted-bg);
  border-left: 4px solid var(--pvc-loc, var(--pvc-accent));
  border-radius: 0;
  padding: .6rem .75rem;
  /* subtle location tint; browsers without color-mix() keep white */
  background: color-mix(in srgb, var(--pvc-loc, var(--pvc-card-bg)) 7%, var(--pvc-card-bg));
}

/* Location classes → pick the color; used for border + tint above */
.pvc-event--walks     { --pvc-loc: var(--pvc-loc-walks); }
.pvc-event--tents     { --pvc-loc: var(--pvc-loc-tents); }
.pvc-event--assembly  { --pvc-loc: var(--pvc-loc-assembly); }
.pvc-event--assembly2 { --pvc-loc: var(--pvc-loc-assembly2); }
.pvc-event--tower     { --pvc-loc: var(--pvc-loc-tower); }
.pvc-event--forest    { --pvc-loc: var(--pvc-loc-forest); }
.pvc-event--gathering { --pvc-loc: var(--pvc-loc-gathering); }
.pvc-event--medulla   { --pvc-loc: var(--pvc-loc-medulla); }

.pvc-event-time {
  margin: 0 0 .15rem;
  font-size: .85rem;
  font-weight: 500;
  color: var(--pvc-accent-text);
  font-variant-numeric: tabular-nums;
}

.pvc-event-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.3;
}

.pvc-event-title a {
  color: var(--pvc-accent-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.pvc-event-title a:hover,
.pvc-event-title a:focus-visible {
  color: var(--pvc-dark);
}

/* Language tag after the title.
   inline-block makes it an atomic inline, which by line-breaking rules is a
   break opportunity on both sides — so "(EN)" can move to its own line even
   when no whitespace survives in the markup. Without it, "Libraries(EN)" is
   unbreakable: no line break is allowed between a letter and an opening
   bracket. The gap comes from margin, not from a space character, so it no
   longer depends on the markup. nowrap keeps "(EN)" itself in one piece. */
.pvc-event-lang {
  display: inline-block;
  margin-left: .25em;
  font-weight: 400;
  font-size: .85rem;
  color: var(--pvc-text-muted);
  white-space: nowrap;
}

.pvc-event-space {
  margin: .3rem 0 0;
  font-size: .8rem;
  color: var(--pvc-text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* ---- Empty slots ----
   Placeholder for a free cell. Decorative only: keep it empty in the markup
   and out of the accessibility tree — a screen reader gains nothing from
   "nothing happens here", and the desktop grid is a visual aid anyway.
   Markup: <div class="pvc-slot" aria-hidden="true"
                style="grid-column: tents; grid-row: time-1400"></div>
   Hidden on mobile, where the layout is a chronological list. */
.pvc-slot {
  display: none;
}

/* ---- MOBILE (default): plain chronological list ---- */
.pvc-events {
  display: flex;
  flex-direction: column;
  gap: .6rem;
}

.pvc-space-head,
.pvc-time-label {
  display: none; /* redundant on mobile: each card names its own time + space */
}

/* ---- DESKTOP >= 992px (BS5 "lg"): grid with named lines ---- */
@media (min-width: 992px) {

  .pvc-events {
    display: grid;
    gap: .6rem .6rem;
  }

  /* Empty cell: same box geometry as .pvc-event (1px frame + 4px left edge),
     so filled and empty cells line up exactly. */
  .pvc-slot {
    display: block;
    background: var(--pvc-light);
    border: 1px solid var(--pvc-light);
    border-left: 4px solid var(--pvc-light);
    border-radius: 0;
  }

  /* Same rule as for the space heads: in compact mode the per-day templates
     have no grid lines for unused spaces, so a slot referring to them would
     lose its placement. Hide those, show them again in full-matrix mode. */
  .pvc-slot--unused { display: none; }
  .pvc--full .pvc-slot--unused { display: block; }

  .pvc-space-head {
    display: block;
    grid-row: tracks;
    position: sticky;
    top: var(--pvc-sticky-top);
    z-index: 2;
    background: var(--pvc-muted-bg);
    border-radius: 0;
    padding: .45rem .6rem;
    font-size: .85rem;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .04em;
  }

  /* compact mode (default): hide headers of spaces not used that day */
  .pvc-space-head--unused { display: none; }

  .pvc-time-label {
    display: block;
    grid-column: times;
    padding-top: .6rem;
    font-size: .85rem;
    font-weight: 500;
    color: var(--pvc-text-muted);
    font-variant-numeric: tabular-nums;
    text-align: right;
  }

  /* Column header already names the space on desktop —
     keep the per-card label for screen readers only */
  .pvc-event-space {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0; border: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  /* --- Per-day COMPACT grids (only spaces in use that day) ---

     NOTE on minmax(0, 1fr): plain "1fr" is short for "minmax(auto, 1fr)".
     That auto minimum means a column can never shrink below its longest
     unbreakable word, so a single long title (e.g. "Rechtsdurchsetzung")
     widens its column and steals space from all the others — which is why
     otherwise identical days ended up with different column widths and
     different header heights. minmax(0, 1fr) keeps every column equal. */

  /* Thursday: Walks | Tents | Assembly | Campfire Forest | Gathering */
  .pvc-day--thu .pvc-events {
    grid-template-columns:
      [times] minmax(3.2rem, auto)
      [walks-start] minmax(0, 1fr)
      [walks-end tents-start] minmax(0, 1fr)
      [tents-end assembly-start] minmax(0, 1fr)
      [assembly-end forest-start] minmax(0, 1fr)
      [forest-end gathering-start] minmax(0, 1fr)
      [gathering-end];
  }
  .pvc-day--thu .pvc-events {
    grid-template-rows:
      [tracks] auto
      [time-1400] auto
      [time-1500] auto
      [time-1540] auto
      [time-1600] auto
      [time-1815] auto
      [time-1900];
  }

  /* Friday: Walks | Assembly | Assembly 2nd fl. | Campfire Forest | Gathering | Medulla */
  .pvc-day--fri .pvc-events {
    grid-template-columns:
      [times] minmax(3.2rem, auto)
      [walks-start] minmax(0, 1fr)
      [walks-end assembly-start] minmax(0, 1fr)
      [assembly-end assembly2-start] minmax(0, 1fr)
      [assembly2-end forest-start] minmax(0, 1fr)
      [forest-end gathering-start] minmax(0, 1fr)
      [gathering-end medulla-start] minmax(0, 1fr)
      [medulla-end];
  }
  .pvc-day--fri .pvc-events {
    grid-template-rows:
      [tracks] auto
      [time-1000] auto
      [time-1100] auto
      [time-1200] auto
      [time-1500] auto
      [time-1600] auto
      [time-1800] auto
      [time-2200];
  }

  /* Saturday: Walks | Tents | Assembly | Campfire Tower | Campfire Forest | Gathering */
  .pvc-day--sat .pvc-events {
    grid-template-columns:
      [times] minmax(3.2rem, auto)
      [walks-start] minmax(0, 1fr)
      [walks-end tents-start] minmax(0, 1fr)
      [tents-end assembly-start] minmax(0, 1fr)
      [assembly-end tower-start] minmax(0, 1fr)
      [tower-end forest-start] minmax(0, 1fr)
      [forest-end gathering-start] minmax(0, 1fr)
      [gathering-end];
  }
  .pvc-day--sat .pvc-events {
    grid-template-rows:
      [tracks] auto
      [time-1400] auto
      [time-1500] auto
      [time-1800] auto
      [time-1900] auto
      [time-2000];
  }

  /* --- FULL-MATRIX mode: add "pvc--full" to the .pvc wrapper.
         One shared 8-column template overrides the per-day ones
         (source order wins at equal specificity), and the unused
         headers become visible again. --- */
  .pvc--full .pvc-events {
    grid-template-columns:
      [times] minmax(3.2rem, auto)
      [walks-start] minmax(0, 1fr)
      [walks-end tents-start] minmax(0, 1fr)
      [tents-end assembly-start] minmax(0, 1fr)
      [assembly-end assembly2-start] minmax(0, 1fr)
      [assembly2-end tower-start] minmax(0, 1fr)
      [tower-end forest-start] minmax(0, 1fr)
      [forest-end gathering-start] minmax(0, 1fr)
      [gathering-end medulla-start] minmax(0, 1fr)
      [medulla-end];
  }
  .pvc--full .pvc-space-head--unused { display: block; }
}