.blKap { position: fixed; z-index: 3900; display: flex; flex-direction: column; gap: var(--dB2); width: min(368px, calc(100vw / var(--kOlcekV, 1) - var(--dB8))); max-height: calc(100dvh / var(--kOlcekV, 1) - var(--dB8)); margin: 0; padding: 0; pointer-events: none; font-family: var(--dFont); }
.blKap[data-konum^="top"] { top: calc(var(--dB4) + env(safe-area-inset-top, 0px)); }
.blKap[data-konum^="bottom"] { bottom: calc(var(--dB4) + env(safe-area-inset-bottom, 0px)); }
.blKap[data-konum$="right"] { right: var(--dB4); }
.blKap[data-konum$="left"] { left: var(--dB4); }
.blKap[data-konum$="center"] { left: 50%; transform: translateX(-50%); }
.blKap[data-konum$="full-width"] { left: var(--dB4); right: var(--dB4); width: auto; }

.bl {
  --blRenk: var(--dBilgi); --blMetin: var(--dBilgiMetin); --blSoft: var(--dBilgiSoft);
  position: relative; display: flex; align-items: flex-start; gap: var(--dB3); width: 100%; box-sizing: border-box; min-height: 52px; padding: var(--dB3) var(--dB3) var(--dB3) var(--dB3);
  color: var(--dMetin); background: linear-gradient(100deg, color-mix(in srgb, var(--blRenk) 7%, transparent), transparent 46%), var(--dYukselti);
  border: 1px solid color-mix(in srgb, var(--blRenk) 20%, var(--dCizgi)); border-radius: var(--dR2); box-shadow: var(--dG3);
  font-size: var(--dF2); line-height: 1.4; text-align: left; overflow: hidden; pointer-events: auto; touch-action: none; -webkit-tap-highlight-color: transparent;
  transition: border-color var(--dSure) var(--dEase), box-shadow var(--dSure) var(--dEase); }
.blBasari { --blRenk: var(--dBasari); --blMetin: var(--dBasariMetin); --blSoft: var(--dBasariSoft); }
.blHata { --blRenk: var(--dTehlike); --blMetin: var(--dTehlikeMetin); --blSoft: var(--dTehlikeSoft); }
.blUyari { --blRenk: var(--dUyari); --blMetin: var(--dUyariMetin); --blSoft: var(--dUyariSoft); }
.blBilgi { --blRenk: var(--dBilgi); --blMetin: var(--dBilgiMetin); --blSoft: var(--dBilgiSoft); }
.bl:hover { box-shadow: var(--dG4); border-color: color-mix(in srgb, var(--blRenk) 32%, var(--dCizgi)); }
.blTik { cursor: pointer; }
.blSurukle { transition: none; user-select: none; }
html[data-tema="dark"] .bl { box-shadow: var(--dG3), inset 0 1px 0 color-mix(in srgb, var(--dMetin) 6%, transparent); }
html[data-tema="dark"] .bl:hover { box-shadow: var(--dG4), inset 0 1px 0 color-mix(in srgb, var(--dMetin) 6%, transparent); }

.blIkon { position: relative; flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: var(--dR1); background: var(--blSoft); color: var(--blRenk);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blRenk) 18%, transparent); font-size: var(--dIkon2); }
.blIkon > i { line-height: 1; }
.blSayac { position: absolute; top: -6px; right: -7px; min-width: 16px; height: 16px; padding: 0 4px; box-sizing: border-box; border-radius: var(--dRTam); background: var(--blRenk); color: var(--dUzerinde);
  font: 700 10px/16px var(--dFont); text-align: center; font-variant-numeric: tabular-nums; box-shadow: 0 0 0 2px var(--dYukselti); }

.blGovde { flex: 1 1 auto; min-width: 0; padding-top: 4px; }
.blBaslik { font-size: var(--dGovde); font-weight: 600; line-height: 20px; letter-spacing: -.005em; color: var(--dMetin); overflow-wrap: anywhere; }
.blMesaj { font-size: var(--dF2); line-height: 18px; color: var(--dMetin2); overflow-wrap: anywhere; white-space: pre-line; }
.blBaslik + .blMesaj { margin-top: 1px; }
.blGovde > .blMesaj:first-child { font-size: var(--dGovde); line-height: 20px; font-weight: 500; color: var(--dMetin); }
.blEylem { appearance: none; display: inline-flex; align-items: center; gap: 6px; min-height: 0; margin: 6px 0 0; padding: 0; border: 0; background: none; box-shadow: none; color: var(--blMetin);
  font: 600 12.5px/18px var(--dFont); cursor: pointer; border-radius: var(--dR0); }
.blEylem > i { font-size: 11px; transition: transform var(--dSure) var(--dYay); }
.blEylem:hover { text-decoration: underline; text-underline-offset: 3px; }
.blEylem:hover > i { transform: translateX(3px); }
.blEylem:focus-visible { outline: none; box-shadow: var(--dHalka); }

.blKapat { appearance: none; position: relative; flex: none; display: grid; place-items: center; width: 26px; height: 26px; min-height: 0; margin: 1px -3px 0 0; padding: 0; border: 0; border-radius: var(--dR0);
  background: transparent; box-shadow: none; color: var(--dSoluk2); font-size: 12px; cursor: pointer;
  transition: background-color var(--dSureH) var(--dEase), color var(--dSureH) var(--dEase), transform var(--dSure) var(--dYay); }
.blKapat::before { content: ""; position: absolute; inset: -6px; }
.blKapat:hover { background: var(--dYuzey3); color: var(--dMetin); }
.blKapat:active { transform: scale(.88); }
.blKapat:focus-visible { outline: none; color: var(--dMetin); box-shadow: var(--dHalka); }

.blIlerleme { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--blRenk); opacity: .72; transform-origin: left center; pointer-events: none;
  animation: blIlerle var(--blSure, 4000ms) linear forwards; transition: opacity var(--dSure) var(--dEase); }
.blDuraklat .blIlerleme { animation-play-state: paused; opacity: .32; }
@keyframes blIlerle { from { transform: scaleX(var(--blBas, 1)); } to { transform: scaleX(0); } }

.blSr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

@media (max-width: 768px) {
  .blKap[data-konum] { left: 50%; right: auto; width: min(480px, calc(100vw / var(--kOlcekV, 1) - var(--dB4))); transform: translateX(-50%); gap: 6px; }
  .blKap[data-konum^="top"] { top: calc(var(--dB2) + env(safe-area-inset-top, 0px)); }
  .blKap[data-konum^="bottom"] { bottom: calc(var(--dAltNavYuk) + var(--dB3) + env(safe-area-inset-bottom, 0px)); }
  .bl { min-height: 56px; padding: var(--dB3); box-shadow: var(--dG4); }
  .blKapat { width: 32px; height: 32px; margin: -2px -4px 0 0; font-size: 13px; }
  .blKapat::before { inset: -6px; }
  .blEylem { min-height: 32px; margin-top: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  html:not([data-hareket="tam"]) .blIlerleme { display: none; }
  html:not([data-hareket="tam"]) .bl, html:not([data-hareket="tam"]) .blKapat, html:not([data-hareket="tam"]) .blEylem > i { transition: none; }
}
html[data-hareket="az"] .blIlerleme { display: none; }
html[data-hareket="az"] .bl, html[data-hareket="az"] .blKapat, html[data-hareket="az"] .blEylem > i { transition: none; }

@media print { .blKap { display: none !important; } }

/* powered by lov3yp */
