@import url("https://fonts.googleapis.com/css2?family=El+Messiri:wght@400;500;600;700&display=swap");

:root {
    --ky-font-family: "El Messiri", Tahoma, Arial, sans-serif;
    --ky-primary: #176d75;
    --ky-primary-strong: #0e444b;
    --ky-primary-soft: #e8f4f5;
    --ky-accent: #3659a8;
    --ky-success: #1f7a5c;
    --ky-success-soft: #e7f7ef;
    --ky-warning: #b66a18;
    --ky-warning-soft: #fff6df;
    --ky-danger: #b9473f;
    --ky-danger-soft: #fdeceb;
    --ky-info: #2f6f9f;
    --ky-info-soft: #eaf2ff;
    --ky-sidebar: #0f1a2b;
    --ky-sidebar-deep: #0a1322;
    --ky-sidebar-raised: #16263b;
    --ky-sidebar-muted: #91a5ba;
    --ky-sidebar-active: #2f9aa3;
    --ky-sidebar-active-soft: rgba(47, 154, 163, 0.18);
    --ky-page-bg: #f5f7fb;
    --ky-header-bg: rgba(255, 255, 255, 0.96);
    --ky-input-bg: #ffffff;
    --ky-table-head-bg: #eef4f7;
    --ky-table-head-text: #536577;
    --ky-row-hover: #f8fbfc;
    --ky-color-scheme: light;
    --ky-surface: #ffffff;
    --ky-surface-muted: #f7f9fc;
    --ky-border: #dce6ee;
    --ky-text: #182638;
    --ky-muted: #6f7f90;
    --ky-shadow: 0 14px 34px rgba(24, 38, 56, 0.075);
    --ky-radius: 8px;
}

body,
.navigation,
.header-navbar,
.main-menu,
.dropdown-menu {
    font-family: var(--ky-font-family) !important;
}

html[lang="ar"],
body.ky-dashboard-shell,
body.ky-dashboard-shell :not(.fa):not(.fas):not(.far):not(.fal):not(.fad):not(.fab),
.select2-container,
.select2-dropdown,
.flatpickr-calendar,
.toast,
.tooltip,
.popover {
    font-family: var(--ky-font-family) !important;
    letter-spacing: 0 !important;
}

body.ky-dashboard-shell .fa,
body.ky-dashboard-shell .fas,
body.ky-dashboard-shell .far,
body.ky-dashboard-shell .fal,
body.ky-dashboard-shell .fad,
body.ky-dashboard-shell .fab {
    font-family: "Font Awesome 5 Free" !important;
}

body.ky-dashboard-shell .fab {
    font-family: "Font Awesome 5 Brands" !important;
}

body.ky-dashboard-shell .fa,
body.ky-dashboard-shell .fas {
    font-weight: 900 !important;
}

body.ky-dashboard-shell .far,
body.ky-dashboard-shell .fal,
body.ky-dashboard-shell .fad,
body.ky-dashboard-shell .fab {
    font-weight: 400 !important;
}

body.vertical-layout,
.dark-layout body,
body.dark-layout {
    background: var(--ky-page-bg) !important;
    color: var(--ky-text);
}

.dark-layout {
    --ky-primary: #2f9aa3;
    --ky-primary-strong: #91dbe0;
    --ky-primary-soft: rgba(47, 154, 163, 0.16);
    --ky-success: #6ed3a7;
    --ky-success-soft: rgba(31, 122, 92, 0.18);
    --ky-warning: #f4bd5c;
    --ky-warning-soft: rgba(182, 106, 24, 0.18);
    --ky-danger: #ff8a82;
    --ky-danger-soft: rgba(185, 71, 63, 0.18);
    --ky-info: #89bdf6;
    --ky-info-soft: rgba(47, 111, 159, 0.18);
    --ky-page-bg: #0b1422;
    --ky-header-bg: rgba(17, 29, 45, 0.94);
    --ky-input-bg: #101d2e;
    --ky-table-head-bg: #122438;
    --ky-table-head-text: #b6c6d7;
    --ky-row-hover: #15263a;
    --ky-surface: #111d2d;
    --ky-surface-muted: #16263a;
    --ky-border: #2b4058;
    --ky-text: #e8f0f7;
    --ky-muted: #9fb1c4;
    --ky-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
    --ky-color-scheme: dark;
}

.ky-dashboard-shell {
    min-height: 100vh;
    color-scheme: var(--ky-color-scheme);
}

.ky-dashboard-shell .app-content.content {
    background: transparent;
    min-height: calc(100vh - 4rem);
}

.ky-dashboard-shell .content-wrapper {
    padding-bottom: 2rem !important;
}

.ky-dashboard-shell .content-wrapper > .row,
.ky-dashboard-shell .app-content.content > .row,
.dark-layout .ky-dashboard-shell .content-wrapper > .row {
    row-gap: 1rem;
}

.ky-dashboard-shell #table-head,
.ky-dashboard-shell .ky-legacy-table-section,
.dark-layout .ky-dashboard-shell #table-head {
    margin-top: 1rem;
}

.ky-dashboard-shell #table-head .card,
.ky-dashboard-shell .ky-legacy-table-card,
.dark-layout .ky-dashboard-shell #table-head .card {
    overflow: visible;
}

.ky-dashboard-shell .app-content.content > .row,
.dark-layout .ky-dashboard-shell .app-content.content > .row {
    margin-right: 0;
    margin-left: 0;
}

.ky-dashboard-shell .content-wrapper > .d-flex.justify-content-center,
.dark-layout .ky-dashboard-shell .content-wrapper > .d-flex.justify-content-center {
    margin-top: 1rem;
}

.ky-dashboard-shell .align-ietms-center {
    align-items: center !important;
}

.ky-dashboard-shell .footer,
.dark-layout .ky-dashboard-shell .footer {
    color: var(--ky-muted) !important;
    background: transparent !important;
    border-top: 1px solid var(--ky-border);
    font-size: 0.9rem;
}

.ky-footer-powered {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-inline-start: 0.75rem;
    color: var(--ky-muted);
}

.ky-footer-powered a {
    color: var(--ky-primary-strong);
    font-weight: 700;
}

.ky-header.header-navbar,
.dark-layout .ky-header.header-navbar {
    min-height: 64px;
    color: var(--ky-text) !important;
    background: var(--ky-header-bg) !important;
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow) !important;
    backdrop-filter: blur(12px);
}

.ky-header .navbar-container,
.dark-layout .ky-header .navbar-container {
    background: transparent !important;
}

.ky-header .navbar-container .nav .nav-item .nav-link,
.dark-layout .ky-header .navbar-container .nav .nav-item .nav-link {
    color: var(--ky-muted) !important;
}

.ky-header .navbar-container .nav .nav-item .nav-link i,
.ky-header .navbar-container .nav .nav-item .nav-link svg,
.dark-layout .ky-header .navbar-container .nav .nav-item .nav-link i,
.dark-layout .ky-header .navbar-container .nav .nav-item .nav-link svg {
    color: var(--ky-primary-strong) !important;
}

.ky-header .nav-link-style,
.dark-layout .ky-header .nav-link-style {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--ky-primary-strong) !important;
    background: var(--ky-primary-soft);
    border: 1px solid rgba(23, 109, 117, 0.2);
    border-radius: var(--ky-radius);
}

.ky-header__inner {
    gap: 1rem;
}

.ky-user-pill {
    display: flex;
    align-items: center;
    min-height: 38px;
    padding: 0 0.75rem;
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    color: var(--ky-text);
    background: var(--ky-surface-muted);
}

.ky-dashboard-shell .dropdown-menu,
.dark-layout .ky-dashboard-shell .dropdown-menu {
    min-width: 200px;
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
    border-color: var(--ky-border) !important;
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow) !important;
}

.ky-dashboard-shell .dropdown-item,
.dark-layout .ky-dashboard-shell .dropdown-item {
    color: var(--ky-text) !important;
}

.ky-dashboard-shell .dropdown-item:hover,
.dark-layout .ky-dashboard-shell .dropdown-item:hover {
    color: var(--ky-primary-strong) !important;
    background: var(--ky-primary-soft) !important;
}

.ky-notification-item {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--ky-border);
    color: var(--ky-text);
}

.ky-notification-item a {
    color: var(--ky-text);
    line-height: 1.7;
}

.ky-empty-notification {
    padding: 1rem;
    color: var(--ky-muted);
    text-align: center;
}

