/* Royal Streams School LMS portal styles. */

.rsilms-portal {
    display: grid;
    gap: 1.5rem;
}

.rsilms-welcome {
    flex-wrap: wrap;
    gap: 1rem;
}

.rsilms-username {
    color: var(--text-light);
    margin-left: 0.35rem;
}

.rsilms-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.rsilms-tabs a {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 999px;
    background: var(--bg-white);
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: none;
}

.rsilms-tabs a:hover,
.rsilms-tabs a:focus {
    border-color: var(--primary-color);
    background: var(--bg-light);
}

.rsilms-tabs .rsilms-nav-alt {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

.rsilms-panel {
    background: var(--bg-white);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 1.5rem;
    box-shadow: var(--shadow-sm);
    scroll-margin-top: 6rem;
}

.rsilms-panel h2 {
    margin: 0 0 1rem;
    color: var(--primary-color);
    font-size: 1.25rem;
}

.rsilms-panel h3 {
    margin: 1.5rem 0 0.75rem;
    font-size: 1.05rem;
}

.rsilms-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.rsilms-stat {
    background: var(--bg-light);
    border-radius: 12px;
    padding: 0.9rem 1rem;
    display: grid;
    gap: 0.2rem;
}

.rsilms-stat-number {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--primary-color);
}

.rsilms-stat-label {
    color: var(--text-light);
    font-size: 0.85rem;
}

.rsilms-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.rsilms-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.6rem;
}

.rsilms-list li {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.35rem;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 0.6rem;
}

.rsilms-list li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.rsilms-muted {
    color: var(--text-light);
    font-size: 0.9rem;
}

.rsilms-table-wrap {
    overflow-x: auto;
}

.rsilms-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.rsilms-table th,
.rsilms-table td {
    text-align: left;
    padding: 0.65rem 0.5rem;
    border-bottom: 1px solid var(--border-color);
    vertical-align: top;
}

.rsilms-table th {
    color: var(--text-light);
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.rsilms-pill {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    background: var(--bg-light);
    color: var(--text-color);
    white-space: nowrap;
}

.rsilms-pill-submitted,
.rsilms-pill-published,
.rsilms-pill-marked {
    background: #e6f4ea;
    color: #1e6b33;
}

.rsilms-pill-late,
.rsilms-pill-draft,
.rsilms-pill-part,
.rsilms-pill-due {
    background: #fdf0d5;
    color: #7a5200;
}

.rsilms-pill-pending,
.rsilms-pill-overdue {
    background: #fde8e8;
    color: #8f1837;
}

.rsilms-pill-paid {
    background: #e6f4ea;
    color: #1e6b33;
}

.rsilms-flash {
    margin: 0;
}

.rsilms-empty {
    color: var(--text-light);
}

.rsilms-login-meta {
    margin: 0.75rem 0 0;
    font-size: 0.9rem;
}

.rsilms-login-meta a {
    color: var(--primary-color);
}

.rsilms-form {
    display: grid;
    gap: 0.9rem;
}

.rsilms-form label {
    font-weight: 600;
}

.rsilms-form input[type="text"],
.rsilms-form input[type="email"],
.rsilms-form input[type="password"],
.rsilms-form input[type="number"],
.rsilms-form input[type="datetime-local"],
.rsilms-form select,
.rsilms-form textarea {
    width: 100%;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--bg-white);
    color: var(--text-color);
    font: inherit;
}

.rsilms-form input:focus,
.rsilms-form select:focus,
.rsilms-form textarea:focus {
    outline: 3px solid rgba(110, 43, 126, 0.18);
    border-color: var(--primary-color);
}

.rsilms-form-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0.9rem;
}

.rsilms-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.rsilms-field-error {
    color: #8f1837;
    font-size: 0.85rem;
}

@media (max-width: 640px) {
    .rsilms-panel {
        padding: 1.1rem;
        border-radius: 12px;
    }

    .rsilms-table thead {
        display: none;
    }

    .rsilms-table,
    .rsilms-table tbody,
    .rsilms-table tr,
    .rsilms-table td {
        display: block;
        width: 100%;
    }

    .rsilms-table tr {
        border: 1px solid var(--border-color);
        border-radius: 10px;
        margin-bottom: 0.75rem;
        padding: 0.25rem 0.7rem;
    }

    .rsilms-table td {
        border: 0;
        padding: 0.4rem 0;
        display: flex;
        justify-content: space-between;
        gap: 0.75rem;
    }

    .rsilms-table td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--text-light);
    }

    .rsilms-table td:last-child {
        border: 0;
    }
}

