/* Fremio V24 public: faithful, data-free illustrations based on actual Træninger UI. */
.fremio-public .f24-public-preview,.fremio-public .f24-how-example{margin:0;min-width:0}
.fremio-public .f24-app-frame{display:grid;grid-template-columns:116px minmax(0,1fr);background:#fff;border:1px solid #dde7e9;overflow:hidden;border-radius:16px;box-shadow:0 24px 70px rgba(17,48,61,.16);min-height:390px;transform:rotate(-1deg);font-family:Inter,'DM Sans',sans-serif;color:#233648}
.fremio-public .f24-app-sidebar{padding:16px 9px;background:#fff;border-right:1px solid #eaf0f0;display:flex;flex-direction:column;gap:4px}
.fremio-public .f24-brand{font-size:19px;letter-spacing:-.06em;color:#23364b;font-weight:900;margin:4px 0 24px 3px;white-space:nowrap}
.fremio-public .f24-brand>span:last-child{color:#0d9987}
.fremio-public .f24-brand-mark{display:inline-grid;place-items:center;background:#0e978a;color:#fff;width:22px;height:22px;border-radius:8px;font-size:10px;vertical-align:middle;letter-spacing:normal}
.fremio-public .f24-menu-caption{font-size:8px;font-weight:900;letter-spacing:.11em;color:#91a5b1;padding:0 7px 8px}
.fremio-public .f24-menu-item{padding:10px 7px;font-size:10px;font-weight:700;color:#617787;border-radius:8px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.fremio-public .f24-menu-item i{width:13px;text-align:center;font-size:11px}
.fremio-public .f24-menu-item.is-active{background:#e9f7f2;color:#087e72}
.fremio-public .f24-app-content{min-width:0;background:#f7fafb}
.fremio-public .f24-app-topbar{height:50px;border-bottom:1px solid #e6edef;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:0 14px;background:#fff;font-size:10px;color:#6a7c88;white-space:nowrap}
.fremio-public .f24-app-topbar i.fa-chevron-right{font-size:8px;margin:0 6px;color:#acb9c4}
.fremio-public .f24-app-topbar b{color:#273b50}
.fremio-public .f24-topbar-club{font-weight:700;color:#445969}
.fremio-public .f24-app-workspace{padding:18px 17px 20px}
.fremio-public .f24-app-eyebrow{display:block;font-size:8px;font-weight:900;letter-spacing:.12em;color:#078b7d}
.fremio-public .f24-app-workspace h3{font-size:21px!important;line-height:1.2!important;letter-spacing:-.04em!important;color:#243a4c!important;margin:7px 0 3px!important;font-weight:900}
.fremio-public .f24-app-workspace>p{font-size:10px;color:#697f8d;margin:0 0 15px;line-height:1.55}
.fremio-public .f24-app-session{border-radius:12px;border:1px solid #e1e9ed;background:#fff;padding:13px 13px 7px;box-shadow:0 8px 20px rgba(24,65,83,.04)}
.fremio-public .f24-app-session-header{display:flex;justify-content:space-between;gap:6px;align-items:flex-start;border-bottom:1px solid #ecf1f2;padding-bottom:10px}
.fremio-public .f24-app-session-header>div{display:grid;gap:3px;min-width:0}
.fremio-public .f24-app-session-header small{font-size:8px;letter-spacing:.09em;color:#129487;font-weight:900}
.fremio-public .f24-app-session-header strong{font-size:13px;color:#213a49}
.fremio-public .f24-app-session-header div>span{font-size:9px;color:#708493}
.fremio-public .f24-app-session-pill{font-size:8px;color:#0c806a;background:#e4f6ee;border-radius:22px;padding:6px 8px;white-space:nowrap;font-weight:800}
.fremio-public .f24-app-session-pill i{font-size:6px;vertical-align:middle}
.fremio-public .f24-app-search{font-size:9px;color:#94a6b0;border:1px solid #e4ecee;border-radius:7px;padding:8px 10px;margin:10px 0 2px}
.fremio-public .f24-app-search i{margin-right:6px}
.fremio-public .f24-app-person{display:flex;gap:8px;align-items:center;border-bottom:1px solid #edf2f2;padding:7px 0}
.fremio-public .f24-app-avatar{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:26px;height:26px;background:#e7f3f0;color:#308379;border-radius:50%;font-size:9px;font-weight:900}
.fremio-public .f24-app-name{flex:1;min-width:0;font-weight:800;font-size:10px;line-height:1.2}
.fremio-public .f24-app-name small{display:block;margin-top:3px;font-size:8px;font-weight:600;color:#899ca8}
.fremio-public .f24-app-tick{display:inline-flex;justify-content:center;align-items:center;flex:0 0 auto;width:24px;height:24px;border-radius:6px;background:#fff;border:1.5px solid #ccdade;color:transparent;font-size:11px}
.fremio-public .f24-app-tick.is-checked{background:#119784;border-color:#119784;color:white}
.fremio-public .f24-app-session-footer{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 0 4px;color:#607987;font-size:9px;font-weight:750}
.fremio-public .f24-app-session-footer strong{color:#078b7d;font-size:16px}
.fremio-public .f24-app-session-footer span:last-child{color:#0b8f7d}
.fremio-public .f24-public-preview figcaption,.fremio-public .f24-how-example figcaption{text-align:center;font-size:10px;color:#6d8490;margin-top:13px;line-height:1.5}
/* Process illustration: same colors, controls and six-hour policy as the logged-in training centre. */
.fremio-public .f24-how-example{border:14px solid #e7f2ef;border-radius:27px;background:#fff;padding:20px;box-shadow:0 18px 50px rgba(27,70,64,.08);font-family:Inter,'DM Sans',sans-serif;color:#233648}
.fremio-public .f24-how-top h3{font-size:19px!important;color:#213d4b!important;font-weight:900;margin:5px 0 3px!important}
.fremio-public .f24-how-top p{font-size:11px;color:#778d9a;margin:0 0 14px}
.fremio-public .f24-how-session{background:#f5faf8;border:1px solid #e0eee8;border-radius:12px;padding:12px;display:flex;gap:10px;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.fremio-public .f24-how-session-info{display:grid;gap:4px}
.fremio-public .f24-how-session-info>span{font-size:10px;color:#637e8b}
.fremio-public .f24-how-session-info strong{font-size:14px}
.fremio-public .f24-how-session-info small{font-size:10px;color:#0f8c7c}
.fremio-public .f24-how-open{border-radius:30px;background:#ddf2e9;color:#187b64;font-size:10px;font-weight:900;padding:7px 10px;white-space:nowrap}
.fremio-public .f24-how-people{border:1px solid #e9f0f1;border-radius:12px;padding:2px 12px;background:#fff}
.fremio-public .f24-how-person{display:flex;align-items:center;gap:10px;padding:11px 2px;font-size:12px;font-weight:750;border-bottom:1px solid #edf1f2}
.fremio-public .f24-how-person:last-child{border:0}
.fremio-public .f24-how-person>span:nth-child(2){flex:1}
.fremio-public .f24-how-bottom{border-radius:12px;background:#e8f6f0;padding:12px 14px;margin-top:13px;display:flex;flex-direction:column;gap:4px}
.fremio-public .f24-how-bottom>span{font-weight:900;font-size:11px;color:#088b7c}
.fremio-public .f24-how-bottom small{font-size:10px;color:#557f75;line-height:1.5}
@media(max-width:1160px){.fremio-public .f24-app-frame{grid-template-columns:98px minmax(0,1fr)}.fremio-public .f24-app-sidebar{padding:12px 6px}.fremio-public .f24-brand{font-size:16px}.fremio-public .f24-app-workspace{padding:14px 11px}.fremio-public .f24-app-topbar{padding:0 11px}.fremio-public .f24-app-session{padding:10px 10px 5px}}
@media(max-width:900px){.fremio-public .f24-app-frame{grid-template-columns:116px minmax(0,1fr)}.fremio-public .f24-app-workspace{padding:18px 17px}}
@media(max-width:570px){.fremio-public .f24-app-frame{grid-template-columns:77px minmax(0,1fr);transform:none}.fremio-public .f24-app-sidebar{padding:12px 3px}.fremio-public .f24-brand{font-size:13px;margin-bottom:24px}.fremio-public .f24-brand-mark{width:15px;height:15px;border-radius:5px;font-size:7px}.fremio-public .f24-menu-caption{font-size:6px;padding:0 4px 7px}.fremio-public .f24-menu-item{font-size:8px;padding:9px 4px;gap:4px}.fremio-public .f24-menu-item i{width:10px;font-size:9px}.fremio-public .f24-app-topbar{height:37px;font-size:8px}.fremio-public .f24-topbar-club{display:none}.fremio-public .f24-app-workspace{padding:13px 9px}.fremio-public .f24-app-workspace h3{font-size:17px!important}.fremio-public .f24-app-workspace>p{font-size:9px}.fremio-public .f24-app-session-pill{font-size:7px;padding:5px}.fremio-public .f24-app-session-header strong{font-size:11px}.fremio-public .f24-app-person{padding:6px 0}.fremio-public .f24-app-session-footer{font-size:8px;gap:4px}.fremio-public .f24-app-session-footer strong{font-size:13px}.fremio-public .f24-how-example{padding:13px;border-width:9px}}
@media(max-width:340px){.fremio-public .f24-app-sidebar{display:none}.fremio-public .f24-app-frame{display:block}.fremio-public .f24-how-session{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.fremio-public .f24-app-frame{transform:none}}
/* Tiny mock-up controls stay legible even if the icon font cannot be loaded. */
.fremio-public .f24-app-frame .f24-brand-mark i,
.fremio-public .f24-app-frame .f24-app-tick i,
.fremio-public .f24-how-example .f24-app-tick i{display:none}
.fremio-public .f24-brand-mark:after,
.fremio-public .f24-app-tick.is-checked:after{content:'✓';font-family:Arial,sans-serif;font-weight:900;line-height:1}
.fremio-public .f24-menu-item{white-space:normal;line-height:1.25;overflow-wrap:normal}
