/* ==========================================================
   DARVEN DRIVE
   Corporate Storage UI
   ========================================================== */

/* ---------- BASE ---------- */

body:not(.app-blank) {
    background: #f6f7f9 !important;
}

body:not(.app-blank) .app-wrapper,
body:not(.app-blank) .app-main,
body:not(.app-blank) .app-content {
    background: #f6f7f9 !important;
}


/* ==========================================================
   SIDEBAR
   ========================================================== */

body:not(.app-blank) .app-sidebar {
    background: #ffffff !important;
    border-right: 1px solid #e7e9ed !important;
    box-shadow: none !important;
}

body:not(.app-blank) .app-sidebar .menu-link {
    margin: 3px 10px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    border-radius: 9px !important;
}

body:not(.app-blank) .app-sidebar .menu-title {
    color: #4b5159 !important;
    font-weight: 500 !important;
}

body:not(.app-blank) .app-sidebar .menu-icon i {
    color: #747b85 !important;
}

body:not(.app-blank) .app-sidebar .menu-link:hover {
    background: #f3f4f6 !important;
}

body:not(.app-blank) .app-sidebar .menu-link.active {
    background: #fff6c7 !important;
}

body:not(.app-blank) .app-sidebar .menu-link.active .menu-title,
body:not(.app-blank) .app-sidebar .menu-link.active .menu-icon i {
    color: #6f5d00 !important;
    font-weight: 700 !important;
}


/* ==========================================================
   TOP HEADER
   ========================================================== */

body:not(.app-blank) .app-header {
    background: #ffffff !important;
    border-bottom: 1px solid #e7e9ed !important;
    box-shadow: none !important;
}


/* ==========================================================
   FILE WORKSPACE
   ========================================================== */

body:not(.app-blank) .app-content .card.card-flush {
    background: #ffffff !important;
    border: 1px solid #e5e8ec !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 10px rgba(30,35,40,.035) !important;
    overflow: hidden;
}


/* ---------- TOOLBAR ---------- */

body:not(.app-blank) .app-content .card-header {
    min-height: 82px !important;
    padding: 18px 24px !important;
    border-bottom: 1px solid #edf0f2 !important;
    background: #ffffff !important;
}


/* Search */

body:not(.app-blank)
[data-kt-filemanager-table-filter="search"] {
    width: 360px !important;
    height: 44px !important;

    background: #f5f6f8 !important;
    border: 1px solid transparent !important;
    border-radius: 11px !important;

    color: #30343a !important;

    transition: all .15s ease;
}

body:not(.app-blank)
[data-kt-filemanager-table-filter="search"]:focus {
    background: #ffffff !important;
    border-color: #d7b900 !important;
    box-shadow: 0 0 0 3px rgba(255,214,0,.10) !important;
}


/* New Folder */

body:not(.app-blank) #id_create_dir_button {
    background: #f2f4f6 !important;
    border: 1px solid #e2e5e8 !important;
    color: #353a40 !important;
    border-radius: 9px !important;
    font-weight: 600 !important;
}

body:not(.app-blank) #id_create_dir_button:hover {
    background: #e9ecef !important;
}


/* Upload */

body:not(.app-blank)
[data-bs-target="#modal_upload"] {
    background: #ffd400 !important;
    border-color: #ffd400 !important;
    color: #171717 !important;
    border-radius: 9px !important;
    font-weight: 700 !important;
}

body:not(.app-blank)
[data-bs-target="#modal_upload"]:hover {
    background: #eac300 !important;
    border-color: #eac300 !important;
}


/* ==========================================================
   CARD BODY
   ========================================================== */

body:not(.app-blank) .app-content .card-body {
    padding: 20px 24px 10px !important;
}


/* ==========================================================
   BREADCRUMB
   ========================================================== */

