/* Brand tokens */
:root {
	--aioshe-ink: #13201c;
	--aioshe-paper: #f6f4ea;
	--aioshe-paper-2: #eee9d9;
	--aioshe-forest: #0f4c3a;
	--aioshe-forest-dark: #0b3626;
	--aioshe-forest-tint: #e4efe9;
	--aioshe-amber: #c8842a;
	--aioshe-amber-tint: #f5e6cb;
	--aioshe-steel: #5b6b68;
	--aioshe-line: #d9d2bd;
	--aioshe-white: #fffdf7;
	--aioshe-red: #a1382e;
	--aioshe-red-tint: #f6e2df;
}
.aioshe-home, .aioshe-catalog, .aioshe-single-course, .aioshe-dashboard, .aioshe-verify, .aioshe-auth-form, .aioshe-archive-wrap {
	font-family: 'IBM Plex Sans', Arial, sans-serif;
	color: var(--aioshe-ink);
}
.aioshe-home h1, .aioshe-home h2, .aioshe-archive-header h1,
.aioshe-course-body h3, .aioshe-single-course h2, .aioshe-auth-form h2 {
	font-family: 'Fraunces', Georgia, serif;
	font-weight: 600;
}

/* Hero / landing page */
.aioshe-hero { padding: 48px 0 40px; border-bottom: 1px solid var(--aioshe-line); margin-bottom: 40px; }
.aioshe-eyebrow { color: var(--aioshe-amber); font-size: 13px; font-weight: 600; margin: 0 0 8px; }
.aioshe-hero h1 { font-size: 38px; line-height: 1.15; margin: 0 0 14px; max-width: 720px; }
.aioshe-hero-sub { font-size: 16px; color: var(--aioshe-steel); max-width: 560px; line-height: 1.6; margin: 0 0 24px; }
.aioshe-hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 32px; }
.aioshe-btn-ghost { background: none; color: var(--aioshe-forest) !important; border: 1px solid var(--aioshe-forest); }
.aioshe-hero-stats { display: flex; gap: 36px; flex-wrap: wrap; }
.aioshe-hero-stats strong { display: block; font-family: 'Fraunces', serif; font-size: 26px; color: var(--aioshe-forest-dark); }
.aioshe-hero-stats span { font-size: 12.5px; color: var(--aioshe-steel); }
.aioshe-home-featured { margin-bottom: 40px; }
.aioshe-home-featured h2, .aioshe-home-verify h2 { font-size: 22px; margin: 0 0 16px; }
.aioshe-home-verify { background: var(--aioshe-forest-tint); border-radius: 8px; padding: 28px 32px; margin-bottom: 20px; }
.aioshe-home-verify p { color: var(--aioshe-steel); margin: 0 0 16px; }

/* Archive header (fallback template) */
.aioshe-archive-wrap { max-width: 1180px; margin: 0 auto; padding: 40px 24px 80px; }
.aioshe-archive-header { max-width: 640px; margin-bottom: 30px; }
.aioshe-archive-header h1 { font-size: 32px; margin: 0 0 10px; }
.aioshe-archive-sub { color: var(--aioshe-steel); font-size: 15px; margin: 0; }

/* Front-end register / login */
.aioshe-auth-form { max-width: 380px; margin: 20px auto; background: var(--aioshe-white); border: 1px solid var(--aioshe-line); border-radius: 8px; padding: 32px; }
.aioshe-auth-form h2 { font-size: 22px; margin: 0 0 6px; }
.aioshe-auth-sub { color: var(--aioshe-steel); font-size: 13.5px; margin: 0 0 20px; }
.aioshe-auth-form label { display: block; font-size: 13px; color: var(--aioshe-steel); margin-bottom: 14px; }
.aioshe-auth-form input { display: block; width: 100%; margin-top: 6px; padding: 10px 12px; border: 1px solid var(--aioshe-line); border-radius: 5px; font-size: 14px; box-sizing: border-box; }
.aioshe-auth-message { margin-top: 14px; font-size: 13px; padding: 10px 12px; border-radius: 5px; }
.aioshe-auth-message.is-error { background: var(--aioshe-red-tint); color: var(--aioshe-red); }
.aioshe-auth-message.is-success { background: var(--aioshe-forest-tint); color: var(--aioshe-forest-dark); }
.aioshe-auth-switch { font-size: 13px; color: var(--aioshe-steel); margin: 18px 0 0; text-align: center; }
.aioshe-auth-switch a { color: var(--aioshe-forest); font-weight: 600; }

