/* SANID Portal — global theme & navigation */
:root {
    --sanid-primary: #193476;
    --sanid-primary-dark: #142a5e;
    --sanid-primary-mid: #1f3b73;
    --sanid-primary-light: #2f5da8;
    --sanid-accent: #3d7dd4;
    --sanid-surface: #ffffff;
    --sanid-page-bg: #f4f7fc;
    --sanid-border: #d5e0f2;
    --sanid-text: #1f2a44;
    --sanid-text-muted: #6c757d;
    --sanid-nav-height: 4rem;
    --sanid-radius: 0.65rem;
    --sanid-shadow: 0 4px 24px rgba(25, 52, 118, 0.12);
    --sanid-shadow-sm: 0 2px 12px rgba(25, 52, 118, 0.08);
    --sanid-nav-hover-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --sanid-nav-hover-duration: 0.28s;
    --sanid-sidebar-width-expanded: 17rem;
    --sanid-sidebar-width-collapsed: 5rem;
    --sanid-side-icon-size: 1.35rem;
}

body.sanid-portal-body {
    background: none;
    background-color: transparent;
    color: var(--sanid-text);
    font-family: 'Cairo-Regular', 'Segoe UI', Tahoma, sans-serif;
    min-height: 100vh;
    --sanid-nav-inline-size: auto;
}

/* ── App shell & dock layout ── */
.sanid-shell {
    display: grid;
    min-height: 100vh;
    grid-template-areas: "nav" "content";
    grid-template-rows: auto 1fr;
    grid-template-columns: minmax(0, 1fr);
}

.sanid-nav-host {
    grid-area: nav;
    z-index: 1030;
    min-height: var(--sanid-nav-height);
}

html.sanid-dock-left .sanid-nav-host,
html.sanid-dock-right .sanid-nav-host {
    height: 100%;
    min-height: 0;
}

.sanid-shell-body {
    grid-area: content;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

html.sanid-dock-top .sanid-shell {
    grid-template-areas: "nav" "content";
    grid-template-rows: auto 1fr;
}

html.sanid-dock-bottom .sanid-shell {
    grid-template-areas: "content" "nav";
    grid-template-rows: 1fr auto;
}

html.sanid-dock-left .sanid-shell {
    grid-template-areas: "nav content";
    grid-template-columns: var(--sanid-nav-inline-size) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
}

html.sanid-dock-right .sanid-shell {
    grid-template-areas: "content nav";
    grid-template-columns: minmax(0, 1fr) var(--sanid-nav-inline-size);
    grid-template-rows: minmax(0, 1fr);
}

html.sanid-dock-left,
html.sanid-dock-right {
    height: 100%;
}

html.sanid-dock-left body.sanid-portal-body,
html.sanid-dock-right body.sanid-portal-body {
    height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
}

html.sanid-dock-left .sanid-shell,
html.sanid-dock-right .sanid-shell {
    height: 100dvh;
    min-height: 100dvh;
    max-height: 100dvh;
}

html.sanid-dock-left .sanid-shell-body,
html.sanid-dock-right .sanid-shell-body {
    overflow: auto;
}

/* ── Navbar ── */
.sanid-navbar {
    background: linear-gradient(135deg, var(--sanid-primary-dark) 0%, var(--sanid-primary-mid) 45%, var(--sanid-primary-light) 100%);
    box-shadow: var(--sanid-shadow);
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    min-height: var(--sanid-nav-height);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 7px;
}

html.sanid-dock-left .sanid-navbar,
html.sanid-dock-right .sanid-navbar {
    background: linear-gradient(180deg, var(--sanid-primary-dark) 0%, var(--sanid-primary-mid) 50%, var(--sanid-primary-light) 100%);
    border-bottom: none;
}

.sanid-navbar-inner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    min-width: 0;
    min-height: var(--sanid-nav-height);
    padding: 0 0.85rem;
}

html.sanid-dock-left .sanid-navbar-inner,
html.sanid-dock-right .sanid-navbar-inner {
    flex-direction: column;
    align-items: stretch;
    height: 100%;
    min-height: 0;
    padding: 0.75rem 0.5rem;
    overflow: visible;
}

.sanid-brand-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

html.sanid-dock-left .sanid-brand-row,
html.sanid-dock-right .sanid-brand-row {
    width: 100%;
    flex-direction: column;
    align-items: center;
    gap: 0.65rem;
    padding: 0.35rem 0.65rem 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    overflow: visible;
    box-sizing: border-box;
}

.sanid-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 0.35rem 0;
    text-decoration: none !important;
    transition: opacity 0.2s ease;
    flex: 0 0 auto;
    min-width: 0;
    overflow: visible;
}

.sanid-brand:hover {
    opacity: 0.92;
}

