/*
 * Svasti Classroom Companion
 * Independent CSS override layer.
 *
 * Put future visual customizations in this file instead of editing Core.
 * Keep selectors scoped to .scc-, .svasti- or companion-specific classes.
 */

/* Companion-owned lock emblem: retain the lotus identity. */
.scc-sequence-lock-spark {
    font-family: "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
}

/* Responsive safety for companion-added controls. */
.svasti-companion-control,
.svasti-companion-control * {
    box-sizing: border-box;
}


/* Session category tabs on My Performance */
.scc-performance .scc-companion-session-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 18px 0 16px;
    padding: 7px;
    border: 1px solid rgba(226, 184, 99, .38);
    border-radius: 15px;
    background: rgba(5, 20, 42, .78);
    box-shadow: 0 8px 22px rgba(0,0,0,.18);
}
.scc-performance .scc-companion-tab {
    appearance: none;
    border: 1px solid rgba(221, 199, 151, .22);
    border-radius: 11px;
    padding: 12px 17px;
    background: rgba(28, 49, 78, .72);
    color: #e6edf7;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    flex: 1 1 150px;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.scc-performance .scc-companion-tab:hover {
    border-color: rgba(247, 207, 111, .65);
    color: #fff3d2;
}
.scc-performance .scc-companion-tab.is-active {
    background: linear-gradient(135deg, #f2d28b, #d9a64b);
    border-color: #f2d28b;
    color: #182b43;
    box-shadow: 0 5px 16px rgba(0,0,0,.18);
}
.scc-performance .scc-companion-tab-panel[hidden] { display: none !important; }
.scc-performance .scc-companion-tab-panel > .sccp-panel:first-child { margin-top: 0; }
.scc-performance .scc-companion-empty { margin: 12px 0 18px; }
@media (max-width: 600px) {
    .scc-performance .scc-companion-session-tabs { gap: 6px; padding: 5px; }
    .scc-performance .scc-companion-tab { flex: 1 1 100%; padding: 11px 10px; font-size: 13px; }
}


/* Compact chapter-only cards for Upcoming and Completed. */
.scc-performance .scc-companion-chapter-card {
    display: flex;
    align-items: center;
    min-height: 58px;
    margin: 9px 0;
    padding: 15px 18px;
    border: 1px solid rgba(196, 160, 95, .48);
    border-radius: 14px;
    background: linear-gradient(105deg, rgba(18, 43, 75, .96), rgba(13, 31, 58, .94));
    box-shadow: 0 6px 18px rgba(0,0,0,.16);
}
.scc-performance .scc-companion-chapter-name {
    color: #fff0c9;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.4;
}
.scc-performance .scc-companion-coverage {
    margin-top: 18px;
}
.scc-performance .scc-companion-coverage-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 9px;
    border-radius: 20px;
    background: rgba(241, 195, 91, .16);
    border: 1px solid rgba(241, 195, 91, .45);
    color: #ffdc91;
    font-weight: 800;
}
.scc-performance .scc-companion-coverage-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.scc-performance .scc-companion-coverage-item {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 13px 15px;
    border: 1px solid rgba(177, 196, 220, .22);
    border-radius: 12px;
    background: rgba(9, 29, 54, .76);
}
.scc-performance .scc-companion-coverage-item strong {
    color: #fff0c9;
    font-size: 15px;
}
.scc-performance .scc-companion-coverage-item span {
    color: #d6e0ef;
    font-size: 12px;
}
.scc-performance .scc-companion-coverage-item small {
    color: #c4a96e;
    font-size: 11px;
}
@media(max-width:600px) {
    .scc-performance .scc-companion-chapter-card { min-height: 52px; padding: 13px 14px; }
    .scc-performance .scc-companion-chapter-name { font-size: 14px; }
    .scc-performance .scc-companion-coverage-list { grid-template-columns: 1fr; }
}