/* ═══════════════════════════════════════════════════════════════
   tasarim-ana.css — Ana Ekran sayfasına özel stiller
   Kaynak: tasarim/ana-ekran.html <style>. #view-ana altında scope'lu.
   (rz animasyonu için komuta'nın @keyframes tk-rz'si kullanılır — global)
   ═══════════════════════════════════════════════════════════════ */
#view-ana{ --vio2:#9d7bff; }

#view-ana .threegrid{ display:grid; grid-template-columns:0.82fr 1.35fr 0.95fr; gap:22px; align-items:stretch; }
@media(max-width:1180px){ #view-ana .threegrid{ grid-template-columns:1fr; } }
#view-ana .card{ background:var(--panel); border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; opacity:0; transform:translateY(12px); animation:tk-rz .55s cubic-bezier(.2,.7,.3,1) forwards; }
#view-ana .c1{ animation-delay:.05s; } #view-ana .c2{ animation-delay:.13s; } #view-ana .c3{ animation-delay:.21s; }
#view-ana .ph{ display:flex; align-items:center; gap:11px; padding:16px 20px 14px; border-bottom:1px solid var(--line2); }
#view-ana .ph .pi{ width:30px; height:30px; border-radius:9px; background:var(--inner); display:flex; align-items:center; justify-content:center; color:var(--gold); flex:none; }
#view-ana .ph .pi svg{ width:16px; height:16px; }
#view-ana .ph h3{ font-size:13px; font-weight:700; letter-spacing:.3px; }
#view-ana .ph .ps{ font-size:10.5px; color:var(--t3); margin-top:1px; }

/* Faydalı Linkler (dar) — TODO: gerçek URL'ler (şimdilik # placeholder) */
#view-ana .lg2{ font-size:9.5px; letter-spacing:1.5px; text-transform:uppercase; color:var(--t3); font-weight:600; padding:13px 18px 5px; }
#view-ana .lk{ display:flex; align-items:center; gap:11px; padding:9px 18px; border-bottom:1px solid var(--line2); cursor:pointer; }
#view-ana .lk:hover{ background:#13233a; }
#view-ana .lk .li{ width:20px; flex:none; display:flex; align-items:center; justify-content:center; color:var(--t2); }
#view-ana .lk .li svg{ width:17px; height:17px; }
#view-ana .lk .ln{ flex:1; font-size:12.5px; }
#view-ana .lk .ar{ color:var(--t3); font-size:12px; }
#view-ana .lk-btns{ display:flex; gap:8px; padding:7px 18px 4px; }
#view-ana .lkb{ flex:1; display:flex; align-items:center; justify-content:center; gap:5px; padding:9px 6px; background:#0e1c2e; border:1px solid var(--line); border-radius:9px; font-size:11.5px; font-weight:500; cursor:pointer; white-space:nowrap; }
#view-ana .lkb:hover{ border-color:var(--t2); }
#view-ana .lk-pad{ padding-bottom:12px; }

/* Baveka Asistan (geniş, mor) — TODO: arama + AI bağlanacak */
#view-ana .assist{ position:relative; background:radial-gradient(110% 110% at 50% -5%,rgba(124,92,255,.22),transparent 62%),var(--panel); border-color:rgba(124,92,255,.4); justify-content:center; }
#view-ana .assist::after{ content:""; position:absolute; left:50%; top:-20px; width:340px; height:340px; transform:translateX(-50%); background:radial-gradient(circle,rgba(124,92,255,.32),transparent 65%); filter:blur(24px); pointer-events:none; }
#view-ana .a-inner{ position:relative; text-align:center; padding:40px 36px; }
#view-ana .a-ico{ width:62px; height:62px; border-radius:17px; margin:0 auto 18px; background:linear-gradient(150deg,var(--vio2),var(--vio)); display:flex; align-items:center; justify-content:center; box-shadow:0 16px 40px -10px rgba(124,92,255,.65); }
#view-ana .a-ico svg{ width:31px; height:31px; }
#view-ana .a-title{ font-family:'Playfair Display',serif; font-size:30px; font-weight:700; }
#view-ana .a-sub{ font-size:13.5px; color:var(--t2); margin-top:9px; max-width:430px; margin-left:auto; margin-right:auto; line-height:1.5; }
#view-ana .a-search{ display:flex; align-items:center; gap:10px; background:#0c1726; border:1.5px solid var(--vio); border-radius:14px; padding:7px 7px 7px 18px; margin:26px 0 0; box-shadow:0 0 0 4px rgba(124,92,255,.12),0 16px 40px -22px rgba(124,92,255,.6); }
#view-ana .a-search .sic{ font-size:17px; }
#view-ana .a-search input{ flex:1; min-width:0; background:transparent; border:none; outline:none; color:var(--t1); font-size:14px; font-family:inherit; }
#view-ana .a-search input::placeholder{ color:var(--t3); }
#view-ana .a-send{ background:linear-gradient(150deg,var(--vio2),var(--vio)); color:#fff; border:none; border-radius:11px; padding:11px 20px; font-size:13.5px; font-weight:600; font-family:inherit; cursor:pointer; white-space:nowrap; }
#view-ana .a-toggles{ display:flex; gap:10px; justify-content:center; margin-top:18px; }
#view-ana .tg{ display:flex; align-items:center; gap:7px; padding:9px 18px; border-radius:11px; font-size:13px; font-weight:600; cursor:pointer; border:1px solid var(--line); color:var(--t2); background:#0c1726; }
#view-ana .tg.on{ border-color:var(--vio); color:#c5b6ff; background:rgba(124,92,255,.12); }
#view-ana .a-quick{ margin-top:24px; }
#view-ana .a-quick .ql{ font-size:12px; color:var(--t3); margin-bottom:12px; }
#view-ana .chips{ display:flex; flex-wrap:wrap; gap:9px; justify-content:center; }
#view-ana .chip{ display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:20px; font-size:12.5px; background:#0e1c2e; border:1px solid var(--line); color:var(--t1); cursor:pointer; transition:all .2s; }
#view-ana .chip:hover{ border-color:var(--t2); }
#view-ana .chip.ai{ color:#c5b6ff; border-color:rgba(124,92,255,.4); background:rgba(124,92,255,.08); }

/* Bugünkü İşler (sağ) — TODO: yapilacaklar_kisisel / gorevler'den bağlanacak */
#view-ana .task{ display:flex; align-items:center; gap:13px; padding:14px 20px; border-bottom:1px solid var(--line2); }
#view-ana .task:hover{ background:#13233a; }
#view-ana .cb{ width:19px; height:19px; border:1.7px solid #37496a; border-radius:6px; flex:none; position:relative; cursor:pointer; }
#view-ana .cb.d{ background:var(--gold); border-color:var(--gold); }
#view-ana .cb.d::after{ content:""; position:absolute; left:6px; top:2px; width:4px; height:9px; border:solid #0a1320; border-width:0 2px 2px 0; transform:rotate(45deg); }
#view-ana .task .tt{ flex:1; } #view-ana .task .tn{ font-size:13px; font-weight:500; }
#view-ana .task.done .tn{ color:var(--t3); text-decoration:line-through; }
#view-ana .task .tg2{ font-size:11px; color:var(--t3); margin-top:3px; }
#view-ana .pri{ width:8px; height:8px; border-radius:50%; flex:none; }
#view-ana .pri.h{ background:var(--red); } #view-ana .pri.m{ background:var(--orange); } #view-ana .pri.l{ background:var(--t3); }
#view-ana .foot{ margin-top:auto; padding:13px 20px; border-top:1px solid var(--line2); font-size:12px; color:var(--gold); font-weight:600; text-align:center; cursor:pointer; }