body:not(.app-blank)
[data-kt-filemanager-table-nav-bar="base"] {
    background: transparent !important;
    border: none !important;
    padding: 7px 0 !important;

    color: #555c65 !important;
    font-size: 14px !important;
}

body:not(.app-blank)
[data-kt-filemanager-table-nav-bar="base"] a {
    color: #454b53 !important;
    text-decoration: none !important;
}

body:not(.app-blank)
[data-kt-filemanager-table-nav-bar="base"] a:hover {
    color: #9a8100 !important;
}


/* ==========================================================
   FILE TABLE
   ========================================================== */

body:not(.app-blank) #file_manager_list {
    margin-top: 12px !important;
    margin-bottom: 0 !important;
}

body:not(.app-blank) #file_manager_list thead th {
    background: #fafbfc !important;

    color: #747b84 !important;

    font-size: 12px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .25px;

    border-top: 1px solid #edf0f2 !important;
    border-bottom: 1px solid #e9ecef !important;

    padding-top: 13px !important;
    padding-bottom: 13px !important;
}

body:not(.app-blank)
#file_manager_list tbody td {
    background: #ffffff !important;

    border-bottom:
        1px solid #f0f1f3 !important;

    padding-top: 10px !important;
    padding-bottom: 10px !important;

    vertical-align: middle !important;
}

body:not(.app-blank)
#file_manager_list tbody tr {
    transition: background .12s ease;
}

body:not(.app-blank)
#file_manager_list tbody tr:hover td {
    background: #fafbfc !important;
}


/* ==========================================================
   FILE RENDERER
   ========================================================== */

.darven-file-entry {
    display: flex;
    align-items: center;
    gap: 12px;

    min-height: 48px;
}

.darven-file-info {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-width: 0;
}

.darven-file-name {
    color: #292d32 !important;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none !important;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.darven-file-name:hover {
    color: #8a7300 !important;
}

.darven-file-extension {
    margin-top: 2px;

    color: #9aa0a6;

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .4px;
}


/* ==========================================================
   FILE ICON BASE
   ========================================================== */

.darven-file-icon,
.darven-type-icon,
.darven-file-thumbnail {
    width: 42px;
    height: 42px;
    min-width: 42px;

    border-radius: 9px;
}


/* Folder */

.darven-folder-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    background: #fff5c2;
}

.darven-folder-icon i {
    color: #dbae00 !important;
}


/* Image thumbnail */

.darven-file-thumbnail {
    overflow: hidden;

    background: #eef1f4;

    border: 1px solid #e0e4e8;
}

.darven-file-thumbnail img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* File type tile */

.darven-type-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid transparent;

    font-size: 11px;
    font-weight: 800;
}


/* PDF */

.darven-pdf {
    background: #fff0ee;
    border-color: #f7d5d0;
    color: #c0392b;
}


/* Word */

.darven-word {
    background: #eaf2fd;
    border-color: #d4e4fa;
    color: #185abd;

    font-size: 17px;
}


/* Excel */

.darven-excel {
    background: #e8f5ee;
    border-color: #cde8da;
    color: #107c41;

    font-size: 17px;
}


/* PowerPoint */

.darven-powerpoint {
    background: #fbeeea;
    border-color: #f1d7cf;
    color: #c43e1c;

    font-size: 17px;
}


/* CAD */

.darven-cad {
    background: #faecee;
    border-color: #efd2d6;
    color: #a1262f;
}


/* Archive */

.darven-archive {
    background: #fff8dc;
    border-color: #f0e2a1;
    color: #725c00;
}


/* Installer */

.darven-app {
    background: #edf0f3;
    border-color: #dce1e5;
    color: #424a52;
}


/* Text */

.darven-text {
    background: #f1f4f6;
    border-color: #e0e5e9;
    color: #53606d;
}


/* Video */

.darven-video {
    background: #f4ebfb;
    border-color: #e4d2f2;
    color: #7135a5;

    font-size: 16px;
}


/* Audio */

