/* Sidebar Styles */
.sidebar {
    transition: width 0.3s ease-in-out;
}

.sidebar.collapsed {
    width: 2.8rem;
}

.sidebar.expanded {
    width: 12rem;
}

/* Logo styles */
.logo-container {
    display: flex;
    align-items: center;
    transition: all 0.3s ease-in-out;
}

.logo-img, .icon-img {
    transition: all 0.3s ease-in-out;
}

.sidebar.expanded .logo-img {
    display: block;
    height: 2rem;
}

.sidebar.expanded .icon-img {
    display: none;
}

.sidebar.collapsed .logo-img {
    display: none;
}

.sidebar.collapsed .icon-img {
    display: block;
    height: 2rem;
}

/* Main Content Styles */
.main-content {
    transition: margin-left 0.3s ease-in-out;
}

.main-content.sidebar-collapsed {
    margin-left: 2.8rem;
}

.main-content.sidebar-expanded {
    margin-left: 12rem;
}

/* Navigation Text Styles */
.nav-text {
    transition: opacity 0.3s ease-in-out;
}

.sidebar.collapsed .nav-text {
    display: none;
}

.sidebar.expanded .nav-text {
    display: block;
}

/* Media query for mobile devices */
@media (max-width: 768px) {
    main {
        padding: 0 0.2rem; /* Set padding to 0 for mobile devices */
    }
}