﻿/* =========================================================
   Lion Workspace Tabs + Dashboard Quick Access
   Theme-aware, RTL/LTR, compact, mobile-safe
   ========================================================= */

.lion-shell {
    --lion-workspace-tabs-height: 34px;
    --lion-workspace-tab-height: 29px;
    --lion-workspace-bg: color-mix(in srgb, var(--lion-topbar-bg, var(--lion-surface)) 88%, var(--lion-bg) 12%);
    --lion-workspace-tab-bg: color-mix(in srgb, var(--lion-surface) 94%, var(--lion-primary) 6%);
    --lion-workspace-tab-active-bg: color-mix(in srgb, var(--lion-surface) 88%, var(--lion-primary) 12%);
    --lion-workspace-border: color-mix(in srgb, var(--lion-border) 78%, var(--lion-primary) 22%);
    --lion-workspace-accent: var(--lion-accent, var(--lion-primary));
    --lion-workspace-text: var(--lion-text);
    --lion-workspace-muted: var(--lion-text-muted);
    --lion-workspace-shadow: 0 8px 24px rgba(15, 23, 42, .10);
}

.lion-shell[data-density="compact"] {
    --lion-workspace-tabs-height: 32px;
    --lion-workspace-tab-height: 27px;
}

/* ---------- General tabs bar ---------- */
.lion-workspace-tabs {
    position: sticky;
    top: var(--lion-topbar-height, 56px);
    z-index: 1038;
    height: var(--lion-workspace-tabs-height);
    min-height: var(--lion-workspace-tabs-height);
    display: block;
    background: var(--lion-workspace-bg);
    border-bottom: 1px solid var(--lion-workspace-border);
    box-shadow: 0 1px 0 rgba(255,255,255,.025) inset;
    overflow: visible;
}

.lion-workspace-tabs-desktop {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 4px 7px 1px;
    min-width: 0;
}

.lion-workspace-tab-scroll {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    scroll-behavior: smooth;
}

.lion-workspace-tab-scroll::-webkit-scrollbar {
    display: none;
}

.lion-workspace-tab {
    position: relative;
    flex: 0 0 auto;
    min-width: 112px;
    max-width: 198px;
    height: var(--lion-workspace-tab-height);
    display: flex;
    align-items: stretch;
    border: 1px solid transparent;
    border-radius: 9px 9px 5px 5px;
    background: transparent;
    color: var(--lion-workspace-muted);
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

.lion-workspace-tab:hover {
    background: color-mix(in srgb, var(--lion-workspace-tab-bg) 86%, transparent);
    color: var(--lion-workspace-text);
}

.lion-workspace-tab.active {
    background: var(--lion-workspace-tab-active-bg);
    border-color: var(--lion-workspace-border);
    color: var(--lion-workspace-text);
}

.lion-workspace-tab.active::after {
    content: "";
    position: absolute;
    inset-inline: 8px;
    bottom: -2px;
    height: 2px;
    border-radius: 999px;
    background: var(--lion-workspace-accent);
    box-shadow: 0 0 12px color-mix(in srgb, var(--lion-workspace-accent) 55%, transparent);
}

.lion-workspace-tab-main,
.lion-workspace-tab-close,
.lion-workspace-tabs-more,
.lion-workspace-tabs-menu button,
.lion-workspace-mobile-active,
.lion-workspace-mobile-count,
.lion-workspace-mobile-sheet button {
    font: inherit;
}

.lion-workspace-tab-main {
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 8px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: start;
}

.lion-workspace-tab-main > i {
    flex: 0 0 auto;
    font-size: 12px;
    color: color-mix(in srgb, var(--lion-workspace-accent) 76%, var(--lion-workspace-text) 24%);
}

.lion-workspace-tab-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11.5px;
    line-height: 1;
}

.lion-workspace-tab-close {
    width: 23px;
    min-width: 23px;
    height: 100%;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--lion-workspace-muted);
}

.lion-workspace-tab-close:hover {
    background: color-mix(in srgb, #ef4444 12%, transparent);
    color: #ef4444;
}

.lion-workspace-tab-close i {
    font-size: 13px;
}

.lion-workspace-tab-dirty {
    width: 7px;
    height: 7px;
    min-width: 7px;
    border-radius: 50%;
    background: var(--lion-workspace-accent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--lion-workspace-accent) 14%, transparent);
}

.lion-workspace-tab-spinner {
    width: 12px;
    height: 12px;
    min-width: 12px;
    border: 2px solid color-mix(in srgb, var(--lion-workspace-muted) 24%, transparent);
    border-top-color: var(--lion-workspace-accent);
    border-radius: 50%;
    animation: lionWorkspaceSpin .75s linear infinite;
}

@keyframes lionWorkspaceSpin {
    to { transform: rotate(360deg); }
}

.lion-workspace-tabs-tools {
    position: relative;
    flex: 0 0 auto;
}

.lion-workspace-tabs-more {
    height: var(--lion-workspace-tab-height);
    min-width: 45px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 8px;
    border: 1px solid var(--lion-workspace-border);
    border-radius: 9px;
    background: var(--lion-workspace-tab-bg);
    color: var(--lion-workspace-text);
}

.lion-workspace-tabs-more:hover {
    border-color: color-mix(in srgb, var(--lion-workspace-accent) 42%, var(--lion-workspace-border));
}

.lion-workspace-tabs-more i {
    font-size: 13px;
}

.lion-workspace-tabs-more span {
    min-width: 16px;
    height: 16px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lion-workspace-accent) 13%, transparent);
    color: var(--lion-workspace-text);
    font-size: 9px;
}

.lion-workspace-tabs-menu {
    position: absolute;
    top: calc(100% + 7px);
    inset-inline-end: 0;
    width: min(330px, calc(100vw - 24px));
    overflow: hidden;
    border: 1px solid var(--lion-workspace-border);
    border-radius: 15px;
    background: color-mix(in srgb, var(--lion-surface) 97%, transparent);
    color: var(--lion-workspace-text);
    box-shadow: var(--lion-shadow-md, var(--lion-workspace-shadow));
    backdrop-filter: blur(12px);
}

.lion-workspace-tabs-menu-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 12px;
    border-bottom: 1px solid var(--lion-workspace-border);
}

.lion-workspace-tabs-menu-head strong {
    font-size: .82rem;
    font-weight: 600;
}

.lion-workspace-tabs-menu-head small {
    min-width: 25px;
    height: 22px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lion-primary) 10%, transparent);
    color: var(--lion-workspace-muted);
    font-size: .68rem;
}

.lion-workspace-tabs-menu-list {
    max-height: 310px;
    overflow-y: auto;
    padding: 6px;
}

.lion-workspace-tabs-menu-item {
    display: grid;
    grid-template-columns: 1fr 28px;
    gap: 4px;
    border-radius: 10px;
}

.lion-workspace-tabs-menu-item.active {
    background: color-mix(in srgb, var(--lion-primary) 9%, transparent);
}

.lion-workspace-tabs-menu-open {
    min-width: 0;
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border: 0;
    background: transparent;
    color: var(--lion-workspace-text);
    text-align: start;
}

.lion-workspace-tabs-menu-open > i {
    width: 18px;
    text-align: center;
    color: var(--lion-workspace-accent);
}

.lion-workspace-tabs-menu-open > span:not(.lion-workspace-tab-dirty) {
    min-width: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .78rem;
}

.lion-workspace-tabs-menu-close {
    width: 28px;
    height: 28px;
    align-self: center;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--lion-workspace-muted);
}

.lion-workspace-tabs-menu-close:hover {
    background: color-mix(in srgb, #ef4444 10%, transparent);
    color: #ef4444;
}

.lion-workspace-tabs-menu-actions {
    display: grid;
    gap: 4px;
    padding: 7px;
    border-top: 1px solid var(--lion-workspace-border);
}

.lion-workspace-tabs-menu-actions button {
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 9px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--lion-workspace-text);
    text-align: start;
    font-size: .76rem;
}

.lion-workspace-tabs-menu-actions button:hover {
    background: color-mix(in srgb, var(--lion-primary) 8%, transparent);
}

.lion-workspace-tabs-menu-actions button.danger {
    color: #ef4444;
}

.lion-workspace-tabs-mobile {
    display: none;
}

/* ---------- Unsaved close confirmation ---------- */
.lion-workspace-confirm-backdrop {
    position: fixed;
    inset: 0;
    z-index: 100300;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(2, 8, 23, .66);
    backdrop-filter: blur(8px);
}

.lion-workspace-confirm-card {
    width: min(460px, calc(100vw - 28px));
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 13px;
    padding: 18px;
    border: 1px solid var(--lion-workspace-border);
    border-radius: 20px;
    background: var(--lion-surface);
    color: var(--lion-text);
    box-shadow: var(--lion-shadow-md);
}

.lion-workspace-confirm-card > .icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: color-mix(in srgb, var(--lion-workspace-accent) 15%, transparent);
    color: var(--lion-workspace-accent);
    font-size: 1.15rem;
}

.lion-workspace-confirm-card .copy strong {
    display: block;
    font-size: .98rem;
}

.lion-workspace-confirm-card .copy p {
    margin: 7px 0 0;
    color: var(--lion-text-muted);
    font-size: .83rem;
    line-height: 1.7;
}

.lion-workspace-confirm-card footer {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

.lion-workspace-confirm-card footer button {
    min-height: 39px;
    padding: 0 15px;
    border-radius: 11px;
    border: 1px solid var(--lion-workspace-border);
    background: var(--lion-surface);
    color: var(--lion-text);
}

.lion-workspace-confirm-card footer button.danger {
    border-color: color-mix(in srgb, #ef4444 40%, var(--lion-workspace-border));
    background: color-mix(in srgb, #ef4444 10%, var(--lion-surface));
    color: #ef4444;
}

/* ---------- Dashboard quick access ---------- */
.lion-quick-access {
    width: 100%;
    display: grid;
    gap: 12px;
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid var(--lion-border);
    border-radius: min(var(--lion-radius-lg, 18px), 22px);
    background:
        radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--lion-accent) 10%, transparent), transparent 34%),
        var(--lion-surface);
    box-shadow: var(--lion-shadow-sm);
}

.lion-quick-access-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.lion-quick-access-title {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.lion-quick-access-title-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: color-mix(in srgb, var(--lion-accent) 15%, transparent);
    color: var(--lion-accent);
}

.lion-quick-access-title strong,
.lion-quick-access-title span {
    display: block;
}

.lion-quick-access-title strong {
    color: var(--lion-text);
    font-size: .95rem;
    font-weight: 600;
}

.lion-quick-access-title div > span {
    margin-top: 2px;
    color: var(--lion-text-muted);
    font-size: .72rem;
}

.lion-quick-access-customize {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 11px;
    border: 1px solid var(--lion-border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--lion-surface) 92%, var(--lion-primary) 8%);
    color: var(--lion-text);
    font-size: .75rem;
}

.lion-quick-access-customize:hover {
    border-color: color-mix(in srgb, var(--lion-primary) 36%, var(--lion-border));
    color: var(--lion-primary);
}

.lion-quick-access-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

.lion-quick-action-card {
    min-width: 0;
    min-height: 64px;
    display: grid;
    grid-template-columns: 35px 1fr 14px;
    align-items: center;
    gap: 8px;
    padding: 9px 10px;
    border: 1px solid var(--lion-border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--lion-surface) 96%, var(--lion-primary) 4%);
    color: var(--lion-text);
    text-align: start;
    transition: transform .16s ease, border-color .16s ease, background-color .16s ease;
}

.lion-quick-action-card:hover {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--lion-accent) 38%, var(--lion-border));
    background: color-mix(in srgb, var(--lion-surface) 91%, var(--lion-accent) 9%);
}

.lion-quick-action-icon {
    width: 35px;
    height: 35px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: color-mix(in srgb, var(--lion-primary) 11%, transparent);
    color: var(--lion-primary);
}

.lion-quick-action-copy {
    min-width: 0;
}

.lion-quick-action-copy strong,
.lion-quick-action-copy small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lion-quick-action-copy strong {
    color: var(--lion-text);
    font-size: .76rem;
    font-weight: 600;
}

.lion-quick-action-copy small {
    margin-top: 3px;
    color: var(--lion-text-muted);
    font-size: .63rem;
}

.lion-quick-action-arrow {
    color: var(--lion-text-muted);
    font-size: 11px;
}

[dir="ltr"] .lion-quick-action-arrow {
    transform: scaleX(-1);
}

.lion-quick-action-empty {
    grid-column: span 2;
    border-style: dashed;
}

.lion-quick-most-used {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding-top: 10px;
    border-top: 1px solid var(--lion-border);
}

.lion-quick-most-used-label {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--lion-text-muted);
    font-size: .68rem;
}

.lion-quick-most-used-list {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: none;
}

.lion-quick-most-used-list::-webkit-scrollbar {
    display: none;
}