.darven-audio {
    background: #faedf6;
    border-color: #efd5e7;
    color: #8b3d76;

    font-size: 19px;
}


/* Database */

.darven-database {
    background: #e9f5f8;
    border-color: #cee8ef;
    color: #176b87;
}


/* Code */

.darven-code {
    background: #eef1f4;
    border-color: #dce2e7;
    color: #44515e;
}


/* ISO */

.darven-disc {
    background: #f1f1f1;
    border-color: #dedede;
    color: #555;
}


/* Generic */

.darven-generic-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    background: #f1f4f7;
}

.darven-generic-icon i {
    color: #718096 !important;
}


/* ==========================================================
   CHECKBOX
   ========================================================== */

body:not(.app-blank)
.form-check-input:checked {
    background-color: #e0bc00 !important;
    border-color: #e0bc00 !important;
}


/* ==========================================================
   PAGINATION
   ========================================================== */

body:not(.app-blank)
.page-item.active .page-link {
    background: #ffd400 !important;
    border-color: #ffd400 !important;
    color: #1d1d1d !important;
}


/* ==========================================================
   DARK MODE
   Keep SFTPGo dark mode readable
   ========================================================== */

[data-bs-theme="dark"] body:not(.app-blank),
[data-bs-theme="dark"] body:not(.app-blank) .app-wrapper,
[data-bs-theme="dark"] body:not(.app-blank) .app-main,
[data-bs-theme="dark"] body:not(.app-blank) .app-content {
    background: #15181c !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) .app-sidebar,

[data-bs-theme="dark"]
body:not(.app-blank) .app-header,

[data-bs-theme="dark"]
body:not(.app-blank) .app-content .card.card-flush,

[data-bs-theme="dark"]
body:not(.app-blank) .app-content .card-header,

[data-bs-theme="dark"]
body:not(.app-blank) #file_manager_list tbody td {
    background: #1e2227 !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) .app-sidebar {
    border-right-color: #30353b !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) .app-header,

[data-bs-theme="dark"]
body:not(.app-blank) .app-content .card.card-flush {
    border-color: #30353b !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) #file_manager_list thead th {
    background: #24292f !important;
    border-color: #30353b !important;
    color: #aab1b9 !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) #file_manager_list tbody td {
    border-bottom-color: #2c3137 !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) #file_manager_list tbody tr:hover td {
    background: #252a30 !important;
}

[data-bs-theme="dark"] .darven-file-name {
    color: #e5e8eb !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) .app-sidebar .menu-title {
    color: #c7ccd2 !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) .app-sidebar .menu-link:hover {
    background: #292e34 !important;
}

[data-bs-theme="dark"]
body:not(.app-blank) .app-sidebar .menu-link.active {
    background: rgba(255,212,0,.10) !important;
}

[data-bs-theme="dark"]
body:not(.app-blank)
[data-kt-filemanager-table-filter="search"] {
    background: #292e34 !important;
    color: #e7e9ec !important;
}


/* ==========================================================
   DARVEN DRIVE
   VIEW SWITCHER
   ========================================================== */

.darven-view-switcher {
    display: inline-flex;
    align-items: center;

    margin-left: auto;
    margin-right: 18px;

    padding: 3px;

    background: #f1f3f5;
    border: 1px solid #e2e5e8;
    border-radius: 10px;
}

.darven-view-btn {
    width: 38px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    background: transparent;
    border: 0;
    border-radius: 7px;

    color: #707780;

    transition: all .15s ease;
}

.darven-view-btn:hover {
    background: #e5e8eb;
    color: #252a30;
}

.darven-view-btn.active {
    background: #ffffff;
    color: #1f2328;

    box-shadow: 0 1px 3px rgba(20,25,30,.12);
}


/* ==========================================================
   DETAILS VIEW
   ========================================================== */

.darven-view-details #file_manager_list {
    display: table;
}

