@tailwind base;
@tailwind components;
@tailwind utilities;
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */
 @tailwind base;
@tailwind components;
@tailwind utilities;

.sidebar-item {
            transition: all 0.2s ease;
            border-left: 3px solid transparent;
            color: #94a3b8; /* slate-400 */
        }
        .sidebar-item:hover {
            background-color: rgba(255, 255, 255, 0.05);
            color: #f1f5f9; /* slate-100 */
        }
        .sidebar-item.active {
            background: linear-gradient(90deg, rgba(79, 70, 229, 0.15) 0%, transparent 100%);
            border-left-color: #6366f1; /* indigo-500 */
            color: #ffffff;
        }

        /* --- Custom Scrollbar --- */
        .custom-scrollbar::-webkit-scrollbar { width: 4px; }
        .custom-scrollbar::-webkit-scrollbar-thumb { background: #334155; border-radius: 10px; }

        /* --- Glass Navbar --- */
        .glass-nav {
            background: rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }

        /* --- Animations --- */
        .rotate-icon { transition: transform 0.2s ease; }
        .rotate-90 { transform: rotate(90deg); }
        .rotate-180 { transform: rotate(180deg); }

        #user-dropdown {
            transform-origin: top right;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        /* Smooth sub-menu transition */
        #leads-submenu {
            transition: max-height 0.3s ease-out;
            max-height: 0;
            overflow: hidden;
        }
        #leads-submenu.open {
            max-height: 200px; /* Adjust based on content */
        }
         .glass-nav {
            background: rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }
        .rotate-icon { transition: transform 0.2s ease; }
        .rotate-180 { transform: rotate(180deg); }
        
        /* Sidebar Active State Styles */
        .sidebar-item { border-left: 3px solid transparent; transition: all 0.2s; }
        .sidebar-item.active {
            background: linear-gradient(90deg, rgba(79, 70, 229, 0.1) 0%, transparent 100%);
            border-left-color: #6366f1;
            color: white !important;
        }