/** Minimal theme-independent presentation for HYDA Portal output. */

.hyda-portal-auth-layout {
	display: grid;
	gap: 2rem;
	grid-template-columns: minmax(0, 1.2fr) minmax(16rem, .8fr);
	margin-inline: auto;
	max-width: 68rem;
}

.hyda-portal-auth-card,
.hyda-portal-support-card,
.hyda-portal-account-bar,
.hyda-portal-empty-state,
.hyda-portal-status {
	background: var(--hyda-off-white, #f7f8fb);
	border: 1px solid var(--hyda-border, #d8dfe9);
	border-radius: 1rem;
	color: var(--hyda-text, #26334a);
	padding: clamp(1.5rem, 4vw, 2.5rem);
}

.hyda-portal-auth-card--narrow { margin-inline: auto; max-width: 42rem; }
.hyda-portal-form { display: grid; gap: 1.25rem; margin-top: 1.5rem; }
.hyda-portal-field { display: grid; gap: .4rem; }
.hyda-portal-field label { font-weight: 700; }
.hyda-portal-field input {
	background: #fff;
	border: 1px solid var(--hyda-border, #d8dfe9);
	border-radius: .6rem;
	box-sizing: border-box;
	font: inherit;
	min-height: 3rem;
	padding: .7rem .85rem;
	width: 100%;
}

.hyda-portal-checkbox { align-items: flex-start; display: flex; gap: .6rem; }
.hyda-portal-checkbox input { height: 1.2rem; margin-top: .2rem; width: 1.2rem; }
.hyda-portal-button {
	background: var(--hyda-gold, #f5a800);
	border: 0;
	border-radius: 999px;
	color: var(--hyda-deep-navy, #03112f);
	cursor: pointer;
	display: inline-flex;
	font: inherit;
	font-weight: 800;
	justify-content: center;
	min-height: 3rem;
	padding: .8rem 1.25rem;
	text-decoration: none;
}

.hyda-portal-button--secondary {
	background: transparent;
	border: 2px solid var(--hyda-navy, #061b49);
	color: var(--hyda-navy, #061b49);
}

.hyda-portal-help { margin-bottom: 0; text-align: center; }
.hyda-portal-text-link { font-weight: 800; }
.hyda-portal-message { border-left: 4px solid #0a2f72; margin-block: 1rem; padding: .75rem 1rem; }
.hyda-portal-message p { margin: 0; }
.hyda-portal-message--error { background: #fff1f1; border-color: #c53b3b; color: #702222; }
.hyda-portal-message--success { background: #eefaf4; border-color: #218a5a; color: #185e40; }
.hyda-portal-message--info { background: #eef5ff; border-color: #0a2f72; }
.hyda-portal-account-bar { align-items: center; display: flex; gap: 1.5rem; justify-content: space-between; }
.hyda-portal-kicker { font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hyda-portal-empty-state { margin-top: 1.5rem; text-align: center; }
.hyda-portal-empty-state > span { font-size: 2rem; font-weight: 900; }

.hyda-portal-subnav {
	align-items: center;
	background: #fff;
	border: 1px solid var(--hyda-border, #d8dfe9);
	border-radius: 999px;
	display: flex;
	flex-wrap: wrap;
	gap: .25rem;
	margin-bottom: 2rem;
	padding: .4rem;
}
.hyda-portal-subnav a { border-radius: 999px; color: inherit; font-weight: 700; min-height: 2.75rem; padding: .55rem 1rem; text-decoration: none; }
.hyda-portal-welcome { align-items: center; display: flex; gap: 2rem; justify-content: space-between; }
.hyda-portal-stats { display: grid; gap: 1rem; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 1.5rem 0; }
.hyda-portal-stats > div { background: #fff; border: 1px solid var(--hyda-border,#d8dfe9); border-radius: 1rem; display: grid; padding: 1.25rem; }
.hyda-portal-stats strong { font-size: 2rem; }
.hyda-learner-progress { align-items: center; background: var(--hyda-navy,#061b49); border-radius: 1rem; color: #fff; display: grid; gap: 2rem; grid-template-columns: minmax(0,1fr) minmax(15rem,.8fr); margin: 1.5rem 0 3rem; padding: clamp(1.5rem,4vw,2.5rem); scroll-margin-top: 7rem; }
.hyda-learner-progress :where(h2,p) { color: #fff; }
.hyda-learner-progress :where(h2,p) { margin-bottom: 0; }
.hyda-progress-meter { align-items: center; display: grid; gap: .75rem; grid-template-columns: minmax(8rem,1fr) auto; }
.hyda-progress-meter > strong { font-size: 1.35rem; }
.hyda-progress-meter-track { background: rgba(255,255,255,.25); border-radius: 999px; height: .8rem; overflow: hidden; }
.hyda-progress-meter-track > span { background: var(--hyda-gold,#f5a800); display: block; height: 100%; }
.hyda-portal-dashboard-section { margin-top: 4rem; scroll-margin-top: 7rem; }
.hyda-portal-section-heading { align-items: end; display: flex; gap: 2rem; justify-content: space-between; margin-bottom: 1.5rem; }
.hyda-portal-section-heading > p { max-width: 34rem; }
.hyda-module-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(2,minmax(0,1fr)); }
.hyda-module-card { background: #fff; border: 1px solid var(--hyda-border,#d8dfe9); border-radius: 1rem; display: grid; grid-template-columns: auto 1fr; overflow: hidden; }
.hyda-module-number { background: var(--hyda-navy,#061b49); color: #fff; font-size: 1.4rem; font-weight: 900; padding: 1.5rem 1rem; }
.hyda-module-card-content { padding: 1.5rem; }
.hyda-progress-badge { border-radius: 999px; display: inline-flex; font-size: .75rem; font-weight: 800; margin-bottom: .5rem; padding: .35rem .7rem; }
.hyda-progress-badge--not_started { background: var(--hyda-off-white,#f7f8fb); border: 1px solid var(--hyda-border,#d8dfe9); color: var(--hyda-muted,#58657a); }
.hyda-progress-badge--started { background: #fff4d6; color: #6c4b00; }
.hyda-progress-badge--completed { background: #e7f8ed; color: #17632a; }
.hyda-module-card--completed { border-color: #8ac59d; }
.hyda-progress-form { margin: 0; }
.hyda-progress-form .hyda-portal-button { width: auto; }
.hyda-module-features { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: 1rem 0; padding: 0; }
.hyda-module-features li { background: var(--hyda-off-white,#f7f8fb); border: 1px solid var(--hyda-border,#d8dfe9); border-radius: 999px; font-size: .78rem; font-weight: 800; padding: .35rem .7rem; }
.hyda-notice-list { display: grid; gap: 1rem; }
.hyda-notice-card { background: #fff; border: 1px solid var(--hyda-border,#d8dfe9); border-radius: 1rem; padding: 1.5rem; }
.hyda-notice-card time { font-size: .85rem; font-weight: 700; }
.hyda-portal-support-strip { align-items: center; background: var(--hyda-navy,#061b49); border-radius: 1rem; color: #fff; display: flex; gap: 2rem; justify-content: space-between; margin-top: 4rem; padding: 2rem; }
.hyda-portal-support-strip :where(h2,p,a) { color: #fff; }
.hyda-portal-module-shell { margin-inline: auto; max-width: 58rem; }
.hyda-module-breadcrumb { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 2rem; }
.hyda-module-header { border-bottom: 1px solid var(--hyda-border,#d8dfe9); margin-bottom: 2rem; padding-bottom: 2rem; }
.hyda-module-intro { font-size: 1.15rem; }
.hyda-module-featured-image img { border-radius: 1rem; width: 100%; }
.hyda-module-panel,
.hyda-module-content { background: #fff; border: 1px solid var(--hyda-border,#d8dfe9); border-radius: 1rem; margin-top: 1.5rem; padding: clamp(1.5rem,4vw,3rem); }
.hyda-module-panel > :first-child,
.hyda-module-content > :first-child { margin-top: 0; }
.hyda-module-panel > :last-child,
.hyda-module-content > :last-child { margin-bottom: 0; }
.hyda-module-instructions { background: var(--hyda-off-white,#f7f8fb); border-left: 5px solid var(--hyda-gold,#f5a800); }
.hyda-module-progress-panel { background: #f4f8ff; border-left: 5px solid var(--hyda-navy,#061b49); }
.hyda-module-progress-panel .hyda-progress-form { margin-top: 1.25rem; }
.hyda-progress-disclaimer { color: var(--hyda-muted,#58657a); font-size: .88rem; margin-top: 1.25rem; }
.hyda-responsive-embed { aspect-ratio: 16 / 9; background: #000; border-radius: .8rem; overflow: hidden; }
.hyda-responsive-embed iframe { border: 0; height: 100%; width: 100%; }
.hyda-resource-download-list { display: grid; gap: .75rem; list-style: none; margin: 1.25rem 0 0; padding: 0; }
.hyda-resource-download-list a { align-items: center; border: 1px solid var(--hyda-border,#d8dfe9); border-radius: .75rem; color: inherit; display: flex; gap: 1rem; justify-content: space-between; padding: 1rem; text-decoration: none; }
.hyda-resource-download-list a:hover,
.hyda-resource-download-list a:focus-visible { border-color: var(--hyda-navy,#061b49); box-shadow: 0 0 0 2px color-mix(in srgb,var(--hyda-navy,#061b49) 20%,transparent); }
.hyda-resource-download-list a > span:first-child { display: grid; min-width: 0; }
.hyda-resource-download-list small { color: var(--hyda-muted,#58657a); font-weight: 600; }
.hyda-google-form-embed { border: 1px solid var(--hyda-border,#d8dfe9); border-radius: .8rem; height: min(70rem,80vh); margin-block: 1.5rem; overflow: hidden; }
.hyda-google-form-embed iframe { border: 0; height: 100%; width: 100%; }
.hyda-module-pagination { align-items: center; display: grid; gap: 1rem; grid-template-columns: 1fr auto 1fr; margin-top: 2rem; }
.hyda-module-pagination > div { display: grid; }
.hyda-module-pagination > div:last-child { text-align: right; }
.hyda-module-pagination span { font-size: .75rem; font-weight: 800; text-transform: uppercase; }

@media (max-width: 760px) {
	.hyda-portal-auth-layout { grid-template-columns: 1fr; }
	.hyda-portal-account-bar { align-items: flex-start; flex-direction: column; }
	.hyda-portal-welcome,.hyda-portal-section-heading,.hyda-portal-support-strip { align-items: flex-start; flex-direction: column; }
	.hyda-portal-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.hyda-module-grid,.hyda-learner-progress { grid-template-columns: 1fr; }
	.hyda-module-pagination { grid-template-columns: 1fr; }
	.hyda-module-pagination > div:last-child { text-align: left; }
}

@media (max-width: 420px) {
	.hyda-portal-stats { grid-template-columns: 1fr; }
	.hyda-progress-meter { grid-template-columns: 1fr; }
	.hyda-progress-form .hyda-portal-button { width: 100%; }
}