/* ==========================================================================
   Assam Rifles Public School, Udaipur — admin panel theme
   Palette sampled from the school crest:
     crest field  #A5104C   gold lettering #F5C518
     cyan border  #29ABE2   lotus magenta  #E8459B
   ========================================================================== */

:root {
    --ar-crimson:        #a5104c;
    --ar-crimson-dark:   #7a0a38;
    --ar-crimson-darker: #5a0727;
    --ar-crimson-light:  #c4276a;
    --ar-gold:           #f5c518;
    --ar-gold-dark:      #c99e0c;
    --ar-cyan:           #29abe2;
    --ar-magenta:        #e8459b;

    --ar-ink:            #24131b;
    --ar-muted:          #7a6a71;
    --ar-line:           #ead8e0;
    --ar-surface:        #ffffff;
    --ar-canvas:         #f7f2f4;

    --ar-radius:         .65rem;
    --ar-shadow:         0 1px 2px rgba(90, 7, 39, .06), 0 4px 16px rgba(90, 7, 39, .07);
    --ar-shadow-lg:      0 8px 40px rgba(90, 7, 39, .16);

    --bs-body-font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Bootstrap variable overrides ------------------------------------------- */
:root {
    --bs-primary:        #a5104c;
    --bs-primary-rgb:    165, 16, 76;
    --bs-link-color:     #a5104c;
    --bs-link-color-rgb: 165, 16, 76;
    --bs-link-hover-color: #7a0a38;
    --bs-border-radius:  .65rem;
}

body {
    background: var(--ar-canvas);
    color: var(--ar-ink);
    font-size: .925rem;
}

/* ==========================================================================
   Buttons / badges
   ========================================================================== */

.btn-primary {
    --bs-btn-bg: var(--ar-crimson);
    --bs-btn-border-color: var(--ar-crimson);
    --bs-btn-hover-bg: var(--ar-crimson-dark);
    --bs-btn-hover-border-color: var(--ar-crimson-dark);
    --bs-btn-active-bg: var(--ar-crimson-darker);
    --bs-btn-active-border-color: var(--ar-crimson-darker);
    --bs-btn-disabled-bg: var(--ar-crimson-light);
    --bs-btn-disabled-border-color: var(--ar-crimson-light);
}

.btn-outline-primary {
    --bs-btn-color: var(--ar-crimson);
    --bs-btn-border-color: var(--ar-crimson);
    --bs-btn-hover-bg: var(--ar-crimson);
    --bs-btn-hover-border-color: var(--ar-crimson);
    --bs-btn-active-bg: var(--ar-crimson-dark);
    --bs-btn-active-border-color: var(--ar-crimson-dark);
}

.btn-gold {
    --bs-btn-color: var(--ar-crimson-darker);
    --bs-btn-bg: var(--ar-gold);
    --bs-btn-border-color: var(--ar-gold);
    --bs-btn-hover-color: var(--ar-crimson-darker);
    --bs-btn-hover-bg: var(--ar-gold-dark);
    --bs-btn-hover-border-color: var(--ar-gold-dark);
    --bs-btn-focus-shadow-rgb: 245, 197, 24;
    font-weight: 600;
}

.badge-crimson { background: var(--ar-crimson); color: #fff; }
.badge-gold    { background: var(--ar-gold);    color: var(--ar-crimson-darker); }
.badge-cyan    { background: var(--ar-cyan);    color: #fff; }

.form-control:focus,
.form-select:focus {
    border-color: var(--ar-crimson-light);
    box-shadow: 0 0 0 .2rem rgba(165, 16, 76, .15);
}

.form-check-input:checked {
    background-color: var(--ar-crimson);
    border-color: var(--ar-crimson);
}

/* ==========================================================================
   App shell
   ========================================================================== */

.ar-shell { min-height: 100vh; }

.ar-sidebar {
    width: 264px;
    flex: 0 0 264px;
    background: linear-gradient(175deg, var(--ar-crimson) 0%, var(--ar-crimson-dark) 55%, var(--ar-crimson-darker) 100%);
    color: #fff;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    border-right: 3px solid var(--ar-gold);
}

.ar-brand {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1.15rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.ar-brand img { width: 44px; height: auto; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .35)); }

.ar-brand-text  { line-height: 1.2; }
.ar-brand-title { color: var(--ar-gold); font-weight: 700; font-size: .875rem; letter-spacing: .02em; }
.ar-brand-sub   { color: rgba(255, 255, 255, .72); font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }

.ar-nav { padding: .75rem .625rem; }

/* Collapsible category heading — a full-width toggle button. */
.ar-nav-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: none;
    border: 0;
    text-align: left;
    cursor: pointer;
    color: rgba(255, 255, 255, .5);
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    padding: .8rem .75rem .35rem;
    font-weight: 600;
}

.ar-nav-heading:hover { color: rgba(255, 255, 255, .85); }

.ar-nav-caret {
    font-size: .7rem;
    transition: transform .2s ease;
}

.ar-nav-group.is-open .ar-nav-caret { transform: rotate(180deg); }

/* Collapsed by default; opened by the .is-open class on the group. The large
   max-height comfortably clears any group and animates smoothly. */
.ar-nav-items {
    overflow: hidden;
    max-height: 0;
    transition: max-height .25s ease;
}

.ar-nav-group.is-open > .ar-nav-items { max-height: 600px; }

/* Dashboard sits above the collapsible groups as a plain link. */
.ar-nav-standalone { margin-bottom: .25rem; }

.ar-nav a {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .58rem .75rem;
    color: rgba(255, 255, 255, .85);
    text-decoration: none;
    border-radius: .5rem;
    font-size: .875rem;
    transition: background .15s ease, color .15s ease;
}

.ar-nav a:hover { background: rgba(255, 255, 255, .1); color: #fff; }

.ar-nav a.active {
    background: var(--ar-gold);
    color: var(--ar-crimson-darker);
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}

.ar-nav a i { font-size: 1.05rem; }

/* Topbar ------------------------------------------------------------------ */

.ar-topbar {
    background: var(--ar-surface);
    border-bottom: 1px solid var(--ar-line);
    padding: .7rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    position: sticky;
    top: 0;
    z-index: 1020;
}

.ar-page-title { font-size: 1.05rem; font-weight: 650; margin: 0; color: var(--ar-crimson-dark); }
.ar-page-sub   { font-size: .78rem; color: var(--ar-muted); margin: 0; }

.ar-avatar {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--ar-crimson);
    color: var(--ar-gold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: .8rem;
    flex: 0 0 36px;
}

.ar-main { padding: 1.5rem; flex: 1 1 auto; min-width: 0; }

/* The column holding the topbar and main content.
   A flex item defaults to min-width:auto, which lets wide content — the
   student table, the column chart — stretch the whole page sideways instead
   of scrolling inside its own container. This is what keeps that in check;
   it is not decorative. */
.ar-shell > .ar-content { min-width: 0; }

/* Bootstrap grid columns are flex items too, and need the same treatment. */
.ar-main .row > [class*="col-"] { min-width: 0; }

/* ==========================================================================
   Cards / sections
   ========================================================================== */

.ar-card {
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-radius: var(--ar-radius);
    box-shadow: var(--ar-shadow);
}

.ar-card-head {
    padding: .8rem 1.1rem;
    border-bottom: 1px solid var(--ar-line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.ar-card-head h2,
.ar-card-head h3 {
    font-size: .95rem;
    font-weight: 650;
    margin: 0;
    color: var(--ar-crimson-dark);
    display: flex;
    align-items: center;
    gap: .5rem;
}

.ar-card-body { padding: 1.1rem; }

/* Numbered form section header, mirrors the paper form's 1–4 grouping. */
.ar-section-badge {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: var(--ar-crimson);
    color: var(--ar-gold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .78rem;
    font-weight: 700;
    flex: 0 0 26px;
}

/* Stat tiles -------------------------------------------------------------- */

.ar-stat {
    background: var(--ar-surface);
    border: 1px solid var(--ar-line);
    border-left: 4px solid var(--ar-crimson);
    border-radius: var(--ar-radius);
    padding: .95rem 1.1rem;
    box-shadow: var(--ar-shadow);
    height: 100%;
}

.ar-stat--gold  { border-left-color: var(--ar-gold); }
.ar-stat--cyan  { border-left-color: var(--ar-cyan); }
.ar-stat--pink  { border-left-color: var(--ar-magenta); }

.ar-stat-label {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--ar-muted);
    font-weight: 600;
}

.ar-stat-value { font-size: 1.75rem; font-weight: 700; line-height: 1.15; color: var(--ar-ink); }
.ar-stat-icon  { font-size: 1.6rem; color: var(--ar-crimson); opacity: .3; }

/* Column chart ------------------------------------------------------------
   Vertical bars, one per class. Bars grow from a shared baseline so the
   heights stay comparable; the colour deepens with the class, which encodes
   seniority rather than repeating the value.
   -------------------------------------------------------------------------*/

.ar-colchart {
    display: flex;
    align-items: flex-end;
    gap: clamp(.4rem, 2vw, 1.1rem);
    padding: .5rem .25rem 0;
    overflow-x: auto;
    min-height: 232px;
}

.ar-colchart__col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    flex: 1 1 42px;
    min-width: 42px;
}

.ar-colchart__value {
    font-size: .82rem;
    font-weight: 700;
    color: var(--ar-crimson-dark);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.ar-colchart__value--zero { color: var(--ar-muted); font-weight: 600; }

/* Fixed-height track so every bar shares one baseline. */
.ar-colchart__track {
    width: 100%;
    height: 150px;
    display: flex;
    align-items: flex-end;
    background: linear-gradient(var(--ar-line) 1px, transparent 1px) 0 0 / 100% 30px;
    border-bottom: 2px solid var(--ar-line);
    border-radius: 2px;
}

.ar-colchart__bar {
    width: 100%;
    border-radius: 4px 4px 0 0;
    min-height: 3px;
    transition: filter .15s ease;
}

.ar-colchart__col:hover .ar-colchart__bar { filter: brightness(1.12); }

.ar-colchart__label {
    font-size: .7rem;
    font-weight: 600;
    color: var(--ar-ink);
    text-align: center;
    line-height: 1.2;
    word-break: break-word;
}

.ar-colchart__total {
    font-size: .64rem;
    color: var(--ar-muted);
    font-variant-numeric: tabular-nums;
}

@media (max-width: 575.98px) {
    .ar-colchart__track { height: 112px; }
    .ar-colchart { min-height: 192px; }
}

/* Donut chart -------------------------------------------------------------
   Drawn with a conic-gradient rather than a charting library, so the page
   stays self-contained under the app's own Content-Security-Policy.
   -------------------------------------------------------------------------*/

.ar-donut-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.ar-donut {
    position: relative;
    width: 168px;
    height: 168px;
    border-radius: 50%;
    flex: none;
    box-shadow: inset 0 0 0 1px rgba(90, 7, 39, .08);
}

/* The hole. Uses the card surface so it reads as a donut, not a grey disc. */
.ar-donut::after {
    content: "";
    position: absolute;
    inset: 27%;
    background: var(--ar-surface);
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(90, 7, 39, .06);
}

.ar-donut__centre {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 1;
    line-height: 1.1;
}

.ar-donut__centre strong {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--ar-ink);
    font-variant-numeric: tabular-nums;
}

.ar-donut__centre span {
    font-size: .62rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--ar-muted);
    font-weight: 600;
}

.ar-legend { width: 100%; display: grid; gap: .3rem; }

.ar-legend__row {
    display: grid;
    grid-template-columns: 12px 1fr auto auto;
    align-items: center;
    gap: .5rem;
    font-size: .82rem;
    padding: .18rem .1rem;
}

.ar-legend__swatch { width: 12px; height: 12px; border-radius: 3px; }
.ar-legend__label  { color: var(--ar-ink); }
.ar-legend__count  { font-weight: 700; font-variant-numeric: tabular-nums; }
.ar-legend__pct    { color: var(--ar-muted); font-size: .74rem; font-variant-numeric: tabular-nums; min-width: 44px; text-align: right; }

/* Tables ------------------------------------------------------------------ */

.ar-table { margin: 0; }

.ar-table > thead > tr > th {
    background: #fbf5f8;
    color: var(--ar-crimson-dark);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 650;
    border-bottom: 2px solid var(--ar-line);
    white-space: nowrap;
    padding: .6rem .75rem;
}

.ar-table > tbody > tr > td { padding: .6rem .75rem; vertical-align: middle; }
.ar-table > tbody > tr:hover { background: #fdf8fa; }

.ar-thumb {
    width: 38px; height: 38px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--ar-gold);
    background: var(--ar-canvas);
}

.ar-thumb-placeholder {
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--ar-canvas);
    border: 2px solid var(--ar-line);
    color: var(--ar-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .72rem;
    font-weight: 650;
}

/* Definition rows on the profile view ------------------------------------- */

.ar-dl { display: grid; grid-template-columns: minmax(150px, 34%) 1fr; gap: 0; }

.ar-dl > dt,
.ar-dl > dd {
    padding: .5rem .25rem;
    border-bottom: 1px solid var(--ar-line);
    margin: 0;
}

.ar-dl > dt { color: var(--ar-muted); font-size: .78rem; font-weight: 600; }
.ar-dl > dd { font-size: .875rem; word-break: break-word; }

/* ==========================================================================
   Login screen
   ========================================================================== */

.ar-login {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: var(--ar-canvas);
}

.ar-login-aside {
    background:
        radial-gradient(circle at 20% 15%, rgba(232, 69, 155, .28), transparent 55%),
        radial-gradient(circle at 85% 80%, rgba(41, 171, 226, .22), transparent 50%),
        linear-gradient(160deg, var(--ar-crimson) 0%, var(--ar-crimson-dark) 60%, var(--ar-crimson-darker) 100%);
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2.5rem;
}

.ar-login-aside img {
    width: 168px;
    height: auto;
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, .45));
    margin-bottom: 1.5rem;
}

