/*
Theme Name: Fackiner's EventWerk
Theme URI: https://github.com/starsamanagement/fackiner-events
Author: D&W Group
Description: Bespoke classic theme for Fackiner's EventWerk — the approved editorial one-page composition with a separate inquiry page. Plain PHP, CSS and vanilla JavaScript: no framework, no page builder, no build step. The design is frozen; this theme carries it, it does not reinterpret it.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fackiners-eventwerk
Tags: custom-theme, one-page, editorial, accessibility-ready
*/

/* -----------------------------------------------------------------
   This stylesheet is NOT the design.

   The approved design lives in assets/css/ — tokens, base, components,
   sections, responsive — and is loaded in that order before this file.
   What follows is only what WordPress adds on top: the admin bar, and
   the two states the production form has that the prototype did not.
   Nothing here restyles an approved component.
   ----------------------------------------------------------------- */

/* ---------- Admin bar ----------
   The sticky header pins to the top of the viewport and the navigation
   overlay covers it. Logged in, WordPress puts its own 32px bar there
   (46px below 783px, where it stops being fixed). Without this the
   header would sit under the bar and the overlay would cover it. */
.admin-bar .fkn-header {
  top: 32px;
}

.admin-bar .fkn-navpanel {
  top: 32px;
}

@media screen and (max-width: 782px) {
  .admin-bar .fkn-header {
    top: 46px;
  }

  .admin-bar .fkn-navpanel {
    top: 46px;
  }
}

/* The admin bar is not fixed under 601px, so it scrolls away and the
   header takes the top edge back. */
@media screen and (max-width: 600px) {
  .admin-bar .fkn-header {
    top: 0;
  }
}

/* ---------- Inquiry form ---------- */

/* Honeypot. Off-screen rather than display:none so a bot that reads
   computed styles still finds it worth filling, while nobody sees it
   and nothing in the layout moves. */
.fkn-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* While the enquiry is in flight the button stops accepting clicks.
   aria-disabled rather than the disabled attribute, so the control
   keeps its name and stays reachable for screen readers. */
.fkn-cta[data-sending="true"] {
  pointer-events: none;
  opacity: 0.6;
}

/* The status line is focused after the redirect so the outcome is
   announced and read; it should not draw a ring when clicked. */
.fkn-formstatus:focus:not(:focus-visible) {
  outline: none;
}

/* ---------- Editor-managed pages ----------
   Impressum, Datenschutz and anything else written in the WordPress
   editor. Same type and rhythm as the rest of the site, deliberately
   plain: this is running text, not a designed section. */
.s-page {
  padding-block: var(--fkn-pad-s08-top) var(--fkn-pad-s08-bottom);
}

.s-page__title {
  margin-top: 16px;
  font-family: var(--fkn-font-display);
  font-size: var(--fkn-fs-h2-section);
  font-weight: 700;
  line-height: var(--fkn-lh-h2-section);
  letter-spacing: -0.02em;
  color: var(--fkn-ink);
}

.s-page__body {
  margin-top: 32px;
  max-width: 68ch;
  font-size: var(--fkn-fs-lead);
  line-height: var(--fkn-lh-lead);
  color: var(--fkn-text-2);
}

.s-page__body > * + * {
  margin-top: 1em;
}

.s-page__body h2 {
  margin-top: 1.8em;
  font-family: var(--fkn-font-display);
  font-size: var(--fkn-fs-step-title);
  font-weight: 700;
  line-height: normal;
  color: var(--fkn-ink);
}

.s-page__body h3 {
  margin-top: 1.6em;
  font-family: var(--fkn-font-display);
  font-size: var(--fkn-fs-lead);
  font-weight: 600;
  line-height: normal;
  color: var(--fkn-ink);
}

.s-page__body ul,
.s-page__body ol {
  padding-left: 1.2em;
  list-style: revert;
}

.s-page__body li + li {
  margin-top: 0.4em;
}

.s-page__body a {
  border-bottom: var(--fkn-rule) solid var(--fkn-gold);
}

.s-page__body a:hover,
.s-page__body a:focus-visible {
  color: var(--fkn-gold-deep);
}

.s-page__body table {
  border-collapse: collapse;
  width: 100%;
}

.s-page__body th,
.s-page__body td {
  padding: 8px 12px 8px 0;
  text-align: left;
  vertical-align: top;
  border-bottom: var(--fkn-rule) solid var(--fkn-border);
}

.s-page__back {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  margin-top: 48px;
  font-family: var(--fkn-font-display);
  font-size: var(--fkn-fs-footer-nav);
  font-weight: 600;
  color: var(--fkn-gold-deep);
  border-bottom: var(--fkn-rule-underline) solid var(--fkn-gold);
  padding-bottom: 3px;
}