@if ($polices->count() > 0)
    <div class="display-count-chic animate-fade-in">
        AFFICHAGE DE  &nbsp;<strong>{{ $polices->count() }}</strong> &nbsp;POLICE(S)
    </div>
@endif

<div class="police-grid animate-fade-in">
    @forelse($polices as $p)
        @php
            $isExpired = \Carbon\Carbon::parse($p->dateEcheance)->isPast();
            $statusColor = '108, 117, 125'; // Default muted
            $displayStatus = $p->etatPolice;

            if($isExpired && $p->codeEtatPolice == 'EC') {
                $statusColor = '231, 76, 60'; // Red for expired
                $displayStatus = 'EXPIRÉ';
            } else {
                if($p->codeEtatPolice == 'EC') $statusColor = '46, 204, 113'; // Green
                elseif($p->codeEtatPolice == 'RE') $statusColor = '231, 76, 60'; // Red
                elseif($p->codeEtatPolice == 'SU') $statusColor = '241, 196, 15'; // Yellow
                elseif($p->codeEtatPolice == 'AN') $statusColor = '52, 152, 219'; // Blue
            }
        @endphp

        <div class="police-card-chic" style="--badge-color: {{ $statusColor }};">
            <div class="status-glow"></div>
            
            <div class="card-header-chic">
                <h5 class="police-title-chic">{{ $p->libellePolice }}</h5>
                <span class="badge-status-chic">{{ $displayStatus }}</span>
            </div>

            <div class="card-body-chic">
                <div class="info-grid-chic">
                    <div class="info-item-chic">
                        <i class="feather icon-hash"></i>
                        <span class="info-label-chic">N° Police</span>
                        <span class="info-value-chic fw-700">{{ $p->numeroPolice }}</span>
                    </div>
                    <div class="info-item-chic">
                        <i class="feather icon-briefcase"></i>
                        <span class="info-label-chic">Type</span>
                        <span class="info-value-chic">{{ $p->typeContrat }}</span>
                    </div>
                    <div class="info-item-chic">
                        <i class="feather icon-calendar"></i>
                        <span class="info-label-chic">Effet</span>
                        <span class="info-value-chic">{{ \Carbon\Carbon::parse($p->dateEffet)->format('d/m/Y') }}</span>
                    </div>
                    <div class="info-item-chic">
                        <i class="feather icon-clock"></i>
                        <span class="info-label-chic">Échéance</span>
                        <span class="info-value-chic">{{ \Carbon\Carbon::parse($p->dateEcheance)->format('d/m/Y') }}</span>
                    </div>
                </div>
            </div>

            <div class="card-footer-chic">
                @if ($currentUser->hasPermission('admin.adherent.index'))
                    <a onclick="showOverlay()" href="{{ route('admin.adherent.index', ['idPolice' => $p->idPolice]) }}" class="btn-action-chic" style="--btn-accent-rgb: 51, 219, 158;">
                        <i class="feather icon-users"></i>Mes Adhérents
                    </a>
                @endif
                @if ($currentUser->hasPermission('admin.beneficiaire.index'))
                    <a onclick="showOverlay()" href="{{ route('admin.beneficiaire.index', ['idPolice' => $p->idPolice]) }}" class="btn-action-chic" style="--btn-accent-rgb: 23, 162, 184;">
                        <i class="feather icon-user-check"></i>Mes Bénéficiaires
                    </a>
                @endif
                @if ($currentUser->hasPermission('admin.police.show'))
                    <a onclick="showOverlay()" href="{{ route('admin.police.show', ['police' => $p->idPolice]) }}" class="btn-action-chic" style="--btn-accent-rgb: 255, 255, 255;">
                        <i class="feather icon-info"></i> Détails Polices
                    </a>
                @endif
                @if ($currentUser->hasPermission('admin.college.index'))
                    <a onclick="showOverlay()" href="{{ route('admin.college.index', ['idPolice' => $p->idPolice]) }}" class="btn-action-chic" style="--btn-accent-rgb: 241, 196, 15;">
                        <i class="feather icon-layers"></i>Mes Collèges
                    </a>
                @endif
                
                <!-- New Ajout Adhérent button Replacing the floating "+" -->
                @if ($currentUser->fichier1 == "1")
                    <a class="btn-action-chic open-dependant-modal" 
                        title="Ajouter un adhérent"
                        href="#" 
                        data-url="{{ route('admin.adherent.dependantModal', ['idPolice' => $p->idPolice]) }}"
                        data-idpolice="{{ $p->idPolice }}"
                        style="--btn-accent-rgb: var(--vt-primary-rgb);">
                            <i class="feather icon-user-plus"></i> Ajout Adhérent
                    </a>
                @endif

                @if ($currentUser->hasPermission('admin.reseau.index'))
                    <a onclick="showOverlay()" href="{{ route('admin.reseau.index', ['idPolice' => $p->idPolice]) }}" class="btn-action-chic" style="--btn-accent-rgb: 108, 117, 125;" title="Mes Réseaux de Soins">
                        <i class="feather icon-activity"></i> Réseaux de soins
                    </a>
                @endif
            </div>
        </div>
    @empty
        <div class="col-12">
            <div class="empty-state-chic animate-fade-in">
                <i class="feather icon-search mb-3 d-block opacity-20" style="font-size: 3rem; color: #fff;"></i>
                <h3 class="text-white fw-700">Aucune police trouvée</h3>
                <p class="text-muted">Ajustez vos filtres pour voir plus de résultats.</p>
            </div>
        </div>
    @endforelse
