/* =========================================================
   on_kayit_ui.css
   On_Kayit_Osym.aspx / On_Kayit_Osym_Login.aspx icin kurumsal tema
   Tabler (Bootstrap 5) uzerine yazilir.

   ONEMLI: WebForms sunucu kontrollerinin tipi degistirilmedigi icin
   panel kapsayicilari hala <table runat="server">. Bunlari blok
   gorunumune cevirmek icin .ok-panel kurali kullanilir.
   ========================================================= */

:root {
  --igu-navy:      #1c2b5e;
  --igu-navy-700:  #16224a;
  --igu-navy-900:  #0e1631;
  --igu-gold:      #c9a227;

  --tblr-primary: #1c2b5e;
  --tblr-primary-rgb: 28, 43, 94;
  --tblr-primary-fg: #ffffff;
  --tblr-link-color: #1c2b5e;
  --tblr-link-hover-color: #16224a;

  --ok-navbar-h: 3.5rem;
}

.btn-primary {
  --tblr-btn-bg: var(--igu-navy);
  --tblr-btn-border-color: var(--igu-navy);
  --tblr-btn-hover-bg: var(--igu-navy-700);
  --tblr-btn-hover-border-color: var(--igu-navy-700);
  --tblr-btn-active-bg: var(--igu-navy-900);
  --tblr-btn-active-border-color: var(--igu-navy-900);
}
.text-primary { color: var(--igu-navy) !important; }
.bg-primary   { background-color: var(--igu-navy) !important; }

[data-bs-theme="dark"] {
  --tblr-primary: #6f8ad4;
  --tblr-primary-rgb: 111, 138, 212;
  --tblr-link-color: #93a9e0;
  --tblr-link-hover-color: #b3c3ea;
}
[data-bs-theme="dark"] .btn-primary {
  --tblr-btn-bg: #33488c;
  --tblr-btn-border-color: #33488c;
  --tblr-btn-hover-bg: #3d55a3;
  --tblr-btn-hover-border-color: #3d55a3;
}
[data-bs-theme="dark"] .text-primary { color: #93a9e0 !important; }

body { background: var(--tblr-body-bg); }

/* =========================================================
   1. SUNUCU TABLOLARINI BLOK KAPSAYICIYA CEVIRME
   asp kodu tblGenel.Visible = False dedigi icin element tipi
   <table> olarak korunuyor; gorunumu CSS ile blok yapiyoruz.
   ========================================================= */

.ok-panel,
.ok-panel > tbody,
.ok-panel > tbody > tr,
.ok-panel > tbody > tr > td,
.ok-panel > tr,
.ok-panel > tr > td {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  text-align: start;
}

.ok-panel { margin: 0; border-collapse: collapse; }

/* ic ice gecmis eski duzen tablolarini da blok yap */
.ok-flat,
.ok-flat > tbody,
.ok-flat > tbody > tr,
.ok-flat > tbody > tr > td,
.ok-flat > tr,
.ok-flat > tr > td {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  height: auto !important;
  text-align: start;
}

/* =========================================================
   2. UST CUBUK
   ========================================================= */

.ok-navbar {
  background: var(--igu-navy);
  position: sticky;
  top: 0;
  z-index: 1030;
}
.ok-navbar .navbar-brand img { height: 26px; width: auto; display: block; }

.ok-navbar-user {
  display: flex;
  align-items: center;
  gap: .625rem;
  color: #fff;
}
.ok-navbar-user__ad {
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.2;
  display: block;
}
.ok-navbar-user__no {
  font-size: .75rem;
  opacity: .75;
  line-height: 1.2;
  display: block;
}

/* Ogrenci fotografi — imgResim_Top */
.ok-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
  background: #fff;
  border: 2px solid rgba(255, 255, 255, .35);
  display: block;
  flex: none;
}


@media only screen and (min-width:768px){
    .ok-avatar {
        width: 60px;
        height:60px;
    }
}


/* Cikis dugmesi — btnCikis ust cubukta */
.ok-cikis-btn {
  background: rgba(255, 255, 255, .12) !important;
  border: 1px solid rgba(255, 255, 255, .3) !important;
  color: #fff !important;
  border-radius: 8px !important;
  padding: .375rem .875rem !important;
  font-size: .8125rem !important;
  font-weight: 600 !important;
  height: auto !important;
  width: auto !important;
  cursor: pointer;
  white-space: nowrap;
}
.ok-cikis-btn:hover { background: rgba(255, 255, 255, .22) !important; }

