/* #region Müşteri hesabı sayfa yerleşimi */

.vitrin-hesap-sayfasi {
    position: relative;
    isolation: isolate;
    display: grid;
    min-height: calc(100svh - 7rem);
    padding: clamp(3rem, 8vw, 7rem) var(--vitrin-kapsayici-boslugu);
    overflow: hidden;
    place-items: center;
    background: radial-gradient( circle at 14% 18%, rgba(216, 90, 165, 0.14), transparent 27rem), radial-gradient( circle at 88% 82%, rgba(197, 154, 91, 0.16), transparent 28rem), linear-gradient( 145deg, var(--vitrin-renk-kirik-beyaz), #f6ece9);
}

    .vitrin-hesap-sayfasi::before,
    .vitrin-hesap-sayfasi::after {
        position: absolute;
        z-index: -1;
        width: clamp(14rem, 28vw, 28rem);
        aspect-ratio: 1;
        content: "";
        border: 1px solid rgba(91, 46, 72, 0.12);
        border-radius: 50%;
        pointer-events: none;
    }

    .vitrin-hesap-sayfasi::before {
        top: -9rem;
        left: -8rem;
    }

    .vitrin-hesap-sayfasi::after {
        right: -10rem;
        bottom: -11rem;
    }

/* #endregion */

/* #region Müşteri hesabı kartı */

.vitrin-hesap-karti {
    width: min(100%, 42rem);
    padding: clamp(2rem, 6vw, 4rem);
    text-align: center;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    backdrop-filter: blur(1rem);
}

.vitrin-hesap-logo {
    width: min(13rem, 60%);
    margin: 0 auto 2.25rem;
}

.vitrin-hesap-ust-etiket {
    display: block;
    margin-bottom: 0.8rem;
    color: var(--vitrin-renk-murdum);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.vitrin-hesap-basligi {
    margin-bottom: 1rem;
    font-size: clamp(2rem, 6vw, 3.5rem);
}

.vitrin-hesap-aciklamasi {
    max-width: 34rem;
    margin: 0 auto;
    color: var(--vitrin-renk-ikincil-metin);
}

/* #endregion */

/* #region Doğrulama durumu */

.vitrin-hesap-durum-simgesi {
    display: grid;
    width: 5.5rem;
    aspect-ratio: 1;
    margin: 0 auto 1.75rem;
    border-radius: 50%;
    place-items: center;
}

    .vitrin-hesap-durum-simgesi svg {
        width: 2.5rem;
        height: 2.5rem;
        fill: none;
        stroke: currentColor;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 2;
    }

.vitrin-hesap-durum-simgesi--basarili {
    color: var(--vitrin-renk-basari);
    background: #edf7f2;
    border: 1px solid #cce7da;
}

.vitrin-hesap-durum-simgesi--basarisiz {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border: 1px solid #f1ccd3;
}

/* #endregion */

/* #region Hesap sayfası işlemleri */

.vitrin-hesap-islemleri {
    display: flex;
    margin-top: 2rem;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
}

    .vitrin-hesap-islemleri .vitrin-buton {
        min-width: min(100%, 12rem);
    }

.vitrin-hesap-bilgi-notu {
    margin-top: 2rem;
    padding: 1rem 1.15rem;
    color: var(--vitrin-renk-ikincil-metin);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    font-size: 0.88rem;
}

/* #endregion */

/* #region Müşteri hesap paneli */

.vitrin-hesap-sayfasi--panel {
    padding-block: clamp(2rem, 4vw, 3.5rem);
    place-items: start center;
}

.vitrin-hesabim-kabugu {
    display: grid;
    width: min(100%, 70rem);
    gap: 1.5rem;
}

.vitrin-hesabim-karsilama {
    display: grid;
    padding: clamp(2rem, 5vw, 4rem);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    gap: 2rem;
}

.vitrin-hesabim-karsilama-icerigi {
    max-width: 44rem;
}

.vitrin-hesabim-karsilama h1 {
    margin-bottom: 1rem;
    font-size: clamp(2.2rem, 5vw, 4rem);
}

.vitrin-hesabim-karsilama p {
    margin-bottom: 0;
    color: var(--vitrin-renk-ikincil-metin);
}

.vitrin-hesabim-menusu {
    display: flex;
    align-items: center;
    width: 100%;
    padding-top: 1.25rem;
    border-top: 1px solid var(--vitrin-renk-cizgi);
    flex-wrap: wrap;
    gap: 0.55rem;
}

.vitrin-hesabim-menu-ogesi {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0.7rem 1rem;
    color: var(--vitrin-renk-murdum);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 999px;
    cursor: pointer;
    font: inherit;
    font-size: 0.86rem;
    font-weight: 800;
    justify-content: center;
    text-align: center;
    text-decoration: none;
    transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

    .vitrin-hesabim-menu-ogesi:hover {
        color: var(--vitrin-renk-pembe);
        background: var(--vitrin-renk-kirik-beyaz);
        border-color: var(--vitrin-renk-cizgi);
        transform: translateY(-1px);
    }

.vitrin-hesabim-menu-ogesi--aktif {
    color: var(--vitrin-renk-beyaz);
    background: var(--vitrin-renk-murdum);
    border-color: var(--vitrin-renk-murdum);
}

    .vitrin-hesabim-menu-ogesi--aktif:hover {
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
        border-color: var(--vitrin-renk-murdum);
    }

.vitrin-hesabim-menusu
.vitrin-hesabim-menu-ogesi--vurgulu {
    margin-left: auto;
    color: var(--vitrin-renk-beyaz);
    background: linear-gradient( 135deg, var(--vitrin-renk-murdum), var(--vitrin-renk-pembe) );
    border-color: transparent;
    box-shadow: var(--vitrin-golge-kucuk);
}

    .vitrin-hesabim-menusu
    .vitrin-hesabim-menu-ogesi--vurgulu:hover,
    .vitrin-hesabim-menusu
    .vitrin-hesabim-menu-ogesi--vurgulu:focus-visible {
        color: var(--vitrin-renk-beyaz);
        background: linear-gradient( 135deg, var(--vitrin-renk-murdum), var(--vitrin-renk-pembe) );
        border-color: transparent;
        box-shadow: var(--vitrin-golge-vurgu);
        transform: translateY(-1px);
    }

    .vitrin-hesabim-menusu
    .vitrin-hesabim-menu-ogesi--vurgulu:focus-visible {
        outline: 3px solid rgba(216, 90, 165, 0.3);
        outline-offset: 3px;
    }

.vitrin-hesabim-kartlari {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.vitrin-hesabim-karti {
    display: flex;
    min-height: 14rem;
    padding: 1.75rem;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-kucuk);
    flex-direction: column;
    gap: 1.25rem;
}

.vitrin-hesabim-kart-simgesi {
    display: grid;
    width: 3rem;
    aspect-ratio: 1;
    color: var(--vitrin-renk-murdum);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 50%;
    place-items: center;
    font-size: 1.2rem;
    font-weight: 900;
}

.vitrin-hesabim-karti h2 {
    margin-bottom: 0.65rem;
    font-size: 1.35rem;
}

.vitrin-hesabim-karti p {
    margin-bottom: 0;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.92rem;
}


@media (max-width: 900px) {
    .vitrin-hesabim-kartlari {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .vitrin-hesabim-karsilama,
    .vitrin-hesabim-karti {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-hesabim-menusu {
        align-items: stretch;
        flex-direction: column;
    }


    .vitrin-hesabim-menu-ogesi {
        width: 100%;
        justify-content: flex-start;
        text-align: left;
    }

    .vitrin-hesabim-menu-ogesi--vurgulu {
        margin-left: 0;
    }
}

/* #endregion */

/* #region Mobil görünüm */

@media (max-width: 640px) {
    .vitrin-hesap-sayfasi {
        min-height: calc(100svh - 5rem);
        padding-block: 2rem;
        place-items: start center;
    }

    .vitrin-hesap-karti {
        padding: 2rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-hesap-islemleri {
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-hesap-islemleri .vitrin-buton {
            width: 100%;
        }
}

@media (prefers-reduced-motion: reduce) {
    .vitrin-hesap-sayfasi *,
    .vitrin-hesap-sayfasi *::before,
    .vitrin-hesap-sayfasi *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* #endregion */

/* #region Müşteri hesap özeti ve talepler */

.vitrin-hesabim-sayi {
    display: block;
    margin-bottom: 0.5rem;
    color: var(--vitrin-renk-murdum);
    font-family: var(--vitrin-yazi-metin);
    font-size: clamp(2.25rem, 5vw, 3.5rem);
    line-height: 1;
}

.vitrin-hesabim-talepler {
    padding: clamp(1.5rem, 4vw, 3rem);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-hesabim-bolum-basligi {
    display: flex;
    align-items: flex-end;
    margin-bottom: 1.5rem;
    gap: 1rem;
    justify-content: space-between;
}

    .vitrin-hesabim-bolum-basligi h2 {
        margin-bottom: 0;
        font-size: clamp(1.75rem, 4vw, 2.75rem);
    }

.vitrin-hesabim-kayit-sayisi {
    padding: 0.45rem 0.75rem;
    color: var(--vitrin-renk-ikincil-metin);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
}

.vitrin-hesabim-filtre-kutusu {
    display: grid;
    align-items: end;
    margin-bottom: 1.25rem;
    padding: 1rem;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    grid-template-columns: minmax(14rem, 1fr) auto;
    gap: 1rem;
}

.vitrin-hesabim-filtre-alani {
    display: grid;
    min-width: 0;
    gap: 0.4rem;
}

.vitrin-hesabim-filtre-etiketi {
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.76rem;
    font-weight: 800;
}

.vitrin-hesabim-filtre-secici {
    position: relative;
    min-width: 0;
}

    .vitrin-hesabim-filtre-secici > summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 3rem;
        padding: 0.7rem 0.85rem;
        cursor: pointer;
        color: var(--vitrin-renk-koyu-metin);
        background: var(--vitrin-renk-beyaz);
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: var(--vitrin-kose-kucuk);
        gap: 1rem;
        font-size: 0.9rem;
        list-style: none;
        transition: border-color var(--vitrin-gecis), box-shadow var(--vitrin-gecis), background var(--vitrin-gecis);
    }

        .vitrin-hesabim-filtre-secici > summary::marker {
            content: "";
        }

        .vitrin-hesabim-filtre-secici > summary:hover,
        .vitrin-hesabim-filtre-secici > summary:focus-visible {
            background: var(--vitrin-renk-kirik-beyaz);
            border-color: var(--vitrin-renk-pembe);
            box-shadow: 0 0 0 0.2rem rgba(216, 90, 165, 0.12);
            outline: none;
        }

    .vitrin-hesabim-filtre-secici[open] > summary {
        border-color: var(--vitrin-renk-pembe);
        box-shadow: 0 0 0 0.2rem rgba(216, 90, 165, 0.12);
    }

.vitrin-hesabim-filtre-oku {
    flex: 0 0 auto;
    color: var(--vitrin-renk-murdum);
    font-size: 1.1rem;
    font-weight: 900;
    transition: transform var(--vitrin-gecis);
}

.vitrin-hesabim-filtre-secici[open]
.vitrin-hesabim-filtre-oku {
    transform: rotate(180deg);
}

.vitrin-hesabim-filtre-secenekleri {
    position: absolute;
    top: calc(100% + 0.45rem);
    right: 0;
    left: 0;
    z-index: 30;
    display: grid;
    padding: 0.45rem;
    background: var(--vitrin-renk-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: 0 1.25rem 3rem rgba(45, 22, 37, 0.18);
    gap: 0.2rem;
}

.vitrin-hesabim-filtre-secenegi {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 2.75rem;
    padding: 0.65rem 0.75rem;
    color: var(--vitrin-renk-koyu-metin);
    border-radius: var(--vitrin-kose-kucuk);
    gap: 1rem;
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    transition: color var(--vitrin-gecis), background var(--vitrin-gecis), transform var(--vitrin-gecis);
}

    .vitrin-hesabim-filtre-secenegi:hover,
    .vitrin-hesabim-filtre-secenegi:focus-visible {
        color: var(--vitrin-renk-murdum);
        background: var(--vitrin-renk-acik-alan);
        outline: none;
        transform: translateX(0.15rem);
    }

.vitrin-hesabim-filtre-secenegi--aktif {
    color: var(--vitrin-renk-murdum);
    background: rgba(216, 90, 165, 0.11);
}

.vitrin-hesabim-filtre-isareti {
    display: inline-grid;
    flex: 0 0 auto;
    width: 1.6rem;
    aspect-ratio: 1;
    color: var(--vitrin-renk-murdum);
    background: var(--vitrin-renk-beyaz);
    border: 1px solid rgba(216, 90, 165, 0.25);
    border-radius: 50%;
    place-items: center;
    font-size: 0.72rem;
    font-weight: 900;
}

.vitrin-hesabim-filtre-temizle {
    min-height: 3rem;
    white-space: nowrap;
}

.vitrin-hesabim-talep-listesi {
    display: grid;
    gap: 1rem;
}

.vitrin-hesabim-talep-karti {
    padding: clamp(1.25rem, 3vw, 1.75rem);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
}

.vitrin-hesabim-talep-ust {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.25rem;
    gap: 1rem;
    justify-content: space-between;
}

.vitrin-hesabim-durumlar {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.vitrin-hesabim-talep-kodu {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.vitrin-hesabim-talep-ust h3 {
    margin-bottom: 0;
    font-size: 1.45rem;
}

.vitrin-hesabim-durum {
    flex: 0 0 auto;
    padding: 0.45rem 0.7rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 800;
}

.vitrin-hesabim-durum--bekliyor {
    color: #77561f;
    background: rgba(197, 154, 91, 0.15);
    border-color: rgba(197, 154, 91, 0.35);
}

.vitrin-hesabim-durum--onaylandi,
.vitrin-hesabim-durum--tamamlandi {
    color: var(--vitrin-renk-basari);
    background: #edf7f2;
    border-color: #cce7da;
}

.vitrin-hesabim-durum--suresi-doldu,
.vitrin-hesabim-durum--iptal {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border-color: #f1ccd3;
}

.vitrin-hesabim-durum--bilinmiyor {
    color: var(--vitrin-renk-ikincil-metin);
    background: #f1eeee;
    border-color: var(--vitrin-renk-cizgi);
}

.vitrin-hesabim-yayin-durumu--yayinda {
    color: var(--vitrin-renk-murdum);
    background: rgba(216, 90, 165, 0.11);
    border-color: rgba(216, 90, 165, 0.3);
}

.vitrin-hesabim-yayin-durumu--suresi-doldu {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border-color: #f1ccd3;
}

.vitrin-hesabim-talep-bilgileri {
    display: grid;
    margin: 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

    .vitrin-hesabim-talep-bilgileri div {
        min-width: 0;
    }

    .vitrin-hesabim-talep-bilgileri dt {
        margin-bottom: 0.3rem;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.75rem;
        font-weight: 700;
    }

    .vitrin-hesabim-talep-bilgileri dd {
        margin: 0;
        overflow-wrap: anywhere;
        font-size: 0.9rem;
        font-weight: 700;
    }

.vitrin-hesabim-talep-islemleri {
    display: grid;
    margin-top: 1.5rem;
    gap: 0.85rem;
}

.vitrin-hesabim-ana-islemler {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

    .vitrin-hesabim-ana-islemler >
    .vitrin-hesabim-islem-grubu:only-child {
        grid-column: 1 / -1;
    }

.vitrin-hesabim-islem-grubu {
    display: grid;
    min-width: 0;
    padding: 1rem;
    align-content: start;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    gap: 0.9rem;
}

.vitrin-hesabim-islem-grubu--etkilesim {
    background: #fbf5f7;
    border-color: #ead9e1;
}

.vitrin-hesabim-islem-grubu-basligi {
    display: grid;
    min-width: 0;
    align-items: start;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
}

    .vitrin-hesabim-islem-grubu-basligi > span {
        display: grid;
        width: 2rem;
        aspect-ratio: 1;
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
        border-radius: 50%;
        place-items: center;
        font-size: 0.7rem;
        font-weight: 800;
    }

    .vitrin-hesabim-islem-grubu-basligi > div {
        display: grid;
        min-width: 0;
        gap: 0.2rem;
    }

    .vitrin-hesabim-islem-grubu-basligi strong {
        color: var(--vitrin-renk-koyu-metin);
        font-size: 0.95rem;
    }

    .vitrin-hesabim-islem-grubu-basligi small {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.75rem;
        line-height: 1.45;
    }

.vitrin-hesabim-islem-grubu-bos-mesaji {
    margin: 0;
    padding: 0.7rem 0.8rem;
    color: var(--vitrin-renk-ikincil-metin);
    background: rgba(255, 255, 255, 0.58);
    border: 1px dashed var(--vitrin-renk-cizgi);
    border-radius: 0.75rem;
    font-size: 0.74rem;
    line-height: 1.5;
}

.vitrin-hesabim-islem-grubu-bos-mesaji--bilgi {
    color: #35644f;
    background: #f4faf7;
    border-color: #cfe4d8;
    border-style: solid;
}

.vitrin-hesabim-islem-dugmeleri {
    display: flex;
    align-items: flex-start;
    min-width: 0;
    flex-wrap: wrap;
    gap: 0.55rem;
}

    .vitrin-hesabim-islem-dugmeleri .vitrin-buton,
    .vitrin-hesabim-paylasim-dugmesi {
        display: inline-flex;
        min-height: 2.7rem;
        padding: 0.65rem 0.9rem;
        align-items: center;
        justify-content: center;
        white-space: normal;
        font-size: 0.78rem;
        line-height: 1.2;
        text-align: center;
    }

.vitrin-hesabim-paylasim-islemi {
    display: grid;
    min-width: 0;
    justify-items: start;
    gap: 0.35rem;
}

    .vitrin-hesabim-paylasim-islemi small {
        max-width: 18rem;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.72rem;
        line-height: 1.4;
        text-align: left;
    }

.vitrin-hesabim-paylasim-dugmesi--pasif,
.vitrin-hesabim-paylasim-dugmesi--pasif:hover {
    color: #8c7f86;
    background: #ece7e9;
    border-color: #ddd3d7;
    box-shadow: none;
    cursor: not-allowed;
    transform: none;
}

.vitrin-hesabim-talep-yardimci-islemleri {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 0.8rem 1rem;
    background: rgba(255, 255, 255, 0.62);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    justify-content: space-between;
    gap: 1rem;
}

    .vitrin-hesabim-talep-yardimci-islemleri > div {
        display: grid;
        min-width: 0;
        gap: 0.15rem;
    }

    .vitrin-hesabim-talep-yardimci-islemleri strong {
        color: var(--vitrin-renk-koyu-metin);
        font-size: 0.84rem;
    }

    .vitrin-hesabim-talep-yardimci-islemleri small {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.73rem;
        line-height: 1.4;
    }

    .vitrin-hesabim-talep-yardimci-islemleri >
    .vitrin-buton {
        min-height: 2.7rem;
        padding: 0.65rem 0.9rem;
        flex: 0 0 auto;
        font-size: 0.78rem;
    }

.vitrin-hesabim-talep-yardimci-islemleri--paylasim {
    background: #fbf5f7;
    border-color: #ead9e1;
}

.vitrin-hesabim-talep-yardimci-islemleri >
.vitrin-hesabim-yardimci-islem-dugmeleri {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

.vitrin-hesabim-yardimci-islem-dugmeleri >
.vitrin-buton {
    min-height: 2.7rem;
    padding: 0.65rem 0.9rem;
    flex: 0 0 auto;
    font-size: 0.78rem;
}

@media (max-width: 900px) {
    .vitrin-hesabim-ana-islemler {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .vitrin-hesabim-islem-grubu {
        padding: 0.9rem;
    }

    .vitrin-hesabim-islem-dugmeleri {
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-hesabim-islem-dugmeleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-hesabim-talep-yardimci-islemleri {
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-hesabim-talep-yardimci-islemleri >
        .vitrin-buton {
            width: 100%;
        }

        .vitrin-hesabim-talep-yardimci-islemleri >
        .vitrin-hesabim-yardimci-islem-dugmeleri {
            width: 100%;
            align-items: stretch;
            flex-direction: column;
        }

    .vitrin-hesabim-yardimci-islem-dugmeleri >
    .vitrin-buton,
    .vitrin-hesabim-yardimci-islem-dugmeleri
    .vitrin-hesabim-paylasim-islemi,
    .vitrin-hesabim-yardimci-islem-dugmeleri
    .vitrin-hesabim-paylasim-dugmesi {
        width: 100%;
    }
}

.vitrin-hesabim-islem-mesaji {
    display: flex;
    margin: 0 0 1.5rem;
    padding: 1rem 1.1rem;
    border: 1px solid;
    border-radius: 1rem;
    align-items: flex-start;
    gap: 0.85rem;
    line-height: 1.55;
}

    .vitrin-hesabim-islem-mesaji > span {
        display: inline-flex;
        width: 2rem;
        height: 2rem;
        flex: 0 0 auto;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        font-weight: 800;
    }

    .vitrin-hesabim-islem-mesaji strong {
        display: block;
        margin-bottom: 0.15rem;
    }

    .vitrin-hesabim-islem-mesaji p {
        margin: 0;
    }

.vitrin-hesabim-islem-mesaji--basarili {
    color: #176b55;
    background: #effaf6;
    border-color: #bfe5d8;
}

    .vitrin-hesabim-islem-mesaji--basarili > span {
        background: #d8f2e9;
    }

.vitrin-hesabim-islem-mesaji--hatali {
    color: #9a3043;
    background: #fff3f5;
    border-color: #efc8d0;
}

    .vitrin-hesabim-islem-mesaji--hatali > span {
        background: #f8dce2;
    }

.vitrin-hesabim-iptal-islemi {
    width: 100%;
    margin-top: 0.35rem;
    padding-top: 1rem;
    border-top: 1px solid var(--vitrin-renk-cizgi);
}

    .vitrin-hesabim-iptal-islemi summary {
        width: fit-content;
        color: var(--vitrin-renk-hata);
        cursor: pointer;
        font-size: 0.82rem;
        font-weight: 700;
    }

        .vitrin-hesabim-iptal-islemi summary:hover {
            text-decoration: underline;
        }

.vitrin-hesabim-iptal-icerigi {
    max-width: 42rem;
    margin-top: 0.9rem;
    padding: 1rem;
    background: #fff7f8;
    border: 1px solid #efd1d7;
    border-radius: 1rem;
}

    .vitrin-hesabim-iptal-icerigi > strong {
        display: block;
        color: #8f2f41;
    }

    .vitrin-hesabim-iptal-icerigi > p {
        margin: 0.45rem 0 1rem;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.85rem;
        line-height: 1.55;
    }

    .vitrin-hesabim-iptal-icerigi form {
        display: grid;
        justify-items: start;
        gap: 1rem;
    }

.vitrin-hesabim-iptal-onayi {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    cursor: pointer;
    font-size: 0.82rem;
    line-height: 1.5;
}

    .vitrin-hesabim-iptal-onayi input {
        width: 1.1rem;
        height: 1.1rem;
        margin-top: 0.15rem;
        flex: 0 0 auto;
        accent-color: var(--vitrin-renk-hata);
    }

.vitrin-hesabim-iptal-dugmesi {
    color: #9a3043;
    background: #ffffff;
    border-color: #dcaab4;
}

    .vitrin-hesabim-iptal-dugmesi:hover {
        color: #ffffff;
        background: #9a3043;
        border-color: #9a3043;
    }

.vitrin-hesabim-bos-durum {
    display: grid;
    max-width: 40rem;
    margin-inline: auto;
    padding: clamp(2rem, 5vw, 4rem) 1rem;
    text-align: center;
    place-items: center;
}

    .vitrin-hesabim-bos-durum > span {
        display: grid;
        width: 4rem;
        aspect-ratio: 1;
        margin-bottom: 1rem;
        color: var(--vitrin-renk-pembe);
        background: rgba(216, 90, 165, 0.1);
        border-radius: 50%;
        place-items: center;
        font-size: 1.5rem;
    }

    .vitrin-hesabim-bos-durum h3 {
        margin-bottom: 0.75rem;
        font-size: 1.5rem;
    }

    .vitrin-hesabim-bos-durum p {
        margin-bottom: 1.5rem;
        color: var(--vitrin-renk-ikincil-metin);
    }

.vitrin-hesabim-sayfalama {
    display: grid;
    align-items: center;
    margin-top: 1.25rem;
    padding: 1rem;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 1rem;
}

    .vitrin-hesabim-sayfalama > div:last-child {
        display: flex;
        justify-content: flex-end;
    }

    .vitrin-hesabim-sayfalama > span {
        color: var(--vitrin-renk-murdum);
        font-size: 0.84rem;
        font-weight: 800;
        white-space: nowrap;
    }

@media (max-width: 900px) {
    .vitrin-hesabim-talep-bilgileri {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .vitrin-hesabim-talepler {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-hesabim-bolum-basligi,
    .vitrin-hesabim-talep-ust {
        align-items: flex-start;
        flex-direction: column;
    }

    .vitrin-hesabim-filtre-kutusu {
        align-items: stretch;
        grid-template-columns: 1fr;
    }

    .vitrin-hesabim-filtre-temizle {
        width: 100%;
    }

    .vitrin-hesabim-durumlar {
        width: 100%;
        justify-content: flex-start;
    }

    .vitrin-hesabim-talep-bilgileri {
        grid-template-columns: 1fr;
    }

    .vitrin-hesabim-talep-islemleri {
        align-items: stretch;
        flex-direction: column;
    }

    .vitrin-hesabim-paylasim-islemi {
        width: 100%;
        margin-left: 0;
        justify-items: stretch;
    }

        .vitrin-hesabim-paylasim-islemi small {
            max-width: none;
            text-align: left;
        }

    .vitrin-hesabim-talep-islemleri .vitrin-buton {
        width: 100%;
        white-space: normal;
    }

    .vitrin-hesabim-sayfalama {
        grid-template-columns: 1fr;
        text-align: center;
    }

        .vitrin-hesabim-sayfalama > div,
        .vitrin-hesabim-sayfalama > div:last-child {
            display: block;
        }

        .vitrin-hesabim-sayfalama .vitrin-buton {
            width: 100%;
        }
}

/* #endregion */


/* #region Davetiye etkileşim ayarları */

.vitrin-etkilesim-kabugu {
    display: grid;
    width: min(100%, 70rem);
    gap: 1.5rem;
}

.vitrin-etkilesim-geri a {
    display: inline-flex;
    align-items: center;
    color: var(--vitrin-renk-murdum);
    gap: 0.5rem;
    font-weight: 800;
    text-decoration: none;
}

.vitrin-etkilesim-basligi {
    display: grid;
    align-items: stretch;
    padding: clamp(2rem, 5vw, 4rem);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    gap: 1.75rem;
}

    .vitrin-etkilesim-basligi > div:first-child {
        min-width: 0;
        max-width: 50rem;
    }

    .vitrin-etkilesim-basligi h1 {
        margin-bottom: 1rem;
        font-size: clamp(2.1rem, 5vw, 3.4rem);
    }

    .vitrin-etkilesim-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
    }

.vitrin-etkilesim-formu {
    display: grid;
    gap: 1.5rem;
}

.vitrin-etkilesim-karti {
    padding: clamp(1.5rem, 4vw, 3rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-etkilesim-kart-basligi {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    gap: 1rem;
}

    .vitrin-etkilesim-kart-basligi > span {
        display: grid;
        width: 2.8rem;
        aspect-ratio: 1;
        flex: 0 0 auto;
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
        border-radius: 50%;
        place-items: center;
        font-size: 0.78rem;
        font-weight: 900;
    }

    .vitrin-etkilesim-kart-basligi h2 {
        margin-bottom: 0.4rem;
        font-size: clamp(1.45rem, 3vw, 2rem);
    }

    .vitrin-etkilesim-kart-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
    }

.vitrin-etkilesim-secenekleri,
.vitrin-etkilesim-bildirimleri {
    display: grid;
    gap: 0.85rem;
}

    .vitrin-etkilesim-secenegi,
    .vitrin-etkilesim-bildirimleri label {
        display: grid;
        align-items: flex-start;
        cursor: pointer;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.85rem;
    }

        .vitrin-etkilesim-secenegi > input,
        .vitrin-etkilesim-bildirimleri input {
            width: 1.15rem;
            height: 1.15rem;
            margin-top: 1.15rem;
            accent-color: var(--vitrin-renk-murdum);
        }

        .vitrin-etkilesim-secenegi-icerigi,
        .vitrin-etkilesim-bildirimleri label > span {
            display: grid;
            padding: 1rem 1.1rem;
            background: var(--vitrin-renk-kirik-beyaz);
            border: 1px solid var(--vitrin-renk-cizgi);
            border-radius: var(--vitrin-kose-kucuk);
            gap: 0.4rem;
            transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
        }

        .vitrin-etkilesim-secenegi input:checked +
        .vitrin-etkilesim-secenegi-icerigi {
            background: #fff7fb;
            border-color: var(--vitrin-renk-pembe);
            box-shadow: 0 0 0 3px rgba(216, 90, 165, 0.12);
        }

        .vitrin-etkilesim-secenegi:focus-within
        .vitrin-etkilesim-secenegi-icerigi,
        .vitrin-etkilesim-bildirimleri label:focus-within > span {
            outline: 3px solid rgba(216, 90, 165, 0.22);
            outline-offset: 2px;
        }

.vitrin-etkilesim-secenegi-basligi {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
}

    .vitrin-etkilesim-secenegi-basligi > span {
        padding: 0.25rem 0.55rem;
        color: var(--vitrin-renk-murdum);
        background: var(--vitrin-renk-acik-alan);
        border-radius: var(--vitrin-kose-yuvarlak);
        font-size: 0.7rem;
        font-weight: 900;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

.vitrin-etkilesim-secenegi small,
.vitrin-etkilesim-bildirimleri small {
    color: var(--vitrin-renk-ikincil-metin);
    line-height: 1.55;
}

.vitrin-etkilesim-mesaji {
    display: flex;
    align-items: flex-start;
    padding: 1rem 1.2rem;
    border-radius: var(--vitrin-kose-kucuk);
    gap: 0.8rem;
}

    .vitrin-etkilesim-mesaji p {
        margin: 0.25rem 0 0;
    }

.vitrin-etkilesim-mesaji--basarili {
    color: var(--vitrin-renk-basari);
    background: #edf7f2;
    border: 1px solid #cce7da;
}

.vitrin-etkilesim-dogrulama-ozeti {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border: 1px solid #f1ccd3;
    border-radius: var(--vitrin-kose-kucuk);
}

    .vitrin-etkilesim-dogrulama-ozeti:empty,
    .vitrin-etkilesim-dogrulama-ozeti.validation-summary-valid {
        display: none;
    }

    .vitrin-etkilesim-dogrulama-ozeti ul {
        margin: 0;
        padding: 1rem 1rem 1rem 2.25rem;
    }

.vitrin-etkilesim-islemleri {
    display: flex;
    align-items: center;
    padding: 1.25rem;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-kucuk);
    gap: 1.5rem;
    justify-content: space-between;
}

    .vitrin-etkilesim-islemleri > div {
        display: grid;
        gap: 0.25rem;
    }

    .vitrin-etkilesim-islemleri span {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.88rem;
    }

@media (max-width: 700px) {
    .vitrin-etkilesim-basligi,
    .vitrin-etkilesim-islemleri {
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-etkilesim-basligi .vitrin-buton,
        .vitrin-etkilesim-islemleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-etkilesim-karti {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }
}

/* #endregion */


/* #region Davetiye anıları listesi */

.vitrin-etkilesim-baslik-islemleri {
    display: flex;
    align-items: center;
    width: 100%;
    padding-top: 1.25rem;
    border-top: 1px solid var(--vitrin-renk-cizgi);
    flex-wrap: wrap;
    gap: 0.75rem;
}

.vitrin-anilar-kabugu {
    display: grid;
    width: min(100%, 78rem);
    gap: 1.5rem;
}

.vitrin-anilar-basligi {
    display: flex;
    align-items: center;
    padding: clamp(2rem, 5vw, 4rem);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    gap: 2rem;
    justify-content: space-between;
}

    .vitrin-anilar-basligi > div {
        max-width: 46rem;
    }

    .vitrin-anilar-basligi h1 {
        margin-bottom: 1rem;
        font-size: clamp(2.1rem, 5vw, 3.8rem);
    }

    .vitrin-anilar-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
    }

.vitrin-anilar-filtreleri {
    display: flex;
    padding: 0.75rem;
    overflow-x: auto;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-kucuk);
    gap: 0.5rem;
}

.vitrin-ani-filtresi {
    flex: 0 0 auto;
    padding: 0.65rem 0.9rem;
    color: var(--vitrin-renk-ikincil-metin);
    border: 1px solid transparent;
    border-radius: var(--vitrin-kose-yuvarlak);
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
}

    .vitrin-ani-filtresi:hover,
    .vitrin-ani-filtresi:focus-visible,
    .vitrin-ani-filtresi--aktif {
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
    }

.vitrin-anilar-liste-basligi {
    display: flex;
    align-items: center;
    min-height: 3rem;
    padding: 0 0.25rem;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
}

    .vitrin-anilar-liste-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
    }

    .vitrin-anilar-liste-basligi strong {
        color: var(--vitrin-renk-murdum);
        font-variant-numeric: tabular-nums;
    }

.vitrin-anilar-toplu-indir {
    margin: 0 0 0 auto;
}

    .vitrin-anilar-toplu-indir .vitrin-buton {
        min-height: 2.8rem;
        padding: 0.68rem 1rem;
    }

.vitrin-anilar-listesi {
    display: grid;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-ani-satiri {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    min-width: 0;
    padding: 1.25rem 1.4rem;
    gap: 1.15rem;
}

    .vitrin-ani-satiri + .vitrin-ani-satiri {
        border-top: 1px solid var(--vitrin-renk-cizgi);
    }

    .vitrin-ani-satiri:hover {
        background: var(--vitrin-renk-kirik-beyaz);
    }

.vitrin-ani-satiri-simgesi {
    display: grid;
    width: 3.25rem;
    height: 3.25rem;
    flex: 0 0 auto;
    place-items: center;
    color: var(--vitrin-renk-murdum);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 1rem;
}

    .vitrin-ani-satiri-simgesi svg {
        width: 1.55rem;
        height: 1.55rem;
    }

.vitrin-ani-satiri-metin-simgesi {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.vitrin-ani-karti-kontrol-gostergesi {
    width: 1.6rem;
    height: 1.6rem;
    border: 0.2rem solid rgba(111, 45, 83, 0.16);
    border-top-color: var(--vitrin-renk-murdum);
    border-radius: 50%;
    animation: vitrin-ani-kontrol-donusu 900ms linear infinite;
}

@keyframes vitrin-ani-kontrol-donusu {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .vitrin-ani-karti-kontrol-gostergesi {
        animation: none;
        border-color: rgba(111, 45, 83, 0.28);
        border-top-color: var(--vitrin-renk-murdum);
    }
}

.vitrin-ani-satiri-icerigi {
    display: grid;
    min-width: 0;
    gap: 0.65rem;
}

.vitrin-ani-satiri-basligi {
    display: grid;
    min-width: 0;
    gap: 0.25rem;
}

    .vitrin-ani-satiri-basligi h2 {
        margin: 0;
        color: var(--vitrin-renk-koyu-metin);
        font-size: 1.08rem;
        line-height: 1.35;
    }

    .vitrin-ani-satiri-basligi time {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.76rem;
    }

.vitrin-ani-durum {
    flex: 0 0 auto;
    padding: 0.38rem 0.65rem;
    border: 1px solid transparent;
    border-radius: var(--vitrin-kose-yuvarlak);
    font-size: 0.72rem;
    font-weight: 900;
}

.vitrin-ani-durum--inceleme {
    color: var(--vitrin-renk-uyari);
    background: #fff8e8;
    border-color: #ead7a8;
}

.vitrin-ani-durum--onay-bekliyor {
    color: var(--vitrin-renk-murdum);
    background: #fff0f8;
    border-color: #efc5dc;
}

.vitrin-ani-durum--yayinda {
    color: var(--vitrin-renk-basari);
    background: #edf7f2;
    border-color: #cce7da;
}

.vitrin-ani-durum--gizli,
.vitrin-ani-durum--ozel {
    color: var(--vitrin-renk-ikincil-metin);
    background: var(--vitrin-renk-acik-alan);
    border-color: var(--vitrin-renk-cizgi);
}

.vitrin-ani-durum--reddedildi {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border-color: #f1ccd3;
}

.vitrin-ani-durum--bilinmiyor {
    color: var(--vitrin-renk-ikincil-metin);
    background: #f1eeee;
    border-color: var(--vitrin-renk-cizgi);
}

.vitrin-ani-satiri-bilgileri {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

    .vitrin-ani-satiri-bilgileri span {
        padding: 0.3rem 0.55rem;
        color: var(--vitrin-renk-ikincil-metin);
        background: var(--vitrin-renk-kirik-beyaz);
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: var(--vitrin-kose-yuvarlak);
        font-size: 0.72rem;
        font-weight: 700;
    }

.vitrin-ani-satiri-aciklamasi {
    margin: 0;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.82rem;
    line-height: 1.5;
}

.vitrin-ani-satiri-islemleri {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: flex-end;
}

    .vitrin-ani-satiri-islemleri form {
        margin: 0;
    }

    .vitrin-ani-satiri-islemleri .vitrin-buton {
        min-width: 5.75rem;
        min-height: 2.7rem;
        padding: 0.65rem 0.9rem;
        white-space: nowrap;
    }

@media (min-width: 641px) {
    .vitrin-ani-durum {
        display: inline-flex;
        min-width: 5.75rem;
        min-height: 2.7rem;
        align-items: center;
        justify-content: center;
        padding: 0.65rem 0.9rem;
        font-size: 0.8rem;
        line-height: 1.2;
        text-align: center;
    }
}

    .vitrin-ani-satiri-islemleri .vitrin-buton--ikincil {
        color: var(--vitrin-renk-murdum);
        background: var(--vitrin-renk-beyaz);
        border-color: var(--vitrin-renk-cizgi);
    }

        .vitrin-ani-satiri-islemleri .vitrin-buton--ikincil:hover,
        .vitrin-ani-satiri-islemleri .vitrin-buton--ikincil:focus-visible {
            color: var(--vitrin-renk-beyaz);
            background: var(--vitrin-renk-murdum);
            border-color: var(--vitrin-renk-murdum);
        }

.vitrin-anilar-bos {
    display: grid;
    padding: clamp(3rem, 8vw, 6rem) 1.5rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    place-items: center;
}

    .vitrin-anilar-bos > span {
        display: grid;
        width: 4rem;
        aspect-ratio: 1;
        margin-bottom: 1rem;
        color: var(--vitrin-renk-pembe);
        background: rgba(216, 90, 165, 0.1);
        border-radius: 50%;
        place-items: center;
        font-size: 1.5rem;
    }

    .vitrin-anilar-bos p {
        max-width: 38rem;
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
    }

.vitrin-anilar-sayfalama {
    display: flex;
    align-items: center;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    gap: 1rem;
    justify-content: center;
}

    .vitrin-anilar-sayfalama > span {
        font-weight: 800;
    }

@media (max-width: 850px) {
    .vitrin-ani-satiri {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .vitrin-ani-satiri-islemleri {
        grid-column: 2 / -1;
        justify-content: flex-end;
    }
}

@media (max-width: 640px) {
    .vitrin-etkilesim-baslik-islemleri {
        align-items: stretch;
        width: 100%;
        flex-direction: column;
    }

        .vitrin-etkilesim-baslik-islemleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-anilar-basligi {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-anilar-filtreleri {
        margin-inline: -0.25rem;
    }

    .vitrin-ani-satiri {
        grid-template-columns: 1fr;
        align-items: stretch;
        padding: 1.15rem;
    }

    .vitrin-ani-satiri-simgesi {
        display: none;
    }

    .vitrin-ani-durum {
        justify-self: start;
    }

    .vitrin-ani-satiri-basligi {
        align-items: flex-start;
        flex-direction: column;
    }

    .vitrin-ani-satiri-islemleri {
        grid-column: auto;
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-ani-satiri-islemleri form,
        .vitrin-ani-satiri-islemleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-anilar-sayfalama {
        flex-wrap: wrap;
    }

    .vitrin-anilar-liste-basligi {
        align-items: stretch;
        flex-direction: column;
    }

    .vitrin-anilar-toplu-indir,
    .vitrin-anilar-toplu-indir .vitrin-buton {
        width: 100%;
    }
}

/* #endregion */


/* #region Davetiye anısı detay görünümü */

.vitrin-ani-karti-islemleri {
    display: flex;
    margin-top: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.vitrin-ani-detay-kabugu {
    display: grid;
    width: min(100%, 70rem);
    gap: 1rem;
}

.vitrin-ani-detay-basligi {
    display: flex;
    align-items: center;
    padding: clamp(1.5rem, 3vw, 2.25rem);
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    gap: 1.5rem;
    justify-content: space-between;
}

    .vitrin-ani-detay-basligi > div:first-child {
        max-width: 46rem;
    }

    .vitrin-ani-detay-basligi h1 {
        margin-bottom: 0.65rem;
        font-size: clamp(1.9rem, 4vw, 3rem);
    }

    .vitrin-ani-detay-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
        line-height: 1.65;
    }

.vitrin-ani-detay-durum-alani {
    display: grid;
    min-width: 10rem;
    padding: 0.85rem 1rem;
    text-align: center;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    gap: 0.5rem;
    justify-items: center;
}

    .vitrin-ani-detay-durum-alani time {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.78rem;
    }

.vitrin-ani-detay-uyari,
.vitrin-ani-detay-medya-yok {
    display: grid;
    align-items: flex-start;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
}

    .vitrin-ani-detay-uyari > span,
    .vitrin-ani-detay-medya-yok > span {
        display: grid;
        width: 3.25rem;
        aspect-ratio: 1;
        color: var(--vitrin-renk-murdum);
        background: var(--vitrin-renk-acik-alan);
        border-radius: 50%;
        place-items: center;
        font-size: 1.25rem;
    }

    .vitrin-ani-detay-uyari h2,
    .vitrin-ani-detay-medya-yok h2 {
        margin-bottom: 0.6rem;
        font-size: 1.5rem;
    }

    .vitrin-ani-detay-uyari p,
    .vitrin-ani-detay-medya-yok p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
    }

.vitrin-ani-detay-red-nedeni {
    margin-top: 1rem !important;
    padding: 1rem;
    color: var(--vitrin-renk-hata) !important;
    background: #fff0f2;
    border: 1px solid #f1ccd3;
    border-radius: var(--vitrin-kose-kucuk);
}

.vitrin-ani-detay-icerik-karti {
    display: grid;
    padding: clamp(1.25rem, 3vw, 2rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    gap: 1.25rem;
}

.vitrin-ani-detay-gonderen {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

    .vitrin-ani-detay-gonderen > span {
        display: grid;
        width: 3rem;
        aspect-ratio: 1;
        flex: 0 0 auto;
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
        border-radius: 50%;
        place-items: center;
        font-size: 1.05rem;
    }

    .vitrin-ani-detay-gonderen > div {
        display: grid;
        gap: 0.15rem;
    }

    .vitrin-ani-detay-gonderen small {
        color: var(--vitrin-renk-ikincil-metin);
    }

    .vitrin-ani-detay-gonderen strong {
        font-size: 1.05rem;
    }

.vitrin-ani-detay-mesaj {
    padding: 1.25rem 1.4rem;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
}

    .vitrin-ani-detay-mesaj h2 {
        margin-block: 0.35rem 0.65rem;
        font-size: clamp(1.45rem, 3vw, 2rem);
    }

.vitrin-ani-detay-mesaj-metni {
    margin: 0;
    color: var(--vitrin-renk-metin);
    line-height: 1.65;
    overflow-wrap: anywhere;
    white-space: pre-line;
}

.vitrin-ani-detay-bos-mesaj {
    margin: 0;
    color: var(--vitrin-renk-ikincil-metin);
    font-style: italic;
}

.vitrin-ani-detay-izin {
    display: grid;
    align-items: flex-start;
    padding: 0.95rem 1rem;
    border: 1px solid;
    border-radius: var(--vitrin-kose-kucuk);
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
}

    .vitrin-ani-detay-izin > span {
        display: grid;
        width: 1.8rem;
        aspect-ratio: 1;
        border-radius: 50%;
        place-items: center;
        font-weight: 900;
    }

    .vitrin-ani-detay-izin p {
        margin: 0.25rem 0 0;
        line-height: 1.5;
    }

.vitrin-ani-detay-izin--verildi {
    color: var(--vitrin-renk-basari);
    background: #edf7f2;
    border-color: #cce7da;
}

.vitrin-ani-detay-izin--verilmedi {
    color: #77561f;
    background: #fff8e8;
    border-color: #ead7a8;
}

.vitrin-ani-detay-medya-bolumu {
    padding: clamp(1.25rem, 3vw, 2rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

    .vitrin-ani-detay-medya-bolumu > header {
        display: flex;
        align-items: center;
        margin-bottom: 1.1rem;
        gap: 1rem;
        justify-content: space-between;
    }

    .vitrin-ani-detay-medya-bolumu h2 {
        margin: 0.35rem 0 0;
        font-size: clamp(1.45rem, 3vw, 2rem);
    }

.vitrin-ani-detay-medya-baslik-metni {
    min-width: 0;
}

    .vitrin-ani-detay-medya-baslik-metni p {
        margin: 0.65rem 0 0;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.86rem;
        line-height: 1.5;
    }

        .vitrin-ani-detay-medya-baslik-metni p strong {
            color: var(--vitrin-renk-murdum);
            font-weight: 900;
        }

.vitrin-ani-detay-medya-araclari {
    display: flex;
    align-items: center;
    margin-left: auto;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
}

.vitrin-ani-detay-toplu-indirme {
    margin: 0;
}

    .vitrin-ani-detay-toplu-indirme button {
        display: inline-flex;
        min-height: 2.7rem;
        align-items: center;
        padding: 0.58rem 0.95rem;
        gap: 0.45rem;
        color: #ffffff;
        font: inherit;
        font-size: 0.78rem;
        font-weight: 800;
        cursor: pointer;
        background: var(--vitrin-renk-murdum);
        border: 1px solid var(--vitrin-renk-murdum);
        border-radius: 0.75rem;
        box-shadow: 0 0.55rem 1.25rem rgba(111, 45, 83, 0.18);
        white-space: nowrap;
        transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
    }

        .vitrin-ani-detay-toplu-indirme button:hover {
            color: var(--vitrin-renk-murdum);
            background: #ffffff;
            border-color: var(--vitrin-renk-murdum);
            transform: translateY(-1px);
        }

        .vitrin-ani-detay-toplu-indirme button:focus-visible {
            outline: 0.18rem solid rgba(111, 45, 83, 0.28);
            outline-offset: 0.12rem;
        }

.vitrin-ani-detay-izgara-secimi {
    display: inline-flex;
    align-items: stretch;
    padding: 0.22rem;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 0.75rem;
    box-shadow: 0 0.45rem 1.2rem rgba(38, 22, 31, 0.07);
}

    .vitrin-ani-detay-izgara-secimi button {
        display: grid;
        width: 2.8rem;
        height: 2.45rem;
        padding: 0;
        color: var(--vitrin-renk-ikincil-metin);
        cursor: pointer;
        background: transparent;
        border: 0;
        border-radius: 0.55rem;
        place-items: center;
        transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
    }

        .vitrin-ani-detay-izgara-secimi button:hover {
            color: var(--vitrin-renk-murdum);
            background: #f7eef3;
        }

        .vitrin-ani-detay-izgara-secimi button[aria-pressed="true"],
        .vitrin-ani-detay-izgara-secimi button[aria-pressed="true"]:hover {
            color: #ffffff;
            background: var(--vitrin-renk-murdum);
            box-shadow: 0 0.35rem 0.9rem rgba(111, 45, 83, 0.22);
        }

        .vitrin-ani-detay-izgara-secimi button:focus-visible {
            outline: 0.18rem solid rgba(111, 45, 83, 0.28);
            outline-offset: 0.1rem;
        }

.vitrin-ani-detay-izgara-simgesi {
    display: grid;
    width: 1.15rem;
    height: 0.95rem;
    gap: 0.16rem;
}

    .vitrin-ani-detay-izgara-simgesi > span {
        min-width: 0;
        min-height: 0;
        background: currentColor;
        border-radius: 0.08rem;
    }

.vitrin-ani-detay-izgara-simgesi--iki {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.vitrin-ani-detay-izgara-simgesi--dort {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.vitrin-ani-detay-medya-listesi {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

    .vitrin-ani-detay-medya-listesi[data-vitrin-ani-sutun-sayisi="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vitrin-ani-detay-medya-listesi[data-vitrin-ani-sutun-sayisi="4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

.vitrin-ani-detay-medya-karti {
    min-width: 0;
    overflow: hidden;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
}

.vitrin-ani-detay-medya-ac {
    display: block;
    width: 100%;
    padding: 0;
    cursor: zoom-in;
    background: transparent;
    border: 0;
}

    .vitrin-ani-detay-medya-ac:focus-visible {
        outline: 0.2rem solid var(--vitrin-renk-murdum);
        outline-offset: -0.2rem;
    }

.vitrin-ani-detay-medya-cercevesi {
    position: relative;
    display: grid;
    width: 100%;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: var(--vitrin-renk-acik-alan);
    place-items: center;
}

    .vitrin-ani-detay-medya-cercevesi img,
    .vitrin-ani-detay-medya-cercevesi video {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 180ms ease;
    }

.vitrin-ani-detay-medya-ac:hover
.vitrin-ani-detay-medya-cercevesi img,
.vitrin-ani-detay-medya-ac:hover
.vitrin-ani-detay-medya-cercevesi video {
    transform: scale(1.025);
}

.vitrin-ani-detay-video-isareti {
    position: absolute;
    display: grid;
    width: 3rem;
    height: 3rem;
    color: #ffffff;
    background: rgba(38, 22, 31, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.52);
    border-radius: 999px;
    box-shadow: 0 0.8rem 2rem rgba(26, 15, 21, 0.24);
    place-items: center;
    pointer-events: none;
}

.vitrin-ani-detay-medya-bilgisi {
    display: flex;
    align-items: center;
    padding: 0.8rem 0.9rem;
    gap: 0.75rem;
    justify-content: space-between;
}

    .vitrin-ani-detay-medya-bilgisi > div {
        display: grid;
        min-width: 0;
        gap: 0.15rem;
    }

    .vitrin-ani-detay-medya-bilgisi span {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.75rem;
    }

.vitrin-ani-detay-medya-indir {
    flex: 0 0 auto;
    padding: 0.45rem 0.7rem;
    color: var(--vitrin-renk-murdum);
    font-size: 0.75rem;
    font-weight: 800;
    text-decoration: none;
    background: #ffffff;
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 999px;
    transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

    .vitrin-ani-detay-medya-indir:hover {
        color: #ffffff;
        background: var(--vitrin-renk-murdum);
        border-color: var(--vitrin-renk-murdum);
    }

    .vitrin-ani-detay-medya-indir:focus-visible {
        outline: 0.18rem solid rgba(111, 45, 83, 0.28);
        outline-offset: 0.1rem;
    }

@media (max-width: 800px) {
    .vitrin-ani-detay-basligi,
    .vitrin-ani-detay-medya-bolumu > header {
        align-items: stretch;
        flex-direction: column;
    }

    .vitrin-ani-detay-durum-alani {
        width: 100%;
    }

    .vitrin-ani-detay-medya-araclari {
        justify-content: space-between;
    }

    .vitrin-ani-detay-izgara-secimi {
        display: none;
    }

    .vitrin-ani-detay-medya-listesi,
    .vitrin-ani-detay-medya-listesi[data-vitrin-ani-sutun-sayisi] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .vitrin-ani-karti-islemleri {
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-ani-karti-islemleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-ani-detay-basligi,
    .vitrin-ani-detay-icerik-karti,
    .vitrin-ani-detay-medya-bolumu {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-ani-detay-uyari,
    .vitrin-ani-detay-medya-yok {
        grid-template-columns: 1fr;
    }

    .vitrin-ani-detay-medya-listesi,
    .vitrin-ani-detay-medya-listesi[data-vitrin-ani-sutun-sayisi] {
        gap: 0.7rem;
    }

    .vitrin-ani-detay-medya-bilgisi {
        align-items: stretch;
        padding: 0.7rem;
        flex-direction: column;
    }

    .vitrin-ani-detay-medya-indir {
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .vitrin-ani-detay-medya-cercevesi img,
    .vitrin-ani-detay-medya-cercevesi video {
        transition: none;
    }
}

@media (max-width: 800px) {
    .vitrin-ani-detay-basligi,
    .vitrin-ani-detay-medya-bolumu > header {
        align-items: stretch;
        flex-direction: column;
    }

    .vitrin-ani-detay-durum-alani {
        width: 100%;
    }

    .vitrin-ani-detay-medya-listesi {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .vitrin-ani-karti-islemleri {
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-ani-karti-islemleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-ani-detay-basligi,
    .vitrin-ani-detay-icerik-karti,
    .vitrin-ani-detay-medya-bolumu {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-ani-detay-uyari,
    .vitrin-ani-detay-medya-yok {
        grid-template-columns: 1fr;
    }

    .vitrin-ani-detay-medya-cercevesi {
        min-height: 12rem;
    }
}

/* #endregion */


/* #region Davetiye anısı karar işlemleri */

.vitrin-ani-detay-bildirim {
    display: grid;
    align-items: center;
    padding: 1rem 1.2rem;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid;
    border-radius: var(--vitrin-kose-kucuk);
    box-shadow: var(--vitrin-golge-kucuk);
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
}

    .vitrin-ani-detay-bildirim > span {
        display: grid;
        width: 2rem;
        aspect-ratio: 1;
        border-radius: 50%;
        place-items: center;
        font-weight: 900;
    }

    .vitrin-ani-detay-bildirim p {
        margin: 0;
    }

.vitrin-ani-detay-bildirim--basarili {
    color: var(--vitrin-renk-basari);
    background: #edf7f2;
    border-color: #cce7da;
}

.vitrin-ani-detay-bildirim--hatali {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border-color: #f1ccd3;
}

.vitrin-ani-karar-karti {
    padding: clamp(1.25rem, 3vw, 2rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-ani-karar-basligi {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.1rem;
    gap: 1.5rem;
    justify-content: space-between;
}

    .vitrin-ani-karar-basligi > div {
        max-width: 45rem;
    }

    .vitrin-ani-karar-basligi h2 {
        margin-block: 0.35rem 0.5rem;
        font-size: clamp(1.45rem, 3vw, 2rem);
    }

    .vitrin-ani-karar-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
        line-height: 1.6;
    }

.vitrin-ani-karar-listesi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

    .vitrin-ani-karar-listesi > :only-child {
        grid-column: 1 / -1;
    }

.vitrin-ani-karar-ogesi {
    display: grid;
    align-content: start;
    padding: 1rem;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
}

.vitrin-ani-karar-guvenlik {
    flex: 0 0 auto;
    padding: 0.55rem 0.8rem;
    color: var(--vitrin-renk-murdum);
    background: var(--vitrin-renk-acik-alan);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-yuvarlak);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

    .vitrin-ani-karar-ogesi > form {
        grid-column: 1 / -1;
    }

    .vitrin-ani-karar-ogesi h3 {
        margin: 0 0 0.5rem;
        font-size: 1.2rem;
    }

    .vitrin-ani-karar-ogesi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.9rem;
        line-height: 1.6;
    }

.vitrin-ani-karar-ogesi--genis {
    grid-column: 1 / -1;
}

.vitrin-ani-karar-simgesi {
    display: grid;
    width: 2.75rem;
    aspect-ratio: 1;
    color: var(--vitrin-renk-murdum);
    background: var(--vitrin-renk-acik-alan);
    border-radius: 50%;
    place-items: center;
    font-size: 1.1rem;
    font-weight: 900;
}

.vitrin-ani-karar-ogesi--yayinla
.vitrin-ani-karar-simgesi {
    color: var(--vitrin-renk-basari);
    background: #e9f6ef;
}

.vitrin-ani-karar-ogesi--reddet
.vitrin-ani-karar-simgesi {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
}

.vitrin-ani-reddet-formu {
    display: grid;
    gap: 1rem;
}

    .vitrin-ani-reddet-formu textarea {
        display: block;
        width: 100%;
        min-height: 8rem;
        padding: 0.9rem 1rem;
        resize: vertical;
        color: var(--vitrin-renk-metin);
        background: var(--vitrin-renk-beyaz);
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: var(--vitrin-kose-kucuk);
        font: inherit;
        line-height: 1.6;
    }

        .vitrin-ani-reddet-formu textarea:focus {
            outline: 3px solid rgba(216, 90, 165, 0.18);
            border-color: var(--vitrin-renk-pembe);
        }

.vitrin-ani-karar-dugmesi--tehlike {
    color: var(--vitrin-renk-beyaz);
    background: var(--vitrin-renk-hata);
    border-color: var(--vitrin-renk-hata);
}

    .vitrin-ani-karar-dugmesi--tehlike:hover {
        color: var(--vitrin-renk-beyaz);
        background: #9f263d;
        border-color: #9f263d;
    }

@media (max-width: 800px) {
    .vitrin-ani-karar-basligi {
        align-items: stretch;
        flex-direction: column;
    }

    .vitrin-ani-karar-guvenlik {
        align-self: flex-start;
    }

    .vitrin-ani-karar-listesi {
        grid-template-columns: 1fr;
    }

    .vitrin-ani-karar-ogesi--genis {
        grid-column: auto;
    }
}

@media (max-width: 640px) {
    .vitrin-ani-karar-karti {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-ani-karar-ogesi {
        grid-template-columns: 1fr;
    }

        .vitrin-ani-karar-ogesi .vitrin-buton {
            width: 100%;
        }
}

/* #endregion */


/* #region Davetiye katılım raporu */

.vitrin-katilim-raporu-kabugu {
    display: grid;
    width: min(100%, 78rem);
    gap: 1.5rem;
}

.vitrin-katilim-raporu-basligi {
    display: flex;
    align-items: flex-start;
    padding: clamp(2rem, 5vw, 4rem);
    background: linear-gradient( 135deg, rgba(255, 255, 255, 0.98), rgba(244, 234, 230, 0.96));
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    gap: 2rem;
    justify-content: space-between;
}

    .vitrin-katilim-raporu-basligi > div {
        max-width: 48rem;
    }

    .vitrin-katilim-raporu-basligi h1 {
        margin-bottom: 1rem;
        font-size: clamp(2.2rem, 5vw, 4rem);
    }

    .vitrin-katilim-raporu-basligi p {
        margin-bottom: 0;
        color: var(--vitrin-renk-ikincil-metin);
        line-height: 1.75;
    }

.vitrin-katilim-son-guncellenme {
    display: inline-flex;
    align-items: center;
    margin-top: 1.25rem;
    padding: 0.5rem 0.8rem;
    color: var(--vitrin-renk-murdum);
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-yuvarlak);
    gap: 0.35rem;
    font-size: 0.82rem;
    font-weight: 700;
}

.vitrin-katilim-toplam {
    display: grid;
    flex: 0 0 auto;
    min-width: 8.5rem;
    padding: 1rem 1.25rem;
    color: var(--vitrin-renk-kirik-beyaz);
    text-align: center;
    background: var(--vitrin-renk-murdum);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-vurgu);
    line-height: 1.35;
}

    .vitrin-katilim-toplam strong {
        color: var(--vitrin-renk-beyaz);
        font-family: var(--vitrin-yazi-baslik);
        font-size: 2rem;
        font-weight: 400;
    }

/* #region Özet kartları */

.vitrin-katilim-ozet-kartlari {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.vitrin-katilim-ozet-karti {
    position: relative;
    display: grid;
    min-height: 10rem;
    padding: 1.35rem;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-kucuk);
    gap: 0.3rem;
}

    .vitrin-katilim-ozet-karti::before {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        height: 0.25rem;
        content: "";
        background: var(--vitrin-renk-sampanya);
    }

    .vitrin-katilim-ozet-karti > span {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.78rem;
        font-weight: 800;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .vitrin-katilim-ozet-karti > strong {
        color: var(--vitrin-renk-koyu-metin);
        font-family: var(--vitrin-yazi-baslik);
        font-size: clamp(2rem, 4vw, 3rem);
        font-weight: 400;
        line-height: 1;
    }

    .vitrin-katilim-ozet-karti > small {
        align-self: end;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.78rem;
        line-height: 1.5;
    }

.vitrin-katilim-ozet-karti--toplam::before {
    background: var(--vitrin-renk-murdum);
}

.vitrin-katilim-ozet-karti--katiliyor::before,
.vitrin-katilim-ozet-karti--kisi::before {
    background: var(--vitrin-renk-basari);
}

.vitrin-katilim-ozet-karti--katilamiyor::before {
    background: var(--vitrin-renk-hata);
}

.vitrin-katilim-ozet-karti--kararsiz::before {
    background: var(--vitrin-renk-uyari);
}

/* #endregion */

/* #region Ortak bölüm başlıkları */

.vitrin-katilim-bolum-basligi {
    margin-bottom: 1.5rem;
}

    .vitrin-katilim-bolum-basligi > div {
        max-width: 46rem;
    }

    .vitrin-katilim-bolum-basligi h2 {
        margin-bottom: 0.65rem;
        font-size: clamp(1.7rem, 4vw, 2.5rem);
    }

    .vitrin-katilim-bolum-basligi p {
        margin-bottom: 0;
        color: var(--vitrin-renk-ikincil-metin);
        line-height: 1.7;
    }

/* #endregion */

/* #region Katılım grupları */

.vitrin-katilim-gruplari {
    padding: clamp(1.5rem, 4vw, 3rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-katilim-grup-listesi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.vitrin-katilim-grup-karti {
    display: grid;
    align-content: start;
    padding: 1.35rem;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    gap: 1.25rem;
}

.vitrin-katilim-grup-karti-basligi {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    justify-content: space-between;
}

    .vitrin-katilim-grup-karti-basligi h3 {
        margin-bottom: 0.35rem;
        font-size: 1.45rem;
    }

    .vitrin-katilim-grup-karti-basligi p {
        margin-bottom: 0;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.86rem;
        line-height: 1.55;
    }

.vitrin-katilim-grup-pasif {
    flex: 0 0 auto;
    padding: 0.35rem 0.65rem;
    color: var(--vitrin-renk-ikincil-metin);
    background: var(--vitrin-renk-acik-alan);
    border-radius: var(--vitrin-kose-yuvarlak);
    font-size: 0.7rem;
    font-weight: 800;
}

.vitrin-katilim-grup-sayilari {
    display: grid;
    margin-bottom: 0;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.5rem;
}

    .vitrin-katilim-grup-sayilari > div {
        padding: 0.75rem 0.5rem;
        text-align: center;
        background: var(--vitrin-renk-beyaz);
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: var(--vitrin-kose-kucuk);
    }

    .vitrin-katilim-grup-sayilari dt {
        min-height: 2.5rem;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.68rem;
        font-weight: 700;
        line-height: 1.35;
    }

    .vitrin-katilim-grup-sayilari dd {
        margin: 0.35rem 0 0;
        color: var(--vitrin-renk-murdum);
        font-family: var(--vitrin-yazi-baslik);
        font-size: 1.45rem;
        line-height: 1;
    }

.vitrin-katilim-grup-baglantisi {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    color: var(--vitrin-renk-murdum);
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 800;
    text-decoration: none;
}

    .vitrin-katilim-grup-baglantisi:hover {
        gap: 0.75rem;
    }

/* #endregion */

/* #region Katılım filtreleri */

.vitrin-katilim-filtre-karti {
    padding: clamp(1.5rem, 4vw, 3rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-katilim-filtre-formu {
    display: grid;
    align-items: end;
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
    gap: 1rem;
}

.vitrin-katilim-filtre-alani {
    display: grid;
    gap: 0.45rem;
}

    .vitrin-katilim-filtre-alani label {
        color: var(--vitrin-renk-koyu-metin);
        font-size: 0.86rem;
        font-weight: 800;
    }

    .vitrin-katilim-filtre-alani select {
        width: 100%;
        min-height: 3.2rem;
        padding: 0.75rem 2.75rem 0.75rem 1rem;
        color: var(--vitrin-renk-metin);
        background-color: var(--vitrin-renk-beyaz);
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: var(--vitrin-kose-kucuk);
        cursor: pointer;
    }

        .vitrin-katilim-filtre-alani select:focus {
            outline: 3px solid rgba(216, 90, 165, 0.18);
            border-color: var(--vitrin-renk-pembe);
        }

.vitrin-katilim-filtre-islemleri {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

/* #endregion */

/* #region Davetli cevapları */

.vitrin-katilim-cevaplari {
    padding: clamp(1.5rem, 4vw, 3rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-katilim-cevaplari-basligi {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.25rem;
    gap: 1rem;
    justify-content: space-between;
}

    .vitrin-katilim-cevaplari-basligi h2 {
        margin-bottom: 0.4rem;
        font-size: clamp(1.7rem, 4vw, 2.5rem);
    }

    .vitrin-katilim-cevaplari-basligi p {
        margin-bottom: 0;
        color: var(--vitrin-renk-ikincil-metin);
    }

    .vitrin-katilim-cevaplari-basligi > span {
        flex: 0 0 auto;
        padding: 0.5rem 0.8rem;
        color: var(--vitrin-renk-murdum);
        background: var(--vitrin-renk-acik-alan);
        border-radius: var(--vitrin-kose-yuvarlak);
        font-size: 0.78rem;
        font-weight: 800;
    }

.vitrin-katilim-gizlilik-notu {
    display: grid;
    align-items: center;
    margin-bottom: 1.25rem;
    padding: 1rem 1.15rem;
    color: var(--vitrin-renk-murdum);
    background: #faf0f6;
    border: 1px solid #eccde0;
    border-radius: var(--vitrin-kose-kucuk);
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
}

    .vitrin-katilim-gizlilik-notu > span {
        display: grid;
        width: 2rem;
        aspect-ratio: 1;
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
        border-radius: 50%;
        place-items: center;
        font-family: var(--vitrin-yazi-baslik);
        font-weight: 700;
    }

    .vitrin-katilim-gizlilik-notu p {
        margin-bottom: 0;
        font-size: 0.84rem;
        line-height: 1.55;
    }

.vitrin-katilim-cevap-listesi {
    overflow: hidden;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-kucuk);
}

.vitrin-katilim-cevap-tablosu {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

    .vitrin-katilim-cevap-tablosu caption {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        border: 0;
        white-space: nowrap;
    }

    .vitrin-katilim-cevap-tablosu th {
        padding: 0.8rem 1rem;
        color: var(--vitrin-renk-ikincil-metin);
        text-align: left;
        background: var(--vitrin-renk-kirik-beyaz);
        border-bottom: 1px solid var(--vitrin-renk-cizgi);
        font-size: 0.7rem;
        font-weight: 800;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

        .vitrin-katilim-cevap-tablosu th:nth-child(1) {
            width: 20%;
        }

        .vitrin-katilim-cevap-tablosu th:nth-child(2) {
            width: 18%;
        }

        .vitrin-katilim-cevap-tablosu th:nth-child(3) {
            width: 24%;
        }

        .vitrin-katilim-cevap-tablosu th:nth-child(4) {
            width: 21%;
        }

        .vitrin-katilim-cevap-tablosu th:nth-child(5) {
            width: 17%;
        }

    .vitrin-katilim-cevap-tablosu td {
        min-width: 0;
        padding: 1rem;
        vertical-align: top;
    }

    .vitrin-katilim-cevap-tablosu tbody tr {
        transition: background-color 160ms ease, box-shadow 160ms ease;
    }

        .vitrin-katilim-cevap-tablosu tbody tr + tr td {
            border-top: 1px solid var(--vitrin-renk-cizgi);
        }

        .vitrin-katilim-cevap-tablosu tbody tr:hover {
            background: var(--vitrin-renk-kirik-beyaz);
        }

.vitrin-katilim-cevap-kimlik {
    display: grid;
    min-width: 0;
    justify-items: start;
    gap: 0.3rem;
}

    .vitrin-katilim-cevap-kimlik > strong {
        color: var(--vitrin-renk-koyu-metin);
        font-family: var(--vitrin-yazi-baslik);
        font-size: 1.05rem;
        font-weight: 500;
        line-height: 1.3;
        overflow-wrap: anywhere;
    }

.vitrin-katilim-durum {
    display: inline-flex;
    padding: 0.32rem 0.6rem;
    border: 1px solid transparent;
    border-radius: var(--vitrin-kose-yuvarlak);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.vitrin-katilim-durum--katiliyor {
    color: var(--vitrin-renk-basari);
    background: #e9f6ef;
    border-color: #c7e5d5;
}

.vitrin-katilim-durum--katilamiyor {
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border-color: #f1ccd3;
}

.vitrin-katilim-durum--kararsiz {
    color: var(--vitrin-renk-uyari);
    background: #fff7e8;
    border-color: #ead6ad;
}

.vitrin-katilim-durum--bilinmiyor {
    color: var(--vitrin-renk-ikincil-metin);
    background: var(--vitrin-renk-acik-alan);
    border-color: var(--vitrin-renk-cizgi);
}

.vitrin-katilim-cevap-grubu {
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.76rem;
    line-height: 1.4;
}

.vitrin-katilim-cevap-sayilari {
    display: grid;
    margin: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

    .vitrin-katilim-cevap-sayilari > div {
        min-width: 0;
        padding-inline: 0.5rem;
        text-align: center;
    }

        .vitrin-katilim-cevap-sayilari > div:first-child {
            padding-left: 0;
        }

        .vitrin-katilim-cevap-sayilari > div:last-child {
            padding-right: 0;
        }

        .vitrin-katilim-cevap-sayilari > div + div {
            border-left: 1px solid var(--vitrin-renk-cizgi);
        }

    .vitrin-katilim-cevap-sayilari dt {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.64rem;
        font-weight: 700;
        white-space: nowrap;
    }

    .vitrin-katilim-cevap-sayilari dd {
        margin: 0.25rem 0 0;
        color: var(--vitrin-renk-murdum);
        font-family: var(--vitrin-yazi-metin);
        font-size: 1.05rem;
        font-weight: 800;
        line-height: 1;
    }

.vitrin-katilim-cevap-iletisim {
    display: grid;
    min-width: 0;
    gap: 0.55rem;
}

    .vitrin-katilim-cevap-iletisim p,
    .vitrin-katilim-cevap-tarihleri p {
        display: grid;
        min-width: 0;
        margin: 0;
        gap: 0.1rem;
    }

    .vitrin-katilim-cevap-iletisim span,
    .vitrin-katilim-cevap-tarihleri span {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.64rem;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
    }

    .vitrin-katilim-cevap-iletisim strong {
        color: var(--vitrin-renk-koyu-metin);
        font-size: 0.8rem;
        font-weight: 700;
        line-height: 1.4;
        overflow-wrap: anywhere;
    }

.vitrin-katilim-cevap-notu {
    margin: 0;
    color: var(--vitrin-renk-metin);
    font-size: 0.8rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
    white-space: pre-line;
}

.vitrin-katilim-cevap-tarihleri {
    display: grid;
    min-width: 0;
    gap: 0.65rem;
}

    .vitrin-katilim-cevap-tarihleri time {
        color: var(--vitrin-renk-metin);
        font-size: 0.72rem;
        line-height: 1.4;
    }

.vitrin-katilim-cevap-eksik {
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.76rem;
    font-style: italic;
}

@media (max-width: 1100px) {
    .vitrin-katilim-cevap-tablosu,
    .vitrin-katilim-cevap-tablosu tbody {
        display: block;
    }

        .vitrin-katilim-cevap-tablosu colgroup,
        .vitrin-katilim-cevap-tablosu thead {
            display: none;
        }

        .vitrin-katilim-cevap-tablosu tbody tr {
            display: grid;
            padding: 0.25rem;
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

            .vitrin-katilim-cevap-tablosu tbody tr + tr {
                border-top: 1px solid var(--vitrin-renk-cizgi);
            }

                .vitrin-katilim-cevap-tablosu td,
                .vitrin-katilim-cevap-tablosu tbody tr + tr td {
                    display: grid;
                    align-content: start;
                    padding: 0.75rem;
                    border-top: 0;
                    gap: 0.55rem;
                }

                    .vitrin-katilim-cevap-tablosu td::before {
                        content: attr(data-baslik);
                        color: var(--vitrin-renk-murdum);
                        font-size: 0.66rem;
                        font-weight: 800;
                        letter-spacing: 0.04em;
                        text-transform: uppercase;
                    }

                    .vitrin-katilim-cevap-tablosu td[data-baslik="Davetli"] {
                        grid-column: 1 / -1;
                    }
}

@media (max-width: 640px) {
    .vitrin-katilim-cevap-tablosu tbody tr {
        grid-template-columns: 1fr;
    }

    .vitrin-katilim-cevap-tablosu td[data-baslik="Davetli"] {
        grid-column: auto;
    }

    .vitrin-katilim-cevap-sayilari {
        max-width: 19rem;
    }
}

.vitrin-katilim-bos {
    padding: clamp(2rem, 6vw, 4rem);
    text-align: center;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px dashed var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
}

    .vitrin-katilim-bos > span {
        display: grid;
        width: 3.5rem;
        aspect-ratio: 1;
        margin: 0 auto 1rem;
        color: var(--vitrin-renk-murdum);
        background: var(--vitrin-renk-acik-alan);
        border-radius: 50%;
        place-items: center;
        font-size: 1.4rem;
        font-weight: 900;
    }

    .vitrin-katilim-bos h3 {
        margin-bottom: 0.5rem;
        font-size: 1.6rem;
    }

    .vitrin-katilim-bos p {
        max-width: 34rem;
        margin: 0 auto;
        color: var(--vitrin-renk-ikincil-metin);
    }

/* #endregion */

/* #region Sayfalama */

.vitrin-katilim-sayfalama {
    display: grid;
    align-items: center;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-kucuk);
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 1rem;
}

    .vitrin-katilim-sayfalama > div:last-child {
        display: flex;
        justify-content: flex-end;
    }

    .vitrin-katilim-sayfalama > span {
        color: var(--vitrin-renk-murdum);
        font-size: 0.84rem;
        font-weight: 800;
        white-space: nowrap;
    }

/* #endregion */

/* #region Katılım raporu responsive görünümü */

@media (max-width: 1000px) {
    .vitrin-katilim-ozet-kartlari {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vitrin-katilim-grup-listesi,
    .vitrin-katilim-cevap-listesi {
        grid-template-columns: 1fr;
    }

    .vitrin-katilim-filtre-formu {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vitrin-katilim-filtre-islemleri {
        grid-column: 1 / -1;
    }

    .vitrin-katilim-cevap-karti {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

        .vitrin-katilim-cevap-karti >
        .vitrin-katilim-cevap-karti-basligi,
        .vitrin-katilim-cevap-karti >
        .vitrin-katilim-cevap-sayilari,
        .vitrin-katilim-cevap-karti >
        .vitrin-katilim-cevap-ayrintilari {
            grid-column: 1;
            grid-row: auto;
        }
}

@media (max-width: 700px) {
    .vitrin-katilim-raporu-basligi,
    .vitrin-katilim-cevaplari-basligi {
        align-items: stretch;
        flex-direction: column;
    }

    .vitrin-katilim-toplam {
        width: 100%;
    }

    .vitrin-katilim-grup-sayilari {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .vitrin-katilim-cevap-karti-basligi {
        align-items: stretch;
        flex-direction: column;
    }

        .vitrin-katilim-cevap-karti-basligi time {
            white-space: normal;
        }
}

@media (max-width: 640px) {
    .vitrin-katilim-raporu-basligi,
    .vitrin-katilim-gruplari,
    .vitrin-katilim-filtre-karti,
    .vitrin-katilim-cevaplari {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-katilim-ozet-kartlari,
    .vitrin-katilim-filtre-formu {
        grid-template-columns: 1fr;
    }

    .vitrin-katilim-filtre-islemleri {
        align-items: stretch;
        flex-direction: column;
        grid-column: auto;
    }

        .vitrin-katilim-filtre-islemleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-katilim-grup-sayilari {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .vitrin-katilim-grup-sayilari > div:last-child {
            grid-column: 1 / -1;
        }

    .vitrin-katilim-iletisim {
        grid-template-columns: 1fr;
    }

    .vitrin-katilim-gizlilik-notu {
        align-items: start;
        grid-template-columns: 1fr;
    }

    .vitrin-katilim-sayfalama {
        grid-template-columns: 1fr;
        text-align: center;
    }

        .vitrin-katilim-sayfalama > div,
        .vitrin-katilim-sayfalama > div:last-child {
            display: block;
        }

        .vitrin-katilim-sayfalama .vitrin-buton {
            width: 100%;
        }
}

/* #endregion */

/* #endregion */


/* #region Hesap alt sayfa başlıkları ve sayaçlar */

.vitrin-etkilesim-basligi .vitrin-hesap-davetiye-adi,
.vitrin-anilar-basligi .vitrin-hesap-davetiye-adi,
.vitrin-katilim-raporu-basligi .vitrin-hesap-davetiye-adi {
    margin: -0.35rem 0 0.9rem;
    color: var(--vitrin-renk-murdum);
    font-family: var(--vitrin-yazi-metin);
    font-size: clamp(0.92rem, 1.8vw, 1.05rem);
    font-weight: 800;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.vitrin-anilar-basligi > div,
.vitrin-katilim-raporu-basligi > div,
.vitrin-ani-detay-basligi > div:first-child {
    min-width: 0;
    flex: 1 1 auto;
}

.vitrin-anilar-basligi h1,
.vitrin-ani-detay-basligi h1,
.vitrin-katilim-raporu-basligi h1 {
    font-size: clamp(1.9rem, 4vw, 3rem);
}

.vitrin-hesabim-sayi,
.vitrin-anilar-toplam strong,
.vitrin-katilim-toplam strong,
.vitrin-katilim-ozet-karti > strong,
.vitrin-katilim-grup-sayilari dd,
.vitrin-katilim-cevap-sayilari dd {
    font-family: var(--vitrin-yazi-metin);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

/* #endregion */


/* #region Hesap güvenliği */

.vitrin-hesap-guvenlik-geri {
    display: inline-flex;
    align-items: center;
    margin-bottom: 1.5rem;
    color: var(--vitrin-renk-murdum);
    gap: 0.45rem;
    font-size: 0.86rem;
    font-weight: 800;
    text-decoration: none;
}

    .vitrin-hesap-guvenlik-geri:hover {
        color: var(--vitrin-renk-pembe);
        gap: 0.65rem;
    }

.vitrin-hesap-guvenlik-kurallari {
    margin: 1.5rem 0;
    padding: 1rem 1.15rem;
    color: var(--vitrin-renk-metin);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
}

    .vitrin-hesap-guvenlik-kurallari strong {
        display: block;
        margin-bottom: 0.65rem;
        color: var(--vitrin-renk-murdum);
        font-size: 0.88rem;
    }

    .vitrin-hesap-guvenlik-kurallari ul {
        display: grid;
        margin: 0;
        padding: 0;
        list-style: none;
        gap: 0.45rem;
    }

    .vitrin-hesap-guvenlik-kurallari li {
        display: grid;
        align-items: start;
        color: var(--vitrin-renk-ikincil-metin);
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.55rem;
        font-size: 0.82rem;
        line-height: 1.55;
    }

        .vitrin-hesap-guvenlik-kurallari li::before {
            color: var(--vitrin-renk-basari);
            content: "✓";
            font-weight: 900;
        }

.vitrin-hesap-bilgi-notu--basarili {
    margin: 1.25rem 0;
    color: var(--vitrin-renk-basari);
    background: #edf7f2;
    border-color: #cce7da;
    font-weight: 700;
}

/* #endregion */


/* #region Müşteri paylaşım görünümü */

.vitrin-paylasim-sekmeleri {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem;
    padding: .5rem;
    margin: 1.5rem 0;
    background: #f5ecef;
    border: 1px solid #e8d8e0;
    border-radius: 1.25rem;
    scroll-margin-top: 7rem;
}
.vitrin-paylasim-sekmeleri a {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: 1.1rem 1.25rem;
    border-radius: .9rem;
    color: #65334f;
    text-decoration: none;
}
.vitrin-paylasim-sekmeleri a[aria-selected="true"] {
    background: #65334f;
    color: white;
    box-shadow: 0 .35rem .9rem #65334f26;
}
.vitrin-paylasim-sekmeleri strong { display: block; font-size: 1rem; }
.vitrin-paylasim-sekmeleri small { display: block; margin-top: .2rem; font-size: .8rem; }
.vitrin-paylasim-sekme-sira {
    display: grid; place-items: center; flex: 0 0 2.3rem;
    height: 2.3rem; border: 1px solid currentColor; border-radius: 50%; font-size: .75rem;
}
.vitrin-paylasim-sekmeleri a:focus-visible { outline: 3px solid #c59a5b; outline-offset: 3px; }
.vitrin-paylasim-sekme-paneli { scroll-margin-top: 7rem; }
.vitrin-paylasim-sekme-paneli[hidden],
.vitrin-paylasim-kaydedilmemis[hidden] { display: none !important; }
.vitrin-paylasim-sekme-gecis {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    margin: 1.5rem 0 0;
    padding: clamp(1.25rem, 3vw, 2rem);
    background: #fff;
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}
.vitrin-paylasim-sekme-gecis > p { margin: 0; line-height: 1.65; }
.vitrin-paylasim-sekme-gecis > a { flex-shrink: 0; text-align: center; }
.vitrin-paylasim-kaydedilmemis { padding: 1.2rem; margin-bottom: 1rem; background: #fff5df; border: 1px solid #d9ba7c; border-radius: 1rem; color: #513e25; }
@media (max-width: 600px) {
    .vitrin-paylasim-sekmeleri a { padding: .85rem .65rem; gap: .5rem; }
    .vitrin-paylasim-sekmeleri strong { font-size: .85rem; }
    .vitrin-paylasim-sekmeleri small { font-size: .7rem; }
    .vitrin-paylasim-sekme-sira { display: none; }
    .vitrin-paylasim-sekme-gecis { flex-direction: column; align-items: stretch; }
}

.vitrin-paylasim-gorunumu-icerigi {
    display: grid;
    align-items: start;
    grid-template-columns: minmax(0, 1.45fr) minmax(18rem, 0.75fr);
    gap: 1.5rem;
}

.vitrin-paylasim-etkinlik-satiri {
    white-space: pre-line;
}

.vitrin-paylasim-eylem-metni {
    margin-top: 0.4rem !important;
    color: #4f283f;
    font-weight: 800;
}

.vitrin-paylasim-bilgi-karti {
    order: 1;
}

.vitrin-paylasim-kart-onizlemesi {
    order: 2;
}

.vitrin-paylasim-kart-onizlemesi,
.vitrin-paylasim-bilgi-karti {
    overflow: hidden;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
}

.vitrin-paylasim-kart-onizlemesi {
    position: sticky;
    top: 6.5rem;
    padding: clamp(1.25rem, 3vw, 2rem);
}

.vitrin-paylasim-onizleme-basligi {
    margin-bottom: 1.25rem;
}

    .vitrin-paylasim-onizleme-basligi h2 {
        margin: 0.35rem 0 0.55rem;
        font-size: clamp(1.45rem, 3vw, 2rem);
    }

    .vitrin-paylasim-onizleme-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
        line-height: 1.65;
    }

.vitrin-paylasim-telefon-onizlemesi {
    width: min(100%, 27rem);
    margin-inline: auto;
    overflow: hidden;
    background: #efe8df;
    border: 0.4rem solid #292327;
    border-radius: 1.75rem;
    box-shadow: 0 1.25rem 2.5rem rgba(38, 22, 33, 0.18);
}

.vitrin-paylasim-telefon-ust-alani {
    display: grid;
    min-height: 4.25rem;
    padding: 0.65rem 0.9rem;
    align-items: center;
    color: #ffffff;
    background: #174f45;
    grid-template-columns: auto auto minmax(0, 1fr);
    gap: 0.7rem;
}

.vitrin-paylasim-telefon-geri {
    font-size: 2rem;
    line-height: 1;
}

.vitrin-paylasim-telefon-avatar {
    display: grid;
    width: 2.6rem;
    aspect-ratio: 1;
    color: #ffffff;
    background: linear-gradient(135deg, #6d2c54, #d85aa5);
    border-radius: 50%;
    place-items: center;
    font-size: 0.72rem;
    font-weight: 900;
}

.vitrin-paylasim-telefon-hesabi {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
}

    .vitrin-paylasim-telefon-hesabi strong,
    .vitrin-paylasim-telefon-hesabi small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .vitrin-paylasim-telefon-hesabi small {
        color: rgba(255, 255, 255, 0.74);
        font-size: 0.7rem;
    }

.vitrin-paylasim-sohbet-alani {
    min-height: 32rem;
    padding: 1.5rem 1rem;
    background-color: #e8dfd5;
    background-image: radial-gradient( circle at 15% 20%, rgba(109, 44, 84, 0.06) 0 0.16rem, transparent 0.18rem ), radial-gradient( circle at 80% 70%, rgba(216, 90, 165, 0.06) 0 0.13rem, transparent 0.15rem );
    background-size: 2.5rem 2.5rem, 3rem 3rem;
}

.vitrin-paylasim-mesaj-balonu {
    display: grid;
    width: min(88%, 21rem);
    margin-left: auto;
    padding: 0.25rem;
    background: #d9fdd3;
    border-radius: 0.85rem 0.2rem 0.85rem 0.85rem;
    box-shadow: 0 0.35rem 1rem rgba(28, 39, 34, 0.11);
    gap: 0.2rem;
}

.vitrin-paylasim-baglanti-karti {
    overflow: hidden;
    background: #ffffff;
    border-radius: 0.75rem;
}

.vitrin-paylasim-kart-gorseli {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1200 / 630;
    background: #faf5f0;
}

    .vitrin-paylasim-kart-gorseli img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

.vitrin-paylasim-gorsel-bekleme {
    display: grid;
    width: 100%;
    height: 100%;
    padding: 2rem;
    text-align: center;
    place-content: center;
    place-items: center;
    gap: 0.6rem;
}

    .vitrin-paylasim-gorsel-bekleme > span {
        display: grid;
        width: 3.5rem;
        aspect-ratio: 1;
        color: var(--vitrin-renk-pembe);
        background: rgba(216, 90, 165, 0.1);
        border-radius: 50%;
        place-items: center;
        font-size: 1.6rem;
    }

    .vitrin-paylasim-gorsel-bekleme small {
        max-width: 25rem;
        color: var(--vitrin-renk-ikincil-metin);
    }

.vitrin-paylasim-kart-metni {
    display: grid;
    padding: 0.65rem 0.75rem 0.75rem;
    gap: 0.22rem;
}

    .vitrin-paylasim-kart-metni > span {
        color: #6d656a;
        font-size: 0.56rem;
        font-weight: 800;
        letter-spacing: 0.04em;
    }

    .vitrin-paylasim-kart-metni h2 {
        margin: 0;
        color: #30262c;
        font-family: Arial, sans-serif;
        font-size: 14px;
        line-height: 1.2;
        overflow-wrap: anywhere;
    }

    .vitrin-paylasim-kart-metni p {
        margin: 0;
        color: #6d656a;
        font-family: Arial, sans-serif;
        font-size: 13px;
        line-height: 1.38;
        overflow-wrap: anywhere;
    }

        .vitrin-paylasim-kart-metni p > span {
            display: inline;
        }

            .vitrin-paylasim-kart-metni p > span + span {
                margin-top: 0.12rem;
            }

.vitrin-paylasim-mesaj-zamani {
    padding: 0 0.35rem 0.15rem;
    color: #63736a;
    font-size: 0.56rem;
    text-align: right;
}

    .vitrin-paylasim-mesaj-zamani span {
        color: #1686b3;
        font-weight: 900;
    }

.vitrin-paylasim-onizleme-notu {
    max-width: 35rem;
    margin: 1rem auto 0;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.76rem;
    line-height: 1.6;
    text-align: center;
}

.vitrin-paylasim-bilgi-karti {
    padding: clamp(1.5rem, 4vw, 2.25rem);
}

    .vitrin-paylasim-bilgi-karti > h2 {
        margin: 0.35rem 0 1.25rem;
        font-size: clamp(1.5rem, 3vw, 2rem);
    }

.vitrin-paylasim-bilgileri {
    display: grid;
    margin: 0;
    gap: 0;
}

    .vitrin-paylasim-bilgileri > div {
        display: grid;
        padding: 0.9rem 0;
        border-bottom: 1px solid var(--vitrin-renk-cizgi);
        gap: 0.25rem;
    }

    .vitrin-paylasim-bilgileri dt {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.76rem;
        font-weight: 800;
    }

    .vitrin-paylasim-bilgileri dd {
        margin: 0;
        color: var(--vitrin-renk-metin);
        font-weight: 800;
        overflow-wrap: anywhere;
    }

.vitrin-paylasim-bilgilendirmesi {
    margin: 1.25rem 0 0;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.86rem;
    line-height: 1.7;
}

.vitrin-paylasim-red-bilgisi {
    margin-top: 1.25rem;
    padding: 1rem;
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border: 1px solid #f1ccd3;
    border-radius: var(--vitrin-kose-kucuk);
}

    .vitrin-paylasim-red-bilgisi p {
        margin: 0.35rem 0 0;
    }

.vitrin-paylasim-islem-bildirimi {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    padding: 1rem 1.2rem;
    border-radius: var(--vitrin-kose-orta);
    gap: 0.9rem;
}

    .vitrin-paylasim-islem-bildirimi > span {
        display: grid;
        flex: 0 0 auto;
        width: 2rem;
        aspect-ratio: 1;
        color: var(--vitrin-renk-beyaz);
        border-radius: 50%;
        place-items: center;
        font-weight: 900;
    }

    .vitrin-paylasim-islem-bildirimi strong,
    .vitrin-paylasim-islem-bildirimi p {
        display: block;
        margin: 0;
    }

    .vitrin-paylasim-islem-bildirimi p {
        margin-top: 0.2rem;
        font-size: 0.9rem;
    }

.vitrin-paylasim-islem-bildirimi--basarili {
    color: #205f45;
    background: #edf8f2;
    border: 1px solid #bfdfcf;
}

    .vitrin-paylasim-islem-bildirimi--basarili > span {
        background: var(--vitrin-renk-basari);
    }

.vitrin-paylasim-ayirici {
    height: 1px;
    margin: 1.75rem 0;
    background: var(--vitrin-renk-cizgi);
}

.vitrin-paylasim-form-basligi {
    margin-bottom: 1.25rem;
}

    .vitrin-paylasim-form-basligi h3 {
        margin: 0.35rem 0 0.6rem;
        color: var(--vitrin-renk-koyu-metin);
        font-family: var(--vitrin-yazi-baslik);
        font-size: clamp(1.35rem, 3vw, 1.8rem);
        font-weight: 400;
    }

    .vitrin-paylasim-form-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.88rem;
        line-height: 1.7;
    }

.vitrin-paylasim-hata-ozeti {
    margin-bottom: 1rem;
    padding: 1rem;
    color: var(--vitrin-renk-hata);
    background: #fff0f2;
    border: 1px solid #f1ccd3;
    border-radius: var(--vitrin-kose-kucuk);
    font-size: 0.86rem;
}

    .vitrin-paylasim-hata-ozeti ul {
        margin: 0;
        padding-left: 1.1rem;
    }

.vitrin-paylasim-dosya-alani {
    position: relative;
    display: grid;
    align-items: center;
    grid-template-columns: auto minmax(0, 1fr);
    padding: 0.55rem;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px dashed var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    gap: 0.75rem;
    transition: border-color var(--vitrin-gecis), box-shadow var(--vitrin-gecis);
}

    .vitrin-paylasim-dosya-alani:focus-within {
        border-color: var(--vitrin-renk-pembe);
        box-shadow: 0 0 0 3px rgba(216, 90, 165, 0.12);
    }

    .vitrin-paylasim-dosya-alani input[type="file"] {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
    }

.vitrin-paylasim-dosya-sec {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0.65rem 0.9rem;
    color: var(--vitrin-renk-beyaz);
    background: var(--vitrin-renk-murdum);
    border-radius: var(--vitrin-kose-yuvarlak);
    cursor: pointer;
    gap: 0.4rem;
    font-size: 0.82rem;
    font-weight: 800;
    transition: background var(--vitrin-gecis), transform var(--vitrin-gecis);
}

    .vitrin-paylasim-dosya-sec:hover {
        background: var(--vitrin-renk-gece);
        transform: translateY(-1px);
    }

.vitrin-paylasim-dosya-adi {
    min-width: 0;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.82rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vitrin-paylasim-dosya-adi--hata {
    color: var(--vitrin-renk-hata);
    white-space: normal;
}

.vitrin-paylasim-dosya-aciklamasi {
    display: block;
    margin-top: 0.65rem;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.76rem;
    line-height: 1.6;
}

.vitrin-paylasim-izin-alani {
    display: grid;
    align-items: start;
    grid-template-columns: auto minmax(0, 1fr);
    margin-top: 1.25rem;
    padding: 1rem;
    color: var(--vitrin-renk-metin);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    cursor: pointer;
    gap: 0.75rem;
    font-size: 0.82rem;
    line-height: 1.65;
}

    .vitrin-paylasim-izin-alani input {
        width: 1.15rem;
        height: 1.15rem;
        margin-top: 0.15rem;
        accent-color: var(--vitrin-renk-murdum);
    }

.vitrin-paylasim-kaydet-dugmesi {
    width: 100%;
    min-height: 3.15rem;
    margin-top: 1.25rem;
    padding: 0.8rem 1.2rem;
    color: var(--vitrin-renk-beyaz);
    background: linear-gradient( 110deg, var(--vitrin-renk-murdum), var(--vitrin-renk-pembe) );
    border: 0;
    border-radius: var(--vitrin-kose-yuvarlak);
    box-shadow: var(--vitrin-golge-vurgu);
    cursor: pointer;
    font: inherit;
    font-size: 0.88rem;
    font-weight: 900;
    transition: filter var(--vitrin-gecis), transform var(--vitrin-gecis);
}

    .vitrin-paylasim-kaydet-dugmesi:hover:not(:disabled) {
        filter: brightness(1.06);
        transform: translateY(-1px);
    }

    .vitrin-paylasim-kaydet-dugmesi:disabled {
        cursor: wait;
        filter: grayscale(0.25);
        opacity: 0.72;
    }

.vitrin-paylasim-varsayilana-donus {
    display: grid;
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
}

    .vitrin-paylasim-varsayilana-donus strong {
        display: block;
        color: var(--vitrin-renk-koyu-metin);
        font-size: 0.92rem;
    }

    .vitrin-paylasim-varsayilana-donus p {
        margin: 0.3rem 0 0;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.8rem;
        line-height: 1.6;
    }

.vitrin-paylasim-varsayilana-don-dugmesi {
    min-height: 2.75rem;
    padding: 0.65rem 1rem;
    color: var(--vitrin-renk-murdum);
    background: transparent;
    border: 1px solid var(--vitrin-renk-murdum);
    border-radius: var(--vitrin-kose-yuvarlak);
    cursor: pointer;
    font: inherit;
    font-size: 0.8rem;
    font-weight: 800;
    white-space: nowrap;
    transition: color var(--vitrin-gecis), background var(--vitrin-gecis), transform var(--vitrin-gecis);
}

    .vitrin-paylasim-varsayilana-don-dugmesi:hover {
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
        transform: translateY(-1px);
    }

@media (max-width: 640px) {
    .vitrin-paylasim-varsayilana-donus {
        grid-template-columns: 1fr;
    }

    .vitrin-paylasim-varsayilana-don-dugmesi {
        width: 100%;
    }
}

@media (max-width: 1000px) {
    .vitrin-paylasim-gorunumu-icerigi {
        grid-template-columns: 1fr;
    }

    .vitrin-paylasim-kart-onizlemesi {
        position: static;
    }
}

@media (max-width: 640px) {
    .vitrin-paylasim-kart-onizlemesi {
        padding: 0.65rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-paylasim-bilgi-karti {
        padding: 1.5rem 1.25rem;
        border-radius: var(--vitrin-kose-orta);
    }

    .vitrin-paylasim-gorsel-bekleme {
        padding: 1.25rem;
    }

    .vitrin-paylasim-dosya-alani {
        grid-template-columns: 1fr;
    }

    .vitrin-paylasim-dosya-sec {
        justify-content: center;
    }

    .vitrin-paylasim-dosya-adi {
        padding: 0 0.35rem 0.35rem;
        text-align: center;
        white-space: normal;
    }
}

.vitrin-paylasim-ayarlari-formu {
    display: grid;
    gap: 1.25rem;
}

.vitrin-paylasim-form-alani {
    display: grid;
    gap: 0.5rem;
}

    .vitrin-paylasim-form-alani > label {
        color: var(--vitrin-renk-koyu-metin);
        font-size: 0.84rem;
        font-weight: 800;
    }

    .vitrin-paylasim-form-alani > input,
    .vitrin-paylasim-form-alani > textarea {
        display: block;
        width: 100%;
        min-width: 0;
        padding: 0.85rem 1rem;
        color: var(--vitrin-renk-metin);
        background: var(--vitrin-renk-kirik-beyaz);
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: var(--vitrin-kose-kucuk);
        outline: none;
        font: inherit;
        font-size: 0.88rem;
        line-height: 1.6;
        transition: border-color var(--vitrin-gecis), box-shadow var(--vitrin-gecis), background var(--vitrin-gecis);
    }

    .vitrin-paylasim-form-alani > textarea {
        min-height: 7rem;
        resize: vertical;
    }

        .vitrin-paylasim-form-alani > input:focus,
        .vitrin-paylasim-form-alani > textarea:focus {
            background: var(--vitrin-renk-beyaz);
            border-color: var(--vitrin-renk-pembe);
            box-shadow: 0 0 0 3px rgba(216, 90, 165, 0.12);
        }

    .vitrin-paylasim-form-alani > small {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.74rem;
        line-height: 1.55;
    }

.vitrin-paylasim-kaynak-secimi {
    display: grid;
    margin: 0;
    padding: 0;
    border: 0;
    gap: 0.7rem;
}

    .vitrin-paylasim-kaynak-secimi legend {
        width: 100%;
        margin-bottom: 0.15rem;
        padding: 0;
        color: var(--vitrin-renk-koyu-metin);
        font-size: 0.84rem;
        font-weight: 800;
    }

.vitrin-paylasim-kaynak-karti {
    position: relative;
    display: grid;
    align-items: start;
    grid-template-columns: auto minmax(0, 1fr);
    padding: 0.9rem;
    color: var(--vitrin-renk-metin);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    cursor: pointer;
    gap: 0.75rem;
    transition: border-color var(--vitrin-gecis), box-shadow var(--vitrin-gecis), transform var(--vitrin-gecis);
}

    .vitrin-paylasim-kaynak-karti:hover {
        border-color: rgba(109, 44, 84, 0.42);
        transform: translateY(-1px);
    }

.vitrin-paylasim-kaynak-karti--secili {
    background: #fff8fc;
    border-color: var(--vitrin-renk-pembe);
    box-shadow: 0 0 0 3px rgba(216, 90, 165, 0.1);
}

.vitrin-paylasim-kaynak-karti input {
    width: 1.1rem;
    height: 1.1rem;
    margin: 0.15rem 0 0;
    accent-color: var(--vitrin-renk-murdum);
}

.vitrin-paylasim-kaynak-karti > span {
    display: grid;
    min-width: 0;
    gap: 0.25rem;
}

.vitrin-paylasim-kaynak-karti strong {
    color: var(--vitrin-renk-koyu-metin);
    font-size: 0.86rem;
}

.vitrin-paylasim-kaynak-karti small {
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.75rem;
    line-height: 1.55;
}

.vitrin-paylasim-katalog-secimi {
    display: grid;
    padding: 1rem;
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    gap: 0.9rem;
}

    .vitrin-paylasim-katalog-secimi[hidden] {
        display: none;
    }

    .vitrin-paylasim-katalog-secimi > header {
        display: grid;
        gap: 0.25rem;
    }

        .vitrin-paylasim-katalog-secimi > header strong {
            color: var(--vitrin-renk-koyu-metin);
            font-size: 0.86rem;
        }

        .vitrin-paylasim-katalog-secimi > header small {
            color: var(--vitrin-renk-ikincil-metin);
            font-size: 0.74rem;
            line-height: 1.55;
        }

.vitrin-paylasim-katalog-listesi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.vitrin-paylasim-katalog-karti {
    position: relative;
    display: grid;
    align-content: start;
    overflow: hidden;
    color: var(--vitrin-renk-metin);
    background: var(--vitrin-renk-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    cursor: pointer;
    transition: border-color var(--vitrin-gecis), box-shadow var(--vitrin-gecis), transform var(--vitrin-gecis);
}

    .vitrin-paylasim-katalog-karti:hover {
        border-color: rgba(109, 44, 84, 0.45);
        transform: translateY(-2px);
    }

.vitrin-paylasim-katalog-karti--secili {
    border-color: var(--vitrin-renk-pembe);
    box-shadow: 0 0 0 3px rgba(216, 90, 165, 0.12);
}

.vitrin-paylasim-katalog-karti input {
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    width: 1.15rem;
    height: 1.15rem;
    margin: 0;
    accent-color: var(--vitrin-renk-murdum);
    z-index: 1;
}

.vitrin-paylasim-katalog-karti img {
    display: block;
    width: 100%;
    aspect-ratio: 1.91 / 1;
    object-fit: cover;
    background: var(--vitrin-renk-acik-alan);
}

.vitrin-paylasim-katalog-karti > span {
    display: block;
    min-width: 0;
    padding: 0.65rem 0.75rem;
    font-size: 0.76rem;
    font-weight: 800;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.vitrin-paylasim-araclari {
    display: grid;
    margin-top: 1.5rem;
    padding: clamp(1.25rem, 3vw, 2rem);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: var(--vitrin-golge-orta);
    gap: 1.4rem;
}

.vitrin-paylasim-araclari-basligi {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

    .vitrin-paylasim-araclari-basligi h2 {
        margin: 0.3rem 0 0.45rem;
        color: var(--vitrin-renk-koyu-metin);
        font-family: var(--vitrin-yazi-baslik);
        font-size: clamp(1.55rem, 3vw, 2.15rem);
        font-weight: 400;
    }

    .vitrin-paylasim-araclari-basligi p {
        max-width: 46rem;
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
        line-height: 1.65;
    }

.vitrin-paylasim-hazir-etiketi {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    min-height: 2.35rem;
    padding: 0.45rem 0.8rem;
    color: #176344;
    background: #edf8f2;
    border: 1px solid #bfdfcf;
    border-radius: var(--vitrin-kose-yuvarlak);
    gap: 0.4rem;
    font-size: 0.78rem;
    font-weight: 900;
}

.vitrin-paylasim-araclari-listesi {
    display: grid;
    gap: 1rem;
}

.vitrin-paylasim-arac-karti {
    display: grid;
    padding: clamp(1rem, 2.5vw, 1.5rem);
    background: var(--vitrin-renk-kirik-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    gap: 1rem;
}

.vitrin-paylasim-arac-kart-basligi {
    display: grid;
    align-items: start;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
}

    .vitrin-paylasim-arac-kart-basligi > span {
        display: grid;
        width: 2.35rem;
        aspect-ratio: 1;
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
        border-radius: 50%;
        place-items: center;
        font-size: 0.72rem;
        font-weight: 900;
    }

    .vitrin-paylasim-arac-kart-basligi h3 {
        margin: 0 0 0.25rem;
        color: var(--vitrin-renk-koyu-metin);
        font-family: var(--vitrin-yazi-baslik);
        font-size: clamp(1.25rem, 2.5vw, 1.65rem);
        font-weight: 400;
    }

    .vitrin-paylasim-arac-kart-basligi p {
        margin: 0;
        color: var(--vitrin-renk-ikincil-metin);
        font-size: 0.82rem;
        line-height: 1.55;
    }

.vitrin-paylasim-hazir-metni {
    width: 100%;
    min-height: 10rem;
    padding: 1rem;
    resize: vertical;
    color: var(--vitrin-renk-metin);
    background: var(--vitrin-renk-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    font: inherit;
    font-size: 0.84rem;
    line-height: 1.65;
}

.vitrin-paylasim-arac-eylemleri {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.vitrin-paylasim-arac-dugmesi {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--vitrin-kose-yuvarlak);
    cursor: pointer;
    font: inherit;
    font-size: 0.8rem;
    font-weight: 900;
    text-align: center;
    text-decoration: none;
    transition: filter var(--vitrin-gecis), transform var(--vitrin-gecis);
}

    .vitrin-paylasim-arac-dugmesi:hover {
        filter: brightness(1.04);
        transform: translateY(-1px);
    }

.vitrin-paylasim-arac-dugmesi--ana {
    color: var(--vitrin-renk-beyaz);
    background: var(--vitrin-renk-murdum);
}

.vitrin-paylasim-arac-dugmesi--ikincil {
    color: var(--vitrin-renk-murdum);
    background: #f6edf2;
    border-color: #dfcad5;
}

/* Yalnız OG başlığı ve açıklaması: gönderilmeyen bağımsız bilgi/CTA alanı yok. */
.vitrin-paylasim-kart-metni h2,
.vitrin-paylasim-kart-metni p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.vitrin-paylasim-arac-eylemleri.paylasim-gonderme-eylemleri {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
    gap: 0.85rem;
}

.paylasim-gonderme-eylemleri .vitrin-paylasim-arac-dugmesi {
    min-height: 3.5rem;
    padding: 0.95rem 1.25rem;
    font-size: 0.95rem;
    border-radius: 0.9rem;
}

.paylasim-gonderme-eylemleri [data-paylasim-whatsapp],
.paylasim-gonderme-eylemleri [data-paylasim-whatsapp-web] {
    color: #fff;
    background: #146c46;
}

.paylasim-gonderme-eylemleri [data-davetiye-paylas] {
    color: #542c46;
    background: #fff;
    border: 2px solid #754362;
}

.paylasim-gonderme-eylemleri [hidden] { display: none; }

.paylasim-gonderme-eylemleri :focus-visible {
    outline: 3px solid #754362;
    outline-offset: 4px;
}

.vitrin-paylasim-arac-dugmesi--cerceveli {
    color: var(--vitrin-renk-murdum);
    background: transparent;
    border-color: var(--vitrin-renk-altin);
}

.vitrin-paylasim-baglanti-satiri {
    display: grid;
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.7rem;
}

    .vitrin-paylasim-baglanti-satiri input {
        width: 100%;
        min-width: 0;
        min-height: 2.75rem;
        padding: 0.7rem 0.85rem;
        color: var(--vitrin-renk-metin);
        background: var(--vitrin-renk-beyaz);
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: var(--vitrin-kose-kucuk);
        font: inherit;
        font-size: 0.8rem;
    }

.vitrin-paylasim-qr-gorseli {
    display: grid;
    width: min(100%, 16rem);
    margin-inline: auto;
    padding: 0.85rem;
    background: var(--vitrin-renk-beyaz);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: var(--vitrin-golge-hafif);
    place-items: center;
}

    .vitrin-paylasim-qr-gorseli img {
        display: block;
        width: 100%;
        height: auto;
    }

.vitrin-paylasim-qr-aciklamasi {
    margin: 0;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: 0.82rem;
    line-height: 1.6;
    text-align: center;
}

.vitrin-paylasim-qr-eylemleri {
    justify-content: center;
}

.vitrin-paylasim-araclari-kapali {
    display: grid;
    align-items: center;
    grid-template-columns: auto minmax(0, 1fr);
    padding: 1rem;
    color: #77531b;
    background: #fff8e6;
    border: 1px solid #ead29b;
    border-radius: var(--vitrin-kose-orta);
    gap: 0.8rem;
}

    .vitrin-paylasim-araclari-kapali > span {
        display: grid;
        width: 2.5rem;
        aspect-ratio: 1;
        background: rgba(201, 151, 60, 0.15);
        border-radius: 50%;
        place-items: center;
    }

    .vitrin-paylasim-araclari-kapali strong,
    .vitrin-paylasim-araclari-kapali p {
        display: block;
        margin: 0;
    }

    .vitrin-paylasim-araclari-kapali p {
        margin-top: 0.25rem;
        font-size: 0.82rem;
        line-height: 1.55;
    }

@media (max-width: 700px) {
    .vitrin-paylasim-araclari-basligi {
        display: grid;
    }

    .vitrin-paylasim-hazir-etiketi {
        justify-self: start;
    }

    .vitrin-paylasim-baglanti-satiri {
        grid-template-columns: 1fr;
    }

        .vitrin-paylasim-baglanti-satiri .vitrin-paylasim-arac-dugmesi,
        .vitrin-paylasim-arac-eylemleri .vitrin-paylasim-arac-dugmesi {
            width: 100%;
        }
}

@media (max-width: 420px) {
    .vitrin-paylasim-katalog-listesi {
        grid-template-columns: 1fr;
    }
}

/* #endregion */


/* #FOTOĞRAF KIRPMA region*/

.vitrin-paylasim-kirpma-dialogu {
    box-sizing: border-box;
    width: min(96vw, 60rem);
    max-width: none;
    max-height: 96dvh;
    margin: auto;
    padding: 0;
    color: #30262a;
    background: transparent;
    border: 0;
    overflow: visible;
}

.vitrin-paylasim-kirpma-dialogu::backdrop {
    background: rgba(18, 6, 20, 0.82);
    backdrop-filter: blur(7px);
}

.vitrin-paylasim-kirpma-karti {
    --vitrin-kirpma-kart-boslugu: clamp(1rem, 3vw, 1.75rem);

    box-sizing: border-box;
    width: 100%;
    max-height: 94dvh;
    padding:
        var(--vitrin-kirpma-kart-boslugu)
        var(--vitrin-kirpma-kart-boslugu)
        0;
    color: #30262a;
    background: #fffaf6;
    border: 1px solid #e7d8d1;
    border-radius: var(--vitrin-kose-buyuk);
    box-shadow: 0 2rem 5rem rgba(14, 4, 16, 0.38);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.vitrin-paylasim-kirpma-basligi {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.vitrin-paylasim-kirpma-basligi h3 {
    margin: 0.35rem 0 0.45rem;
    color: #30262a;
    font-family: var(--vitrin-yazi-baslik);
    font-size: clamp(1.45rem, 4vw, 2.2rem);
    font-weight: 400;
}

.vitrin-paylasim-kirpma-basligi p {
    max-width: 44rem;
    margin: 0;
    color: #74676c;
    line-height: 1.65;
}

.vitrin-paylasim-kirpma-kapat {
    display: inline-grid;
    flex: 0 0 auto;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    color: #30262a;
    background: #ffffff;
    border: 1px solid #ddcec7;
    border-radius: 50%;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    place-items: center;
}

.vitrin-paylasim-kirpma-kapat:hover {
    color: #ffffff;
    background: var(--vitrin-renk-murdum, #5b2e48);
    border-color: var(--vitrin-renk-murdum, #5b2e48);
}

.vitrin-paylasim-kirpma-kapat:focus-visible {
    outline: 3px solid rgba(197, 74, 148, 0.22);
    outline-offset: 2px;
}

.vitrin-paylasim-kirpma-yonergesi {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
    margin-bottom: 1rem;
}

.vitrin-paylasim-kirpma-yonergesi > div {
    display: flex;
    align-items: center;
    min-width: 0;
    padding: 0.75rem;
    background: #f7efea;
    border: 1px solid #eadbd4;
    border-radius: 1rem;
    gap: 0.65rem;
}

.vitrin-paylasim-kirpma-yonergesi > div > span {
    display: grid;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    color: #ffffff;
    background: var(--vitrin-renk-murdum, #5b2e48);
    border-radius: 50%;
    font-size: 0.78rem;
    font-weight: 800;
    place-items: center;
}

.vitrin-paylasim-kirpma-yonergesi p,
.vitrin-paylasim-kirpma-yonergesi strong,
.vitrin-paylasim-kirpma-yonergesi small {
    display: block;
    margin: 0;
}

.vitrin-paylasim-kirpma-yonergesi strong {
    color: #3b2a31;
    font-size: 0.82rem;
}

.vitrin-paylasim-kirpma-yonergesi small {
    margin-top: 0.15rem;
    color: #7a6d72;
    font-size: 0.7rem;
    line-height: 1.4;
}

.vitrin-paylasim-kirpma-sahnesi {
    position: relative;
    width: min( 100%, calc(54dvh * var(--kadraj-oran-sayi, 1.9047619)) );
    aspect-ratio: var(--kadraj-orani, 1200 / 630);
    margin-inline: auto;
    background: #160b18;
    border: 2px solid var(--vitrin-renk-murdum, #5b2e48);
    border-radius: var(--vitrin-kose-orta);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    overflow: hidden;
    touch-action: none;
}

.vitrin-paylasim-kirpma-sahnesi > img {
    display: none;
}

.vitrin-paylasim-kirpma-sahnesi cropper-canvas {
    display: block;
    width: 100%;
    height: 100%;
}

.vitrin-paylasim-kirpma-araclari {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    margin-top: 1rem;
    padding: 1rem;
    background: #f7efea;
    border: 1px solid #eadbd4;
    border-radius: 1rem;
}

.vitrin-paylasim-kirpma-yakinlastirma {
    flex: 1 1 auto;
    min-width: 0;
}

.vitrin-paylasim-kirpma-arac-etiketi {
    display: block;
    margin-bottom: 0.45rem;
    color: #49363e;
    font-size: 0.76rem;
    font-weight: 800;
}

.vitrin-paylasim-kirpma-yakinlastirma-satiri {
    display: grid;
    grid-template-columns:
        2.6rem
        minmax(8rem, 1fr)
        2.6rem
        3.3rem;
    align-items: center;
    gap: 0.55rem;
}

.vitrin-paylasim-kirpma-yakinlastirma-satiri button {
    display: grid;
    width: 2.6rem;
    height: 2.6rem;
    padding: 0;
    color: #ffffff;
    background: var(--vitrin-renk-murdum, #5b2e48);
    border: 1px solid var(--vitrin-renk-murdum, #5b2e48);
    border-radius: 50%;
    font: inherit;
    font-size: 1.35rem;
    font-weight: 700;
    cursor: pointer;
    place-items: center;
}

.vitrin-paylasim-kirpma-yakinlastirma-satiri button:hover:not(:disabled) {
    background: var(--vitrin-renk-pembe, #d85aa5);
    border-color: var(--vitrin-renk-pembe, #d85aa5);
}

.vitrin-paylasim-kirpma-yakinlastirma-satiri button:disabled {
    color: #ffffff;
    background: #bcaeb4;
    border-color: #bcaeb4;
    cursor: not-allowed;
    opacity: 1;
}

.vitrin-paylasim-kirpma-yakinlastirma-satiri button:focus-visible {
    outline: 3px solid rgba(197, 74, 148, 0.22);
    outline-offset: 2px;
}

.vitrin-paylasim-kirpma-yakinlastirma-satiri input {
    width: 100%;
    accent-color: var(--vitrin-renk-murdum, #5b2e48);
    cursor: pointer;
}

.vitrin-paylasim-kirpma-yakinlastirma-satiri output {
    color: #49363e;
    font-size: 0.78rem;
    font-weight: 800;
    text-align: center;
}

.vitrin-paylasim-kirpma-ortalama {
    min-width: 0;
}

.vitrin-paylasim-kirpma-ortalama-dugmeleri {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 0.55rem;
}

.vitrin-paylasim-kirpma-ortalama-dugmeleri button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-width: 0;
    min-height: 2.8rem;
    padding: 0.7rem 0.9rem;
    color: var(--vitrin-renk-murdum, #5b2e48);
    background: #ffffff;
    border: 1px solid #d9c4ca;
    border-radius: 0.85rem;
    font: inherit;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
    cursor: pointer;
    transition:
        color 160ms ease,
        border-color 160ms ease,
        background-color 160ms ease,
        transform 160ms ease;
}

.vitrin-paylasim-kirpma-ortalama-dugmeleri button:hover:not(:disabled) {
    background: #fff8f5;
    border-color: var(--vitrin-renk-murdum, #5b2e48);
    transform: translateY(-1px);
}

.vitrin-paylasim-kirpma-ortalama-dugmeleri button:focus-visible {
    outline: 3px solid rgba(197, 74, 148, 0.22);
    outline-offset: 2px;
}

.vitrin-paylasim-kirpma-ortalama-dugmeleri
.vitrin-paylasim-kirpma-sifirla {
    color: #ffffff;
    background-color: var(--vitrin-renk-murdum, #5b2e48);
    background-image: linear-gradient(
        135deg,
        var(--vitrin-renk-murdum, #5b2e48),
        var(--vitrin-renk-pembe, #d85aa5)
    );
    border-color: transparent;
}

.vitrin-paylasim-kirpma-ortalama-dugmeleri
.vitrin-paylasim-kirpma-sifirla:hover:not(:disabled) {
    color: #ffffff;
    background-color: #4d263d;
    border-color: transparent;
}

.vitrin-paylasim-kirpma-bilgi {
    margin: 0.9rem 0 0;
    color: #74676c;
    font-size: 0.8rem;
    line-height: 1.6;
}

.vitrin-paylasim-kirpma-hatasi {
    margin: 0.9rem 0 0;
    padding: 0.8rem 1rem;
    color: var(--vitrin-renk-hata, #b43c52);
    background: rgba(184, 50, 70, 0.08);
    border: 1px solid rgba(184, 50, 70, 0.22);
    border-radius: var(--vitrin-kose-kucuk);
    font-size: 0.82rem;
    line-height: 1.55;
}

.vitrin-paylasim-kirpma-islemleri {
    position: sticky;
    bottom: 0;
    z-index: 20;
    display: grid;
    grid-template-columns: auto auto;
    justify-content: end;
    gap: 0.75rem;
    margin:
        1.25rem
        calc(0rem - var(--vitrin-kirpma-kart-boslugu))
        0;
    padding:
        1rem
        var(--vitrin-kirpma-kart-boslugu)
        var(--vitrin-kirpma-kart-boslugu);
    background: #fffaf6;
    border-top: 1px solid #eadbd4;
    box-shadow: 0 -1rem 1.5rem rgba(49, 25, 41, 0.08);
    isolation: isolate;
}

.vitrin-paylasim-kirpma-ikincil,
.vitrin-paylasim-kirpma-birincil {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 8.5rem;
    min-height: 3rem;
    padding: 0.75rem 1.2rem;
    border-radius: 999px;
    font: inherit;
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
}

.vitrin-paylasim-kirpma-ikincil {
    color: #30262a;
    background: #ffffff;
    border: 1px solid #ddcec7;
}

.vitrin-paylasim-kirpma-ikincil:hover {
    color: var(--vitrin-renk-murdum, #5b2e48);
    background: #fff8f5;
    border-color: var(--vitrin-renk-murdum, #5b2e48);
}

.vitrin-paylasim-kirpma-birincil {
    color: #ffffff;
    background-color: var(--vitrin-renk-murdum, #5b2e48);
    border: 1px solid var(--vitrin-renk-murdum, #5b2e48);
}

.vitrin-paylasim-kirpma-birincil:hover:not(:disabled) {
    color: #ffffff;
    background-color: #4d263d;
    border-color: #4d263d;
}

.vitrin-paylasim-kirpma-ikincil:focus-visible,
.vitrin-paylasim-kirpma-birincil:focus-visible {
    outline: 3px solid rgba(197, 74, 148, 0.22);
    outline-offset: 2px;
}

.vitrin-paylasim-kirpma-birincil:disabled {
    color: #ffffff;
    background-color: var(--vitrin-renk-murdum, #5b2e48);
    border-color: var(--vitrin-renk-murdum, #5b2e48);
    cursor: wait;
    opacity: 0.65;
}

@media (max-width: 700px) {
    .vitrin-paylasim-kirpma-dialogu {
        width: calc(100vw - 0.75rem);
        max-height: calc(100dvh - 0.75rem);
    }

    .vitrin-paylasim-kirpma-karti {
        --vitrin-kirpma-kart-boslugu: 0.8rem;

        max-height: calc(100dvh - 0.75rem);
        border-radius: 1.1rem;
        scrollbar-gutter: auto;
    }

    .vitrin-paylasim-kirpma-basligi {
        margin-bottom: 0.75rem;
    }

    .vitrin-paylasim-kirpma-basligi h3 {
        padding-right: 0.5rem;
        font-size: 1.55rem;
    }

    .vitrin-paylasim-kirpma-basligi p {
        font-size: 0.8rem;
        line-height: 1.5;
    }

    .vitrin-paylasim-kirpma-kapat {
        width: 2.5rem;
        height: 2.5rem;
    }

    .vitrin-paylasim-kirpma-yonergesi {
        grid-template-columns: 1fr;
        gap: 0.4rem;
    }

    .vitrin-paylasim-kirpma-yonergesi > div {
        padding: 0.55rem 0.65rem;
    }

    .vitrin-paylasim-kirpma-yonergesi small {
        display: none;
    }

    .vitrin-paylasim-kirpma-araclari {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: 0.75rem;
        padding: 0.8rem;
    }

    .vitrin-paylasim-kirpma-yakinlastirma-satiri {
        grid-template-columns:
            2.55rem
            minmax(0, 1fr)
            2.55rem
            3rem;
        gap: 0.45rem;
    }

    .vitrin-paylasim-kirpma-yakinlastirma-satiri button {
        width: 2.55rem;
        height: 2.55rem;
    }

    .vitrin-paylasim-kirpma-ortalama-dugmeleri {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vitrin-paylasim-kirpma-ortalama-dugmeleri
    .vitrin-paylasim-kirpma-sifirla {
        grid-column: 1 / -1;
    }

    .vitrin-paylasim-kirpma-islemleri {
        grid-template-columns:
            minmax(0, 0.8fr)
            minmax(0, 1.2fr);
        justify-content: stretch;
        gap: 0.55rem;
        margin-top: 1rem;
        padding-top: 0.8rem;
    }

    .vitrin-paylasim-kirpma-ikincil,
    .vitrin-paylasim-kirpma-birincil {
        width: 100%;
        min-width: 0;
        min-height: 2.85rem;
        padding: 0.7rem 0.55rem;
        font-size: 0.78rem;
    }
}

@media (max-width: 390px) {
    .vitrin-paylasim-kirpma-yakinlastirma-satiri {
        grid-template-columns:
            2.45rem
            minmax(0, 1fr)
            2.45rem
            2.8rem;
        gap: 0.35rem;
    }

    .vitrin-paylasim-kirpma-ortalama-dugmeleri button {
        padding-right: 0.45rem;
        padding-left: 0.45rem;
        font-size: 0.72rem;
    }

    .vitrin-paylasim-kirpma-ikincil,
    .vitrin-paylasim-kirpma-birincil {
        font-size: 0.74rem;
    }
}

/* #FOTOĞRAF KIRPMA endregion */


/* #region DAVETİYE İÇERİK DÜZENLEME */

.vitrin-icerik-duzenleme-govdesi {
    background: radial-gradient(circle at left top, rgba(230, 93, 154, 0.07), transparent 24rem), radial-gradient(circle at right center, rgba(112, 46, 84, 0.06), transparent 30rem), var(--vitrin-renk-kirik-beyaz);
}

.vitrin-icerik-duzenleme-sayfasi {
    padding-top: clamp(2rem, 5vw, 4rem);
    padding-bottom: clamp(4rem, 8vw, 7rem);
}

.vitrin-icerik-duzenleme-kabugu {
    width: min(100%, 76rem);
    margin-inline: auto;
}

.vitrin-icerik-duzenleme-geri {
    margin-bottom: 1.25rem;
}

    .vitrin-icerik-duzenleme-geri a {
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
        color: var(--vitrin-renk-murver);
        font-size: 0.95rem;
        font-weight: 700;
        text-decoration: none;
        transition: color 160ms ease, transform 160ms ease;
    }

        .vitrin-icerik-duzenleme-geri a:hover {
            color: var(--vitrin-renk-pembe);
            transform: translateX(-0.2rem);
        }

.vitrin-icerik-duzenleme-basligi {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 2rem;
    margin-bottom: 1.5rem;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 1px solid rgba(112, 46, 84, 0.14);
    border-radius: 1.75rem;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 1.25rem 3rem rgba(65, 38, 50, 0.08);
}

    .vitrin-icerik-duzenleme-basligi > div:first-child {
        min-width: 0;
    }

    .vitrin-icerik-duzenleme-basligi .vitrin-bolum-etiketi {
        display: block;
        margin-bottom: 0.75rem;
    }

    .vitrin-icerik-duzenleme-basligi h1 {
        max-width: 14ch;
        margin: 0;
        color: var(--vitrin-renk-koyu);
        font-family: var(--vitrin-font-baslik);
        font-size: clamp(2.5rem, 6vw, 4.75rem);
        font-weight: 400;
        line-height: 0.98;
        letter-spacing: -0.04em;
    }

    .vitrin-icerik-duzenleme-basligi p {
        max-width: 48rem;
        margin: 1.15rem 0 0;
        color: var(--vitrin-renk-metin-soluk);
        font-size: 1rem;
        line-height: 1.75;
    }

.vitrin-icerik-duzenleme-baslik-islemleri {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.75rem;
}

    .vitrin-icerik-duzenleme-baslik-islemleri .vitrin-buton {
        white-space: nowrap;
    }

.vitrin-icerik-duzenleme-ozeti {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.8rem;
    margin-bottom: 1.5rem;
}

    .vitrin-icerik-duzenleme-ozeti > div {
        min-width: 0;
        padding: 1rem 1.1rem;
        border: 1px solid rgba(112, 46, 84, 0.12);
        border-radius: 1rem;
        background: rgba(255, 255, 255, 0.86);
    }

    .vitrin-icerik-duzenleme-ozeti span {
        display: block;
        margin-bottom: 0.35rem;
        color: var(--vitrin-renk-metin-soluk);
        font-size: 0.75rem;
        font-weight: 700;
        line-height: 1.35;
    }

    .vitrin-icerik-duzenleme-ozeti strong {
        display: block;
        overflow-wrap: anywhere;
        color: var(--vitrin-renk-koyu);
        font-size: 0.95rem;
        line-height: 1.45;
    }

.vitrin-icerik-duzenleme-basarisi,
.vitrin-icerik-duzenleme-engeli,
.vitrin-icerik-duzenleme-bos {
    margin-bottom: 1.5rem;
    padding: 1rem 1.15rem;
    border-radius: 1rem;
    font-size: 0.95rem;
    line-height: 1.6;
}

.vitrin-icerik-duzenleme-basarisi {
    border: 1px solid rgba(35, 135, 94, 0.2);
    background: rgba(225, 247, 237, 0.9);
    color: #176745;
}

.vitrin-icerik-duzenleme-engeli {
    border: 1px solid rgba(187, 79, 83, 0.2);
    background: rgba(255, 238, 239, 0.92);
    color: #943d42;
}

.vitrin-icerik-duzenleme-bos {
    border: 1px solid rgba(112, 46, 84, 0.12);
    background: rgba(255, 255, 255, 0.9);
    color: var(--vitrin-renk-metin-soluk);
    text-align: center;
}

.vitrin-icerik-duzenleme-formu {
    display: grid;
    gap: 1.5rem;
}

.vitrin-icerik-duzenleme-sahneleri {
    display: grid;
    gap: 1.25rem;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

    .vitrin-icerik-duzenleme-sahneleri > legend {
        display: none;
    }

.vitrin-icerik-sahne-karti {
    overflow: hidden;
    min-width: 0;
    padding: clamp(1.35rem, 3vw, 2rem);
    border: 1px solid rgba(112, 46, 84, 0.14);
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 1rem 2.6rem rgba(65, 38, 50, 0.055);
}

.vitrin-icerik-sahne-basligi {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid rgba(112, 46, 84, 0.13);
}

.vitrin-icerik-sahne-sirasi {
    display: inline-grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border: 1px solid rgba(230, 93, 154, 0.24);
    border-radius: 50%;
    background: rgba(230, 93, 154, 0.08);
    color: var(--vitrin-renk-murver);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.05em;
}

.vitrin-icerik-sahne-basligi .vitrin-bolum-etiketi {
    display: block;
    margin-bottom: 0.35rem;
}

.vitrin-icerik-sahne-basligi h2 {
    margin: 0;
    color: var(--vitrin-renk-koyu);
    font-family: var(--vitrin-font-baslik);
    font-size: clamp(1.8rem, 4vw, 2.65rem);
    font-weight: 400;
    line-height: 1.08;
    letter-spacing: -0.025em;
}

.vitrin-icerik-sahne-basligi p {
    margin: 0.45rem 0 0;
    color: var(--vitrin-renk-metin-soluk);
    font-size: 0.9rem;
    line-height: 1.55;
}

.vitrin-icerik-sahne-alanlari {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 1.25rem;
}

.vitrin-icerik-form-alani {
    display: grid;
    align-content: start;
    gap: 0.55rem;
    min-width: 0;
}

    .vitrin-icerik-form-alani:has(textarea) {
        grid-column: 1 / -1;
    }

    .vitrin-icerik-form-alani > div:first-child {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.5rem;
        min-width: 0;
    }

    .vitrin-icerik-form-alani label {
        color: var(--vitrin-renk-koyu);
        font-size: 0.92rem;
        font-weight: 750;
        line-height: 1.45;
    }

.vitrin-icerik-zorunlu,
.vitrin-icerik-istege-bagli {
    display: inline-flex;
    align-items: center;
    min-height: 1.4rem;
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.vitrin-icerik-zorunlu {
    background: rgba(230, 93, 154, 0.12);
    color: var(--vitrin-renk-murver);
}

.vitrin-icerik-istege-bagli {
    background: rgba(112, 46, 84, 0.07);
    color: var(--vitrin-renk-metin-soluk);
}

.vitrin-icerik-form-alani input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),
.vitrin-icerik-form-alani textarea,
.vitrin-icerik-form-alani select {
    width: 100%;
    min-width: 0;
    border: 1px solid rgba(112, 46, 84, 0.18);
    border-radius: 0.95rem;
    outline: 0;
    background: #fff;
    color: var(--vitrin-renk-koyu);
    font: inherit;
    transition: border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.vitrin-icerik-form-alani input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="color"]),
.vitrin-icerik-form-alani select {
    min-height: 3.4rem;
    padding: 0.85rem 1rem;
}

.vitrin-icerik-form-alani textarea {
    min-height: 9rem;
    padding: 1rem;
    line-height: 1.65;
    resize: vertical;
}

    .vitrin-icerik-form-alani input:hover,
    .vitrin-icerik-form-alani textarea:hover,
    .vitrin-icerik-form-alani select:hover {
        border-color: rgba(112, 46, 84, 0.32);
    }

    .vitrin-icerik-form-alani input:focus,
    .vitrin-icerik-form-alani textarea:focus,
    .vitrin-icerik-form-alani select:focus {
        border-color: var(--vitrin-renk-pembe);
        box-shadow: 0 0 0 0.22rem rgba(230, 93, 154, 0.12);
    }

    .vitrin-icerik-form-alani input:disabled,
    .vitrin-icerik-form-alani textarea:disabled,
    .vitrin-icerik-form-alani select:disabled {
        cursor: not-allowed;
        background: rgba(112, 46, 84, 0.045);
        color: var(--vitrin-renk-metin-soluk);
    }

.vitrin-icerik-alan-yardimi {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.25rem 0.75rem;
    color: var(--vitrin-renk-metin-soluk);
    font-size: 0.78rem;
    line-height: 1.55;
}

    .vitrin-icerik-alan-yardimi span:last-child:not(:first-child) {
        margin-left: auto;
        white-space: nowrap;
    }

.vitrin-icerik-form-alani small {
    display: block;
    color: var(--vitrin-renk-metin-soluk);
    font-size: 0.78rem;
    line-height: 1.55;
}

.vitrin-icerik-form-alani .field-validation-error {
    color: #a53f47;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.45;
}

.vitrin-renk-girdisi {
    display: grid;
    grid-template-columns: 3.6rem minmax(0, 1fr);
    align-items: center;
    gap: 0.75rem;
}

    .vitrin-renk-girdisi input[type="color"] {
        width: 3.6rem;
        height: 3.4rem;
        padding: 0.3rem;
        border: 1px solid rgba(112, 46, 84, 0.18);
        border-radius: 0.95rem;
        background: #fff;
        cursor: pointer;
    }

.vitrin-icerik-duzenleme-islemleri {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.8rem;
    padding: 1.1rem;
    border: 1px solid rgba(112, 46, 84, 0.13);
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 1rem 2.5rem rgba(65, 38, 50, 0.06);
}

.vitrin-icerik-kaydet {
    min-width: 12rem;
}

@media (max-width: 960px) {
    .vitrin-icerik-duzenleme-basligi {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .vitrin-icerik-duzenleme-baslik-islemleri {
        justify-content: flex-start;
    }

    .vitrin-icerik-duzenleme-ozeti {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .vitrin-icerik-duzenleme-sayfasi {
        padding-top: 1.5rem;
    }

    .vitrin-icerik-duzenleme-basligi {
        gap: 1.5rem;
        padding: 1.35rem;
        border-radius: 1.35rem;
    }

        .vitrin-icerik-duzenleme-basligi h1 {
            max-width: none;
            font-size: clamp(2.25rem, 12vw, 3.4rem);
        }

    .vitrin-icerik-duzenleme-baslik-islemleri {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

        .vitrin-icerik-duzenleme-baslik-islemleri .vitrin-buton {
            width: 100%;
        }

    .vitrin-icerik-duzenleme-ozeti {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vitrin-icerik-sahne-karti {
        padding: 1.2rem;
        border-radius: 1.25rem;
    }

    .vitrin-icerik-sahne-basligi {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.8rem;
    }

    .vitrin-icerik-sahne-sirasi {
        width: 2.6rem;
        height: 2.6rem;
    }

    .vitrin-icerik-sahne-alanlari {
        grid-template-columns: minmax(0, 1fr);
    }

    .vitrin-icerik-form-alani:has(textarea) {
        grid-column: auto;
    }

    .vitrin-icerik-duzenleme-islemleri {
        display: grid;
        grid-template-columns: 1fr;
    }

        .vitrin-icerik-duzenleme-islemleri .vitrin-buton,
        .vitrin-icerik-kaydet {
            width: 100%;
            min-width: 0;
        }
}

@media (max-width: 440px) {
    .vitrin-icerik-duzenleme-ozeti {
        grid-template-columns: minmax(0, 1fr);
    }

    .vitrin-icerik-sahne-basligi {
        align-items: start;
    }

        .vitrin-icerik-sahne-basligi h2 {
            font-size: 1.75rem;
        }
}

/* #endregion */



/* #region Müşteri hesabı - içerik düzenleme son düzenlemeleri */

/* İçerik düzenleme: bölüm ve müzik tercihleri arasındaki boşluklar */
.vitrin-icerik-duzenleme-formu
.vitrin-icerik-sahne-karti > .vitrin-hukuki-onay {
    margin-bottom: 1rem;
}

/* Bölüm açıklamaları ile sonraki alanları birbirinden ayırır */
.vitrin-icerik-duzenleme-formu
.vitrin-icerik-sahne-karti > p:not([hidden]) {
    margin-top: 0;
    margin-bottom: 1rem;
}

/* Kartın son açıklamasında fazladan alt boşluk bırakmaz */
.vitrin-icerik-duzenleme-formu
.vitrin-icerik-sahne-karti > p:last-child {
    margin-bottom: 0;
}


/* İçerik düzenleme: başlık yazı tipi */
.vitrin-icerik-duzenleme-basligi h1,
.vitrin-icerik-sahne-basligi h2 {
    font-family: var(--vitrin-yazi-baslik);
}

/* Özet: ilk satır model ve talep kodu, ikinci satır diğer bilgiler */
.vitrin-icerik-duzenleme-ozeti {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: stretch;
}

    .vitrin-icerik-duzenleme-ozeti > div {
        grid-column: span 2;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        gap: 0.4rem;
        min-width: 0;
    }

        .vitrin-icerik-duzenleme-ozeti > div:nth-child(-n+2) {
            grid-column: span 3;
        }

        .vitrin-icerik-duzenleme-ozeti > div > span {
            margin: 0;
        }

    .vitrin-icerik-duzenleme-ozeti strong {
        min-width: 0;
        line-height: 1.55;
        overflow-wrap: anywhere;
    }

    .vitrin-icerik-duzenleme-ozeti > div:nth-child(2) strong {
        font-family: ui-monospace, Consolas, monospace;
        font-size: 0.85rem;
    }

/* Onay ve kaydet alanı */
.vitrin-icerik-duzenleme-islemleri {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: end;
    gap: 1.25rem;
    padding: clamp(1rem, 2.5vw, 1.5rem);
    scroll-margin-top: 1rem;
    scroll-margin-bottom: 6rem;
}

    .vitrin-icerik-duzenleme-islemleri > div {
        display: grid;
        gap: 0.75rem;
        min-width: 0;
    }

        .vitrin-icerik-duzenleme-islemleri > div > strong,
        .vitrin-icerik-duzenleme-islemleri > div > span {
            display: block;
            line-height: 1.6;
            overflow-wrap: anywhere;
        }

    .vitrin-icerik-duzenleme-islemleri .field-validation-valid {
        display: none;
    }

    .vitrin-icerik-duzenleme-islemleri .vitrin-hukuki-onay {
        min-width: 0;
        margin: 0;
    }

        .vitrin-icerik-duzenleme-islemleri
        .vitrin-hukuki-onay > span {
            min-width: 0;
            overflow-wrap: anywhere;
        }

    .vitrin-icerik-duzenleme-islemleri .vitrin-icerik-kaydet {
        justify-self: end;
        max-width: 100%;
        white-space: normal;
        text-align: center;
    }

/* Kısayol boşluğunu sayfa dışında değil, footer içinde tut */
.vitrin-icerik-duzenleme-govdesi {
    padding-bottom: 0;
}

    .vitrin-icerik-duzenleme-govdesi .vitrin-alt-bilgi {
        padding-bottom: calc(6rem + env(safe-area-inset-bottom, 0px));
    }

/* Küçük kaydetme kısayolu; menü ve modal katmanlarının altında */
.vitrin-icerik-kaydet-kisayolu {
    position: fixed;
    right: 1rem;
    bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
    z-index: 50;
    max-width: calc(100% - 2rem);
    padding: 0.4rem;
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 1.25rem;
    background: var(--vitrin-renk-kirik-beyaz);
    box-shadow: 0 0.5rem 1.5rem rgba(65, 38, 50, 0.16);
}

    .vitrin-icerik-kaydet-kisayolu .vitrin-buton {
        min-height: 2.75rem;
        max-width: 100%;
        gap: 0.5rem;
        white-space: normal;
        text-align: center;
    }

/* İÇERİK DÜZENLEME MEDYA KARTLARI — BAŞLANGIÇ */
.vitrin-duzenleme-medya {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
    margin-block: 1rem;
    padding: clamp(0.9rem, 2vw, 1.25rem);
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 1rem;
    overflow-wrap: anywhere;
}

    .vitrin-duzenleme-medya > p,
    .vitrin-medya-kart-basligi p,
    .vitrin-medya-yukleme-icerigi > p {
        margin: 0;
        line-height: 1.65;
    }

        .vitrin-duzenleme-medya > p:empty {
            display: none;
        }

.vitrin-medya-kart-basligi {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem 1rem;
}

    .vitrin-medya-kart-basligi > div {
        min-width: 0;
    }

    .vitrin-medya-kart-basligi h3 {
        margin: 0 0 0.3rem;
        font-family: inherit;
        font-size: 1rem;
        font-weight: 600;
        line-height: 1.5;
    }

    .vitrin-medya-kart-basligi > a {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.3rem;
        min-height: 2.75rem;
        line-height: 1.5;
    }

.vitrin-medya-tercih-notu {
    font-size: 0.875rem;
}

.vitrin-medya-yukleme-acilir {
    min-width: 0;
    border-top: 1px solid var(--vitrin-renk-cizgi);
}

    .vitrin-medya-yukleme-acilir > summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        min-height: 2.75rem;
        padding-block: 0.75rem;
        list-style: none;
        cursor: pointer;
        font-weight: 600;
        line-height: 1.5;
    }

        .vitrin-medya-yukleme-acilir > summary:focus-visible {
            outline: 2px solid currentColor;
            outline-offset: 3px;
            border-radius: 0.35rem;
        }

.vitrin-medya-acilir-ok {
    flex: 0 0 auto;
    width: 0.55rem;
    height: 0.55rem;
    margin-inline: 0.3rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
}

.vitrin-medya-yukleme-acilir[open] .vitrin-medya-acilir-ok {
    transform: rotate(225deg);
}

.vitrin-medya-yukleme-icerigi {
    display: grid;
    gap: 0.85rem;
    min-width: 0;
    padding-block: 0.25rem 0.5rem;
}

.vitrin-medya-yukleme-acilir:not([open]) > .vitrin-medya-yukleme-icerigi {
    display: none;
}

.vitrin-duzenleme-medya input[type="file"] {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding: 0.45rem;
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: 0.65rem;
    font: inherit;
}

    .vitrin-duzenleme-medya input[type="file"]::file-selector-button {
        margin-inline-end: 0.65rem;
        padding: 0.65rem 0.8rem;
        border: 1px solid var(--vitrin-renk-cizgi);
        border-radius: 0.5rem;
        background: var(--vitrin-renk-kirik-beyaz);
        color: inherit;
        font: inherit;
        cursor: pointer;
    }

.vitrin-duzenleme-medya .vitrin-hukuki-onay {
    margin: 0;
    min-width: 0;
    align-items: flex-start;
    gap: 0.75rem;
}

    .vitrin-duzenleme-medya .vitrin-hukuki-onay > input {
        flex-shrink: 0;
    }

    .vitrin-duzenleme-medya .vitrin-hukuki-onay > span {
        min-width: 0;
        line-height: 1.65;
    }

.vitrin-medya-beyan-surumu {
    display: block;
    margin-top: 0.4rem;
    overflow-wrap: anywhere;
}

.vitrin-medya-yukleme-icerigi > button {
    justify-self: start;
    max-width: 100%;
    white-space: normal;
}

@media (max-width: 720px) {
    .vitrin-medya-kart-basligi {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.25rem;
    }

        .vitrin-medya-kart-basligi > a {
            justify-self: start;
        }

    .vitrin-medya-yukleme-icerigi > button {
        width: 100%;
        justify-self: stretch;
    }
}
/* İÇERİK DÜZENLEME MEDYA KARTLARI — SON */

/* SEÇİLİ MEDYA ÖNİZLEMESİ — BAŞLANGIÇ */
.vitrin-secili-medya-onizleme h1 {
    font-size: clamp(1.35rem, 3vw, 2rem);
    overflow-wrap: anywhere;
}

.vitrin-secili-medya-onizleme > img,
.vitrin-secili-medya-onizleme > video {
    display: block;
    width: 100%;
    max-height: 70vh;
    object-fit: contain;
    border-radius: 0.75rem;
}

.vitrin-secili-medya-onizleme > audio {
    display: block;
    width: 100%;
    min-width: 0;
}
/* SEÇİLİ MEDYA ÖNİZLEMESİ — SON */

/* Mobil */
@media (max-width: 720px) {
    .vitrin-icerik-duzenleme-ozeti {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .vitrin-icerik-duzenleme-ozeti > div {
            grid-column: span 1;
            padding: 0.9rem;
        }

            .vitrin-icerik-duzenleme-ozeti > div:nth-child(-n+2),
            .vitrin-icerik-duzenleme-ozeti > div:last-child {
                grid-column: 1 / -1;
            }

    .vitrin-icerik-duzenleme-islemleri {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

        .vitrin-icerik-duzenleme-islemleri .vitrin-icerik-kaydet {
            width: 100%;
            min-width: 0;
        }

    .vitrin-icerik-kaydet-kisayolu {
        left: 0.75rem;
        right: 0.75rem;
        max-width: none;
    }

        .vitrin-icerik-kaydet-kisayolu .vitrin-buton {
            width: 100%;
        }
}

@media print {
    .vitrin-icerik-kaydet-kisayolu {
        display: none;
    }
}

/* Kaydet alanının eski sağa yaslama ayarını sıfırlar */
.vitrin-icerik-duzenleme-islemleri {
    justify-content: stretch;
    justify-items: stretch;
}

/* Dar mobilde önceki tek sütunlu özet görünümünü korur */
@media (max-width: 440px) {
    .vitrin-icerik-duzenleme-ozeti {
        grid-template-columns: minmax(0, 1fr);
    }

        .vitrin-icerik-duzenleme-ozeti > div {
            grid-column: 1 / -1;
        }
}

/* #region İçerik düzenleme - alan adı ve durum etiketi */

.vitrin-icerik-duzenleme-formu
.vitrin-icerik-alan-etiketi > label {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 0.5rem;
    row-gap: 0.3rem;
    min-width: 0;
}

    .vitrin-icerik-duzenleme-formu
    .vitrin-icerik-alan-etiketi > label >
    :is(.vitrin-icerik-zorunlu, .vitrin-icerik-istege-bagli) {
        flex: 0 0 auto;
        align-self: center;
        white-space: nowrap;
    }

/* #endregion */

/* #endregion */



/* MEDYA ÖNİZLEME VE YÜKLEME AKSİYONLARI — BAŞLANGIÇ */

.vitrin-medya-kart-basligi > .vitrin-medya-onizle-butonu {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    min-height: 2.85rem;
    max-width: 100%;
    padding: 0.7rem 1rem;
    border: 1px solid #6b3155;
    border-radius: 999px;
    background: #6b3155;
    color: #fff;
    font: inherit;
    font-weight: 600;
    line-height: 1.45;
    text-align: center;
    cursor: pointer;
}

.vitrin-medya-onizle-butonu svg,
.vitrin-medya-yukleme-ikonu {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8px;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.vitrin-medya-onizle-butonu:hover:not(:disabled) {
    background: #51243f;
}

.vitrin-medya-onizle-butonu:focus-visible {
    outline: 2px solid #6b3155;
    outline-offset: 3px;
}

.vitrin-medya-onizle-butonu:disabled {
    opacity: 0.65;
    cursor: wait;
}

.vitrin-medya-yukleme-acilir {
    border-top: 0;
}

    .vitrin-medya-yukleme-acilir > summary {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 0.75rem;
        padding: 0.85rem 1rem;
        border: 1px solid #e5d5df;
        border-radius: 0.85rem;
        background: #faf4f7;
        color: #51243f;
    }

        .vitrin-medya-yukleme-acilir > summary:hover,
        .vitrin-medya-yukleme-acilir[open] > summary {
            border-color: #9a6387;
            background: #f5eaf0;
        }

.vitrin-medya-yukleme-basligi {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

    .vitrin-medya-yukleme-basligi small {
        color: #685761;
        font-size: 0.8rem;
        font-weight: 400;
    }

.vitrin-medya-acilir-durum {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.85rem;
}

.vitrin-medya-kapat-yazisi {
    display: none;
}

.vitrin-medya-yukleme-acilir[open] .vitrin-medya-ac-yazisi {
    display: none;
}

.vitrin-medya-yukleme-acilir[open] .vitrin-medya-kapat-yazisi {
    display: inline;
}

.vitrin-medya-yukleme-icerigi {
    padding-top: 1rem;
}

/* Ses önizlemesinde fotoğraf kadar büyük boş alan bırakmaz. */
.vitrin-icerik-duzenleme-govdesi
.ani-alani-goruntuleyici--ses {
    width: min(94vw, 38rem);
}

    .vitrin-icerik-duzenleme-govdesi
    .ani-alani-goruntuleyici--ses
    .ani-alani-goruntuleyici-medya-cercevesi {
        grid-template-columns: minmax(0, 1fr);
        min-height: 11rem;
    }

    .vitrin-icerik-duzenleme-govdesi
    .ani-alani-goruntuleyici--ses
    .ani-alani-goruntuleyici-tuvali {
        height: auto;
        padding: clamp(1rem, 4vw, 2rem);
    }

    .vitrin-icerik-duzenleme-govdesi
    .ani-alani-goruntuleyici--ses audio {
        display: block;
        width: 100%;
        height: 3.5rem;
        max-height: none;
    }

@media (max-width: 720px) {
    .vitrin-medya-kart-basligi > .vitrin-medya-onizle-butonu {
        width: 100%;
        margin-top: 0.5rem;
    }

    .vitrin-medya-yukleme-acilir > summary {
        padding: 0.8rem;
        gap: 0.6rem;
    }
}

/* MEDYA ÖNİZLEME VE YÜKLEME AKSİYONLARI — SON */


/* #region Müşteri hesabı — ortak medya görüntüleyici kimliği */

.vitrin-hesap-govdesi .ani-alani-goruntuleyici {
    color: var(--vitrin-renk-metin);
    font-family: var(--vitrin-yazi-metin);
}

.vitrin-hesap-govdesi .ani-alani-goruntuleyici-karti {
    background: var(--vitrin-renk-kirik-beyaz);
    border-color: var(--vitrin-renk-cizgi);
}

.vitrin-hesap-govdesi .ani-alani-goruntuleyici-basligi,
.vitrin-hesap-govdesi .ani-alani-goruntuleyici-alt-alani {
    color: var(--vitrin-renk-metin);
    background: var(--vitrin-renk-kirik-beyaz);
    border-color: var(--vitrin-renk-cizgi);
    font-family: var(--vitrin-yazi-metin);
}

.vitrin-hesap-govdesi .ani-alani-goruntuleyici-ust-baslik,
.vitrin-hesap-govdesi .ani-alani-goruntuleyici-sayaci {
    color: var(--vitrin-renk-murdum);
}

.vitrin-hesap-govdesi .ani-alani-goruntuleyici-mesaji {
    color: var(--vitrin-renk-metin);
}

.vitrin-hesap-govdesi .ani-alani-goruntuleyici-kapat {
    color: var(--vitrin-renk-murdum);
    background: var(--vitrin-renk-acik-alan);
    border-color: var(--vitrin-renk-cizgi);
}

    .vitrin-hesap-govdesi .ani-alani-goruntuleyici-kapat:hover {
        color: var(--vitrin-renk-beyaz);
        background: var(--vitrin-renk-murdum);
    }

    .vitrin-hesap-govdesi .ani-alani-goruntuleyici-kapat:focus-visible {
        outline-color: var(--vitrin-renk-murdum);
    }

/* #endregion */



/* Düzenleme medyası — talep oluşturma ile ortak görünüm */

.vitrin-duzenleme-medya .vitrin-medya-yukleme-acilir {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-kucuk);
    background: var(--vitrin-renk-beyaz);
}

    .vitrin-duzenleme-medya .vitrin-medya-yukleme-acilir > summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        min-height: 4.5rem;
        padding: 1rem 1.1rem;
        border: 0;
        border-radius: calc(var(--vitrin-kose-kucuk) - 1px);
        background: var(--vitrin-renk-kirik-beyaz);
        color: var(--vitrin-renk-metin);
        list-style: none;
        cursor: pointer;
    }

        .vitrin-duzenleme-medya .vitrin-medya-yukleme-acilir > summary:hover {
            background: var(--vitrin-renk-acik-alan);
        }

        .vitrin-duzenleme-medya .vitrin-medya-yukleme-acilir > summary:focus-visible {
            outline: 2px solid var(--vitrin-renk-murdum);
            outline-offset: -4px;
        }

    .vitrin-duzenleme-medya .vitrin-medya-yukleme-acilir[open] > summary {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

.vitrin-duzenleme-medya .vitrin-medya-yukleme-basligi {
    gap: .35rem;
}

    .vitrin-duzenleme-medya .vitrin-medya-yukleme-basligi strong {
        color: var(--vitrin-renk-koyu-metin);
        font-size: .95rem;
        line-height: 1.5;
    }

    .vitrin-duzenleme-medya .vitrin-medya-yukleme-basligi small {
        color: var(--vitrin-renk-ikincil-metin);
        font-size: .825rem;
        line-height: 1.5;
    }

.vitrin-duzenleme-medya .vitrin-medya-acilir-durum {
    flex-shrink: 0;
    justify-content: center;
    gap: .65rem;
    min-height: 2.5rem;
    padding: .55rem .85rem;
    border: 1px solid var(--vitrin-renk-cizgi);
    border-radius: var(--vitrin-kose-yuvarlak);
    background: var(--vitrin-renk-beyaz);
    color: var(--vitrin-renk-murdum);
    font-size: .825rem;
    font-weight: 700;
    white-space: nowrap;
}

.vitrin-duzenleme-medya .vitrin-medya-acilir-ok {
    width: .45rem;
    height: .45rem;
    margin-inline: .1rem;
}

.vitrin-duzenleme-medya .vitrin-medya-yukleme-icerigi {
    gap: 1rem;
    padding: 1.1rem;
    border-top: 1px solid var(--vitrin-renk-cizgi);
}

.vitrin-duzenleme-medya .vitrin-duzenleme-dosya-alani {
    display: grid;
    gap: .55rem;
    min-width: 0;
}

    .vitrin-duzenleme-medya .vitrin-duzenleme-dosya-alani > label {
        margin: 0;
        font-size: .85rem;
        font-weight: 700;
    }

.vitrin-duzenleme-medya input[type="file"] {
    padding: .45rem;
    border: 1px dashed rgba(91, 46, 72, .32);
    border-radius: var(--vitrin-kose-kucuk);
    background: var(--vitrin-renk-kirik-beyaz);
    color: var(--vitrin-renk-ikincil-metin);
    font-size: .86rem;
    cursor: pointer;
}

    .vitrin-duzenleme-medya input[type="file"]::file-selector-button {
        margin-inline-end: .8rem;
        padding: .65rem .9rem;
        border: 0;
        border-radius: .6rem;
        background: var(--vitrin-renk-murdum);
        color: var(--vitrin-renk-beyaz);
        font: inherit;
        font-size: .82rem;
        font-weight: 750;
        cursor: pointer;
    }

    .vitrin-duzenleme-medya input[type="file"]:focus-visible {
        outline: 2px solid var(--vitrin-renk-murdum);
        outline-offset: 2px;
    }

    .vitrin-duzenleme-medya input[type="file"]:disabled {
        opacity: .68;
        cursor: wait;
    }

.vitrin-duzenleme-medya .vitrin-duzenleme-dosya-alani > small {
    color: var(--vitrin-renk-ikincil-metin);
    font-size: .78rem;
    line-height: 1.45;
}

.vitrin-duzenleme-medya .vitrin-duzenleme-beyan {
    display: grid;
    gap: .5rem;
    min-width: 0;
}

.vitrin-duzenleme-medya .vitrin-hukuki-onay {
    margin: 0;
    padding: .85rem 1rem;
    border-radius: var(--vitrin-kose-kucuk);
    background: linear-gradient( 135deg, rgba(216, 90, 165, .07), rgba(197, 154, 91, .09) );
    font-size: .825rem;
}

.vitrin-duzenleme-medya .vitrin-duzenleme-beyan strong {
    display: block;
    margin-bottom: .25rem;
    color: var(--vitrin-renk-koyu-metin);
}

.vitrin-duzenleme-medya .vitrin-duzenleme-beyan-detayi {
    padding: 0 .25rem;
    color: var(--vitrin-renk-ikincil-metin);
    font-size: .75rem;
}

    .vitrin-duzenleme-medya .vitrin-duzenleme-beyan-detayi > summary {
        color: var(--vitrin-renk-murdum);
        cursor: pointer;
    }

    .vitrin-duzenleme-medya .vitrin-duzenleme-beyan-detayi small {
        display: block;
        margin-top: .4rem;
        overflow-wrap: anywhere;
    }

.vitrin-duzenleme-medya [data-medya-yukle] {
    min-height: 2.7rem;
    padding: .7rem 1rem;
    border-radius: var(--vitrin-kose-yuvarlak);
    font-size: .84rem;
    font-weight: 800;
}

.vitrin-duzenleme-medya .vitrin-duzenleme-yukleme-notu {
    color: var(--vitrin-renk-ikincil-metin);
    font-size: .8rem;
}

@media (max-width: 480px) {
    .vitrin-duzenleme-medya .vitrin-medya-yukleme-acilir > summary {
        gap: .65rem;
        padding: .9rem;
    }

    .vitrin-duzenleme-medya .vitrin-medya-acilir-durum {
        padding: .5rem .65rem;
    }

    .vitrin-duzenleme-medya .vitrin-medya-yukleme-icerigi {
        padding: .9rem;
    }
}



.vitrin-hazir-muzik-secimi {
    margin-top: .75rem;
}

    .vitrin-hazir-muzik-secimi select {
        width: 100%;
        min-height: 2.75rem;
        margin-block: .5rem .75rem;
        padding: .65rem;
        border: 1px solid #e7d9e2;
        border-radius: .75rem;
        background: #fff;
        color: inherit;
        font: inherit;
    }

.vitrin-hazir-muzik-islemleri {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.vitrin-hazir-muzik-secimi audio {
    width: 100%;
    margin-top: .75rem;
}



.vitrin-duyarli-kadraj .vitrin-paylasim-kirpma-sahnesi {
    cursor: grab;
    user-select: none;
}

    .vitrin-duyarli-kadraj .vitrin-paylasim-kirpma-sahnesi:active {
        cursor: grabbing;
    }

    .vitrin-duyarli-kadraj .vitrin-paylasim-kirpma-sahnesi:focus-visible {
        outline: 3px solid var(--vitrin-renk-murdum, #5b2e48);
        outline-offset: 3px;
    }

    .vitrin-duyarli-kadraj .vitrin-paylasim-kirpma-sahnesi > img {
        display: block;
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        max-width: none;
        max-height: none;
        object-fit: cover;
        pointer-events: none;
        user-select: none;
    }

.vitrin-duyarli-kadraj-ekran {
    display: grid;
    gap: .4rem;
    margin-bottom: 1rem;
    font-size: .875rem;
    font-weight: 600;
}

    .vitrin-duyarli-kadraj-ekran select {
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        padding: .65rem .8rem;
        border: 1px solid #decbd4;
        border-radius: .75rem;
        background: #fffaf7;
        color: var(--vitrin-renk-murdum, #5b2e48);
        font: inherit;
    }