.sanid-brand-icon {
    display: none;
    width: 2.75rem;
    height: 2.75rem;
    object-fit: contain;
    object-position: center center;
    flex-shrink: 0;
    background: transparent;
    border: 0;
    border-radius: 7px;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-brand-icon,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-brand-icon {
    width: 2.75rem;
    height: 2.75rem;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-brand,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-brand {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0.4rem 0;
    text-align: center;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-brand.navbar-brand,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-brand.navbar-brand {
    margin-left: auto;
    margin-right: auto;
    float: none;
}

.sanid-brand-large {
    display: none;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
}

.sanid-brand-customer {
    display: block !important;
    width: auto;
    max-width: min(100%, 11rem);
    max-height: 2.75rem;
    object-fit: contain;
    object-position: center;
}

.default-home-brand {
    width: 100%;
}

.default-customer-logo {
    width: auto;
    max-width: min(100%, 20rem);
    max-height: 8rem;
    object-fit: contain;
}

.default-sanid-logo-icon {
    width: 100px;
    max-width: 100%;
}

.default-sanid-logo-name {
    width: 280px;
    max-width: 100%;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-brand-customer,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-brand-customer {
    width: 100%;
    max-width: 100%;
    max-height: 3.75rem;
}

html.sanid-dock-top .sanid-brand-large,
html.sanid-dock-bottom .sanid-brand-large {
    display: none !important;
}

html.sanid-dock-top .sanid-brand-icon,
html.sanid-dock-bottom .sanid-brand-icon,
html.sanid-sidebar-collapsed .sanid-brand-icon {
    display: block;
}

html.sanid-dock-top .sanid-brand,
html.sanid-dock-bottom .sanid-brand {
    justify-content: flex-start;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-brand-large,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-brand-large {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 3.75rem;
    margin: 0 auto;
    object-fit: contain;
    object-position: center center;
    background: white;
    border-radius: 11px;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-brand,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    padding: 0.15rem 0;
    text-align: center;
    overflow: visible;
    box-sizing: border-box;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-brand-icon,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-brand-icon,
html.sanid-sidebar-collapsed .sanid-brand-large {
    display: none !important;
}

html.sanid-sidebar-collapsed .sanid-brand {
    justify-content: center;
}

.sanid-sidebar-toggle-wrap {
    display: none;
    flex-shrink: 0;
}

html.sanid-dock-left .sanid-sidebar-toggle-wrap,
html.sanid-dock-right .sanid-sidebar-toggle-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
}

.sanid-nav-drag-wrap {
    display: none;
    flex-shrink: 0;
}

@media (min-width: 992px) {
    html.sanid-dock-top .sanid-nav-drag-wrap,
    html.sanid-dock-bottom .sanid-nav-drag-wrap,
    html.sanid-dock-left .sanid-nav-drag-wrap,
    html.sanid-dock-right .sanid-nav-drag-wrap {
        display: block;
    }
}

.sanid-sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 2.35rem;
    height: 2.35rem;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 0.45rem;
    background: rgba(255, 255, 255, 0.1);
    color: #fff !important;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.15s ease;
}

.sanid-sidebar-toggle:hover {
    background: rgba(255, 255, 255, 0.2);
}

.sanid-sidebar-toggle i {
    color: #fff !important;
}

html.sanid-sidebar-collapsed .sanid-brand-row {
    justify-content: center;
    align-items: center;
}

.sanid-brand {
    flex-shrink: 0;
}

.sanid-nav-collapse {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
}

/* Nav panel — side dock always visible; top/bottom follow viewport rules below */
.sanid-navbar .sanid-nav-panel {
    visibility: visible !important;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    gap: 0.5rem;
}

html.sanid-dock-left .sanid-navbar .sanid-nav-panel,
html.sanid-dock-right .sanid-navbar .sanid-nav-panel {
    display: flex !important;
}

html.sanid-dock-top .sanid-navbar .sanid-nav-panel,
html.sanid-dock-bottom .sanid-navbar .sanid-nav-panel {
    flex-direction: row;
    align-items: center;
}

html.sanid-dock-left .sanid-navbar .sanid-nav-panel,
html.sanid-dock-right .sanid-navbar .sanid-nav-panel {
    flex-direction: column;
    align-items: stretch;
    overflow: visible;
}

html.sanid-dock-left .sanid-nav-menu-rail,
html.sanid-dock-right .sanid-nav-menu-rail {
    flex-direction: column;
    align-items: stretch;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    overflow: hidden;
}

@media (min-width: 992px) {
    html.sanid-dock-left .sanid-nav-toggler,
    html.sanid-dock-right .sanid-nav-toggler {
        display: none !important;
    }
}

/* Scrollable menu rail */
.sanid-nav-menu-rail {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex: 1 1 auto;
    min-width: 0;
    position: relative;
}

.sanid-nav-scroll-viewport {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.sanid-nav-scroll-viewport::-webkit-scrollbar {
    display: none;
}

html.sanid-dock-top .sanid-nav-group.show,
html.sanid-dock-bottom .sanid-nav-group.show,
html.sanid-dock-top .sanid-nav-group.is-open,
html.sanid-dock-bottom .sanid-nav-group.is-open {
    overflow: visible;
    z-index: 8;
}

html.sanid-dock-top .sanid-nav-scroll-viewport,
html.sanid-dock-bottom .sanid-nav-scroll-viewport {
    overflow-x: auto;
    overflow-y: hidden;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
}

html.sanid-dock-top .sanid-nav-scroll-viewport.is-drag-scrolling,
html.sanid-dock-bottom .sanid-nav-scroll-viewport.is-drag-scrolling {
    cursor: grabbing;
    user-select: none;
}

html.sanid-dock-left .sanid-nav-scroll-viewport,
html.sanid-dock-right .sanid-nav-scroll-viewport {
    overflow-x: hidden;
    overflow-y: auto;
}

.sanid-nav-scroll-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.85rem;
    height: 1.85rem;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    color: #fff !important;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.sanid-nav-scroll-btn i,
.sanid-nav-drag-handle i,
.sanid-sidebar-toggle i {
    color: #fff !important;
}

.sanid-nav-scroll-btn:hover {
    background: rgba(255, 255, 255, 0.22);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);
}

.sanid-nav-scroll-btn.is-active {
    background: rgba(255, 255, 255, 0.24);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.12);
}

.sanid-nav-scroll-btn.is-active .sanid-scroll-wave {
    animation: sanidWaveRight 1.15s ease-in-out infinite;
}

.sanid-nav-scroll-prev.is-active .sanid-scroll-wave {
    animation-name: sanidWaveLeft;
}

html.sanid-dock-left .sanid-nav-scroll-btn,
html.sanid-dock-right .sanid-nav-scroll-btn {
    width: 100%;
    max-width: 2.5rem;
    margin: 0 auto;
}

@keyframes sanidWaveLeft {
    0%, 100% { transform: translateX(0); opacity: 0.75; }
    50% { transform: translateX(-4px); opacity: 1; }
}

@keyframes sanidWaveRight {
    0%, 100% { transform: translateX(0); opacity: 0.75; }
    50% { transform: translateX(4px); opacity: 1; }
}

.sanid-nav-rail-overflow::before,
.sanid-nav-rail-overflow::after {
    content: "";
    position: absolute;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.2s ease;
}

html.sanid-dock-top .sanid-nav-rail-overflow::before,
html.sanid-dock-bottom .sanid-nav-rail-overflow::before {
    left: 2rem;
    top: 0;
    bottom: 0;
    width: 1.25rem;
    background: linear-gradient(90deg, rgba(20, 42, 94, 0.55), transparent);
}

html.sanid-dock-top .sanid-nav-rail-overflow::after,
html.sanid-dock-bottom .sanid-nav-rail-overflow::after {
    right: 2rem;
    top: 0;
    bottom: 0;
    width: 1.25rem;
    background: linear-gradient(270deg, rgba(20, 42, 94, 0.55), transparent);
}

.sanid-nav-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.15rem;
    margin: 0;
    min-width: max-content;
}

html.sanid-dock-left .sanid-nav-menu,
html.sanid-dock-right .sanid-nav-menu {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    min-width: 0;
    gap: 0.35rem;
    padding: 0.35rem 0.15rem;
}

.sanid-nav-utils {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
    margin-inline-start: auto;
}

.sanid-lang-menu .sanid-lang-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    color: rgba(255, 255, 255, 0.92);
    border: 0;
    background: transparent;
    padding: 0.35rem 0.65rem;
    border-radius: 0.45rem;
    min-width: 0;
}

.sanid-lang-toggle-main {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
}

.sanid-lang-icon {
    font-size: 1.08rem;
    line-height: 1;
    flex-shrink: 0;
}

.sanid-lang-caret {
    display: none;
    font-size: 0.62rem;
    color: rgba(255, 255, 255, 0.9) !important;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.sanid-lang-menu .sanid-lang-toggle::after,
.sanid-lang-menu .sanid-lang-toggle::before,
html.sanid-dock-left .sanid-lang-menu.dropend > .sanid-lang-toggle.dropdown-toggle::after,
html.sanid-dock-right .sanid-lang-menu.dropstart > .sanid-lang-toggle.dropdown-toggle::before {
    display: none !important;
    content: none !important;
}

.sanid-lang-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #fff;
}

html.sanid-dock-left .sanid-lang-menu .sanid-lang-toggle,
html.sanid-dock-right .sanid-lang-menu .sanid-lang-toggle {
    width: 100%;
    justify-content: center;
    border-radius: var(--sanid-radius);
    padding: 0.72rem 0.5rem !important;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-lang-menu .sanid-lang-toggle,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-lang-menu .sanid-lang-toggle {
    flex-direction: row;
    gap: 0.45rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-lang-toggle-main,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-lang-toggle-main {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    width: auto;
    max-width: 100%;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-lang-label,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-lang-label {
    display: inline-block;
    width: auto;
    font-size: 0.88rem;
    font-weight: 600;
    text-align: start;
    white-space: nowrap;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-lang-caret,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-lang-caret,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-lang-caret,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-lang-caret {
    display: inline-block;
}

html.sanid-sidebar-collapsed .sanid-lang-label {
    display: none !important;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-lang-menu .sanid-lang-toggle,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-lang-menu .sanid-lang-toggle {
    width: 100%;
    margin: 0;
    padding: 0.72rem 0.5rem !important;
    background: transparent;
    border: 0;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-lang-toggle-main,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-lang-toggle-main {
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-lang-icon,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-lang-icon {
    width: var(--sanid-side-icon-size);
    min-width: var(--sanid-side-icon-size);
    text-align: center;
    font-size: 1.08rem !important;
}

html.sanid-dock-left .sanid-lang-menu.show .sanid-lang-caret,
html.sanid-dock-right .sanid-lang-menu.show .sanid-lang-caret {
    transform: rotate(180deg);
}

html.sanid-dock-top .sanid-lang-caret,
html.sanid-dock-bottom .sanid-lang-caret {
    display: inline-block;
}

html.sanid-dock-top .sanid-lang-menu.show .sanid-lang-caret,
html.sanid-dock-bottom .sanid-lang-menu.show .sanid-lang-caret {
    transform: rotate(180deg);
}

.sanid-lang-menu .sanid-lang-toggle:hover,
.sanid-lang-menu.show .sanid-lang-toggle {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.sanid-lang-menu .dropdown-item.active {
    font-weight: 600;
}

html[dir="rtl"] .sanid-lang-dropdown {
    text-align: right;
}

html.sanid-dock-left .sanid-nav-utils,
html.sanid-dock-right .sanid-nav-utils {
    margin-inline-start: 0;
    margin-top: auto;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    padding: 0.65rem 0.35rem 0.35rem;
    gap: 0.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    flex-shrink: 0;
    overflow: visible;
    position: relative;
    z-index: 6;
}

html.sanid-dock-left .sanid-nav-utils .dropdown-menu,
html.sanid-dock-right .sanid-nav-utils .dropdown-menu {
    position: fixed !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 1070 !important;
}

/* Drag handle & dock zones */
.sanid-nav-drag-handle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: 1px dashed rgba(255, 255, 255, 0.35);
    border-radius: 0.45rem;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.88);
    cursor: grab;
    touch-action: none;
}

.sanid-nav-drag-handle:hover {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.sanid-nav-drag-handle:active,
body.sanid-nav-dragging .sanid-nav-drag-handle {
    cursor: grabbing;
}

.sanid-drag-grip-v {
    display: none;
}

html.sanid-dock-left .sanid-drag-grip-h,
html.sanid-dock-right .sanid-drag-grip-h {
    display: none;
}

html.sanid-dock-left .sanid-drag-grip-v,
html.sanid-dock-right .sanid-drag-grip-v {
    display: inline;
}

html.sanid-dock-left .sanid-nav-drag-handle,
html.sanid-dock-right .sanid-nav-drag-handle {
    width: 100%;
    margin-top: 0.35rem;
}

.sanid-dock-zones {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 2001;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.15s, visibility 0.15s;
}

body.sanid-nav-dragging .sanid-dock-zones {
    opacity: 1;
    visibility: visible;
}

.sanid-dock-zone {
    position: absolute;
    background: rgba(25, 52, 118, 0.12);
    border: 2px dashed rgba(61, 125, 212, 0.45);
    transition: background 0.12s, border-color 0.12s;
}

.sanid-dock-zone.is-active {
    background: rgba(47, 93, 168, 0.28);
    border-color: var(--sanid-accent);
}

.sanid-dock-zone-top { top: 0; left: 0; right: 0; height: 4.5rem; }
.sanid-dock-zone-bottom { bottom: 0; left: 0; right: 0; height: 4.5rem; }
.sanid-dock-zone-left { top: 0; bottom: 0; left: 0; width: 5.5rem; }
.sanid-dock-zone-right { top: 0; bottom: 0; right: 0; width: 5.5rem; }

body.sanid-nav-dragging {
    user-select: none;
}

body.sanid-nav-dragging .sanid-shell {
    pointer-events: none;
}

.sanid-navbar .navbar-toggler,
.sanid-navbar .sanid-nav-toggler {
    border-color: rgba(255, 255, 255, 0.55);
    padding: 0.35rem 0.55rem;
    color: #fff;
}

.sanid-navbar .navbar-toggler:focus,
.sanid-navbar .sanid-nav-toggler:focus {
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
}

.sanid-navbar .navbar-toggler-icon {
    --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    background-image: var(--bs-navbar-toggler-icon-bg);
    filter: none;
}

/* Main nav links */
.sanid-nav-menu {
    gap: 0.15rem;
    align-items: center;
}

.sanid-nav-menu > .nav-item > .nav-link,
.sanid-nav-menu > .nav-item > .dropdown-toggle,
.sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn {
    color: rgba(255, 255, 255, 0.92) !important;
    font-family: 'Cairo-SemiBold', 'Cairo-Regular', sans-serif;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.55rem 0.85rem !important;
    border-radius: var(--sanid-radius);
    border: 1px solid transparent;
    background: transparent;
    box-shadow: none;
    transition:
        background var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        border-color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        box-shadow var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        transform var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease);
    white-space: nowrap;
}

.sanid-nav-menu > .nav-item > .nav-link i,
.sanid-nav-menu > .nav-item > .dropdown-toggle i.sanid-nav-icon,
.sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn i.sanid-nav-icon {
    margin-inline-end: 0.4rem;
    opacity: 0.92;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.92) !important;
    transition:
        transform var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        opacity var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease);
}

.sanid-nav-menu > .nav-item > .nav-link .sanid-nav-caret,
.sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn .sanid-nav-caret {
    transition:
        transform var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        opacity var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease);
}

html.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link,
html.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link,
html.sanid-dock-left .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn,
html.sanid-dock-right .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.98rem;
    padding: 0.72rem 0.85rem !important;
}

html.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link i.sanid-nav-icon,
html.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link i.sanid-nav-icon,
html.sanid-dock-left .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn i.sanid-nav-icon,
html.sanid-dock-right .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn i.sanid-nav-icon {
    width: var(--sanid-side-icon-size);
    min-width: var(--sanid-side-icon-size);
    margin-right: 0 !important;
    text-align: center;
    font-size: 1.08rem !important;
    flex-shrink: 0;
}

html.sanid-dock-top .sanid-nav-menu > .nav-item > .nav-link:hover,
html.sanid-dock-top .sanid-nav-menu > .nav-item > .dropdown-toggle:hover,
html.sanid-dock-top .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
html.sanid-dock-bottom .sanid-nav-menu > .nav-item > .nav-link:hover,
html.sanid-dock-bottom .sanid-nav-menu > .nav-item > .dropdown-toggle:hover,
html.sanid-dock-bottom .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover {
    transform: translateY(-1px);
}

html.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link:hover,
html.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link:hover,
html.sanid-dock-left .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
html.sanid-dock-right .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
html.sanid-dock-left .sanid-nav-group.is-open > .sanid-nav-parent-btn,
html.sanid-dock-right .sanid-nav-group.is-open > .sanid-nav-parent-btn {
    transform: translateX(3px);
}

html[dir="rtl"].sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link:hover,
html[dir="rtl"].sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link:hover,
html[dir="rtl"].sanid-dock-left .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
html[dir="rtl"].sanid-dock-right .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
html[dir="rtl"].sanid-dock-left .sanid-nav-group.is-open > .sanid-nav-parent-btn,
html[dir="rtl"].sanid-dock-right .sanid-nav-group.is-open > .sanid-nav-parent-btn,
html.sanid-dock-left[dir="rtl"] .sanid-nav-menu > .nav-item > .nav-link:hover,
html.sanid-dock-right[dir="rtl"] .sanid-nav-menu > .nav-item > .nav-link:hover,
html.sanid-dock-left[dir="rtl"] .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
html.sanid-dock-right[dir="rtl"] .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover {
    transform: translateX(-3px);
}

html.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link .sanid-nav-label,
html.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link .sanid-nav-label,
html.sanid-dock-left .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn .sanid-nav-label,
html.sanid-dock-right .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn .sanid-nav-label {
    flex: 1 1 auto;
    text-align: left;
}

/* Balance Home row with parent items that have a caret */
html.sanid-dock-left .sanid-nav-menu > .nav-item:not(.sanid-nav-group) > .nav-link::after,
html.sanid-dock-right .sanid-nav-menu > .nav-item:not(.sanid-nav-group) > .nav-link::after {
    content: '';
    width: 0.72rem;
    flex-shrink: 0;
}

.sanid-nav-menu > .nav-item > .nav-link:hover,
.sanid-nav-menu > .nav-item > .dropdown-toggle:hover,
.sanid-nav-menu > .nav-item.show > .dropdown-toggle,
.sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
.sanid-nav-menu > .sanid-nav-group.is-open > .sanid-nav-parent-btn {
    background: rgba(255, 255, 255, 0.16) !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
}

.sanid-nav-menu > .nav-item > .nav-link:hover i.sanid-nav-icon,
.sanid-nav-menu > .nav-item > .dropdown-toggle:hover i.sanid-nav-icon,
.sanid-nav-menu > .nav-item.show > .dropdown-toggle i.sanid-nav-icon,
.sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover i.sanid-nav-icon,
.sanid-nav-menu > .sanid-nav-group.is-open > .sanid-nav-parent-btn i.sanid-nav-icon {
    opacity: 1;
    transform: scale(1.08);
}

.sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover .sanid-nav-caret,
.sanid-nav-menu > .sanid-nav-group.is-open > .sanid-nav-parent-btn .sanid-nav-caret {
    opacity: 1;
}

.sanid-nav-menu > .nav-item > .nav-link.active,
.sanid-nav-menu > .nav-item.sanid-nav-active > .dropdown-toggle,
.sanid-nav-menu > .nav-item.sanid-nav-active > .sanid-nav-parent-btn,
.sanid-nav-menu > .sanid-nav-group.sanid-nav-active > .sanid-nav-parent-btn,
.sanid-nav-menu > .sanid-nav-group.sanid-nav-active > .dropdown-toggle {
    background: rgba(255, 255, 255, 0.22) !important;
    color: #fff !important;
    box-shadow:
        inset 2px 0 0 rgba(255, 255, 255, 0.55),
        inset -2px 0 0 rgba(147, 197, 253, 0.75),
        inset 0 0 0 1px rgba(255, 255, 255, 0.24);
}

.sanid-nav-menu .dropdown-toggle::after {
    margin-left: 0.35rem;
    vertical-align: 0.15em;
    opacity: 0.85;
}

@media (prefers-reduced-motion: reduce) {
    .sanid-nav-menu > .nav-item > .nav-link,
    .sanid-nav-menu > .nav-item > .dropdown-toggle,
    .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn,
    .sanid-nav-menu > .nav-item > .nav-link i,
    .sanid-nav-menu > .nav-item > .dropdown-toggle i.sanid-nav-icon,
    .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn i.sanid-nav-icon,
    .sanid-nav-sublink,
    .sanid-nav-sublink i {
        transition-duration: 0.01ms !important;
    }

    html.sanid-dock-top .sanid-nav-menu > .nav-item > .nav-link:hover,
    html.sanid-dock-top .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
    html.sanid-dock-bottom .sanid-nav-menu > .nav-item > .nav-link:hover,
    html.sanid-dock-bottom .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover,
    html.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link:hover,
    html.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link:hover,
    html.sanid-dock-left .sanid-nav-sublink:hover,
    html.sanid-dock-right .sanid-nav-sublink:hover,
    html.sanid-dock-top .sanid-nav-sublink:hover,
    html.sanid-dock-bottom .sanid-nav-sublink:hover {
        transform: none;
    }

    .sanid-nav-menu > .nav-item > .nav-link:hover i.sanid-nav-icon,
    .sanid-nav-menu > .sanid-nav-group > .sanid-nav-parent-btn:hover i.sanid-nav-icon,
    .sanid-nav-sublink:hover i {
        transform: none;
    }
}

.sanid-nav-parent-btn.dropdown-toggle::after,
.sanid-nav-parent-btn.dropdown-toggle::before,
.sanid-navbar .sanid-nav-group.dropstart > .sanid-nav-parent-btn.dropdown-toggle::before,
.sanid-navbar .sanid-nav-group.dropend > .sanid-nav-parent-btn.dropdown-toggle::after {
    display: none !important;
    content: none !important;
}

/* Dropdown panels */
.sanid-navbar .dropdown-menu {
    border: 1px solid var(--sanid-border);
    border-radius: 0.75rem;
    box-shadow: var(--sanid-shadow);
    padding: 0.45rem;
    margin-top: 0.35rem !important;
    min-width: 13rem;
    animation: sanidDropdownIn 0.18s ease;
}

@keyframes sanidDropdownIn {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.sanid-navbar .dropdown-item {
    border-radius: 0.5rem;
    padding: 0.5rem 0.85rem;
    font-size: 0.88rem;
    font-family: 'Cairo-Regular', sans-serif;
    color: var(--sanid-text);
    transition: background 0.15s ease, color 0.15s ease, padding-left 0.15s ease;
}

.sanid-navbar .dropdown-item i {
    width: 1.1rem;
    margin-right: 0.45rem;
    color: var(--sanid-primary-light);
    font-size: 0.8rem;
}

.sanid-navbar .dropdown-item:hover,
.sanid-navbar .dropdown-item:focus {
    background: linear-gradient(90deg, #eef3fb, #f8fbff);
    color: var(--sanid-primary);
}

.sanid-navbar .dropdown-item.active,
.sanid-navbar .dropdown-item:active {
    background: linear-gradient(90deg, var(--sanid-primary-mid), var(--sanid-primary-light));
    color: #fff !important;
}

.sanid-navbar .dropdown-item.active i,
.sanid-navbar .dropdown-item:active i {
    color: rgba(255, 255, 255, 0.9);
}

.sanid-navbar .dropdown-divider {
    margin: 0.35rem 0.25rem;
    border-color: var(--sanid-border);
}

/* Nested sub-menus */
.sanid-navbar .dropend > .dropdown-toggle::after {
    margin-left: auto;
    float: right;
    margin-top: 0.35rem;
}

.sanid-navbar .dropend > .dropdown-menu {
    margin-top: 0 !important;
    margin-left: 0.25rem;
}

.sanid-nav-clock {
    display: none !important;
}

.sanid-user-menu .sanid-user-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    padding: 0.35rem !important;
    transition: background 0.2s ease, transform 0.15s ease;
}

.sanid-user-menu .sanid-user-toggle::after,
html.sanid-dock-right .sanid-user-menu.dropstart > .sanid-user-toggle.dropdown-toggle::before {
    display: none !important;
    content: none !important;
}

.sanid-user-toggle-main {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.sanid-user-label {
    display: none;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.88rem;
    font-weight: 600;
    color: #fff !important;
    text-align: left;
}

html.sanid-dock-left.sanid-sidebar-expanded .sanid-user-label,
html.sanid-dock-right.sanid-sidebar-expanded .sanid-user-label {
    display: block;
}

.sanid-user-caret {
    display: none;
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.9) !important;
    transition: transform 0.2s ease;
}

html.sanid-dock-left .sanid-user-menu .sanid-user-toggle,
html.sanid-dock-right .sanid-user-menu .sanid-user-toggle {
    width: 100%;
    border-radius: var(--sanid-radius);
    padding: 0.6rem 0.75rem !important;
    justify-content: space-between;
}

html.sanid-dock-left .sanid-user-toggle-main,
html.sanid-dock-right .sanid-user-toggle-main {
    width: 100%;
    justify-content: space-between;
    padding-left: 0.3rem;
}

html.sanid-dock-left .sanid-user-caret,
html.sanid-dock-right .sanid-user-caret {
    display: inline-block;
}

html.sanid-dock-left .sanid-user-menu.show .sanid-user-caret,
html.sanid-dock-right .sanid-user-menu.show .sanid-user-caret {
    transform: rotate(180deg);
}

.sanid-user-menu .sanid-user-toggle:hover,
.sanid-user-menu.show .sanid-user-toggle {
    background: rgba(255, 255, 255, 0.18) !important;
    color: #fff !important;
}

.sanid-user-dropdown-header {
    padding: 0.55rem 0.85rem 0.35rem;
    color: var(--sanid-text) !important;
}

.sanid-user-dropdown-header #sUserName {
    color: var(--sanid-primary) !important;
    font-weight: 600;
}

.sanid-user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #fff 0%, #e8f0ff 100%);
    color: var(--sanid-primary);
    font-size: 0.85rem;
}

.sanid-user-menu .dropdown-menu {
    min-width: 11rem;
}

.sanid-user-menu .dropdown-item.text-danger {
    color: #dc3545 !important;
}

.sanid-user-menu .dropdown-item.text-danger:hover {
    background: #fff5f5;
}

/* Page content area */
#master_content {
    float: none;
    width: 100%;
    height:100%;
}

.sanid-shell-body {
    /*background: var(--sanid-page-bg);*/
}

#master_contentplaceholder {
    padding: 0 1.25rem 2rem;
    flex: 1 1 auto;
    min-width: 0;
}

