/*
 * The panel-wide half of the November 2026 redesign.
 *
 * /home got its own layer (dash-console-v5.css) and the page kit was updated
 * in place (panel-page.css). This sheet is everything those two cannot reach
 * because it lives in the shell or is shared across pages: the assignment
 * header and its tab switcher, the shared card, every dropdown menu, and every
 * modal. Linked from v2/layout/app.blade.php after the kit; removing that one
 * link puts all of it back.
 *
 * Selectors carry one more class than the rules they restyle, because several
 * of those rules are inline style blocks in body partials and would win a tie
 * on order.
 */

/* ============================================= assignment header and tabs */
.assignment-nav-modern.assignment-nav-modern {
    border-bottom: 1px solid var(--border, #e4e4e7);
    box-shadow: none;
}
.assignment-nav-modern .assignment-nav-container { padding: .8rem 1.5rem; gap: 1.25rem; }
.assignment-nav-modern .nav-back-btn {
    width: 2.1rem; height: 2.1rem;
    background: var(--background, #fff);
    border: 1px solid var(--border, #e4e4e7); border-radius: 10px;
    color: var(--secondary-foreground, #71717a);
    box-shadow: 0 1px 1px rgba(16, 24, 40, .03);
}
.assignment-nav-modern .nav-back-btn:hover {
    background: var(--muted, #f4f4f5); color: var(--mono, #18181b);
    transform: none;
}
.assignment-nav-modern .nav-assignment-title {
    font-size: 1rem; font-weight: 650; letter-spacing: -.014em;
    color: var(--mono, #18181b);
}
.assignment-nav-modern .nav-assignment-title-editable:hover {
    background: var(--muted, #f4f4f5); border-color: transparent;
}

/* The file count was a solid blue chip beside a green one: two loud things
   next to a title. A count is a fact, so it is grey; the state keeps colour. */
.assignment-nav-modern .nav-badge {
    height: 1.4rem; padding: 0 .5rem; border-radius: 999px;
    font-size: .72rem; font-weight: 600;
}
.assignment-nav-modern .nav-badge-count {
    background: var(--muted, #f4f4f5); color: var(--secondary-foreground, #52525b);
}
.assignment-nav-modern .nav-badge-success { background: rgba(22, 163, 74, .1); color: #15803d; }
.assignment-nav-modern .nav-badge-warning { background: rgba(217, 119, 6, .12); color: #b45309; }

/* The tab switcher, with no box around it. It was a solid blue pill, then a
   grey track with a lifted white tab; both drew a container around seven
   words. Now the tabs are just the words, the one you are on is a soft blue
   pill, and the match count beside Results is a plain grey chip until it is
   the current tab. */
.assignment-nav-modern .nav-pills {
    gap: .15rem; padding: 0;
    background: none; border: 0; border-radius: 0;
}
.assignment-nav-modern .nav-pill {
    gap: .42rem; padding: .48rem .7rem;
    border-radius: 9px;
    font-size: .82rem; font-weight: 550; letter-spacing: -.003em;
    color: var(--secondary-foreground, #71717a);
    transition: color .15s ease, background-color .15s ease;
}
.assignment-nav-modern .nav-pill i { font-size: 1rem; }
.assignment-nav-modern .nav-pill:hover { background: var(--muted, #f4f4f5); color: var(--mono, #18181b); }
.assignment-nav-modern .nav-pill.active {
    background: rgba(37, 99, 235, .09);
    color: var(--primary, #2563eb); font-weight: 620;
    box-shadow: none;
}
.assignment-nav-modern .nav-pill.active i { color: inherit; }
.assignment-nav-modern .nav-pill .nav-pill-matches-badge {
    padding: 0 .4rem; min-width: 1.25rem; height: 1.15rem;
    display: inline-flex; align-items: center; justify-content: center;
    border: 0; border-radius: 999px;
    background: var(--muted, #f4f4f5); color: var(--secondary-foreground, #52525b);
    font-size: .68rem; font-weight: 650; line-height: 1; font-variant-numeric: tabular-nums;
}
.assignment-nav-modern .nav-pill:hover .nav-pill-matches-badge { background: var(--border, #e4e4e7); }
.assignment-nav-modern .nav-pill.active .nav-pill-matches-badge { background: var(--primary, #2563eb); color: #fff; }
.assignment-nav-modern .nav-pill-locked { border-color: transparent; }

.dark .assignment-nav-modern.assignment-nav-modern,
[data-kt-theme-mode="dark"] .assignment-nav-modern.assignment-nav-modern { border-bottom-color: rgba(255, 255, 255, .09); }
.dark .assignment-nav-modern .nav-back-btn { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .1); color: #a1a1aa; box-shadow: none; }
.dark .assignment-nav-modern .nav-assignment-title { color: #f4f4f5; }
.dark .assignment-nav-modern .nav-badge-count { background: rgba(255, 255, 255, .08); color: #d4d4d8; }
.dark .assignment-nav-modern .nav-badge-success { background: rgba(34, 197, 94, .16); color: #86efac; }
.dark .assignment-nav-modern .nav-pills { background: none; }
.dark .assignment-nav-modern .nav-pill { color: #a1a1aa; }
.dark .assignment-nav-modern .nav-pill:hover { background: rgba(255, 255, 255, .06); color: #f4f4f5; }
.dark .assignment-nav-modern .nav-pill.active { background: rgba(59, 130, 246, .18); color: #93c5fd; box-shadow: none; }
.dark .assignment-nav-modern .nav-pill .nav-pill-matches-badge { background: rgba(255, 255, 255, .1); color: #d4d4d8; }
.dark .assignment-nav-modern .nav-pill.active .nav-pill-matches-badge { background: #3b82f6; color: #fff; }

/* ============================================================ shared card */
.cq-asgn-grid .unified-card,
.tab-panel .unified-card {
    border-radius: 14px;
    border-color: var(--border, #e4e4e7);
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 28px -20px rgba(16, 24, 40, .18);
}
.cq-asgn-grid .unified-card:hover,
.tab-panel .unified-card:hover { box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 28px -20px rgba(16, 24, 40, .18); }
.dark .cq-asgn-grid .unified-card,
.dark .tab-panel .unified-card { box-shadow: none; }

/* ============================================================== dropdowns
   Every menu the panel opens: the account menu, the folder and language
   pickers, row menus. One shape: 14px, a hairline, a soft two-layer shadow,
   and rows that are rounded targets inset from the edge.

   The entrance is opacity only. These menus are placed by a transform, so a
   transform animation here would fight the positioner and the menu would
   jump on open. */
.kt-dropdown-menu.kt-dropdown-menu,
.kt-menu-dropdown.kt-menu-dropdown {
    border: 1px solid var(--border, #e4e4e7);
    border-radius: 14px;
    box-shadow: 0 2px 6px -2px rgba(16, 24, 40, .1), 0 22px 44px -18px rgba(16, 24, 40, .28);
}
.kt-dropdown-menu.open { animation: cqv5-fade .13s ease both; }
.kt-dropdown-menu:not(.p-0) { padding: .4rem; }
.kt-dropdown-menu .kt-dropdown-menu-link {
    padding: .5rem .6rem; border-radius: 8px;
    font-size: .84rem; font-weight: 500; letter-spacing: -.003em;
    transition: background-color .12s ease, color .12s ease;
}
.kt-dropdown-menu .kt-dropdown-menu-link:hover { background: var(--muted, #f4f4f5); color: var(--mono, #18181b); }
.kt-dropdown-menu .kt-dropdown-menu-link i { font-size: 1rem; color: var(--secondary-foreground, #71717a); }
.kt-dropdown-menu .kt-dropdown-menu-separator { margin: .35rem -.4rem; background: var(--border, #e4e4e7); opacity: .7; }

/* The balances box inside the account menu, as the same outlined group the
   page headers use rather than a grey slab with a blue footer. */
.kt-dropdown-menu .quota-section {
    margin: .35rem .1rem .25rem; overflow: hidden;
    background: var(--background, #fff);
    border: 1px solid var(--border, #e4e4e7); border-radius: 12px;
}
.kt-dropdown-menu .quota-section .quota-display { padding: .55rem .75rem; }
.kt-dropdown-menu .quota-section .quota-display + .quota-display { border-top: 1px solid var(--border, #e4e4e7); }
.kt-dropdown-menu .quota-section .quota-label { font-size: .8rem; font-weight: 500; color: var(--secondary-foreground, #71717a); }
.kt-dropdown-menu .quota-section .quota-value { font-size: .9rem; font-weight: 680; font-variant-numeric: tabular-nums; color: var(--mono, #18181b); }
.kt-dropdown-menu .quota-section .quota-buy-btn {
    border-top: 1px solid var(--border, #e4e4e7);
    background: var(--muted, #fafafa);
    font-size: .8rem; font-weight: 600;
    transition: background-color .12s ease;
}
.kt-dropdown-menu .quota-section .quota-buy-btn:hover { background: rgba(37, 99, 235, .08); }

/* The console's own pickers (language, engine, compare against). */
.v4-dd-menu.v4-dd-menu,
.v4-pick-menu.v4-pick-menu {
    border-radius: 14px;
    box-shadow: 0 2px 6px -2px rgba(16, 24, 40, .1), 0 22px 44px -18px rgba(16, 24, 40, .28);
}
.v4-dd-menu .v4-dd-list { padding: .3rem; }
.v4-dd-menu .v4-dd-opt { padding: .48rem .6rem; border-radius: 8px; }
.v4-dd-menu .v4-dd-group { padding: .6rem .6rem .25rem; }
.v4-pick-menu .v4-pick-list { padding: .3rem; }
.v4-pick-menu .v4-src { padding: .6rem; border-radius: 9px; }

.dark .kt-dropdown-menu.kt-dropdown-menu,
.dark .kt-menu-dropdown.kt-menu-dropdown { border-color: rgba(255, 255, 255, .1); box-shadow: 0 24px 48px -16px rgba(0, 0, 0, .7); }
.dark .kt-dropdown-menu .kt-dropdown-menu-link:hover { background: rgba(255, 255, 255, .06); color: #fafafa; }
.dark .kt-dropdown-menu .quota-section { background: rgba(255, 255, 255, .03); border-color: rgba(255, 255, 255, .1); }
.dark .kt-dropdown-menu .quota-section .quota-display + .quota-display,
.dark .kt-dropdown-menu .quota-section .quota-buy-btn { border-top-color: rgba(255, 255, 255, .1); }
.dark .kt-dropdown-menu .quota-section .quota-buy-btn { background: rgba(255, 255, 255, .04); }
.dark .kt-dropdown-menu .quota-section .quota-value { color: #fafafa; }

/* ================================================================= modals
   One entrance for every dialog: the veil fades, the sheet rises 8px. The
   old one scaled the sheet from 95% while it slid 20px, which resamples every
   glyph in it on each frame and is what read as a flicker on open. Nothing
   scales now, so the type is sharp from the first frame. */
.kt-modal.open {
    background: rgba(9, 9, 11, .5) !important;
    animation: cqv5-fade .16s ease both;
    overscroll-behavior: contain;
}
.kt-modal.open .kt-modal-content,
.kt-modal.active .kt-modal-content,
#startAnalysisModal:not(.hidden) .kt-modal-content {
    border-radius: 16px;
    box-shadow: 0 0 0 1px rgba(16, 24, 40, .06), 0 32px 64px -24px rgba(16, 24, 40, .45);
    animation: cqv5-rise .2s cubic-bezier(.2, .8, .2, 1) both;
    overscroll-behavior: contain;
}
.kt-modal.active { animation: cqv5-fade .16s ease both; }
.kt-modal .kt-modal-header {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--border, #e4e4e7);
    border-top-left-radius: 16px; border-top-right-radius: 16px;
}
.kt-modal .kt-modal-title { font-size: 1.02rem; font-weight: 620; letter-spacing: -.012em; }
.kt-modal .kt-modal-footer { border-top-color: var(--border, #e4e4e7); border-bottom-left-radius: 16px; border-bottom-right-radius: 16px; }
.dark .kt-modal.open .kt-modal-content,
[data-kt-theme-mode="dark"] .kt-modal.open .kt-modal-content { box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 32px 64px -24px rgba(0, 0, 0, .8); }

@keyframes cqv5-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes cqv5-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
    .kt-modal.open, .kt-modal.active,
    .kt-modal.open .kt-modal-content, .kt-modal.active .kt-modal-content,
    #startAnalysisModal:not(.hidden) .kt-modal-content,
    .kt-dropdown-menu.open { animation: none; }
}

/* ============================================== assignment: the Files tab
   The same vocabulary as the /home table: a quiet header, hairline rows, a
   status that is an icon and a word, and controls that are soft until the
   pointer is on them. The rings stay, slimmer; they are drawn by the page's
   own script and carry captions the tiles on /home do not have.

   IDs in the selectors on purpose: the page's seven sheets load after this
   one, and several of the rules below replace inline style attributes. */

/* -- right: summary bar and the submissions card */
#cqAsgnResults .cq-aiv-bar {
    border-radius: 14px;
    border-color: var(--border, #e4e4e7);
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 28px -20px rgba(16, 24, 40, .18);
}
#cqAsgnResults .cq-aiv-mark { border-radius: 11px; }
#cqAsgnResults .cq-aiv-cta {
    height: 2.25rem; padding-inline: .95rem; border-radius: 10px;
    display: inline-flex; align-items: center;
    box-shadow: 0 1px 2px rgba(11, 95, 204, .3), inset 0 1px 0 rgba(255, 255, 255, .18);
}
.dark #cqAsgnResults .cq-aiv-bar { box-shadow: none; }

#cqAsgnResults .unified-card-inner > div:first-child { padding: .95rem 1.15rem !important; }
#cqAsgnResults .unified-card .unified-title { font-size: 1.02rem; font-weight: 600; letter-spacing: -.012em; }
#cqAsgnResults #submissionSearch {
    width: 15rem !important; height: 2.25rem; padding: 0 .8rem !important;
    border: 1px solid transparent !important; border-radius: 10px !important;
    background: var(--muted, #f4f4f5) !important;
    font-size: .82rem !important;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
#cqAsgnResults #submissionSearch:focus {
    outline: none;
    background: var(--background, #fff) !important;
    border-color: var(--primary, #2563eb) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .14);
}
#cqAsgnResults #submissionSearch + button {
    height: 2.25rem; padding: 0 .8rem !important;
    border-radius: 10px !important;
    font-size: .8rem !important; font-weight: 560;
    transition: background-color .12s ease;
}
#cqAsgnResults #submissionSearch + button:hover { background: var(--muted, #f4f4f5) !important; }

#cqAsgnResults .submissions-table-compact thead th {
    padding: 10px 16px;
    font-size: 11px; letter-spacing: .06em;
    color: #a1a1aa;
    border-bottom: 1px solid var(--border, #e4e4e7);
}
#cqAsgnResults .submissions-table-compact thead .kt-col-sub { opacity: .8; letter-spacing: .04em; }
#cqAsgnResults .submissions-table-compact tbody td { border-bottom-color: color-mix(in srgb, var(--border, #e4e4e7) 62%, transparent); }
#cqAsgnResults .submissions-table-compact tbody tr:hover { background: color-mix(in srgb, var(--muted, #f4f4f5) 55%, transparent); }
.dark #cqAsgnResults .submissions-table-compact thead th { color: #71717a; border-bottom-color: rgba(255, 255, 255, .09); }

#cqAsgnResults .student-avatar {
    border-radius: 10px;
    background: rgba(37, 99, 235, .08);
    box-shadow: none;
}
#cqAsgnResults .student-avatar i { color: var(--primary, #2563eb); }
#cqAsgnResults .student-name { font-size: .875rem; font-weight: 600; letter-spacing: -.006em; color: var(--mono, #18181b); }
.dark #cqAsgnResults .student-name { color: #f4f4f5; }

/* Status: the icon keeps the state's colour, the word goes to ink. */
#cqAsgnResults .status-pill {
    gap: .4rem; padding: 0; border-radius: 0;
    background: none;
    font-size: .8rem; font-weight: 500; letter-spacing: 0;
}
#cqAsgnResults .status-pill:hover { transform: none; }
#cqAsgnResults .status-pill i { font-size: 15px; }
#cqAsgnResults .status-pill > span { color: var(--foreground, #3f3f46); }
#cqAsgnResults .status-completed { color: #16a34a; }
#cqAsgnResults .status-ready { color: var(--primary, #2563eb); }
#cqAsgnResults .status-processing { color: #d97706; }
#cqAsgnResults .status-pending { color: #a1a1aa; }
.dark #cqAsgnResults .status-pill > span { color: #d4d4d8; }

#cqAsgnResults .radial-score .radial-bg,
#cqAsgnResults .radial-score .radial-progress { stroke-width: 3.25; }
#cqAsgnResults .radial-value { font-size: 12px; font-weight: 680; }

/* Open: a soft blue tile that fills in under the pointer, not a glowing
   gradient button on every row. */
#cqAsgnResults .view-btn {
    border-radius: 9px;
    background: rgba(37, 99, 235, .1);
    box-shadow: none;
    transition: background-color .12s ease;
}
#cqAsgnResults .view-btn i { color: var(--primary, #2563eb); transition: color .12s ease; }
#cqAsgnResults .view-btn:hover { transform: none; background: var(--primary, #2563eb); box-shadow: none; }
#cqAsgnResults .view-btn:hover i { color: #fff; }
#cqAsgnResults .view-btn:active { transform: none; }
#cqAsgnResults .view-btn-locked { background: rgba(217, 119, 6, .12); box-shadow: none; }
#cqAsgnResults .view-btn-locked i { color: #b45309; }
#cqAsgnResults .view-btn-locked:hover { background: #d97706; box-shadow: none; }

#cqAsgnResults .action-btns { gap: 2px; }
#cqAsgnResults .action-btn {
    width: 30px; height: 30px;
    border: 0; border-radius: 8px;
    background: transparent; box-shadow: none;
    color: var(--secondary-foreground, #71717a);
    transition: background-color .12s ease, color .12s ease;
}
#cqAsgnResults .action-btn:hover { transform: none; background: var(--muted, #f4f4f5); color: var(--mono, #18181b); }
#cqAsgnResults .action-btn-danger:hover { background: rgba(220, 38, 38, .08); color: #dc2626; }
.dark #cqAsgnResults .action-btn:hover { background: rgba(255, 255, 255, .07); color: #fafafa; }

#cqAsgnResults .unified-table-footer { padding: .8rem 1.15rem; border-top-color: var(--border, #e4e4e7); }
#cqAsgnResults .unified-footer-info { font-size: .8rem; color: var(--secondary-foreground, #71717a); }
#cqAsgnResults .unified-footer-btn { height: 2.1rem; border-radius: 10px; font-weight: 560; }
#cqAsgnResults .cq-depth-note { color: #a1a1aa; }

/* -- left: the upload rail */
#cqAsgnLeft .unified-icon-container {
    border-radius: 11px;
    background: rgba(37, 99, 235, .1);
    color: var(--primary, #2563eb);
}
#cqAsgnLeft .unified-title { font-size: 1.02rem; font-weight: 600; letter-spacing: -.012em; }
#cqAsgnLeft .analysis-ready-strip .analysis-btn-primary-clean {
    height: 2.5rem; border-radius: 10px;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(21, 128, 61, .35), inset 0 1px 0 rgba(255, 255, 255, .18);
}
#cqAsgnLeft .upload-purpose-title { font-size: .875rem; font-weight: 600; letter-spacing: -.006em; }
#cqAsgnLeft .cq-upload-card { border-radius: 14px; border-color: var(--border, #e4e4e7); overflow: hidden; }
#cqAsgnLeft .cq-upload-tabs { background: var(--muted, #f4f4f5); }
#cqAsgnLeft .cq-upload-tab { border-radius: 8px; font-size: .8rem; font-weight: 550; }
#cqAsgnLeft .cq-upload-tab.is-active { box-shadow: 0 1px 2px rgba(16, 24, 40, .1), 0 0 0 1px rgba(16, 24, 40, .04); font-weight: 620; }
#cqAsgnLeft .cq-corpus-notice { border-radius: 10px; }
#cqAsgnLeft .cq-bulk-btn { height: 1.9rem; padding-inline: .6rem; border-radius: 8px; border-color: var(--border, #e4e4e7); }
#cqAsgnLeft .cq-bulk-btn:hover { background: var(--muted, #f4f4f5); }
.dark #cqAsgnLeft .cq-upload-tabs { background: rgba(255, 255, 255, .04); }
.dark #cqAsgnLeft .cq-upload-tab.is-active { box-shadow: none; }

/* ================================= assignment: the other tabs, one surface
   AI Detection, Insights, Peers, Sources and Settings were each drawn with
   their own corner (8, 10, 12 and 14px across five pages) and their own idea
   of a shadow. They are all the same card now: 14px, a hairline, the soft
   two-layer shadow the rest of the panel uses. Each class is doubled so the
   rule outranks the page's own sheet, which loads after this one. */
.ov-block.ov-block,
.ov-head-stats.ov-head-stats,
.ins-assess.ins-assess,
.ins-kpi-row.ins-kpi-row,
.ins-block.ins-block,
.ai-disclaimer.ai-disclaimer,
.ai-stats-row.ai-stats-row,
.ai-distribution.ai-distribution,
.ai-table-wrap.ai-table-wrap,
.wr-stats.wr-stats,
.wr-placeholder.wr-placeholder,
.config-card-custom.config-card-custom,
.cq-profile-footer.cq-profile-footer,
.tab-panel .kt-card.kt-card {
    border-color: var(--border, #e4e4e7);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 28px -20px rgba(16, 24, 40, .18);
}
.ov-net-wrap.ov-net-wrap,
.ai-disclaimer .ai-disclaimer-col.ai-measured,
.cq-pvl-list.cq-pvl-list,
.cq-pv-banner.cq-pv-banner,
.cq-base-code-toggle.cq-base-code-toggle { border-radius: 11px; }
.dark .ov-block.ov-block, .dark .ov-head-stats.ov-head-stats,
.dark .ins-assess.ins-assess, .dark .ins-kpi-row.ins-kpi-row, .dark .ins-block.ins-block,
.dark .ai-disclaimer.ai-disclaimer, .dark .ai-stats-row.ai-stats-row,
.dark .ai-distribution.ai-distribution, .dark .ai-table-wrap.ai-table-wrap,
.dark .wr-stats.wr-stats, .dark .wr-placeholder.wr-placeholder,
.dark .config-card-custom.config-card-custom, .dark .cq-profile-footer.cq-profile-footer,
.dark .tab-panel .kt-card.kt-card { border-color: rgba(255, 255, 255, .09); box-shadow: none; }

/* One page title across the tabs, the same cut as the kit's .cqp-title. */
.ov-title.ov-title,
.ins-title.ins-title,
.wr-h1.wr-h1 {
    font-size: 1.5rem; font-weight: 650; letter-spacing: -.022em; line-height: 1.15;
}

/* The check-finished notice on the Files tab, as a panel card with a green
   tile rather than a green slab. */
#statusChangeNotification .status-notification-content {
    border: 1px solid var(--border, #e4e4e7); border-radius: 14px;
    background: var(--background, #fff);
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 28px -20px rgba(16, 24, 40, .18);
}
#statusChangeNotification .status-notification-icon {
    border-radius: 10px; background: rgba(22, 163, 74, .12); color: #16a34a;
}
#statusChangeNotification .status-notification-icon i { color: inherit; }
#statusChangeNotification .status-notification-title { font-size: .875rem; font-weight: 600; color: var(--mono, #18181b); }
#statusChangeNotification .status-notification-text { color: var(--secondary-foreground, #71717a); }
#statusChangeNotification.error .status-notification-icon { background: rgba(220, 38, 38, .1); color: #dc2626; }
#statusChangeNotification.info .status-notification-icon { background: rgba(37, 99, 235, .1); color: #2563eb; }
.dark #statusChangeNotification .status-notification-content { background: rgba(255, 255, 255, .02); border-color: rgba(255, 255, 255, .09); box-shadow: none; }
.dark #statusChangeNotification .status-notification-title { color: #f4f4f5; }

/* ========================================== results: the match explorer
   Looks only. The rows, their order, the filters and every handler belong to
   the page; this restates how they are drawn, in the vocabulary of the /home
   table: a title that reads as a title, hairline rows, and the score in a
   tile tinted with its own colour so the column can be scanned.

   #matches-list and .matches-column in the selectors because the driller
   sheets load after this one. */
.matches-column .column-header .header-title { font-size: .95rem; font-weight: 620; letter-spacing: -.012em; }
.matches-column .mx-sum { font-size: .8rem; line-height: 1.5; }

.matches-column .filter-tabs { border-bottom-color: var(--border, #e4e4e7); }
.matches-column .filter-tabs .filter-tab {
    gap: .35rem; padding: .5rem .15rem .6rem;
    font-size: .78rem; font-weight: 560;
    color: var(--secondary-foreground, #71717a);
}
.matches-column .filter-tabs .filter-tab:hover { color: var(--mono, #18181b); }
.matches-column .filter-tabs .filter-tab.active { color: var(--mono, #18181b); font-weight: 620; }
.matches-column .filter-tabs .filter-tab.is-empty:not(.active) { opacity: .55; }
.matches-column .filter-tabs .filter-tab-n {
    padding: 1px 6px; min-width: 1.15rem;
    font-size: .66rem; font-weight: 650; line-height: 1.35; font-variant-numeric: tabular-nums;
    background: var(--muted, #f4f4f5); color: var(--secondary-foreground, #71717a);
}
.matches-column .filter-tabs .filter-tab.active .filter-tab-n { background: var(--primary, #2563eb); color: #fff; }

.matches-column .mx-sources { gap: .35rem; padding-bottom: .6rem; }
.matches-column .mx-sources .filter-tab-domain {
    gap: .4rem; padding: .22rem .6rem .22rem .3rem;
    border-color: var(--border, #e4e4e7);
    font-size: .76rem; font-weight: 500;
    color: var(--foreground, #3f3f46);
    transition: background-color .12s ease, border-color .12s ease;
}
.matches-column .mx-sources .filter-tab-domain:hover { background: var(--muted, #f4f4f5); border-color: var(--border, #e4e4e7); }
.matches-column .mx-sources .filter-tab-domain.active {
    background: rgba(37, 99, 235, .08);
    border-color: rgba(37, 99, 235, .45);
    box-shadow: none;
    color: var(--primary, #2563eb);
}
.matches-column .mx-sources .filter-tab-domain.active .mx-src-n { color: inherit; }
.matches-column .mx-src-n { font-variant-numeric: tabular-nums; }

#matches-list .match-card-new.mx-row {
    grid-template-columns: 32px minmax(0, 1fr) auto;
    gap: .75rem;
    padding: .7rem 1rem;
    border-bottom-color: color-mix(in srgb, var(--border, #e4e4e7) 62%, transparent);
    transition: background-color .12s ease;
}
#matches-list .match-card-new.mx-row:hover { background: color-mix(in srgb, var(--muted, #f4f4f5) 60%, transparent); }
#matches-list .match-card-new.mx-row.selected { background: rgba(37, 99, 235, .06); box-shadow: inset 2px 0 0 var(--primary, #2563eb); }
#matches-list .mx-row-tile { width: 32px; height: 32px; border-radius: 9px; }
#matches-list .mx-row-src { font-size: .86rem; font-weight: 600; letter-spacing: -.008em; color: var(--mono, #18181b); }
#matches-list .match-card-new.mx-row:hover .mx-row-src { color: var(--primary, #2563eb); }
#matches-list .mx-row-meta { margin-top: 1px; font-size: .75rem; color: var(--secondary-foreground, #71717a); }
#matches-list .mx-row-right { gap: .5rem; }

/* The score, as the same heat tile the dashboard uses: the figure in the
   tone the row already carries, on a wash of that tone. */
#matches-list .mx-row-pct {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 3.1rem; height: 1.8rem; padding: 0 .4rem;
    border-radius: 7px;
    background: rgba(113, 113, 122, .1);
    background: color-mix(in oklab, currentColor 11%, transparent);
    font-size: .82rem; font-weight: 660; letter-spacing: -.01em;
    text-align: center;
}

/* Compare / View: an outlined button the height of the tile, so the right
   edge of every row is two aligned boxes rather than a number and a word. */
#matches-list .match-view-btn.mx-row-act {
    min-width: 4.6rem; height: 1.8rem; padding: 0 .65rem;
    border: 1px solid var(--border, #e4e4e7); border-radius: 7px;
    background: var(--background, #fff);
    color: var(--foreground, #3f3f46);
    font-size: .76rem; font-weight: 560; line-height: 1;
    transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
#matches-list .match-card-new.mx-row:hover .match-view-btn.mx-row-act,
#matches-list .match-view-btn.mx-row-act:focus-visible {
    border: 1px solid var(--primary, #2563eb);
    background: var(--primary, #2563eb);
    color: #fff;
}
#matches-list .mx-row-right .match-view-btn.is-icon { height: 1.8rem; border-radius: 7px; }

.dark .matches-column .filter-tabs { border-bottom-color: rgba(255, 255, 255, .09); }
.dark .matches-column .filter-tabs .filter-tab.active,
.dark .matches-column .filter-tabs .filter-tab:hover { color: #f4f4f5; }
.dark .matches-column .filter-tabs .filter-tab-n { background: rgba(255, 255, 255, .08); color: #a1a1aa; }
.dark .matches-column .filter-tabs .filter-tab.active .filter-tab-n { background: #3b82f6; color: #fff; }
.dark .matches-column .mx-sources .filter-tab-domain { border-color: rgba(255, 255, 255, .12); color: #d4d4d8; }
.dark .matches-column .mx-sources .filter-tab-domain:hover { background: rgba(255, 255, 255, .06); }
.dark .matches-column .mx-sources .filter-tab-domain.active { background: rgba(59, 130, 246, .16); border-color: rgba(96, 165, 250, .5); color: #93c5fd; }
.dark #matches-list .match-card-new.mx-row { border-bottom-color: rgba(255, 255, 255, .06); }
.dark #matches-list .match-card-new.mx-row:hover { background: rgba(255, 255, 255, .04); }
.dark #matches-list .mx-row-src { color: #f4f4f5; }
.dark #matches-list .match-card-new.mx-row:hover .mx-row-src { color: #93c5fd; }
.dark #matches-list .mx-row-meta { color: #a1a1aa; }
.dark #matches-list .match-view-btn.mx-row-act { background: transparent; border-color: rgba(255, 255, 255, .14); color: #d4d4d8; }
.dark #matches-list .match-card-new.mx-row:hover .match-view-btn.mx-row-act { background: #3b82f6; border-color: #3b82f6; color: #fff; }


/* ==================== assignment: Insights, Peers, Sources, AI Detection
   The second pass on these tabs. The first only gave their cards one corner;
   this one gives them one set of parts, the same parts as /home and Files:

     - the label above a title is plain small capitals, not a grey chip
     - the primary button is brand blue (these pages each had a black one)
     - a segmented filter is a 10px track with a lifted white choice
     - a table header is white with faint 11px labels over hairline rows
     - a score is a tile tinted with its own colour, not a round pill

   #main_content_container leads every selector: each of these pages loads
   its own sheet after this one, and an id is what outranks them without
   having to know how each rule was written. */

/* -- page headers */
#main_content_container .ins-header,
#main_content_container .ov-header,
#main_content_container .wr-top { align-items: center; }
#main_content_container .ins-eyebrow,
#main_content_container .ov-eyebrow,
#main_content_container .wr-eyebrow {
    padding: 0; border-radius: 0; background: none;
    font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
    color: #a1a1aa;
}
#main_content_container .ins-subtitle,
#main_content_container .ov-subtitle,
#main_content_container .wr-sub { margin-top: .3rem; font-size: .84rem; color: var(--secondary-foreground, #71717a); }

/* -- buttons */
#main_content_container .ins-btn,
#main_content_container .ov-btn,
#main_content_container .wr-btn,
#main_content_container .ai-btn {
    height: 2.25rem; padding-inline: .85rem;
    border-color: var(--border, #e4e4e7); border-radius: 10px;
    font-size: .8rem; font-weight: 560;
    box-shadow: 0 1px 1px rgba(16, 24, 40, .03);
    transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}
#main_content_container .ins-btn:hover,
#main_content_container .ov-btn:hover,
#main_content_container .wr-btn:hover,
#main_content_container .ai-btn:hover { background: var(--muted, #f4f4f5); }
#main_content_container .ins-btn.ins-btn-primary,
#main_content_container .ov-btn.ov-btn-primary,
#main_content_container .wr-btn.wr-btn-primary,
#main_content_container .ai-btn.ai-btn-primary {
    border-color: transparent;
    background: var(--primary, #2563eb); color: #fff;
    box-shadow: 0 1px 2px rgba(11, 95, 204, .3), inset 0 1px 0 rgba(255, 255, 255, .18);
}
#main_content_container .ins-btn.ins-btn-primary:hover,
#main_content_container .ov-btn.ov-btn-primary:hover,
#main_content_container .wr-btn.wr-btn-primary:hover,
#main_content_container .ai-btn.ai-btn-primary:hover { background: #1d4ed8; color: #fff; }
#main_content_container .ins-export-menu {
    padding: .3rem; border-color: var(--border, #e4e4e7); border-radius: 12px;
    box-shadow: 0 2px 6px -2px rgba(16, 24, 40, .1), 0 22px 44px -18px rgba(16, 24, 40, .28);
}
#main_content_container .ins-export-menu button { border-radius: 8px; }

/* -- stat strips */
#main_content_container .ov-hstat-lbl,
#main_content_container .wr-stat-lbl,
#main_content_container .ins-kpi-label,
#main_content_container .ai-stat-label {
    font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #a1a1aa;
}
#main_content_container .ov-hstat-val,
#main_content_container .wr-stat-val,
#main_content_container .ins-kpi-value { font-weight: 680; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
#main_content_container .ins-kpi-tag { border-radius: 7px; }

/* -- section heads */
#main_content_container .ins-block-head h2,
#main_content_container .ov-block-head h2 { font-size: 1.02rem; font-weight: 600; letter-spacing: -.012em; }
#main_content_container .ins-block-head p,
#main_content_container .ov-block-head p { font-size: .8rem; color: var(--secondary-foreground, #71717a); }
#main_content_container .ins-count,
#main_content_container .ov-count,
#main_content_container .wr-aside-count {
    padding: 0 .45rem; min-width: 1.25rem; height: 1.2rem;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 999px;
    background: var(--muted, #f4f4f5); color: var(--secondary-foreground, #71717a);
    font-size: .7rem; font-weight: 650; font-variant-numeric: tabular-nums;
}

/* -- segmented filters */
#main_content_container .ins-filter,
#main_content_container .ov-pills,
#main_content_container .ai-filter {
    padding: .2rem; gap: .125rem;
    border-radius: 10px; background: var(--muted, #f4f4f5);
}
#main_content_container .ins-filter-btn,
#main_content_container .ov-pill,
#main_content_container .ai-filter-btn {
    border-radius: 8px;
    font-size: .78rem; font-weight: 550;
    color: var(--secondary-foreground, #71717a);
    transition: color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
#main_content_container .ins-filter-btn.active,
#main_content_container .ov-pill.ov-pill-active,
#main_content_container .ai-filter-btn.active {
    background: var(--background, #fff); color: var(--mono, #18181b); font-weight: 620;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .1), 0 0 0 1px rgba(16, 24, 40, .04);
}
#main_content_container .ov-search { border-color: transparent; border-radius: 10px; }
#main_content_container .ov-search:focus-within { background: var(--background, #fff); border-color: var(--primary, #2563eb); box-shadow: 0 0 0 3px rgba(37, 99, 235, .14); }

/* -- tables */
#main_content_container .ins-table th,
#main_content_container .ov-table th,
#main_content_container .ai-table th {
    background: none;
    font-size: 11px; font-weight: 600; letter-spacing: .06em;
    color: #a1a1aa;
    border-bottom: 1px solid var(--border, #e4e4e7);
}
#main_content_container .ins-table td,
#main_content_container .ov-table td,
#main_content_container .ai-table td { border-bottom-color: color-mix(in srgb, var(--border, #e4e4e7) 62%, transparent); }
#main_content_container .ins-table tbody tr:hover,
#main_content_container .ov-table tbody tr:hover,
#main_content_container .ai-table tbody tr:hover { background: color-mix(in srgb, var(--muted, #f4f4f5) 55%, transparent); }
#main_content_container .ins-file-name,
#main_content_container .ov-fname,
#main_content_container .ai-file-name { font-size: .86rem; font-weight: 600; letter-spacing: -.006em; color: var(--mono, #18181b); }
#main_content_container .ins-file-icon,
#main_content_container .ov-file-icon { border-radius: 8px; }

/* The score, as a tile. The tone classes these pages already put on the
   element set its colour and its wash; only the shape changes. */
#main_content_container .ins-score-pill,
#main_content_container .wr-chip {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 3.1rem; height: 1.75rem; padding: 0 .4rem;
    border-radius: 7px;
    font-size: .8rem; font-weight: 660; letter-spacing: -.01em; font-variant-numeric: tabular-nums;
}
#main_content_container .wr-chip { background: color-mix(in oklab, currentColor 11%, transparent); }
#main_content_container .ov-badge { height: 1.5rem; padding: 0 .5rem; border-radius: 7px; display: inline-flex; align-items: center; font-weight: 600; }
/* The rank was a solid black disc on every row; a number is not that loud. */
#main_content_container .ov-rank {
    border-radius: 7px;
    background: var(--muted, #f4f4f5); color: var(--secondary-foreground, #52525b);
    font-variant-numeric: tabular-nums;
}
#main_content_container .ov-sim { padding: 0; background: none; }
#main_content_container .ov-net-legend { border-radius: 10px; }

/* -- Insights: the assessment card and the bars */
#main_content_container .ins-assess-headline { font-size: 1.25rem; font-weight: 650; letter-spacing: -.018em; }
#main_content_container .ins-assess-eyebrow,
#main_content_container .ins-assess-side-head { font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #a1a1aa; }
#main_content_container .ins-assess-row { border-radius: 8px; }
#main_content_container .ins-dist-range { border-radius: 6px; }
#main_content_container .ins-score-name { font-size: .86rem; }

/* -- Sources: the picker on the left, the finding on the right */
#main_content_container .wr-grid { gap: 1.5rem; }
#main_content_container .wr-aside,
#main_content_container .wr-verdict,
#main_content_container .wr-file {
    border-color: var(--border, #e4e4e7); border-radius: 14px;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 12px 28px -20px rgba(16, 24, 40, .18);
}
#main_content_container .wr-aside-title { font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #a1a1aa; }
#main_content_container .wr-tabs { gap: .15rem; }
#main_content_container .wr-tab {
    border-color: transparent; border-radius: 8px;
    background: none; color: var(--secondary-foreground, #71717a);
    font-size: .76rem; font-weight: 550;
    transition: color .12s ease, background-color .12s ease;
}
#main_content_container .wr-tab:hover { background: var(--muted, #f4f4f5); color: var(--mono, #18181b); }
#main_content_container .wr-tab.is-on { background: rgba(37, 99, 235, .09); color: var(--primary, #2563eb); font-weight: 620; }
#main_content_container .wr-row { border-radius: 10px; transition: background-color .12s ease; }
#main_content_container .wr-row:hover { background: var(--muted, #f4f4f5); }
#main_content_container .wr-row.is-active { background: rgba(37, 99, 235, .07); border-color: rgba(37, 99, 235, .28); }
#main_content_container .wr-row-name { font-size: .86rem; letter-spacing: -.006em; }
#main_content_container .wr-row-avatar { border-radius: 8px; }
#main_content_container .wr-verdict-head { font-size: 1.1rem; font-weight: 650; letter-spacing: -.016em; }
#main_content_container .wr-verdict-who,
#main_content_container .wr-verdict-cap { font-size: 11px; font-weight: 600; letter-spacing: .06em; }
#main_content_container .wr-file-name { font-size: .86rem; }
#main_content_container .wr-region { border-color: var(--border, #e4e4e7); border-radius: 10px; }
#main_content_container .wr-region:hover { border-color: rgba(37, 99, 235, .35); }

.dark #main_content_container .ins-filter,
.dark #main_content_container .ov-pills,
.dark #main_content_container .ai-filter { background: rgba(255, 255, 255, .05); }
.dark #main_content_container .ins-filter-btn.active,
.dark #main_content_container .ov-pill.ov-pill-active,
.dark #main_content_container .ai-filter-btn.active { background: rgba(255, 255, 255, .12); color: #fafafa; box-shadow: none; }
.dark #main_content_container .ins-table th,
.dark #main_content_container .ov-table th,
.dark #main_content_container .ai-table th { color: #71717a; border-bottom-color: rgba(255, 255, 255, .09); }
.dark #main_content_container .ins-file-name,
.dark #main_content_container .ov-fname,
.dark #main_content_container .ai-file-name { color: #f4f4f5; }
.dark #main_content_container .ov-rank,
.dark #main_content_container .ins-count,
.dark #main_content_container .ov-count,
.dark #main_content_container .wr-aside-count { background: rgba(255, 255, 255, .08); color: #d4d4d8; }
.dark #main_content_container .wr-aside,
.dark #main_content_container .wr-verdict,
.dark #main_content_container .wr-file { border-color: rgba(255, 255, 255, .09); box-shadow: none; }
.dark #main_content_container .wr-tab.is-on { background: rgba(59, 130, 246, .18); color: #93c5fd; }
.dark #main_content_container .wr-row:hover { background: rgba(255, 255, 255, .05); }
.dark #main_content_container .wr-row.is-active { background: rgba(59, 130, 246, .14); border-color: rgba(96, 165, 250, .4); }


/* -- AI Detection: the same parts, under this page's own class names */
#main_content_container .ai-btn-primary {
    border-color: transparent; border-radius: 10px;
    background: var(--primary, #2563eb); color: #fff;
    box-shadow: 0 1px 2px rgba(11, 95, 204, .3), inset 0 1px 0 rgba(255, 255, 255, .18);
}
#main_content_container .ai-btn-primary:hover { background: #1d4ed8; color: #fff; }
#main_content_container .ai-section-title { font-size: 1.02rem; font-weight: 600; letter-spacing: -.012em; }
#main_content_container .ai-metric-label { font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #a1a1aa; }
#main_content_container .ai-metric-value { font-weight: 680; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
#main_content_container .ai-dist-name { font-size: .86rem; }
#main_content_container .ai-view-btn { border-radius: 8px; }


/* ============================================ assignment: the Settings tab
   Same parts again. What was particular to this page: a red gear and a red
   "Required" chip on the first card (an alarm on a form that is already
   filled in), field labels in 11px grey capitals, and a blue stripe down the
   left edge of every source that is switched on, beside a switch that
   already says so. */
#main_content_container .config-card-header-custom,
#main_content_container .tab-panel .kt-card > .kt-card-header { padding: .95rem 1.15rem; }
#main_content_container .config-card-title-custom,
#main_content_container .tab-panel .kt-card-title,
#main_content_container .cq-quickstats__title { font-size: 1.02rem; font-weight: 600; letter-spacing: -.012em; color: var(--mono, #18181b); }
#main_content_container .config-card-header-custom i,
#main_content_container .cq-pv-header-icon { color: var(--secondary-foreground, #71717a) !important; }
#main_content_container .config-card-header-custom .kt-badge {
    height: 1.35rem; padding: 0 .5rem;
    border: 0; border-radius: 999px;
    background: var(--muted, #f4f4f5); color: var(--secondary-foreground, #71717a);
    font-size: .7rem; font-weight: 600;
}
#main_content_container .config-card-content-custom { padding: 1.15rem; }

#main_content_container .config-label-custom {
    font-size: .78rem; font-weight: 600; letter-spacing: 0; text-transform: none;
    color: var(--mono, #18181b);
}
#main_content_container .config-help-text { font-size: .78rem; line-height: 1.5; color: var(--secondary-foreground, #71717a); }
#main_content_container .tab-panel .cq-select-trigger,
#main_content_container .config-card-custom .cq-select-trigger {
    height: 2.5rem; padding-inline: .8rem;
    border-color: var(--border, #e4e4e7); border-radius: 10px;
    font-size: .84rem;
    box-shadow: 0 1px 1px rgba(16, 24, 40, .03);
    transition: border-color .12s ease, box-shadow .12s ease;
}
#main_content_container .tab-panel .cq-select-trigger:hover,
#main_content_container .config-card-custom .cq-select-trigger:hover { border-color: rgba(37, 99, 235, .4); }
#main_content_container .cq-base-code-title { font-size: .86rem; letter-spacing: -.006em; }
#main_content_container .cq-base-code-desc { font-size: .78rem; line-height: 1.5; }

/* Summary card */
#main_content_container .cq-quickstats__k { font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #a1a1aa; }
#main_content_container .cq-quickstats__v { font-size: .86rem; font-weight: 600; color: var(--mono, #18181b); }
#main_content_container .cq-quickstats__pill { border-radius: 7px; }

/* Detection sources */
#main_content_container .cq-pv-count {
    height: 1.5rem; padding: 0 .6rem;
    display: inline-flex; align-items: center; gap: .25rem;
    border: 0; background: var(--muted, #f4f4f5);
    font-size: .74rem; color: var(--secondary-foreground, #71717a);
}
#main_content_container .cq-pv-intro { font-size: .82rem; line-height: 1.55; color: var(--secondary-foreground, #71717a); }
#main_content_container .cq-pvl-group-label { font-size: 11px; font-weight: 600; letter-spacing: .06em; color: #a1a1aa; }
#main_content_container .cq-pvl-list { border-color: var(--border, #e4e4e7); overflow: hidden; }
#main_content_container .cq-pvl-row {
    padding: .8rem 1rem;
    border-bottom-color: color-mix(in srgb, var(--border, #e4e4e7) 62%, transparent);
    box-shadow: none;
    transition: background-color .12s ease;
}
#main_content_container .cq-pvl-row:hover { background: color-mix(in srgb, var(--muted, #f4f4f5) 55%, transparent); box-shadow: none; transform: none; }
#main_content_container .cq-pvl-name { font-size: .86rem; font-weight: 600; letter-spacing: -.006em; color: var(--mono, #18181b); }
#main_content_container .cq-pvl-desc { font-size: .78rem; color: var(--secondary-foreground, #71717a); }
#main_content_container .cq-pvl-coverage { font-size: .74rem; color: var(--foreground, #3f3f46); }
#main_content_container .cq-pvl-time { font-size: .72rem; color: #a1a1aa; }
#main_content_container .cq-paid-info-banner__cta {
    border-radius: 9px;
    box-shadow: 0 1px 2px rgba(11, 95, 204, .3), inset 0 1px 0 rgba(255, 255, 255, .18);
}

/* The action bar that closes the page */
#main_content_container .cq-profile-footer.cq-profile-footer { box-shadow: none; background: var(--muted, #fafafa); }
#main_content_container .cq-profile-footer__back,
#main_content_container .cq-profile-footer__delete { height: 2.25rem; border-radius: 10px; font-size: .8rem; font-weight: 560; }
#main_content_container .cq-profile-footer__back { border-color: var(--border, #e4e4e7); box-shadow: 0 1px 1px rgba(16, 24, 40, .03); }
#main_content_container .cq-profile-footer__status { border: 0; border-radius: 7px; }

.dark #main_content_container .config-card-title-custom,
.dark #main_content_container .tab-panel .kt-card-title,
.dark #main_content_container .cq-quickstats__title,
.dark #main_content_container .config-label-custom,
.dark #main_content_container .cq-pvl-name,
.dark #main_content_container .cq-quickstats__v { color: #f4f4f5; }
.dark #main_content_container .config-card-header-custom .kt-badge,
.dark #main_content_container .cq-pv-count { background: rgba(255, 255, 255, .08); color: #d4d4d8; }
.dark #main_content_container .cq-pvl-list { border-color: rgba(255, 255, 255, .09); }
.dark #main_content_container .cq-pvl-row:hover { background: rgba(255, 255, 255, .04); }
.dark #main_content_container .cq-profile-footer.cq-profile-footer { background: rgba(255, 255, 255, .03); }

/* The stripe is set by a rule that reads the switch, so it takes !important
   to clear; and the action bar is the card's own last row, not a second box
   floating inside it. */
#main_content_container .cq-pvl-list .cq-pvl-row { box-shadow: none !important; }
#main_content_container .cq-profile-footer.cq-profile-footer {
    margin-bottom: 0; padding: .85rem 1.15rem;
    border: 0; border-top: 1px solid var(--border, #e4e4e7); border-radius: 0 0 14px 14px;
    background: none;
}
.dark #main_content_container .cq-profile-footer.cq-profile-footer { background: none; border-top-color: rgba(255, 255, 255, .09); }