/* style.css — basit, temiz, önceki şık görünümü anımsatan stil */
:root{
  --brand:#0f766e;
  --muted:#6b7280;
  --bg:#f3f4f6;
  --card:#ffffff;
  --text:#111827;
  --radius:10px;
  --shadow:0 6px 18px rgba(15,23,42,0.06);
  font-family: Inter, Arial, Helvetica, sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:inherit}
.container{max-width:1100px;margin:24px auto;padding:16px}
.topbar{display:flex;align-items:center;justify-content:space-between;background:var(--brand);color:#fff;padding:12px 16px;border-radius:10px}
.brand{display:flex;align-items:center;gap:12px}
.brand .icon{font-size:28px}
.brand .title{font-weight:700}
.brand .subtitle{font-size:12px;opacity:.9}
.actions .btn{background:transparent;border:1px solid rgba(255,255,255,0.12);color:#fff;padding:8px 10px;border-radius:8px;text-decoration:none;margin-left:8px}
.card{background:var(--card);padding:18px;border-radius:var(--radius);box-shadow:var(--shadow);margin-top:18px}
.btn{background:var(--brand);color:#fff;padding:8px 12px;border-radius:8px;border:0;cursor:pointer;text-decoration:none;display:inline-block}
.btn:hover{opacity:0.9;text-decoration:none}
.btn.ghost{background:transparent;border:1px solid #e5e7eb;color:var(--muted)}
.btn.ghost:hover{background:var(--brand);color:#fff}
.form-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.input{padding:8px;border-radius:8px;border:1px solid #e5e7eb;font-size:14px}
.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 2px rgba(15,118,110,0.1)}
.table{width:100%;border-collapse:collapse;margin-top:12px}
.table th,.table td{padding:8px;border-bottom:1px solid #eef2f7;text-align:left}
.table th{background:#f8fafc;font-weight:600}
.small{font-size:13px;color:var(--muted)}
.note{font-size:13px;color:var(--muted);padding:8px;background:#f0f9ff;border-radius:6px;margin:8px 0}
.alert{background:#fee2e2;padding:8px;border-radius:6px;color:#822; margin-bottom:8px;}
.footer{margin-top:18px;text-align:center;color:var(--muted);font-size:13px}

/* Filtreleme stilleri */
.filtered-out {
    display: none !important;
}
.filter-highlight {
    background-color: #fff3cd !important;
}

/* Responsive tasarım */
@media (max-width:700px){ 
    .form-row{flex-direction:column} 
    .actions .btn{display:block;margin-top:8px} 
    .container{margin:12px;padding:12px}
    .table{font-size:12px}
    .table th,.table td{padding:6px}
}

/* Tablo hover efektleri */
.table tbody tr:hover{
    background-color:#f8fafc;
}

/* Tag stilleri */
.tag{
    display:inline-block;
    padding:4px 8px;
    border-radius:6px;
    font-size:12px;
    font-weight:500;
}
.tag.ok{background:#4caf50;color:#fff}
.tag.nok{background:#f44336;color:#fff}

/* Detail row stilleri */
.detail-row pre{
    margin:0;
    padding:10px;
    background:#fafafa;
    border-left:4px solid #eee;
    font-size:12px;
    overflow-x:auto;
}

/* Expandable table stilleri */
.table-expandable .data-row{
    cursor:pointer;
    transition:background-color 0.2s;
}
.table-expandable .data-row:hover{
    background-color:#f1f5f9;
}

/* Form stilleri */
form label{
    display:block;
    margin-bottom:4px;
    font-weight:500;
}

/* Select stilleri */
select.input{
    background:white;
    cursor:pointer;
}

/* Color input stilleri */
input[type="color"]{
    width:60px;
    height:40px;
    border:none;
    border-radius:8px;
    cursor:pointer;
}

/* Date input stilleri */
input[type="date"]{
    cursor:pointer;
}

/* Button grup stilleri */
.btn + .btn{
    margin-left:8px;
}

/* Loading animasyonu */
.loading{
    opacity:0.6;
    pointer-events:none;
}

/* Success mesaj stilleri */
.success{
    background:#d1fae5;
    color:#065f46;
    padding:8px 12px;
    border-radius:6px;
    margin:8px 0;
}

/* Error mesaj stilleri */
.error{
    background:#fee2e2;
    color:#991b1b;
    padding:8px 12px;
    border-radius:6px;
    margin:8px 0;
}

/* Filtreleme input stilleri */
#globalFilter, #userGlobalFilter, #logGlobalFilter, #columnGlobalFilter{
    border:2px solid var(--brand);
    padding:10px;
    font-size:14px;
}

#globalFilter:focus, #userGlobalFilter:focus, #logGlobalFilter:focus, #columnGlobalFilter:focus{
    box-shadow:0 0 0 3px rgba(15,118,110,0.1);
}