@php
    $dealNotifCount = \App\Models\Notification::where('user_id', auth('web')->id())
        ->where('type', 'deal_accepted')->where('is_read', false)->count();

    $isUsers   = Request::routeIs('farmer', 'farmer.*', 'vendor', 'vendor.*');
    $isMaster  = Request::routeIs('crop-categories.*', 'crops.*', 'vendor_rates.*', 'units.*', 'interests.*', 'master-rate.*');
    $isReports = Request::routeIs('reports.*');
@endphp

<style>
/* ══════════════════════════════════════
   Professional Sidebar
══════════════════════════════════════ */
.sidebar-nav-wrapper {
    width: 260px;
    min-height: 100vh;
    background: #0f172a;
    position: fixed;
    top: 0; left: 0; bottom: 0;
    z-index: 1040;
    display: flex;
    flex-direction: column;
    transition: transform .28s cubic-bezier(.4,0,.2,1), width .28s;
    overflow: hidden;
    box-shadow: 4px 0 24px rgba(0,0,0,.18);
}

/* Logo area */
.sb-logo {
    padding: 20px 22px 16px;
    border-bottom: 1px solid rgba(255,255,255,.06);
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    flex-shrink: 0;
}
.sb-logo-icon {
    width: 36px; height: 36px;
    background: linear-gradient(135deg, #365CF5, #7b96ff);
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; color: #fff; flex-shrink: 0;
}
.sb-logo-text { line-height: 1.2; }
.sb-logo-text .brand { font-size: 14px; font-weight: 800; color: #fff; }
.sb-logo-text .tagline { font-size: 10px; color: rgba(255,255,255,.4); letter-spacing: .5px; text-transform: uppercase; }

/* Admin profile chip */
.sb-profile {
    margin: 14px 14px 6px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.sb-profile-avatar {
    width: 34px; height: 34px; border-radius: 50%;
    background: linear-gradient(135deg,#365CF5,#0d9488);
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 700; color: #fff; flex-shrink: 0;
}
.sb-profile-name  { font-size: 12px; font-weight: 600; color: #fff; }
.sb-profile-role  { font-size: 10px; color: rgba(255,255,255,.4); letter-spacing: .3px; }
.sb-profile-dot   { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; margin-left: auto; flex-shrink: 0; }

/* Nav scroll area */
.sidebar-nav {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px 0 24px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.1) transparent;
}
.sidebar-nav::-webkit-scrollbar { width: 4px; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 2px; }

/* Section label */
.sb-section-label {
    padding: 14px 22px 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: rgba(255,255,255,.25);
}

/* Nav list */
.sidebar-nav ul { list-style: none; margin: 0; padding: 0; }
.sidebar-nav .nav-item { margin: 1px 10px; }

/* Single link */
.sidebar-nav .nav-item > a {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 12px;
    border-radius: 10px;
    color: rgba(255,255,255,.55);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: background .15s, color .15s;
    position: relative;
    white-space: nowrap;
    overflow: visible;
    width: auto;
}
.sidebar-nav .nav-item > a:hover {
    background: rgba(255,255,255,.07);
    color: rgba(255,255,255,.9);
}
.sidebar-nav .nav-item > a.active,
.sidebar-nav .nav-item > a[aria-expanded="true"] {
    background: rgba(54,92,245,.22);
    color: #7b96ff;
}

/* Icon container */
.sidebar-nav .nav-item > a .sb-icon {
    width: 28px; height: 28px;
    border-radius: 7px;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px;
    flex-shrink: 0;
    background: rgba(255,255,255,.05);
    transition: background .15s;
}
.sidebar-nav .nav-item > a:hover .sb-icon,
.sidebar-nav .nav-item > a.active .sb-icon,
.sidebar-nav .nav-item > a[aria-expanded="true"] .sb-icon {
    background: rgba(54,92,245,.3);
    color: #7b96ff;
}

/* ── Kill main.css triangle override on dropdown items ── */
.sidebar-nav-wrapper .sidebar-nav ul .nav-item.nav-item-has-children > a::after,
.sidebar-nav-wrapper .sidebar-nav ul .nav-item.nav-item-has-children > a::before,
.sidebar-nav-wrapper .sidebar-nav ul .nav-item.nav-item-has-children > a.collapsed::after,
.sidebar-nav-wrapper .sidebar-nav ul .nav-item.nav-item-has-children > a.collapsed::before {
    display: none !important;
    content: none !important;
}

/* Chevron for dropdowns */
.sb-chevron {
    margin-left: auto;
    font-size: 10px;
    opacity: .5;
    transition: transform .2s;
    flex-shrink: 0;
}
.sidebar-nav .nav-item > a[aria-expanded="true"] .sb-chevron {
    transform: rotate(90deg);
    opacity: .8;
}

/* Badge pill */
.sb-badge {
    margin-left: auto;
    background: #dc2626;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    min-width: 18px; height: 18px;
    border-radius: 9px;
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0 5px;
}

/* Dropdown sub-list */
.dropdown-nav {
    list-style: none;
    padding: 2px 0 4px 0;
    margin: 0;
}
.dropdown-nav li a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px 7px 40px;
    font-size: 12px;
    font-weight: 500;
    color: rgba(255,255,255,.42);
    text-decoration: none;
    border-radius: 8px;
    margin: 0 10px;
    transition: background .12s, color .12s;
    position: relative;
}
.dropdown-nav li a::before {
    content: '';
    width: 5px; height: 5px;
    border-radius: 50%;
    background: rgba(255,255,255,.25);
    flex-shrink: 0;
}
.dropdown-nav li a:hover { background: rgba(255,255,255,.06); color: rgba(255,255,255,.8); }
.dropdown-nav li a.active { color: #7b96ff; }
.dropdown-nav li a.active::before { background: #7b96ff; }

/* Divider */
.sb-divider {
    margin: 10px 18px;
    border-top: 1px solid rgba(255,255,255,.06);
}

/* Bottom sign-out */
.sb-footer {
    padding: 10px 14px 16px;
    border-top: 1px solid rgba(255,255,255,.06);
    flex-shrink: 0;
}
.sb-signout {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 12px;
    border-radius: 10px;
    color: rgba(255,255,255,.45);
    font-size: 13px; font-weight: 500;
    border: none;
    background: transparent;
    width: 100%;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.sb-signout:hover { background: rgba(220,38,38,.15); color: #f87171; }
.sb-signout .sb-icon { width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;font-size:13px; }

/* ── Mobile overlay ── */
@media (max-width: 991px) {
    .sidebar-nav-wrapper {
        transform: translateX(-100%);
    }
    .sidebar-nav-wrapper.sidebar-open {
        transform: translateX(0);
    }
}
</style>

{{-- Logo --}}
<a href="{{ route('dashboard') }}" class="sb-logo">
    <div class="sb-logo-icon"><i class="lni lni-leaf"></i></div>
    <div class="sb-logo-text">
        <div class="brand">Farm to APMC</div>
        <div class="tagline">Admin Panel</div>
    </div>
</a>

{{-- Admin chip --}}
<div class="sb-profile">
    <div class="sb-profile-avatar">{{ strtoupper(substr(auth('web')->user()->name ?? 'A', 0, 1)) }}</div>
    <div>
        <div class="sb-profile-name">{{ auth('web')->user()->name ?? 'Admin' }}</div>
        <div class="sb-profile-role">Super Admin</div>
    </div>
    <div class="sb-profile-dot" title="Online"></div>
</div>

<nav class="sidebar-nav">
    <ul>

        {{-- MAIN --}}
        <li class="sb-section-label">Main</li>

        <li class="nav-item">
            <a href="{{ route('dashboard') }}" class="{{ Request::routeIs('dashboard') ? 'active' : '' }}">
                <span class="sb-icon"><i class="fa-solid fa-gauge"></i></span>
                <span>Dashboard</span>
            </a>
        </li>

        {{-- MANAGEMENT --}}
        <li class="sb-section-label">Management</li>

        {{-- User Approval --}}
        <li class="nav-item nav-item-has-children">
            <a href="#ddmenu_users" class="{{ $isUsers ? '' : 'collapsed' }}"
               data-bs-toggle="collapse" aria-controls="ddmenu_users"
               aria-expanded="{{ $isUsers ? 'true' : 'false' }}">
                <span class="sb-icon"><i class="fa-regular fa-user"></i></span>
                <span>User Approval</span>
                <i class="fas fa-chevron-right sb-chevron"></i>
            </a>
            <ul id="ddmenu_users" class="collapse dropdown-nav {{ $isUsers ? 'show' : '' }}">
                <li>
                    <a href="{{ route('farmer') }}" class="{{ Request::routeIs('farmer', 'farmer.*') ? 'active' : '' }}">
                        Farmers
                    </a>
                </li>
                <li>
                    <a href="{{ route('vendor') }}" class="{{ Request::routeIs('vendor', 'vendor.*') ? 'active' : '' }}">
                        Vendors
                    </a>
                </li>
            </ul>
        </li>

        {{-- Leads --}}
        <li class="nav-item">
            <a href="{{ route('interests.index') }}" class="{{ Request::routeIs('interests.*') ? 'active' : '' }}">
                <span class="sb-icon"><i class="fa-solid fa-bars-progress"></i></span>
                <span>Leads</span>
            </a>
        </li>

        {{-- Vendor Crop Requests --}}
        <li class="nav-item">
            <a href="{{ route('vendor-requests.index') }}" class="{{ Request::routeIs('vendor-requests.*') ? 'active' : '' }}">
                <span class="sb-icon"><i class="fa-solid fa-clipboard-list"></i></span>
                <span>Crop Requests</span>
            </a>
        </li>

        {{-- Deal Pipeline --}}
        <li class="nav-item">
            <a href="{{ route('deals.pipeline') }}" class="{{ Request::routeIs('deals.*') ? 'active' : '' }}">
                <span class="sb-icon"><i class="fa-solid fa-handshake"></i></span>
                <span>Deal Pipeline</span>
                @if($dealNotifCount > 0)
                    <span class="sb-badge">{{ $dealNotifCount > 99 ? '99+' : $dealNotifCount }}</span>
                @endif
            </a>
        </li>

        {{-- MASTER DATA --}}
        <li class="sb-section-label">Master Data</li>

        <li class="nav-item nav-item-has-children">
            <a href="#ddmenu_master" class="{{ $isMaster ? '' : 'collapsed' }}"
               data-bs-toggle="collapse" aria-controls="ddmenu_master"
               aria-expanded="{{ $isMaster ? 'true' : 'false' }}">
                <span class="sb-icon"><i class="fas fa-warehouse"></i></span>
                <span>Master</span>
                <i class="fas fa-chevron-right sb-chevron"></i>
            </a>
            <ul id="ddmenu_master" class="collapse dropdown-nav {{ $isMaster ? 'show' : '' }}">
                <li>
                    <a href="{{ route('crops.index') }}" class="{{ Request::routeIs('crops.*') ? 'active' : '' }}">Crops</a>
                </li>
                <li>
                    <a href="{{ route('crop-categories.index') }}" class="{{ Request::routeIs('crop-categories.*') ? 'active' : '' }}">Crop Categories</a>
                </li>
                <li>
                    <a href="{{ route('master-rate.index') }}" class="{{ Request::routeIs('master-rate.*') ? 'active' : '' }}">Market Rates</a>
                </li>
                {{-- <li>
                    <a href="{{ route('vendor_rates.index') }}" class="{{ Request::routeIs('vendor_rates.*') ? 'active' : '' }}">Vendor Rates</a>
                </li> --}}
                <li>
                    <a href="{{ route('units.index') }}" class="{{ Request::routeIs('units.*') ? 'active' : '' }}">Measure Units</a>
                </li>
            </ul>
        </li>

        {{-- ANALYTICS --}}
        <li class="sb-section-label">Analytics</li>

        <li class="nav-item nav-item-has-children">
            <a href="#ddmenu_reports" class="{{ $isReports ? '' : 'collapsed' }}"
               data-bs-toggle="collapse" aria-controls="ddmenu_reports"
               aria-expanded="{{ $isReports ? 'true' : 'false' }}">
                <span class="sb-icon"><i class="fa-regular fa-chart-bar"></i></span>
                <span>Reports</span>
                <i class="fas fa-chevron-right sb-chevron"></i>
            </a>
            <ul id="ddmenu_reports" class="collapse dropdown-nav {{ $isReports ? 'show' : '' }}">
                <li>
                    <a href="{{ route('reports.registrations') }}" class="{{ Request::routeIs('reports.registrations') ? 'active' : '' }}">Registrations</a>
                </li>
                <li>
                    <a href="{{ route('reports.deals') }}" class="{{ Request::routeIs('reports.deals') ? 'active' : '' }}">Deals</a>
                </li>
                <li>
                    <a href="{{ route('reports.kyc') }}" class="{{ Request::routeIs('reports.kyc') ? 'active' : '' }}">KYC</a>
                </li>
            </ul>
        </li>

        <li class="nav-item">
            <a href="{{ route('audit.logs') }}" class="{{ Request::routeIs('audit.logs') ? 'active' : '' }}">
                <span class="sb-icon"><i class="fas fa-history"></i></span>
                <span>Audit Logs</span>
            </a>
        </li>

    </ul>
</nav>

{{-- Sign out --}}
<div class="sb-footer">
    <form method="post" action="{{ route('admin.logout') }}">
        @csrf
        <button type="submit" class="sb-signout">
            <span class="sb-icon"><i class="lni lni-exit"></i></span>
            Sign Out
        </button>
    </form>
</div>