.lion-quick-most-used-list button {
    flex: 0 0 auto;
    min-height: 29px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0 9px;
    border: 1px solid var(--lion-border);
    border-radius: 999px;
    background: transparent;
    color: var(--lion-text);
    font-size: .68rem;
}

.lion-quick-most-used-list button:hover {
    background: color-mix(in srgb, var(--lion-primary) 7%, transparent);
    color: var(--lion-primary);
}

/* ---------- Quick access customization modal ---------- */
.lion-quick-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 100250;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(2, 8, 23, .68);
    backdrop-filter: blur(9px);
}

.lion-quick-modal {
    width: min(980px, calc(100vw - 28px));
    max-height: min(760px, calc(100vh - 28px));
    display: grid;
    grid-template-rows: auto 1fr auto;
    overflow: hidden;
    border: 1px solid var(--lion-border);
    border-radius: 22px;
    background: var(--lion-surface);
    color: var(--lion-text);
    box-shadow: var(--lion-shadow-md);
}

.lion-quick-modal > header,
.lion-quick-modal > footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 17px;
}

.lion-quick-modal > header {
    border-bottom: 1px solid var(--lion-border);
}

.lion-quick-modal > header strong,
.lion-quick-modal > header span {
    display: block;
}

.lion-quick-modal > header strong {
    font-size: 1rem;
    font-weight: 600;
}

.lion-quick-modal > header span {
    margin-top: 3px;
    color: var(--lion-text-muted);
    font-size: .72rem;
}

.lion-quick-modal > header > button {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid var(--lion-border);
    border-radius: 11px;
    background: transparent;
    color: var(--lion-text);
}

.lion-quick-modal-body {
    min-height: 0;
    display: grid;
    gap: 12px;
    padding: 14px 16px;
    overflow: hidden;
}

.lion-quick-modal-search {
    position: relative;
}

.lion-quick-modal-search > i {
    position: absolute;
    inset-inline-start: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--lion-text-muted);
}

.lion-quick-modal-search input {
    width: 100%;
    height: 42px;
    padding-inline: 38px 42px;
    border: 1px solid var(--lion-border);
    border-radius: 13px;
    background: color-mix(in srgb, var(--lion-surface) 95%, var(--lion-primary) 5%);
    color: var(--lion-text);
    outline: none;
}

.lion-quick-modal-search input:focus {
    border-color: color-mix(in srgb, var(--lion-primary) 48%, var(--lion-border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--lion-primary) 10%, transparent);
}

.lion-quick-modal-search button {
    position: absolute;
    inset-inline-end: 7px;
    top: 6px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--lion-text-muted);
}

.lion-quick-modal-layout {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .75fr);
    gap: 12px;
}

.lion-quick-page-picker,
.lion-quick-selected {
    min-height: 0;
    overflow-y: auto;
    border: 1px solid var(--lion-border);
    border-radius: 15px;
    background: color-mix(in srgb, var(--lion-surface) 97%, var(--lion-bg) 3%);
}

.lion-quick-page-picker {
    padding: 9px;
}

.lion-quick-picker-group + .lion-quick-picker-group {
    margin-top: 10px;
}

.lion-quick-picker-group > header,
.lion-quick-selected > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 9px;
}

.lion-quick-picker-group > header strong,
.lion-quick-selected > header strong {
    font-size: .78rem;
    font-weight: 600;
}

.lion-quick-picker-group > header span {
    min-width: 22px;
    height: 20px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lion-primary) 10%, transparent);
    color: var(--lion-text-muted);
    font-size: .64rem;
}

.lion-quick-picker-group > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.lion-quick-picker-item {
    min-width: 0;
    min-height: 50px;
    display: grid;
    grid-template-columns: 32px 1fr 18px;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border: 1px solid var(--lion-border);
    border-radius: 12px;
    background: var(--lion-surface);
    color: var(--lion-text);
    text-align: start;
}

.lion-quick-picker-item:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--lion-primary) 35%, var(--lion-border));
}

.lion-quick-picker-item.selected {
    border-color: color-mix(in srgb, var(--lion-accent) 45%, var(--lion-border));
    background: color-mix(in srgb, var(--lion-accent) 7%, var(--lion-surface));
}

.lion-quick-picker-item:disabled {
    opacity: .48;
}

.lion-quick-picker-item .icon {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: color-mix(in srgb, var(--lion-primary) 9%, transparent);
    color: var(--lion-primary);
}

.lion-quick-picker-item .copy {
    min-width: 0;
}

.lion-quick-picker-item .copy strong,
.lion-quick-picker-item .copy small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lion-quick-picker-item .copy strong {
    font-size: .74rem;
    font-weight: 600;
}

.lion-quick-picker-item .copy small {
    margin-top: 2px;
    color: var(--lion-text-muted);
    font-size: .58rem;
}

.lion-quick-picker-item .check {
    color: var(--lion-accent);
}

.lion-quick-selected {
    display: flex;
    flex-direction: column;
}

.lion-quick-selected > header {
    border-bottom: 1px solid var(--lion-border);
}

.lion-quick-selected > header button {
    border: 0;
    background: transparent;
    color: var(--lion-primary);
    font-size: .68rem;
}

.lion-quick-selected-empty {
    flex: 1;
    min-height: 170px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    color: var(--lion-text-muted);
    font-size: .76rem;
}

.lion-quick-selected-empty i {
    font-size: 1.4rem;
}

.lion-quick-selected-list {
    display: grid;
    gap: 6px;
    padding: 8px;
}

.lion-quick-selected-item {
    min-width: 0;
    min-height: 43px;
    display: grid;
    grid-template-columns: 22px 28px 1fr auto;
    align-items: center;
    gap: 7px;
    padding: 6px 7px;
    border: 1px solid var(--lion-border);
    border-radius: 11px;
    background: var(--lion-surface);
}

.lion-quick-selected-item .order {
    color: var(--lion-text-muted);
    font-size: .66rem;
    text-align: center;
}

.lion-quick-selected-item .icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: color-mix(in srgb, var(--lion-primary) 9%, transparent);
    color: var(--lion-primary);
}

.lion-quick-selected-item .title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .72rem;
}

.lion-quick-selected-item .actions {
    display: flex;
    gap: 2px;
}

.lion-quick-selected-item .actions button {
    width: 27px;
    height: 27px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--lion-text-muted);
}

.lion-quick-selected-item .actions button:hover:not(:disabled) {
    background: color-mix(in srgb, var(--lion-primary) 8%, transparent);
    color: var(--lion-primary);
}