.darven-view-details .darven-file-thumbnail,
.darven-view-details .darven-file-icon,
.darven-view-details .darven-type-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
}


/* ==========================================================
   LIST VIEW
   ========================================================== */

.darven-view-list #file_manager_list {
    display: table;
}

.darven-view-list #file_manager_list thead {
    display: none;
}

.darven-view-list #file_manager_list tbody td {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

.darven-view-list .darven-file-entry {
    min-height: 40px;
}

.darven-view-list .darven-file-thumbnail,
.darven-view-list .darven-file-icon,
.darven-view-list .darven-type-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;

    border-radius: 7px;
}

.darven-view-list .darven-file-extension {
    display: none;
}


/* ==========================================================
   GRID VIEW
   ========================================================== */

.darven-view-grid {
    padding-top: 18px;
}


/* Hide normal table header */

.darven-view-grid #file_manager_list thead {
    display: none !important;
}


/*
 * DataTables keeps TABLE/TBODY/TR because SFTPGo actions
 * depend on those rows.
 */

.darven-view-grid #file_manager_list {
    display: block !important;
    width: 100% !important;
}

.darven-view-grid #file_manager_list tbody {
    display: grid !important;

    grid-template-columns:
        repeat(auto-fill, minmax(180px, 1fr));

    gap: 16px;

    width: 100% !important;
}


/* Card */

.darven-view-grid #file_manager_list tbody tr {
    position: relative;

    display: flex !important;
    flex-direction: column;

    min-width: 0;
    min-height: 190px;

    padding: 0 !important;

    background: #ffffff !important;

    border: 1px solid #e4e7eb !important;
    border-radius: 13px !important;

    overflow: hidden;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

.darven-view-grid #file_manager_list tbody tr:hover {
    border-color: #d4d8dd !important;

    box-shadow:
        0 5px 16px rgba(25,30,35,.08);

    transform: translateY(-1px);
}


/* All cells */

.darven-view-grid #file_manager_list tbody td {
    border: 0 !important;
    background: transparent !important;
}


/* Checkbox */

.darven-view-grid #file_manager_list tbody td:first-child {
    position: absolute;

    z-index: 5;

    top: 10px;
    left: 10px;

    width: auto !important;

    padding: 0 !important;
}


/* File name / visual cell */

.darven-view-grid #file_manager_list tbody td:nth-child(2),
.darven-view-grid #file_manager_list tbody td:nth-child(3) {
    width: 100% !important;
}


/*
 * Hidden type column means DataTables can alter actual
 * nth-child positions, so target the entry itself.
 */

.darven-view-grid .darven-file-entry {
    display: flex;

    flex-direction: column;
    align-items: stretch;

    gap: 0;

    width: 100%;
    min-height: 150px;
}


/* Visual area */

.darven-view-grid .darven-file-thumbnail,
.darven-view-grid .darven-file-icon,
.darven-view-grid .darven-type-icon {
    width: 100%;
    height: 120px;
    min-width: 100%;

    border: 0;
    border-radius: 10px;

    margin: 0;

    flex-shrink: 0;
}


/* Real image preview */

.darven-view-grid .darven-file-thumbnail {
    background: #eef1f4;
    overflow: hidden;
}

.darven-view-grid .darven-file-thumbnail img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* Folder */

.darven-view-grid .darven-folder-icon {
    background: #fff9df;
}

.darven-view-grid .darven-folder-icon i {
    font-size: 58px !important;
}


/* File type tiles */

.darven-view-grid .darven-type-icon {
    font-size: 24px;
}

.darven-view-grid .darven-word,
.darven-view-grid .darven-excel,
.darven-view-grid .darven-powerpoint {
    font-size: 38px;
}


/* File name area */

.darven-view-grid .darven-file-info {
    display: block;

    width: 100%;

    padding: 12px 4px 4px;
}

