/* ========================================================
   Belge Detay — sayfaya özel stiller
   NOT: .page-title ve breadcrumb → sayfa.css yönetir
   ======================================================== */

:root{
  --bd-primary: var(--bhz-primary, #2563eb);
  --bd-text: var(--bhz-text, #0f172a);
  --bd-muted: #64748b;
  --bd-soft: #f8fafc;
  --bd-border: #e5e7eb;
  --bd-shadow: 0 10px 30px rgba(2, 12, 27, .06);
  --bd-shadow-lg: 0 18px 50px rgba(2, 12, 27, .12);
}
@media (prefers-color-scheme: dark){
  :root{
    --bd-text:#e5e7eb; --bd-muted:#9ca3af; --bd-soft:#111827; --bd-border:#374151;
    --bd-shadow:0 10px 30px rgba(0,0,0,.35); --bd-shadow-lg:0 18px 50px rgba(0,0,0,.45);
  }
}

.bd-wrapper{}
@media (min-width: 992px){ .bd-aside{ position: sticky; top: 24px; } }

/* --- Card --- */
.bd-card{
  background:#fff; border:1px solid var(--bd-border); border-radius:16px;
  box-shadow:var(--bd-shadow); padding:16px; margin-bottom:16px; overflow:hidden;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.bd-card:hover{ border-color: color-mix(in oklab, var(--bd-primary) 30%, var(--bd-border)); box-shadow:var(--bd-shadow-lg); transform: translateY(-2px); }

.bd-card__header{
  display:flex; align-items:center; justify-content:space-between;
  margin:-16px -16px 12px; padding:14px 16px;
  border-bottom:1px solid var(--bd-border);
  background:linear-gradient(180deg, color-mix(in oklab, var(--bd-primary) 10%, #fff), #fff);
}
.bd-card__title{ font-size:15px; font-weight:900; margin:0; color:var(--bd-text); display:flex; gap:10px; align-items:center; }
.bd-card__title i{ font-size:18px; color:var(--bd-primary); }
.bd-card__subtitle{ margin:6px 0 0; font-size:12px; color:var(--bd-muted); font-weight:700; }
.bd-card__tools{ display:flex; gap:8px; align-items:center; }
.bd-card__section{ padding-top:6px; }
.bd-card__section + .bd-card__section{ border-top:1px dashed var(--bd-border); margin-top:10px; padding-top:12px; }
.bd-card__footer{ border-top:1px dashed var(--bd-border); margin-top:12px; padding-top:12px; }

/* --- Chip --- */
.bd-chip{
  display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:800;
  background:#f9fafb; border:1px solid var(--bd-border); color:#1f2937; padding:6px 10px; border-radius:999px;
}
.bd-chip i{ font-size:14px; }
.bd-chip--star{ background:#fff7e6; color:#92400e; border-color:#fbd38d; }
.bd-chip--ok{ background:#ecfdf5; color:#065f46; border-color:#a7f3d0; }
.bd-chip--warn{ background:#fffbeb; color:#92400e; border-color:#fde68a; }
.bd-chip--muted{ background:#f3f4f6; color:#374151; }

/* --- Preview --- */
.bd-preview{ overflow:hidden; }
.bd-preview__frame{
  border:2px dashed color-mix(in oklab, var(--bd-primary) 35%, #dbeafe); border-radius:12px;
  min-height:360px; padding:12px;
  background:
    radial-gradient(1100px 500px at -15% -10%, color-mix(in oklab, var(--bd-primary) 7%, transparent), transparent 55%),
    linear-gradient(180deg, #fafafa, #fff);
}
@media (prefers-color-scheme: dark){
  .bd-preview__frame{
    background:
      radial-gradient(1100px 500px at -15% -10%, color-mix(in oklab, var(--bd-primary) 12%, transparent), transparent 55%),
      linear-gradient(180deg, #0b1220, #0f172a);
    border-color: color-mix(in oklab, var(--bd-primary) 30%, #1f2937);
  }
}
.bd-preview-cover{ border:1px dashed var(--bd-border); border-radius:12px; padding:6px; margin-bottom:12px; background:#f8fafc; }
.bd-preview-cover img{ width:100%; height:auto; display:block; border-radius:8px; }

/* --- Lists & links --- */
.bd-list{ list-style:none; margin:0; padding:0; }
.bd-list li{ display:flex; gap:10px; align-items:center; padding:9px 0; border-bottom:1px dotted var(--bd-border); color:#334155; font-size:14px; }
.bd-list li:last-child{ border-bottom:0; }
.bd-list i{ width:18px; text-align:center; color:#64748b; }

.bd-link-list{ list-style:none; margin:0; padding:0; }
.bd-link-list li{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px dotted var(--bd-border); }
.bd-link-list li:last-child{ border-bottom:0; }
.bd-minitext{ font-size:12px; color:var(--bd-muted); }

/* --- KV (kaldıysa küçük alanlar için) --- */
.bd-kv{ display:grid; grid-template-columns:1fr auto; gap:8px 12px; }
.bd-kv__k{ color:var(--bd-muted); font-size:13px; }
.bd-kv__v{ color:var(--bd-text); font-weight:800; font-size:13px; }

/* --- Fields (two columns) --- */
.bd-required-hint{
  background:#eef2ff; color:#3730a3; border:1px solid #c7d2fe; border-radius:12px;
  font-weight:700; padding:10px 12px; display:flex; gap:8px; align-items:center; margin-top:8px;
}
.bd-required-hint i{ font-size:16px; }

.bd-field-list{ list-style:none; margin:0; padding:0; }

/* Grid: mobil 1, md 2 sütun */
.bd-field-list--grid{ display:grid; grid-template-columns:1fr; gap:12px; margin-top:10px; }
@media (min-width: 768px){
  .bd-field-list--grid{ grid-template-columns:1fr 1fr; }
}
/* Tile */
.bd-field-list--grid li{
  border:1px dashed var(--bd-border); border-radius:12px; padding:12px;
  display:flex; gap:10px; align-items:flex-start; background:#f8fafc;
}
@media (prefers-color-scheme: dark){
  .bd-field-list--grid li{ background:#0f172a; }
}
.bd-field-icon{
  width:28px; height:28px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center;
  background:#eef2ff; color:#3730a3; flex:0 0 28px;
}
.bd-field-icon i{ font-size:14px; line-height:1; }
.bd-field{ display:flex; flex-direction:column; gap:2px; }
.bd-field__name{ font-weight:900; color:#111827; font-size:14px; }
.bd-field__type{ font-size:12px; color:#6b7280; }

/* Type tones */
.bd-field-icon[data-t="text"]     { background:#eff6ff; color:#1d4ed8; }
.bd-field-icon[data-t="textarea"] { background:#f5f3ff; color:#6d28d9; }
.bd-field-icon[data-t="select"]   { background:#ecfeff; color:#155e75; }
.bd-field-icon[data-t="radio"]    { background:#fdf2f8; color:#9d174d; }
.bd-field-icon[data-t="checkbox"] { background:#f0fdf4; color:#166534; }
.bd-field-icon[data-t="date"]     { background:#fef3c7; color:#92400e; }
.bd-field-icon[data-t="number"]   { background:#f3f4f6; color:#374151; }
.bd-field-icon[data-t="email"]    { background:#eef2ff; color:#3730a3; }
.bd-field-icon[data-t="tel"]      { background:#ecfeff; color:#0e7490; }
.bd-field-icon[data-t="range"]    { background:#fff7ed; color:#9a3412; }
.bd-field-icon[data-t="image"]    { background:#f0f9ff; color:#0369a1; }
.bd-field-icon[data-t="color"]    { background:#fdf4ff; color:#7e22ce; }

/* --- Tags --- */
.bd-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.bd-tag{
  display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px;
  background:#eef2ff; color:#3730a3; border:1px solid #c7d2fe; font-weight:800; font-size:12px;
}
.bd-tag i{ font-size:14px; }

/* --- Page orientation icons (CSS çizim) --- */
.bd-pageicons{ display:flex; gap:8px; align-items:center; }
.bd-pageicon{
  display:inline-block; border:2px solid currentColor; color:#334155;
  border-radius:3px; position:relative; background:transparent; opacity:.95;
}
.bd-pageicon.-portrait{ width:14px; height:18px; }
.bd-pageicon.-landscape{ width:18px; height:14px; }
.bd-pageicon::after{
  content:""; position:absolute; left:3px; right:3px; top:3px; height:2px;
  background: currentColor; border-radius:1px; opacity:.45; /* başlık çizgisi */
}

/* --- Note & Actions --- */
.bd-note{ background:#fff1f2; color:#9f1239; border:1px solid #ffe4e6; border-radius:12px; font-size:13px; padding:10px 12px; margin-top:10px; display:flex; gap:8px; align-items:center; }
.bd-note i{ font-size:16px; }
.bd-actions{ display:flex; flex-wrap:wrap; gap:10px; }
.bd-actions .btn{ height:44px; border-radius:12px; font-weight:900; display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.bd-locked{ display:flex; gap:10px; align-items:flex-start; background:#fff7ed; color:#9a3412; border:1px solid #ffedd5; border-radius:12px; padding:10px 12px; }

/* --- Dark tweaks --- */
@media (prefers-color-scheme: dark){
  .bd-card{ background:#1f2937; border-color:#374151; box-shadow:none; }
  .bd-card__header{ background:linear-gradient(180deg, #111827, #1f2937); }
  .bd-card__title{ color:#e5e7eb; }
  .bd-chip{ background:#111827; color:#e5e7eb; border-color:#2b3542; }
  .bd-list li{ border-bottom-color:#374151; color:#cbd5e1; }
  .bd-list i{ color:#9ca3af; }
  .bd-field__name{ color:#e5e7eb; }
  .bd-field__type{ color:#9ca3af; }
  .bd-tag{ background:#1e293b; border-color:#334155; color:#bfdbfe; }
  .bd-note{ background:#3f1d2b; border-color:#4a2030; color:#fecdd3; }
  .bd-locked{ background:#3b2a16; border-color:#6b3e19; color:#fde68a; }
}

/* --- Mobile --- */
@media (max-width:575.98px){
  .bd-card{ border-radius:14px; padding:14px; }
  .bd-card__header{ padding:12px 14px; }
  .bd-actions .btn{ height:42px; border-radius:10px; }
}


/* ============= İlgili Belgeler (alt alta, kartlı) ============= */
.bd-related-list{
  list-style:none; margin:0; padding:0;
  display:grid; gap:10px;
}
.bd-related-item{
  border:1px dashed var(--bd-border);
  border-radius:12px;
  padding:10px 12px;
  background:#f8fafc;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.bd-related-item:hover{
  transform: translateY(-1px);
  box-shadow: var(--bd-shadow);
  border-color: color-mix(in oklab, var(--bd-primary) 28%, var(--bd-border));
}
.bd-related-title a{
  display:inline-flex; align-items:center; gap:8px;
  font-weight:900; color:var(--bd-text);
  text-decoration:none;
}
.bd-related-title a:hover{ text-decoration:underline; }
.bd-related-cat{
  margin-top:4px;
  font-size:12px; color:var(--bd-muted);
  display:flex; align-items:center; gap:6px;
}

@media (prefers-color-scheme: dark){
  .bd-related-item{ background:#0f172a; border-color:#253043; }
  .bd-related-item:hover{ border-color: color-mix(in oklab, var(--bd-primary) 32%, #253043); }
  .bd-related-title a{ color:#e5e7eb; }
  .bd-related-cat{ color:#9ca3af; }
}


/* Etiket/anahtar kelime chipleri (link) */
.bd-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.bd-tag{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:999px;
  background:#f3f4f6; border:1px solid rgba(0,0,0,.05);
  font-size:12px; font-weight:800; color:#1f2937; text-decoration:none;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.bd-tag i{ font-size:14px; }
.bd-tag:hover{ transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,0,0,.08); background:#eef2f7; }

@media (prefers-color-scheme: dark){
  .bd-tag{ background:#374151; border-color:#4b5563; color:#e5e7eb; }
  .bd-tag:hover{ background:#4b5563; box-shadow:none; }
}