/* =========================================================
   3. KABUK VE YERLESIM
   ========================================================= */

.ok-shell {
  max-width: 1320px;
  margin-inline: auto;
  padding: 1.25rem 1rem 2.5rem;
}
@media (min-width: 768px) { .ok-shell { padding: 1.75rem 1.5rem 3rem; } }

/* minmax(0, 1fr) sart: duz "1fr" grid ogesinin min-content altina
   inmesini engeller, genis bir GridView tum duzeni disari iter. */
.ok-layout { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); }
.ok-layout > * { min-width: 0; }
@media (min-width: 992px) { .ok-layout { grid-template-columns: 17.5rem minmax(0, 1fr); gap: 2rem; } }
@media (min-width: 1200px) { .ok-layout { grid-template-columns: 19.5rem minmax(0, 1fr); } }

/* Kenar cubugu her boyutta basilir; mobilde acilir-kapanir kutu olur,
   masaustunde yapiskan hale gelir. Menu tek kez basildigi icin
   ID cakismasi olmaz. */
.ok-sidebar { display: block; }
@media (min-width: 992px) {
  .ok-sidebar {
    position: sticky;
    top: calc(var(--ok-navbar-h) + 1rem);
    align-self: start;
  }
}

.ok-content-card {
  background: var(--tblr-bg-surface);
  border: 1px solid var(--tblr-border-color);
  border-radius: 12px;
  padding: 1.25rem;
}
@media (min-width: 768px) { .ok-content-card { padding: 1.75rem; } }

/* =========================================================
   4. SOL MENU  (tblMenu — asp:Button listesi)
   ========================================================= */

.ok-menu,
.ok-menu > tbody,
.ok-menu > tbody > tr,
.ok-menu > tbody > tr > td,
.ok-menu > tr,
.ok-menu > tr > td {
  display: block;
  width: 100% !important;
  padding: 0;
  border: 0;
  text-align: start;
}

.ok-menu { width: 100% !important; }
.ok-menu > tbody > tr > td { margin-bottom: .25rem; }

/* asp:Button -> <input type="submit"> olarak render olur */
.ok-menu input[type="submit"] {
  display: block;
  width: 100% !important;
  height: auto !important;
  text-align: left;
  background: transparent !important;
  border: 0 !important;
  border-radius: 10px;
  padding: .625rem .75rem !important;
  font-size: .875rem !important;
  font-weight: 500 !important;
  color: var(--tblr-body-color) !important;
  cursor: pointer;
  transition: background-color .15s ease;
}
.ok-menu input[type="submit"]:hover {
  background: var(--tblr-bg-surface-secondary) !important;
}
.ok-menu input[type="submit"]:focus-visible {
  outline: 2px solid var(--tblr-primary);
  outline-offset: 2px;
}

/* JS aktif adimi isaretler */
.ok-menu input.ok-menu-aktif {
  background: rgba(var(--tblr-primary-rgb), .09) !important;
  color: var(--tblr-primary) !important;
  font-weight: 650 !important;
}
.ok-menu input.ok-menu-bitti {
  color: var(--tblr-success) !important;
}

/* Cikis menude en altta, ayrilmis */
.ok-menu input.ok-menu-cikis {
  color: var(--tblr-danger) !important;
  margin-top: .5rem;
  border-top: 1px solid var(--tblr-border-color) !important;
  border-radius: 0 !important;
  padding-top: .75rem !important;
}

/* Mobil menu kutusu */
@media (max-width: 991.98px) {
  .ok-menu-sarmal { margin-bottom: 1rem; }
}

/* =========================================================
   5. ILERLEME
   ========================================================= */

.ok-ilerleme-basi {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: .5rem;
}

/* =========================================================
   6. PANEL BASLIKLARI
   Orijinalde renkli bgcolor'lu <td>. Sinif eklenerek sadelestirildi.
   ========================================================= */

.ok-panel-baslik {
  display: block !important;
  background: none !important;
  padding: 0 0 1rem !important;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--tblr-border-color) !important;
  text-align: start !important;
  height: auto !important;
}
.ok-panel-baslik span,
.ok-panel-baslik .ok-baslik-yazi {
  color: var(--tblr-body-color) !important;
  font-size: 1.125rem !important;
  font-weight: 650 !important;
  line-height: 1.3;
}

/* =========================================================
   7. FORM ALANLARI
   ========================================================= */

