/* ── Müşteri portalı ───────────────────────────────────────────────────
   Kayıt, giriş, parola, cihaz yönetimi ve yönetim ekranları. Renk ve yazı
   belirteçleri site.css'ten; burada yalnızca portalın yerleşimi var. */
:root {
  --pt-bekliyor: #9A6A08;
  --pt-bekliyor-zemin: #FBF3E0;
  --pt-hata-zemin: #F8E9E7;
  --pt-turkuaz-zemin: #E4F1F0;
}

body.pt { display: flex; flex-direction: column; min-height: 100vh; }
body.pt main { flex: 1; }
.pt-ust .kap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.pt-ust-nav { display: flex; align-items: center; gap: 18px; font-size: 15px; }
.pt-ust-nav a:not(.dugme) { color: var(--murekkep); text-decoration: none; font-weight: 500; }
.pt-ust-nav .dugme { padding: 10px 16px; font-size: 14.5px; }
.pt-kim { font: 500 13px var(--f-kod); color: var(--grafit); }
.pt-cikis { font: 600 14px var(--f-govde); background: none; border: 1.5px solid var(--murekkep); color: var(--murekkep); border-radius: var(--r); padding: 8px 14px; cursor: pointer; }
.pt-cikis:hover { background: var(--murekkep); color: #fff; }
.pt-alt { border-top: 1px solid var(--cizgi); padding: 20px 0; font-size: 13.5px; color: var(--grafit); margin-top: 48px; }
.pt-alt .kap { display: flex; gap: 20px; flex-wrap: wrap; }
.pt-alt a { color: var(--grafit); }

/* Kartlar, form */
.pt-kart { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 12px; padding: clamp(20px, 2.6vw, 32px); min-width: 0; }
.pt-kart h1 { font-size: clamp(1.7rem, 3vw, 2.3rem); margin-bottom: 14px; }
.pt-kart h2 { font-size: 1.2rem; }
.pt-kart-bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.pt-tek { padding-block: clamp(40px, 7vw, 88px); }
.pt-tek .pt-kart { max-width: 480px; margin: 0 auto; }

.pt-form { display: grid; gap: 16px; }
.pt-form fieldset { border: 1px solid var(--cizgi); border-radius: 12px; padding: 20px clamp(16px, 2vw, 24px) 22px; margin: 0; display: grid; gap: 14px; background: var(--yuzey); min-width: 0; }
.pt-form legend { font: 700 1.05rem var(--f-baslik); padding: 0 8px; margin-left: -8px; display: flex; align-items: center; gap: 10px; }
.pt-form legend span { width: 26px; height: 26px; border-radius: 50%; background: var(--murekkep); color: #fff; display: grid; place-items: center; font: 500 12.5px var(--f-kod); }
.pt-form label { display: grid; gap: 6px; font: 500 13.5px/1.35 var(--f-govde); color: #2A3345; min-width: 0; }
.pt-form label em { font-style: normal; color: var(--grafit); font-weight: 400; }
.pt-form input:not([type="checkbox"]):not([type="radio"]), .pt-form select, .pt-form textarea, .pt-yon-sutun select, .pt-yon-sutun textarea, .pt-filtre select {
  font: 400 16px/1.35 var(--f-govde); padding: 11px 12px; border: 1px solid #C3CAD7; border-radius: var(--r);
  background: #fff; color: var(--murekkep); width: 100%; min-width: 0;
}
.pt-form textarea, .pt-yon-sutun textarea { resize: vertical; }
.pt-form input:focus, .pt-form select:focus, .pt-form textarea:focus { outline: 3px solid color-mix(in srgb, var(--turkuaz) 35%, transparent); outline-offset: 0; border-color: var(--turkuaz); }
.pt-form input:user-invalid, .pt-form select:user-invalid, .pt-form textarea:user-invalid { border-color: var(--muhur); }
.pt-form .iki { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pt-form code { font: 400 12.5px var(--f-kod); background: var(--kagit); padding: 1px 5px; border-radius: 3px; }
.pt-gonder { justify-content: center; }
.pt-form button:disabled { opacity: .55; cursor: not-allowed; }
.pt-kucuk { font-size: 13.5px; color: var(--grafit); margin: 0; }
.pt-uyari { margin: 0; font: 500 13px/1.5 var(--f-govde); color: var(--muhur); }
.pt-uyari:empty { display: none; }
.pt-tuzak { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pt-onay { display: flex !important; grid-template-columns: none; gap: 10px !important; align-items: flex-start; font-weight: 400 !important; }
.pt-onay input { margin-top: 3px; accent-color: var(--turkuaz); width: 17px; height: 17px; flex: none; }
.pt-aydinlatma { font-size: 13.5px; color: #2A3345; border: 1px dashed #C3CAD7; border-radius: var(--r); padding: 10px 14px; }
.pt-aydinlatma summary { cursor: pointer; font-weight: 500; }
.pt-aydinlatma p { margin: 10px 0 0; }

.pt-mesaj { padding: 12px 14px; border-radius: var(--r); font-size: 14.5px; }
.pt-mesaj.hata { background: var(--pt-hata-zemin); color: #7A231E; border: 1px solid #EBC7C2; }
.pt-mesaj.tamam { background: var(--pt-turkuaz-zemin); color: var(--turkuaz-koyu); border: 1px solid #C4E0DE; }

/* Kayıt */
.pt-kayit { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(28px, 4vw, 64px); padding-block: clamp(32px, 5vw, 64px); align-items: start; }
.pt-kayit-yan { position: sticky; top: 24px; display: grid; gap: 22px; }
.pt-kayit-yan h1 { font-size: clamp(2.2rem, 4vw, 3.4rem); }
.pt-kayit-yan .giris { margin: 0; }
.pt-paketler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pt-paket { position: relative; cursor: pointer; }
.pt-paket input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.pt-paket-ic { display: grid; gap: 3px; border: 1.5px solid var(--cizgi); border-radius: 10px; padding: 14px 16px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.pt-paket-ic b { font: 700 1.1rem var(--f-baslik); }
.pt-paket-fiyat { font: 500 14px var(--f-kod); color: var(--turkuaz-koyu); }
.pt-paket-ic small { font-size: 12.5px; color: var(--grafit); }
.pt-paket input:checked + .pt-paket-ic { border-color: var(--turkuaz); box-shadow: 0 0 0 3px color-mix(in srgb, var(--turkuaz) 18%, transparent); }
.pt-paket input:focus-visible + .pt-paket-ic { outline: 3px solid var(--turkuaz); outline-offset: 2px; }

.pt-ozet-kart { background: var(--murekkep); color: #C9D2E3; border-radius: 12px; padding: 22px 24px; }
.pt-ozet-kart h2 { color: #fff; font-size: 1.1rem; margin-bottom: 12px; }
.pt-ozet { display: grid; gap: 0; }
.pt-ozet-satir { display: flex; justify-content: space-between; gap: 12px; font: 400 13px/1.45 var(--f-kod); padding: 8px 0; border-bottom: 1px dashed var(--cizgi); }
.pt-ozet-satir b { font-weight: 500; text-align: right; color: var(--murekkep); }
.pt-ozet-kart .pt-ozet-satir { border-color: #2B3547; }
.pt-ozet-kart .pt-ozet-satir b { color: #fff; }
.pt-ozet-toplam { margin-top: 14px; }
.pt-ozet-toplam span { font: 500 12px var(--f-kod); color: #9AA6BC; }
.pt-ozet-toplam b { display: block; font: 800 2.1rem/1.1 var(--f-baslik); color: #fff; letter-spacing: -0.03em; margin-top: 4px; }
.pt-ozet-not { font: 400 12.5px/1.5 var(--f-govde); color: #9AA6BC; margin: 12px 0 0; }
.pt-ozet-not a { color: var(--turkuaz-acik); }
.pt-adimlar { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; counter-reset: a; }
.pt-adimlar li { counter-increment: a; display: grid; grid-template-columns: 28px 1fr; gap: 2px 12px; font-size: 14px; }
.pt-adimlar li::before { content: counter(a); grid-row: span 2; width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid var(--murekkep); display: grid; place-items: center; font: 500 12px var(--f-kod); }
.pt-adimlar span { color: var(--grafit); }
.pt-tamam { grid-column: 1 / -1; max-width: 640px; margin: 0 auto; display: grid; gap: 16px; text-align: left; }
.pt-tamam h2 { font-size: clamp(1.8rem, 3vw, 2.4rem); }

/* Durum şeridi */
.pt-durum { display: grid; gap: 3px; padding: 14px 16px; border-radius: 10px; border: 1px solid var(--cizgi); background: #fff; font-size: 14px; }
.pt-durum b { font: 700 1rem var(--f-baslik); }
.pt-durum.bekliyor, .pt-durum.odeme_bekliyor { background: var(--pt-bekliyor-zemin); border-color: #EBDDB8; }
.pt-durum.bekliyor b, .pt-durum.odeme_bekliyor b { color: var(--pt-bekliyor); }
.pt-durum.odeme_alindi, .pt-durum.aktif { background: var(--pt-turkuaz-zemin); border-color: #C4E0DE; }
.pt-durum.odeme_alindi b, .pt-durum.aktif b { color: var(--turkuaz-koyu); }
.pt-durum.iptal { background: var(--pt-hata-zemin); border-color: #EBC7C2; }

/* Panel */
.pt-panel { padding-block: clamp(28px, 4vw, 48px); display: grid; gap: 22px; }
.pt-panel-bas { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; }
.pt-panel-bas h1 { font-size: clamp(1.8rem, 3.2vw, 2.6rem); margin-top: 4px; }
.pt-panel-bas #pt-durum { flex: 0 1 520px; }
.pt-panel-izgara { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.pt-rozet { display: inline-block; font: 500 12px/1 var(--f-kod); padding: 6px 9px; border-radius: 999px; background: var(--kagit); border: 1px solid var(--cizgi); color: #2A3345; white-space: nowrap; }
.pt-rozet.hazirlaniyor, .pt-rozet.d-odeme_bekliyor { background: var(--pt-bekliyor-zemin); border-color: #EBDDB8; color: var(--pt-bekliyor); }
.pt-rozet.hazir, .pt-rozet.d-aktif, .pt-rozet.d-odeme_alindi { background: var(--pt-turkuaz-zemin); border-color: #C4E0DE; color: var(--turkuaz-koyu); }
.pt-rozet.d-iptal { background: var(--pt-hata-zemin); border-color: #EBC7C2; color: var(--muhur); }
.pt-cihazlar { display: grid; gap: 8px; margin-bottom: 22px; }
.pt-cihaz { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; text-align: left; width: 100%; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 10px; background: #fff; cursor: pointer; font: inherit; color: inherit; transition: border-color .15s; }
.pt-cihaz:hover { border-color: var(--turkuaz); }
.pt-cihaz-ico { width: 36px; height: 36px; border-radius: 8px; display: grid; place-items: center; background: var(--murekkep); color: var(--turkuaz-acik); font-family: var(--f-kod); }
.pt-cihaz-ad { display: grid; min-width: 0; }
.pt-cihaz-ad b { font-weight: 600; }
.pt-cihaz-ad small { font: 400 12.5px var(--f-kod); color: var(--grafit); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-cihaz-form { border-top: 1px solid var(--cizgi); padding-top: 18px; }
.pt-cihaz-form h3 { font-size: 1.05rem; }
.pt-cihaz-form .dugme { justify-self: start; }
.pt-bos { display: grid; gap: 4px; padding: 22px; border: 1px dashed #C3CAD7; border-radius: 10px; text-align: center; color: var(--grafit); font-size: 14px; }
.pt-bos b { color: var(--murekkep); }

.pt-dialog { border: 0; border-radius: 14px; padding: 0; width: min(520px, calc(100vw - 32px)); box-shadow: 0 40px 80px -30px rgba(14, 20, 33, .5); }
.pt-dialog::backdrop { background: rgba(14, 20, 33, .45); }
.pt-dialog-ic { padding: 24px; display: grid; gap: 18px; }
.pt-dialog-bas { display: flex; justify-content: space-between; align-items: center; }
.pt-kapat { font-size: 26px; line-height: 1; background: none; border: 0; cursor: pointer; color: var(--grafit); padding: 4px 8px; }
.pt-dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; margin: 0; font-size: 14px; }
.pt-dl dt { color: var(--grafit); }
.pt-dl dd { margin: 0; overflow-wrap: anywhere; font-family: var(--f-kod); font-size: 13px; }
.pt-hazirlik { display: grid; grid-template-columns: 40px 1fr; gap: 14px; padding: 16px; border-radius: 10px; background: var(--pt-turkuaz-zemin); border: 1px solid #C4E0DE; }
.pt-hazirlik b { font-family: var(--f-baslik); }
.pt-hazirlik p { margin: 4px 0 0; font-size: 14px; color: #2A3345; }
.pt-hazirlik-ico { width: 40px; height: 40px; border-radius: 50%; border: 3px solid #C4E0DE; border-top-color: var(--turkuaz); animation: pt-don 1.4s linear infinite; }
@keyframes pt-don { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .pt-hazirlik-ico { animation: none; } }
.pt-dialog-alt { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.pt-dialog-alt .dugme:disabled { opacity: .5; cursor: not-allowed; }
.pt-sil { background: none; border: 0; color: var(--muhur); font: 500 14px var(--f-govde); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* Yönetim */
.pt-filtre { display: grid; gap: 6px; font: 500 13px var(--f-kod); color: var(--grafit); min-width: 200px; }
.pt-yon-ozet { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.pt-yon-ozet > div { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px; padding: 14px 16px; }
.pt-yon-ozet small { display: block; font: 500 11.5px var(--f-kod); text-transform: uppercase; letter-spacing: .04em; color: var(--grafit); }
.pt-yon-ozet b { font: 800 1.9rem/1.1 var(--f-baslik); }
.pt-yon-liste { display: grid; gap: 10px; }
.pt-yon-kart { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px; }
.pt-yon-kart summary { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; gap: 14px; align-items: center; padding: 14px 18px; cursor: pointer; list-style: none; }
.pt-yon-kart summary::-webkit-details-marker { display: none; }
.pt-yon-ad { display: grid; min-width: 0; }
.pt-yon-ad small { font: 400 12.5px var(--f-kod); color: var(--grafit); }
.pt-yon-tutar { font: 500 14px var(--f-kod); white-space: nowrap; }
.pt-yon-ic { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; padding: 4px 18px 20px; border-top: 1px solid var(--cizgi); }
.pt-yon-sutun { display: grid; gap: 10px; align-content: start; padding-top: 16px; }
.pt-yon-sutun h3 { font-size: 1rem; }
.pt-yon-sutun label { display: grid; gap: 5px; font: 500 13px var(--f-govde); }
.pt-yon-sutun select, .pt-yon-sutun textarea { font-size: 14px; padding: 8px 10px; }
.pt-yon-kaydet { display: flex; gap: 12px; align-items: center; }
.pt-yon-kaydet .dugme { padding: 10px 16px; font-size: 14px; }
.pt-yon-cihaz { margin: 0; padding-left: 18px; font: 400 13px/1.6 var(--f-kod); }
.pt-yon-bekleyen { margin: 12px 0 0; padding-left: 18px; font-size: 14px; display: grid; gap: 6px; }

@media (max-width: 980px) {
  .pt-kayit, .pt-panel-izgara { grid-template-columns: minmax(0, 1fr); }
  .pt-kayit-yan { position: static; }
  .pt-yon-ic { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .pt-yon-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .pt-form .iki, .pt-paketler { grid-template-columns: minmax(0, 1fr); }
  .pt-ust .marka small, .pt-kim { display: none; }
  .pt-yon-kart summary { grid-template-columns: minmax(0, 1fr) auto; }
  .pt-yon-tutar { display: none; }
}

/* Sitenin mobil kuralı üst menüyü gizler; portalda hesap bağlantıları her boyutta kalır. */
.pt-ust .pt-ust-nav { display: flex !important; }
@media (max-width: 600px) { .pt-ust-nav { gap: 10px; } .pt-ust-nav a:not(.dugme) { font-size: 14px; } }

/* ── Yönetim paneli ─────────────────────────────────────────────────── */
.pt-yon-ozet { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.pt-yon-ozet b.bekliyor, .pt-yon-para b.bekliyor { color: var(--pt-bekliyor); }
.pt-yon-ozet b.iyi, .pt-yon-para b.iyi { color: var(--turkuaz-koyu); }
.pt-yon-para { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pt-yon-para > div { background: var(--murekkep); color: #C9D2E3; border-radius: 10px; padding: 14px 16px; }
.pt-yon-para small { display: block; font: 500 11.5px var(--f-kod); text-transform: uppercase; letter-spacing: .04em; color: #9AA6BC; }
.pt-yon-para b { font: 800 1.6rem/1.2 var(--f-baslik); color: #fff; }
.pt-yon-para b.iyi { color: var(--turkuaz-acik); }
.pt-yon-para b.bekliyor { color: #F0C27B; }
.pt-sekmeler { display: flex; gap: 4px; border-bottom: 1px solid var(--cizgi); overflow-x: auto; }
.pt-sekmeler button { background: none; border: 0; border-bottom: 2px solid transparent; padding: 10px 14px; font: 600 14.5px var(--f-govde); color: var(--grafit); cursor: pointer; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; margin-bottom: -1px; }
.pt-sekmeler button[aria-selected="true"] { color: var(--murekkep); border-bottom-color: var(--turkuaz); }
.pt-sayi { font: 500 11.5px/1 var(--f-kod); background: var(--kagit); border: 1px solid var(--cizgi); border-radius: 999px; padding: 3px 7px; color: var(--grafit); }
.pt-arac { display: flex; gap: 10px; flex-wrap: wrap; margin: 16px 0 12px; }
.pt-arac input, .pt-arac select, .pt-odeme-form input, .pt-odeme-form select, .pt-yon-izgara select, .pt-yon-izgara input, .pt-yon-izgara textarea, .pt-tablo select {
  font: 400 14.5px var(--f-govde); padding: 9px 10px; border: 1px solid #C3CAD7; border-radius: var(--r); background: #fff; color: var(--murekkep); min-width: 0;
}
.pt-arac input[type="search"] { flex: 1 1 300px; }
.pt-tablo-kap { overflow-x: auto; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 10px; }
.pt-tablo { width: 100%; border-collapse: collapse; font-size: 14px; }
.pt-tablo th { text-align: left; font: 500 11.5px var(--f-kod); text-transform: uppercase; letter-spacing: .04em; color: var(--grafit); padding: 10px 12px; border-bottom: 1px solid var(--cizgi); white-space: nowrap; background: var(--kagit); }
.pt-tablo td { padding: 10px 12px; border-bottom: 1px solid #EDF0F5; vertical-align: top; }
.pt-tablo tr:last-child td { border-bottom: 0; }
.pt-tablo td small { display: block; color: var(--grafit); font-size: 12.5px; }
.pt-tablo .sag { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pt-tablo .mono { font-family: var(--f-kod); font-size: 13px; }
.pt-tablo tr.tik { cursor: pointer; }
.pt-tablo tr.tik:hover td, .pt-tablo tr.tik:focus-visible td { background: var(--pt-turkuaz-zemin); }
.pt-tablo tr.tik:focus-visible { outline: none; }
.pt-bos-hucre { text-align: center; color: var(--grafit); padding: 24px !important; }
.iyi-yazi { color: var(--turkuaz-koyu); }
.bekliyor-yazi { color: var(--pt-bekliyor); font-weight: 600; }
.pt-alt-bas { font-size: 1.1rem; margin: 22px 0 10px; }
.pt-dugmeler { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.pt-kucuk-dugme { padding: 7px 11px !important; font-size: 13px !important; }
.pt-dialog-genis { width: min(1180px, calc(100vw - 24px)); max-height: calc(100vh - 24px); }
.pt-dialog-genis .pt-dialog-ic { max-height: calc(100vh - 24px); overflow-y: auto; }
.pt-dialog-bas h2 { font-size: 1.5rem; }
.pt-yon-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.pt-yon-izgara section { display: grid; gap: 10px; align-content: start; min-width: 0; }
.pt-yon-izgara h3 { font-size: 1rem; margin-top: 6px; }
.pt-yon-izgara label { display: grid; gap: 5px; font: 500 13px var(--f-govde); }
.pt-yon-izgara .pt-onay { display: flex; }
.pt-yon-cihaz li { display: flex; justify-content: space-between; gap: 8px; }
.pt-odeme-form { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px; border: 1px dashed #C3CAD7; border-radius: 8px; }
.pt-odeme-form .dugme { grid-column: 1 / -1; justify-content: center; }
.pt-odeme-form span { grid-column: 1 / -1; }
@media (max-width: 1000px) { .pt-yon-izgara { grid-template-columns: minmax(0, 1fr); } .pt-yon-ozet { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .pt-yon-para, .pt-yon-ozet { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