#master_contentfooter {
    clear: both;
    text-align: center;
    padding: 1rem 1.25rem;
    margin-top: auto;
    background: var(--sanid-surface);
    border-top: 1px solid var(--sanid-border);
    color: var(--sanid-text-muted);
    font-size: 0.82rem;
    letter-spacing: 0.04em;
}

/* Sync primary buttons site-wide */
.btn-primary {
    background: linear-gradient(135deg, var(--sanid-primary-mid), var(--sanid-primary-light));
    border-color: var(--sanid-primary-mid);
}

.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(135deg, var(--sanid-primary-dark), var(--sanid-primary-mid));
    border-color: var(--sanid-primary-dark);
}

.btn-outline-primary {
    color: var(--sanid-primary);
    border-color: var(--sanid-primary-light);
}

.btn-outline-primary:hover {
    background: var(--sanid-primary);
    border-color: var(--sanid-primary);
    color: #fff;
}

.btn-outline-primary:hover > i,
.btn-outline-primary:focus > i,
.btn-outline-primary:active > i,
.btn-outline-danger:hover > i,
.btn-outline-danger:focus > i,
.btn-outline-danger:active > i,
.btn-outline-secondary:hover > i,
.btn-outline-secondary:focus > i,
.btn-outline-secondary:active > i {
    color: #fff !important;
}

