/* Lehre CA&D · lehre.css: what the server rendered site needs on top of the mockup CSS (app.css, team.css).
   Links instead of mockup buttons, theme pairs without JS, form errors, radio segment, prose pages. Tokens only. */

[hidden]{display:none !important}
/* terms that must not break at their hyphen (H-BRS), see ui.keep_terms_together() */
.lh-nw{white-space:nowrap}

/* theme pairs: the logo or toggle that fits the active theme (cookie via html[data-theme], else the OS) */
:root[data-theme="light"] .th-d,:root[data-theme="dark"] .th-l{display:none !important}
@media not all and (prefers-color-scheme: dark){ :root:not([data-theme]) .th-d{display:none !important} }
@media (prefers-color-scheme: dark){
  :root:not([data-theme]) .th-l{display:none !important}
  :root:not([data-theme]) .strip .s2-a[aria-current="true"]{background:rgba(255,255,255,.14)}
}
:root[data-theme="dark"] .strip .s2-a[aria-current="true"]{background:rgba(255,255,255,.14)}

/* links that the mockup drew as buttons */
.page :is(a.tb,a.mn-link,a.s2-a,a.hd-brand,a.hd-theme,a.tm-way,a.ui-btn,a.fr-back,a.dx-back,a.tm-crumb){text-decoration:none}
.header .hd-lseg a{text-decoration:none}
/* an <a> does not take its width from aspect-ratio when stretched: give the theme toggle its square size */
.header a.hd-theme{min-width:32px}
@media (max-width: 700px){ .header a.hd-theme{min-width:44px} }
.modul a.tb[aria-selected="true"]{cursor:default}
.page a.tm-tlink{display:inline}
.strip span.s2-a{cursor:default}

/* off-screen source of the execCommand('copy') fallback (lehre.js) */
.lh-copysrc{position:fixed;top:0;left:-9999px;width:1px;height:1px;opacity:0}

/* skip link */
.lh-skip{position:absolute;left:8px;top:-60px;z-index:100;padding:8px 12px;border-radius:var(--r-md);background:var(--pp-green-solid);color:var(--pp-on-green);font-family:var(--sans);font-weight:700;text-decoration:none}
.lh-skip:focus{top:8px}

/* Case-Study-Teams row before opening and after the deadline: calm, no button.
   State classes are lh-st-*: the mockup's .is-open (E1 variant) would shrink the button. */
.fristen .lh-ct.lh-st-closed .fl-title,.fristen .lh-ct.lh-st-not_open .fl-title{color:var(--pp-ink-2)}
.fristen .lh-ct .fl-about .tm-tlink{font-weight:700}

/* exam dates table: institutions as calm bold text row heads (logos only in "Angeboten für" and the footer) */
.fristen .w1-inst{font-size:14px;font-weight:700;line-height:1.4;color:var(--pp-ink);white-space:nowrap}


/* form: errors and the team language as radio segment */
.lh-fs{border:0;padding:0;margin:0;min-width:0}
.lh-fs > legend{padding:0;margin:0 0 6px;float:left;width:100%}
.lh-fs > legend + *{clear:both}
.lh-seg{flex-wrap:wrap;align-self:flex-start}
.lh-seg label{position:relative;display:inline-flex;align-items:center;gap:6px;border-radius:var(--r-sm);min-height:36px;padding:0 16px;font-size:13.5px;color:var(--pp-ink-2);cursor:pointer}
.lh-seg input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.lh-seg label:has(input:checked){background:var(--pp-surface);color:var(--pp-ink);font-weight:700;box-shadow:var(--sh-3)}
.lh-seg label:has(input:focus-visible){outline:2px solid var(--pp-green);outline-offset:2px}
@media (max-width: 700px){ .detail .lh-seg{display:flex;align-self:stretch} .lh-seg label{flex:1 1 0;justify-content:center;min-height:44px} }
.lh-err{display:flex;gap:6px;align-items:flex-start;margin:2px 0 0;font-size:12.5px;line-height:1.45;color:var(--pp-red-ink)}
.lh-err .ui-i{margin-top:2px;flex:none}
.lh-err--block{margin-top:10px}
.ui-inp[aria-invalid="true"]{border-color:var(--pp-red-ink)}
/* WebKit draws no box-shadow on a native select: the same 3 px ring as an outline (E2E round 3, C3) */
select.ui-inp:focus{box-shadow:none;outline:3px solid var(--pp-green-ring);outline-offset:0}
.tm-check:has(input[aria-invalid="true"]){color:var(--pp-red-ink)}
.lh-alert{display:flex;gap:9px;align-items:flex-start;max-width:720px;margin:0 0 14px;padding:11px 13px;border-radius:var(--r-sm);background:var(--pp-red-tint);color:var(--pp-ink);font-size:13.5px;line-height:1.5}
.lh-alert .ui-i{margin-top:3px;color:var(--pp-red-ink);flex:none}
.tm-again form{display:inline}
.tm-again .tm-ok{margin:0}
.lh-msg{max-width:620px;padding:14px 16px;border-radius:var(--r-md);background:var(--pp-surface-2)}