.darven-view-grid .darven-file-name {
    display: block;

    width: 100%;

    overflow: hidden;

    color: #2b3036 !important;

    font-size: 13px;
    font-weight: 600;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.darven-view-grid .darven-file-extension {
    display: block;

    margin-top: 4px;
}


/* Action column */

.darven-view-grid #file_manager_list tbody td:last-child {
    position: absolute;

    z-index: 6;

    top: 8px;
    right: 7px;

    width: auto !important;

    padding: 0 !important;
}


/* Selected card */

.darven-view-grid
#file_manager_list tbody tr.row-selected {
    border-color: #d7b700 !important;

    box-shadow:
        0 0 0 2px rgba(255,212,0,.14);
}


/* ==========================================================
   DATATABLE CONTROLS
   ========================================================== */

.darven-view-grid + .dataTables_info,
.darven-view-list + .dataTables_info {
    margin-top: 15px;
}


/* ==========================================================
   DARK MODE - VIEW SWITCHER
   ========================================================== */

[data-bs-theme="dark"] .darven-view-switcher {
    background: #292e34;
    border-color: #363c43;
}

[data-bs-theme="dark"] .darven-view-btn {
    color: #aab1b8;
}

[data-bs-theme="dark"] .darven-view-btn:hover {
    background: #343a41;
    color: #ffffff;
}

[data-bs-theme="dark"] .darven-view-btn.active {
    background: #424850;
    color: #ffffff;

    box-shadow: none;
}


/* ==========================================================
   DARK MODE - GRID
   ========================================================== */

[data-bs-theme="dark"]
.darven-view-grid #file_manager_list tbody tr {
    background: #20252a !important;
    border-color: #333940 !important;
}

[data-bs-theme="dark"]
.darven-view-grid #file_manager_list tbody tr:hover {
    background: #252b31 !important;
    border-color: #474e56 !important;
}

[data-bs-theme="dark"]
.darven-view-grid .darven-file-name {
    color: #e5e8eb !important;
}

[data-bs-theme="dark"]
.darven-view-grid .darven-folder-icon {
    background: rgba(255,212,0,.08);
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 768px) {

    .darven-view-switcher {
        margin-right: 0;
    }

    .darven-view-grid #file_manager_list tbody {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 10px;
    }

    .darven-view-grid #file_manager_list tbody tr {
        min-height: 165px;
    }

    .darven-view-grid .darven-file-thumbnail,
    .darven-view-grid .darven-file-icon,
    .darven-view-grid .darven-type-icon {
        height: 100px;
    }
}


/* ==========================================================
   DARVEN DRIVE
   VIEW SWITCHER
   ========================================================== */

.darven-view-switcher {
    display: inline-flex;
    align-items: center;

    margin-left: auto;
    margin-right: 18px;

    padding: 3px;

    background: #f1f3f5;
    border: 1px solid #e2e5e8;
    border-radius: 10px;
}

.darven-view-btn {
    width: 38px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    background: transparent;
    border: 0;
    border-radius: 7px;

    color: #707780;

    transition: all .15s ease;
}

.darven-view-btn:hover {
    background: #e5e8eb;
    color: #252a30;
}

.darven-view-btn.active {
    background: #ffffff;
    color: #1f2328;

    box-shadow: 0 1px 3px rgba(20,25,30,.12);
}


/* ==========================================================
   DETAILS VIEW
   ========================================================== */

.darven-view-details #file_manager_list {
    display: table;
}

.darven-view-details .darven-file-thumbnail,
.darven-view-details .darven-file-icon,
.darven-view-details .darven-type-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
}


/* ==========================================================
   LIST VIEW
   ========================================================== */

.darven-view-list #file_manager_list {
    display: table;
}

.darven-view-list #file_manager_list thead {
    display: none;
}

.darven-view-list #file_manager_list tbody td {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

.darven-view-list .darven-file-entry {
    min-height: 40px;
}

