/* ------------------------------------------------------------------
   produktdemo.css
   Styles for the interactive product-demo report viewer (.pr section).
   Extracted from the original standalone file's <style> block.

   The .kf toolbar rules are back in (see below) since the toolbar
   itself was added back into produktdemo.php for continued tuning on
   the live site - see that file's header comment.

   IMPORTANT ABOUT THE FIRST RULE BELOW: the original file used a bare
   `body{...}` selector, which is fine in a standalone file but would
   apply this background/padding to EVERY page on your WordPress site
   if loaded site-wide. It's been scoped to `body.page-produktdemo`
   instead. Add that class to the page in functions.php:

     add_filter( 'body_class', function ( $classes ) {
         if ( is_page( 'produktdemo' ) ) {
             $classes[] = 'page-produktdemo';
             $classes[] = 'k-leiste';
             $classes[] = 'k-kopf';
             $classes[] = 'k-aus';
         }
         return $classes;
     } );

   The k-leiste / k-kopf / k-aus classes recreate the toolbar's default
   checkbox state (all three were checked by default; k-zoom was not,
   so it's left out). Swap "produktdemo" for your actual page slug.
   ------------------------------------------------------------------ */

body.page-produktdemo{background:var(--paper);margin:0;padding:96px 0 60px}
/* .pr{padding:0} */

/* ---- Bedienleiste (Kalibrierwerkzeug) ---------------------------------- */
.kf{position:fixed;top:0;left:0;right:0;z-index:99;background:#fff;
  border-bottom:1px solid var(--border);padding:12px 24px;display:flex;
  align-items:center;gap:22px;flex-wrap:wrap;
  box-shadow:0 8px 24px -18px rgba(10,30,60,.5)}
.kf b{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted)}
.kf label{display:flex;align-items:center;gap:8px;font-size:14.5px;cursor:pointer}
.kf .mess{margin-left:auto;font-size:14px;color:var(--muted);display:flex;gap:18px}
.kf .mess span{font-variant-numeric:tabular-nums}
.kf .passt{font-weight:600}
.kf .passt.ja{color:var(--checked)}
.kf .passt.nein{color:var(--critical)}

/* ---- 1: Originalunterlagen als Leiste --------------------------------- */
.k-leiste .app-main .gb-src{padding:9px 12px;margin-bottom:14px;display:flex;
  align-items:center;gap:14px;flex-wrap:wrap}
.k-leiste .app-main .gb-src .hd{margin:0;flex:none}
.k-leiste .app-main .gb-src .hd .t{font-size:12.5px}
.k-leiste .app-main .gb-doc{padding:5px 9px;gap:8px;font-size:12px}
.k-leiste .app-main .gb-doc .th{width:20px;height:26px}
.k-leiste .app-main .gb-doc .sub{display:none}

/* ---- 2: Kapitelkopf zusammenlegen ------------------------------------- */
.k-kopf .app-main .dok-hd{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;
  margin-bottom:12px}
.k-kopf .app-main .dok-hd .lead,.k-kopf .app-main .dok-hd p{font-size:13px;margin:0}
.k-kopf .app-main .dok-hd h2,.k-kopf .app-main .dok-hd h3{margin:0}

/* ---- 3: Auslassung ----------------------------------------------------- */
/* var(--aus,560px) and var(--rzoom,1) below fall back to the toolbar's
   default slider positions, so nothing needs to set these variables
   anymore - the fallback values ARE the shipped values. */
.k-aus .app-main .dok{position:relative;max-height:var(--aus,560px);overflow:hidden}
.k-aus .app-main .dok::after{content:"";position:absolute;left:0;right:0;bottom:0;
  height:110px;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 78%);
  pointer-events:none;z-index:2}
.k-aus .app-main .dok .auslass{position:absolute;left:0;right:0;bottom:0;z-index:3;
  display:flex;align-items:center;gap:14px;padding:0 2px 4px}
.k-aus .app-main .dok .auslass i{flex:1;height:0;border-top:1px dashed rgba(19,33,58,.28)}
.k-aus .app-main .dok .auslass span{font-family:var(--cond);font-size:11.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(19,33,58,.55);white-space:nowrap}
.auslass{display:none}

/* Die Kapitelmechanik setzt .app-main eine feste Mindesthoehe, damit beim
   Wechsel nichts springt. Bei Auslassung muss die neu berechnet werden -
   siehe produktdemo.js fuer die Korrektur, die das uebernimmt. */
.k-aus .app-main{min-height:0 !important}

/* ---- 4: Massstab, zwei getrennte Regler --------------------------------- */
/* Nur die Berichtsspalte. Der Betrachter daneben ist ein Geschwisterelement
   und bleibt in Originalgroesse, sonst schrumpft das PDF mit. */
.app-main .gb-body{zoom:var(--rzoom,1)}
/* Das ganze Fenster inklusive Seitenleiste. k-zoom war beim Laden nicht
   aktiv, dieser Selektor greift also standardmaessig gar nicht - hier
   nur belassen, falls ihr den Fenster-Zoom doch fest aktivieren wollt. */
.k-zoom .app-fenster{zoom:var(--zoom,.9)}