/* ===== Cortex — Page Styles (Graphite Enterprise) ===== */

/* ===== DASHBOARD ===== */
.dashboard-welcome{ margin-bottom:24px; }
.dashboard-welcome h2{ font-size:28px; font-weight:800; letter-spacing:-.025em; }
.dashboard-welcome p{ color:var(--text-muted); margin-top:5px; font-size:14px; }
.dashboard-grid{ display:grid; grid-template-columns:1.5fr 1fr; gap:20px; margin-top:20px; align-items:start; }
.dashboard-grid-full{ grid-column:1 / -1; }
.quick-list{ list-style:none; }
.quick-list-item{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--border-subtle); }
.quick-list-item:last-child{ border-bottom:none; }
.activity-item{ display:flex; gap:12px; padding:12px 0; }
.activity-dot{ width:8px; height:8px; border-radius:50%; flex-shrink:0; margin-top:6px; }
.today-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; text-align:center; }
.today-stat-value{ font-family:var(--font-mono); font-size:22px; font-weight:600; }
.today-stat-label{ font-size:11.5px; color:var(--text-muted); margin-top:4px; }

/* Command Center signals */
.signals{ display:flex; flex-direction:column; }
.signal-row{ display:flex; gap:13px; padding:15px 0; border-bottom:1px solid var(--border-subtle); }
.signal-row:last-child{ border-bottom:none; padding-bottom:0; }
.signal-row:first-child{ padding-top:0; }
.signal-sev{ width:8px; height:8px; border-radius:2px; margin-top:6px; flex:none; }
.signal-sev.d{ background:var(--color-danger); } .signal-sev.w{ background:var(--brass); } .signal-sev.i{ background:var(--slate); }
.signal-main{ flex:1; min-width:0; }
.signal-title{ font-weight:700; font-size:13.5px; }
.signal-why{ color:var(--text-secondary); font-size:12.5px; margin-top:3px; }
.signal-reason{ color:var(--text-muted); font-size:12px; margin-top:6px; padding-left:11px; border-left:2px solid var(--border-color); }
.signal-act{ margin-top:10px; }

/* ===== ATTENDANCE ===== */
.attendance-clock-section{ background:var(--panel); border:1px solid var(--border-color); border-radius:var(--border-radius-xl);
  text-align:center; padding:40px; margin-bottom:24px; position:relative; overflow:hidden; box-shadow:var(--shadow-sm); }
.attendance-clock-section::before{ content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--brand); }
.attendance-time{ font-family:var(--font-mono); font-size:3.4rem; font-weight:600; font-variant-numeric:tabular-nums; color:var(--text-primary); letter-spacing:-.02em; }
.attendance-date{ font-size:15px; color:var(--text-muted); margin-top:6px; }
.attendance-actions{ display:flex; align-items:center; justify-content:center; gap:14px; margin-top:28px; }
.btn-checkin{ padding:13px 36px; font-size:14px; font-weight:700; background:var(--brand); color:#fff; border:none;
  border-radius:var(--border-radius-md); cursor:pointer; transition:var(--transition-fast); }
.btn-checkin:hover{ background:var(--brand-700); transform:translateY(-1px); }
.btn-checkin:disabled{ opacity:.4; cursor:not-allowed; transform:none; }
.btn-checkout{ padding:13px 36px; font-size:14px; font-weight:700; background:var(--panel); color:var(--color-danger);
  border:1px solid var(--border-color); border-radius:var(--border-radius-md); cursor:pointer; transition:var(--transition-fast); }
.btn-checkout:hover{ background:var(--color-danger-bg); border-color:var(--color-danger); }
.btn-checkout:disabled{ opacity:.4; cursor:not-allowed; }
.attendance-status{ margin-top:14px; font-size:13px; color:var(--text-muted); }
.calendar-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.calendar-header{ font-family:var(--font-mono); font-size:10.5px; font-weight:500; color:var(--text-muted); text-align:center; padding:8px; text-transform:uppercase; }
.calendar-day{ aspect-ratio:1; display:flex; align-items:center; justify-content:center; border-radius:9px; font-size:13px; transition:var(--transition-fast); position:relative; }
.calendar-day.empty{ background:none; }
.calendar-day.present{ background:var(--color-success-bg); color:var(--color-success); }
.calendar-day.late{ background:var(--color-warning-bg); color:var(--color-warning); }
.calendar-day.absent{ background:var(--color-danger-bg); color:var(--color-danger); }
.calendar-day.leave{ background:var(--bg-hover); color:var(--text-secondary); }
.calendar-day.today{ border:2px solid var(--brand); font-weight:700; }
.calendar-day.weekend{ color:var(--text-tertiary); }
.calendar-legend{ display:flex; align-items:center; gap:18px; margin-top:14px; flex-wrap:wrap; }
.calendar-legend-item{ display:flex; align-items:center; gap:8px; font-size:11.5px; color:var(--text-muted); }
.calendar-legend-dot{ width:10px; height:10px; border-radius:3px; }