</div>

@if ($polices->count() > 0)
    <div class="d-flex justify-content-end align-items-center mt-5 mb-4 animate-fade-in">
        <div class="premium-pagination" onclick="showOverlay()">
            {{ $polices->appends(request()->except('page'))->links() }}
        </div>
    </div>
@endif


<style>
/* ══════════════════════════════════════════════
       CARTES POLICES — Design Chic
       ══════════════════════════════════════════════ */
    .police-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
        gap: 25px;
        padding: 10px 0;
    }

    .police-card-chic {
        background: rgba(255, 255, 255, 0.02);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.05);
        border-radius: 24px;
        overflow: hidden;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        position: relative;
        display: flex;
        flex-direction: column;
    }

    .police-card-chic:hover {
        transform: translateY(-8px);
        background: rgba(255, 255, 255, 0.04);
        border-color: rgba(var(--vt-primary-rgb), 0.2);
        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
    }

    .status-glow {
        position: absolute;
        top: 0;
        right: 0;
        width: 100px;
        height: 100px;
        background: radial-gradient(circle at top right, rgba(var(--badge-color), 0.15) 0%, transparent 60%);
        pointer-events: none;
    }

    .card-header-chic {
        padding: 20px 25px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.03);
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 15px;
    }

    .police-title-chic {
        font-size: 1rem;
        font-weight: 700;
        color: #fff;
        margin: 0;
        line-height: 1.4;
        flex: 1;
    }

    .badge-status-chic {
        padding: 4px 12px;
        border-radius: 50px;
        font-size: 0.65rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        border: 1px solid rgba(var(--badge-color), 0.3);
        background: rgba(var(--badge-color), 0.1);
        color: rgb(var(--badge-color));
    }

    .card-body-chic {
        padding: 20px 25px;
        flex: 1;
    }

    .info-grid-chic {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .info-item-chic {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 0.85rem;
    }

    .info-item-chic i {
        font-size: 0.8rem;
        color: var(--vt-primary);
        opacity: 0.6;
        width: 16px;
        text-align: center;
    }

    .info-label-chic {
        color: var(--vt-muted);
        font-weight: 600;
        min-width: 100px;
    }

    .info-value-chic {
        color: var(--vt-text);
        font-weight: 500;
        flex: 1;
    }

    .card-footer-chic {
        padding: 20px 25px 25px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        border-top: 1px solid rgba(255, 255, 255, 0.03);
    }

    /* Actions Chic */
    .btn-action-chic {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 10px;
        border-radius: 14px;
        font-size: 0.75rem;
        font-weight: 700;
        color: var(--vt-text-secondary);
        background: rgba(255, 255, 255, 0.03);
        border: 1px solid rgba(255, 255, 255, 0.05);
        transition: all 0.3s;
        text-decoration: none !important;
        white-space: nowrap;
    }

    .btn-action-chic:hover {
        background: rgba(var(--btn-accent-rgb), 0.1);
        border-color: rgba(var(--btn-accent-rgb), 0.3);
        color: #fff;
        transform: translateY(-2px);
    }

    .btn-action-chic i { font-size: 0.85rem; }

    .empty-state-chic {
        padding: 80px 40px;
        text-align: center;
        background: rgba(255, 255, 255, 0.02);
        border-radius: 30px;
        border: 1px dashed rgba(255, 255, 255, 0.1);
        margin-top: 20px;
    }

    .display-count-chic {
        display: inline-flex;
        align-items: center;
        padding: 8px 20px;
        background: rgba(255, 255, 255, 0.03);
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 50px;
        color: var(--vt-muted);
        font-family: 'JetBrains Mono', monospace;
        font-size: 0.7rem;
        letter-spacing: 1px;
        margin-bottom: 25px;
        backdrop-filter: blur(10px);
    }

    /* ── Light Mode Overrides ── */
    body.light-mode .police-card-chic {
        background: #fdfdfe;
        border: 1px solid rgba(0,0,0,0.06);
        box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    }
    
    body.light-mode .police-card-chic:hover {
        transform: translateY(-8px);
        box-shadow: 0 25px 50px rgba(0,0,0,0.1);
        border-color: var(--vt-primary);
        background: #ffffff;
    }

    body.light-mode .police-title-chic {
        color: #1e293b;
    }

    body.light-mode .card-header-chic {
        border-bottom: 1px solid #f1f5f9;
        background: linear-gradient(to bottom right, rgba(var(--badge-color), 0.03), transparent);
    }

    body.light-mode .card-footer-chic {
        border-top: 1px solid #f1f5f9;
        background: #fcfdfe;
    }

    body.light-mode .btn-action-chic {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        color: #475569;
        box-shadow: 0 2px 4px rgba(0,0,0,0.02);
    }

    body.light-mode .btn-action-chic:hover {
        background: rgba(var(--btn-accent-rgb), 0.12) !important;
        border-color: rgba(var(--btn-accent-rgb), 0.45) !important;
        color: rgba(var(--btn-accent-rgb), 1) !important;
    }
    
    body.light-mode .btn-action-chic[style*="255, 255, 255"]:hover {
        color: #1e293b !important;
        background: #f1f5f9 !important;
        border-color: #cbd5e1 !important;
    }

    body.light-mode .info-label-chic {
        color: #64748b;
    }

    body.light-mode .info-value-chic {
        color: #1e293b;
    }

    body.light-mode .info-item-chic i {
        opacity: 0.8;
        color: var(--vt-primary);
    }

    body.light-mode .empty-state-chic {
        background: #ffffff;
        border: 1px dashed #cbd5e1;
    }
    
    body.light-mode .empty-state-chic i {
        color: #cbd5e1 !important;
        opacity: 1 !important;
    }
    
    body.light-mode .empty-state-chic h3 {
        color: #1e293b !important;
    }

    body.light-mode .display-count-chic {
        background: #f8fafc;
        border-color: #e2e8f0;
        color: #64748b;
        box-shadow: 0 2px 4px rgba(0,0,0,0.02);
    }
</style>

<style>
/* Styling for Laravel default pagination to match theme */
    .premium-pagination .pagination { gap: 5px; }
    .premium-pagination .page-link {
        background: rgba(255, 255, 255, 0.05);
        border: 1px solid rgba(255, 255, 255, 0.1);
        color: var(--vt-text-secondary);
        border-radius: 10px !important;
        padding: 8px 16px;
        transition: all 0.3s;
    }
    .premium-pagination .page-item.active .page-link {
        background: var(--vt-primary);
        border-color: var(--vt-primary);
        color: #000;
        font-weight: 800;
    }
    .premium-pagination .page-link:hover {
        background: rgba(255, 255, 255, 0.1);
        color: #fff;
    }
</style>