/* Ward and parent dashboards */

.rsilms-child-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.rsilms-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 999px;
    color: var(--primary-color);
    font-weight: 600;
    text-decoration: none;
    background: var(--bg-white);
}

.rsilms-chip.is-active,
.rsilms-chip:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

.rsilms-homework-list {
    display: grid;
    gap: 1rem;
}

.rsilms-homework {
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 1rem;
    background: var(--bg-white);
}

.rsilms-homework-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.rsilms-homework-head h3 {
    margin: 0;
    flex: 1 1 220px;
    font-size: 1.05rem;
}

.rsilms-instructions {
    margin: 0.5rem 0;
}

.rsilms-instructions p:last-child {
    margin-bottom: 0;
}

.rsilms-submission {
    border-left: 3px solid var(--secondary-color);
    padding-left: 0.75rem;
    margin: 0.75rem 0;
}

.rsilms-file-list {
    margin: 0.25rem 0 0;
    padding-left: 1.1rem;
}

.rsilms-mark {
    font-weight: 700;
    margin: 0.75rem 0 0.25rem;
}

.rsilms-letter {
    display: inline-block;
    min-width: 1.6rem;
    text-align: center;
    background: var(--secondary-color);
    color: #3b1f45;
    border-radius: 6px;
    padding: 0.1rem 0.35rem;
    font-weight: 700;
}

.rsilms-feedback {
    background: var(--bg-light);
    border-radius: 8px;
    padding: 0.6rem 0.75rem;
    margin: 0.25rem 0;
}

.rsilms-upload-form {
    border-top: 1px solid var(--border-color);
    margin-top: 1rem;
    padding-top: 1rem;
}

.rsilms-report-summary {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

/* Teacher dashboard */

.rsilms-class-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.rsilms-class-card {
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 1rem;
    background: var(--bg-light);
}

.rsilms-class-card h3 {
    margin: 0 0 0.25rem;
    color: var(--primary-color);
}

.rsilms-class-card p {
    margin: 0.25rem 0;
}

.rsilms-subject-list li {
    border-bottom: 0;
    padding-bottom: 0.15rem;
}

.rsilms-marking {
    scroll-margin-top: 6rem;
}

.rsilms-marking h2 span {
    display: block;
    font-size: 0.85rem;
    font-weight: 400;
    margin-top: 0.15rem;
}

.rsilms-marking-table input[type="number"],
.rsilms-marking-table textarea {
    width: 100%;
    padding: 0.4rem 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    font: inherit;
}

.rsilms-marking-table input[type="number"] {
    max-width: 90px;
}

@media (max-width: 640px) {
    .rsilms-marking-table td {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }

    .rsilms-marking-table td::before {
        margin-bottom: 0.15rem;
    }
}

/* Progress and celebration
   ------------------------------------------------------------------ */

.rsilms-portal {
    --rsilms-accent: var(--primary-color);
    --rsilms-accent-2: #a24fb0;
    --rsilms-accent-soft: #f4ecf7;
}

.rsilms-role-teacher {
    --rsilms-accent: #0f766e;
    --rsilms-accent-2: #14b8a6;
    --rsilms-accent-soft: #e7f6f4;
}

.rsilms-role-ward {
    --rsilms-accent: #8a5a00;
    --rsilms-accent-2: #e0b23c;
    --rsilms-accent-soft: #fdf3dc;
}

.rsilms-role-parent {
    --rsilms-accent: #8f1837;
    --rsilms-accent-2: #c2415f;
    --rsilms-accent-soft: #fbeaef;
}

.rsilms-portal .rsilms-panel h2,
.rsilms-portal .rsilms-stat-number {
    color: var(--rsilms-accent);
}

.rsilms-portal .lms-avatar {
    background: var(--rsilms-accent);
    color: #fff;
}

/* Term chip in the welcome bar */

.rsilms-welcome-side {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-left: auto;
}

.rsilms-term {
    display: grid;
    gap: 0.25rem;
    min-width: 200px;
    background: var(--rsilms-accent-soft);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 0.5rem 0.85rem;
}

.rsilms-term-name {
    color: var(--rsilms-accent);
    font-weight: 700;
    font-size: 0.9rem;
    line-height: 1.2;
}

.rsilms-term-meta {
    color: var(--text-light);
    font-size: 0.76rem;
}

.rsilms-term-track,
.rsilms-bar {
    display: block;
    height: 8px;
    background: rgba(31, 41, 55, 0.1);
    border-radius: 999px;
    overflow: hidden;
}

.rsilms-term-track > span,
.rsilms-bar > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--rsilms-accent), var(--rsilms-accent-2));
    transition: width 0.6s ease;
}

