.sidenav{
    visibility:hidden !important;
}

.nav button svg {display:none;}




#show-bookmarks {display: none;}

div[data-radix-popper-content-wrapper] {
   /* display: none !important; */
}


/* Theme change */ 
.nav {
  background-color: #323232; /* Set background to #323232 */
  border-radius: 10px; /* Add 10px border radius */
  margin: 10px; /* Add 10px margin */
  color: white; /* Set all text inside to white */
}

.nav * {
  color: white !important; /* Ensure all text inside nav and its children are white */
}

.nav a, .nav button, .nav div {
  color: white !important; /* Ensure all links, buttons, divs are styled correctly */
  background-color: transparent !important; /* Remove any conflicting background colours */
}

.nav a:hover, .nav button:hover {
  background-color: #454545; /* Hover effect for buttons and links */
}

.nav img {
  border-radius: 50%; /* Keep images rounded, like avatars */
}

.nav .group, .nav .group-ui-open {
  background-color: #454545; /* Match background with hover behaviour */
  border-radius: 10px; /* Maintain rounded corners */
  margin-bottom: 10px; /* Consistent spacing */
}

.nav button{
  color: #ffffff !important; /* Set text color to white */
}


.nav button span.hidden {
  visibility: visible !important;
  display: block;
}

/* Apply Plus Jakarta Sans font globally */
html, body, button, input, textarea, select {
  font-family: 'Plus Jakarta Sans', sans-serif;
}


/* Base styling for the link */
a[data-testid="convo-item"] {
    color: white !important; /* Set link text to white */
    background-color: #3b3b3b !important; /* Slightly lighter than #323232 */
    border-radius: 10px; /* Add rounded corners */
    border: none !important; /* Remove any default borders */
    overflow: hidden; /* Ensure no children overflow out of parent */
    transition: transform 0.2s ease, background-color 0.2s ease; /* Smooth transition */
}

/* Hover effect: Slight lift and subtle background color change */
a[data-testid="convo-item"]:hover {
    background-color: #454545 !important; /* Slightly darker background on hover */
    transform: translateY(-2px); /* Slight lift effect */
    border: none !important; /* Ensure no border on hover */
    box-shadow: none !important; /* Remove any shadow effects */
}

/* Ensure no child elements create overflow */
a[data-testid="convo-item"] .bg-gradient-to-l {
    background: none !important; /* Remove gradient completely */
}

/* Style icons (SVGs) inside the links */
a[data-testid="convo-item"] svg {
    fill: #ffffff !important; /* Force white color for SVG icons */
}

/* Ensure text inside the link remains white */
a[data-testid="convo-item"] .line-clamp-1 {
    color: #ffffff !important; /* Ensure text remains white */
}

/* Ensure the background on the right side is transparent or matching */
a[data-testid="convo-item"] .absolute {
    background: none !important; /* Remove any additional background on the right */
    display: none !important; /* Hide the absolute div causing issues */
}

/* Target the grandparent element */
.peer {
    background: none !important; /* Remove any background */
    border-radius: 0 !important; /* Remove any border-radius */
    overflow: hidden; /* Ensure no child elements overflow */
}

/* Ensure the absolute positioning doesn't cause issues */
.peer.absolute {
    background: none !important; /* Remove background */
    box-shadow: none !important; /* Remove shadow if any */
    border: none !important; /* Remove borders */
}

/* Remove the hover gradient effect */
.peer.group-hover\:bg-gradient-to-l {
    background: none !important; /* Disable the gradient on hover */
    background-color: transparent !important; /* Ensure background stays transparent */
}

/* Target the gradient that's causing the issue and remove it */
.peer .group-hover\:from-gray-200,
.peer .dark\:from-gray-800,
.peer .group-hover\:from-gray-800 {
    background: none !important; /* Remove any hover gradient */
}

/* Ensure no borders or shadows on hover */
.peer:hover {
    background: #3b3b3b !important; /* Subtle background color on hover */
    box-shadow: none !important; /* Remove any shadow */
    border: none !important; /* No border on hover */
}

.text-token-text-secondary {
    padding-top: 20px; /* Adjust this value to whatever padding you prefer */
}

.popover-ui {
background-color:#323232 !important;

}