/* SEI Knowledge Academy — minimalist, Notion/Classroom/Wikipedia inspired.
   Theme-agnostic: uses its own scoped classes, neutral palette, system fonts. */

.sei-ka {
	--ska-accent: #1a73e8;
	--ska-bg: #ffffff;
	--ska-soft: #f5f7fa;
	--ska-border: #e3e8ef;
	--ska-text: #1f2933;
	--ska-muted: #6b7785;
	--ska-radius: 12px;
	color: var(--ska-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	line-height: 1.55;
	max-width: 1180px;
	margin: 0 auto;
}
.sei-ka * { box-sizing: border-box; }
.sei-ka h2 { font-size: 1.6rem; margin: 0 0 .8em; }
.sei-ka h3 { font-size: 1.2rem; margin: 1.4em 0 .6em; }
.sei-ka a { color: var(--ska-accent); text-decoration: none; }
.sei-ka a:hover { text-decoration: underline; }

/* Hero */
.sei-ka-hero {
	display: flex; justify-content: space-between; align-items: center; gap: 1rem;
	background: linear-gradient(135deg, #1a73e8 0%, #4f46e5 100%);
	color: #fff; padding: 1.6rem 1.8rem; border-radius: var(--ska-radius); flex-wrap: wrap;
}
.sei-ka-hero h2 { color: #fff; margin: 0; }
.sei-ka-role { opacity: .85; margin: .2rem 0 0; text-transform: uppercase; letter-spacing: .05em; font-size: .75rem; }
.sei-ka-hero-stats { display: flex; gap: 1.5rem; }
.sei-ka-hero-stats div { text-align: center; font-size: .75rem; opacity: .9; }
.sei-ka-hero-stats span { display: block; font-size: 1.7rem; font-weight: 700; }

/* Layout grid */
.sei-ka-grid { display: grid; grid-template-columns: 1fr 320px; gap: 1.5rem; margin-top: 1.5rem; }
@media (max-width: 860px) { .sei-ka-grid { grid-template-columns: 1fr; } }

/* Cards */
.sei-ka-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.sei-ka-card { background: var(--ska-bg); border: 1px solid var(--ska-border); border-radius: var(--ska-radius); overflow: hidden; display: block; transition: box-shadow .15s, transform .15s; }
.sei-ka-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.08); transform: translateY(-2px); text-decoration: none; }
.sei-ka-thumb { height: 110px; background-size: cover; background-position: center; background-color: var(--ska-soft); }
.sei-ka-thumb-ph { display: flex; align-items: center; justify-content: center; font-size: 2.4rem; font-weight: 700; color: #fff; background: linear-gradient(135deg,#1a73e8,#4f46e5); }
.sei-ka-card-body { padding: .85rem 1rem 1.1rem; }
.sei-ka-card-body strong { display: block; color: var(--ska-text); margin-bottom: .4rem; }
.sei-ka-card-body p { color: var(--ska-muted); font-size: .85rem; margin: .3rem 0 0; }

/* Progress bar */
.sei-ka-progress { height: 6px; background: var(--ska-soft); border-radius: 99px; overflow: hidden; margin: .5rem 0 .3rem; }
.sei-ka-progress-bar { height: 100%; background: var(--ska-accent); border-radius: 99px; transition: width .4s; }
.sei-ka-card-body small { color: var(--ska-muted); font-size: .75rem; }

/* Lists */
.sei-ka-list { list-style: none; padding: 0; margin: 0; }
.sei-ka-list li { padding: .55rem 0; border-bottom: 1px solid var(--ska-border); display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.sei-ka-list-compact li { display: block; padding: .45rem 0; }
.sei-ka-list-compact small { display: block; color: var(--ska-muted); font-size: .72rem; }
.sei-ka-tag, .sei-ka-type-tag { background: var(--ska-soft); color: var(--ska-muted); font-size: .68rem; padding: .15rem .5rem; border-radius: 99px; text-transform: uppercase; letter-spacing: .03em; }

/* Sidebar cards */
.sei-ka-side .sei-ka-card { padding: 1rem 1.1rem; margin-bottom: 1.2rem; }
.sei-ka-side h4 { margin: 0 0 .7rem; font-size: 1rem; }

/* Ranking */
.sei-ka-rank { list-style: none; counter-reset: rk; padding: 0; margin: 0; }
.sei-ka-rank li { display: flex; align-items: center; gap: .6rem; padding: .5rem 0; border-bottom: 1px solid var(--ska-border); }
.sei-ka-rank img { width: 32px; height: 32px; border-radius: 50%; }
.sei-ka-rank span { flex: 1; font-size: .9rem; }
.sei-ka-rank b { color: var(--ska-accent); }
.sei-ka-rank li.me { background: #eef4ff; border-radius: 8px; padding-left: .5rem; padding-right: .5rem; }
.sei-ka-rank-pos { font-weight: 700; width: 26px; text-align: center; color: var(--ska-muted); }
.sei-ka-rank-full li { padding: .7rem .4rem; }

/* Tabs */
.sei-ka-tabs { display: flex; gap: .4rem; margin-bottom: 1rem; border-bottom: 1px solid var(--ska-border); }
.sei-ka-tab { padding: .55rem 1rem; color: var(--ska-muted); border-bottom: 2px solid transparent; }
.sei-ka-tab.active { color: var(--ska-accent); border-bottom-color: var(--ska-accent); font-weight: 600; }

/* Wiki / KB */
.sei-ka-wiki { font-size: .98rem; }
.sei-ka-kb-columns { columns: 2; column-gap: 2rem; }
@media (max-width: 700px) { .sei-ka-kb-columns { columns: 1; } }
.sei-ka-kb-cat { break-inside: avoid; margin-bottom: 1.4rem; padding-left: .6rem; border-left: 3px solid var(--ska-border); }
.sei-ka-kb-cat h3 { margin-top: 0; }

/* Search */
.sei-ka-search-field { width: 100%; padding: .8rem 1rem; border: 1px solid var(--ska-border); border-radius: 99px; font-size: 1rem; outline: none; }
.sei-ka-search-field:focus { border-color: var(--ska-accent); box-shadow: 0 0 0 3px rgba(26,115,232,.15); }
.sei-ka-search-results { margin-top: .6rem; }
.sei-ka-search-results a { display: block; padding: .7rem .9rem; border: 1px solid var(--ska-border); border-radius: 10px; margin-bottom: .5rem; }
.sei-ka-search-results a:hover { background: var(--ska-soft); text-decoration: none; }
.sei-ka-sr-type { font-size: .68rem; text-transform: uppercase; color: var(--ska-accent); }
.sei-ka-sr-title { font-weight: 600; color: var(--ska-text); }
.sei-ka-sr-excerpt { font-size: .82rem; color: var(--ska-muted); }
.sei-ka-search-inline { margin-bottom: 1.5rem; }

/* Quiz */
.sei-ka-quiz .sei-ka-q { padding: 1rem 0; border-bottom: 1px solid var(--ska-border); }
.sei-ka-q-text { margin: 0 0 .6rem; }
.sei-ka-opt { display: flex; align-items: center; gap: .5rem; padding: .35rem .5rem; border-radius: 8px; cursor: pointer; }
.sei-ka-opt:hover { background: var(--ska-soft); }
.sei-ka-btn { background: var(--ska-accent); color: #fff; border: 0; padding: .6rem 1.3rem; border-radius: 99px; font-size: .9rem; cursor: pointer; margin-top: 1rem; }
.sei-ka-btn:hover { background: #1558b0; }
.sei-ka-quiz-result { margin-top: 1rem; padding: 1rem 1.2rem; border-radius: 10px; font-weight: 600; }
.sei-ka-quiz-result.pass { background: #e6f4ea; color: #137333; }
.sei-ka-quiz-result.fail { background: #fce8e6; color: #c5221f; }
.sei-ka-attempts table { width: 100%; border-collapse: collapse; margin-top: .6rem; font-size: .85rem; }
.sei-ka-attempts th, .sei-ka-attempts td { text-align: left; padding: .5rem; border-bottom: 1px solid var(--ska-border); }
.sei-ka-badge { padding: .15rem .55rem; border-radius: 99px; font-size: .72rem; }
.sei-ka-badge.pass { background: #e6f4ea; color: #137333; }
.sei-ka-badge.fail { background: #fce8e6; color: #c5221f; }

/* Progress button */
.sei-ka-progress-btn { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin: 1rem 0; }
.sei-ka-status-label { font-weight: 600; color: var(--ska-muted); }

/* Misc */
.sei-ka-note { color: var(--ska-muted); font-style: italic; }
.sei-ka-card.sei-ka-note { padding: 1rem 1.2rem; }

/* Single course outline */
.sei-ka-outline { margin-top: 2rem; padding-top: 1.4rem; border-top: 1px solid var(--ska-border); }
.sei-ka-outline-list { list-style: none; counter-reset: ol; padding: 0; margin: 1rem 0 0; }
.sei-ka-outline-row { display: flex; align-items: center; gap: .7rem; padding: .8rem 1rem; border: 1px solid var(--ska-border); border-radius: 10px; margin-bottom: .5rem; transition: background .15s; }
.sei-ka-outline-row:hover { background: var(--ska-soft); }
.sei-ka-outline-row.status-completed { border-color: #b6e0c2; background: #f3fbf5; }
.sei-ka-outline-icon { font-size: 1.2rem; }
.sei-ka-outline-link { flex: 1; font-weight: 600; color: var(--ska-text); }
.sei-ka-check { color: #137333; font-weight: 700; }
.sei-ka-cert { margin-top: 1.2rem; padding: 1rem 1.2rem; background: #fff8e1; border: 1px solid #ffe08a; border-radius: 10px; font-weight: 600; }

/* Single module extras */
.sei-ka-module-extras { margin-top: 2rem; padding-top: 1.4rem; border-top: 1px solid var(--ska-border); }
.sei-ka-embed { position: relative; padding-bottom: 56.25%; height: 0; margin: 1rem 0; border-radius: 10px; overflow: hidden; background: #000; }
.sei-ka-embed iframe, .sei-ka-embed video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.sei-ka-attachments { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0; }
.sei-ka-attach { display: inline-flex; align-items: center; gap: .3rem; padding: .55rem 1rem; background: var(--ska-soft); border: 1px solid var(--ska-border); border-radius: 99px; font-size: .85rem; }
.sei-ka-attach:hover { background: #e9eef5; text-decoration: none; }
.sei-ka-back { margin-top: 1.5rem; }

/* Wiki interlinks */
.sei-ka-wikilink { border-bottom: 1px dotted currentColor; }
.sei-ka-wikilink-missing { color: #c5221f; cursor: help; border-bottom: 1px dashed #c5221f; }

/* Admin analytics */
.sei-ka-admin-stats { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1.5rem 0; }
.sei-ka-stat { background: #fff; border: 1px solid #dcdcde; border-radius: 10px; padding: 1rem 1.4rem; min-width: 140px; text-align: center; font-size: .82rem; color: #50575e; }
.sei-ka-stat span { display: block; font-size: 1.9rem; font-weight: 700; color: #1a73e8; }