.ar-login-aside h1 {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--ar-gold);
    letter-spacing: .02em;
    margin-bottom: .4rem;
}

.ar-login-aside p { color: rgba(255, 255, 255, .8); font-size: .875rem; max-width: 34ch; margin: 0 auto; }

.ar-login-aside .ar-rule {
    width: 64px;
    height: 3px;
    background: var(--ar-gold);
    border-radius: 2px;
    margin: 1.1rem auto;
}

.ar-login-form { display: flex; align-items: center; justify-content: center; padding: 2rem; }
.ar-login-box  { width: 100%; max-width: 380px; }

.ar-login-box .ar-mobile-crest { display: none; }

@media (max-width: 860px) {
    .ar-login { grid-template-columns: 1fr; }
    .ar-login-aside { display: none; }
    .ar-login-box .ar-mobile-crest { display: block; text-align: center; margin-bottom: 1.25rem; }
    .ar-login-box .ar-mobile-crest img { width: 96px; }
}

/* ==========================================================================
   Responsive shell
   ========================================================================== */

@media (max-width: 991.98px) {
    .ar-sidebar {
        position: fixed;
        left: 0; top: 0;
        z-index: 1045;
        transform: translateX(-100%);
        transition: transform .2s ease;
    }
    .ar-sidebar.open { transform: translateX(0); box-shadow: var(--ar-shadow-lg); }
    .ar-backdrop {
        position: fixed; inset: 0;
        background: rgba(36, 19, 27, .5);
        z-index: 1040;
    }
    .ar-main { padding: 1rem; }
    .ar-dl { grid-template-columns: 1fr; }
    .ar-dl > dt { border-bottom: 0; padding-bottom: 0; }
}