.fixed-back-button {
    position: fixed;
    top: 100px;
    left: 20px;
    z-index: 1000;
    background: var(--ky-surface);
    border-radius: 50%;
    box-shadow: var(--ky-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.fixed-back-button .nav-link {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ky-primary);
    color: #fff;
}

.fixed-back-button:hover {
    transform: translateY(-1px);
}

.ky-sidebar.main-menu,
.dark-layout .ky-sidebar.main-menu {
    right: 0 !important;
    left: auto !important;
    background:
        linear-gradient(180deg, rgba(47, 154, 163, 0.08), rgba(47, 154, 163, 0) 32%),
        linear-gradient(180deg, var(--ky-sidebar), var(--ky-sidebar-deep)) !important;
    border-inline-end: 1px solid rgba(145, 165, 186, 0.12);
    box-shadow:
        -18px 0 42px rgba(24, 38, 56, 0.12),
        inset 1px 0 0 rgba(255, 255, 255, 0.04) !important;
}

.vertical-layout.vertical-menu-modern .ky-sidebar.main-menu,
.vertical-layout.vertical-menu-modern.menu-expanded .ky-sidebar.main-menu,
.vertical-layout.vertical-menu-modern.menu-collapsed .ky-sidebar.main-menu {
    right: 0 !important;
    left: auto !important;
    transform: translate3d(0, 0, 0) !important;
}

.vertical-overlay-menu .ky-sidebar.main-menu,
.vertical-overlay-menu.menu-hide .ky-sidebar.main-menu {
    right: -260px !important;
    left: auto !important;
    opacity: 0;
    transform: translate3d(0, 0, 0) !important;
    transition: right 0.25s ease, opacity 0.25s ease, width 0.25s ease !important;
}

.vertical-overlay-menu.menu-open .ky-sidebar.main-menu {
    right: 0 !important;
    left: auto !important;
    opacity: 1;
    transform: translate3d(0, 0, 0) !important;
}

.ky-sidebar .navbar-header,
.dark-layout .ky-sidebar .navbar-header {
    height: 6.9rem !important;
    padding: 0.9rem 0.8rem 0.55rem;
    background: transparent !important;
    border-bottom: 1px solid rgba(145, 165, 186, 0.12);
}

.ky-sidebar.main-menu .shadow-bottom,
.bordered-layout .ky-sidebar.main-menu .shadow-bottom,
.dark-layout .ky-sidebar.main-menu .shadow-bottom,
.semi-dark-layout .ky-sidebar.main-menu .shadow-bottom {
    top: 6.9rem;
    height: 34px;
    margin-top: 0;
    filter: none;
    background:
        linear-gradient(180deg, rgba(10, 19, 34, 0.96) 0%, rgba(10, 19, 34, 0.62) 58%, rgba(10, 19, 34, 0) 100%) !important;
}

.ky-sidebar .navbar-header .navbar-nav,
.dark-layout .ky-sidebar .navbar-header .navbar-nav {
    align-items: center;
    gap: 0.55rem;
    width: 100%;
}

.ky-sidebar .navbar-header .navbar-nav .nav-item.me-auto,
.dark-layout .ky-sidebar .navbar-header .navbar-nav .nav-item.me-auto {
    flex: 1 1 auto;
    min-width: 0;
}

.ky-sidebar__brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    min-width: 0;
    min-height: 58px;
    padding: 0.6rem 0.65rem;
    color: #fff !important;
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid rgba(145, 165, 186, 0.14);
    border-radius: var(--ky-radius);
    box-shadow: 0 14px 28px rgba(3, 10, 20, 0.16);
    transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.ky-sidebar__brand:hover {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, 0.075);
    border-color: rgba(131, 199, 203, 0.28);
}

.ky-sidebar__brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    color: #fff;
    background: linear-gradient(135deg, var(--ky-sidebar-active), var(--ky-primary-strong));
    border-radius: 8px;
    font-size: 0.92rem;
    font-weight: 700;
    letter-spacing: 0;
    box-shadow: 0 10px 20px rgba(47, 154, 163, 0.28);
}

.ky-sidebar__brand-copy {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.ky-sidebar__brand-text {
    color: #f8fbff;
    font-size: 0.96rem;
    font-weight: 700;
    white-space: nowrap;
}

.ky-sidebar__brand-subtitle {
    color: var(--ky-sidebar-muted);
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
}

.ky-sidebar .nav-toggle .nav-link,
.dark-layout .ky-sidebar .nav-toggle .nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: #cfe6ec !important;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(145, 165, 186, 0.14);
    border-radius: var(--ky-radius);
}

.ky-sidebar .nav-toggle svg,
.dark-layout .ky-sidebar .nav-toggle svg {
    color: #83c7cb !important;
}

.ky-sidebar__logo {
    max-width: 180px;
    max-height: 74px;
    object-fit: contain;
}

.ky-sidebar__content {
    height: calc(100% - 6.9rem) !important;
    padding-bottom: 80px;
    background: transparent !important;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(131, 199, 203, 0.36) transparent;
}

.ky-sidebar .main-menu-content,
.dark-layout .ky-sidebar .main-menu-content,
.bordered-layout .ky-sidebar .main-menu-content,
.semi-dark-layout .ky-sidebar .main-menu-content {
    background: transparent !important;
}

.ky-sidebar__content::-webkit-scrollbar {
    width: 6px;
}

.ky-sidebar__content::-webkit-scrollbar-thumb {
    background: rgba(131, 199, 203, 0.36);
    border-radius: 20px;
}

.ky-sidebar .main-menu-content .navigation-main,
.dark-layout .ky-sidebar .main-menu-content .navigation-main,
.ky-sidebar .navigation .menu-content,
.dark-layout .ky-sidebar .navigation .menu-content {
    background: transparent !important;
}

.ky-sidebar .navigation,
.dark-layout .ky-sidebar .navigation {
    padding: 0 0.65rem 1rem;
}

.ky-sidebar .navigation > li > a,
.ky-sidebar .navigation .menu-content > li > a,
.dark-layout .ky-sidebar .navigation > li > a,
.dark-layout .ky-sidebar .navigation .menu-content > li > a {
    position: relative;
    gap: 0.7rem;
    min-height: 46px;
    color: #dbe5ee !important;
    border: 1px solid transparent;
    border-radius: var(--ky-radius);
    margin: 0.18rem 0;
    padding: 0.68rem 0.78rem !important;
    transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}

.ky-sidebar .navigation > li > a:hover,
.ky-sidebar .navigation .menu-content > li > a:hover,
.dark-layout .ky-sidebar .navigation > li > a:hover,
.dark-layout .ky-sidebar .navigation .menu-content > li > a:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.055) !important;
    border-color: rgba(145, 165, 186, 0.14);
    transform: translateX(-2px);
}

.ky-sidebar .navigation > li > a i,
.ky-sidebar .navigation .menu-content > li > a i,
.dark-layout .ky-sidebar .navigation > li > a i,
.dark-layout .ky-sidebar .navigation .menu-content > li > a i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    min-width: 32px;
    text-align: center;
    color: #8ed4d9 !important;
    background: rgba(47, 154, 163, 0.11);
    border: 1px solid rgba(131, 199, 203, 0.13);
    border-radius: 7px;
    font-size: 0.92rem;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
}

.ky-sidebar .navigation > li > a .menu-title,
.ky-sidebar .navigation .menu-content > li > a .menu-title,
.dark-layout .ky-sidebar .navigation > li > a .menu-title,
.dark-layout .ky-sidebar .navigation .menu-content > li > a .menu-title {
    color: inherit !important;
    font-size: 0.96rem;
    font-weight: 700;
    line-height: 1.35;
}