/* ===== DEPARTMENTS ===== */
.dept-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; }
.dept-card{ background:var(--panel); border:1px solid var(--border-color); border-radius:var(--border-radius-lg);
  padding:20px; transition:var(--transition-fast); animation:slideUp .4s ease backwards; box-shadow:var(--shadow-sm); }
.dept-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:var(--border-color-hover); }
.dept-card-header{ display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:14px; }
.dept-card-name{ font-size:17px; font-weight:700; letter-spacing:-.01em; }
.dept-card-count{ margin-left:8px; }
.dept-card-desc{ font-size:13px; color:var(--text-muted); margin-bottom:14px; line-height:1.55; }
.dept-card-manager{ display:flex; align-items:center; gap:11px; font-size:13px; color:var(--text-secondary); padding-top:14px; border-top:1px solid var(--border-subtle); }
.dept-card-actions{ display:flex; gap:8px; margin-top:14px; }
.org-chart-container{ overflow-x:auto; padding:20px 0; }

/* ===== KANBAN / DEALS ===== */
.kanban-board{ display:flex; gap:16px; overflow-x:auto; padding-bottom:14px; min-height:500px; }
.kanban-column{ flex-shrink:0; width:280px; background:var(--panel-2); border-radius:var(--border-radius-lg); display:flex; flex-direction:column; border:1px solid var(--border-color); }
.kanban-column-header{ padding:14px; font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border-subtle); }
.kanban-column-header .stage-name{ display:flex; align-items:center; gap:8px; }
.kanban-column-header .stage-dot{ width:8px; height:8px; border-radius:50%; }
.deal-count{ font-family:var(--font-mono); font-size:11px; padding:2px 8px; background:var(--bg-hover); border-radius:20px; color:var(--text-secondary); }
.deal-total{ font-family:var(--font-mono); font-size:11px; color:var(--text-muted); }
.kanban-cards{ padding:12px; flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:10px; min-height:60px; }
.kanban-cards.drag-over{ background:var(--brand-050); border-radius:var(--border-radius-md); }
.kanban-card{ background:var(--panel); border:1px solid var(--border-color); border-radius:var(--border-radius-md); padding:14px; cursor:grab; transition:var(--transition-fast); box-shadow:var(--shadow-sm); }
.kanban-card:hover{ transform:translateY(-2px); box-shadow:var(--shadow-md); border-color:var(--border-color-hover); }
.kanban-card.dragging{ opacity:.5; cursor:grabbing; }
.kanban-card-title{ font-size:13.5px; font-weight:700; margin-bottom:6px; }
.kanban-card-customer{ font-size:12px; color:var(--text-muted); }
.kanban-card-value{ font-family:var(--font-mono); font-size:14px; font-weight:600; color:var(--brand); margin-top:8px; }
.kanban-card-footer{ display:flex; align-items:center; justify-content:space-between; margin-top:11px; font-size:11.5px; color:var(--text-muted); }

/* ===== PAYROLL ===== */
.payroll-summary{ margin-bottom:20px; }
.payroll-month-selector{ display:flex; align-items:center; gap:14px; }
.payroll-month-selector input[type="month"]{ padding:9px 14px; background:var(--panel); border:1px solid var(--border-color);
  border-radius:10px; color:var(--text-primary); font-family:var(--font-family); font-size:13px; outline:none; cursor:pointer; }
.payroll-month-selector input[type="month"]:focus{ border-color:var(--brand); }

/* ===== CUSTOMER DETAIL ===== */
.customer-detail-header{ display:flex; gap:20px; align-items:center; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid var(--border-subtle); }
.customer-avatar-lg{ width:60px; height:60px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  font-size:20px; font-weight:700; color:#fff; flex-shrink:0; background:var(--graphite); }
.customer-info h3{ font-size:19px; font-weight:700; }
.customer-info p{ color:var(--text-muted); font-size:13px; }
.customer-timeline{ position:relative; padding-left:28px; }
.customer-timeline::before{ content:''; position:absolute; left:12px; top:0; bottom:0; width:2px; background:var(--border-color); }
.timeline-item{ position:relative; margin-bottom:20px; animation:fadeIn .3s ease backwards; }
.timeline-dot{ position:absolute; left:-26px; top:4px; width:12px; height:12px; border-radius:50%; border:2px solid var(--panel); }
.timeline-item .timeline-date{ font-family:var(--font-mono); font-size:11px; color:var(--text-muted); margin-bottom:3px; }
.timeline-item .timeline-content{ font-size:13px; color:var(--text-secondary); }
.timeline-item .timeline-type{ font-size:11.5px; font-weight:700; }

/* ===== REPORTS ===== */
.report-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }

@media (max-width:1024px){ .dashboard-grid{ grid-template-columns:1fr; } .report-grid{ grid-template-columns:1fr; } }
@media (max-width:768px){
  .kanban-board{ min-height:400px; } .kanban-column{ width:260px; } .dept-grid{ grid-template-columns:1fr; }
  .attendance-time{ font-size:2.5rem; } .customer-detail-header{ flex-direction:column; text-align:center; }
}