.ok-grid { display: grid; gap: 1rem 1.25rem; grid-template-columns: minmax(0, 1fr); }
.ok-grid > * { min-width: 0; }
@media (min-width: 576px) { .ok-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .ok-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ok-grid > .ok-col-full { grid-column: 1 / -1; }

.ok-field-label {
  font-size: .8125rem !important;
  font-weight: 600 !important;
  color: var(--tblr-secondary) !important;
  margin-bottom: .3125rem;
  display: block;
}
.ok-req::after { content: " *"; color: var(--tblr-danger); font-weight: 700; }

/* asp:TextBox -> <input type="text">, asp:DropDownList -> <select> */
.ok-panel .form-control,
.ok-panel .form-select {
  width: 100% !important;
  max-width: 100%;
}

/* Orijinal markup'taki sabit Width degerlerini ez */
.ok-panel input.form-control[style*="width"],
.ok-panel select.form-select[style*="width"] { width: 100% !important; }

.ok-readonly {
  background: var(--tblr-bg-surface-secondary);
  border: 1px solid var(--tblr-border-color);
  border-radius: 8px;
  padding: .5rem .75rem;
  min-height: 2.375rem;
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: .875rem;
  word-break: break-word;
}

.ok-help {
  font-size: .75rem !important;
  color: var(--tblr-secondary) !important;
  margin-top: .3125rem;
  display: block;
  line-height: 1.45;
  font-weight: 400 !important;
}

/* Telefon alan kodu + numara */
.ok-phone { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: .5rem; }
.ok-phone .form-control { width: 100% !important; }

/* Dogrulama satiri (SMS / e-posta kodu) */
.ok-verify { display: flex; gap: .5rem; align-items: stretch; flex-wrap: wrap; }
.ok-verify .form-control { flex: 1 1 10rem; min-width: 0; width: auto !important; }
.ok-verify input[type="submit"] { flex: none; white-space: nowrap; }

/* asp:RadioButton / asp:CheckBox -> <span><input><label></span> */
.ok-secim { display: grid; gap: .75rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 576px) { .ok-secim { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.ok-secim > span,
.ok-onay > span {
  display: flex;
  align-items: center;
  gap: .5rem;
  border: 2px solid var(--tblr-border-color);
  border-radius: 10px;
  padding: .875rem 1rem;
  transition: border-color .15s ease, background-color .15s ease;
}
.ok-secim > span:has(input:checked),
.ok-onay > span:has(input:checked) {
  border-color: var(--tblr-primary);
  background: rgba(var(--tblr-primary-rgb), .06);
}
.ok-secim input[type="radio"],
.ok-onay input[type="checkbox"] {
  width: 1.125rem;
  height: 1.125rem;
  accent-color: var(--igu-navy);
  flex: none;
  margin: 0;
}
.ok-secim label,
.ok-onay label {
  font-size: .9375rem !important;
  font-weight: 600 !important;
  cursor: pointer;
  margin: 0;
}

/* asp:FileUpload -> <input type="file"> */
.ok-panel input[type="file"] {
  display: block;
  width: 100%;
  font-size: .875rem;
  padding: .5rem .75rem;
  border: 2px dashed var(--tblr-border-color);
  border-radius: 10px;
  background: transparent;
  color: var(--tblr-body-color);
  cursor: pointer;
}
.ok-panel input[type="file"]:hover { border-color: var(--tblr-primary); }

/* =========================================================
   8. LITERAL ALANLARI  (asp:Literal -> veritabanindan ham HTML)
   Icerik editorunden geldigi icin gomulu style tasir.
   Sadece kapsayici duzenlenir, icerigin kendi bicimi korunur.
   ========================================================= */

.ok-literal {
  background: var(--tblr-bg-surface-secondary);
  border: 1px solid var(--tblr-border-color);
  border-inline-start: 3px solid var(--igu-navy);
  border-radius: 8px;
  padding: 1rem 1.125rem;
  margin-bottom: 1.5rem;
  font-size: .9375rem;
  line-height: 1.6;
  overflow-wrap: break-word;
}

/* Aciklama adiminda literal tek basina icerik oldugu icin cerceve yok */
.ok-literal--tam {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
}

.ok-literal p { margin: 0 0 .75rem; }
.ok-literal p:last-child { margin-bottom: 0; }
.ok-literal ol,
.ok-literal ul { margin: 0 0 .75rem; padding-inline-start: 1.5rem; }
.ok-literal li { margin-bottom: .375rem; }
.ok-literal h1,
.ok-literal h2,
.ok-literal h3 {
  font-size: 1.0625rem !important;
  font-weight: 650;
  margin: 1rem 0 .5rem;
  line-height: 1.3;
  background: none !important;
}
.ok-literal img { max-width: 100%; height: auto; }
.ok-literal a { color: var(--tblr-link-color); text-decoration: underline; }

/* Gomulu font-family bildirimlerini yok say, olcegi sinirla */
.ok-literal [style*="font-family"] { font-family: inherit !important; }
.ok-literal [style*="font-size"] { font-size: inherit !important; }
.ok-literal [style*="20px"],
.ok-literal [style*="18px"] { font-size: 1.0625rem !important; font-weight: 650; }

/* Icerideki eski tablolari tasirmadan goster */
.ok-literal table { max-width: 100%; display: block; overflow-x: auto; }

/* =========================================================
   9. GRIDVIEW TABLOLARI
   asp:GridView -> <table>. Inline renkleri ezip Tabler gorunumu verilir.
   ========================================================= */

.ok-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1rem; }

table.ok-gv {
  width: 100% !important;
  border-collapse: collapse;
  background: transparent !important;
  border: 0 !important;
  font-size: .875rem !important;
  color: var(--tblr-body-color) !important;
}

table.ok-gv caption {
  caption-side: top;
  text-align: start;
  padding: 0 0 .625rem;
  font-weight: 650;
  font-size: .9375rem;
  color: var(--tblr-body-color);
}

table.ok-gv > tbody > tr { background: transparent !important; }

table.ok-gv th {
  background: var(--tblr-bg-surface-secondary) !important;
  color: var(--tblr-secondary) !important;
  font-size: .75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-align: start !important;
  padding: .625rem .75rem !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tblr-border-color) !important;
  white-space: nowrap;
}

table.ok-gv td {
  padding: .625rem .75rem !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tblr-border-color) !important;
  text-align: start !important;
  vertical-align: middle;
  color: var(--tblr-body-color) !important;
}