.aioshe-catalog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; margin-top: 20px; }
.aioshe-course-card { border: 1px solid #e2e2e2; border-radius: 8px; overflow: hidden; background: #fff; display: flex; flex-direction: column; }
.aioshe-course-thumb img { width: 100%; display: block; }
.aioshe-course-body { padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.aioshe-course-code { font-size: 11px; letter-spacing: .5px; text-transform: uppercase; color: #0f4c3a; font-weight: 700; }
.aioshe-course-body h3 { margin: 0; font-size: 18px; }
.aioshe-course-body h3 a { text-decoration: none; color: #16332a; }
.aioshe-course-meta { list-style: none; display: flex; gap: 14px; margin: 4px 0; padding: 0; font-size: 13px; color: #555; }
.aioshe-btn { display: inline-block; background: #0f4c3a; color: #fff !important; border: none; padding: 10px 18px; border-radius: 5px; font-size: 14px; cursor: pointer; text-decoration: none; text-align: center; }
.aioshe-btn:hover { background: #0c3c2e; }
.aioshe-btn-small { padding: 6px 12px; font-size: 12px; }

.aioshe-course-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.aioshe-progress-wrap { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.aioshe-progress-bar { background: #eee; border-radius: 20px; height: 10px; flex: 1; overflow: hidden; }
.aioshe-progress-bar span { display: block; height: 100%; background: linear-gradient(90deg,#0f4c3a,#1c7a5c); border-radius: 20px; transition: width .3s ease; }
.aioshe-progress-label { font-size: 13px; color: #444; white-space: nowrap; }

.aioshe-module { margin-bottom: 18px; border: 1px solid #eee; border-radius: 6px; padding: 14px 16px; }
.aioshe-module h4 { margin: 0 0 10px; }
.aioshe-lesson-list { list-style: none; margin: 0; padding: 0; }
.aioshe-lesson { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid #f0f0f0; }
.aioshe-lesson:first-child { border-top: none; }
.aioshe-lesson-check { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #ccc; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; color: transparent; flex-shrink: 0; }
.aioshe-lesson.is-done .aioshe-lesson-check { background: #0f4c3a; border-color: #0f4c3a; color: #fff; }
.aioshe-lesson.is-done .aioshe-lesson-title { color: #999; text-decoration: line-through; }
.aioshe-lesson-title { flex: 1; }
.aioshe-mark-complete { font-size: 12px; background: #f0f0f0; border: 1px solid #ddd; border-radius: 4px; padding: 4px 10px; cursor: pointer; }

.aioshe-assessment-gate { margin-top: 24px; padding: 20px; background: #f7f7f2; border-radius: 8px; }
.aioshe-passed { color: #0f4c3a; font-weight: 600; }
.aioshe-locked { color: #777; }
.aioshe-exam-question { margin-bottom: 16px; }
.aioshe-exam-option { display: block; margin: 4px 0; cursor: pointer; }
.aioshe-exam-pass { color: #0f4c3a; font-weight: 700; margin-bottom: 10px; }
.aioshe-exam-fail { color: #a12626; font-weight: 600; margin-bottom: 10px; }
.aioshe-exam-pass-mark { font-size: 13px; color: #666; }

.aioshe-dashboard h2 { margin-top: 32px; }
.aioshe-dash-row, .aioshe-cert-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid #eee; }
.aioshe-status { font-size: 11px; padding: 3px 10px; border-radius: 20px; background: #eee; text-transform: uppercase; letter-spacing: .4px; }
.aioshe-status-active, .aioshe-status-valid { background: #e4f3ec; color: #0f4c3a; }
.aioshe-status-completed { background: #dff0ff; color: #0b4a7a; }
.aioshe-status-revoked, .aioshe-status-expired { background: #fbe3e3; color: #a12626; }
.aioshe-cert-number { font-size: 12px; color: #777; }

.aioshe-verify-form { display: flex; gap: 8px; margin-bottom: 20px; max-width: 460px; }
.aioshe-verify-form input { flex: 1; padding: 10px; border: 1px solid #ccc; border-radius: 5px; }
.aioshe-verify-result { padding: 20px; border-radius: 8px; max-width: 460px; }
.aioshe-verify-valid { background: #e4f3ec; }
.aioshe-verify-expired, .aioshe-verify-revoked, .aioshe-verify-invalid { background: #fbe3e3; }
.aioshe-verify-badge { font-weight: 700; font-size: 16px; }
.aioshe-verify-result table { width: 100%; border-collapse: collapse; margin-top: 12px; }
.aioshe-verify-result th { text-align: left; padding: 6px 8px 6px 0; font-size: 13px; color: #555; width: 40%; }
.aioshe-verify-result td { padding: 6px 0; font-size: 13px; }