/* Clock only on side docks (never top/bottom) */
html.sanid-dock-top .sanid-nav-clock,
html.sanid-dock-bottom .sanid-nav-clock {
    display: none !important;
}

@media (min-width: 992px) {
    html.sanid-dock-left .sanid-nav-clock,
    html.sanid-dock-right .sanid-nav-clock {
        display: inline-block;
    }
}

/* Desktop horizontal navbar */
@media (min-width: 992px) {
    html.sanid-dock-top .sanid-nav-toggler,
    html.sanid-dock-bottom .sanid-nav-toggler {
        display: none !important;
    }

    html.sanid-dock-top .sanid-navbar .sanid-nav-panel,
    html.sanid-dock-bottom .sanid-navbar .sanid-nav-panel {
        display: flex !important;
        flex-direction: row !important;
        align-items: center;
        width: auto;
        margin: 0;
        padding: 0;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
    }

    html.sanid-dock-top .sanid-nav-menu-rail,
    html.sanid-dock-bottom .sanid-nav-menu-rail {
        flex-direction: row;
        align-items: center;
    }

    html.sanid-dock-top .sanid-nav-menu,
    html.sanid-dock-bottom .sanid-nav-menu {
        flex-direction: row !important;
        align-items: center;
        min-width: max-content;
    }

    html.sanid-dock-top .sanid-nav-utils,
    html.sanid-dock-bottom .sanid-nav-utils {
        flex-direction: row;
        align-items: center;
        margin-inline-start: auto;
        width: auto;
        padding-top: 0;
        margin-top: 0;
        border-top: 0;
    }
}