@media (min-width: 992px) {
    .ar-sidebar-toggle, .ar-backdrop { display: none !important; }
}

/* Wide content must scroll inside its own container, never the page. */
.ar-scroll-x { overflow-x: auto; }


/* ==========================================================================
   Notice board & gallery
   ========================================================================== */

/* Step-selection panels on the notice board. */
.ar-pickbox {
    background: var(--ar-canvas);
    border: 1px solid var(--ar-line);
    border-radius: 8px;
    padding: .75rem .85rem;
}

.ar-pickbox .form-label { font-size: .8rem; font-weight: 600; margin-bottom: .35rem; }

.ar-pickbox__note {
    margin-top: .6rem;
    padding: .45rem .6rem;
    background: #fff;
    border: 1px solid var(--ar-line);
    border-radius: 6px;
    font-size: .82rem;
    color: var(--ar-muted);
}

.ar-pickbox__note strong { color: var(--ar-crimson); }

/* The editable record, once a notice is chosen. */
.ar-itembox {
    border: 1px solid var(--ar-line);
    border-left: 3px solid var(--ar-gold);
    border-radius: 8px;
    padding: 1rem;
    background: #fdfdfd;
}

.ar-empty-note {
    padding: 1rem;
    background: var(--ar-canvas);
    border: 1px dashed var(--ar-line);
    border-radius: 8px;
    color: var(--ar-muted);
    font-size: .875rem;
}