/* GridView satirlarindaki inline renkleri notrle */
table.ok-gv td span { color: inherit !important; width: auto !important; }

/* Onay durumu gibi anlam tasiyan renkler korunur */
table.ok-gv td span.ok-durum-onay   { color: var(--tblr-success) !important; font-weight: 600; }
table.ok-gv td span.ok-durum-bekle  { color: var(--tblr-warning) !important; font-weight: 600; }
table.ok-gv td span.ok-durum-red    { color: var(--tblr-danger)  !important; font-weight: 600; }

/* Tutar kolonu sagda ve rakam hizali */
table.ok-gv td.ok-tutar,
table.ok-gv th.ok-tutar {
  text-align: end !important;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
table.ok-gv td.ok-tutar span { display: inline !important; width: auto !important; }

/* GridView footer satiri (ShowFooter="True") */
table.ok-gv > tbody > tr:last-child td {
  font-weight: 700;
  border-top: 2px solid var(--tblr-border-color) !important;
  border-bottom: 0 !important;
}

/* Detay dugmesi (imgBtnUrun_Odeme_Sekli_Goster) */
table.ok-gv input[type="image"] { width: 20px; height: 20px; }

/* Secili odeme tipi satiri */
table.ok-gv tr.ok-gv-secili td { background: rgba(var(--tblr-primary-rgb), .07) !important; }

/* --- Mobilde kart gorunumu --- */
@media (max-width: 767.98px) {
  table.ok-gv--stack > tbody > tr:first-child { display: none; }  /* baslik satiri */
  table.ok-gv--stack > tbody > tr {
    display: block;
    border: 1px solid var(--tblr-border-color);
    border-radius: 10px;
    padding: .75rem;
    margin-bottom: .75rem;
  }
  table.ok-gv--stack > tbody > tr > td {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .3125rem 0 !important;
    border-bottom: 0 !important;
  }
  table.ok-gv--stack > tbody > tr > td::before {
    content: attr(data-label);
    font-weight: 600;
    color: var(--tblr-secondary);
    font-size: .8125rem;
    flex: none;
  }
}

/* =========================================================
   10. UCRET OZETI
   ========================================================= */

.ok-ucret-duzen { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); }
.ok-ucret-duzen > * { min-width: 0; }
@media (min-width: 992px) { .ok-ucret-duzen { grid-template-columns: minmax(0, 1fr) 20rem; } }

