/* LAskill LMS front end. Colours, fonts and dark mode come from the LAskill Theme (the --lst- variables). The values after the commas are only used if the theme is not active. */
.lalms-wrap{--g:var(--lst-primary,#d99515);--g2:var(--lst-primary-dark,#b97d0f);--gl:var(--lst-primary,#f0b23c);--on:var(--lst-on-primary,#232323);--dark:var(--lst-text,#232323);--black:var(--lst-heading,#000);--white:var(--lst-surface,#fff);--soft:var(--lst-surface-2,#faf6ec);--line:var(--lst-border,#e8e2d3);--ok:var(--lst-ok,#1f9d55);--bad:var(--lst-bad,#d64545);--okbg:var(--lst-ok-bg,#e8f7ee);--badbg:var(--lst-bad-bg,#fdeaea);--psoft:var(--lst-primary-soft,#fdf1d6);--muted:var(--lst-muted,var(--muted));--ink:var(--lst-ink,#232323);--inktext:var(--lst-ink-text,#fff);--hero:var(--lst-hero-bg,#232323);--herotext:var(--lst-hero-text,#fff);font-family:var(--lst-font,'DM Sans',system-ui,sans-serif);color:var(--dark);max-width:1000px;margin:0 auto;line-height:1.65}
.lalms-wrap *{box-sizing:border-box}
.lalms-wrap h2,.lalms-wrap h3,.lalms-wrap h4{font-family:var(--lst-font,'DM Sans',sans-serif);color:var(--black);line-height:1.25}
.lalms-wrap a{color:inherit}
.lalms-muted{color:var(--muted);font-size:.92em;margin:.4em 0}
.lalms-crumb{margin:0 0 14px;font-size:.92em}
.lalms-crumb a{text-decoration:none;color:var(--muted);transition:color .2s,letter-spacing .2s}
.lalms-crumb a:hover{color:var(--g);letter-spacing:.02em}

/* Boxes */
.lalms-box{background:var(--soft);border:1px solid var(--line);border-radius:16px;padding:24px;margin:20px 0}
.lalms-box h3{margin-top:0}
.lalms-hero{background:var(--hero);color:var(--herotext);border:0;position:relative;overflow:hidden}
.lalms-hero:before{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(217,149,21,.45),transparent 70%)}
.lalms-hero>*{position:relative}
.lalms-hero h1,.lalms-hero h2,.lalms-hero h3,.lalms-hero h4{color:var(--herotext)}
.lalms-hero .lalms-muted,.lalms-hero .lalms-meta{color:var(--herotext);opacity:.8}
.lalms-hero a:not(.lalms-btn){color:var(--gl)}
.lalms-hero .lalms-bar{background:rgba(255,255,255,.18)}
.lalms-meta{font-size:.9em;letter-spacing:.04em;text-transform:uppercase;margin:0 0 12px}
.lalms-price{font-family:var(--lst-font,sans-serif);font-size:1.8em;font-weight:700;margin:0 0 12px;color:var(--gl)}
.lalms-price del{opacity:.5;font-size:.7em}
.lalms-price ins{text-decoration:none}

/* Buttons */
.lalms-btn{position:relative;overflow:hidden;display:inline-block;background:linear-gradient(135deg,var(--g) 0%,var(--g2) 100%);color:var(--on)!important;border:0;border-radius:12px;padding:13px 24px;font:700 1em var(--lst-font,'DM Sans',sans-serif);text-decoration:none!important;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 14px rgba(217,149,21,.28)}
.lalms-btn:before{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);transition:left .5s}
.lalms-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(217,149,21,.45)}
.lalms-btn:hover:before{left:130%}
.lalms-btn:active{transform:translateY(0)}
.lalms-btn-ghost{background:transparent;color:var(--dark)!important;border:2px solid var(--dark);box-shadow:none}
.lalms-btn-ghost:hover{background:var(--ink);color:var(--inktext)!important;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.lalms-btn-light{background:var(--white);color:var(--black)!important;box-shadow:none}
.lalms-btn-light:hover{box-shadow:0 10px 24px rgba(255,255,255,.25)}
.lalms-complete.is-done{background:var(--ink);color:var(--inktext);box-shadow:none}
.lalms-btn[disabled]{opacity:.6;cursor:wait}

/* Video and lesson */
.lalms-video{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden;margin:0 0 22px;box-shadow:0 14px 40px rgba(0,0,0,.2)}
.lalms-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lalms-notice{background:var(--psoft);border:1px solid var(--g);border-radius:12px;padding:12px 16px;margin:0 0 18px}
.lalms-lesson-body{margin-bottom:22px}
.lalms-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.lalms-progress-wrap{flex:1;min-width:200px}
.lalms-finished{flex-basis:100%;margin:0;font-weight:700;color:var(--g2)}
.lalms-finished a{margin-left:8px;text-decoration:underline}
.lalms-bar{height:10px;background:var(--line);border-radius:99px;overflow:hidden;margin:6px 0}
.lalms-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--g2),var(--g),var(--gl));border-radius:99px;transition:width .5s}
.lalms-nav{display:flex;justify-content:space-between;gap:12px;margin:22px 0}

