/**
 * Perfex SAAS - Client Dashboard
 * Unified Design with Global ERP Theme
 */

/* ===================== CYBERSPACE BACKGROUND ===================== */
body.customers.modern-theme { /* ensure base has modern-theme */
    background: radial-gradient(circle at 20% 20%, rgba(65,219,242,0.18) 0%, transparent 40%),
                radial-gradient(circle at 80% 70%, rgba(67,0,255,0.15) 0%, transparent 45%),
                linear-gradient(135deg,#050c21 0%,#0a1642 55%,#050c21 100%);
    position: relative;
    overflow-x: hidden;
}
body.customers.modern-theme::before,body.customers.modern-theme::after {
    content:""; position: fixed; inset:0; pointer-events:none; z-index:0;
    background: repeating-linear-gradient(90deg,rgba(255,255,255,0.03) 0px, rgba(255,255,255,0.03) 1px, transparent 1px, transparent 4px),
               repeating-linear-gradient(0deg,rgba(255,255,255,0.02) 0px, rgba(255,255,255,0.02) 1px, transparent 1px, transparent 6px);
    animation: gridDrift 22s linear infinite;
}
body.customers.modern-theme::after {
    mix-blend-mode: overlay; opacity:.35; animation: pulseField 8s ease-in-out infinite;
}

@keyframes gridDrift { from {transform: translateY(0);} to {transform: translateY(160px);} }
@keyframes pulseField { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.25); } }

