:root {
    --app-bg: #f4f7fb;
    --app-surface: #ffffff;
    --app-surface-muted: #f8fafc;
    --app-border: #e4eaf3;
    --app-border-strong: #d4ddea;
    --app-text: #152033;
    --app-text-muted: #66758f;
    --app-primary: #2f6fed;
    --app-primary-soft: #eaf1ff;
    --app-success: #1f9d68;
    --app-success-soft: #ebfbf3;
    --app-danger: #d35f5f;
    --app-danger-soft: #fff1f1;
    --app-warning: #b7791f;
    --app-warning-soft: #fff7e8;
    --app-shadow-sm: 0 8px 24px rgba(15, 23, 42, 0.06);
    --app-shadow-md: 0 20px 45px rgba(15, 23, 42, 0.08);
    --app-radius-md: 14px;
    --app-radius-lg: 20px;
}

body {
    background: var(--app-bg);
    color: var(--app-text);
    font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.login-page,
.register-page {
    align-items: center;
    background-image: url("../img/gestao-empresarial.jpg");
    display: flex;
    flex-direction: column;
    height: 100vh;
    justify-content: center;
}

.logoimg {
    width: 100%;
}

.btn-circle {
    border-radius: 15px;
}

.container,
.container-sm,
.container-md,
.container-lg,
.container-xl {
    max-width: 1380px;
}

a {
    color: var(--app-text-muted);
    text-decoration: none;
    background-color: transparent;
}

a:hover {
    color: var(--app-text);
    text-decoration: none;
}

.wrapper.app-shell {
    min-height: 100vh;
    background: var(--app-bg);
}

.main-sidebar {
    background: #ffffff !important;
    border-right: 1px solid #e5ebf3;
    box-shadow: none !important;
    transition: width 0.2s ease, transform 0.2s ease;
    z-index: 1040;
}

.app-sidebar-shell {
    display: flex;
    flex-direction: column;
}

.app-brand-link {
    align-items: center;
    border-bottom: 1px solid #edf1f7;
    display: flex;
    gap: 0.95rem;
    height: auto;
    justify-content: flex-start;
    min-height: 4.55rem;
    padding: 1rem 1.05rem;
}

.app-brand-link:hover {
    background: #fcfdff;
}

.app-brand-mark {
    align-items: center;
    background: linear-gradient(135deg, #ff8d47, #f25f3a);
    border-radius: 12px;
    color: #fff;
    display: inline-flex;
    font-size: 1rem;
    font-weight: 700;
    height: 2.5rem;
    justify-content: center;
    width: 2.5rem;
}

.app-brand-mark--logo {
    background: #fff7f2;
    border: 1px solid #ffe6d5;
    box-shadow: none;
    overflow: hidden;
    padding: 0.3rem;
}

.app-brand-mark--logo img {
    display: block;
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.app-brand-copy {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.app-brand-copy strong {
    color: var(--app-text);
    font-size: 1rem;
    letter-spacing: -0.02em;
}

.app-brand-copy small {
    color: var(--app-text-muted);
    font-size: 0.76rem;
}

.app-sidebar {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    padding: 0.9rem 0.75rem 0.75rem;
}

.app-sidebar__scroll {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 0;
    overflow-y: auto;
    padding-right: 0.1rem;
}

.app-user-panel {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #e3ebf5;
    border-radius: 16px;
    display: flex;
    gap: 0.7rem;
    margin: 0;
    padding: 0.75rem 0.8rem;
}

.app-user-panel .image img {
    border: 2px solid rgba(47, 111, 237, 0.14);
    box-shadow: none;
    height: 2.75rem;
    object-fit: cover;
    width: 2.75rem;
}

.app-user-panel .info {
    align-items: center;
    display: flex;
    min-width: 0;
    padding: 0;
}

.app-user-panel .info a {
    color: var(--app-text);
    font-size: 0.94rem;
    font-weight: 600;
    line-height: 1.2;
}

.app-sidebar-section {
    display: flex;
    flex-direction: column;
    gap: 0.42rem;
}

.app-sidebar-section__label {
    color: #8b98ad;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 0 0.65rem;
    text-transform: uppercase;
}

.app-sidebar-section--support {
    margin-top: auto;
}

.app-sidebar-nav {
    margin: 0;
}

.sidebar .nav-header {
    color: #8c98ad;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin: 1rem 0.75rem 0.55rem;
    padding: 0;
    text-transform: uppercase;
}

.nav-sidebar > .nav-item {
    margin-bottom: 0.22rem;
}

.nav-sidebar .nav-link {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 12px;
    color: #55657f;
    display: flex;
    font-size: 0.92rem;
    font-weight: 600;
    gap: 0.75rem;
    min-height: 2.8rem;
    padding: 0.7rem 0.85rem;
}

.nav-sidebar .nav-link p {
    margin: 0;
}

.nav-sidebar .nav-link > i:first-child {
    color: #7688a2;
    font-size: 0.92rem;
    text-align: center;
    width: 1rem;
}

.nav-sidebar .nav-link .right,
.nav-sidebar .nav-link p .right {
    color: #94a0b3;
    margin-left: auto;
}

.nav-sidebar .nav-link:hover {
    background: #f6f9fd;
    border-color: #eaf0f7;
    color: var(--app-text);
}

.nav-sidebar .nav-link:hover > i:first-child {
    color: #4f6481;
}

.nav-sidebar .nav-link.active,
.nav-sidebar .menu-open > .nav-link {
    background: #edf4ff;
    border-color: #d4e1fb;
    box-shadow: none;
    color: var(--app-primary);
}

.nav-sidebar .menu-open > .nav-link {
    border: 1px solid #d7e3ff;
}

.nav-sidebar .nav-link.active > i:first-child,
.nav-sidebar .menu-open > .nav-link > i:first-child {
    color: var(--app-primary);
}

.nav-treeview {
    margin-left: 0.75rem;
    padding-left: 0.5rem;
}

.nav-treeview::before {
    background: linear-gradient(180deg, #dbe5f3 0%, rgba(219, 229, 243, 0) 100%);
    border-radius: 999px;
    content: "";
    left: 0.15rem;
    position: absolute;
    top: 0.2rem;
    bottom: 0.2rem;
    width: 1px;
}

.nav-sidebar .nav-treeview {
    position: relative;
}

.nav-treeview > .nav-item {
    margin-bottom: 0.14rem;
}

.nav-treeview > .nav-item > .nav-link {
    background: transparent;
    border-color: transparent;
    color: #72839b;
    font-size: 0.89rem;
    font-weight: 500;
    min-height: 2.45rem;
    padding: 0.56rem 0.78rem;
}

.nav-treeview > .nav-item > .nav-link > i:first-child {
    color: #7d90ab;
    font-size: 0.8rem;
    width: 0.9rem;
}

.nav-treeview > .nav-item > .nav-link:hover {
    background: #f7faff;
    border-color: #edf2f8;
    color: #334863;
}

.nav-treeview > .nav-item > .nav-link:hover > i:first-child {
    color: #4c6485;
}

.nav-treeview > .nav-item > .nav-link.active {
    background: #eef4ff;
    border-color: #dde8fb;
    color: #235ed6;
}

.nav-treeview > .nav-item > .nav-link.active > i:first-child {
    color: #235ed6;
}

.content-wrapper,
.main-footer,
.main-header {
    margin-left: 280px !important;
}

.app-topbar {
    align-items: center;
    background: rgba(244, 247, 251, 0.92) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(228, 234, 243, 0.86);
    box-shadow: none;
    display: flex;
    gap: 1rem;
    left: 0;
    min-height: 76px;
    padding: 0 1.5rem;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1035;
}

.wrapper > .content-wrapper {
    margin-top: 76px !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar,
body.sidebar-mini.sidebar-collapse .main-sidebar::before {
    width: 5.2rem !important;
}

body.sidebar-mini.sidebar-collapse .content-wrapper,
body.sidebar-mini.sidebar-collapse .main-footer,
body.sidebar-mini.sidebar-collapse .main-header {
    margin-left: 5.2rem !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused {
    width: 16.5rem !important;
    box-shadow: 14px 0 32px rgba(15, 23, 42, 0.08) !important;
}

body.sidebar-mini.sidebar-collapse .app-brand-link {
    justify-content: center;
    min-height: 4.55rem;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .app-brand-copy,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .app-user-panel .info,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .app-sidebar-section__label,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .sidebar .nav-header,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .nav-link p,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .nav-link .right,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .nav-link p .right,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .os-content .app-user-panel {
    display: none !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover .app-brand-copy,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .app-user-panel .info,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .app-sidebar-section__label,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar .nav-header,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link p,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link .right,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link p .right,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .app-brand-copy,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .app-user-panel .info,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .app-sidebar-section__label,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .sidebar .nav-header,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-sidebar .nav-link p,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-sidebar .nav-link .right,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-sidebar .nav-link p .right {
    display: block !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .app-sidebar {
    padding-left: 0.55rem;
    padding-right: 0.55rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover .app-sidebar,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .app-sidebar {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .app-user-panel {
    border-radius: 18px;
    justify-content: center;
    padding: 0.7rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .app-user-panel .image img {
    height: 2.45rem;
    width: 2.45rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar > .nav-item {
    margin-bottom: 0.35rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .nav-link {
    border-radius: 16px;
    justify-content: center;
    min-height: 3rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .nav-link > i:first-child {
    font-size: 1rem;
    margin: 0;
    width: auto;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-treeview {
    display: none !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .nav-link.active,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .menu-open > .nav-link {
    background: linear-gradient(180deg, #2f6fed 0%, #2562d7 100%);
    border-color: transparent;
    box-shadow: 0 14px 24px rgba(47, 111, 237, 0.22);
    color: #fff;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .nav-link.active > i:first-child,
body.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover):not(.sidebar-focused) .nav-sidebar .menu-open > .nav-link > i:first-child {
    color: #fff;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover .app-brand-link,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .app-brand-link,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .app-user-panel,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .app-user-panel,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-sidebar .nav-link {
    justify-content: flex-start;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-treeview > .nav-item > .nav-link,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-treeview > .nav-item > .nav-link {
    color: #72839b;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-treeview > .nav-item > .nav-link > i:first-child,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-treeview > .nav-item > .nav-link > i:first-child {
    color: #7d90ab;
    width: 0.9rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link > i:first-child,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-sidebar .nav-link > i:first-child {
    width: 1rem;
}

body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-treeview,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-treeview {
    display: block !important;
}

body.sidebar-mini.sidebar-collapse .app-brand-mark {
    height: 2.55rem;
    width: 2.55rem;
}

/* Custom sidebar items — collapsed (mini) mode */
body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) .app-sidebar-menu__link-main > span,
body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) details summary > span > span,
body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) details summary > i.fa-chevron-down,
body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) .app-sidebar-section__label,
body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) .app-sidebar-menu__link .badge {
    display: none !important;
}

body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) .app-sidebar-menu__link,
body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) details summary {
    justify-content: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) .app-sidebar-menu__link-main {
    gap: 0 !important;
}

body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) details summary > span {
    justify-content: center !important;
    gap: 0 !important;
}

body.app-sidebar-collapsed .main-sidebar:not(:hover):not(:focus-within) details[open] > ul {
    display: none !important;
}

/* Restore on hover */
body.app-sidebar-collapsed .main-sidebar:hover .app-sidebar-menu__link-main > span,
body.app-sidebar-collapsed .main-sidebar:hover details summary > span > span,
body.app-sidebar-collapsed .main-sidebar:hover details summary > i.fa-chevron-down,
body.app-sidebar-collapsed .main-sidebar:hover .app-sidebar-section__label,
body.app-sidebar-collapsed .main-sidebar:focus-within .app-sidebar-menu__link-main > span,
body.app-sidebar-collapsed .main-sidebar:focus-within details summary > span > span,
body.app-sidebar-collapsed .main-sidebar:focus-within details summary > i.fa-chevron-down,
body.app-sidebar-collapsed .main-sidebar:focus-within .app-sidebar-section__label {
    display: inline !important;
}

body.app-sidebar-collapsed .main-sidebar:hover .app-sidebar-menu__link,
body.app-sidebar-collapsed .main-sidebar:hover details summary,
body.app-sidebar-collapsed .main-sidebar:focus-within .app-sidebar-menu__link,
body.app-sidebar-collapsed .main-sidebar:focus-within details summary {
    justify-content: space-between !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
}

body.app-sidebar-collapsed .main-sidebar:hover .app-sidebar-menu__link-main,
body.app-sidebar-collapsed .main-sidebar:focus-within .app-sidebar-menu__link-main {
    gap: 12px !important;
}

body.app-sidebar-collapsed .main-sidebar:hover details[open] > ul,
body.app-sidebar-collapsed .main-sidebar:focus-within details[open] > ul {
    display: block !important;
}

.app-topbar__left,
.app-topbar__right {
    align-items: center;
    display: flex;
    gap: 0.4rem;
    margin: 0;
    padding: 0;
}

.app-topbar__context {
    display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: 1.15;
    min-width: 0;
}

.app-topbar__label {
    color: var(--app-text-muted);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.app-topbar__context strong {
    color: var(--app-text);
    font-size: 1.05rem;
    letter-spacing: -0.02em;
}

.app-topbar__meta {
    align-items: center;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 999px;
    color: var(--app-text-muted);
    display: inline-flex;
    font-size: 0.86rem;
    gap: 0.5rem;
    margin-left: auto;
    padding: 0.6rem 0.9rem;
}

.app-topbar .nav-link {
    color: var(--app-text-muted);
}

.app-topbar .nav-link:hover {
    color: var(--app-text);
}

.app-icon-button,
.app-topbar .nav-link[data-widget="pushmenu"] {
    align-items: center;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    display: inline-flex;
    height: 2.8rem;
    justify-content: center;
    min-width: 2.8rem;
    padding: 0.65rem;
    position: relative;
}

.app-topbar__left .nav-item,
.app-topbar__right .nav-item,
.app-topbar__action,
.app-topbar .user-menu {
    align-items: center;
    display: flex;
    margin: 0;
}

.app-topbar__right {
    margin-left: auto;
}

.app-icon-button .badge {
    border: 2px solid var(--app-bg);
    border-radius: 999px;
    font-size: 0.68rem;
    min-width: 1.25rem;
    position: absolute;
    right: -0.25rem;
    top: -0.25rem;
}

.app-user-menu-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    box-shadow: none;
    display: inline-flex;
    gap: 0.55rem;
    padding: 0.25rem 0.5rem !important;
}

.app-topbar .user-menu > .nav-link.app-user-menu-toggle {
    align-items: center;
    display: inline-flex;
    float: none;
}

.app-user-menu-toggle__avatar-wrap {
    align-items: center;
    background: #8a97a8;
    border-radius: 999px;
    display: inline-flex;
    flex: 0 0 auto;
    height: 2.2rem;
    justify-content: center;
    overflow: hidden;
    width: 2.2rem;
}

.app-user-menu-toggle .user-image {
    border: 0 !important;
    border-radius: 999px !important;
    display: block !important;
    float: none !important;
    flex: 0 0 auto;
    height: 2.2rem !important;
    margin: 0 !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    width: 2.2rem !important;
}

.app-user-menu-toggle__avatar-icon {
    color: #fff;
    font-size: 1.05rem;
}

.app-user-menu-toggle__content {
    display: flex;
    min-width: 0;
}

.app-user-menu-toggle__name {
    color: #475569;
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    max-width: 11rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-user-menu-toggle:hover {
    background: transparent;
}

.app-user-menu-item {
    min-width: 0;
}

.app-user-menu {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 16px;
    box-shadow: var(--app-shadow-md);
    margin-top: 0.75rem;
    overflow: hidden;
    padding: 0.35rem;
}

.app-user-menu .user-header {
    background: var(--app-surface-muted) !important;
    border-radius: 12px;
    color: var(--app-text);
    margin-bottom: 0.35rem;
}

.app-user-menu .user-header img {
    border-radius: 999px;
    display: block;
    float: none !important;
    height: 4rem !important;
    margin: 0 auto 0.5rem !important;
    object-fit: cover;
    object-position: center center;
    width: 4rem !important;
}

.app-user-menu .user-footer {
    background: transparent;
    border-top: 1px solid var(--app-border);
    margin-top: 0.35rem;
    padding-top: 0.85rem;
}

.app-user-menu .btn {
    border: 1px solid var(--app-border);
    border-radius: 10px;
    color: var(--app-text);
    font-size: 0.85rem;
    font-weight: 600;
}

.app-shell__content {
    background: transparent;
}

.app-shell__main {
    padding-bottom: 2rem;
    padding-top: 1.5rem;
}

.app-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1.5rem 1.5rem 1.5rem;
}

.app-page__header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.app-page__eyebrow {
    color: var(--app-primary);
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 0.55rem;
    text-transform: uppercase;
}

.app-page__title {
    color: var(--app-text);
    font-size: 2rem;
    letter-spacing: -0.03em;
    line-height: 1.05;
    margin: 0 0 0.45rem;
    text-wrap: balance;
}

.app-page__description {
    color: var(--app-text-muted);
    margin: 0;
    max-width: 68ch;
}

.app-breadcrumb {
    align-items: center;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid var(--app-border);
    border-radius: 14px;
    gap: 0.35rem;
    margin: 0;
    min-height: 3rem;
    padding: 0.7rem 0.95rem;
}

.app-breadcrumb .breadcrumb-item,
.app-breadcrumb .breadcrumb-item a {
    color: var(--app-text-muted);
    font-size: 0.92rem;
}

.app-breadcrumb .breadcrumb-item.active {
    color: var(--app-text);
}

.app-panel {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 24px;
    box-shadow: var(--app-shadow-sm);
    overflow: hidden;
}

.app-panel__head {
    align-items: center;
    border-bottom: 1px solid var(--app-border);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1.35rem 1.5rem 1.15rem;
}

.app-panel__title {
    color: var(--app-text);
    font-size: 1.2rem;
    letter-spacing: -0.02em;
    margin: 0 0 0.25rem;
}

.app-panel__description {
    color: var(--app-text-muted);
    margin: 0;
}

.app-panel--table {
    padding-bottom: 1rem;
}

.app-toolbar-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
}

.app-filter-panel {
    background: linear-gradient(180deg, #fbfdff 0%, #f6f9fd 100%);
    border-bottom: 1px solid var(--app-border);
    padding: 1rem 1.5rem 1.2rem;
}

.app-button-soft,
.app-button-primary,
.app-button-light {
    align-items: center;
    border-radius: 12px;
    display: inline-flex;
    font-weight: 600;
    gap: 0.5rem;
    justify-content: center;
    min-height: 2.75rem;
    padding: 0.7rem 1rem;
}

.app-button-soft.btn-info {
    background: #eaf6fb;
    border-color: #d1ecf7;
    color: #1b7f99;
}

.app-button-soft.btn-info:hover {
    background: #dff1f7;
    border-color: #c6e6f2;
    color: #156a81;
}

.app-button-primary {
    box-shadow: 0 14px 24px rgba(47, 111, 237, 0.14);
}

.app-button-light {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
}

.app-button-light:hover {
    background: #f8fbff;
    border-color: var(--app-border-strong);
    color: var(--app-text);
}

.app-table-wrap {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
    padding: 1.1rem 1.25rem 0;
}

.app-data-table {
    margin-bottom: 0 !important;
}

.app-data-table a {
    color: var(--app-primary);
    font-weight: 600;
}

.app-data-table--occurrence td,
.app-data-table--occurrence th {
    white-space: nowrap;
}

.app-data-table--financial-request {
    min-width: 1080px;
}

.app-data-table--financial-request .app-cell-actions {
    white-space: nowrap;
    width: 1%;
}

.app-data-table--occurrence .app-cell-title {
    color: var(--app-text);
    font-weight: 500;
    max-width: 380px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.app-data-table--occurrence .app-cell-id {
    color: #4d5e79;
    font-weight: 700;
}

.app-status-badge {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    justify-content: center;
    line-height: 1;
    padding: 0.4rem 0.75rem;
    white-space: nowrap;
}

.app-status-badge--open {
    background: #e7f7fb;
    color: #0f8aa8;
}

.app-status-badge--progress {
    background: #fff5df;
    color: #9a6a05;
}

.app-status-badge--closed {
    background: #ebfbf3;
    color: #16784f;
}

.app-status-badge--denied {
    background: #fff1f1;
    color: #cd4d4d;
}

.app-status-badge--cancelled {
    background: #f2f3f5;
    color: #6b7280;
}

.app-stats-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, 1fr);
    margin-bottom: 1.25rem;
}

.app-stat-card {
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 14px;
    box-shadow: var(--app-shadow-sm);
    padding: 1.1rem 1.25rem;
}

.app-stat-card__value {
    color: var(--app-text);
    display: block;
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1;
    margin-bottom: 0.35rem;
}

.app-stat-card__label {
    color: var(--app-text-muted);
    display: block;
    font-size: 0.82rem;
}

/* ── Financial Request detail/respond views ── */

.app-fr-meta-bar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}

.app-detail-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.app-detail-cell {
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 10rem;
    padding: 0.75rem 1rem;
}

.app-detail-cell__label {
    color: var(--app-text-muted);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.app-detail-cell__value {
    color: var(--app-text);
    font-size: 0.95rem;
    font-weight: 600;
}

.app-detail-cell__meta {
    color: var(--app-text-muted);
    font-size: 0.78rem;
}

.app-fr-body {
    margin-top: 0;
}

.app-fr-fields {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(3, 1fr);
    padding: 0.5rem 1.25rem 1.25rem;
}

.app-fr-field {
    border-bottom: 1px solid var(--app-border);
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.85rem 0.5rem;
}

.app-fr-field--full {
    grid-column: 1 / -1;
}

.app-fr-field__label {
    color: var(--app-text-muted);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.app-fr-field__value {
    color: var(--app-text);
    font-size: 0.9rem;
    font-weight: 500;
    word-break: break-word;
}

.app-fr-history {
    padding: 0 1.25rem 0.5rem;
}

.app-history-item {
    border-bottom: 1px solid var(--app-border);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 0.9rem 0;
}

.app-history-item:last-child {
    border-bottom: 0;
}

.app-history-item__left {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.app-history-item__msg {
    color: var(--app-text);
    font-size: 0.88rem;
    font-weight: 500;
    margin: 0;
}

.app-history-item__author {
    color: var(--app-text-muted);
    font-size: 0.78rem;
}

.app-history-item__date {
    color: var(--app-text-muted);
    flex-shrink: 0;
    font-size: 0.78rem;
    padding-top: 0.15rem;
    white-space: nowrap;
}

.app-history-badge {
    border-radius: 999px;
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    margin-bottom: 0.2rem;
    padding: 0.2rem 0.55rem;
    text-transform: uppercase;
}

.app-history-badge--response {
    background: #eef4ff;
    color: #2f6fed;
}

.app-history-badge--status {
    background: #f2f3f5;
    color: #6b7280;
}

.app-history-badge--receiver {
    background: #e7f7fb;
    color: #0f8aa8;
}

.app-history-badge--default {
    background: #f2f3f5;
    color: #6b7280;
}

.app-fr-participants {
    list-style: none;
    margin: 0;
    padding: 0.5rem 1.25rem 1rem;
}

.app-fr-participants li {
    border-bottom: 1px solid var(--app-border);
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.65rem 0;
}

.app-fr-participants li:last-child {
    border-bottom: 0;
}

.app-fr-participants__role {
    color: var(--app-text-muted);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.app-fr-participants__name {
    color: var(--app-text);
    font-size: 0.9rem;
    font-weight: 500;
}

.app-panel--highlight {
    border-color: #dbe6ff;
}

.app-panel--highlight .app-panel__head {
    background: #eef4ff;
    border-bottom-color: #dbe6ff;
}

.app-panel--highlight .app-panel__title {
    color: #2f6fed;
}

.app-fr-response-body {
    padding: 1rem 1.25rem;
}

.app-panel--sticky-top {
    position: sticky;
    top: 1rem;
}

.app-fr-respond-body {
    padding: 1.25rem;
}

.app-fr-respond-footer {
    border-top: 1px solid var(--app-border);
    padding: 1rem 1.25rem;
}

.app-fr-form-body {
    padding: 1.25rem;
}

.app-fr-form-footer {
    border-top: 1px solid var(--app-border);
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    padding: 1rem 1.25rem;
}

@media (max-width: 767.98px) {
    .app-fr-fields {
        grid-template-columns: repeat(2, 1fr);
    }

    .app-detail-grid {
        flex-direction: column;
    }

    .app-panel--sticky-top {
        position: static;
    }
}

/* ── end Financial Request ── */

.app-action-group {
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 0.35rem;
    justify-content: flex-end;
    white-space: nowrap;
}

.app-action-button {
    align-items: center;
    border: 1px solid var(--app-border);
    border-radius: 10px;
    color: var(--app-text-muted);
    display: inline-flex;
    flex-shrink: 0;
    height: 2rem;
    justify-content: center;
    min-width: 2rem;
    padding: 0.4rem;
}

.app-action-button:hover {
    transform: translateY(-1px);
}

.app-action-button--neutral {
    background: #fff;
    color: #4d5e79;
}

.app-action-button--neutral:hover {
    background: #f7fafe;
    border-color: #d8e2f0;
    color: var(--app-text);
}

.app-action-button--primary {
    background: #eef4ff;
    border-color: #dbe6ff;
    color: #2f6fed;
}

.app-action-button--primary:hover {
    background: #e4eeff;
    border-color: #cfe0ff;
    color: #235ed6;
}

.app-action-button--danger {
    background: #fff1f1;
    border-color: #ffd9d9;
    color: #cd4d4d;
}

.app-action-button--danger:hover {
    background: #ffe7e7;
    border-color: #ffcfcf;
    color: #b93d3d;
}

.app-action-button--info {
    background: #ecf8fb;
    border-color: #d9f0f5;
    color: #1686a2;
}

.app-action-button--info:hover {
    background: #e1f3f8;
    border-color: #caeaf1;
    color: #116f86;
}

.app-action-button--clone {
    background: #f1f0ff;
    border-color: #e0ddff;
    color: #5a56cb;
}

.app-action-button--clone:hover {
    background: #e8e6ff;
    border-color: #d3ceff;
    color: #4843b7;
}

.app-data-table tbody td {
    border-top: 1px solid #edf2f8;
    color: #22324d;
    padding: 0.95rem 0.9rem;
    vertical-align: middle;
}

.app-data-table tbody tr:hover {
    background: #f8fbff;
}

.dashboard-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding-bottom: 1rem;
}

.dashboard-hero {
    align-items: flex-start;
    background: linear-gradient(135deg, #ffffff 0%, #f7faff 100%);
    border: 1px solid var(--app-border);
    border-radius: 24px;
    box-shadow: var(--app-shadow-sm);
    display: flex;
    gap: 1.5rem;
    justify-content: space-between;
    padding: 1.75rem;
}

.dashboard-hero__eyebrow {
    color: var(--app-primary);
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
}

.dashboard-hero h1,
.dashboard-panel h2 {
    color: var(--app-text);
    letter-spacing: -0.03em;
    text-wrap: balance;
}

.dashboard-hero h1 {
    font-size: 2.35rem;
    margin: 0 0 0.55rem;
}

.dashboard-hero p,
.dashboard-panel__header p,
.dashboard-shortcut__body small,
.dashboard-metric-card__meta,
.dashboard-summary-item__label,
.dashboard-link-list a {
    color: var(--app-text-muted);
}

.dashboard-hero p {
    font-size: 1rem;
    margin: 0;
    max-width: 65ch;
}

.dashboard-hero__actions {
    display: flex;
    flex-shrink: 0;
    gap: 0.75rem;
}

.dashboard-btn-primary,
.dashboard-btn-secondary {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    font-weight: 600;
    gap: 0.55rem;
    justify-content: center;
    min-height: 3rem;
    padding: 0.8rem 1rem;
}

.dashboard-btn-primary {
    box-shadow: 0 14px 28px rgba(47, 111, 237, 0.18);
}

.dashboard-btn-secondary {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    color: var(--app-text);
}

.dashboard-metrics {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-metric-card,
.dashboard-panel {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 22px;
    box-shadow: var(--app-shadow-sm);
}

.dashboard-metric-card {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    min-height: 170px;
    overflow: hidden;
    padding: 1.4rem;
    position: relative;
}

.dashboard-metric-card::before {
    background: var(--app-primary);
    border-radius: 999px;
    content: "";
    height: 0.55rem;
    left: 1.4rem;
    position: absolute;
    top: 1.2rem;
    width: 2.5rem;
}

.dashboard-metric-card--danger::before {
    background: var(--app-danger);
}

.dashboard-metric-card--success::before {
    background: var(--app-success);
}

.dashboard-metric-card--warning::before {
    background: var(--app-warning);
}

.dashboard-metric-card__label {
    color: var(--app-text-muted);
    font-size: 0.88rem;
    font-weight: 600;
    margin-top: 1rem;
}

.dashboard-metric-card strong {
    color: var(--app-text);
    font-size: 2.25rem;
    letter-spacing: -0.04em;
    line-height: 1;
}

.dashboard-metric-card__meta {
    font-size: 0.92rem;
    line-height: 1.5;
}

.dashboard-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 0.95fr);
}

.dashboard-panel {
    padding: 1.35rem;
}

.dashboard-panel--wide {
    min-width: 0;
}

.dashboard-panel__header {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.dashboard-panel__header h2 {
    font-size: 1.2rem;
    margin: 0 0 0.3rem;
}

.dashboard-panel__header p {
    margin: 0;
}

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

.dashboard-shortcuts--sidebar {
    display: flex;
    flex-direction: column;
    grid-template-columns: unset;
}

.dashboard-shortcuts--sidebar .dashboard-shortcut {
    width: 100%;
}

.dashboard-panel__link {
    align-items: center;
    color: var(--app-primary);
    display: inline-flex;
    flex-shrink: 0;
    font-size: 0.9rem;
    font-weight: 600;
    gap: 0.4rem;
    white-space: nowrap;
}

.dashboard-panel__link:hover {
    color: #235ed6;
}

.dashboard-productivity-filter {
    display: block;
    margin-top: 0.15rem;
    width: 100%;
}

.dashboard-productivity-filter__input {
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 10px;
    color: var(--app-text);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    min-height: 2.35rem;
    padding: 0.35rem 0.55rem;
    width: 100%;
}

.dashboard-productivity-filter__input:focus {
    border-color: #93b4f5;
    box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.12);
    outline: none;
}

.dashboard-productivity-summary__item--period {
    min-width: 0;
}

.dashboard-activity {
    display: grid;
    gap: 0.75rem;
}

.dashboard-activity__item {
    align-items: center;
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 16px;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.05rem;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.dashboard-activity__item:hover {
    border-color: var(--app-border-strong);
    box-shadow: var(--app-shadow-sm);
    transform: translateY(-1px);
}

.dashboard-activity__main {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.dashboard-activity__main strong {
    color: var(--app-text);
    font-size: 0.98rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-activity__id {
    color: var(--app-primary);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.dashboard-activity__meta {
    color: var(--app-text-muted);
    font-size: 0.86rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-activity__side {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: 0.45rem;
}

.dashboard-activity__date {
    color: var(--app-text-muted);
    font-size: 0.8rem;
    white-space: nowrap;
}

.dashboard-activity__empty {
    align-items: center;
    background: var(--app-surface-muted);
    border: 1px dashed var(--app-border);
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 2.5rem 1.5rem;
    text-align: center;
}

.dashboard-activity__empty i {
    color: var(--app-text-muted);
    font-size: 2rem;
}

.dashboard-activity__empty p {
    color: var(--app-text-muted);
    margin: 0;
}

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

.dashboard-productivity-summary__item {
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.95rem 1rem;
}

.dashboard-productivity-summary__item span {
    color: var(--app-text-muted);
    font-size: 0.86rem;
    font-weight: 500;
}

.dashboard-productivity-summary__item strong {
    color: var(--app-text);
    font-size: 1.35rem;
    letter-spacing: -0.03em;
}

.dashboard-productivity-table-wrap {
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--app-border);
    border-radius: 16px;
    overflow-x: auto;
}

.dashboard-productivity-table {
    margin-bottom: 0;
    min-width: 720px;
    width: 100%;
}

.dashboard-productivity-table thead th {
    border-bottom: 1px solid var(--app-border);
    color: var(--app-text-muted);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 0.75rem 0.85rem;
    text-transform: uppercase;
    white-space: nowrap;
}

.dashboard-productivity-table tbody td {
    border-top: 1px solid #edf2f8;
    padding: 0.95rem 0.85rem;
    vertical-align: middle;
}

.dashboard-productivity-table tbody tr:hover {
    background: #f8fbff;
}

.dashboard-productivity-metric {
    color: var(--app-text);
    font-size: 1.05rem;
    font-weight: 700;
}

.dashboard-productivity-metric--muted {
    color: #4d5e79;
    font-size: 0.98rem;
}

.dashboard-productivity-score {
    align-items: center;
    display: inline-flex;
    flex-wrap: nowrap;
    gap: 0.15rem;
    white-space: nowrap;
}

.dashboard-productivity-score i {
    color: #cbd5e1;
    font-size: 0.82rem;
}

.dashboard-productivity-score i.is-active {
    color: #f59e0b;
}

.dashboard-productivity-score span {
    color: #4d5e79;
    font-size: 0.82rem;
    font-weight: 700;
    margin-left: 0.25rem;
}

.dashboard-productivity-empty-note {
    color: var(--app-text-muted);
    font-size: 0.88rem;
}

.dashboard-productivity-table thead th:last-child,
.dashboard-productivity-table tbody td:last-child {
    width: 160px;
}

.dashboard-productivity-bar-wrap {
    align-items: center;
    display: flex;
    gap: 0.65rem;
    min-width: 0;
}

.dashboard-productivity-bar {
    background: #edf2f8;
    border-radius: 999px;
    flex: 1 1 auto;
    height: 0.55rem;
    max-width: 140px;
    overflow: hidden;
}

.dashboard-productivity-bar__label {
    color: var(--app-text);
    flex: 0 0 auto;
    font-size: 0.82rem;
    font-weight: 700;
    min-width: 2.75rem;
    text-align: right;
}

.dashboard-productivity-bar span {
    background: linear-gradient(90deg, #2f6fed, #5b8dff);
    border-radius: inherit;
    display: block;
    height: 100%;
    min-width: 0.55rem;
}

.dashboard-shortcut {
    align-items: flex-start;
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 18px;
    display: flex;
    gap: 0.9rem;
    min-width: 0;
    padding: 1rem;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.dashboard-shortcut:hover {
    border-color: var(--app-border-strong);
    box-shadow: var(--app-shadow-sm);
    transform: translateY(-1px);
}

.dashboard-shortcut__icon {
    align-items: center;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 14px;
    color: var(--app-primary);
    display: inline-flex;
    flex-shrink: 0;
    height: 2.7rem;
    justify-content: center;
    width: 2.7rem;
}

.dashboard-shortcut__body {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.dashboard-shortcut__body strong {
    color: var(--app-text);
    font-size: 0.98rem;
}

.dashboard-shortcut__body small {
    font-size: 0.88rem;
    line-height: 1.45;
}

.dashboard-stack {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.dashboard-summary-list {
    display: grid;
    gap: 0.85rem;
}

.dashboard-summary-item {
    align-items: baseline;
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 16px;
    display: flex;
    justify-content: space-between;
    padding: 0.95rem 1rem;
}

.dashboard-summary-item__label {
    font-size: 0.9rem;
    font-weight: 500;
}

.dashboard-summary-item strong {
    color: var(--app-text);
    font-size: 1.2rem;
    letter-spacing: -0.03em;
}

.dashboard-link-list {
    display: grid;
    gap: 0.75rem;
}

.dashboard-link-list a {
    align-items: center;
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 14px;
    color: var(--app-text);
    display: flex;
    font-weight: 600;
    justify-content: space-between;
    padding: 0.95rem 1rem;
}

.dashboard-link-list a i {
    color: var(--app-text-muted);
    font-size: 0.8rem;
}

.content-header,
.main-footer {
    background: transparent;
    border: 0;
}

.table {
    background: var(--app-surface);
    color: var(--app-text);
}

.table thead th:last-child {
    border-top-right-radius: 12px;
}

.table thead th:first-child {
    border-top-left-radius: 12px;
}

.table thead tr {
    background: #eff3f9;
    color: var(--app-text-muted);
}

.table thead th {
    border-bottom: 1px solid var(--app-border);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.9rem 0.9rem;
    text-transform: uppercase;
}

.tablenotstyle thead tr,
.tablenotstyle thead th {
    background-color: #fff;
    border-top-style: none;
    color: rgb(88, 88, 88);
}

.card,
.small-box,
.info-box,
.callout,
.modal-content,
.dropdown-menu,
.form-control,
.custom-select,
.select2-container--default .select2-selection--single {
    border-color: var(--app-border);
    border-radius: 14px;
}

.card,
.small-box,
.info-box,
.callout,
.modal-content {
    box-shadow: var(--app-shadow-sm);
}

.card-header,
.modal-header {
    border-bottom-color: var(--app-border);
}

.form-control,
.custom-select,
.select2-container--default .select2-selection--single {
    min-height: 2.8rem;
}

.btn-primary {
    background: var(--app-primary);
    border-color: var(--app-primary);
}

.btn-primary:hover,
.btn-primary:focus {
    background: #245dd0;
    border-color: #245dd0;
}

.btn-light,
.btn-default {
    background: var(--app-surface);
    border-color: var(--app-border);
    color: var(--app-text);
}

div.dataTables_wrapper div.dataTables_length,
div.dataTables_wrapper div.dataTables_filter {
    color: var(--app-text);
    margin-bottom: 0.95rem;
}

div.dataTables_wrapper div.dataTables_length select,
div.dataTables_wrapper div.dataTables_filter input {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    color: var(--app-text);
    min-height: 2.75rem;
    padding: 0.45rem 0.85rem;
}

div.dataTables_wrapper div.dataTables_filter input {
    margin-left: 0.65rem;
    min-width: 180px;
}

.dataTables_info {
    color: var(--app-text-muted) !important;
    font-size: 0.92rem;
    padding-top: 1.15rem !important;
}

.dataTables_paginate {
    padding-top: 0.85rem !important;
}

.dataTables_paginate .paginate_button {
    border-radius: 12px !important;
    color: var(--app-text-muted) !important;
}

.dataTables_paginate .paginate_button.current,
.dataTables_paginate .paginate_button.current:hover {
    background: var(--app-primary-soft) !important;
    border: 1px solid #d5e2ff !important;
    color: var(--app-primary) !important;
}

.dataTables_paginate .paginate_button:hover {
    background: #f4f7fb !important;
    border: 1px solid var(--app-border) !important;
    color: var(--app-text) !important;
}

@media (max-width: 991.98px) {
    .content-wrapper,
    .main-footer,
    .main-header {
        margin-left: 0 !important;
    }

    .app-page {
        padding: 1.15rem 1rem 1.25rem;
    }

    .app-page__header {
        flex-direction: column;
    }

    .app-breadcrumb {
        width: 100%;
    }

    .app-shell__main {
        padding-top: 1rem;
    }

    .content .container,
    .content .container-fluid {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .app-topbar {
        align-items: center;
        flex-wrap: nowrap;
        min-height: 76px;
        padding: 0 1rem;
    }

    .wrapper > .content-wrapper {
        margin-top: 76px !important;
    }

    .app-topbar__context {
        order: unset;
        width: auto;
    }

    .app-topbar__context strong {
        font-size: 1rem;
    }

    .app-toolbar-actions {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .app-toolbar-actions > * {
        flex: 0 1 auto;
        width: auto;
    }

    .app-data-table--responsive-cards {
        min-width: 860px;
    }

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

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

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

    .dashboard-productivity-table {
        min-width: 680px;
    }

    .dashboard-panel {
        padding: 1.15rem;
    }
}

@media (max-width: 767.98px) {
    .app-topbar {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 0.75rem;
        min-height: auto;
        padding: 0.85rem 1rem;
    }

    .wrapper > .content-wrapper {
        margin-top: 8.5rem !important;
    }

    .app-topbar__left,
    .app-topbar__right {
        gap: 0.6rem;
    }

    .app-topbar__context {
        order: 3;
        width: 100%;
    }

    .app-topbar__right {
        justify-content: flex-end;
    }

    .app-user-menu-toggle {
        padding: 0.25rem !important;
    }

    .app-user-menu-toggle__content {
        display: none !important;
    }

    .app-user-menu-toggle__avatar-wrap {
        height: 2rem;
        width: 2rem;
    }

    .app-user-menu-toggle .user-image {
        height: 2rem;
        width: 2rem;
    }

    .app-icon-button,
    .app-topbar .nav-link[data-widget="pushmenu"] {
        height: 2.6rem;
        min-width: 2.6rem;
        padding: 0.55rem;
    }

    .app-topbar__meta {
        display: none !important;
    }

    .dashboard-hero,
    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .app-page__header {
        flex-direction: column;
    }

    .app-breadcrumb {
        width: 100%;
    }

    .app-toolbar-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .dashboard-hero {
        flex-direction: column;
        padding: 1.35rem;
    }

    .dashboard-hero h1 {
        font-size: 1.9rem;
    }

    .dashboard-hero__actions {
        flex-direction: column;
        width: 100%;
    }

    .dashboard-btn-primary,
    .dashboard-btn-secondary {
        width: 100%;
    }

    .dashboard-metrics,
    .dashboard-shortcuts:not(.dashboard-shortcuts--sidebar) {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 767.98px) {
    .app-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .app-sidebar {
        padding-left: 0.65rem;
        padding-right: 0.65rem;
    }

    .app-panel__head {
        align-items: flex-start;
        flex-direction: column;
    }

    .app-toolbar-actions {
        width: 100%;
    }

    .app-toolbar-actions > * {
        width: 100%;
    }

    .app-filter-panel,
    .app-table-wrap {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    div.dataTables_wrapper div.dataTables_filter,
    div.dataTables_wrapper div.dataTables_length {
        text-align: left;
    }

    div.dataTables_wrapper div.dataTables_filter input {
        margin-left: 0;
        margin-top: 0.5rem;
        min-width: 0;
        width: 100%;
    }

    .app-action-group {
        justify-content: flex-start;
    }

    .dashboard-page {
        gap: 1rem;
    }

    .dashboard-metrics,
    .dashboard-shortcuts:not(.dashboard-shortcuts--sidebar) {
        grid-template-columns: 1fr;
    }

    .dashboard-panel,
    .dashboard-metric-card,
    .dashboard-hero {
        border-radius: 18px;
    }

    .dashboard-metric-card {
        min-height: 0;
    }

    .dashboard-summary-item {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.3rem;
    }

    .dashboard-activity__item {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-activity__side {
        align-items: flex-start;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .dashboard-productivity-summary {
        grid-template-columns: 1fr;
    }

    .dashboard-panel__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.75rem;
    }

    .dashboard-panel__link {
        width: 100%;
    }

    .dashboard-productivity-filter,
    .dashboard-productivity-filter__input {
        max-width: 100%;
        width: 100%;
    }

    .dashboard-productivity-table-wrap {
        border: 0;
        overflow: visible;
    }

    .dashboard-productivity-table--responsive thead {
        display: none;
    }

    .dashboard-productivity-table--responsive,
    .dashboard-productivity-table--responsive tbody,
    .dashboard-productivity-table--responsive tr,
    .dashboard-productivity-table--responsive td {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .dashboard-productivity-table--responsive tbody tr {
        background: var(--app-surface-muted);
        border: 1px solid var(--app-border);
        border-radius: 16px;
        margin-bottom: 0.85rem;
        overflow: hidden;
    }

    .dashboard-productivity-table--responsive tbody td {
        align-items: flex-start;
        border: 0;
        border-top: 1px solid rgba(228, 234, 243, 0.85);
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
        padding: 0.75rem 1rem;
        text-align: left;
    }

    .dashboard-productivity-table--responsive tbody td:first-child {
        border-top: 0;
    }

    .dashboard-productivity-table--responsive tbody td::before {
        color: var(--app-text-muted);
        content: attr(data-label);
        font-size: 0.76rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }

    .dashboard-productivity-table--responsive tbody td[data-label="Camareira"] strong {
        font-size: 1rem;
    }

    .dashboard-productivity-table--responsive .dashboard-productivity-bar {
        max-width: 100%;
        width: 140px;
    }

    .dashboard-productivity-score {
        flex-wrap: wrap;
    }

    .dashboard-shortcut {
        padding: 0.95rem;
    }

    .dashboard-stack {
        gap: 0.85rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dashboard-shortcut {
        transition: none;
    }
}

/* Custom sidebar: explicit desktop collapse + mobile drawer. */
:root {
    --app-sidebar-open-width: 16rem;
    --app-sidebar-collapsed-width: 5.25rem;
}

.app-sidebar-backdrop {
    background: rgba(15, 23, 42, 0.28);
    border: 0;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    transition: opacity 0.2s ease;
    z-index: 1035;
}

.main-sidebar.app-sidebar-shell {
    bottom: 0;
    left: 0;
    margin-left: 0 !important;
    position: fixed;
    top: 0;
    width: var(--app-sidebar-open-width);
}

.content-wrapper,
.main-footer,
.main-header {
    margin-left: var(--app-sidebar-open-width) !important;
    transition: margin-left 0.2s ease;
}

.app-brand-link {
    min-height: 4.35rem;
    padding: 0.9rem 1rem;
}

.app-brand-mark--logo {
    border-radius: 10px;
    padding: 0.22rem;
}

.app-brand-copy strong {
    font-size: 0.98rem;
}

.app-brand-copy small {
    font-size: 0.74rem;
}

.app-sidebar {
    padding: 0.8rem 0.7rem 0.8rem;
}

.app-sidebar__scroll {
    gap: 0.7rem;
}

.app-user-panel {
    border-radius: 14px;
    gap: 0.75rem;
    padding: 0.8rem;
}

.app-user-panel .image img {
    height: 2.55rem;
    width: 2.55rem;
}

.app-user-panel__eyebrow,
.app-sidebar-section__label {
    letter-spacing: 0.1em;
}

.app-sidebar-section__label {
    margin: 0 0.55rem;
}

.nav-sidebar .nav-link {
    border-radius: 10px;
    font-size: 0.91rem;
    gap: 0.7rem;
    min-height: 2.7rem;
    padding: 0.65rem 0.8rem;
}

.nav-sidebar .nav-link > i:first-child {
    color: #6f829d;
    font-size: 0.9rem;
}

.nav-sidebar .nav-link:hover {
    background: #f5f8fc;
    border-color: #e5edf6;
}

.nav-sidebar .nav-link.active,
.nav-sidebar .menu-open > .nav-link {
    background: #eaf2ff;
    border-color: #d5e2fb;
    color: #1f5fe0;
}

.nav-sidebar .nav-link.active > i:first-child,
.nav-sidebar .menu-open > .nav-link > i:first-child {
    color: #1f5fe0;
}

.nav-treeview {
    margin-left: 0.7rem;
    padding-left: 0.45rem;
}

.nav-treeview::before {
    background: #dbe4f0;
    opacity: 0.9;
}

.nav-treeview > .nav-item > .nav-link {
    border-radius: 9px;
    color: #6d7f98;
    font-size: 0.87rem;
    min-height: 2.3rem;
    padding: 0.5rem 0.72rem;
}

.nav-treeview > .nav-item > .nav-link:hover {
    background: #f6f9fd;
    border-color: #edf2f8;
}

.nav-treeview > .nav-item > .nav-link.active {
    background: #eef4ff;
    border-color: #dce7fb;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell::before {
    margin-left: 0 !important;
    overflow: visible;
    width: var(--app-sidebar-collapsed-width);
}

body.app-sidebar-collapsed .content-wrapper,
body.app-sidebar-collapsed .main-footer,
body.app-sidebar-collapsed .main-header {
    margin-left: var(--app-sidebar-collapsed-width) !important;
}

body.app-sidebar-collapsed .app-brand-link {
    justify-content: center;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

body.app-sidebar-collapsed .app-sidebar {
    padding-left: 0.55rem;
    padding-right: 0.55rem;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .app-brand-copy,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .app-user-panel .info,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .app-sidebar-section__label,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .sidebar .nav-header,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link p,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link .right,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link p .right {
    display: none !important;
}

body.app-sidebar-collapsed .app-user-panel {
    justify-content: center;
    padding: 0.65rem;
}

body.app-sidebar-collapsed .app-user-panel .image img {
    height: 2.35rem;
    width: 2.35rem;
}

body.app-sidebar-collapsed .nav-sidebar > .nav-item {
    margin-bottom: 0.32rem;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link {
    border-radius: 14px;
    justify-content: center;
    min-height: 2.95rem;
    padding-left: 0.7rem;
    padding-right: 0.7rem;
    position: relative;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link > i:first-child {
    font-size: 1rem;
    margin: 0;
    width: auto;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-treeview {
    display: none !important;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within {
    width: var(--app-sidebar-open-width);
    box-shadow: 14px 0 32px rgba(15, 23, 42, 0.1);
    z-index: 1040;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .app-brand-link,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .app-brand-link {
    justify-content: flex-start;
    padding-left: 1rem;
    padding-right: 1rem;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .app-sidebar,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .app-sidebar {
    padding-left: 0.85rem;
    padding-right: 0.85rem;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link {
    justify-content: flex-start;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link > i:first-child,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link > i:first-child {
    margin-right: 0.7rem;
    width: 1.2rem;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link[data-sidebar-tooltip]::after {
    background: rgba(15, 23, 42, 0.96);
    border-radius: 10px;
    color: #fff;
    content: attr(data-sidebar-tooltip);
    font-size: 0.78rem;
    font-weight: 600;
    left: calc(100% + 0.75rem);
    line-height: 1.2;
    opacity: 0;
    padding: 0.5rem 0.7rem;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) translateX(-6px);
    transition: opacity 0.16s ease, transform 0.16s ease;
    white-space: nowrap;
    z-index: 30;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link[data-sidebar-tooltip]::before {
    border-bottom: 6px solid transparent;
    border-right: 6px solid rgba(15, 23, 42, 0.96);
    border-top: 6px solid transparent;
    content: '';
    left: calc(100% + 0.45rem);
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) translateX(-6px);
    transition: opacity 0.16s ease, transform 0.16s ease;
    z-index: 29;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link:hover::after,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link:hover::before,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link:focus-visible::after,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link:focus-visible::before {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

body.app-sidebar-collapsed .nav-sidebar .nav-link.active,
body.app-sidebar-collapsed .nav-sidebar .menu-open > .nav-link {
    background: linear-gradient(180deg, #2f6fed 0%, #245fd2 100%);
    border-color: transparent;
    box-shadow: 0 12px 24px rgba(47, 111, 237, 0.18);
    color: #fff;
}

body.app-sidebar-collapsed .nav-sidebar .nav-link.active > i:first-child,
body.app-sidebar-collapsed .nav-sidebar .menu-open > .nav-link > i:first-child {
    color: #fff;
}

@media (max-width: 991.98px) {
    .main-sidebar.app-sidebar-shell {
        transform: translateX(-100%);
        transition: transform 0.22s ease;
        width: min(18rem, calc(100vw - 2rem));
    }

    .content-wrapper,
    .main-footer,
    .main-header,
    body.app-sidebar-collapsed .content-wrapper,
    body.app-sidebar-collapsed .main-footer,
    body.app-sidebar-collapsed .main-header {
        margin-left: 0 !important;
    }

    body.app-sidebar-open .main-sidebar.app-sidebar-shell {
        transform: translateX(0);
    }

    body.app-sidebar-open .app-sidebar-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    body.app-sidebar-collapsed .app-brand-copy,
    body.app-sidebar-collapsed .app-user-panel .info,
    body.app-sidebar-collapsed .app-sidebar-section__label,
    body.app-sidebar-collapsed .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .nav-sidebar .nav-link .right,
    body.app-sidebar-collapsed .nav-sidebar .nav-link p .right {
        display: block !important;
    }

    body.app-sidebar-collapsed .app-sidebar,
    body.app-sidebar-collapsed .nav-sidebar .nav-link {
        justify-content: flex-start;
    }

    body.app-sidebar-collapsed .nav-sidebar .nav-link > i:first-child {
        width: 1rem;
    }
}

/* Sidebar refresh: fixed shell, internal scroll, shadcn-like surface */
:root {
    --app-sidebar-width: 18rem;
    --app-sidebar-collapsed-width: 5.25rem;
    --app-sidebar-bg: rgba(255, 255, 255, 0.96);
    --app-sidebar-border: rgba(226, 232, 240, 0.95);
    --app-sidebar-hover: #f8fafc;
    --app-sidebar-active: #eff6ff;
    --app-sidebar-active-border: #bfdbfe;
    --app-sidebar-active-text: #1d4ed8;
}

.main-sidebar.app-sidebar-shell {
    background: var(--app-sidebar-bg) !important;
    border-right: 1px solid var(--app-sidebar-border);
    bottom: 0;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4), 0 18px 50px rgba(15, 23, 42, 0.08) !important;
    display: flex;
    flex-direction: column;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    width: var(--app-sidebar-width) !important;
    z-index: 1040;
}

.app-brand-link {
    background: transparent;
    border-bottom: 1px solid #f1f5f9;
    flex: 0 0 auto;
    min-height: 4.75rem;
    padding: 1rem 1rem 0.95rem;
}

.app-brand-mark--logo {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 0.35rem;
}

.app-brand-copy strong {
    font-size: 0.98rem;
    font-weight: 700;
}

.app-brand-copy small {
    color: #64748b;
    font-size: 0.75rem;
}

.app-sidebar {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.9rem 0.75rem 1rem;
}

.app-sidebar__scroll {
    flex: 1 1 auto;
    gap: 1rem;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0.2rem;
    scrollbar-width: thin;
}

.app-user-panel {
    display: none !important;
}

.app-sidebar-section {
    gap: 0.55rem;
}

.app-sidebar-section__label,
.sidebar .nav-header {
    color: #94a3b8;
    font-size: 0.69rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    margin: 0 0.7rem;
    text-transform: uppercase;
}

.nav-sidebar > .nav-item {
    margin-bottom: 0.28rem;
}

.nav-sidebar .nav-link {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    color: #334155;
    font-size: 0.92rem;
    font-weight: 500;
    gap: 0.75rem;
    min-height: 2.75rem;
    padding: 0.65rem 0.8rem;
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.nav-sidebar .nav-link > i:first-child {
    color: #64748b;
    font-size: 0.95rem;
    width: 1rem;
}

.nav-sidebar .nav-link p,
.nav-sidebar .nav-link .right,
.nav-sidebar .nav-link p .right {
    line-height: 1.2;
}

.nav-sidebar .nav-link:hover {
    background: var(--app-sidebar-hover);
    border-color: #e2e8f0;
    color: #0f172a;
}

.nav-sidebar .nav-link:hover > i:first-child {
    color: #334155;
}

.nav-sidebar .nav-link.active,
.nav-sidebar .menu-open > .nav-link {
    background: var(--app-sidebar-active);
    border-color: var(--app-sidebar-active-border);
    box-shadow: none;
    color: var(--app-sidebar-active-text);
    font-weight: 600;
}

.nav-sidebar .nav-link.active > i:first-child,
.nav-sidebar .menu-open > .nav-link > i:first-child {
    color: var(--app-sidebar-active-text);
}

.nav-treeview {
    margin-left: 0.9rem;
    padding-left: 0.8rem;
    position: relative;
}

.nav-treeview::before {
    background: #e2e8f0;
    border-radius: 999px;
    bottom: 0.35rem;
    content: "";
    left: 0.2rem;
    position: absolute;
    top: 0.35rem;
    width: 1px;
}

.nav-treeview > .nav-item > .nav-link {
    color: #475569;
    font-size: 0.88rem;
    font-weight: 500;
    min-height: 2.35rem;
    padding: 0.5rem 0.72rem;
}

.nav-treeview > .nav-item > .nav-link > i:first-child {
    color: #94a3b8;
    font-size: 0.8rem;
}

.nav-treeview > .nav-item > .nav-link:hover {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #0f172a;
}

.nav-treeview > .nav-item > .nav-link.active {
    background: #f8fbff;
    border-color: #dbeafe;
    color: #1d4ed8;
}

.content-wrapper,
.main-footer,
.main-header {
    margin-left: var(--app-sidebar-width) !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell::before,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell:hover,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell.sidebar-focused {
    width: var(--app-sidebar-width) !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell:hover .app-brand-copy,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell:hover .app-sidebar-section__label,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link p,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link .right,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link p .right,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell.sidebar-focused .app-brand-copy,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell.sidebar-focused .app-sidebar-section__label,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell.sidebar-focused .nav-sidebar .nav-link p,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell.sidebar-focused .nav-sidebar .nav-link .right,
body.sidebar-mini.sidebar-collapse .main-sidebar.app-sidebar-shell.sidebar-focused .nav-sidebar .nav-link p .right {
    display: block !important;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell,
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell::before {
    margin-left: 0 !important;
    width: var(--app-sidebar-collapsed-width) !important;
}

body.app-sidebar-collapsed .content-wrapper,
body.app-sidebar-collapsed .main-footer,
body.app-sidebar-collapsed .main-header {
    margin-left: var(--app-sidebar-collapsed-width) !important;
}

body.app-sidebar-collapsed .app-brand-link {
    justify-content: center;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

body.app-sidebar-collapsed .app-brand-copy,
body.app-sidebar-collapsed .app-sidebar-section__label,
body.app-sidebar-collapsed .sidebar .nav-header,
body.app-sidebar-collapsed .nav-sidebar .nav-link p,
body.app-sidebar-collapsed .nav-sidebar .nav-link .right,
body.app-sidebar-collapsed .nav-sidebar .nav-link p .right {
    display: none !important;
}

body.app-sidebar-collapsed .nav-sidebar .nav-link {
    justify-content: center;
    min-height: 2.9rem;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
}

body.app-sidebar-collapsed .nav-sidebar .nav-link > i:first-child {
    font-size: 1rem;
    margin: 0;
    width: auto;
}

body.app-sidebar-collapsed .nav-treeview {
    display: none !important;
}

body.app-sidebar-collapsed .nav-sidebar .nav-link.active,
body.app-sidebar-collapsed .nav-sidebar .menu-open > .nav-link {
    background: #eff6ff;
    border-color: #bfdbfe;
    box-shadow: none;
    color: #1d4ed8;
}

body.app-sidebar-collapsed .nav-sidebar .nav-link.active > i:first-child,
body.app-sidebar-collapsed .nav-sidebar .menu-open > .nav-link > i:first-child {
    color: #1d4ed8;
}

@media (max-width: 991.98px) {
    .main-sidebar.app-sidebar-shell {
        transform: translateX(calc(-100% - 1rem));
        transition: transform 0.2s ease;
        width: min(18rem, calc(100vw - 1.25rem)) !important;
    }

    .content-wrapper,
    .main-footer,
    .main-header,
    body.app-sidebar-collapsed .content-wrapper,
    body.app-sidebar-collapsed .main-footer,
    body.app-sidebar-collapsed .main-header {
        margin-left: 0 !important;
    }

    body.app-sidebar-open .main-sidebar.app-sidebar-shell {
        transform: translateX(0);
    }

    body.app-sidebar-collapsed .app-brand-copy,
    body.app-sidebar-collapsed .app-sidebar-section__label,
    body.app-sidebar-collapsed .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .nav-sidebar .nav-link .right,
    body.app-sidebar-collapsed .nav-sidebar .nav-link p .right {
        display: block !important;
    }

    body.app-sidebar-collapsed .nav-sidebar .nav-link {
        justify-content: flex-start;
        padding-left: 0.8rem;
        padding-right: 0.8rem;
    }

    body.app-sidebar-collapsed .nav-sidebar .nav-link > i:first-child {
        width: 1rem;
    }
}

/* Sidebar reboot */
.main-sidebar.app-sidebar-shell,
.main-sidebar.app-sidebar-shell::before,
.main-sidebar.app-sidebar-shell::after {
    background: #ffffff !important;
}

.main-sidebar.app-sidebar-shell {
    border-right: 1px solid #e2e8f0 !important;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08) !important;
    display: flex !important;
    flex-direction: column;
    inset: 0 auto 0 0;
    overflow: hidden;
    position: fixed !important;
    transform: translateX(0);
    transition: transform 0.2s ease;
    width: 18rem !important;
}

.main-sidebar.app-sidebar-shell .brand-link,
.main-sidebar.app-sidebar-shell .sidebar {
    width: 100%;
}

.main-sidebar.app-sidebar-shell .sidebar {
    height: auto !important;
    min-height: 0;
    overflow: hidden;
}

.app-brand-link {
    align-items: center;
    background: #ffffff;
    border-bottom: 1px solid #eef2f7;
    display: flex;
    flex: 0 0 auto;
    gap: 0.9rem;
    min-height: 4.75rem;
    padding: 1rem;
}

.app-brand-link:hover {
    background: #ffffff;
}

.app-brand-mark,
.app-brand-mark--logo {
    border-radius: 14px;
    flex: 0 0 auto;
    height: 2.7rem;
    width: 2.7rem;
}

.app-brand-mark--logo {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    padding: 0.35rem;
}

.app-brand-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.app-brand-copy strong {
    color: #0f172a;
    font-size: 0.96rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.app-brand-copy small {
    color: #64748b;
    font-size: 0.74rem;
}

.app-sidebar {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.9rem 0.75rem 1rem;
}

.app-sidebar__scroll {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 1rem;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0.25rem;
}

.app-sidebar-nav,
.app-sidebar-nav-list {
    margin: 0;
    padding: 0;
}

.app-sidebar-nav-list,
.app-sidebar-nav-list .nav,
.app-sidebar-nav-list .nav-item,
.app-sidebar-nav-list .nav-link {
    list-style: none;
}

.app-sidebar-section {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.app-sidebar-section--support {
    margin-top: auto;
}

.app-sidebar-section__label,
.sidebar .nav-header {
    color: #94a3b8 !important;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    margin: 0 0.7rem;
    padding: 0;
    text-transform: uppercase;
}

.app-sidebar-shell .nav-sidebar > .nav-item {
    margin-bottom: 0.28rem;
}

.app-sidebar-shell .nav-sidebar .nav-link {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    color: #334155 !important;
    display: flex;
    font-size: 0.92rem;
    font-weight: 500;
    gap: 0.75rem;
    justify-content: flex-start;
    min-height: 2.8rem;
    padding: 0.68rem 0.8rem;
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.app-sidebar-shell .nav-sidebar .nav-link p {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    gap: 0.55rem;
    margin: 0;
    min-width: 0;
}

.app-sidebar-shell .nav-sidebar .nav-link > i:first-child {
    color: #64748b !important;
    flex: 0 0 auto;
    font-size: 0.95rem;
    text-align: center;
    width: 1rem;
}

.app-sidebar-shell .nav-sidebar .nav-link .right,
.app-sidebar-shell .nav-sidebar .nav-link p .right {
    color: #94a3b8 !important;
    margin-left: auto;
    transition: transform 0.16s ease;
}

.app-sidebar-shell .nav-sidebar .nav-link:hover {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #0f172a !important;
}

.app-sidebar-shell .nav-sidebar .nav-link:hover > i:first-child {
    color: #334155 !important;
}

.app-sidebar-shell .nav-sidebar .nav-link.active,
.app-sidebar-shell .nav-sidebar .menu-open > .nav-link {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: #1d4ed8 !important;
    font-weight: 600;
}

.app-sidebar-shell .nav-sidebar .nav-link.active > i:first-child,
.app-sidebar-shell .nav-sidebar .menu-open > .nav-link > i:first-child,
.app-sidebar-shell .nav-sidebar .menu-open > .nav-link .right {
    color: #1d4ed8 !important;
}

.app-sidebar-shell .nav-sidebar .menu-open > .nav-link .right {
    transform: rotate(-90deg);
}

.app-sidebar-shell .nav-treeview {
    margin: 0.28rem 0 0.4rem 0.95rem;
    padding: 0 0 0 0.8rem;
    position: relative;
}

.app-sidebar-shell .nav-treeview::before {
    background: #e2e8f0;
    border-radius: 999px;
    bottom: 0.3rem;
    content: "";
    left: 0.18rem;
    position: absolute;
    top: 0.3rem;
    width: 1px;
}

.app-sidebar-shell .nav-treeview > .nav-item {
    margin-bottom: 0.16rem;
}

.app-sidebar-shell .nav-treeview > .nav-item > .nav-link {
    color: #475569 !important;
    font-size: 0.88rem;
    font-weight: 500;
    min-height: 2.35rem;
    padding: 0.52rem 0.72rem;
}

.app-sidebar-shell .nav-treeview > .nav-item > .nav-link > i:first-child {
    color: #94a3b8 !important;
    font-size: 0.82rem;
}

.app-sidebar-shell .nav-treeview > .nav-item > .nav-link:hover {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #0f172a !important;
}

.app-sidebar-shell .nav-treeview > .nav-item > .nav-link.active {
    background: #f8fbff;
    border-color: #dbeafe;
    color: #1d4ed8 !important;
}

.content-wrapper,
.main-footer,
.main-header {
    margin-left: 18rem !important;
}

body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell[data-sidebar-state="collapsed"],
body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell {
    transform: translateX(0);
    width: 5.25rem !important;
}

.main-sidebar.app-sidebar-shell[data-sidebar-state="hidden"] {
    transform: translateX(-100%);
    width: 18rem !important;
}

body.app-sidebar-collapsed .content-wrapper,
body.app-sidebar-collapsed .main-footer,
body.app-sidebar-collapsed .main-header {
    margin-left: 5.25rem !important;
}

body.app-sidebar-collapsed .app-brand-link {
    justify-content: center;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

body.app-sidebar-collapsed .app-brand-copy,
body.app-sidebar-collapsed .app-sidebar-section__label,
body.app-sidebar-collapsed .sidebar .nav-header,
body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link p,
body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link .right,
body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link p .right {
    display: none !important;
}

body.app-sidebar-collapsed .app-sidebar-shell .nav-treeview {
    display: none !important;
}

body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link {
    justify-content: center;
    padding-left: 0.65rem;
    padding-right: 0.65rem;
}

body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link > i:first-child {
    margin: 0;
    width: auto;
}

body.app-sidebar-open {
    overflow: hidden;
}

@media (max-width: 991.98px) {
    .main-sidebar.app-sidebar-shell {
        transform: translateX(calc(-100% - 1rem));
        transition: transform 0.2s ease;
        width: min(18rem, calc(100vw - 1.25rem)) !important;
    }

    .content-wrapper,
    .main-footer,
    .main-header,
    body.app-sidebar-collapsed .content-wrapper,
    body.app-sidebar-collapsed .main-footer,
    body.app-sidebar-collapsed .main-header {
        margin-left: 0 !important;
    }

    body.app-sidebar-open .main-sidebar.app-sidebar-shell,
    .main-sidebar.app-sidebar-shell[data-sidebar-state="expanded"] {
        transform: translateX(0);
    }

    body.app-sidebar-collapsed .app-brand-copy,
    body.app-sidebar-collapsed .app-sidebar-section__label,
    body.app-sidebar-collapsed .sidebar .nav-header,
    body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link .right,
    body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link p .right {
        display: flex !important;
    }

    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell,
    .main-sidebar.app-sidebar-shell[data-sidebar-state="hidden"] {
        transform: translateX(calc(-100% - 1rem));
        width: min(18rem, calc(100vw - 1.25rem)) !important;
    }

    body.app-sidebar-collapsed .content-wrapper,
    body.app-sidebar-collapsed .main-footer,
    body.app-sidebar-collapsed .main-header {
        margin-left: 0 !important;
    }

    body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link {
        justify-content: flex-start;
        padding-left: 0.8rem;
        padding-right: 0.8rem;
    }

    body.app-sidebar-collapsed .app-sidebar-shell .nav-sidebar .nav-link > i:first-child {
        width: 1rem;
    }
}

/* Final desktop collapsed behavior: expand on hover without changing content layout */
@media (min-width: 992px) {
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell {
        overflow: visible !important;
        transition: width 0.2s ease, box-shadow 0.2s ease !important;
        width: 5.25rem !important;
    }

    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell .sidebar,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell .app-sidebar {
        overflow: visible !important;
    }

    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .app-brand-copy,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .app-sidebar-section__label,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .sidebar .nav-header,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link .right,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link p .right {
        display: none !important;
    }

    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-treeview {
        display: none !important;
    }

    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .app-brand-link {
        justify-content: center !important;
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link {
        justify-content: center !important;
        padding-left: 0.65rem !important;
        padding-right: 0.65rem !important;
    }

    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:not(:hover):not(:focus-within) .nav-sidebar .nav-link > i:first-child {
        margin: 0 !important;
        width: auto !important;
    }

    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within {
        box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12) !important;
        width: 18rem !important;
    }

    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .app-brand-link,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .app-brand-link,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .app-brand-link {
        justify-content: flex-start !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .app-brand-copy,
    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .app-sidebar-section__label,
    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .sidebar .nav-header,
    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .nav-sidebar .nav-link p,
    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .nav-sidebar .nav-link .right,
    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .nav-sidebar .nav-link p .right,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .app-brand-copy,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .app-sidebar-section__label,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .sidebar .nav-header,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link .right,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link p .right,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .app-brand-copy,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .app-sidebar-section__label,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .sidebar .nav-header,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link .right,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link p .right {
        display: block !important;
    }

    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link p,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link p {
        flex: 1 1 auto;
        min-width: 0;
    }

    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .nav-sidebar .nav-item.menu-open > .nav-treeview,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-item.menu-open > .nav-treeview,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-item.menu-open > .nav-treeview {
        display: block !important;
    }

    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .nav-sidebar .nav-link,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link {
        justify-content: flex-start !important;
        padding-left: 0.8rem !important;
        padding-right: 0.8rem !important;
    }

    body.app-sidebar-hover-expanded .main-sidebar.app-sidebar-shell .nav-sidebar .nav-link > i:first-child,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:hover .nav-sidebar .nav-link > i:first-child,
    body.app-sidebar-collapsed .main-sidebar.app-sidebar-shell:focus-within .nav-sidebar .nav-link > i:first-child {
        margin-right: 0.7rem !important;
        width: 1rem !important;
    }
}

.app-table-footer {
    align-items: center;
    border-top: 1px solid var(--app-border);
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    justify-content: space-between;
    padding: 1rem 1.25rem 1.15rem;
}

.app-table-footer__meta {
    color: var(--app-text-muted);
    font-size: 0.9rem;
}

.app-table-footer__pagination {
    margin-left: auto;
}

.app-table-footer__pagination .pagination {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .app-data-table--responsive-cards thead {
        display: none;
    }

    .app-data-table--responsive-cards,
    .app-data-table--responsive-cards tbody,
    .app-data-table--responsive-cards tr,
    .app-data-table--responsive-cards td {
        display: block;
        width: 100%;
    }

    .app-data-table--responsive-cards tr {
        background: var(--app-surface-muted);
        border: 1px solid var(--app-border);
        border-radius: 16px;
        margin-bottom: 0.85rem;
        overflow: hidden;
        padding: 0.35rem 0;
    }

    .app-data-table--responsive-cards tr:hover {
        background: #f8fbff;
    }

    .app-data-table--responsive-cards td {
        align-items: center;
        border: 0;
        display: flex;
        gap: 0.75rem;
        justify-content: space-between;
        padding: 0.65rem 1rem;
        text-align: right;
    }

    .app-data-table--responsive-cards td::before {
        color: var(--app-text-muted);
        content: attr(data-label);
        flex-shrink: 0;
        font-size: 0.78rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-align: left;
        text-transform: uppercase;
    }

    .app-data-table--responsive-cards td.app-cell-actions {
        background: rgba(255, 255, 255, 0.65);
        border-top: 1px solid var(--app-border);
        justify-content: flex-end;
        margin-top: 0.25rem;
        padding-top: 0.85rem;
    }

    .app-data-table--responsive-cards td.app-cell-actions::before {
        display: none;
    }

    .app-data-table--responsive-cards td[colspan] {
        display: block;
        text-align: center;
    }

    .app-data-table--responsive-cards td[colspan]::before {
        display: none;
    }

    .app-action-button {
        height: 2.45rem;
        min-width: 2.45rem;
    }

    .app-table-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .app-table-footer__pagination {
        margin-left: 0;
        overflow-x: auto;
        width: 100%;
    }

    .app-page__title {
        font-size: 1.55rem;
    }

    .app-toolbar-actions {
        display: grid;
        gap: 0.65rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .app-toolbar-actions > .app-button-primary {
        grid-column: 1 / -1;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .app-toolbar-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 0.65rem;
    }

    .app-toolbar-actions > * {
        min-height: 2.75rem;
    }

    .app-page__title {
        font-size: 1.75rem;
    }

    .app-table-footer__pagination {
        overflow-x: auto;
    }

    .check-suite-form-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .check-suite-checklist {
        min-width: 760px;
    }
}

.check-suite-form-page .app-panel__head {
    align-items: flex-start;
}

.check-suite-form__body {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.25rem 1.35rem 0;
}

.check-suite-form-meta {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.check-suite-form-meta label {
    color: var(--app-text-muted);
    font-size: 0.86rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
}

.check-suite-form-meta .form-control,
.check-suite-form-meta .select2-container {
    min-height: 2.75rem;
}

.check-suite-checklist-wrap {
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--app-border);
    border-radius: 18px;
    overflow-x: auto;
}

.check-suite-checklist {
    margin-bottom: 0;
    min-width: 920px;
}

.check-suite-checklist thead th {
    background: #f8fafc;
    border-bottom: 1px solid var(--app-border);
    color: var(--app-text-muted);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    padding: 0.85rem 0.9rem;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
}

.check-suite-checklist tbody td {
    border-top: 1px solid #edf2f8;
    padding: 0.8rem 0.9rem;
    vertical-align: middle;
}

.check-suite-checklist tbody tr:hover {
    background: #f8fbff;
}

.check-suite-checklist__item-col {
    width: 4rem;
}

.check-suite-checklist__eval-col {
    width: 8rem;
}

.check-suite-checklist__register-col {
    min-width: 12rem;
}

.check-suite-checklist__actions-col {
    width: 6.5rem;
}

.check-suite-checklist tbody td:nth-child(2) {
    color: var(--app-text);
    font-size: 0.92rem;
    line-height: 1.45;
    min-width: 18rem;
}

.check-suite-checklist tbody td:nth-child(2) p {
    margin: 0;
}

.check-suite-checklist .form-control-sm {
    font-size: 0.92rem;
    min-height: 2.5rem;
}

.check-suite-checklist .filter,
.check-suite-checklist .show_occurence_id {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    min-height: 2.45rem;
    min-width: 2.45rem;
    padding: 0.45rem;
}

.check-suite-closing {
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-top: 0.25rem;
    padding: 1.25rem;
}

.check-suite-closing__label {
    color: var(--app-text-muted);
    display: block;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    margin-bottom: 0.65rem;
    text-transform: uppercase;
}

.check-suite-closing__textarea {
    background: var(--app-surface);
    border-color: var(--app-border);
    border-radius: 14px;
    min-height: 6.5rem;
    resize: vertical;
}

.check-suite-closing__textarea:focus {
    border-color: var(--app-primary);
    box-shadow: 0 0 0 3px var(--app-primary-soft);
}

.check-suite-closing__grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.8fr);
}

.check-suite-closing__block {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 16px;
    padding: 1rem 1.05rem;
}

.check-suite-status {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.check-suite-status__input {
    opacity: 0;
    pointer-events: none;
    position: absolute;
}

.check-suite-status__option {
    align-items: flex-start;
    background: var(--app-surface-muted);
    border: 1.5px solid var(--app-border);
    border-radius: 14px;
    color: var(--app-text);
    cursor: pointer;
    display: flex;
    gap: 0.8rem;
    height: 100%;
    margin: 0;
    padding: 0.95rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.check-suite-status__icon {
    align-items: center;
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    color: var(--app-text-muted);
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 0.95rem;
    height: 2.25rem;
    justify-content: center;
    width: 2.25rem;
}

.check-suite-status__text {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.check-suite-status__text strong {
    font-size: 0.94rem;
    line-height: 1.25;
}

.check-suite-status__text small {
    color: var(--app-text-muted);
    font-size: 0.82rem;
    line-height: 1.35;
}

.check-suite-status__input:checked + .check-suite-status__option--liberado {
    background: #f0fdf4;
    border-color: #86efac;
    box-shadow: 0 8px 24px rgba(34, 197, 94, 0.12);
}

.check-suite-status__input:checked + .check-suite-status__option--liberado .check-suite-status__icon {
    background: #dcfce7;
    border-color: #86efac;
    color: #16a34a;
}

.check-suite-status__input:checked + .check-suite-status__option--bloqueado {
    background: #fff7ed;
    border-color: #fdba74;
    box-shadow: 0 8px 24px rgba(249, 115, 22, 0.12);
}

.check-suite-status__input:checked + .check-suite-status__option--bloqueado .check-suite-status__icon {
    background: #ffedd5;
    border-color: #fdba74;
    color: #ea580c;
}

.check-suite-status__input:disabled + .check-suite-status__option {
    cursor: default;
    opacity: 0.92;
}

.check-suite-rating {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    justify-content: center;
    min-height: 100%;
    text-align: center;
}

.check-suite-rating__stars {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: center;
}

.check-suite-rating__star {
    background: transparent;
    border: 0;
    color: #cbd5e1;
    cursor: pointer;
    font-size: 2rem;
    line-height: 1;
    padding: 0.15rem;
    transition: color 0.18s ease, transform 0.18s ease;
}

.check-suite-rating__star.is-active {
    color: #f59e0b;
}

.check-suite-rating__star:hover {
    transform: scale(1.08);
}

.check-suite-rating--readonly .check-suite-rating__star {
    cursor: default;
}

.check-suite-rating--readonly .check-suite-rating__star:hover {
    transform: none;
}

.check-suite-rating__meta {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.check-suite-rating__value {
    color: var(--app-text);
    font-size: 1rem;
    font-weight: 700;
}

.check-suite-rating__hint {
    color: var(--app-text-muted);
    font-size: 0.82rem;
}

.check-suite-form__footer {
    align-items: center;
    border-top: 1px solid var(--app-border);
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
    padding: 1rem 1.35rem 1.25rem;
}

.check-suite-form__footer .app-button-light,
.check-suite-form__footer .app-button-primary {
    min-width: 10rem;
}

.check-suite-form--readonly select,
.check-suite-form--readonly input:not([type="hidden"]),
.check-suite-form--readonly textarea {
    background: var(--app-surface-muted);
    pointer-events: none;
}

.check-suite-form--readonly .filter {
    display: none;
}

.check-suite-form--readonly .show_occurence_id {
    pointer-events: auto;
}

@media (max-width: 991.98px) {
    .check-suite-form-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .check-suite-form__body {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .check-suite-closing__grid {
        grid-template-columns: 1fr;
    }

    .check-suite-form__footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (max-width: 767.98px) {
    .check-suite-form-meta {
        grid-template-columns: 1fr;
    }

    .check-suite-closing {
        padding: 1rem;
    }

    .check-suite-closing__grid {
        grid-template-columns: 1fr;
    }

    .check-suite-status {
        grid-template-columns: 1fr;
    }

    .check-suite-checklist-wrap {
        border: 0;
        overflow: visible;
    }

    .check-suite-checklist--responsive thead {
        display: none;
    }

    .check-suite-checklist--responsive,
    .check-suite-checklist--responsive tbody,
    .check-suite-checklist--responsive tr,
    .check-suite-checklist--responsive td {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .check-suite-checklist--responsive tbody tr {
        background: var(--app-surface-muted);
        border: 1px solid var(--app-border);
        border-radius: 16px;
        margin-bottom: 0.85rem;
        overflow: hidden;
        padding: 0.35rem 0;
    }

    .check-suite-checklist--responsive tbody td {
        align-items: flex-start;
        border: 0;
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
        padding: 0.75rem 1rem;
        text-align: left;
    }

    .check-suite-checklist--responsive tbody td::before {
        color: var(--app-text-muted);
        content: attr(data-label);
        font-size: 0.76rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }

    .check-suite-checklist--responsive tbody td:nth-child(1)::before { content: 'Item'; }
    .check-suite-checklist--responsive tbody td:nth-child(2)::before { content: 'Conferência'; }
    .check-suite-checklist--responsive tbody td:nth-child(3)::before { content: 'Avaliação'; }
    .check-suite-checklist--responsive tbody td:nth-child(4)::before { content: 'Registro'; }
    .check-suite-checklist--responsive tbody td:nth-child(5)::before { content: 'Ocorrência'; }

    .check-suite-checklist--responsive tbody td:nth-child(1) {
        color: var(--app-primary);
        font-size: 0.82rem;
        font-weight: 700;
    }

    .check-suite-checklist--responsive tbody td:nth-child(2) {
        font-size: 0.95rem;
        line-height: 1.5;
    }

    .check-suite-checklist--responsive tbody td:nth-child(3) .form-control,
    .check-suite-checklist--responsive tbody td:nth-child(4) .form-control,
    .check-suite-checklist--responsive tbody td:nth-child(5) .btn {
        width: 100%;
    }

    .check-suite-checklist--responsive tbody td:nth-child(5) {
        align-items: stretch;
        background: rgba(255, 255, 255, 0.65);
        border-top: 1px solid var(--app-border);
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.5rem;
        margin-top: 0.15rem;
    }

    .check-suite-checklist--responsive tbody td:nth-child(5)::before {
        flex: 0 0 100%;
    }

    .check-suite-form__footer {
        flex-direction: column-reverse;
    }

    .check-suite-form__footer .app-button-light,
    .check-suite-form__footer .app-button-primary {
        width: 100%;
    }
}

/* --- Legacy AdminLTE pages: mobile/tablet helpers --- */
.app-form-meta {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.app-form-meta--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.app-form-meta--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.app-form-meta label,
.app-form-page label {
    color: var(--app-text-muted);
    font-size: 0.86rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
}

.app-form__body {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.25rem 1.35rem 0;
}

.app-form__footer {
    align-items: center;
    border-top: 1px solid var(--app-border);
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
    padding: 1rem 1.35rem 1.25rem;
}

.app-form__footer .app-button-light,
.app-form__footer .app-button-primary,
.app-form__footer .btn {
    min-width: 10rem;
}

.app-form-page--readonly input:not([type="hidden"]),
.app-form-page--readonly select,
.app-form-page--readonly textarea {
    background: var(--app-surface-muted);
    pointer-events: none;
}

.app-comments-thread {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

@media (max-width: 991.98px) {
    .app-form-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .content-wrapper .card-body .row > [class*="col-md"],
    .content-wrapper .card-body .row > [class*="col-lg"] {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .content-wrapper .card-header {
        align-items: stretch;
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .content-wrapper .card-header .text-right {
        text-align: left !important;
    }

    .content-wrapper .card-body .row > .col.text-left,
    .content-wrapper .card-body .row > .col.text-right {
        flex: 0 0 100%;
        max-width: 100%;
        text-align: left !important;
    }

    .content-wrapper .callout .row > [class*="col-md"],
    .content-wrapper .callout .row > [class*="col-lg"] {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (max-width: 767.98px) {
    .app-form-meta,
    .app-form-meta--2,
    .app-form-meta--3 {
        grid-template-columns: 1fr;
    }

    .app-form__body {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .app-form__footer {
        flex-direction: column-reverse;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .app-form__footer .app-button-light,
    .app-form__footer .app-button-primary,
    .app-form__footer .btn {
        width: 100%;
    }

    .content-wrapper .container,
    .content-wrapper .container-fluid {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .content-wrapper .card-body .row > [class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .content-wrapper .card-body {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto;
    }

    .content-wrapper .card-footer {
        display: flex;
        flex-direction: column-reverse;
        gap: 0.5rem;
    }

    .content-wrapper .card-footer .btn {
        float: none !important;
        width: 100%;
    }

    .content-wrapper .btn-group-sm,
    .content-wrapper .btn-group {
        display: flex;
        flex-wrap: nowrap;
        gap: 0.35rem;
        overflow-x: auto;
    }

    .content-wrapper .breadcrumb.float-sm-right {
        float: none !important;
        margin-bottom: 0.75rem;
    }

    .content-wrapper .direct-chat-msg {
        max-width: 100%;
    }

    .content-wrapper .input-group {
        flex-wrap: wrap;
    }

    .content-wrapper .input-group-append {
        margin-left: 0;
        margin-top: 0.5rem;
        width: 100%;
    }

    .content-wrapper .input-group-append .btn {
        width: 100%;
    }
}