.ck-editor__editable,
textarea {
    min-height: 150px;
}

.datatable {
    width: 100% !important;
}

/* DataTables toolbar spacing — detailed styles in Invastro tables section */

.select2 {
    max-width: 100%;
    width: 100% !important;
}

.select2-selection__rendered {
    padding-bottom: 5px !important;
}

.has-error .invalid-feedback {
    display: block !important;
}

.btn-info,
.badge-info {
    color: white;
}

/* Sort icons — styled in Invastro tables section */

.sidebar .nav-item {
    cursor: pointer;
}

/* Legacy btn sizes — overridden by Invastro button system below */

.searchable-title {
    font-weight: bold;
}
.searchable-fields {
    padding-left:5px;
}
.searchable-link {
    padding:0 5px 0 5px;
}
.searchable-link:hover   {
    cursor: pointer;
    background: #eaeaea;
}
.select2-results__option {
    padding-left: 0px;
    padding-right: 0px;
}

/* Required asterisk — styled in Invastro forms section */

.form-check.is-invalid ~ .invalid-feedback {
    display: block;
}

.c-sidebar-brand .c-sidebar-brand-full:hover {
    color: inherit;
}

.custom-select.form-control-sm {
    padding: 0.25rem 1.5rem;
}

/* Sidebar toggle — smooth slide + backdrop */
.c-app .c-wrapper {
    transition: margin-inline-start 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1)),
        margin-inline-end 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1));
}

@media (max-width: 991.98px) {
    body::before {
        content: "";
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 42, 0.55);
        z-index: 1018;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1)),
            visibility 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1));
    }

    body.c-sidebar-show::before {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    #sidebar.inv-sidebar.c-sidebar-fixed {
        margin-left: 0 !important;
        margin-right: 0 !important;
        z-index: 1020;
        transition: transform 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1)),
            box-shadow 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1));
        will-change: transform;
    }

    [dir="ltr"] #sidebar.inv-sidebar:not(.c-sidebar-show) {
        transform: translate3d(-100%, 0, 0);
        box-shadow: none;
    }

    [dir="ltr"] #sidebar.inv-sidebar.c-sidebar-show {
        transform: translate3d(0, 0, 0);
        box-shadow: 4px 0 32px rgba(15, 23, 42, 0.45);
    }

    [dir="rtl"] #sidebar.inv-sidebar:not(.c-sidebar-show) {
        transform: translate3d(100%, 0, 0);
        box-shadow: none;
    }

    [dir="rtl"] #sidebar.inv-sidebar.c-sidebar-show {
        transform: translate3d(0, 0, 0);
        box-shadow: -4px 0 32px rgba(15, 23, 42, 0.45);
    }
}

@media (min-width: 992px) {
    #sidebar.inv-sidebar {
        transition: width 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1)),
            margin-inline-start 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1)),
            margin-inline-end 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1)),
            box-shadow 0.38s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1));
    }

    #sidebar.inv-sidebar .c-sidebar-brand,
    #sidebar.inv-sidebar .c-sidebar-nav {
        transition: opacity 0.28s var(--inv-nav-ease, cubic-bezier(0.4, 0, 0.2, 1));
    }

    #sidebar.inv-sidebar:not(.c-sidebar-lg-show) .c-sidebar-brand,
    #sidebar.inv-sidebar:not(.c-sidebar-lg-show) .inv-sidebar-nav {
        opacity: 0.92;
    }
}

@media (prefers-reduced-motion: reduce) {
    .c-app .c-wrapper,
    #sidebar.inv-sidebar,
    #sidebar.inv-sidebar .c-sidebar-brand,
    #sidebar.inv-sidebar .c-sidebar-nav,
    body::before {
        transition: none !important;
    }

    @media (max-width: 991.98px) {
        [dir="ltr"] #sidebar.inv-sidebar:not(.c-sidebar-show),
        [dir="rtl"] #sidebar.inv-sidebar:not(.c-sidebar-show) {
            transform: none;
        }
    }
}

/* ── Invastro sidebar: colorful + animated ── */
.inv-sidebar {
    --inv-sidebar-bg: linear-gradient(175deg, #1a1f36 0%, #252b48 45%, #1e2439 100%);
    --inv-sidebar-accent: #6366f1;
    --inv-nav-ease: cubic-bezier(0.4, 0, 0.2, 1);
    background: var(--inv-sidebar-bg) !important;
    box-shadow: 4px 0 24px rgba(15, 23, 42, 0.35);
}

.inv-sidebar::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 40% at 50% 0%, rgba(99, 102, 241, 0.15), transparent 60%);
    pointer-events: none;
    z-index: 0;
}

.inv-sidebar .c-sidebar-nav,
.inv-sidebar .inv-sidebar-brand {
    position: relative;
    z-index: 1;
}

.inv-sidebar-brand {
    padding: 1.1rem 1rem !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(0, 0, 0, 0.15);
}

.inv-sidebar-brand .c-sidebar-brand-full {
    background: linear-gradient(90deg, #a5b4fc, #f472b6, #34d399);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
    letter-spacing: 0.02em;
    animation: inv-brand-shimmer 6s ease-in-out infinite;
    transition: transform 0.35s var(--inv-nav-ease);
}

.inv-sidebar-brand .c-sidebar-brand-full:hover {
    transform: scale(1.02);
    -webkit-text-fill-color: transparent;
    color: transparent;
}

@keyframes inv-brand-shimmer {
    0%, 100% { background-position: 0% center; }
    50% { background-position: 100% center; }
}

.inv-sidebar-nav {
    padding: 0.75rem 0.5rem 1.5rem;
}

.inv-sidebar .c-sidebar-nav-link,
.inv-sidebar .c-sidebar-nav-dropdown-toggle {
    position: relative;
    border-radius: 10px;
    margin: 2px 6px;
    padding: 0.65rem 0.85rem !important;
    color: rgba(226, 232, 240, 0.88) !important;
    transition:
        color 0.3s var(--inv-nav-ease),
        background 0.3s var(--inv-nav-ease),
        transform 0.3s var(--inv-nav-ease),
        box-shadow 0.3s var(--inv-nav-ease);
    overflow: hidden;
}

.inv-sidebar .c-sidebar-nav-link::before,
.inv-sidebar .c-sidebar-nav-dropdown-toggle::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 50%;
    transform: translateY(-50%) scaleY(0);
    width: 3px;
    height: 60%;
    border-radius: 0 4px 4px 0;
    background: var(--inv-item-color, var(--inv-sidebar-accent));
    transition: transform 0.35s var(--inv-nav-ease);
}

[dir="rtl"] .inv-sidebar .c-sidebar-nav-link::before,
[dir="rtl"] .inv-sidebar .c-sidebar-nav-dropdown-toggle::before {
    border-radius: 4px 0 0 4px;
}

.inv-sidebar .c-sidebar-nav-link:hover,
.inv-sidebar .c-sidebar-nav-dropdown-toggle:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, 0.08) !important;
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

[dir="rtl"] .inv-sidebar .c-sidebar-nav-link:hover,
[dir="rtl"] .inv-sidebar .c-sidebar-nav-dropdown-toggle:hover {
    transform: translateX(-4px);
}

.inv-sidebar .c-sidebar-nav-link:hover::before,
.inv-sidebar .c-sidebar-nav-dropdown-toggle:hover::before,
.inv-sidebar .c-sidebar-nav-link.c-active::before,
.inv-sidebar .c-sidebar-nav-dropdown.c-show > .c-sidebar-nav-dropdown-toggle::before {
    transform: translateY(-50%) scaleY(1);
}

.inv-sidebar .c-sidebar-nav-link.c-active,
.inv-sidebar .c-sidebar-nav-dropdown.c-show > .c-sidebar-nav-dropdown-toggle {
    color: #fff !important;
    background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--inv-item-color, var(--inv-sidebar-accent)) 25%, transparent),
        rgba(255, 255, 255, 0.06)
    ) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.inv-sidebar .c-sidebar-nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    margin-inline-end: 0.5rem !important;
    border-radius: 8px;
    background: color-mix(in srgb, var(--inv-item-color, var(--inv-sidebar-accent)) 22%, transparent);
    color: var(--inv-item-color, #a5b4fc) !important;
    transition:
        transform 0.35s var(--inv-nav-ease),
        background 0.35s var(--inv-nav-ease),
        box-shadow 0.35s var(--inv-nav-ease);
}

.inv-sidebar .c-sidebar-nav-link:hover .c-sidebar-nav-icon,
.inv-sidebar .c-sidebar-nav-dropdown-toggle:hover .c-sidebar-nav-icon {
    transform: scale(1.1) rotate(-3deg);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--inv-item-color, var(--inv-sidebar-accent)) 40%, transparent);
}

.inv-sidebar .c-sidebar-nav-link.c-active .c-sidebar-nav-icon {
    background: var(--inv-item-color, var(--inv-sidebar-accent));
    color: #fff !important;
    box-shadow: 0 4px 16px color-mix(in srgb, var(--inv-item-color, var(--inv-sidebar-accent)) 50%, transparent);
}

