  /* Custom Scrollbar */
    ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }
    ::-webkit-scrollbar-track {
      background: #f1f5f9;
    }
    ::-webkit-scrollbar-thumb {
      background: #cbd5e1;
      border-radius: 4px;
    }
    ::-webkit-scrollbar-thumb:hover {
      background: #94a3b8;
    }

    body {
      font-family: 'Roboto', sans-serif;
    }
    .file-row:hover { background-color: #f1f5f9; }
    .selected { background-color: #dbeafe !important; border-left: 4px solid #3b82f6; } /* Accent for selected row */
    .folder-toggle::before {
      content: '\002B'; /* + */
      display: inline-block;
      width: 1em;
      margin-right: 0.5em;
    }
    .folder-toggle.expanded::before {
      content: '\2212'; /* - */
    }
    .sidebar-link {
        display: flex;
        align-items: center;
        padding: 0.5rem 1rem;
        border-radius: 0.375rem; /* rounded-md */
        color: #4b5563; /* text-gray-700 */
        transition: background-color 0.2s, color 0.2s;
    }
    .sidebar-link:hover {
        background-color: #e2e8f0; /* hover:bg-gray-200 */
        color: #1f2937; /* hover:text-gray-900 */
    }
    .sidebar-link.active {
        background-color: #bfdbfe; /* bg-blue-200 */
        color: #1e40af; /* text-blue-800 */
        font-weight: 600;
    }
    .action-button {
        display: inline-flex;
        align-items: center;
        padding: 0.5rem 1rem;
        border-radius: 0.375rem;
        font-weight: 500;
        transition: background-color 0.2s, color 0.2s, box-shadow 0.2s;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    }
    .action-button:hover {
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    }
    .action-button i {
        margin-right: 0.5rem;
    }
    .action-button.upload { background-color: #dbeafe; color: #1e40af; } /* bg-blue-200 text-blue-800 */
    .action-button.upload:hover { background-color: #bfdbfe; }
    .action-button.create { background-color: #ccfbf1; color: #0f766e; } /* bg-teal-100 text-teal-700 */
    .action-button.create:hover { background-color: #99f6e4; }
    .action-button.edit { background-color: #d1fae5; color: #065f46; } /* bg-green-200 text-green-800 */
    .action-button.edit:hover { background-color: #a7f3d0; }
    .action-button.compress { background-color: #ede9fe; color: #5b21b6; } /* bg-purple-200 text-purple-800 */
    .action-button.compress:hover { background-color: #ddd6fe; }
    .action-button.extract { background-color: #fee2e2; color: #b91c1c; } /* bg-red-200 text-red-800 */
    .action-button.extract:hover { background-color: #fecaca; }
    .action-button.delete { background-color: #fee2e2; color: #b91c1c; } /* bg-red-200 text-red-800 */
    .action-button.delete:hover { background-color: #fecaca; }
    .action-button.download { background-color: #dbeafe; color: #1e40af; } /* bg-blue-200 text-blue-800 */
    .action-button.download:hover { background-color: #bfdbfe; }
    .action-button.logout { background-color: #1f2937; color: #ffffff; } /* bg-gray-900 text-white */
    .action-button.logout:hover { background-color: #374151; }

    /* Breadcrumbs Style */
    .breadcrumbs {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        font-size: 0.9rem;
        color: #6b7280; /* text-gray-500 */
    }
    .breadcrumbs a {
        color: #3b82f6; /* text-blue-600 */
        text-decoration: none;
    }
    .breadcrumbs a:hover {
        text-decoration: underline;
    }
    .breadcrumbs span {
        margin: 0 0.25rem;
        color: #9ca3af; /* text-gray-400 */
    }

    /* Modal centering and animation */
    #confirmDeleteModal, #createFolderModal, #createFileModal {
        display: flex;
        justify-content: center;
        align-items: center;
        /* Ensure it's hidden by default and correctly toggled */
    }
    .modal-content.opacity-0 {
        opacity: 0;
    }
    .modal-content.scale-95 {
        transform: scale(0.95);
    }
    .modal-content.opacity-100 {
        opacity: 1;
    }
    .modal-content.scale-100 {
        transform: scale(1);
    }
    /* Override Tailwind's default hidden for modal to ensure proper animation */
    #confirmDeleteModal.hidden, #createFolderModal.hidden, #createFileModal.hidden {
        display: none !important;
    }