.ok-ucret-kutu {
  background: rgba(var(--tblr-primary-rgb), .06);
  border: 1px solid var(--tblr-border-color);
  border-radius: 12px;
  padding: 1.25rem;
}
.ok-price { font-size: 1.75rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }

/* btnOdeme — orijinalde 509px sabit genislik ve cok uzun metin.
   input[type=submit] varsayilan olarak metni sarmaz; white-space
   normal'e cekilmezse yazi dugmeden tasar. */
.ok-odeme-btn {
  display: block;
  width: 100% !important;
  height: auto !important;
  min-height: 2.75rem;
  background: var(--igu-navy) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 8px !important;
  padding: .75rem 1rem !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  cursor: pointer;
  line-height: 1.35;
  white-space: normal !important;
  text-align: center;
  overflow-wrap: break-word;
}
.ok-odeme-btn:hover { background: var(--igu-navy-700) !important; }

/* Indirim basvuru kutusu (tblindirim) */
.ok-indirim-kutu {
  border: 1px solid var(--tblr-border-color) !important;
  border-radius: 12px;
  overflow: hidden;
  width: 100% !important;
  margin-top: 1.5rem;
}
.ok-indirim-basi {
  background: var(--igu-navy) !important;
  color: #fff !important;
  padding: 1rem 1.125rem !important;
  text-align: start !important;
}
.ok-indirim-basi span { color: #fff !important; }
.ok-indirim-basi .ok-indirim-baslik {
  font-size: 1rem !important;
  font-weight: 650 !important;
  display: block;
  height: auto !important;
  padding: 0 !important;
}
.ok-indirim-basi .ok-indirim-alt {
  font-size: .8125rem !important;
  opacity: .85;
  font-weight: 400 !important;
  display: block;
  margin-top: .25rem;
}
.ok-indirim-govde { padding: 1.125rem !important; }

/* =========================================================
   11. AKSIYON CUBUGU  (geri / ileri ImageButton'lari)
   ========================================================= */

.ok-actions {
  display: flex;
  gap: .75rem;
  align-items: center;
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--tblr-border-color);
}
.ok-actions__spacer { flex: 1; }

/* input type=image yerine metinli dugme gorunumu */
.ok-nav-btn {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  height: auto !important;
  width: auto !important;
  border-radius: 8px !important;
  padding: .5rem 1rem !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  cursor: pointer;
  border: 1px solid var(--tblr-border-color) !important;
  background: var(--tblr-bg-surface) !important;
  color: var(--tblr-body-color) !important;
}
.ok-nav-btn:hover { background: var(--tblr-bg-surface-secondary) !important; }

.ok-nav-btn--ileri {
  background: var(--igu-navy) !important;
  border-color: var(--igu-navy) !important;
  color: #fff !important;
}
.ok-nav-btn--ileri:hover { background: var(--igu-navy-700) !important; }

.ok-nav-btn--tamam {
  background: var(--tblr-success) !important;
  border-color: var(--tblr-success) !important;
  color: #fff !important;
}

@media (max-width: 575.98px) {
  .ok-actions { flex-wrap: wrap; }
  .ok-nav-btn { flex: 1 1 auto; justify-content: center; }
}

/* =========================================================
   12. HATA KUTUSU (tblHata)
   ========================================================= */

.ok-hata {
  width: 100% !important;
  border: 0 !important;
  margin-bottom: 1rem;
}
.ok-hata,
.ok-hata > tbody,
.ok-hata > tbody > tr,
.ok-hata > tbody > tr > td {
  display: block;
  width: 100% !important;
  border: 0 !important;
  padding: 0;
}
.ok-hata .ok-hata-govde {
  background: rgba(var(--tblr-danger-rgb, 214, 57, 57), .1);
  border: 1px solid var(--tblr-danger);
  border-radius: 10px;
  padding: .875rem 1rem;
}
.ok-hata .ok-hata-govde span {
  color: var(--tblr-danger) !important;
  font-weight: 600;
  width: auto !important;
  height: auto !important;
}

/* =========================================================
   13. GIRIS EKRANI (On_Kayit_Osym_Login.aspx)
   ========================================================= */

