/* ── Modal Styles ── */
.modal-overlay {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.75); backdrop-filter: blur(6px);
    display: flex; align-items: center; justify-content: center;
    z-index: 9999; opacity: 0; visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}
.modal-overlay.show { opacity: 1; visibility: visible; }
.modal-content {
    background: rgba(15,23,42,0.95); border: 1px solid rgba(255,255,255,0.1);
    border-radius: 16px; max-width: 95vw; max-height: 90vh; overflow-y: auto;
    display: flex; flex-direction: column;
    transform: translateY(20px); transition: transform 0.3s;
    box-shadow: 0 25px 50px rgba(0,0,0,0.5);
}
.modal-overlay.show .modal-content { transform: translateY(0); }
.modal-header { padding: 20px 28px; border-bottom: 1px solid rgba(255,255,255,0.08); display: flex; justify-content: space-between; align-items: center; }
.modal-header h2 { font-size: 1.2rem; font-weight: 700; color: #F8FAFC; margin: 0; }
.modal-body { padding: 24px 28px; flex: 1; }
.modal-footer { padding: 16px 28px; border-top: 1px solid rgba(255,255,255,0.08); display: flex; justify-content: flex-end; gap: 12px; }
.btn-close { background: none; border: none; color: #94A3B8; cursor: pointer; font-size: 1.1rem; padding: 4px; transition: color 0.2s; }
.btn-close:hover { color: #F8FAFC; }

/* CRM Specific Styles */
.dashboard-grid {
    display: grid;
    gap: 24px;
}

.p-6 {
    padding: 24px;
}

/* Status Badges for CRM */
.badge-vvip {
    background: rgba(139, 92, 246, 0.15);
    color: #A78BFA;
    border: 1px solid rgba(139, 92, 246, 0.3);
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 700;
}

.badge-vip {
    background: rgba(245, 158, 11, 0.15);
    color: #FBBF24;
    border: 1px solid rgba(245, 158, 11, 0.3);
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 700;
}

.badge-normal {
    background: rgba(255, 255, 255, 0.1);
    color: #E2E8F0;
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
}

.search-box {
    display: flex;
    align-items: center;
    background: rgba(0,0,0,0.2);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 20px;
    padding: 6px 14px;
}

.search-box i {
    color: #94A3B8;
    margin-right: 8px;
}

.search-box input {
    background: transparent;
    border: none;
    color: #F8FAFC;
    outline: none;
    width: 100%;
    font-family: inherit;
    font-size: 0.9rem;
}