/* ============================================================
   METUnic Domain Panel — Kurumsal Tasarım Sistemi
   Tailwind bağımlılığı yok. Mobil uyumlu.
   ============================================================ */

:root{
  /* Marka */
  --brand-50:#eef4ff;  --brand-100:#dbe7fe; --brand-200:#bfd3fe;
  --brand-500:#3b82f6; --brand-600:#2563eb; --brand-700:#1d4ed8; --brand-800:#1e40af;
  /* Nötr (slate) */
  --bg:#f4f6fb;        --surface:#ffffff;
  --ink-900:#0f172a;   --ink-800:#1e293b;  --ink-700:#334155;
  --ink-600:#475569;   --ink-500:#64748b;  --ink-400:#94a3b8;  --ink-300:#cbd5e1;
  --line:#e5e9f0;      --line-soft:#eef1f6;
  /* Sidebar */
  --side-bg:#0f172a;   --side-bg-2:#1e293b; --side-ink:#94a3b8; --side-ink-hover:#e2e8f0;
  /* Semantik */
  --green-50:#ecfdf5; --green-600:#059669; --green-700:#047857;
  --red-50:#fef2f2;   --red-600:#dc2626;   --red-700:#b91c1c;
  --amber-50:#fffbeb; --amber-600:#d97706; --amber-700:#b45309;
  --purple-50:#faf5ff;--purple-600:#9333ea;
  /* Efekt */
  --radius:14px; --radius-sm:10px; --radius-lg:18px;
  --shadow-sm:0 1px 2px rgba(15,23,42,.06);
  --shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.04);
  --shadow-md:0 4px 12px rgba(15,23,42,.08);
  --shadow-lg:0 12px 32px rgba(15,23,42,.12);
  --shadow-xl:0 24px 48px rgba(15,23,42,.16);
  --ring:0 0 0 3px rgba(37,99,235,.16);
}

/* ---- Reset & Base ---- */
*,::before,::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;line-height:1.5;-webkit-text-size-adjust:100%}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background:var(--bg);color:var(--ink-800);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit}
img,svg{display:block}
textarea{resize:vertical}
::selection{background:var(--brand-200)}
/* Scrollbar */
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:#cdd5e1;border-radius:8px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:#b3bccb;background-clip:content-box}

/* ---- Layout ---- */
.main-wrapper{margin-left:256px;display:flex;flex-direction:column;min-height:100vh;transition:margin .2s ease}

/* ---- Sidebar ---- */
#sidebar{position:fixed;left:0;top:0;width:256px;height:100%;background:var(--side-bg);
  background-image:linear-gradient(180deg,#0f172a 0%,#111c33 100%);
  display:flex;flex-direction:column;z-index:60;transition:transform .25s cubic-bezier(.4,0,.2,1);
  border-right:1px solid rgba(255,255,255,.04)}