/* Curriculum */
.lalms-curriculum{margin-top:32px}
.lalms-module{margin:24px 0 8px;font-size:1.05em;padding-left:12px;border-left:4px solid var(--g)}
.lalms-lessons{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--white)}
.lalms-lessons li{border-bottom:1px solid var(--line)}
.lalms-lessons li:last-child{border-bottom:0}
.lalms-lessons a{display:block;padding:13px 16px;text-decoration:none;transition:background .2s,padding-left .2s}
.lalms-lessons a:hover{background:linear-gradient(90deg,var(--psoft),var(--white));padding-left:22px}
.lalms-lessons li.is-current a{background:linear-gradient(90deg,var(--psoft),var(--white));font-weight:700}
.lalms-lessons li.is-done .lalms-mark{color:var(--ok)}
.lalms-lessons li.is-locked a{color:var(--muted)}
.lalms-mark{display:inline-block;width:1.5em;color:var(--muted)}
.lalms-tag{font-style:normal;font-size:.72em;font-weight:700;background:var(--g);color:var(--white);border-radius:99px;padding:2px 9px;margin-left:6px;white-space:nowrap}
.lalms-tag-dark{background:var(--ink);color:var(--inktext)}

/* Dashboard and cards */
.lalms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:22px;margin:18px 0}
.lalms-card{background:var(--white);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s,border-color .25s}
.lalms-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.14);border-color:var(--g)}
.lalms-thumb{display:block;overflow:hidden}
.lalms-thumb img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform .5s}
.lalms-card:hover .lalms-thumb img{transform:scale(1.06)}
.lalms-card-body{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.lalms-card-body h3{margin:0 0 2px;font-size:1.1em}
.lalms-card-body h3 a{text-decoration:none}
.lalms-card-body .lalms-btn{margin-top:auto;text-align:center}
.lalms-hello{margin-bottom:4px;background:linear-gradient(90deg,var(--black),var(--g2));-webkit-background-clip:text;background-clip:text;color:transparent!important;display:inline-block}

/* Quiz */
.lalms-quiz-info{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}
.lalms-quiz-info span{background:var(--ink);color:var(--inktext);font-size:.85em;font-weight:700;border-radius:99px;padding:6px 14px}
.lalms-q{border:1px solid var(--line);background:var(--white);border-radius:16px;padding:20px 20px 12px;margin:0 0 18px;min-width:0;transition:border-color .2s,box-shadow .2s}
.lalms-q:hover{border-color:var(--g);box-shadow:0 8px 24px rgba(217,149,21,.12)}
.lalms-q legend{font-family:var(--lst-font,sans-serif);font-weight:700;font-size:1.05em;color:var(--black);padding:0 8px;display:flex;gap:10px;align-items:flex-start}
.lalms-qnum{flex:none;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--g),var(--g2));color:var(--white);display:inline-flex;align-items:center;justify-content:center;font-size:.85em}
.lalms-hint{margin:2px 0 10px;color:var(--muted);font-size:.85em}
.lalms-opt{display:flex;align-items:center;gap:12px;border:2px solid var(--line);border-radius:12px;padding:12px 14px;margin:0 0 10px;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}
.lalms-opt:hover{border-color:var(--g);background:var(--psoft);transform:translateX(4px)}
.lalms-opt input{accent-color:var(--g);width:18px;height:18px;flex:none;margin:0}
.lalms-opt:has(input:checked){border-color:var(--g);background:var(--psoft)}
.lalms-opt.is-correct{border-color:var(--ok);background:var(--okbg)}
.lalms-opt.is-wrong{border-color:var(--bad);background:var(--badbg)}
.lalms-opt.is-correct:after{content:"\2713";margin-left:auto;color:var(--ok);font-weight:700}
.lalms-opt.is-wrong:after{content:"\2717";margin-left:auto;color:var(--bad);font-weight:700}
.lalms-explain{margin:4px 0 12px;padding:12px 16px;border-radius:12px;background:var(--ink);color:var(--inktext);font-size:.95em;white-space:pre-line;border-left:4px solid var(--g)}
.lalms-explain strong{color:var(--gl);display:block;margin-bottom:2px}
.lalms-quiz-actions{margin:8px 0}
.lalms-result{border-radius:14px;padding:14px 18px;margin:0 0 18px;font-weight:700}
.lalms-result.is-pass{background:var(--okbg);border:1px solid var(--ok);color:var(--ok)}
.lalms-result.is-fail{background:var(--badbg);border:1px solid var(--bad);color:var(--bad)}
.lalms-quiz-result{margin:20px 0}
.lalms-quiz-result .lalms-score{font-family:var(--lst-font,sans-serif);font-size:2.4em;font-weight:800;margin:0;line-height:1.1}
.lalms-quiz-result .lalms-btn{margin:6px 8px 0 0}

