:root {
    --color-transition: background-color 0.3s ease, color 0.3s ease;

    --bg-color: #1b1b1b;
    --text-color: #cccccc;

    --link-color: #3333ff;

    /* Top bar */
    --top-bar-bg-color: #2a2a2a;
    --top-bar-hover-color: #3b3b3b;
    --top-bar-text-color: #aaaaaa;
    --hamburger-icon-color: #cccccc;
    --sun-icon-color: #FDB813;

    /* Side bar */
    --side-bar-bg-color: #393939;
    --side-bar-hover-color: #484848;
    --side-bar-text-color: #999999;

    /* User menu */
    --user-menu-bg-color: var(--side-bar-bg-color);
    --user-menu-hover-color: var(--side-bar-hover-color);
    --user-menu-text-color: var(--side-bar-text-color);

    /* File collection */
    --file-collection-bg-color: #222222;
    --file-collection-hover-color: #333333;
    --file-collection-border-color: #444444;
    --file-collection-text-color: var(--text-color);

    /* Account form */
    --account-form-bg-color: var(--file-collection-bg-color);
    --account-form-hover-color: var(--file-collection-hover-color);
    --account-form-border-color: var(--file-collection-border-color);
    --account-form-text-color: var(--file-collection-text-color);

    /* Page Overview */
    --page-overview-bg-color: var(--file-collection-bg-color);
    --page-overview-hover-color: var(--file-collection-hover-color);
    --page-overview-border-color: var(--file-collection-border-color);
    --page-overview-text-color: var(--file-collection-text-color);
}