.ky-sidebar .navigation > li.active > a,
.ky-sidebar .navigation .menu-content > li.active > a,
.ky-sidebar .navigation > li.sidebar-group-active > a,
.ky-sidebar .navigation > li.open > a,
.dark-layout .ky-sidebar .navigation > li.active > a,
.dark-layout .ky-sidebar .navigation .menu-content > li.active > a,
.dark-layout .ky-sidebar .navigation > li.sidebar-group-active > a,
.dark-layout .ky-sidebar .navigation > li.open > a {
    background:
        linear-gradient(90deg, rgba(47, 154, 163, 0.34), rgba(47, 154, 163, 0.12)) !important;
    color: #ffffff !important;
    border-color: rgba(131, 199, 203, 0.28);
    box-shadow:
        0 12px 24px rgba(3, 10, 20, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

.ky-sidebar .navigation > li.active > a::before,
.ky-sidebar .navigation .menu-content > li.active > a::before,
.ky-sidebar .navigation > li.sidebar-group-active > a::before,
.ky-sidebar .navigation > li.open > a::before,
.dark-layout .ky-sidebar .navigation > li.active > a::before,
.dark-layout .ky-sidebar .navigation .menu-content > li.active > a::before,
.dark-layout .ky-sidebar .navigation > li.sidebar-group-active > a::before,
.dark-layout .ky-sidebar .navigation > li.open > a::before {
    content: "";
    position: absolute;
    top: 10px;
    bottom: 10px;
    inset-inline-start: -0.67rem;
    width: 3px;
    background: #8ed4d9;
    border-radius: 999px;
}

.ky-sidebar .navigation > li.active > a i,
.ky-sidebar .navigation .menu-content > li.active > a i,
.ky-sidebar .navigation > li.sidebar-group-active > a i,
.ky-sidebar .navigation > li.open > a i,
.dark-layout .ky-sidebar .navigation > li.active > a i,
.dark-layout .ky-sidebar .navigation .menu-content > li.active > a i,
.dark-layout .ky-sidebar .navigation > li.sidebar-group-active > a i,
.dark-layout .ky-sidebar .navigation > li.open > a i {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 8px 16px rgba(3, 10, 20, 0.16);
}

.ky-sidebar .navigation > li.has-sub > a::after,
.dark-layout .ky-sidebar .navigation > li.has-sub > a::after {
    color: rgba(219, 229, 238, 0.68) !important;
}

.ky-sidebar .navigation .menu-content,
.dark-layout .ky-sidebar .navigation .menu-content {
    margin: 0.25rem 0.25rem 0.55rem;
    padding: 0.35rem 0.35rem 0.35rem !important;
    background: rgba(3, 10, 20, 0.16) !important;
    border: 1px solid rgba(145, 165, 186, 0.08);
    border-radius: var(--ky-radius);
}

.ky-sidebar .navigation .menu-content > li > a,
.dark-layout .ky-sidebar .navigation .menu-content > li > a {
    min-height: 40px;
    margin: 0.08rem 0;
    padding: 0.52rem 0.62rem !important;
    color: #cbd8e5 !important;
}

.ky-sidebar .navigation .menu-content > li > a i,
.dark-layout .ky-sidebar .navigation .menu-content > li > a i {
    width: 28px;
    height: 28px;
    min-width: 28px;
    font-size: 0.82rem;
    background: rgba(47, 154, 163, 0.08);
}

.ky-sidebar .navigation-header,
.dark-layout .ky-sidebar .navigation-header {
    position: relative;
    margin: 1rem 0.45rem 0.35rem;
    padding: 0 0.2rem;
    color: rgba(145, 165, 186, 0.84) !important;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0 !important;
}

.ky-sidebar .navigation-header span,
.dark-layout .ky-sidebar .navigation-header span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.ky-sidebar .navigation-header span::before,
.dark-layout .ky-sidebar .navigation-header span::before {
    content: "";
    width: 16px;
    height: 1px;
    background: rgba(131, 199, 203, 0.42);
    border-radius: 999px;
}

.ky-sidebar .badge,
.dark-layout .ky-sidebar .badge {
    border-radius: 999px;
    box-shadow: 0 8px 16px rgba(3, 10, 20, 0.18);
}

.menu-collapsed .ky-sidebar .navbar-header {
    padding-inline: 0.55rem;
}

.menu-collapsed .ky-sidebar__brand {
    justify-content: center;
    padding-inline: 0.35rem;
}

.menu-collapsed .ky-sidebar__brand-copy,
.menu-collapsed .ky-sidebar .navigation-header span,
.menu-collapsed .ky-sidebar .navigation > li > a .menu-title,
.menu-collapsed .ky-sidebar .navigation .menu-content {
    display: none !important;
}

.menu-collapsed .ky-sidebar .navigation > li > a {
    justify-content: center;
    padding-inline: 0.45rem !important;
}

.menu-collapsed .ky-sidebar .navigation > li > a i {
    margin: 0 !important;
}

.ky-dashboard-shell .content-header.ky-legacy-header,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding: 1.1rem 1.2rem;
    color: var(--ky-text);
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-legacy-page-header__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.ky-legacy-page-header__main {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    min-width: 0;
}

.ky-legacy-page-header__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    color: var(--ky-primary);
    background: var(--ky-primary-soft);
    border-radius: var(--ky-radius);
}

.ky-legacy-page-header__text {
    min-width: 0;
}

.ky-legacy-page-header__eyebrow {
    margin-bottom: 0.2rem;
    color: var(--ky-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.ky-legacy-page-header__title {
    margin: 0;
    color: var(--ky-text);
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.45;
}

.ky-legacy-page-header__subtitle {
    margin: 0.35rem 0 0;
    color: var(--ky-muted);
    line-height: 1.7;
}

.ky-legacy-page-header__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.55rem;
    min-width: 0;
}

.ky-legacy-page-header__actions:empty {
    display: none;
}

.ky-legacy-title-source,
.ky-legacy-source-section,
.ky-hidden-empty {
    display: none !important;
}

.ky-legacy-action-control,
.ky-dashboard-shell .ky-legacy-action-control.form-control,
.dark-layout .ky-dashboard-shell .ky-legacy-action-control.form-control {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: auto !important;
    min-width: 42px;
    min-height: 42px;
    margin: 0 !important;
    padding: 0.55rem 0.85rem !important;
    color: #ffffff !important;
    background: var(--ky-primary) !important;
    border: 1px solid var(--ky-primary) !important;
    border-radius: var(--ky-radius) !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.ky-legacy-action-control a,
.ky-legacy-action-control i,
.ky-dashboard-shell .ky-legacy-action-control a,
.dark-layout .ky-dashboard-shell .ky-legacy-action-control a {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #ffffff !important;
    text-decoration: none !important;
}

.ky-dashboard-shell .content-header.ky-legacy-header > .d-flex,
.ky-dashboard-shell .content-header.ky-legacy-header .breadcrumbs-top,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header > .d-flex,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .breadcrumbs-top {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

.ky-dashboard-shell .content-header.ky-legacy-header .content-header-left,
.ky-dashboard-shell .content-header.ky-legacy-header .content-header-right,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .content-header-left,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .content-header-right {
    width: 100%;
    max-width: none;
    flex: 0 0 auto;
}

.ky-dashboard-shell .content-header.ky-legacy-header h1,
.ky-dashboard-shell .content-header.ky-legacy-header h2,
.ky-dashboard-shell .content-header.ky-legacy-header h3,
.ky-dashboard-shell .content-header.ky-legacy-header .content-header-title,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header h1,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header h2,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header h3,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .content-header-title {
    float: none !important;
    margin: 0 !important;
    color: var(--ky-text) !important;
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.5;
}

.ky-dashboard-shell .content-header.ky-legacy-header .breadcrumb-wrapper,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .breadcrumb-wrapper {
    display: none;
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-actions,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-bottom: 0 !important;
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter {
    margin-top: 0.1rem;
    padding: 1rem;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: none;
}

.ky-legacy-filter__header {
    margin-bottom: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--ky-border);
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter__header h2,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter__header h2 {
    margin: 0;
    color: var(--ky-text);
    font-size: 1rem;
    font-weight: 700;
}

.ky-legacy-filter__header p {
    margin: 0.25rem 0 0;
    color: var(--ky-muted);
    line-height: 1.7;
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .row,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0.85rem;
    align-items: end;
    margin-right: 0;
    margin-left: 0;
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .row > [class*="col"],
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .row > [class*="col"] {
    width: 100%;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .form-control,
.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .btn,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .form-control,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .btn {
    min-height: 42px;
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .ky-legacy-filter-button,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter .ky-legacy-filter-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 42px;
    margin: 0;
    color: #ffffff !important;
    background: var(--ky-primary) !important;
    border-color: var(--ky-primary) !important;
    border-radius: var(--ky-radius) !important;
}

.ky-dashboard-shell .content-header.ky-legacy-header button.form-control,
.ky-dashboard-shell .content-header.ky-legacy-header a[style*="background-color"],
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header button.form-control,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header a[style*="background-color"] {
    width: auto;
    min-width: 42px;
    padding-inline: 0.85rem;
}

.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter button.form-control,
.ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter a[style*="background-color"],
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter button.form-control,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header .ky-legacy-filter a[style*="background-color"] {
    width: 100%;
}

.ky-legacy-filter-stack {
    display: grid;
    gap: 0.85rem;
    margin: -0.25rem 0 1.25rem;
}

.ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter,
.dark-layout .ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter {
    width: 100%;
    padding: 1rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter__header h2,
.dark-layout .ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter__header h2 {
    margin: 0;
    color: var(--ky-text);
    font-size: 1rem;
    font-weight: 700;
}

.ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .row,
.dark-layout .ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.85rem;
    align-items: end;
    margin-right: 0;
    margin-left: 0;
}

.ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .row > [class*="col"],
.dark-layout .ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .row > [class*="col"] {
    width: 100%;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
}

.ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .form-control,
.ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .btn,
.dark-layout .ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .form-control,
.dark-layout .ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .btn {
    min-height: 42px;
}

.ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .ky-legacy-filter-button,
.dark-layout .ky-dashboard-shell .ky-legacy-filter-stack .ky-legacy-filter .ky-legacy-filter-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 42px;
    margin: 0;
    color: #ffffff !important;
    background: var(--ky-primary) !important;
    border-color: var(--ky-primary) !important;
    border-radius: var(--ky-radius) !important;
}

.ky-dashboard-shell .content-header.ky-legacy-header button.form-control a,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header button.form-control a {
    color: #ffffff !important;
    text-decoration: none;
}

.ky-dashboard-shell .content-header.ky-legacy-header br,
.dark-layout .ky-dashboard-shell .content-header.ky-legacy-header br {
    display: none;
}

.ky-dashboard-shell .content-header,
.dark-layout .ky-dashboard-shell .content-header {
    margin-bottom: 1rem;
    color: var(--ky-text);
}

.ky-dashboard-shell .content-header h1,
.ky-dashboard-shell .content-header h2,
.ky-dashboard-shell .content-header h3,
.ky-dashboard-shell .content-wrapper h1,
.ky-dashboard-shell .content-wrapper h2,
.ky-dashboard-shell .content-wrapper h3,
.dark-layout .ky-dashboard-shell .content-header h1,
.dark-layout .ky-dashboard-shell .content-header h2,
.dark-layout .ky-dashboard-shell .content-header h3,
.dark-layout .ky-dashboard-shell .content-wrapper h1,
.dark-layout .ky-dashboard-shell .content-wrapper h2,
.dark-layout .ky-dashboard-shell .content-wrapper h3 {
    color: var(--ky-text) !important;
    letter-spacing: 0;
}

.ky-dashboard-shell .content-header h2,
.dark-layout .ky-dashboard-shell .content-header h2 {
    margin: 0 0 1rem;
    font-size: 1.35rem;
    font-weight: 700;
}

.ky-dashboard-shell .content-header .row,
.dark-layout .ky-dashboard-shell .content-header .row {
    row-gap: 0.75rem;
}

.ky-dashboard-shell .content-header form,
.dark-layout .ky-dashboard-shell .content-header form {
    width: 100%;
}

.ky-dashboard-shell .content-header-right,
.dark-layout .ky-dashboard-shell .content-header-right {
    margin-bottom: 1rem !important;
}

.ky-dashboard-shell .content-header-right form,
.ky-dashboard-shell .content-header > form,
.dark-layout .ky-dashboard-shell .content-header-right form,
.dark-layout .ky-dashboard-shell .content-header > form {
    padding: 1rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding: 1.1rem 1.2rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-page-header__main {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    min-width: 0;
}

.ky-page-header__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: var(--ky-primary);
    background: var(--ky-primary-soft);
    border-radius: var(--ky-radius);
}

.ky-page-header__eyebrow {
    margin-bottom: 0.2rem;
    color: var(--ky-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.ky-page-header__title {
    margin: 0;
    color: var(--ky-text);
    font-size: 1.35rem;
    font-weight: 700;
}

.ky-page-header__subtitle {
    margin: 0.35rem 0 0;
    color: var(--ky-muted);
    line-height: 1.7;
}

.ky-page-header__actions,
.ky-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.ky-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.ky-stat-card {
    padding: 0.9rem 1rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-stat-card__label {
    display: block;
    color: var(--ky-muted);
    font-size: 0.85rem;
    font-weight: 600;
}

.ky-stat-card__value {
    display: block;
    margin-top: 0.35rem;
    color: var(--ky-text);
    font-size: 1.25rem;
    font-weight: 700;
}

.ky-overview-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.ky-overview-card,
.ky-dashboard-panel {
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-overview-card {
    min-height: 128px;
    padding: 1.1rem;
}

.ky-overview-card--primary {
    color: #ffffff;
    background: linear-gradient(135deg, var(--ky-primary-strong), var(--ky-primary));
    border-color: transparent;
}

.ky-overview-card__label,
.ky-overview-card__meta {
    display: block;
    color: var(--ky-muted);
    font-weight: 700;
}

.ky-overview-card--primary .ky-overview-card__label,
.ky-overview-card--primary .ky-overview-card__meta {
    color: rgba(255, 255, 255, 0.82);
}

.ky-overview-card__value {
    display: block;
    margin: 0.45rem 0 0.35rem;
    color: var(--ky-text);
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.15;
}

.ky-overview-card--primary .ky-overview-card__value {
    color: #ffffff;
}

.ky-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.ky-dashboard-grid--wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ky-dashboard-panel {
    min-width: 0;
    overflow: hidden;
}

.ky-dashboard-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 58px;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--ky-border);
}

.ky-dashboard-panel__header h2 {
    margin: 0;
    color: var(--ky-text);
    font-size: 1rem;
    font-weight: 700;
}

.ky-dashboard-panel__header a {
    color: var(--ky-primary-strong);
    font-weight: 700;
}

.ky-breakdown-list {
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
}

.ky-breakdown-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 46px;
    padding: 0.65rem 0.75rem;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: 6px;
}

.ky-breakdown-item span {
    color: var(--ky-muted);
    font-weight: 700;
}

.ky-breakdown-item strong {
    color: var(--ky-text);
    font-size: 1.05rem;
}

.ky-dashboard-table {
    margin-bottom: 0;
}

.ky-filter-panel,
.ky-table-card {
    margin-bottom: 1.25rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-filter-panel {
    padding: 1rem;
}

.ky-filter-panel__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid var(--ky-border);
}

.ky-filter-panel__header h2 {
    margin: 0;
    color: var(--ky-text);
    font-size: 1rem;
    font-weight: 700;
}

.ky-filter-panel__header p {
    margin: 0.25rem 0 0;
    color: var(--ky-muted);
    line-height: 1.7;
}

.ky-filter-panel__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0.85rem;
    align-items: end;
}

.ky-filter-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.ky-filter-field--wide,
.ky-filter-field--actions {
    grid-column: span 2;
}

.ky-filter-field .form-label {
    min-height: 22px;
    margin-bottom: 0.35rem;
}

.ky-dashboard-shell label,
.dark-layout .ky-dashboard-shell label {
    color: var(--ky-text);
    font-weight: 700;
}

.ky-dashboard-shell .form-control,
.ky-dashboard-shell .form-select,
.ky-dashboard-shell .select2-container--default .select2-selection--single,
.ky-dashboard-shell .select2-container--default .select2-selection--multiple,
.dark-layout .ky-dashboard-shell .form-control,
.dark-layout .ky-dashboard-shell .form-select,
.dark-layout .ky-dashboard-shell .select2-container--default .select2-selection--single,
.dark-layout .ky-dashboard-shell .select2-container--default .select2-selection--multiple {
    color: var(--ky-text) !important;
    background: var(--ky-input-bg) !important;
    border-color: var(--ky-border) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

.ky-dashboard-shell .form-control:focus,
.ky-dashboard-shell .form-select:focus,
.ky-dashboard-shell .select2-container--default.select2-container--focus .select2-selection--single,
.dark-layout .ky-dashboard-shell .form-control:focus,
.dark-layout .ky-dashboard-shell .form-select:focus,
.dark-layout .ky-dashboard-shell .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--ky-primary) !important;
    box-shadow: 0 0 0 3px rgba(23, 109, 117, 0.13) !important;
}

.ky-dashboard-shell .form-control::placeholder,
.dark-layout .ky-dashboard-shell .form-control::placeholder,
.ky-dashboard-shell .select2-container--default .select2-selection--single .select2-selection__placeholder,
.dark-layout .ky-dashboard-shell .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #98a6b5 !important;
}

.ky-dashboard-shell .select2-container--default .select2-selection--single .select2-selection__rendered,
.dark-layout .ky-dashboard-shell .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--ky-text) !important;
    line-height: 40px !important;
}

.ky-dashboard-shell .select2-container--default .select2-selection--single {
    min-height: 42px;
}

.ky-dashboard-shell .select2,
.ky-dashboard-shell .select2-container,
.dark-layout .ky-dashboard-shell .select2,
.dark-layout .ky-dashboard-shell .select2-container {
    width: 100% !important;
}

.ky-dashboard-shell .form-control.modal-title,
.dark-layout .ky-dashboard-shell .form-control.modal-title {
    font-size: 0.95rem;
    font-weight: 500;
}

.ky-dashboard-shell textarea.form-control,
.dark-layout .ky-dashboard-shell textarea.form-control {
    min-height: 92px;
    line-height: 1.7;
}

.ky-filter-panel .form-control,
.ky-filter-panel .form-select {
    min-height: 42px;
}

.ky-customer-stats {
    grid-template-columns: repeat(3, minmax(180px, 1fr));
}

.ky-customer-search__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 150px;
    gap: 0.85rem;
    align-items: end;
}

.ky-customer-search__field {
    min-width: 0;
}

.ky-customer-search__button {
    width: 100%;
}

.ky-dashboard-shell .modal-backdrop,
.dark-layout .ky-dashboard-shell .modal-backdrop {
    background-color: rgba(16, 30, 45, 0.55);
}

.ky-dashboard-shell .modal-dialog,
.dark-layout .ky-dashboard-shell .modal-dialog {
    margin: 1.5rem auto;
}

.ky-dashboard-shell .modal-content,
.dark-layout .ky-dashboard-shell .modal-content {
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
    border: 1px solid var(--ky-border) !important;
    border-radius: var(--ky-radius) !important;
    box-shadow: 0 24px 70px rgba(24, 38, 56, 0.18) !important;
    overflow: hidden;
}

.ky-dashboard-shell .modal-header,
.dark-layout .ky-dashboard-shell .modal-header {
    align-items: center;
    min-height: 62px;
    padding: 1rem 1.15rem;
    background: var(--ky-surface-muted) !important;
    border-bottom: 1px solid var(--ky-border) !important;
}

.ky-dashboard-shell .modal-title,
.dark-layout .ky-dashboard-shell .modal-title {
    margin: 0;
    color: var(--ky-text) !important;
    font-size: 1rem;
    font-weight: 700;
}

.ky-dashboard-shell .modal-body,
.dark-layout .ky-dashboard-shell .modal-body {
    padding: 1.1rem;
}

.ky-dashboard-shell .modal-footer,
.dark-layout .ky-dashboard-shell .modal-footer {
    gap: 0.5rem;
    padding: 0.9rem 1.1rem;
    background: var(--ky-surface) !important;
    border-top: 1px solid var(--ky-border) !important;
}

.ky-dashboard-shell .modal .close,
.ky-dashboard-shell .modal .btn-close,
.dark-layout .ky-dashboard-shell .modal .close,
.dark-layout .ky-dashboard-shell .modal .btn-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    color: var(--ky-primary-strong) !important;
    background: var(--ky-primary-soft) !important;
    border: 1px solid rgba(23, 109, 117, 0.22) !important;
    border-radius: var(--ky-radius);
    opacity: 1;
}

