/* odoorpc — tasarim sistemi
   Otorite: design/odo/ornek-tasarim.html (magenta #c03060 -> mor #603078)
   DESIGN_REFERENCE.md §8/§9'daki "mavi #1a56db" ESKI SURUM, kullanilmadi. */

:root{
  --brand-primary:#c03060; --brand-primary-dark:#8a2350; --brand-primary-light:#d65a82;
  --brand-purple:#603078; --brand-purple-dark:#4a2560;
  --brand-gradient:linear-gradient(135deg,#603078 0%,#c03060 100%);
  --brand-accent:#f0a830;
  --ink-900:#0f172a; --ink-700:#334155; --ink-500:#64748b; --ink-300:#cbd5e1;
  --surface-50:#f8fafc; --surface-100:#f1f5f9; --white:#fff;
  --dark-bg:#160d1f; --dark-surface:#211530;
  --ok:#0f7b52; --warn:#b45309; --danger:#b91c1c;
  --font-heading:"Poppins","Inter",system-ui,sans-serif;
  --font-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --radius-md:14px; --radius-lg:20px; --radius-full:9999px;
  --shadow-sm:0 1px 3px rgba(15,23,42,.08);
  --shadow-md:0 14px 40px -16px rgba(96,48,120,.35);
  --container:1180px; --transition:240ms cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box}
body{margin:0;font-family:var(--font-body);color:var(--ink-900);background:var(--surface-50);font-size:15px;line-height:1.55}
h1,h2,h3{font-family:var(--font-heading);margin:0}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85em}
.muted{color:var(--ink-500)}