.lion-quick-selected-item .actions button.remove:hover:not(:disabled) {
    background: color-mix(in srgb, #ef4444 8%, transparent);
    color: #ef4444;
}

.lion-quick-selected-item .actions button:disabled {
    opacity: .28;
}

.lion-quick-modal > footer {
    justify-content: flex-end;
    border-top: 1px solid var(--lion-border);
}

.lion-quick-modal > footer button {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 16px;
    border-radius: 11px;
}

.lion-quick-modal > footer .cancel {
    border: 1px solid var(--lion-border);
    background: var(--lion-surface);
    color: var(--lion-text);
}

.lion-quick-modal > footer .save {
    border: 0;
    background: linear-gradient(135deg, var(--lion-primary), var(--lion-primary-dark));
    color: #fff;
}

/* ---------- Responsive ---------- */
@media (max-width: 1399.98px) {
    .lion-quick-access-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .lion-workspace-tabs-desktop {
        display: none;
    }

    .lion-workspace-tabs-mobile {
        height: 100%;
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        gap: 6px;
        padding: 4px 7px 2px;
    }

    .lion-workspace-mobile-active,
    .lion-workspace-mobile-count {
        height: calc(var(--lion-workspace-tabs-height) - 6px);
        border: 1px solid var(--lion-workspace-border);
        border-radius: 9px;
        background: var(--lion-workspace-tab-bg);
        color: var(--lion-workspace-text);
    }

    .lion-workspace-mobile-active {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 7px;
        padding: 0 9px;
        text-align: start;
    }

    .lion-workspace-mobile-active > i {
        color: var(--lion-workspace-accent);
    }

    .lion-workspace-mobile-active > span:not(.lion-workspace-tab-dirty) {
        min-width: 0;
        flex: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: .72rem;
    }

    .lion-workspace-mobile-count {
        min-width: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        padding: 0 8px;
        font-size: .7rem;
    }

    .lion-workspace-mobile-sheet-backdrop {
        position: fixed;
        inset: 0;
        z-index: 100180;
        background: rgba(2, 8, 23, .55);
        backdrop-filter: blur(4px);
    }

    .lion-workspace-mobile-sheet {
        position: fixed;
        inset-inline: 0;
        bottom: 0;
        z-index: 100190;
        max-height: min(72vh, 580px);
        display: grid;
        grid-template-rows: auto auto 1fr auto;
        overflow: hidden;
        border: 1px solid var(--lion-workspace-border);
        border-radius: 22px 22px 0 0;
        background: var(--lion-surface);
        color: var(--lion-text);
        box-shadow: 0 -24px 70px rgba(0,0,0,.28);
    }

    .lion-workspace-mobile-sheet-grip {
        width: 44px;
        height: 4px;
        margin: 8px auto 4px;
        border-radius: 999px;
        background: color-mix(in srgb, var(--lion-text-muted) 35%, transparent);
    }

    .lion-workspace-mobile-sheet > header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 8px 13px 11px;
        border-bottom: 1px solid var(--lion-border);
    }

    .lion-workspace-mobile-sheet > header strong,
    .lion-workspace-mobile-sheet > header span {
        display: block;
    }

    .lion-workspace-mobile-sheet > header strong {
        font-size: .9rem;
    }

    .lion-workspace-mobile-sheet > header span {
        margin-top: 3px;
        color: var(--lion-text-muted);
        font-size: .7rem;
    }

    .lion-workspace-mobile-sheet > header button {
        width: 36px;
        height: 36px;
        display: grid;
        place-items: center;
        border: 1px solid var(--lion-border);
        border-radius: 11px;
        background: transparent;
        color: var(--lion-text);
    }

    .lion-workspace-mobile-sheet-list {
        overflow-y: auto;
        padding: 8px;
    }

    .lion-workspace-mobile-sheet-item {
        display: grid;
        grid-template-columns: 1fr 38px;
        gap: 5px;
        border: 1px solid transparent;
        border-radius: 13px;
    }

    .lion-workspace-mobile-sheet-item + .lion-workspace-mobile-sheet-item {
        margin-top: 5px;
    }

    .lion-workspace-mobile-sheet-item.active {
        border-color: color-mix(in srgb, var(--lion-accent) 35%, var(--lion-border));
        background: color-mix(in srgb, var(--lion-accent) 7%, transparent);
    }

    .lion-workspace-mobile-sheet-item .open {
        min-width: 0;
        display: grid;
        grid-template-columns: 38px 1fr auto;
        align-items: center;
        gap: 9px;
        padding: 7px;
        border: 0;
        background: transparent;
        color: var(--lion-text);
        text-align: start;
    }

    .lion-workspace-mobile-sheet-item .icon {
        width: 38px;
        height: 38px;
        display: grid;
        place-items: center;
        border-radius: 12px;
        background: color-mix(in srgb, var(--lion-primary) 10%, transparent);
        color: var(--lion-primary);
    }

    .lion-workspace-mobile-sheet-item .copy {
        min-width: 0;
    }

    .lion-workspace-mobile-sheet-item .copy strong,
    .lion-workspace-mobile-sheet-item .copy small {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .lion-workspace-mobile-sheet-item .copy strong {
        font-size: .8rem;
    }

    .lion-workspace-mobile-sheet-item .copy small {
        margin-top: 3px;
        color: var(--lion-text-muted);
        font-size: .66rem;
    }

    .lion-workspace-mobile-sheet-item .close {
        width: 34px;
        height: 34px;
        align-self: center;
        display: grid;
        place-items: center;
        border: 0;
        border-radius: 10px;
        background: transparent;
        color: var(--lion-text-muted);
    }

    .lion-workspace-mobile-sheet > footer {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
        padding: 9px;
        border-top: 1px solid var(--lion-border);
    }

    .lion-workspace-mobile-sheet > footer button {
        min-height: 41px;
        border: 1px solid var(--lion-border);
        border-radius: 12px;
        background: var(--lion-surface);
        color: var(--lion-text);
    }

    .lion-workspace-mobile-sheet > footer button.danger {
        color: #ef4444;
    }

    .lion-quick-access-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lion-quick-modal-layout {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }

    .lion-quick-page-picker,
    .lion-quick-selected {
        overflow: visible;
    }
}

@media (max-width: 640px) {
    .lion-quick-access {
        gap: 10px;
        margin-bottom: 12px;
        padding: 11px;
        border-radius: 16px;
    }

    .lion-quick-access-head {
        align-items: flex-start;
    }

    .lion-quick-access-customize span {
        display: none;
    }

    .lion-quick-access-customize {
        width: 35px;
        min-width: 35px;
        padding: 0;
    }

    .lion-quick-action-card {
        min-height: 58px;
        grid-template-columns: 32px 1fr;
        padding: 8px;
    }

    .lion-quick-action-icon {
        width: 32px;
        height: 32px;
    }

    .lion-quick-action-arrow {
        display: none;
    }

    .lion-quick-action-copy strong {
        font-size: .72rem;
    }

    .lion-quick-action-copy small {
        font-size: .6rem;
    }

    .lion-quick-most-used {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .lion-quick-most-used-list {
        width: 100%;
    }

    .lion-quick-modal-backdrop {
        align-items: end;
        padding: 0;
    }

    .lion-quick-modal {
        width: 100%;
        max-height: 88vh;
        border-radius: 22px 22px 0 0;
    }

    .lion-quick-modal-body {
        overflow-y: auto;
        padding: 11px;
    }

    .lion-quick-picker-group > div {
        grid-template-columns: 1fr;
    }

    .lion-quick-modal > footer button {
        flex: 1 1 0;
    }

    .lion-workspace-confirm-card {
        grid-template-columns: 40px 1fr;
        padding: 15px;
    }

    .lion-workspace-confirm-card > .icon {
        width: 40px;
        height: 40px;
    }

    .lion-workspace-confirm-card footer {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* =========================================================
   Trial 2 refinements
   - Quick access without bold or route paths
   - Permission-safe shortcuts
   - Compact auto-expanding topbar
   - Keep-alive workspace page host
   ========================================================= */

/* Keep the active routed component alive while other tabs are selected. */
.lion-workspace-page-stack {
    width: 100%;
    min-width: 0;
}

.lion-workspace-page-slot.is-active {
    display: block !important;
    width: 100%;
    min-width: 0;
    min-height: 1px;
    overflow: visible;
}

.lion-workspace-page-slot.is-suspended,
.lion-workspace-page-slot[hidden] {
    display: none !important;
}

/* Quick access typography: no bold in the panel or customization window. */
.lion-quick-access,
.lion-quick-modal,
.lion-quick-access *,
.lion-quick-modal * {
    font-weight: 400 !important;
}

.lion-quick-action-card {
    grid-template-columns: 35px 1fr 14px;
}

.lion-quick-action-copy {
    display: flex;
    align-items: center;
    min-height: 35px;
}

.lion-quick-action-copy strong {
    font-size: .78rem;
}

.lion-quick-picker-item {
    grid-template-columns: 32px 1fr 18px;
}

.lion-quick-picker-item .copy {
    display: flex;
    align-items: center;
    min-height: 32px;
}

/* A little upper breathing room without increasing the total bar height. */
.lion-workspace-tabs {
    padding-top: 0;
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
    .lion-shell.lion-shell--workspace-open {
        --lion-workspace-compact-topbar-height: 42px;
        --lion-workspace-expanded-topbar-height: 64px;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) {
        height: var(--lion-workspace-compact-topbar-height) !important;
        min-height: var(--lion-workspace-compact-topbar-height) !important;
        padding: 3px 10px !important;
        box-shadow: 0 5px 18px rgba(15, 23, 42, .05) !important;
        transition:
            height .18s ease,
            min-height .18s ease,
            padding .18s ease,
            box-shadow .18s ease;
    }

    .lion-shell.lion-shell--workspace-open .lion-topbar-v2:hover,
    .lion-shell.lion-shell--workspace-open.lion-shell--topbar-expanded .lion-topbar-v2 {
        height: var(--lion-workspace-expanded-topbar-height) !important;
        min-height: var(--lion-workspace-expanded-topbar-height) !important;
        padding: 10px 12px !important;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-menu-btn-v2,
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-topbar-icon-btn,
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-lang-trigger {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
        padding: 0 !important;
        border-radius: 9px !important;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-user-trigger-v2 {
        height: 30px !important;
        min-height: 30px !important;
        padding: 2px 7px 2px 4px !important;
        gap: 6px !important;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-user-trigger-avatar {
        width: 24px !important;
        min-width: 24px !important;
        height: 24px !important;
        flex-basis: 24px !important;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-user-trigger-meta,
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-user-trigger-arrow,
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-lang-current,
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-lang-trigger .bi-chevron-down,
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-lang-trigger .bi-chevron-up {
        display: none !important;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-brand-mark {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        flex-basis: 30px !important;
        border-radius: 10px !important;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-brand-mark-img {
        width: 22px !important;
        max-width: 22px !important;
        height: 22px !important;
        max-height: 22px !important;
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) .lion-shell-brand-text {
        max-width: 130px !important;
        font-size: .86rem !important;
    }

    .lion-shell.lion-shell--workspace-open .lion-workspace-tabs {
        top: var(--lion-workspace-compact-topbar-height);
        transition: top .18s ease;
    }

    .lion-shell.lion-shell--workspace-open .lion-topbar-v2:hover + .lion-workspace-tabs,
    .lion-shell.lion-shell--workspace-open.lion-shell--topbar-expanded .lion-workspace-tabs {
        top: var(--lion-workspace-expanded-topbar-height);
    }

    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded) .lion-topbar-v2:not(:hover) ~ .lion-app-sidebar-v2 {
        top: 54px !important;
    }
}

@media (max-width: 640px) {
    .lion-quick-action-card {
        grid-template-columns: 32px 1fr;
    }
}

/* =========================================================
   Stability fix 1
   - Center compact language icon
   - Isolated page error state
   ========================================================= */

.lion-topbar-lang-wrap,
.lion-topbar-lang-wrap .lion-lang-trigger {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.lion-topbar-lang-wrap .lion-lang-trigger {
    line-height: 1 !important;
    overflow: hidden !important;
}

.lion-topbar-lang-wrap .lion-lang-trigger > i,
.lion-topbar-lang-wrap .lion-lang-trigger .bi-translate {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    margin: 0 !important;
    transform: none !important;
    width: 18px !important;
    height: 18px !important;
    display: inline-grid !important;
    place-items: center !important;
    line-height: 1 !important;
    flex: 0 0 18px !important;
}

@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded)
    .lion-topbar-v2:not(:hover)
    .lion-topbar-lang-wrap,
    .lion-shell.lion-shell--workspace-open:not(.lion-shell--topbar-expanded)
    .lion-topbar-v2:not(:hover)
    .lion-lang-trigger {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
        padding: 0 !important;
        gap: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

.lion-workspace-page-error {
    min-height: min(520px, calc(100vh - 150px));
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 12px;
    padding: 24px;
    text-align: center;
    color: var(--lion-text);
    background: var(--lion-surface);
    border: 1px solid var(--lion-border);
    border-radius: var(--lion-radius-lg, 18px);
    box-shadow: var(--lion-shadow-sm);
}

.lion-workspace-page-error-icon {
    width: 52px;
    height: 52px;
    display: inline-grid;
    place-items: center;
    border-radius: 16px;
    color: var(--lion-warning, #f59e0b);
    background: color-mix(in srgb, var(--lion-warning, #f59e0b) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--lion-warning, #f59e0b) 30%, var(--lion-border));
    font-size: 1.35rem;
}

.lion-workspace-page-error-copy {
    max-width: 620px;
    display: grid;
    gap: 6px;
}

.lion-workspace-page-error-copy strong {
    font-size: 1rem;
    font-weight: 600;
}

.lion-workspace-page-error-copy p,
.lion-workspace-page-error-copy small {
    margin: 0;
    color: var(--lion-text-muted);
    line-height: 1.7;
}

.lion-workspace-page-error-copy small {
    max-width: 100%;
    overflow-wrap: anywhere;
    opacity: .78;
}

.lion-workspace-page-error-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

.lion-workspace-page-error-actions button {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    border-radius: 11px;
    border: 1px solid var(--lion-border);
    background: var(--lion-surface-soft, var(--lion-surface));
    color: var(--lion-text);
}

.lion-workspace-page-error-actions button.primary {
    border-color: color-mix(in srgb, var(--lion-primary) 42%, var(--lion-border));
    background: color-mix(in srgb, var(--lion-primary) 12%, var(--lion-surface));
    color: var(--lion-primary);
}

@media (max-width: 640px) {
    .lion-workspace-page-error {
        min-height: calc(100vh - 130px);
        padding: 18px 14px;
        border-radius: 14px;
    }

    .lion-workspace-page-error-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
    }

    .lion-workspace-page-error-actions button {
        width: 100%;
    }
}


/* =========================================================
   Workspace Trial 3
   Scroll + cached-page layout + dashboard refinement
   ========================================================= */

/* A real active-page box is required for height calculation, sticky blocks,
   ResizeObserver, and pages that use 100%/viewport dimensions. */
.lion-shell.lion-shell--workspace-open,
.lion-shell.lion-shell--workspace-open .lion-body-v2,
.lion-shell.lion-shell--workspace-open .lion-main-v2,
.lion-shell.lion-shell--workspace-open .lion-content-v2,
.lion-shell.lion-shell--workspace-open .lion-workspace-page-stack,
.lion-shell.lion-shell--workspace-open .lion-workspace-page-slot.is-active {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.lion-shell.lion-shell--workspace-open .lion-body-v2,
.lion-shell.lion-shell--workspace-open .lion-main-v2,
.lion-shell.lion-shell--workspace-open .lion-content-v2,
.lion-shell.lion-shell--workspace-open .lion-workspace-page-stack {
    min-height: 0 !important;
}

.lion-workspace-page-slot.is-active {
    position: relative;
    contain: none !important;
}

.lion-workspace-page-slot.is-active > .iinv-page,
.lion-workspace-page-slot.is-active > .installment-invoice-page,
.lion-workspace-page-slot.is-active > .sales-invoice-page {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
}

.lion-workspace-page-slot.is-active > .sales-invoice-page {
    min-height: calc(100dvh - 84px) !important;
    overflow: visible !important;
}

/* Dashboard order:
   1) dashboard hero
   2) user shortcuts
   3) dashboard reports/cards */
.lion-content-v2:has(> .lion-quick-access + .lion-dashboard) {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
}

.lion-content-v2:has(> .lion-quick-access + .lion-dashboard) > .lion-dashboard {
    display: contents !important;
}

.lion-content-v2:has(> .lion-quick-access + .lion-dashboard) > .lion-dashboard > .lion-dash-hero {
    order: 1;
}

.lion-content-v2:has(> .lion-quick-access + .lion-dashboard) > .lion-quick-access {
    order: 2;
}

.lion-content-v2:has(> .lion-quick-access + .lion-dashboard) > .lion-dashboard > :not(.lion-dash-hero) {
    order: 3;
}

/* Old dashboard shortcuts and promotional wording are replaced by
   the personalized shortcut strip. */
.lion-content-v2:has(> .lion-quick-access + .lion-dashboard)
.lion-dash-hero__actions,
.lion-content-v2:has(> .lion-quick-access + .lion-dashboard)
.lion-dash-subtitle {
    display: none !important;
}

/* Clean shortcut strip: no large title panel and no duplicated metadata. */
.lion-quick-access {
    position: relative;
    width: 100%;
    display: grid;
    gap: 8px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.lion-quick-access-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(138px, 1fr)) !important;
    gap: 9px !important;
}

.lion-quick-action-card {
    min-width: 0 !important;
    min-height: 70px !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    border: 1px solid color-mix(in srgb, var(--lion-border) 72%, var(--lion-primary) 28%) !important;
    border-radius: 16px !important;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb, var(--lion-surface) 96%, var(--lion-primary) 4%),
            color-mix(in srgb, var(--lion-surface) 98%, var(--lion-accent) 2%)
        ) !important;
    color: var(--lion-text) !important;
    text-align: start !important;
    box-shadow:
        0 8px 22px rgba(15, 23, 42, .055),
        inset 0 1px 0 color-mix(in srgb, #fff 12%, transparent) !important;
    transition:
        transform .16s ease,
        border-color .16s ease,
        box-shadow .16s ease !important;
}

.lion-quick-action-card:hover {
    transform: translateY(-2px) !important;
    border-color: color-mix(in srgb, var(--lion-accent) 58%, var(--lion-border)) !important;
    box-shadow:
        0 12px 28px rgba(15, 23, 42, .10),
        0 0 0 3px color-mix(in srgb, var(--lion-accent) 7%, transparent) !important;
}

.lion-quick-action-icon {
    width: 38px !important;
    height: 38px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 13px !important;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb, var(--lion-primary) 15%, transparent),
            color-mix(in srgb, var(--lion-accent) 10%, transparent)
        ) !important;
    color: var(--lion-primary) !important;
    border: 1px solid color-mix(in srgb, var(--lion-primary) 18%, transparent) !important;
    font-size: 1rem !important;
}

.lion-quick-action-copy {
    min-width: 0 !important;
    min-height: 0 !important;
    display: block !important;
}

.lion-quick-action-copy strong {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: var(--lion-text) !important;
    font-size: .82rem !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;
}

.lion-quick-action-customize {
    border-style: dashed !important;
    background:
        color-mix(in srgb, var(--lion-surface) 94%, var(--lion-accent) 6%) !important;
}

.lion-quick-action-customize .lion-quick-action-icon {
    color: var(--lion-accent) !important;
    background: color-mix(in srgb, var(--lion-accent) 13%, transparent) !important;
    border-color: color-mix(in srgb, var(--lion-accent) 22%, transparent) !important;
}

.lion-quick-most-used {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 0 !important;
    border: 0 !important;
}

.lion-quick-most-used-icon {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: var(--lion-text-muted);
    background: color-mix(in srgb, var(--lion-surface) 92%, var(--lion-primary) 8%);
    border: 1px solid var(--lion-border);
    font-size: .75rem;
}

.lion-quick-most-used-list button {
    min-height: 28px !important;
    padding: 0 9px !important;
    font-size: .68rem !important;
    font-weight: 400 !important;
}

/* Customization modal: names only, without route paths or bold typography. */
.lion-quick-picker-item .copy,
.lion-quick-picker-item .copy strong {
    min-width: 0 !important;
}

.lion-quick-picker-item .copy strong {
    font-weight: 400 !important;
    font-size: .76rem !important;
}

/* Keep a natural document scrollbar whenever page content exceeds viewport. */
html,
body {
    overflow-y: auto !important;
}

@media (max-width: 767.98px) {
    .lion-content-v2:has(> .lion-quick-access + .lion-dashboard) {
        gap: 10px !important;
    }

    .lion-quick-access-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .lion-quick-action-card {
        min-height: 66px !important;
        grid-template-columns: 34px minmax(0, 1fr) !important;
        padding: 9px 10px !important;
        border-radius: 14px !important;
    }

    .lion-quick-action-icon {
        width: 34px !important;
        height: 34px !important;
        border-radius: 11px !important;
    }

    .lion-quick-action-copy strong {
        font-size: .76rem !important;
    }

    .lion-quick-most-used {
        overflow: hidden !important;
    }
}

/* =========================================================
   Lion Command Center + Communications V1
   Dashboard, announcements, notifications and admin console
   ========================================================= */

/* ---------- Topbar premium / compact ---------- */
.lion-shell--dashboard .lion-topbar-v2 {
    min-height: 62px !important;
    height: 62px !important;
    background:
        linear-gradient(180deg,
            color-mix(in srgb, var(--lion-topbar-bg) 94%, var(--lion-primary) 6%),
            var(--lion-topbar-bg)) !important;
    border-bottom-color: color-mix(in srgb, var(--lion-border) 68%, var(--lion-accent) 32%) !important;
}

.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2 {
    min-height: 42px !important;
    height: 42px !important;
    padding-block: 3px !important;
    transition: height .18s ease, min-height .18s ease, padding .18s ease !important;
}

.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:hover,
.lion-shell--workspace-open:not(.lion-shell--dashboard).lion-shell--topbar-expanded .lion-topbar-v2 {
    min-height: 58px !important;
    height: 58px !important;
    padding-block: 8px !important;
}

.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:not(:hover) .lion-menu-btn-v2,
.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:not(:hover) .lion-topbar-icon-btn,
.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:not(:hover) .lion-user-trigger-v2,
.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:not(:hover) .lion-lang-trigger {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    border-radius: 10px !important;
}

.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:not(:hover) .lion-shell-brand-text,
.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:not(:hover) .lion-user-trigger-meta,
.lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:not(:hover) .lion-user-trigger-arrow {
    display: none !important;
}

/* ---------- Notification bell ---------- */
.lion-notification-bell {
    position: relative;
    flex: 0 0 auto;
}

.lion-notification-trigger {
    position: relative;
    display: grid !important;
    place-items: center !important;
}

.lion-notification-trigger.active,
.lion-notification-trigger:hover {
    color: var(--lion-accent) !important;
    border-color: color-mix(in srgb, var(--lion-accent) 52%, var(--lion-border)) !important;
    background: color-mix(in srgb, var(--lion-surface) 88%, var(--lion-accent) 12%) !important;
}

.lion-notification-badge {
    position: absolute;
    inset-block-start: -5px;
    inset-inline-end: -5px;
    min-width: 18px;
    height: 18px;
    padding-inline: 4px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: var(--lion-accent);
    color: var(--lion-on-accent, #111);
    border: 2px solid var(--lion-topbar-bg);
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    z-index: 2;
}

.lion-notification-popover {
    position: absolute;
    top: calc(100% + 10px);
    inset-inline-end: 0;
    width: min(420px, calc(100vw - 24px));
    max-height: min(720px, calc(100dvh - 82px));
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--lion-border) 68%, var(--lion-accent) 32%);
    border-radius: 18px;
    background: color-mix(in srgb, var(--lion-surface) 97%, transparent);
    color: var(--lion-text);
    box-shadow: 0 24px 70px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.03) inset;
    backdrop-filter: blur(22px);
    z-index: 5000;
}

.lion-notification-popover > header,
.lion-notification-popover > footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--lion-border);
}

.lion-notification-popover > header > div,
.lion-notification-popover > footer a {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--lion-text);
    text-decoration: none;
}

.lion-notification-popover > header > div i,
.lion-notification-popover > footer a i {
    color: var(--lion-accent);
}

.lion-notification-popover > header button {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 1px solid var(--lion-border);
    border-radius: 10px;
    background: transparent;
    color: var(--lion-text);
}

.lion-notification-filter {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 6px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--lion-border);
}

.lion-notification-filter button {
    min-height: 34px;
    border: 1px solid var(--lion-border);
    border-radius: 11px;
    background: color-mix(in srgb, var(--lion-surface) 94%, var(--lion-primary) 6%);
    color: var(--lion-text-muted);
    font-size: .72rem;
}

.lion-notification-filter button.active {
    color: var(--lion-on-accent, #111);
    background: var(--lion-accent);
    border-color: var(--lion-accent);
}

.lion-notification-list {
    overflow: auto;
    padding: 10px;
}

.lion-notification-item {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 10px;
    padding: 11px;
    margin-bottom: 8px;
    border: 1px solid var(--lion-border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--lion-surface) 95%, var(--lion-primary) 5%);
}

.lion-notification-item.unread {
    border-color: color-mix(in srgb, var(--lion-accent) 44%, var(--lion-border));
}

.lion-notification-item .icon,
.lion-inbox-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: color-mix(in srgb, var(--lion-primary) 15%, transparent);
    color: var(--lion-primary);
    font-size: 1rem;
}

.lion-notification-item.type-warning .icon,
.lion-inbox-card.type-warning .lion-inbox-icon,
.lion-notification-item.type-subscription .icon,
.lion-inbox-card.type-subscription .lion-inbox-icon {
    color: var(--lion-warning, #f59e0b);
    background: color-mix(in srgb, var(--lion-warning, #f59e0b) 15%, transparent);
}

.lion-notification-item.type-danger .icon,
.lion-inbox-card.type-danger .lion-inbox-icon {
    color: var(--lion-danger, #ef4444);
    background: color-mix(in srgb, var(--lion-danger, #ef4444) 15%, transparent);
}

.lion-notification-item.type-success .icon,
.lion-inbox-card.type-success .lion-inbox-icon {
    color: var(--lion-success, #22c55e);
    background: color-mix(in srgb, var(--lion-success, #22c55e) 15%, transparent);
}

.lion-notification-item .copy,
.lion-inbox-copy {
    min-width: 0;
}

.lion-notification-item .title-row,
.lion-inbox-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.lion-notification-item strong,
.lion-inbox-title-row strong {
    font-size: .78rem;
    font-weight: 600;
    color: var(--lion-text);
}

.lion-notification-item p,
.lion-inbox-card p {
    margin: 5px 0 0;
    color: var(--lion-text-muted);
    font-size: .68rem;
    line-height: 1.65;
}

.lion-notification-item small,
.lion-inbox-card small {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 6px;
    color: var(--lion-text-muted);
    font-size: .62rem;
}

.lion-notification-item .new-dot,
.lion-inbox-new-dot {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--lion-accent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--lion-accent) 12%, transparent);
}

.lion-notification-item .options,
.lion-inbox-options,
.lion-notification-item .actions,
.lion-inbox-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.lion-notification-item .options button,
.lion-inbox-options button,
.lion-notification-item .actions button,
.lion-inbox-actions button {
    min-height: 30px;
    padding: 0 9px;
    border: 1px solid color-mix(in srgb, var(--lion-accent) 32%, var(--lion-border));
    border-radius: 9px;
    background: transparent;
    color: var(--lion-text);
    font-size: .62rem;
}

.lion-notification-item .actions button.primary,
.lion-inbox-actions button.primary {
    background: var(--lion-accent);
    color: var(--lion-on-accent, #111);
    border-color: var(--lion-accent);
}

.lion-notification-state {
    min-height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    color: var(--lion-text-muted);
    font-size: .78rem;
    text-align: center;
}

.lion-notification-state i { font-size: 1.5rem; }
.lion-notification-state.error { color: var(--lion-danger, #ef4444); }

/* ---------- Dashboard command center ---------- */
.lion-content-v2:has(> .lion-command-dashboard) {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    padding-top: 14px !important;
}

.lion-command-dashboard {
    display: grid;
    gap: 14px;
    width: 100%;
    color: var(--lion-text);
}

.lion-command-skeleton {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 12px;
}

.lion-command-skeleton span {
    min-height: 160px;
    border-radius: 22px;
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--lion-surface) 92%, var(--lion-primary) 8%),
        color-mix(in srgb, var(--lion-surface) 98%, white 2%),
        color-mix(in srgb, var(--lion-surface) 92%, var(--lion-primary) 8%));
    background-size: 240% 100%;
    animation: lionCommandShimmer 1.3s infinite linear;
}

@keyframes lionCommandShimmer { to { background-position: -240% 0; } }

.lion-command-error {
    min-height: 90px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    border: 1px solid color-mix(in srgb, var(--lion-danger, #ef4444) 32%, var(--lion-border));
    border-radius: 18px;
    background: color-mix(in srgb, var(--lion-surface) 92%, var(--lion-danger, #ef4444) 8%);
}

.lion-command-error > i { color: var(--lion-danger, #ef4444); font-size: 1.4rem; }
.lion-command-error div { display:grid; gap:3px; flex:1; }
.lion-command-error span { color:var(--lion-text-muted); font-size:.75rem; }
.lion-command-error button { width:38px;height:38px;border:1px solid var(--lion-border);border-radius:12px;background:transparent;color:var(--lion-text); }

.lion-command-hero {
    position: relative;
    min-height: 176px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    overflow: hidden;
    padding: 26px 30px;
    border: 1px solid color-mix(in srgb, var(--lion-border) 55%, var(--lion-accent) 45%);
    border-radius: 26px;
    background:
        radial-gradient(circle at 15% 20%, color-mix(in srgb, var(--lion-primary) 18%, transparent), transparent 34%),
        linear-gradient(120deg,
            color-mix(in srgb, var(--lion-surface) 93%, #020817 7%),
            color-mix(in srgb, var(--lion-surface) 82%, var(--lion-accent) 18%));
    box-shadow: 0 22px 60px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
}

.lion-command-hero::after {
    content:"";
    position:absolute;
    inset:auto -6% -70% auto;
    width:420px;
    height:420px;
    border:1px solid color-mix(in srgb, var(--lion-accent) 24%, transparent);
    transform:rotate(45deg);
}

.lion-command-hero-copy {
    position: relative;
    z-index: 2;
    max-width: 720px;
}

.lion-command-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--lion-accent);
    font-size: .72rem;
}

.lion-command-hero h1 {
    margin: 10px 0 6px;
    font-size: clamp(2rem, 4vw, 3.15rem);
    font-weight: 500;
    line-height: 1.05;
    color: var(--lion-text);
}

.lion-command-hero p {
    margin: 0;
    color: var(--lion-text-muted);
    font-size: .95rem;
}

.lion-command-hero-mark {
    position: relative;
    z-index: 2;
    width: min(32vw, 250px);
    height: 128px;
    display: grid;
    place-items: center;
    opacity: .48;
    filter: drop-shadow(0 0 24px color-mix(in srgb, var(--lion-accent) 28%, transparent));
}

.lion-command-hero-mark img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.lion-command-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(310px, .75fr);
    gap: 14px;
    align-items: stretch;
}

.lion-announcements-panel,
.lion-dashboard-inbox,
.lion-learning-center {
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--lion-border) 72%, var(--lion-accent) 28%);
    border-radius: 22px;
    background: color-mix(in srgb, var(--lion-surface) 96%, var(--lion-primary) 4%);
    box-shadow: 0 16px 40px rgba(0,0,0,.10);
}

.lion-announcements-panel,
.lion-learning-center { padding: 14px; }
.lion-dashboard-inbox { display:grid; grid-template-rows:auto auto minmax(0,1fr); overflow:hidden; }

.lion-command-section-head {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.lion-command-section-head > div {
    display: flex;
    align-items: center;
    gap: 9px;
    color: var(--lion-text);
}

.lion-command-section-head > div i { color: var(--lion-accent); }
.lion-command-section-head > div span { font-size: .9rem; font-weight: 600; }

.lion-command-count {
    min-width: 30px;
    height: 26px;
    padding-inline: 8px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: color-mix(in srgb, var(--lion-accent) 13%, transparent);
    color: var(--lion-accent);
    font-size: .68rem;
}

.lion-announcement-stage {
    position: relative;
    min-height: 310px;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--lion-border) 60%, var(--lion-accent) 40%);
    border-radius: 20px;
    background:
        radial-gradient(circle at 15% 10%, color-mix(in srgb, var(--lion-primary) 25%, transparent), transparent 35%),
        linear-gradient(135deg,#071121,#111827 58%,#302a1b);
    background-size: cover;
    background-position: center;
}

.lion-announcement-overlay {
    position:absolute;
    inset:0;
    background: linear-gradient(90deg, rgba(3,8,18,.92) 0%, rgba(3,8,18,.68) 46%, rgba(3,8,18,.18) 100%);
}

[dir="rtl"] .lion-announcement-overlay {
    background: linear-gradient(270deg, rgba(3,8,18,.92) 0%, rgba(3,8,18,.68) 46%, rgba(3,8,18,.18) 100%);
}

.lion-announcement-content {
    position:relative;
    z-index:2;
    width:min(72%, 720px);
    padding: 28px 30px 38px;
    color:#fff;
}

.lion-announcement-badge {
    display:inline-flex;
    padding:5px 10px;
    border-radius:9px;
    background:color-mix(in srgb, var(--lion-accent) 88%, #000 12%);
    color:var(--lion-on-accent,#111);
    font-size:.65rem;
}

.lion-announcement-content h2 { margin:12px 0 7px; font-size:clamp(1.35rem,2.6vw,2rem); font-weight:600; }
.lion-announcement-content p { margin:0; max-width:58ch; color:rgba(255,255,255,.76); font-size:.8rem; line-height:1.8; }
.lion-announcement-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }

.lion-command-primary,
.lion-command-secondary {
    min-height:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:0 14px;
    border-radius:11px;
    font-size:.7rem;
}

.lion-command-primary { border:1px solid var(--lion-accent); background:var(--lion-accent); color:var(--lion-on-accent,#111); }
.lion-command-secondary { border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.07); color:#fff; }

.lion-announcement-nav {
    position:absolute;
    top:50%;
    z-index:3;
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    transform:translateY(-50%);
    border:1px solid rgba(255,255,255,.22);
    border-radius:50%;
    background:rgba(5,11,22,.72);
    color:#fff;
    backdrop-filter:blur(12px);
}

.lion-announcement-nav-prev { inset-inline-start:12px; }
.lion-announcement-nav-next { inset-inline-end:12px; }
.lion-announcement-dots { position:absolute; z-index:3; inset-block-end:13px; inset-inline:0; display:flex; justify-content:center; gap:7px; }
.lion-announcement-dots button { width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.42); }
.lion-announcement-dots button.active { width:21px;border-radius:99px;background:var(--lion-accent); }

.lion-announcement-mini-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:10px; }
.lion-announcement-mini { min-width:0;min-height:72px;display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:9px;padding:9px 11px;border:1px solid var(--lion-border);border-radius:14px;background:color-mix(in srgb,var(--lion-surface) 95%,var(--lion-primary) 5%);color:var(--lion-text);text-align:start; }
.lion-announcement-mini-icon { width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--lion-accent) 13%,transparent);color:var(--lion-accent); }
.lion-announcement-mini-copy { min-width:0;display:grid;gap:3px; }
.lion-announcement-mini-copy strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;font-weight:600; }
.lion-announcement-mini-copy small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--lion-text-muted);font-size:.61rem; }

.lion-dashboard-inbox .lion-command-section-head { padding:12px 14px 0; margin:0; }
.lion-dashboard-inbox-tabs { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:9px 12px;border-bottom:1px solid var(--lion-border); }
.lion-dashboard-inbox-tabs button { min-height:32px;border:1px solid var(--lion-border);border-radius:10px;background:transparent;color:var(--lion-text-muted);font-size:.64rem; }
.lion-dashboard-inbox-tabs button.active { color:var(--lion-accent);background:color-mix(in srgb,var(--lion-accent) 10%,transparent);border-color:color-mix(in srgb,var(--lion-accent) 35%,var(--lion-border)); }
.lion-dashboard-inbox-list { max-height:480px;overflow:auto;padding:10px; }
.lion-inbox-card { display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;padding:11px;margin-bottom:8px;border:1px solid var(--lion-border);border-radius:14px;background:color-mix(in srgb,var(--lion-surface) 96%,var(--lion-primary) 4%); }
.lion-inbox-card.is-unread { border-color:color-mix(in srgb,var(--lion-accent) 40%,var(--lion-border)); }
.lion-inbox-reference { color:var(--lion-accent)!important; }

.lion-learning-center { padding-bottom:12px; }
.lion-learning-search { position:relative;width:min(300px,48vw); }
.lion-learning-search i { position:absolute;inset-inline-start:11px;top:50%;transform:translateY(-50%);color:var(--lion-text-muted);font-size:.75rem; }
.lion-learning-search input { width:100%;height:36px;padding-inline:32px 10px;border:1px solid var(--lion-border);border-radius:11px;background:color-mix(in srgb,var(--lion-surface) 94%,var(--lion-primary) 6%);color:var(--lion-text);font-size:.7rem;outline:0; }
.lion-learning-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px; }
.lion-learning-card { min-width:0;min-height:94px;display:grid;grid-template-columns:74px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px;border:1px solid var(--lion-border);border-radius:15px;background:color-mix(in srgb,var(--lion-surface) 96%,var(--lion-primary) 4%);color:var(--lion-text);text-align:start; }
.lion-learning-thumb { width:74px;height:70px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,#151f32,#312814);background-size:cover;background-position:center;color:#fff;font-size:1.45rem; }
.lion-learning-thumb i { width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:rgba(0,0,0,.55); }
.lion-learning-copy { min-width:0;display:grid;gap:3px; }
.lion-learning-copy small { color:var(--lion-accent);font-size:.58rem; }
.lion-learning-copy strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.74rem;font-weight:600; }
.lion-learning-copy span { display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--lion-text-muted);font-size:.61rem;line-height:1.55; }

.lion-command-empty { min-height:170px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;color:var(--lion-text-muted);font-size:.75rem;text-align:center; }
.lion-command-empty.compact { min-height:100px; }
.lion-command-empty i { font-size:1.5rem;color:var(--lion-accent); }

.lion-command-modal-backdrop,
.lion-comm-modal-backdrop {
    position:fixed;
    inset:0;
    z-index:8000;
    display:grid;
    place-items:center;
    padding:18px;
    background:rgba(2,8,23,.68);
    backdrop-filter:blur(10px);
}

.lion-command-modal { width:min(720px,100%);max-height:88dvh;overflow:auto;border:1px solid color-mix(in srgb,var(--lion-border) 55%,var(--lion-accent) 45%);border-radius:22px;background:var(--lion-surface);box-shadow:0 28px 90px rgba(0,0,0,.4); }
.lion-command-modal header { display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px;border-bottom:1px solid var(--lion-border); }
.lion-command-modal header span { color:var(--lion-accent);font-size:.65rem; }
.lion-command-modal header h2 { margin:5px 0 0;font-size:1.25rem;font-weight:600; }
.lion-command-modal header button { width:36px;height:36px;border:1px solid var(--lion-border);border-radius:11px;background:transparent;color:var(--lion-text); }
.lion-command-modal > img { width:100%;max-height:330px;object-fit:cover; }
.lion-command-modal-body { padding:20px;white-space:pre-wrap;color:var(--lion-text-muted);line-height:1.9;font-size:.82rem; }
.lion-command-modal footer { display:flex;justify-content:flex-end;gap:8px;padding:14px 18px;border-top:1px solid var(--lion-border); }
.lion-command-modal footer .lion-command-secondary { color:var(--lion-text);border-color:var(--lion-border);background:transparent; }

/* hide legacy dashboard hero/action blocks; keep existing KPI/report content below */
.lion-dashboard-legacy-body .lion-dash-hero,
.lion-dashboard-legacy-body .lion-dash-hero__actions,
.lion-dashboard-legacy-body .lion-dash-subtitle {
    display:none !important;
}

.lion-dashboard-legacy-body .lion-dashboard { gap:14px !important; }

/* ---------- Communications administration ---------- */
.lion-communications-admin { display:grid;gap:14px;width:100%;color:var(--lion-text); }
.lion-comm-loading,.lion-comm-denied { min-height:360px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;border:1px solid var(--lion-border);border-radius:22px;background:var(--lion-surface);text-align:center; }
.lion-comm-denied i { font-size:2.4rem;color:var(--lion-danger,#ef4444); }
.lion-comm-denied button { min-height:42px;padding:0 16px;border:0;border-radius:12px;background:var(--lion-primary);color:#fff; }

.lion-comm-header { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px;border:1px solid color-mix(in srgb,var(--lion-border) 56%,var(--lion-accent) 44%);border-radius:24px;background:linear-gradient(135deg,color-mix(in srgb,var(--lion-surface) 93%,var(--lion-primary) 7%),color-mix(in srgb,var(--lion-surface) 86%,var(--lion-accent) 14%));box-shadow:0 18px 48px rgba(0,0,0,.12); }
.lion-comm-kicker { display:inline-flex;align-items:center;gap:7px;color:var(--lion-accent);font-size:.67rem; }
.lion-comm-header h1 { margin:8px 0 5px;font-size:1.65rem;font-weight:600; }
.lion-comm-header p { margin:0;color:var(--lion-text-muted);font-size:.78rem; }
.lion-comm-close { width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--lion-border);border-radius:13px;background:transparent;color:var(--lion-text); }

.lion-comm-message { display:flex;align-items:center;gap:9px;padding:11px 13px;border:1px solid;border-radius:14px;font-size:.75rem; }
.lion-comm-message.success { color:var(--lion-success,#22c55e);border-color:color-mix(in srgb,var(--lion-success,#22c55e) 34%,var(--lion-border));background:color-mix(in srgb,var(--lion-success,#22c55e) 8%,var(--lion-surface)); }
.lion-comm-message.error { color:var(--lion-danger,#ef4444);border-color:color-mix(in srgb,var(--lion-danger,#ef4444) 34%,var(--lion-border));background:color-mix(in srgb,var(--lion-danger,#ef4444) 8%,var(--lion-surface)); }
.lion-comm-message span { flex:1; }
.lion-comm-message button { width:28px;height:28px;border:0;background:transparent;color:inherit; }

.lion-comm-tabs { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:7px;border:1px solid var(--lion-border);border-radius:17px;background:var(--lion-surface); }
.lion-comm-tabs button { min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--lion-text-muted);font-size:.75rem; }
.lion-comm-tabs button b { min-width:23px;height:23px;display:grid;place-items:center;border-radius:99px;background:color-mix(in srgb,var(--lion-primary) 11%,transparent);font-size:.62rem; }
.lion-comm-tabs button.active { color:var(--lion-on-accent,#111);background:var(--lion-accent);border-color:var(--lion-accent); }

.lion-comm-workspace { display:grid;grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr);gap:14px;align-items:start; }
.lion-comm-editor,.lion-comm-list-panel { min-width:0;border:1px solid var(--lion-border);border-radius:20px;background:var(--lion-surface);box-shadow:0 14px 36px rgba(0,0,0,.08);overflow:hidden; }
.lion-comm-editor { position:sticky;top:78px; }
.lion-comm-editor-head,.lion-comm-list-head { min-height:56px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid var(--lion-border);background:linear-gradient(180deg,color-mix(in srgb,var(--lion-surface) 92%,var(--lion-primary) 8%),var(--lion-surface)); }
.lion-comm-editor-head > div { display:flex;align-items:center;gap:9px;font-size:.83rem; }
.lion-comm-editor-head > div i { color:var(--lion-accent); }
.lion-comm-editor-head > button { width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--lion-border);border-radius:11px;background:transparent;color:var(--lion-text); }
.lion-comm-list-head strong { display:block;font-size:.83rem;font-weight:600; }
.lion-comm-list-head span { display:block;margin-top:3px;color:var(--lion-text-muted);font-size:.64rem; }

.lion-comm-form-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px; }
.lion-comm-form-grid label { min-width:0;display:grid;gap:5px; }
.lion-comm-form-grid label.wide { grid-column:1/-1; }
.lion-comm-form-grid label > span { color:var(--lion-text-muted);font-size:.66rem; }
.lion-comm-form-grid input:not([type="checkbox"]),.lion-comm-form-grid select,.lion-comm-form-grid textarea { width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--lion-border);border-radius:11px;background:color-mix(in srgb,var(--lion-surface) 96%,var(--lion-primary) 4%);color:var(--lion-text);font-family:inherit;font-size:.72rem;outline:0; }
.lion-comm-form-grid textarea { resize:vertical;line-height:1.65; }
.lion-comm-form-grid input:focus,.lion-comm-form-grid select:focus,.lion-comm-form-grid textarea:focus { border-color:color-mix(in srgb,var(--lion-accent) 60%,var(--lion-border));box-shadow:0 0 0 3px color-mix(in srgb,var(--lion-accent) 8%,transparent); }
.lion-comm-check { display:flex!important;align-items:center!important;grid-template-columns:auto 1fr;gap:8px!important;min-height:40px;padding:8px 10px;border:1px solid var(--lion-border);border-radius:11px; }
.lion-comm-check input { width:16px;height:16px; }
.lion-comm-upload small { color:var(--lion-text-muted);font-size:.61rem;overflow-wrap:anywhere; }

.lion-comm-editor-actions { display:flex;justify-content:flex-end;gap:8px;padding:12px 14px;border-top:1px solid var(--lion-border); }
.lion-comm-editor-actions button { min-height:39px;padding:0 14px;border:1px solid var(--lion-border);border-radius:11px;background:transparent;color:var(--lion-text);font-size:.7rem; }
.lion-comm-editor-actions button.primary { display:inline-flex;align-items:center;gap:7px;background:var(--lion-accent);color:var(--lion-on-accent,#111);border-color:var(--lion-accent); }

.lion-comm-list { max-height:calc(100dvh - 260px);overflow:auto;padding:10px; }
.lion-comm-row { display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:11px;margin-bottom:8px;border:1px solid var(--lion-border);border-radius:14px;background:color-mix(in srgb,var(--lion-surface) 96%,var(--lion-primary) 4%); }
.lion-comm-row-icon { width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:color-mix(in srgb,var(--lion-primary) 13%,transparent);color:var(--lion-primary); }
.lion-comm-row-icon.announcement,.lion-comm-row-icon.subscription { color:var(--lion-accent);background:color-mix(in srgb,var(--lion-accent) 13%,transparent); }
.lion-comm-row-icon.youtube { color:#ff3347;background:rgba(255,51,71,.10); }
.lion-comm-row-icon.warning { color:var(--lion-warning,#f59e0b);background:color-mix(in srgb,var(--lion-warning,#f59e0b) 13%,transparent); }
.lion-comm-row-icon.danger { color:var(--lion-danger,#ef4444);background:color-mix(in srgb,var(--lion-danger,#ef4444) 13%,transparent); }
.lion-comm-row-icon.success { color:var(--lion-success,#22c55e);background:color-mix(in srgb,var(--lion-success,#22c55e) 13%,transparent); }
.lion-comm-row-copy { min-width:0;display:grid;gap:3px; }
.lion-comm-row-copy strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.76rem;font-weight:600; }
.lion-comm-row-copy span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--lion-text-muted);font-size:.65rem; }
.lion-comm-row-copy small { color:var(--lion-text-muted);font-size:.58rem; }
.lion-comm-status { min-width:54px;height:26px;display:grid;place-items:center;border-radius:99px;font-size:.59rem; }
.lion-comm-status.active { color:var(--lion-success,#22c55e);background:color-mix(in srgb,var(--lion-success,#22c55e) 11%,transparent); }
.lion-comm-status.inactive { color:var(--lion-text-muted);background:color-mix(in srgb,var(--lion-text-muted) 10%,transparent); }
.lion-comm-row-actions { display:flex;gap:5px; }
.lion-comm-row-actions button { width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--lion-border);border-radius:10px;background:transparent;color:var(--lion-text); }
.lion-comm-row-actions button.danger { color:var(--lion-danger,#ef4444); }

.lion-alert-options-editor { display:grid;gap:8px;padding:0 14px 14px; }
.lion-alert-options-editor > header { display:flex;align-items:center;justify-content:space-between;gap:8px; }
.lion-alert-options-editor > header strong { font-size:.7rem;font-weight:600; }
.lion-alert-options-editor > header button { min-height:32px;padding:0 10px;border:1px solid var(--lion-border);border-radius:9px;background:transparent;color:var(--lion-text);font-size:.62rem; }
.lion-alert-option-row { display:grid;grid-template-columns:1fr 1fr auto 34px;gap:7px;align-items:center; }
.lion-alert-option-row input[type="text"],.lion-alert-option-row > input { min-width:0;height:38px;padding:0 9px;border:1px solid var(--lion-border);border-radius:10px;background:color-mix(in srgb,var(--lion-surface) 96%,var(--lion-primary) 4%);color:var(--lion-text);font-size:.67rem; }
.lion-alert-option-row label { display:flex;align-items:center;gap:5px;color:var(--lion-text-muted);font-size:.6rem;white-space:nowrap; }
.lion-alert-option-row > button { width:34px;height:34px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--lion-danger,#ef4444) 28%,var(--lion-border));border-radius:10px;background:transparent;color:var(--lion-danger,#ef4444); }

.lion-comm-confirm { width:min(390px,100%);padding:24px;border:1px solid color-mix(in srgb,var(--lion-danger,#ef4444) 32%,var(--lion-border));border-radius:20px;background:var(--lion-surface);text-align:center;box-shadow:0 28px 80px rgba(0,0,0,.36); }
.lion-comm-confirm .icon { width:58px;height:58px;margin:0 auto 12px;display:grid;place-items:center;border-radius:18px;background:color-mix(in srgb,var(--lion-danger,#ef4444) 12%,transparent);color:var(--lion-danger,#ef4444);font-size:1.35rem; }
.lion-comm-confirm h3 { margin:0 0 7px;font-size:1rem;font-weight:600; }
.lion-comm-confirm p { margin:0;color:var(--lion-text-muted);font-size:.72rem; }
.lion-comm-confirm > div { display:flex;justify-content:center;gap:8px;margin-top:18px; }
.lion-comm-confirm button { min-height:38px;padding:0 14px;border:1px solid var(--lion-border);border-radius:11px;background:transparent;color:var(--lion-text); }
.lion-comm-confirm button.danger { color:#fff;background:var(--lion-danger,#ef4444);border-color:var(--lion-danger,#ef4444); }

@media (max-width: 1199.98px) {
    .lion-command-grid { grid-template-columns: minmax(0,1.35fr) minmax(280px,.8fr); }
    .lion-learning-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .lion-comm-workspace { grid-template-columns:1fr; }
    .lion-comm-editor { position:static; }
    .lion-comm-list { max-height:none; }
}

@media (max-width: 767.98px) {
    .lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2,
    .lion-shell--workspace-open:not(.lion-shell--dashboard) .lion-topbar-v2:hover {
        min-height:56px !important;
        height:56px !important;
        padding-block:7px !important;
    }

    .lion-notification-popover { position:fixed;top:64px;inset-inline:8px;width:auto;max-height:calc(100dvh - 72px); }
    .lion-command-hero { min-height:150px;padding:20px;border-radius:20px; }
    .lion-command-hero h1 { font-size:1.8rem; }
    .lion-command-hero p { font-size:.78rem; }
    .lion-command-hero-mark { width:110px;height:90px; }
    .lion-command-grid { grid-template-columns:1fr; }
    .lion-announcement-stage { min-height:340px; }
    .lion-announcement-content { width:100%;padding:24px 22px 38px; }
    .lion-announcement-overlay,
    [dir="rtl"] .lion-announcement-overlay { background:linear-gradient(0deg,rgba(3,8,18,.94),rgba(3,8,18,.42)); }
    .lion-announcement-mini-grid { grid-template-columns:1fr; }
    .lion-dashboard-inbox-list { max-height:none; }
    .lion-learning-center .lion-command-section-head { align-items:stretch;flex-direction:column; }
    .lion-learning-search { width:100%; }
    .lion-learning-grid { grid-template-columns:1fr; }
    .lion-learning-card { grid-template-columns:64px minmax(0,1fr) auto; }
    .lion-learning-thumb { width:64px;height:62px; }
    .lion-comm-header { padding:18px; }
    .lion-comm-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .lion-comm-form-grid { grid-template-columns:1fr; }
    .lion-comm-form-grid label.wide { grid-column:auto; }
    .lion-comm-row { grid-template-columns:40px minmax(0,1fr) auto; }
    .lion-comm-row-icon { width:40px;height:40px; }
    .lion-comm-status { display:none; }
    .lion-alert-option-row { grid-template-columns:1fr; }
    .lion-alert-option-row > button { width:100%; }
}

.lion-alert-response-modal {
    width:min(520px,100%);
    overflow:hidden;
    border:1px solid color-mix(in srgb,var(--lion-border) 58%,var(--lion-accent) 42%);
    border-radius:22px;
    background:var(--lion-surface);
    color:var(--lion-text);
    box-shadow:0 30px 90px rgba(0,0,0,.42);
}

.lion-alert-response-modal > header {
    display:grid;
    grid-template-columns:48px minmax(0,1fr) 36px;
    align-items:center;
    gap:11px;
    padding:16px;
    border-bottom:1px solid var(--lion-border);
    background:linear-gradient(180deg,color-mix(in srgb,var(--lion-surface) 90%,var(--lion-accent) 10%),var(--lion-surface));
}

.lion-alert-response-modal > header .icon {
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:15px;
    background:color-mix(in srgb,var(--lion-accent) 15%,transparent);
    color:var(--lion-accent);
    font-size:1.15rem;
}

.lion-alert-response-modal > header small { color:var(--lion-accent);font-size:.62rem; }
.lion-alert-response-modal > header h3 { margin:3px 0 0;font-size:1rem;font-weight:600; }
.lion-alert-response-modal > header button { width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--lion-border);border-radius:11px;background:transparent;color:var(--lion-text); }
.lion-alert-response-modal .body { padding:18px; }
.lion-alert-response-modal .body > p { margin:0;color:var(--lion-text-muted);font-size:.78rem;line-height:1.9;white-space:pre-wrap; }
.lion-alert-response-modal .expiry { display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;margin-top:14px;padding:11px;border:1px solid var(--lion-border);border-radius:13px;background:color-mix(in srgb,var(--lion-surface) 94%,var(--lion-warning,#f59e0b) 6%);font-size:.68rem; }
.lion-alert-response-modal .expiry i { color:var(--lion-warning,#f59e0b); }
.lion-alert-response-modal .choices { display:grid;gap:8px;margin-top:16px; }
.lion-alert-response-modal .choices button { min-height:43px;padding:0 13px;border:1px solid color-mix(in srgb,var(--lion-accent) 30%,var(--lion-border));border-radius:12px;background:color-mix(in srgb,var(--lion-surface) 94%,var(--lion-accent) 6%);color:var(--lion-text);font-size:.72rem;text-align:start; }
.lion-alert-response-modal .choices button:hover { background:var(--lion-accent);color:var(--lion-on-accent,#111);border-color:var(--lion-accent); }


/* =========================================================
   Dashboard Experience v4
   No dashboard logo + premium announcement showcase
   ========================================================= */

.lion-command-hero {
    min-height: 158px;
    isolation: isolate;
}

.lion-command-hero-copy {
    max-width: 760px;
}

.lion-command-hero-mark,
.lion-command-hero-mark img {
    display: none !important;
}

.lion-command-hero-art {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}

.lion-command-hero-line {
    position: absolute;
    display: block;
    width: 360px;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        color-mix(in srgb, var(--lion-accent) 55%, transparent),
        transparent
    );
    opacity: .55;
}

.lion-command-hero-line.line-one {
    inset-inline-end: -70px;
    top: 44px;
    transform: rotate(-42deg);
}

.lion-command-hero-line.line-two {
    inset-inline-start: -90px;
    bottom: 32px;
    transform: rotate(38deg);
}

.lion-command-hero-orb {
    position: absolute;
    inset-inline-end: 9%;
    top: 50%;
    width: 190px;
    height: 190px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: radial-gradient(
        circle,
        color-mix(in srgb, var(--lion-accent) 12%, transparent),
        transparent 68%
    );
    filter: blur(8px);
}

.lion-announcement-showcase {
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) minmax(220px, .8fr);
    gap: 12px;
    align-items: stretch;
}

.lion-announcement-showcase.single {
    grid-template-columns: 1fr;
}

.lion-announcement-showcase .lion-announcement-stage {
    min-height: 360px;
    height: 100%;
}

.lion-announcement-side-stack {
    display: grid;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 12px;
    min-height: 360px;
}

.lion-announcement-side-card {
    position: relative;
    min-height: 0;
    overflow: hidden;
    border: 1px solid color-mix(
        in srgb,
        var(--lion-border) 60%,
        var(--lion-accent) 40%
    );
    border-radius: 18px;
    background:
        linear-gradient(135deg, #071121, #111827 58%, #302a1b);
    background-size: cover;
    background-position: center;
    color: #fff;
    text-align: start;
    padding: 0;
    box-shadow:
        0 16px 34px rgba(0,0,0,.14),
        inset 0 1px 0 rgba(255,255,255,.04);
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.lion-announcement-side-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(
        in srgb,
        var(--lion-accent) 70%,
        var(--lion-border)
    );
    box-shadow:
        0 20px 42px rgba(0,0,0,.20),
        0 0 0 3px color-mix(
            in srgb,
            var(--lion-accent) 6%,
            transparent
        );
}

.lion-announcement-side-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            0deg,
            rgba(3,8,18,.95) 0%,
            rgba(3,8,18,.76) 45%,
            rgba(3,8,18,.20) 100%
        );
}

.lion-announcement-side-content {
    position: absolute;
    inset-inline: 16px;
    inset-block-end: 15px;
    z-index: 2;
    display: grid;
    gap: 6px;
}

.lion-announcement-side-badge {
    justify-self: start;
    padding: 4px 8px;
    border-radius: 8px;
    background: color-mix(
        in srgb,
        var(--lion-accent) 88%,
        #000 12%
    );
    color: var(--lion-on-accent, #111);
    font-size: .58rem;
}

.lion-announcement-side-content strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .85rem;
    font-weight: 600;
    color: #fff;
}

.lion-announcement-side-content small {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: rgba(255,255,255,.70);
    font-size: .64rem;
    line-height: 1.65;
}

.lion-announcement-side-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--lion-accent);
    font-size: .62rem;
}

.lion-announcement-empty {
    min-height: 360px !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    border: 1px dashed color-mix(
        in srgb,
        var(--lion-border) 70%,
        var(--lion-accent) 30%
    );
    border-radius: 18px;
    background:
        radial-gradient(
            circle at center,
            color-mix(in srgb, var(--lion-accent) 6%, transparent),
            transparent 55%
        );
}

.lion-announcement-empty-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: color-mix(
        in srgb,
        var(--lion-accent) 12%,
        transparent
    );
    border: 1px solid color-mix(
        in srgb,
        var(--lion-accent) 26%,
        transparent
    );
    color: var(--lion-accent);
    font-size: 1.35rem;
}

.lion-announcement-empty strong {
    color: var(--lion-text);
    font-size: .82rem;
    font-weight: 500;
}

.lion-announcement-empty > span:last-child {
    max-width: 420px;
    color: var(--lion-text-muted);
    font-size: .68rem;
    line-height: 1.7;
}

@media (max-width: 1180px) {
    .lion-announcement-showcase {
        grid-template-columns: 1fr;
    }

    .lion-announcement-side-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto;
        min-height: 180px;
    }

    .lion-announcement-side-card {
        min-height: 180px;
    }
}

@media (max-width: 767.98px) {
    .lion-command-hero {
        min-height: 134px;
    }

    .lion-command-hero-art {
        opacity: .7;
    }

    .lion-announcement-showcase .lion-announcement-stage {
        min-height: 320px;
    }

    .lion-announcement-side-stack {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .lion-announcement-side-card {
        min-height: 150px;
    }

    .lion-announcement-empty {
        min-height: 260px !important;
    }
}


/* =========================================================
   Dashboard v5
   Remove duplicate shortcuts + premium analytics refinement
   ========================================================= */

.lion-dashboard-legacy-body .lion-smart-quick-grid,
.lion-dashboard-legacy-body .lion-smart-block:has(.lion-smart-quick-grid),
.lion-dashboard-legacy-body .lion-panel-card:has(.lion-dash-quick-links),
.lion-dashboard-legacy-body .lion-panel-card:has(.lion-quick-links),
.lion-dashboard-legacy-body .lion-dashboard-shortcuts,
.lion-dashboard-legacy-body .lion-dash-quick-links,
.lion-dashboard-legacy-body .lion-quick-links {
    display: none !important;
}

.lion-dashboard-legacy-body .lion-dash-grid--activity {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.lion-dashboard-legacy-body .lion-stat-card {
    position: relative;
    min-height: 104px !important;
    padding: 15px 16px !important;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--lion-border) 62%, var(--lion-accent) 38%) !important;
    border-radius: 19px !important;
    background: linear-gradient(145deg, color-mix(in srgb, var(--lion-surface) 94%, var(--lion-primary) 6%), color-mix(in srgb, var(--lion-surface) 97%, var(--lion-accent) 3%)) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.11), inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.lion-dashboard-legacy-body .lion-stat-card::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    width: 45%;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--lion-primary), var(--lion-accent));
}

.lion-dashboard-legacy-body .lion-stat-card::after {
    content: "";
    position: absolute;
    inset-inline-start: -34px;
    bottom: -42px;
    width: 105px;
    height: 105px;
    border-radius: 50%;
    background: radial-gradient(circle, color-mix(in srgb, var(--lion-primary) 12%, transparent), transparent 68%);
    pointer-events: none;
}

.lion-dashboard-legacy-body .lion-stat-icon {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    border-radius: 15px !important;
    background: linear-gradient(145deg, color-mix(in srgb, var(--lion-primary) 17%, transparent), color-mix(in srgb, var(--lion-accent) 9%, transparent)) !important;
    border: 1px solid color-mix(in srgb, var(--lion-primary) 22%, transparent) !important;
}

.lion-dashboard-legacy-body .lion-stat-label { font-size:.74rem !important; font-weight:400 !important; }
.lion-dashboard-legacy-body .lion-stat-number,
.lion-dashboard-legacy-body .lion-stat-pair { font-size:1.28rem !important; font-weight:500 !important; }

.lion-dashboard-legacy-body .lion-dash-grid--trends {
    grid-template-columns: minmax(0, 1.55fr) minmax(330px, .82fr) !important;
    gap: 14px !important;
}

.lion-dashboard-legacy-body .lion-panel-card {
    position: relative;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--lion-border) 70%, var(--lion-accent) 30%) !important;
    border-radius: 22px !important;
    background: linear-gradient(155deg, color-mix(in srgb, var(--lion-surface) 96%, var(--lion-primary) 4%), var(--lion-surface)) !important;
    box-shadow: 0 18px 46px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.lion-dashboard-legacy-body .lion-panel-head { position:relative; z-index:1; margin-bottom:16px !important; padding-bottom:12px; border-bottom:1px solid var(--lion-border); }
.lion-dashboard-legacy-body .lion-panel-head h3 { font-size:.96rem !important; font-weight:500 !important; }
.lion-dashboard-legacy-body .lion-panel-head p { font-size:.68rem !important; line-height:1.6 !important; }

.lion-dashboard-legacy-body .lion-bar-chart {
    min-height:272px;
    padding:12px;
    border-radius:17px;
    background:linear-gradient(180deg, color-mix(in srgb, var(--lion-surface) 94%, var(--lion-primary) 6%), transparent);
}

.lion-dashboard-legacy-body .lion-bar { min-height:7px; border-radius:999px 999px 5px 5px !important; box-shadow:0 8px 16px rgba(0,0,0,.10); }
.lion-dashboard-legacy-body .lion-line-list__item,
.lion-dashboard-legacy-body .lion-mini-list__item,
.lion-dashboard-legacy-body .lion-metric-inline { border:1px solid var(--lion-border); background:color-mix(in srgb,var(--lion-surface) 95%,var(--lion-primary) 5%) !important; border-radius:15px !important; }

.lion-dashboard-legacy-body .lion-alert-card { min-height:108px !important; border-radius:18px !important; }
.lion-dashboard-legacy-body .lion-alert-title { font-weight:400 !important; }
.lion-dashboard-legacy-body .lion-alert-value { font-size:1.18rem !important; font-weight:500 !important; }

.lion-comm-announcement-upload { display:grid; grid-template-columns:minmax(180px,.72fr) minmax(0,1.28fr); gap:12px; padding:12px; border:1px solid var(--lion-border); border-radius:16px; background:color-mix(in srgb,var(--lion-surface) 96%,var(--lion-primary) 4%); }
.lion-comm-upload-preview { min-height:150px; overflow:hidden; border:1px dashed color-mix(in srgb,var(--lion-border) 62%,var(--lion-accent) 38%); border-radius:14px; }
.lion-comm-upload-preview img { width:100%; height:100%; min-height:150px; object-fit:cover; display:block; }
.lion-comm-upload-placeholder { min-height:150px; display:grid; place-items:center; align-content:center; gap:8px; color:var(--lion-text-muted); font-size:.68rem; }
.lion-comm-upload-placeholder i { color:var(--lion-accent); font-size:1.6rem; }
.lion-comm-upload-controls { display:grid; align-content:center; gap:8px; }
.lion-comm-upload-controls > span { color:var(--lion-text); font-size:.72rem; }
.lion-comm-upload-controls small { color:var(--lion-text-muted); font-size:.61rem; line-height:1.65; overflow-wrap:anywhere; }
.lion-comm-upload-button { position:relative; min-height:44px; display:inline-flex !important; align-items:center; justify-content:center; gap:8px; padding:0 14px; border:1px solid color-mix(in srgb,var(--lion-accent) 52%,var(--lion-border)); border-radius:12px; background:color-mix(in srgb,var(--lion-accent) 10%,var(--lion-surface)); color:var(--lion-accent); cursor:pointer; }
.lion-comm-upload-button input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.lion-comm-selected-file { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:8px; min-height:38px; padding:7px 9px; border-radius:11px; background:color-mix(in srgb,var(--lion-success,#22c55e) 8%,transparent); color:var(--lion-success,#22c55e); }
.lion-comm-selected-file span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lion-comm-selected-file button { width:28px; height:28px; display:grid; place-items:center; border:0; border-radius:9px; background:transparent; color:inherit; }
.lion-comm-announcement-thumb { overflow:hidden; }
.lion-comm-announcement-thumb img { width:100%; height:100%; object-fit:cover; display:block; }

@media (max-width:1250px) {
    .lion-dashboard-legacy-body .lion-dash-grid--activity { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .lion-dashboard-legacy-body .lion-dash-grid--trends { grid-template-columns:1fr !important; }
}
@media (max-width:767.98px) {
    .lion-dashboard-legacy-body .lion-dash-grid--activity { grid-template-columns:1fr !important; gap:9px !important; }
    .lion-dashboard-legacy-body .lion-stat-card { min-height:88px !important; padding:12px !important; }
    .lion-dashboard-legacy-body .lion-panel-card { padding:13px !important; border-radius:18px !important; }
    .lion-dashboard-legacy-body .lion-bar-chart { min-height:230px; height:230px; }
    .lion-comm-announcement-upload { grid-template-columns:1fr; }
}


/* =========================================================
   Communications Admin v6
   Clean upload card + centered transient toast + progress
   ========================================================= */

.lion-comm-toast-layer {
    position: fixed;
    inset: 0;
    z-index: 2200;
    pointer-events: none;
    display: grid;
    place-items: center;
    padding: 18px;
}

.lion-comm-toast {
    position: relative;
    width: min(520px, calc(100vw - 28px));
    min-height: 88px;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 32px;
    align-items: center;
    gap: 12px;
    padding: 14px 14px 16px;
    overflow: hidden;
    pointer-events: auto;
    border: 1px solid;
    border-radius: 20px;
    background:
        color-mix(in srgb, var(--lion-surface) 96%, #000 4%);
    box-shadow:
        0 24px 70px rgba(0,0,0,.30),
        0 0 0 1px rgba(255,255,255,.025) inset;
    animation: lionCommToastIn .22s ease both;
}

.lion-comm-toast.success {
    border-color:
        color-mix(in srgb, var(--lion-success,#22c55e) 42%, var(--lion-border));
}

.lion-comm-toast.error {
    border-color:
        color-mix(in srgb, var(--lion-danger,#ef4444) 44%, var(--lion-border));
}

.lion-comm-toast-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    font-size: 1.15rem;
}

.lion-comm-toast.success .lion-comm-toast-icon {
    color: var(--lion-success,#22c55e);
    background:
        color-mix(in srgb, var(--lion-success,#22c55e) 12%, transparent);
}

.lion-comm-toast.error .lion-comm-toast-icon {
    color: var(--lion-danger,#ef4444);
    background:
        color-mix(in srgb, var(--lion-danger,#ef4444) 12%, transparent);
}

.lion-comm-toast-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.lion-comm-toast-copy strong {
    color: var(--lion-text);
    font-size: .82rem;
    font-weight: 500;
}

.lion-comm-toast-copy small {
    color: var(--lion-text-muted);
    font-size: .68rem;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.lion-comm-toast > button {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 10px;
    background:
        color-mix(in srgb, var(--lion-surface-2) 88%, transparent);
    color: var(--lion-text-muted);
}

.lion-comm-toast-progress {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 3px;
    transform-origin: right center;
    animation: lionCommToastLife 4.2s linear both;
}

.lion-comm-toast.success .lion-comm-toast-progress {
    background: var(--lion-success,#22c55e);
}

.lion-comm-toast.error .lion-comm-toast-progress {
    background: var(--lion-danger,#ef4444);
    animation-duration: 6.5s;
}

@keyframes lionCommToastIn {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes lionCommToastLife {
    from { transform: scaleX(1); }
    to { transform: scaleX(0); }
}

/* Razor CSS at-rules must be escaped when this block is moved into .razor.
   This file is standalone CSS, therefore normal @keyframes is correct. */

.lion-comm-compact-fields {
    display: grid;
    grid-template-columns: minmax(150px, .8fr) minmax(120px, .55fr) minmax(190px, 1fr);
    gap: 10px;
    align-items: end;
}

.lion-comm-input-suffix {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
}

.lion-comm-input-suffix small {
    color: var(--lion-text-muted);
    font-size: .64rem;
}

.lion-comm-check-card {
    min-height: 45px;
    align-self: end;
    padding: 0 13px !important;
    border: 1px solid var(--lion-border);
    border-radius: 13px;
    background:
        color-mix(in srgb, var(--lion-surface) 96%, var(--lion-primary) 4%);
}

.lion-comm-announcement-upload {
    grid-template-columns: minmax(280px, .95fr) minmax(250px, 1.05fr) !important;
    align-items: stretch;
    gap: 14px !important;
    padding: 14px !important;
}

.lion-comm-upload-preview {
    position: relative;
    aspect-ratio: 16 / 9;
    min-height: 0 !important;
    border-radius: 17px !important;
}

.lion-comm-upload-preview img {
    min-height: 0 !important;
    aspect-ratio: 16 / 9;
}

.lion-comm-upload-preview-badge {
    position: absolute;
    inset-inline-end: 10px;
    top: 10px;
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(3,8,18,.72);
    color: rgba(255,255,255,.88);
    border: 1px solid rgba(255,255,255,.14);
    font-size: .56rem;
    backdrop-filter: blur(8px);
}

.lion-comm-upload-placeholder strong {
    color: var(--lion-text);
    font-size: .78rem;
    font-weight: 500;
}

.lion-comm-upload-placeholder span {
    color: var(--lion-text-muted);
    font-size: .61rem;
}

.lion-comm-upload-controls {
    align-content: start !important;
    grid-template-rows: auto auto auto auto;
    gap: 10px !important;
}

.lion-comm-upload-title {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.lion-comm-upload-title > div {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.lion-comm-upload-title strong {
    color: var(--lion-text);
    font-size: .79rem;
    font-weight: 500;
}

.lion-comm-upload-title span {
    color: var(--lion-text-muted);
    font-size: .61rem;
}

.lion-comm-upload-current {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 8px;
    border-radius: 999px;
    color: var(--lion-success,#22c55e) !important;
    background:
        color-mix(in srgb, var(--lion-success,#22c55e) 9%, transparent);
    font-size: .58rem !important;
}

.lion-comm-upload-path {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    border-radius: 11px;
    border: 1px solid var(--lion-border);
    background:
        color-mix(in srgb, var(--lion-surface) 96%, var(--lion-primary) 4%);
    color: var(--lion-text-muted);
    font-size: .6rem;
}

.lion-comm-upload-path span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    direction: ltr;
    text-align: left;
}

.lion-comm-upload-progress-wrap {
    display: grid;
    gap: 7px;
    padding: 10px;
    border-radius: 12px;
    background:
        color-mix(in srgb, var(--lion-primary) 7%, transparent);
    border:
        1px solid color-mix(in srgb, var(--lion-primary) 18%, var(--lion-border));
}

.lion-comm-upload-progress-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--lion-text-muted);
    font-size: .62rem;
}

.lion-comm-upload-progress-head > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.lion-comm-upload-progress-head b {
    color: var(--lion-accent);
    font-weight: 500;
}

.lion-comm-upload-progress-track {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background:
        color-mix(in srgb, var(--lion-border) 70%, transparent);
}

.lion-comm-upload-progress-track > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background:
        linear-gradient(90deg, var(--lion-primary), var(--lion-accent));
    box-shadow:
        0 0 12px color-mix(in srgb, var(--lion-accent) 35%, transparent);
    transition: width .18s ease;
}

@media (max-width: 900px) {
    .lion-comm-compact-fields {
        grid-template-columns: 1fr 1fr;
    }

    .lion-comm-check-card {
        grid-column: 1 / -1;
    }

    .lion-comm-announcement-upload {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 560px) {
    .lion-comm-compact-fields {
        grid-template-columns: 1fr;
    }

    .lion-comm-check-card {
        grid-column: auto;
    }

    .lion-comm-toast {
        grid-template-columns: 40px minmax(0, 1fr) 30px;
        min-height: 80px;
        border-radius: 17px;
    }

    .lion-comm-toast-icon {
        width: 40px;
        height: 40px;
        border-radius: 13px;
    }
}


/* =========================================================
   Communications Admin v7
   Wide clean upload layout and true progress presentation
   ========================================================= */

.lion-comm-announcement-upload {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 12px !important;
    border-radius: 18px !important;
}

.lion-comm-upload-preview {
    width: 100%;
    max-width: none;
    min-height: 220px !important;
    aspect-ratio: 16 / 9;
    border-radius: 16px !important;
    background:
        linear-gradient(
            145deg,
            color-mix(in srgb, var(--lion-surface) 92%, #000 8%),
            color-mix(in srgb, var(--lion-surface) 96%, var(--lion-primary) 4%)
        );
}

.lion-comm-upload-preview img {
    width: 100%;
    height: 100%;
    min-height: 220px !important;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.lion-comm-upload-controls {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center !important;
    gap: 9px 12px !important;
}

.lion-comm-upload-title {
    grid-column: 1 / -1;
    align-items: center;
}

.lion-comm-upload-button {
    grid-column: 2;
    grid-row: 2;
    min-width: 160px;
    min-height: 42px;
}

.lion-comm-selected-file {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
}

.lion-comm-upload-path {
    grid-column: 1 / -1;
    min-height: 38px;
}

.lion-comm-upload-progress-wrap {
    grid-column: 1 / -1;
}

.lion-comm-upload-current {
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lion-comm-editor .lion-comm-form-grid {
    align-items: start;
}

.lion-comm-compact-fields {
    grid-template-columns: minmax(140px, .75fr) minmax(110px, .5fr) minmax(170px, .85fr) !important;
}

@media (max-width: 700px) {
    .lion-comm-upload-preview,
    .lion-comm-upload-preview img {
        min-height: 180px !important;
    }

    .lion-comm-upload-controls {
        grid-template-columns: 1fr !important;
    }

    .lion-comm-upload-button,
    .lion-comm-selected-file,
    .lion-comm-upload-path,
    .lion-comm-upload-progress-wrap {
        grid-column: 1 !important;
        grid-row: auto !important;
    }

    .lion-comm-upload-button {
        width: 100%;
    }

    .lion-comm-compact-fields {
        grid-template-columns: 1fr !important;
    }
}


/* =========================================================
   Communications Admin v8
   Keep the announcement active checkbox fully visible
   ========================================================= */

.lion-comm-compact-fields {
    grid-template-columns:
        minmax(150px, 1fr)
        minmax(120px, .72fr) !important;
    align-items: stretch !important;
}

.lion-comm-check-card {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 0 14px !important;
    overflow: hidden !important;
}

.lion-comm-check-card input[type="checkbox"] {
    flex: 0 0 auto !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    accent-color: var(--lion-primary) !important;
}

.lion-comm-check-card span {
    min-width: 0 !important;
    color: var(--lion-text) !important;
    font-size: .72rem !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

@media (max-width: 700px) {
    .lion-comm-compact-fields {
        grid-template-columns: 1fr !important;
    }

    .lion-comm-check-card {
        grid-column: 1 !important;
    }
}


/* =========================================================
   Dashboard stable restore 211
   يعتمد التصميم الأصلي: هدر + إعلانات + تنبيهات + اختصارات + شروحات
   بدون قواعد السلايدر التخريبية القديمة
   ========================================================= */

.lion-command-dashboard {
    display: block !important;
    width: 100% !important;
}

.lion-command-hero {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.lion-command-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.7fr) minmax(310px, .75fr) !important;
    gap: 14px !important;
    align-items: stretch !important;
}

.lion-announcements-panel,
.lion-dashboard-inbox {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-height: 0 !important;
}

.lion-dashboard-inbox {
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
    overflow: hidden !important;
}

.lion-announcement-showcase {
    display: grid !important;
    grid-template-columns: minmax(0, 1.35fr) minmax(220px, .65fr) !important;
    gap: 12px !important;
    align-items: stretch !important;
}

.lion-announcement-showcase.single {
    grid-template-columns: 1fr !important;
}

.lion-announcement-stage {
    position: relative !important;
    display: block !important;
    min-height: 360px !important;
    overflow: hidden !important;
    background-size: cover !important;
    background-position: center !important;
}

.lion-announcement-side-stack {
    display: grid !important;
    gap: 12px !important;
}

.lion-announcement-side-card {
    position: relative !important;
    min-height: 168px !important;
    overflow: hidden !important;
    background-size: cover !important;
    background-position: center !important;
}

.lion-command-dashboard .lion-quick-access-panel,
.lion-command-dashboard .lion-quickaccess-panel,
.lion-command-dashboard .lion-learning-center,
.lion-command-dashboard + .lion-quick-access-panel,
.lion-command-dashboard + .lion-quickaccess-panel,
.lion-command-dashboard ~ .lion-learning-center {
    visibility: visible !important;
    opacity: 1 !important;
}

@media (max-width: 1199.98px) {
    .lion-command-grid {
        grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr) !important;
    }
}

@media (max-width: 900px) {
    .lion-command-grid,
    .lion-announcement-showcase {
        grid-template-columns: 1fr !important;
    }

    .lion-announcement-stage {
        min-height: 300px !important;
    }
}


/* =========================================================
   Dashboard spacing/final restore 212
   - يفصل الهدر عن التوب بار
   - يفصل الإعلانات والتنبيهات عن الهدر
   - يخفي مركز الشروحات فقط
   - يبقي اختصارات المستخدم والمجاميع/الرسوم ظاهرة
   ========================================================= */

.lion-content-v2:has(> .lion-command-dashboard) {
    padding-top: 18px !important;
}

.lion-command-dashboard {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    width: 100% !important;
    margin-top: 6px !important;
}

.lion-command-hero {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.lion-command-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1.7fr) minmax(310px, .75fr) !important;
    gap: 16px !important;
    align-items: stretch !important;
    margin-top: 0 !important;
}

.lion-announcements-panel,
.lion-dashboard-inbox {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.lion-dashboard-inbox {
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
}

/* إلغاء مركز الشروحات بالوقت الحالي فقط */
.lion-learning-center,
.lion-dashboard-tutorials,
.lion-tutorials-panel {
    display: none !important;
}

/* الحفاظ على اختصارات المستخدم وعدم إخفائها */
.lion-quick-access-panel,
.lion-quickaccess-panel,
.lion-quick-access,
.lion-quick-most-used {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* جسم الداشبورد القديم هو المسؤول عن المجاميع/الإحصائيات/الرسوم */
.lion-dashboard-legacy-body {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-top: 16px !important;
}

.lion-dashboard-legacy-body > * {
    visibility: visible !important;
    opacity: 1 !important;
}

.lion-dashboard-legacy-body .lion-dashboard {
    display: grid !important;
    gap: 14px !important;
}

/* نواصل إخفاء الهدر القديم المكرر فقط، وليس الكروت والإحصائيات */
.lion-dashboard-legacy-body .lion-dash-hero,
.lion-dashboard-legacy-body .lion-dash-hero__actions,
.lion-dashboard-legacy-body .lion-dash-subtitle {
    display: none !important;
}

@media (max-width: 1199.98px) {
    .lion-command-grid {
        grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr) !important;
    }
}

@media (max-width: 900px) {
    .lion-content-v2:has(> .lion-command-dashboard) {
        padding-top: 12px !important;
    }

    .lion-command-dashboard {
        gap: 12px !important;
        margin-top: 4px !important;
    }

    .lion-command-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .lion-dashboard-legacy-body {
        margin-top: 12px !important;
    }
}


/* =========================================================
   Dashboard announcement images v213
   عرض صورة الإعلان بوسم img فعلي مثل صورة المستخدم، وليس اعتمادًا فقط على background-image
   ========================================================= */

.lion-announcement-stage {
    background-size: cover !important;
    background-position: center !important;
}

.lion-announcement-bg-image {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    opacity: 1 !important;
    pointer-events: none !important;
    -webkit-user-drag: none !important;
}

.lion-announcement-overlay {
    z-index: 1 !important;
}

.lion-announcement-content {
    z-index: 2 !important;
}

.lion-announcement-side-img {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    opacity: 1 !important;
    pointer-events: none !important;
    -webkit-user-drag: none !important;
}

.lion-announcement-side-overlay {
    z-index: 1 !important;
}

.lion-announcement-side-content {
    position: relative !important;
    z-index: 2 !important;
}


/* =========================================================
   Dashboard announcement image visual fix v214
   يمنع ظهور أيقونة الصورة المكسورة داخل الكرت، ويجبر الصورة أن تكون Cover بالكامل
   ========================================================= */

.lion-announcement-stage,
.lion-announcement-side-card {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

.lion-announcement-bg-image,
.lion-announcement-side-img {
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    min-width: 100% !important;
    min-height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    opacity: 1 !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
    user-select: none !important;
}

.lion-announcement-overlay,
.lion-announcement-side-overlay {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
}

.lion-announcement-content,
.lion-announcement-side-content {
    position: relative !important;
    z-index: 2 !important;
}
