/* 3D depth layer only. Keeps the existing color palette unchanged. */
.admin-panel-page #sidebar {
    box-shadow:
        8px 0 18px rgba(17, 24, 39, 0.14),
        inset -1px 0 0 rgba(255, 255, 255, 0.45) !important;
}

.admin-panel-page .navbar .container-fluid,
.admin-panel-page .dash_box,
.admin-panel-page .card,
.admin-panel-page .table_bg,
.admin-panel-page .table-bg,
.admin-panel-page .ibox,
.admin-panel-page div#data-grid_wrapper,
.admin-panel-page .chat-container,
.admin-panel-page .chat_box .mesgs {
    box-shadow:
        0 14px 28px rgba(17, 24, 39, 0.10),
        0 3px 8px rgba(17, 24, 39, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

.admin-panel-page .navbar .container-fluid,
.admin-panel-page .dash_box,
.admin-panel-page .card,
.admin-panel-page .table_bg,
.admin-panel-page .table-bg,
.admin-panel-page .ibox,
.admin-panel-page div#data-grid_wrapper,
.admin-panel-page .chat-container,
.admin-panel-page .chat_box .mesgs,
.admin-panel-page .modal-content {
    overflow: hidden;
    backface-visibility: hidden;
}

.admin-panel-page .dash_box,
.admin-panel-page .card,
.admin-panel-page .table_bg,
.admin-panel-page .table-bg,
.admin-panel-page .ibox,
.admin-panel-page div#data-grid_wrapper {
    transform: translateZ(0);
    transition:
        transform 140ms ease,
        box-shadow 140ms ease,
        border-color 140ms ease;
}

.admin-panel-page .dash_box:hover,
.admin-panel-page .card:hover {
    transform: translateY(-2px) scale(1.002);
    box-shadow:
        0 18px 36px rgba(17, 24, 39, 0.13),
        0 5px 12px rgba(17, 24, 39, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
}

.admin-panel-page .dash_left .d_icon,
.admin-panel-page .d_icon {
    transition:
        transform 140ms ease,
        box-shadow 140ms ease;
}

.admin-panel-page .dash_box:hover .d_icon {
    transform: translateY(-1px) scale(1.035);
}

.admin-panel-page .table-responsive,
.admin-panel-page #content .table-responsive,
.admin-panel-page #content .card .table-responsive {
    overflow: hidden;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.70),
        inset 0 -1px 0 rgba(17, 24, 39, 0.04) !important;
}

.admin-panel-page .table,
.admin-panel-page table.dataTable {
    border-collapse: separate;
    border-spacing: 0;
}

.admin-panel-page .table tbody tr,
.admin-panel-page table.dataTable tbody tr {
    transition:
        transform 100ms ease,
        box-shadow 100ms ease,
        filter 100ms ease;
}

.admin-panel-page .table-hover tbody tr:hover,
.admin-panel-page table.dataTable.display tbody tr:hover {
    filter: brightness(1.01);
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(17, 24, 39, 0.08);
}

.admin-panel-page .table thead th,
.admin-panel-page .table-striped thead th,
.admin-panel-page #data-grid_wrapper table.dataTable thead th,
.admin-panel-page #data-grid_wrapper table.dataTable tfoot th {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.62),
        inset 0 -2px 0 rgba(17, 24, 39, 0.08) !important;
}

.admin-panel-page .btn,
.admin-panel-page .btn.btn-theme,
.admin-panel-page .btn-theme,
.admin-panel-page .submit-btn,
.admin-panel-page .logout_btn,
.admin-panel-page .admin-chat-bell,
.admin-panel-page button,
.admin-panel-page input[type="button"],
.admin-panel-page input[type="submit"] {
    box-shadow:
        0 4px 10px rgba(17, 24, 39, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.58) !important;
    transition:
        transform 120ms ease,
        box-shadow 120ms ease,
        filter 120ms ease;
}

.admin-panel-page .btn:hover,
.admin-panel-page .btn.btn-theme:hover,
.admin-panel-page .btn-theme:hover,
.admin-panel-page .submit-btn:hover,
.admin-panel-page .logout_btn:hover,
.admin-panel-page .admin-chat-bell:hover,
.admin-panel-page button:hover,
.admin-panel-page input[type="button"]:hover,
.admin-panel-page input[type="submit"]:hover {
    transform: translateY(-1px);
    box-shadow:
        0 7px 14px rgba(17, 24, 39, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.68) !important;
}

.admin-panel-page .btn:active,
.admin-panel-page .btn.btn-theme:active,
.admin-panel-page .btn-theme:active,
.admin-panel-page .submit-btn:active,
.admin-panel-page .logout_btn:active,
.admin-panel-page .admin-chat-bell:active,
.admin-panel-page button:active,
.admin-panel-page input[type="button"]:active,
.admin-panel-page input[type="submit"]:active {
    transform: translateY(0);
    box-shadow:
        0 2px 6px rgba(17, 24, 39, 0.10),
        inset 0 2px 4px rgba(17, 24, 39, 0.10) !important;
}