/* --- ust bar --- */
.topbar{display:flex;align-items:center;gap:2rem;padding:.9rem 1.5rem;background:var(--dark-bg);color:#fff}
.brand{font-family:var(--font-heading);font-weight:700;font-size:1.25rem;color:#fff;text-decoration:none}
.brand span{color:var(--brand-primary-light)}
.nav{display:flex;gap:1.25rem;flex:1}
.nav a{color:#e9dff0;text-decoration:none;font-weight:500;padding:.3rem 0;border-bottom:2px solid transparent;transition:var(--transition)}
.nav a:hover{border-color:var(--brand-primary)}
.nav a.soon{opacity:.45;cursor:not-allowed}
.user{display:flex;align-items:center;gap:.75rem;font-size:.85rem}
.user .email{color:#cbb9d6}
.role{padding:.15rem .55rem;border-radius:var(--radius-full);font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.role-admin{background:var(--brand-primary)}
.role-operator{background:var(--brand-purple)}
.role-viewer{background:#3f3350}

/* --- yerlesim --- */
.wrap{max-width:var(--container);margin:0 auto;padding:2rem 1.5rem 4rem}
.sec{font-size:1.05rem;margin:2rem 0 .85rem;color:var(--ink-700)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.card{background:var(--white);border:1px solid var(--ink-300);border-radius:var(--radius-md);padding:1.1rem;box-shadow:var(--shadow-sm)}
.card.center{text-align:center;max-width:420px;margin:4rem auto}
.inst header{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;margin-bottom:.6rem}
.inst h3{font-size:1rem}
.inst.passive{opacity:.6}
.slug{background:var(--surface-100);padding:.1rem .45rem;border-radius:6px;color:var(--brand-purple)}
.inst dl{display:grid;grid-template-columns:auto 1fr;gap:.15rem .75rem;margin:0;font-size:.85rem}
.inst dt{color:var(--ink-500)}
.inst dd{margin:0;overflow-wrap:anywhere}

/* --- rozetler --- */
.badges{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem}
.crud{font-family:ui-monospace,monospace;letter-spacing:.14em;font-weight:700;background:var(--brand-gradient);color:#fff;padding:.2rem .6rem;border-radius:var(--radius-full);font-size:.75rem}
.badge{background:var(--surface-100);color:var(--ink-700);padding:.2rem .55rem;border-radius:var(--radius-full);font-size:.72rem}
.badge.warn{background:#fef3c7;color:var(--warn)}
.badge.danger{background:#fee2e2;color:var(--danger)}
.err{color:var(--danger);font-size:.8rem;margin:.6rem 0 0}

/* --- istatistik --- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem}
.stat{background:var(--white);border:1px solid var(--ink-300);border-left:4px solid var(--brand-primary);border-radius:var(--radius-md);padding:.9rem 1.1rem}
.stat b{display:block;font-family:var(--font-heading);font-size:1.6rem;line-height:1}
.stat span{color:var(--ink-500);font-size:.8rem}
.stat-warn{border-left-color:var(--warn)}

/* --- tablo --- */
.tbl{width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--ink-300);border-radius:var(--radius-md);overflow:hidden;font-size:.85rem}
.tbl th{background:var(--surface-100);text-align:left;padding:.6rem .8rem;font-weight:600;color:var(--ink-700)}
.tbl td{padding:.55rem .8rem;border-top:1px solid var(--surface-100)}
.res{font-weight:600}
.res-denied .res{color:var(--warn)}
.res-error .res{color:var(--danger)}
.res-ok .res{color:var(--ok)}

/* --- form / dugme --- */
label{display:block;margin-bottom:.9rem;font-size:.85rem;font-weight:500;color:var(--ink-700)}
input[type=email],input[type=password],input[type=text],select,textarea{width:100%;margin-top:.3rem;padding:.6rem .7rem;border:1px solid var(--ink-300);border-radius:10px;font:inherit;background:var(--white)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--brand-primary-light);outline-offset:1px;border-color:transparent}
.btn-primary{display:inline-block;width:100%;padding:.65rem 1.2rem;border:0;border-radius:var(--radius-full);background:var(--brand-gradient);color:#fff;font:inherit;font-weight:600;cursor:pointer;transition:var(--transition);text-decoration:none;text-align:center}
.btn-primary:hover{filter:brightness(1.08);box-shadow:var(--shadow-md)}
.btn-ghost{background:transparent;border:1px solid #5b4470;color:#e9dff0;padding:.3rem .8rem;border-radius:var(--radius-full);font:inherit;font-size:.8rem;cursor:pointer}
.btn-ghost:hover{background:#2c1d3d}

/* --- uyari --- */
.alert{padding:.65rem .9rem;border-radius:10px;margin-bottom:1rem;font-size:.88rem}
.alert-error{background:#fee2e2;color:var(--danger)}
.alert-success{background:#dcfce7;color:var(--ok)}
.alert-info{background:#e0e7ff;color:#3730a3}

/* --- giris ekrani --- */
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--dark-bg);background-image:radial-gradient(circle at 20% 20%,rgba(96,48,120,.55),transparent 55%),radial-gradient(circle at 80% 70%,rgba(192,48,96,.4),transparent 50%)}
.login-card{width:min(400px,92vw);background:var(--white);border-radius:var(--radius-lg);padding:2rem;box-shadow:var(--shadow-md)}
.login-brand{font-family:var(--font-heading);font-weight:700;font-size:1.9rem;text-align:center}
.login-brand span{color:var(--brand-primary)}
.login-sub{text-align:center;color:var(--ink-500);font-size:.85rem;margin:.2rem 0 1.6rem}
.login-note{font-size:.75rem;color:var(--ink-500);text-align:center;margin:1rem 0 0}
.err-code{font-size:3rem;color:var(--brand-primary)}

/* --- alt bilgi --- */
.foot{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;max-width:var(--container);margin:0 auto;padding:1.5rem;color:var(--ink-500);font-size:.78rem;border-top:1px solid var(--ink-300)}

/* ============ Faz 5 ekranlari ============ */
.head-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.row-actions{display:flex;gap:.5rem;align-items:center}
.row-actions form{margin:0}
.btn-sm{width:auto;padding:.4rem 1rem;font-size:.85rem}
.btn-ghost.light{background:transparent;border:1px solid var(--ink-300);color:var(--ink-700)}
.btn-ghost.light:hover{background:var(--surface-100)}
.btn-ghost.dark{border-color:var(--ink-300);color:var(--ink-700)}
.btn-danger{padding:.5rem 1.1rem;border:0;border-radius:var(--radius-full);background:var(--danger);color:#fff;font:inherit;font-weight:600;cursor:pointer}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}
@media(max-width:900px){.two,.cols{grid-template-columns:1fr}}
.form-wide{max-width:760px}
fieldset{border:0;margin:0;padding:0}
fieldset[disabled]{opacity:.65}
label.inline{display:flex;align-items:center;gap:.45rem;font-weight:500}
label.inline input{width:auto;margin:0}
label small{display:block;color:var(--ink-500);font-weight:400;font-size:.75rem;margin-top:.2rem}
.actions{display:flex;gap:.75rem;align-items:center;margin-top:.5rem}
.actions .btn-primary{width:auto;padding:.6rem 1.6rem}
.crud-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem 1rem;margin-bottom:1rem}
.crud-grid b{color:var(--brand-primary);font-family:ui-monospace,monospace}
.filter-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:flex-end;margin-bottom:1rem}
.filter-row label{margin:0;flex:1 1 130px}
.filter-row .btn-primary{width:auto;padding:.55rem 1.3rem}
.badge.ok{background:#dcfce7;color:var(--ok)}
.tbl.small{font-size:.8rem}
.tbl tr.sub td{padding-top:0;border-top:0}
.tbl tr.passive{opacity:.55}
.break{overflow-wrap:anywhere;max-width:260px}
.small{font-size:.78rem}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}
.chip{background:var(--white);border:1px solid var(--ink-300);border-radius:var(--radius-full);padding:.25rem .7rem;font-size:.78rem}
.chip b{color:var(--brand-purple)}
.pager{display:flex;gap:1rem;align-items:center;justify-content:center;margin-top:1.2rem}
.kv{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1.2rem;margin:0;font-size:.88rem}
.kv dt{color:var(--ink-500)}
.kv dd{margin:0}
.json{background:var(--dark-bg);color:#e9dff0;padding:1rem;border-radius:var(--radius-md);overflow:auto;max-height:420px;font-size:.78rem;line-height:1.5}
.danger-zone{margin-top:2.5rem;border:1px solid #fecaca;background:#fff5f5;border-radius:var(--radius-md);padding:1rem}
.danger-zone summary{cursor:pointer;font-weight:600;color:var(--danger)}
.danger-zone form{margin-top:.8rem;max-width:420px}
.scroll-x{overflow-x:auto;max-width:100%}
.scroll-x .tbl{min-width:max-content}
.write-box{margin-top:1.5rem}
.write-box summary{cursor:pointer;font-weight:600;color:var(--brand-purple)}
.write-box form{margin-top:.9rem;max-width:640px}
textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem}
button[disabled]{opacity:.45;cursor:not-allowed}
