:root {
  --bg: #f8fafc;
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --bg-hover: #f1f5f9;
  --border: #e2e8f0;
  --text-main: #0f172a;
  --text-muted: #64748b;
  --primary: #2563eb;
  --primary-hover: #1d4ed8;
  --primary-light: #eff6ff;
  
  --success: #16a34a;
  --success-bg: #dcfce7;
  --warning: #ca8a04;
  --warning-bg: #fef9c3;
  --danger: #dc2626;
  --danger-bg: #fee2e2;
  --info: #0ea5e9;
  --info-bg: #e0f2fe;

  --badge-yeni-bg: #f3e8ff;
  --badge-yeni-text: #7e22ce;
  --badge-islemde-bg: #fef3c7;
  --badge-islemde-text: #b45309;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --font: 'Inter', system-ui, -apple-system, sans-serif;
}

* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:var(--font); background:var(--bg); color:var(--text-main); height:100vh; overflow:hidden; }

/* LAYOUT */
.app-container { display:flex; height:100vh; width:100vw; overflow:hidden; }

/* SIDEBAR */
.sidebar { width:260px; background:var(--bg-sidebar); border-right:1px solid var(--border); display:flex; flex-direction:column; z-index:10; }
.sidebar-logo { padding:24px; font-weight:700; font-size:1.1rem; display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--border); color:var(--text-main); }
.sidebar-logo svg { color:var(--primary); }
.sidebar-nav { flex:1; padding:20px 10px; display:flex; flex-direction:column; gap:5px; }
.nav-item { display:flex; align-items:center; gap:12px; padding:12px 15px; background:none; border:none; border-radius:var(--radius-md); font-family:inherit; font-size:0.95rem; color:var(--text-muted); cursor:pointer; width:100%; text-align:left; font-weight:500; transition:all 0.2s; }
.nav-item:hover { background:var(--bg-hover); color:var(--text-main); }
.nav-item.active { background:var(--primary-light); color:var(--primary); }
.nav-item svg { width:18px; height:18px; }
.sidebar-footer { padding:20px; font-size:0.8rem; color:var(--text-muted); border-top:1px solid var(--border); text-align:center; }

/* MAIN CONTENT AREA */
.main-wrapper { flex:1; display:flex; flex-direction:column; overflow:hidden; }
.topbar { background:#fff; border-bottom:1px solid var(--border); padding:0 30px; height:70px; display:flex; align-items:center; justify-content:space-between; flex-shrink:0; }
.breadcrumb { font-weight:600; font-size:1.1rem; color:var(--text-main); }
.topbar-right { display:flex; align-items:center; gap:20px; }
.user-profile { display:flex; align-items:center; gap:12px; }
.user-avatar { width:35px; height:35px; background:var(--bg-hover); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--text-muted); }
.user-avatar svg { width:18px; height:18px; }
.user-info { display:flex; flex-direction:column; }
.user-name { font-weight:600; font-size:0.9rem; }
.user-role { font-size:0.75rem; color:var(--text-muted); }

.content-area { flex:1; padding:30px; overflow-y:auto; background:var(--bg); }
.tab-content { display:none; }
.tab-content.active { display:block; }

/* LOGIN */
.login-screen { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; background:var(--bg); z-index:999; }
.login-card { background:var(--bg-card); padding:40px; border-radius:var(--radius-lg); width:400px; box-shadow:var(--shadow-md); border:1px solid var(--border); }
.login-logo { text-align:center; margin-bottom:30px; }
.logo-icon-wrap { background:var(--primary-light); color:var(--primary); width:60px; height:60px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 15px; }
.logo-icon-wrap svg { width:28px; height:28px; }

/* PANELS & CARDS */
.panel { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); margin-bottom:20px; overflow:hidden; }
.panel-header { padding:20px 25px; border-bottom:1px solid var(--border); background:var(--bg-card); }
.panel-title { font-size:1.1rem; font-weight:600; color:var(--text-main); margin:0; }
.panel-body { padding:20px 25px; }

/* STATS */
.stats-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; margin-bottom:30px; }
.stat-card { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-lg); padding:25px; display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:var(--shadow-sm); cursor:pointer; transition:transform 0.1s; }
.stat-card:hover { transform:translateY(-2px); border-color:var(--primary); box-shadow:var(--shadow-md); }
.stat-value { font-size:2.5rem; font-weight:700; color:var(--primary); margin-bottom:5px; }
.stat-label { font-size:0.9rem; color:var(--text-muted); font-weight:500; }

