/* Sizin Kareniz — Etkinlik sahibi paneli (demo) */
.ep-ust { position: sticky; top: 0; z-index: 30; background: rgba(251,248,243,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--cizgi); }
.ep-ust .kap { display: flex; align-items: center; gap: var(--b2); height: 68px; }
.ep-rozet { font-size: .875rem; font-weight: 700; letter-spacing: .06em; background: var(--murekkep); color: var(--fildisi); padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
.ep-kucuk-btn { margin-left: auto; min-height: 44px; padding: 0 var(--b3); font-size: 1rem; }
.ep-bilgi { background: #FFF6E5; border-bottom: 1px solid #F0DDB8; color: #5E4617; font-size: var(--y-kucuk); }
.ep-bilgi .kap { display: flex; gap: var(--b1); align-items: flex-start; padding-block: 10px; }
.ep-bilgi svg { width: 20px; height: 20px; flex: none; margin-top: 3px; }

.ep { padding-block: var(--b5) var(--b7); }
.ep-bas { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--b3); }
.ep-bas h1 { font-size: clamp(2.75rem, 2rem + 3vw, 4.25rem); }
.ep-durum { display: flex; align-items: center; gap: var(--b1); margin-top: var(--b1); font-weight: 600; color: var(--murekkep-2); }
.ep-durum .nokta { width: 10px; height: 10px; border-radius: 50%; background: var(--basari); box-shadow: 0 0 0 4px rgba(47,107,79,.15); }
.ep-durum.kapali .nokta { background: #A1261B; box-shadow: 0 0 0 4px rgba(161,38,27,.15); }
.ep-eylemler { display: flex; flex-wrap: wrap; gap: var(--b1); }
.ep-eylemler .btn { min-height: 52px; padding: 0 var(--b3); }

.ep-sayilar { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--b2); margin: var(--b5) 0; }
@media (min-width: 720px) { .ep-sayilar { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .ep-sayilar { grid-template-columns: repeat(6, 1fr); } }
.ep-sayilar div { background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--r2); padding: var(--b2) var(--b3); }
.ep-sayilar dt { color: var(--soluk); font-size: .9375rem; font-weight: 600; }
.ep-sayilar dd { margin: 4px 0 0; font-family: var(--serif); font-size: 1.875rem; font-weight: 600; line-height: 1.15; font-variant-numeric: lining-nums; }
.ep-sayilar div:last-child dd { font-family: var(--sans); font-size: 1.0625rem; font-weight: 700; padding-top: 8px; }

.ep-sekmeler { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--cizgi); margin-bottom: var(--b4); scrollbar-width: none; }
.ep-sekmeler::-webkit-scrollbar { display: none; }
.ep-sekmeler button { flex: none; min-height: 52px; padding: 0 var(--b3); background: none; border: 0; border-bottom: 3px solid transparent; font: 600 1.0625rem var(--sans); color: var(--soluk); cursor: pointer; white-space: nowrap; }
.ep-sekmeler button[aria-selected=true] { color: var(--murekkep); border-bottom-color: var(--altin); }
.ep-sekmeler button:hover { color: var(--murekkep); }

.ep-filtre { display: grid; grid-template-columns: 1fr 1fr; gap: var(--b1); margin-bottom: var(--b2); }
@media (min-width: 900px) { .ep-filtre { grid-template-columns: repeat(4, minmax(0, 220px)); } }
.ep-filtre select, .ep-gorev-ekle input, .ep-ayar-satir input { min-height: 50px; border: 1.5px solid var(--cizgi); border-radius: 14px; background: var(--kagit); padding: 0 14px; font: 500 1rem var(--sans); color: var(--murekkep); width: 100%; }
.ep-filtre select:focus, .ep-gorev-ekle input:focus, .ep-ayar-satir input:focus { outline: none; border-color: var(--murekkep); }
.ep-ozet { color: var(--soluk); margin-bottom: var(--b2); }