.ky-dashboard-shell .modal form .row,
.dark-layout .ky-dashboard-shell .modal form .row {
    row-gap: 0.85rem;
}

.ky-dashboard-shell .modal .form-control,
.ky-dashboard-shell .modal .form-select,
.dark-layout .ky-dashboard-shell .modal .form-control,
.dark-layout .ky-dashboard-shell .modal .form-select {
    min-height: 42px;
}

.ky-dashboard-shell .card,
.dark-layout .ky-dashboard-shell .card {
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
    border: 1px solid var(--ky-border) !important;
    border-radius: var(--ky-radius) !important;
    box-shadow: var(--ky-shadow) !important;
}

.ky-dashboard-shell .card-header,
.dark-layout .ky-dashboard-shell .card-header {
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
    border-bottom: 1px solid var(--ky-border) !important;
}

.ky-dashboard-shell .card-body,
.dark-layout .ky-dashboard-shell .card-body {
    color: var(--ky-text) !important;
}

.ky-dashboard-shell .ky-legacy-table-card.card,
.dark-layout .ky-dashboard-shell .ky-legacy-table-card.card {
    margin-bottom: 1.25rem;
}

.ky-dashboard-shell .ky-legacy-table-card .card-header,
.dark-layout .ky-dashboard-shell .ky-legacy-table-card .card-header {
    min-height: 58px;
    padding: 1rem 1.1rem;
}

