/* Ülke kodlu telefon alanı (varliklar/js/cp-telefon.js). Harici kaynak / görsel / bayrak yok: ISO rozeti + arama kodu.
   Renkler bulunduğu sayfanın değişkenlerinden: ana sayfa penceresi (--yazi, --teal…) ve /giris–/kayıt (--cg-…). */
.cpt {
    --cpt-yazi: var(--yazi, #eef5fd);
    --cpt-soluk: var(--soluk, #93a8c3);
    --cpt-cizgi: var(--cizgi-2, rgba(160, 196, 236, .22));
    --cpt-vurgu: var(--teal-2, #8ff0f3);
    --cpt-vurgu-rgb: var(--teal-rgb, 47, 196, 204);
    --cpt-zemin: #0c1c34;
    --cpt-alan: rgba(0, 0, 0, .28);
    --cpt-w: 5.6rem;
    position: relative; display: block; grid-row: 2; grid-column: 1; min-width: 0; width: 100%;
}
body.index-body .cpt, body.index-body .cpt__panel {
    --cpt-yazi: var(--cg-input-text, #0b1a30);
    --cpt-soluk: var(--cg-placeholder, #68798f);
    --cpt-cizgi: var(--cg-line-2, rgba(11, 26, 48, .18));
    --cpt-vurgu: var(--cg-teal-2, #148f9a);
    --cpt-vurgu-rgb: var(--cg-teal-rgb, 47, 196, 204);
    --cpt-zemin: var(--cg-input-dolu, #fff);
    --cpt-alan: var(--cg-input, rgba(255, 255, 255, .92));
}
.cpt-gizle { display: none !important; }

/* Alan: düğmenin kapladığı genişlik kadar sol boşluk */
.cpt > .cpt__girdi { width: 100%; padding-left: calc(var(--cpt-w) + .9rem) !important; }
.cpt__btn {
    position: absolute; z-index: 2; top: .4rem; bottom: .4rem; left: .4rem; width: var(--cpt-w);
    display: flex; align-items: center; justify-content: center; gap: .32rem; margin: 0; padding: 0 .3rem;
    border-radius: 10px; border: 1px solid var(--cpt-cizgi); background: rgba(var(--cpt-vurgu-rgb), .08);
    color: var(--cpt-yazi); font-family: inherit; line-height: 1; cursor: pointer; -webkit-tap-highlight-color: transparent;
    transition: background-color .2s, border-color .2s, opacity .2s;
}
.cpt__btn:hover, .cpt.is-acik .cpt__btn { background: rgba(var(--cpt-vurgu-rgb), .16); border-color: rgba(var(--cpt-vurgu-rgb), .55); }
.cpt__btn:focus-visible { outline: 2px solid var(--cpt-vurgu); outline-offset: 1px; }
.cpt__btn:disabled { opacity: .4; cursor: default; }
.cpt__iso {
    padding: .2rem .3rem; border-radius: 6px; font-family: inherit; font-size: .66rem; font-weight: 700; line-height: 1; letter-spacing: .06em;
    color: var(--cpt-vurgu); background: rgba(var(--cpt-vurgu-rgb), .16);
}
.cpt__kod { font-family: inherit; font-size: .84rem; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: 0; }
.cpt__ok { flex: none; width: 8px; height: 5px; fill: none; stroke: var(--cpt-soluk); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.cpt.is-acik .cpt__ok { transform: rotate(180deg); }

/* Açılır liste (tek panel; diyalog içindeyse diyalogun altında, aksi hâlde body'de; üst katman / sabit konum) */
.cpt__panel {
    --cpt-yazi: var(--yazi, #eef5fd);
    --cpt-soluk: var(--soluk, #93a8c3);
    --cpt-cizgi: var(--cizgi-2, rgba(160, 196, 236, .22));
    --cpt-vurgu: var(--teal-2, #8ff0f3);
    --cpt-vurgu-rgb: var(--teal-rgb, 47, 196, 204);
    --cpt-zemin: #0c1c34;
    --cpt-alan: rgba(0, 0, 0, .28);
    display: none; position: fixed; z-index: 2147483000; inset: auto; margin: 0; padding: 0; box-sizing: border-box;
    flex-direction: column; overflow: hidden; width: 300px; max-width: calc(100vw - 16px);
    border-radius: 14px; border: 1px solid var(--cpt-cizgi); background: var(--cpt-zemin); color: var(--cpt-yazi);
    box-shadow: 0 24px 60px -16px rgba(0, 0, 0, .55), 0 2px 8px rgba(0, 0, 0, .2);
    font-family: inherit; text-align: left;
}
.cpt__panel.is-acik { display: flex; }
.cpt__ara { flex: none; padding: .5rem; border-bottom: 1px solid var(--cpt-cizgi); }
.cpt__panel .cpt__arama {
    display: block; width: 100%; min-height: 42px; margin: 0; padding: 0 .85rem; box-sizing: border-box; border-radius: 10px;
    border: 1px solid var(--cpt-cizgi); background: var(--cpt-alan); color: var(--cpt-yazi); font-family: inherit; font-size: .95rem; font-weight: 500; line-height: 1.2;
    text-align: left; letter-spacing: 0; box-shadow: none; outline: none; -webkit-appearance: none; appearance: none;
}
.cpt__panel .cpt__arama::placeholder { color: var(--cpt-soluk); opacity: 1; }
.cpt__panel .cpt__arama:focus { border-color: var(--cpt-vurgu); box-shadow: 0 0 0 3px rgba(var(--cpt-vurgu-rgb), .2); }
.cpt__liste { position: relative; flex: 1 1 auto; min-height: 0; margin: 0; padding: .25rem; list-style: none; overflow-y: auto; overscroll-behavior: contain; }
.cpt__satir {
    display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 40px; margin: 0; padding: .35rem .7rem;
    border-radius: 8px; cursor: pointer; font-size: .92rem; line-height: 1.25; color: var(--cpt-yazi);
}
.cpt__satir[hidden] { display: none; }
.cpt__satir.is-aktif { background: rgba(var(--cpt-vurgu-rgb), .14); }
.cpt__satir[aria-selected="true"] .cpt__ad { color: var(--cpt-vurgu); font-weight: 700; }
.cpt__ad { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cpt__ck { flex: none; font-variant-numeric: tabular-nums; color: var(--cpt-soluk); font-size: .86rem; }
.cpt__bos { margin: 0; padding: 1rem; text-align: center; font-size: .88rem; color: var(--cpt-soluk); }
.cpt__bos[hidden] { display: none; }
.cpt__panel .cpt__arama::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }

@media (max-width: 480px) {
    .cpt__panel { width: calc(100vw - 16px); }
    .cpt__satir { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
    .cpt__btn, .cpt__ok { transition: none; }
}

/* /giris telefon-veya-e-posta alanı: düğme sol boşluğu büyüttüğü için yer tutucu daha küçük, taşarsa kesilir */
.cpt > .cpt__girdi { text-overflow: ellipsis; }
body.index-body .cpt .cpt__girdi::placeholder { font-size: .92rem; }
@media (max-width: 480px) {
    body.index-body .cpt .cpt__girdi::placeholder { font-size: .8rem; }
}