/* School and teacher pulse */

.rsilms-pulse {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.rsilms-pulse-item {
    display: grid;
    gap: 0.1rem;
    background: var(--rsilms-accent-soft);
    border-left: 4px solid var(--rsilms-accent);
    border-radius: 12px;
    padding: 0.85rem 1rem;
}

.rsilms-pulse-number {
    color: var(--rsilms-accent);
    font-size: 1.7rem;
    font-weight: 800;
    line-height: 1.1;
}

.rsilms-pulse-label {
    color: var(--text-light);
    font-size: 0.82rem;
}

.rsilms-pulse-item.is-warn {
    background: #fff3de;
    border-left-color: #c77700;
}

.rsilms-pulse-item.is-warn .rsilms-pulse-number {
    color: #a35c00;
}

/* Coverage rows (admin and teacher class lists) */

.rsilms-list .rsilms-cover-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(120px, 220px);
    align-items: center;
    gap: 1rem;
}

.rsilms-cover-copy {
    display: grid;
    gap: 0.15rem;
}

.rsilms-cover-copy .rsilms-muted {
    display: block;
}

.rsilms-class-coverage {
    display: grid;
    gap: 0.3rem;
    margin-top: 0.5rem;
}

.rsilms-class-coverage p {
    font-size: 0.8rem;
    margin: 0;
}

/* Inline progress in the teacher's homework table */

.rsilms-mini-progress {
    display: grid;
    gap: 0.3rem;
    min-width: 170px;
}

.rsilms-progress-copy {
    color: var(--text-light);
    font-size: 0.78rem;
}

.rsilms-needs-marking {
    justify-self: start;
    background: #fff1d6;
    border-radius: 999px;
    color: #8a5200;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.55rem;
    text-transform: uppercase;
}

/* Ward momentum: ring, streak and next deadline */

.rsilms-momentum {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 0.9rem;
    margin: 0 0 1.25rem;
}

.rsilms-momentum-card {
    display: grid;
    gap: 0.35rem;
    align-content: start;
    background: var(--rsilms-accent-soft);
    border: 1px solid rgba(31, 41, 55, 0.06);
    border-radius: 14px;
    padding: 1rem;
}