.admin-panel-page .form-control,
.admin-panel-page .custom-select,
.admin-panel-page select,
.admin-panel-page textarea,
.admin-panel-page .select2-container .select2-selection--single,
.admin-panel-page .select2-container .select2-selection--multiple {
    box-shadow:
        inset 0 1px 2px rgba(17, 24, 39, 0.08),
        0 1px 0 rgba(255, 255, 255, 0.62) !important;
}

.admin-panel-page .form-control:focus,
.admin-panel-page .custom-select:focus,
.admin-panel-page select:focus,
.admin-panel-page textarea:focus {
    box-shadow:
        inset 0 1px 2px rgba(17, 24, 39, 0.08),
        0 0 0 3px rgba(17, 24, 39, 0.08) !important;
}

.admin-panel-page #sidebar ul li a {
    transition:
        transform 120ms ease,
        box-shadow 120ms ease,
        filter 120ms ease;
}

.admin-panel-page #sidebar ul li a:hover,
.admin-panel-page #sidebar ul li a:focus,
.admin-panel-page #sidebar ul li a.active,
.admin-panel-page #sidebar ul li.active > a,
.admin-panel-page #sidebar a[aria-expanded="true"] {
    transform: translateX(3px);
    box-shadow:
        0 5px 10px rgba(17, 24, 39, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

.admin-panel-page .modal-content {
    box-shadow:
        0 24px 58px rgba(17, 24, 39, 0.22),
        0 8px 18px rgba(17, 24, 39, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

.admin-panel-page .msg {
    box-shadow:
        0 4px 10px rgba(17, 24, 39, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

@media (max-width: 767px) {
    .admin-panel-page .card,
    .admin-panel-page .card-body,
    .admin-panel-page .table-bg,
    .admin-panel-page .dataTables_wrapper,
    .admin-panel-page .admin-table-swipe,
    .admin-panel-page .admin-datatable-swipe {
        max-width: 100%;
        min-width: 0;
    }

    .admin-panel-page .table-responsive,
    .admin-panel-page .admin-table-swipe,
    .admin-panel-page .dataTables_wrapper,
    .admin-panel-page .admin-datatable-swipe,
    .admin-panel-page .dataTables_scroll,
    .admin-panel-page .dataTables_scrollBody {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto !important;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        touch-action: pan-x pan-y;
        scrollbar-width: thin;
    }

    .admin-panel-page .table-responsive table,
    .admin-panel-page .admin-table-swipe > table,
    .admin-panel-page .dataTables_wrapper table,
    .admin-panel-page table.dataTable,
    .admin-panel-page table.display,
    .admin-panel-page table.report_table {
        width: max-content !important;
        min-width: 760px;
        max-width: none !important;
        white-space: nowrap;
        table-layout: auto !important;
    }

    .admin-panel-page .table-responsive th,
    .admin-panel-page .table-responsive td,
    .admin-panel-page .admin-table-swipe th,
    .admin-panel-page .admin-table-swipe td,
    .admin-panel-page .dataTables_wrapper th,
    .admin-panel-page .dataTables_wrapper td {
        white-space: nowrap;
    }

    .admin-panel-page .dataTables_wrapper .row,
    .admin-panel-page .dataTables_wrapper .col-sm-12,
    .admin-panel-page .admin-table-scroll-row {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .admin-panel-page .dataTables_wrapper .dataTables_length,
    .admin-panel-page .dataTables_wrapper .dataTables_filter,
    .admin-panel-page .dataTables_wrapper .dataTables_info,
    .admin-panel-page .dataTables_wrapper .dataTables_paginate {
        float: none !important;
        width: 100%;
        max-width: 100%;
        text-align: left !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .admin-panel-page .dataTables_wrapper .dataTables_filter input,
    .admin-panel-page .dataTables_wrapper .dataTables_length select {
        max-width: 100%;
    }

    .admin-panel-page .dataTables_wrapper .dataTables_paginate {
        padding-top: 8px;
        white-space: nowrap;
    }

    .admin-panel-page .table-responsive::-webkit-scrollbar,
    .admin-panel-page .admin-table-swipe::-webkit-scrollbar,
    .admin-panel-page .dataTables_wrapper::-webkit-scrollbar,
    .admin-panel-page .admin-table-scroll-row::-webkit-scrollbar {
        height: 6px;
    }

    .admin-panel-page .table-responsive::-webkit-scrollbar-thumb,
    .admin-panel-page .admin-table-swipe::-webkit-scrollbar-thumb,
    .admin-panel-page .dataTables_wrapper::-webkit-scrollbar-thumb,
    .admin-panel-page .admin-table-scroll-row::-webkit-scrollbar-thumb {
        background: rgba(17, 24, 39, 0.22);
        border-radius: 999px;
    }

    .admin-panel-page .dash_box:hover,
    .admin-panel-page .card:hover,
    .admin-panel-page .table-hover tbody tr:hover,
    .admin-panel-page table.dataTable.display tbody tr:hover,
    .admin-panel-page .btn:hover,
    .admin-panel-page button:hover {
        transform: none;
    }
}
