/* ============================================================================
   templates/astra.css — Astra template'in layout kuralları.

   Tek-sütun, table-based item rows (başlık sol, tarih sağ), flex-wrap
   contact row. Yeni bir template eklenince (örn. "titan" 2 kolon sidebar'lı)
   sadece yeni bir templates/<name>.css dosyası oluşturup cv/<name>.php'de
   yüklenmesi yeterli; cv-base.css ve style.css'e dokunulmaz.
   ============================================================================ */

/* === A4 Page Frame === */
/* Dış wrapper — birden fazla A4 sayfa kartını 8mm gap ile sıralar.
   mPDF render tarafında bu div'in boyutu önemsiz (mPDF flow yapıyor);
   browser preview'da `style.css`'in `.builder-preview` seçicisi genişlik
   ve flex davranışını sağlıyor. */
.cvlystpreview-pages {
  display: flex;
  flex-direction: column;
  gap: 8mm;
}
.cvlystpreview-page, .astra-page {
  width: 210mm;
  background: #FFFFFF;
  color: #0F172A;
  box-sizing: border-box;
  font-family: "Inter", sans-serif;
  font-size: 12.5px;
  line-height: 1.45;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  /* Bu div için min-height/height KASITLI olarak yok. mPDF burada
     doğal pagination yapar: içerik A4'ten uzunsa yeni sayfaya akar,
     kısaysa tek sayfada kalır. min-height koymak mPDF'i "div = 297mm
     yüksekliğinde" sanısına düşürüp 2. sayfada sadece alt padding
     boşluğuyla ekstra sayfa üretmesine yol açıyor (gözlemlendi).
     Browser tarafında görsel A4 karton hissi `style.css`'in
     `.builder-preview .cvlystpreview-page` seçicisi tarafından
     `min-height: 297mm` ile sağlanıyor. */
}

/* === Header (photo + name/position/contact) === */
/* mPDF'in flexbox desteği sınırlı — flex container'ı normal block gibi
   render edip fotoğrafı ismin üstüne atıyordu. <div>+display:table de
   mPDF'te güvenilir değil. Gerçek <table>/<tr>/<td> HTML'i hem browser
   hem mPDF native olarak doğru render eder. CSS bu yüzden gerçek table
   elementleri hedefliyor. */
.cvlystpreview-header {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
.cvlystpreview-header-text {
  vertical-align: top;
  /* Tablo layout: fotoğraf hücresi (26mm) + boş hücre (10mm gap) + metin
     hücresi. Tüm boyutlar HTML attribute'leriyle — CSS yerine HTML
     kullanmak mPDF'in mm cinsinden width'i güvenilir parse etmesini sağlıyor. */
}
.cvlystpreview-photo-wrap {
  vertical-align: top;
  /* Genişlik, yükseklik ve diğer layout özellikleri tamamen HTML
     attribute'leriyle (width="NNmm" height="NNmm") veriliyor. CSS
     sadece object-fit, border-radius gibi tarayıcı-özel efektler
     için kullanılıyor (cv-base.css). */
}

/* === Contact Row === */
.cvlystpreview-contact-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  align-items: center;
  color: #334155;
  font-size: 12.5px;
  font-family: var(--font-cv-body, var(--font-inter));
}
.cvlystpreview-contact { display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-cv-body, var(--font-inter)); }
.cvlystpreview-contact a, .cvlystpreview-contact span { font-family: inherit; }

/* === Divider === */
.cvlystpreview-divider {
  height: 2px;
  border-radius: 2px;
  margin: 7mm 0 5mm;
}

.cvlystpreview-summary {
  margin-bottom: 0mm;
}

/* === Section === */
.cvlystpreview-section { margin: 0 0 1mm; }
.cvlystpreview-section-line {
  height: 1.5px;
  border-radius: 2px;
  margin: 0 0 4.5mm;
  opacity: 0.85;
  max-width: 100%;
}

/* === Item (deneyim/egitim/proje/sertifika) === */
.cvlystpreview-item { margin: 0 0 1mm; page-break-inside: avoid; }
.cvlystpreview-item-row {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 2px;
}
.cvlystpreview-item-title-cell {
  display: table-cell;
  width: 65%;
  text-align: left;
  vertical-align: baseline;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
}
.cvlystpreview-item-dates-cell {
  display: table-cell;
  width: 35%;
  text-align: right;
  vertical-align: baseline;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 4mm;
  box-sizing: border-box;
}

/* === Skills === */
/* CSS-only natural wrap: container block, chip'ler inline-block.
   JS/PHP'te satır hesabı YOK — sığmayan chip tarayıcının default flow'u
   ile otomatik alt satıra düşer. Direkt-child selector: titan.php
   `<table><tr><td>` yapısı için titan.css'in `.cvlystpreview-chip` kuralı
   geçerli kalır (td burada direkt-child değil), bu kural yalnız
   astra.php'nin `<div><span>` yapısını hedefler. */


.cvlystpreview-skills {
    line-height: 1.3;
}

.cvlystpreview-chip {
    display: inline-block;

    font-size: 12.5px;
    font-weight: 500;
    color: #0F172A;

    line-height: 1.3;
    /* max-content: chip, içeriği tek satıra sığdıracak kadar genişler
       (örn. "Reactqwewq eqwewqwqweqwq" gibi çoklu kelime grupları).
       mPDF bu değeri setCSS WIDTH=max-content olarak tanır ve ön-tarama
       ile ölçer. */
    width: max-content;

    padding: 1mm 3mm;
    margin-right: 1.5mm;
    margin-bottom: 1.5mm;

    border-radius: 3mm;

    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;

}