* { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Inter', sans-serif; }
body { background: #050711; color: #fff; min-height: 100vh; }

.background { position: fixed; inset: 0; z-index: -1; background: radial-gradient(circle at top, #131a33 0%, #050711 70%); }

.page-container { max-width: 1100px; margin: 40px auto; padding: 0 20px; }

.header-action { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.header-action h1 { font-size: 32px; font-weight: 800; }
.header-action p { color: #94a3b8; font-size: 14px; margin-top: 4px; }

.breadcrumb { display: flex; gap: 8px; font-size: 13px; color: #64748b; margin-bottom: 25px; background: rgba(15, 23, 42, 0.4); padding: 10px 16px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.05); }
.breadcrumb a { color: #94a3b8; text-decoration: none; }

.btn-orange { background: #ff7418; color: #fff; border: none; padding: 12px 24px; border-radius: 10px; font-weight: 700; cursor: pointer; transition: 0.2s; }
.btn-orange:hover { background: #e0600a; transform: translateY(-2px); }

.content-box { background: rgba(15, 23, 42, 0.6); border: 1px solid rgba(255, 116, 24, 0.15); border-radius: 16px; padding: 30px; backdrop-filter: blur(10px); min-height: 380px; }

/* BOŞ DURUM (EMPTY STATE) */
.empty-state { text-align: center; padding: 50px 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.empty-icon { width: 80px; height: 80px; background: rgba(255, 116, 24, 0.1); border: 2px solid #ff7418; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 36px; color: #ff7418; margin-bottom: 20px; }
.empty-state h3 { font-size: 22px; margin-bottom: 10px; }
.empty-state p { color: #94a3b8; font-size: 14px; max-width: 400px; margin-bottom: 25px; line-height: 1.5; }

/* TABLO TASARIMI */
.ticket-table { width: 100%; border-collapse: collapse; text-align: left; }
.ticket-table th { padding: 14px; color: #64748b; font-size: 12px; border-bottom: 1px solid rgba(255,255,255,0.08); text-transform: uppercase; }
.ticket-table td { padding: 16px 14px; border-bottom: 1px solid rgba(255,255,255,0.05); font-size: 14px; }
.ticket-table tr:hover { background: rgba(255,255,255,0.02); }

.badge { padding: 4px 10px; border-radius: 6px; font-size: 12px; font-weight: 700; background: rgba(255,255,255,0.1); }
.badge.open { background: rgba(255, 184, 0, 0.15); color: #ffb800; border: 1px solid rgba(255, 184, 0, 0.3); }
.badge.replied { background: rgba(30, 229, 163, 0.15); color: #1ee5a3; border: 1px solid rgba(30, 229, 163, 0.3); }
.badge.closed { background: rgba(148, 163, 184, 0.15); color: #94a3b8; }

/* MODALLAR */
.modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; }
.modal.hidden { display: none; }
.backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.8); backdrop-filter: blur(5px); }
.dialog { position: relative; width: 100%; max-width: 550px; background: #0f172a; border: 1px solid rgba(255, 116, 24, 0.3); border-radius: 16px; padding: 25px; z-index: 2; }
.dialog-large { max-width: 750px; }

.dialog header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.close-btn { background: none; border: none; color: #94a3b8; font-size: 24px; cursor: pointer; }

.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 13px; font-weight: 600; color: #cbd5e1; margin-bottom: 8px; }
.form-group input, .form-group select, .form-group textarea { width: 100%; padding: 12px; background: rgba(0,0,0,0.4); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; color: #fff; font-size: 14px; outline: none; }
.form-group select option { background: #0f172a; color: #fff; }

.hint { font-size: 12px; color: #64748b; margin-top: 4px; display: block; }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }
.btn-cancel { background: transparent; border: 1px solid rgba(255,255,255,0.1); color: #ccc; padding: 10px 20px; border-radius: 8px; cursor: pointer; }

/* CHAT KUTUSU */
.chat-container { height: 350px; overflow-y: auto; background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.08); border-radius: 10px; padding: 15px; display: flex; flex-direction: column; gap: 12px; margin-bottom: 15px; }
.chat-msg { max-width: 80%; padding: 12px; border-radius: 10px; font-size: 13px; line-height: 1.5; }
.chat-msg.user { align-self: flex-start; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); }
.chat-msg.admin { align-self: flex-end; background: rgba(255, 116, 24, 0.15); border: 1px solid rgba(255, 116, 24, 0.3); }
.chat-img { max-width: 100%; max-height: 200px; border-radius: 8px; margin-top: 8px; display: block; }

.reply-form { display: flex; gap: 10px; }
.reply-form input { flex: 1; padding: 12px; background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; color: #fff; outline: none; }