.ky-dashboard-shell .ky-legacy-table-card .card-body,
.dark-layout .ky-dashboard-shell .ky-legacy-table-card .card-body {
    padding: 0;
}

.ky-dashboard-shell .table-responsive {
    border-radius: var(--ky-radius);
    overflow-x: auto;
    overflow-y: visible;
}

.ky-dashboard-shell .ky-table-dropdown-safe,
.dark-layout .ky-dashboard-shell .ky-table-dropdown-safe {
    position: relative;
    z-index: 20;
    width: 100%;
    max-width: 100%;
    max-height: min(58vh, 560px);
    overflow: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.ky-dashboard-shell .ky-table-dropdown-safe.is-dropdown-open,
.dark-layout .ky-dashboard-shell .ky-table-dropdown-safe.is-dropdown-open {
    min-height: min(340px, 52vh);
}

.ky-dashboard-shell .ky-table-dropdown-safe .dropdown-menu.show,
.dark-layout .ky-dashboard-shell .ky-table-dropdown-safe .dropdown-menu.show {
    z-index: 1100;
}

.ky-dashboard-shell .ky-table-dropdown-safe > .table,
.dark-layout .ky-dashboard-shell .ky-table-dropdown-safe > .table {
    min-width: 980px;
}

.ky-dashboard-shell .ky-table-dropdown-safe thead th,
.dark-layout .ky-dashboard-shell .ky-table-dropdown-safe thead th {
    position: sticky;
    top: 0;
    z-index: 3;
}

.ky-dashboard-shell .table:not(.ky-table),
.dark-layout .ky-dashboard-shell .table:not(.ky-table) {
    margin-bottom: 0;
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
}

.ky-dashboard-shell .table:not(.ky-table) thead,
.ky-dashboard-shell .table:not(.ky-table) thead.table-light,
.ky-dashboard-shell .table:not(.ky-table) thead th,
.dark-layout .ky-dashboard-shell .table:not(.ky-table) thead,
.dark-layout .ky-dashboard-shell .table:not(.ky-table) thead.table-light,
.dark-layout .ky-dashboard-shell .table:not(.ky-table) thead th {
    color: var(--ky-table-head-text) !important;
    background: var(--ky-table-head-bg) !important;
}

.ky-dashboard-shell .table:not(.ky-table) thead th,
.dark-layout .ky-dashboard-shell .table:not(.ky-table) thead th {
    font-size: 0.84rem;
    font-weight: 700;
    white-space: nowrap;
    border-bottom: 1px solid var(--ky-border) !important;
}

.ky-dashboard-shell .table:not(.ky-table) tbody tr,
.dark-layout .ky-dashboard-shell .table:not(.ky-table) tbody tr {
    background: var(--ky-surface) !important;
}

.ky-dashboard-shell .table:not(.ky-table) tbody tr:hover,
.dark-layout .ky-dashboard-shell .table:not(.ky-table) tbody tr:hover {
    background: var(--ky-row-hover) !important;
}

.ky-dashboard-shell .table:not(.ky-table) tbody td,
.dark-layout .ky-dashboard-shell .table:not(.ky-table) tbody td {
    vertical-align: middle;
    color: var(--ky-text) !important;
    border-color: var(--ky-border) !important;
}

.ky-dashboard-shell .table p,
.ky-dashboard-shell .table span:not(.ky-status-badge):not(.badge),
.dark-layout .ky-dashboard-shell .table p,
.dark-layout .ky-dashboard-shell .table span:not(.ky-status-badge):not(.badge) {
    color: inherit;
}

.ky-filter-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ky-filter-actions--split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
}

.ky-icon-button,
.ky-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: 1px solid transparent;
    border-radius: var(--ky-radius);
    font-weight: 700;
    text-decoration: none !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.ky-icon-button {
    width: 42px;
    height: 42px;
    padding: 0;
}

.ky-button {
    min-height: 42px;
    padding: 0.55rem 1rem;
    white-space: nowrap;
}

.ky-icon-button:hover,
.ky-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(23, 43, 58, 0.12);
}

.ky-dashboard-shell .btn,
.dark-layout .ky-dashboard-shell .btn {
    border-radius: 6px;
    font-weight: 700;
    letter-spacing: 0;
    box-shadow: none !important;
}

.ky-dashboard-shell .btn-primary,
.ky-dashboard-shell .btn-outline-primary:hover,
.ky-dashboard-shell button.form-control[type="submit"],
.ky-dashboard-shell button.form-control:not([type]),
.ky-dashboard-shell a[style*="background-color:#155e7d"],
.ky-dashboard-shell a[style*="background-color: #155e7d"],
.dark-layout .ky-dashboard-shell .btn-primary,
.dark-layout .ky-dashboard-shell .btn-outline-primary:hover,
.dark-layout .ky-dashboard-shell button.form-control[type="submit"],
.dark-layout .ky-dashboard-shell button.form-control:not([type]),
.dark-layout .ky-dashboard-shell a[style*="background-color:#155e7d"],
.dark-layout .ky-dashboard-shell a[style*="background-color: #155e7d"] {
    color: #ffffff !important;
    background: var(--ky-primary) !important;
    border-color: var(--ky-primary) !important;
}

.ky-dashboard-shell button.form-control[type="submit"],
.ky-dashboard-shell button.form-control:not([type]),
.dark-layout .ky-dashboard-shell button.form-control[type="submit"],
.dark-layout .ky-dashboard-shell button.form-control:not([type]) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
}

