/* ===================================================================== Raqib unified accessibility toolbar Settings are written to by accessibility.js. Rules exclude the toolbar itself (#raqibA11y) and its overlays, and typography rules skip icon fonts / SVG so icons keep rendering. ===================================================================== */ /* Bundled OpenDyslexic (SIL Open Font License 1.1, see Content/fonts/opendyslexic/LICENSE) */ @font-face { font-family:"OpenDyslexic"; font-style:normal; font-weight:400; font-display:swap; src:url("../fonts/opendyslexic/opendyslexic-latin-400-normal.woff2") format("woff2"), url("../fonts/opendyslexic/opendyslexic-latin-400-normal.woff") format("woff"); } @font-face { font-family:"OpenDyslexic"; font-style:normal; font-weight:700; font-display:swap; src:url("../fonts/opendyslexic/opendyslexic-latin-700-normal.woff2") format("woff2"), url("../fonts/opendyslexic/opendyslexic-latin-700-normal.woff") format("woff"); } /* ---------- Colour themes (accent) - applied across the application ---------- */ html { --raqib-accent:#244b90; --raqib-accent-dark:#1d407d; --raqib-accent-soft:#e8eef8; --raqib-accent-2:#3cb4e5; } html[data-a11y-accent="teal"] { --raqib-accent:#0f766e; --raqib-accent-dark:#0b5c56; --raqib-accent-soft:#e2f3f1; --raqib-accent-2:#2bb5a6; } html[data-a11y-accent="green"] { --raqib-accent:#2f7a35; --raqib-accent-dark:#245f29; --raqib-accent-soft:#e6f2e7; --raqib-accent-2:#7cb342; } html[data-a11y-accent="purple"] { --raqib-accent:#5b3fa0; --raqib-accent-dark:#47307f; --raqib-accent-soft:#eeeaf8; --raqib-accent-2:#9b7fe6; } html[data-a11y-accent="maroon"] { --raqib-accent:#8a1538; --raqib-accent-dark:#6c0f2b; --raqib-accent-soft:#f6e6eb; --raqib-accent-2:#c9506f; } html[data-a11y-accent="orange"] { --raqib-accent:#a8520a; --raqib-accent-dark:#874107; --raqib-accent-soft:#fbefe2; --raqib-accent-2:#e59a2f; } html[data-a11y-accent="graphite"] { --raqib-accent:#374151; --raqib-accent-dark:#1f2937; --raqib-accent-soft:#eceef1; --raqib-accent-2:#7b8794; } html[data-a11y-accent] .app-sidebar { background:var(--raqib-accent)!important; } html[data-a11y-accent] .app-sidebar .sidebar-background:after { background:linear-gradient(180deg,var(--raqib-accent) 0%,var(--raqib-accent-dark) 100%)!important; } html[data-a11y-accent] .app-sidebar .navigation li > a:before { border-color:var(--raqib-accent-2)!important; } html[data-a11y-accent] .app-sidebar .navigation > li.active > a, html[data-a11y-accent] .app-sidebar .navigation > li.open > a, html[data-a11y-accent] .app-sidebar .navigation .menu-content li.active > a { background:rgba(255,255,255,.16)!important; } html[data-a11y-accent] .app-sidebar .navigation li > a > i { color:#fff!important; opacity:.85; } html[data-a11y-accent] .sidebar-user-initial { background:var(--raqib-accent-2)!important; color:#fff!important; } html[data-a11y-accent] .sidebar-mobile-trigger { background:var(--raqib-accent)!important; } html[data-a11y-accent] .btn-primary, html[data-a11y-accent] .btn-search-primary, html[data-a11y-accent] .list-page .inspection-simple-search .btn-primary, html[data-a11y-accent] #changeStatusModal .btn-primary { background:var(--raqib-accent)!important; border-color:var(--raqib-accent)!important; color:#fff!important; box-shadow:0 4px 12px rgba(0,0,0,.14)!important; } html[data-a11y-accent] .btn-primary:hover, html[data-a11y-accent] .btn-primary:focus, html[data-a11y-accent] .btn-primary.active, html[data-a11y-accent] .btn-search-primary:hover { background:var(--raqib-accent-dark)!important; border-color:var(--raqib-accent-dark)!important; } html[data-a11y-accent] .btn-outline-primary { color:var(--raqib-accent)!important; border-color:var(--raqib-accent)!important; } html[data-a11y-accent] .btn-outline-primary:hover { background:var(--raqib-accent)!important; color:#fff!important; } html[data-a11y-accent] .list-page .inspection-search-header .btn-primary, html[data-a11y-accent] .list-page .inspection-search-header .btn-search-primary { color:var(--raqib-accent)!important; background:#fff!important; } html[data-a11y-accent] .bg-primary, html[data-a11y-accent] .badge-primary, html[data-a11y-accent] .progress-bar { background-color:var(--raqib-accent)!important; } html[data-a11y-accent] .text-primary, html[data-a11y-accent] .primary, html[data-a11y-accent] .inspection-search-title h4, html[data-a11y-accent] .advanced-search-heading h5, html[data-a11y-accent] .list-page .list-summary b, html[data-a11y-accent] .btn-advanced-toggle, html[data-a11y-accent] .list-page .action-icons .action-icon { color:var(--raqib-accent)!important; } html[data-a11y-accent] .list-page .action-icons .action-icon:hover, html[data-a11y-accent] .btn-advanced-toggle:hover { background:var(--raqib-accent)!important; border-color:var(--raqib-accent)!important; color:#fff!important; } html[data-a11y-accent] .inspection-search-icon, html[data-a11y-accent] #changeStatusModal .modal-header { background:linear-gradient(135deg,var(--raqib-accent) 0%,var(--raqib-accent-2) 100%)!important; } html[data-a11y-accent] .page-item.active .page-link, html[data-a11y-accent] .list-page .pagination .active .page-link, html[data-a11y-accent] .list-page .paginate_button.current, html[data-a11y-accent] .nav-pills .nav-link.active { background:var(--raqib-accent)!important; border-color:var(--raqib-accent)!important; color:#fff!important; } html[data-a11y-accent] .nav-tabs .nav-link.active { color:var(--raqib-accent)!important; border-bottom-color:var(--raqib-accent)!important; } html[data-a11y-accent] .custom-control-input:checked ~ .custom-control-label::before { background-color:var(--raqib-accent)!important; border-color:var(--raqib-accent)!important; } html[data-a11y-accent] input[type="checkbox"], html[data-a11y-accent] input[type="radio"], html[data-a11y-accent] progress { accent-color:var(--raqib-accent); } html[data-a11y-accent] .form-control:focus, html[data-a11y-accent] .search-control:focus { border-color:var(--raqib-accent-2)!important; box-shadow:0 0 0 3px var(--raqib-accent-soft)!important; } html[data-a11y-accent] .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color:var(--raqib-accent)!important; } html[data-a11y-accent] #rgLaunch, html[data-a11y-accent] #raqibGuide #rgNext { background:var(--raqib-accent)!important; border-color:var(--raqib-accent)!important; } /* ---------- Sidebar style ---------- */ html[data-a11y-sidebar="light"] .app-sidebar { background:#ffffff!important; border-inline-end:1px solid #dbe3ec!important; box-shadow:4px 0 18px rgba(30,50,80,.06)!important; } html[data-a11y-sidebar="light"] .app-sidebar .sidebar-background:after { background:#ffffff!important; } html[data-a11y-sidebar="light"] .app-sidebar .sidebar-header { background:var(--raqib-accent)!important; border-radius:0 0 14px 14px; } html[data-a11y-sidebar="light"] .app-sidebar :is(a, span, li, p, b, strong, small, .sidebar-menu-caption, .schoolAdminDisplayName, .sidebar-user-role) { color:#24384d!important; } html[data-a11y-sidebar="light"] .app-sidebar .sidebar-header :is(a, span) { color:#fff!important; } html[data-a11y-sidebar="light"] .app-sidebar :is(a, button) > i, html[data-a11y-sidebar="light"] .app-sidebar .navigation li > a > i { color:var(--raqib-accent)!important; opacity:1; } html[data-a11y-sidebar="light"] .app-sidebar .navigation li > a:hover, html[data-a11y-sidebar="light"] .app-sidebar .sidebar-account-toggle:hover, html[data-a11y-sidebar="light"] .app-sidebar .sidebar-language-link > a:hover { background:var(--raqib-accent-soft)!important; } html[data-a11y-sidebar="light"] .app-sidebar .navigation li:is(.active, .open) > a { background:var(--raqib-accent-soft)!important; color:var(--raqib-accent-dark)!important; font-weight:700; } html[data-a11y-sidebar="light"] .app-sidebar .navigation li:is(.active, .open) > a * { color:var(--raqib-accent-dark)!important; } html[data-a11y-sidebar="light"] .app-sidebar .navigation li > a:before { border-color:var(--raqib-accent)!important; } html[data-a11y-sidebar="light"] .app-sidebar .navigation li.has-sub > a:after { color:#6b7f93!important; } html[data-a11y-sidebar="light"] .app-sidebar :is(.sidebar-user-card, .sidebar-language-link > a, .nav-toggle, .nav-close) { border-color:#dbe3ec!important; } html[data-a11y-sidebar="light"] .app-sidebar .sidebar-language-link > a { background:#f4f7fb!important; } html[data-a11y-sidebar="light"] .app-sidebar .sidebar-account-links > .menu-content { background:#f4f7fb!important; } html[data-a11y-sidebar="light"] .app-sidebar .sidebar-account-logout > a, html[data-a11y-sidebar="light"] .app-sidebar .sidebar-account-logout > a * { color:#b42318!important; } html[data-a11y-sidebar="light"] .app-sidebar .sidebar-content { scrollbar-color:#c5d0dc transparent; } html[data-a11y-sidebar="dark"] .app-sidebar { background:#121a26!important; border-inline-end:1px solid #1f2a3a!important; } html[data-a11y-sidebar="dark"] .app-sidebar .sidebar-background:after { background:linear-gradient(180deg,#172131 0%,#101722 100%)!important; } html[data-a11y-sidebar="dark"] .app-sidebar .navigation li > a > i, html[data-a11y-sidebar="dark"] .app-sidebar :is(a, button) > i { color:var(--raqib-accent-2)!important; opacity:1; } html[data-a11y-sidebar="dark"] .app-sidebar .navigation li:is(.active, .open) > a { background:color-mix(in srgb, var(--raqib-accent) 45%, transparent)!important; } html[data-a11y-sidebar="dark"] .app-sidebar .navigation li > a:before { border-color:var(--raqib-accent-2)!important; } html[data-a11y-sidebar="dark"] .sidebar-user-initial { background:var(--raqib-accent)!important; color:#fff!important; } /* ---------- Density ---------- */ html[data-a11y-density="compact"] .main-panel .content-wrapper { padding:14px!important; } html[data-a11y-density="compact"] :is(.card-body, .card > .card-content > .card-body, .modal-body, .inspection-search-header) { padding:.85rem!important; } html[data-a11y-density="compact"] :is(.card, .inspection-search-panel) { margin-bottom:12px!important; } html[data-a11y-density="compact"] table :is(th, td) { padding:.35rem .55rem!important; } html[data-a11y-density="compact"] .form-group { margin-bottom:.6rem!important; } html[data-a11y-density="compact"] .btn:not(.btn-link) { min-height:32px; padding:6px 12px; } html[data-a11y-density="comfortable"] .main-panel .content-wrapper { padding:34px!important; } html[data-a11y-density="comfortable"] :is(.card-body, .card > .card-content > .card-body, .modal-body) { padding:1.75rem!important; } html[data-a11y-density="comfortable"] :is(.card, .inspection-search-panel) { margin-bottom:30px!important; } html[data-a11y-density="comfortable"] table :is(th, td) { padding:.95rem 1rem!important; } html[data-a11y-density="comfortable"] .form-group { margin-bottom:1.5rem!important; } html[data-a11y-density="comfortable"] body { line-height:1.65; } /* ---------- Corners ---------- */ html[data-a11y-corners="square"] :is(.card, .btn, .form-control, .modal-content, .badge, .dropdown-menu, .select2-selection, .page-link, .alert, .nav-link, .inspection-search-panel, .inspection-search-icon, .action-icon, input, select, textarea, .sidebar-language-link > a, .app-sidebar .navigation a):not(#raqibA11y, #raqibA11y *) { border-radius:2px!important; } html[data-a11y-corners="round"] :is(.card, .modal-content, .dropdown-menu, .alert, .inspection-search-panel):not(#raqibA11y, #raqibA11y *) { border-radius:18px!important; } html[data-a11y-corners="round"] :is(.btn, .badge, .page-link, .nav-pills .nav-link):not(#raqibA11y, #raqibA11y *) { border-radius:999px!important; } html[data-a11y-corners="round"] :is(.form-control, .select2-selection, input, select, textarea, .action-icon):not(#raqibA11y, #raqibA11y *) { border-radius:12px!important; } /* ---------- Smooth switching between looks ---------- */ html.a11y-theming, html.a11y-theming body, html.a11y-theming body *:not(#raqibA11y *) { transition:background-color .35s ease, color .35s ease, border-color .35s ease, fill .35s ease, filter .35s ease!important; } /* ---------- Display themes ---------- */ /* Dark & warm themes are filters on the root so every page, partial, modal and inline style is covered; photos/video/maps are inverted back to true colour. */ html[data-a11y-theme="dark"] { --a11y-theme-filter:invert(.9) hue-rotate(180deg); background:#fff; } html[data-a11y-theme="sepia"] { --a11y-theme-filter:sepia(.4) brightness(.98); } html[data-a11y-filter="grayscale"] { --a11y-color-filter:grayscale(1); } html[data-a11y-filter="low-sat"] { --a11y-color-filter:saturate(.45); } html[data-a11y-filter="high-sat"] { --a11y-color-filter:saturate(1.8); } html[data-a11y-filter="contrast"] { --a11y-color-filter:contrast(1.3); } html[data-a11y-cvd="protanopia"] { --a11y-cvd-filter:url(#a11y-cvd-protanopia); } html[data-a11y-cvd="deuteranopia"] { --a11y-cvd-filter:url(#a11y-cvd-deuteranopia); } html[data-a11y-cvd="tritanopia"] { --a11y-cvd-filter:url(#a11y-cvd-tritanopia); } html[data-a11y-night="1"] { --a11y-night-filter:url(#a11y-night-1); } html[data-a11y-night="2"] { --a11y-night-filter:url(#a11y-night-2); } html[data-a11y-theme="dark"], html[data-a11y-theme="sepia"], html[data-a11y-filter], html[data-a11y-cvd], html[data-a11y-night] { filter:var(--a11y-theme-filter,) var(--a11y-color-filter,) var(--a11y-cvd-filter,) var(--a11y-night-filter,); min-height:100vh; /* the filter only covers the root box, so make it fill short pages */ } html[data-a11y-theme="dark"] img, html[data-a11y-theme="dark"] video, html[data-a11y-theme="dark"] picture, html[data-a11y-theme="dark"] iframe, html[data-a11y-theme="dark"] embed, html[data-a11y-theme="dark"] object, html[data-a11y-theme="dark"] .gm-style, html[data-a11y-theme="dark"] .leaflet-tile-pane { filter:invert(1) hue-rotate(180deg); } html[data-a11y-theme="dark"] .gm-style img, html[data-a11y-theme="dark"] .leaflet-tile-pane img, html[data-a11y-theme="dark"] picture img { filter:none; } /* Keep brand and status surfaces in their true (already dark/saturated) colours instead of letting the inversion turn them pastel. */ html[data-a11y-theme="dark"] :is(.app-sidebar, .sidebar-mobile-trigger, .btn-primary, .btn-info, .btn-success, .btn-danger, .btn-warning, .btn-secondary, .badge, .bg-primary, .bg-success, .bg-danger, .bg-warning, .bg-info, .progress-bar, .inspection-search-icon, .btn-search-primary, .page-item.active .page-link, #changeStatusModal .modal-header, #rgLaunch, #raqibGuide #rgNext, #raqibA11y .a11y-head, #raqibA11y .a11y-launcher, #raqibA11y .a11y-accent, #raqibA11y .a11y-reset, #raqibA11y .a11y-skip, #raqibA11y .a11y-theme-swatch, #raqibA11y .a11y-tile-check, #raqibA11y .a11y-chip[aria-pressed="true"], .a11y-magnifier, .a11y-tip) { filter:invert(1) hue-rotate(180deg); } html[data-a11y-theme="dark"] :is(.app-sidebar, .btn, .badge, #raqibA11y .a11y-head) :is(img, video, picture, iframe, .badge, .btn) { filter:none; } html[data-a11y-theme="dark"][data-a11y-sidebar="light"] .app-sidebar { filter:none!important; } html[data-a11y-theme="dark"][data-a11y-sidebar="light"] .app-sidebar .sidebar-header { filter:invert(1) hue-rotate(180deg); } /* High contrast - dark (white text, yellow links, black surfaces) */ html[data-a11y-theme="contrast-dark"], html[data-a11y-theme="contrast-dark"] body { background:#000!important; color:#fff!important; } html[data-a11y-theme="contrast-dark"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { background-color:#000!important; background-image:none!important; color:#fff!important; border-color:#fff!important; box-shadow:none!important; text-shadow:none!important; } html[data-a11y-theme="contrast-dark"] body a:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *), html[data-a11y-theme="contrast-dark"] body a:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) * { color:#ffeb3b!important; text-decoration:underline!important; } html[data-a11y-theme="contrast-dark"] body :is(button, .btn, input, select, textarea, .form-control, .select2-selection, .badge, .card, .modal-content, .dropdown-menu, table, th, td):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { border:1px solid #fff!important; } html[data-a11y-theme="contrast-dark"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):hover, html[data-a11y-theme="contrast-dark"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):focus { background-color:#ffeb3b!important; color:#000!important; } html[data-a11y-theme="contrast-dark"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):hover *, html[data-a11y-theme="contrast-dark"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):focus * { color:#000!important; } html[data-a11y-theme="contrast-dark"] body :is(h1, h2, h3, h4, h5, h6):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { color:#7fdbff!important; } html[data-a11y-theme="contrast-dark"] ::placeholder { color:#c8c8c8!important; opacity:1; } html[data-a11y-theme="contrast-dark"] body :is(.active, [aria-selected="true"], [aria-current]):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { outline:2px solid #ffeb3b!important; outline-offset:-2px; } html[data-a11y-theme="contrast-dark"] .modal-backdrop { background:#000!important; opacity:.85!important; } /* High contrast - light (black on white, blue links) */ html[data-a11y-theme="contrast-light"], html[data-a11y-theme="contrast-light"] body { background:#fff!important; color:#000!important; } html[data-a11y-theme="contrast-light"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { background-color:#fff!important; background-image:none!important; color:#000!important; border-color:#000!important; box-shadow:none!important; text-shadow:none!important; } html[data-a11y-theme="contrast-light"] body a:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *), html[data-a11y-theme="contrast-light"] body a:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) * { color:#0000c8!important; text-decoration:underline!important; } html[data-a11y-theme="contrast-light"] body :is(button, .btn, input, select, textarea, .form-control, .select2-selection, .badge, .card, .modal-content, .dropdown-menu, table, th, td):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { border:1px solid #000!important; } html[data-a11y-theme="contrast-light"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):hover, html[data-a11y-theme="contrast-light"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):focus { background-color:#000!important; color:#fff!important; } html[data-a11y-theme="contrast-light"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):hover *, html[data-a11y-theme="contrast-light"] body :is(.btn, button):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):focus * { color:#fff!important; } html[data-a11y-theme="contrast-light"] ::placeholder { color:#444!important; opacity:1; } html[data-a11y-theme="contrast-light"] body :is(.active, [aria-selected="true"], [aria-current]):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { outline:2px solid #000!important; outline-offset:-2px; } html[data-a11y-theme="contrast-light"] .modal-backdrop { background:#fff!important; opacity:.85!important; } /* ---------- Text size: content is zoomed and reflows inside its container ---------- */ html[data-a11y-text] body > :not(#raqibA11y, .a11y-overlay, .modal-backdrop, script, style, link, template) { zoom:var(--a11y-zoom); } html[data-a11y-text="1"] { --a11y-zoom:1.1; } html[data-a11y-text="2"] { --a11y-zoom:1.25; } html[data-a11y-text="3"] { --a11y-zoom:1.5; } html[data-a11y-text="4"] { --a11y-zoom:1.75; } html[data-a11y-text="5"] { --a11y-zoom:2; } /* ---------- Spacing ---------- */ html[data-a11y-line="1"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { line-height:1.6!important; } html[data-a11y-line="2"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { line-height:1.9!important; } html[data-a11y-line="3"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { line-height:2.2!important; } /* Letter spacing breaks Arabic letter joining, so it is Latin-only. */ html[data-a11y-letter="1"]:not([data-a11y-lang="ar"]) body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { letter-spacing:.06em!important; } html[data-a11y-letter="2"]:not([data-a11y-lang="ar"]) body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { letter-spacing:.12em!important; } html[data-a11y-letter="3"]:not([data-a11y-lang="ar"]) body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { letter-spacing:.18em!important; } html[data-a11y-word="1"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { word-spacing:.16em!important; } html[data-a11y-word="2"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { word-spacing:.32em!important; } html[data-a11y-word="3"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { word-spacing:.5em!important; } /* ---------- Fonts ---------- */ html[data-a11y-font="readable"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { font-family:Verdana,Tahoma,"Segoe UI",Arial,sans-serif!important; } html[data-a11y-font="readable"][data-a11y-lang="ar"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { font-family:Tahoma,"Segoe UI",Arial,sans-serif!important; } html[data-a11y-font="dyslexia"] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { font-family:"OpenDyslexic","Lexend","Comic Sans MS","Comic Neue",Verdana,Tahoma,sans-serif!important; } html[data-a11y-bold] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(i, svg, svg *, .fa, [class^="ft-"], [class*=" ft-"], [class^="fa-"], [class*=" fa-"], [class^="icon-"], [class*=" icon-"], .glyphicon) { font-weight:700!important; } html[data-a11y-align="start"] body :is(p, li, td, th, label, dd, dt, blockquote, h1, h2, h3, h4, h5, h6, .card-text):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { text-align:start!important; } html[data-a11y-align="center"] body :is(p, li, td, th, label, dd, dt, blockquote, h1, h2, h3, h4, h5, h6, .card-text):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { text-align:center!important; } html[data-a11y-align="justify"] body :is(p, li, dd, blockquote, .card-text):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { text-align:justify!important; } /* ---------- Highlights ---------- */ html[data-a11y-links] body a[href]:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { text-decoration:underline!important; text-underline-offset:3px; text-decoration-thickness:2px!important; outline:2px dashed currentColor!important; outline-offset:2px; } html[data-a11y-headings] body :is(h1, h2, h3, h4, h5, h6, [role="heading"], .card-title, .modal-title):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { outline:3px solid #f0a020!important; outline-offset:3px; background-color:rgba(240,160,32,.12)!important; } html[data-a11y-focus] :focus, html[data-a11y-focus] :focus-visible { outline:3px solid #ff8f00!important; outline-offset:2px!important; box-shadow:0 0 0 6px rgba(255,143,0,.35)!important; } /* ---------- Big cursor ---------- */ html[data-a11y-cursor="black"], html[data-a11y-cursor="black"] body *:not(input, textarea, [contenteditable="true"]) { cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M7 3l30 27H23l8 15-6 3-8-15-10 9z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 7 3, auto!important; } html[data-a11y-cursor="white"], html[data-a11y-cursor="white"] body *:not(input, textarea, [contenteditable="true"]) { cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M7 3l30 27H23l8 15-6 3-8-15-10 9z' fill='%23fff' stroke='%23000' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 7 3, auto!important; } html[data-a11y-cursor] body :is(a[href], button, [role="button"], select, label, summary), html[data-a11y-cursor] body :is(a[href], button, [role="button"], label) * { cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M7 3l30 27H23l8 15-6 3-8-15-10 9z' fill='%231a5fd0' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 7 3, pointer!important; } /* ---------- Motion & media ---------- */ html[data-a11y-motion] *, html[data-a11y-motion] *::before, html[data-a11y-motion] *::after { animation-duration:.001ms!important; animation-iteration-count:1!important; animation-delay:0s!important; transition-duration:.001ms!important; transition-delay:0s!important; scroll-behavior:auto!important; } html[data-a11y-motion] .pace, html[data-a11y-motion] #nprogress .spinner { display:none!important; } html[data-a11y-images] body :is(img, picture, video, figure, [role="img"]:not(i)):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { visibility:hidden!important; } html[data-a11y-images] body :not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { background-image:none!important; } /* ---------- Reading mode: hide navigation chrome, centre the content ---------- */ html[data-a11y-reading] :is(.app-sidebar, .sidebar-mobile-trigger, .notification-sidebar, .main-panel > .footer, .public-layout-footer, #raqibGuide #rgLaunch, .customizer) { display:none!important; } html[data-a11y-reading] .main-panel .main-content { padding-left:0!important; padding-right:0!important; } html[data-a11y-reading] .main-panel .content-wrapper, html[data-a11y-reading] .public-layout-main { max-width:1180px; margin-left:auto!important; margin-right:auto!important; } /* ---------- Table helper ---------- */ html[data-a11y-tables] table:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { border-collapse:separate!important; border-spacing:0!important; } html[data-a11y-tables] table:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) :is(th, td) { padding-top:.7rem!important; padding-bottom:.7rem!important; } html[data-a11y-tables] table:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) thead th { position:sticky; top:0; z-index:3; background-color:var(--raqib-accent-soft,#e8eef8)!important; color:#10243a!important; border-bottom:2px solid var(--raqib-accent,#244b90)!important; } html[data-a11y-tables] table:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) tbody tr:nth-child(even) > * { background-color:rgba(36,75,144,.05)!important; } html[data-a11y-tables] table:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) tbody tr:is(:hover, :focus-within) > * { background-color:#fff4c2!important; } html[data-a11y-tables] table:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) tbody tr:is(:hover, :focus-within) > :first-child { box-shadow:inset 4px 0 0 var(--raqib-accent,#244b90)!important; } html[data-a11y-tables][data-a11y-lang="ar"] table:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) tbody tr:is(:hover, :focus-within) > :first-child { box-shadow:inset -4px 0 0 var(--raqib-accent,#244b90)!important; } /* ---------- Form helper ---------- */ html[data-a11y-forms] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]), select, textarea, .select2-selection):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { min-height:44px!important; font-size:16px!important; border-width:2px!important; } html[data-a11y-forms] :is(input[type="checkbox"], input[type="radio"]):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { width:22px!important; height:22px!important; } html[data-a11y-forms] :is(.btn, button, .page-link, a.dropdown-item):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { min-height:44px!important; min-width:44px; } html[data-a11y-forms] label:not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { font-weight:700!important; } html[data-a11y-forms] :is(input[required], select[required], textarea[required], [aria-required="true"], [data-val-required]):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { border-inline-start:6px solid #c2410c!important; } html[data-a11y-forms] .a11y-req { color:#c2410c; font-weight:700; } html[data-a11y-forms] :is(.input-validation-error, input.error, select.error, textarea.error, .is-invalid):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { border-color:#c62828!important; background-color:#fff5f5!important; } html[data-a11y-forms] :is(.field-validation-error, label.error, .invalid-feedback):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *):not(:empty)::before { content:"\26A0\00A0"; } html[data-a11y-forms] :is(.field-validation-error, label.error, .invalid-feedback):not(#raqibA11y, #raqibA11y *, .a11y-overlay, .a11y-overlay *) { color:#b71c1c!important; font-weight:700!important; } .a11y-error-summary { margin:0 0 16px; padding:14px 16px; border:2px solid #c62828; border-inline-start-width:8px; border-radius:8px; background:#fff5f5; color:#7f1d1d; } .a11y-error-summary ul { margin:8px 0 0; padding-inline-start:20px; } .a11y-error-summary button { padding:2px 0; border:0; background:none; color:#b71c1c; font:inherit; text-align:start; text-decoration:underline; cursor:pointer; } .a11y-sr-only { position:absolute!important; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; } /* ---------- Image descriptions ---------- */ .a11y-alt-text { display:inline-block; max-width:260px; margin:4px; padding:3px 8px; border:1px solid #244b90; border-radius:6px; background:#eef4ff; color:#10243a; font:600 12px/1.35 Tahoma,Verdana,sans-serif; vertical-align:middle; white-space:normal; } .a11y-alt-text.a11y-alt-missing { border-color:#c2410c; background:#fff3e8; color:#7c2d12; } .a11y-flash { outline:4px solid #ff8f00!important; outline-offset:4px!important; transition:outline-color .3s; } /* ---------- Overlays ---------- */ .a11y-overlay { position:fixed; pointer-events:none; z-index:2147483000; } .a11y-guide { left:0; right:0; top:0; height:12px; background:rgba(255,200,0,.28); border-top:2px solid #e0a800; border-bottom:2px solid #e0a800; will-change:transform; } .a11y-mask { left:0; right:0; background:rgba(0,0,0,.55); } .a11y-mask-top { top:0; height:40vh; } .a11y-mask-bottom { bottom:0; top:60vh; } .a11y-magnifier { max-width:min(560px, calc(100vw - 24px)); padding:12px 16px; border:2px solid #ffd54f; border-radius:10px; background:#111; color:#fff; font:600 26px/1.4 Tahoma,Verdana,sans-serif; box-shadow:0 10px 30px rgba(0,0,0,.4); white-space:pre-wrap; } .a11y-magnifier[hidden], .a11y-tip[hidden] { display:none; } .a11y-tip { max-width:min(420px, calc(100vw - 16px)); padding:8px 12px; border-radius:8px; background:#10243a; color:#fff; font:600 14px/1.4 Tahoma,Verdana,sans-serif; box-shadow:0 6px 20px rgba(0,0,0,.3); } /* ===================================================================== Toolbar UI ===================================================================== */ #raqibA11y { --a-bg:#ffffff; --a-surface:#f3f6fa; --a-border:#d5dfe9; --a-text:#1a2f45; --a-muted:#5a6f83; --a-accent:var(--raqib-accent,#244b90); --a-accent-soft:var(--raqib-accent-soft,#e8eef8); --a-on-accent:#fff; font-family:"Segoe UI",Tahoma,Arial,sans-serif; font-size:14px; line-height:1.4; color:var(--a-text); letter-spacing:normal; word-spacing:normal; text-align:start; font-weight:400; } html[data-a11y-theme="contrast-dark"] #raqibA11y { --a-bg:#000; --a-surface:#000; --a-border:#fff; --a-text:#fff; --a-muted:#ffeb3b; --a-accent:#ffeb3b; --a-accent-soft:#333; --a-on-accent:#000; } html[data-a11y-theme="contrast-light"] #raqibA11y { --a-bg:#fff; --a-surface:#fff; --a-border:#000; --a-text:#000; --a-muted:#000; --a-accent:#0000c8; --a-accent-soft:#e6e6ff; --a-on-accent:#fff; } #raqibA11y *, #raqibA11y *::before, #raqibA11y *::after { box-sizing:border-box; } #raqibA11y [hidden] { display:none!important; } #raqibA11y button { font:inherit; color:inherit; letter-spacing:normal; text-transform:none; margin:0; cursor:pointer; } #raqibA11y button:focus-visible, #raqibA11y a:focus-visible { outline:3px solid #ff8f00; outline-offset:2px; } #raqibA11y svg { flex:none; } #raqibA11y .a11y-sr { position:absolute!important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; } #raqibA11y .a11y-skip { position:fixed; top:-60px; inset-inline-start:12px; z-index:2147483647; padding:10px 16px; border-radius:0 0 8px 8px; background:var(--a-accent); color:var(--a-on-accent); font-weight:700; text-decoration:none; transition:top .15s; } #raqibA11y .a11y-skip:focus { top:0; } #raqibA11y .a11y-launcher { position:fixed; bottom:84px; inset-inline-end:18px; z-index:2147483600; display:inline-flex; width:56px; height:56px; padding:0; align-items:center; justify-content:center; border:3px solid #fff; border-radius:50%; background:var(--a-accent); color:var(--a-on-accent); box-shadow:0 6px 20px rgba(14,38,64,.35); transition:transform .15s ease, box-shadow .15s ease; } #raqibA11y[data-side="start"] .a11y-launcher { inset-inline-end:auto; inset-inline-start:18px; } #raqibA11y .a11y-launcher:hover { transform:scale(1.06); box-shadow:0 8px 26px rgba(14,38,64,.42); } #raqibA11y .a11y-badge { position:absolute; top:-4px; inset-inline-end:-4px; display:none; min-width:21px; height:21px; padding:0 5px; border:2px solid #fff; border-radius:11px; background:#d9480f; color:#fff; font-size:11px; font-weight:700; line-height:17px; text-align:center; } #raqibA11y.has-changes .a11y-badge { display:block; } #raqibA11y[data-launcher="hide"] .a11y-launcher { display:none; } #raqibA11y .a11y-panel { position:fixed; top:0; bottom:0; inset-inline-end:0; z-index:2147483601; display:flex; width:400px; max-width:100vw; flex-direction:column; border-inline-start:1px solid var(--a-border); background:var(--a-bg); color:var(--a-text); box-shadow:-12px 0 40px rgba(14,38,64,.25); animation:a11y-in .18s ease-out; } #raqibA11y[data-side="start"] .a11y-panel { inset-inline-end:auto; inset-inline-start:0; border-inline-start:0; border-inline-end:1px solid var(--a-border); } @keyframes a11y-in { from { opacity:0; } to { opacity:1; } } #raqibA11y .a11y-head { display:flex; padding:18px 18px 14px; align-items:flex-start; gap:12px; background:var(--a-accent); color:var(--a-on-accent); } #raqibA11y .a11y-head > div { flex:1; min-width:0; } #raqibA11y .a11y-head h2 { display:flex; margin:0; align-items:center; gap:8px; color:inherit; font-size:20px; font-weight:700; } #raqibA11y .a11y-head p { margin:6px 0 0; color:inherit; opacity:.88; font-size:12.5px; } #raqibA11y .a11y-close { display:inline-flex; width:38px; height:38px; padding:0; flex:none; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:rgba(255,255,255,.12); } html[data-a11y-theme^="contrast"] #raqibA11y .a11y-close { border-color:currentColor; } #raqibA11y .a11y-close:hover { background:rgba(255,255,255,.25); } #raqibA11y .a11y-body { flex:1; padding:6px 16px 18px; overflow-y:auto; overscroll-behavior:contain; } #raqibA11y h3 { margin:18px 2px 9px; color:var(--a-muted); font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; } #raqibA11y[lang="ar"] h3 { letter-spacing:0; font-size:13px; } #raqibA11y .a11y-note { margin:8px 2px 0; color:var(--a-muted); font-size:12px; } #raqibA11y .a11y-chips { display:flex; flex-wrap:wrap; gap:7px; } #raqibA11y .a11y-chip { padding:7px 12px; border:1px solid var(--a-border); border-radius:999px; background:var(--a-surface); font-size:12.5px; font-weight:600; } #raqibA11y .a11y-chip:hover { border-color:var(--a-accent); } #raqibA11y .a11y-chip[aria-pressed="true"] { border-color:var(--a-accent); background:var(--a-accent); color:var(--a-on-accent); } #raqibA11y .a11y-themes { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; } #raqibA11y .a11y-theme { display:flex; padding:7px 4px 8px; flex-direction:column; align-items:center; gap:6px; border:2px solid var(--a-border); border-radius:10px; background:var(--a-surface); font-size:11px; font-weight:600; line-height:1.2; text-align:center; } #raqibA11y .a11y-theme[aria-checked="true"] { border-color:var(--a-accent); box-shadow:0 0 0 2px var(--a-accent-soft); } #raqibA11y .a11y-theme-swatch { display:flex; width:44px; height:30px; padding:4px; flex-direction:column; gap:3px; border:1px solid rgba(0,0,0,.18); border-radius:6px; } #raqibA11y .a11y-theme-swatch i { display:block; height:4px; border-radius:2px; } #raqibA11y .a11y-theme-swatch i:nth-child(2) { width:70%; } #raqibA11y .a11y-theme-swatch i:nth-child(3) { width:45%; } #raqibA11y .a11y-sw-default { background:#eef2f7; } #raqibA11y .a11y-sw-default i { background:#244b90; } #raqibA11y .a11y-sw-dark { background:#1c2128; } #raqibA11y .a11y-sw-dark i { background:#9cc3ff; } #raqibA11y .a11y-sw-contrast-dark { background:#000; border-color:#fff; } #raqibA11y .a11y-sw-contrast-dark i { background:#ffeb3b; } #raqibA11y .a11y-sw-contrast-light { background:#fff; border-color:#000; } #raqibA11y .a11y-sw-contrast-light i { background:#000; } #raqibA11y .a11y-sw-auto { background:linear-gradient(135deg,#eef2f7 50%,#1c2128 50%); } #raqibA11y .a11y-sw-auto i { background:#5b8fd6; } #raqibA11y .a11y-sw-schedule { background:linear-gradient(180deg,#eef2f7 50%,#14233a 50%); } #raqibA11y .a11y-sw-schedule i { background:#e0a800; } #raqibA11y .a11y-sw-sepia { background:#f4ead7; } #raqibA11y .a11y-sw-sepia i { background:#7a5a2f; } #raqibA11y .a11y-accents { display:flex; flex-wrap:wrap; gap:10px; } #raqibA11y .a11y-accent { position:relative; display:inline-flex; width:36px; height:36px; padding:0; align-items:center; justify-content:center; border:3px solid var(--a-bg); border-radius:50%; color:#fff; box-shadow:0 0 0 1px var(--a-border); } #raqibA11y .a11y-accent svg { opacity:0; } #raqibA11y .a11y-accent[aria-checked="true"] { box-shadow:0 0 0 2px var(--a-text); } #raqibA11y .a11y-accent[aria-checked="true"] svg { opacity:1; } #raqibA11y .a11y-ac-default { background:#244b90; } #raqibA11y .a11y-ac-teal { background:#0f766e; } #raqibA11y .a11y-ac-green { background:#2f7a35; } #raqibA11y .a11y-ac-custom { background:conic-gradient(#e53935,#fb8c00,#fdd835,#43a047,#1e88e5,#8e24aa,#e53935); } #raqibA11y .a11y-ac-custom > svg:first-of-type { position:absolute; opacity:1; width:16px; height:16px; color:#fff; filter:drop-shadow(0 0 2px rgba(0,0,0,.6)); } #raqibA11y .a11y-ac-custom[aria-checked="true"] > svg:first-of-type { opacity:0; } #raqibA11y .a11y-ac-purple { background:#5b3fa0; } #raqibA11y .a11y-ac-maroon { background:#8a1538; } #raqibA11y .a11y-ac-orange { background:#a8520a; } #raqibA11y .a11y-ac-graphite { background:#374151; } #raqibA11y .a11y-appearance { margin-top:14px; padding:2px 12px 14px; border:1px solid var(--a-border); border-radius:14px; background:linear-gradient(180deg,var(--a-accent-soft),var(--a-bg) 140px); } #raqibA11y .a11y-h-strong { display:flex; align-items:center; gap:6px; color:var(--a-text)!important; font-size:13px!important; } #raqibA11y h4 { margin:14px 2px 8px; color:var(--a-muted); font-size:12px; font-weight:700; } #raqibA11y .a11y-preview-note { margin-top:-4px!important; } #raqibA11y .a11y-picker { display:inline-flex; margin:10px 2px 0; align-items:center; gap:8px; color:var(--a-accent); font-size:12.5px; font-weight:600; cursor:pointer; } #raqibA11y .a11y-picker input { width:34px; height:26px; padding:0; border:1px solid var(--a-border); border-radius:6px; background:none; cursor:pointer; } #raqibA11y .a11y-contrast-note:empty { display:none; } #raqibA11y .a11y-seg-row { display:flex; margin-top:12px; align-items:center; justify-content:space-between; gap:10px; } #raqibA11y .a11y-seg-label { color:var(--a-text); font-size:12.5px; font-weight:600; } #raqibA11y .a11y-seg { display:inline-flex; padding:3px; gap:2px; border:1px solid var(--a-border); border-radius:10px; background:var(--a-surface); } #raqibA11y .a11y-seg button { min-height:32px; padding:4px 10px; border:0; border-radius:7px; background:none; color:var(--a-text); font-size:12px; font-weight:600; } #raqibA11y .a11y-seg button:hover { background:var(--a-accent-soft); } #raqibA11y .a11y-seg button[aria-checked="true"] { background:var(--a-accent); color:var(--a-on-accent); } #raqibA11y .a11y-darktoggle { display:inline-flex; width:38px; height:38px; padding:0; flex:none; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:rgba(255,255,255,.12); } #raqibA11y .a11y-darktoggle:hover { background:rgba(255,255,255,.25); } #raqibA11y .a11y-darktoggle[aria-pressed="true"] { background:#ffd54f; border-color:#ffd54f; color:#1a1a1a; } html[data-a11y-theme^="contrast"] #raqibA11y .a11y-darktoggle { border-color:currentColor; } #raqibA11y .a11y-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; } #raqibA11y .a11y-tile { position:relative; display:flex; min-height:96px; padding:10px 6px 9px; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:2px solid var(--a-border); border-radius:12px; background:var(--a-surface); color:var(--a-text); font-size:12px; font-weight:600; line-height:1.2; text-align:center; transition:border-color .12s, background-color .12s; } #raqibA11y button.a11y-tile:hover { border-color:var(--a-accent); } #raqibA11y .a11y-tile.is-active { border-color:var(--a-accent); background:var(--a-accent-soft); } #raqibA11y .a11y-tile-icon { display:inline-flex; color:var(--a-accent); } #raqibA11y .a11y-tile-value { min-height:14px; color:var(--a-muted); font-size:11px; font-weight:500; } #raqibA11y .a11y-tile-value:empty { display:none; } #raqibA11y .a11y-tile-check { position:absolute; top:6px; inset-inline-end:6px; display:none; width:18px; height:18px; align-items:center; justify-content:center; border-radius:50%; background:var(--a-accent); color:var(--a-on-accent); } #raqibA11y .a11y-tile.is-active .a11y-tile-check { display:inline-flex; } #raqibA11y .a11y-dots { display:flex; gap:3px; } #raqibA11y .a11y-dots:empty { display:none; } #raqibA11y .a11y-dots i { width:14px; height:4px; border-radius:2px; background:var(--a-border); } #raqibA11y .a11y-dots i.on { background:var(--a-accent); }#raqibA11y .a11y-stepper { grid-column:span 2; } #raqibA11y .a11y-step-row { display:flex; align-items:center; gap:10px; } #raqibA11y .a11y-step { display:inline-flex; width:32px; height:32px; padding:0; align-items:center; justify-content:center; border:1px solid var(--a-border); border-radius:8px; background:var(--a-bg); } #raqibA11y .a11y-step:hover:not(:disabled) { border-color:var(--a-accent); color:var(--a-accent); } #raqibA11y .a11y-step:disabled { opacity:.4; cursor:default; } #raqibA11y .a11y-step-value { min-width:48px; font-size:15px; font-weight:700; text-align:center; } #raqibA11y .a11y-wide { display:flex; width:100%; min-height:44px; margin-top:12px; padding:10px 14px; align-items:center; justify-content:center; gap:8px; border:2px solid var(--a-border); border-radius:10px; background:var(--a-surface); font-weight:600; } #raqibA11y .a11y-wide:hover { border-color:var(--a-accent); } #raqibA11y .a11y-read.is-active { border-color:var(--a-accent); background:var(--a-accent); color:var(--a-on-accent); } #raqibA11y .a11y-structure { margin-top:8px; padding:10px 12px; border:2px solid var(--a-border); border-radius:10px; background:var(--a-surface); max-height:320px; overflow:auto; } #raqibA11y .a11y-structure h4 { margin:6px 0; color:var(--a-muted); font-size:12px; font-weight:700; } #raqibA11y .a11y-structure ul { margin:0 0 8px; padding:0; list-style:none; } #raqibA11y .a11y-structure p { margin:4px 0; color:var(--a-muted); } #raqibA11y .a11y-structure button { display:flex; width:100%; padding:6px 8px; align-items:center; gap:8px; border:0; border-radius:6px; background:none; color:var(--a-text); text-align:start; } #raqibA11y .a11y-structure button:hover { background:var(--a-accent-soft); } #raqibA11y .a11y-structure .a11y-lv { flex:none; min-width:26px; padding:1px 4px; border-radius:4px; background:var(--a-accent); color:var(--a-on-accent); font-size:10px; font-weight:700; text-align:center; } #raqibA11y .a11y-lv3 button { padding-inline-start:20px; } #raqibA11y .a11y-lv4 button, #raqibA11y .a11y-lv5 button, #raqibA11y .a11y-lv6 button { padding-inline-start:32px; } #raqibA11y .a11y-keys { margin-top:12px; border:2px solid var(--a-border); border-radius:10px; background:var(--a-surface); } #raqibA11y .a11y-keys summary { display:flex; min-height:44px; padding:10px 14px; align-items:center; justify-content:center; gap:8px; font-weight:600; cursor:pointer; } #raqibA11y .a11y-keys table { width:100%; margin:0; border-collapse:collapse; font-size:12.5px; } #raqibA11y .a11y-keys th, #raqibA11y .a11y-keys td { padding:6px 12px; border-top:1px solid var(--a-border); text-align:start; vertical-align:top; } #raqibA11y .a11y-keys th { white-space:nowrap; font-weight:400; } #raqibA11y kbd { display:inline-block; padding:2px 6px; border:1px solid var(--a-border); border-bottom-width:2px; border-radius:5px; background:var(--a-bg); color:var(--a-text); font:600 11.5px/1.3 Consolas,monospace; } #raqibA11y .a11y-foot { display:flex; padding:4px 16px 14px; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px; border-top:1px solid var(--a-border); background:var(--a-bg); } #raqibA11y .a11y-reset { background:var(--a-accent); border-color:var(--a-accent); color:var(--a-on-accent); } #raqibA11y .a11y-reset:hover { filter:brightness(1.08); } #raqibA11y .a11y-link { display:inline-flex; padding:6px 2px; align-items:center; gap:6px; border:0; background:none; color:var(--a-accent); font-size:12.5px; font-weight:600; text-decoration:underline; } #raqibA11y .a11y-shortcut { color:var(--a-muted); font-size:11.5px; } @media (max-width:480px) { #raqibA11y .a11y-panel { width:100vw; } #raqibA11y .a11y-themes { grid-template-columns:repeat(3,1fr); } #raqibA11y .a11y-seg-row { flex-direction:column; align-items:flex-start; } #raqibA11y .a11y-launcher { width:50px; height:50px; bottom:76px; inset-inline-end:12px; } } @media (prefers-reduced-motion:reduce) { #raqibA11y .a11y-panel { animation:none; } } @media print { #raqibA11y, .a11y-overlay { display:none!important; } }