@media(max-width:600px){.lalms-btn{width:100%;text-align:center}.lalms-nav{flex-direction:column}.lalms-box{padding:18px}}
@media(prefers-reduced-motion:reduce){.lalms-wrap *{transition:none!important}}

/* Assignments */
.lalms-assign{margin:0 0 24px}
.lalms-submission{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:18px 20px;margin:0 0 18px}
.lalms-badge{display:inline-block;font-weight:700;font-size:.92em;border-radius:99px;padding:6px 14px;margin:0 0 8px}
.lalms-badge.is-wait{background:var(--ink);color:var(--inktext)}
.lalms-badge.is-pass{background:var(--okbg);color:var(--ok);border:1px solid var(--ok)}
.lalms-badge.is-fail{background:var(--badbg);color:var(--bad);border:1px solid var(--bad)}
.lalms-submission details{margin:8px 0}
.lalms-submission summary{cursor:pointer;font-weight:700;color:var(--g2)}
.lalms-filelink{font-weight:700;color:var(--g2)!important}
.lalms-assign-form{background:var(--soft);border:1px solid var(--line);border-radius:16px;padding:20px}
.lalms-label{display:block;font-weight:700;margin:12px 0 6px}
.lalms-assign-form textarea,.lalms-qa textarea{width:100%;border:2px solid var(--line);border-radius:12px;padding:12px 14px;font:inherit;background:var(--white);transition:border-color .2s,box-shadow .2s}
.lalms-assign-form textarea:focus,.lalms-qa textarea:focus{outline:0;border-color:var(--g);box-shadow:0 0 0 4px rgba(217,149,21,.18)}
.lalms-assign-form .lalms-btn{margin-top:14px}