.ky-dashboard-shell .btn-primary i,
.ky-dashboard-shell .btn-success i,
.ky-dashboard-shell .btn-danger i,
.ky-dashboard-shell .btn-secondary i,
.ky-dashboard-shell button.form-control i,
.ky-dashboard-shell a[style*="background-color"] i,
.dark-layout .ky-dashboard-shell .btn-primary i,
.dark-layout .ky-dashboard-shell .btn-success i,
.dark-layout .ky-dashboard-shell .btn-danger i,
.dark-layout .ky-dashboard-shell .btn-secondary i,
.dark-layout .ky-dashboard-shell button.form-control i,
.dark-layout .ky-dashboard-shell a[style*="background-color"] i {
    color: #ffffff !important;
}

.ky-dashboard-shell .btn-outline-primary,
.dark-layout .ky-dashboard-shell .btn-outline-primary {
    color: var(--ky-primary-strong) !important;
    background: var(--ky-surface) !important;
    border-color: rgba(23, 109, 117, 0.35) !important;
}

.ky-dashboard-shell .btn-success,
.dark-layout .ky-dashboard-shell .btn-success {
    color: #ffffff !important;
    background: var(--ky-success) !important;
    border-color: var(--ky-success) !important;
}

.ky-dashboard-shell .btn-danger,
.dark-layout .ky-dashboard-shell .btn-danger {
    color: #ffffff !important;
    background: var(--ky-danger) !important;
    border-color: var(--ky-danger) !important;
}

.ky-dashboard-shell .btn-secondary,
.dark-layout .ky-dashboard-shell .btn-secondary {
    color: #ffffff !important;
    background: #586a7d !important;
    border-color: #586a7d !important;
}

.ky-dashboard-shell .btn-info,
.dark-layout .ky-dashboard-shell .btn-info {
    color: #ffffff !important;
    background: var(--ky-info) !important;
    border-color: var(--ky-info) !important;
}

.ky-dashboard-shell .btn-warning,
.dark-layout .ky-dashboard-shell .btn-warning {
    color: #2f2411 !important;
    background: #f6c34a !important;
    border-color: #f6c34a !important;
}

.ky-dashboard-shell .btn-light,
.dark-layout .ky-dashboard-shell .btn-light {
    color: var(--ky-primary-strong) !important;
    background: var(--ky-primary-soft) !important;
    border-color: rgba(23, 109, 117, 0.22) !important;
}

.ky-dashboard-shell .content-header a[style*="background-color"],
.dark-layout .ky-dashboard-shell .content-header a[style*="background-color"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    min-height: 42px;
    border-radius: 6px;
    text-decoration: none;
}

.ky-button-primary,
.ky-icon-button-primary {
    color: #fff !important;
    background: var(--ky-primary) !important;
    border-color: var(--ky-primary) !important;
}

.ky-button-secondary,
.ky-icon-button-secondary {
    color: var(--ky-primary) !important;
    background: var(--ky-primary-soft) !important;
    border-color: rgba(23, 109, 117, 0.2) !important;
}

.ky-button-success,
.ky-icon-button-success {
    color: #fff !important;
    background: var(--ky-success) !important;
    border-color: var(--ky-success) !important;
}

.ky-button-danger,
.ky-icon-button-danger {
    color: #fff !important;
    background: var(--ky-danger) !important;
    border-color: var(--ky-danger) !important;
}

.ky-row-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 0.35rem;
}

.ky-row-actions .ky-icon-button {
    width: 38px;
    height: 38px;
}

.ky-company-brand-filter__actions {
    grid-column: span 1;
}

.ky-company-brand-filter__submit {
    min-width: 130px;
}

.ky-date-shortcuts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.ky-date-shortcuts .ky-button {
    width: 100%;
}

.ky-date-shortcuts .ky-button.is-active {
    color: #fff !important;
    background: var(--ky-primary) !important;
    border-color: var(--ky-primary) !important;
}

.ky-date-shortcuts__hint {
    margin: 0.85rem 0 0;
    color: var(--ky-muted);
    line-height: 1.7;
}

.ky-table-card {
    overflow: visible;
}

.ky-table-card__inner {
    overflow-x: auto;
    overflow-y: visible;
}

.ky-table {
    margin-bottom: 0;
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
}

.ky-table thead,
.ky-table thead.table-light,
.ky-table thead th,
.dark-layout .ky-table thead,
.dark-layout .ky-table thead.table-light,
.dark-layout .ky-table thead th {
    color: var(--ky-table-head-text) !important;
    background: var(--ky-table-head-bg) !important;
}

.ky-table thead th {
    font-size: 0.84rem;
    font-weight: 700;
    white-space: nowrap;
    border-bottom: 1px solid var(--ky-border);
}

.ky-table tbody tr,
.dark-layout .ky-table tbody tr {
    background: var(--ky-surface) !important;
}

.ky-table tbody tr:hover,
.dark-layout .ky-table tbody tr:hover {
    background: var(--ky-row-hover) !important;
}

.ky-table tbody td,
.dark-layout .ky-table tbody td {
    vertical-align: middle;
    color: var(--ky-text) !important;
    border-color: var(--ky-border) !important;
}

.ky-table__primary {
    margin: 0;
    color: var(--ky-text) !important;
    font-weight: 700;
    line-height: 1.6;
}

.ky-table__muted {
    color: var(--ky-muted) !important;
    font-size: 0.85rem;
}

.ky-status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.4;
}

.ky-status-badge--neutral {
    color: var(--ky-muted);
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
}

.ky-status-badge--success {
    color: var(--ky-success);
    background: var(--ky-success-soft);
}

.ky-status-badge--warning {
    color: var(--ky-warning);
    background: var(--ky-warning-soft);
}

.ky-status-badge--danger {
    color: var(--ky-danger);
    background: var(--ky-danger-soft);
}

.ky-status-badge--info {
    color: var(--ky-info);
    background: var(--ky-info-soft);
}

.ky-actions-dropdown .dropdown-menu {
    min-width: 220px !important;
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow) !important;
}

.ky-dashboard-shell table .ky-table-actions-dropdown {
    position: relative;
    display: inline-flex;
    justify-content: center;
}

.ky-dashboard-shell table .ky-table-actions-dropdown .dropdown-menu {
    right: auto !important;
    left: 0 !important;
    max-width: min(260px, calc(100vw - 2rem));
    padding: 0.45rem;
    text-align: right;
    z-index: 1080;
}

.ky-dashboard-shell table .ky-table-actions-dropdown .dropdown-menu[data-popper-placement] {
    right: auto !important;
}

.ky-actions-dropdown .btn-outline-secondary,
.ky-actions-dropdown .btn-secondary,
.dark-layout .ky-actions-dropdown .btn-outline-secondary,
.dark-layout .ky-actions-dropdown .btn-secondary {
    min-width: 112px;
    color: var(--ky-primary-strong) !important;
    background: var(--ky-surface) !important;
    border-color: var(--ky-border) !important;
    border-radius: 6px;
    font-weight: 700;
}

.ky-actions-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 40px;
    padding: 0.65rem 0.75rem;
    color: var(--ky-text) !important;
    border-radius: 6px;
    font-weight: 700;
    line-height: 1.5;
    white-space: normal;
}

.ky-actions-dropdown .dropdown-item:hover {
    background: var(--ky-primary-soft) !important;
}

.ky-actions-dropdown .dropdown-item i,
.ky-actions-dropdown .dropdown-item svg {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    margin: 0 !important;
    color: var(--ky-primary-strong) !important;
    fill: currentColor;
    float: none !important;
    text-align: center;
}

.ky-actions-dropdown .dropdown-item.text-danger,
.ky-actions-dropdown .dropdown-item.text-danger i,
.ky-actions-dropdown .dropdown-item.text-danger svg {
    color: var(--ky-danger) !important;
}

.ky-dashboard-shell .modal-content,
.dark-layout .ky-dashboard-shell .modal-content,
.ky-dashboard-shell .accordion-item,
.dark-layout .ky-dashboard-shell .accordion-item {
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
    border-color: var(--ky-border) !important;
}

.ky-dashboard-shell .accordion-button,
.dark-layout .ky-dashboard-shell .accordion-button {
    color: var(--ky-text) !important;
    background: var(--ky-surface-muted) !important;
}

.ky-dashboard-shell .page-link,
.dark-layout .ky-dashboard-shell .page-link {
    color: var(--ky-primary-strong) !important;
    background: var(--ky-surface) !important;
    border-color: var(--ky-border) !important;
}

.ky-dashboard-shell .page-item.active .page-link,
.dark-layout .ky-dashboard-shell .page-item.active .page-link {
    color: #ffffff !important;
    background: var(--ky-primary) !important;
    border-color: var(--ky-primary) !important;
}

.ky-dashboard-shell .select2-dropdown,
.dark-layout .ky-dashboard-shell .select2-dropdown {
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
    border-color: var(--ky-border) !important;
}

.ky-dashboard-shell .select2-container--default .select2-results__option--highlighted[aria-selected],
.dark-layout .ky-dashboard-shell .select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: #ffffff !important;
    background: var(--ky-primary) !important;
}

