/* ============================================================
   SEM Custom Styles — Kapadokya Üniversitesi SEM
   Tüm yeni stiller buraya. Vendor dosyalarına dokunma.
   ============================================================ */

/* ── 1. KÜN Renk Paleti ──────────────────────────────────── */
:root {
  /* Köşe yumuşatma — tüm kart/buton/form/kutu alanları (tek yerden ayarlanır) */
  --sem-radius: 2px;
  --sem-primary: #002855; /* derin lacivert — ana */
  --sem-accent: #cb333b; /* kırmızı — vurgu */
  --sem-gold: #c9a84c; /* altın — sertifika/prestij */
  --sem-navy-light: #00428a; /* hover */
  --sem-success: #1a7a4a; /* Kayıtlar Açık */
  --sem-warning: #d97706; /* Son Kontenjanlar */
  --sem-info: #0369a1; /* bilgi */
  --sem-muted: #94a3b8; /* Yakında */
  --sem-bg-2: #f8f9fc; /* açık arka plan */
  --sem-footer-bg: #001a3a; /* footer */
  --sem-text: #0f172a;
}

/* ── 1b. Tipografi — site geneli ortak punto ölçeği ───────
   Referans: footer (h5.ft-title 20px, p.description 16px).
   NOT: bu şablonda html{font-size:10px}, yani 1rem=10px'tir —
   punto tanımlarken ASLA rem kullanma, hep px kullan. ────── */
h1 { font-size: 40px !important; font-weight: 700 !important; line-height: 1.2 !important; }
h2 { font-size: 32px !important; font-weight: 700 !important; line-height: 1.25 !important; }
h3 { font-size: 26px !important; font-weight: 700 !important; line-height: 1.3 !important; }
h4 { font-size: 22px !important; font-weight: 700 !important; line-height: 1.35 !important; }
h5 { font-size: 20px !important; font-weight: 700 !important; line-height: 1.4 !important; }
h6 { font-size: 18px !important; font-weight: 600 !important; line-height: 1.4 !important; }
p  { font-size: 16px !important; line-height: 1.6 !important; }
@media (max-width: 767px) {
  h1 { font-size: 30px !important; }
  h2 { font-size: 26px !important; }
  h3 { font-size: 22px !important; }
  h4 { font-size: 20px !important; }
}

/* ── 2. Kurs Kartı ───────────────────────────────────────── */
.sem-course-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: var(--sem-radius);
  box-shadow: 0 2px 12px rgba(0, 40, 85, 0.1);
  border: 1px solid rgba(0, 40, 85, 0.08);
  overflow: hidden;
  transition:
    transform 0.22s ease,
    box-shadow 0.22s ease;
  background: #fff;
}

.sem-course-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 28px rgba(0, 40, 85, 0.18);
}

.sem-course-card .rbt-card-img,
.rbt-card.variation-01 .rbt-card-img {
  aspect-ratio: 3 / 2;
  overflow: hidden;
}
.sem-course-card .rbt-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Gorseli olmayan egitimlerde jenerik placeholder yerine kurumsal logo gosterilir */
.sem-course-img-placeholder {
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--sem-primary) 0%, var(--sem-navy-light) 100%);
}
.sem-course-img-placeholder img {
  width: 45% !important;
  max-width: 220px;
  height: auto !important;
  object-fit: contain !important;
  display: block;
}

.sem-course-card .card-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 1.35rem 1.35rem 0.5rem;
}

.sem-course-card .card-footer {
  margin-top: auto;
  padding: 1rem 1.35rem 1.35rem;
  background: transparent;
  border-top: 1px solid rgba(0, 40, 85, 0.07);
}

.sem-course-card .card-footer .rbt-btn-link {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

/* ── 2b. Kurs Kartı Metin Boyutları ─────────────────────── */
.sem-course-card .rbt-card-text {
  font-size: 14px;
}
.sem-course-card .rbt-meta li {
  font-size: 14px;
}
.sem-course-card .card-footer .fw-bold {
  font-size: 14px;
}

/* ── 2c. Eğitim Kartı — pasif durum (Yakında / Kayıtlar Kapandı) ──────────
   data-durum attribute'una göre otomatik tetiklenir, kart HTML'inde zaten
   mevcut. Yeni bir kod/JS eklemeye gerek yok. ────────────────────────── */
.sem-course-card[data-durum="yakinda"] .rbt-card-img,
.sem-course-card[data-durum="kapandi"] .rbt-card-img {
  position: relative;
}
.sem-course-card[data-durum="yakinda"] .rbt-card-img img,
.sem-course-card[data-durum="kapandi"] .rbt-card-img img {
  filter: grayscale(70%);
  opacity: .75;
}
.sem-course-card[data-durum="yakinda"] .rbt-card-title,
.sem-course-card[data-durum="kapandi"] .rbt-card-title {
  opacity: .75;
}
.sem-course-card[data-durum="yakinda"] .sem-apply-btn,
.sem-course-card[data-durum="kapandi"] .sem-apply-btn {
  background: var(--kun-gri, #53565a) !important;
  background-image: none !important;
  opacity: .85;
}
.sem-course-card[data-durum="yakinda"] .sem-apply-btn:hover,
.sem-course-card[data-durum="kapandi"] .sem-apply-btn:hover {
  opacity: 1;
}

/* ── 3. Durum Etiketleri ─────────────────────────────────── */
.sem-status-badge {
  display: inline-block;
  padding: 0.25em 0.75em;
  border-radius: var(--sem-radius);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.4;
}
/* Kart gövdesi flex olduğu için rozet satır boyunca uzamasın */
.sem-course-card .sem-status-badge { align-self: flex-start; }

.sem-status-badge--acik {
  background: rgba(26, 122, 74, 0.12);
  color: var(--sem-success);
}
.sem-status-badge--son {
  background: rgba(217, 119, 6, 0.12);
  color: var(--sem-warning);
}
.sem-status-badge--yakinda {
  background: rgba(148, 163, 184, 0.15);
  color: #475569;
}
.sem-status-badge--kapandi {
  background: rgba(203, 51, 59, 0.12);
  color: var(--sem-accent);
}
.sem-status-badge--talep {
  background: rgba(3, 105, 161, 0.12);
  color: var(--sem-info);
}

/* ── 4. Filtre yardımcısı ────────────────────────────────── */
.sem-hidden {
  display: none !important;
}

/* ── 5. Başvur Butonu ────────────────────────────────────── */
.sem-apply-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.6rem 1.4rem;
  background: var(--sem-primary);
  color: #fff !important;
  border: none;
  border-radius: var(--sem-radius);
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s;
  text-decoration: none;
  white-space: nowrap;
  letter-spacing: 0.01em;
}
.sem-apply-btn:hover {
  background: var(--sem-navy-light);
  color: #fff !important;
}

/* ── 6. Modal Başlık ─────────────────────────────────────── */
#semApplyModal .modal-header {
  background: var(--sem-primary);
  color: #fff;
  border-radius: var(--sem-radius);
}

/* ── 7. Mobil menü collapse butonu ──────────────────────── */
.sem-mob-toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background: transparent;
  border: none;
  padding: 0;
  font-size: inherit;
  font-weight: 500;
  color: inherit;
  text-align: left;
  cursor: pointer;
  line-height: inherit;
}
.sem-mob-toggle:focus {
  outline: none;
  box-shadow: none;
}
.sem-mob-toggle[aria-expanded="true"] .feather-chevron-down {
  transform: rotate(180deg);
}
.feather-chevron-down {
  transition: transform 0.2s ease;
}

/* ── 9b. Eğitim listesi üst arama kutusu (tüm-kurslar / hizmet-içi) ───── */
.sem-course-top-search { max-width: 640px; margin: 0 auto; }
.sem-course-top-search input {
  border: 1px solid rgba(0, 40, 85, .16);
  border-radius: var(--sem-radius);
  background: #fff;
}
.sem-course-top-search input:focus {
  border-color: var(--sem-primary, #002855);
  outline: none;
}

/* ── 10. Sınav Merkezleri + Duyurular kart açıklamaları ─── */
#sem-sinav-merkezleri p.description.mt--10 {
  font-size: 22px !important;
}
#sem-sinav-merkezleri p.description {
  font-size: 14px !important;
}
#sem-duyurular p.description {
  font-size: 14px !important;
}

/* ── 11. Liste Görünümü — Yatay Kart Düzeni ─────────── */
.rbt-course-grid-column.active-list-view .sem-course-card {
  display: grid;
  grid-template-columns: 300px 1fr;
  grid-template-rows: 1fr auto;
  column-gap: 4px;
  border-radius: var(--sem-radius);
}
.rbt-course-grid-column.active-list-view .sem-course-card .rbt-card-img {
  grid-column: 1;
  grid-row: 1 / 3;
  /* görsel yatay (3:2, 1500x1000) — kart boyunca dikey uzamasın */
  aspect-ratio: 3 / 2 !important;
  height: auto;
  min-height: 0;
  align-self: center;
  border-radius: var(--sem-radius);
  overflow: hidden;
}
.rbt-course-grid-column.active-list-view .sem-course-card .rbt-card-img > a {
  display: block;
  height: 100%;
}
.rbt-course-grid-column.active-list-view .sem-course-card .rbt-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rbt-course-grid-column.active-list-view .sem-course-card .card-body {
  grid-column: 2;
  grid-row: 1;
}
.rbt-course-grid-column.active-list-view .sem-course-card .card-footer {
  grid-column: 2;
  grid-row: 2;
  margin-top: 0;
}
@media (max-width: 991px) {
  .rbt-course-grid-column.active-list-view .sem-course-card {
    grid-template-columns: 240px 1fr;
  }
}

/* anasayfa: Duyurular → Eğitimler arası boşluğu kıs */
#sem-duyurular {
  padding-bottom: 40px;
}
#sem-populer-egitimler {
  padding-top: 40px;
}

/* kurs-detay.html: mobil sabit Başvur çubuğu için body boşluğu */
@media (max-width: 991.98px) {
  body.kurs-detay-page {
    padding-bottom: 80px;
  }
}

/* ── 12. SSS Sayfa Stilleri ─────────────────────────────── */
.sem-faq-group { display: none; }
.sem-faq-group.is-active { display: block; }

/* Kategori pilleri */
.sem-faq-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 22px;
  border: 2px solid rgba(0, 40, 85, 0.18);
  border-radius: var(--sem-radius);
  background: #fff;
  color: #4a5568;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,40,85,0.06);
}
.sem-faq-pill:hover {
  border-color: var(--sem-primary);
  color: var(--sem-primary);
}
.sem-faq-pill.active {
  background: var(--sem-primary);
  border-color: var(--sem-primary);
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,40,85,0.25);
}

/* Accordion — rem → px override (vendor html:62.5% nedeniyle) */
.sem-sss-accordion .accordion-item {
  border: none !important;
  border-radius: var(--sem-radius);
  overflow: hidden;
  margin-bottom: 10px;
  box-shadow: 0 2px 16px rgba(0, 40, 85, 0.07);
  background: #fff;
}
.sem-sss-accordion .accordion-button {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--sem-primary) !important;
  background: #fff !important;
  padding: 20px 22px 20px 22px !important;
  border-left: 4px solid transparent !important;
  box-shadow: none !important;
  line-height: 1.45 !important;
  transition: border-color 0.2s, background 0.2s;
}
.sem-sss-accordion .accordion-button:not(.collapsed) {
  border-left-color: var(--sem-accent) !important;
  background: #fafbff !important;
  box-shadow: none !important;
  color: var(--sem-primary) !important;
}
.sem-sss-accordion .accordion-button::after {
  background-size: 18px !important;
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0;
}
.sem-sss-accordion .accordion-body {
  font-size: 15px !important;
  line-height: 1.8 !important;
  color: #475569;
  padding: 4px 22px 22px 26px !important;
  border-left: 4px solid var(--sem-accent) !important;
  background: #fafbff !important;
}
.sem-sss-accordion .accordion-body a {
  color: var(--sem-primary);
  font-weight: 600;
  text-decoration: underline;
}