.darven-view-list .darven-file-thumbnail,
.darven-view-list .darven-file-icon,
.darven-view-list .darven-type-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;

    border-radius: 7px;
}

.darven-view-list .darven-file-extension {
    display: none;
}


/* ==========================================================
   GRID VIEW
   ========================================================== */

.darven-view-grid {
    padding-top: 18px;
}


/* Hide normal table header */

.darven-view-grid #file_manager_list thead {
    display: none !important;
}


/*
 * DataTables keeps TABLE/TBODY/TR because SFTPGo actions
 * depend on those rows.
 */

.darven-view-grid #file_manager_list {
    display: block !important;
    width: 100% !important;
}

.darven-view-grid #file_manager_list tbody {
    display: grid !important;

    grid-template-columns:
        repeat(auto-fill, minmax(180px, 1fr));

    gap: 16px;

    width: 100% !important;
}


/* Card */

.darven-view-grid #file_manager_list tbody tr {
    position: relative;

    display: flex !important;
    flex-direction: column;

    min-width: 0;
    min-height: 190px;

    padding: 0 !important;

    background: #ffffff !important;

    border: 1px solid #e4e7eb !important;
    border-radius: 13px !important;

    overflow: hidden;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

.darven-view-grid #file_manager_list tbody tr:hover {
    border-color: #d4d8dd !important;

    box-shadow:
        0 5px 16px rgba(25,30,35,.08);

    transform: translateY(-1px);
}


/* All cells */

.darven-view-grid #file_manager_list tbody td {
    border: 0 !important;
    background: transparent !important;
}


/* Checkbox */

.darven-view-grid #file_manager_list tbody td:first-child {
    position: absolute;

    z-index: 5;

    top: 10px;
    left: 10px;

    width: auto !important;

    padding: 0 !important;
}


/* File name / visual cell */

.darven-view-grid #file_manager_list tbody td:nth-child(2),
.darven-view-grid #file_manager_list tbody td:nth-child(3) {
    width: 100% !important;
}


/*
 * Hidden type column means DataTables can alter actual
 * nth-child positions, so target the entry itself.
 */

.darven-view-grid .darven-file-entry {
    display: flex;

    flex-direction: column;
    align-items: stretch;

    gap: 0;

    width: 100%;
    min-height: 150px;
}


/* Visual area */

.darven-view-grid .darven-file-thumbnail,
.darven-view-grid .darven-file-icon,
.darven-view-grid .darven-type-icon {
    width: 100%;
    height: 120px;
    min-width: 100%;

    border: 0;
    border-radius: 10px;

    margin: 0;

    flex-shrink: 0;
}


/* Real image preview */

.darven-view-grid .darven-file-thumbnail {
    background: #eef1f4;
    overflow: hidden;
}

.darven-view-grid .darven-file-thumbnail img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* Folder */

.darven-view-grid .darven-folder-icon {
    background: #fff9df;
}

.darven-view-grid .darven-folder-icon i {
    font-size: 58px !important;
}


/* File type tiles */

.darven-view-grid .darven-type-icon {
    font-size: 24px;
}

.darven-view-grid .darven-word,
.darven-view-grid .darven-excel,
.darven-view-grid .darven-powerpoint {
    font-size: 38px;
}


/* File name area */

.darven-view-grid .darven-file-info {
    display: block;

    width: 100%;

    padding: 12px 4px 4px;
}

.darven-view-grid .darven-file-name {
    display: block;

    width: 100%;

    overflow: hidden;

    color: #2b3036 !important;

    font-size: 13px;
    font-weight: 600;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.darven-view-grid .darven-file-extension {
    display: block;

    margin-top: 4px;
}


/* Action column */

.darven-view-grid #file_manager_list tbody td:last-child {
    position: absolute;

    z-index: 6;

    top: 8px;
    right: 7px;

    width: auto !important;

    padding: 0 !important;
}


/* Selected card */