/* Galeri: sütunlu (masonry) düzen */
.ep-galeri { columns: 2 150px; column-gap: 12px; }
@media (min-width: 720px) { .ep-galeri { columns: 3 200px; column-gap: 16px; } }
@media (min-width: 1100px) { .ep-galeri { columns: 4 220px; } }
.ep-oge { position: relative; break-inside: avoid; margin: 0 0 12px; border-radius: 14px; overflow: hidden; background: var(--krem); }
@media (min-width: 720px) { .ep-oge { margin-bottom: 16px; } }
.ep-oge > button { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.ep-oge img { display: block; width: 100%; height: auto; transition: transform 500ms cubic-bezier(.2,.7,.2,1), filter var(--gecis); }
.ep-oge:hover img { transform: scale(1.03); }
.ep-oge .ep-meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 28px 12px 10px; background: linear-gradient(to top, rgba(20,16,13,.78), rgba(20,16,13,0)); color: #fff; font-size: .875rem; line-height: 1.35; pointer-events: none; }
.ep-oge .ep-meta b { display: block; font-size: .9375rem; }
.ep-oge .ep-sec { position: absolute; top: 8px; left: 8px; z-index: 2; width: 44px; height: 44px; display: grid; place-items: center; cursor: pointer; }
.ep-oge .ep-sec input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ep-oge .ep-sec span { width: 26px; height: 26px; border-radius: 50%; border: 2px solid #fff; background: rgba(20,16,13,.3); display: grid; place-items: center; transition: background var(--gecis); }
.ep-oge .ep-sec svg { width: 16px; height: 16px; color: #fff; opacity: 0; }
.ep-oge .ep-sec input:checked + span { background: var(--altin); border-color: var(--altin); }
.ep-oge .ep-sec input:checked + span svg { opacity: 1; }
.ep-oge .ep-sec input:focus-visible + span { outline: 3px solid #fff; outline-offset: 2px; }
.ep-oge.secili { outline: 3px solid var(--altin); outline-offset: -3px; }
.ep-oge.gizli-oge img { filter: grayscale(.8) brightness(.55); }
.ep-oge .ep-gizli-rozet { position: absolute; top: 14px; right: 10px; display: inline-flex; align-items: center; gap: 6px; background: rgba(20,16,13,.78); color: #fff; font-size: .8125rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.ep-oge .ep-gizli-rozet svg { width: 16px; height: 16px; }
.ep-video-rozet { position: absolute; top: 14px; right: 10px; display: inline-flex; align-items: center; gap: 4px; background: rgba(20,16,13,.72); color: #fff; font-size: .8125rem; font-weight: 700; padding: 4px 10px 4px 8px; border-radius: 999px; }
.ep-video-rozet svg { width: 14px; height: 14px; }
.ep-oge .ep-gorev-mini { position: absolute; left: 60px; top: 16px; background: rgba(251,248,243,.92); color: var(--altin-yazi); font-size: .75rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; max-width: calc(100% - 140px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ep-not-kucuk { color: var(--soluk); font-size: var(--y-kucuk); text-align: center; margin-top: var(--b3); }

/* Seçim çubuğu */
.ep-secim { position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom)); transform: translateX(-50%); z-index: 40; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--b1) var(--b3); width: min(calc(100% - 32px), 720px); padding: 10px 10px 10px 20px; border-radius: 18px; background: var(--murekkep); color: var(--fildisi); box-shadow: 0 16px 40px rgba(0,0,0,.3); font-weight: 700; }
.ep-secim > div { display: flex; gap: 6px; align-items: center; }
.ep-secim .btn { min-height: 44px; padding: 0 var(--b2); font-size: 1rem; }
.ep-secim .btn-ikincil { color: var(--fildisi); border-color: rgba(243,236,226,.35); }
.ep-secim .btn-ikincil:hover { background: rgba(243,236,226,.08); }
.ep-secim-kapat { width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 12px; background: none; color: var(--fildisi); cursor: pointer; }
.ep-secim-kapat svg { width: 20px; height: 20px; }

/* Misafirler */
.ep-misafirler { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--b1); }
@media (min-width: 900px) { .ep-misafirler { grid-template-columns: 1fr 1fr; gap: var(--b2); } }
.ep-misafirler li { display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: var(--b2); background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--r2); padding: 12px 12px 12px 16px; }
.ep-bas-harf { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; font: 600 1.375rem var(--serif); background: var(--krem); color: var(--altin-yazi); overflow: hidden; }
.ep-bas-harf img { width: 100%; height: 100%; object-fit: cover; }
.ep-misafirler b { display: block; font-size: 1.0625rem; }
.ep-misafirler small { color: var(--soluk); font-size: .9375rem; }
.ep-misafirler .btn { min-height: 44px; padding: 0 var(--b2); font-size: .9375rem; }

/* Kutular */
.ep-kutu { background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--r3); padding: var(--b4); }
@media (max-width: 599px) { .ep-kutu { padding: var(--b3); } }
.ep-kutu h2 { font-size: 2rem; }
.ep-aciklama { color: var(--soluk); margin: var(--b1) 0 var(--b3); max-width: 60ch; }

/* Görevler */
.ep-gorevler { list-style: none; margin: 0 0 var(--b3); padding: 0; display: grid; gap: var(--b1); }
.ep-gorevler li { display: grid; grid-template-columns: 64px 1fr auto; gap: var(--b2); align-items: center; padding: 10px; border: 1px solid var(--cizgi); border-radius: 16px; background: var(--fildisi); }
.ep-gorev-kucuk { width: 64px; height: 64px; border-radius: 12px; overflow: hidden; background: var(--krem); display: grid; place-items: center; color: var(--altin-yazi); }
.ep-gorev-kucuk img { width: 100%; height: 100%; object-fit: cover; }
.ep-gorev-kucuk svg { width: 26px; height: 26px; }
.ep-gorevler b { display: block; }
.ep-gorevler small { color: var(--soluk); }
.ep-gorevler .ep-gorev-eylem { display: flex; gap: 4px; }
.ep-ikon-btn { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; border: 1px solid var(--cizgi); background: var(--kagit); color: var(--murekkep-2); cursor: pointer; }
.ep-ikon-btn:hover { border-color: var(--murekkep); }
.ep-ikon-btn svg { width: 20px; height: 20px; }
.ep-gorev-ekle { display: grid; grid-template-columns: 1fr auto; gap: var(--b1); }
@media (max-width: 599px) { .ep-gorev-ekle { grid-template-columns: 1fr; } }
.ep-gorev-ekle .btn { min-height: 50px; border-radius: 14px; }
.ep-gorev-etiket { display: inline-flex; align-items: center; gap: 6px; background: var(--krem); color: var(--altin-yazi); font-weight: 700; font-size: .9375rem; padding: 6px 12px; border-radius: 999px; }

/* Notlar */
.ep-notlar { columns: 1; column-gap: var(--b2); }
@media (min-width: 720px) { .ep-notlar { columns: 2; } }
@media (min-width: 1100px) { .ep-notlar { columns: 3; } }
.ep-notlar figure { break-inside: avoid; margin: 0 0 var(--b2); background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--r2); padding: var(--b3); }
.ep-notlar blockquote { margin: 0; font-family: var(--serif); font-style: italic; font-size: 1.375rem; line-height: 1.4; }
.ep-notlar figcaption { margin-top: var(--b2); color: var(--soluk); font-size: .9375rem; }
.ep-notlar figcaption b { color: var(--murekkep); }

/* Ayarlar */
.ep-ayarlar { display: grid; gap: 0; padding-block: var(--b1); }
.ep-anahtar, .ep-ayar-satir { display: flex; align-items: center; justify-content: space-between; gap: var(--b3); padding: var(--b3) 0; border-bottom: 1px solid var(--cizgi); cursor: pointer; }
.ep-ayar-satir { cursor: default; flex-wrap: wrap; }
.ep-ayarlar > :last-child { border-bottom: 0; }
.ep-anahtar b, .ep-ayar-satir b { display: block; font-size: 1.0625rem; }
.ep-anahtar small, .ep-ayar-satir small { display: block; color: var(--soluk); font-size: .9375rem; margin-top: 2px; max-width: 56ch; }
.ep-ayar-satir input { width: auto; }
.ep-anahtar input { appearance: none; -webkit-appearance: none; flex: none; width: 56px; height: 32px; border-radius: 32px; background: var(--cizgi); position: relative; cursor: pointer; transition: background var(--gecis); margin: 0; }
.ep-anahtar input::after { content: ""; position: absolute; top: 4px; left: 4px; width: 24px; height: 24px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform var(--gecis); }
.ep-anahtar input:checked { background: var(--basari); }
.ep-anahtar input:checked::after { transform: translateX(24px); }
.ep-anahtar input:focus-visible { outline: 3px solid var(--altin-yazi); outline-offset: 3px; }

/* Büyük görünüm */
.ep-isik { width: min(100vw, 1280px); max-width: 100vw; height: min(100dvh, 900px); max-height: 100dvh; padding: 0; border: 0; border-radius: 20px; background: #14110F; color: #F3ECE2; overflow: hidden; }
@media (max-width: 719px) { .ep-isik { border-radius: 0; height: 100dvh; } }
.ep-isik::backdrop { background: rgba(10,8,7,.82); }
.ep-isik-ic { position: relative; display: grid; grid-template-rows: 1fr auto; height: 100%; }
@media (min-width: 900px) { .ep-isik-ic { grid-template-columns: 1fr 320px; grid-template-rows: 1fr; } }
.ep-isik-gorsel { position: relative; display: grid; place-items: center; min-height: 0; padding: 56px 12px 12px; }
.ep-isik-gorsel img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 8px; }
.ep-isik-bilgi { padding: var(--b3); border-top: 1px solid rgba(243,236,226,.1); display: flex; flex-direction: column; gap: var(--b1); }
@media (min-width: 900px) { .ep-isik-bilgi { border-top: 0; border-left: 1px solid rgba(243,236,226,.1); padding: 72px var(--b4) var(--b4); } }
.ep-isik-bilgi h2 { font-size: 2rem; }
.ep-isik-bilgi p { color: #BDB2A4; }
.ep-isik-bilgi .ep-gorev-etiket { background: rgba(217,188,140,.14); color: #D9BC8C; align-self: flex-start; }
.ep-isik-eylem { display: flex; flex-wrap: wrap; gap: var(--b1); margin-top: auto; padding-top: var(--b2); }
.ep-isik-eylem .btn { min-height: 48px; padding: 0 var(--b3); }
.ep-isik-eylem .btn-ana { background: #F3ECE2; color: #14110F; }
.ep-isik-eylem .btn-ikincil { color: #F3ECE2; border-color: rgba(243,236,226,.3); }
.ep-isik-dugme { position: absolute; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 0; background: rgba(243,236,226,.12); color: #fff; cursor: pointer; z-index: 2; }
.ep-isik-dugme:hover { background: rgba(243,236,226,.24); }
.ep-isik-dugme svg { width: 24px; height: 24px; }
.ep-isik-dugme.kapat { top: 12px; right: 12px; }
.ep-isik-dugme.onceki { left: 12px; top: 50%; }
.ep-isik-dugme.sonraki { right: 12px; top: 50%; }
@media (min-width: 900px) { .ep-isik-dugme.sonraki { right: 332px; } }
@media (max-width: 899px) { .ep-isik-dugme.onceki, .ep-isik-dugme.sonraki { top: 40%; } }

/* Slayt gösterisi */
.ep-slayt { position: fixed; inset: 0; z-index: 100; background: #000; cursor: none; }
.ep-slayt-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; transition: opacity 1200ms ease, transform 7000ms linear; transform: scale(1.02); }
.ep-slayt-img.gorunur { opacity: 1; transform: scale(1.07); }
.ep-slayt-alt { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: flex-end; justify-content: space-between; gap: var(--b3); padding: var(--b6) var(--b5) var(--b4); background: linear-gradient(to top, rgba(0,0,0,.7), rgba(0,0,0,0)); color: #fff; }
.ep-slayt-cift strong { display: block; font: 600 clamp(2rem, 1.4rem + 2.4vw, 3.5rem)/1.05 var(--serif); }
.ep-slayt-cift span { display: block; margin-top: 6px; color: rgba(255,255,255,.8); font-size: 1.125rem; }
.ep-slayt-qr { display: flex; align-items: center; gap: var(--b2); background: rgba(255,255,255,.95); color: var(--murekkep); padding: 12px 18px 12px 12px; border-radius: 18px; font-weight: 700; line-height: 1.3; }
.ep-slayt-qr img { width: 96px; height: 96px; }
@media (max-width: 719px) { .ep-slayt-qr { display: none; } .ep-slayt-alt { padding: var(--b4) var(--b3) var(--b3); } }
.ep-slayt-kapat { position: absolute; top: 16px; right: 16px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.35); color: #fff; font: 600 1rem var(--sans); cursor: pointer; opacity: .4; transition: opacity var(--gecis); }
.ep-slayt:hover .ep-slayt-kapat, .ep-slayt-kapat:focus-visible { opacity: 1; }
.ep-slayt-kapat kbd { font: inherit; font-size: .8125rem; border: 1px solid rgba(255,255,255,.4); border-radius: 6px; padding: 1px 6px; margin-left: 6px; }
@media (prefers-reduced-motion: reduce) { .ep-slayt-img { transition: opacity 300ms; transform: none !important; } }

.ep-sayilar dd small { font-family: var(--sans); font-size: .875rem; font-weight: 600; color: var(--soluk); }
.ep-cubuk { display: block; height: 6px; margin-top: 10px; border-radius: 6px; background: var(--krem); overflow: hidden; }
.ep-cubuk i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--altin), var(--altin-acik)); }
.ep-kupon strong { color: var(--altin-yazi); }
