/* ui3-reports.css: the reports app pages (reports.html) in the 2026 look.
   New ui only: every rule is scoped under :root[data-ui="new"]. Sizes in px (root font-size differs per app). */

/* ============================== shared page parts (components/R3.js) ============================== */
:root[data-ui="new"] .r3-page { gap: 16px; min-width: 0; }
:root[data-ui="new"] .r3-head .a3-sub > span { white-space: nowrap; }
:root[data-ui="new"] .r3-head-act { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
:root[data-ui="new"] .r3-page h2 { font-family: inherit; }

/* the filter card: labels above the controls, a responsive grid */
:root[data-ui="new"] .r3-filters { padding: 16px 18px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
:root[data-ui="new"] .r3-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px 16px; align-items: end; }
:root[data-ui="new"] .r3-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; font-weight: 400; color: #12233f; }
:root[data-ui="new"] .r3-label { font-size: 13px; font-weight: 600; color: #4a5a73; line-height: 1.3; }
:root[data-ui="new"] .r3-field select.form-control,
:root[data-ui="new"] .r3-field input.form-control {
    width: 100% !important; max-width: none; height: 44px; margin: 0 !important; padding: 0 12px; font-size: 14px; font-weight: 500;
    background-color: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 12px !important;
}
:root[data-ui="new"] .r3-field select.form-control:focus,
:root[data-ui="new"] .r3-field input.form-control:focus { border-color: #175bb0 !important; box-shadow: 0 0 0 3px rgba(23, 91, 176, .16) !important; }
:root[data-ui="new"] .r3-static { display: flex; align-items: center; height: 44px; font-size: 15px; font-weight: 700; color: #12233f; }
/* a date of InputDate (button_only) as a 44px field */
:root[data-ui="new"] .r3-date .widget-wrapper { display: block; width: 100%; }
:root[data-ui="new"] .r3-date .widget-wrapper > .btn {
    width: 100%; height: 44px; display: flex; align-items: center; justify-content: flex-start; gap: 8px; padding: 0 12px !important;
    background: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 12px !important; box-shadow: none !important;
    color: #12233f !important; font-size: 14px; font-weight: 500; transform: none !important; font-variant-numeric: tabular-nums;
}
:root[data-ui="new"] .r3-date .widget-wrapper > .btn:hover { border-color: #175bb0 !important; }
:root[data-ui="new"] .r3-date .widget-wrapper > .btn .glyphicon { top: 0; font-size: 13px; color: #5b6b85; }
:root[data-ui="new"] .r3-date .widget-inner { z-index: 30; }

/* checkbox groups as pill toggles (RadioBox with classes '.r3-pills') */
:root[data-ui="new"] .r3-pills { margin: 0; white-space: normal; text-align: start; }
:root[data-ui="new"] .r3-pills .checkboxes { display: flex; flex-wrap: wrap; gap: 8px; border: 0; min-height: 0; padding: 0; }
:root[data-ui="new"] .r3-pills .checkboxes > .clearfix { display: none; }
:root[data-ui="new"] .r3-pills .checkboxes label {
    position: relative; float: none; display: inline-flex; align-items: center; min-height: 38px; margin: 0; padding: 0 14px;
    border-radius: 999px; border: 1px solid #dfe8f4; background: #fff; color: #4a5a73; font-size: 14px; font-weight: 500; cursor: pointer; white-space: nowrap;
}
:root[data-ui="new"] .r3-pills .checkboxes label:hover { border-color: #b9d3f4; background: #f4f8fe; color: #114591; }
:root[data-ui="new"] .r3-pills .checkboxes label.selected { background: #e6efff; border-color: #b9d3f4; color: #114591; font-weight: 700; }
:root[data-ui="new"] .r3-pills .checkboxes label input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
:root[data-ui="new"] .r3-pills .checkboxes label:has(input:focus-visible) { outline: 2px solid #175bb0; outline-offset: 2px; }

/* the filter card's action row */
:root[data-ui="new"] .r3-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding-top: 14px; border-top: 1px solid #eef2f8; }
:root[data-ui="new"] .btn.r3-go {
    height: 44px; padding: 0 20px !important; border-radius: 12px !important; display: inline-flex; align-items: center; gap: 8px; margin: 0;
    background: #175bb0 !important; border: 1px solid #175bb0 !important; color: #fff !important; font-size: 15px; font-weight: 700;
    box-shadow: 0 8px 18px rgba(23, 91, 176, .28) !important; filter: none !important; transform: none !important;
}
:root[data-ui="new"] .btn.r3-go:hover { background: #114591 !important; border-color: #114591 !important; }
:root[data-ui="new"] .btn.r3-go[disabled] { background: #eef3fa !important; border-color: #dfe8f4 !important; color: #5b6b85 !important; box-shadow: none !important; opacity: 1; cursor: default; font-weight: 600; }
:root[data-ui="new"] .btn.r3-go .glyphicon { top: 0; font-size: 13px; }
:root[data-ui="new"] .btn.r3-go:focus-visible { outline: 2px solid #175bb0 !important; outline-offset: 2px !important; }

/* the results card + its toolbar */
:root[data-ui="new"] .r3-results { padding: 16px 18px; min-width: 0; }
:root[data-ui="new"] .r3-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 0 0 14px; }
:root[data-ui="new"] .r3-bar-tx { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
:root[data-ui="new"] .r3-bar h2 { margin: 0; font-size: 18px; font-weight: 800; color: #12233f; line-height: 1.3; }
:root[data-ui="new"] .r3-bar-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-inline-start: auto; }
:root[data-ui="new"] .r3-tool,
:root[data-ui="new"] .btn.r3-tool-btn {
    display: inline-flex; align-items: center; gap: 6px; height: 38px; margin: 0 !important; padding: 0 12px !important; border-radius: 999px !important;
    background: #fff !important; border: 1px solid #dfe8f4 !important; color: #4a5a73 !important; box-shadow: none !important; filter: none !important; transform: none !important;
    font-family: inherit; font-size: 13px; font-weight: 600; line-height: 1; cursor: pointer; white-space: nowrap; text-decoration: none !important;
}
:root[data-ui="new"] .r3-tool:hover,
:root[data-ui="new"] .btn.r3-tool-btn:hover { border-color: #b9d3f4 !important; background: #f4f8fe !important; color: #114591 !important; }
:root[data-ui="new"] .r3-tool:focus-visible,
:root[data-ui="new"] .btn.r3-tool-btn:focus-visible { outline: 2px solid #175bb0 !important; outline-offset: 2px !important; }
:root[data-ui="new"] .r3-tool .glyphicon,
:root[data-ui="new"] .btn.r3-tool-btn .glyphicon { top: 0; font-size: 12px; }
:root[data-ui="new"] .r3-check {
    display: inline-flex; align-items: center; gap: 6px; height: 38px; margin: 0; padding: 0 12px; border-radius: 999px;
    border: 1px solid #dfe8f4; background: #fff; color: #4a5a73; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
:root[data-ui="new"] .r3-check:hover { border-color: #b9d3f4; color: #114591; }
:root[data-ui="new"] .r3-check:has(input:checked) { background: #e6efff; border-color: #b9d3f4; color: #114591; }
:root[data-ui="new"] .r3-check input { margin: 0; flex-shrink: 0; }
:root[data-ui="new"] .r3-check:has(input:focus-visible) { outline: 2px solid #175bb0; outline-offset: 2px; }
:root[data-ui="new"] .r3-menu { position: relative; display: inline-block; text-align: start; }
:root[data-ui="new"] .r3-menu .info-menu-in .h6 { margin: 12px 0 6px; font-size: 13px; font-weight: 700; color: #4a5a73; }
:root[data-ui="new"] .r3-menu .info-menu-in .checkboxes { border: 1px solid #eef2f8; border-radius: 12px; padding: 4px; }
:root[data-ui="new"] .r3-menu .info-menu-in .checkboxes label { border-radius: 8px; padding: 6px 8px; font-weight: 500; }
:root[data-ui="new"] .r3-menu .info-menu-in { padding: 14px 16px !important; border-radius: 16px !important; box-shadow: 0 10px 24px rgba(16, 42, 92, .14) !important; min-width: 260px; }

/* the report tables: a quiet header, 48px rows, hairline separators, scroll inside the card */
:root[data-ui="new"] .r3-scroll { overflow: auto; max-height: min(72vh, 900px); border: 1px solid #eef2f8; border-radius: 14px; -webkit-overflow-scrolling: touch; }
:root[data-ui="new"] table.r3-table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 0; background: #fff; font-size: 14px; color: #12233f; font-variant-numeric: tabular-nums; }
:root[data-ui="new"] table.r3-table > thead > tr > th {
    position: sticky; top: 0; z-index: 2; background: #f7f9fc; color: #4a5a73; font-size: 13px; font-weight: 600; line-height: 1.3;
    padding: 12px; text-align: start; white-space: nowrap; border: 0; border-bottom: 1px solid #dfe8f4; vertical-align: bottom;
}
:root[data-ui="new"] table.r3-table > tbody > tr > td { height: 48px; padding: 6px 12px; border: 0; border-bottom: 1px solid #eef2f8; vertical-align: middle; background: #fff; }
:root[data-ui="new"] table.r3-table > tbody > tr:last-child > td { border-bottom: 0; }
:root[data-ui="new"] table.r3-table > tbody > tr:hover > td { background: #f7f9fc; }
:root[data-ui="new"] table.r3-table th.r3-sortable { cursor: pointer; user-select: none; }
:root[data-ui="new"] table.r3-table th.r3-sortable:hover { color: #114591; }
:root[data-ui="new"] table.r3-table .r3-num { text-align: center; }
:root[data-ui="new"] table.r3-table > thead > tr > th.sorted { background: #e6efff; color: #114591; }
:root[data-ui="new"] table.r3-table > tbody > tr > td.sorted { background: #f4f8fe; }
:root[data-ui="new"] table.r3-table td.stname { font-weight: 600; white-space: nowrap; }
/* the totals row stays at the bottom of the scroll box */
:root[data-ui="new"] table.r3-table tr.tfoot > th {
    position: sticky; bottom: 0; z-index: 2; background: #eef5ff; color: #114591; font-size: 13px; font-weight: 700;
    padding: 10px 12px; border: 0; border-top: 1px solid #dfe8f4; white-space: nowrap;
}

/* empty / prompt state */
:root[data-ui="new"] .r3-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 36px 18px; text-align: center; }
:root[data-ui="new"] .r3-empty-ico { width: 40px; height: 40px; border-radius: 50%; background: #e6efff; color: #114591; display: flex; align-items: center; justify-content: center; margin-bottom: 6px; }
:root[data-ui="new"] .r3-empty-l { font-size: 15px; font-weight: 600; color: #12233f; line-height: 1.4; }
:root[data-ui="new"] .r3-empty-h { font-size: 13px; color: #5b6b85; line-height: 1.4; }

/* ============================== לוח בקרה - בקרת אירועים והערכות (#!/dashboard, DashContainer a3 + DashRoleStatus) ============================== */
:root[data-ui="new"] .r3-dc { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
:root[data-ui="new"] .r3-dc-filters { padding: 16px 18px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
:root[data-ui="new"] .r3-dc-title { margin: 0; font-family: inherit; font-size: 17px; font-weight: 800; color: #12233f; line-height: 1.3; }
:root[data-ui="new"] .r3-dc-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 20px; }
:root[data-ui="new"] .r3-dc-role { flex: 0 1 240px; }
:root[data-ui="new"] .r3-dc-dates { flex: 1 1 300px; }
:root[data-ui="new"] .r3-dc-range {
    display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; min-height: 44px; padding: 6px 12px; border-radius: 12px;
    background: #f7f9fc; border: 1px solid #eef2f8; font-size: 14px; font-weight: 600; color: #12233f; line-height: 1.4;
}
:root[data-ui="new"] .r3-dc-sep { color: #8090a8; font-weight: 400; }
:root[data-ui="new"] .r3-dc-nav { display: flex; align-items: center; gap: 8px; }
:root[data-ui="new"] .r3-dc-nav .r3-tool { height: 44px; padding: 0 14px !important; }
:root[data-ui="new"] .r3-dc-nav .r3-tool[disabled] { opacity: .45; cursor: default; background: #fff !important; border-color: #dfe8f4 !important; color: #4a5a73 !important; }
:root[data-ui="new"] .r3-dc-nav select.form-control {
    width: 76px !important; height: 44px; margin: 0 !important; padding: 0 10px; font-size: 15px; font-weight: 700; text-align: center;
    background-color: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 12px !important;
}
:root[data-ui="new"] .r3-dc-nav select.form-control:focus { border-color: #175bb0 !important; box-shadow: 0 0 0 3px rgba(23, 91, 176, .16) !important; }
:root[data-ui="new"] .r3-dc-body { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
:root[data-ui="new"] .r3-dc-body > .a3-kpis { margin: 0; }
/* the 31px loading gif: a column flex item is stretched to the full width (and its height with it) */
:root[data-ui="new"] .r3-dc-body > img.loader { align-self: center; }
/* the section cards */
:root[data-ui="new"] .r3-ds-card .r3-bar { margin: 0; }
:root[data-ui="new"] .r3-ds-card .r3-bar + * { margin-top: 14px; }
:root[data-ui="new"] .r3-ds-card .r3-empty { padding: 14px 18px 6px; }
:root[data-ui="new"] .r3-ds-n {
    min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: #175bb0; color: #fff;
    font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center;
}
:root[data-ui="new"] .r3-ds-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
:root[data-ui="new"] .r3-ds-tile {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 48px; padding: 8px 14px; border-radius: 12px;
    background: #f4f8fe; border: 1px solid transparent; color: #12233f; font-family: inherit; font-size: 14px; font-weight: 500; text-align: start; cursor: pointer;
}
:root[data-ui="new"] .r3-ds-tile:hover { border-color: #b9d3f4; background: #eef5ff; color: #114591; }
:root[data-ui="new"] .r3-ds-tile:focus-visible { outline: 2px solid #175bb0; outline-offset: 2px; }
:root[data-ui="new"] .r3-ds-tile > b { font-size: 17px; font-weight: 800; color: #114591; font-variant-numeric: tabular-nums; }
/* the assessments table */
:root[data-ui="new"] .r3-ds-scroll { max-height: none; position: relative; }
:root[data-ui="new"] .r3-ds-table > thead > tr > th { position: static; }
:root[data-ui="new"] .r3-ds-table > tbody > tr > td { white-space: nowrap; }
:root[data-ui="new"] .r3-ds-table td.r3-ds-subj { font-weight: 600; }
:root[data-ui="new"] .r3-ds-table td.r3-ds-date { line-height: 1.3; }
:root[data-ui="new"] .r3-ds-table td.r3-ds-date > b { display: block; font-weight: 600; }
:root[data-ui="new"] .r3-ds-table td.r3-ds-date > span { display: block; font-size: 12px; color: #5b6b85; }
:root[data-ui="new"] .r3-ds-table td.r3-ds-act { width: 1%; text-align: end; }
:root[data-ui="new"] .r3-ds-pct {
    display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 999px; border: 0; cursor: pointer;
    background: #e6efff; color: #114591; font-family: inherit; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums;
}
:root[data-ui="new"] .r3-ds-pct:hover { background: #d6e5fb; }
:root[data-ui="new"] .r3-ds-pct:focus-visible { outline: 2px solid #175bb0; outline-offset: 2px; }
:root[data-ui="new"] .r3-ds-edit.r3-tool { height: 32px; padding: 0 10px !important; font-size: 12px; }

@media (max-width: 767px) {
    :root[data-ui="new"] .r3-dc-filters { padding: 14px; }
    :root[data-ui="new"] .r3-dc-row { flex-direction: column; align-items: stretch; }
    :root[data-ui="new"] .r3-dc-role,
    :root[data-ui="new"] .r3-dc-dates,
    :root[data-ui="new"] .r3-dc-period { flex: 0 0 auto; }
    :root[data-ui="new"] .r3-dc-nav .r3-tool { flex: 1 1 0; justify-content: center; }
    :root[data-ui="new"] .r3-ds-tiles { grid-template-columns: minmax(0, 1fr); }
    :root[data-ui="new"] .r3-ds-card .r3-bar-tools { width: 100%; }
    :root[data-ui="new"] .r3-ds-edit.r3-tool { height: 40px; }
    :root[data-ui="new"] .r3-ds-pct { height: 34px; }
}

/* ============================== דוח אירועים והערות (#!/lesson-events) ============================== */
:root[data-ui="new"] .r3-le-table td.r3-has { font-weight: 700; color: #114591; }
:root[data-ui="new"] .r3-le-table > thead > tr > th.r3-num { min-width: 64px; }
/* the student column stays in view while the event columns scroll sideways */
:root[data-ui="new"] .r3-le-table > tbody > tr > td.stname { position: sticky; inset-inline-start: 0; z-index: 1; }
:root[data-ui="new"] .r3-le-table > thead > tr > th:first-child { inset-inline-start: 0; z-index: 3; }
:root[data-ui="new"] .r3-le-table tr.tfoot > th:first-child { inset-inline-start: 0; z-index: 3; }
:root[data-ui="new"] .r3-le-table td.remarks ul { list-style: none; margin: 0; padding: 4px 0; }
:root[data-ui="new"] .r3-le-table td.remarks li { padding: 3px 0; line-height: 1.45; }
:root[data-ui="new"] .r3-le-table td.remarks .datetime { color: #5b6b85; font-size: 12px; font-weight: 600; unicode-bidi: isolate; }
:root[data-ui="new"] .r3-le-table canvas.chart { max-width: 100%; }
/* the toolbar parts: the student search + the legend, numbers / percents as a segmented bar */
:root[data-ui="new"] .r3-le-find { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 12px; }
:root[data-ui="new"] .r3-le-find .a3-search { flex: 0 1 300px; height: 42px; background: #f7f9fc; border-radius: 12px; }
:root[data-ui="new"] .r3-le-find .a3-search input { -webkit-appearance: none; appearance: none; font-family: inherit; }
:root[data-ui="new"] .r3-le-hint { font-size: 12.5px; color: #5b6b85; }
:root[data-ui="new"] .r3-le-seg { gap: 3px; padding: 3px; border: 0; border-radius: 12px; background: #f4f7fb; }
:root[data-ui="new"] .r3-le-seg .a3-seg-b { height: 32px; padding: 0 13px; font-size: 13.5px; }
:root[data-ui="new"] .r3-le-seg .a3-seg-b[aria-pressed="true"] { background: #fff; color: #114591; box-shadow: 0 1px 3px rgba(16, 42, 92, .12); }
/* the matrix: event-type tags in a white sticky header, the names sticky on the start side, a chip per count
   (tinted, solid from 3), a grey dot for none, the totals row at the bottom */
:root[data-ui="new"] table.r3-le-mx > thead > tr > th { background: #fff; padding: 8px 4px; border-bottom: 1px solid #dfe8f4; vertical-align: middle; }
:root[data-ui="new"] table.r3-le-mx > thead > tr > th:first-child { padding: 8px 12px; min-width: 170px; }
:root[data-ui="new"] table.r3-le-mx > thead > tr > th.sorted { background: #fff; }
:root[data-ui="new"] table.r3-le-mx > thead > tr > th.le-h { min-width: 96px; text-align: center; }
:root[data-ui="new"] .le-th { margin: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; }
:root[data-ui="new"] .le-th:hover { color: #114591; }
:root[data-ui="new"] .le-tag {
    display: inline-flex; align-items: center; justify-content: center; gap: 5px; width: 100%; min-width: 84px; height: 30px; padding: 0 8px; margin: 0;
    border: 0; border-radius: 10px; font-family: inherit; font-size: 12.5px; font-weight: 700; line-height: 1; white-space: nowrap; cursor: pointer;
}
:root[data-ui="new"] .le-tag.red { background: #fde6e8; color: #b0202d; }
:root[data-ui="new"] .le-tag.amber { background: #fff1df; color: #8a4a00; }
:root[data-ui="new"] .le-tag.mint { background: #dcf5ee; color: #0a6f5d; }
:root[data-ui="new"] .le-tag.sky { background: #e6efff; color: #114591; }
:root[data-ui="new"] th.sorted .le-tag { box-shadow: inset 0 0 0 2px currentColor; }
:root[data-ui="new"] :is(.le-th, .le-tag):focus-visible { outline: 2px solid #175bb0; outline-offset: 2px; }
:root[data-ui="new"] table.r3-le-mx > tbody > tr > td.stname { font-size: 14px; font-weight: 700; border-inline-end: 1px solid #eef2f8; }
:root[data-ui="new"] table.r3-le-mx > tbody > tr > td.le-c { height: 44px; padding: 3px; text-align: center; }
:root[data-ui="new"] .le-dot { display: inline-block; width: 6px; height: 6px; border-radius: 999px; background: #d5deea; vertical-align: middle; }
:root[data-ui="new"] .le-n {
    display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 34px; padding: 0 6px; box-sizing: border-box;
    border-radius: 10px; font-size: 14.5px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums;
}
:root[data-ui="new"] .le-n.red { background: #fde6e8; color: #b0202d; }
:root[data-ui="new"] .le-n.amber { background: #fff1df; color: #8a4a00; }
:root[data-ui="new"] .le-n.mint { background: #dcf5ee; color: #0a6f5d; }
:root[data-ui="new"] .le-n.sky { background: #e6efff; color: #114591; }
:root[data-ui="new"] .le-n.strong { color: #fff; }
:root[data-ui="new"] .le-n.red.strong { background: #b0202d; }
:root[data-ui="new"] .le-n.amber.strong { background: #8a4a00; }
:root[data-ui="new"] .le-n.mint.strong { background: #0a6f5d; }
:root[data-ui="new"] .le-n.sky.strong { background: #114591; }
:root[data-ui="new"] table.r3-le-mx tr.tfoot > th { background: #f7f9fc; color: #12233f; font-size: 15px; font-weight: 800; text-align: center; }
:root[data-ui="new"] table.r3-le-mx tr.tfoot > th:first-child { font-size: 13.5px; text-align: start; }
:root[data-ui="new"] .r3-le-table td.le-none { padding: 24px 16px; text-align: center; color: #5b6b85; }
@media print {
    :root[data-ui="new"] .le-n { min-width: 0; height: auto; padding: 0; background: none !important; color: #000 !important; }
    :root[data-ui="new"] .le-tag { width: auto; height: auto; padding: 0; background: none !important; color: #000 !important; }
    :root[data-ui="new"] .le-tag .p3-ico { display: none; }
}

@media (max-width: 767px) {
    :root[data-ui="new"] .r3-filters,
    :root[data-ui="new"] .r3-results { padding: 14px; }
    :root[data-ui="new"] .r3-grid,
    :root[data-ui="new"] .r3-page .r3-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    :root[data-ui="new"] .r3-pills .checkboxes label { min-height: 44px; }
    :root[data-ui="new"] .r3-actions .btn.r3-go { width: 100%; justify-content: center; height: 48px; white-space: normal; }
    :root[data-ui="new"] .r3-tool,
    :root[data-ui="new"] .btn.r3-tool-btn,
    :root[data-ui="new"] .r3-check { height: 44px; }
    :root[data-ui="new"] .r3-bar-tools { margin-inline-start: 0; }
    :root[data-ui="new"] .r3-scroll { max-height: none; }
    :root[data-ui="new"] table.r3-table > thead > tr > th { position: static; }
    :root[data-ui="new"] table.r3-table tr.tfoot > th { position: static; }
    :root[data-ui="new"] .r3-le-table > thead > tr > th:first-child,
    :root[data-ui="new"] .r3-le-table tr.tfoot > th:first-child { position: sticky; }
}

@media print {
    :root[data-ui="new"] .r3-bar-tools { display: none !important; }
    :root[data-ui="new"] .r3-scroll { max-height: none; overflow: visible; border: 0; }
    :root[data-ui="new"] table.r3-table > thead > tr > th,
    :root[data-ui="new"] table.r3-table tr.tfoot > th,
    :root[data-ui="new"] table.r3-table td.stname { position: static; }
}

/* ============================== דוח ציונים שוטפים (#!/assesments) ============================== */
:root[data-ui="new"] .r3-ar-table > thead > tr > th { white-space: pre-line; text-align: center; min-width: 96px; }
:root[data-ui="new"] .r3-ar-table > thead > tr > th:nth-child(-n+2) { text-align: start; min-width: 0; }
:root[data-ui="new"] .r3-ar-table > thead > tr > th small { font-size: 12px; font-weight: 500; color: #5b6b85; }
:root[data-ui="new"] .r3-ar-table td.num { width: 44px; min-width: 44px; color: #8090a8; font-size: 12px; text-align: center; }
:root[data-ui="new"] .r3-ar-table > thead > tr > th.num { width: 44px; min-width: 44px; }
:root[data-ui="new"] .r3-ar-table td.stname sup { color: #5b6b85; font-weight: 500; top: 0; font-size: 12px; }
/* # and the name stay in view while the assessment columns scroll sideways */
:root[data-ui="new"] .r3-ar-table td.num,
:root[data-ui="new"] .r3-ar-table td.stname { position: sticky; z-index: 1; }
:root[data-ui="new"] .r3-ar-table td.num,
:root[data-ui="new"] .r3-ar-table > thead > tr > th:first-child { inset-inline-start: 0; }
:root[data-ui="new"] .r3-ar-table td.stname,
:root[data-ui="new"] .r3-ar-table > thead > tr > th:nth-child(2) { inset-inline-start: 44px; }
:root[data-ui="new"] .r3-ar-table > thead > tr > th:nth-child(-n+2) { z-index: 3; }
/* a score painted by the school's markers reads as a chip inside its cell */
:root[data-ui="new"] .r3-ar-table td.r3-mark,
:root[data-ui="new"] .r3-dist-table td.diff-scores {
    box-shadow: inset 0 0 0 6px #fff; border-radius: 14px; font-weight: 700; color: #12233f;
    background-image: linear-gradient(rgba(255, 255, 255, .62), rgba(255, 255, 255, .62)) !important;
}
:root[data-ui="new"] .r3-ar-table td.r3-none { color: #b7c2d3; }
:root[data-ui="new"] .r3-ar-table .r3-avg { border-inline-start: 1px solid #dfe8f4 !important; font-weight: 800; }
:root[data-ui="new"] .r3-ar-table .aremark { color: #5b6b85; font-weight: 500; }
:root[data-ui="new"] .r3-ar-table tr.tfoot > th { vertical-align: top; font-weight: 600; }
:root[data-ui="new"] .r3-ar-table tr.tfoot ul { list-style: none; margin: 0; padding: 0; }
:root[data-ui="new"] .r3-ar-table tr.tfoot li { font-size: 12px; line-height: 1.5; }
:root[data-ui="new"] .r3-dist-table > thead > tr > th { text-align: center; }
:root[data-ui="new"] .r3-dist-table > thead > tr:first-child > th:first-child { text-align: start; vertical-align: middle; }
:root[data-ui="new"] .r3-dist-table > thead > tr + tr > th { top: 41px; font-size: 12px; font-weight: 500; padding: 6px 12px; }
:root[data-ui="new"] .r3-dist-table td.diff-scores { text-align: center; min-width: 64px; }
:root[data-ui="new"] .r3-dist-table td:first-child { white-space: pre-line; }
:root[data-ui="new"] .r3-dist-table td:first-child small { color: #5b6b85; font-size: 12px; }

/* the score-range marker widget (MarkerForm) as a toolbar button + popover */
:root[data-ui="new"] .r3-bar-tools > .widget-wrapper { position: relative; }
:root[data-ui="new"] .r3-bar-tools > .widget-wrapper > .btn {
    display: inline-flex; align-items: center; gap: 6px; height: 38px; margin: 0 !important; padding: 0 12px !important; border-radius: 999px !important;
    background: #fff !important; border: 1px solid #dfe8f4 !important; color: #4a5a73 !important; box-shadow: none !important; transform: none !important;
    font-size: 13px; font-weight: 600; line-height: 1;
}
:root[data-ui="new"] .r3-bar-tools > .widget-wrapper > .btn:hover { border-color: #b9d3f4 !important; background: #f4f8fe !important; color: #114591 !important; }
:root[data-ui="new"] .r3-bar-tools > .widget-wrapper > .btn .glyphicon { top: 0; font-size: 12px; }
:root[data-ui="new"] .r3-bar-tools > .widget-wrapper > .widget-inner {
    left: 0; right: auto; top: calc(100% + 8px); z-index: 40; padding: 12px; border: 1px solid #dfe8f4; border-radius: 16px;
    background: #fff; box-shadow: 0 10px 24px rgba(16, 42, 92, .14); min-width: 260px;
}

/* ============================== דוח ציונים תקופתיים (#!/periodical-scores) ============================== */
/* the classic inline group borders become hairlines */
:root[data-ui="new"] .r3-ps-table th,
:root[data-ui="new"] .r3-ps-table td { border-left: 0 !important; border-right: 0 !important; }
:root[data-ui="new"] .r3-ps-table [style*="border-right"] { border-right: 1px solid #dfe8f4 !important; }
:root[data-ui="new"] .r3-ps-table [style*="border-left"] { border-left: 1px solid #dfe8f4 !important; }
:root[data-ui="new"] .r3-ps-table > thead > tr:first-child > th { height: 42px; padding-top: 0; padding-bottom: 0; vertical-align: middle; }
:root[data-ui="new"] .r3-ps-table > thead > tr + tr > th { top: 42px; cursor: pointer; text-align: center; }
:root[data-ui="new"] .r3-ps-table > thead > tr + tr > th:first-child { text-align: start; }
:root[data-ui="new"] .r3-ps-table th[colspan] {
    border-top: 0 !important; border-bottom: 2px solid currentColor !important; text-align: center; font-size: 14px; font-weight: 700;
}
:root[data-ui="new"] .r3-ps-table > thead > tr:first-child > th[colspan] { border-left: 0 !important; border-right: 0 !important; }
:root[data-ui="new"] .r3-ps-table > tbody > tr > td { text-align: center; }
:root[data-ui="new"] .r3-ps-table > tbody > tr > td.stname { text-align: start; position: sticky; inset-inline-start: 0; z-index: 1; }
:root[data-ui="new"] .r3-ps-table > thead > tr > th:first-child { inset-inline-start: 0; z-index: 3; }
:root[data-ui="new"] .r3-ps-table td[style*="background"] {
    box-shadow: inset 0 0 0 6px #fff; border-radius: 14px; font-weight: 700; color: #12233f;
    background-image: linear-gradient(rgba(255, 255, 255, .62), rgba(255, 255, 255, .62)) !important;
}
:root[data-ui="new"] .r3-ps-table > tbody > tr > td[style*="border-left"] { font-weight: 800; }
:root[data-ui="new"] .r3-ps-table > tfoot > tr > th {
    background: #f7f9fc; color: #4a5a73; font-size: 12px; font-weight: 600; padding: 10px 12px; border-top: 1px solid #eef2f8; text-align: center; vertical-align: top;
}
:root[data-ui="new"] .r3-ps-table > tfoot > tr.tfoot > th { background: #eef5ff; color: #114591; }
:root[data-ui="new"] .r3-ps-table > tfoot ul { list-style: none; margin: 0; padding: 0; }
:root[data-ui="new"] .r3-ps-table > tfoot li { line-height: 1.5; white-space: nowrap; }
:root[data-ui="new"] .r3-dist-table > thead > tr > th[style*="background"] {
    background-image: linear-gradient(rgba(255, 255, 255, .62), rgba(255, 255, 255, .62)) !important; color: #12233f;
}

/* ============================== דוח מקצועי יום הורים (#!/combined) ============================== */
:root[data-ui="new"] .r3-cr-table > thead > tr > th { min-width: 150px; }
:root[data-ui="new"] .r3-cr-table > thead > tr > th:first-child { min-width: 0; inset-inline-start: 0; z-index: 3; }
:root[data-ui="new"] .r3-cr-table > tbody > tr > td { vertical-align: top; padding-top: 10px; padding-bottom: 10px; font-size: 13px; }
:root[data-ui="new"] .r3-cr-table > tbody > tr > td.stname { position: sticky; inset-inline-start: 0; z-index: 1; font-size: 14px; }
:root[data-ui="new"] .r3-cr-table .nowrap { white-space: normal; }
:root[data-ui="new"] table.r3-mini { width: 100%; border-collapse: collapse; margin: 0; background: transparent; }
:root[data-ui="new"] table.r3-mini > tbody > tr > td,
:root[data-ui="new"] table.r3-mini > tbody > tr > .asses { padding: 3px 0; border: 0; font-size: 13px; line-height: 1.45; vertical-align: top; }
:root[data-ui="new"] table.r3-mini > tbody > tr + tr > td,
:root[data-ui="new"] table.r3-mini > tbody > tr + tr > .asses { border-top: 1px solid #eef2f8; }
:root[data-ui="new"] .r3-cr-table .datetime { color: #5b6b85; font-size: 12px; font-weight: 600; unicode-bidi: isolate; }
:root[data-ui="new"] .r3-cr-table strong.score,
:root[data-ui="new"] .r3-cr-table strong.graded { color: #114591; }
:root[data-ui="new"] .r3-cr-table .remark { color: #5b6b85; }
:root[data-ui="new"] .r3-cr-table sup { top: 0; font-size: 11px; color: #5b6b85; }

/* ============================== התלמידים שלי (#!/students) ============================== */
/* the student search on the end of the page head */
:root[data-ui="new"] .r3-my .r3-head-act { flex: 0 1 380px; min-width: 0; }
:root[data-ui="new"] .r3-my-search { flex: 1 1 320px; margin: 0 !important; text-align: start; position: relative; }
:root[data-ui="new"] .r3-my-search .combo-wrapper { flex: 1; min-width: 0; display: flex; align-items: center; gap: 6px; }
:root[data-ui="new"] .r3-my-search .combo-wrapper > input.form-control {
    flex: 1; min-width: 0; width: auto; height: 40px !important; padding: 0 !important; margin: 0; border: 0 !important; border-radius: 0 !important;
    background: transparent !important; box-shadow: none !important; font-size: 14px; font-weight: 400;
}
:root[data-ui="new"] .r3-my-search .combo-wrapper > .btn {
    height: 30px; margin: 0; padding: 0 10px !important; border-radius: 999px !important; background: #f1f4f9 !important; border: 0 !important;
    color: #4a5a73 !important; font-size: 12px; font-weight: 600; box-shadow: none !important; transform: none !important;
}
:root[data-ui="new"] .r3-my .combo-wrapper-menu {
    top: calc(100% + 10px); min-width: 100%; padding: 6px; border: 1px solid #dfe8f4; border-radius: 14px; background: #fff;
    box-shadow: 0 10px 24px rgba(16, 42, 92, .14); z-index: 60;
}
:root[data-ui="new"] .r3-my .combo-wrapper-menu .option { padding: 8px 10px; border-radius: 10px; font-size: 14px; }
:root[data-ui="new"] .r3-my .combo-wrapper-menu .option:hover { background: #f4f8fe; color: #114591; }
/* the lists as cards */
:root[data-ui="new"] .r3-my > .table-responsive,
:root[data-ui="new"] .r3-my .dash-wrapper.panel {
    background: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 20px !important; box-shadow: none !important; margin: 0; overflow: visible;
}
:root[data-ui="new"] .r3-my > .table-responsive { padding: 4px 18px 10px; overflow-x: auto; }
:root[data-ui="new"] .r3-my .dash-wrapper.panel:hover { box-shadow: none !important; }
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-heading {
    background: transparent !important; border-bottom: 1px solid #eef2f8 !important; padding: 14px 18px !important; font-weight: 400; font-size: 14px; border-radius: 20px 20px 0 0;
}
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-heading > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-heading > div > strong { font-size: 17px; font-weight: 800; color: #12233f; }
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-heading em { color: #5b6b85; font-size: 13px; font-style: normal; }
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-heading select.form-control { height: 36px; padding: 0 10px; font-size: 14px; display: inline-block; width: auto; }
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-heading .clearfix { display: none; }
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-body { padding: 4px 18px 12px !important; }
:root[data-ui="new"] .r3-my .dash-wrapper > .panel-body > .table-responsive { border: 0; margin: 0; overflow-x: auto; }
:root[data-ui="new"] .r3-my table.table { width: 100%; margin: 0; background: transparent; font-size: 14px; color: #12233f; }
:root[data-ui="new"] .r3-my table.table > thead > tr > th[colspan] {
    background: transparent !important; border: 0 !important; color: #12233f !important; font-size: 17px; font-weight: 800; padding: 14px 6px 8px !important; text-align: start;
}
:root[data-ui="new"] .r3-my table.table > tbody > tr,
:root[data-ui="new"] .r3-my table.table > tbody > tr.selected { background: transparent !important; }
:root[data-ui="new"] .r3-my table.table > tbody > tr > td { padding: 7px 6px !important; border-top: 0 !important; border-bottom: 1px solid #eef2f8; vertical-align: middle; white-space: nowrap; }
:root[data-ui="new"] .r3-my table.table > tbody > tr:last-child > td { border-bottom: 0; }
:root[data-ui="new"] .r3-my table.table > tbody > tr:hover > td { background: #f7f9fc; }
:root[data-ui="new"] .r3-my table.table > tbody > tr > td:first-child { font-weight: 600; }
/* a grade / whole-school row reads as a section row */
:root[data-ui="new"] .r3-my table.table > tbody > tr:has(> td[colspan] > strong) > td { padding-top: 16px !important; padding-bottom: 8px !important; border-bottom-color: #dfe8f4; }
:root[data-ui="new"] .r3-my table.table > tbody > tr:has(> td[colspan] > strong):hover > td { background: transparent; }
:root[data-ui="new"] .r3-my table.table > tbody > tr > td[colspan] > strong { font-size: 15px; font-weight: 800; color: #12233f; }
:root[data-ui="new"] .r3-my table.table > tbody > tr > td[colspan="1"] { color: #5b6b85; font-weight: 400; }
:root[data-ui="new"] .r3-my table.table > tbody > tr > td[colspan="1"] > strong { color: #114591; font-weight: 700; font-size: 14px; }
/* the row actions: quiet pills, the student cards one soft sky */
:root[data-ui="new"] .r3-my td .btn,
:root[data-ui="new"] .r3-my .search-student .btn {
    display: inline-flex; align-items: center; gap: 6px; height: 34px; margin: 0 !important; padding: 0 12px !important; border-radius: 999px !important;
    background: #fff !important; border: 1px solid #dfe8f4 !important; color: #4a5a73 !important; box-shadow: none !important; filter: none !important; transform: none !important;
    font-size: 13px; font-weight: 600; line-height: 1; float: none !important;
}
:root[data-ui="new"] .r3-my td .btn:hover,
:root[data-ui="new"] .r3-my .search-student .btn:hover { border-color: #b9d3f4 !important; background: #f4f8fe !important; color: #114591 !important; }
:root[data-ui="new"] .r3-my td .btn.btn-primary { background: #e6efff !important; border-color: #e6efff !important; color: #114591 !important; font-weight: 700; }
:root[data-ui="new"] .r3-my td .btn.btn-primary:hover { background: #d6e5fb !important; border-color: #d6e5fb !important; }
:root[data-ui="new"] .r3-my td .btn .glyphicon,
:root[data-ui="new"] .r3-my .search-student .btn .glyphicon { top: 0; font-size: 12px; }
:root[data-ui="new"] .r3-my td .btn:focus-visible { outline: 2px solid #175bb0 !important; outline-offset: 2px !important; }
/* a class's study groups, opened under its row */
:root[data-ui="new"] .r3-my td.subgroups { padding: 4px 0 10px !important; white-space: normal; }
:root[data-ui="new"] .r3-my td.subgroups > .table-responsive { background: #f7f9fc; border: 1px solid #eef2f8; border-radius: 14px; padding: 2px 12px 6px; margin: 0; }
:root[data-ui="new"] .r3-my table.class-studygroups > thead > tr > th[colspan] { font-size: 14px; font-weight: 700; padding: 10px 6px 6px !important; }
:root[data-ui="new"] .r3-my table.class-studygroups > tbody > tr:hover > td { background: #fff; }
:root[data-ui="new"] .r3-my .actbtn { cursor: pointer; color: #114591; margin-inline-end: 6px; top: 1px; }
:root[data-ui="new"] .r3-my table.tbl-sub-groups { margin-top: 6px; }
/* the archive search */
:root[data-ui="new"] .r3-my .search-student.pull-left { float: none !important; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 0 0; margin: 0; }

@media (max-width: 767px) {
    :root[data-ui="new"] .r3-my .r3-head-act { flex: 1 1 100%; }
    :root[data-ui="new"] .r3-my > .table-responsive { padding: 2px 12px 8px; }
    :root[data-ui="new"] .r3-my .dash-wrapper > .panel-heading { padding: 12px 14px !important; }
    :root[data-ui="new"] .r3-my .dash-wrapper > .panel-body { padding: 4px 12px 10px !important; }
    :root[data-ui="new"] .r3-my td .btn { height: 40px; }
}

/* ============================== כרטיסי תלמידים (#!/students/class/:g/:s) ============================== */
:root[data-ui="new"] .r3-sv-pick { padding: 14px 18px; min-width: 0; }
:root[data-ui="new"] .r3-sv-pick .r3-bar { margin-bottom: 12px; }
:root[data-ui="new"] .r3-sv-names { display: flex; flex-wrap: wrap; gap: 8px; }
:root[data-ui="new"] .r3-sv-name {
    height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid #dfe8f4; background: #fff; color: #12233f;
    font-family: inherit; font-size: 14px; font-weight: 500; cursor: pointer; white-space: nowrap;
}
:root[data-ui="new"] .r3-sv-name:hover { border-color: #b9d3f4; background: #f4f8fe; color: #114591; }
:root[data-ui="new"] .r3-sv-name.current-student { background: #175bb0; border-color: #175bb0; color: #fff; font-weight: 700; }
:root[data-ui="new"] .r3-sv-name:focus-visible { outline: 2px solid #175bb0; outline-offset: 2px; }
:root[data-ui="new"] .r3-sv-select { max-width: 360px; }
:root[data-ui="new"] .r3-sv .student-details { min-height: 0; }

/* ============================== כרטיס תלמיד (StudentFile - #!/student/:id and inside the two lists) ============================== */
:root[data-ui="new"] .r3-sf { display: flex; flex-direction: column; gap: 16px; color: #12233f; min-width: 0; }
:root[data-ui="new"] .r3-sf > .student-data-wrapper { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 0 18px; align-items: start; }
:root[data-ui="new"] .r3-sf > .student-data-wrapper > .student-base { grid-column: 1; grid-row: 1 / span 2; float: none !important; margin: 0; }
:root[data-ui="new"] .r3-sf > .student-data-wrapper > ul.nav-tabs,
:root[data-ui="new"] .r3-sf > .student-data-wrapper > .tab-pane { grid-column: 2; max-width: none !important; float: none !important; min-width: 0; }
:root[data-ui="new"] .r3-sf > .student-data-wrapper > .tab-pane { min-height: 0; margin-top: 12px; }
:root[data-ui="new"] .r3-sf > .student-data-wrapper > ul.nav-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
:root[data-ui="new"] .r3-sf > .student-data-wrapper > ul.nav-tabs > li { float: none; flex-shrink: 0; }
/* wide screens: the tabs wrap to a second row instead of hiding the last one past the edge (phones keep the scroll) */
@media (min-width: 768px) {
    :root[data-ui="new"] .r3-sf > .student-data-wrapper > ul.nav-tabs { flex-wrap: wrap; overflow-x: visible; }
}
/* the pupil's side card */
:root[data-ui="new"] .r3-sf .student-base .panel { background: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 20px !important; box-shadow: none !important; margin: 0; }
:root[data-ui="new"] .r3-sf .student-base .panel:hover { box-shadow: none !important; }
:root[data-ui="new"] .r3-sf .student-base .panel-body { padding: 18px !important; display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
:root[data-ui="new"] .r3-sf .avatar-wrapper {
    float: none; width: 96px; height: 96px; margin: 0 auto; border-radius: 50%; background: #e6efff; overflow: hidden; display: flex; align-items: center; justify-content: center;
}
:root[data-ui="new"] .r3-sf img#avatar { max-width: 100%; width: 100%; height: 100%; object-fit: cover; opacity: .55; }
:root[data-ui="new"] .r3-sf .student-base-data { padding: 0; font-size: 14px; }
:root[data-ui="new"] .r3-sf .student-base-data > div { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid #eef2f8; }
:root[data-ui="new"] .r3-sf .student-base-data > div:last-child { border-bottom: 0; }
:root[data-ui="new"] .r3-sf .student-base-data > div:first-child { justify-content: center; border-bottom: 0; padding-top: 0; font-size: 18px; }
:root[data-ui="new"] .r3-sf .student-base-data > div:first-child strong { font-weight: 800; color: #12233f; }
:root[data-ui="new"] .r3-sf .student-base-data > div > strong { color: #5b6b85; font-weight: 500; }
:root[data-ui="new"] .r3-sf .student-base-data > div > span { font-weight: 600; text-align: end; unicode-bidi: plaintext; }
:root[data-ui="new"] .r3-sf #student-avatar-form { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
:root[data-ui="new"] .r3-sf #student-avatar-form .btn,
:root[data-ui="new"] .r3-sf .tab-pane .btn-default.btn-xs {
    display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px !important; border-radius: 999px !important; float: none;
    background: #fff !important; border: 1px solid #dfe8f4 !important; color: #4a5a73 !important; box-shadow: none !important; transform: none !important; font-size: 13px; font-weight: 600;
}
:root[data-ui="new"] .r3-sf #student-avatar-form .btn:hover,
:root[data-ui="new"] .r3-sf .tab-pane .btn-default.btn-xs:hover { border-color: #b9d3f4 !important; background: #f4f8fe !important; color: #114591 !important; }
:root[data-ui="new"] .r3-sf .btn .glyphicon { top: 0; font-size: 12px; }
/* the tab's content card */
:root[data-ui="new"] .r3-sf .tab-pane > .panel { background: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 20px !important; box-shadow: none !important; margin: 0; overflow: visible; }
:root[data-ui="new"] .r3-sf .tab-pane > .panel:hover { box-shadow: none !important; }
:root[data-ui="new"] .r3-sf .tab-pane > .panel > .panel-body { padding: 16px 18px !important; }
/* the section titles: a start-aligned heading instead of the blue rule */
:root[data-ui="new"] .r3-sf .seperator-header { border: 0; line-height: 1.3; text-align: start; margin: 4px 0 12px; }
:root[data-ui="new"] .r3-sf .seperator-header span { background: none; padding: 0; }
:root[data-ui="new"] .r3-sf .seperator-header .tab-header { font-size: 17px; font-weight: 800; color: #12233f; }
:root[data-ui="new"] .r3-sf .radioselect-horizontal { margin: 0 0 12px; }
:root[data-ui="new"] .r3-sf-none { min-width: 0; }

@media (max-width: 800px) {
    :root[data-ui="new"] .r3-sf > .student-data-wrapper { grid-template-columns: minmax(0, 1fr); }
    :root[data-ui="new"] .r3-sf > .student-data-wrapper > ul.nav-tabs,
    :root[data-ui="new"] .r3-sf > .student-data-wrapper > .tab-pane { grid-column: 1; }
    :root[data-ui="new"] .r3-sf > .student-data-wrapper > ul.nav-tabs { scrollbar-width: none; }
    :root[data-ui="new"] .r3-sf .tab-pane > .panel > .panel-body { padding: 12px !important; }
    :root[data-ui="new"] .r3-sf .tab-pane .panel .panel .panel-body { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px !important; }
    :root[data-ui="new"] .r3-sf .tab-pane .panel .panel .avatar-wrapper { margin: 0; width: 64px; height: 64px; }
    :root[data-ui="new"] .r3-sf .tab-pane .panel .panel .avatar-wrapper + div { float: none !important; flex: 1 1 200px; }
    :root[data-ui="new"] .r3-sv-pick { padding: 12px; }
    :root[data-ui="new"] .r3-sv-name { height: 40px; }
    :root[data-ui="new"] .r3-sv-select { max-width: none; }
}

/* ============================== דוחות כיתה / קבוצה (#!/students/diary/:g/:s) ============================== */
/* the tabs wrap to a second row rather than hide past the inline end (a class can have nine of them) */
:root[data-ui="new"] .r3-gd > ul.nav-tabs { display: flex; flex-wrap: wrap; margin: 0; }
:root[data-ui="new"] .r3-gd > ul.nav-tabs > li { float: none; flex-shrink: 0; }
:root[data-ui="new"] .r3-gd > .tab-pane > .panel { background: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 20px !important; box-shadow: none !important; margin: 0; overflow: visible; }
:root[data-ui="new"] .r3-gd > .tab-pane > .panel:hover { box-shadow: none !important; }
:root[data-ui="new"] .r3-gd > .tab-pane > .panel > .panel-body { padding: 16px 18px !important; min-height: 0 !important; }
/* the opening pane: what each tab holds (rows with icons) + the parents' link as a read-only field */
:root[data-ui="new"] .r3-gd-intro .r3-bar { margin: 0 0 6px; }
:root[data-ui="new"] .r3-gd-rows { display: flex; flex-direction: column; }
:root[data-ui="new"] .r3-gd-row { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid #eef2f8; }
:root[data-ui="new"] .r3-gd-row:last-child { border-bottom: 0; }
:root[data-ui="new"] .r3-gd-ico { width: 40px; height: 40px; flex-shrink: 0; border-radius: 12px; background: #e6efff; color: #114591; display: flex; align-items: center; justify-content: center; }
:root[data-ui="new"] .r3-gd-tx { flex: 1; min-width: 0; }
:root[data-ui="new"] .r3-gd-tx b { display: block; font-size: 15px; font-weight: 700; line-height: 1.35; color: #12233f; }
:root[data-ui="new"] .r3-gd-tx span { display: block; font-size: 13px; color: #5b6b85; line-height: 1.45; }
:root[data-ui="new"] .r3-gd-share { margin-top: 12px; padding-top: 16px; border-top: 1px solid #eef2f8; }
:root[data-ui="new"] .r3-gd-hint { font-size: 13px; color: #5b6b85; line-height: 1.4; margin-top: -4px; }
:root[data-ui="new"] .r3-gd-link { display: flex; align-items: center; gap: 8px; min-width: 0; }
:root[data-ui="new"] .r3-gd-link input.form-control {
    flex: 1 1 auto; min-width: 0; width: auto; height: 44px; margin: 0; padding: 0 12px; font-size: 13px; font-weight: 500; color: #4a5a73;
    background: #f7f9fc !important; border: 1px solid #dfe8f4 !important; border-radius: 12px !important; box-shadow: none !important; text-align: left;
}
:root[data-ui="new"] .r3-gd-link input.form-control:focus { border-color: #175bb0 !important; box-shadow: 0 0 0 3px rgba(23, 91, 176, .16) !important; }
:root[data-ui="new"] .r3-gd-link .r3-tool { height: 44px; flex-shrink: 0; }

@media (max-width: 767px) {
    /* phones: the tabs wrap into pills, so every tab stays in sight */
    :root[data-ui="new"] .r3-gd > ul.nav-tabs { flex-wrap: wrap !important; overflow: visible; gap: 8px; padding: 0 0 12px; border-bottom: 1px solid #dfe8f4 !important; }
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li { margin: 0; }
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li > a {
        height: 40px; padding: 0 14px !important; border: 1px solid #dfe8f4 !important; border-radius: 999px !important; background: #fff !important;
        font-size: 14px; white-space: nowrap;
    }
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li:not(.active) > a:hover { border-color: #b9d3f4 !important; background: #f4f8fe !important; }
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li.active > a,
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li.active > a:hover,
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li.active > a:focus { background: #e6efff !important; border-color: #b9d3f4 !important; color: #114591 !important; }
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li > a:focus:not(:focus-visible) { outline: 0 !important; }
    :root[data-ui="new"] .r3-gd > ul.nav-tabs > li > a:focus-visible { border-radius: 999px !important; outline-offset: 2px !important; }
    :root[data-ui="new"] .r3-gd > .tab-pane > .panel > .panel-body { padding: 12px !important; }
    :root[data-ui="new"] .r3-gd-link { flex-wrap: wrap; }
    :root[data-ui="new"] .r3-gd-link input.form-control { flex-basis: 100%; }
    :root[data-ui="new"] .r3-gd-link .r3-tool { flex: 1 1 auto; justify-content: center; }
}

/* ============================== צוות בית הספר (#!/teachers) - screen only, the printouts keep their bordered tables ============================== */
@media screen {
    :root[data-ui="new"] .r3-td > ul.nav-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; margin: 0; }
    :root[data-ui="new"] .r3-td > ul.nav-tabs > li { float: none; flex-shrink: 0; }
    /* every pane is one white card */
    :root[data-ui="new"] .r3-td > .tab-pane { margin: 0; min-width: 0; }
    :root[data-ui="new"] .r3-td > .tab-pane .panel { background: #fff !important; border: 1px solid #dfe8f4 !important; border-radius: 20px !important; box-shadow: none !important; margin: 0; overflow: visible; }
    :root[data-ui="new"] .r3-td > .tab-pane .panel:hover { box-shadow: none !important; }
    :root[data-ui="new"] .r3-td > .tab-pane .panel > .panel-body { padding: 16px 18px !important; }
    :root[data-ui="new"] .r3-td > .tab-pane:not(:has(> .panel)) { background: #fff; border: 1px solid #dfe8f4; border-radius: 20px; padding: 16px 18px; }
    /* the list settings: pill toggles, the print / export tools on the end */
    :root[data-ui="new"] .r3-td .setting-list-teachers { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 14px; }
    :root[data-ui="new"] .r3-td .setting-list-teachers > .clearfix,
    :root[data-ui="new"] .r3-td .tab-pane > .xprint > .clearfix { display: none; }
    :root[data-ui="new"] .r3-td .setting-list-teachers > label,
    :root[data-ui="new"] .r3-td .set-sched {
        display: inline-flex; align-items: center; gap: 6px; min-height: 36px; margin: 0 0 0 0; padding: 0 12px; border-radius: 999px; border: 1px solid #dfe8f4;
        background: #fff; color: #4a5a73; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; vertical-align: middle;
    }
    :root[data-ui="new"] .r3-td .set-sched { margin: 0 0 8px; margin-inline-end: 8px; }
    :root[data-ui="new"] .r3-td .set-sched .set-sched { border: 0; padding: 0; margin: 0; min-height: 0; }
    :root[data-ui="new"] .r3-td .setting-list-teachers > label:has(input:checked),
    :root[data-ui="new"] .r3-td .set-sched:has(> input:checked) { background: #e6efff; border-color: #b9d3f4; color: #114591; }
    :root[data-ui="new"] .r3-td .setting-list-teachers input[type="checkbox"],
    :root[data-ui="new"] .r3-td .set-sched input[type="checkbox"] { margin: 0; flex-shrink: 0; }
    :root[data-ui="new"] .r3-td .tools-bar { float: none !important; order: 99; margin-inline-start: auto; display: flex; flex-wrap: wrap; gap: 8px; }
    :root[data-ui="new"] .r3-td .tools-bar .btn,
    :root[data-ui="new"] .r3-td .tab-pane > .btn,
    :root[data-ui="new"] .r3-td .tab-pane > .xprint > .btn {
        float: none !important; display: inline-flex; align-items: center; gap: 6px; height: 38px; margin: 0 0 8px !important; padding: 0 12px !important; border-radius: 999px !important;
        background: #fff !important; border: 1px solid #dfe8f4 !important; color: #4a5a73 !important; box-shadow: none !important; filter: none !important; transform: none !important;
        font-size: 13px; font-weight: 600; line-height: 1;
    }
    :root[data-ui="new"] .r3-td .tools-bar .btn { margin: 0 !important; }
    :root[data-ui="new"] .r3-td .tools-bar .btn:hover,
    :root[data-ui="new"] .r3-td .tab-pane > .btn:hover,
    :root[data-ui="new"] .r3-td .tab-pane > .xprint > .btn:hover { border-color: #b9d3f4 !important; background: #f4f8fe !important; color: #114591 !important; }
    :root[data-ui="new"] .r3-td .btn .glyphicon { top: 0; font-size: 12px; }
    /* the lists (אלפון, תפקידים ומקצועות, דיווחי שיעורים) like the teachers table of the admin */
    :root[data-ui="new"] .r3-td table.teachers-list { width: 100%; border-collapse: separate; border-spacing: 0; margin: 0; font-size: 14px; color: #12233f; font-variant-numeric: tabular-nums; }
    :root[data-ui="new"] .r3-td table.teachers-list > thead > tr > th {
        background: #f7f9fc; color: #4a5a73; font-size: 13px; font-weight: 600; padding: 12px; border: 0 !important; border-bottom: 1px solid #dfe8f4 !important;
        text-align: start; white-space: nowrap;
    }
    :root[data-ui="new"] .r3-td table.teachers-list > thead > tr > th:first-child { border-start-start-radius: 12px; }
    :root[data-ui="new"] .r3-td table.teachers-list > thead > tr > th:last-child { border-start-end-radius: 12px; }
    :root[data-ui="new"] .r3-td table.teachers-list > tbody > tr > td { height: 48px; padding: 6px 12px; border: 0 !important; border-bottom: 1px solid #eef2f8 !important; vertical-align: middle; }
    :root[data-ui="new"] .r3-td table.teachers-list > tbody > tr:last-child > td { border-bottom: 0 !important; }
    :root[data-ui="new"] .r3-td table.teachers-list > tbody > tr:hover > td { background: #f7f9fc; }
    :root[data-ui="new"] .r3-td table.teachers-list > tbody > tr > td:first-child { font-weight: 600; }
    :root[data-ui="new"] .r3-td table.teachers-list a { color: #114591; text-decoration: none; }
    :root[data-ui="new"] .r3-td table.teachers-list a:hover { text-decoration: underline; }
    :root[data-ui="new"] .r3-td table.teachers-list td .btn {
        display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px !important; border-radius: 999px !important;
        background: #fff !important; border: 1px solid #dfe8f4 !important; color: #4a5a73 !important; box-shadow: none !important; transform: none !important; font-size: 12px; font-weight: 600;
    }
    /* the other grids of the panes: a quiet frame */
    :root[data-ui="new"] .r3-td .tab-pane .table-responsive { border: 0; margin: 0; }
    /* the wide grids (מפת החדרים, מערכות כיתות) scroll inside their card, never the page */
    :root[data-ui="new"] .r3-td .tab-pane .no-auto-responive { overflow-x: auto; }
    :root[data-ui="new"] .r3-td .tab-pane table.table { background: #fff; margin: 0; }
    :root[data-ui="new"] .r3-td .tprint > h1 { font-family: inherit; font-size: 18px; font-weight: 800; color: #12233f; margin: 18px 0 10px; }
    :root[data-ui="new"] .r3-td .tab-pane > div > .h2 { font-family: inherit; font-size: 18px; font-weight: 800; color: #12233f; margin: 8px 0 12px; }
    /* שיבוץ לפי שעה: the hour picker card and the lists of teachers */
    :root[data-ui="new"] .r3-td .hour-activity-cal { background: #fff; border: 1px solid #dfe8f4; border-radius: 16px; padding: 10px; }
    :root[data-ui="new"] .r3-td .hour-activity-cal > strong { display: block; margin: 0 0 8px; font-size: 13px; color: #4a5a73; }
    :root[data-ui="new"] .r3-td .hour-activity-cal .rTableCell:hover { background: #e6efff; }
    :root[data-ui="new"] .r3-td .hour-activity-cal .schedule-picker-selected { background: #175bb0; color: #fff; }
    :root[data-ui="new"] .r3-td .hour-activity-div > strong { display: block; margin: 12px 0 6px; font-size: 14px; font-weight: 700; color: #12233f; }
    :root[data-ui="new"] .r3-td .hour-activity-div ul { padding: 0; margin: 0; }
    :root[data-ui="new"] .r3-td .hour-activity-div li { margin: 0 0 6px; margin-inline-end: 6px; padding: 6px 12px; border: 1px solid #dfe8f4; border-radius: 999px; background: #fff; font-size: 13px; }
    :root[data-ui="new"] .r3-td .hour-activity-div li:hover { border-color: #b9d3f4; background: #f4f8fe; color: #114591; }
    /* the long lists (אלפון, תפקידים ומקצועות): framed, the header stays in view; the name with its initials chip
       (.te3-ini of ui3-admin.css), the phones as links. On a phone .td3-rows replaces the table (TeachersData.js) */
    :root[data-ui="new"] .r3-td .td3-scroll { max-width: 100%; overflow-x: auto; border: 1px solid #dfe8f4; border-radius: 16px; background: #fff; }
    :root[data-ui="new"] .r3-td .td3-scroll table.teachers-list > thead > tr > th { position: sticky; top: 0; z-index: 2; border-radius: 0; }
    :root[data-ui="new"] .r3-td .td3-who { display: inline-flex; align-items: center; gap: 10px; }
    :root[data-ui="new"] .r3-td .td3-who > b { font-weight: 700; white-space: nowrap; }
    :root[data-ui="new"] .r3-td a.td3-tel { color: #114591; font-weight: 600; white-space: nowrap; unicode-bidi: isolate; }
    :root[data-ui="new"] .r3-td .td3-rows { display: none; }
}
@media screen and (min-width: 768px) {
    :root[data-ui="new"] .r3-td .td3-scroll:has(> table > tbody > tr:nth-child(16)) { max-height: calc(100vh - 220px); overflow-y: auto; overscroll-behavior: contain; }
}
@media screen and (max-width: 767px) {
    :root[data-ui="new"] .r3-td .td3-scroll { display: none; }
    :root[data-ui="new"] .r3-td .td3-rows { display: block; }
    :root[data-ui="new"] .r3-td .td3-row { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid #eef2f8; }
    :root[data-ui="new"] .r3-td .td3-row:last-child { border-bottom: 0; padding-bottom: 2px; }
    :root[data-ui="new"] .r3-td .td3-row > .te3-ini { width: 40px; height: 40px; border-radius: 12px; font-size: 13px; }
    :root[data-ui="new"] .r3-td .td3-row-tx { flex: 1; min-width: 0; }
    :root[data-ui="new"] .r3-td .td3-row-tx > b { display: block; font-size: 15px; font-weight: 700; line-height: 1.35; color: #12233f; }
    :root[data-ui="new"] .r3-td .td3-row-tx > small { display: block; font-size: 12.5px; color: #5b6b85; line-height: 1.4; }
    :root[data-ui="new"] .r3-td .td3-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
    :root[data-ui="new"] .r3-td a.td3-link {
        display: inline-flex; align-items: center; gap: 6px; max-width: 100%; min-height: 36px; padding: 0 12px; box-sizing: border-box; border-radius: 999px;
        background: #eef5ff; color: #114591; font-size: 13px; font-weight: 700; text-decoration: none;
    }
    :root[data-ui="new"] .r3-td a.td3-link > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; unicode-bidi: isolate; }
    :root[data-ui="new"] .r3-td a.td3-link .p3-ico { flex-shrink: 0; }
    :root[data-ui="new"] .r3-td .td3-go {
        flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px; border-radius: 12px; border: 1px solid #dfe8f4;
        background: #fff; color: #12233f; font-family: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
    }
    :root[data-ui="new"] .r3-td :is(a.td3-link, .td3-go):focus-visible { outline: 2px solid #175bb0; outline-offset: 2px; }
}
@media screen and (max-width: 767px) {
    :root[data-ui="new"] .r3-td > ul.nav-tabs { scrollbar-width: none; }
    :root[data-ui="new"] .r3-td > .tab-pane .panel > .panel-body,
    :root[data-ui="new"] .r3-td > .tab-pane:not(:has(> .panel)) { padding: 12px !important; }
    :root[data-ui="new"] .r3-td #abcTeacherList,
    :root[data-ui="new"] .r3-td #staffList,
    :root[data-ui="new"] .r3-td .tab-pane > .panel > .panel-body:has(> table.teachers-list) { overflow-x: auto; }
    :root[data-ui="new"] .r3-td .setting-list-teachers > label,
    :root[data-ui="new"] .r3-td .set-sched { min-height: 40px; }
    :root[data-ui="new"] .r3-td .tools-bar { margin-inline-start: 0; }
    :root[data-ui="new"] .r3-td table.teachers-list > tbody > tr > td { white-space: nowrap; }
}

/* ============================== הפקת גיליון הערכות / הפקת תעודות (#!/parentsday/:id, #!/certificate/:id) ============================== */
@media screen {
    :root[data-ui="new"] .r3-cert > ul.nav-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; margin: 0; }
    :root[data-ui="new"] .r3-cert > ul.nav-tabs > li { float: none; flex-shrink: 0; }
    /* each pane is a card; the print pane of the parents' day splits into the settings card + the classes card */
    :root[data-ui="new"] .r3-cert > .tab-pane { background: #fff; border: 1px solid #dfe8f4; border-radius: 20px; padding: 16px 18px; min-width: 0; overflow-x: auto; }
    :root[data-ui="new"] .r3-cert > .tab-pane:has(> .do-certificates) { background: transparent; border: 0; padding: 0; overflow: visible; }
    :root[data-ui="new"] .r3-cert .do-certificates { display: grid; grid-template-columns: minmax(280px, 380px) minmax(0, 1fr); gap: 16px; align-items: start; }
    :root[data-ui="new"] .r3-cert .do-certificates > .col-div { float: none; width: auto; margin: 0; padding: 16px 18px; background: #fff; border: 1px solid #dfe8f4; border-radius: 20px; min-width: 0; overflow-x: auto; }
    :root[data-ui="new"] .r3-cert .do-certificates > .col-div:empty { display: none; }
    :root[data-ui="new"] .r3-cert .h5,
    :root[data-ui="new"] .r3-cert .tab-pane h4 { font-family: inherit; font-size: 16px; font-weight: 800; color: #12233f; margin: 14px 0 10px; }
    :root[data-ui="new"] .r3-cert .settings-list { padding: 8px 0; border-bottom: 1px solid #eef2f8; margin: 0; }
    :root[data-ui="new"] .r3-cert .settings-list:last-child { border-bottom: 0; }
    :root[data-ui="new"] .r3-cert .settings-list label { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; font-weight: 500; color: #12233f; cursor: pointer; }
    :root[data-ui="new"] .r3-cert .settings-list > label:only-child,
    :root[data-ui="new"] .r3-cert .settings-list > label + .multiselect,
    :root[data-ui="new"] .r3-cert .settings-list > label:first-child:not(:has(input)) { display: block; font-size: 13px; font-weight: 600; color: #4a5a73; margin-bottom: 6px; }
    :root[data-ui="new"] .r3-cert .settings-list > label:only-child:has(input) { display: inline-flex; font-size: 14px; font-weight: 500; color: #12233f; margin: 0; }
    /* the classes tables: quiet header, 48px rows, the row actions as soft pills */
    :root[data-ui="new"] .r3-cert .tab-pane table.table { width: 100%; margin: 0; background: transparent; font-size: 14px; color: #12233f; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > thead > tr > th {
        background: #f7f9fc !important; color: #4a5a73 !important; font-size: 13px; font-weight: 600; padding: 12px !important; border: 0 !important;
        border-bottom: 1px solid #dfe8f4 !important; text-align: start; white-space: nowrap;
    }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > thead > tr > th:first-child { border-start-start-radius: 12px; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > thead > tr > th:last-child { border-start-end-radius: 12px; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > tbody > tr,
    :root[data-ui="new"] .r3-cert .tab-pane table.table > tbody > tr:nth-of-type(odd) { background: transparent !important; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > tbody > tr > td { height: 48px; padding: 6px 12px !important; border: 0 !important; border-bottom: 1px solid #eef2f8 !important; vertical-align: middle; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > tbody > tr:last-child > td { border-bottom: 0 !important; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > tbody > tr:hover > td { background: #f7f9fc; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table > tbody > tr > td:first-child { font-weight: 600; white-space: nowrap; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table td .btn {
        display: inline-flex; align-items: center; gap: 6px; height: 34px; margin: 0 !important; padding: 0 12px !important; border-radius: 999px !important; white-space: nowrap;
        background: #fff !important; border: 1px solid #dfe8f4 !important; color: #4a5a73 !important; box-shadow: none !important; filter: none !important; transform: none !important;
        font-size: 13px; font-weight: 600; line-height: 1;
    }
    :root[data-ui="new"] .r3-cert .tab-pane table.table td .btn.btn-primary { background: #e6efff !important; border-color: #e6efff !important; color: #114591 !important; font-weight: 700; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table td .btn:hover { border-color: #b9d3f4 !important; background: #f4f8fe !important; color: #114591 !important; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table td .btn.btn-primary:hover { background: #d6e5fb !important; border-color: #d6e5fb !important; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table td .btn.disabled { opacity: .55; }
    :root[data-ui="new"] .r3-cert .btn .glyphicon { top: 0; font-size: 12px; }
}
@media screen and (max-width: 900px) {
    :root[data-ui="new"] .r3-cert .do-certificates { grid-template-columns: minmax(0, 1fr); }
}
@media screen and (max-width: 767px) {
    :root[data-ui="new"] .r3-cert > ul.nav-tabs { scrollbar-width: none; }
    :root[data-ui="new"] .r3-cert > .tab-pane,
    :root[data-ui="new"] .r3-cert .do-certificates > .col-div { padding: 12px; }
    :root[data-ui="new"] .r3-cert .tab-pane table.table td .btn { height: 40px; }
    :root[data-ui="new"] .r3-cert .r3-head .a3-btn { flex: 0 0 auto; }
}