/* Mobile & tablet navbar */
@media (max-width: 991.98px) {
    html.sanid-dock-left .sanid-shell,
    html.sanid-dock-right .sanid-shell {
        grid-template-areas: "nav" "content";
        grid-template-rows: auto 1fr;
        grid-template-columns: minmax(0, 1fr);
        height: auto;
        min-height: 100vh;
        max-height: none;
    }

    html.sanid-dock-left body.sanid-portal-body,
    html.sanid-dock-right body.sanid-portal-body {
        height: auto;
        min-height: 100vh;
        overflow: auto;
    }

    html.sanid-dock-left .sanid-navbar-inner,
    html.sanid-dock-right .sanid-navbar-inner {
        flex-direction: row;
        align-items: center;
        height: auto;
        padding: 0 0.85rem;
    }

    html.sanid-dock-top .sanid-navbar-inner,
    html.sanid-dock-bottom .sanid-navbar-inner {
        flex-wrap: nowrap;
        align-items: center;
        min-height: var(--sanid-nav-height);
        height: auto;
        padding: 0.5rem 0.65rem;
        gap: 0.35rem;
    }

    html.sanid-dock-top .sanid-brand-row,
    html.sanid-dock-bottom .sanid-brand-row {
        flex: 0 0 auto;
        min-width: 0;
    }

    /* Top/bottom mobile: icon strip (like collapsed sidebar), not hamburger collapse */
    html.sanid-dock-top .sanid-nav-toggler,
    html.sanid-dock-bottom .sanid-nav-toggler {
        display: none !important;
    }

    html.sanid-dock-top .sanid-navbar .sanid-nav-panel,
    html.sanid-dock-bottom .sanid-navbar .sanid-nav-panel {
        display: flex !important;
        flex: 1 1 auto;
        flex-direction: row !important;
        align-items: center;
        min-width: 0;
        width: auto;
        margin: 0;
        padding: 0;
        background: transparent;
        border-radius: 0;
        box-shadow: none;
    }

    html.sanid-dock-top .sanid-nav-menu-rail,
    html.sanid-dock-bottom .sanid-nav-menu-rail {
        flex: 1 1 auto;
        flex-direction: row;
        align-items: center;
        min-width: 0;
    }

    html.sanid-dock-top .sanid-nav-scroll-viewport,
    html.sanid-dock-bottom .sanid-nav-scroll-viewport {
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    html.sanid-dock-left .sanid-nav-scroll-viewport,
    html.sanid-dock-right .sanid-nav-scroll-viewport {
        overflow: visible !important;
    }

    html.sanid-dock-top .sanid-nav-scroll-btn,
    html.sanid-dock-bottom .sanid-nav-scroll-btn,
    html.sanid-dock-left .sanid-nav-scroll-btn,
    html.sanid-dock-right .sanid-nav-scroll-btn {
        display: none !important;
    }

    html.sanid-dock-top .sanid-nav-menu,
    html.sanid-dock-bottom .sanid-nav-menu {
        flex-direction: row !important;
        flex-wrap: nowrap;
        align-items: center;
        min-width: max-content;
        width: auto;
    }

    html.sanid-dock-top .sanid-nav-label,
    html.sanid-dock-bottom .sanid-nav-label,
    html.sanid-dock-top .sanid-nav-caret,
    html.sanid-dock-bottom .sanid-nav-caret,
    html.sanid-dock-top .sanid-user-caret,
    html.sanid-dock-bottom .sanid-user-caret {
        display: none !important;
    }

    html.sanid-dock-top .sanid-nav-parent-btn,
    html.sanid-dock-bottom .sanid-nav-parent-btn,
    html.sanid-dock-top .sanid-nav-menu > .nav-item > .nav-link,
    html.sanid-dock-bottom .sanid-nav-menu > .nav-item > .nav-link {
        justify-content: center;
        padding: 0.55rem 0.5rem !important;
        width: auto;
    }

    html.sanid-dock-top .sanid-nav-menu > .nav-item:not(.sanid-nav-group) > .nav-link::after,
    html.sanid-dock-bottom .sanid-nav-menu > .nav-item:not(.sanid-nav-group) > .nav-link::after {
        display: none;
    }

    html.sanid-dock-top .sanid-nav-parent-btn i.sanid-nav-icon,
    html.sanid-dock-bottom .sanid-nav-parent-btn i.sanid-nav-icon,
    html.sanid-dock-top .sanid-nav-menu > .nav-item > .nav-link i.sanid-nav-icon,
    html.sanid-dock-bottom .sanid-nav-menu > .nav-item > .nav-link i.sanid-nav-icon {
        margin-right: 0 !important;
        font-size: 1.05rem !important;
    }

    html.sanid-dock-top .sanid-nav-utils,
    html.sanid-dock-bottom .sanid-nav-utils {
        flex: 0 0 auto;
        flex-direction: row;
        align-items: center;
        width: auto;
        padding-top: 0;
        border-top: 0;
        margin-top: 0;
        margin-inline-start: 0 !important;
    }

    html.sanid-dock-top .sanid-user-menu .dropdown-toggle,
    html.sanid-dock-bottom .sanid-user-menu .dropdown-toggle {
        justify-content: center;
        width: auto;
        padding: 0.35rem !important;
    }

    html.sanid-dock-top .sanid-nav-host,
    html.sanid-dock-bottom .sanid-nav-host,
    html.sanid-dock-top .sanid-navbar,
    html.sanid-dock-bottom .sanid-navbar,
    html.sanid-dock-top .sanid-navbar-inner,
    html.sanid-dock-bottom .sanid-navbar-inner,
    html.sanid-dock-top .sanid-nav-panel,
    html.sanid-dock-bottom .sanid-nav-panel,
    html.sanid-dock-top .sanid-nav-menu-rail,
    html.sanid-dock-bottom .sanid-nav-menu-rail {
        overflow: visible;
    }

    html.sanid-dock-top .sanid-nav-drag-wrap,
    html.sanid-dock-bottom .sanid-nav-drag-wrap {
        display: none !important;
    }

    .sanid-dock-zone-left,
    .sanid-dock-zone-right {
        display: none;
    }

    .sanid-sidebar-toggle {
        display: none !important;
    }
}

@media (max-width: 575.98px) {
    html.sanid-dock-top .sanid-brand-large,
    html.sanid-dock-bottom .sanid-brand-large {
        max-height: 2.5rem;
    }

    html.sanid-dock-top .sanid-navbar-inner,
    html.sanid-dock-bottom .sanid-navbar-inner {
        padding: 0.45rem 0.65rem;
    }
}

/* Parent accordion menus */
.sanid-nav-parent-btn {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.sanid-nav-parent-btn .sanid-nav-caret {
    margin-left: auto;
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.85) !important;
    transition: transform 0.2s ease;
}

html.sanid-dock-left .sanid-nav-group.is-open > .sanid-nav-parent-btn .sanid-nav-caret,
html.sanid-dock-right .sanid-nav-group.is-open > .sanid-nav-parent-btn .sanid-nav-caret {
    transform: rotate(180deg);
}

html.sanid-dock-top .sanid-nav-group.show > .sanid-nav-parent-btn .sanid-nav-caret,
html.sanid-dock-bottom .sanid-nav-group.show > .sanid-nav-parent-btn .sanid-nav-caret,
html.sanid-dock-top .sanid-nav-group.is-open > .sanid-nav-parent-btn .sanid-nav-caret,
html.sanid-dock-bottom .sanid-nav-group.is-open > .sanid-nav-parent-btn .sanid-nav-caret {
    transform: rotate(180deg);
}

.sanid-nav-subnav {
    list-style: none;
    margin: 0;
    padding: 0;
    display: none;
}

/* Left side dock: accordion below parent */
html.sanid-dock-left .sanid-nav-group .dropdown-menu {
    position: static !important;
    transform: none !important;
    float: none;
    border: none;
    box-shadow: none;
    background: transparent;
    padding: 0;
    margin: 0 !important;
}

html.sanid-dock-left .sanid-nav-group:not(.is-open) > .sanid-nav-subnav {
    display: none !important;
}

html.sanid-dock-left:not(.sanid-sidebar-collapsed) .sanid-nav-group.is-open > .sanid-nav-subnav {
    display: block !important;
}

html.sanid-dock-left .sanid-nav-subnav {
    padding: 0.2rem 0 0.45rem 0.15rem;
    margin: 0 0 0.15rem 0.85rem;
    border-left: 2px solid rgba(255, 255, 255, 0.22);
}

/* Right side dock + collapsed left: flyout panel (shown only after JS adds .sanid-flyout-open) */
html.sanid-dock-right .sanid-nav-host,
html.sanid-dock-right .sanid-navbar {
    overflow: visible;
}

html.sanid-dock-right .sanid-nav-menu-rail {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

html.sanid-dock-right .sanid-nav-group > .sanid-nav-subnav:not(.sanid-flyout-open) {
    display: none !important;
    pointer-events: none !important;
    visibility: hidden !important;
}

.sanid-nav-group > .sanid-nav-subnav.sanid-flyout-open {
    display: block !important;
    position: fixed !important;
    transform: none !important;
    float: none !important;
    margin: 0 !important;
    min-width: 12.5rem;
    max-width: min(18rem, calc(100vw - 1.5rem));
    padding: 0.45rem !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 0.75rem !important;
    box-shadow: var(--sanid-shadow) !important;
    background: linear-gradient(180deg, var(--sanid-primary-dark), var(--sanid-primary-mid)) !important;
    z-index: 1070 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    animation: none !important;
}

html.sanid-dock-left .sanid-nav-sublink,
html.sanid-dock-right .sanid-nav-sublink {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.65rem;
    border-radius: 0.5rem;
    color: rgba(255, 255, 255, 0.94) !important;
    text-decoration: none;
    font-size: 0.86rem;
    border: 1px solid transparent;
    transition:
        background var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        border-color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        transform var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        box-shadow var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease);
}

html.sanid-dock-left .sanid-nav-sublink i,
html.sanid-dock-right .sanid-nav-sublink i {
    width: 1rem;
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: 0.78rem;
    transition:
        transform var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease);
}