.ar-attachment {
    color: var(--ar-crimson);
    font-weight: 600;
    text-decoration: none;
    font-size: .875rem;
}

.ar-attachment:hover { text-decoration: underline; }

/* Danger-framed card, for destructive sections. */
.ar-card--danger { border-color: #e9b8c4; }
.ar-card--danger > .ar-card-head { background: #fdf3f6; }

/* --- Gallery ----------------------------------------------------------- */

.ar-tree { font-size: .85rem; max-height: 60vh; overflow-y: auto; }

.ar-tree__root {
    font-weight: 700;
    color: var(--ar-crimson-dark);
    padding: .3rem .4rem .5rem;
    border-bottom: 1px solid var(--ar-line);
    margin-bottom: .35rem;
}

.ar-tree__row {
    display: block;
    padding: .3rem .5rem;
    border-radius: 5px;
    color: var(--ar-ink);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ar-tree__row:hover { background: var(--ar-canvas); color: var(--ar-crimson); }

.ar-tree__row.is-current {
    background: var(--ar-crimson);
    color: #fff;
    font-weight: 600;
}

.ar-photo {
    border: 1px solid var(--ar-line);
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.ar-photo img {
    width: 100%;
    height: 130px;
    object-fit: cover;
    display: block;
    background: var(--ar-canvas);
}

.ar-photo__foot { padding: .5rem; margin-top: auto; }

/* --- Allocation screens ------------------------------------------------- */

/* Numbered step marker on a field label. */
.ar-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-right: .35rem;
    border-radius: 50%;
    background: var(--ar-crimson);
    color: var(--ar-gold);
    font-size: .72rem;
    font-weight: 700;
}

.ar-checkgrid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .6rem;
}

.ar-checkgrid__item {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    background: #fff;
    border: 1px solid var(--ar-line);
    border-radius: 6px;
    padding: .55rem .7rem;
    font-size: .875rem;
    cursor: pointer;
    margin: 0;
}

.ar-checkgrid--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.ar-checkgrid__item:hover { border-color: var(--ar-crimson-light); }

.ar-checkgrid__item:has(input:checked) {
    border-color: var(--ar-crimson);
    background: #fdf4f7;
}

.ar-teacher-row {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .6rem .25rem;
    border-bottom: 1px solid var(--ar-line);
    cursor: pointer;
    margin: 0;
}

.ar-teacher-row:last-child { border-bottom: 0; }

.ar-teacher-row__name { display: block; font-weight: 600; font-size: .9rem; }

.ar-teacher-row__code { display: block; color: var(--ar-muted); font-size: .76rem; }

@media (max-width: 900px) {
    .ar-checkgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 540px) {
    .ar-checkgrid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Allocation reports
   ========================================================================== */

/* Report tab bar across the top of the page. */
.ar-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    border-bottom: 2px solid var(--ar-crimson);
    margin-bottom: 1rem;
}

.ar-tabs__tab {
    padding: .6rem 1rem;
    font-size: .9rem;
    font-weight: 600;
    color: var(--ar-muted);
    text-decoration: none;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: .45rem .45rem 0 0;
    margin-bottom: -2px;
}

.ar-tabs__tab:hover { color: var(--ar-crimson); background: var(--ar-canvas); }

.ar-tabs__tab.is-active {
    color: var(--ar-crimson-dark);
    background: var(--ar-surface);
    border-color: var(--ar-crimson);
    border-bottom: 2px solid var(--ar-surface);
}

/* Subject chip. */
.ar-chip {
    display: inline-block;
    padding: .3rem .6rem;
    border-radius: 5px;
    background: #fdf4f7;
    border: 1px solid var(--ar-line);
    color: var(--ar-crimson-dark);
    font-size: .8rem;
}

/* Exam heading bar inside the exam-subject report. */
.ar-exam-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    background: var(--ar-canvas);
    border-left: 4px solid var(--ar-crimson);
    padding: .5rem .75rem;
    margin-bottom: .5rem;
    font-weight: 600;
    font-size: .9rem;
}

.ar-exam-bar__code { color: var(--ar-crimson); font-size: .78rem; }

/* Report tables: crimson header, zebra rows. */
.ar-report-table thead th {
    background: var(--ar-crimson);
    color: #fff;
    font-weight: 600;
    font-size: .82rem;
    border-color: var(--ar-crimson);
}

.ar-report-table tbody td { font-size: .85rem; }

/* Printed letterhead — hidden on screen, shown on paper. */
.ar-report-head { display: none; }

.ar-report-meta {
    background: #fff;
    border: 1px solid var(--ar-line);
    border-left: 3px solid var(--ar-gold);
    border-radius: 6px;
    padding: .55rem .8rem;
    font-size: .85rem;
}

/* ==========================================================================
   Print — student profile sheet

   The screen page and the printed sheet are separate blocks of markup in
   students/show.blade.php driven by the same data. Printing swaps one for
   the other rather than trying to squeeze the dashboard onto A4.
   ========================================================================== */

.ar-sheet { display: none; }

@media print {

    @page { size: A4 portrait; margin: 12mm 11mm 10mm; }

    .ar-sidebar,
    .ar-topbar,
    .ar-no-print,
    .ar-screen,
    .ar-shell > .ar-content > footer,
    .modal,
    .modal-backdrop { display: none !important; }

    html, body {
        background: #fff !important;
        color: #000;
        font-size: 9.5pt;
        line-height: 1.35;
    }

    .ar-shell, .ar-content, .ar-main {
        display: block !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: none !important;
    }

    .ar-sheet {
        display: block;
        font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
        color: #111;
    }

    /* --- Letterhead --------------------------------------------------- */

    .ar-sheet-head {
        display: flex;
        align-items: center;
        gap: 10px;
        padding-bottom: 6px;
        border-bottom: 2.5px solid var(--ar-crimson);
        margin-bottom: 3mm;
    }

    .ar-sheet-crest { width: 17mm; height: auto; flex: 0 0 auto; }

    .ar-sheet-titles { flex: 1 1 auto; text-align: center; }

    .ar-sheet-titles h1 {
        margin: 0;
        font-size: 16pt;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: var(--ar-crimson-dark);
    }

    .ar-sheet-place {
        margin: 1px 0 0;
        font-size: 8.5pt;
        letter-spacing: .28em;
        text-transform: uppercase;
        color: #6b6b6b;
    }

    .ar-sheet-doc {
        margin: 3px 0 0;
        font-size: 9.5pt;
        font-weight: 600;
        letter-spacing: .1em;
        text-transform: uppercase;
    }

    .ar-sheet-ref {
        flex: 0 0 auto;
        text-align: right;
        border: 1px solid #bbb;
        border-radius: 3px;
        padding: 3px 7px;
        line-height: 1.2;
    }

    .ar-sheet-ref span {
        display: block;
        font-size: 6.5pt;
        letter-spacing: .1em;
        text-transform: uppercase;
        color: #777;
    }

    .ar-sheet-ref strong { font-size: 10.5pt; font-family: Consolas, monospace; }

    /* --- Identity strip ----------------------------------------------- */

    .ar-sheet-identity {
        display: flex;
        gap: 5mm;
        align-items: flex-start;
        margin-bottom: 4mm;
        break-inside: avoid;
    }

    .ar-sheet-photo {
        flex: 0 0 26mm;
        width: 26mm;
        height: 32mm;
        border: 1px solid #999;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        background: #fff;
    }

    .ar-sheet-photo img { width: 100%; height: 100%; object-fit: cover; }

    .ar-sheet-photo span {
        font-size: 7pt;
        color: #999;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    .ar-sheet-idfields { flex: 1 1 auto; min-width: 0; }

    .ar-sheet-name {
        font-size: 13pt;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .02em;
        color: var(--ar-crimson-dark);
        border-bottom: 1px solid #ddd;
        padding-bottom: 2px;
        margin-bottom: 3px;
    }

    .ar-sheet-idtable { width: 100%; border-collapse: collapse; table-layout: fixed; }

    .ar-sheet-idtable th,
    .ar-sheet-idtable td {
        padding: 1.6px 4px;
        vertical-align: top;
        text-align: left;
        border-bottom: 1px dotted #d5d5d5;
    }

    .ar-sheet-idtable th {
        width: 21%;
        font-size: 7.5pt;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: .04em;
        color: #6b6b6b;
    }

    .ar-sheet-idtable td { width: 29%; font-size: 9.5pt; font-weight: 600; }

    .ar-sheet-break { word-break: break-all; font-weight: 400 !important; }

    /* --- Detail sections, flowing down two columns --------------------- */

    .ar-sheet-cols {
        column-count: 2;
        column-gap: 7mm;

    }

    .ar-sheet-block {
        break-inside: avoid;
        margin-bottom: 4mm;
    }

    .ar-sheet-block h2 {
        margin: 0 0 2px;
        padding: 2px 5px;
        font-size: 8.5pt;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase;
        color: #fff;
        background: var(--ar-crimson);
        border-radius: 2px;
        /* Print dialogs drop backgrounds unless asked not to. */
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .ar-sheet-table { width: 100%; border-collapse: collapse; table-layout: fixed; }

    .ar-sheet-table th,
    .ar-sheet-table td {
        padding: 1.5px 5px;
        vertical-align: top;
        text-align: left;
        border-bottom: 1px dotted #d8d8d8;
        overflow-wrap: break-word;
    }

    .ar-sheet-table th {
        width: 46%;
        font-size: 8pt;
        font-weight: 500;
        color: #5c5c5c;
    }

    .ar-sheet-table td { font-size: 8.5pt; font-weight: 600; color: #000; }

    .ar-sheet-blockrow th {
        width: auto;
        padding-top: 3px;
        border-bottom: 0;
    }

    .ar-sheet-blockrow td {
        font-weight: 500;
        padding-bottom: 3px;
        line-height: 1.3;
    }

    /* --- Verification, signatures, footer ------------------------------ */

    .ar-sheet-verify {
        break-inside: avoid;
        margin-top: 2mm;
        padding: 3px 6px;
        font-size: 8.5pt;
        border: 1px solid #cfcfcf;
        border-left: 3px solid var(--ar-gold);
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .ar-sheet-signs {
        display: flex;
        justify-content: space-between;
        gap: 8mm;
        margin-top: 14mm;
        break-inside: avoid;
    }

    .ar-sheet-signs div {
        flex: 1 1 0;
        text-align: center;
        font-size: 8pt;
        letter-spacing: .05em;
        text-transform: uppercase;
        color: #444;
    }

    .ar-sheet-signs span {
        display: block;
        border-top: 1px solid #666;
        margin-bottom: 2px;
    }

    /* Other pages still print sensibly, just without the sheet chrome. */
    .ar-card { border: 1px solid #999; box-shadow: none; break-inside: avoid; }

    .ar-sheet-foot {
        margin-top: 5mm;
        padding-top: 2px;
        border-top: 1px solid #ddd;
        font-size: 7pt;
        text-align: center;
        color: #888;
    }

    /* --- Allocation reports on paper -------------------------------- */

    .ar-report-head {
        display: flex !important;
        align-items: center;
        gap: 12px;
        border-bottom: 2px solid var(--ar-crimson);
        padding-bottom: 8px;
        margin-bottom: 10px;
    }

    .ar-report-head img { width: 20mm; height: auto; }

    .ar-report-head h1 {
        margin: 0;
        font-size: 16pt;
        font-weight: 700;
        color: var(--ar-crimson-dark);
    }

    .ar-report-head p { margin: 2px 0 0; font-size: 10pt; color: #444; }

    .ar-report-meta {
        border: 0;
        border-radius: 0;
        padding: 0 0 8px;
        font-size: 9pt;
    }

    .ar-report .ar-card-head {
        background: transparent;
        border-bottom: 1px solid #ccc;
        padding: 2mm 0;
    }

    .ar-report .ar-card-head h2 { font-size: 12pt; color: var(--ar-crimson-dark); }

    .ar-report,
    .ar-report .ar-exam-block { break-inside: avoid; }

    .ar-report-table { width: 100%; border-collapse: collapse; }

    .ar-report-table th,
    .ar-report-table td {
        border: 1px solid #bbb;
        padding: 4px 6px;
        font-size: 8.5pt;
    }

    .ar-report-table thead th {
        background: var(--ar-crimson) !important;
        color: #fff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    .ar-report-table thead { display: table-header-group; }

    .ar-exam-bar {
        background: var(--ar-canvas) !important;
        border-left: 3px solid var(--ar-crimson);
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        font-size: 9.5pt;
    }

    .ar-chip {
        background: #fdf4f7 !important;
        border: 1px solid #ddd;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}