/* BUTTONS */
.btn-primary { background:var(--primary); color:white; border:none; padding:10px 20px; border-radius:var(--radius-md); font-weight:500; cursor:pointer; font-family:inherit; font-size:0.9rem; display:inline-flex; align-items:center; gap:8px; justify-content:center; transition:background 0.2s;}
.btn-primary:hover { background:var(--primary-hover); }
.btn-icon { background:none; border:none; color:var(--text-muted); cursor:pointer; border-radius:var(--radius-sm); padding:6px; display:flex; align-items:center; justify-content:center; transition:background 0.2s;}
.btn-icon:hover { background:var(--bg-hover); color:var(--text-main); }
.form-group { margin-bottom:15px; }
.form-group label { display:block; margin-bottom:5px; font-weight:500; font-size:0.9rem; color:var(--text-muted); }
.form-control { width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:var(--radius-md); font-family:inherit; font-size:1rem; outline:none; transition:border-color 0.2s; }
.form-control:focus { border-color:var(--primary); }

/* PILL BADGES */
.badge { padding:4px 12px; border-radius:20px; font-size:0.75rem; font-weight:600; display:inline-flex; align-items:center; }
.badge-yeni { background:var(--badge-yeni-bg); color:var(--badge-yeni-text); }
.badge-islemde { background:var(--badge-islemde-bg); color:var(--badge-islemde-text); }
.badge-tamam { background:var(--success-bg); color:var(--success); }
.badge-acil { background:var(--danger-bg); color:var(--danger); }
.badge-normal { background:var(--info-bg); color:var(--info); }

/* DATATABLE STYLES */
.table-container { width:100%; overflow-x:auto; }
.data-table { width:100%; border-collapse:collapse; text-align:left; font-size:0.9rem; }
.data-table th { padding:15px 25px; border-bottom:1px solid var(--border); color:var(--text-muted); font-weight:500; font-size:0.85rem; background:#fafafa; }
.data-table td { padding:15px 25px; border-bottom:1px solid var(--border); color:var(--text-main); vertical-align:middle; }
.data-table tbody tr:hover { background:var(--bg-hover); cursor:pointer; }
.data-table tr:last-child td { border-bottom:none; }

.filter-tabs { display:flex; padding:0 20px; border-bottom:1px solid var(--border); background:#fafafa; gap:10px; }
.filter-tab { background:none; border:none; padding:15px 10px; font-weight:500; font-size:0.9rem; color:var(--text-muted); border-bottom:2px solid transparent; cursor:pointer; margin-bottom:-1px; }
.filter-tab.active { color:var(--primary); border-bottom-color:var(--primary); }
.filter-tab:hover:not(.active) { color:var(--text-main); }

/* MODAL */
.modal { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:1000; }
.modal-overlay { position:absolute; inset:0; background:rgba(0,0,0,0.5); backdrop-filter:blur(2px); }
.modal-content { position:relative; z-index:1010; background:var(--bg-card); width:600px; max-width:95%; border-radius:var(--radius-lg); box-shadow:var(--shadow-md); max-height:90vh; display:flex; flex-direction:column; }
.modal-header { padding:20px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; }
.modal-header h2 { font-size:1.25rem; font-weight:600; margin:0; }
.modal-body { padding:20px; overflow-y:auto; flex:1; }
.modal-footer { padding:20px; border-top:1px solid var(--border); }

/* CHAT WALL */
.wall-panel { display:flex; flex-direction:column; height:calc(100vh - 130px); margin-bottom:0; }
.wall-messages { flex:1; overflow-y:auto; padding:20px; display:flex; flex-direction:column; gap:15px; background:var(--bg-hover); }
.wall-msg-card { background:var(--bg-card); border:1px solid var(--border); padding:15px; border-radius:var(--radius-lg); width:fit-content; max-width:80%; box-shadow:var(--shadow-sm); position:relative; }
.wall-msg-card.admin { background:#fefce8; border-color:#fef08a; }
.wall-author { font-size:0.8rem; font-weight:600; margin-bottom:4px; display:flex; justify-content:space-between; align-items:center; gap:10px; }
.wall-time { font-size:0.7rem; color:var(--text-muted); font-weight:normal; }
.wall-text { font-size:0.95rem; color:var(--text-main); line-height:1.5; }
.wall-input-container { padding:15px 20px; border-top:1px solid var(--border); background:var(--bg-card); display:flex; gap:10px; }
.wall-input-container input { flex:1; padding:12px 15px; border:1px solid var(--border); border-radius:30px; outline:none; font-family:inherit; background:var(--bg-hover); transition:background 0.2s; }
.wall-input-container input:focus { background:#fff; border-color:var(--primary); }

/* NOTES */
.notes-grid { display:grid; grid-template-columns:1fr; gap:20px; }
.note-card { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-lg); padding:25px; box-shadow:var(--shadow-sm); }
.note-title { font-size:1.1rem; font-weight:600; color:var(--primary); margin-bottom:10px; display:flex; align-items:center; gap:8px; }
.note-meta { font-size:0.8rem; color:var(--text-muted); margin-bottom:15px; display:flex; gap:15px; font-weight:500;}
.note-content { font-size:0.95rem; line-height:1.6; white-space:pre-wrap; color:var(--text-main); }