/* modal (layout and scroll lock in team.css) */
.tm-modal .dx-title:focus{outline:none}
.tm-panel.is-loading{opacity:.55;pointer-events:none;transition:opacity .12s ease}
/* 701..840 px (iPad portrait, a laptop at 200 % zoom): course line, close, title and the three ways
   first, the facts below them as on phones; short windows give the sheet more room (C2) */
@media (min-width: 701px) and (max-width: 840px){
  .detail .tm-modal .d5-main{order:1;padding:24px 28px 8px}
  .detail .tm-modal .d5-mar{order:2;padding:0 28px 30px}
  .detail .tm-modal .d5-mar .tm-mno{display:none}
  .detail .tm-modal .d5-mar .dx-sec{margin-top:0;padding-top:18px;border-top:var(--bw) solid var(--pp-line)}
}
@media (min-width: 701px) and (max-height: 560px){
  .tm-scrim{padding-top:max(12px,env(safe-area-inset-top,0px));padding-bottom:max(12px,env(safe-area-inset-bottom,0px))}
  .detail .tm-modal .d5-main{padding-top:20px}
  .detail .tm-mtitle{margin:6px 0 12px;font-size:26px}
}
@media (min-width: 841px) and (max-height: 560px){ .detail .tm-modal .d5-mar{padding-top:24px} }

/* magic link page (GET shows, the button acts) */
.lh-linkform{margin-top:22px}
.ui-btn.lh-linkbtn{min-height:44px;padding-inline:20px;font-size:14px}
.lh-linknote{display:flex;gap:7px;align-items:flex-start;margin-top:14px;max-width:62ch}
.lh-linknote .ui-i{margin-top:3px;flex:none}
.lh-linkmsg{margin-top:18px}
/* details of a pending request (code step, magic link page), security review P2 */
.lh-details{margin-top:14px;max-width:560px}
.tm-sub.lh-details-h{margin-top:14px}
.tm-sub.lh-details-h + .lh-details{margin-top:6px}

/* calm sheet pages: placeholders, privacy, empty state */
.lh-sheet{max-width:860px;padding:40px 48px 44px}
.lh-sheet .tm-lead{max-width:64ch}
.detail .lh-contact{margin-top:26px}
.lh-mail{font-weight:700}
.lh-write{margin-top:22px}
.lh-prose h2{margin:28px 0 8px;font-size:16px;font-weight:700;color:var(--pp-ink)}
.lh-prose p,.lh-prose li{max-width:72ch;font-size:14.5px;line-height:1.62;color:var(--pp-ink-2)}
.lh-prose p + p{margin-top:8px}
.lh-prose ul{margin:0;padding-left:20px}
.lh-prose li + li{margin-top:4px}
.lh-prose ul + p{margin-top:10px}
.lh-draft{display:inline-flex;gap:8px;align-items:flex-start;margin:0 0 18px;padding:8px 12px;border-radius:var(--r-sm);background:var(--pp-ochre-tint);color:var(--pp-ochre-ink);font-size:13px;font-weight:700;line-height:1.45}
.lh-draft .ui-i{margin-top:2px;flex:none}
@media (max-width: 700px){
  .lh-sheet{padding:24px 18px 28px;margin-inline:calc(-1 * var(--gut) + 0px);border-left:0;border-right:0;border-radius:0}
}