/* Cloud Lite Suite — Unified Skin (v1.0.10)
   Applies to:
   - Multi-Lite (.mlt-*)
   - GDrive Lite (.gdl-*, .gdrive-lite-*)
   - OneDrive Lite (.ol-*, .onedrive-lite-*)
   - Cloud Lite Dropbox (.cl-*/
.cloud-lite-*) - Front-end “admin explorer” blocks: #oladmin_*,
#gdladmin_*,
#cladmin_* */

/* ======================= TABS: NAV & BUTTONS ======================= */
.mlt-nav,
.gdl-tab-header,
.od-tab-bar,
.cl-tab-bar {
    list-style: none;
    padding: 0;
    margin: 0 0 10px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    border: none;
}

.mlt-nav .mlt-tab,
.gdl-tab-btn,
.od-tab-btn,
.cl-tab-bar .cl-tab-btn {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid #ddd;
    background: #f7f7f7;
    padding: 6px 10px;
    cursor: pointer;
    border-radius: 4px;
    line-height: 1.2;
    font-weight: 500;
    color: #222 !important;
    -webkit-text-fill-color: #222 !important;
    transition: background .12s ease, border-color .12s ease, box-shadow .12s ease;
    text-align: center;
}

.mlt-nav .mlt-tab:hover,
.mlt-nav .mlt-tab:focus,
.gdl-tab-btn:hover,
.gdl-tab-btn:focus,
.od-tab-btn:hover,
.od-tab-btn:focus,
.cl-tab-bar .cl-tab-btn:hover,
.cl-tab-bar .cl-tab-btn:focus {
    background: #fff;
    border-color: #bbb;
    color: #222 !important;
    -webkit-text-fill-color: #222 !important;
    outline: 2px solid transparent;
    outline-offset: 2px;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, .06);
}

.mlt-nav .mlt-tab.is-active,
.gdl-tab-btn.active,
.od-tab-btn.active,
.cl-tab-bar .cl-tab-btn.active {
    background: #fff;
    border-color: #bbb;
    color: #222 !important;
    -webkit-text-fill-color: #222 !important;
    font-weight: 600;
}

/* Panels containers */
.mlt-panes,
.gdl-tab-content,
.od-tabs,
.cl-tab-panels {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 8px;
    background: #fff;
}

/* Hidden/visible panels */
.mlt-pane {
    display: none;
}

.mlt-pane.is-active {
    display: block;
}

.gdl-tab-panel {
    display: none;
}

.gdl-tab-panel.active {
    display: block;
}

.od-tab-panel {
    display: none;
}

.od-tab-panel.active {
    display: block;
}

.cl-tab-panel {
    display: none;
}

.cl-tab-panel.active {
    display: block;
}

/* ======================= BROWSER: OUTER BOX ======================= */
.gdrive-lite-box,
.gdrive-lite-browser,
[id^="olb_"],
.od-lite-box,
.cloud-lite-box {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    background: #fff;
    margin: 20px 0;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}

/* ======================= BREADCRUMB ======================= */
.gdl-nav,
.gdl-browser-header,
.ol-nav,
.od-nav,
.cl-nav {
    background: #f8f9fa !important;
    border-bottom: 1px solid #dee2e6 !important;
    padding: 12px 16px !important;
    margin: 0 !important;
    font-size: 14px;
}

.gdl-nav a,
.gdl-breadcrumb a,
.ol-nav a,
.od-nav a,
.cl-nav a {
    display: inline-block;
    padding: 4px 6px;
    border-radius: 4px;
    color: #0073aa !important;
    text-decoration: none;
    font-weight: 500;
}

.gdl-nav a:hover,
.gdl-breadcrumb a:hover,
.ol-nav a:hover,
.od-nav a:hover,
.cl-nav a:hover {
    background: rgba(0, 0, 0, 0.04);
    text-decoration: none;
}

.gdl-breadcrumb .gdl-separator {
    margin: 0 6px;
    color: #adb5bd;
}

.gdl-breadcrumb .gdl-current {
    font-weight: 600;
    color: #2b2f33;
}

.cl-nav a:last-child {
    font-weight: 600;
    color: #2b2f33;
}

/* ======================= TABLE ======================= */
.gdl-body,
.od-body,
.cl-body {
    padding: 0;
}

.gdl-table,
.ol-table,
.od-table,
.cl-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    font-size: 14px;
}

