/* Marksheet template pages (MarksheetPageView / MarksheetTableView). Global so print styles and the designer share it. */
.ms-page {
    position: relative;
    background: #fff;
    color: #111;
    overflow: hidden;
    box-sizing: border-box;
    margin: 0 auto;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .18);
}

    .ms-page *, .ms-page *::before, .ms-page *::after {
        box-sizing: border-box;
    }

.ms-background {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: fill;
    z-index: 0;
    pointer-events: none;
}

.ms-el {
    position: absolute;
}

    .ms-el.ms-selected {
        outline: 2px dashed #1976d2;
        outline-offset: 1px;
    }

.ms-fill {
    width: 100%;
    height: 100%;
}

.ms-text {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    white-space: pre-wrap;
    overflow: hidden;
    word-break: break-word;
}

.ms-table {
    border-collapse: collapse;
    table-layout: fixed;
}

    .ms-table th, .ms-table td {
        border: 1px solid var(--ms-border, #222);
        text-align: center;
        vertical-align: middle;
        padding: 0 1mm;
        overflow: hidden;
    }

    .ms-table th {
        font-weight: 700;
    }

    .ms-table td {
        font-weight: 700;
    }

    .ms-table th.ms-subject {
        white-space: nowrap;
    }

    .ms-table .ms-rotated {
        writing-mode: vertical-rl;
        transform: rotate(180deg);
        white-space: nowrap;
        display: inline-block;
    }

    .ms-table .ms-exempted {
        font-size: .78em;
        font-weight: 500;
        color: #5E2181;
    }

    .ms-table td.ms-result {
        line-height: 1.5;
        padding: 2mm;
    }

/* Info table: label / value rows (attendance, conduct, rank...). */
.ms-info {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

    .ms-info th, .ms-info td {
        border: 1px solid var(--ms-border, #222);
        padding: 0 1.5mm;
        vertical-align: middle;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .ms-info td.ms-info-label {
        font-weight: 600;
    }

    .ms-info td.ms-info-value {
        font-weight: 700;
        text-align: center;
    }

    .ms-info th.ms-info-title {
        font-weight: 700;
        text-align: center;
    }

.ms-print-list .ms-page {
    margin-bottom: 8mm;
}

@media print {
    .ms-page {
        box-shadow: none;
        margin: 0;
    }

    .ms-print-list .ms-page {
        margin: 0;
        break-after: page;
        page-break-after: always;
    }

    .ms-el.ms-selected {
        outline: none;
    }
}

/* Designer: empty picture (stamp spot before upload). */
.ms-empty-image {
    width: 100%;
    height: 100%;
    border: 1px dashed #90a4ae;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8pt;
    color: #78909c;
}

@media print {
    .ms-empty-image {
        display: none;
    }
}

/* Designer: drag cursor and the resize handle of the selected element. */
[data-ms-page="edit"] .ms-el {
    cursor: move;
    user-select: none;
}

.ms-handle {
    position: absolute;
    right: -2mm;
    bottom: -2mm;
    width: 3.2mm;
    height: 3.2mm;
    background: #1976d2;
    border: 1px solid #fff;
    border-radius: 50%;
    cursor: nwse-resize;
    z-index: 10000;
}

@media print {
    .ms-handle {
        display: none;
    }
}