/* Questions and answers */
.lalms-qa{margin-top:34px;padding-top:8px}
.lalms-qa-form{margin:14px 0}
.lalms-qa-form .lalms-btn{margin-top:10px}
.lalms-qa-item{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--g);border-radius:14px;padding:14px 18px;margin:0 0 14px;transition:box-shadow .2s}
.lalms-qa-item:hover{box-shadow:0 8px 22px rgba(0,0,0,.08)}
.lalms-qa-meta{margin:0 0 4px}
.lalms-qa-text{margin:0 0 8px;white-space:normal}
.lalms-qa-reply{background:var(--soft);border-radius:12px;padding:10px 14px;margin:10px 0 0 18px}
.lalms-qa-reply-toggle{background:none;border:0;color:var(--g2);font-weight:700;cursor:pointer;padding:6px 0}
.lalms-qa-reply-toggle:hover{text-decoration:underline}

/* Clean video player (YouTube without YouTube branding) */
.lalms-yt{cursor:pointer;user-select:none;-webkit-user-select:none;outline:0}
.lalms-yt:focus-visible{box-shadow:0 0 0 4px rgba(217,149,21,.5)}
.lalms-yt iframe,.lalms-yt .lalms-yt-mount{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:1;pointer-events:none}
.lalms-yt-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;transition:opacity .35s}
.lalms-yt:not(.is-covered) .lalms-yt-poster{opacity:0;pointer-events:none}
.lalms-yt:after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(0,0,0,.2) 0%,rgba(35,35,35,.7) 100%);opacity:0;transition:opacity .35s;pointer-events:none}
.lalms-yt.is-covered:after{opacity:1}
.lalms-yt-shield{position:absolute;inset:0;z-index:3}
.lalms-yt-bigplay{position:absolute;z-index:4;left:50%;top:50%;width:88px;height:88px;margin:-44px 0 0 -44px;border-radius:50%;border:0;padding:0;background:linear-gradient(135deg,var(--g),var(--g2));color:#fff;cursor:pointer;display:none;align-items:center;justify-content:center;box-shadow:0 12px 34px rgba(217,149,21,.55);transition:transform .2s,box-shadow .2s}
.lalms-yt-bigplay svg{margin-left:4px}
.lalms-yt-bigplay:hover{transform:scale(1.1);box-shadow:0 16px 44px rgba(217,149,21,.75)}
.lalms-yt.is-covered .lalms-yt-bigplay{display:flex}
.lalms-yt.is-loading .lalms-yt-bigplay{display:none}
.lalms-yt.is-loading:before{content:"";position:absolute;z-index:4;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border:4px solid rgba(255,255,255,.3);border-top-color:var(--g);border-radius:50%;animation:lalms-spin .8s linear infinite}
@keyframes lalms-spin{to{transform:rotate(360deg)}}
.lalms-yt-bar{position:absolute;z-index:5;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;padding:28px 14px 10px;background:linear-gradient(0deg,rgba(0,0,0,.88),transparent);opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s;pointer-events:none;cursor:default}
.lalms-yt.show-bar .lalms-yt-bar,.lalms-yt.has-started.is-covered .lalms-yt-bar{opacity:1;transform:none;pointer-events:auto}
.lalms-yt-btn{background:rgba(255,255,255,.12);border:0;color:#fff;font:700 .8em var(--lst-font,'DM Sans',sans-serif);border-radius:8px;padding:7px 12px;cursor:pointer;white-space:nowrap;transition:background .2s,transform .2s}
.lalms-yt-btn:hover{background:var(--g);transform:translateY(-1px)}
.lalms-yt-time{color:#fff;font-size:.8em;white-space:nowrap;min-width:78px}
.lalms-yt-seek{flex:1;min-width:60px;accent-color:var(--g);height:6px;cursor:pointer}
.lalms-yt:fullscreen{aspect-ratio:auto;border-radius:0;width:100%;height:100%}
.lalms-yt:-webkit-full-screen{aspect-ratio:auto;border-radius:0;width:100%;height:100%}
.lalms-yt.is-pseudo-fs{position:fixed;inset:0;z-index:999999;aspect-ratio:auto;border-radius:0;width:100%;height:100%;margin:0}
@media(max-width:600px){.lalms-yt-bigplay{width:68px;height:68px;margin:-34px 0 0 -34px}.lalms-yt-time{display:none}.lalms-yt-btn{padding:7px 9px}.lalms-yt-bar{gap:6px;padding:22px 8px 8px}}