/* SSS hero banner */
.sem-sss-hero {
  background: linear-gradient(135deg, var(--sem-primary) 0%, #00428a 100%);
  padding: 64px 0 52px;
  position: relative;
  overflow: hidden;
}
.sem-sss-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Ccircle cx='30' cy='30' r='28'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;
  pointer-events: none;
}
.sem-sss-hero .breadcrumb-inner { position: relative; }
.sem-sss-hero h1 {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #fff !important;
  margin-top: 12px;
  line-height: 1.25;
}
.sem-sss-hero p {
  font-size: 16px !important;
  color: rgba(255,255,255,0.78) !important;
  margin-top: 10px;
  max-width: 520px;
}
.sem-sss-hero .page-list li,
.sem-sss-hero .page-list li a {
  font-size: 14px !important;
  color: rgba(255,255,255,0.65) !important;
}
.sem-sss-hero .page-list li a:hover { color: #fff !important; }
.sem-sss-hero .page-list .rbt-breadcrumb-item.active { color: rgba(255,255,255,0.65) !important; }

/* SSS CTA band */
.sem-sss-cta {
  background: linear-gradient(135deg, var(--sem-primary) 0%, #00357a 100%);
  border-radius: var(--sem-radius);
  padding: 40px 36px;
  margin-top: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.sem-sss-cta h4 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 6px;
}
.sem-sss-cta p {
  font-size: 14px !important;
  color: rgba(255,255,255,0.75) !important;
  margin: 0;
}
@media (max-width: 575px) {
  .sem-sss-cta { padding: 28px 20px; flex-direction: column; text-align: center; }
  .sem-sss-hero h1 { font-size: 26px !important; }
  .sem-sss-hero { padding: 48px 0 36px; }
}

/* ── 13. Sayfa Hero Banner (görsel tabanlı) ──────────────── */
.sem-page-banner {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: block;
}
.sem-page-banner img {
  width: 100%;
  height: auto;
  display: block;
}
.sem-page-banner-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 20, 55, 0.52);
  pointer-events: none;
}
.sem-page-banner-content {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sem-page-banner-content .inner { width: 100%; }

/* ── 14. Hero Arama Bölümü ───────────────────────────────── */
.sem-hero-search-wrap {
  background: #fff;
  padding: 28px 0 24px;
  border-bottom: 1px solid rgba(0,40,85,0.08);
}
.sem-hero-search-inner {
  text-align: center;
  max-width: 680px;
  margin: 0 auto;
}
.sem-hero-search-label { display: none; }
.sem-hero-search-title { display: none; }

/* Arama kutusu */
.sem-hero-search-box {
  display: flex;
  align-items: center;
  background: #f8f9fc;
  border-radius: var(--sem-radius);
  border: 1.5px solid rgba(0,40,85,0.14);
  padding: 5px 5px 5px 18px;
  box-shadow: 0 2px 12px rgba(0,40,85,0.07);
  gap: 8px;
  transition: border-color 0.18s, box-shadow 0.18s;
}
.sem-hero-search-box:focus-within {
  border-color: var(--sem-primary);
  box-shadow: 0 2px 16px rgba(0,40,85,0.13);
  background: #fff;
}
.sem-hero-search-icon {
  font-size: 18px;
  color: #94a3b8;
  flex-shrink: 0;
}
.sem-hero-search-input {
  flex: 1;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  font-size: 15px !important;
  color: #0f172a !important;
  padding: 9px 0 !important;
  min-width: 0;
}
.sem-hero-search-input::placeholder { color: #94a3b8 !important; }
.sem-hero-search-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 24px;
  background: var(--sem-primary);
  color: #fff;
  border: none;
  border-radius: var(--sem-radius);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
  flex-shrink: 0;
}
.sem-hero-search-btn:hover { background: var(--sem-accent); }

/* Kategori etiketleri */
.sem-hero-search-cats {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
.sem-hero-search-cats span {
  font-size: 12px !important;
  color: #94a3b8 !important;
  font-weight: 500;
}
.sem-hero-search-cats a {
  font-size: 12px !important;
  color: #475569 !important;
  background: #f1f5f9;
  border: 1px solid rgba(0,40,85,0.1);
  border-radius: var(--sem-radius);
  padding: 3px 12px;
  text-decoration: none !important;
  transition: background 0.18s, color 0.18s, border-color 0.18s;
}
.sem-hero-search-cats a:hover {
  background: var(--sem-primary);
  border-color: var(--sem-primary);
  color: #fff !important;
}

@media (max-width: 767px) {
  .sem-hero-search-wrap { padding: 20px 0 18px; }
  .sem-hero-search-btn span { display: none; }
  .sem-hero-search-btn { padding: 10px 14px; }
}

/* ── 15. İletişim Sayfası ────────────────────────────────── */
.sem-contact-card {
  background: #fff;
  border-radius: var(--sem-radius);
  border: 1px solid rgba(0,40,85,0.08);
  box-shadow: 0 2px 16px rgba(0,40,85,0.07);
  padding: 32px 28px;
  height: 100%;
  text-align: center;
  transition: box-shadow 0.2s, transform 0.2s;
}
.sem-contact-card:hover {
  box-shadow: 0 8px 28px rgba(0,40,85,0.13);
  transform: translateY(-4px);
}
.sem-contact-card-icon {
  width: 56px; height: 56px;
  background: rgba(0,40,85,0.07);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 18px;
  font-size: 24px;
  color: var(--sem-primary);
}
.sem-contact-card h5 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--sem-primary) !important;
  margin-bottom: 10px;
}
.sem-contact-card p {
  font-size: 14px !important;
  color: #475569 !important;
  line-height: 1.8;
  margin: 0;
}
.sem-contact-card p a {
  color: var(--sem-primary) !important;
  text-decoration: none;
  font-weight: 500;
}
.sem-contact-card p a:hover { color: var(--sem-accent) !important; }