.ky-dashboard-shell .nav-tabs,
.dark-layout .ky-dashboard-shell .nav-tabs {
    border-color: var(--ky-border) !important;
}

.ky-dashboard-shell .nav-tabs .nav-link,
.dark-layout .ky-dashboard-shell .nav-tabs .nav-link {
    color: var(--ky-muted) !important;
    border-color: transparent !important;
    border-radius: 6px 6px 0 0;
    font-weight: 700;
}

.ky-dashboard-shell .nav-tabs .nav-link.active,
.dark-layout .ky-dashboard-shell .nav-tabs .nav-link.active {
    color: var(--ky-primary-strong) !important;
    background: var(--ky-primary-soft) !important;
    border-color: var(--ky-border) var(--ky-border) var(--ky-primary-soft) !important;
}

.ky-dashboard-shell .modal-header,
.ky-dashboard-shell .modal-footer,
.dark-layout .ky-dashboard-shell .modal-header,
.dark-layout .ky-dashboard-shell .modal-footer {
    border-color: var(--ky-border) !important;
}

.ky-dashboard-shell .modal-title,
.dark-layout .ky-dashboard-shell .modal-title {
    color: var(--ky-text) !important;
    font-weight: 700;
}

.ky-dashboard-shell .close,
.dark-layout .ky-dashboard-shell .close {
    color: var(--ky-muted) !important;
    opacity: 1;
    text-shadow: none;
}

.ky-empty-state {
    padding: 2.5rem 1rem;
    text-align: center;
    color: var(--ky-muted);
}

.ky-pagination {
    margin-top: 1rem;
}