html.sanid-dock-left .sanid-nav-sublink:hover,
html.sanid-dock-right .sanid-nav-sublink:hover {
    background: rgba(255, 255, 255, 0.16);
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.18);
    transform: translateX(2px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

html[dir="rtl"].sanid-dock-left .sanid-nav-sublink:hover,
html[dir="rtl"].sanid-dock-right .sanid-nav-sublink:hover,
html.sanid-dock-left[dir="rtl"] .sanid-nav-sublink:hover,
html.sanid-dock-right[dir="rtl"] .sanid-nav-sublink:hover {
    transform: translateX(-2px);
}

html.sanid-dock-left .sanid-nav-sublink:hover i,
html.sanid-dock-right .sanid-nav-sublink:hover i {
    transform: scale(1.06);
    color: #fff !important;
}

html.sanid-dock-left .sanid-nav-sublink.active,
html.sanid-dock-right .sanid-nav-sublink.active {
    background: rgba(255, 255, 255, 0.14);
    color: #fff !important;
}

/* Top/bottom: flyout panel */
html.sanid-dock-top .sanid-nav-group,
html.sanid-dock-bottom .sanid-nav-group {
    position: relative;
}

html.sanid-dock-top .sanid-nav-group .dropdown-menu,
html.sanid-dock-bottom .sanid-nav-group .dropdown-menu {
    position: fixed;
    top: auto;
    left: auto;
    z-index: 1070;
    min-width: 13rem;
    background: #fff;
    border: 1px solid var(--sanid-border);
    border-radius: 0.75rem;
    box-shadow: var(--sanid-shadow);
    padding: 0.45rem;
    margin: 0 !important;
}

html.sanid-dock-top .sanid-nav-group .dropdown-menu.show,
html.sanid-dock-bottom .sanid-nav-group .dropdown-menu.show {
    display: block;
    pointer-events: auto !important;
}

html.sanid-dock-top .sanid-nav-group .dropdown-menu.show::before,
html.sanid-dock-bottom .sanid-nav-group .dropdown-menu.show::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
}

html.sanid-dock-bottom .sanid-nav-group .dropdown-menu.show::before {
    top: auto;
    bottom: -10px;
}

html.sanid-dock-top .sanid-nav-group .dropdown-menu.show .sanid-nav-sublink,
html.sanid-dock-bottom .sanid-nav-group .dropdown-menu.show .sanid-nav-sublink {
    pointer-events: auto !important;
    cursor: pointer;
}

html.sanid-dock-top .sanid-nav-group .dropdown-menu:not(.show),
html.sanid-dock-bottom .sanid-nav-group .dropdown-menu:not(.show) {
    display: none !important;
}

html.sanid-dock-bottom .sanid-nav-group .dropdown-menu {
    top: auto;
    bottom: auto;
}

html.sanid-dock-top .sanid-nav-parent-btn,
html.sanid-dock-bottom .sanid-nav-parent-btn {
    cursor: pointer;
}

html.sanid-dock-top .sanid-nav-group.show > .sanid-nav-parent-btn,
html.sanid-dock-bottom .sanid-nav-group.show > .sanid-nav-parent-btn {
    background: rgba(255, 255, 255, 0.14) !important;
    color: #fff !important;
}

html.sanid-dock-top .sanid-nav-sublink,
html.sanid-dock-bottom .sanid-nav-sublink {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.85rem;
    border-radius: 0.5rem;
    color: var(--sanid-text) !important;
    text-decoration: none;
    font-size: 0.88rem;
    border: 1px solid transparent;
    transition:
        background var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        border-color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        transform var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        box-shadow var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease);
}

html.sanid-dock-top .sanid-nav-sublink i,
html.sanid-dock-bottom .sanid-nav-sublink i {
    width: 1.1rem;
    color: var(--sanid-primary-light) !important;
    font-size: 0.8rem;
    transition:
        transform var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease),
        color var(--sanid-nav-hover-duration) var(--sanid-nav-hover-ease);
}

