/* ============ ÖDEME TAMAMLAMA ============ */
    .co {
        background: var(--blush);
        padding: 44px 0 0;
    }

    .co .wrap {
        max-width: 1180px;
    }

    /* breadcrumb */
    .co-crumbs {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: var(--rose-deep);
        margin-bottom: 26px;
    }

    .co-crumbs a:hover {
        text-decoration: underline;
    }

    .co-crumbs span {
        color: var(--ink-40);
    }

    .co-crumbs b {
        font-weight: 400;
        color: var(--ink-60);
    }

    /* başlık */
    .co-head h1 {
        font-size: clamp(30px, 3.4vw, 42px);
        color: var(--ink);
    }

    .co-head p {
        margin-top: 8px;
        color: var(--ink-60);
        font-size: 15px;
    }

    /* adımlar */
    .co-steps {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        margin: 40px 0 30px;
        position: relative;
    }

    .co-steps li {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
        position: relative;
        text-align: center;
    }

    .co-steps li::before,
    .co-steps li::after {
        content: "";
        position: absolute;
        top: 17px;
        height: 2px;
        width: 50%;
        background: var(--line);
        z-index: 0;
    }

    .co-steps li::before {
        left: 0;
    }

    .co-steps li::after {
        right: 0;
    }

    .co-steps li:first-child::before,
    .co-steps li:last-child::after {
        display: none;
    }

    .co-steps__dot {
        position: relative;
        z-index: 1;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: grid;
        place-items: center;
        background: var(--blush);
        border: 2px solid var(--line);
        color: var(--ink-40);
        font-family: var(--f-display);
        font-size: 15px;
    }

    .co-steps li.is-active .co-steps__dot {
        background: var(--plum);
        border-color: var(--plum);
        color: var(--cream);
    }

    .co-steps__label {
        font-size: 12.5px;
        color: var(--ink-40);
        letter-spacing: .01em;
    }

    .co-steps li.is-active .co-steps__label {
        color: var(--ink);
    }

    /* grid */
    .co-grid {
        display: grid;
        grid-template-columns: 1.32fr 1fr;
        gap: 26px;
        align-items: start;
    }

    .co-col {
        display: flex;
        flex-direction: column;
        gap: 26px;
    }

    /* kart */
    .co-card {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: 20px;
        padding: 28px 30px;
        box-shadow: var(--sh-1);
    }

    .co-card__title {
        font-size: 20px;
        margin-bottom: 22px;
    }

    .co-card__title span {
        color: var(--ink-40);
        font-size: 15px;
    }

    .co-card__head {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        margin-bottom: 22px;
    }

    .co-card__head .co-card__title {
        margin-bottom: 0;
    }

    .co-edit {
        font-size: 13px;
        color: var(--rose-deep);
    }

    .co-edit:hover {
        text-decoration: underline;
    }

    /* form alanları */
    .co-field {
        margin-bottom: 18px;
    }

    .co-field:last-child {
        margin-bottom: 0;
    }

    .co-field-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 18px;
    }

    .co-field-row .co-field {
        margin-bottom: 0;
    }

    .co-field > label {
        display: block;
        font-size: 13px;
        color: var(--ink-60);
        margin-bottom: 8px;
        font-weight: 500;
    }

    .co-field .co-sub {
        color: var(--ink-40);
    }

    .co-field input,
    .co-field textarea,
    .co-select select {
        width: 100%;
        border: 1px solid var(--line);
        border-radius: 12px;
        padding: 13px 15px;
        background: var(--cream);
        font-size: 14.5px;
        font-weight: 300;
        color: var(--ink);
        transition: border-color .25s, box-shadow .25s;
        font-family: var(--f-body);
    }

    .co-field textarea {
        resize: vertical;
        line-height: 1.5;
    }

    .co-field input::placeholder,
    .co-field textarea::placeholder {
        color: var(--ink-40);
    }

    .co-field input:focus,
    .co-field textarea:focus,
    .co-select select:focus {
        outline: none;
        border-color: var(--rose);
        box-shadow: 0 0 0 3px rgba(214, 86, 127, .12);
    }

    .co-select {
        position: relative;
    }

    .co-select select {
        appearance: none;
        -webkit-appearance: none;
        cursor: pointer;
        padding-right: 40px;
    }

    .co-select svg {
        position: absolute;
        right: 14px;
        top: 50%;
        transform: translateY(-50%);
        width: 18px;
        height: 18px;
        fill: none;
        stroke: var(--ink-60);
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
        pointer-events: none;
    }

    /* checkbox */
    .co-check {
        display: flex;
        align-items: center;
        gap: 11px;
        margin-top: 20px;
        font-size: 14px;
        color: var(--ink);
        cursor: pointer;
    }

    .co-check input {
        display: none;
    }

    .co-check__box {
        width: 20px;
        height: 20px;
        border-radius: 6px;
        border: 1.5px solid var(--line);
        display: grid;
        place-items: center;
        background: var(--cream);
        transition: background .2s, border-color .2s;
        flex: none;
    }

    .co-check__box svg {
        width: 13px;
        height: 13px;
        fill: none;
        stroke: #fff;
        stroke-width: 2.5;
        stroke-linecap: round;
        stroke-linejoin: round;
        opacity: 0;
        transition: opacity .2s;
    }

    .co-check input:checked + .co-check__box {
        background: var(--plum);
        border-color: var(--plum);
    }

    .co-check input:checked + .co-check__box svg {
        opacity: 1;
    }

    /* teslimat yöntemi radyo kartları */
    .co-ship {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .co-radio-card {
        display: flex;
        align-items: center;
        gap: 12px;
        border: 1.5px solid var(--line);
        border-radius: 14px;
        padding: 16px 18px;
        cursor: pointer;
        transition: border-color .25s, background .25s;
    }

    .co-radio-card input {
        display: none;
    }

    .co-radio-card.is-checked {
        border-color: var(--rose);
        background: rgba(214, 86, 127, .04);
    }

    .co-radio-card__dot {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        border: 2px solid var(--line);
        flex: none;
        position: relative;
        transition: border-color .25s;
    }

    .is-checked .co-radio-card__dot {
        border-color: var(--rose-deep);
    }

    .is-checked .co-radio-card__dot::after {
        content: "";
        position: absolute;
        inset: 3px;
        border-radius: 50%;
        background: var(--rose-deep);
    }

    .co-radio-card__body {
        display: flex;
        flex-direction: column;
        line-height: 1.35;
        margin-right: auto;
    }

    .co-radio-card__body b {
        font-weight: 500;
        font-size: 14.5px;
    }

    .co-radio-card__body small {
        font-size: 12.5px;
        color: var(--ink-60);
    }

    .co-radio-card__price {
        font-weight: 500;
        font-size: 14px;
    }

    .co-radio-card__price--rose {
        color: var(--rose-deep);
    }

    /* sipariş özeti kalemleri */
    .co-items {
        display: flex;
        flex-direction: column;
    }

    .co-item {
        display: grid;
        grid-template-columns: 56px 1fr auto auto;
        align-items: center;
        gap: 14px;
        padding: 14px 0;
        border-bottom: 1px solid var(--line);
    }

    .co-item:first-child {
        padding-top: 0;
    }

    .co-item__thumb {
        width: 56px;
        height: 72px;
        border-radius: 10px;
        overflow: hidden;
        background: var(--sand);
    }

    .co-item__thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .co-item__info b {
        display: block;
        font-weight: 500;
        font-size: 14px;
        line-height: 1.3;
    }

    .co-item__info small {
        font-size: 12.5px;
        color: var(--ink-60);
    }

    .co-item__qty {
        font-size: 13px;
        color: var(--ink-60);
        white-space: nowrap;
        padding-right: 10px;
    }

    .co-item__price {
        font-weight: 500;
        font-size: 14px;
        white-space: nowrap;
    }

    /* toplamlar */
    .co-sum {
        padding: 18px 0;
        display: flex;
        flex-direction: column;
        gap: 12px;
        border-bottom: 1px solid var(--line);
    }

    .co-sum__row {
        display: flex;
        justify-content: space-between;
        font-size: 14.5px;
    }

    .co-sum__row span {
        color: var(--ink-60);
    }

    .co-sum__row b {
        font-weight: 500;
    }

    .co-free {
        color: #1fa855;
    }

    .co-total {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 18px;
    }

    .co-total span {
        font-size: 17px;
        font-weight: 500;
    }

    .co-total b {
        font-family: var(--f-display);
        font-size: 24px;
        color: var(--rose-deep);
    }

    /* ödeme yöntemi */
    .co-pay {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .co-pay-row {
        display: flex;
        align-items: center;
        gap: 13px;
        border: 1.5px solid var(--line);
        border-radius: 14px;
        padding: 15px 18px;
        cursor: pointer;
        transition: border-color .25s, background .25s;
    }

    .co-pay-row input {
        display: none;
    }

    .co-pay-row.is-checked {
        border-color: var(--rose);
        background: rgba(214, 86, 127, .04);
    }

    .co-pay-row__body {
        display: flex;
        flex-direction: column;
        line-height: 1.35;
        margin-right: auto;
    }

    .co-pay-row__body b {
        font-weight: 500;
        font-size: 14.5px;
    }

    .co-pay-row__body small {
        font-size: 12.5px;
        color: var(--ink-60);
    }

    .co-pay-row__cards {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .co-cc {
        height: 22px;
        min-width: 34px;
        padding: 0 6px;
        border: 1px solid var(--line);
        border-radius: 5px;
        background: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 9px;
        font-weight: 700;
        letter-spacing: .04em;
    }

    .co-cc--visa {
        color: #1a1f71;
    }

    .co-cc--amex {
        color: #2e77bc;
    }

    .co-cc--mc {
        gap: 0;
    }

    .co-cc--mc i {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        display: block;
    }

    .co-cc--mc i:first-child {
        background: #eb001b;
    }

    .co-cc--mc i:last-child {
        background: #f79e1b;
        margin-left: -5px;
        mix-blend-mode: multiply;
    }

    /* siparişi tamamla */
    .co-submit {
        width: 100%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 11px;
        background: var(--plum);
        color: var(--cream);
        border-radius: var(--r-pill);
        padding: 18px 30px;
        font-size: 13px;
        letter-spacing: .14em;
        text-transform: uppercase;
        font-weight: 500;
        box-shadow: var(--sh-2);
        transition: background .3s, transform .4s var(--ease);
    }

    .co-submit svg {
        width: 17px;
        height: 17px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .co-submit:hover {
        background: var(--wine);
        transform: translateY(-2px);
    }

    .co-legal {
        text-align: center;
        font-size: 12.5px;
        color: var(--ink-60);
        line-height: 1.6;
        padding: 0 10px;
    }

    .co-legal a {
        color: var(--rose-deep);
    }

    .co-legal a:hover {
        text-decoration: underline;
    }

    /* güven şeritleri */
    .co-trust {
        margin-top: 56px;
        background: #88004d1c;
        padding: 34px 0;
    }

    .co-trust__grid {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 20px;
    }

    .co-trust__grid--alt {
        margin-top: 26px;
        padding-top: 26px;
        border-top: 1px solid rgba(56, 24, 42, .1);
    }

    .co-trust__item {
        display: flex;
        align-items: center;
        gap: 13px;
    }

    .co-trust__item svg {
        width: 30px;
        height: 30px;
        flex: none;
        fill: none;
        stroke: var(--rose-deep);
        stroke-width: 1.4;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .co-trust__item b {
        display: block;
        font-weight: 500;
        font-size: 13.5px;
        color: var(--ink);
    }

    .co-trust__item small {
        font-size: 12px;
        color: var(--ink-60);
        line-height: 1.35;
    }

    /* responsive */
    @media (max-width: 960px) {
        .co-grid {
            grid-template-columns: 1fr;
        }

        .co-trust__grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media (max-width: 620px) {
        .co-field-row,
        .co-ship {
            grid-template-columns: 1fr;
        }

        .co-steps__label {
            font-size: 11px;
        }

        .co-item {
            grid-template-columns: 48px 1fr auto;
        }

        .co-item__qty {
            grid-column: 2;
            padding-right: 0;
        }

        .co-trust__grid {
            grid-template-columns: 1fr;
        }
    }

/* ============ YENİ EKLENEN STİLLER: Üyelik & EFT Modalı ============ */

/* Üyelikli / Üyeliksiz Sekmeleri */
.co-auth-tabs {
    display: flex;
    background: var(--cream);
    padding: 6px;
    border-radius: 16px;
    border: 1px solid var(--line);
    margin-bottom: 24px;
}

.co-auth-tab {
    flex: 1;
    border: none;
    background: transparent;
    padding: 12px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--ink-60);
    cursor: pointer;
    transition: all .25s var(--ease);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.co-auth-tab.is-active {
    background: #fff;
    color: var(--rose-deep);
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
    font-weight: 600;
}

.co-auth-tab svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    stroke-width: 2;
    fill: none;
}

/* Hızlı Hesap Oluşturma Alanı */
.co-quick-reg {
    background: rgba(214, 86, 127, .05);
    border: 1px dashed var(--rose);
    border-radius: 14px;
    padding: 16px;
    margin-top: 18px;
    transition: all .3s var(--ease);
}

/* Havale / EFT 2 Dakika Sayaçlı & Dekont Modalı */
.eft-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s var(--ease);
}

.eft-modal.is-open {
    opacity: 1;
    pointer-events: auto;
}

.eft-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(28, 12, 21, .65);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.eft-modal__box {
    position: relative;
    z-index: 1;
    background: #fff;
    width: 100%;
    max-width: 540px;
    border-radius: 24px;
    box-shadow: 0 24px 60px rgba(0,0,0,0.25);
    border: 1px solid rgba(255,255,255,0.4);
    overflow: hidden;
    transform: translateY(20px) scale(0.96);
    transition: transform .35s var(--ease);
}

.eft-modal.is-open .eft-modal__box {
    transform: translateY(0) scale(1);
}

.eft-modal__head {
    background: var(--plum);
    color: var(--cream);
    padding: 24px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.eft-modal__head h3 {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.eft-timer {
    background: rgba(255,255,255,0.15);
    padding: 6px 14px;
    border-radius: 50px;
    font-family: var(--f-display);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1px;
    color: #ffdce8;
    display: flex;
    align-items: center;
    gap: 6px;
}

.eft-modal__body {
    padding: 28px;
    max-height: 80vh;
    overflow-y: auto;
}

.eft-step {
    display: none;
}

.eft-step.is-active {
    display: block;
    animation: fadeIn .3s ease forwards;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.eft-info-card {
    background: var(--cream);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 20px;
    margin: 16px 0 24px;
}

.eft-info-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px dashed var(--line);
}

.eft-info-row:last-child {
    border-bottom: none;
}

.eft-info-row span {
    color: var(--ink-60);
    font-size: 13.5px;
}

.eft-info-row b {
    color: var(--ink);
    font-size: 14px;
    font-weight: 600;
}

.eft-iban-box {
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 12px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-family: monospace;
    font-size: 15px;
    font-weight: 700;
    color: var(--plum);
}

.btn-copy {
    background: var(--blush);
    color: var(--rose-deep);
    border: 1px solid var(--line);
    padding: 6px 12px;
    border-radius: 8px;
    font-family: var(--f-body);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all .2s;
}

.btn-copy:hover {
    background: var(--rose);
    color: #fff;
    border-color: var(--rose);
}

/* Dekont yükleme alanı */
.eft-dropzone {
    border: 2px dashed var(--line);
    border-radius: 16px;
    padding: 30px 20px;
    text-align: center;
    background: var(--cream);
    cursor: pointer;
    transition: all .25s var(--ease);
    margin-bottom: 20px;
}

.eft-dropzone:hover,
.eft-dropzone.is-dragover {
    border-color: var(--rose);
    background: rgba(214, 86, 127, .04);
}

.eft-acts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 24px;
}

.eft-acts .btn {
    width: 100%;
    padding: 15px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* ============ KAYITLI ADRESLER (Ödeme Sayfası) ============ */
.co-saddr {
    margin-bottom: 18px;
}

.co-saddr__label {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ink-60);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 10px;
    display: block;
}

.co-saddr__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
}

.co-saddr-card {
    text-align: left;
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 14px;
    padding: 14px 16px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: inherit;
}

.co-saddr-card:hover {
    border-color: var(--rose);
}

.co-saddr-card.on {
    border-color: var(--rose);
    background: #fdf5f8;
    box-shadow: 0 0 0 1px var(--rose);
}

.co-saddr-card__top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.co-saddr-card__title {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
}

.co-saddr-card__default {
    background: #fdf2f6;
    color: var(--rose-deep);
    font-size: 9.5px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 50px;
    text-transform: uppercase;
}

.co-saddr-card__text {
    font-size: 12px;
    color: var(--ink-60);
    line-height: 1.5;
}

.co-saddr-card--new {
    border-style: dashed;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--ink-40);
    min-height: 76px;
}

.co-saddr-card--new.on {
    color: var(--rose-deep);
}

.co-saddr-card--new svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
    stroke-width: 2;
    fill: none;
}