.ky-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.ky-detail-card {
    min-height: 96px;
    padding: 1rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-detail-card__label {
    display: block;
    margin-bottom: 0.4rem;
    color: var(--ky-muted);
    font-size: 0.8rem;
    font-weight: 500;
    line-height: 1.45;
}

.ky-detail-card__value {
    display: block;
    color: var(--ky-text);
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

.ky-detail-card--wide {
    grid-column: 1 / -1;
    min-height: auto;
}

.ky-section-card {
    margin-bottom: 1.25rem;
    padding: 1rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-section-card__title {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 1rem;
    color: var(--ky-text);
    font-size: 1.05rem;
    font-weight: 700;
}

.ky-section-card__title i {
    color: var(--ky-primary);
}

.ky-report-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding: 1rem 1.1rem;
    color: var(--ky-text);
    background: linear-gradient(135deg, var(--ky-surface), var(--ky-surface-muted));
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-report-hero h2 {
    margin: 0.15rem 0 0.25rem;
    color: var(--ky-text);
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.45;
}

.ky-report-hero p {
    margin: 0;
    color: var(--ky-muted);
    font-weight: 700;
    line-height: 1.7;
}

.ky-report-hero__eyebrow {
    display: block;
    color: var(--ky-muted);
    font-size: 0.8rem;
    font-weight: 700;
}

.ky-invoice-upload {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: end;
    margin-bottom: 1rem;
    padding: 0.9rem;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-invoice-file-preview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 0.85rem;
    padding: 0.75rem;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-report-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.ky-preliminary-choice-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.ky-preliminary-choice {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    min-height: 96px;
    padding: 0.95rem;
    color: var(--ky-muted);
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    opacity: 0.78;
}

.ky-preliminary-choice.is-selected {
    color: var(--ky-text);
    background: var(--ky-primary-soft);
    border-color: rgba(23, 109, 117, 0.24);
    opacity: 1;
}

.ky-preliminary-choice.is-warning {
    background: var(--ky-warning-soft);
    border-color: rgba(201, 132, 19, 0.24);
}

.ky-preliminary-choice__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    color: var(--ky-primary-strong);
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-preliminary-choice__icon--success {
    color: var(--ky-success);
}

.ky-preliminary-choice__icon--warning {
    color: var(--ky-warning);
}

.ky-preliminary-choice strong {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--ky-text);
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.55;
}

.ky-preliminary-choice p {
    margin: 0;
    color: var(--ky-muted);
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.7;
}

.ky-preliminary-note {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.9rem 1rem;
    color: var(--ky-muted);
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    font-weight: 700;
    line-height: 1.8;
}

.ky-preliminary-note i {
    margin-top: 0.22rem;
    color: var(--ky-primary);
}

.ky-preliminary-note--success {
    color: var(--ky-success);
    background: var(--ky-success-soft);
    border-color: rgba(24, 157, 102, 0.24);
}

.ky-preliminary-note--success i {
    color: var(--ky-success);
}

.ky-conflict-grid {
    display: grid;
    gap: 0.85rem;
}

.ky-conflict-card {
    overflow: hidden;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-conflict-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem;
    background: var(--ky-surface);
    border-bottom: 1px solid var(--ky-border);
}

.ky-conflict-card__header h3 {
    margin: 0.2rem 0 0;
    color: var(--ky-text);
    font-size: 1.02rem;
    font-weight: 800;
    line-height: 1.55;
}

.ky-conflict-card__body {
    display: grid;
    gap: 0.85rem;
    padding: 0.95rem;
}

.ky-detail-grid--compact {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    margin-bottom: 0;
}

.ky-detail-grid--compact .ky-detail-card {
    min-height: 82px;
    box-shadow: none;
}

.ky-conflict-files {
    padding: 0.9rem;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-conflict-files h4 {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.75rem;
    color: var(--ky-text);
    font-size: 0.95rem;
    font-weight: 800;
}

.ky-conflict-files h4 i {
    color: var(--ky-primary);
}

.ky-media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
    gap: 0.75rem;
}

.ky-media-item {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 104px;
    padding: 0.5rem;
    color: var(--ky-primary);
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    text-align: center;
    font-weight: 700;
}

.ky-media-item img {
    width: 100%;
    max-height: 96px;
    object-fit: contain;
    border-radius: 6px;
}

.ky-media-item--file {
    flex-direction: column;
    gap: 0.35rem;
}

.ky-media-entry {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.ky-media-entry--with-actions {
    width: 100%;
}

.ky-media-entry--with-actions .ky-media-item {
    width: 112px;
    height: 112px;
    min-height: 112px;
    flex: 0 0 112px;
}

.ky-media-entry--with-actions .ky-media-item img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: contain;
}

.ky-media-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ky-media-actions .btn {
    min-width: 72px;
}

.image-preview-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.new-image-preview {
    position: relative;
    display: inline-block;
    margin: 5px;
}

.new-image-preview img {
    max-width: 150px;
    max-height: 150px;
    padding: 2px;
    object-fit: contain;
    border: 1px solid var(--ky-border);
    border-radius: 4px;
}

.new-image-preview .btn-danger {
    position: absolute;
    top: 5px;
    inset-inline-end: 5px;
    z-index: 10;
    padding: 2px 6px;
    font-size: 12px;
}

.ky-status-workspace .container {
    max-width: none;
    padding: 0;
}

.ky-status-workspace h2 {
    margin: 0 0 1rem;
    color: var(--ky-text) !important;
    font-size: 1.15rem;
    font-weight: 700;
}

.ky-status-workspace [id] > .btn-danger {
    margin-bottom: 0.65rem;
    color: var(--ky-primary) !important;
    background: var(--ky-primary-soft) !important;
    border-color: rgba(23, 109, 117, 0.2) !important;
    border-radius: var(--ky-radius);
    font-weight: 700;
}

.ky-status-workspace .collapse {
    margin-bottom: 1rem;
    padding: 1rem;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-legacy-show .parent {
    margin: 0 0 1rem;
    padding: 1rem;
    text-align: right;
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-legacy-show .child {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    max-width: 100%;
    padding: 0.55rem 0.75rem;
    color: var(--ky-muted);
    font-weight: 500;
    vertical-align: middle;
}

.ky-legacy-show label {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin: 0;
    color: var(--ky-muted);
    font-weight: 500;
    line-height: 1.8;
}

.ky-field-label {
    color: var(--ky-muted);
    font-size: 0.86rem;
    font-weight: 500;
}

.ky-field-value {
    color: var(--ky-text);
    font-size: 0.98rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.ky-legacy-show .child > span,
.ky-legacy-show .child > a,
.ky-legacy-show label > span:not(.ky-field-label):not(.ky-field-value) {
    font-weight: 800;
}

.ky-dashboard-shell .alert,
.dark-layout .ky-dashboard-shell .alert {
    border: 0 !important;
    border-radius: var(--ky-radius) !important;
    box-shadow: none !important;
}

.ky-dashboard-shell .alert-heading,
.dark-layout .ky-dashboard-shell .alert-heading {
    margin-bottom: 0.25rem;
    color: inherit !important;
    font-size: 0.95rem;
    font-weight: 700;
}

.ky-dashboard-shell .alert-danger,
.dark-layout .ky-dashboard-shell .alert-danger {
    color: var(--ky-danger) !important;
    background: var(--ky-danger-soft) !important;
}

.ky-dashboard-shell .alert-success,
.dark-layout .ky-dashboard-shell .alert-success {
    color: var(--ky-success) !important;
    background: var(--ky-success-soft) !important;
}

.ky-dashboard-shell .sessions-section,
.ky-dashboard-shell .reminders-section,
.ky-dashboard-shell .session-section,
.ky-dashboard-shell .reminder-section,
.ky-dashboard-shell .session-tajil-section,
.dark-layout .ky-dashboard-shell .sessions-section,
.dark-layout .ky-dashboard-shell .reminders-section,
.dark-layout .ky-dashboard-shell .session-section,
.dark-layout .ky-dashboard-shell .reminder-section,
.dark-layout .ky-dashboard-shell .session-tajil-section {
    color: var(--ky-text) !important;
    background: var(--ky-surface) !important;
    border-color: var(--ky-border) !important;
    box-shadow: var(--ky-shadow) !important;
}

.ky-dashboard-shell .session-tajil-section,
.dark-layout .ky-dashboard-shell .session-tajil-section {
    background: var(--ky-surface-muted) !important;
    box-shadow: none !important;
}

.ky-dashboard-shell .session-section h4,
.ky-dashboard-shell .reminder-section h4,
.ky-dashboard-shell .session-tajil-section h4,
.dark-layout .ky-dashboard-shell .session-section h4,
.dark-layout .ky-dashboard-shell .reminder-section h4,
.dark-layout .ky-dashboard-shell .session-tajil-section h4 {
    color: var(--ky-primary-strong) !important;
    font-weight: 700;
}

.ky-dashboard-shell h1.blacked,
.ky-dashboard-shell label.blacked,
.dark-layout .ky-dashboard-shell h1.blacked,
.dark-layout .ky-dashboard-shell label.blacked {
    color: var(--ky-text) !important;
}

.ky-dashboard-shell .image-preview-container,
.dark-layout .ky-dashboard-shell .image-preview-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 0.75rem;
}

.ky-dashboard-shell .new-image-preview,
.dark-layout .ky-dashboard-shell .new-image-preview {
    padding: 0.45rem;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-dashboard-shell .new-image-preview img,
.dark-layout .ky-dashboard-shell .new-image-preview img {
    max-width: 120px;
    max-height: 120px;
    object-fit: contain;
    border-radius: 6px;
}

.ky-role-layout,
.ky-role-view-grid {
    display: grid;
    grid-template-columns: minmax(270px, 0.35fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.ky-role-summary,
.ky-permissions-panel {
    color: var(--ky-text);
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    box-shadow: var(--ky-shadow);
}

.ky-role-summary {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.ky-role-summary--view {
    position: static;
}

.ky-role-summary__head {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.ky-role-summary__icon,
.ky-role-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--ky-primary);
    background: var(--ky-primary-soft);
    border: 1px solid rgba(23, 109, 117, 0.16);
    border-radius: var(--ky-radius);
}

.ky-role-summary__icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    font-size: 1rem;
}

.ky-role-summary__eyebrow {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--ky-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.ky-role-summary h2,
.ky-permissions-toolbar h2,
.ky-permission-group__header h3 {
    margin: 0;
    color: var(--ky-text);
    font-weight: 700;
}

.ky-role-summary h2 {
    font-size: 1.12rem;
}

.ky-role-field {
    display: grid;
    gap: 0.45rem;
}

.ky-role-field .form-label {
    margin: 0;
    color: var(--ky-muted);
    font-weight: 700;
}

.ky-field-error {
    color: var(--ky-danger);
    font-size: 0.85rem;
    font-weight: 700;
}

.ky-role-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.ky-role-metrics > div {
    min-height: 74px;
    padding: 0.75rem;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-role-metrics strong {
    display: block;
    color: var(--ky-text);
    font-size: 1.3rem;
    font-weight: 800;
    line-height: 1.2;
}

.ky-role-metrics span {
    display: block;
    margin-top: 0.25rem;
    color: var(--ky-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.ky-role-summary__actions {
    display: grid;
    gap: 0.55rem;
}

.ky-permissions-panel {
    min-width: 0;
    overflow: hidden;
}

.ky-permissions-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border-bottom: 1px solid var(--ky-border);
}

.ky-permissions-toolbar h2 {
    font-size: 1.05rem;
}

.ky-permissions-toolbar p {
    margin: 0.35rem 0 0;
    color: var(--ky-muted);
    line-height: 1.7;
}

.ky-permissions-toolbar__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.ky-permissions-search {
    position: relative;
    margin: 1rem;
}

.ky-permissions-search i {
    position: absolute;
    top: 50%;
    inset-inline-start: 0.9rem;
    color: var(--ky-muted);
    transform: translateY(-50%);
    pointer-events: none;
}

.ky-permissions-search .form-control {
    min-height: 46px;
    padding-inline-start: 2.35rem;
}

.ky-permissions-groups,
.ky-role-permission-list {
    display: grid;
    gap: 0.85rem;
    padding: 0 1rem 1rem;
}

.ky-permission-group {
    overflow: hidden;
    background: var(--ky-surface-muted);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
}

.ky-permission-group[hidden] {
    display: none !important;
}

.ky-permission-group__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 0.95rem;
    background: var(--ky-surface);
    border-bottom: 1px solid var(--ky-border);
}

.ky-permission-group__header h3 {
    font-size: 0.98rem;
}

.ky-permission-group__header span {
    display: block;
    margin-top: 0.2rem;
    color: var(--ky-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.ky-permission-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 0.65rem;
    padding: 0.85rem;
}

.ky-permission-option {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    min-height: 76px;
    margin: 0;
    padding: 0.75rem;
    cursor: pointer;
    color: var(--ky-text);
    background: var(--ky-surface);
    border: 1px solid var(--ky-border);
    border-radius: var(--ky-radius);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease, background 0.15s ease;
}

.ky-permission-option:hover {
    border-color: rgba(23, 109, 117, 0.34);
    box-shadow: 0 10px 22px rgba(24, 38, 56, 0.08);
    transform: translateY(-1px);
}

.ky-permission-option.is-selected {
    background: var(--ky-primary-soft);
    border-color: rgba(23, 109, 117, 0.42);
}

.ky-permission-option[hidden] {
    display: none !important;
}

.ky-permission-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.ky-permission-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    color: transparent;
    background: var(--ky-input-bg);
    border: 1px solid var(--ky-border);
    border-radius: 50%;
    transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.ky-permission-option.is-selected .ky-permission-check {
    color: #fff;
    background: var(--ky-primary);
    border-color: var(--ky-primary);
}

.ky-permission-copy {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.ky-permission-copy span {
    color: var(--ky-text);
    font-size: 0.94rem;
    font-weight: 700;
    line-height: 1.6;
}

.ky-permission-copy small {
    color: var(--ky-muted);
    font-size: 0.76rem;
    font-weight: 600;
}

.ky-role-name-cell {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

.ky-role-avatar {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
}

.ky-role-index-actions {
    justify-content: flex-start;
}

.ky-permission-chip-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.85rem;
}

.ky-permission-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.7rem;
    color: var(--ky-primary-strong);
    background: var(--ky-primary-soft);
    border: 1px solid rgba(23, 109, 117, 0.2);
    border-radius: 999px;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.5;
}

.ky-role-stats {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.ky-pagination-wrap {
    display: flex;
    justify-content: center;
    margin-top: 1rem;
}

@media (max-width: 991.98px) {
    .ky-dashboard-grid,
    .ky-dashboard-grid--wide {
        grid-template-columns: 1fr;
    }

    .ky-page-header {
        flex-direction: column;
    }

    .ky-page-header__actions,
    .ky-actions,
    .ky-filter-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .ky-filter-field--wide,
    .ky-filter-field--actions {
        grid-column: span 1;
    }

    .ky-customer-stats {
        grid-template-columns: 1fr;
    }

    .ky-customer-search__row {
        grid-template-columns: 1fr;
    }

    .ky-role-layout,
    .ky-role-view-grid {
        grid-template-columns: 1fr;
    }

    .ky-role-summary {
        position: static;
    }

    .ky-invoice-upload {
        grid-template-columns: 1fr;
    }

    .ky-invoice-upload .ky-button {
        width: 100%;
    }

    .ky-permissions-toolbar {
        flex-direction: column;
    }

    .ky-permissions-toolbar__actions {
        justify-content: flex-start;
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    .ky-page-header,
    .ky-filter-panel {
        padding: 0.85rem;
    }

    .ky-filter-panel__grid {
        grid-template-columns: 1fr;
    }

    .ky-filter-actions--split {
        grid-template-columns: 1fr;
    }

    .ky-icon-button {
        width: 40px;
        height: 40px;
    }
}