/* ===================== CYBER LOGO ANIMATION ===================== */
.cyber-logo img, .cyber-logo { position:relative; z-index:2; }
.cyber-logo img { animation: neonPulse 4.5s ease-in-out infinite, orbitGlow 14s linear infinite; }
@keyframes neonPulse { 0%,100% { filter: drop-shadow(0 0 2px #41dbf2) drop-shadow(0 0 8px #0065F8); } 50% { filter: drop-shadow(0 0 6px #41dbf2) drop-shadow(0 0 20px #4300FF); } }
@keyframes orbitGlow { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

/* Fallback for reduced motion */
@media (prefers-reduced-motion: reduce) { .cyber-logo img { animation: none; } body.customers.modern-theme::before, body.customers.modern-theme::after { animation:none; } }

/* ===================== ENHANCED CLIENT PANELS/WIDGET FEEL ===================== */
.client-card,.project-card,.task-card { position:relative; backdrop-filter: blur(2px); }
.client-card::after,.project-card::after,.task-card::after { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; box-shadow:0 0 0 1px rgba(65,219,242,0.25),0 0 18px -2px rgba(65,219,242,0.4); opacity:0; transition:opacity .45s ease; }
.client-card:hover::after,.project-card:hover::after,.task-card:hover::after { opacity:1; }

/* Slight float animation */
.client-card:hover,.project-card:hover,.task-card:hover { animation: floatUp 0.8s ease-out forwards; }
@keyframes floatUp { 0% { transform: translateY(0); } 60% { transform: translateY(-4px); } 100% { transform: translateY(-2px); } }

/* Table glow rows */
.client-table tbody tr:hover { position:relative; }
.client-table tbody tr:hover::after { content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:linear-gradient(90deg,rgba(65,219,242,0.15),transparent); pointer-events:none; }

/* Stat card enhanced top bar pulse */
.client-stat-card::before { animation: barPulse 5s linear infinite; }
@keyframes barPulse { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.6); } }

/* ===================== CYBER BADGES (optional) ===================== */
.badge.cyber { background: linear-gradient(135deg,#41dbf2,#0065F8,#4300FF); color:#fff; box-shadow:0 0 12px rgba(65,219,242,0.55); animation: badgeWave 3.3s ease-in-out infinite; }
@keyframes badgeWave { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }

/* ===================== ACCESSIBILITY Fallback ===================== */
@media (prefers-reduced-motion: reduce) { .client-card:hover,.project-card:hover,.task-card:hover { animation:none; } .client-stat-card::before { animation:none; } .badge.cyber { animation:none; } }


/* Enhanced Client Dashboard Section */
.section-client-dashboard > dl:first-of-type,
.projects-summary-heading,
.submenu.customer-top-submenu {
    display: none;
}

.ps-view {
    margin-bottom: 50px;
}

.tw-h-screen {
    height: 100vh;
}

/* Enhanced Modal Design */
.view-company-modal {
    overflow: hidden !important;
}

.view-company-modal .modal-header {
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, rgba(65, 219, 242, 0.1) 0%, rgba(0, 101, 248, 0.05) 100%);
    border-bottom: 2px solid rgba(65, 219, 242, 0.3);
    border-color: transparent;
}

.view-company-modal .modal-header .close {
    margin-top: 0;
    color: var(--tgw-text-primary, #0f172a);
    opacity: 0.7;
    transition: all 0.2s ease;
}

.view-company-modal .modal-header .close:hover {
    opacity: 1;
    color: var(--tgw-primary, #41dbf2);
}

.view-company-modal .modal-header button.btn.dropdown-toggle.btn-default {
    border-color: rgba(65, 219, 242, 0.3);
    background: white;
    transition: all 0.2s ease;
}

.view-company-modal .modal-header button.btn.dropdown-toggle.btn-default:hover {
    border-color: var(--tgw-primary, #41dbf2);
    background: rgba(65, 219, 242, 0.05);
}

.view-company-modal .modal-content {
    height: inherit;
    border-radius: var(--tgw-radius-xl, 16px);
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(65, 219, 242, 0.2);
    border: 1px solid rgba(65, 219, 242, 0.2);
}

.view-company-modal .modal-body {
    margin: 0;
    padding: 0;
    flex: 1;
}

.view-company-modal .modal-header .select-placeholder:after,
.view-company-modal .modal-header .form-group.label {
    display: none !important;
}

.view-company-modal .modal-header .form-group {
    margin-bottom: 0;
}

/* Enhanced Client Cards */
.client-card,
.project-card,
.task-card {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(65, 219, 242, 0.2);
    border-radius: var(--tgw-radius-lg, 12px);
    padding: var(--tgw-spacing-lg, 16px);
    box-shadow: 0 4px 15px rgba(65, 219, 242, 0.1);
    transition: all 0.2s ease;
    margin-bottom: var(--tgw-spacing-md, 12px);
}

.client-card:hover,
.project-card:hover,
.task-card:hover {
    box-shadow: 0 8px 25px rgba(65, 219, 242, 0.2);
    transform: translateY(-2px);
    border-color: rgba(65, 219, 242, 0.4);
}

/* Enhanced Client Tables */
.client-table-wrapper {
    border: 1px solid rgba(65, 219, 242, 0.2);
    border-radius: var(--tgw-radius-lg, 12px);
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(65, 219, 242, 0.1);
    background: rgba(255, 255, 255, 0.98);
}

.client-table thead th {
    background: linear-gradient(135deg, rgba(65, 219, 242, 0.1) 0%, rgba(0, 101, 248, 0.05) 100%);
    color: var(--tgw-text-primary, #0f172a);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    border-bottom: 2px solid rgba(65, 219, 242, 0.3);
}

.client-table tbody tr {
    transition: all 0.2s ease;
    border-bottom: 1px solid rgba(65, 219, 242, 0.1);
}

.client-table tbody tr:hover {
    background: linear-gradient(90deg, rgba(65, 219, 242, 0.08) 0%, transparent 100%);
    border-left: 3px solid var(--tgw-primary, #41dbf2);
}

/* Enhanced Client Buttons */
.client-btn-primary {
    background: linear-gradient(135deg, var(--tgw-primary, #41dbf2) 0%, var(--tgw-blue, #0065F8) 100%);
    color: white;
    border: none;
    border-radius: var(--tgw-radius-md, 8px);
    padding: 0.625rem 1.25rem;
    font-weight: 500;
    transition: all 0.15s ease;
    box-shadow: 0 2px 8px rgba(65, 219, 242, 0.3);
}

.client-btn-primary:hover {
    box-shadow: 0 4px 15px rgba(65, 219, 242, 0.5);
    transform: translateY(-1px);
    color: white;
}

/* Client Stats Enhancement */
.client-stat-card {
    background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
    border: 1px solid rgba(65, 219, 242, 0.2);
    border-radius: var(--tgw-radius-lg, 12px);
    padding: var(--tgw-spacing-lg, 16px);
    position: relative;
    overflow: hidden;
    transition: all 0.2s ease;
}

.client-stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--tgw-gradient, linear-gradient(135deg, #41dbf2, #0065F8, #4300FF));
}

.client-stat-card:hover {
    box-shadow: 0 8px 25px rgba(65, 219, 242, 0.2);
    transform: translateY(-2px);
    border-color: rgba(65, 219, 242, 0.4);
}