html.sanid-dock-top .sanid-nav-sublink:hover,
html.sanid-dock-bottom .sanid-nav-sublink:hover {
    background: linear-gradient(90deg, #eef3fb, #f8fbff);
    color: var(--sanid-primary) !important;
    border-color: rgba(25, 52, 118, 0.12);
    transform: translateX(3px);
    box-shadow: 0 2px 10px rgba(25, 52, 118, 0.1);
}

html[dir="rtl"] .sanid-dock-top .sanid-nav-sublink:hover,
html[dir="rtl"] .sanid-dock-bottom .sanid-nav-sublink:hover {
    transform: translateX(-3px);
}

html.sanid-dock-top .sanid-nav-sublink:hover i,
html.sanid-dock-bottom .sanid-nav-sublink:hover i {
    transform: scale(1.06);
    color: var(--sanid-primary) !important;
}

html.sanid-dock-top .sanid-nav-sublink.active,
html.sanid-dock-bottom .sanid-nav-sublink.active {
    background: linear-gradient(90deg, var(--sanid-primary-mid), var(--sanid-primary-light));
    color: #fff !important;
}

html.sanid-dock-top .sanid-nav-sublink.active i,
html.sanid-dock-bottom .sanid-nav-sublink.active i {
    color: rgba(255, 255, 255, 0.92) !important;
}

.sanid-nav-submenu-divider {
    margin: 0.45rem 0.75rem;
    border-top: 1px solid #d8e2f0;
    opacity: 1;
}

.sanid-nav-submenu-header {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.35rem 0.85rem 0.2rem;
    margin-bottom: 0.1rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b !important;
    white-space: normal;
}

.sanid-nav-submenu-header i {
    width: 1rem;
    color: #1f3b73 !important;
    font-size: 0.75rem;
}

.sanid-nav-sublink--grouped {
    padding-left: 1.35rem !important;
}

html.sanid-dock-left .sanid-nav-sublink--grouped,
html.sanid-dock-right .sanid-nav-sublink--grouped {
    padding-left: 1.35rem !important;
}

html[dir="rtl"] .sanid-nav-sublink--grouped,
html.sanid-dock-left[dir="rtl"] .sanid-nav-sublink--grouped,
html.sanid-dock-right[dir="rtl"] .sanid-nav-sublink--grouped {
    padding-left: 0.85rem !important;
    padding-right: 1.35rem !important;
}

/* Collapsed sidebar: icon-only */
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-label,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-label,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-caret,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-caret,
html.sanid-sidebar-collapsed .sanid-user-caret,
html.sanid-sidebar-collapsed .sanid-user-label {
    display: none !important;
}

html.sanid-sidebar-collapsed.sanid-dock-right .sanid-user-menu.dropstart > .sanid-user-toggle.dropdown-toggle::before,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-user-menu.dropend > .sanid-user-toggle.dropdown-toggle::after {
    display: none !important;
    content: none !important;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-parent-btn,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-parent-btn,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link {
    justify-content: center;
    padding: 0.72rem 0.5rem !important;
    width: 100%;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-menu > .nav-item:not(.sanid-nav-group) > .nav-link::after,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-menu > .nav-item:not(.sanid-nav-group) > .nav-link::after {
    display: none;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-parent-btn i.sanid-nav-icon,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-parent-btn i.sanid-nav-icon,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link i.sanid-nav-icon,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link i.sanid-nav-icon {
    margin-right: 0;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-host,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-host,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-navbar,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-navbar {
    overflow: visible;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-menu-rail,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-menu-rail {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-scroll-viewport,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-scroll-viewport {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-group,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-group {
    position: relative;
    flex-shrink: 0;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-group > .sanid-nav-subnav:not(.sanid-flyout-open),
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-group > .sanid-nav-subnav:not(.sanid-flyout-open) {
    display: none !important;
    pointer-events: none !important;
    visibility: hidden !important;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-parent-btn,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-parent-btn,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-menu > .nav-item > .nav-link,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-menu > .nav-item > .nav-link {
    position: relative;
    z-index: 2;
}


html.sanid-sidebar-collapsed .sanid-nav-clock {
    display: none !important;
}

html.sanid-sidebar-collapsed .sanid-user-toggle {
    margin: 0 auto;
    width: auto !important;
    justify-content: center !important;
    padding: 0.6rem !important;
}

html.sanid-sidebar-collapsed .sanid-user-toggle-main {
    width: auto;
    justify-content: center;
    padding-left: 0;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-user-menu .dropdown-menu,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-user-menu .dropdown-menu,
html.sanid-sidebar-collapsed.sanid-dock-left .sanid-lang-menu .dropdown-menu,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-lang-menu .dropdown-menu {
    position: fixed !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 1070 !important;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-subnav .sanid-nav-sublink,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-subnav .sanid-nav-sublink {
    color: rgba(255, 255, 255, 0.94) !important;
}

html.sanid-sidebar-collapsed.sanid-dock-left .sanid-nav-subnav .sanid-nav-sublink i,
html.sanid-sidebar-collapsed.sanid-dock-right .sanid-nav-subnav .sanid-nav-sublink i {
    color: rgba(255, 255, 255, 0.88) !important;
}

/* RTL navbar layout */
html[dir="rtl"] .sanid-dock-top .sanid-navbar-inner,
html[dir="rtl"] .sanid-dock-bottom .sanid-navbar-inner,
html[dir="rtl"] .sanid-dock-top .sanid-nav-panel,
html[dir="rtl"] .sanid-dock-bottom .sanid-nav-panel {
    direction: rtl;
}

html[dir="rtl"] .sanid-dock-top .sanid-nav-menu-rail,
html[dir="rtl"] .sanid-dock-bottom .sanid-nav-menu-rail {
    direction: ltr;
}

html[dir="rtl"] .sanid-dock-top .sanid-nav-scroll-viewport,
html[dir="rtl"] .sanid-dock-bottom .sanid-nav-scroll-viewport {
    direction: ltr;
}

html[dir="rtl"] .sanid-dock-top .sanid-nav-menu,
html[dir="rtl"] .sanid-dock-bottom .sanid-nav-menu {
    direction: ltr;
    flex-direction: row-reverse !important;
}

html[dir="rtl"] .sanid-dock-left .sanid-nav-menu,
html[dir="rtl"] .sanid-dock-right .sanid-nav-menu {
    direction: rtl;
}

html[dir="rtl"] .sanid-dock-top .sanid-brand,
html[dir="rtl"] .sanid-dock-bottom .sanid-brand {
    justify-content: flex-end;
}

html[dir="rtl"] .sanid-lang-dropdown,
html[dir="rtl"] .sanid-user-dropdown {
    text-align: right;
}

/* RTL: right-align grid / table column headings site-wide */
html[dir="rtl"] th,
html[dir="rtl"] .gridview th,
html[dir="rtl"] .gridviewsmall th,
html[dir="rtl"] .table > thead > tr > th,
html[dir="rtl"] table.dataTable thead th,
html[dir="rtl"] table.dataTable thead td,
html[dir="rtl"] table.dataTable tfoot th,
html[dir="rtl"] table.dataTable tfoot td {
    text-align: right !important;
}

html[dir="rtl"] .gridview.text-center th,
html[dir="rtl"] .gridviewsmall.text-center th,
html[dir="rtl"] table.text-center thead th,
html[dir="rtl"] table.dataTable thead th.dt-head-center,
html[dir="rtl"] table.dataTable thead td.dt-head-center {
    text-align: center !important;
}

/* DataTables: move sort icons to the left in RTL */
html[dir="rtl"] table.dataTable thead > tr > th.dt-orderable-asc,
html[dir="rtl"] table.dataTable thead > tr > th.dt-orderable-desc,
html[dir="rtl"] table.dataTable thead > tr > th.dt-ordering-asc,
html[dir="rtl"] table.dataTable thead > tr > th.dt-ordering-desc,
html[dir="rtl"] table.dataTable thead > tr > td.dt-orderable-asc,
html[dir="rtl"] table.dataTable thead > tr > td.dt-orderable-desc,
html[dir="rtl"] table.dataTable thead > tr > td.dt-ordering-asc,
html[dir="rtl"] table.dataTable thead > tr > td.dt-ordering-desc {
    padding-right: 0.75rem !important;
    padding-left: 30px !important;
}

html[dir="rtl"] table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order,
html[dir="rtl"] table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order,
html[dir="rtl"] table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order,
html[dir="rtl"] table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order,
html[dir="rtl"] table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order,
html[dir="rtl"] table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order,
html[dir="rtl"] table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order,
html[dir="rtl"] table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order {
    right: auto !important;
    left: 12px !important;
}

html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-orderable-asc,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-orderable-desc,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-ordering-asc,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-ordering-desc,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-orderable-asc,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-orderable-desc,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-ordering-asc,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-ordering-desc {
    padding-left: 20px !important;
}

html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-orderable-asc span.dt-column-order,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-orderable-desc span.dt-column-order,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-ordering-asc span.dt-column-order,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > th.dt-ordering-desc span.dt-column-order,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-orderable-asc span.dt-column-order,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-orderable-desc span.dt-column-order,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-ordering-asc span.dt-column-order,
html[dir="rtl"] table.dataTable.table-sm > thead > tr > td.dt-ordering-desc span.dt-column-order {
    left: 5px !important;
}

/* DataTables footer controls in RTL */
html[dir="rtl"] div.dt-container div.dt-length label,
html[dir="rtl"] div.dt-container div.dt-search label {
    text-align: right;
}

html[dir="rtl"] div.dt-container div.dt-search {
    text-align: left;
}

html[dir="rtl"] div.dt-container div.dt-length select {
    margin-right: 0;
    margin-left: 0.5em;
}

html[dir="rtl"] div.dt-container div.dt-search input {
    margin-left: 0;
    margin-right: 0.5em;
}

html[dir="rtl"] div.dt-container div.dt-layout-start > *:not(:last-child) {
    margin-right: 0;
    margin-left: 1em;
}

html[dir="rtl"] div.dt-container div.dt-layout-end > *:not(:first-child) {
    margin-left: 0;
    margin-right: 1em;
}

/* RTL: move dropdown carets to the left so they do not overlap Arabic text */
html[dir="rtl"] .form-select {
    padding: 0.375rem 0.75rem 0.375rem 2.25rem;
    background-position: left 0.75rem center;
    text-align: right;
}

html[dir="rtl"] .form-select-sm {
    padding: 0.25rem 0.5rem 0.25rem 2.25rem;
    background-position: left 0.5rem center;
}

html[dir="rtl"] .form-select-lg {
    padding: 0.5rem 1rem 0.5rem 3rem;
    background-position: left 1rem center;
}

html[dir="rtl"] .select2-container--bootstrap-5 .select2-selection--single {
    padding: 0.375rem 0.75rem 0.375rem 2.25rem !important;
    background-position: left 0.75rem center !important;
}

html[dir="rtl"] .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    direction: rtl !important;
    text-align: right !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

html[dir="rtl"] .select2-container--bootstrap-5 .select2--small .select2-selection--single,
html[dir="rtl"] .form-select-sm ~ .select2-container--bootstrap-5 .select2-selection--single {
    padding: 0.25rem 0.5rem 0.25rem 2rem !important;
    background-position: left 0.5rem center !important;
}

html[dir="rtl"] .select2-container--bootstrap-5 .select2--large .select2-selection--single,
html[dir="rtl"] .form-select-lg ~ .select2-container--bootstrap-5 .select2-selection--single {
    padding: 0.5rem 1rem 0.5rem 3rem !important;
    background-position: left 1rem center !important;
}

html[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow {
    left: 1px;
    right: auto;
}

html[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 20px;
    padding-right: 8px;
    text-align: right;
}

html[dir="rtl"] .select2-dropdown {
    text-align: right;
}

html[dir="rtl"] .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option {
    text-align: right;
}

/* Toast / alert notifications – mirror layout for Arabic */
.sanid-toast-header,
.repl-toast-header.sanid-toast-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.sanid-toast-leading {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1 1 auto;
    min-width: 0;
}

.sanid-toast-leading strong {
    margin: 0 !important;
}

.sanid-toast-icon {
    flex-shrink: 0;
    line-height: 1;
    color: #fff;
}

.repl-toast-header .sanid-toast-icon,
.sanid-toast-header .sanid-toast-icon {
    color: #fff !important;
}

.sanid-toast-header .btn-close,
.repl-toast-header .btn-close {
    flex-shrink: 0;
    margin: 0 !important;
}

html[dir="rtl"] .toast,
html[dir="rtl"] .repl-toast,
html[dir="rtl"] .toast-header,
html[dir="rtl"] .repl-toast-header,
html[dir="rtl"] .toast-body,
html[dir="rtl"] .repl-toast-body {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .sanid-toast-leading {
    justify-content: flex-start;
}

html[dir="ltr"] .sanid-toast-leading {
    justify-content: flex-start;
}

html[dir="rtl"] .repl-toast-success .repl-toast-header {
    background: linear-gradient(270deg, #1f3b73, #2f5da8);
}

html[dir="rtl"] .repl-toast-error .repl-toast-header {
    background: linear-gradient(270deg, #912018, #d92d20);
}

/* SweetAlert2 dialogs */
html[dir="rtl"] .swal2-popup {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .swal2-title,
html[dir="rtl"] .swal2-html-container,
html[dir="rtl"] .swal2-content {
    text-align: right;
}

html[dir="rtl"] .swal2-actions {
    flex-direction: row-reverse;
}

html[dir="rtl"] .swal2-icon {
    margin-left: auto;
    margin-right: auto;
}

/* Touch-first navigation for phones and tablets */
@media (max-width: 991.98px) {
    html.sanid-dock-top .sanid-navbar,
    html.sanid-dock-bottom .sanid-navbar {
        height: auto;
        min-height: var(--sanid-nav-height);
        overflow: visible;
    }

    html.sanid-dock-top .sanid-navbar-inner,
    html.sanid-dock-bottom .sanid-navbar-inner {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 0.5rem 0.75rem;
        overflow: visible;
    }

    html.sanid-dock-top .sanid-brand-row,
    html.sanid-dock-bottom .sanid-brand-row {
        flex: 1 1 auto;
        width: auto;
    }

    html.sanid-dock-top .sanid-nav-toggler,
    html.sanid-dock-bottom .sanid-nav-toggler {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 2.75rem;
        height: 2.75rem;
        padding: 0.4rem;
        border: 1px solid rgba(255, 255, 255, 0.45);
        border-radius: 0.6rem;
        box-shadow: none;
    }

    html.sanid-dock-top .sanid-nav-toggler.is-active,
    html.sanid-dock-bottom .sanid-nav-toggler.is-active {
        background: rgba(255, 255, 255, 0.18);
    }

    html.sanid-dock-top .sanid-navbar .sanid-nav-panel,
    html.sanid-dock-bottom .sanid-navbar .sanid-nav-panel {
        display: none !important;
        flex: 0 0 100%;
        flex-direction: column !important;
        align-items: stretch;
        width: 100%;
        min-width: 0;
        max-height: calc(100dvh - 4.75rem);
        margin-top: 0.5rem;
        padding: 0.5rem;
        gap: 0.4rem;
        overflow-x: hidden;
        overflow-y: auto;
        border-top: 1px solid rgba(255, 255, 255, 0.16);
        background: rgba(12, 33, 79, 0.24);
        border-radius: 0 0 0.75rem 0.75rem;
        -webkit-overflow-scrolling: touch;
    }

    html.sanid-dock-top .sanid-navbar .sanid-nav-panel.is-mobile-open,
    html.sanid-dock-bottom .sanid-navbar .sanid-nav-panel.is-mobile-open {
        display: flex !important;
    }

    html.sanid-dock-top .sanid-nav-menu-rail,
    html.sanid-dock-bottom .sanid-nav-menu-rail {
        display: block;
        flex: 0 0 auto;
        width: 100%;
        overflow: visible;
    }

    html.sanid-dock-top .sanid-nav-scroll-viewport,
    html.sanid-dock-bottom .sanid-nav-scroll-viewport {
        width: 100%;
        overflow: visible !important;
        cursor: default;
        touch-action: auto;
    }

    html.sanid-dock-top .sanid-nav-menu,
    html.sanid-dock-bottom .sanid-nav-menu {
        display: flex;
        flex-direction: column !important;
        align-items: stretch;
        width: 100%;
        min-width: 0;
        gap: 0.15rem;
    }

    html.sanid-dock-top .sanid-nav-menu > .nav-item,
    html.sanid-dock-bottom .sanid-nav-menu > .nav-item {
        width: 100%;
    }

    html.sanid-dock-top .sanid-nav-parent-btn,
    html.sanid-dock-bottom .sanid-nav-parent-btn,
    html.sanid-dock-top .sanid-nav-menu > .nav-item > .nav-link,
    html.sanid-dock-bottom .sanid-nav-menu > .nav-item > .nav-link {
        display: flex;
        justify-content: flex-start;
        width: 100%;
        min-height: 2.75rem;
        padding: 0.65rem 0.75rem !important;
        border-radius: 0.55rem;
        text-align: start;
    }

    html.sanid-dock-top .sanid-nav-label,
    html.sanid-dock-bottom .sanid-nav-label,
    html.sanid-dock-top .sanid-nav-caret,
    html.sanid-dock-bottom .sanid-nav-caret,
    html.sanid-dock-top .sanid-user-caret,
    html.sanid-dock-bottom .sanid-user-caret {
        display: inline-block !important;
    }

    html.sanid-dock-top .sanid-nav-parent-btn .sanid-nav-caret,
    html.sanid-dock-bottom .sanid-nav-parent-btn .sanid-nav-caret {
        margin-inline-start: auto;
        margin-left: auto;
    }

    html.sanid-dock-top .sanid-nav-group > .sanid-nav-subnav,
    html.sanid-dock-bottom .sanid-nav-group > .sanid-nav-subnav {
        display: none !important;
        position: static !important;
        inset: auto !important;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin: 0.2rem 0 0.35rem !important;
        padding: 0.3rem !important;
        transform: none !important;
        visibility: visible !important;
        pointer-events: auto !important;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 0.55rem;
        background: rgba(8, 27, 67, 0.48);
        box-shadow: none;
        animation: none;
    }

    html.sanid-dock-top .sanid-nav-group.is-open > .sanid-nav-subnav,
    html.sanid-dock-bottom .sanid-nav-group.is-open > .sanid-nav-subnav {
        display: block !important;
    }

    html.sanid-dock-top .sanid-nav-sublink,
    html.sanid-dock-bottom .sanid-nav-sublink {
        min-height: 2.6rem;
        padding: 0.6rem 0.75rem;
        color: rgba(255, 255, 255, 0.95) !important;
        white-space: normal;
    }

    html.sanid-dock-top .sanid-nav-sublink i,
    html.sanid-dock-bottom .sanid-nav-sublink i {
        color: rgba(255, 255, 255, 0.88) !important;
    }

    html.sanid-dock-top .sanid-nav-utils,
    html.sanid-dock-bottom .sanid-nav-utils {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        margin: 0 !important;
        padding: 0.5rem 0 0;
        gap: 0.5rem;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
    }

    html.sanid-dock-top .sanid-lang-menu,
    html.sanid-dock-bottom .sanid-lang-menu,
    html.sanid-dock-top .sanid-user-menu,
    html.sanid-dock-bottom .sanid-user-menu {
        flex: 1 1 50%;
        min-width: 0;
    }

    html.sanid-dock-top .sanid-lang-toggle,
    html.sanid-dock-bottom .sanid-lang-toggle,
    html.sanid-dock-top .sanid-user-toggle,
    html.sanid-dock-bottom .sanid-user-toggle {
        justify-content: center;
        width: 100% !important;
        min-height: 2.75rem;
    }
}

@media (max-width: 380px) {
    html.sanid-dock-top .sanid-navbar-inner,
    html.sanid-dock-bottom .sanid-navbar-inner {
        padding-inline: 0.5rem;
    }

    html.sanid-dock-top .sanid-navbar .sanid-nav-panel,
    html.sanid-dock-bottom .sanid-navbar .sanid-nav-panel {
        padding-inline: 0.25rem;
    }

    html.sanid-dock-top .sanid-nav-utils,
    html.sanid-dock-bottom .sanid-nav-utils {
        flex-direction: column;
    }
}