.gdl-table th,
.gdl-table td,
.ol-table th,
.ol-table td,
.od-table th,
.od-table td,
.cl-table th,
.cl-table td {
    padding: 10px 12px !important;
    border-bottom: 1px solid #eee !important;
    vertical-align: middle;
    text-align: left;
}

.gdl-table thead th,
.ol-table thead th,
.od-table thead th,
.cl-table thead th {
    background: #fafafa !important;
    color: #495057 !important;
    font-weight: 600;
}

.gdl-table tbody tr:hover,
.ol-table tbody tr:hover,
.od-table tbody tr:hover,
.cl-table tbody tr:hover {
    background: #f9fbff;
}

.gdl-table td a,
.ol-table td a,
.od-name a,
.cl-table td a[data-folder],
.cl-table td a[data-file] {
    color: #2b2f33 !important;
    text-decoration: none;
}

.gdl-table td a:hover,
.ol-table td a:hover,
.od-name a:hover,
.cl-table td a[data-folder]:hover,
.cl-table td a[data-file]:hover {
    text-decoration: underline;
}

.gdl-file-size,
.gdl-file-modified,
.ol-size,
.od-size,
.ol-fileinfo,
.od-fileinfo {
    color: #6c757d !important;
}

/* ======================= DOWNLOAD STRIPS (light bg) ======================= */
.cloud-lite-dl,
.cloud-lite-box .cl-file-pill,
.cloud-lite-box .cl-item-download,
.onedrive-lite-dl,
.gdrive-lite-dl,
.gdrive-lite-download,
.gdl-dl,
.gdl-download-row,
.gdl-file-card {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 12px 0;
    padding: 12px;
    background: #f8f9fa !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px;
    color: #111;
}

.onedrive-lite-dl .ol-fileinfo,
.onedrive-lite-dl .ol-name {
    color: #2b2f33 !important;
    font-weight: 600;
}

.onedrive-lite-dl .ol-size {
    color: #6c757d !important;
    opacity: .9;
    margin-left: 6px;
}

/* ======================= DOWNLOAD BUTTONS (unified) ======================= */
/* SUPER SPECIFIC + neutralize theme and inline styles */
body .gdrive-lite-btn,
body a.gdrive-lite-btn,
body .gdrive-lite-box .gdl-table td a.button.button-small,
body .gdrive-lite-box .gdl-body a.button.button-small,
body .gdrive-lite-box a.button.button-small,
body .gdrive-lite-dl .button,
body .gdrive-lite-download .button,
body .gdl-download-btn,
body .onedrive-lite-btn,
body .cloud-lite-btn,
body .cloud-lite-dl .button,
body .onedrive-lite-dl .button {
    background: #4285f4 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 8px 14px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    min-width: 120px;
    justify-content: center;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

body .gdrive-lite-btn:hover,
body a.gdrive-lite-btn:hover,
body .gdrive-lite-box .gdl-table td a.button.button-small:hover,
body .gdrive-lite-box .gdl-body a.button.button-small:hover,
body .gdrive-lite-box a.button.button-small:hover,
body .gdrive-lite-dl .button:hover,
body .gdrive-lite-download .button:hover,
body .gdl-download-btn:hover,
body .onedrive-lite-btn:hover,
body .cloud-lite-btn:hover,
body .cloud-lite-dl .button:hover,
body .onedrive-lite-dl .button:hover {
    background: #3367d6 !important;
    color: #fff !important;
}

/* ======================= LOAD MORE ======================= */
.gdl-load-more,
.cl-more,
.od-load-more,
.ol-load-more {
    margin: 10px auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border: 1px solid #d0d7de;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    text-decoration: none;
    color: #222;
}

.gdl-load-more:hover,
.cl-more:hover,
.od-load-more:hover,
.ol-load-more:hover {
    background: #f6f8fa;
}

/* ======================= FRONT-END “ADMIN EXPLORER” (OneDrive/GDrive) ======================= */
.entry-content [id^="oladmin_"],
.entry-content [id^="gdladmin_"],
[id^="oladmin_"],
[id^="gdladmin_"] {
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 12px !important;
    margin: 16px 0 !important;
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04) !important;
}

[id^="oladmin_"]>div:first-child,
[id^="gdladmin_"]>div:first-child {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-bottom: 8px;
    font-size: 14px;
}

