:root {
       --soft-bg: #f3f4ff;
       /* topbar arka planı (çok açık lila) */
       --nav-bg: #4a3f78;
       /* menü rengi (mevcut) */
       --pill-shadow: 0 4px 10px rgba(0, 0, 0, .06);
       --radius-20: 20px;
   }

   body {
       font-family: 'Poppins', sans-serif;
   }

   body {
       background: #fff;
   }

   /* 1100px sabit çalışma alanı */
   .site-container {
       max-width: 1100px;
       margin: 0 auto;
       padding-left: 12px;
       padding-right: 12px;
   }

   /* TOPBAR */
   .topbar {
       background: var(--soft-bg);
   }

   .topbar .logo {
       height: 64px;
       width: auto;
   }

   /* Arama kutusu */
   .search-wrap {
       position: relative;
       width: 100%;
       max-width: 520px;
       margin: 0 16px;
   }

   .search-wrap input {
       border-radius: var(--radius-20) !important;
       padding-right: 44px;
       /* ikon için iç boşluk */
       height: 38px;
       border: 1px solid #e6e6ef;
       background: #fff;
       box-shadow: var(--pill-shadow);
   }

   .search-wrap input::placeholder {
       font-size: 12px;
       color: #888;
       line-height: 1.9;
       /* dikey hizalamayı düzeltir */
       text-indent: 3px;
       /* biraz sağa kaydırır */
   }

   .search-wrap .search-icon {
       position: absolute;
       right: 12px;
       top: 50%;
       transform: translateY(-50%);
       pointer-events: none;
       opacity: .7;
   }

   /* Bildirim & Profil pill */
   .pill {
       background: #fff;
       border-radius: 999px;
       box-shadow: var(--pill-shadow);
       padding: 8px 14px;
       display: flex;
       align-items: center;
       gap: 10px;
   }

   .pill strong {
       font-size: 13px;
       font-weight: 500;
   }

   .pill small {
       font-size: 11px;
       margin-top: 5px;
   }

   .pill i {
       font-size: 22px;
   }

   .bell-btn {
       position: relative;
       display: flex;
       align-items: center;
       justify-content: center;
       width: 44px;
       height: 44px;
       border-radius: 999px;
       background: #fff;
       box-shadow: var(--pill-shadow);
       border: none;
   }

   .bell-btn .dot {
       position: absolute;
       left: 0px;
       bottom: 2px;
       width: 14px;
       height: 14px;
       background: #ff2d2d;
       border: 2px solid #fff;
       border-radius: 50%;
   }

   /* NAVBAR (dokunma) */
   .main-nav {
       background: var(--nav-bg);
   }

   .main-nav .nav-link {
       color: #fff;
       font-size: 14px;
   }

   .main-nav .nav-link:hover {
       opacity: .9;
   }


   /* Hoşgeldin geniş kart */
   .welcome-card {
       background: #fff;
       border-radius: 10px;
       border: 0.5px solid rgba(0, 0, 0, 0.1);
       /* 0.5px gibi ince çizgi efekti */
       box-shadow: none;
       overflow: hidden;
       /* şerit köşeleri düzgün olsun */
       min-height: 120px;
   }

   .welcome-aside {
       width: 60px;
       /* dikey şerit genişliği */
       background: #eef1ff;
       /* ikon arka plan rengi */
       display: flex;
       align-items: center;
       justify-content: center;
       /* ikon tam ortada */
   }

   .welcome-aside i {
       font-size: 30px;
       color: #8b8f9b;
   }

   .welcome-body {
       padding: 16px 18px;
       margin-top: 20px !important;
   }

   .welcome-body strong {
       font-size: 15px;
       color: #000000;
       font-weight: 500;
   }

   .welcome-body p {
       font-size: 11px !important;
       color: #000000 !important;
       font-weight: 200;
   }


   /* Küçük bilgi kutuları (daha kompakt) */
   .info-box {
       border-radius: 10px;
       padding: 14px 16px;
       min-height: 120px;
       font-size: 13px;
   }

   .info-box strong {
       font-size: 18px !important;
       font-weight: 500;
       /* normal kalınlık */
       color: #4E4C4C !important;
   }

   .info-box i {
       font-size: 18px !important;

   }


   .bg-green {
       background: #DCFCE7;
   }

   .bg-red {
       background: #fde8e8;
   }

   .bg-gray {
       background: #f5f5f5;
   }


   /* Ortak kutu iskeleti */
   .section-box {
       background: #fff;
       border: 1px solid rgba(0, 0, 0, .12);
       border-radius: 12px;
       padding: 16px;
   }

   /* Başlık satırı (sol kutu) */
   .upcoming-box .section-head {
       display: flex;
       align-items: center;
       justify-content: space-between;
       border-bottom: 1px solid #f0f0f0;
       padding-bottom: 10px;
       margin-bottom: 14px;
   }

   .upcoming-box .section-head i {
       font-size: 14px;
       color: #3c3f47;
       opacity: .9;
   }

   .upcoming-box .section-head .title {
       font-weight: 600;
       font-size: 13px;
       letter-spacing: .3px;
       text-transform: uppercase;
       color: #3c3f47;
   }

   .view-all-btn {
       border-color: #7b6ef6;
       color: #7b6ef6;
       padding: 6px 12px;
       font-size: 12px;
   }

   /* Ders kartı */
   .lesson-card {
       border: 1px solid rgba(0, 0, 0, .08);
       border-radius: 12px;
       overflow: hidden;
       background: #fff;
   }

   .lesson-thumb {
       width: 100%;
       height: 130px;
       object-fit: cover;
   }

   .lesson-body {
       padding: 12px;
   }

   .lesson-title {
       margin: 0 0 10px 0;
       font-size: 13px;
       font-weight: 500;
       color: #24262b;
   }

   /* Meta bar (takvim + saat tek kutu içinde) */
   .lesson-meta {
       border: 1px solid #ececec;
       border-radius: 10px;
       padding: 8px 10px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 8px;
       background: #fff;
   }

   .lesson-meta .chip {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       font-size: 12px;
       color: #6c7280;
       white-space: nowrap;
   }

   .lesson-meta .chip i {
       font-size: 14px;
   }

   /* Derse Katıl: dış çizgiyle birleşik */
   .lesson-body {
       padding: 12px 12px 0;
   }

   /* alt padding'i kaldır */
   .lesson-footer {
       font-size: 12px;
       font-weight: 400;
       margin: 10px -12px -12px;
       /* yanlardan ve alttan taşı */
       background: #f9fafb;
       border-top: 1px solid #e7e7e7;
       /* kart çizgisiyle aynı ton */
       padding: 12px;
       text-align: center;
       border-bottom-left-radius: 12px;
       border-bottom-right-radius: 12px;
   }

   .lesson-footer .lf-text {
       display: inline-block;
       transform: translateY(-5px);
       color: #000;

   }

   .lesson-meta.meta-split {
       border: none;
       padding: 0;
       background: transparent;
       display: flex;
       align-items: center;
       gap: 12px;
       /* tarih ve saat arası boşluk */
   }

   .chip-group {
       display: flex;
       align-items: center;
       gap: 8px;
   }

   /* İkon zeminli kare */
   .chip-icon {
       width: 36px;
       height: 36px;
       border-radius: 10px;
       /* görseldeki yuvarlatma */
       background: #eef0f6;
       /* hafif gri/lila zemin */
       display: flex;
       align-items: center;
       justify-content: center;
   }

   .chip-icon i {
       font-size: 14px;
       color: #4a3f78;
   }

   /* Metin kutusu (çerçeveli beyaz) */
   .chip-box {
       height: 36px;
       padding: 0 16px;
       display: flex;
       align-items: center;
       border: 1px solid #e6e6e6;
       background: #fff;
       border-radius: 12px;
       font-size: 11px;
       /* Poppins ile uyumlu */
       color: #6c7280;
   }




   /* Sağ panel - başlık */
   .announce-box {
       padding: 12px;
   }

   .announce-head {
       background: linear-gradient(135deg, #6f5de6 0%, #8e7bff 100%);
       color: #fff;
       border-radius: 12px;
       padding: 12px 14px;
       font-weight: 600;
       margin: 4px;
       margin-bottom: 12px;
       text-align: left;
   }

   /* Duyuru listesi */
   .announce-list {
       padding: 0 8px 8px;
   }

   .announce-item {
       display: flex;
       gap: 10px;
       padding: 10px 0;
       border-bottom: 1px solid #f2f2f4;
   }

   .announce-item:last-child {
       border-bottom: none;
   }

   .announce-item .icon {
       width: 34px;
       height: 34px;
       border-radius: 50%;
       background: #eef1ff;
       display: flex;
       align-items: center;
       justify-content: center;
       flex: 0 0 34px;
       color: #7b6ef6;
   }

   .announce-item .content {
       flex: 1;
   }

   .announce-item .top {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 10px;
       margin-bottom: 2px;
   }

   .announce-item .top strong {
       font-size: 12px;
       font-weight: 500;
       color: #2d3139;
   }

   .announce-item .top .date {
       font-size: 10px;
       color: #9aa0ad;
       white-space: nowrap;
   }

   .announce-item p {
       margin: 0;
       color: #8a909c;
       font-size: 12px;
       max-width: 85%;
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
   }

   /* Dış kutu ve başlık şeridi */
   .popular-box {
       border: 1px solid rgba(0, 0, 0, .12);
       border-radius: 12px;
       background: #fff;
       padding: 12px;
   }

   .popular-head {
       background: #f7f3e8;
       /* krem şerit */
       border-radius: 8px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       margin-bottom: 12px;
       margin: -12px -12px 12px;
       /* sol/sağ kenarlara “bleed” */
       padding: 10px 16px;
       /* krem */
       border-radius: 12px 12px 0 0;
       /* sadece üst köşeler yuvarlak */
       border-bottom: 1px solid #ececec;
       /* alt ayırıcı çizgi */
   }

   .popular-head .left {
       display: flex;
       align-items: center;
   }

   .popular-head .title {
       font-weight: 600;
       color: #2d3139;
       font-size: 14px;
   }

   .view-all-btn {
       border-color: #7b6ef6;
       color: #7b6ef6;
       padding: 6px 12px;
       font-size: 12px;
   }

   /* Kart */
   .popular-card {
       border: 1px solid rgba(0, 0, 0, .08);
       border-radius: 12px;
       background: #fff;
       overflow: hidden;
   }

   .popular-card .meta-wrap {
       display: inline-flex;
       /* genişlik içeriğe göre */
       justify-content: flex-start;
       gap: 8px;
       padding-left: 0;
       /* soldaki iç boşluğu kaldır */
   }

   .popular-thumb {
       width: 100%;
       height: 120px;
       object-fit: cover;
   }

   .popular-body {
       padding: 10px 12px;
   }

   .popular-title {
       margin: 6px 0 8px;
       font-weight: 500;
       color: #24262b;
       font-size: 13px;
   }

   /* Meta alan: kutu içinde iki küçük chip */
   .meta-wrap {
       border-radius: 10px;
       padding: 8px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 8px;
       background: #fff;
   }

   .mini-chip {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       border: 1px solid #e9e9e9;
       border-radius: 8px;
       background: #fff;
       padding: 4px 10px;
       font-size: 11px;
       color: #6c7280;
       white-space: nowrap;
   }

   .mini-chip i {
       font-size: 14px;
   }

   /* Alt şerit: Eğitim Detayları (Derse Katıl mantığı) */
   .course-footer {
       margin: 10px -12px -10px;
       /* kart çizgisiyle birleşik */
       background: #f9fafb;
       border-top: 1px solid #e7e7e7;
       text-align: center;
       padding: 10px 12px;
       border-bottom-left-radius: 12px;
       border-bottom-right-radius: 12px;
       font-size: 12px;
       color: #6c7280;
   }

   .meta-wrap {
       flex-wrap: nowrap;
   }


   /* Arka plan: #F7F6F6 (tam satır) */
   .social-strip {
       margin-top: 40px;
       background: #F7F6F6;
       padding: 18px 0;
   }

   /* Ortada ikonlar */
   .social-list {
       list-style: none;
       display: flex;
       justify-content: center;
       align-items: center;
       gap: 18px;
       margin: 0;
       padding: 0;
   }

   /* İkon butonları: beyaz daire */
   .social-btn {
       width: 40px;
       height: 40px;
       display: flex;
       align-items: center;
       justify-content: center;
       background: #fff;
       /* istenen: beyaz */
       border: 1px solid #e6e6e6;
       /* ince kontur */
       border-radius: 50%;
       font-size: 20px;
       color: #222;
       text-decoration: none;
       transition: .15s ease;
   }

   .social-btn:hover {
       transform: translateY(-1px);
       box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
       color: #222;
   }

   /* Footer minimal */
   .footer-minimal {
       background: #fff;
       margin-top: 40px;
       padding: 18px 0 26px;
       border-top: 1px solid rgba(0, 0, 0, .06);
   }

   .footer-minimal .footer-brand {
       text-align: center;
       font-size: 12px;
       color: #222;
       margin-bottom: 10px;
   }

   .footer-links {
       list-style: none;
       display: flex;
       justify-content: center;
       align-items: center;
       flex-wrap: wrap;
       gap: 18px;
       /* temel aralık */
       margin: 0 0 10px;
       padding: 0;
       font-size: 13px;
   }

   .footer-links li {
       display: flex;
       align-items: center;
   }

   .footer-links li+li::before {
       content: "•";
       color: #9aa0ad;
       margin-right: 18px;
       /* ayraç ile link arasında boşluk */
   }

   .footer-links a {
       color: #222;
       text-decoration: none;
   }

   .footer-links a:hover {
       text-decoration: underline;
   }

   .footer-logo {
       text-align: center;
       margin-top: 6px;
   }

   .footer-logo img {
       height: 30px;
       /* görseldeki boyuta yakın */
       width: auto;
   }

   :root {
       --brand: #79F06A;
       /* Tekliflee yeşili */
       --ink: #0f172a;
       /* koyu metin */
       --muted: #8a94a6;
       /* ikincil metin */
       --input-bg: #eaf2ff;
       /* açık mavi input */
       --soft: #F7F6F6;
       /* açık gri */
       --radius: 18px;
   }

   * {
       box-sizing: border-box;
   }

   /* Sayfa 2 sütun düzeni */
   .auth-wrap {
       min-height: 100dvh;
       display: grid;
       grid-template-columns: 1fr 1fr;
   }

   .auth-left {
       display: flex;
       align-items: center;
       justify-content: center;
       padding: 48px 24px;
   }

   .auth-card {
       width: 100%;
       max-width: 400px;
   }

   /* Logo (istersen kendi svg/png’ni koy) */
   .brandline {
       display: flex;
       align-items: center;
       gap: 10px;
       margin-bottom: 18px;
   }

   .brand-mark {
       width: 36px;
       height: 36px;
       border-radius: 10px;
       background: var(--brand);
       display: grid;
       place-items: center;
       color: #0b1;
       box-shadow: 0 6px 20px rgba(121, 240, 106, .35);
   }

   .brandname {
       font-weight: 600;
       letter-spacing: .2px;
   }

   .brandname img {
       width: 300px;
       justify-content: center;
   }

   .brand-logo {
       display: block;
       margin: 0 auto;
   }

   /* Segmented switch (Giriş Yap / Kayıt) */
   .segmented {
       background: #fff;
       border-radius: 999px;
       padding: 6px;
       border: 1px solid #e7e7e7;
       display: flex;
       gap: 6px;
       margin-bottom: 18px;
       box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
   }

   .segmented .seg {
       flex: 1 1 0;
       text-align: center;
       border-radius: 999px;
       border: none;
       background: transparent;
       padding: 10px 12px;
       font-weight: 600;
       color: #6b7280;
   }

   .segmented .seg.active {
       background: var(--brand);
       color: #053314;
       box-shadow: 0 6px 18px rgba(121, 240, 106, .35);
   }

   /* Form alanları */
   .form-label {
       font-size: 12px;
       color: #6b7280;
       margin-bottom: 6px;
   }

   .form-control {
       background: var(--input-bg);
       border: 0;
       border-radius: var(--radius);
       height: 46px;
       box-shadow: 0 6px 18px rgba(0, 0, 0, .06) inset;
   }

   .form-control:focus {
       background: var(--input-bg);
       box-shadow: 0 0 0 3px rgba(121, 240, 106, .25);
   }

   .input-icon .btn {
       background: transparent;
       border: 0;
       color: #8b94a6;
   }

   /* Hatırla + link */
   .meta-row {
       display: flex;
       align-items: center;
       justify-content: space-between;
       margin-top: 10px;
       margin-bottom: 14px;
   }

   .form-check-input {
       width: 18px;
       height: 18px;
       border-radius: 4px;
       border: 2px solid #cdeacc;
   }

   .form-check-input:checked {
       background-color: var(--brand);
       border-color: var(--brand);
   }

   .meta-row a {
       color: #6d76ff;
       font-size: 12px;
       text-decoration: none;
   }

   .meta-row a:hover {
       text-decoration: underline;
   }

/* Policy links styling for auth forms */
.policy-links {
	margin-top: 12px;
}
.policy-links a {
	color: #6c757d;
	text-decoration: none;
	padding: 2px 4px;
	border-radius: 6px;
}
.policy-links a:hover {
	color: #0d6efd;
	background: rgba(13,110,253,0.08);
}

   /* Giriş butonu */
   .btn-brand {
       background: var(--brand);
       border: none;
       color: #0b3413;
       font-weight: 700;
       height: 48px;
       border-radius: 14px;
       box-shadow: 0 12px 26px rgba(121, 240, 106, .35);
   }

   .btn-brand:hover {
       filter: brightness(.97);
   }

   /* Sağ panel */
   .auth-right {
       position: relative;
       background: linear-gradient(130deg, #f2f3ff 0%, #f5f1ff 60%, #f6f6ff 100%);
       display: flex;
       align-items: center;
       justify-content: center;
       padding: 40px 24px;
   }

   .hero {
       max-width: 520px;
   }

   .hero-title {
       font-size: 48px;
       line-height: 1.1;
       font-weight: 700;
       margin-bottom: 22px;
       color: #0b132b;
   }

   .hero-title .brand {
       color: var(--brand);
   }

   .hero-illustration {
       width: 100%;
       max-width: 520px;
       height: auto;
       display: block;
       border-radius: 22px;
   }

   @media (max-width: 992px) {
       .auth-wrap {
           grid-template-columns: 1fr;
       }

       /* tek sütun */
       .auth-left {
           order: 1;
       }

       /* giriş */
       .auth-right {
           order: 2;
       }

       /* görsel */
   }

   :root {
       --pill-border: #E7E6F1;
       --pill-bg: #FFFFFF;
       --pill-radius: 8px;

       --ico-bg: #EAE5F3;
       --ico-border: #CFC6E6;
       --ico-color: #6E62A6;
       /* yumuşak mor */
       --text-900: #1F2937;
       --text-500: #6B7280;
   }

   /* Sadece bu alan 1100px olsun ve ortalansın */
   .container-1100 {
       max-width: 1090px;
       width: 100%;
       margin-left: auto;
       margin-right: auto;
       padding-left: 12px;
       /* container iç boşlukları */
       padding-right: 12px;
   }


   /* Daire içi görsel avatar */
   .avatar-42 {
       width: 24px;
       height: 24px;
       border-radius: 50%;
       overflow: hidden;
       display: inline-block;
       border: 1px solid #e5e7eb;
       /* ince gri çerçeve */
       background: linear-gradient(180deg, #eee, #d9d9d9);
       /* görsel yoksa fallback */
   }

   .avatar-42 img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block;
       /* resmi daireye kırpar */
   }


   .course-title-42 {
       font-size: 16px;
       font-weight: 600;
       color: #111827;
       /* görseldeki sade siyah */
   }

   .status-pill-42 {
       display: inline-flex;
       align-items: center;
       gap: .5rem;
       padding: .35rem .6rem;
       background: #F6F7FB;
       /* açık gri/lavanta arka plan */
       border: 1px solid #E7E6F1;
       /* etraf çizgisi */
       border-radius: 8px;
       color: #111827;
       font-size: 13px;
       margin-right: -250px;
   }

   .status-ico-42 {
       width: 22px;
       height: 22px;
       display: grid;
       place-items: center;
       border-radius: 6px;
       color: #6E62A6;
       /* mor ikon rengi */
       font-size: 15px;
       line-height: 1;
   }

   /* küçük ekran uyumu */
   @media (max-width: 576px) {
       .course-title-42 {
           font-size: 15px;
       }

       .status-pill-42 {
           font-size: 12px;
           padding: .3rem .5rem;
       }

       .status-ico-42 {
           width: 20px;
           height: 20px;
           font-size: 11px;
       }
   }

   .trainer-meta-42 {
       line-height: 1;
   }

   .avatar-dot-42 {
       width: 22px;
       height: 22px;
       border-radius: 50%;
       background: linear-gradient(180deg, #EEE, #D9D9D9);
       display: inline-block;
       border: 1px solid #E5E7EB;
   }

   .trainer-name-42 {
       font-size: 13px;
       color: var(--text-900);
       font-weight: 500;
   }

   .meta-pill-42 {
       display: inline-flex;
       align-items: center;
       gap: .45rem;
       padding: .35rem .6rem;
       border: 1px solid var(--pill-border);
       background: var(--pill-bg);
       border-radius: var(--pill-radius);
       font-size: 12px;
       color: var(--text-900);
   }

   .meta-pill-42 i {
       font-size: 14px;
   }

   .meta-ico-42 {
       width: 24px;
       height: 24px;
       display: grid;
       place-items: center;
       border-radius: 6px;
       border: 1px solid var(--ico-border);
       background: var(--ico-bg);
       color: var(--ico-color);
       font-size: 12px;
       line-height: 1;
   }

   /* küçük ekranlarda taşma olmasın */
   @media (max-width: 576px) {
       .trainer-name-42 {
           font-size: 14px;
       }

       .meta-pill-42 {
           font-size: 12px;
           padding: .3rem .5rem;
       }

       .meta-ico-42 {
           width: 22px;
           height: 22px;
           font-size: 11px;
       }
   }

   .enrolled-head-42 {
       padding: .75rem 1rem;
       border-bottom: 1px solid #e9ecef;
       border-radius: 8px 8px 0 0;
       /* köşeler */
       position: relative;
       overflow: hidden;
       /* görseli köşelerde kırp */
   }

   /* Arka plan görseli + renk kaplama (#F7F6F6) */
   .head-bg-42::before {
       content: "";
       position: absolute;
       inset: 0;
       background: url("/path/your-header-bg.jpg") center/cover no-repeat;
       /* görsel yolunu değiştir */
       z-index: 0;
   }

   .head-bg-42::after {
       content: "";
       position: absolute;
       inset: 0;
       background: #FBF7EF;
       /* verilen renk kodu */
       opacity: .75;
       /* kaplama şiddeti (isteğe göre 0–1) */
       z-index: 1;
   }

   /* İçerik üstte kalsın */
   .head-bg-42>* {
       position: relative;
       z-index: 2;
   }

   .title-42 {
       font-size: 15px !important;
       color: #111827;
       font-weight: 500
   }


   .enrolled-box-42 {
       background: #fff;
       border: 1px solid #e9ecef;
       border-radius: 8px;
   }

   .enrolled-head-42 {
       padding: .75rem 1rem;
       border-bottom: 1px solid #e9ecef;
   }

   .enrolled-sub-42 {
       padding: .5rem 1rem;
       border-bottom: 1px solid #f1f3f5;
   }

   .enrolled-sub-42 .text-muted {
       font-size: 12px;
       color: #000;
   }

   .enrolled-list-42 {
       padding: .75rem 1rem;
   }

   .enrolled-item-42 {
       padding: .50rem 0;
       border-bottom: 1px solid #eef1f4;
   }

   /* --- KART: etrafı grimsi border (OVERRIDE) --- */
   .enrolled-list-42>.enrolled-item-42 {
       background: #fff;
       border: 1px solid #E4E7EE !important;
       /* tüm kenarlar */
       border-radius: 12px !important;
       padding: 14px 18px !important;
       margin: 12px 0 !important;
       box-shadow: none !important;
   }

   /* Son öğede alt çizgiyi tekrar kapatma! */
   .enrolled-list-42>.enrolled-item-42:last-child {
       border-bottom: 1px solid #E4E7EE !important;
   }


   .thumb-42 {
       width: 100%;
       aspect-ratio: 4 / 4;
       border-radius: 6px;
       overflow: hidden;
       border: 1px solid #eef1f4;
       height: 150px;
       background: #f8fafc;
   }

   .thumb-42 img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block;
   }

   .desc-42 {
       color: #000;
       line-height: 1.35;
       font-size: 13px;

   }

   .badge-42 {
       background: #f6f7fb;
       border: 1px solid #e5e7eb;
       color: #374151;
       font-size: .75rem;
       padding: .25rem .5rem;
       border-radius: 999px;
   }

   .action-42 {
       margin-top: 81px;
       background-color: #4318FF;
       border-radius: 8px;
       padding: .4rem .75rem;
   }

   .chip-42 {
       display: inline-block;
       background: #fff;
       border: 1px solid #e5e7eb;
       border-radius: 999px;
       padding: .2rem .5rem;
   }

   .dot-42 {
       width: 6px;
       height: 6px;
       border-radius: 50%;
       background: #9ca3af;
       display: inline-block;
       margin-right: .35rem;
   }

   .text-truncate-2-42 {
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }

   :root {
       --chip-border: #E7E6F1;
       --chip-bg: #FFFFFF;
       --ico-bg: #EAE5F3;
       --ico-color: #6E62A6;
   }

   /* Kart altındaki “Eğitim Detayları” barı – tam genişlik, alt köşeler uyumlu */
   :root {
       --card-radius: 12px;
   }

   .course-card-52 {
       border-radius: var(--card-radius);
       overflow: hidden;
       /* alt bar köşeleri kartla bire bir olsun */
   }

   /* Alt bar için (div’e .course-foot-52 sınıfı vermen yeterli) */
   .course-card-52 .course-foot-52 {
       display: flex;
       align-items: center;
       justify-content: center;
       padding: 12px 16px;
       background: #F8F9FB;
       /* açık gri arka plan */
       border-top: 1px solid #ECEFF3;
       /* üst çizgi */
       border-radius: 0 0 var(--card-radius) var(--card-radius);
       margin: 0;
       /* yanlarda boşluk kalmasın */
   }

   /* İçteki metin/link sade dursun */
   .course-card-52 .course-foot-52,
   .course-card-52 .course-foot-52 * {
       color: #111827;
       text-decoration: none;
       font-weight: 600;
   }

   /* Eğer alt bar olarak son .text-center kullanıyorsan, sınıf eklemeden de çalışsın: */
   .course-card-52>.text-center:last-child {
       display: flex;
       align-items: center;
       justify-content: center;
       padding: 12px 16px;
       background: #F8F9FB;
       border-top: 1px solid #ECEFF3;
       border-radius: 0 0 var(--card-radius) var(--card-radius);
       margin: 0;
   }

   :root {
       --card-radius: 12px;
   }

   /* 1) “Eğitim Detayı” yazısındaki çerçeveyi kaldır (buton stillerini nötrle) */
   .course-card-52 .course-foot-52 a,
   .course-card-52>.text-center:last-child a {
       background: transparent !important;
       border: 0 !important;
       box-shadow: none !important;
       padding: 0 !important;
       border-radius: 0 !important;
       font-weight: 600;
       color: #111827;
   }

   /* 2) Yazar & fiyat satırı ile alt bar arasında boşluk aç */
   .course-card-52 .px-3 {
       padding-bottom: .75rem !important;
       /* ~12px */
   }

   /* 3) Alt bar kendi içinde üstten biraz nefes alsın (çizgi korunur) */
   .course-card-52 .course-foot-52,
   .course-card-52>.text-center:last-child {
       padding-top: 12px;
       /* bar iç boşluğu */
       margin-top: 0;
       /* bar ile içerik arası boşluk barın üst padding'iyle sağlanır */
   }


   .chip-55 {
       display: inline-flex;
       align-items: center;
       height: 36px;
       /* görseldeki oran */
       border: 1px solid var(--chip-border);
       border-radius: 10px;
       background: var(--chip-bg);
       overflow: hidden;
       /* köşeler birebir otursun */
       font-size: 14px;
       line-height: 1;
   }

   .chip-55 .chip-ico-55 {
       display: grid;
       place-items: center;
       height: 100%;
       min-width: 30px;
       /* ikon hücresi genişliği */
       padding: 0 .6rem;
       background: var(--ico-bg);
       color: var(--ico-color);
       border-right: 1px solid var(--chip-border);
       /* ayrım çizgisi */
       font-weight: 400;
   }

   .chip-55 .chip-ico-55 i {
       font-size: 16px;
   }

   /* 1) Başlık ile yazar/fiyat satırı arasına biraz daha boşluk */
   .course-card-52 .title-52 {
       margin-bottom: 1.3rem !important;
       /* arttırılmış boşluk */
   }

   /* 2) Yazar adı SOLDAN resmin BAŞLANGICIYLA hizalansın,
      fiyat SAĞDAN resmin BİTİŞİYLE hizalansın.
      (Üstte görsel kapının paddingsi .p-2 = .5rem idi; aynı değeri kullanıyoruz.) */
   .course-card-52 .px-3 {
       padding-left: .5rem !important;
       padding-right: .5rem !important;
   }

   /* 3) Yazar + Fiyat satırı tam genişlikte kalsın (sola ve sağa yapışmadan düzgün dağılma) */
   .course-card-52 .px-3>.d-flex {
       justify-content: space-between;
       /* solda yazar, sağda fiyat */
       align-items: center;
   }

   /* 4) Chip’lerin ekstra boşluk yapmasını önle */
   .course-card-52 .chip-55 {
       margin-top: .1rem;
       margin-bottom: 0;
   }


   .chip-55 .chip-text-55 {
       padding: 0 .75rem;
       white-space: nowrap;
       /* kırılmasın */
       color: #111827;
       font-size: 11px;
   }

   /* === 1100px genişlik === */
   .container-1100 {
       max-width: 1100px;
       width: 100%;
       margin-inline: auto;
       padding-inline: 12px;
   }

   /* === Üst kutu === */
   .courses-box-52 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       overflow: hidden;
   }

   .courses-head-52 {
       --head-bg: #E8E0FF;
       /* üst arkaplan (lavanta) – istersen değiştir */
       padding: .75rem 1rem;
       background: var(--head-bg);
       border-bottom: 1px solid #E6EAF0;
   }

   .courses-sub-52 {
       padding: .6rem 1rem;
       border-bottom: 1px solid #F0F2F6;
   }

   .dot-52 {
       width: 10px;
       height: 10px;
       border-radius: 3px;
       background: #6E62A6;
       display: inline-block;
       opacity: .85;
   }

   .courses-sub-52 .text-muted {
       font-size: 12px;
       font-weight: 400;
       color: #000 !important;
   }


   .head-title-52 {
       font-size: 17px;
       font-weight: 500;
       color: #111827;
   }

   .title-52 {
       font-size: 14px;
       font-weight: 500 !important;
       color: #111827;

   }

   /* === Kart === */
   .course-card-52 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
   }

   .media-wrap-52 {
       aspect-ratio: 16/9;
       border-radius: 10px;
       overflow: hidden;
       background: #f6f7fb;
   }

   .course-img-52 {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block;
   }

   .title-52 {
       font-weight: 600;
       color: #111827;
   }

   /* Eğitmen chip + fiyat */
   .meta-pill-52 {
       display: inline-flex;
       align-items: center;
       gap: .5rem;
       padding: .35rem .6rem;
       border: 1px solid #E7E6F1;
       background: #fff;
       border-radius: 8px;
       font-size: 11px;
       color: #111827;
   }

   .meta-ico-52 {
       width: 22px;
       height: 22px;
       display: grid;
       place-items: center;
       border-radius: 6px;
       border: 1px solid #CFC6E6;
       background: #EAE5F3;
       color: #6E62A6;
       font-size: 12px;
   }

   .price-pill-52 {
       display: inline-block;
       padding: .35rem .6rem;
       font-size: 12px;
       border: 1px solid #E6EAF0;
       border-radius: 8px;
       font-weight: 600;
       color: #111827;
       background: #fff;
   }

   /* Alt buton */
   .border-52 {
       border: 1px solid #E6EAF0 !important;
       border-radius: 8px;
   }

   /* === kapsayıcı === */
   .container-1100 {
       max-width: 1100px;
       width: 100%;
       margin-inline: auto;
       padding-inline: 12px
   }

   /* Textarea yüksekliğini sabitleyen kurallar varsa sıfırla */
   textarea.form-control,
   textarea.fld-77 {
       height: auto !important;
       /* sabit height varsa iptal */
       line-height: 1.5;
       padding: .5rem .75rem;
       box-sizing: border-box;
       /* 7 satır başlangıç yüksekliği (rows=7) */
       min-height: calc(1.5em * 7 + 1rem);
       /* 1rem ≈ üst+alt padding toplamı */
       resize: vertical;
       /* kullanıcı aşağı doğru uzatabilsin */
   }

   /* Genel arka planı beyazla */
   input.form-control,
   select.form-control,
   .fld-77 {
       background: #fff !important;
   }

   /* Chrome/Edge/Safari autofill rengini bastır */
   input:-webkit-autofill,
   textarea:-webkit-autofill,
   select:-webkit-autofill {
       -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
       -webkit-text-fill-color: #111 !important;
       caret-color: #111;
       transition: background-color 9999s ease-out 0s;
   }

   /* Firefox için */
   input:-moz-autofill,
   textarea:-moz-autofill,
   select:-moz-autofill {
       box-shadow: 0 0 0 1000px #fff inset !important;
       -moz-text-fill-color: #111 !important;
   }


   /* === üst başlık şeridi === */
   .support-77 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       overflow: hidden
   }

   .support-head-77 {
       padding: .65rem .9rem;
       background: #F6F3FF;
       border-bottom: 1px solid #E6EAF0
   }

   .head-ttl-77 {
       font-size: 14px;
       font-weight: 600;
       color: #111827
   }

   .dot-77 {
       width: 10px;
       height: 10px;
       border-radius: 3px;
       display: inline-block;
       background: #6E62A6;
       opacity: .9
   }

   .head-ico-77 {
       width: 28px;
       height: 28px;
       border: 1px solid #DAD2F0;
       border-radius: 8px;
       display: grid;
       place-items: center;
       color: #6E62A6;
       background: #ECE6FF
   }

   /* sol kolon ayırıcı */
   .support-left-77 {
       border-right: 1px solid #F0F2F6
   }

   @media (max-width:991.98px) {
       .support-left-77 {
           border-right: 0;
           border-bottom: 1px solid #F0F2F6
       }
   }

   /* Yalnızca WhatsApp/Mail kartları için */
   .contact-77 {
       padding-left: .65rem;
   }

   /* soldan iç boşluğu azalt */
   .contact-77 .d-flex {
       gap: .5rem !important;
   }

   /* gap-3'ü ez: ~8px aralık */
   .contact-77 .cnt-ico-77 {
       margin-right: -10px !important;
   }

   /* ekstra sağ marj varsa sıfırla */

   /* === iletişim kartları (yan yana) === */
   .contact-77 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       padding: .75rem .85rem
   }

   .cnt-ico-77 {
       width: 40px;
       height: 40px;
       display: grid;
       place-items: center;
       font-size: 18px
   }

   .cnt-ico-77.whats {
       color: #1FAF52
   }

   .cnt-ico-77.mail {
       color: #6E62A6
   }

   .cnt-sub-77 {
       font-size: 12px;
       color: #6B7280
   }

   .cnt-val-77 {
       font-size: 14px;
       font-weight: 500;
       color: #111827;
       white-space: nowrap
   }

   .cnt-tail-77 {
       margin-left: auto;
       width: 28px;
       height: 28px;
       border-radius: 8px;
       display: grid;
       place-items: center;
       border: 1px solid #E6EAF0;
       background: #F8F9FB;
       color: #4B5563
   }

   /* === SSS başlık paneli === */
   .faq-head-77 {
       background: #F8F9FF;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       padding: .6rem .75rem;
       margin-bottom: .6rem
   }

   .faq-ttl-77 {
       font-size: 13.5px;
       font-weight: 600;
       color: #111827
   }

   .faq-sub-77 {
       font-size: 12px;
       color: #6B7280;
       margin-top: .2rem
   }

   .faq-ico-77 {
       width: 26px;
       height: 26px;
       border-radius: 7px;
       display: grid;
       place-items: center;
       border: 1px solid #E6EAF0;
       background: #fff;
       color: #6E62A6
   }

   /* === SSS akordeon (kibar) === */
   .faq-77 .accordion-item {
       border: 0;
       margin-bottom: .5rem
   }

   .faq-btn-77 {
       background: #fff;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       padding: .55rem .7rem;
       font-size: 12px;
       font-weight: 400;
       color: #111827;
       box-shadow: none
   }

   .faq-btn-77:not(.collapsed) {
       background: #F8F9FB
   }

   .faq-body-77 {
       border: 1px solid #E6EAF0;
       border-top: 0;
       border-radius: 0 0 10px 10px;
       padding: .75rem;
       font-size: 12px;
       color: #4B5563
   }

   /* === Form === */
   .form-wrap-77 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       padding: 1rem;
       background: #fff
   }

   .form-head-77 {
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding-bottom: .5rem;
       margin-bottom: .75rem;
       border-bottom: 1px solid #F0F2F6
   }

   .form-head-77 strong {
       font-weight: 500;
       font-size: 14px;
       color: #111827
   }

   .form-head-77 i {
       width: 28px;
       height: 28px;
       border-radius: 8px;
       display: grid;
       place-items: center;
       border: 1px solid #E6EAF0;
       color: #6B7280
   }

   .lbl-77 {
       font-size: 12px;
       color: #6B7280
   }

   .fld-77 {
       border-radius: 5px
   }

   .btn-77 {
       background-color: #4318FF;
       font-size: 12px;
       border-radius: 10px
   }

   /* === 1100px genişlik === */
   .container-1100 {
       max-width: 1100px;
       width: 100%;
       margin-inline: auto;
       padding-inline: 12px
   }

   /* === Genel kutu === */
   .course-detail-88 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       overflow: hidden
   }

   /* — Eğitim Bilgileri: başlık şerit + üç sütun, dikey ayraçlı — */
   .info-card-91 {
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       overflow: hidden;
   }

   .info-head-91 {
       padding: .55rem .75rem;
       background: #EFEFEF;
       border-bottom: 1px solid #E6EAF0;
       font-weight: 500;
       font-size: 14px;
       color: #111827;
   }

   .info-row-91 {
       display: flex;
   }

   .info-cell-91 {
       flex: 1;
       text-align: center;
       padding: .9rem .5rem;
       color: #111827;
       font-weight: 400;
       font-size: 14px;
   }

   .info-cell-91:not(:last-child) {
       border-right: 1px solid #E6EAF0;
   }

   .info-strong-91 {
       font-weight: 800;
       margin-right: .25rem;
   }

   /* Son madde hariç hepsinin altına boşluk */
   .faq-77 .accordion-item:not(:last-child),
   .cd-faq-88 .accordion-item:not(:last-child),
   .faq-66 .accordion-item:not(:last-child) {
       margin-bottom: .5rem;
   }

   /* — Ödeme kartı + buton (bire bir) — */
   .pay-card-92 {
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       overflow: hidden;
   }

   .pay-head-92 {
       display: flex;
       align-items: center;
       gap: .5rem;
       padding: .55rem .75rem;
       background: #EFEFEF;
       /* üst gri şerit */
       border-bottom: 1px solid #E6EAF0;
       font-weight: 600;
       font-size: 14px;
       color: #111827;
   }

   .pay-head-92 i {
       color: #6B7280;
       font-size: 16px;
       line-height: 1;
   }

   .pay-body-92 {
       padding: .85rem .9rem;
   }

   .pay-price-92 {
       font-size: 20px;
       font-weight: 600;
       color: #111827;
       line-height: 1.1;
   }

   .pay-price-92 span {
       margin-left: .25rem;
       font-weight: 500;
       font-size: 12px;
       color: #6B7280;
   }

   .pay-note-92 {
       margin-top: .35rem;
       font-size: 11px;
       color: #4B5563;
   }

   .btn-buy-92 {
       margin-top: 12px;
       font-size: 14px;
       background: #4F2DFE;
       border-color: #4F2DFE;
       color: #fff;
       font-weight: 500;
       border-radius: 8px;
       padding: .7rem 1rem;
   }

   .btn-buy-92:hover {
       filter: brightness(.95);
   }

   /* Satın al butonu – hover'da beyazlama yok */
   .btn-buy-92 {
       /* Ana renkler */
       --bs-btn-color: #fff;
       --bs-btn-bg: #4F2DFE;
       --bs-btn-border-color: #4F2DFE;

       /* Hover/active aynı kalsın */
       --bs-btn-hover-color: #fff;
       --bs-btn-hover-bg: #4F2DFE;
       --bs-btn-hover-border-color: #4F2DFE;
       --bs-btn-active-color: #fff;
       --bs-btn-active-bg: #4F2DFE;
       --bs-btn-active-border-color: #4F2DFE;

       /* İsteğe bağlı: fokus gölgesini kapat */
       --bs-btn-focus-shadow-rgb: 0, 0, 0;

       background: #4F2DFE;
       border-color: #4F2DFE;
       color: #fff;
   }

   .btn-buy-92:hover,
   .btn-buy-92:focus,
   .btn-buy-92:active {
       background: #4F2DFE !important;
       border-color: #4F2DFE !important;
       color: #fff !important;
       box-shadow: none !important;
       filter: none !important;
       /* varsa parlaklık efektini iptal */
   }





   /* — Eğitmen Bilgileri (bire bir) — */
   .inst-card-90 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       overflow: hidden;
       margin-top: -20px;
   }

   .inst-head-90 {
       padding: .55rem .75rem;
       background: #EFEFEF;
       /* üst gri şerit */
       border-bottom: 1px solid #E6EAF0;
       font-size: 13px;
       font-weight: 600;
       color: #111827;
   }

   .inst-body-90 {
       padding: .75rem .75rem;
   }

   .inst-photo-90 {
       flex: 0 0 96px;
       width: 35px;
       height: 75px;
       overflow: hidden;
   }

   .inst-photo-90 img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block;
   }

   .inst-name-90 {
       font-size: 14px;
       font-weight: 500;
       color: #111827;
   }

   .inst-role-90 {
       font-size: 11px;
       color: #6B7280;
       margin-top: .15rem;
   }

   /* Biyografi pili: entegre ikon + yumuşak kenarlar */
   .bio-chip-90 {
       font-size: 12px;
       display: inline-flex;
       align-items: center;
       gap: .5rem;
       padding: .45rem .65rem;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       color: #111827;
       text-decoration: none;
       white-space: nowrap;
   }

   .bio-chip-90 i {
       width: 24px;
       height: 24px;
       display: grid;
       place-items: center;
       border: 1px solid #CFC6E6;
       border-radius: 6px;
       background: #EAE5F3;
       color: #6E62A6;
       font-size: 14px;
       line-height: 1;
   }


   /* Başlık, “Eğitimler” şeridinin HEMEN altında; resmin üstünde */
   .cd-path-title-88 {
       padding: .55rem .9rem;
       border-bottom: 1px solid #F0F2F6;
       /* görselle ayrım */
       background: #fff;
   }

   .cd-path-title-88 h5 {
       font-size: 17px;
       font-weight: 600;
       color: #111827;
   }

   .cd-hero-88 {
       margin: 0 -16px 0 !important;
   }

   /* Başlık barı: üst/sağ/sol boşluk yok, radius kapalı */
   .cd-secbar-88 {
       margin: 0 -16px 12px !important;
       /* üst 0, sağ/sol paddingle hizala */
       padding: .6rem 16px !important;
       /* iç yatay boşluk */
       border-radius: 0 !important;
       font-size: 14px;
       font-weight: 500;
   }

   /* === DİKEY AYIRICI + HERO GÖRSELİ KENARSIZ (bire bir) === */

   /* Sağ kolon: sayfa boyunca dikey çizgi (sola sıfır) */
   .cd-aside-88 {
       border-left: 1px solid #E6EAF0;
       /* çok belirgin olmayan gri */
       padding-left: 16px;
       /* çizgiye yapışmasın */
   }

   /* Sol kolon: üst boşluğu kaldır, sabit yatay padding ver */
   .cd-left-88 {
       padding-top: 0 !important;
       padding-left: 16px !important;
       padding-right: 16px !important;
   }

   /* Hero görsel alanı: sağ/sol/yukarı boşluksuz; köşe yuvarlama yok */
   .cd-hero-88 {
       margin: 0 -16px 12px;
       /* sol ve sağdaki 16px paddingle aynı miktarda eksi margin */
       border: 0;
       border-radius: 0;
       /* resimde köşe yuvarlama istemiyoruz */
       overflow: hidden;
   }

   /* Görsel tam genişlik + yüksekliği sabit, boşluk bırakma */
   .cd-hero-88 img {
       display: block;
       width: 100%;
       height: 280px;
       /* tasarımdaki yükseklik; gerekirse değiştir */
       object-fit: cover;
       /* taşanı kırp, siyah boşluk olmasın */
       border-radius: 0;
       /* köşe yuvarlama kapalı */
   }

   /* (Opsiyonel) Küçük ekranlarda yükseklik azalt */
   @media (max-width: 576px) {
       .cd-hero-88 img {
           height: 220px;
       }
   }



   /* === Üst başlık şeridi === */
   .cd-head-88 {
       padding: .65rem .9rem;
       background: #F6F3FF;
       border-bottom: 1px solid #E6EAF0
   }

   .cd-dot-88 {
       width: 10px;
       height: 10px;
       border-radius: 3px;
       background: #6E62A6;
       display: inline-block
   }

   .cd-head-title-88 {
       font-size: 14px;
       font-weight: 600;
       color: #111827
   }

   /* === Sol taraf === */
   .cd-title-88 {
       font-weight: 700;
       color: #111827
   }

   .cd-hero-88 {
       overflow: hidden;
       border: 1px solid #E6EAF0
   }

   .cd-hero-88 img {
       width: 100%;
       height: 280px;
       object-fit: cover;
       display: block
   }

   .cd-secbar-88 {
       padding: .6rem .75rem;
       background: #F8F9FB;
       border: 1px solid #ECEFF3;
       border-radius: 10px;
       color: #111827
   }

   .cd-copy-88 p {
       font-size: 12px;
       color: #000;
       margin-bottom: .75rem;
       text-align: justify;
   }

   /* === Sağ taraf (sticky) === */
   .cd-aside-88 {
       position: sticky;
       top: 16px
   }

   /* Kart iskeleti */
   .cd-card-88 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       padding: .85rem .9rem
   }

   .cd-card-88+.cd-card-88 {
       margin-top: .75rem
   }

   .cd-card-head-88 {
       font-weight: 600;
       font-size: 13px;
       color: #111827;
       margin-bottom: .6rem
   }

   /* Eğitmen */
   .cd-avatar-88 {
       width: 56px;
       height: 56px;
       border-radius: 50%;
       overflow: hidden;
       border: 1px solid #E6EAF0;
       background: #f4f6fa
   }

   .cd-avatar-88 img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block
   }

   .cd-inst-name-88 {
       font-weight: 700;
       color: #111827
   }

   .cd-inst-role-88 {
       font-size: 12px;
       color: #6B7280
   }

   .cd-chip-88 {
       display: inline-flex;
       align-items: center;
       gap: .4rem;
       padding: .35rem .55rem;
       border: 1px solid #E6EAF0;
       border-radius: 8px;
       background: #F8F9FB;
       color: #111827;
       text-decoration: none
   }

   /* Metrikler */
   .cd-metric-88 {
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       text-align: center;
       padding: .5rem .25rem
   }

   .cd-metric-val-88 {
       font-weight: 700;
       color: #111827;
       font-size: 18px;
       line-height: 1
   }

   .cd-metric-key-88 {
       font-size: 12px;
       color: #6B7280
   }

   /* SSS */
   .cd-faq-88 .accordion-item {
       border: 0
   }

   .cd-faq-btn-88 {
       background: #fff;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       padding: .55rem .7rem;
       color: #111827;
       box-shadow: none;
       font-size: 11px
   }

   .cd-faq-btn-88:not(.collapsed) {
       background: #F8F9FB
   }

   .cd-faq-body-88 {
       font-size: 12px;
       border: 1px solid #E6EAF0;
       border-top: 0;
       border-radius: 0 0 10px 10px;
       padding: .75rem;
       color: #4B5563
   }

   /* Ödeme */
   .cd-price-88 {
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       padding: .6rem .75rem;
       background: #F8F9FB;
       margin-bottom: .6rem
   }

   .cd-price-val-88 {
       font-weight: 800;
       font-size: 24px;
       color: #111827
   }

   .cd-price-val-88 span {
       font-weight: 600;
       font-size: 14px;
       color: #6B7280;
       margin-left: .25rem
   }

   .cd-price-note-88 {
       font-size: 12px;
       color: #6B7280;
       margin-top: .2rem
   }

   .cd-buybtn-88 {
       border-radius: 10px
   }

   /* Renk tutarlılığı */
   .btn-primary {
       border-radius: 10px
   }

   .container-1100 {
       max-width: 1100px;
       width: 100%;
       margin-inline: auto;
       padding-inline: 12px
   }

   /* === Dış kutu === */
   .pay-101 {
       border: 1px solid #E6EAF0
   }

   .pay-head-101 {
       padding: .6rem .9rem;
       background: #F6F3FF;
       border-bottom: 1px solid #E6EAF0
   }

   .pay-dot-101 {
       width: 10px;
       height: 10px;
       border-radius: 3px;
       background: #6E62A6;
       display: inline-block
   }

   .pay-head-title-101 {
       font-size: 14px;
       font-weight: 600;
       color: #111827
   }

   .pay-path-101 {
       padding: .55rem .9rem;
       border-bottom: 1px solid #F0F2F6;
       background: #fff;
       color: #111827
   }

   /* Sağ kolon ayırıcı çizgi */
   .pay-right-101 {
       border-left: 1px solid #F0F2F6
   }

   /* === Fatura kartı === */
   .bill-card-101 {
       border-radius: 10px;
       background: #fff;
       overflow: hidden
   }

   .bill-head-101 {
       padding: .55rem .75rem;
       background: #EFEFEF;
       border-bottom: 1px solid #E6EAF0;
       font-weight: 600;
       color: #111827;
       font-size: 14px;
   }

   .bill-body-101 {
       padding: .9rem .9rem
   }

   .fld-101 {
       border: 1px solid #E6EAF0;
       border-radius: 10px
   }

   select.fld-101 {
       background-position: right .6rem center
   }

   .form-select.fld-101 {
       padding: .42rem 2rem .42rem .65rem
   }

   .form-control.fld-101 {
       padding: .5rem .65rem
   }

   /* === Sipariş / ödeme kartı === */
   .order-card-101 {
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       overflow: hidden
   }

   .order-head-101 {
       padding: .55rem .75rem;
       background: #EFEFEF;
       border-bottom: 1px solid #E6EAF0;
       font-weight: 600;
       font-size: 14px;
       color: #111827
   }

   .order-body-101 {
       padding: .75rem
   }

   .order-row-101 {
       display: flex;
       justify-content: space-between;
       align-items: center;
       padding: .55rem 0;
       border-bottom: 1px solid #F0F2F6;
   }

   .order-row-101:last-child {
       border-bottom: 0
   }

   .order-key-101 {
       color: #6B7280;
       font-size: 14px
   }

   .order-title-101 {
       color: #111827;
       font-weight: 400;
       font-size: 12px;
   }

   .order-val-101 {
       color: #111827;
       font-weight: 500;
       font-size: 14px;
   }

   .order-total-101 {
       padding-top: .75rem
   }

   .order-total-101 .order-key-101 {
       font-weight: 500;
       color: #111827;
       font-size: 15px;
   }

   .order-total-val-101 {
       font-weight: 600;
       color: #111827
   }

   /* Buton stilleri */
   .btn-outline-101 {
       font-size: 13px;
       border: 1px solid #E6EAF0;
       background: #fff;
       color: #111827;
       border-radius: 8px;
       padding: .6rem .75rem;
   }

   .btn-outline-101:hover {
       background: #F8F9FB
   }

   .btn-buy-92 {
       --bs-btn-color: #fff;
       --bs-btn-bg: #4F2DFE;
       --bs-btn-border-color: #4F2DFE;
       --bs-btn-hover-color: #fff;
       --bs-btn-hover-bg: #4F2DFE;
       --bs-btn-hover-border-color: #4F2DFE;
       --bs-btn-active-color: #fff;
       --bs-btn-active-bg: #4F2DFE;
       --bs-btn-active-border-color: #4F2DFE;
       --bs-btn-focus-shadow-rgb: 0, 0, 0;
       border-radius: 8px;
       padding: .6rem .75rem;
       font-size: 13px;
   }

   .btn-buy-92:hover,
   .btn-buy-92:focus,
   .btn-buy-92:active {
       background: #4F2DFE !important;
       border-color: #4F2DFE !important;
       color: #fff !important;
       box-shadow: none !important;
       filter: none !important;
       font-size: 13px;
   }

   /* Küçük ekranda kolonlar arası çizgi yerine üstte çizgi */
   @media (max-width:991.98px) {
       .pay-right-101 {
           border-left: 0;
           border-top: 1px solid #F0F2F6;
           margin-top: .5rem;
           padding-top: 1rem
       }
   }

   /* Input/Select/Textarea içindeki “yansıma / parlaklık” efektini kaldır */
   .fld-101,
   .fld-101:focus {
       background: #fff !important;
       background-image: none !important;
       /* gradient/gloss iptal */
       box-shadow: none !important;
       /* iç/dış gölge yok */
       outline: 0 !important;
   }

   /* Safari/iOS’ta gelen native iç-beyaz yansıma/bezel’i kapat */
   input.fld-101,
   textarea.fld-101,
   select.fld-101 {
       -webkit-appearance: none;
       appearance: none;
   }

   /* Fokus durumunda sadece ince border kalsın (istersen) */
   .fld-101:focus {
       border-color: #CFC6E6 !important;
   }

   /* Otomatik doldurma sarısını da bastır (görürsen) */
   input.fld-101:-webkit-autofill,
   textarea.fld-101:-webkit-autofill,
   select.fld-101:-webkit-autofill {
       -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
       -webkit-text-fill-color: #111 !important;
   }

   /* BUNU güncelle: select'i bu kuraldan çıkar */
   .form-control.fld-101,
   textarea.fld-101 {
       background: #fff !important;
       background-image: none !important;
       box-shadow: none !important;
   }

   /* SELECT: tek ok, tekrar yok */
   .form-select.fld-101 {
       -webkit-appearance: none;
       appearance: none;
       background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236B7280'%3E%3Cpath d='M3.2 5.23a.5.5 0 0 1 .7 0L8 9.02l4.1-3.79a.5.5 0 1 1 .7.72L8.35 10.38a.5.5 0 0 1-.7 0L3.2 5.95a.5.5 0 0 1 0-.72z'/%3E%3C/svg%3E") no-repeat right .65rem center / 16px 12px !important;
       padding-right: 2rem;
       /* metin ikona çarpmasın */
   }

   /* Input & Select aynı yükseklik ve hizalama */
   .form-control.fld-101,
   .form-select.fld-101 {
       height: 42px;
       /* sabit yükseklik */
       padding: .45rem .65rem;
       /* dikey padding eşitlendi */
       line-height: 1.25;
   }

   /* Select'in ok ikonu için ekstra sağ boşluk */
   .form-select.fld-101 {
       padding-right: 2rem;
       background-position: right .65rem center;
       /* oku doğru yere koy */
   }

   /* Etiketler satır kırıp üst boşluğu büyütmesin (opsiyonel) */
   .bill-body-101 .form-label {
       white-space: nowrap;
       margin-bottom: .25rem;
   }

   /* (Nadir) Kolon içindeki label+field’ı dikey düzenle (opsiyonel) */
   .bill-body-101 .row.g-3>[class*="col-"] {
       display: flex;
       flex-direction: column;
   }

   /* === Ödeme butonları: kesin uygulanan stil === */
   #pay-actions {
       display: flex;
       gap: 12px;
   }

   #pay-actions .btn {
       height: 44px;
       padding: 0 18px;
       border-radius: 10px;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       line-height: 1;
       box-shadow: none !important;
       flex: 1 1 0;
       /* eşit genişlik */
   }

   /* Sol: beyaz-outline */
   #pay-actions .action-outline {
       font-size: 13px;
       background: #fff !important;
       border: 1px solid #E6EAF0 !important;
       color: #111827 !important;
   }

   #pay-actions .action-outline:hover,
   #pay-actions .action-outline:focus {
       background: #F8F9FB !important;
   }

   /* Sağ: mor – hover’da asla beyazlama yok */
   #pay-actions .action-primary {
       font-size: 13px;
       background: #4F2DFE !important;
       border: 1px solid #4F2DFE !important;
       color: #fff !important;
   }

   #pay-actions .action-primary:hover,
   #pay-actions .action-primary:focus,
   #pay-actions .action-primary:active {
       background: #4F2DFE !important;
       border-color: #4F2DFE !important;
       color: #fff !important;
   }

   .container-1100 {
       max-width: 1100px;
       width: 100%;
       margin-inline: auto;
       padding-inline: 12px
   }

   /* Sağ kolon boyunca dikey ayraç */
   .inst-right-111 {
       border-left: 1px solid #E6EAF0;
   }

   @media (max-width:991.98px) {
       .inst-right-111 {
           border-left: 0;
           border-top: 1px solid #E6EAF0;
       }
   }

   /* Sol üst name-badge */
   .id-badge-111 {
       display: inline-flex;
       align-items: center;
       gap: .5rem;
       padding: .4rem .6rem;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       color: #111827;
   }

   .id-dot-111 {
       width: 18px;
       height: 18px;
       border-radius: 50%;
       background: linear-gradient(#eee, #d9d9d9);
       display: inline-block;
       border: 1px solid #E6EAF0
   }

   /* Sol başlık bar */
   .left-secbar-111 {
       padding: .55rem .75rem;
       background: #EFEFEF;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       color: #111827;
       font-weight: 600;
   }

   .left-secbar-111 strong {

       font-size: 14px;
       font-weight: 600 !important;

   }

   /* Biyografi kutusu */
   .bio-box-111 {
       font-size: 12px;
       text-align: justify;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       padding: .9rem;
   }

   .bio-box-111 p {
       color: #4B5563;
       margin-bottom: .75rem;
   }

   /* Eğitmen kartı */
   .inst-card-111 {
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       overflow: hidden;
   }

   .inst-card-head-111 {
       font-size: 14px;
       padding: .55rem .75rem;
       background: #EFEFEF;
       border-bottom: 1px solid #E6EAF0;
       font-weight: 500;
       color: #111827;
   }

   .inst-photo-111 {
       width: 84px;
       height: 84px;
       border-radius: 8px;
       overflow: hidden;
       flex: 0 0 84px;
       border: 1px solid #E6EAF0;
       background: #f6f7fb
   }

   .inst-photo-111 img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block
   }

   .inst-name-111 {
       margin-left: -10px;
       font-size: 13px;
       font-weight: 600;
       color: #111827
   }

   .inst-meta-111 {
       margin-left: -10px;
       font-size: 12px;
       color: #6B7280
   }

   .role-chip-111 {
       font-size: 12px;
       display: inline-flex;
       align-items: center;
       gap: .45rem;
       padding: .4rem .6rem;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       color: #111827;
       text-decoration: none;
       white-space: nowrap
   }

   .role-chip-111 i {
       width: 18px;
       height: 18px;
       display: grid;
       place-items: center;
       border: 1px solid #CFC6E6;
       border-radius: 6px;
       background: #EAE5F3;
       color: #6E62A6;
       font-size: 12px
   }

   /* Mini kurs kartları (sağ grid) */
   .course-mini-111 {
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       overflow: hidden
   }

   .cm-media-111 {
       aspect-ratio: 16/9;
       overflow: hidden;
       background: #f6f7fb
   }

   .cm-media-111 img {
       width: 100%;
       height: 100%;
       object-fit: cover;
       display: block
   }

   .cm-title-111 {
       font-size: 12px;
       font-weight: 400;
       color: #111827;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis
   }

   .cm-foot-111 {
       font-size: 12px;
       margin-top: .4rem;
       padding: .5rem .75rem;
       text-align: center;
       border-top: 1px solid #EDEFF4;
       background: #F8F9FB;
       color: #111827;
       font-weight: 500
   }

   /* Eğitmen detayı sağ gridindeki linklerin altı çizili olmasın */
   .inst-detail-111 .cm-foot-111 a,
   .inst-detail-111 .cm-foot-111 a:hover,
   .inst-detail-111 .cm-foot-111 a:focus,
   .inst-detail-111 .cm-title-111 a,
   .inst-detail-111 .cm-title-111 a:hover,
   .inst-detail-111 .cm-title-111 a:focus,
   .inst-detail-111 a.link-primary,
   .inst-detail-111 a.link-primary:hover,
   .inst-detail-111 .text-decoration-underline {
       text-decoration: none !important;
       border-bottom: 0 !important;
       /* bazı temalar alt çizgiyi border ile verir */
   }

   .course-mini-111 .cm-foot-111 a {
       display: block;
       color: #111827;
   }

   .user-chip-100 {
       display: inline-flex;
       align-items: center;
       gap: .6rem;
       padding: .55rem .9rem;
       border-radius: 9999px;
       color: #111827;
       text-decoration: none;
       cursor: pointer;
   }

   .user-chip-100 i {
       font-size: 1.1rem;
       color: #111827;
   }

   .user-chip-100 .chip-txt span {
       display: block;
       font-size: .85rem;
       color: #6B7280;
       line-height: 1.1;
   }

   .user-chip-100:focus-visible {
       outline: 2px solid #4F2DFE;
       outline-offset: 2px;
   }

   /* Kapsayıcı: etrafı çizgili, köşeli, overflow hidden */
   .welcome-bar150 {
       --railW: 56px;
       --padX: 16px;
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       display: grid;
       grid-template-columns: var(--railW) 1fr;
       overflow: hidden;
   }

   /* Kutu sınırı tamamen kapalı */
   .dash-140 {
       border: 0 !important;
       /* top+bottom dahil */
       box-shadow: none !important;
   }

   /* Üst bant alt çizgisi veya ek divider varsa kapat */
   .dash-top-140 {
       border-bottom: 0 !important;
   }

   .dash-divider-140 {
       display: none !important;
   }


   /* Sol uzunlamasına ikon bandı */
   .wb-rail150 {
       background: #F6F7FB;
       /* tasarımdaki açık gri bant */
       border-right: 1px solid #F0F2F6;
       display: flex;
       align-items: center;
       justify-content: center;
   }

   .wb-rail150 i {
       font-size: 25px;
       color: #111827;
   }

   /* Hızlı erişim grubu: üstten boşluk + çerçeve + %5 gri zemin */
   .dash-tiles-140 {
       margin-top: 30px !important;
       /* üstten az mesafe */
       padding: 40px !important;
       /* iç boşluk */
       border-radius: 5px !important;
       /* yumuşak köşe */
       background: rgb(217 217 217 / 5%) !important;
       /* #D9D9D9 @ %5 şeffaf */
       /* grid ayarların kalsın */
       display: grid;
       gap: 20px;
       grid-template-columns: repeat(3, 1fr);
   }

   /* Mobilde tek sütun */
   @media (max-width: 991.98px) {
       .dash-tiles-140 {
           grid-template-columns: 1fr;
       }
   }


   /* Üyelik ana sayfa kutusu: yan kenarları kaldır */
   .dash-140 {
       border-inline: none !important;
       /* modern tarayıcılar */
       border-left: 0 !important;
       /* fallback */
       border-right: 0 !important;
       /* fallback */
       /* istersen köşe izini de gizlemek için: */
       border-radius: 0 !important;
       /* opsiyonel */
   }


   /* Sağ alanı (chip'lerin olduğu kolon) komple boyayıp tam yükseklik kapla */
   .wb-content150 {
       display: grid;
       /* zaten grid kullanıyorduk */
       grid-template-columns: 1fr auto;
       /* sol metin | sağ chip'ler */
       align-items: center;
       gap: 16px;
   }

   .wb-chips150 {
       align-self: stretch;
       /* satır yüksekliğini tamamen kapla */
       background: rgba(217, 217, 217, .10);
       /* #D9D9D9 @ %10 */
       padding: 8px 12px;
       border-top-left-radius: 0;
       /* sol kenarı düz kalsın */
       border-bottom-left-radius: 0;
       border-top-right-radius: 12px;
       /* kapsülle uyumlu sağ köşeler */
       border-bottom-right-radius: 12px;
       display: flex;
       gap: 10px;
       flex-wrap: wrap;
       justify-content: flex-end;
   }

   /* Üst barın minimum yüksekliğini artır ve sağ bloğu dikeyde esnet */
   .wb-content150 {
       min-height: 84px;
       /* ihtiyaca göre 72–96px arası oynat */
       align-items: stretch;
       /* satır yüksekliğini tam doldursun */
   }

   /* Sağ blok: yüksekliği satırla aynı olsun, dikey paddingi büyüt */
   .wb-chips150 {
       height: 100%;
       align-self: stretch;
       display: flex;
       align-items: center;
       justify-content: flex-end;
       padding-block: 50px;
       /* ↑↓ artır, alan “aşağı doğru” genişler */
       padding-inline: 12px;
       background: rgba(217, 217, 217, .10);
       border-left: 1px solid #F0F2F6;
       border-radius: 0 12px 12px 0;
       /* sağ köşeler yumuşak */
   }



   .wb-text150 {
       min-width: 0;
       margin-top: 50px;
       margin-left: 15px;
   }

   .wb-title150 {
       font-weight: 600;
       color: #111827;
   }

   .wb-sub150 {
       font-size: 12px;
       color: #6B7280;
       margin-top: 5px;
   }

   /* Chip’ler: modern kapsüller (arkaplanlı) */
   .wb-chips150 {
       display: flex;
       gap: 10px;
       flex-wrap: wrap;
   }

   .wb-chip150 {
       display: inline-flex;
       align-items: center;
       gap: .5rem;
       height: 36px;
       padding: 0 .65rem;
       background: rgb(217 217 217 / 15%);
       border: 1px solid #E6EAF0;
       border-radius: 3px;
       color: #111827;
       white-space: nowrap;
       font-size: 13px;
   }

   .wb-chipico150 {
       width: 30px;
       height: 30px;
       display: grid;
       place-items: center;
       color: #504E4E;
       font-size: 18px;
   }

   /* Küçük ekran uyumu */
   @media (max-width: 768px) {
       .welcome-bar150 {
           grid-template-columns: 44px 1fr;
       }

       .wb-content150 {
           grid-template-columns: 1fr;
           gap: 10px;
       }

       .wb-chips150 {
           justify-content: flex-start;
       }
   }


   /* kapsayıcı */
   .container-1100 {
       max-width: 1100px;
       width: 100%;
       margin-inline: auto;
       padding-inline: 12px
   }

   /* dış kutu */
   .dash-140 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff
   }

   /* üst bant: iki kolon, temiz boşluklar */
   .dash-top-140 {
       display: grid;
       grid-template-columns: 1fr auto;
       gap: 16px;
       padding: 16px 20px;
       align-items: center;
       background: #fff;
   }

   .dt-left-140 {
       display: flex;
       align-items: center;
       gap: 12px;
       min-width: 0
   }

   .sigil-140 {
       width: 36px;
       height: 36px;
       border-radius: 10px;
       display: grid;
       place-items: center;
       background: #F6F7FB;
       border: 1px solid #E6EAF0;
       color: #6B7280;
       flex: 0 0 36px
   }

   .hello-140 {
       font-weight: 700;
       color: #111827
   }

   .hello-sub-140 {
       font-size: 13px;
       color: #6B7280
   }

   /* chip’ler: YAN YANA, modern */
   .dt-right-140 {
       display: flex;
       gap: 10px;
       flex-wrap: wrap;
       justify-content: flex-end
   }

   .chip-140 {
       display: inline-flex;
       align-items: center;
       gap: .5rem;
       height: 36px;
       padding: 0 .65rem;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       background: #fff;
       color: #111827;
       white-space: nowrap
   }

   .chip-ico-140 {
       width: 24px;
       height: 24px;
       border-radius: 6px;
       display: grid;
       place-items: center;
       border: 1px solid #DAD2F0;
       background: #ECE6FF;
       color: #6E62A6;
       font-size: 12px
   }

   /* ayırıcı */
   .dash-divider-140 {
       height: 1px;
       background: #F0F2F6;
       margin: 0 20px 16px
   }

   /* hızlı erişim grid: 3 kutu, tam hizalı ve şık */
   .dash-tiles-140 {
       display: grid;
       gap: 20px;
       padding: 0 20px 20px;
       grid-template-columns: repeat(3, 1fr);
   }

   @media (max-width: 991.98px) {
       .dash-tiles-140 {
           grid-template-columns: 1fr;
       }
   }

   .tile-140 {
       display: flex;
       align-items: center;
       gap: 12px;
       text-decoration: none;
       border: 1px solid #E6EAF0;
       border-radius: 10px;
       padding: 16px;
       color: #111827;
   }

   .tile-ico-140 {
       font-size: 20px;
       font-weight: 500;
       width: 40px;
       height: 40px;
       border-radius: 25px;
       display: grid;
       place-items: center;
       background: #F6F7FB;
       border: 1px solid #E6EAF0;
       color: #6B7280;
       flex: 0 0 40px
   }

   .tile-title-140 {
       font-size: 14px;
       font-weight: 500
   }

   .tile-sub-140 {
       font-size: 12px;
       font-weight: 200;
       color: #000;
       margin-top: .1rem;
   }

   /* === Kişisel Bilgilerim === */
   .container-1100 {
       max-width: 1050px;
       width: 100%;
       margin-inline: auto;
       padding-inline: 12px
   }

   .pf-head-160 {
       display: flex;
       align-items: center;
       gap: .5rem;
       padding: 8px 2px 16px;
       color: #111827;
       font-weight: 600;
   }

   .pf-head-160 i {
       font-size: 18px;
       color: #6B7280
   }

   .pf-form-160 {
       padding-top: 4px
   }

   .pf-grid-160 {
       display: grid;
       gap: 16px;
       grid-template-columns: repeat(5, 1fr);
       /* 5 sütun */
   }

   .pf-span-3 {
       grid-column: span 3
   }

   /* Etiket */
   .pf-field label {
       display: block;
       font-size: 12px;
       color: #6B7280;
       margin-bottom: 6px;
   }

   .pf-field input {
       font-size: 13px;
   }

   .pf-field select {
       font-size: 13px;
   }

   .pf-field label small {
       font-size: 11px;
       color: #9AA3AF
   }

   /* Input / Select */
   .pf-input,
   .pf-select {
       width: 100%;
       height: 40px;
       border: 1px solid #E6EAF0;
       border-radius: 8px;
       background: #F8F9FB;
       padding: 8px 10px;
       color: #111827;
       outline: 0;
       box-shadow: none;
   }

   .pf-input:focus,
   .pf-select:focus {
       border-color: #CFC6E6
   }

   /* Select oku (sade) */
   .pf-select {
       -webkit-appearance: none;
       appearance: none;
       background:
           #F8F9FB url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236B7280'%3E%3Cpath d='M3.2 5.23a.5.5 0 0 1 .7 0L8 9.02l4.1-3.79a.5.5 0 1 1 .7.72L8.35 10.38a.5.5 0 0 1-.7 0L3.2 5.95a.5.5 0 0 1 0-.72z'/%3E%3C/svg%3E") no-repeat right .65rem center / 16px 12px;
       padding-right: 2rem;
   }

   /* Kaydet butonu sağa yaslı */
   .pf-actions-160 {
       display: flex;
       justify-content: flex-end;
       margin-top: 18px
   }

   .btn-save-160 {
       display: inline-flex;
       align-items: center;
       gap: .25rem;
       height: 40px;
       padding: 0 16px;
       border-radius: 8px;
       border: 0;
       background: #4F2DFE;
       color: #fff;
       font-weight: 500;
       font-size: 12px;
   }

   .btn-save-160:hover {
       filter: brightness(.96)
   }

   /* Kişisel Bilgilerim form alanı – %5 şeffaf gri zemin */
   .pf-form-160 {
       background: rgb(217 217 217 / 5%);
       padding: 16px;
       border-radius: 12px;
   }

   /* 1100px sabit genişlik */
   .container-1100 {
       max-width: 1100px;
       width: 100%;
       margin: 0 auto;
       padding: 0 12px
   }

   /* başlık */
   .paylist-head-170 {
       font-size: 18px;
       display: flex;
       align-items: center;
       gap: .4rem;
       color: #111827;
       font-weight: 600;
       margin-bottom: .75rem
   }

   .paylist-head-170 i {
       color: #6B7280;
       font-size: 18px
   }

   /* liste kabı */
   .paylist-170 {
       border: 1px solid #E6EAF0;
       border-radius: 12px;
       background: #fff;
       overflow: hidden;
   }

   /* satır */
   .payment-row-170 {
       display: grid;
       grid-template-columns: 1fr 160px 220px;
       gap: 16px;
       align-items: center;
       padding: 14px 16px;
       background: #fff;
   }

   .payment-row-170+.payment-row-170 {
       border-top: 1px solid #F0F2F6;
   }

   /* sol kısım */
   .pl-left-170 {
       display: flex;
       align-items: center;
       gap: 12px;
       min-width: 0
   }

   .doc-ico-170 {
       width: 28px;
       height: 28px;
       display: grid;
       place-items: center;
       border: 1px solid #E6EAF0;
       border-radius: 20px;
       background: #F6F7FB;
       color: #6B7280
   }

   .payer-170 {
       font-size: 12px;
       font-weight: 500;
       color: #111827;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis
   }


   .sub-170 {
       font-size: 12px;
       color: #6B7280
   }

   /* tutar & tarih */
   .pl-amount-170 {
       text-align: right
   }

   .price-170 {
       font-size: 14px;
       font-weight: 600;
       color: #111827
   }

   .date-170 {
       font-size: 12px;
       color: #6B7280
   }

   /* aksiyonlar */
   .pl-actions-170 {
       display: flex;
       justify-content: flex-end;
       align-items: center;
       gap: 10px
   }

   .badge-170 {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       height: 32px;
       padding: 0 .7rem;
       border-radius: 8px;
       font-size: 12px;
       font-weight: 400;
       white-space: nowrap
   }

   .is-paid {
       color: #2D8A4E;
       border: 1px solid #CFEBD9
   }

   .is-pending {
       color: #B4232C;
       border: 1px solid #F4C7CC
   }

   .btn-print-170 {
       width: 36px;
       height: 32px;
       display: grid;
       place-items: center;
       border: 1px solid #E6EAF0;
       border-radius: 8px;
       background: #fff;
       color: #6B7280;
       cursor: pointer
   }

   .btn-print-170:hover {
       background: #F8F9FB
   }

   /* responsive */
   @media (max-width: 992px) {
       .payment-row-170 {
           grid-template-columns: 1fr auto;
           align-items: start
       }

       .pl-amount-170 {
           order: 2
       }

       .pl-actions-170 {
           order: 3
       }
   }

   /* Liste kabı: border yok, %5 D9D9D9 zemin */
   .paylist-170 {
       border: 0 !important;
       background: rgb(217 217 217 / 5%) !important;
       /* #D9D9D9 @ %5 */
       border-radius: 12px;
       padding: 6px 0;
       /* hafif dikey nefes */
   }

   /* Satırlar: sadece altta kibar ayraç */
   .payment-row-170 {
       border: 0 !important;
       border-bottom: 1px solid #EEF1F4;
       /* kibar çizgi */
       background: #fff;
   }

   .payment-row-170:last-child {
       border-bottom: 0;
   }

   /* Önceki + selector ile gelen üst çizgiyi bastır */
   .payment-row-170+.payment-row-170 {
       border-top: 0 !important;
   }

   /* Liste alanı: #D9D9D9 %5 şeffaf arkaplan */
   .paylist-170 {
       background: rgb(217 217 217 / 5%) !important;
       border: 0 !important;
       border-radius: 12px;
   }

   /* Her satırın ALTINDA kibar çizgi: #F6EFEF, 0.5px */
   .payment-row-170 {
       background: #fff;
       border: 0 !important;
       border-bottom: .5px solid #F6EFEF !important;
   }

   /* Son satırda da çizgi kalsın (önceki kuralları bastırmak için) */
   .payment-row-170:last-child {
       border-bottom: .5px solid #F6EFEF !important;
   }

   /* 1100px sabit genişlik */
   .container-1100 {
       max-width: 1100px;
       margin: 0 auto;
       padding: 0 12px
   }

   /* Başlık */
   .cert-head-200 {
       font-size: 18px;
       display: flex;
       align-items: center;
       gap: .5rem;
       margin-bottom: 8px
   }

   .cert-head-200 i {
       color: #6B7280
   }

   .cert-head-200 span {
       font-weight: 600;
       color: #111827
   }

   /* Kutu: arkaplan D9D9D9 %5, border yok */
   .cert-box-200 {
       background: rgb(217 217 217 / 5%);
       border: 0;
       border-radius: 12px;
       padding: 6px 0;
   }

   /* Satır: sadece altta ince çizgi (F6EFEF, 0.5px) */
   .cert-row-200 {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 16px;
       padding: 12px 16px;
       ;
       border-bottom: .5px solid #F6EFEF;
   }

   .cert-row-200:last-child {
       border-bottom: .5px solid #F6EFEF
   }

   /* Sol blok */
   .cr-left {
       display: flex;
       align-items: center;
       gap: 12px;
       min-width: 0
   }

   .cr-ico {
       width: 28px;
       height: 28px;
       display: grid;
       place-items: center;
       border: 1px solid #E6EAF0;
       border-radius: 5px;
       color: #D5D7DA
   }

   .cr-title {
       font-size: 13px;
       font-weight: 600;
       color: #111827;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis
   }

   .cr-sub {
       font-size: 12px;
       color: #000
   }

   /* PDF butonu (sağda) */
   .btn-pdf-200 {
       height: 32px;
       padding: 0 12px;
       border-radius: 4px;
       border: 1px solid #E6EAF0;
       background: #fff;
       color: #483F74;
       font-size: 13px;
       font-weight: 500;
       display: inline-flex;
       align-items: center;
       gap: 6px
   }

   .btn-pdf-200 i {
       font-size: 14px color:#483F74;

   }

   .wirepay {
       /* sadece bölüm içi boşlukları kullanıyoruz */
   }

   .wirepay .wire-crumb {
       display: flex;
       align-items: center;
       gap: 8px;
       font-size: 12px;
       color: #9aa0ad;
       margin-bottom: 18px;
   }

   .wirepay .wire-crumb i {
       font-size: 14px;
       color: #9aa0ad;
   }

   .wirepay .wire-crumb .sep {
       opacity: .75;
   }

   .wirepay .wire-title {
       text-align: center;
       font-weight: 600;
       font-size: 18px;
       letter-spacing: .3px;
       margin-bottom: 12px;
       color: #222;
   }

   /* Üst özet bar */
   .wirepay .wire-summary {
       background: #fff;
       border: 1px solid rgba(0, 0, 0, .12);
       border-radius: 8px;
       padding: 10px 14px;
       max-width: 860px;
       margin: 0 auto 18px;
   }

   .wirepay .amount-pill {
       display: inline-flex;
       align-items: center;
       gap: 10px;
       background: #fff;
       border: 1px solid rgba(0, 0, 0, .08);
       border-radius: 8px;
       padding: 8px 12px;
       font-size: 14px;
   }

   .wirepay .amount-pill .label {
       font-weight: 500;
       color: #444;
   }

   .wirepay .wire-status {
       font-size: 14px;
   }

   .wirepay .wire-status .status-text {
       color: #e64949;
       font-weight: 600;
   }

   /* Panel */
   .wirepay .wire-panel {
       background: #fff;
       border: 1px solid rgba(0, 0, 0, .12);
       border-radius: 10px;
       overflow: hidden;
       max-width: 860px;
       margin: 0 auto;
   }

   .wirepay .wire-panel-head {
       background: #f3f3f3;
       border-bottom: 1px solid rgba(0, 0, 0, .12);
       text-align: center;
       padding: 10px 12px;
       font-size: 13px;
       font-weight: 600;
       color: #333;
   }

   .wirepay .wire-panel-body {
       padding: 18px;
   }

   /* Bilgilendirme metni */
   .wirepay .wire-notice {
       text-align: center;
       color: #666;
       font-size: 12px;
       line-height: 1.55;
       max-width: 720px;
       margin: 0 auto 12px;
   }

   /* Banka tablosu */
   .wirepay .wire-table {
       border-collapse: separate;
       border-spacing: 0;
       width: 560px;
       max-width: 100%;
       border: 1px solid rgba(0, 0, 0, .12);
       background: #fff;
       border-radius: 8px;
       overflow: hidden;
   }

   .wirepay .wire-table tr+tr td {
       border-top: 1px solid rgba(0, 0, 0, .08);
   }

   .wirepay .wire-table td {
       padding: 10px 12px;
       font-size: 13px;
       vertical-align: middle;
   }

   .wirepay .wire-table td.key {
       width: 32%;
       background: #fafafa;
       color: #333;
       font-weight: 500;
       border-right: 1px solid rgba(0, 0, 0, .08);
   }

   .wirepay .wire-table td.val {
       color: #444;
   }

   /* İşlem kodu etiketi */
   .wirepay .wire-code-hint {
       text-align: center;
       font-size: 12px;
       color: #666;
       margin-top: 12px;
   }

   .wirepay .code-tag {
       display: inline-block;
       padding: 2px 8px;
       border: 1px solid rgba(0, 0, 0, .12);
       border-radius: 6px;
       background: #fff;
       font-weight: 600;
       color: #222;
   }

   /* Mobil küçük dokunuşlar */
   @media (max-width:576px) {
       .wirepay .wire-summary {
           padding: 10px;
       }

       .wirepay .amount-pill {
           padding: 6px 10px;
           font-size: 13px;
       }

       .wirepay .wire-panel-body {
           padding: 14px;
       }

       .wirepay .wire-table td {
           padding: 8px 10px;
           font-size: 12px;
       }
   }

   .hakkimizda {
       margin-top: 50px;
       margin-bottom: 100px;
   }

   .hakkimizda h1 {
       font-size: 36px;
       font-weight: 400;
   }

   .hakkimizda hr {
       background-color: #C9C7C7;
   }

   .hakkimizda p {
       font-size: 400;
       font-size: 16px;
   }