#sidebar {
box-shadow: 2px 0 10px rgba(0, 0, 0, 0.05);
z-index: 1000;
transition: transform 0.3s ease-in-out;
}
#sidebar[aria-hidden="false"] {
transform: translateX(0);
visibility: visible;
} #sidebar nav a {
transition: all 0.2s ease;
position: relative;
overflow: hidden;
}
#sidebar nav a:before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 3px;
background-color: #3b82f6;
transform: translateX(-100%);
transition: transform 0.2s ease;
}
#sidebar nav a:hover:before,
#sidebar nav a:focus:before {
transform: translateX(0);
} #sidebar nav a[aria-current="page"] {
@apply bg-blue-50 text-blue-700;
}
#sidebar nav a[aria-current="page"]:before {
transform: translateX(0);
} #sidebar .category-count {
font-size: 0.7rem;
background-color: #e5e7eb;
border-radius: 9999px;
} #right-sidebar .widget,
.calendar-section {
background: white;
border-radius: 0.75rem;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
margin-bottom: 1.5rem;
overflow: hidden;
display: flex;
flex-direction: column;
width: 100%;
max-width: 100%;
box-sizing: border-box;
} .calendar-section {
position: relative;
z-index: 1;
} .calendar-section > div {
flex: 0 0 auto;
} #right-sidebar .widget > div,
.widget-shadow > div:not([class*="bg-"]) {
padding: 1.25rem;
flex: 0 0 auto;
display: flex;
flex-direction: column;
width: 100%;
box-sizing: border-box;
} .widget-shadow {
display: flex;
flex-direction: column;
height: auto !important;
min-height: 0;
} .bg-white.rounded-2xl {
display: flex;
flex-direction: column;
overflow: hidden;
} .bg-white.rounded-2xl > div {
flex: 0 0 auto;
min-height: 0;
} .bg-gradient-to-r + div {
flex: 0 0 auto !important;
} .from-green-500 + div {
flex: 0 0 auto !important;
} .from-indigo-500 + div {
flex: 0 0 auto !important;
min-height: 0;
} #right-sidebar .widget_calendar {
background: white;
} #right-sidebar #weather-info {
background: transparent;
} #right-sidebar .widget > * {
flex: 0 0 auto;
} #right-sidebar .widget > *:last-child {
margin-bottom: 0;
} #right-sidebar .widget-title {
padding: 1.25rem 1.25rem 0.75rem;
margin: 0;
font-size: 1.125rem;
font-weight: 600;
color: #1f2937;
}
padding: 0.15rem 0.4rem;
margin-left: auto;
} #sidebar::-webkit-scrollbar {
width: 6px;
}
#sidebar::-webkit-scrollbar-track {
background: #f1f1f1;
}
#sidebar::-webkit-scrollbar-thumb {
background: #cbd5e1;
border-radius: 3px;
}
#sidebar::-webkit-scrollbar-thumb:hover {
background: #94a3b8;
} @media (max-width: 768px) {
#sidebar {
width: 280px;
}
#sidebar[aria-hidden="true"] {
transform: translateX(-100%);
}
} .sidebar-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 999;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.sidebar-overlay.active {
opacity: 1;
visibility: visible;
} #sidebar .sidebar-heading {
border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; background-color: #eef2ff; padding: 0.75rem 1rem; margin-bottom: 0.5rem; } .sidebar-core-service-icon {
border-radius: 1rem !important; }