[id^="oladmin_"] .ol-admin-nav,
[id^="gdladmin_"] .gdl-admin-nav {
    background: #f8f9fa !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    padding: 8px 10px !important;
    margin-bottom: 10px !important;
}

[id^="oladmin_"] .ol-admin-nav a,
[id^="gdladmin_"] .gdl-admin-nav a {
    text-decoration: none;
    margin-right: 6px;
    color: #0073aa !important;
    padding: 2px 4px;
    border-radius: 4px;
}

[id^="oladmin_"] .ol-admin-nav a:hover,
[id^="gdladmin_"] .gdl-admin-nav a:hover {
    background: rgba(0, 0, 0, .04);
}

[id^="oladmin_"] .ol-admin-body .ol-table,
[id^="gdladmin_"] .gdl-admin-body .gdl-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

[id^="oladmin_"] .ol-admin-body .ol-table th,
[id^="oladmin_"] .ol-admin-body .ol-table td,
[id^="gdladmin_"] .gdl-admin-body .gdl-table th,
[id^="gdladmin_"] .gdl-admin-body .gdl-table td {
    border-bottom: 1px solid #eee !important;
    padding: 10px 12px !important;
    text-align: left;
    vertical-align: middle;
}

[id^="oladmin_"] .ol-admin-body .ol-table thead th,
[id^="gdladmin_"] .gdl-admin-body .gdl-table thead th {
    background: #fafafa !important;
    color: #495057 !important;
    font-weight: 600;
}

[id^="oladmin_"] .ol-admin-body .ol-table tbody tr:hover,
[id^="gdladmin_"] .gdl-admin-body .gdl-table tbody tr:hover {
    background: #f9fbff;
}

[id^="oladmin_"] .muted,
[id^="gdladmin_"] .muted {
    opacity: .75 !important;
}

.entry-content [id^="oladmin_"] .button,
.entry-content [id^="gdladmin_"] .button,
[id^="oladmin_"] .button,
[id^="gdladmin_"] .button {
    background: #4285f4 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 8px 14px !important;
    text-decoration: none !important;
    cursor: pointer !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

.entry-content [id^="oladmin_"] .button:hover,
.entry-content [id^="gdladmin_"] .button:hover,
[id^="oladmin_"] .button:hover,
[id^="gdladmin_"] .button:hover {
    background: #3367d6 !important;
}

/* ======================= FRONT-END “ADMIN EXPLORER” (Dropbox) ======================= */
.entry-content [id^="cladmin_"],
[id^="cladmin_"],
.cl-admin-box {
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 12px !important;
    margin: 16px 0 !important;
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04) !important;
}

[id^="cladmin_"] .cl-admin-head {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-bottom: 8px !important;
    font-size: 14px;
}

[id^="cladmin_"] .cl-admin-head .label {
    font-weight: 600;
}

[id^="cladmin_"] .cl-admin-nav {
    background: #f8f9fa !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    padding: 8px 10px !important;
    margin-bottom: 10px !important;
}

[id^="cladmin_"] .cl-admin-nav a {
    text-decoration: none;
    margin-right: 6px;
    color: #0073aa !important;
    padding: 2px 4px;
    border-radius: 4px;
}

[id^="cladmin_"] .cl-admin-nav a:hover {
    background: rgba(0, 0, 0, .04);
}

[id^="cladmin_"] .cl-admin-body .cl-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

[id^="cladmin_"] .cl-admin-body .cl-table th,
[id^="cladmin_"] .cl-admin-body .cl-table td {
    border-bottom: 1px solid #eee !important;
    padding: 10px 12px !important;
    text-align: left;
    vertical-align: middle;
}

[id^="cladmin_"] .cl-admin-body .cl-table thead th {
    background: #fafafa !important;
    color: #495057 !important;
    font-weight: 600;
}

[id^="cladmin_"] .cl-admin-body .cl-table tbody tr:hover {
    background: #f9fbff;
}

[id^="cladmin_"] .muted {
    opacity: .75 !important;
}

.entry-content [id^="cladmin_"] .button,
[id^="cladmin_"] .button {
    background: #4285f4 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 8px 14px !important;
    text-decoration: none !important;
    cursor: pointer !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

.entry-content [id^="cladmin_"] .button:hover,
[id^="cladmin_"] .button:hover {
    background: #3367d6 !important;
}