/* Per-section accent colors */
.inv-nav-item--dashboard { --inv-item-color: #38bdf8; }
.inv-nav-item--users { --inv-item-color: #a78bfa; }
.inv-nav-item--customers { --inv-item-color: #34d399; }
.inv-nav-item--ads { --inv-item-color: #f472b6; }
.inv-nav-item--complaints { --inv-item-color: #fb923c; }
.inv-nav-item--alerts { --inv-item-color: #fbbf24; }
.inv-nav-item--faq { --inv-item-color: #2dd4bf; }
.inv-nav-item--contact { --inv-item-color: #60a5fa; }
.inv-nav-item--settings { --inv-item-color: #94a3b8; }
.inv-nav-item--password { --inv-item-color: #c084fc; }
.inv-nav-item--logout { --inv-item-color: #f87171; }

.inv-nav-item--logout .c-sidebar-nav-link:hover {
    background: rgba(248, 113, 113, 0.15) !important;
}

/* Dropdown sub-menu */
.inv-sidebar .c-sidebar-nav-dropdown-items {
    padding: 0.25rem 0 0.5rem;
    margin-inline-start: 0.5rem;
    border-inline-start: 2px solid rgba(255, 255, 255, 0.06);
    animation: inv-dropdown-in 0.4s var(--inv-nav-ease);
}

@keyframes inv-dropdown-in {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.inv-sidebar .c-sidebar-nav-dropdown-items .c-sidebar-nav-link {
    font-size: 0.9rem;
    padding: 0.5rem 0.75rem !important;
    margin-inline-start: 0.35rem;
}

.inv-sidebar .c-sidebar-nav-dropdown-items .c-sidebar-nav-icon {
    width: 1.65rem;
    height: 1.65rem;
    font-size: 0.85rem;
}

.inv-sidebar .c-sidebar-nav-dropdown-toggle::after {
    transition: transform 0.35s var(--inv-nav-ease);
}

.inv-sidebar .c-sidebar-nav-dropdown.c-show > .c-sidebar-nav-dropdown-toggle::after {
    transform: rotate(180deg);
}

/* Staggered fade-in for top-level items */
.inv-sidebar-nav > .inv-nav-item {
    animation: inv-nav-fade-in 0.5s var(--inv-nav-ease) backwards;
}

.inv-sidebar-nav > .inv-nav-item:nth-child(1) { animation-delay: 0.03s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(2) { animation-delay: 0.06s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(3) { animation-delay: 0.09s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(4) { animation-delay: 0.12s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(5) { animation-delay: 0.15s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(6) { animation-delay: 0.18s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(7) { animation-delay: 0.21s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(8) { animation-delay: 0.24s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(9) { animation-delay: 0.27s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(10) { animation-delay: 0.30s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(11) { animation-delay: 0.33s; }
.inv-sidebar-nav > .inv-nav-item:nth-child(12) { animation-delay: 0.36s; }

@keyframes inv-nav-fade-in {
    from {
        opacity: 0;
        transform: translateX(-12px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

[dir="rtl"] .inv-sidebar-nav > .inv-nav-item {
    animation-name: inv-nav-fade-in-rtl;
}

@keyframes inv-nav-fade-in-rtl {
    from {
        opacity: 0;
        transform: translateX(12px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .inv-sidebar *,
    .inv-sidebar-brand .c-sidebar-brand-full {
        animation: none !important;
        transition-duration: 0.01ms !important;
    }
}

/* ── Invastro design tokens (shared) ── */
:root {
    --inv-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --inv-color-sky: #38bdf8;
    --inv-color-emerald: #34d399;
    --inv-color-amber: #fbbf24;
    --inv-color-rose: #f472b6;
    --inv-color-indigo: #6366f1;
    --inv-surface: #ffffff;
    --inv-surface-muted: #f8fafc;
    --inv-text: #1e293b;
    --inv-text-muted: #64748b;
    --inv-radius: 14px;
    --inv-shadow: 0 4px 24px rgba(15, 23, 42, 0.08);
    --inv-shadow-hover: 0 12px 32px rgba(15, 23, 42, 0.14);
    --inv-btn-radius: 10px;
    --inv-scrollbar-size: 7px;
    --inv-scrollbar-thumb: rgba(148, 163, 184, 0.35);
    --inv-scrollbar-thumb-hover: rgba(99, 102, 241, 0.5);
    --inv-scrollbar-track: transparent;
    --inv-input-radius: 10px;
    --inv-input-border: rgba(15, 23, 42, 0.12);
    --inv-input-bg: #ffffff;
    --inv-input-focus: rgba(99, 102, 241, 0.2);
}

/* ── Invastro scrollbars (smooth & light) ── */
.c-app,
.c-app * {
    scrollbar-width: thin;
    scrollbar-color: var(--inv-scrollbar-thumb) var(--inv-scrollbar-track);
}

.c-app::-webkit-scrollbar,
.c-app *::-webkit-scrollbar {
    width: var(--inv-scrollbar-size);
    height: var(--inv-scrollbar-size);
}

.c-app::-webkit-scrollbar-track,
.c-app *::-webkit-scrollbar-track {
    background: var(--inv-scrollbar-track);
    border-radius: 100px;
}

.c-app::-webkit-scrollbar-thumb,
.c-app *::-webkit-scrollbar-thumb {
    background-color: var(--inv-scrollbar-thumb);
    border-radius: 100px;
    border: 2px solid transparent;
    background-clip: padding-box;
    transition: background-color 0.3s var(--inv-ease);
}

.c-app::-webkit-scrollbar-thumb:hover,
.c-app *::-webkit-scrollbar-thumb:hover {
    background-color: var(--inv-scrollbar-thumb-hover);
}

.c-app::-webkit-scrollbar-thumb:active,
.c-app *::-webkit-scrollbar-thumb:active {
    background-color: rgba(99, 102, 241, 0.65);
}

.c-app::-webkit-scrollbar-corner,
.c-app *::-webkit-scrollbar-corner {
    background: transparent;
}

/* Sidebar — light thumb on dark background */
.inv-sidebar,
.inv-sidebar * {
    scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
}

.inv-sidebar::-webkit-scrollbar-thumb,
.inv-sidebar *::-webkit-scrollbar-thumb {
    background-color: rgba(255, 255, 255, 0.18);
}

.inv-sidebar::-webkit-scrollbar-thumb:hover,
.inv-sidebar *::-webkit-scrollbar-thumb:hover {
    background-color: rgba(255, 255, 255, 0.32);
}

.inv-sidebar::-webkit-scrollbar-thumb:active,
.inv-sidebar *::-webkit-scrollbar-thumb:active {
    background-color: rgba(255, 255, 255, 0.45);
}

/* DataTables horizontal scroll */
.c-app .dataTables_scrollBody {
    scrollbar-width: thin;
    scrollbar-color: var(--inv-scrollbar-thumb) rgba(241, 245, 249, 0.6);
}

.c-app .dataTables_scrollBody::-webkit-scrollbar-track {
    background: rgba(241, 245, 249, 0.6);
    margin: 0 4px;
}

/* Table overflow containers */
.c-app .table-responsive {
    scrollbar-width: thin;
    scrollbar-color: var(--inv-scrollbar-thumb) rgba(241, 245, 249, 0.5);
}

.c-app .table-responsive::-webkit-scrollbar-track {
    background: rgba(241, 245, 249, 0.5);
    margin: 2px 4px;
}

@media (prefers-reduced-motion: reduce) {
    .c-app::-webkit-scrollbar-thumb,
    .c-app *::-webkit-scrollbar-thumb {
        transition: none;
    }
}

/* ── Dashboard stat cards ── */
.inv-dashboard-stats {
    margin-bottom: 0.5rem;
}

.inv-stat-col {
    margin-bottom: 1.25rem;
}

.inv-stat-card {
    --inv-stat-color: var(--inv-color-sky);
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.35rem 1.25rem;
    border-radius: var(--inv-radius);
    background: var(--inv-surface);
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: var(--inv-shadow);
    overflow: hidden;
    transition:
        transform 0.4s var(--inv-ease),
        box-shadow 0.4s var(--inv-ease),
        border-color 0.4s var(--inv-ease);
    animation: inv-stat-enter 0.55s var(--inv-ease) backwards;
}

.inv-stat-col:nth-child(1) .inv-stat-card { animation-delay: 0.05s; }
.inv-stat-col:nth-child(2) .inv-stat-card { animation-delay: 0.12s; }
.inv-stat-col:nth-child(3) .inv-stat-card { animation-delay: 0.19s; }
.inv-stat-col:nth-child(4) .inv-stat-card { animation-delay: 0.26s; }

@keyframes inv-stat-enter {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.inv-stat-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--inv-shadow-hover);
    border-color: color-mix(in srgb, var(--inv-stat-color) 35%, transparent);
}

.inv-stat-card__glow {
    position: absolute;
    inset-inline-end: -20%;
    top: -40%;
    width: 55%;
    height: 140%;
    background: radial-gradient(
        circle,
        color-mix(in srgb, var(--inv-stat-color) 18%, transparent),
        transparent 70%
    );
    pointer-events: none;
    transition: opacity 0.4s var(--inv-ease);
    opacity: 0.7;
}

.inv-stat-card:hover .inv-stat-card__glow {
    opacity: 1;
}

.inv-stat-card__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 12px;
    font-size: 1.35rem;
    color: var(--inv-stat-color);
    background: color-mix(in srgb, var(--inv-stat-color) 14%, transparent);
    transition:
        transform 0.4s var(--inv-ease),
        background 0.4s var(--inv-ease),
        color 0.4s var(--inv-ease),
        box-shadow 0.4s var(--inv-ease);
}

.inv-stat-card:hover .inv-stat-card__icon {
    transform: scale(1.08) rotate(-4deg);
    background: var(--inv-stat-color);
    color: #fff;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--inv-stat-color) 45%, transparent);
}

.inv-stat-card__body {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.inv-stat-card__value {
    font-size: clamp(1.125rem, 2.5vw, 1.5rem);
    font-weight: 700;
    line-height: 1.2;
    color: var(--inv-text);
    letter-spacing: -0.02em;
    transition: color 0.3s var(--inv-ease);
}

.inv-stat-card:hover .inv-stat-card__value {
    color: var(--inv-stat-color);
}

.inv-stat-card__label {
    margin-top: 0.2rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--inv-text-muted);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.inv-dashboard-stats a {
    text-decoration: none;
    color: inherit;
}

.inv-dashboard-stats a:hover .inv-stat-card__value {
    color: var(--inv-stat-color);
}

/* Accent top bar */
.inv-stat-card::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    top: 0;
    height: 3px;
    background: linear-gradient(
        90deg,
        var(--inv-stat-color),
        color-mix(in srgb, var(--inv-stat-color) 50%, transparent)
    );
    opacity: 0;
    transition: opacity 0.35s var(--inv-ease);
}

.inv-stat-card:hover::before {
    opacity: 1;
}

.inv-stat-card--users { --inv-stat-color: var(--inv-color-sky); }
.inv-stat-card--opportunities { --inv-stat-color: var(--inv-color-emerald); }
.inv-stat-card--investments { --inv-stat-color: var(--inv-color-amber); }
.inv-stat-card--revenue { --inv-stat-color: var(--inv-color-rose); }

@media (prefers-reduced-motion: reduce) {
    .inv-stat-card {
        animation: none !important;
    }

    .inv-stat-card:hover {
        transform: none;
    }
}

/* ── Invastro buttons (admin dashboard) ── */
.c-app .btn {
    --inv-btn-color: #fff;
    --inv-btn-shadow: rgba(15, 23, 42, 0.12);
    --inv-btn-focus: rgba(99, 102, 241, 0.35);
    position: relative;
    font-weight: 600;
    font-size: 0.875rem;
    letter-spacing: 0.02em;
    line-height: 1.45;
    border: none;
    border-radius: var(--inv-btn-radius);
    padding: 0.5rem 1.15rem;
    color: var(--inv-btn-color) !important;
    background: var(--inv-btn-bg, #64748b);
    box-shadow: 0 2px 8px var(--inv-btn-shadow);
    transition:
        transform 0.28s var(--inv-ease),
        box-shadow 0.28s var(--inv-ease),
        filter 0.28s var(--inv-ease),
        background 0.28s var(--inv-ease);
    overflow: hidden;
}

.c-app .btn::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, transparent 50%);
    pointer-events: none;
    opacity: 1;
    transition: opacity 0.28s var(--inv-ease);
}

.c-app .btn:hover:not(:disabled):not(.disabled) {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px var(--inv-btn-shadow);
    filter: brightness(1.06);
    color: var(--inv-btn-color) !important;
    background: var(--inv-btn-bg-hover, var(--inv-btn-bg));
}

.c-app .btn:active:not(:disabled):not(.disabled),
.c-app .btn.active:not(:disabled):not(.disabled) {
    transform: translateY(0);
    box-shadow: 0 2px 6px var(--inv-btn-shadow);
    filter: brightness(0.96);
}

.c-app .btn:focus,
.c-app .btn.focus {
    outline: none;
    box-shadow:
        0 2px 8px var(--inv-btn-shadow),
        0 0 0 3px var(--inv-btn-focus);
}

.c-app .btn:disabled,
.c-app .btn.disabled {
    opacity: 0.55;
    transform: none;
    filter: none;
    cursor: not-allowed;
}

/* Sizes */
.c-app .btn-sm,
.c-app .btn-group-sm > .btn {
    font-size: 0.8125rem;
    padding: 0.35rem 0.85rem;
    border-radius: 8px;
}

.c-app .btn-lg,
.c-app .btn-group-lg > .btn {
    font-size: 1rem;
    padding: 0.65rem 1.4rem;
    border-radius: 12px;
}

.c-app .btn-xs,
.c-app .btn-group-xs > .btn {
    font-size: 0.75rem;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    font-weight: 600;
}

.c-app .btn-pill,
.c-app .btn-pill.btn-xs,
.c-app .btn-pill.btn-sm {
    border-radius: 50rem;
}

/* Variants — filled gradients */
.c-app .btn-primary {
    --inv-btn-bg: linear-gradient(135deg, #818cf8 0%, #6366f1 50%, #4f46e5 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #a5b4fc 0%, #818cf8 50%, #6366f1 100%);
    --inv-btn-shadow: rgba(99, 102, 241, 0.45);
    --inv-btn-focus: rgba(99, 102, 241, 0.4);
}

.c-app .btn-success {
    --inv-btn-bg: linear-gradient(135deg, #4ade80 0%, #22c55e 50%, #16a34a 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #86efac 0%, #4ade80 50%, #22c55e 100%);
    --inv-btn-shadow: rgba(34, 197, 94, 0.45);
    --inv-btn-focus: rgba(34, 197, 94, 0.4);
}

.c-app .btn-info {
    --inv-btn-bg: linear-gradient(135deg, #7dd3fc 0%, #38bdf8 50%, #0ea5e9 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #bae6fd 0%, #7dd3fc 50%, #38bdf8 100%);
    --inv-btn-shadow: rgba(14, 165, 233, 0.45);
    --inv-btn-focus: rgba(14, 165, 233, 0.4);
}

.c-app .btn-warning {
    --inv-btn-color: #1e293b;
    --inv-btn-bg: linear-gradient(135deg, #fde68a 0%, #fbbf24 50%, #f59e0b 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #fef3c7 0%, #fde68a 50%, #fbbf24 100%);
    --inv-btn-shadow: rgba(245, 158, 11, 0.45);
    --inv-btn-focus: rgba(245, 158, 11, 0.4);
}

.c-app .btn-danger {
    --inv-btn-bg: linear-gradient(135deg, #fca5a5 0%, #f87171 50%, #ef4444 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #fecaca 0%, #fca5a5 50%, #f87171 100%);
    --inv-btn-shadow: rgba(239, 68, 68, 0.45);
    --inv-btn-focus: rgba(239, 68, 68, 0.4);
}

.c-app .btn-secondary {
    --inv-btn-bg: linear-gradient(135deg, #94a3b8 0%, #64748b 50%, #475569 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #cbd5e1 0%, #94a3b8 50%, #64748b 100%);
    --inv-btn-shadow: rgba(100, 116, 139, 0.4);
    --inv-btn-focus: rgba(100, 116, 139, 0.35);
}

.c-app .btn-dark {
    --inv-btn-bg: linear-gradient(135deg, #475569 0%, #334155 50%, #1e293b 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #64748b 0%, #475569 50%, #334155 100%);
    --inv-btn-shadow: rgba(30, 41, 59, 0.5);
    --inv-btn-focus: rgba(30, 41, 59, 0.4);
}

.c-app .btn-light {
    --inv-btn-color: #334155;
    --inv-btn-bg: linear-gradient(135deg, #fff 0%, #f8fafc 50%, #f1f5f9 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #fff 0%, #fff 50%, #f8fafc 100%);
    --inv-btn-shadow: rgba(15, 23, 42, 0.1);
    --inv-btn-focus: rgba(148, 163, 184, 0.35);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.c-app .btn-default {
    --inv-btn-color: #334155;
    --inv-btn-bg: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 50%, #e2e8f0 100%);
    --inv-btn-bg-hover: linear-gradient(135deg, #fff 0%, #f8fafc 50%, #f1f5f9 100%);
    --inv-btn-shadow: rgba(15, 23, 42, 0.1);
    --inv-btn-focus: rgba(148, 163, 184, 0.35);
    border: 1px solid rgba(15, 23, 42, 0.1);
}

/* Outline variants */
.c-app .btn-outline-primary {
    --inv-btn-color: #4f46e5;
    --inv-btn-bg: rgba(99, 102, 241, 0.1);
    --inv-btn-bg-hover: rgba(99, 102, 241, 0.18);
    --inv-btn-shadow: rgba(99, 102, 241, 0.2);
    --inv-btn-focus: rgba(99, 102, 241, 0.35);
    border: 1.5px solid #818cf8;
}

.c-app .btn-outline-success {
    --inv-btn-color: #16a34a;
    --inv-btn-bg: rgba(34, 197, 94, 0.1);
    --inv-btn-bg-hover: rgba(34, 197, 94, 0.18);
    --inv-btn-shadow: rgba(34, 197, 94, 0.2);
    --inv-btn-focus: rgba(34, 197, 94, 0.35);
    border: 1.5px solid #4ade80;
}

.c-app .btn-outline-info {
    --inv-btn-color: #0284c7;
    --inv-btn-bg: rgba(14, 165, 233, 0.1);
    --inv-btn-bg-hover: rgba(14, 165, 233, 0.18);
    --inv-btn-shadow: rgba(14, 165, 233, 0.2);
    --inv-btn-focus: rgba(14, 165, 233, 0.35);
    border: 1.5px solid #38bdf8;
}

.c-app .btn-outline-warning {
    --inv-btn-color: #b45309;
    --inv-btn-bg: rgba(245, 158, 11, 0.12);
    --inv-btn-bg-hover: rgba(245, 158, 11, 0.22);
    --inv-btn-shadow: rgba(245, 158, 11, 0.25);
    --inv-btn-focus: rgba(245, 158, 11, 0.35);
    border: 1.5px solid #fbbf24;
}

.c-app .btn-outline-danger {
    --inv-btn-color: #dc2626;
    --inv-btn-bg: rgba(239, 68, 68, 0.1);
    --inv-btn-bg-hover: rgba(239, 68, 68, 0.18);
    --inv-btn-shadow: rgba(239, 68, 68, 0.2);
    --inv-btn-focus: rgba(239, 68, 68, 0.35);
    border: 1.5px solid #f87171;
}

.c-app .btn-outline-secondary {
    --inv-btn-color: #475569;
    --inv-btn-bg: rgba(100, 116, 139, 0.1);
    --inv-btn-bg-hover: rgba(100, 116, 139, 0.18);
    --inv-btn-shadow: rgba(100, 116, 139, 0.2);
    --inv-btn-focus: rgba(100, 116, 139, 0.35);
    border: 1.5px solid #94a3b8;
}

.c-app .btn-outline-light,
.c-app .btn-outline-dark {
    border-width: 1.5px;
}

/* Link button */
.c-app .btn-link {
    --inv-btn-color: var(--inv-color-indigo);
    background: transparent !important;
    box-shadow: none !important;
    border: none;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    text-decoration: none;
}

.c-app .btn-link::after {
    display: none;
}

.c-app .btn-link:hover:not(:disabled):not(.disabled) {
    transform: none;
    filter: none;
    color: #4f46e5 !important;
    text-decoration: underline;
    box-shadow: none !important;
}

/* DataTables & button groups */
.c-app .dt-buttons .btn {
    margin-left: 0.35rem;
    margin-right: 0;
    border-radius: var(--inv-btn-radius) !important;
}

[dir="rtl"] .c-app .dt-buttons .btn {
    margin-left: 0;
    margin-right: 0.35rem;
}

.c-app .dt-buttons .btn:first-child {
    margin-left: 0;
}

[dir="rtl"] .c-app .dt-buttons .btn:first-child {
    margin-right: 0;
}

.c-app .btn-group .btn {
    border-radius: 0;
}

.c-app .btn-group .btn:first-child {
    border-start-start-radius: var(--inv-btn-radius);
    border-end-start-radius: var(--inv-btn-radius);
}

.c-app .btn-group .btn:last-child {
    border-start-end-radius: var(--inv-btn-radius);
    border-end-end-radius: var(--inv-btn-radius);
}

/* Table action buttons spacing */
.c-app table .btn-xs + .btn-xs,
.c-app table .btn-xs + form,
.c-app table form + .btn-xs {
    margin-inline-start: 0.25rem;
}

@media (prefers-reduced-motion: reduce) {
    .c-app .btn {
        transition-duration: 0.01ms !important;
    }

    .c-app .btn:hover:not(:disabled):not(.disabled) {
        transform: none;
    }
}

/* ── Invastro tables (admin dashboard) ── */
.c-app .table-responsive {
    border-radius: var(--inv-radius);
    border: 1px solid rgba(15, 23, 42, 0.07);
    box-shadow: var(--inv-shadow);
    overflow: hidden;
    background: var(--inv-surface);
}

.c-app .card-body table.table,
.c-app .card-body .dataTables_wrapper table.table,
.c-app .card-body .dataTables_wrapper table.dataTable {
    margin-bottom: 0;
}

.c-app table.table,
.c-app table.dataTable {
    width: 100% !important;
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--inv-surface);
    font-size: 0.875rem;
}

.c-app table.table thead,
.c-app table.dataTable thead {
    background: linear-gradient(180deg, #fafbff 0%, #f1f5f9 100%);
}

.c-app table.table thead tr,
.c-app table.dataTable thead tr {
    border-bottom: 2px solid #e0e7ff;
}

.c-app table.table thead th,
.c-app table.dataTable thead th {
    background: transparent !important;
    color: #475569 !important;
    font-weight: 600;
    font-size: 0.8125rem;
    text-transform: none;
    letter-spacing: 0.01em;
    border: none !important;
    border-bottom: none !important;
    padding: 0.95rem 1rem;
    vertical-align: middle;
    white-space: nowrap;
    position: relative;
    transition:
        color 0.2s var(--inv-ease),
        background 0.2s var(--inv-ease);
}

.c-app table.dataTable thead th.sorting:hover,
.c-app table.dataTable thead th.sorting_asc:hover,
.c-app table.dataTable thead th.sorting_desc:hover {
    color: #4f46e5 !important;
    background: rgba(99, 102, 241, 0.06) !important;
}

.c-app table.table tbody td,
.c-app table.dataTable tbody td {
    padding: 0.8rem 1rem;
    vertical-align: middle;
    color: var(--inv-text);
    border-color: rgba(15, 23, 42, 0.06) !important;
    transition:
        background-color 0.25s var(--inv-ease),
        color 0.25s var(--inv-ease);
}

.c-app table.table-bordered,
.c-app table.table-bordered td,
.c-app table.table-bordered th {
    border-color: rgba(15, 23, 42, 0.06);
}

.c-app table.table-bordered thead th {
    border-top: none !important;
    border-inline-color: transparent !important;
}

.c-app table.table-striped tbody tr:nth-of-type(odd) td,
.c-app table.dataTable.table-striped tbody tr:nth-of-type(odd) td,
.c-app table.dataTable.stripe tbody tr.odd,
.c-app table.dataTable.stripe tbody tr.odd td {
    background-color: rgba(248, 250, 252, 0.9);
}

.c-app table.table-hover tbody tr:hover td,
.c-app table.dataTable.table-hover tbody tr:hover td,
.c-app table.dataTable.hover tbody tr:hover td {
    background-color: rgba(99, 102, 241, 0.07) !important;
    color: var(--inv-text);
}

.c-app table.table tbody tr,
.c-app table.dataTable tbody tr {
    transition: box-shadow 0.25s var(--inv-ease);
}

.c-app table.table-hover tbody tr:hover,
.c-app table.dataTable.hover tbody tr:hover {
    box-shadow: inset 3px 0 0 var(--inv-color-indigo);
}

[dir="rtl"] .c-app table.table-hover tbody tr:hover,
[dir="rtl"] .c-app table.dataTable.hover tbody tr:hover {
    box-shadow: inset -3px 0 0 var(--inv-color-indigo);
}

/* Selected rows (DataTables Select) */
.c-app table.dataTable tbody tr.selected td,
.c-app table.dataTable tbody tr.selected:hover td {
    background-color: rgba(99, 102, 241, 0.14) !important;
    color: var(--inv-text);
}

.c-app table.dataTable tbody td.select-checkbox::before,
.c-app table.dataTable tbody td.select-checkbox::after,
.c-app table.dataTable tbody th.select-checkbox::before,
.c-app table.dataTable tbody th.select-checkbox::after {
    top: 50%;
    border-color: #94a3b8;
    transition: border-color 0.2s var(--inv-ease), background 0.2s var(--inv-ease);
}

.c-app table.dataTable tbody tr.selected td.select-checkbox::after {
    background: var(--inv-color-indigo);
    border-color: var(--inv-color-indigo);
}

/* Sortable column headers */
.c-app table.dataTable thead .sorting,
.c-app table.dataTable thead .sorting_asc,
.c-app table.dataTable thead .sorting_desc {
    background-image: none !important;
    padding-inline-end: 2rem !important;
    cursor: pointer;
}

.c-app table.dataTable thead .sorting::after,
.c-app table.dataTable thead .sorting_asc::after,
.c-app table.dataTable thead .sorting_desc::after {
    content: "";
    position: absolute;
    inset-inline-end: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 4px;
    background-color: rgba(148, 163, 184, 0.15);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0.55rem;
    opacity: 1;
}

.c-app table.dataTable thead .sorting::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 12' fill='%2394a3b8'%3E%3Cpath d='M5 0L9 4H6v8H4V4H1z'/%3E%3Cpath d='M5 12L1 8h3V0h2v8h3z' opacity='.4'/%3E%3C/svg%3E");
}

.c-app table.dataTable thead .sorting_asc::after {
    background-color: rgba(99, 102, 241, 0.12);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6' fill='%236366f1'%3E%3Cpath d='M5 0l5 6H0z'/%3E%3C/svg%3E");
}

.c-app table.dataTable thead .sorting_desc::after {
    background-color: rgba(99, 102, 241, 0.12);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6' fill='%236366f1'%3E%3Cpath d='M5 6L0 0h10z'/%3E%3C/svg%3E");
}

/* Checkbox column header */
.c-app table.dataTable thead th.select-checkbox::before,
.c-app table.dataTable thead th.select-checkbox::after {
    border-color: #94a3b8;
}

/* DataTables wrapper & controls */
.c-app .dataTables_wrapper {
    padding: 0.15rem 0 0.5rem;
}

.c-app .dataTables_wrapper .dataTables_length,
.c-app .dataTables_wrapper .dataTables_filter,
.c-app .dataTables_wrapper .dt-buttons {
    margin-bottom: 0.85rem;
    margin-top: 0.15rem;
}

.c-app .dataTables_wrapper .dataTables_filter {
    margin-inline-end: 0.25rem;
}

.c-app .dataTables_wrapper .dataTables_filter label,
.c-app .dataTables_wrapper .dataTables_length label {
    font-weight: 500;
    color: var(--inv-text-muted);
    font-size: 0.875rem;
    margin-bottom: 0;
}

.c-app .dataTables_wrapper .dataTables_length label {
    display: inline-flex;
    align-items: center;
}

.c-app .dataTables_wrapper .dataTables_filter input {
    margin-inline-start: 0.5rem;
    padding: 0.45rem 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 8px;
    background: var(--inv-surface);
    color: var(--inv-text);
    font-size: 0.875rem;
    transition:
        border-color 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease);
}

.c-app .dataTables_wrapper .dataTables_filter input:focus {
    outline: none;
    border-color: var(--inv-color-indigo);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.c-app .dataTables_wrapper .dataTables_length select {
    margin-inline: 0.35rem;
    padding: 0.35rem 1.75rem 0.35rem 0.65rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 8px;
    background-color: var(--inv-surface);
    color: var(--inv-text);
    font-size: 0.875rem;
    transition: border-color 0.25s var(--inv-ease), box-shadow 0.25s var(--inv-ease);
}

.c-app .dataTables_wrapper .dataTables_length select:focus {
    outline: none;
    border-color: var(--inv-color-indigo);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.c-app .dataTables_wrapper .dataTables_info {
    padding-top: 0.85rem;
    font-size: 0.8125rem;
    color: var(--inv-text-muted);
    font-weight: 500;
}

.c-app .dataTables_wrapper .dataTables_paginate {
    padding-top: 0.75rem;
}

.c-app .dataTables_wrapper .dataTables_paginate .paginate_button {
    display: inline-block;
    min-width: 2.1rem;
    margin: 0 0.15rem !important;
    padding: 0.4rem 0.7rem !important;
    border: 1px solid rgba(15, 23, 42, 0.1) !important;
    border-radius: 8px !important;
    background: var(--inv-surface) !important;
    color: var(--inv-text) !important;
    font-weight: 600;
    font-size: 0.8125rem !important;
    line-height: 1.3;
    transition:
        background 0.25s var(--inv-ease),
        border-color 0.25s var(--inv-ease),
        color 0.25s var(--inv-ease),
        transform 0.25s var(--inv-ease) !important;
}

.c-app .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled) {
    background: rgba(99, 102, 241, 0.1) !important;
    border-color: rgba(99, 102, 241, 0.35) !important;
    color: #4f46e5 !important;
    transform: translateY(-1px);
}

.c-app .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.c-app .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: linear-gradient(135deg, #818cf8 0%, #6366f1 100%) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.35);
    transform: none;
}

.c-app .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.c-app .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    opacity: 0.4;
    cursor: not-allowed;
    transform: none;
    background: var(--inv-surface-muted) !important;
    color: var(--inv-text-muted) !important;
}

.c-app .dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

/* Processing overlay */
.c-app .dataTables_wrapper .dataTables_processing {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(99, 102, 241, 0.2);
    border-radius: var(--inv-radius);
    color: var(--inv-color-indigo);
    font-weight: 600;
    box-shadow: var(--inv-shadow);
}

/* Labels & badges inside tables */
.c-app table .label,
.c-app table .badge {
    border-radius: 6px;
    padding: 0.28em 0.55em;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.c-app table .label-info,
.c-app table .badge-info {
    background: rgba(14, 165, 233, 0.15);
    color: #0284c7;
}

.c-app table .label-success,
.c-app table .badge-success {
    background: rgba(34, 197, 94, 0.15);
    color: #16a34a;
}

.c-app table .label-warning,
.c-app table .badge-warning {
    background: rgba(245, 158, 11, 0.15);
    color: #b45309;
}

.c-app table .label-danger,
.c-app table .badge-danger {
    background: rgba(239, 68, 68, 0.15);
    color: #dc2626;
}

/* Empty / no-data row */
.c-app table.table tbody tr td[colspan] {
    text-align: center;
    color: var(--inv-text-muted);
    font-weight: 500;
    padding: 2rem 1rem !important;
    background: var(--inv-surface-muted) !important;
}

/* Subtle row entrance (static tables only) */
.c-app .card-body table.table:not(.dataTable) tbody tr {
    animation: inv-table-row-in 0.45s var(--inv-ease) backwards;
}

.c-app .card-body table.table:not(.dataTable) tbody tr:nth-child(1) { animation-delay: 0.04s; }
.c-app .card-body table.table:not(.dataTable) tbody tr:nth-child(2) { animation-delay: 0.08s; }
.c-app .card-body table.table:not(.dataTable) tbody tr:nth-child(3) { animation-delay: 0.12s; }
.c-app .card-body table.table:not(.dataTable) tbody tr:nth-child(4) { animation-delay: 0.16s; }
.c-app .card-body table.table:not(.dataTable) tbody tr:nth-child(5) { animation-delay: 0.20s; }

@keyframes inv-table-row-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Standalone tables (not inside a card) keep their own frame */
.c-app .content > table.table:not(.dataTable),
.c-app .content > .row table.table:not(.dataTable) {
    border-radius: var(--inv-radius);
    border: 1px solid rgba(15, 23, 42, 0.07);
    box-shadow: var(--inv-shadow);
    overflow: hidden;
}

/* Card already provides the frame — avoid a nested “card inside card” */
.c-app .card-body > table.table,
.c-app .card-body .mt-5 > table.table,
.c-app .card-body .dataTables_wrapper table.table,
.c-app .card-body .dataTables_wrapper table.dataTable {
    border-radius: 0;
    border: none;
    box-shadow: none;
    overflow: visible;
}

.c-app .card-body .table-responsive {
    border: none;
    box-shadow: none;
    border-radius: 0;
    background: transparent;
}

@media (prefers-reduced-motion: reduce) {
    .c-app table.table tbody tr,
    .c-app table.dataTable tbody tr,
    .c-app .card-body table.table:not(.dataTable) tbody tr {
        animation: none !important;
        transition-duration: 0.01ms !important;
    }

    .c-app .dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.disabled) {
        transform: none;
    }
}

/* ── Invastro forms & inputs ── */
.c-app .form-group {
    margin-bottom: 1.35rem;
}

.c-app .form-group label,
.c-app label.col-form-label {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--inv-text);
    margin-bottom: 0.45rem;
}

.c-app .form-group label.required::after,
.c-app .form-group .required::after,
.c-app label.required::after {
    content: " *";
    color: #f87171;
    font-weight: 700;
}

.c-app .help-block {
    display: block;
    margin-top: 0.4rem;
    font-size: 0.8125rem;
    color: var(--inv-text-muted);
    line-height: 1.45;
}

/* Text inputs, textareas, native selects */
.c-app .form-control {
    border: 1px solid var(--inv-input-border);
    border-radius: var(--inv-input-radius);
    padding: 0.55rem 0.9rem;
    font-size: 0.875rem;
    line-height: 1.5;
    color: var(--inv-text);
    background-color: var(--inv-input-bg);
    transition:
        border-color 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease),
        background-color 0.25s var(--inv-ease);
}

.c-app .form-control:focus {
    color: var(--inv-text);
    background-color: var(--inv-input-bg);
    border-color: var(--inv-color-indigo);
    box-shadow: 0 0 0 3px var(--inv-input-focus);
    outline: none;
}

.c-app .form-control::placeholder {
    color: #94a3b8;
    opacity: 1;
}

.c-app textarea.form-control,
.c-app .ck-editor__editable {
    min-height: 120px;
    resize: vertical;
}

/* Native select — match Select2 look (exclude hidden Select2 originals) */
.c-app select.form-control:not(.select2-hidden-accessible),
.c-app select.custom-select:not(.select2-hidden-accessible),
.c-app .form-group > select:not(.select2-hidden-accessible),
.c-app form select:not(.select2-hidden-accessible) {
    display: block;
    width: 100%;
    min-height: calc(1.5em + 1.1rem + 2px);
    padding: 0.55rem 2.5rem 0.55rem 0.9rem;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.5;
    color: var(--inv-text);
    background-color: var(--inv-input-bg);
    border: 1px solid var(--inv-input-border);
    border-radius: var(--inv-input-radius);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236366f1'%3E%3Cpath d='M4.427 6.427l3.396 3.396a.25.25 0 00.354 0l3.396-3.396A.25.25 0 0011.396 6H4.604a.25.25 0 00-.177.427z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.85rem center;
    background-size: 1.05rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition:
        border-color 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease),
        background-color 0.25s var(--inv-ease);
}

[dir="rtl"] .c-app select.form-control:not(.select2-hidden-accessible),
[dir="rtl"] .c-app select.custom-select:not(.select2-hidden-accessible),
[dir="rtl"] .c-app .form-group > select:not(.select2-hidden-accessible),
[dir="rtl"] .c-app form select:not(.select2-hidden-accessible) {
    padding: 0.55rem 0.9rem 0.55rem 2.5rem;
    background-position: left 0.85rem center;
}

.c-app select.form-control:not(.select2-hidden-accessible):hover,
.c-app select.custom-select:not(.select2-hidden-accessible):hover,
.c-app .form-group > select:not(.select2-hidden-accessible):hover,
.c-app form select:not(.select2-hidden-accessible):hover {
    border-color: rgba(99, 102, 241, 0.45);
    background-color: #fafbff;
}

.c-app select.form-control:not(.select2-hidden-accessible):focus,
.c-app select.custom-select:not(.select2-hidden-accessible):focus,
.c-app .form-group > select:not(.select2-hidden-accessible):focus,
.c-app form select:not(.select2-hidden-accessible):focus {
    border-color: var(--inv-color-indigo);
    box-shadow: 0 0 0 3px var(--inv-input-focus);
    outline: none;
    background-color: var(--inv-input-bg);
}

.c-app select.form-control:not(.select2-hidden-accessible):disabled,
.c-app select.custom-select:not(.select2-hidden-accessible):disabled {
    background-color: var(--inv-surface-muted);
    color: var(--inv-text-muted);
    cursor: not-allowed;
    opacity: 1;
}

.c-app select.form-control:not(.select2-hidden-accessible) option,
.c-app select.custom-select:not(.select2-hidden-accessible) option {
    padding: 0.5rem;
    font-weight: 500;
    color: var(--inv-text);
    background: var(--inv-surface);
}

.c-app select.form-control:not(.select2-hidden-accessible) option:checked {
    background: linear-gradient(0deg, rgba(99, 102, 241, 0.12), rgba(99, 102, 241, 0.12));
    color: #4f46e5;
}

.c-app .form-control:disabled,
.c-app .form-control[readonly] {
    background-color: var(--inv-surface-muted);
    color: var(--inv-text-muted);
    border-color: rgba(15, 23, 42, 0.08);
    opacity: 1;
    cursor: default;
}

.c-app .card-body .form-control[readonly],
.c-app .card-body .form-control:disabled {
    border-style: dashed;
}

.c-app .form-control-sm,
.c-app .custom-select.form-control-sm {
    padding: 0.35rem 0.7rem;
    font-size: 0.8125rem;
    border-radius: 8px;
}

.c-app .form-control-lg {
    padding: 0.7rem 1rem;
    font-size: 1rem;
    border-radius: 12px;
}

/* Validation */
.c-app input.form-control.is-invalid,
.c-app textarea.form-control.is-invalid,
.c-app .was-validated input.form-control:invalid,
.c-app .was-validated textarea.form-control:invalid {
    border-color: #f87171;
    background-image: none;
}

.c-app select.form-control.is-invalid:not(.select2-hidden-accessible),
.c-app select.custom-select.is-invalid:not(.select2-hidden-accessible),
.c-app .was-validated select.form-control:invalid:not(.select2-hidden-accessible) {
    border-color: #f87171;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ef4444'%3E%3Cpath d='M4.427 6.427l3.396 3.396a.25.25 0 00.354 0l3.396-3.396A.25.25 0 0011.396 6H4.604a.25.25 0 00-.177.427z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.85rem center;
    background-size: 1.05rem;
    padding-inline-end: 2.5rem;
}

[dir="rtl"] .c-app select.form-control.is-invalid:not(.select2-hidden-accessible),
[dir="rtl"] .c-app select.custom-select.is-invalid:not(.select2-hidden-accessible) {
    background-position: left 0.85rem center;
}

.c-app .form-control.is-invalid:focus,
.c-app .was-validated .form-control:invalid:focus {
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(248, 113, 113, 0.22);
}

.c-app .invalid-feedback {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #dc2626;
}

.c-app .form-check.is-invalid ~ .invalid-feedback {
    display: block;
}

.c-app .has-error .invalid-feedback {
    display: block !important;
}

/* Checkboxes & radios */
.c-app .form-check {
    position: relative;
    padding-inline-start: 1.65rem;
    margin-bottom: 0.5rem;
    min-height: 1.35rem;
}

.c-app .form-check-input {
    width: 1.1rem;
    height: 1.1rem;
    margin-top: 0.15rem;
    margin-inline-start: -1.65rem;
    border: 2px solid #cbd5e1;
    transition:
        background-color 0.2s var(--inv-ease),
        border-color 0.2s var(--inv-ease),
        box-shadow 0.2s var(--inv-ease);
}

.c-app .form-check-input:checked {
    background-color: var(--inv-color-indigo);
    border-color: var(--inv-color-indigo);
}

.c-app .form-check-input:focus {
    border-color: var(--inv-color-indigo);
    box-shadow: 0 0 0 3px var(--inv-input-focus);
}

.c-app .form-check-label {
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--inv-text);
    cursor: pointer;
}

/* Select2 */
.c-app .select2-container {
    width: 100% !important;
    max-width: 100%;
}

.c-app .select2-container--default .select2-selection--single,
.c-app .select2-container--default .select2-selection--multiple {
    border: 1px solid var(--inv-input-border);
    border-radius: var(--inv-input-radius);
    min-height: calc(1.5em + 1.1rem + 2px);
    background-color: var(--inv-input-bg);
    transition:
        border-color 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease);
}

.c-app .select2-container--default .select2-selection--single {
    padding: 0.4rem 0.5rem;
}

.c-app .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--inv-text);
    line-height: 1.5;
    padding-inline: 0.4rem 1.75rem;
    padding-bottom: 0;
}

.c-app .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
    inset-inline-end: 0.5rem;
}

.c-app .select2-container--default .select2-selection--multiple {
    padding: 0.3rem 0.4rem;
}

.c-app .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding: 0;
}

.c-app .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: rgba(99, 102, 241, 0.12);
    border: none;
    border-radius: 6px;
    color: #4f46e5;
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    margin: 0.15rem 0.25rem 0.15rem 0;
}

.c-app .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #6366f1;
    margin-inline-end: 0.25rem;
}

.c-app .select2-container--default.select2-container--focus .select2-selection--single,
.c-app .select2-container--default.select2-container--focus .select2-selection--multiple,
.c-app .select2-container--default.select2-container--open .select2-selection--single,
.c-app .select2-container--default.select2-container--open .select2-selection--multiple {
    border-color: var(--inv-color-indigo);
    box-shadow: 0 0 0 3px var(--inv-input-focus);
    outline: none;
}

.c-app .select2-container--default.select2-container--disabled .select2-selection--single,
.c-app .select2-container--default.select2-container--disabled .select2-selection--multiple {
    background-color: var(--inv-surface-muted);
    opacity: 1;
}

.c-app .select2-dropdown {
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: var(--inv-input-radius);
    box-shadow: var(--inv-shadow-hover);
    overflow: hidden;
}

.c-app .select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--inv-input-border);
    border-radius: 8px;
    padding: 0.4rem 0.65rem;
    font-size: 0.875rem;
}

.c-app .select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--inv-color-indigo);
    box-shadow: 0 0 0 3px var(--inv-input-focus);
    outline: none;
}

.c-app .select2-container--default .select2-results__option {
    padding: 0.5rem 0.85rem;
    font-size: 0.875rem;
}

.c-app .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--inv-color-indigo);
    color: #fff;
}

.c-app .select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: rgba(99, 102, 241, 0.1);
    color: #4f46e5;
}

.c-app .is-invalid + .select2-container .select2-selection,
.c-app .select2-container.is-invalid .select2-selection {
    border-color: #f87171;
}

/* Dropzone */
.c-app .dropzone {
    border: 2px dashed rgba(99, 102, 241, 0.35);
    border-radius: var(--inv-radius);
    background: rgba(99, 102, 241, 0.04);
    min-height: 140px;
    padding: 1.5rem;
    transition:
        border-color 0.3s var(--inv-ease),
        background 0.3s var(--inv-ease),
        box-shadow 0.3s var(--inv-ease);
}

.c-app .dropzone:hover,
.c-app .dropzone.dz-drag-hover {
    border-color: var(--inv-color-indigo);
    background: rgba(99, 102, 241, 0.08);
    box-shadow: 0 0 0 3px var(--inv-input-focus);
}

.c-app .dropzone .dz-message {
    color: var(--inv-text-muted);
    font-weight: 500;
    font-size: 0.9rem;
    margin: 1rem 0;
}

.c-app .dropzone .dz-preview {
    border-radius: 10px;
    overflow: hidden;
}

.c-app .dropzone.is-invalid {
    border-color: #f87171;
    background: rgba(248, 113, 113, 0.05);
}

/* CKEditor */
.c-app .ck.ck-editor {
    border-radius: var(--inv-input-radius);
    overflow: hidden;
    box-shadow: none;
}

.c-app .ck.ck-toolbar {
    border: 1px solid var(--inv-input-border) !important;
    border-bottom: none !important;
    border-radius: var(--inv-input-radius) var(--inv-input-radius) 0 0 !important;
    background: var(--inv-surface-muted) !important;
}

.c-app .ck.ck-editor__main > .ck-editor__editable {
    min-height: 150px;
    border: 1px solid var(--inv-input-border) !important;
    border-radius: 0 0 var(--inv-input-radius) var(--inv-input-radius) !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.875rem;
    color: var(--inv-text);
    transition:
        border-color 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease);
}

.c-app .ck.ck-editor__main > .ck-editor__editable:not(.ck-focused) {
    border-color: var(--inv-input-border) !important;
}

.c-app .ck.ck-editor__main > .ck-editor__editable.ck-focused {
    border-color: var(--inv-color-indigo) !important;
    box-shadow: 0 0 0 3px var(--inv-input-focus) !important;
}

/* Date / time pickers */
.c-app .bootstrap-datetimepicker-widget {
    border-radius: var(--inv-radius);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: var(--inv-shadow-hover);
    padding: 0.5rem;
}

.c-app .bootstrap-datetimepicker-widget table td.active,
.c-app .bootstrap-datetimepicker-widget table td.active:hover {
    background: var(--inv-color-indigo);
    border-radius: 6px;
}

.c-app .bootstrap-datetimepicker-widget table td.today::before {
    border-bottom-color: var(--inv-color-indigo);
}

/* Form alerts */
.c-app .card-body > .alert {
    border: none;
    border-radius: var(--inv-input-radius);
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 1.25rem;
}

.c-app .alert-success {
    background: rgba(34, 197, 94, 0.12);
    color: #16a34a;
}

.c-app .alert-danger {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.c-app .alert-warning {
    background: rgba(245, 158, 11, 0.12);
    color: #b45309;
}

.c-app .alert-info {
    background: rgba(14, 165, 233, 0.12);
    color: #0284c7;
}

/* Submit row */
.c-app form .form-group:last-child {
    margin-bottom: 0;
    padding-top: 0.5rem;
}

.c-app form .form-group:has(button[type="submit"]),
.c-app form .form-group:has(input[type="submit"]) {
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    border-top: 1px solid rgba(15, 23, 42, 0.06);
} 

/* ── Invastro layout, cards & header ── */
.c-app .c-body {
    background: linear-gradient(180deg, #f1f5f9 0%, #f8fafc 40%, #f1f5f9 100%);
}

.c-app .c-main {
    padding-top: 0.5rem;
}

.c-app .container-fluid {
    padding-top: 1rem;
    padding-bottom: 2rem;
}

.c-app .content {
    animation: inv-page-in 0.45s var(--inv-ease);
}

@keyframes inv-page-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Top action row (Add buttons above cards) */
.c-app .container-fluid > .row,
.c-app .content > .row {
    margin-bottom: 1rem;
}

.c-app .container-fluid > .alert,
.c-app .container-fluid > .row > .col-lg-12 > .alert {
    border-radius: var(--inv-input-radius);
    border: none;
}

/* Cards */
.c-app .card {
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: var(--inv-radius);
    background: var(--inv-surface);
    box-shadow: var(--inv-shadow);
    overflow: hidden;
    margin-bottom: 1.5rem;
    transition:
        box-shadow 0.35s var(--inv-ease),
        transform 0.35s var(--inv-ease);
    animation: inv-card-in 0.5s var(--inv-ease) backwards;
}

@keyframes inv-card-in {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.c-app .container-fluid > .card,
.c-app .content > .card,
.c-app .content .row > .col-lg-12 > .card {
    animation-delay: 0.06s;
}

.c-app .card:hover {
    box-shadow: var(--inv-shadow-hover);
}

.c-app .card-header {
    position: relative;
    padding: 1rem 1.25rem;
    background: linear-gradient(180deg, #fafbff 0%, #f1f5f9 100%);
    border-bottom: 2px solid #e0e7ff;
    font-weight: 700;
    font-size: 1rem;
    color: var(--inv-text);
    letter-spacing: 0.01em;
}

.c-app .card-header::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #818cf8, #6366f1);
    border-radius: 0 4px 4px 0;
}

[dir="rtl"] .c-app .card-header::before {
    border-radius: 4px 0 0 4px;
}

.c-app .card-header:first-child {
    padding-inline-start: 1.35rem;
}

.c-app .card-body {
    padding: 1.35rem 1.25rem;
}

.c-app .card-footer {
    padding: 0.85rem 1.25rem;
    background: var(--inv-surface-muted);
    border-top: 1px solid rgba(15, 23, 42, 0.06);
}

/* Nested cards (e.g. permissions) */
.c-app .card .card {
    box-shadow: none;
    border: 1px solid rgba(15, 23, 42, 0.08);
    margin-bottom: 1rem;
    animation: none;
}

.c-app .card .card:hover {
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
}

.c-app .card .card .card-header {
    padding: 0.75rem 1rem;
    padding-inline-start: 1.15rem;
    font-size: 0.875rem;
    font-weight: 600;
}

.c-app .card .card .card-header::before {
    width: 3px;
}

.c-app .card .card .card-body {
    padding: 1rem;
}

/* Section headings inside cards (charts, widgets) */
.c-app .card-body > h3,
.c-app .card-body .mt-5 > h3 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--inv-text);
    margin-bottom: 1rem;
    padding-bottom: 0.55rem;
    border-bottom: 2px solid #e0e7ff;
    position: relative;
}

.c-app .card-body > h3::after,
.c-app .card-body .mt-5 > h3::after {
    content: "";
    position: absolute;
    bottom: -2px;
    inset-inline-start: 0;
    width: 3rem;
    height: 2px;
    background: linear-gradient(90deg, #6366f1, transparent);
    border-radius: 2px;
}

/* Top header bar */
.c-app .c-header.inv-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: nowrap;
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    direction: inherit;
}

.c-app .c-header {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: 0 2px 16px rgba(15, 23, 42, 0.06);
    min-height: 3.5rem;
}

.inv-header__start {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
    flex: 1 1 auto;
}

.inv-header__brand {
    font-weight: 700;
    background: linear-gradient(90deg, #6366f1, #8b5cf6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.inv-header__nav {
    display: flex;
    align-items: center;
    gap: 0.15rem;
    flex-shrink: 0;
    margin-inline-start: auto;
}

/* Header dropdowns: align inward from each header zone (overrides CoreUI/Bootstrap) */
.c-app .inv-header .dropdown {
    position: relative;
}

.c-app .inv-header .inv-header-dropdown-menu,
.c-app .inv-header .dropdown-menu {
    position: absolute !important;
    top: 100% !important;
    bottom: auto !important;
    float: none !important;
    text-align: start;
}

/* Nav tools (right in LTR, left in RTL) */
[dir="ltr"] .c-app .inv-header .inv-header__nav .dropdown-menu {
    left: auto !important;
    right: 0 !important;
    transform-origin: top right;
}

[dir="rtl"] .c-app .inv-header .inv-header__nav .dropdown-menu {
    left: 0 !important;
    right: auto !important;
    transform-origin: top left;
}

/* Quick links (left in LTR, right in RTL) */
[dir="ltr"] .c-app .inv-header .inv-header__start .dropdown-menu {
    left: 0 !important;
    right: auto !important;
    transform-origin: top left;
}

[dir="rtl"] .c-app .inv-header .inv-header__start .dropdown-menu {
    left: auto !important;
    right: 0 !important;
    transform-origin: top right;
}

/* Shortcut pills */
.inv-header-shortcuts {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-inline-start: 0.5rem;
    padding-inline-start: 0.75rem;
    border-inline-start: 1px solid rgba(15, 23, 42, 0.08);
    overflow-x: auto;
    scrollbar-width: none;
}

.inv-header-shortcuts::-webkit-scrollbar {
    display: none;
}

.inv-header-shortcut {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--inv-text-muted);
    text-decoration: none !important;
    white-space: nowrap;
    transition:
        color 0.25s var(--inv-ease),
        background 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease),
        transform 0.25s var(--inv-ease);
}

.inv-header-shortcut:hover {
    color: var(--inv-color-indigo);
    background: rgba(99, 102, 241, 0.08);
    transform: translateY(-1px);
}

.inv-header-shortcut.is-active {
    color: #4f46e5;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.14), rgba(139, 92, 246, 0.1));
    box-shadow: 0 2px 10px rgba(99, 102, 241, 0.18);
}

.inv-header-shortcut__icon {
    font-size: 0.8rem;
    width: 1.25rem;
    height: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.06);
    transition: background 0.25s var(--inv-ease), color 0.25s var(--inv-ease);
}

.inv-header-shortcut.is-active .inv-header-shortcut__icon,
.inv-header-shortcut:hover .inv-header-shortcut__icon {
    background: rgba(255, 255, 255, 0.85);
}

.inv-header-shortcut__icon--dashboard { color: #38bdf8; }
.inv-header-shortcut__icon--customers { color: #34d399; }
.inv-header-shortcut__icon--ads { color: #f472b6; }
.inv-header-shortcut__icon--requests { color: #fbbf24; }
.inv-header-shortcut__icon--complaints { color: #fb923c; }
.inv-header-shortcut__icon--contact { color: #60a5fa; }
.inv-header-shortcut__icon--settings { color: #94a3b8; }

.inv-header-shortcuts-menu {
    min-width: 14rem;
}

.inv-header-shortcuts-menu .dropdown-item.active {
    background: rgba(99, 102, 241, 0.12);
    color: #4f46e5;
    font-weight: 600;
}

.inv-icon--dashboard { color: #38bdf8; }
.inv-icon--customers { color: #34d399; }
.inv-icon--ads { color: #f472b6; }
.inv-icon--requests { color: #fbbf24; }
.inv-icon--complaints { color: #fb923c; }
.inv-icon--contact { color: #60a5fa; }
.inv-icon--settings { color: #94a3b8; }

.inv-header-dropdown-menu__icon {
    margin-inline-end: 0.5rem;
}

/* Header icon buttons */
.inv-header-icon-btn,
.inv-header-user-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.55rem;
    border: none;
    background: transparent;
    border-radius: 10px;
    color: var(--inv-text-muted);
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1;
    cursor: pointer;
    position: relative;
    transition:
        color 0.25s var(--inv-ease),
        background 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease);
}

.inv-header-icon-btn:hover,
.inv-header-icon-btn:focus,
.inv-header-user-btn:hover,
.inv-header-user-btn:focus {
    color: var(--inv-color-indigo);
    background: rgba(99, 102, 241, 0.08);
    outline: none;
    box-shadow: none;
}

.inv-header-icon-btn::after,
.inv-header-user-btn::after {
    margin-inline-start: 0.35rem;
    margin-inline-end: 0;
}

[dir="rtl"] .inv-header .dropdown-toggle::after {
    margin-inline-start: 0;
    margin-inline-end: 0.35rem;
}

.inv-header-lang {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.inv-header-badge {
    position: absolute;
    top: 0.15rem;
    inset-inline-end: 0.1rem;
    min-width: 1.1rem;
    height: 1.1rem;
    padding: 0 0.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
    color: #1e293b;
    background: linear-gradient(135deg, #fde68a, #f59e0b);
    border-radius: 50rem;
    box-shadow: 0 2px 6px rgba(245, 158, 11, 0.4);
    border: 2px solid #fff;
}

/* Notifications dropdown */
.inv-header-notifications {
    min-width: 18rem;
    max-width: 22rem;
    padding: 0;
    overflow: hidden;
}

.inv-header-notifications .dropdown-header {
    padding: 0.75rem 1rem;
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--inv-text-muted);
    background: linear-gradient(180deg, #fafbff, #f8fafc);
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.inv-header-notifications__count {
    background: linear-gradient(135deg, #818cf8, #6366f1) !important;
    color: #fff !important;
    font-size: 0.7rem;
}

.inv-header-notifications__list {
    max-height: 16rem;
    overflow-y: auto;
}

.inv-header-notification {
    display: flex !important;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.65rem 1rem !important;
    white-space: normal;
}

.inv-header-notification__dot {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    margin-top: 0.35rem;
    border-radius: 50%;
    background: transparent;
}

.inv-header-notification.is-unread .inv-header-notification__dot {
    background: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.inv-header-notification.is-unread .inv-header-notification__text {
    font-weight: 700;
    color: var(--inv-text);
}

.inv-header-notifications__footer {
    font-weight: 600;
    font-size: 0.8rem;
    color: #4f46e5 !important;
    background: #fafbff;
}

/* My notifications page */
.inv-notifications-page .card-header {
    gap: 0.75rem;
}

.inv-notifications-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.inv-notification-card {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: var(--inv-input-radius);
    background: #fff;
    transition:
        border-color 0.25s var(--inv-ease),
        box-shadow 0.25s var(--inv-ease),
        background 0.25s var(--inv-ease);
}

.inv-notification-card:hover {
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.inv-notification-card.is-unread {
    border-color: rgba(99, 102, 241, 0.35);
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.06), rgba(255, 255, 255, 1));
}

.inv-notification-card__main {
    flex: 1 1 16rem;
    min-width: 0;
}

.inv-notification-card__head {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

.inv-notification-card__dot {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    margin-top: 0.4rem;
    border-radius: 50%;
    background: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.inv-notification-card__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--inv-text);
    line-height: 1.4;
}

.inv-notification-card__body {
    margin: 0 0 0.5rem;
    color: var(--inv-text-muted);
    font-size: 0.9rem;
    line-height: 1.5;
}

.inv-notification-card__meta {
    font-size: 0.8rem;
}

.inv-notification-card__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.inv-notification-card__read-badge {
    padding: 0.45rem 0.65rem;
    font-size: 0.75rem;
}

.inv-notifications-pagination .pagination {
    margin-bottom: 0;
}

[dir="rtl"] .inv-notification-card__actions .btn i,
[dir="rtl"] .inv-notification-card__meta i {
    margin-inline-end: 0.35rem;
}

/* User menu */
.inv-header-user-btn {
    padding-inline-start: 0.35rem;
}

.inv-header-user__avatar,
.inv-header-user-menu__avatar {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #818cf8, #6366f1);
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.35);
}

.inv-header-user__name {
    max-width: 8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.8rem;
}

.inv-header-user-menu {
    min-width: 15rem;
    padding: 0;
    overflow: hidden;
}

.inv-header-user-menu__head {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.08), rgba(139, 92, 246, 0.06));
}

.inv-header-user-menu__title {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--inv-text);
}

.inv-header-user-menu__email {
    font-size: 0.75rem;
    color: var(--inv-text-muted);
    word-break: break-all;
}

.inv-header-user-menu .dropdown-item {
    padding: 0.55rem 1rem;
}

.inv-header-user-menu .dropdown-item i {
    width: 1.25rem;
    margin-inline-end: 0.5rem;
    color: var(--inv-text-muted);
}

@media (max-width: 1199.98px) {
    .inv-header-shortcut__label {
        display: none;
    }
}

.c-app .c-header-brand {
    font-weight: 700;
    color: var(--inv-text);
}

.c-app .c-header-toggler {
    color: var(--inv-text-muted);
    border-radius: 8px;
    transition:
        color 0.25s var(--inv-ease),
        background 0.25s var(--inv-ease);
}

.c-app .c-header-toggler:hover {
    color: var(--inv-color-indigo);
    background: rgba(99, 102, 241, 0.08);
}

.c-app .c-header-nav-link {
    color: var(--inv-text-muted);
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: 8px;
    padding: 0.4rem 0.65rem;
    transition:
        color 0.25s var(--inv-ease),
        background 0.25s var(--inv-ease);
}

.c-app .c-header-nav-link:hover {
    color: var(--inv-color-indigo);
    background: rgba(99, 102, 241, 0.08);
}

.c-app .c-header .navbar-badge,
.c-app .c-header .badge-warning {
    background: linear-gradient(135deg, #fde68a, #f59e0b) !important;
    color: #1e293b !important;
    font-weight: 700;
    border-radius: 50rem;
    padding: 0.2em 0.5em;
    font-size: 0.7rem;
    box-shadow: 0 2px 6px rgba(245, 158, 11, 0.35);
}

/* Header dropdowns — visual style (position set above) */
.c-app .c-header .dropdown-menu {
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: var(--inv-input-radius);
    box-shadow: var(--inv-shadow-hover);
    padding: 0.35rem;
    margin-top: 0.35rem;
    animation: inv-header-dropdown-in 0.25s var(--inv-ease);
}

@keyframes inv-header-dropdown-in {
    from {
        opacity: 0;
        margin-top: 0.15rem;
    }
    to {
        opacity: 1;
        margin-top: 0.35rem;
    }
}

.c-app .c-header .dropdown-item {
    border-radius: 6px;
    padding: 0.5rem 0.85rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--inv-text);
    transition: background 0.2s var(--inv-ease), color 0.2s var(--inv-ease);
}

.c-app .c-header .dropdown-item:hover,
.c-app .c-header .dropdown-item:focus {
    background: rgba(99, 102, 241, 0.1);
    color: #4f46e5;
}

.c-app .c-header .dropdown-menu-lg .dropdown-item {
    white-space: normal;
    border-bottom: 1px solid rgba(15, 23, 42, 0.04);
}

.c-app .c-header .dropdown-menu-lg .dropdown-item:last-child {
    border-bottom: none;
}

@media (prefers-reduced-motion: reduce) {
    .c-app .content,
    .c-app .card {
        animation: none !important;
    }

    .c-app .card:hover {
        transform: none;
    }

    .c-app .c-header .dropdown-menu {
        animation: none;
    }
}

/* ── Show / detail pages ── */
/* Definition table (label + value rows, no thead) */
.c-app table.table:has(tbody > tr > th) {
    border-radius: var(--inv-radius);
    border: 1px solid rgba(15, 23, 42, 0.08);
    overflow: hidden;
    box-shadow: none;
    margin-bottom: 0;
}

.c-app table.table tbody > tr > th {
    width: 30%;
    max-width: 240px;
    min-width: 140px;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    color: #64748b;
    font-weight: 600;
    font-size: 0.8125rem;
    text-transform: none;
    letter-spacing: 0.01em;
    white-space: normal;
    border-color: rgba(15, 23, 42, 0.06) !important;
    vertical-align: top;
    padding: 0.9rem 1rem;
    transition:
        background 0.25s var(--inv-ease),
        color 0.25s var(--inv-ease);
}

.c-app table.table tbody > tr > td {
    background: var(--inv-surface);
    color: var(--inv-text);
    font-size: 0.875rem;
    line-height: 1.55;
    border-color: rgba(15, 23, 42, 0.06) !important;
    vertical-align: top;
    padding: 0.9rem 1rem;
    word-break: break-word;
}

.c-app table.table-striped tbody > tr:nth-of-type(odd) > th {
    background: linear-gradient(180deg, #f1f5f9 0%, #e8eeff 100%);
}

.c-app table.table-striped tbody > tr:nth-of-type(odd) > td {
    background: rgba(248, 250, 252, 0.85);
}

.c-app table.table tbody > tr {
    transition: background 0.2s var(--inv-ease);
}

.c-app table.table tbody > tr:hover > th {
    background: #eef2ff;
    color: #4f46e5;
}

.c-app table.table tbody > tr:hover > td {
    background: rgba(99, 102, 241, 0.05) !important;
}

.c-app table.table tbody > tr:hover {
    box-shadow: none;
}

/* Rich content in detail cells */
.c-app table.table tbody > tr > td img {
    display: block;
    max-width: 180px;
    height: auto;
    margin-top: 0.25rem;
    border-radius: 10px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.1);
    transition: transform 0.3s var(--inv-ease), box-shadow 0.3s var(--inv-ease);
}

.c-app table.table tbody > tr > td a:not(.btn):hover img {
    transform: scale(1.02);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.14);
}

.c-app table.table tbody > tr > td a:not(.btn) {
    color: #4f46e5;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.2s var(--inv-ease);
}

.c-app table.table tbody > tr > td a:not(.btn):hover {
    color: #6366f1;
    text-decoration: underline;
}

.c-app table.table tbody > tr > td .label,
.c-app table.table tbody > tr > td .badge {
    margin: 0.15rem 0.25rem 0.15rem 0;
}

.c-app table.table tbody > tr > td > *:last-child {
    margin-bottom: 0;
}

/* Back / action bars on show pages */
.c-app .card-body > .form-group > .form-group:first-child:has(.btn) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem !important;
    padding-bottom: 1.15rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.c-app .card-body > .form-group > table.table + .form-group:has(.btn) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1.25rem !important;
    margin-bottom: 0 !important;
    padding-top: 1.15rem;
    border-top: 1px solid rgba(15, 23, 42, 0.06);
}

/* Back button with icon hint */
.c-app .card-body .btn-default[href*="index"],
.c-app .card-body a.btn-default[href] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.c-app .card-body > .form-group > .form-group:first-child:has(.btn-default)::before {
    content: "←";
    font-size: 1rem;
    color: #64748b;
    line-height: 1;
    margin-inline-end: -0.15rem;
}

[dir="rtl"] .c-app .card-body > .form-group > .form-group:first-child:has(.btn-default)::before {
    content: "→";
}

/* Related data card — tabs */
.c-app .card > .nav-tabs {
    padding: 0.65rem 1.25rem 0;
    margin: 0;
    border-bottom: 2px solid #e0e7ff;
    background: linear-gradient(180deg, #fafbff 0%, #f8fafc 100%);
    flex-wrap: wrap;
}

.c-app .card > .nav-tabs .nav-item {
    margin-bottom: 0;
}

.c-app .card > .nav-tabs .nav-link {
    border: none;
    border-radius: 8px 8px 0 0;
    color: var(--inv-text-muted);
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.65rem 1rem;
    margin-bottom: -2px;
    transition:
        color 0.25s var(--inv-ease),
        background 0.25s var(--inv-ease);
}

.c-app .card > .nav-tabs .nav-link:hover {
    color: #4f46e5;
    background: rgba(99, 102, 241, 0.08);
    border-color: transparent;
}

.c-app .card > .nav-tabs .nav-link.active {
    color: #4f46e5;
    background: var(--inv-surface);
    border: none;
    box-shadow: inset 0 -2px 0 #6366f1;
}

.c-app .card > .tab-content {
    padding: 1.25rem;
    background: var(--inv-surface);
    border-radius: 0 0 var(--inv-radius) var(--inv-radius);
}

.c-app .card > .tab-content > .tab-pane.active {
    animation: inv-tab-in 0.35s var(--inv-ease);
}

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

/* Related data card: header + tabs layout */
.c-app .card:has(> .nav-tabs) > .card-header {
    border-bottom: none;
}

.c-app .card:has(> .nav-tabs) > .card-header + .nav-tabs {
    padding-top: 0;
}

@media (prefers-reduced-motion: reduce) {
    .c-app table.table tbody > tr > td img,
    .c-app .card > .tab-content > .tab-pane.active {
        animation: none;
        transition: none;
    }
}

/* ── Dashboard charts ── */
.inv-dashboard-charts,
.inv-dashboard-widget {
    margin-top: 0.25rem;
}

.inv-chart-col,
.inv-widget-col {
    margin-bottom: 1.25rem;
}

.inv-dashboard-charts .inv-chart-col:nth-child(1) .inv-chart-card { animation-delay: 0.06s; }
.inv-dashboard-charts .inv-chart-col:nth-child(2) .inv-chart-card { animation-delay: 0.12s; }
.inv-dashboard-charts .inv-chart-col:nth-child(3) .inv-chart-card { animation-delay: 0.18s; }

.inv-chart-card {
    height: 100%;
    padding: 1.15rem 1.1rem 1rem;
    border-radius: var(--inv-radius);
    background: var(--inv-surface);
    border: 1px solid rgba(15, 23, 42, 0.07);
    box-shadow: var(--inv-shadow);
    transition: box-shadow 0.35s var(--inv-ease);
    animation: inv-chart-in 0.55s var(--inv-ease) backwards;
}

@keyframes inv-chart-in {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.inv-chart-card:hover {
    box-shadow: var(--inv-shadow-hover);
}

.inv-chart-card__title,
.inv-widget-card__title {
    font-size: clamp(0.875rem, 1.5vw, 1rem);
    font-weight: 700;
    color: var(--inv-text);
    margin: 0 0 0.85rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #e0e7ff;
    position: relative;
    line-height: 1.4;
}

.inv-chart-card__title::after,
.inv-widget-card__title::after {
    content: "";
    position: absolute;
    bottom: -2px;
    inset-inline-start: 0;
    width: 2.5rem;
    height: 2px;
    background: linear-gradient(90deg, #6366f1, transparent);
    border-radius: 2px;
}

.inv-chart-card__body {
    position: relative;
    padding: 0;
}

/* Fixed-height canvas host — Chart.js fills this (no squish) */
.inv-chart-canvas-wrap {
    position: relative;
    width: 100%;
    height: 280px;
}

.inv-chart-canvas-wrap--bar {
    height: 320px;
}

.inv-chart-canvas-wrap canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

/* Latest entries widget */
.inv-widget-card {
    padding: 1.15rem 1.1rem 1rem;
    border-radius: var(--inv-radius);
    background: var(--inv-surface);
    border: 1px solid rgba(15, 23, 42, 0.07);
    box-shadow: var(--inv-shadow);
    animation: inv-chart-in 0.55s var(--inv-ease) 0.22s backwards;
}

.inv-widget-card__body {
    margin: 0;
    padding: 0;
    border: none;
    box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
    .inv-chart-card {
        animation: none !important;
    }

    .inv-chart-card:hover {
        transform: none;
    }
}

/* Language switcher (admin edit forms) */
.switchlang-panel {
    background: linear-gradient(160deg, #f8fafc 0%, #eef2ff 55%, #fdf4ff 100%);
    border: 1px solid rgba(99, 102, 241, 0.12);
    border-radius: 1rem;
    padding: 0.85rem 1rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.switchlang-panel__header {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 0.75rem;
    color: #475569;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.switchlang-panel__header-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 0.5rem;
    background: rgba(99, 102, 241, 0.12);
    color: #6366f1;
    font-size: 0.85rem;
}

.switchlang-panel__items {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.switchlang-item {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    flex: 1 1 auto;
    min-width: 8rem;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.72);
    color: #334155;
    font-weight: 600;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease;
}

.switchlang-item:hover {
    transform: translateY(-2px);
    background: #fff;
    color: var(--switchlang-item-color, #6366f1);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--switchlang-item-color, #6366f1) 18%, transparent);
}

.switchlang-item.active {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--switchlang-item-color, #6366f1) 88%, #fff) 0%,
        var(--switchlang-item-color, #6366f1) 100%
    );
    color: #fff;
    box-shadow: 0 8px 22px color-mix(in srgb, var(--switchlang-item-color, #6366f1) 42%, transparent);
}

.switchlang-item.active .switchlang-item__icon {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.switchlang-item__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 0.6rem;
    flex-shrink: 0;
    background: color-mix(in srgb, var(--switchlang-item-color, #6366f1) 14%, #fff);
    color: var(--switchlang-item-color, #6366f1);
    font-size: 0.9rem;
    transition: background 0.25s ease, color 0.25s ease;
}

.switchlang-item__label {
    line-height: 1.3;
}

@media (max-width: 575.98px) {
    .switchlang-panel__items {
        flex-direction: column;
    }

    .switchlang-item {
        width: 100%;
        min-width: 0;
    }
}