.darven-view-grid
#file_manager_list tbody tr.row-selected {
    border-color: #d7b700 !important;

    box-shadow:
        0 0 0 2px rgba(255,212,0,.14);
}


/* ==========================================================
   DATATABLE CONTROLS
   ========================================================== */

.darven-view-grid + .dataTables_info,
.darven-view-list + .dataTables_info {
    margin-top: 15px;
}


/* ==========================================================
   DARK MODE - VIEW SWITCHER
   ========================================================== */

[data-bs-theme="dark"] .darven-view-switcher {
    background: #292e34;
    border-color: #363c43;
}

[data-bs-theme="dark"] .darven-view-btn {
    color: #aab1b8;
}

[data-bs-theme="dark"] .darven-view-btn:hover {
    background: #343a41;
    color: #ffffff;
}

[data-bs-theme="dark"] .darven-view-btn.active {
    background: #424850;
    color: #ffffff;

    box-shadow: none;
}


/* ==========================================================
   DARK MODE - GRID
   ========================================================== */

[data-bs-theme="dark"]
.darven-view-grid #file_manager_list tbody tr {
    background: #20252a !important;
    border-color: #333940 !important;
}

[data-bs-theme="dark"]
.darven-view-grid #file_manager_list tbody tr:hover {
    background: #252b31 !important;
    border-color: #474e56 !important;
}

[data-bs-theme="dark"]
.darven-view-grid .darven-file-name {
    color: #e5e8eb !important;
}

[data-bs-theme="dark"]
.darven-view-grid .darven-folder-icon {
    background: rgba(255,212,0,.08);
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 768px) {

    .darven-view-switcher {
        margin-right: 0;
    }

    .darven-view-grid #file_manager_list tbody {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 10px;
    }

    .darven-view-grid #file_manager_list tbody tr {
        min-height: 165px;
    }

    .darven-view-grid .darven-file-thumbnail,
    .darven-view-grid .darven-file-icon,
    .darven-view-grid .darven-type-icon {
        height: 100px;
    }
}


/* ==========================================================
   DARVEN GRID - CARD WIDTH / CLIPPING FIX
   ========================================================== */

.darven-view-grid #file_manager_list {
    width: 100% !important;
    min-width: 0 !important;
}

.darven-view-grid #file_manager_list_body {
    width: 100% !important;
}


/* Every grid card */

.darven-view-grid #file_manager_list_body > tr {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    box-sizing: border-box !important;
}


/* Hide all normal TD layout behavior */

.darven-view-grid #file_manager_list_body > tr > td {
    min-width: 0 !important;
    max-width: none !important;

    box-sizing: border-box !important;
}


/* Name cell becomes the complete card content */

.darven-view-grid #file_manager_list_body > tr > td:has(.darven-file-entry) {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    padding: 10px !important;

    overflow: visible !important;
}


/* File entry must use full card width */

.darven-view-grid .darven-file-entry {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    box-sizing: border-box !important;
}


/* Preview area */

.darven-view-grid .darven-file-thumbnail,
.darven-view-grid .darven-file-icon,
.darven-view-grid .darven-type-icon {
    display: flex !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    height: 120px !important;

    align-items: center;
    justify-content: center;

    box-sizing: border-box !important;

    overflow: hidden;
}


/* Image */

.darven-view-grid .darven-file-thumbnail img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;
}


/* Folder icon */

.darven-view-grid .darven-folder-icon i {
    font-size: 58px !important;

    margin: 0 !important;
}


/* Type labels: PDF / TXT / DWG / ZIP ... */

.darven-view-grid .darven-type-icon {
    padding: 10px !important;

    font-size: 22px !important;

    white-space: nowrap !important;
}


/* Office */

.darven-view-grid .darven-word,
.darven-view-grid .darven-excel,
.darven-view-grid .darven-powerpoint {
    font-size: 38px !important;
}


/* Filename */