/* Form alanı */
.sem-contact-form-wrap {
  background: #fff;
  border-radius: var(--sem-radius);
  border: 1px solid rgba(0,40,85,0.08);
  box-shadow: 0 2px 20px rgba(0,40,85,0.07);
  padding: 40px 36px;
  height: 100%;
}
.sem-form-label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  margin-bottom: 6px;
  display: block;
}
.sem-form-control {
  width: 100%;
  padding: 11px 16px;
  border: 1.5px solid rgba(0,40,85,0.15);
  border-radius: var(--sem-radius);
  font-size: 15px !important;
  color: #0f172a !important;
  background: #f8f9fc !important;
  outline: none;
  transition: border-color 0.18s, box-shadow 0.18s;
  appearance: none;
}
.sem-form-control:focus {
  border-color: var(--sem-primary);
  box-shadow: 0 0 0 3px rgba(0,40,85,0.08);
  background: #fff !important;
}
.sem-form-control::placeholder { color: #94a3b8 !important; }
textarea.sem-form-control { resize: vertical; min-height: 120px; }
/* select diğer alanlarla aynı boyda */
select.sem-form-control { height: 50px; padding-top: 0; padding-bottom: 0; }
/* Form kartı her zaman beyaz: karanlık modda tema başlığı beyaza çekiyordu (beyaz üzerine beyaz) */
.sem-contact-form-wrap .title { color: var(--sem-primary, #002855) !important; }

.sem-contact-success {
  align-items: center;
  gap: 10px;
  background: rgba(26,122,74,0.1);
  border: 1px solid rgba(26,122,74,0.3);
  border-radius: var(--sem-radius);
  padding: 16px 20px;
  font-size: 15px !important;
  font-weight: 600;
  color: var(--sem-success) !important;
  margin-top: 16px;
}

/* Harita */
.sem-map-wrap {
  border-radius: var(--sem-radius);
  overflow: hidden;
  box-shadow: 0 2px 20px rgba(0,40,85,0.1);
  border: 1px solid rgba(0,40,85,0.08);
  flex-shrink: 0;
}
.sem-map-wrap iframe { display: block; }

/* Kurumsal CTA band */
.sem-kurumsal-cta {
  display: flex;
  align-items: center;
  gap: 20px;
  background: linear-gradient(135deg, var(--sem-primary) 0%, #003d7a 100%);
  border-radius: var(--sem-radius);
  padding: 28px 28px;
  flex-wrap: wrap;
}
.sem-kurumsal-cta-icon {
  width: 52px; height: 52px;
  background: rgba(255,255,255,0.12);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  color: #fff;
  flex-shrink: 0;
}
.sem-kurumsal-cta h5 {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 4px;
}
.sem-kurumsal-cta p {
  font-size: 13px !important;
  color: rgba(255,255,255,0.75) !important;
  margin: 0;
}

@media (max-width: 575px) {
  .sem-contact-form-wrap { padding: 28px 20px; }
  .sem-kurumsal-cta { flex-direction: column; text-align: center; }
}

/* ════════════════════════════════════════════════════════════
   MOBİL RESPONSIVE — Kapsamlı düzeltmeler
   Breakpoint referansı (Bootstrap 5):
     xs < 576 | sm 576 | md 768 | lg 992 | xl 1200
   ════════════════════════════════════════════════════════════ */

/* ── Genel: uzun metinler kırılsın ──────────────────────── */
@media (max-width: 991px) {
  h1, h2, h3, h4, h5,
  .title, .banner-title,
  .sem-course-card .rbt-card-title,
  .sem-page-banner-content h1 {
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* ── Anasayfa slider: görsel + metin dikey yığılsın ─────── */
@media (max-width: 991px) {
  .rbt-banner-area.rbt-banner-11 { padding-top: 40px; padding-bottom: 40px; }
  .rbt-banner-11 .course-thumbnail { margin-bottom: 20px; }
  .rbt-banner-11 .banner-title { font-size: 26px !important; }
  .rbt-banner-11 .description { font-size: 14px !important; }
}

/* ── Hero arama kutusu ───────────────────────────────────── */
@media (max-width: 576px) {
  .sem-hero-search-wrap { padding: 16px 0 14px; }
  .sem-hero-search-box { padding: 4px 4px 4px 14px; }
  .sem-hero-search-input { font-size: 13px !important; padding: 7px 0 !important; }
  .sem-hero-search-cats { margin-top: 8px; gap: 4px; }
  .sem-hero-search-cats a { font-size: 11px !important; padding: 2px 10px; }
}

/* ── SSS sayfası ─────────────────────────────────────────── */
@media (max-width: 768px) {
  .sem-faq-pill { padding: 7px 14px; font-size: 12px !important; }
  .sem-sss-accordion .accordion-button { padding: 14px 16px 14px 16px !important; font-size: 15px !important; }
  .sem-sss-accordion .accordion-body { padding: 4px 16px 18px 18px !important; font-size: 14px !important; }
  .sem-sss-cta { flex-direction: column; text-align: center; padding: 28px 20px; }
  .sem-sss-hero { padding: 40px 0 32px; }
  .sem-sss-hero h1 { font-size: 24px !important; }
  .sem-sss-hero p { font-size: 14px !important; }
}

/* ── Sayfa hero banner (slider1/2/3 görseller) ───────────── */
@media (max-width: 768px) {
  .sem-page-banner-content .title { font-size: 28px !important; }
  .sem-page-banner-content .description { font-size: 13px !important; }
  .sem-page-banner-overlay { background: rgba(0,20,55,0.62); }
}
@media (max-width: 576px) {
  .sem-page-banner-content .title { font-size: 22px !important; }
  .sem-page-banner-content .subtitle { font-size: 11px !important; }
}

/* ── Kurs kartı grid → liste görünümü tablet ────────────── */
@media (max-width: 768px) {
  .rbt-course-grid-column.active-list-view .sem-course-card {
    grid-template-columns: 180px 1fr;
  }
  /* Görsel kart boyunca dar bir şerit gibi uzamasın; butonlar tam genişlik alsın */
  .rbt-course-grid-column.active-list-view .sem-course-card .rbt-card-img {
    grid-row: 1;
    height: auto;
    min-height: 0;
    aspect-ratio: 3 / 2 !important;
    align-self: start;
  }
  .rbt-course-grid-column.active-list-view .sem-course-card .rbt-card-img > a {
    display: block;
    height: 100%;
  }
  .rbt-course-grid-column.active-list-view .sem-course-card .card-footer {
    grid-column: 1 / -1;
  }
}
@media (max-width: 576px) {
  .rbt-course-grid-column.active-list-view .sem-course-card {
    grid-template-columns: 140px 1fr;
  }
}

/* ── Kurs kartı font boyutları ───────────────────────────── */
@media (max-width: 576px) {
  .sem-course-card .rbt-card-title { font-size: 17px !important; }
  .sem-status-badge { font-size: 13px !important; }
}

/* ── Duyurular 3'lü grid → mobil 1 kolon ────────────────── */
@media (max-width: 576px) {
  .rbt-blog-area .sem-contact-card,
  .rbt-blog-area .rbt-card-body { padding: 20px 16px; }
}

/* ── İletişim sayfası ────────────────────────────────────── */
@media (max-width: 768px) {
  .sem-contact-card { padding: 24px 18px; }
  .sem-contact-form-wrap { padding: 28px 20px; }
  .sem-map-wrap iframe { height: 260px; }
  .sem-kurumsal-cta { gap: 14px; }
}
@media (max-width: 576px) {
  .sem-contact-form-wrap { padding: 22px 16px; }
  .sem-kurumsal-cta { padding: 22px 16px; }
  .sem-kurumsal-cta h5 { font-size: 15px !important; }
}

/* ── Footer tablet/mobil boşluklar ──────────────────────── */
@media (max-width: 768px) {
  .rbt-footer .footer-widget { margin-bottom: 28px; }
}

/* ── Tüm kurslar: filtre sidebar ─────────────────────────── */
@media (max-width: 991px) {
  #semFilterCollapse { margin-bottom: 24px; }
  /* Uzun kategori listesinde sonuç düğmesi ekranın altında görünür kalır */
  .sem-filtre-uygula { position: sticky; bottom: 12px; z-index: 5; margin-top: 12px; }
}
[aria-expanded="true"] > .sem-filtre-goster,
[aria-expanded="false"] > .sem-filtre-gizle { display: none; }

/* ── Mobile popup menu ───────────────────────────────────── */
/* Marka renk override */
.popup-mobile-menu .inner-wrapper {
  border-right: 3px solid var(--sem-primary);
}
.popup-mobile-menu .inner-wrapper .inner-top {
  border-bottom: 1px solid rgba(0,40,85,0.12);
  padding-bottom: 18px;
  margin-bottom: 16px;
}

/* Menü linkleri */
.popup-mobile-menu .mainmenu li a {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--sem-primary) !important;
}
.popup-mobile-menu .mainmenu li a:hover {
  color: var(--sem-accent) !important;
}
.popup-mobile-menu .mainmenu .submenu li a {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #475569 !important;
  padding-left: 16px !important;
}
.popup-mobile-menu .mainmenu .submenu li a:hover {
  color: var(--sem-primary) !important;
}

/* Alt: iletişim + auth */
.sem-mob-footer {
  margin-top: auto;
  padding-top: 24px;
  border-top: 1px solid rgba(0,40,85,0.1);
}
.sem-mob-contact {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 20px;
}
.sem-mob-contact a {
  font-size: 13px !important;
  color: #475569 !important;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.sem-mob-contact a:hover { color: var(--sem-primary) !important; }
.sem-mob-contact i { font-size: 14px; color: var(--sem-primary); }

.sem-mob-auth {
  display: flex;
  gap: 10px;
}
.sem-mob-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 14px;
  border-radius: var(--sem-radius);
  font-size: 13px !important;
  font-weight: 700;
  text-decoration: none !important;
  text-align: center;
  transition: all 0.18s;
}
.sem-mob-btn--outline {
  border: 2px solid var(--sem-primary);
  color: var(--sem-primary) !important;
  background: transparent;
}
.sem-mob-btn--outline:hover {
  background: var(--sem-primary);
  color: #fff !important;
}
.sem-mob-btn--solid {
  background: var(--sem-primary);
  color: #fff !important;
  border: 2px solid var(--sem-primary);
}
.sem-mob-btn--solid:hover {
  background: var(--sem-navy-light);
  border-color: var(--sem-navy-light);
}

/* ── Anasayfa SSS bölümü ─────────────────────────────────── */
@media (max-width: 768px) {
  #sem-sss { padding-top: 40px; padding-bottom: 40px; }
}

/* ── Kurs detay mobil sabit çubuk ───────────────────────── */
@media (max-width: 991px) {
  body.kurs-detay-page { padding-bottom: 72px; }
}

/* ── sem-hero-search genel padding kısaltma ─────────────── */
@media (max-width: 768px) {
  .sem-hero-search-wrap { padding: 20px 0 16px; }
}

/* ── Duyuru kartı (görselli) ─────────────────────────────── */
.sem-duyuru-kart { background:#f3f3f3; height:100%; text-decoration:none;
  overflow:hidden; border-radius: var(--sem-radius); transition:box-shadow .2s, transform .2s; }
.sem-duyuru-kart:hover { box-shadow:0 8px 28px rgba(var(--kun-lacivert-rgb, 0,40,85),.15); transform:translateY(-4px); }
.sem-duyuru-gorsel { aspect-ratio:3/2; overflow:hidden; }
.sem-duyuru-gorsel img { width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .35s; }
.sem-duyuru-kart:hover .sem-duyuru-gorsel img { transform:scale(1.04); }
.sem-duyuru-govde { padding:22px 24px 20px; display:flex; flex-direction:column; }
.sem-duyuru-tarih { font-size:13px; color:#6c757d; margin-bottom:10px; }
.sem-duyuru-baslik { font-size:16px; font-weight:700; color:#212121; line-height:1.4; margin-bottom:10px; }
.sem-duyuru-ozet { font-size:14px; color:#2f2f2f; line-height:1.6; margin:0; }
.sem-duyuru-ok { align-self:flex-end; color:var(--kun-kirmizi, #cb333b); font-size:22px; margin-top:16px; }

/* ── Faaliyet Raporu kartı (v2 — minimal) ────────────────── */
.sem-rapor-kart-v2 { border:1px solid rgba(var(--kun-lacivert-rgb, 0,40,85),.12);
  border-radius: var(--sem-radius); padding:28px 24px; background:#fff; transition:.25s;
  display:flex; flex-direction:column; gap:14px; height:100%; }
.sem-rapor-kart-v2:hover { border-color:var(--kun-mavi, #0072ce);
  box-shadow:0 10px 30px rgba(var(--kun-lacivert-rgb, 0,40,85),.12); transform:translateY(-4px); }
.sem-rapor-yil { font-size:40px; font-weight:800; color:var(--kun-lacivert, #002855);
  line-height:1; letter-spacing:-.02em; }
.sem-rapor-etiket { font-size:13px; color:#6c757d; display:block; }
.sem-rapor-boyut { font-size:12px; color:#9aa0a6; }
.sem-rapor-indir { display:inline-flex; align-items:center; gap:8px; align-self:flex-start;
  background:var(--kun-lacivert, #002855); color:#fff; padding:10px 18px; border-radius: var(--sem-radius);
  font-size:13px; font-weight:600; text-decoration:none; transition:.2s; }
.sem-rapor-indir:hover { background:var(--kun-mavi, #0072ce); color:#fff; }

/* ── Anasayfa hero slider — kurumsal zemin, dikey (4:5) görsel, camsı oklar ── */
.rbt-banner-11 {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(1100px 480px at 18% -15%, rgba(var(--kun-mavi-rgb),.35), transparent 60%),
    radial-gradient(900px 480px at 100% 115%, rgba(var(--kun-turkuaz-rgb),.20), transparent 60%),
    linear-gradient(160deg, var(--kun-lacivert) 0%, #001a3a 100%);
}
.rbt-banner-11::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: 28px 28px;
  opacity: .6;
  pointer-events: none;
}
.rbt-banner-11 .wrapper { position: relative; z-index: 1; }

.rbt-banner-11 .course-thumbnail { max-width:420px; margin-inline:auto; position: relative; }
.rbt-banner-11 .course-thumbnail::before {
  content: "";
  position: absolute;
  inset: -14px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  pointer-events: none;
}
.rbt-banner-11 .course-thumbnail img { aspect-ratio:4/5; width:100%;
  height:100%; object-fit:cover; border-radius: var(--sem-radius);
  box-shadow: 0 30px 60px -18px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.08); }

/* oklar: beyaz zemin yerine kurumsal lacivert */
.rbt-banner-11 .rbt-swiper-arrow {
  background-color: rgba(var(--kun-lacivert-rgb, 0,40,85),.85) !important;
}
.rbt-banner-11 .rbt-swiper-arrow::after {
  background-color: transparent !important;
}
.rbt-banner-11 .rbt-swiper-arrow {
  border: 1px solid rgba(var(--kun-lacivert-rgb, 0,40,85),1) !important;
  backdrop-filter: blur(6px);
  transition: background-color .25s, border-color .25s;
}
.rbt-banner-11 .rbt-swiper-arrow i.rbt-icon,
.rbt-banner-11 .rbt-swiper-arrow i.rbt-icon-top {
  color: #fff !important;
}
.rbt-banner-11 .rbt-swiper-arrow:hover,
.rbt-banner-11 .rbt-swiper-arrow:hover::after {
  background-color: var(--kun-sari) !important;
  border-color: var(--kun-sari) !important;
}
.rbt-banner-11 .rbt-swiper-arrow:hover i.rbt-icon,
.rbt-banner-11 .rbt-swiper-arrow:hover i.rbt-icon-top {
  color: var(--kun-lacivert) !important;
}

/* ── Kayıt Ol / Giriş — modern iki kolonlu auth arayüzü ──── */
.sem-auth-wrap { display:grid; grid-template-columns:1fr 1fr; min-height:calc(100vh - 120px); }
.sem-auth-visual { background:linear-gradient(160deg,var(--kun-lacivert, #002855),var(--kun-mavi, #0072ce));
  color:#fff; padding:56px; display:flex; flex-direction:column; justify-content:center; }
.sem-auth-visual .sem-auth-logo { max-width:180px; margin-bottom:32px; }
.sem-auth-visual h2 { margin-bottom:16px; color:#fff; }
.sem-auth-visual p { font-size:15px; opacity:.9; margin-bottom:28px; line-height:1.7; color:#fff; }
.sem-auth-perks { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:14px; }
.sem-auth-perks li { display:flex; align-items:flex-start; gap:10px; font-size:14px; opacity:.95; }
.sem-auth-perks i { color:var(--kun-sari, #f2a900); font-size:18px; flex-shrink:0; margin-top:2px; }
.sem-auth-form-col { display:flex; align-items:center; justify-content:center; padding:40px 24px; background:#fff; }
.sem-auth-form { max-width:480px; width:100%; }
.sem-auth-form h3 { color:var(--kun-lacivert, #002855); margin-bottom:8px; }
.sem-auth-form > p { font-size:14px; color:#6c757d; margin-bottom:28px; }
.sem-auth-form > p a { color:var(--kun-mavi, #0072ce); font-weight:600; text-decoration:none; }
.sem-auth-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.sem-auth-field { position:relative; margin-bottom:20px; }
.sem-auth-field label { display:block; font-size:13px; font-weight:600; color:#212121; margin-bottom:6px; }
.sem-auth-field .sem-auth-optional { font-weight:400; color:#94a3b8; }
.sem-auth-field input,
.sem-auth-field select { width:100%; padding:14px 16px; border:1.5px solid #e2e5ea;
  border-radius: var(--sem-radius); font-size:15px; transition:.2s; background:#fff; color:#212121;
  font-family:inherit; appearance:none; }
.sem-auth-field select {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23212121' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px;
  padding-right: 40px;
}
.sem-auth-field input:focus,
.sem-auth-field select:focus { border-color:var(--kun-mavi, #0072ce); outline:none;
  box-shadow:0 0 0 3px rgba(var(--kun-mavi-rgb, 0,114,206),.15); }
/* bootstrap-select, site genelinde her <select>'i JS ile bir <button>'a çeviriyor;
   o buton Bootstrap'in varsayılan .btn{font-size:1rem} kuralını miras alıyor —
   bu şablonda 1rem=10px olduğundan (bkz. üstteki tipografi notu) yazı küçük kalıyor. */
.bootstrap-select .btn.dropdown-toggle { font-size:15px; }
/* _SemApplyModal.cshtml'deki "Vazgeç" butonu site-özel bir sınıf (rbt-btn vb.) taşımadığından
   aynı 1rem=10px sorunundan etkileniyor, yanındaki "Gönder" butonuyla tutarsız görünüyor. */
#semApplyModal .btn { font-size:15px; }
@media (max-width:520px) { .sem-auth-row { grid-template-columns:1fr; gap:0; } }
.sem-auth-check { display:flex; align-items:flex-start; gap:8px; margin-bottom:24px; font-size:13px; color:#555; }
.sem-auth-check input[type="checkbox"] {
  position:static !important; opacity:1 !important; appearance:auto;
  width:16px; height:16px; margin:2px 0 0; flex-shrink:0;
}
.sem-auth-check label::before,
.sem-auth-check label::after { content:none !important; }
.sem-auth-check label { min-width:0; flex:1 1 auto; padding-left:0 !important; }
.sem-auth-check a { color:var(--kun-mavi, #0072ce); }
.sem-auth-submit { width:100%; padding:14px; border:none; border-radius: var(--sem-radius);
  background:linear-gradient(135deg,var(--kun-lacivert, #002855),var(--kun-mavi, #0072ce));
  color:#fff; font-size:15px; font-weight:700; cursor:pointer; transition:.2s; }
.sem-auth-submit:hover { opacity:.92; }
@media (max-width:900px) { .sem-auth-wrap { grid-template-columns:1fr; } .sem-auth-visual { display:none; } }

/* ── Blog kartı ───────────────────────────────────────────── */
.sem-blog-kategori { display:inline-block; background:rgba(var(--kun-mavi-rgb, 0,114,206),.1);
  color:var(--kun-mavi, #0072ce); font-size:12px; font-weight:700; letter-spacing:.02em;
  padding:5px 12px; border-radius: var(--sem-radius); margin-bottom:12px; text-transform:uppercase; }
.sem-blog-devamini-oku { display:inline-flex; align-items:center; gap:6px; color:var(--kun-kirmizi, #cb333b);
  font-size:14px; font-weight:600; margin-top:16px; }
.sem-duyuru-kart:hover .sem-blog-devamini-oku { text-decoration:underline; }

/* ── Sivri köşe sistemi — kartlar/butonlar/etiketler/formlar site genelinde
   düz kenarlı olsun (gerçek daire/ikon butonları hariç) ──────────────── */
.rbt-btn,
.radius-round,
.rbt-card,
.rbt-card.variation-01,
.rbt-card-img,
.rbt-cat-box-1,
.rbt-cat-box-1 .inner,
.rbt-badge,
.rbt-badge-2,
.rbt-badge-3,
.rbt-badge-4,
.rbt-badge-5,
.rbt-badge-card,
.form-control,
.rbt-input,
select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
textarea,
.modal-content,
.dropdown-menu,
.rbt-user-menu-list-wrapper,
.accordion-button,
.accordion-item,
.rbt-search-dropdown,
.rbt-price,
.card,
.alert,
.rbt-btn.btn-border-gradient.radius-round,
.rbt-btn.btn-border-gradient.radius-round::before,
.rbt-btn::before,
.rbt-btn::after {
  border-radius: var(--sem-radius) !important;
}

/* ── İkincil buton (.btn-border) — kurumsal OUTLINE turkuaz, hover'da dolu ──
   (primary solid turkuaz'dan ayrışır; ör. "Talep Bırak") ── */
.rbt-btn.btn-border {
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid var(--kun-turkuaz, #00A1AA) !important;
  color: var(--kun-turkuaz, #00A1AA) !important;
}
.rbt-btn.btn-border span { color: inherit !important; -webkit-text-fill-color: currentColor !important; }
.rbt-btn.btn-border:hover {
  background-image: none !important;
  background-color: var(--kun-turkuaz, #00A1AA) !important;
  border-color: var(--kun-turkuaz, #00A1AA) !important;
  color: #fff !important;
}
.rbt-btn.btn-border:hover span { color: #fff !important; -webkit-text-fill-color: #fff !important; }

/* ── Footer "Bizimle İletişime Geçin" — beyaz yazı, sabit (animasyonsuz) ── */
.footer-widget .contact-btn .rbt-btn {
  background-image: none !important;
  background-color: transparent !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
  color: #fff !important;
}
.footer-widget .contact-btn .rbt-btn::before {
  background: transparent !important;
}
.footer-widget .contact-btn .rbt-btn:hover {
  background-image: none !important;
  background-color: #fff !important;
  border-color: #fff !important;
  color: var(--kun-lacivert, #002855) !important;
}
.footer-widget .contact-btn .rbt-btn:hover::before {
  background: #fff !important;
}
.footer-widget .contact-btn .rbt-btn .btn-text,
.footer-widget .contact-btn .rbt-btn i {
  color: inherit !important;
}
.footer-widget .contact-btn .rbt-btn.hover-icon-reverse .btn-text,
.footer-widget .contact-btn .rbt-btn.hover-icon-reverse .btn-icon {
  transition: none !important;
  transform: none !important;
  margin-inline-start: 0 !important;
}
.footer-widget .contact-btn .rbt-btn.hover-icon-reverse .btn-icon + .btn-icon {
  display: none !important;
}
.footer-widget .contact-btn .rbt-btn.hover-icon-reverse:hover .btn-text,
.footer-widget .contact-btn .rbt-btn.hover-icon-reverse:hover .btn-icon {
  opacity: 1 !important;
  transform: none !important;
}

/* ── Header "Kayıt Ol" — kayan yazı (marquee) animasyonu kapalı ── */
.rbt-btn.rbt-marquee-btn span,
.rbt-btn.rbt-marquee-btn.marquee-auto span,
.rbt-btn:hover.rbt-marquee-btn span {
  animation: none !important;
}
.rbt-btn.rbt-marquee-btn span::after {
  content: none !important;
}

/* ── Başvuru Modalı (semApplyModal) — form alanları ──────── */
.sem-modal-field { margin-bottom: 18px; }
.sem-modal-field label {
  display: block; font-size: 13px; font-weight: 600; color: #212121; margin-bottom: 6px;
}
.sem-modal-field input,
.sem-modal-field select,
.sem-modal-field textarea {
  width: 100%; padding: 12px 14px; border: 1.5px solid #e2e5ea;
  font-size: 14px; font-family: inherit; transition: .2s; background: #fff; color: #212121;
  appearance: none;
}
.sem-modal-field select {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23212121' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px;
  padding-right: 38px;
}
.sem-modal-field textarea { resize: vertical; }
.sem-modal-field input:focus,
.sem-modal-field select:focus,
.sem-modal-field textarea:focus {
  border-color: var(--kun-mavi, #0072ce); outline: none;
  box-shadow: 0 0 0 3px rgba(var(--kun-mavi-rgb, 0, 114, 206), .15);
}
.sem-modal-field input[readonly] { background: #f3f4f6; color: #64748b; }
.sem-modal-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 480px) { .sem-modal-row { grid-template-columns: 1fr; } }
.sem-modal-radio-group { display: flex; gap: 24px; padding-top: 4px; }
.sem-modal-radio { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; cursor: pointer; position: relative; }
.sem-modal-radio input[type="radio"] {
  position: static !important; opacity: 1 !important; appearance: auto;
  width: 16px; height: 16px; margin: 0; flex-shrink: 0;
}
.sem-modal-radio::before,
.sem-modal-radio::after { content: none !important; }
.sem-modal-check { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; color: #555; margin-top: 6px; }
.sem-modal-check input[type="checkbox"] {
  position:static !important; opacity:1 !important; appearance:auto;
  width:16px; height:16px; margin:2px 0 0; flex-shrink:0;
}
.sem-modal-check label::before,
.sem-modal-check label::after { content:none !important; }
.sem-modal-check label { min-width: 0; flex: 1 1 auto; padding-left:0 !important; }
.sem-modal-check a { color: var(--kun-mavi, #0072ce); }

/* ── Başvuru Modalı — renk/ölçü sabitleme ─────────────────────────────
   Tema h5'e koyu lacivert (#192335) veriyor → lacivert başlıkta başlık görünmüyordu;
   karanlık modda ise placeholder ve "Vazgeç" beyaz oluyor, beyaz zeminde kayboluyordu.
   Modal kendi renklerini açıkça taşır: açık / karanlık modda aynı görünür. */
#semApplyModal .modal-content {
  background: #fff !important; color: #334155; border: 0;
  border-radius: var(--sem-radius); overflow: hidden;
  box-shadow: 0 24px 60px -12px rgba(0, 20, 45, .45);
}
#semApplyModal .modal-header {
  padding: 18px 24px; border-bottom: 0;
  border-radius: 0; align-items: center;
}
#semApplyModal .modal-title {
  color: #fff !important; font-size: 19px; font-weight: 700; line-height: 1.3; margin: 0;
}
#semApplyModal .btn-close { opacity: .8; box-shadow: none; }
#semApplyModal .btn-close:hover { opacity: 1; }
#semApplyModal .modal-body { color: #334155; }
#semApplyModal .sem-modal-field label { color: #1e293b !important; }
#semApplyModal .sem-modal-field input:not([type="radio"]),
#semApplyModal .sem-modal-field select {
  height: 48px; line-height: normal; padding-top: 0; padding-bottom: 0;
  border-radius: var(--sem-radius);
}
#semApplyModal .sem-modal-field textarea { min-height: 96px; padding: 12px 14px; border-radius: var(--sem-radius); }
#semApplyModal .sem-modal-field input:not([type="radio"]),
#semApplyModal .sem-modal-field select,
#semApplyModal .sem-modal-field textarea {
  background-color: #fff !important; color: #1e293b !important; border-color: #d5dae1;
}
#semApplyModal .sem-modal-field input[readonly] {
  background-color: #f1f5f9 !important; color: #475569 !important; cursor: default;
}
#semApplyModal ::placeholder { color: #94a3b8 !important; opacity: 1; }
/* "Seçiniz" henüz seçilmemişken placeholder tonunda */
#semApplyModal .sem-modal-field select:invalid { color: #94a3b8 !important; }
#semApplyModal .sem-modal-field select option { color: #1e293b; }
#semApplyModal .sem-modal-radio { color: #1e293b !important; font-size: 15px; }
#semApplyModal .sem-modal-radio input[type="radio"],
#semApplyModal .sem-modal-check input[type="checkbox"] {
  width: 18px; height: 18px; accent-color: var(--kun-turkuaz, #00A1AA);
}
#semApplyModal .sem-modal-check { color: #475569; font-size: 14px; }
#semApplyModal .sem-modal-check label { color: #475569 !important; }
#semApplyModal .sem-modal-check a { color: var(--kun-mavi, #0072ce) !important; text-decoration: underline; }
#semApplyModal .text-danger { color: var(--sem-accent, #cb333b) !important; }

/* Alt butonlar — aynı yükseklik, okunur "Vazgeç" (önceki hali 10px ve soluktu) */
#semApplyModal .modal-footer {
  background: #fff !important; border-top: 1px solid #e8ecf1;
  padding: 14px 24px; gap: 10px;
}
#semApplyModal .modal-footer > * { margin: 0; }
#semApplyModal .modal-footer .btn-outline-secondary {
  height: 48px; padding: 0 22px; font-size: 15px; font-weight: 600;
  color: var(--sem-primary, #002855) !important; background: #fff !important;
  border: 1.5px solid #cbd2db !important; border-radius: var(--sem-radius);
}
#semApplyModal .modal-footer .btn-outline-secondary:hover {
  background: #f1f5f9 !important; border-color: var(--sem-primary, #002855) !important;
}
#semApplyModal #semApplySubmit { height: 48px; line-height: 48px; padding: 0 26px; font-size: 15px; }
#semApplyModal #semApplySubmit[disabled] { opacity: .7; cursor: wait; }

/* Doğrulama — hatalı alan kırmızı çerçeve + altında kısa mesaj */
#semApplyModal .sem-modal-error { display: none; color: var(--sem-accent, #cb333b); font-size: 13px; margin-top: 6px; }
#semApplyModal .is-invalid > .sem-modal-error { display: block; }
#semApplyModal .is-invalid input:not([type="radio"]):not([type="checkbox"]),
#semApplyModal .is-invalid select,
#semApplyModal .is-invalid textarea { border-color: var(--sem-accent, #cb333b) !important; }
#semApplyModal .sem-modal-check.is-invalid label { color: var(--sem-accent, #cb333b) !important; }
#semApplyModal .sem-modal-check { flex-wrap: wrap; }
#semApplyModal .sem-modal-check > .sem-modal-error { flex-basis: 100%; margin-top: 2px; }

/* Gönderim sonrası teşekkür ekranı */
#semApplyModal .sem-modal-success { text-align: center; padding: 24px 8px 12px; color: #334155; }
#semApplyModal .sem-modal-success i {
  display: inline-flex; align-items: center; justify-content: center;
  width: 64px; height: 64px; border-radius: 50%; font-size: 30px;
  background: rgba(0, 161, 170, .12); color: var(--kun-turkuaz, #00A1AA); margin-bottom: 16px;
}
#semApplyModal .sem-modal-success h4 { color: var(--sem-primary, #002855) !important; font-size: 20px; margin: 0 0 8px; }
#semApplyModal .sem-modal-success p { margin: 0; font-size: 15px; color: #475569; }
@media (max-width: 575px) {
  #semApplyModal .modal-header,
  #semApplyModal .modal-footer { padding-left: 18px; padding-right: 18px; }
  #semApplyModal .modal-body { padding: 18px !important; }
}

/* ── Anasayfa — section aralarındaki fazla boşluğu azalt ─── */
.sem-home .rbt-banner-area.ptb--100 { padding: 60px 0 !important; }
.sem-home .rbt-section-gap { padding: 64px 0; }
.sem-home #sem-duyurular { padding-bottom: 24px; }
@media (max-width: 767px) {
  .sem-home .rbt-section-gap { padding: 44px 0; }
}

/* ── Eğitim ızgarası — 3 sütun + daraltılmış filtre (kartlar büyür) ───
   Vendor .container xl/xxl'de 1140-1320px'te sabitleniyor, bu yüzden
   col-xl-2 (%16.66) sidebar'ı hiçbir ekranda ~220px'i geçemiyor — bu,
   en uzun filtre kelimesi ("Teknolojileri", 13 karakter) için bile
   sıkışık kalıyordu. Çözüm: sidebar'a yüzde yerine SABİT/geniş bir
   genişlik (280px — 13 karakterlik kelime + checkbox + boşluk payı
   rahatça sığar), grid sütununu da flex-grow ile kalan alanı dolduracak
   şekilde ayarladık — taşma/alt satıra kayma riski olmadan. ────────── */
@media (min-width: 1200px) {
  .sem-course-sidebar-col { flex: 0 0 280px; width: 280px; max-width: 280px; }
  .sem-course-grid-col { flex: 1 1 0%; width: auto; max-width: 100%; }
}
.rbt-course-grid-column .course-grid-3 { width: 33.333%; }
@media (min-width: 768px) and (max-width: 991px) { .rbt-course-grid-column .course-grid-3 { width: 50%; } }
@media (max-width: 767px) { .rbt-course-grid-column .course-grid-3 { width: 100%; } }

/* ── Kart simetrisi — metin uzunluğundan bağımsız hizalama ─── */
.sem-course-card .rbt-card-title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; min-height: 2.8em; line-height: 1.4; margin-bottom: .6rem;
}
/* Yön A (tum-kurslar.html): açıklama 2 satır clamp — hizmet-ici'de element yok, etkisiz */
.sem-course-card .rbt-card-text {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; min-height: 2.6em; margin-bottom: .6rem;
}
.sem-course-card .rbt-meta { min-height: 1.6em; margin-bottom: 0; }

/* ── Kart kontrastı — beyaz kart, gri (#f8f9fa) zemin üzerinde net ayrışma
   Kurumsal: ince lacivert hairline + yumuşak nötr gölge (kum kaldırıldı) ── */
.sem-course-card {
  position: relative;
  background: #fff;
  border: 1px solid rgba(0, 40, 85, .10);
  box-shadow: 0 2px 12px rgba(0, 40, 85, .06);
}
.sem-course-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 26px rgba(0, 40, 85, .13);
  border-color: rgba(0, 40, 85, .20);
}
.sem-status-badge {
  background: #fff; border: 1px solid rgba(0, 40, 85, .15);
  color: var(--sem-text, #222); font-size: 12px; font-weight: 600;
  padding: .2em .7em; display: inline-flex; align-items: center; gap: .4em;
}
.sem-status-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; }
.sem-status-badge--acik::before { background: var(--sem-success, #2e7d32); }
.sem-status-badge--son::before { background: var(--sem-warning, #f2a900); }
.sem-status-badge--yakinda::before { background: var(--sem-muted, #9aa0a6); }
.sem-status-badge--kapandi::before { background: var(--sem-accent, #cb333b); }
.sem-status-badge--talep::before { background: var(--sem-info, #0072ce); }

/* ── Sayfa banner'ı — KİLİTLİ: gri (#f8f9fa) + küçültülmüş boyut + motif ───
   Hedef ölçü: sem-hakkinda.html hero'su (~215px, padding:48px 0). Toolbar
   (rbt-course-top-wrapper) artık banner içinde DEĞİL — HTML'de sidebar+grid
   satırının hemen üstüne taşındı (bkz. tum-kurslar.html / hizmet-ici-egitimler.html). */
.rbt-page-banner-wrapper { padding: 48px 0 !important; }
.rbt-page-banner-wrapper .rbt-banner-image {
  background: #f8f9fa !important;
  position: relative;
  overflow: hidden;
}
.rbt-page-banner-wrapper .rbt-banner-image::after { display: none !important; }
.rbt-page-banner-wrapper .rbt-banner-content-top .title { color: var(--sem-primary, #002855) !important; }
.rbt-page-banner-wrapper .page-list a,
.rbt-page-banner-wrapper .page-list li,
.rbt-page-banner-wrapper .page-list .active,
.rbt-page-banner-wrapper .description { color: var(--kun-gri, #53565a) !important; }

/* Banner'ın kartlara taşan -175px negatif üst boşluğu bu iki sayfada sıfırlanır
   (bkz. .sem-egitim-banner-page body sınıfı) — egitmen-panel.html etkilenmez. */
body.sem-egitim-banner-page .rbt-section-overlayping-top { margin-top: 24px; }

/* Animasyonlu eğitim motifi — banner sağında, mobilde gizlenir */
.banner-motif {
  position: absolute; right: 20px; top: 50%; transform: translateY(-50%);
  height: 150px; max-width: 45%; object-fit: contain; pointer-events: none;
}
@media (max-width: 575px) { .banner-motif { display: none; } }

/* ── Butonlar — kurumsal turkuaz + sarı hover (SİTE GENELİ, kilitli karar) ─── */
.rbt-btn, .sem-apply-btn, .sem-btn-primary,
a.rbt-btn, button.rbt-btn, .rbt-btn.btn-gradient {
  background: var(--kun-turkuaz, #00A1AA) !important;
  background-image: none !important;
  border-color: var(--kun-turkuaz, #00A1AA) !important;
  color: #fff !important;
  transition: background .2s, color .2s, border-color .2s !important;
}
.rbt-btn:hover, .sem-apply-btn:hover, .sem-btn-primary:hover,
a.rbt-btn:hover, button.rbt-btn:hover, .rbt-btn.btn-gradient:hover {
  background: var(--kun-sari, #F2A900) !important;
  border-color: var(--kun-sari, #F2A900) !important;
  color: var(--sem-primary, #002855) !important;
}

/* Üst menüdeki "Kayıt Ol" — border-gradient + marquee butonu; solid turkuaz/sarı yap */
.rbt-btn-wrapper .rbt-btn,
.rbt-btn.btn-border-gradient,
.rbt-btn.rbt-marquee-btn {
  background: var(--kun-turkuaz, #00A1AA) !important;
  background-image: none !important;
  border: 1px solid var(--kun-turkuaz, #00A1AA) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
.rbt-btn-wrapper .rbt-btn::before, .rbt-btn-wrapper .rbt-btn::after,
.rbt-btn.btn-border-gradient::before, .rbt-btn.btn-border-gradient::after {
  background: var(--kun-turkuaz, #00A1AA) !important;
  background-image: none !important;
}
.rbt-btn-wrapper .rbt-btn span,
.rbt-btn.btn-border-gradient span {
  color: #fff !important; -webkit-text-fill-color: #fff !important;
}
.rbt-btn-wrapper .rbt-btn:hover,
.rbt-btn.btn-border-gradient:hover,
.rbt-btn.rbt-marquee-btn:hover {
  background: var(--kun-sari, #F2A900) !important;
  border-color: var(--kun-sari, #F2A900) !important;
  color: var(--sem-primary, #002855) !important;
  -webkit-text-fill-color: var(--sem-primary, #002855) !important;
}
.rbt-btn-wrapper .rbt-btn:hover::before, .rbt-btn-wrapper .rbt-btn:hover::after {
  background: var(--kun-sari, #F2A900) !important;
}
.rbt-btn-wrapper .rbt-btn:hover span,
.rbt-btn.btn-border-gradient:hover span {
  color: var(--sem-primary, #002855) !important; -webkit-text-fill-color: var(--sem-primary, #002855) !important;
}

/* ── Site geneli zemin rengi — #f8f9fa (beyaz kartlar bu gri üzerinde ayrışır) ─── */
body { background: #f8f9fa !important; }

/* ── Anasayfa "Öne Çıkan Eğitimler" — kapadokya.edu.tr etkinlik kartı ölçüsü feyzi:
   kart kolonu doldurur (yan boşluk yok), görsel site geneliyle aynı oranda (3:2, 1500x1000). */
#sem-populer-egitimler .sem-course-card { max-width: none; margin: 0; }
#sem-populer-egitimler .sem-course-card .rbt-card-img { aspect-ratio: 3 / 2; }
/* Boşluklar dar ve dengeli (yatay + dikey eşit) */
#sem-populer-egitimler .row.g-4 { --bs-gutter-x: 12px; --bs-gutter-y: 12px; }

/* ── Durum rozetleri — kurumsal solid pill, kart gövdesinde başlığın ÜSTÜNDE
   (görsel üstünde belirsiz kalıyordu; kum şerit de kaldırıldı) ──────────── */
.sem-status-badge {
  position: static !important;
  display: inline-block !important;
  width: auto !important; margin: 0 0 10px !important;
  padding: 5px 12px !important;
  font-size: 12px !important; font-weight: 600 !important;
  border: none !important; border-radius: var(--sem-radius) !important;
  color: #fff !important; background: var(--sem-primary, #002855) !important;
}
.sem-status-badge::before { display: none !important; }
.sem-status-badge--acik    { background: var(--sem-success, #1a7a4a) !important; }
.sem-status-badge--son     { background: var(--kun-sari, #f2a900) !important; color: var(--sem-primary, #002855) !important; }
.sem-status-badge--yakinda { background: var(--kun-gri, #53565a) !important; }
.sem-status-badge--kapandi { background: var(--sem-accent, #cb333b) !important; }
.sem-status-badge--talep   { background: var(--kun-mavi, #0072ce) !important; }

/* ══ Anasayfa slider — klasik full-görsel hero (split/dikey yapı kaldırıldı) ══ */
.rbt-banner-area.sem-hero-slider {
  padding: 0 !important;
  background: transparent !important;
}
.sem-hero-slider .swiper,
.sem-hero-slider .swiper-wrapper,
.sem-hero-slider .swiper-slide { height: auto; }
/* Yükseklik ekran YÜKSEKLİĞİNE göre ölçeklenir: aynı inç ekranda Windows ölçekleme
   (%125/%150), tarayıcı zoom'u veya araç çubukları görünür alanı küçülttüğünde
   sabit 640px hero tüm ekranı kaplıyordu. Üst sınır 640px, alt sınır 440px.
   svh desteklemeyen tarayıcı bir önceki vh satırını kullanır. */
.sem-hero-slide {
  position: relative;
  min-height: clamp(440px, 68vh, 640px);
  min-height: clamp(440px, 68svh, 640px);
  display: flex;
  align-items: center;
  /* Görsel yüklenemezse beyaz başlık beyaz zeminde kaybolmasın */
  background-color: var(--sem-primary);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.sem-hero-overlay {
  display: none;
}
/* Metin okunabilirliği için hafif gölge (mavi kaplama kaldırıldı) */
.sem-hero-title,
.sem-hero-desc,
.sem-hero-tag {
  text-shadow: 0 2px 18px rgba(0, 0, 0, .45);
}
/* Hero arka plan videosu — gerçek video dosyası gelene kadar poster (mevcut
   hero görseli) fallback görünür; yükleme başarısız olursa sem-hero-slide'ın
   kendi background-image'ı zaten arkada durduğu için sayfa bozulmaz. */
.sem-hero-video {
  position: absolute; inset: 0; z-index: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.sem-hero-slide .container { position: relative; z-index: 2; }
.sem-hero-content { max-width: 620px; color: #fff; }
.sem-hero-tag {
  display: inline-block; background: var(--kun-turkuaz, #00A1AA); color: #fff;
  font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: 6px 14px; margin-bottom: 18px;
}
.sem-hero-title {
  color: #fff; font-weight: 800; line-height: 1.1; margin: 0;
  font-size: clamp(30px, 4.4vw, 52px);
}
.sem-hero-desc {
  color: rgba(255,255,255,.9); font-size: 17px; line-height: 1.7;
  margin: 18px 0 0; max-width: 540px;
}
.sem-hero-btn {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 26px;
  background: var(--kun-turkuaz, #00A1AA); color: #fff !important;
  font-weight: 700; font-size: 15px; padding: 14px 32px;
  transition: background .2s, color .2s;
}
.sem-hero-btn:hover { background: var(--kun-sari, #F2A900); color: var(--sem-primary, #002855) !important; }
/* okları görselin üstünde belirgin tut — tema hover'a kadar opacity:0 veriyor,
   dokunmatikte hover olmadığı için oklar hiç görünmüyordu. Her zaman koyu turuncu. */
.sem-hero-slider .rbt-swiper-arrow,
.sem-hero-slider .rbt-swiper-arrow.swiper-button-disabled {
  z-index: 5;
  opacity: 1 !important;
  background-color: #d97706 !important;
  border-color: #d97706 !important;
  backdrop-filter: none;
  box-shadow: 0 6px 18px rgba(0,0,0,.28);
}
.sem-hero-slider .rbt-swiper-arrow::after { background-color: #d97706 !important; }
.sem-hero-slider .rbt-swiper-arrow i.rbt-icon,
.sem-hero-slider .rbt-swiper-arrow i.rbt-icon-top { color: #fff !important; }
.sem-hero-slider .rbt-swiper-arrow:hover,
.sem-hero-slider .rbt-swiper-arrow:hover::after {
  background-color: #b45309 !important;
  border-color: #b45309 !important;
}
.sem-hero-slider .rbt-swiper-arrow:hover i.rbt-icon,
.sem-hero-slider .rbt-swiper-arrow:hover i.rbt-icon-top { color: #fff !important; }
/* masaüstünde sol ok metnin üstüne binmesin */
@media (min-width: 768px) {
  .sem-hero-slider .sem-hero-content { padding-left: 48px; }
}
@media (max-width: 767px) {
  /* mobilde de yatay dikdörtgen kalsın (kareye/dikeye düşmesin) */
  .sem-hero-slide {
    min-height: 0;
    aspect-ratio: 16 / 10;
    padding: 18px 0 16px;
  }
  .sem-hero-tag { font-size: 10px; padding: 4px 10px; margin-bottom: 8px; }
  .sem-hero-title { font-size: 20px; line-height: 1.2; }
  .sem-hero-desc { display: none; }
  .sem-hero-btn { margin-top: 12px; font-size: 13px; padding: 9px 18px; }
  /* oklar küçülüp sağ alta alınır, metnin üstüne binmesin */
  .sem-hero-slider .rbt-swiper-arrow {
    width: 38px; height: 38px;
    top: auto; bottom: 14px; transform: none;
  }
  .sem-hero-slider .rbt-swiper-arrow.rbt-arrow-left { left: auto; right: 62px; }
  .sem-hero-slider .rbt-swiper-arrow.rbt-arrow-right { right: 16px; }
}

/* ══ İçerik şablonu (.sem-icerik) — CMS'ten gelen düz metin/HTML otomatik
   kurumsal görünür. Detay/iç sayfalar bu şablonu kullanır. ══ */
.sem-icerik { font-size: 16px; line-height: 1.85; color: #333; }
.sem-icerik > *:first-child { margin-top: 0; }
.sem-icerik p { margin: 0 0 16px; }
.sem-icerik h2 { color: var(--sem-primary, #002855); font-weight: 800; font-size: clamp(24px, 3vw, 32px); margin: 40px 0 14px; }
.sem-icerik h3 { color: var(--sem-primary, #002855); font-weight: 700; font-size: 20px; margin: 28px 0 10px; }
.sem-icerik a { color: var(--kun-turkuaz, #00A1AA); text-decoration: underline; }
.sem-icerik a:hover { color: var(--sem-primary, #002855); }
.sem-icerik strong { color: var(--sem-primary, #002855); }
.sem-icerik img { max-width: 100%; height: auto; margin: 20px 0; }
.sem-icerik ul, .sem-icerik ol { margin: 0 0 20px; padding-left: 0; list-style: none; }
.sem-icerik ol { counter-reset: sem-li; }
.sem-icerik ul li, .sem-icerik ol li { position: relative; padding-left: 34px; margin-bottom: 12px; }
.sem-icerik ul li::before { content: ""; position: absolute; left: 7px; top: 12px; width: 8px; height: 8px; background: var(--kun-turkuaz, #00A1AA); border-radius: 50%; }
.sem-icerik ol li { counter-increment: sem-li; }
.sem-icerik ol li::before { content: counter(sem-li); position: absolute; left: 0; top: 1px; width: 24px; height: 24px; background: var(--sem-primary, #002855); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.sem-icerik blockquote { margin: 24px 0; padding: 16px 22px; background: #fff; border-left: 5px solid var(--kun-turkuaz, #00A1AA); box-shadow: 0 2px 12px rgba(0,40,85,.05); font-size: 15px; color: #333; }

/* ══ Detay/şablon sayfaları — body BEYAZ, yalnız hero ("slider") gri ══
   <body class="sem-detay"> ekle. Hero section'ı kendi inline #f8f9fa gri'sini
   korur; içerik/yazı alanı beyaz zeminde durur. ══ */
body.sem-detay { background: #fff !important; }

/* auth/contact textarea */
.sem-auth-field textarea{width:100%;padding:14px 16px;border:1.5px solid #e2e5ea;border-radius:8px;font-size:15px;resize:vertical;min-height:120px;}
.sem-auth-field textarea:focus{border-color:var(--kun-mavi,#0072ce);outline:none;}

/* ── Köşe yumuşatma — iç görseller kartın kendi köşesine kırpılır (çift radius olmasın) ── */
.sem-course-card .rbt-card-img,
.rbt-card .rbt-card-img,
.sem-duyuru-gorsel { border-radius: 0 !important; }

/* ── Anasayfa "Öne Çıkan Eğitimler" — alt alta dizilen kart ızgarası.
   Solda başlık, sağda "Tüm Eğitimler"; satırda 3 kart (eski carousel ile aynı
   kart genişliği ve 28px aralık), tablette 2, mobilde 1. Görsel 3:2 aynen korunur. ── */
#sem-populer-egitimler .sem-featured-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 24px;
}
#sem-populer-egitimler .sem-featured-title .title { margin: 8px 0 0; }
#sem-populer-egitimler .sem-featured-actions { display: flex; align-items: center; gap: 20px; }
#sem-populer-egitimler .sem-featured-all {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 15px; font-weight: 600; color: var(--sem-primary, #002855);
}
#sem-populer-egitimler .sem-featured-all:hover { color: var(--kun-turkuaz, #00A1AA); }
#sem-populer-egitimler .sem-featured-list {
  display: grid; grid-template-columns: 1fr; gap: 16px;
}
@media (min-width: 576px) {
  #sem-populer-egitimler .sem-featured-list { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (min-width: 992px) {
  #sem-populer-egitimler .sem-featured-list { grid-template-columns: repeat(3, 1fr); gap: 28px; }
}
#sem-populer-egitimler .sem-featured-item { display: flex; }
#sem-populer-egitimler .sem-featured-item > .sem-course-card { width: 100%; }
#sem-populer-egitimler .sem-course-card .rbt-card-img { aspect-ratio: 3 / 2; }
#sem-populer-egitimler .sem-course-card .card-body { padding: 22px 22px 6px; }
#sem-populer-egitimler .sem-course-card .card-footer { padding: 14px 22px 20px; }
#sem-populer-egitimler .sem-course-card .rbt-card-title {
  font-size: 20px !important; line-height: 1.4 !important; margin-bottom: 8px;
}
/* 3'lü geniş kart: kısa açıklama 2 satır */
#sem-populer-egitimler .sem-course-card .rbt-card-text { font-size: 15px !important; color: #5b6472; margin-bottom: 12px; }
#sem-populer-egitimler .sem-course-card .rbt-meta li { font-size: 14px; }
#sem-populer-egitimler .sem-course-card .card-footer .fw-bold { font-size: 17px; }
#sem-populer-egitimler .sem-course-card .rbt-card-img img { transition: transform .5s ease; }
#sem-populer-egitimler .sem-course-card:hover .rbt-card-img img { transform: scale(1.04); }
/* durum rozeti görselin sol üst köşesinde (Domestika / Udemy vitrin deseni) */
#sem-populer-egitimler .sem-course-card { position: relative; }
#sem-populer-egitimler .sem-course-card .sem-status-badge {
  position: absolute !important; top: 14px; left: 14px; z-index: 2;
  margin: 0 !important; padding: 5px 12px !important; font-size: 12px !important;
  border-radius: var(--sem-radius) !important; box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
}
#sem-populer-egitimler .sem-course-card .rbt-card-title.mt-2 { margin-top: 0 !important; }
#sem-populer-egitimler .sem-course-card .card-footer .gap-3 { gap: 12px !important; }
@media (max-width: 575px) {
  #sem-populer-egitimler .sem-featured-all { font-size: 14px; }
}

/* ══ Navbar arama — macOS Spotlight tasarımı ═══════════════════════════
   İkona tıklanınca sayfa arkada HAFİFÇE bulanıklaşır (hâlâ seçilebilir), ortada
   Spotlight panel açılır. Katman JS ile <body>'ye taşınır (sticky header transform'u
   fixed'i bozmasın). Sayfa blur'u ::before'da, panelin kendi güçlü blur'u .wrapper'da —
   ikisi kardeş katman, böylece panel arkasındaki sayfayı ayrıca bulanıklaştırabiliyor.
   Aç/kapa: vendor main.js (.active + html.side-nav-opened) + sem-custom.js (ESC / dış tık). */
.rbt-search-dropdown.sem-search-glass {
  --sg-blue: #0a7aff;                         /* macOS seçim mavisi */
  --sg-text: #1d1d1f;
  --sg-muted: rgba(60, 60, 67, .6);
  --sg-hair: rgba(60, 60, 67, .16);
  position: fixed !important; inset: 0; top: 0; left: 0; right: 0;
  z-index: 1060;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 28vh 16px 32px;
  max-height: none !important; overflow-y: auto !important;
  background: transparent !important;
  border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  clip: auto !important; transform: none !important;
  visibility: hidden; opacity: 0;
  transition: opacity .2s ease, visibility 0s linear .2s;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", var(--font-primary, sans-serif);
}
/* sayfa: hafif blur + çok hafif ton — arka plan seçilebilir kalır */
.rbt-search-dropdown.sem-search-glass::before {
  content: ""; position: fixed; inset: 0; z-index: 0;
  background: rgba(20, 30, 45, .10);
  -webkit-backdrop-filter: blur(4px) saturate(120%);
  backdrop-filter: blur(4px) saturate(120%);
}
.rbt-search-dropdown.sem-search-glass.active {
  visibility: visible; opacity: 1;
  transition: opacity .2s ease;
}
html.side-nav-opened, html.side-nav-opened body { overflow: hidden; }

/* Spotlight panel — vibrancy materyali (daha opak, açık gri cam) */
.sem-search-glass .wrapper {
  position: relative; z-index: 1;
  width: 100%; max-width: 680px; margin: 0 !important;
  padding: 0 !important; overflow: hidden;
  background: rgba(242, 242, 245, .82);
  -webkit-backdrop-filter: blur(40px) saturate(180%);
  backdrop-filter: blur(40px) saturate(180%);
  border: .5px solid rgba(255, 255, 255, .55);
  border-radius: 26px;
  box-shadow:
    0 0 0 .5px rgba(0, 0, 0, .12),
    0 24px 64px rgba(0, 0, 0, .28),
    inset 0 .5px 0 rgba(255, 255, 255, .8);
  transform: scale(.985); opacity: .6;
  transition: transform .22s cubic-bezier(.2,.9,.3,1), opacity .18s ease;
}
.sem-search-glass.active .wrapper { transform: none; opacity: 1; }

/* arama çubuğu — tek satır, büyük ve ince yazı, buton yok */
.sem-search-glass .sem-sg-form {
  display: flex !important; align-items: center; gap: 12px;
  margin: 0 !important; padding: 0 18px 0 20px; height: 60px;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
}
.sem-search-glass .sem-sg-icon { font-size: 22px; color: var(--sg-muted); flex: 0 0 auto; }
.sem-search-glass .sem-sg-form input#sem-hdr-q {
  flex: 1 1 auto; min-width: 0; height: 60px !important; line-height: 60px !important;
  margin: 0 !important; padding: 0 !important;
  border: 0 !important; border-radius: 0 !important;
  background: transparent !important; box-shadow: none !important; outline: none !important;
  font-family: inherit; font-size: 23px !important; font-weight: 300; letter-spacing: -.01em;
  color: var(--sg-text); caret-color: var(--sg-blue);
}
.sem-search-glass .sem-sg-form input#sem-hdr-q::placeholder { color: rgba(60, 60, 67, .45); font-weight: 300; }
.sem-search-glass .sem-sg-submit { display: none !important; }   /* Spotlight: Enter ile arar */
.sem-search-glass .sem-sg-esc {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%;
  background: rgba(60, 60, 67, .28); color: #fff; cursor: pointer;
  opacity: 0; pointer-events: none; transition: opacity .15s;
}
.sem-search-glass .sem-sg-esc span { display: none; }
.sem-search-glass .sem-sg-esc i { font-size: 13px; line-height: 1; }
.sem-search-glass .sem-sg-esc:hover { background: rgba(60, 60, 67, .45); }
.sem-search-glass .wrapper.has-query .sem-sg-esc { opacity: 1; pointer-events: auto; }

/* öneriler (boşken) — Spotlight'ın alt satırdaki küçük kısayolları gibi */
.sem-search-glass .sem-search-cats {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  margin: 0; padding: 10px 16px 14px;
  border-top: .5px solid var(--sg-hair);
}
.sem-search-glass .sem-search-cats span {
  width: 100%; margin: 0 4px 2px;
  font-size: 11px; font-weight: 600; color: var(--sg-muted);
}
.sem-search-glass .sem-search-cats a {
  font-size: 13px; font-weight: 500; line-height: 1;
  padding: 7px 12px; border-radius: 999px;
  background: rgba(255, 255, 255, .55); border: .5px solid rgba(0, 0, 0, .08);
  color: var(--sg-text); transition: background .12s, color .12s;
}
.sem-search-glass .sem-search-cats a:hover { background: var(--sg-blue); border-color: var(--sg-blue); color: #fff; }

/* sonuçlar — aynı panelin içinde, ince çizgiyle ayrılır */
.sem-search-glass .sem-sg-results { border-top: .5px solid var(--sg-hair); padding: 6px 8px 8px; }
.sem-search-glass .sem-sg-results-head {
  font-size: 11px; font-weight: 600; color: var(--sg-muted);
  margin: 8px 12px 4px;
}
.sem-search-glass .sem-sg-list {
  list-style: none; margin: 0; padding: 0;
  max-height: min(50vh, 420px); overflow-y: auto; overscroll-behavior: contain;
}
.sem-search-glass .sem-sg-list li { margin: 0; padding: 0; }
.sem-search-glass .sem-sg-row {
  display: flex; align-items: center; gap: 12px;
  padding: 7px 12px; border-radius: 10px; color: var(--sg-text);
}
.sem-search-glass .sem-sg-row:hover { background: rgba(0, 0, 0, .05); }
.sem-search-glass .sem-sg-row.is-active { background: var(--sg-blue); color: #fff; }
.sem-search-glass .sem-sg-row img {
  width: 40px; height: 40px; object-fit: cover; flex: 0 0 auto;
  border-radius: 9px; background: rgba(0, 0, 0, .06);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1);
}
.sem-search-glass .sem-sg-row-text { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.sem-search-glass .sem-sg-row-text strong {
  font-size: 15px; font-weight: 500; line-height: 1.3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sem-search-glass .sem-sg-row-text mark { background: none; color: inherit; font-weight: 700; padding: 0; }
.sem-search-glass .sem-sg-row-text small {
  font-size: 12px; color: var(--sg-muted); margin-top: 1px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sem-search-glass .sem-sg-row.is-active small { color: rgba(255, 255, 255, .8); }
.sem-search-glass .sem-sg-pill {
  flex: 0 0 auto; font-size: 12px; font-weight: 400; color: var(--sg-muted);
  background: none; padding: 0;
}
.sem-search-glass .sem-sg-row.is-active .sem-sg-pill { color: rgba(255, 255, 255, .85); }
.sem-search-glass .sem-sg-row-go { display: none; }
.sem-search-glass .sem-sg-row.is-active .sem-sg-row-go { display: inline; font-size: 16px; color: #fff; }
.sem-search-glass .sem-sg-all {
  display: flex; align-items: center; gap: 12px;
  margin-top: 4px; padding: 9px 12px; border-radius: 10px;
  font-size: 14px; font-weight: 500; color: var(--sg-text);
}
.sem-search-glass .sem-sg-all::before {
  content: "\e9c1"; font-family: "feather" !important; /* feather-search */
  width: 40px; text-align: center; font-size: 18px; color: var(--sg-muted);
}
.sem-search-glass .sem-sg-all i { display: none; }
.sem-search-glass .sem-sg-all:hover { background: rgba(0, 0, 0, .05); }
.sem-search-glass .sem-sg-all.is-active { background: var(--sg-blue); color: #fff; }
.sem-search-glass .sem-sg-all.is-active::before { color: #fff; }
.sem-search-glass .sem-sg-empty {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 22px 12px; text-align: center; color: var(--sg-muted); font-size: 13px;
}
.sem-search-glass .sem-sg-empty i { display: none; }
.sem-search-glass .sem-sg-empty strong { color: var(--sg-text); font-size: 15px; font-weight: 500; }
.sem-search-glass .sem-sg-empty a { color: var(--sg-blue); font-weight: 500; }

@media (max-width: 767px) {
  .rbt-search-dropdown.sem-search-glass { padding-top: 64px; }
  .sem-search-glass .wrapper { border-radius: 22px; }
  .sem-search-glass .sem-sg-form { height: 54px; padding: 0 14px 0 16px; gap: 10px; }
  .sem-search-glass .sem-sg-icon { font-size: 20px; }
  .sem-search-glass .sem-sg-form input#sem-hdr-q { height: 54px !important; line-height: 54px !important; font-size: 19px !important; }
  /* mobilde kapatma her zaman görünür */
  .sem-search-glass .sem-sg-esc { opacity: 1; pointer-events: auto; width: 26px; height: 26px; }
  .sem-search-glass .sem-sg-list { max-height: calc(100vh - 200px); }
  .sem-search-glass .sem-sg-row { padding: 9px 10px; }
  .sem-search-glass .sem-sg-pill { display: none; }
}

/* ══ Sürdürülebilir Kalkınma Amaçları (SKA) — eğitim detay sağ bar ═════
   1–3 amaç → liste (ikon + "Amaç N" + ad); 4+ → ikon ızgarası, ad balonda.
   Sütun sayısı JS'ten (--ska-cols): 4→4, 5→5, 6→3, 7–8→4, 9–17→5.
   İkonlar BM'nin resmi Türkçe SKA ikonları (assets/images/sdg/SDG-N.svg). */
.sem-ska {
  margin-top: 24px; padding-top: 20px;
  border-top: 1px solid rgba(0, 40, 85, .08);
}
.sem-ska-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sem-ska-title {
  margin: 0 !important; font-size: 16px !important; font-weight: 700 !important;
  color: var(--sem-primary, #002855);
}
.sem-ska-info {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%;
  color: rgba(0, 40, 85, .5); font-size: 15px; transition: color .2s, background .2s;
}
.sem-ska-info:hover { color: var(--kun-turkuaz, #00A1AA); background: rgba(0, 161, 170, .08); }
.sem-ska-desc { margin: 4px 0 14px !important; font-size: 13px !important; line-height: 1.5 !important; color: #6b7280; }
.sem-ska-list { list-style: none; margin: 0; padding: 0; }
.sem-ska-item { margin: 0; padding: 0; }
.sem-ska-item a { display: block; position: relative; color: inherit; }
.sem-ska-item img {
  display: block; width: 100%; aspect-ratio: 1 / 1; height: auto;
  border-radius: var(--sem-radius, 2px);
}

/* — Liste düzeni (1–3 amaç): ikon solda, adı sağda — */
.sem-ska[data-layout="list"] .sem-ska-list { display: flex; flex-direction: column; gap: 8px; }
.sem-ska[data-layout="list"] .sem-ska-item a {
  display: flex; align-items: center; gap: 14px;
  padding: 8px; border: 1px solid rgba(0, 40, 85, .08); border-radius: var(--sem-radius, 2px);
  background: #fff; transition: border-color .2s, box-shadow .2s, transform .2s;
}
.sem-ska[data-layout="list"] .sem-ska-item a:hover {
  border-color: rgba(0, 40, 85, .2); box-shadow: 0 4px 14px rgba(0, 40, 85, .08); transform: translateX(2px);
}
.sem-ska[data-layout="list"] .sem-ska-item img { width: 64px; flex: 0 0 64px; }
.sem-ska[data-layout="list"] .sem-ska-text { display: flex; flex-direction: column; min-width: 0; }
.sem-ska[data-layout="list"] .sem-ska-text small {
  font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8a94a3;
}
.sem-ska[data-layout="list"] .sem-ska-text strong {
  font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--sem-primary, #002855);
}
/* tek amaç: biraz daha büyük vitrin */
.sem-ska[data-layout="list"] .sem-ska-list[data-count="1"] .sem-ska-item img { width: 84px; flex-basis: 84px; }
.sem-ska[data-layout="list"] .sem-ska-list[data-count="1"] .sem-ska-text strong { font-size: 17px; }

/* — Izgara düzeni (4+ amaç) — */
.sem-ska[data-layout="grid"] .sem-ska-list {
  display: grid; grid-template-columns: repeat(var(--ska-cols, 4), minmax(0, 1fr)); gap: 6px;
}
.sem-ska[data-layout="grid"] .sem-ska-item img { transition: transform .2s ease, box-shadow .2s ease; }
.sem-ska[data-layout="grid"] .sem-ska-item a:hover img,
.sem-ska[data-layout="grid"] .sem-ska-item a:focus-visible img {
  transform: translateY(-2px) scale(1.04); box-shadow: 0 6px 16px rgba(0, 0, 0, .18);
}
/* ad balonu */
.sem-ska[data-layout="grid"] .sem-ska-text {
  position: absolute; left: 50%; bottom: calc(100% + 8px); z-index: 5;
  width: max-content; max-width: 180px; padding: 7px 10px;
  background: var(--sem-primary, #002855); color: #fff; border-radius: 6px;
  font-size: 12px; line-height: 1.35; text-align: center;
  box-shadow: 0 6px 18px rgba(0, 20, 50, .25);
  opacity: 0; visibility: hidden; transform: translate(-50%, 4px);
  transition: opacity .15s, transform .15s, visibility 0s linear .15s;
  pointer-events: none;
}
.sem-ska[data-layout="grid"] .sem-ska-text::after {
  content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--sem-primary, #002855);
}
.sem-ska[data-layout="grid"] .sem-ska-text small { display: block; font-size: 10px; opacity: .7; letter-spacing: .05em; text-transform: uppercase; }
.sem-ska[data-layout="grid"] .sem-ska-text strong { font-weight: 600; }
.sem-ska[data-layout="grid"] .sem-ska-item a:hover .sem-ska-text,
.sem-ska[data-layout="grid"] .sem-ska-item a:focus-visible .sem-ska-text {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
  transition: opacity .15s, transform .15s;
}
/* kenardaki ikonlarda balon taşmasın (sınıfları JS ekler) */
.sem-ska[data-layout="grid"] .is-col-first .sem-ska-text { left: 0; transform: translate(0, 4px); }
.sem-ska[data-layout="grid"] .is-col-last .sem-ska-text { left: auto; right: 0; transform: translate(0, 4px); }
.sem-ska[data-layout="grid"] .is-col-first a:hover .sem-ska-text,
.sem-ska[data-layout="grid"] .is-col-last a:hover .sem-ska-text { transform: none; }
.sem-ska[data-layout="grid"] .is-col-first .sem-ska-text::after { left: 22px; }
.sem-ska[data-layout="grid"] .is-col-last .sem-ska-text::after { left: auto; right: 12px; transform: none; }

/* ══ SKA sayfası (surdurulebilir-kalkinma-amaclari.html) ═══════════════
   sozlesmeler.html düzeni: gri Page Head + col-lg-8 içerik + çizgili satırlar. */
.sem-ska-page { scroll-margin-top: 100px; }
.sem-ska-intro p { font-size: 16px !important; color: #2f2f2f; line-height: 1.8 !important; margin-bottom: 16px; }
.sem-ska-nav {
  display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 6px;
  margin: 32px 0 24px;
}
.sem-ska-nav a { display: block; transition: transform .2s, box-shadow .2s; }
.sem-ska-nav a:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0, 0, 0, .16); }
.sem-ska-nav img { display: block; width: 100%; aspect-ratio: 1 / 1; border-radius: var(--sem-radius, 2px); }

.sem-ska-goal {
  display: flex; align-items: flex-start; gap: 24px;
  padding: 24px 12px; margin: 0 -12px;
  border-bottom: 1px solid #e8e8e8;
  scroll-margin-top: 110px;            /* sticky header altında kalmasın */
  border-radius: var(--sem-radius, 2px);
  transition: background .6s ease;
}
.sem-ska-goal img { width: 96px; flex: 0 0 96px; aspect-ratio: 1 / 1; border-radius: var(--sem-radius, 2px); }
.sem-ska-goal-no {
  display: block; font-size: 12px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: #8a94a3; margin-bottom: 2px;
}
.sem-ska-goal-title { font-size: 20px !important; font-weight: 700 !important; color: #212121; margin: 0 0 6px !important; line-height: 1.3 !important; }
.sem-ska-goal-body p { font-size: 15px !important; color: #555; margin: 0; line-height: 1.7 !important; }
/* ikondan gelince ilgili amaç kısa süre vurgulanır */
.sem-ska-goal:target { background: rgba(0, 161, 170, .08); animation: semSkaFlash 2.4s ease forwards; }
@keyframes semSkaFlash {
  0%, 60% { background: rgba(0, 161, 170, .12); }
  100% { background: rgba(0, 161, 170, .04); }
}

/* SKA sayfası — amaca bağlı eğitimlerimiz (admin'de eğitime atanan amaçlardan) */
.sem-ska-goal-trainings { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; }
.sem-ska-goal-trainings span {
  width: 100%; font-size: 11px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: #8a94a3;
}
.sem-ska-goal-trainings a {
  font-size: 13px; font-weight: 500; line-height: 1.3; padding: 6px 12px;
  border: 1px solid rgba(0, 40, 85, .14); border-radius: var(--sem-radius, 2px);
  color: var(--sem-primary, #002855); background: #fff; transition: border-color .2s, color .2s;
}
.sem-ska-goal-trainings a:hover { border-color: var(--kun-turkuaz, #00A1AA); color: var(--kun-turkuaz, #00A1AA); }

.sem-ska-cta { margin-top: 48px; }
.sem-ska-cta p { font-size: 15px !important; color: #6c757d; margin-bottom: 16px; }
.sem-ska-cta-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.sem-ska-cta-main, .sem-ska-cta-alt {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px; font-size: 15px; font-weight: 600; text-decoration: none;
  border-radius: var(--sem-radius, 2px); transition: background .2s, color .2s, border-color .2s;
}
.sem-ska-cta-main { background: #212121; color: #fff; }
.sem-ska-cta-main:hover { background: var(--kun-turkuaz, #00A1AA); color: #fff; }
.sem-ska-cta-alt { border: 1px solid #d4d4d4; color: #212121; }
.sem-ska-cta-alt:hover { border-color: #212121; color: #212121; }

@media (max-width: 767px) {
  .sem-ska-nav { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .sem-ska-goal { gap: 16px; padding: 20px 8px; margin: 0 -8px; }
  .sem-ska-goal img { width: 72px; flex-basis: 72px; }
  .sem-ska-goal-title { font-size: 18px !important; }
}

/* ── Profil: salt okunur e-posta / telefon / TC alanları + "Değiştir" butonu.
   Tema input[disabled]'ı gizlediğinden (styles.css) bu alanlar readonly'dir. ── */
.sem-profil-readonly { position: relative; }
.sem-auth-field .sem-profil-readonly input[readonly] { background: #f3f4f6; color: #475569; cursor: default; }
.sem-auth-field .sem-profil-readonly input[readonly]:focus { border-color: #e2e5ea; box-shadow: none; }
.sem-auth-field .sem-profil-readonly input { padding-right: 96px; text-overflow: ellipsis; }
.sem-profil-degistir {
  position: absolute; top: 50%; right: 8px; transform: translateY(-50%);
  padding: 6px 12px; border: 1px solid var(--kun-mavi, #0072ce); border-radius: 6px;
  background: #fff; color: var(--kun-mavi, #0072ce); font-size: 13px; font-weight: 600; line-height: 1.4;
}
.sem-profil-degistir:hover { background: var(--kun-mavi, #0072ce); color: #fff; }
#iletisimModal .modal-title { font-size: 18px; font-weight: 700; }

/* ── Eğitim kartı: durum + tarih rozetleri yan yana ──
   Backend: <time datetime="YYYY-MM-DD"> içine eğitimin (en yakın grubun) başlangıç tarihini basar. */
.sem-card-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 8px;
  margin-bottom: 10px;
}
/* durum ve tarih rozeti aynı ölçüde: aynı yükseklik, iç boşluk, yazı */
.sem-card-badges .sem-status-badge,
.sem-date-badge {
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  border-radius: var(--sem-radius) !important;
}
.sem-course-card .sem-card-badges .sem-status-badge { align-self: auto; }
.sem-date-badge {
  gap: 6px;
  border: 0;
  background: var(--kun-mavi, #0072ce);
  color: #fff;
  white-space: nowrap;
}
.sem-date-badge i { font-size: 13px; line-height: 1; }

/* Anasayfa vitrini: durum görselin sol üstünde, tarih sağ üstünde (simetrik) */
#sem-populer-egitimler .sem-course-card .sem-card-badges { margin: 0; }
#sem-populer-egitimler .sem-course-card .sem-date-badge {
  position: absolute; top: 14px; right: 14px; z-index: 2;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
}
@media (max-width: 576px) {
  .sem-card-badges .sem-status-badge,
  .sem-date-badge { font-size: 13px !important; }
}

/* ── Kurs detay — Eğitim Takvimi: solda aylık takvim, sağda grup detayları ── */
.sem-takvim {
  display: grid;
  grid-template-columns: minmax(260px, 320px) 1fr;
  gap: 28px;
  margin-top: 20px;
  align-items: start;
}
.sem-takvim-cal {
  background: #fff;
  border: 1px solid rgba(0, 40, 85, .10);
  border-radius: 12px;
  padding: 18px 16px 14px;
  color: var(--sem-text);
}
.sem-takvim:not(.is-hazir) .sem-takvim-cal { display: none; }
.sem-takvim:not(.is-hazir) { grid-template-columns: 1fr; }

.sem-cal-ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.sem-cal-ay {
  font-size: 17px;
  font-weight: 600;
  color: var(--sem-primary);
  letter-spacing: .2px;
}
.sem-cal-ay small { font-size: 14px; font-weight: 400; color: #64748b; margin-left: 2px; }
.sem-cal-ok {
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(0, 40, 85, .12);
  border-radius: 50%;
  background: #fff;
  color: var(--sem-primary);
  font-size: 15px;
  padding: 0;
  transition: background-color .2s ease, color .2s ease;
}
.sem-cal-ok:hover { background: var(--sem-primary); color: #fff; }

.sem-cal-izgara {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  row-gap: 4px;
}
.sem-cal-hg {
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: #94a3b8;
  padding-bottom: 6px;
}
.sem-cal-gun {
  position: relative;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #334155;
}
.sem-cal-gun > span {
  position: relative;
  z-index: 1;
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
}
/* eğitim aralığı: ince lacivert şerit, başlangıç/bitiş dolu daire */
.sem-cal-gun.is-egitim::before {
  content: "";
  position: absolute;
  top: 2px; bottom: 2px; left: 0; right: 0;
  background: rgba(0, 40, 85, .08);
}
.sem-cal-gun.is-bas::before,
.sem-cal-gun.is-hafta-bas::before { left: 50%; margin-left: -16px; border-radius: 16px 0 0 16px; }
.sem-cal-gun.is-bit::before,
.sem-cal-gun.is-hafta-son::before { right: 50%; margin-right: -16px; border-radius: 0 16px 16px 0; }
.sem-cal-gun.is-bas.is-bit::before,
.sem-cal-gun.is-bas.is-hafta-son::before,
.sem-cal-gun.is-hafta-bas.is-bit::before { border-radius: 16px; }
.sem-cal-gun.is-egitim > span { color: var(--sem-primary); font-weight: 600; }
.sem-cal-gun.is-bas > span,
.sem-cal-gun.is-bit > span {
  background: var(--sem-primary);
  color: #fff;
  box-shadow: 0 3px 10px rgba(0, 40, 85, .25);
}
/* son kayıt günü: altında küçük kırmızı nokta */
.sem-cal-gun.is-kayit > span { box-shadow: inset 0 0 0 1px rgba(203, 51, 59, .45); color: var(--sem-accent); font-weight: 600; }
.sem-cal-gun.is-kayit::after {
  content: "";
  position: absolute;
  bottom: 1px; left: 50%;
  width: 4px; height: 4px; margin-left: -2px;
  border-radius: 50%;
  background: var(--sem-accent);
}
.sem-cal-gun.is-bugun > span { text-decoration: underline; text-underline-offset: 3px; }

.sem-cal-lejant {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(0, 40, 85, .08);
  font-size: 12px;
  color: #64748b;
}
.sem-cal-lejant span { display: inline-flex; align-items: center; gap: 6px; }
.sem-cal-lejant i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; }
.sem-lej-egitim { background: var(--sem-primary); }
.sem-cal-lejant .sem-cal-saat { margin-left: auto; color: var(--sem-primary); font-weight: 600; }
.sem-cal-lejant .sem-cal-saat i { width: auto; height: auto; border-radius: 0; font-size: 12px; }
.sem-takvim-saat {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 8px; padding: 2px 8px;
  border-radius: 20px;
  background: rgba(0, 40, 85, .06);
  font-size: 13px; font-weight: 500; color: #475569;
}
.sem-takvim-saat i { font-size: 12px; }
.sem-lej-kayit { background: var(--sem-accent); }

/* grup listesi */
.sem-takvim-gruplar {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sem-takvim-grup {
  margin: 0;
  border: 1px solid rgba(0, 40, 85, .10);
  border-radius: 12px;
  background: #fff;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.sem-takvim-grup.is-aktif {
  border-color: rgba(0, 40, 85, .35);
  box-shadow: 0 6px 20px rgba(0, 40, 85, .08);
}
.sem-takvim-grup-btn {
  width: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding: 14px 18px;
  background: none;
  border: 0;
  text-align: left;
  color: var(--sem-text);
  font-size: 15px;
  cursor: pointer;
}
.sem-takvim-grup-aralik { color: var(--sem-primary); font-weight: 600; flex: 1; }
.sem-takvim-detay {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 24px;
  margin: 0;
  padding: 4px 18px 18px;
}
.sem-takvim.is-hazir .sem-takvim-grup:not(.is-aktif) .sem-takvim-detay { display: none; }
.sem-takvim-detay > div { margin: 0; }
.sem-takvim-detay dt {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: #94a3b8;
  margin-bottom: 2px;
}
.sem-takvim-detay dd { margin: 0; font-size: 15px; color: var(--sem-text); }

@media (max-width: 991px) {
  .sem-takvim { grid-template-columns: 1fr; }
  .sem-takvim-cal { max-width: 360px; width: 100%; margin: 0 auto; }
}
@media (max-width: 480px) {
  .sem-takvim-detay { grid-template-columns: 1fr; gap: 10px; }
}