.ok-auth {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 992px) {
  .ok-auth { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
}

.ok-auth__brand {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(120% 90% at 10% 0%, #2a3f80 0%, transparent 55%),
    linear-gradient(160deg, var(--igu-navy) 0%, var(--igu-navy-900) 100%);
  padding: 1.5rem 1.25rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 992px) {
  .ok-auth__brand { padding: 3.5rem clamp(2rem, 4vw, 4.5rem); }
}
.ok-auth__brand::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(120% 80% at 20% 10%, #000 0%, transparent 70%);
  mask-image: radial-gradient(120% 80% at 20% 10%, #000 0%, transparent 70%);
  pointer-events: none;
}
.ok-auth__brand > * { position: relative; z-index: 1; }

.ok-auth__logo {
  background: #fff;
  border-radius: 10px;
  padding: .625rem .875rem;
  display: inline-block;
  width: -moz-fit-content;
  width: fit-content;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .22);
}
.ok-auth__logo img { display: block; height: 42px; width: auto; }

.ok-auth__title {
  font-size: clamp(1.25rem, 1rem + 1.6vw, 2.125rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.015em;
  margin: 1.25rem 0 .5rem;
  text-wrap: balance;
}
@media (min-width: 992px) { .ok-auth__title { margin: 1.75rem 0 .75rem; } }

.ok-auth__lead {
  color: rgba(255, 255, 255, .72);
  font-size: .9375rem;
  max-width: 46ch;
  margin-bottom: 1.25rem;
}
@media (min-width: 992px) { .ok-auth__lead { font-size: 1rem; margin-bottom: 2rem; } }

.ok-auth__notes { list-style: none; padding: 0; margin: 0; display: grid; gap: .875rem; }
.ok-auth__notes li {
  display: flex;
  gap: .75rem;
  align-items: flex-start;
  color: rgba(255, 255, 255, .84);
  font-size: .875rem;
  line-height: 1.5;
}
.ok-auth__notes svg { flex: none; margin-top: .1875rem; color: var(--igu-gold); }

.ok-auth__form {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.25rem 3rem;
  background: var(--tblr-body-bg);
}
@media (min-width: 992px) { .ok-auth__form { padding: 3rem; } }
.ok-auth__card { width: 100%; max-width: 27rem; }

/* Giris formundaki asp:ImageButton yerine metinli dugme */
.ok-giris-btn {
  display: block;
  width: 100% !important;
  height: auto !important;
  background: var(--igu-navy) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 8px !important;
  padding: .75rem 1rem !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  cursor: pointer;
}
.ok-giris-btn:hover { background: var(--igu-navy-700) !important; }

/* Giris ekranindaki duyuru kutusu */
.ok-login-kapali {
  display: block;
  text-align: center;
  width: 100%;
  line-height: 1.6;
  font-size: .9375rem;
}

/* =========================================================
   14. YARDIMCILAR
   ========================================================= */

.ok-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--igu-navy);
  color: #fff;
  padding: .625rem 1rem;
  border-radius: 0 0 8px 0;
  z-index: 2000;
}
.ok-skip-link:focus { left: 0; color: #fff; }

/* WebForms'un ekledigi gizli alanlar sayfa akisini bozmasin */
.aspNetHidden { display: none; }

@media print {
  .ok-sidebar, .ok-actions, .ok-navbar, .ok-menu-sarmal { display: none !important; }
  .ok-panel { display: block !important; }
  .ok-shell { max-width: none; padding: 0; }
}

/*.ok-phone {
    display: grid !important;
    grid-template-columns: 4.5rem minmax(0, 1fr) !important;
    gap: .5rem !important;
    align-content: center !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    justify-items: start !important;
    grid-auto-flow: column !important;
}



#txtCepTel_Alan_Kod_Veli {
    max-width: 65px !important;
}

#txtCepTel_Alan_Kod {
    max-width: 65px !important;
}



@media only screen and (min-width:768px) {
    #txtCep_Tel_Veli {
        min-width: 272px !important;
    }

    #txtCep_Tel {
        min-width: 272px !important;
    }
}


@media only screen and (max-width:768px) {
    #txtCep_Tel_Veli {
        min-width: 268px !important;
    }

    #txtCep_Tel {
        max-width: 178px !important;
    }
}*/

.ok-phone {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px;
    width: 100%;
}

    .ok-phone .phone-country {
        flex: 0 0 75px;
        width: 75px !important;
    }

    .ok-phone .phone-area {
        flex: 0 0 75px;
        width: 75px;
    }

    .ok-phone .phone-number {
        flex: 1 1 auto;
        min-width: 0;
    }