.darven-view-grid .darven-file-info {
    width: 100% !important;
    min-width: 0 !important;

    padding: 11px 3px 3px !important;

    box-sizing: border-box !important;
}

.darven-view-grid .darven-file-name {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}


/* Extension */

.darven-view-grid .darven-file-extension {
    display: block !important;

    width: 100%;

    overflow: hidden;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* Actions must float over card */

.darven-view-grid #file_manager_list_body > tr > td:last-child {
    position: absolute !important;

    top: 9px !important;
    right: 9px !important;

    z-index: 10;

    width: auto !important;
    min-width: 0 !important;

    padding: 0 !important;

    background: transparent !important;
}


/* Checkbox */

.darven-view-grid #file_manager_list_body > tr > td:first-child {
    position: absolute !important;

    top: 11px !important;
    left: 11px !important;

    z-index: 10;

    width: auto !important;
    min-width: 0 !important;

    padding: 0 !important;

    background: transparent !important;
}


/* Give overlay controls some breathing room */

.darven-view-grid .darven-file-entry {
    position: relative;
}


/* Slightly larger cards on desktop */

@media (min-width: 1200px) {

    .darven-view-grid #file_manager_list tbody {
        grid-template-columns:
            repeat(auto-fill, minmax(205px, 1fr)) !important;
    }

    .darven-view-grid .darven-file-thumbnail,
    .darven-view-grid .darven-file-icon,
    .darven-view-grid .darven-type-icon {
        height: 135px !important;
    }
}


/* ==========================================================
   DARVEN GRID - HOVER FIX
   Prevent DataTable row hover from breaking cards
   ========================================================== */

/* Never let normal table hover modify grid cells */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover > td {
    background: transparent !important;

    width: auto;
    min-width: 0 !important;
    max-width: none !important;
}


/* Name/content cell must ALWAYS remain full width */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover > td:has(.darven-file-entry),
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr > td:has(.darven-file-entry) {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    padding: 10px !important;

    overflow: visible !important;

    background: transparent !important;
}


/* Keep file entry full width during hover */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover .darven-file-entry {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}


/* Keep visual area full width */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover .darven-file-thumbnail,

body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover .darven-file-icon,

body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover .darven-type-icon {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}


/* Hover only affects the CARD itself */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover {
    background: #ffffff !important;

    border-color: #cfd4da !important;

    box-shadow:
        0 7px 22px rgba(20, 25, 30, .10) !important;

    transform: translateY(-2px);
}


/* Keep checkbox positioned correctly */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover > td:first-child {
    position: absolute !important;

    top: 11px !important;
    left: 11px !important;

    width: auto !important;

    padding: 0 !important;

    z-index: 10;
}


/* Keep action buttons positioned correctly */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover > td:last-child {
    position: absolute !important;

    top: 9px !important;
    right: 9px !important;

    width: auto !important;

    padding: 0 !important;

    z-index: 10;
}


/* Filename must not change dimensions on hover */
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover .darven-file-info,

body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover .darven-file-name {
    width: 100% !important;
    max-width: 100% !important;
}


/* DARK MODE */

[data-bs-theme="dark"]
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover {
    background: #252b31 !important;

    border-color: #4a5159 !important;

    box-shadow:
        0 7px 22px rgba(0, 0, 0, .25) !important;
}

[data-bs-theme="dark"]
body:not(.app-blank)
.darven-view-grid
#file_manager_list tbody tr:hover > td {
    background: transparent !important;
}



/* ==========================================================
   DARVEN GRID - CLICKABLE CARDS
   ========================================================== */

.darven-view-grid #file_manager_list_body > tr {
    cursor: pointer !important;
}

.darven-view-grid #file_manager_list_body > tr a,
.darven-view-grid #file_manager_list_body > tr button,
.darven-view-grid #file_manager_list_body > tr input,
.darven-view-grid #file_manager_list_body > tr .form-check {
    cursor: pointer;
}