.sidebar-logo{padding:20px 18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.06)}
.sidebar-logo-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--brand-500),var(--brand-700));border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 6px 16px rgba(37,99,235,.4)}
.sidebar-logo-title{color:#fff;font-weight:700;font-size:15px;line-height:1.2;letter-spacing:-.01em}
.sidebar-logo-sub{color:var(--ink-500);font-size:11px;margin-top:2px;letter-spacing:.02em}
.sidebar-nav{flex:1;padding:14px 12px;overflow-y:auto}
.sidebar-section{color:var(--ink-500);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:14px 12px 6px}
.sidebar-link{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;font-size:14px;font-weight:500;color:var(--side-ink);transition:background .15s,color .15s;white-space:nowrap;margin-bottom:2px;position:relative}
.sidebar-link:hover{color:var(--side-ink-hover);background:rgba(255,255,255,.05)}
.sidebar-link.active{color:#fff;background:linear-gradient(135deg,var(--brand-600),var(--brand-700));box-shadow:0 6px 16px rgba(37,99,235,.35)}
.sidebar-link.active .sidebar-icon{color:#fff}
.sidebar-icon{width:19px;height:19px;flex-shrink:0;opacity:.95}
.sidebar-footer{padding:14px 16px;border-top:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:8px}
.sidebar-footer-text{color:var(--ink-500);font-size:12px}

/* ---- Sidebar backdrop (mobil) ---- */
#sidebarBackdrop{position:fixed;inset:0;background:rgba(15,23,42,.5);backdrop-filter:blur(2px);z-index:55;opacity:0;visibility:hidden;transition:opacity .25s}
#sidebarBackdrop.show{opacity:1;visibility:visible}

/* ---- Mobile toggle ---- */
.mobile-toggle{display:none;position:fixed;top:12px;right:12px;z-index:50;width:42px;height:42px;background:var(--surface);color:var(--ink-800);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-md);align-items:center;justify-content:center}
.mobile-toggle:active{transform:scale(.96)}
.mobile-logo-link{display:none;position:fixed;top:12px;left:12px;z-index:50}
.mobile-logo{height:36px;width:auto;margin-right:16px}

@media(max-width:1023px){
  .main-wrapper{margin-left:0}
  #sidebar{transform:translateX(100%);left:auto;right:0;box-shadow:var(--shadow-xl)}
  #sidebar.open{transform:translateX(0)}
  .mobile-toggle{display:flex}
  .mobile-logo-link{display:block}
  .topbar-title{margin-left:0!important;padding-left:56px}
}

/* ---- Topbar ---- */
.topbar{height:64px;background:rgba(255,255,255,.85);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 20px;position:sticky;top:0;z-index:40}
.topbar-title{font-size:18px;font-weight:700;color:var(--ink-900);letter-spacing:-.01em}
.topbar-right{display:flex;align-items:center;gap:12px}
.topbar-url{font-size:12px;color:var(--ink-400);font-weight:500}
@media(max-width:520px){.topbar-url{display:none}}

/* ---- Env badge ---- */
.env-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:9999px;font-size:12px;font-weight:600;border:1px solid}
.env-test{background:var(--amber-50);border-color:#fde68a;color:var(--amber-700)}
.env-live{background:var(--green-50);border-color:#a7f3d0;color:var(--green-700)}

/* ---- Dots ---- */
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}
.dot-green{background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
.dot-amber{background:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,.18)}
.dot-red{background:#ef4444}.dot-blue{background:#3b82f6}

/* ---- Badges ---- */
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:9999px;font-size:11.5px;font-weight:600;border:1px solid;white-space:nowrap;line-height:1.5}
.badge-green {background:var(--green-50);color:var(--green-700);border-color:#a7f3d0}
.badge-red   {background:var(--red-50);color:var(--red-700);border-color:#fecaca}
.badge-yellow{background:var(--amber-50);color:var(--amber-700);border-color:#fde68a}
.badge-blue  {background:var(--brand-50);color:var(--brand-700);border-color:var(--brand-200)}
.badge-gray  {background:#f1f5f9;color:var(--ink-600);border-color:var(--line)}
.badge-purple{background:var(--purple-50);color:var(--purple-600);border-color:#e9d5ff}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 16px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;transition:all .15s ease;border:1px solid transparent;white-space:nowrap;line-height:1.25;vertical-align:middle}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.55;cursor:not-allowed;pointer-events:none}
.btn-primary  {background:linear-gradient(135deg,var(--brand-600),var(--brand-700));color:#fff;box-shadow:0 4px 12px rgba(37,99,235,.28)}
.btn-primary:hover  {box-shadow:0 6px 18px rgba(37,99,235,.38)}
.btn-secondary{background:#f1f5f9;color:var(--ink-700)}.btn-secondary:hover{background:#e2e8f0}
.btn-danger   {background:var(--red-600);color:#fff}  .btn-danger:hover   {background:var(--red-700)}
.btn-outline  {background:var(--surface);color:var(--ink-700);border-color:var(--line)}.btn-outline:hover{background:#f8fafc;border-color:var(--ink-300)}
.btn-ghost    {background:transparent;color:var(--ink-700)}.btn-ghost:hover{background:#f1f5f9}
.btn-sm{padding:6px 12px;font-size:12.5px;border-radius:8px}
.btn-lg{padding:13px 24px;font-size:16px}
.btn-block{width:100%}

/* ---- Icon button (tablo aksiyonları) ---- */
.icon-btn{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;color:var(--ink-400);background:transparent;border:1px solid transparent;font-size:15px;transition:all .15s}
.icon-btn:hover{background:#f1f5f9;color:var(--ink-700);border-color:var(--line)}

/* ---- Card ---- */
.card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--line);padding:24px;box-shadow:var(--shadow)}
.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}
.card-title{font-size:16px;font-weight:700;color:var(--ink-900);letter-spacing:-.01em}
.card-sub{font-size:13px;color:var(--ink-500);margin-top:2px}
@media(max-width:640px){.card{padding:18px}}

/* ---- Form ---- */
.form-group{margin-bottom:16px}
.form-label{display:block;font-size:13px;font-weight:600;color:var(--ink-700);margin-bottom:6px}
.form-input{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:14px;background:var(--surface);color:var(--ink-900);outline:none;transition:border-color .15s,box-shadow .15s}
.form-input:hover{border-color:var(--ink-300)}
.form-input:focus{border-color:var(--brand-500);box-shadow:var(--ring)}
.form-input:disabled{background:#f8fafc;color:var(--ink-500);cursor:not-allowed}
.form-hint{font-size:12px;color:var(--ink-400);margin-top:4px}

/* ---- Grid ---- */
.grid{display:grid;gap:16px}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sm\:pt-6{padding-top:24px}.sm\:flex-row{flex-direction:row}
}
@media(min-width:768px){
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:767px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-cols-2,.grid-cols-3,.grid-cols-4{grid-template-columns:repeat(2,1fr)}
}

/* ---- Flex helpers ---- */
.flex{display:flex}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}
.items-center{align-items:center}.items-start{align-items:flex-start}
.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}
.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.gap-8{gap:32px}
.flex-1{flex:1}.shrink-0{flex-shrink:0}.min-w-0{min-width:0}

/* ---- Spacing ---- */
.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-5{margin-top:20px}.mt-6{margin-top:24px}.mt-0\.5{margin-top:2px}.-mt-1{margin-top:-4px}
.mb-1{margin-bottom:4px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.mb-5{margin-bottom:20px}.mb-6{margin-bottom:24px}.mb-0\.5{margin-bottom:2px}
.ml-1{margin-left:4px}.ml-2{margin-left:8px}.mr-2{margin-right:8px}
.mx-auto{margin-left:auto;margin-right:auto}
.p-2{padding:8px}.p-3{padding:12px}.p-4{padding:16px}.p-5{padding:20px}.p-6{padding:24px}.p-8{padding:32px}.p-1\.5{padding:6px}
.px-3{padding-left:12px;padding-right:12px}.px-4{padding-left:16px;padding-right:16px}.px-6{padding-left:24px;padding-right:24px}.px-2\.5{padding-left:10px;padding-right:10px}
.py-1{padding-top:4px;padding-bottom:4px}.py-2{padding-top:8px;padding-bottom:8px}.py-3{padding-top:12px;padding-bottom:12px}
.py-4{padding-top:16px;padding-bottom:16px}.py-5{padding-top:20px;padding-bottom:20px}.py-6{padding-top:24px;padding-bottom:24px}
.py-8{padding-top:32px;padding-bottom:32px}.py-10{padding-top:40px;padding-bottom:40px}.py-12{padding-top:48px;padding-bottom:48px}
.py-0\.5{padding-top:2px;padding-bottom:2px}.py-1\.5{padding-top:6px;padding-bottom:6px}
.pt-2{padding-top:8px}.pt-4{padding-top:16px}.pt-6{padding-top:24px}.pb-2{padding-bottom:8px}

/* ---- Typography ---- */
.text-xs{font-size:12px}.text-sm{font-size:14px}.text-base{font-size:16px}
.text-lg{font-size:18px}.text-xl{font-size:20px}.text-2xl{font-size:24px}
.text-3xl{font-size:30px}.text-4xl{font-size:36px}.text-5xl{font-size:44px;line-height:1.05}
.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.font-black{font-weight:800}.font-normal{font-weight:400}
.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.text-center{text-align:center}.text-right{text-align:right}
.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.05em}
.leading-tight{line-height:1.25}.leading-none{line-height:1}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.break-all{word-break:break-all}.whitespace-pre-wrap{white-space:pre-wrap}.whitespace-nowrap{white-space:nowrap}

/* ---- Colors ---- */
.text-white{color:#fff}
.text-gray-400{color:var(--ink-400)}.text-gray-500{color:var(--ink-500)}.text-gray-600{color:var(--ink-600)}
.text-gray-700{color:var(--ink-700)}.text-gray-800{color:var(--ink-800)}.text-gray-900{color:var(--ink-900)}
.text-blue-600{color:var(--brand-600)}.text-blue-700{color:var(--brand-700)}.text-blue-200{color:#bfdbfe}.text-blue-300{color:#93c5fd}
.text-green-600{color:var(--green-600)}.text-green-700{color:var(--green-700)}
.text-red-600{color:var(--red-600)}.text-red-700{color:var(--red-700)}
.text-yellow-700{color:var(--amber-700)}.text-amber-500{color:#f59e0b}.text-amber-600{color:var(--amber-600)}.text-amber-700{color:var(--amber-700)}
.text-purple-600{color:var(--purple-600)}

/* ---- Backgrounds ---- */
.bg-white{background:var(--surface)}.bg-gray-50{background:#f8fafc}.bg-gray-100{background:#f1f5f9}
.bg-gray-900{background:var(--ink-900)}
.bg-blue-50{background:var(--brand-50)}.bg-blue-100{background:var(--brand-100)}.bg-blue-600{background:var(--brand-600)}
.bg-green-50{background:var(--green-50)}.bg-green-100{background:#d1fae5}
.bg-red-50{background:var(--red-50)}.bg-red-100{background:#fee2e2}
.bg-yellow-50{background:var(--amber-50)}.bg-yellow-100{background:#fef9c3}
.bg-purple-50{background:var(--purple-50)}.bg-purple-100{background:#f3e8ff}
.bg-amber-50{background:var(--amber-50)}

/* ---- Borders ---- */
.border{border:1px solid var(--line)}.border-t{border-top:1px solid var(--line)}.border-b{border-bottom:1px solid var(--line)}
.border-gray-100{border-color:var(--line-soft)}.border-gray-200{border-color:var(--line)}
.border-gray-300{border-color:var(--ink-300)}.border-green-200{border-color:#a7f3d0}
.border-red-200{border-color:#fecaca}.border-yellow-100{border-color:#fef9c3}
.border-blue-200{border-color:var(--brand-200)}.border-amber-200{border-color:#fde68a}.border-amber-100{border-color:#fef3c7}
.rounded{border-radius:6px}.rounded-lg{border-radius:10px}.rounded-xl{border-radius:12px}
.rounded-2xl{border-radius:16px}.rounded-full{border-radius:9999px}
.shadow-sm{box-shadow:var(--shadow-sm)}.shadow{box-shadow:var(--shadow)}.shadow-xl{box-shadow:var(--shadow-lg)}

/* ---- Display / position ---- */
.hidden{display:none!important}.block{display:block}.inline-block{display:inline-block}.inline-flex{display:inline-flex}
.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}
.w-full{width:100%}.min-h-screen{min-height:100vh}
.relative{position:relative}.sticky{position:sticky}.top-0{top:0}
.opacity-60{opacity:.6}
.space-y-1>*+*{margin-top:4px}.space-y-2>*+*{margin-top:8px}.space-y-3>*+*{margin-top:12px}
.space-y-4>*+*{margin-top:16px}.space-y-5>*+*{margin-top:20px}.space-y-6>*+*{margin-top:24px}

/* ---- Sabit boyutlar ---- */
.w-4{width:16px}.h-4{height:16px}.w-6{width:24px}.h-6{height:24px}.w-8{width:32px}.h-8{height:32px}
.w-10{width:40px}.h-10{height:40px}.w-12{width:48px}.h-12{height:48px}.w-16{width:64px}.h-16{height:64px}
.w-1\.5{width:6px}.h-1\.5{height:6px}
.max-h-96{max-height:384px}

/* ---- Alert ---- */
.alert{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:12px;font-size:14px;line-height:1.5;border:1px solid;margin-bottom:12px}
.alert-success{background:var(--green-50);border-color:#a7f3d0;color:var(--green-700)}
.alert-error  {background:var(--red-50);border-color:#fecaca;color:var(--red-700)}
.alert-info   {background:var(--brand-50);border-color:var(--brand-200);color:var(--brand-800)}
.alert-warning{background:var(--amber-50);border-color:#fde68a;color:var(--amber-700)}

/* ---- Modal ---- */
.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(3px);z-index:70;display:flex;align-items:center;justify-content:center;padding:16px;animation:fadeIn .18s ease}
.modal-box{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);width:100%;max-height:92vh;overflow-y:auto;display:flex;flex-direction:column;animation:popIn .2s cubic-bezier(.34,1.3,.64,1)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line-soft)}
.modal-header h3{font-size:16px;font-weight:700;color:var(--ink-900)}
.modal-close{background:none;border:none;font-size:24px;line-height:1;color:var(--ink-400);cursor:pointer;padding:4px 8px;border-radius:8px}
.modal-close:hover{background:#f1f5f9;color:var(--ink-700)}
.modal-body{padding:22px;flex:1;overflow-y:auto}
.modal-footer{padding:16px 22px;border-top:1px solid var(--line-soft);display:flex;align-items:center;justify-content:flex-end;gap:12px}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes popIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}

/* ---- Table ---- */
.table{width:100%;border-collapse:collapse}
.table th{text-align:left;padding:11px 14px;font-size:11.5px;font-weight:700;color:var(--ink-500);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;border-bottom:1px solid var(--line);background:#fafbfd}
.table td{padding:13px 14px;border-top:1px solid var(--line-soft);font-size:14px;vertical-align:middle;color:var(--ink-700)}
.table tbody tr{transition:background .12s}
.table tbody tr:hover td{background:#f8fafc}

/* Responsive tablo → mobilde kart */
.table-responsive{width:100%}
@media(max-width:720px){
  .table-responsive thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .table-responsive,.table-responsive tbody,.table-responsive tr,.table-responsive td{display:block;width:100%}
  .table-responsive tr{border:1px solid var(--line);border-radius:12px;margin-bottom:12px;padding:6px 4px;background:var(--surface);box-shadow:var(--shadow-sm)}
  .table-responsive td{border:none;border-top:1px solid var(--line-soft);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:right}
  .table-responsive td:first-child{border-top:none}
  .table-responsive td::before{content:attr(data-label);font-size:11.5px;font-weight:700;color:var(--ink-500);text-transform:uppercase;letter-spacing:.04em;text-align:left}
  .table-responsive td:not([data-label]),.table-responsive td[data-label="İşlemler"]::before{content:none;display:none}
  .table-responsive td[data-label="İşlemler"]{justify-content:flex-start;flex-wrap:wrap;border-top:none;padding-top:4px}
}

/* ---- Spinner ---- */
.spinner{display:inline-block;width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--brand-600);border-radius:50%;animation:spin .7s linear infinite}
.spinner-sm{width:18px;height:18px;border-width:2px}
@keyframes spin{to{transform:rotate(360deg)}}
.loading-center{display:flex;justify-content:center;align-items:center;padding:48px}

/* ---- Skeleton ---- */
.skeleton{background:linear-gradient(90deg,#eef1f6 25%,#e2e8f0 37%,#eef1f6 63%);background-size:400% 100%;animation:shimmer 1.4s ease infinite;border-radius:8px}
@keyframes shimmer{0%{background-position:100% 50%}100%{background-position:0 50%}}

/* ---- Toast ---- */
.toast{position:fixed;bottom:24px;right:24px;z-index:9999;padding:13px 20px;border-radius:12px;font-size:14px;font-weight:600;max-width:340px;box-shadow:var(--shadow-lg);transition:opacity .4s,transform .4s;color:#fff;display:flex;align-items:center;gap:8px}
.toast-success{background:linear-gradient(135deg,#059669,#047857)}
.toast-error  {background:linear-gradient(135deg,#dc2626,#b91c1c)}
.toast-info   {background:linear-gradient(135deg,var(--brand-600),var(--brand-700))}
@media(max-width:560px){.toast{left:16px;right:16px;bottom:16px;max-width:none}}

/* ---- Gradient card ---- */
.gradient-blue{background:linear-gradient(135deg,#2563eb 0%,#1e3a8a 100%)}

/* ---- Stat card ---- */
.stat-card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--line);padding:22px;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:12px;transition:transform .15s,box-shadow .15s}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.stat-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.stat-icon-blue{background:var(--brand-50);color:var(--brand-600)}
.stat-icon-green{background:var(--green-50)}
.stat-icon-yellow{background:var(--amber-50)}
.stat-icon-purple{background:var(--purple-50)}
.stat-label{font-size:13px;font-weight:600;color:var(--ink-500)}
.stat-value{font-size:27px;font-weight:800;color:var(--ink-900);margin-top:6px;line-height:1;letter-spacing:-.02em}
.stat-sub{font-size:12px;color:var(--ink-400);margin-top:6px}

/* ---- Quick action ---- */
.quick-action{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 12px;border-radius:12px;border:1px solid var(--line);text-align:center;transition:all .15s;cursor:pointer;background:var(--surface)}
.quick-action:hover{border-color:var(--brand-200);background:var(--brand-50);transform:translateY(-2px)}
.quick-action-icon{font-size:22px}
.quick-action-label{font-size:12.5px;font-weight:600;color:var(--ink-700)}

/* ---- Checkbox ---- */
.checkbox-label{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer;user-select:none}
.checkbox-label input[type=checkbox]{width:16px;height:16px;border-radius:4px;accent-color:var(--brand-600);cursor:pointer}
input[type=checkbox]{accent-color:var(--brand-600)}

/* ---- TLD Picker ---- */
.tld-picker{display:flex;flex-wrap:wrap;gap:8px}
.tld-label{cursor:pointer;user-select:none}
.tld-label input{position:absolute;opacity:0;width:0;height:0}
.tld-chip{display:inline-block;padding:6px 14px;border-radius:9999px;font-size:12.5px;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--ink-600);transition:all .15s;cursor:pointer}
.tld-label input:checked+.tld-chip{background:var(--brand-600);color:#fff;border-color:var(--brand-600);box-shadow:0 4px 12px rgba(37,99,235,.3)}
.tld-chip:hover{border-color:var(--brand-500)}

/* ---- Peer (checkbox chip) ---- */
.peer:checked~.peer-checked\:bg-blue-600{background:var(--brand-600)}
.peer:checked~.peer-checked\:text-white{color:#fff}
.peer:checked~.peer-checked\:border-blue-600{border-color:var(--brand-600)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---- Hover yardımcıları ---- */
.transition-all{transition:all .15s ease}
.transition-colors{transition:color .15s,background-color .15s,border-color .15s}
.cursor-pointer{cursor:pointer}.select-none{user-select:none}
.hover\:bg-blue-50:hover{background:var(--brand-50)}
.hover\:bg-green-50:hover{background:var(--green-50)}
.hover\:bg-red-50:hover{background:var(--red-50)}
.hover\:bg-yellow-50:hover{background:var(--amber-50)}
.hover\:bg-purple-50:hover{background:var(--purple-50)}
.hover\:bg-gray-100:hover{background:#f1f5f9}
.hover\:bg-red-100:hover{background:#fee2e2}
.hover\:bg-blue-100:hover{background:var(--brand-100)}
.hover\:text-blue-600:hover{color:var(--brand-600)}
.hover\:text-green-600:hover{color:var(--green-600)}
.hover\:text-red-600:hover{color:var(--red-600)}
.hover\:text-yellow-600:hover{color:var(--amber-600)}
.hover\:text-purple-600:hover{color:var(--purple-600)}
.hover\:text-gray-600:hover{color:var(--ink-600)}
.hover\:text-gray-700:hover{color:var(--ink-700)}
.hover\:text-blue-700:hover{color:var(--brand-700)}
.hover\:border-blue-200:hover{border-color:var(--brand-200)}
.hover\:border-blue-400:hover{border-color:var(--brand-500)}
.hover\:border-green-300:hover{border-color:#86efac}

/* ---- Max width ---- */
.max-w-xs{max-width:320px}.max-w-sm{max-width:384px}.max-w-md{max-width:448px}
.max-w-lg{max-width:512px}.max-w-xl{max-width:576px}.max-w-2xl{max-width:672px}
.max-w-3xl{max-width:768px}.max-w-4xl{max-width:896px}.max-w-5xl{max-width:1024px}
.max-w-6xl{max-width:1152px}.max-w-7xl{max-width:1280px}

/* ---- Erişilebilirlik ---- */
.btn:focus-visible,.form-input:focus-visible,.sidebar-link:focus-visible,.icon-btn:focus-visible{outline:2px solid var(--brand-500);outline-offset:2px}

pre{white-space:pre-wrap;word-break:break-all}

/* Sayfa içerik animasyonu */
main>*{animation:contentIn .25s ease}
@keyframes contentIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ============================================================
   Kurumsal İkonlar
   ============================================================ */
.icon{width:20px;height:20px;display:inline-block;vertical-align:middle;flex-shrink:0}
.icon-sm{width:16px;height:16px;display:inline-block;vertical-align:middle;flex-shrink:0}
.icon-lg{width:26px;height:26px;display:inline-block;vertical-align:middle;flex-shrink:0}
.btn .icon,.btn .icon-sm{width:16px;height:16px}
.btn-lg .icon{width:18px;height:18px}
.icon-btn .icon{width:17px;height:17px}
.stat-icon .icon{width:24px;height:24px}
.quick-action .icon{width:22px;height:22px;color:var(--brand-600)}
.sidebar-icon{width:19px;height:19px;flex-shrink:0;opacity:.95}
.mobile-toggle .icon{width:20px;height:20px}

/* Logo */
.sidebar-logo{padding:20px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border-bottom:1px solid rgba(255,255,255,.06);min-height:90px}
.sidebar-logo-img{height:62px;width:auto;max-width:220px;object-fit:contain;display:block}
.sidebar-logo-text{color:rgba(255,255,255,.5);font-size:11px;font-weight:600;letter-spacing:.04em;text-align:center}

/* Stat kartı link olduğunda */
a.stat-card,a.stat-chip{text-decoration:none}
a.stat-card{cursor:pointer}
a.stat-card:hover{border-color:var(--brand-200)}
.stat-card .stat-arrow{color:var(--ink-300);transition:transform .15s,color .15s}
a.stat-card:hover .stat-arrow{color:var(--brand-600);transform:translateX(3px)}

/* Inline metin ikonu (rozet/başlık içi) */
.badge .icon,.badge .icon-sm{width:13px;height:13px}
.alert .icon{width:20px;height:20px;flex-shrink:0}
.card-title .icon{width:18px;height:18px;color:var(--brand-600)}

/* ---- SweetAlert2 kurumsal uyum ---- */
.swal-popup{border-radius:var(--radius-lg)!important;font-family:inherit!important;box-shadow:var(--shadow-xl)!important}
.swal2-title{font-size:19px!important;font-weight:700!important;color:var(--ink-900)!important}
.swal2-html-container{font-size:14px!important;color:var(--ink-600)!important}
.swal2-actions{gap:10px!important}
.swal2-icon.swal2-warning{border-color:#fde68a!important;color:#d97706!important}

/* ---- Domain linkleri ---- */
.domain-link{color:var(--brand-700);text-decoration:none;transition:color .15s}
.domain-link:hover{color:var(--brand-600);text-decoration:underline}