/* Durum gosterimi (inc/mz-durum-izle.php). Yalniz .mz-di altinda.
   Telefonda tam ekran, masaustunde kart. Renk: ulke paleti (--mz-birincil). */
.mz-di {--di-vurgu: var(--mz-birincil, var(--mz-brand, #d64545)); --di-vurgu-yazi: #fff; display: flex; justify-content: center; padding: 24px 16px 40px; font-family: inherit;}
.mz-di-kart {position: relative; inline-size: 100%; max-inline-size: 420px;}
.mz-di-ekran {position: relative; block-size: min(78vh, 720px); border-radius: 16px; overflow: hidden; background: #111; color: #fff; user-select: none; -webkit-user-select: none; touch-action: pan-y;}
.mz-di-bulanik {position: absolute; inset: -30px; background-size: cover; background-position: center; filter: blur(26px) brightness(.55); transform: scale(1.1);}
.mz-di-medya {position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;}
.mz-di-medya img, .mz-di-medya video {max-inline-size: 100%; max-block-size: 100%; inline-size: 100%; block-size: 100%; object-fit: contain; display: block;}
.mz-di-medya video {object-fit: cover;}
.mz-di-medya iframe {inline-size: 100%; block-size: 100%; border: 0;}
.mz-di-cubuklar {position: absolute; inset-block-start: 10px; inset-inline: 10px; display: flex; gap: 4px; z-index: 3;}
.mz-di-cubuklar i {flex: 1; block-size: 3px; border-radius: 2px; background: rgba(255,255,255,.35); overflow: hidden;}
.mz-di-cubuklar b {display: block; block-size: 100%; inline-size: 0; background: #fff;}
.mz-di-cubuklar .mz-di-tam b {inline-size: 100%;}
.mz-di-ust {position: absolute; inset-block-start: 20px; inset-inline: 10px; display: flex; align-items: center; gap: 8px; z-index: 3; text-shadow: 0 1px 3px rgba(0,0,0,.5);}
.mz-di-av {inline-size: 32px; block-size: 32px; border-radius: 50%; padding: 2px; background: linear-gradient(135deg,#efc307,#d64545); flex: none;}
.mz-di-av img {inline-size: 100%; block-size: 100%; border-radius: 50%; object-fit: cover; border: 2px solid #fff; display: block; background: #3f475f;}
.mz-di-ad {font-weight: 650; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-inline-size: 0;}
.mz-di-zaman {font-size: 12px; opacity: .8; white-space: nowrap;}
.mz-di-ses {margin-inline-start: auto; inline-size: 34px; block-size: 34px; border-radius: 50%; border: 0; background: rgba(0,0,0,.4); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;}
.mz-di-ses svg {inline-size: 18px; block-size: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;}
.mz-di-ses[aria-pressed="true"] {background: var(--di-vurgu);}
.mz-di-ses[hidden] + .mz-di-kapat {margin-inline-start: auto;}
.mz-di-kapat {inline-size: 34px; block-size: 34px; display: flex; align-items: center; justify-content: center; font-size: 26px; line-height: 1; color: #fff !important; text-decoration: none !important;}
.mz-di-ok {position: absolute; inset-block-start: 50%; transform: translateY(-50%); inline-size: 38px; block-size: 38px; border-radius: 50%; border: 0; background: rgba(255,255,255,.22); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; z-index: 3; display: flex; align-items: center; justify-content: center;}
.mz-di-onceki {inset-inline-start: 8px;}
.mz-di-sonraki {inset-inline-end: 8px;}
[dir="rtl"] .mz-di-ok {transform: translateY(-50%) scaleX(-1);}
.mz-di-ok[disabled] {opacity: .25; cursor: default;}
.mz-di-yan {position: absolute; inset-inline-end: 10px; inset-block-end: 170px; display: flex; flex-direction: column; gap: 14px; z-index: 3;}
.mz-di-d {display: flex; flex-direction: column; align-items: center; gap: 3px; border: 0; background: none; color: #fff; padding: 0; font-size: 11px; font-weight: 650; cursor: pointer; text-shadow: 0 1px 3px rgba(0,0,0,.6); min-inline-size: 44px;}
.mz-di-i {inline-size: 44px; block-size: 44px; border-radius: 50%; background: rgba(0,0,0,.38); display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px);}
.mz-di-i svg {inline-size: 22px; block-size: 22px; fill: none; stroke: #fff; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round;}
.mz-di-on .mz-di-i {background: var(--di-vurgu);}
.mz-di-on .mz-di-i svg {fill: #fff;}
.mz-di-d:focus-visible .mz-di-i, .mz-di-ok:focus-visible, .mz-di-ses:focus-visible {outline: 3px solid #fff; outline-offset: 2px;}
.mz-di-alt {position: absolute; inset-inline: 0; inset-block-end: 0; padding: 48px 12px 14px; background: linear-gradient(transparent, rgba(0,0,0,.72)); z-index: 2;}
.mz-di-ilan {display: flex; justify-content: space-between; gap: 8px; align-items: center; background: rgba(255,255,255,.14); border-radius: 10px; padding: 8px 10px; margin-block-end: 8px; color: #fff !important; text-decoration: none !important; font-size: 13px;}
.mz-di-ilan-bas {font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-inline-size: 0;}
.mz-di-ilan-fiyat {white-space: nowrap; font-weight: 700;}
.mz-di-metin {margin: 0 0 10px; font-size: 14px; line-height: 1.45; white-space: pre-line; padding-inline-end: 56px;}
.mz-di-git {display: block; text-align: center; padding: 12px; border-radius: 10px; font-weight: 700; background: var(--di-vurgu); color: var(--di-vurgu-yazi) !important; text-decoration: none !important;}
.mz-di-durdu .mz-di-medya::after {content: "❚❚"; position: absolute; font-size: 34px; color: rgba(255,255,255,.85); text-shadow: 0 2px 8px rgba(0,0,0,.5);}
.mz-di-hazir {position: absolute; inset-block-end: 50%; inset-inline: 0; text-align: center; font-size: 13px; z-index: 2;}
/* Levhalar: mesaj ve paylas */
.mz-di-levha, .mz-di-paylas-levha {position: fixed; inset: 0; z-index: 100003; background: rgba(15,23,42,.5); display: flex; align-items: flex-end; justify-content: center;}
.mz-di-levha[hidden], .mz-di-paylas-levha[hidden] {display: none;}
.mz-di-levha-ic {background: #fff; color: #1f2933; inline-size: 100%; max-inline-size: 460px; border-radius: 16px 16px 0 0; padding: 14px 16px calc(16px + env(safe-area-inset-bottom));}
.mz-di-levha-bas {display: flex; justify-content: space-between; align-items: center; font-weight: 700; margin-block-end: 10px;}
.mz-di-levha-kapat {border: 0; background: none; font-size: 24px; line-height: 1; cursor: pointer; color: #52606d;}
.mz-di-mesaj {inline-size: 100%; border: 1px solid #dfe5ec; border-radius: 10px; padding: 10px; font: inherit; resize: vertical;}
.mz-di-levha-not {min-block-size: 18px; font-size: 13px; color: #52606d; margin: 6px 0;}
.mz-di-gonder, .mz-di-kopyala, .mz-di-wa {display: block; inline-size: 100%; text-align: center; border: 0; border-radius: 10px; padding: 12px; font-weight: 700; cursor: pointer; text-decoration: none !important;}
.mz-di-gonder, .mz-di-kopyala {background: var(--di-vurgu); color: #fff;}
.mz-di-wa {background: #25d366; color: #fff !important; margin-block-start: 8px;}
@media (min-width: 768px) {
	.mz-di-levha, .mz-di-paylas-levha {align-items: center;}
	.mz-di-levha-ic {border-radius: 16px;}
}
/* Telefon: tam ekran */
@media (max-width: 767px) {
	.mz-di {position: fixed; inset: 0; z-index: 100002; padding: 0; background: #000;}
	.mz-di-kart {max-inline-size: none; block-size: 100%;}
	.mz-di-ekran {block-size: 100%; border-radius: 0;}
	.mz-di-ok {display: none;}
	.mz-di-cubuklar {inset-block-start: calc(8px + env(safe-area-inset-top));}
	.mz-di-ust {inset-block-start: calc(18px + env(safe-area-inset-top));}
	.mz-di-alt {padding-block-end: calc(14px + env(safe-area-inset-bottom));}
	html.mz-di-acik, html.mz-di-acik body {overflow: hidden;}
}
@media (prefers-reduced-motion: reduce) {.mz-di * {transition: none !important;}}
/* hidden her zaman gizler (display kurallari ezmesin). */
.mz-di [hidden] {display: none !important;}
/* Masaustu: oklar kartin DISINDA (yan dugmelerin altinda kalmasin). */
@media (min-width: 768px) {
	.mz-di-ekran {overflow: visible;}
	.mz-di-ekran > .mz-di-bulanik, .mz-di-ekran > .mz-di-medya {border-radius: 16px; overflow: hidden;}
	.mz-di-bulanik {inset: 0; transform: none; filter: blur(26px) brightness(.55);}
	.mz-di-onceki {inset-inline-start: -56px;}
	.mz-di-sonraki {inset-inline-end: -56px;}
	.mz-di-ok {background: #fff; color: #1f2933; box-shadow: 0 4px 14px rgba(15,23,42,.18);}
	.mz-di-alt {border-radius: 0 0 16px 16px;}
}