/*
 * Passly panelleri (müşteri, bayi, yönetim) — açık kurumsal tema katmanı.
 *
 * Panel sayfaları koyu temaya göre Tailwind sınıflarıyla yazılmıştı. Bu dosya uygulama.css'ten SONRA
 * yüklenir ve body.panel-acik altında koyu yüzey/metin/çizgi sınıflarını açık karşılıklarına çevirir;
 * düğmeler gibi doygun renkli öğelerdeki beyaz yazı korunur. Ortak menü (.pu-*), yönetim yan menüsü
 * (.ys-*), üst çubuk (.yt-*) ve kart teması seçici (.tema-secici) bileşenleri de buradadır.
 */
:root {
  --p-zemin: #f3f5f9;
  --p-yuzey: #ffffff;
  --p-yuzey-2: #f6f8fb;
  --p-yuzey-3: #eef2f7;
  --p-metin: #0f172a;
  --p-metin-2: #334155;
  --p-soluk: #5b6576;
  --p-soluk-2: #6b7686;
  --p-cizgi: #e3e8ef;
  --p-cizgi-koyu: #d0d7e2;
  --p-vurgu: #1e5eff;
  --p-vurgu-koyu: #1a4fe0;
  --p-vurgu-yumusak: #eaf0ff;
  --p-golge: 0 1px 2px rgba(15, 23, 42, .04), 0 10px 30px -18px rgba(15, 23, 42, .18);
  --p-yazi: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* ---- Ortak müşteri / bayi menüsü ------------------------------------------------------------- */
.pu-ust {
  position: fixed;
  z-index: 45; /* sayfaların açılır pencereleri (z-50 ve üstü) menünün üstünde kalsın */
  top: 0;
  left: 0;
  right: 0;
  height: 64px;
  font-family: var(--p-yazi);
  background: rgba(255, 255, 255, .94);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--p-cizgi);
}
.pu-ic { display: flex; align-items: center; gap: 18px; max-width: 1280px; height: 100%; margin: 0 auto; padding: 0 24px; }
.pu-logo, .ys-logo { display: flex; flex: none; align-items: center; gap: 10px; font-size: 18px; font-weight: 800; letter-spacing: -.01em; color: var(--p-metin) !important; text-decoration: none; }
.pu-logo img, .ys-logo img { border-radius: 8px; }
.pu-logo em, .ys-logo em {
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 10.5px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--p-vurgu);
  background: var(--p-vurgu-yumusak);
}
.pu-menu { display: flex; flex: 1; align-items: center; gap: 4px; min-width: 0; }
.pu-oge {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  color: #4b5668 !important;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s, color .15s;
}
.pu-oge svg { width: 18px; height: 18px; flex: none; color: #7a8599; }
.pu-oge:hover { color: var(--p-metin) !important; background: #f3f6fb; }
.pu-oge.aktif { color: var(--p-vurgu-koyu) !important; background: var(--p-vurgu-yumusak); }
.pu-oge.aktif svg { color: var(--p-vurgu); }
.pu-sayi, .ys-sayi {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 20px;
  text-align: center;
  color: #fff;
  background: #ef4444;
}
.pu-nokta { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #ef4444; }
.pu-sag { display: flex; flex: none; align-items: center; gap: 10px; }
.pu-uyari, .yt-uyari {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 700;
  color: #b42318 !important;
  background: #fef3f2;
  border: 1px solid #fecdca;
  text-decoration: none;
  white-space: nowrap;
}
.pu-uyari svg, .yt-uyari svg { width: 16px; height: 16px; flex: none; }
.pu-kullanici {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 210px;
  height: 40px;
  padding: 0 12px 0 4px;
  border-radius: 999px;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--p-metin) !important;
  border: 1px solid var(--p-cizgi);
  text-decoration: none;
}
.pu-kullanici:hover { border-color: var(--p-cizgi-koyu); background: #f8fafc; }
.pu-avatar, .yt-avatar {
  position: relative;
  display: grid;
  flex: none;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, #1e5eff, #4f46e5);
}
.pu-ad { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pu-cikis {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  color: #b42318 !important;
  background: #fff;
  border: 1px solid #fecdca;
}
.pu-cikis:hover { background: #fef3f2; }
.pu-cikis svg { width: 18px; height: 18px; }
.pu-alt { display: none; }
.pu-ust ~ main { padding-top: 96px !important; }
@media (max-width: 899px) {
  .pu-menu, .pu-ad, .pu-uyari span { display: none; }
  .pu-ic { justify-content: space-between; gap: 10px; padding: 0 14px; }
  .pu-kullanici { padding: 0; border: 0; }
  .pu-uyari { width: 34px; padding: 0; justify-content: center; }
  .pu-alt {
    position: fixed;
    z-index: 45;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: space-around;
    padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
    font-family: var(--p-yazi);
    background: rgba(255, 255, 255, .96);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--p-cizgi);
  }
  .pu-alt-oge {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 6px 2px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 700;
    color: #6b7686 !important;
    text-decoration: none;
  }
  .pu-alt-oge svg { width: 22px; height: 22px; }
  .pu-alt-oge.aktif { color: var(--p-vurgu) !important; }
  .pu-alt-oge .pu-sayi { position: absolute; top: 0; left: calc(50% + 4px); }
  .pu-alt-oge .pu-nokta { position: absolute; top: 5px; left: calc(50% + 8px); }
  .pu-ust ~ main { padding-top: 84px !important; padding-bottom: 104px !important; }
}

/* ---- Yönetim: yan menü ----------------------------------------------------------------------- */
.ys {
  position: sticky;
  z-index: 60;
  top: 0;
  display: flex;
  flex: none;
  flex-direction: column;
  width: 264px;
  height: 100vh;
  font-family: var(--p-yazi);
  background: #fff;
  border-right: 1px solid var(--p-cizgi);
}
.ys-ust { display: flex; flex: none; align-items: center; justify-content: space-between; height: 64px; padding: 0 18px; border-bottom: 1px solid var(--p-cizgi); }
.ys-kapat { display: none; }
.ys-govde { flex: 1; padding: 10px 12px 16px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #d0d7e2 transparent; }
.ys-grup + .ys-grup { margin-top: 12px; }
.ys-grup-baslik { margin: 0; padding: 6px 10px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #8a94a6; }
.ys-oge {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  color: #3b4658 !important;
  text-decoration: none;
  transition: background .15s, color .15s;
}
.ys-oge svg { width: 19px; height: 19px; flex: none; color: #7a8599; }
.ys-oge span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ys-oge:hover { color: var(--p-metin) !important; background: #f3f6fb; }
.ys-oge.aktif { color: var(--p-vurgu-koyu) !important; background: var(--p-vurgu-yumusak); }
.ys-oge.aktif svg { color: var(--p-vurgu); }
.ys-alt { flex: none; padding: 10px 12px 14px; border-top: 1px solid var(--p-cizgi); }
.ys-perde[hidden] { display: none; }
@media (max-width: 767px) {
  .ys {
    position: fixed;
    z-index: 120;
    left: 0;
    top: 0;
    bottom: 0;
    height: auto;
    transform: translateX(-102%);
    transition: transform .28s cubic-bezier(.2, .8, .2, 1);
    box-shadow: 0 0 40px rgba(15, 23, 42, .25);
  }
  .ys.acik { transform: none; }
  .ys-kapat { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 10px; color: var(--p-metin); background: #f3f6fb; cursor: pointer; }
  .ys-kapat svg { width: 20px; height: 20px; }
  .ys-perde { position: fixed; z-index: 110; inset: 0; background: rgba(15, 23, 42, .45); }
  html.ys-kilit, html.ys-kilit body { overflow: hidden; }
}

/* ---- Yönetim: üst çubuk ------------------------------------------------------------------------- */
.yt {
  position: sticky;
  z-index: 50;
  top: 0;
  display: flex;
  flex: none;
  align-items: center;
  gap: 14px;
  height: 64px;
  padding: 0 28px;
  font-family: var(--p-yazi);
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--p-cizgi);
}
.yt-menu { display: none; }
.yt-baslik { flex: 1; min-width: 0; margin: 0; font-size: 19px; font-weight: 800; letter-spacing: -.01em; color: var(--p-metin) !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yt-sag { display: flex; align-items: center; gap: 10px; }
.yt-site {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 14px;
  border-radius: 10px;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--p-metin-2) !important;
  background: #fff;
  border: 1px solid var(--p-cizgi-koyu);
  text-decoration: none;
  white-space: nowrap;
}
.yt-site svg { width: 16px; height: 16px; }
.yt-site:hover { color: var(--p-vurgu) !important; border-color: var(--p-vurgu); }
.yt-hesap { position: relative; }
.yt-hesap > summary { list-style: none; cursor: pointer; }
.yt-hesap > summary::-webkit-details-marker { display: none; }
.yt-avatar { width: 38px; height: 38px; border-radius: 12px; }
.yt-avatar i { position: absolute; right: -3px; bottom: -3px; width: 12px; height: 12px; border: 2px solid #fff; border-radius: 50%; }
.yt-avatar i.kirmizi { background: #ef4444; }
.yt-avatar i.yesil { background: #22c55e; }
.yt-hesap-menu {
  position: absolute;
  z-index: 80;
  right: 0;
  top: calc(100% + 8px);
  width: 250px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--p-cizgi);
  border-radius: 14px;
  box-shadow: 0 20px 44px -16px rgba(15, 23, 42, .3);
}
.yt-hesap-ad { display: flex; flex-direction: column; margin: 0 0 4px; padding: 8px 10px 10px; border-bottom: 1px solid var(--p-cizgi); }
.yt-hesap-ad strong { font-size: 14px; color: var(--p-metin); }
.yt-hesap-ad small { font-size: 12px; color: var(--p-soluk); }
.yt-hesap-menu a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 9px; font-size: 13.5px; font-weight: 600; color: var(--p-metin-2) !important; text-decoration: none; }
.yt-hesap-menu a svg { width: 17px; height: 17px; flex: none; color: #7a8599; }
.yt-hesap-menu a:hover { background: #f3f6fb; }
.yt-hesap-menu a.yt-cikis, .yt-hesap-menu a.yt-cikis svg { color: #b42318 !important; }
@media (max-width: 767px) {
  .yt { gap: 10px; padding: 0 14px; }
  .yt-menu { display: grid; flex: none; place-items: center; width: 40px; height: 40px; border-radius: 10px; color: var(--p-metin); background: #fff; border: 1px solid var(--p-cizgi-koyu); cursor: pointer; }
  .yt-menu svg { width: 22px; height: 22px; }
  .yt-baslik { font-size: 17px; }
  .yt-site span, .yt-uyari span { display: none; }
  .yt-site, .yt-uyari { width: 38px; padding: 0; justify-content: center; }
}

/* ---- Kart teması seçici (edit_card.php) ------------------------------------------------------- */
.tema-secici { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 640px) { .tema-secici { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tema-secenek {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  border-radius: 14px;
  background: #fff;
  border: 1.5px solid var(--p-cizgi-koyu);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.tema-secenek:hover { border-color: #aab4c3; }
.tema-secenek input { position: absolute; opacity: 0; pointer-events: none; }
.tema-secenek:has(input:checked) { border-color: var(--p-vurgu); box-shadow: 0 0 0 3px var(--p-vurgu-yumusak); }
.tema-secenek:has(input:focus-visible) { outline: 2px solid var(--p-vurgu); outline-offset: 2px; }
.tema-secenek:has(input:checked)::after {
  content: "";
  position: absolute;
  top: 16px;
  right: 16px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--p-vurgu) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 13px no-repeat;
  box-shadow: 0 0 0 2px #fff;
}
.tema-onizleme { position: relative; display: block; height: 84px; overflow: hidden; border-radius: 10px; background: var(--tz); box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .08); }
.tema-onizleme i { position: absolute; left: 0; right: 0; top: 0; height: 34px; background: var(--tv); background: linear-gradient(135deg, color-mix(in srgb, var(--tv) 30%, #0b1220), var(--tv)); }
.tema-onizleme b { position: absolute; left: 12px; right: 12px; top: 24px; bottom: 0; border-radius: 9px 9px 0 0; background: var(--ty); }
.tema-onizleme b::before { content: ""; position: absolute; left: 50%; top: -9px; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%; background: #cbd2dc; box-shadow: 0 0 0 3px var(--ty); }
.tema-onizleme em { position: absolute; left: 26px; right: 26px; bottom: 12px; height: 11px; border-radius: 5px; background: var(--tv); }
.tema-adi strong { display: block; font-size: 13.5px; font-weight: 800; color: var(--p-metin) !important; }
.tema-adi small { display: block; margin-top: 1px; font-size: 12px; color: var(--p-soluk) !important; }

/* =================================================================================================
 * Açık tema katmanı: koyu sınıflar → açık karşılıkları (yalnız body.panel-acik altında)
 * ================================================================================================= */
body.panel-acik {
  font-family: var(--p-yazi) !important;
  color: var(--p-metin-2);
  background: var(--p-zemin) !important;
  background-image: none !important;
}
.panel-acik ::selection { background: rgba(30, 94, 255, .18); color: inherit; }
/* Rengi belirtilmemiş başlıklar gövdeden açık gri miras almasın (özgüllük sıfır: text-* sınıfı geçerli kalır) */
:where(.panel-acik) :where(h1, h2, h3, h4) { color: var(--p-metin); }

/* Süs bulanıklıkları (renkli lekeler) */
.panel-acik .blob-bg,
.panel-acik .animate-blob,
.panel-acik .mix-blend-screen,
.panel-acik :is(.absolute, .fixed):is(.blur-3xl, .blur-2xl, .blur-xl, .blur-\[120px\], .blur-\[100px\]) { display: none !important; }

/* Cam kartlar ve koyu yüzeyler → beyaz kart */
.panel-acik :is(.glass-card, .glass, .glass-profile, .glass-panel) {
  background: var(--p-yuzey) !important;
  border: 1px solid var(--p-cizgi) !important;
  box-shadow: var(--p-golge) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.panel-acik :is(.glass-nav, .glass-mobile-nav) {
  background: rgba(255, 255, 255, .94) !important;
  border-color: var(--p-cizgi) !important;
}
.panel-acik :is(.bg-slate-900, .bg-slate-800, .bg-gray-900, .bg-gray-800, .bg-gray-950, .bg-slate-950, .bg-\[\#121824\], .bg-\[\#1e293b\], .bg-\[\#121212\], .bg-\[\#0f172a\], .bg-\[\#334155\], .bg-\[\#121826\]\/95, .bg-\[\#334155\]\/95, .bg-slate-800\/50, .bg-\[\#152243\]\/60, .bg-\[\#241738\]\/60, .bg-\[\#0e2722\]\/60, .bg-\[\#281b15\]\/60) {
  background-color: var(--p-yuzey) !important;
}
/* İç içe yarı saydam koyu yüzeyler → ince gri */
.panel-acik :is(.bg-black\/40, .bg-slate-900\/60, .bg-slate-900\/40, .bg-slate-900\/50, .bg-slate-950\/40, .bg-slate-950\/60, .bg-slate-950\/50, .bg-slate-950\/30, .bg-slate-950\/20, .bg-slate-950\/15, .bg-slate-950\/10, .bg-slate-800\/30, .bg-gray-900\/20, .bg-black\/10, .bg-black\/20, .bg-black\/30, .bg-white\/5, .bg-white\/10, .bg-white\/\[0\.02\], .bg-white\/\[0\.04\], .bg-\[\#121824\]\/50, .bg-\[\#334155\]\/50, .bg-\[\#334155\]\/80) {
  background-color: var(--p-yuzey-2) !important;
}
/* Tam ekran karartma katmanları koyu kalır, yumuşar */
.panel-acik :is(.fixed, .absolute).inset-0:is(.bg-\[\#334155\]\/80, .bg-slate-950\/80, .bg-slate-900\/60, .bg-black\/60, .bg-black\/70, .bg-black\/75, .bg-black\/80) {
  background-color: rgba(15, 23, 42, .45) !important;
}
.panel-acik .from-slate-800\/40 { background-image: none !important; background-color: var(--p-yuzey) !important; }
.panel-acik .bg-black\/40.rounded-3xl { background-color: var(--p-yuzey) !important; }
/* Koyu gri harf avatarları (yönetim: son siparişler) */
.panel-acik .from-gray-700.to-gray-800 { background-image: none !important; background-color: var(--p-vurgu-yumusak) !important; color: var(--p-vurgu-koyu) !important; border-color: #c9d8ff !important; }

/* Çizgiler */
.panel-acik :is(.border-white\/5, .border-white\/10, .border-white\/20, .border-gray-800, .border-gray-700, .border-gray-600, .border-slate-700, .border-slate-800, .border-\[\#1e293b\], .border-\[\#334155\]) { border-color: var(--p-cizgi) !important; }
.panel-acik .border-\[\#0f172a\] { border-color: #fff !important; }
.panel-acik :is(.divide-white\/5, .divide-white\/10, .divide-gray-800, .divide-gray-700) > :not([hidden]) ~ :not([hidden]) { border-color: var(--p-cizgi) !important; }
.panel-acik :is(.hover\:border-white\/20, .hover\:border-blue-500\/30):hover { border-color: var(--p-cizgi-koyu) !important; }

/* Metin */
.panel-acik :is(.text-white, .text-gray-100, .text-slate-100, .text-gray-200, .text-slate-200, .text-indigo-100) { color: var(--p-metin) !important; }
.panel-acik :is(.text-gray-300, .text-slate-300, .text-blue-200) { color: var(--p-metin-2) !important; }
.panel-acik :is(.text-gray-400, .text-slate-400) { color: var(--p-soluk) !important; }
.panel-acik :is(.text-gray-500, .text-slate-500) { color: var(--p-soluk-2) !important; }
.panel-acik .text-gray-600 { color: #7a8599 !important; }
.panel-acik :is(.text-blue-300, .text-blue-400, .text-\[\#60a5fa\]) { color: #1d4ed8 !important; }
.panel-acik .text-blue-500 { color: #2563eb !important; }
.panel-acik :is(.text-indigo-300, .text-indigo-400) { color: #4338ca !important; }
.panel-acik :is(.text-purple-300, .text-purple-400, .text-violet-400, .text-\[\#c084fc\]) { color: #6d28d9 !important; }
.panel-acik :is(.text-emerald-400, .text-emerald-400\/80, .text-\[\#34d399\]) { color: #047857 !important; }
.panel-acik .text-green-400 { color: #15803d !important; }
.panel-acik :is(.text-red-300, .text-red-400) { color: #b91c1c !important; }
.panel-acik :is(.text-amber-300, .text-amber-400, .text-amber-400\/80, .text-yellow-400, .text-\[\#fbbf24\]) { color: #b45309 !important; }
.panel-acik .text-amber-500 { color: #b45309 !important; }
.panel-acik .text-orange-400 { color: #c2410c !important; }
.panel-acik .text-teal-400 { color: #0f766e !important; }
.panel-acik .text-\[\#25D366\] { color: #128c4b !important; }
.panel-acik :is(.text-blue-50, .text-blue-100) { color: #1e3a8a !important; }
/* Destek yazışma balonları: gri olan (rgba beyaz) açık zeminde kayboluyordu */
.panel-acik :is(.msg-user, .msg-admin).text-gray-200 { background: var(--p-yuzey-3) !important; border-color: var(--p-cizgi) !important; }
.panel-acik :is(.msg-user, .msg-admin).text-blue-50 { background: #eaf0ff !important; border-color: #c9d8ff !important; }
.panel-acik .hover\:text-white:hover { color: var(--p-metin) !important; }
.panel-acik .group:hover .group-hover\:text-white { color: var(--p-metin) !important; }
.panel-acik :is(.hover\:text-blue-300, .hover\:text-blue-400, .hover\:text-blue-500):hover,
.panel-acik .group:hover :is(.group-hover\:text-blue-400) { color: #1d4ed8 !important; }
.panel-acik :is(.hover\:text-red-300, .hover\:text-red-400, .hover\:text-red-500):hover { color: #991b1b !important; }
.panel-acik :is(.hover\:text-indigo-300, .hover\:text-purple-300):hover { color: #4338ca !important; }
.panel-acik :is(.hover\:text-green-400, .hover\:text-gray-300):hover { color: var(--p-metin-2) !important; }
.panel-acik .group:hover :is(.group-hover\:text-emerald-400) { color: #047857 !important; }
.panel-acik .group:hover :is(.group-hover\:text-amber-400) { color: #b45309 !important; }

/* Doygun renkli zeminlerde (düğme, rozet, karartma) beyaz yazı korunur */
.panel-acik :is(.bg-blue-500, .bg-blue-600, .bg-blue-700, .bg-blue-600\/90, .bg-indigo-500, .bg-indigo-600, .bg-indigo-700, .bg-purple-500, .bg-purple-600, .bg-violet-600, .bg-red-400, .bg-red-500, .bg-red-600, .bg-red-700, .bg-green-500, .bg-green-600, .bg-emerald-500, .bg-emerald-600, .bg-teal-500, .bg-amber-500, .bg-amber-600, .bg-orange-500, .bg-orange-600, .bg-gray-500, .bg-gray-600\/90, .bg-\[\#0088cc\], .bg-black, .from-blue-400, .from-blue-500, .from-blue-600, .from-indigo-600, .from-purple-400, .from-purple-600, .from-emerald-400, .from-emerald-500, .from-emerald-600, .from-amber-400, .from-amber-500, .from-amber-600, .from-red-500, .from-green-500, .from-green-600, .from-orange-500, .from-teal-500):is(.text-white, .text-gray-100, .text-gray-200, .text-blue-100, .text-blue-200, .text-indigo-100),
.panel-acik :is(.bg-blue-500, .bg-blue-600, .bg-blue-700, .bg-blue-600\/90, .bg-indigo-500, .bg-indigo-600, .bg-indigo-700, .bg-purple-500, .bg-purple-600, .bg-violet-600, .bg-red-400, .bg-red-500, .bg-red-600, .bg-red-700, .bg-green-500, .bg-green-600, .bg-emerald-500, .bg-emerald-600, .bg-teal-500, .bg-amber-500, .bg-amber-600, .bg-orange-500, .bg-orange-600, .bg-gray-500, .bg-gray-600\/90, .bg-\[\#0088cc\], .bg-black, .from-blue-400, .from-blue-500, .from-blue-600, .from-indigo-600, .from-purple-400, .from-purple-600, .from-emerald-400, .from-emerald-500, .from-emerald-600, .from-amber-400, .from-amber-500, .from-amber-600, .from-red-500, .from-green-500, .from-green-600, .from-orange-500, .from-teal-500) :is(.text-white, .text-gray-100, .text-gray-200, .text-blue-100, .text-blue-200, .text-indigo-100) { color: #fff !important; }
.panel-acik :is(.hover\:bg-red-500, .hover\:bg-red-600, .hover\:bg-red-700, .hover\:bg-blue-500, .hover\:bg-blue-600, .hover\:bg-blue-700, .hover\:bg-indigo-500, .hover\:bg-indigo-600, .hover\:bg-emerald-500, .hover\:bg-green-500, .hover\:bg-purple-600, .hover\:bg-orange-500).hover\:text-white:hover { color: #fff !important; }

/* Doygun zeminde rengi belirtilmemiş yazı (eskiden koyu gövdeden beyaz miras alıyordu). Özgüllük sıfır:
   öğede açıkça bir text-* sınıfı varsa o geçerli kalır. */
:where(.panel-acik) :where(.bg-blue-500, .bg-blue-600, .bg-blue-700, .bg-indigo-500, .bg-indigo-600, .bg-indigo-700, .bg-purple-500, .bg-purple-600, .bg-violet-600, .bg-red-500, .bg-red-600, .bg-red-700, .bg-green-500, .bg-green-600, .bg-emerald-500, .bg-emerald-600, .bg-teal-500, .bg-amber-500, .bg-amber-600, .bg-orange-500, .bg-orange-600, .bg-gray-500, .bg-\[\#0088cc\], [class*="bg-gradient-to-"]:is(.from-blue-500, .from-blue-600, .from-indigo-500, .from-indigo-600, .from-purple-500, .from-purple-600, .from-emerald-500, .from-emerald-600, .from-amber-500, .from-amber-600, .from-red-500, .from-orange-500, .from-green-500, .from-green-600, .from-teal-500)) { color: #fff; }

/* Geçişli başlık yazıları → düz renk (açık zeminde soluk kalıyordu) */
.panel-acik .bg-clip-text.text-transparent { background-image: none !important; color: var(--p-vurgu) !important; -webkit-text-fill-color: var(--p-vurgu); }
.panel-acik :is(h1, h2, h3).bg-clip-text.text-transparent { color: var(--p-metin) !important; -webkit-text-fill-color: var(--p-metin); }

/* Üzerine gelince koyu dolgular → açık gri */
.panel-acik :is(.hover\:bg-white\/5, .hover\:bg-white\/10, .hover\:bg-white\/20, .hover\:bg-slate-700, .hover\:bg-gray-700, .hover\:bg-\[\#152243\], .hover\:bg-\[\#241738\], .hover\:bg-\[\#0e2722\], .hover\:bg-\[\#281b15\]):hover { background-color: var(--p-yuzey-3) !important; }
.panel-acik :is(.focus\:bg-slate-900\/60, .focus\:bg-white\/10):focus { background-color: #fff !important; }

/* Gölgeler: koyu temadaki ağır gölgeler açık zeminde kirli duruyor */
.panel-acik :is(.shadow-2xl, .shadow-xl) { box-shadow: 0 18px 44px -24px rgba(15, 23, 42, .28) !important; }
.panel-acik .shadow-lg:not([class*="shadow-blue"]):not([class*="shadow-indigo"]):not([class*="shadow-emerald"]):not([class*="shadow-red"]):not([class*="shadow-amber"]):not([class*="shadow-purple"]):not([class*="shadow-green"]) { box-shadow: 0 8px 22px -14px rgba(15, 23, 42, .25) !important; }
.panel-acik :is(.hover\:shadow-black\/50, .shadow-black\/50):hover { box-shadow: 0 16px 34px -20px rgba(15, 23, 42, .3) !important; }

/* Form alanları */
.panel-acik :is(input, select, textarea):not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="submit"], [type="button"], [type="image"], [type="hidden"]) {
  color: var(--p-metin) !important;
  background-color: #fff !important;
  border-color: var(--p-cizgi-koyu) !important;
}
.panel-acik :is(input, textarea)::placeholder { color: #9aa4b2 !important; opacity: 1; }
.panel-acik :is(input, select, textarea):not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"]):focus {
  border-color: var(--p-vurgu) !important;
  box-shadow: 0 0 0 3px rgba(30, 94, 255, .14) !important;
  outline: none !important;
}
.panel-acik :is(input, select, textarea):disabled, .panel-acik :is(input, textarea)[readonly] { background-color: var(--p-yuzey-2) !important; color: var(--p-soluk) !important; }
.panel-acik option, .panel-acik option.bg-\[\#334155\] { color: var(--p-metin) !important; background-color: #fff !important; }
.panel-acik input[type="file"] { color: var(--p-soluk) !important; }
.panel-acik :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--p-vurgu); }

/* Tablolar */
.panel-acik thead :is(th, td) { color: var(--p-soluk) !important; }
.panel-acik tbody tr:hover { background-color: #fafbfd; }

/* Kaydırma çubukları */
.panel-acik .custom-scrollbar::-webkit-scrollbar-thumb { background-color: #d0d7e2 !important; }
.panel-acik ::-webkit-scrollbar { width: 10px; height: 10px; }
.panel-acik ::-webkit-scrollbar-thumb { background: #cfd6e1; border: 2px solid var(--p-zemin); border-radius: 10px; }
.panel-acik ::-webkit-scrollbar-track { background: transparent; }

/* Ortak menünün altındaki içerik: eski menüdeki "Karta Geri Dön" bağlantısı ve menüsüz sayfa gövdesi */
.pu-geri { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 18px; font-size: 14px; font-weight: 700; color: var(--p-soluk) !important; text-decoration: none; }
.pu-geri:hover { color: var(--p-vurgu) !important; }
.pu-geri svg { width: 18px; height: 18px; }
.pu-ust ~ .pu-icerik { padding-top: 104px !important; }
@media (max-width: 899px) { .pu-ust ~ .pu-icerik { padding-top: 88px !important; padding-bottom: 104px !important; } }

/* Eşaralıklı yazı tipi (fiyat, kod): sistem fontlarında ₺ simgesi yok, kutu çıkıyordu */
.panel-acik .font-mono { font-family: var(--p-yazi) !important; font-variant-numeric: tabular-nums; letter-spacing: .01em; }

/* Kart düzenleyici: yapışkan sekme çubuğu telefonda 4 satıra yayılıp ekranın yarısını kaplıyordu → tek satır, yatay kaydırma */
@media (max-width: 767px) {
  .panel-acik #tab-nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; }
  .panel-acik #tab-nav::-webkit-scrollbar { display: none; }
  .panel-acik #tab-nav .tab-btn { padding: 10px 14px; }
}
.panel-acik .bg-gray-900\/20.sticky { background-color: rgba(243, 245, 249, .92) !important; }

/* Dar ekran: tablolar sütunları ezmek yerine yatay kaysın; üst çubuklar taşmasın */
@media (max-width: 767px) {
  .panel-acik .overflow-x-auto > table:not([class*="min-w-"]) { min-width: 680px; }
  .panel-acik .overflow-x-auto > table :is(td, th) { white-space: nowrap; }
}
@media (max-width: 479px) {
  .pu-logo em { display: none; }
  .pu-ic { gap: 8px; padding: 0 12px; }
  .pu-sag { gap: 8px; }
  .yt-site { display: none; }
  .yt { gap: 8px; }
}

/* =================================================================================================
 * Sayfalara gömülü özel stiller ve durum sınıfları (17.10.2026 kontrast denetimi: passly/testler/kontrast-denetim.py)
 * Koyu temaya göre yazılmışlardı: üzerine gelince yazı #f3f4f6 olup açık zeminde kayboluyordu.
 * ================================================================================================= */
/* Kart düzenleyici sekmeleri */
.panel-acik .tab-btn { color: var(--p-soluk) !important; background-color: var(--p-yuzey) !important; border-color: var(--p-cizgi) !important; }
.panel-acik .tab-btn:hover:not(.active) { color: var(--p-metin) !important; background-color: var(--p-yuzey-3) !important; border-color: var(--p-cizgi-koyu) !important; }
.panel-acik .tab-btn.active { color: #fff !important; background-color: var(--p-vurgu) !important; border-color: var(--p-vurgu) !important; }
/* Çok dilli alan düğmeleri (TR / EN / RU / DE / FR) */
.panel-acik .lang-btn { color: var(--p-soluk) !important; }
.panel-acik .lang-btn:hover:not(.active-lang) { color: var(--p-metin) !important; background-color: var(--p-yuzey-3) !important; }
.panel-acik .lang-btn.active-lang { color: var(--p-vurgu-koyu) !important; background-color: var(--p-vurgu-yumusak) !important; border-color: #c9d8ff !important; box-shadow: none !important; }
/* Profil sekmeleri, kayıt formu bölüm başlıkları */
.panel-acik .tab-active { color: #3730a3 !important; background: var(--p-vurgu-yumusak) !important; border-color: #c9d8ff !important; }
.panel-acik .section-divider span { color: #4338ca !important; }
.panel-acik .section-divider .line { background: var(--p-cizgi) !important; }
.panel-acik .card-row:hover { background: #fafbfd !important; }
.panel-acik :is(.custom-scrollbar, .form-scroll)::-webkit-scrollbar-thumb { background: #cfd6e1 !important; }
.panel-acik .otp-box.filled { background: var(--p-vurgu-yumusak) !important; border-color: var(--p-vurgu) !important; }
/* Görsel üstündeki koyu yarı saydam rozetler (ürün fiyatı vb.) → beyaz rozet */
.panel-acik :is(.bg-slate-950\/80, .bg-slate-950\/70):not(.inset-0) { background-color: rgba(255, 255, 255, .94) !important; }
/* Kayıt: seçili "Bireysel / Kurumsal" seçeneği (açık katman zemini !important ile ezdiği için seçim görünmüyordu) */
.panel-acik .peer:checked ~ .peer-checked\:bg-indigo-600 { color: #fff !important; background-color: #4f46e5 !important; border-color: #4f46e5 !important; }
/* Üzerine gelince açık renge dönen yazılar */
.panel-acik :is(.hover\:text-gray-200, .hover\:text-slate-200):hover { color: var(--p-metin) !important; }
.panel-acik .hover\:text-yellow-400:hover { color: #a16207 !important; }
.panel-acik .hover\:text-orange-400:hover { color: #c2410c !important; }
.panel-acik .hover\:border-white\/10:hover { border-color: var(--p-cizgi-koyu) !important; }
.panel-acik .text-red-500 { color: #dc2626 !important; }
/* Açık zeminde beyaz yazıya yetmeyen hover tonları bir ton koyulaşır */
.panel-acik .hover\:bg-emerald-500:hover { background-color: #059669 !important; }
.panel-acik .hover\:bg-orange-500:hover { background-color: #ea580c !important; }
/* Taban zemini açık katmanca ezilen öğelerde renkli hover tonu yine görünsün */
.panel-acik .hover\:bg-blue-500\/20:hover { background-color: rgba(59, 130, 246, .14) !important; }
.panel-acik .hover\:bg-red-500\/20:hover { background-color: rgba(239, 68, 68, .12) !important; }
.panel-acik .hover\:bg-orange-500\/20:hover { background-color: rgba(249, 115, 22, .14) !important; }
.panel-acik .hover\:bg-yellow-500\/20:hover { background-color: rgba(234, 179, 8, .16) !important; }
.panel-acik .focus\:ring-offset-gray-900:focus { --tw-ring-offset-color: #fff !important; }
/* Kart tasarım (sipariş) sayfası açık tasarımlı; tek soluk başlık */
.pu-icerik .text-gray-400 { color: #6b7280; }