/* ============================================
   DAILY BOARD — Bảng Báo Cáo Công Việc
   ============================================ */

.db-wrapper { max-width: 1200px; }

/* Header */
.db-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:24px; flex-wrap:wrap; }
.db-header-left h2 { margin:0 0 10px; font-size:1.3rem; color:var(--text-primary); }
.db-date-nav { display:flex; align-items:center; gap:8px; }
.db-date-btn { background:var(--card-bg,#fff); border:1px solid var(--border-color,#e2e8f0); border-radius:8px; padding:6px 10px; cursor:pointer; font-size:0.85rem; color:var(--text-primary); transition:all 0.2s; }
.db-date-btn:hover { background:#6366f1; color:#fff; border-color:#6366f1; }
.db-date-label { font-size:1rem; font-weight:700; color:var(--text-primary); }
.db-today-badge { background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; font-size:0.65rem; padding:2px 8px; border-radius:10px; font-weight:700; margin-left:6px; vertical-align:middle; }
.db-today-btn { background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; border:none; border-radius:8px; padding:6px 12px; cursor:pointer; font-size:0.8rem; font-weight:600; transition:opacity 0.2s; }
.db-today-btn:hover { opacity:0.85; }

/* Stats */
.db-header-stats { display:flex; gap:12px; flex-wrap:wrap; }
.db-stat { display:flex; align-items:center; gap:6px; background:var(--card-bg,#fff); border:1px solid var(--border-color,#e2e8f0); border-radius:10px; padding:8px 14px; }
.db-stat-icon { font-size:1rem; }
.db-stat-val { font-size:1.1rem; font-weight:800; color:var(--text-primary); }
.db-stat-lbl { font-size:0.72rem; color:var(--text-secondary); font-weight:500; }
.db-stat-ai { background:rgba(99,102,241,0.04); border-color:rgba(99,102,241,0.15); }

/* Grid */
.db-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(320px, 1fr)); gap:16px; }

/* Card */
.db-card { background:var(--card-bg,#fff); border:1px solid var(--border-color,#e2e8f0); border-radius:14px; overflow:hidden; transition:all 0.25s; }
.db-card:hover { box-shadow:0 8px 24px rgba(0,0,0,0.07); }
.db-card.db-active { border-color:rgba(34,197,94,0.3); }
.db-card.db-completed { border-color:rgba(99,102,241,0.2); }

.db-card-header { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; background:rgba(99,102,241,0.02); }
.db-member-info { display:flex; align-items:center; gap:10px; }
.db-avatar { width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:0.85rem; flex-shrink:0; }
.db-member-info strong { display:block; font-size:0.9rem; color:var(--text-primary); }
.db-member-info small { font-size:0.72rem; color:var(--text-secondary); }
.db-status { display:flex; align-items:center; gap:4px; font-size:0.75rem; font-weight:600; padding:4px 10px; border-radius:8px; }
.db-status.db-active { background:rgba(34,197,94,0.1); color:#10b981; }
.db-status.db-completed { background:rgba(99,102,241,0.1); color:#6366f1; }
.db-status.db-pending { background:rgba(148,163,184,0.1); color:#94a3b8; }

/* Card Body */
.db-card-body { padding:14px 18px; }

/* Sections */
.db-section { margin-bottom:14px; }
.db-section:last-child { margin-bottom:0; }
.db-section-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.db-section-header span:first-child { font-size:0.82rem; font-weight:700; color:var(--text-primary); }
.db-time { font-size:0.72rem; color:var(--text-secondary); font-family:'JetBrains Mono',monospace; background:rgba(99,102,241,0.06); padding:2px 8px; border-radius:6px; }

.db-ws-badge { display:inline-block; font-size:0.7rem; font-weight:600; padding:2px 8px; border-radius:6px; background:rgba(99,102,241,0.08); color:#6366f1; margin-bottom:6px; }
.db-goals { font-size:0.82rem; color:var(--text-secondary); margin:0 0 8px; font-style:italic; line-height:1.4; }

/* Task Lists */
.db-task-list, .db-result-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:4px; }
.db-task-list li, .db-result-list li { font-size:0.82rem; color:var(--text-primary); padding:5px 10px; background:rgba(99,102,241,0.03); border:1px solid var(--border-color,#e2e8f0); border-radius:8px; line-height:1.4; }
.db-task-list li::before { content:'•'; color:#6366f1; font-weight:700; margin-right:6px; }
.db-result-list li { background:rgba(34,197,94,0.04); border-color:rgba(34,197,94,0.15); }

.db-blockers { font-size:0.8rem; color:#ef4444; background:rgba(239,68,68,0.06); padding:6px 10px; border-radius:8px; margin-top:6px; border:1px solid rgba(239,68,68,0.12); }

.db-section-pending { border-top:1px dashed var(--border-color,#e2e8f0); padding-top:12px; }
.db-pending-text { font-size:0.82rem; color:var(--text-secondary); margin:0; text-align:center; padding:10px 0; }

/* AI Metrics */
.db-ai-metrics { display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; padding-top:10px; border-top:1px solid var(--border-color,#e2e8f0); }
.db-ai-badge { font-size:0.72rem; font-weight:700; padding:4px 10px; border-radius:8px; background:linear-gradient(135deg, rgba(99,102,241,0.08), rgba(139,92,246,0.08)); border:1px solid rgba(99,102,241,0.15); color:var(--text-primary); }

/* No session state */
.db-no-session { text-align:center; padding:24px 10px; }
.db-no-session span { font-size:2rem; display:block; margin-bottom:8px; opacity:0.4; }
.db-no-session p { font-size:0.82rem; color:var(--text-secondary); margin:0; }

/* Empty state */
.db-empty { text-align:center; padding:48px 20px; background:var(--card-bg,#fff); border:2px dashed var(--border-color,#e2e8f0); border-radius:16px; margin-top:24px; }
.db-empty-icon { font-size:3rem; margin-bottom:12px; opacity:0.5; }
.db-empty h3 { margin:0 0 8px; font-size:1rem; color:var(--text-primary); }
.db-empty p { margin:0; font-size:0.85rem; color:var(--text-secondary); line-height:1.6; }
.db-empty code { background:rgba(99,102,241,0.08); padding:4px 10px; border-radius:6px; font-size:0.82rem; display:inline-block; margin-top:6px; color:#6366f1; }

/* Responsive */
@media (max-width:768px) {
    .db-header { flex-direction:column; }
    .db-grid { grid-template-columns:1fr; }
}