.rsilms-momentum-eyebrow {
    color: var(--text-light);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.rsilms-momentum-caption {
    color: var(--text-light);
    font-size: 0.82rem;
    margin: 0;
}

.rsilms-momentum-big {
    color: var(--rsilms-accent);
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1;
}

.rsilms-ring-card {
    justify-items: center;
    text-align: center;
}

.rsilms-ring {
    position: relative;
    width: 132px;
    height: 132px;
}

.rsilms-ring svg {
    transform: rotate(-90deg);
    width: 100%;
    height: 100%;
}

.rsilms-ring-track {
    fill: none;
    stroke: rgba(31, 41, 55, 0.12);
    stroke-width: 12;
}

.rsilms-ring-value {
    fill: none;
    stroke: var(--rsilms-accent);
    stroke-linecap: round;
    stroke-width: 12;
    stroke-dasharray: 327;
    stroke-dashoffset: 327;
    animation: rsilms-ring-fill 1.1s ease-out 0.15s forwards;
}

@keyframes rsilms-ring-fill {
    from {
        stroke-dashoffset: var(--rsilms-ring-from, 327);
    }

    to {
        stroke-dashoffset: var(--rsilms-ring-to, 327);
    }
}

.rsilms-ring-center {
    position: absolute;
    inset: 0;
    display: grid;
    place-content: center;
    text-align: center;
    gap: 0.1rem;
}

.rsilms-ring-center strong {
    color: var(--rsilms-accent);
    font-size: 1.6rem;
    line-height: 1;
}

.rsilms-ring-center span {
    color: var(--text-light);
    font-size: 0.7rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.rsilms-streak-line {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    margin: 0;
}

.rsilms-streak-line span {
    color: var(--text-light);
    font-weight: 600;
}

.rsilms-streak-card.is-live {
    background: linear-gradient(135deg, #fff8e4, #ffe9b5);
    border-color: #f0d48a;
}

.rsilms-streak-card.is-live .rsilms-momentum-big {
    color: #a35c00;
}

.rsilms-next-card {
    border-left: 4px solid var(--rsilms-accent);
}

.rsilms-next-title {
    font-size: 1.02rem;
}

/* Subject strength bars */

.rsilms-subject-bars {
    display: grid;
    gap: 0.85rem;
    background: var(--bg-light);
    border-radius: 14px;
    margin: 1.5rem 0;
    padding: 1rem 1.1rem;
}

.rsilms-panel .rsilms-subtle-heading {
    color: var(--text-light);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    margin: 0;
    text-transform: uppercase;
}

.rsilms-subject {
    display: grid;
    gap: 0.3rem;
    --rsilms-bar-from: var(--rsilms-accent);
    --rsilms-bar-to: var(--rsilms-accent-2);
}

.rsilms-subject.is-strong {
    --rsilms-bar-from: #1e8e4a;
    --rsilms-bar-to: #3fbf6e;
}

.rsilms-subject.is-focus {
    --rsilms-bar-from: #b3541a;
    --rsilms-bar-to: #e08a4b;
}

.rsilms-subject.is-empty {
    opacity: 0.7;
}

.rsilms-subject .rsilms-bar > span {
    background: linear-gradient(90deg, var(--rsilms-bar-from), var(--rsilms-bar-to));
}

.rsilms-subject.is-empty .rsilms-bar > span {
    background: var(--border-color);
}

.rsilms-subject-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.rsilms-subject-name {
    font-weight: 600;
}

.rsilms-subject-score {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.9rem;
    font-weight: 700;
}

/* Parent overview cards */

.rsilms-child-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
    gap: 0.9rem;
    margin: 0 0 1.25rem;
}

.rsilms-child-card {
    display: grid;
    gap: 0.55rem;
    justify-items: center;
    background: var(--bg-white);
    border: 2px solid var(--border-color);
    border-radius: 16px;
    color: inherit;
    padding: 1rem;
    text-align: center;
    text-decoration: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.rsilms-child-card:hover,
.rsilms-child-card:focus-visible,
.rsilms-child-card.is-active {
    border-color: var(--rsilms-accent);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.rsilms-child-card.is-active {
    background: var(--rsilms-accent-soft);
}

.rsilms-child-top {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.rsilms-child-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--rsilms-accent);
    border-radius: 50%;
    color: #fff;
    font-size: 0.82rem;
    font-weight: 700;
    height: 34px;
    width: 34px;
}

.rsilms-child-name {
    font-weight: 700;
}

.rsilms-child-ring {
    position: relative;
    display: grid;
    place-items: center;
    background: conic-gradient(var(--rsilms-accent) var(--rsilms-child-percent, 0%), rgba(31, 41, 55, 0.1) 0);
    border-radius: 50%;
    height: 96px;
    width: 96px;
}

.rsilms-child-ring::before {
    content: "";
    position: absolute;
    inset: 8px;
    background: var(--bg-white);
    border-radius: 50%;
}

.rsilms-child-card.is-active .rsilms-child-ring::before {
    background: var(--rsilms-accent-soft);
}

.rsilms-child-ring-inner {
    position: relative;
    display: grid;
    gap: 0.05rem;
    text-align: center;
}

.rsilms-child-ring-inner strong {
    color: var(--rsilms-accent);
    font-size: 1.1rem;
    line-height: 1.1;
}

.rsilms-child-ring-inner small {
    color: var(--text-light);
    font-size: 0.66rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.rsilms-child-metrics {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.4rem;
    background: rgba(31, 41, 55, 0.05);
    border-radius: 999px;
    font-size: 0.78rem;
    padding: 0.2rem 0.6rem;
}

.rsilms-child-metrics .is-warn {
    color: #a35c00;
    font-weight: 700;
}

.rsilms-child-last {
    color: var(--text-light);
    font-size: 0.74rem;
}

/* Celebration on submission */

.rsilms-flash.rsilms-celebrate {
    position: relative;
    overflow: hidden;
}

.rsilms-confetti {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.rsilms-confetti i {
    position: absolute;
    top: -12px;
    left: calc(6% + var(--rsilms-i) * 7.5%);
    background: var(--rsilms-accent);
    border-radius: 2px;
    height: 12px;
    width: 8px;
    opacity: 0;
    animation: rsilms-confetti-fall 1.7s ease-out forwards;
    animation-delay: calc(var(--rsilms-i) * 55ms);
}

.rsilms-confetti i:nth-child(3n) {
    background: var(--secondary-color);
}

.rsilms-confetti i:nth-child(3n + 1) {
    background: #2f9e64;
}

.rsilms-confetti i:nth-child(even) {
    border-radius: 50%;
    height: 7px;
    width: 7px;
}

@keyframes rsilms-confetti-fall {
    0% {
        opacity: 0;
        transform: translateY(0) rotate(0deg);
    }

    15% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform: translateY(84px) rotate(240deg);
    }
}

/* Scroll reveal, enabled by portal.js */

.rsilms-js .rsilms-reveal {
    opacity: 0;
    translate: 0 12px;
}

.rsilms-js .rsilms-reveal.is-visible {
    opacity: 1;
    translate: 0 0;
    transition: opacity 0.45s ease, translate 0.45s ease;
}

@media (max-width: 640px) {
    .rsilms-list .rsilms-cover-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .rsilms-welcome-side {
        margin-left: 0;
        width: 100%;
    }

    .rsilms-term {
        width: 100%;
    }

    .rsilms-mini-progress {
        min-width: 0;
        width: 100%;
    }
}

@media print {
    .rsilms-js .rsilms-reveal {
        opacity: 1;
        translate: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rsilms-ring-value {
        animation: none;
        stroke-dashoffset: var(--rsilms-ring-to, 327);
    }

    .rsilms-confetti {
        display: none;
    }

    .rsilms-js .rsilms-reveal {
        opacity: 1;
        translate: none;
        transition: none;
    }

    .rsilms-term-track > span,
    .rsilms-bar > span,
    .rsilms-child-card {
        transition: none;
    }
}

/* Strengths and focus areas. */

.rsilms-area-groups {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.rsilms-area-group {
    border: 1px solid var(--border-color);
    border-left: 4px solid var(--rsilms-accent);
    border-radius: 14px;
    background: var(--bg-light);
    padding: 1rem 1.1rem;
}

.rsilms-area-group.is-strong {
    border-left-color: #1e8e4a;
}

.rsilms-area-group.is-steady {
    border-left-color: #2b6cb0;
}

.rsilms-area-group.is-focus {
    border-left-color: #b3541a;
}

.rsilms-area-group h3 {
    margin: 0 0 0.6rem;
    font-size: 0.95rem;
    color: var(--primary-color);
}

.rsilms-area-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.45rem;
}

.rsilms-area-list li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px dashed var(--border-color);
}

.rsilms-area-list li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.rsilms-area-name {
    font-weight: 600;
}

.rsilms-area-score {
    color: var(--text-light);
    font-variant-numeric: tabular-nums;
}

/* Fee cards. */

.rsilms-bill-list {
    display: grid;
    gap: 1rem;
    margin-top: 1.25rem;
}

.rsilms-bill-card {
    border: 1px solid var(--border-color);
    border-radius: 14px;
    background: linear-gradient(135deg, var(--bg-white), var(--bg-light));
    padding: 1.1rem 1.2rem;
}

.rsilms-bill-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.rsilms-bill-head h3 {
    margin: 0;
    font-size: 1.05rem;
}

.rsilms-bill-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0.85rem 0 0;
}

.rsilms-bill-grid div {
    background: var(--bg-white);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    padding: 0.55rem 0.7rem;
}

.rsilms-bill-grid dt {
    color: var(--text-light);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.rsilms-bill-grid dd {
    margin: 0.15rem 0 0;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.rsilms-bill-history {
    margin-top: 0.8rem;
}

.rsilms-bill-history summary {
    cursor: pointer;
    color: var(--primary-color);
    font-weight: 600;
}

.rsilms-bill-history ul {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    display: grid;
    gap: 0.35rem;
}

.rsilms-bill-history li {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 0.5rem;
    font-size: 0.9rem;
}

/* Test scoring. */

.rsilms-score-form {
    margin: 0.75rem 0 0.25rem;
}

.rsilms-score-row > td {
    background: var(--bg-light);
}

.rsilms-score-input {
    max-width: 7rem;
}

.rsilms-inline-form {
    display: inline;
    margin-left: 0.5rem;
}

.rsilms-inline-form .link-button {
    border: 0;
    background: none;
    color: #8f1837;
    cursor: pointer;
    font: inherit;
    padding: 0;
    text-decoration: underline;
}

@media (max-width: 780px) {
    .rsilms-area-groups,
    .rsilms-bill-grid {
        grid-template-columns: 1fr;
    }
}

.rsilms-pill-present {
    background: #e6f4ea;
    color: #1e6b33;
}

.rsilms-pill-absent {
    background: #fde8e8;
    color: #8f1837;
}

.rsilms-pill-excused {
    background: #e8eefc;
    color: #24468f;
}

.rsilms-attendance-picker {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem;
    margin: 0 0 1rem;
}

.rsilms-attendance-picker label {
    font-size: 0.8rem;
    font-weight: 600;
}

.rsilms-attendance-picker select,
.rsilms-attendance-picker input[type="date"] {
    padding: 0.35rem 0.5rem;
    border: 1px solid #d6dbe4;
    border-radius: 6px;
    background: #fff;
}

.rsilms-attendance-date {
    font-weight: 700;
    margin: 0 0 0.5rem;
}

.rsilms-attendance-name {
    font-weight: 600;
}

.rsilms-attendance-select {
    min-width: 8rem;
    padding: 0.35rem 0.5rem;
    border: 1px solid #d6dbe4;
    border-radius: 6px;
    background: #fff;
}

.rsilms-attendance-note {
    width: 100%;
    min-width: 12rem;
    padding: 0.35rem 0.5rem;
    border: 1px solid #d6dbe4;
    border-radius: 6px;
}

.rsilms-attendance-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1rem;
}

.rsilms-attendance-days {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.35rem;
}

.rsilms-attendance-days li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.35rem 0;
    border-bottom: 1px dashed #e3e7ee;
}

@media (max-width: 780px) {
    .rsilms-attendance-picker {
        flex-direction: column;
        align-items: stretch;
    }
}

.rsilms-events-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.rsilms-panel-sub {
    margin: 0.25rem 0 1rem;
    color: var(--text-light);
    font-size: 0.92rem;
}

.rsilms-events-all {
    color: var(--primary-color);
    font-weight: 700;
    text-decoration: none;
}

.rsilms-events-all:hover,
.rsilms-events-all:focus {
    text-decoration: underline;
}

.rsilms-events {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.65rem;
}

.rsilms-event {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--border-color);
    border-radius: 14px;
    background: linear-gradient(90deg, rgba(110, 43, 126, 0.04), transparent 55%);
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.rsilms-event:hover {
    border-color: rgba(110, 43, 126, 0.35);
    transform: translateY(-1px);
}

.rsilms-event-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 3.2rem;
    height: 3.4rem;
    border-radius: 12px;
    background: var(--primary-color);
    color: #ffffff;
    box-shadow: inset 0 0 0 2px rgba(224, 178, 60, 0.55);
}

.rsilms-event-day {
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1;
}

.rsilms-event-month {
    margin-top: 0.15rem;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #f4d58b;
}

.rsilms-event-body {
    min-width: 0;
}

.rsilms-event-title {
    margin: 0 0 0.2rem;
    font-size: 1rem;
    line-height: 1.35;
}

.rsilms-event-title a {
    color: var(--text-color);
    text-decoration: none;
}

.rsilms-event-title a:hover,
.rsilms-event-title a:focus {
    color: var(--primary-color);
}

.rsilms-event-meta {
    margin: 0 0 0.2rem;
    color: var(--primary-color);
    font-size: 0.82rem;
    font-weight: 600;
}

.rsilms-event-excerpt {
    margin: 0;
    color: var(--text-light);
    font-size: 0.86rem;
    line-height: 1.45;
}

.rsilms-event-link {
    color: var(--accent-color);
    font-weight: 700;
    font-size: 0.85rem;
    text-decoration: none;
    white-space: nowrap;
}

.rsilms-event-link:hover,
.rsilms-event-link:focus {
    text-decoration: underline;
}

@media (max-width: 640px) {
    .rsilms-event {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .rsilms-event-link {
        grid-column: 2;
        justify-self: start;
    }
}