/* ══════════════════════════════════════════════════════════
   AI ASISTAN (ast-*)
   ══════════════════════════════════════════════════════════ */

/* --- Container --- */
.ast-container { display:grid; grid-template-columns:1fr 340px; gap:20px; min-height:calc(100vh - 140px); }
.ast-chat-col { display:flex; flex-direction:column; background:#fff; border-radius:16px; border:1px solid #e5e7eb; overflow:hidden; }
.ast-sidebar-col { display:flex; flex-direction:column; gap:16px; }

/* --- Chat Header --- */
.ast-chat-header { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid #e5e7eb; background:linear-gradient(135deg,#f0f4ff,#f8f6ff); }
.ast-header-left { display:flex; align-items:center; gap:12px; }
.ast-avatar { width:44px; height:44px; border-radius:12px; background:linear-gradient(135deg,#6366f1,#8b5cf6); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.3rem; position:relative; }
.ast-avatar-pulse { position:absolute; bottom:-2px; right:-2px; width:12px; height:12px; background:#22c55e; border-radius:50%; border:2px solid #fff; }
.ast-header-title { margin:0; font-size:1rem; font-weight:700; color:#1e293b; }
.ast-header-sub { font-size:.75rem; color:#64748b; }
.ast-streak-badge { display:flex; align-items:center; gap:4px; background:linear-gradient(135deg,#ff6b35,#ff8c42); color:#fff; padding:6px 12px; border-radius:20px; font-size:.8rem; font-weight:700; }
.ast-streak-badge i { font-size:1rem; }

/* --- Messages Area --- */
.ast-messages { flex:1; overflow-y:auto; padding:20px; display:flex; flex-direction:column; gap:12px; }
.ast-msg { display:flex; }
.ast-msg-assistant { justify-content:flex-start; }
.ast-msg-user { justify-content:flex-end; }
.ast-msg-bubble { display:flex; gap:8px; max-width:85%; }
.ast-msg-user .ast-msg-bubble { flex-direction:row-reverse; }
.ast-msg-avatar { width:32px; height:32px; min-width:32px; border-radius:10px; background:linear-gradient(135deg,#6366f1,#8b5cf6); display:flex; align-items:center; justify-content:center; color:#fff; font-size:.9rem; margin-top:2px; }
.ast-msg-content { background:#f1f5f9; border-radius:12px; padding:10px 14px; }
.ast-msg-user .ast-msg-content { background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; }
.ast-msg-content p { margin:0; font-size:.88rem; line-height:1.5; }
.ast-msg-time { font-size:.65rem; color:#94a3b8; display:block; margin-top:4px; }
.ast-msg-user .ast-msg-time { color:rgba(255,255,255,.6); }

/* --- Action Buttons --- */
.ast-action-btns { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.ast-action-btn { padding:8px 16px; border-radius:10px; border:1.5px solid #6366f1; background:#fff; color:#6366f1; font-size:.82rem; font-weight:600; cursor:pointer; transition:all .2s; }
.ast-action-btn:hover { background:#6366f1; color:#fff; transform:translateY(-1px); }

/* --- Topic Pills --- */
.ast-topic-pills { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.ast-topic-pill { display:flex; align-items:center; gap:6px; padding:6px 14px; border-radius:20px; border:1.5px solid #e5e7eb; background:#fff; cursor:pointer; transition:all .2s; font-size:.82rem; }
.ast-topic-pill:hover { border-color:#6366f1; background:#f0f0ff; }
.ast-pill-badge { background:#6366f1; color:#fff; padding:1px 6px; border-radius:8px; font-size:.7rem; font-weight:700; }

/* --- Stat Card (in chat) --- */
.ast-stat-card { background:linear-gradient(135deg,#f8fafc,#f1f5f9); border-radius:12px; padding:14px; border:1px solid #e2e8f0; }
.ast-stat-title { font-size:.8rem; font-weight:700; color:#475569; margin-bottom:10px; text-transform:uppercase; letter-spacing:.5px; }
.ast-stat-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(70px, 1fr)); gap:8px; }
.ast-stat-item { text-align:center; padding:8px 4px; background:#fff; border-radius:8px; border:1px solid #e5e7eb; }
.ast-stat-val { display:block; font-size:1.1rem; font-weight:800; color:#1e293b; }
.ast-stat-lbl { font-size:.65rem; color:#94a3b8; }

/* --- Plan Card (in chat) --- */
.ast-plan-card-msg { background:#fff; border-radius:12px; padding:14px; border:1px solid #e2e8f0; }
.ast-plan-card-head { font-size:.85rem; font-weight:700; color:#6366f1; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.ast-plan-msg-item { display:flex; align-items:center; gap:8px; padding:6px 0; font-size:.82rem; color:#334155; border-bottom:1px solid #f1f5f9; }
.ast-plan-msg-item:last-child { border-bottom:none; }
.ast-plan-msg-item i { color:#cbd5e1; font-size:1rem; }
.ast-plan-msg-done { text-decoration:line-through; color:#94a3b8; }
.ast-plan-msg-done i { color:#22c55e; }
.ast-plan-msg-item small { color:#94a3b8; }

/* --- Badge Message --- */
.ast-badge-msg { display:flex; align-items:center; gap:12px; background:linear-gradient(135deg,#fefce8,#fef9c3); border:1px solid #fbbf24; border-radius:12px; padding:12px 16px; }
.ast-badge-msg-icon { width:40px; height:40px; border-radius:10px; background:linear-gradient(135deg,#f59e0b,#fbbf24); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.2rem; }
.ast-badge-msg strong { color:#92400e; font-size:.88rem; }
.ast-badge-msg small { color:#a16207; font-size:.75rem; }

/* --- Link Button --- */
.ast-link-btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; background:#6366f1; color:#fff; border-radius:10px; font-size:.82rem; font-weight:600; text-decoration:none; transition:all .2s; }
.ast-link-btn:hover { background:#4f46e5; color:#fff; transform:translateY(-1px); }

/* --- Input Area --- */
.ast-input-area { display:flex; gap:8px; padding:14px 20px; border-top:1px solid #e5e7eb; background:#fafbfc; }
.ast-input { flex:1; padding:10px 16px; border-radius:12px; border:1.5px solid #e5e7eb; font-size:.88rem; outline:none; transition:border .2s; background:#fff; }
.ast-input:focus { border-color:#6366f1; }
.ast-send-btn { width:42px; height:42px; border-radius:12px; border:none; background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .2s; }
.ast-send-btn:hover { transform:scale(1.05); }

/* --- Sidebar Panels --- */
.ast-panel { background:#fff; border-radius:14px; border:1px solid #e5e7eb; overflow:hidden; }
.ast-panel-head { display:flex; align-items:center; gap:8px; padding:14px 16px; border-bottom:1px solid #f1f5f9; font-size:.85rem; font-weight:700; color:#1e293b; }
.ast-panel-head i { color:#6366f1; font-size:1.1rem; }
.ast-panel-badge { margin-left:auto; background:#6366f1; color:#fff; padding:2px 8px; border-radius:10px; font-size:.7rem; font-weight:700; }

/* --- Plan Items (sidebar) --- */
.ast-plan-items { padding:10px 12px; display:flex; flex-direction:column; gap:6px; }
.ast-plan-item { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:10px; transition:background .15s; }
.ast-plan-item:hover { background:#f8fafc; }
.ast-item-check i { font-size:1.2rem; color:#cbd5e1; }
.ast-item-done .ast-item-check i { color:#22c55e; }
.ast-item-skip .ast-item-check i { color:#f59e0b; }
.ast-item-info { flex:1; min-width:0; }
.ast-item-title { display:block; font-size:.8rem; font-weight:600; color:#334155; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ast-item-done .ast-item-title { text-decoration:line-through; color:#94a3b8; }
.ast-item-meta { font-size:.68rem; color:#94a3b8; display:flex; align-items:center; gap:3px; }
.ast-item-actions { display:flex; gap:4px; }
.ast-item-go { width:26px; height:26px; border-radius:6px; background:#6366f1; color:#fff; display:flex; align-items:center; justify-content:center; font-size:.75rem; text-decoration:none; transition:all .15s; }
.ast-item-go:hover { background:#4f46e5; color:#fff; }
.ast-item-complete { width:26px; height:26px; border-radius:6px; background:#22c55e; color:#fff; border:none; display:flex; align-items:center; justify-content:center; font-size:.75rem; cursor:pointer; }
button.ast-item-skip { width:26px; height:26px; border-radius:6px; background:#f1f5f9; color:#94a3b8; border:none; display:flex; align-items:center; justify-content:center; font-size:.75rem; cursor:pointer; }

/* --- Plan Progress --- */
.ast-plan-progress { display:flex; align-items:center; gap:10px; padding:10px 16px; border-top:1px solid #f1f5f9; }
.ast-plan-bar { flex:1; height:6px; background:#f1f5f9; border-radius:3px; overflow:hidden; }
.ast-plan-bar-fill { height:100%; background:linear-gradient(90deg,#6366f1,#8b5cf6); border-radius:3px; transition:width .5s; }
.ast-plan-pct { font-size:.75rem; font-weight:700; color:#6366f1; }
.ast-plan-done { padding:12px 16px; text-align:center; color:#22c55e; font-weight:700; font-size:.85rem; }

/* --- Weekly Ring Charts --- */
.ast-weekly-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:14px; }
.ast-weekly-item { display:flex; flex-direction:column; align-items:center; gap:4px; }
.ast-weekly-ring { width:56px; height:56px; position:relative; }
.ast-weekly-ring svg { width:100%; height:100%; transform:rotate(-90deg); }
.ast-ring-bg { fill:none; stroke:#f1f5f9; stroke-width:3.5; }
.ast-ring-fill { fill:none; stroke:#6366f1; stroke-width:3.5; stroke-linecap:round; transition:stroke-dasharray .6s; }
.ast-ring-purple { stroke:#8b5cf6; }
.ast-ring-green { stroke:#22c55e; }
.ast-ring-orange { stroke:#f59e0b; }
.ast-ring-text { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:.75rem; font-weight:800; color:#1e293b; }
.ast-weekly-label { font-size:.65rem; color:#94a3b8; font-weight:600; }

/* --- Badge Grid (sidebar) --- */
.ast-badge-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding:14px; }
.ast-badge-item { display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; }
.ast-badge-icon { width:40px; height:40px; border-radius:10px; background:linear-gradient(135deg,#fef3c7,#fde68a); display:flex; align-items:center; justify-content:center; font-size:1.1rem; color:#d97706; }
.ast-badge-name { font-size:.6rem; color:#64748b; font-weight:600; line-height:1.1; }

/* --- Sidebar AI Pill --- */
.sb-ai-pill { margin-left:auto; background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; padding:2px 8px; border-radius:8px; font-size:.6rem; font-weight:800; letter-spacing:.5px; }

/* ── Dark Mode ── */
body.dark .ast-chat-col,
body.dark .ast-panel { background:#1e293b; border-color:#334155; }
body.dark .ast-chat-header { background:linear-gradient(135deg,#1e293b,#2d1b69); border-color:#334155; }
body.dark .ast-header-title { color:#f1f5f9; }
body.dark .ast-header-sub { color:#94a3b8; }
body.dark .ast-msg-content { background:#334155; color:#e2e8f0; }
body.dark .ast-msg-content p { color:#e2e8f0; }
body.dark .ast-msg-user .ast-msg-content { background:linear-gradient(135deg,#6366f1,#8b5cf6); }
body.dark .ast-msg-time { color:#64748b; }
body.dark .ast-action-btn { background:#1e293b; border-color:#6366f1; color:#a5b4fc; }
body.dark .ast-action-btn:hover { background:#6366f1; color:#fff; }
body.dark .ast-topic-pill { background:#1e293b; border-color:#334155; color:#e2e8f0; }
body.dark .ast-topic-pill:hover { border-color:#6366f1; background:#2d1b69; }
body.dark .ast-stat-card { background:#0f172a; border-color:#334155; }
body.dark .ast-stat-title { color:#94a3b8; }
body.dark .ast-stat-item { background:#1e293b; border-color:#334155; }
body.dark .ast-stat-val { color:#f1f5f9; }
body.dark .ast-plan-card-msg { background:#0f172a; border-color:#334155; }
body.dark .ast-plan-msg-item { color:#e2e8f0; border-color:#1e293b; }
body.dark .ast-input-area { background:#0f172a; border-color:#334155; }
body.dark .ast-input { background:#1e293b; border-color:#334155; color:#f1f5f9; }
body.dark .ast-input:focus { border-color:#6366f1; }
body.dark .ast-panel-head { color:#f1f5f9; border-color:#334155; }
body.dark .ast-plan-item:hover { background:#0f172a; }
body.dark .ast-item-title { color:#e2e8f0; }
body.dark .ast-plan-bar { background:#334155; }
body.dark .ast-ring-bg { stroke:#334155; }
body.dark .ast-ring-text { color:#f1f5f9; }
body.dark .ast-weekly-label { color:#94a3b8; }
body.dark .ast-badge-icon { background:linear-gradient(135deg,#451a03,#78350f); }
body.dark .ast-badge-msg { background:linear-gradient(135deg,#451a03,#78350f); border-color:#92400e; }
body.dark .ast-badge-msg strong { color:#fbbf24; }
body.dark .ast-badge-msg small { color:#f59e0b; }
body.dark .ast-plan-progress { border-color:#334155; }
body.dark button.ast-item-skip { background:#334155; color:#94a3b8; }

/* ── Responsive ── */
@media (max-width:1024px) {
    .ast-container { grid-template-columns:1fr; }
    .ast-sidebar-col { order:-1; display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); }
}
@media (max-width:576px) {
    .ast-chat-header { padding:12px 14px; }
    .ast-messages { padding:14px; }
    .ast-msg-bubble { max-width:95%; }
    .ast-weekly-grid { grid-template-columns:repeat(2,1fr); }
    .ast-badge-grid { grid-template-columns:repeat(3,1fr); }
    .ast-input-area { padding:10px 14px; }
}
/* ── End AI Asistan ── */