/* Parent portal: child context remains clear on every information-rich page. */
body.prog-parent-portal {
    --prog-role-color: var(--prog-primary);
    --prog-role-soft: color-mix(in srgb, var(--prog-primary) 9%, var(--prog-surface));
}

.prog-theme-parent-host {
    --prog-role-color: var(--prog-primary);
    --prog-role-soft: color-mix(in srgb, var(--prog-primary) 9%, var(--prog-surface));
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    min-height: 100svh;
    background: var(--prog-background);
}

body .prog-learning-portal--parent {
    --prog-role-color: var(--prog-primary);
    --prog-role-soft: color-mix(in srgb, var(--prog-primary) 9%, var(--prog-surface));
}

.prog-learning-portal--parent > .prog-learning-header {
    background: linear-gradient(125deg, var(--prog-header), color-mix(in srgb, var(--prog-primary) 72%, var(--prog-header)));
}

.prog-learning-portal--parent .prog-learning-hero,
.prog-learning-portal--parent .prog-learning-child-overview {
    background: linear-gradient(135deg, var(--prog-primary-dark), var(--prog-primary));
}

.prog-learning-portal--parent .prog-learning-child-switcher a.active {
    border-color: var(--prog-primary);
    background: var(--prog-primary);
    color: var(--prog-on-primary);
}

.prog-child-selector {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.75rem;
}

.prog-child-selector label {
    margin: 0;
    white-space: nowrap;
}

.prog-child-selector select {
    min-width: min(15rem, 42vw);
}

.prog-child-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: clamp(1rem, 2vw, 1.5rem);
    border: 1px solid var(--prog-border);
    border-inline-start: 6px solid var(--prog-role-color);
    border-radius: var(--prog-radius);
    background: var(--prog-surface);
    box-shadow: var(--prog-shadow-small);
}

.prog-child-header__avatar {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    object-fit: cover;
}

.prog-child-header__name,
.prog-child-header__meta {
    display: block;
}

.prog-child-header__name {
    font-size: 1.2rem;
    font-weight: 800;
}

.prog-child-header__meta {
    color: var(--prog-text-soft);
    font-size: 0.88rem;
}

.prog-parent-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
    gap: 1rem;
}

.prog-parent-action-card {
    border-inline-start: 5px solid var(--prog-role-color);
}

.prog-attendance-ring {
    display: grid;
    width: 8rem;
    height: 8rem;
    place-items: center;
    border-radius: 50%;
    background: conic-gradient(var(--prog-role-color) var(--prog-attendance, 0%), var(--prog-border) 0);
}

.prog-attendance-ring::before {
    display: grid;
    width: 6rem;
    height: 6rem;
    place-items: center;
    border-radius: 50%;
    background: var(--prog-surface);
    content: attr(data-value);
    font-size: 1.35rem;
    font-weight: 850;
}

.prog-report-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
}

.prog-teacher-contact {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--prog-border);
    border-radius: var(--prog-radius-small);
    background: var(--prog-role-soft);
}

.prog-parent-portal .prog-progress__bar {
    background: var(--prog-role-color);
}


/* v1.0.5 — the Parent shortcode owns the complete portal workspace. */
body .prog-theme-parent-host,
body .prog-theme-parent-host > .prog-learning-portal--parent,
body .prog-learning-portal--parent {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
}
body .prog-learning-portal--parent {
    border-radius: 0 !important;
}
body .prog-learning-portal--parent > .prog-portal-content,
body .prog-learning-portal--parent .prog-parent-family,
body .prog-learning-portal--parent .prog-parent-children-grid,
body .prog-learning-portal--parent .prog-parent-child-card {
    width: 100%;
    max-width: none;
    min-width: 0;
}


/* v1.0.6 — Parent learner cards are rows, never half-width columns. */
body .prog-learning-portal--parent .prog-parent-children-grid,
body .prog-learning-portal--parent .prog-parent-children-grid.is-compact {
    display: grid !important;
    width: 100% !important;
    max-width: none !important;
    grid-template-columns: minmax(0, 1fr) !important;
}
body .prog-learning-portal--parent .prog-parent-child-card {
    width: 100% !important;
    max-width: none !important;
    grid-column: 1 / -1 !important;
}