/* Bey Bilişim Panel — marka renkleri sitedekiyle aynı (logo: turuncu #f18700, mavi #0055a4, antrasit #212222) */
:root {
  --turuncu: #f18700;
  --turuncu-koyu: #c96f00;
  --mavi: #0055a4;
  --antrasit: #212222;
  --zemin: #f4f6f9;
  --kart: #fff;
  --cizgi: #dde2ea;
  --yazi: #1d2330;
  --soluk: #5f6b7d;
  --kirmizi: #c62828;
  --yesil: #2e7d32;
  --sari-zemin: #fff6e0;
  --kirmizi-zemin: #fdecec;
  --yesil-zemin: #e9f6ea;
  --mavi-zemin: #e8f0fa;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--yazi);
  background: var(--zemin);
}
a { color: var(--mavi); }
h1 { font-size: 1.5rem; margin: 0 0 .75rem; }
h2 { font-size: 1.15rem; margin: 1.5rem 0 .5rem; }
code { background: var(--zemin); padding: .1em .35em; border-radius: 4px; }

/* Üst çubuk */
.ust {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem;
  padding: .6rem 1rem; background: var(--antrasit); color: #fff;
}
.marka { color: #fff; text-decoration: none; font-weight: 700; display: flex; align-items: center; gap: .5rem; }
.marka small { font-weight: 400; opacity: .7; }
.marka-b {
  display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 6px;
  background: var(--turuncu); color: #fff; font-weight: 800;
}
.menu { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .9rem; }
.menu a { color: #fff; text-decoration: none; opacity: .9; }
.menu a:hover { opacity: 1; text-decoration: underline; }
.satir-ici { display: inline; margin: 0; }
.bag { background: none; border: 0; color: #fff; font: inherit; cursor: pointer; padding: 0; opacity: .9; text-decoration: underline; }

.icerik { max-width: 1100px; margin: 0 auto; padding: 1.25rem 1rem 3rem; }

/* Kartlar */
.kart {
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: 10px; padding: 1.25rem; margin-bottom: 1rem;
}
.kart.dar { max-width: 460px; margin-left: auto; margin-right: auto; }
.kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; }
.kart.bolum { text-decoration: none; color: inherit; border-top: 4px solid var(--turuncu); transition: box-shadow .15s; }
.kart.bolum:hover { box-shadow: 0 4px 16px rgba(0, 0, 0, .08); }
.kart.bolum h2 { margin-top: 0; color: var(--mavi); }
.kart.bolum p { margin: 0; color: var(--soluk); }

/* Formlar */
label { display: block; margin-bottom: .85rem; font-weight: 600; font-size: .95rem; }
input, select {
  display: block; width: 100%; margin-top: .3rem; padding: .6rem .7rem; font: inherit; font-weight: 400;
  border: 1px solid var(--cizgi); border-radius: 6px; background: #fff; color: var(--yazi);
}
input:focus, select:focus { outline: 2px solid var(--mavi); outline-offset: -1px; border-color: var(--mavi); }
.satir-ici select { display: inline-block; width: auto; margin: 0 .25rem 0 0; padding: .3rem .4rem; }

.dugme {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  padding: .6rem 1rem; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
  border: 1px solid var(--cizgi); border-radius: 6px; background: #fff; color: var(--yazi);
}
.dugme:hover { border-color: var(--mavi); color: var(--mavi); }
.dugme.ana { background: var(--turuncu); border-color: var(--turuncu); color: #fff; }
.dugme.ana:hover { background: var(--turuncu-koyu); border-color: var(--turuncu-koyu); color: #fff; }
.dugme.kucuk { padding: .3rem .6rem; font-size: .85rem; font-weight: 500; }
.dugme:disabled, .dugme.pasif { opacity: .5; cursor: wait; pointer-events: none; }
form > .dugme.ana { width: 100%; margin-top: .25rem; }

.bildirim { padding: .7rem 1rem; border-radius: 6px; margin-bottom: 1rem; border: 1px solid; white-space: pre-line; }
.bildirim p { margin: .2rem 0; }
.bildirim.tamam { background: var(--yesil-zemin); border-color: #b9dfbb; }
.bildirim.hata { background: var(--kirmizi-zemin); border-color: #f2b8b8; color: #8e1c1c; }
.bildirim.uyari { background: var(--sari-zemin); border-color: #f3d79b; }

.kucuk { font-size: .875rem; color: var(--soluk); }
.qr { display: block; margin: 1rem auto; background: #fff; padding: 8px; border: 1px solid var(--cizgi); border-radius: 8px; }
.anahtar { font-size: 1rem; letter-spacing: .05em; user-select: all; }

/* Tablolar */
.tablo-kap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1rem; }
.tablo { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--cizgi); border-radius: 8px; }
.tablo th, .tablo td { padding: .55rem .7rem; text-align: left; border-bottom: 1px solid var(--cizgi); vertical-align: middle; }
.tablo th { font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--soluk); background: #fafbfc; }
.tablo tr.pasif td { color: var(--soluk); }
.islemler { white-space: nowrap; }
.islemler form { margin-right: .25rem; }

.etiket {
  display: inline-block; padding: .1rem .5rem; border-radius: 99px; font-size: .78rem; font-weight: 600;
  background: #eceff3; color: var(--soluk); white-space: nowrap;
}
.etiket.tamam { background: var(--yesil-zemin); color: var(--yesil); }
.etiket.elle { background: var(--mavi-zemin); color: var(--mavi); }
.etiket.uyari { background: var(--sari-zemin); color: #8a5a00; }

/* Hal editörü */
.baslik-satir { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.baslik-satir h1 { margin: 0; }
.arac-cubugu {
  position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: .5rem;
  padding: .6rem 0; margin-bottom: .5rem; background: var(--zemin);
}
.ozet { font-weight: 600; }
.ozet.uyari { color: #8a5a00; }
.grup { background: #fff; border: 1px solid var(--cizgi); border-radius: 10px; padding: .75rem; margin-bottom: 1rem; }
.grup-bas { display: flex; gap: .5rem; align-items: center; margin-bottom: .5rem; }
.grup-bas input { margin: 0; font-weight: 600; }
.grup-bas .dugme { flex: none; }
.fiyat-duzen { border: 0; }
.fiyat-duzen td { padding: .3rem .35rem; }
.fiyat-duzen th { padding: .35rem; }
.fiyat-duzen input { margin: 0; padding: .45rem .5rem; }
.fiyat-duzen input.fiyat { width: 6.5rem; text-align: right; }
.fiyat-duzen td.isaretler { min-width: 7rem; }
.fiyat-duzen tr.supheli { background: var(--sari-zemin); }
.sil {
  width: 2rem; height: 2rem; border: 1px solid var(--cizgi); border-radius: 6px; background: #fff;
  color: var(--kirmizi); font-size: 1.2rem; line-height: 1; cursor: pointer;
}
.isaret {
  display: inline-block; margin: .1rem .2rem .1rem 0; padding: .05rem .4rem; border-radius: 4px;
  font-size: .75rem; font-weight: 700; white-space: nowrap;
}
.isaret.yeni { background: var(--mavi-zemin); color: var(--mavi); }
.isaret.fark { background: #ffe2c2; color: #8a4500; }
.isaret.eksik { background: #eceff3; color: var(--soluk); }
.isaret.hata { background: var(--kirmizi-zemin); color: var(--kirmizi); }
.isaret.bos { background: none; color: var(--soluk); font-weight: 400; }
.aciklama { margin-top: 1.5rem; color: var(--soluk); font-size: .9rem; }
.aciklama summary { cursor: pointer; font-weight: 600; }
.aciklama li { margin: .3rem 0; }

@media (max-width: 640px) {
  .icerik { padding: 1rem .75rem 3rem; }
  .arac-cubugu .dugme { flex: 1 1 auto; }
  /* Telefonda her ürün iki satır: üstte ad, altta en düşük / en yüksek / sil, en altta işaretler */
  .fiyat-duzen thead { display: none; }
  .fiyat-duzen tr { display: grid; grid-template-columns: 1fr 1fr auto; gap: .35rem; padding: .5rem .25rem; border-bottom: 1px solid var(--cizgi); }
  .fiyat-duzen td { border: 0; padding: 0; }
  .fiyat-duzen td:first-child { grid-column: 1 / -1; }
  .fiyat-duzen td.isaretler { grid-column: 1 / -1; order: 5; min-width: 0; }
  .fiyat-duzen td.isaretler:empty { display: none; }
  .fiyat-duzen input.fiyat { width: 100%; }
}