body.belge-tools-page {
  font-family: "Manrope", "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
}

.belge-tools-page *,
.belge-tools-page *::before,
.belge-tools-page *::after { box-sizing: border-box; }

.belge-tools-page .page-shell {
  width: min(var(--container), calc(100% - 28px));
  margin: 0 auto;
  padding-bottom: 50px;
}

:root {
  --cat-merge: #22d3ee;
  --cat-split: #a78bfa;
  --cat-convert: #34d399;
  --cat-edit: #f43f5e;
}

.dt-breadcrumb {
  margin: 2px 0 10px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--panel) 88%, transparent);
}

.dt-breadcrumb a {
  color: var(--muted);
  text-decoration: none;
  font-weight: 700;
}

.tools-hero,
.tool-filter-bar,
.dt-section {
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: var(--shadow);
  margin-top: 14px;
}

.tools-hero {
  padding: 24px;
  background:
    radial-gradient(circle at 10% 0%, rgba(34, 211, 238, 0.17), transparent 36%),
    radial-gradient(circle at 88% 100%, rgba(167, 139, 250, 0.2), transparent 36%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(30, 64, 175, 0.78));
}

.tools-chip {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.34);
  background: rgba(255,255,255,0.1);
  color: #e2e8f0;
  font-size: 0.78rem;
  font-weight: 800;
}

.tools-hero h1 {
  margin: 8px 0 6px;
  font-size: clamp(1.9rem, 4vw, 2.65rem);
  color: #f8fbff;
}

.tools-hero p { margin: 0; color: #dbeafe; }

.tools-hero-grid {
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.hero-stat {
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 13px;
  padding: 10px 12px;
  background: rgba(15, 23, 42, 0.45);
}

.hero-stat strong { display: block; font-size: 1.35rem; color: #f8fafc; }
.hero-stat span { color: #cbd5e1; font-weight: 700; font-size: 0.85rem; }

.tool-filter-bar {
  padding: 16px;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  display: grid;
  gap: 11px;
}

.tool-search-label { font-weight: 700; color: var(--muted); }

.tool-search {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 11px 12px;
  background: color-mix(in srgb, var(--panel-2) 86%, transparent);
  color: var(--text);
}

.tool-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tool-chip-btn {
  border: 1px solid var(--border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--panel-2) 92%, transparent);
  color: var(--text);
  padding: 7px 12px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.tool-chip-btn.is-active {
  border-color: color-mix(in srgb, var(--accent) 66%, #fff 34%);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent);
}

.tool-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-weight: 700;
}

.dt-section {
  padding: 20px;
  background: color-mix(in srgb, var(--panel) 91%, transparent);
}

.dt-section--landing {
  margin-top: 18px;
}

.dt-section-head h2 { margin: 0 0 6px; font-size: 1.42rem; }
#selectedCategoryText { margin: 0; color: var(--muted); font-weight: 600; }

.dt-card-grid {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.tool-category-card {
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 15px;
  padding: 14px;
  background: color-mix(in srgb, var(--panel-2) 88%, transparent);
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.tool-category-card[data-category="birlestiriciler"] { --cat: var(--cat-merge); }
.tool-category-card[data-category="ayiricilar"] { --cat: var(--cat-split); }
.tool-category-card[data-category="donusturuculer"] { --cat: var(--cat-convert); }
.tool-category-card[data-category="dosya-duzenleme"] { --cat: var(--cat-edit); }

.tool-category-card:hover,
.tool-category-card.is-active {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--cat) 65%, var(--border));
  box-shadow: 0 8px 24px color-mix(in srgb, var(--cat) 16%, transparent);
}

.tool-category-icon { font-size: 1.2rem; margin-right: 6px; }
.tool-category-icon-svg {
  display: inline-flex;
  width: 23px;
  height: 23px;
  vertical-align: -5px;
}
.tool-category-icon-svg svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.tool-category-card h3 { margin: 0; display: inline; color: var(--text); font-size: 1rem; }

.tool-grid {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.tool-card {
  display: flex;
  flex-direction: column;
  min-height: 220px;
  text-decoration: none;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 14px;
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  overflow: hidden;
  position: relative;
  isolation: isolate;
}

[hidden],
.is-hidden,
.tool-limits-card[hidden],
.tool-limits-card.is-hidden {
  display: none !important;
}

.tool-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  border-radius: inherit;
  opacity: 0.95;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.06), rgba(255,255,255,0.01) 50%, rgba(15,23,42,0.25)),
    repeating-linear-gradient(135deg, rgba(255,255,255,0.06) 0 2px, transparent 2px 10px);
}

.tool-card::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  z-index: -1;
  opacity: 0.18;
  transition: opacity .18s ease;
}

.tool-card.is-active:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--accent) 60%, var(--border));
  box-shadow: 0 10px 26px color-mix(in srgb, var(--accent) 14%, transparent);
}

.tool-card.is-active:hover::after {
  opacity: 0.34;
}

.tool-card.is-active:hover .tool-card-icon {
  transform: scale(1.04);
}

.tool-card.is-soon { opacity: .84; }

.tool-card--pdf {
  border-color: rgba(239,68,68,.35);
}

.tool-card--pdf::before {
  background:
    linear-gradient(160deg, rgba(239,68,68,.22), rgba(239,68,68,.02) 55%, rgba(15,23,42,.32)),
    radial-gradient(circle at 84% 14%, rgba(252,165,165,.22), transparent 32%),
    repeating-linear-gradient(145deg, rgba(248,113,113,.12) 0 2px, transparent 2px 10px);
}

.tool-card--pdf::after {
  box-shadow: 0 0 0 1px rgba(239,68,68,.22), 0 24px 48px rgba(239,68,68,.16);
}

.tool-card--word {
  border-color: rgba(59,130,246,.35);
}

.tool-card--word::before {
  background:
    linear-gradient(160deg, rgba(37,99,235,.24), rgba(37,99,235,.02) 56%, rgba(15,23,42,.34)),
    radial-gradient(circle at 82% 16%, rgba(147,197,253,.22), transparent 35%),
    repeating-linear-gradient(135deg, rgba(96,165,250,.12) 0 2px, transparent 2px 10px);
}

.tool-card--word::after {
  box-shadow: 0 0 0 1px rgba(59,130,246,.24), 0 24px 48px rgba(59,130,246,.16);
}

.tool-card--excel {
  border-color: rgba(16,185,129,.35);
}

.tool-card--excel::before {
  background:
    linear-gradient(160deg, rgba(16,185,129,.24), rgba(16,185,129,.02) 56%, rgba(15,23,42,.34)),
    radial-gradient(circle at 82% 16%, rgba(110,231,183,.22), transparent 35%),
    repeating-linear-gradient(145deg, rgba(52,211,153,.11) 0 2px, transparent 2px 10px);
}

.tool-card--excel::after {
  box-shadow: 0 0 0 1px rgba(16,185,129,.24), 0 24px 48px rgba(16,185,129,.16);
}

.tool-card--image {
  border-color: rgba(20,184,166,.34);
}

.tool-card--image::before {
  background:
    linear-gradient(160deg, rgba(20,184,166,.24), rgba(20,184,166,.02) 56%, rgba(15,23,42,.34)),
    radial-gradient(circle at 82% 16%, rgba(125,211,252,.2), transparent 35%),
    repeating-linear-gradient(150deg, rgba(45,212,191,.11) 0 2px, transparent 2px 10px);
}

.tool-card--image::after {
  box-shadow: 0 0 0 1px rgba(20,184,166,.24), 0 24px 48px rgba(20,184,166,.16);
}

.tool-card--text {
  border-color: rgba(148,163,184,.35);
}

.tool-card--text::before {
  background:
    linear-gradient(160deg, rgba(148,163,184,.22), rgba(148,163,184,.02) 56%, rgba(15,23,42,.34)),
    radial-gradient(circle at 82% 16%, rgba(203,213,225,.2), transparent 35%),
    repeating-linear-gradient(145deg, rgba(203,213,225,.09) 0 2px, transparent 2px 10px);
}

.tool-card--text::after {
  box-shadow: 0 0 0 1px rgba(148,163,184,.24), 0 24px 48px rgba(148,163,184,.16);
}

.tool-card--pptx {
  border-color: rgba(249,115,22,.35);
}

.tool-card--pptx::before {
  background:
    linear-gradient(160deg, rgba(249,115,22,.24), rgba(249,115,22,.02) 56%, rgba(15,23,42,.34)),
    radial-gradient(circle at 82% 16%, rgba(251,191,36,.2), transparent 35%),
    repeating-linear-gradient(145deg, rgba(251,146,60,.11) 0 2px, transparent 2px 10px);
}

.tool-card--pptx::after {
  box-shadow: 0 0 0 1px rgba(249,115,22,.24), 0 24px 48px rgba(249,115,22,.16);
}

.tool-status {
  position: absolute;
  top: 14px;
  right: 14px;
  font-size: .69rem;
  font-weight: 800;
  border-radius: 999px;
  padding: 3px 8px;
  border: 1px solid transparent;
  white-space: nowrap;
}

.tool-status.active {
  color: #d1fae5;
  border-color: rgba(16,185,129,.45);
  background: rgba(16,185,129,.2);
}

.tool-status.soon {
  color: #fde68a;
  border-color: rgba(245,158,11,.45);
  background: rgba(245,158,11,.2);
}

.tool-card-icon-wrap {
  width: 96px;
  height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 24px;
  padding: 14px;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 14px 28px rgba(15,23,42,0.16);
  margin-bottom: 12px;
}

.tool-card-icon {
  width: 76px;
  height: 76px;
  object-fit: contain;
  display: block;
  position: static;
  filter: none;
  opacity: 1;
  mix-blend-mode: normal;
  transition: transform .18s ease;
}

.tool-title {
  margin: 0 0 6px;
  color: var(--text);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.3;
}

.tool-format-flow {
  margin: 0;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 700;
}

.tool-open-indicator {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  gap: 6px;
  color: color-mix(in srgb, var(--accent) 70%, #fff 30%);
  font-size: 0.82rem;
  font-weight: 700;
}

.tool-empty-state {
  margin-top: 18px;
  border: 1px dashed var(--border);
  border-radius: 14px;
  padding: 18px;
  text-align: center;
  color: var(--muted);
}

.tool-empty-state h3 { margin: 0 0 6px; color: var(--text); }
.tool-empty-state p { margin: 0; }

.tool-chip-btn:focus-visible,
.tool-search:focus-visible,
.tool-category-card:focus-visible,
.tool-card:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 70%, #fff 30%);
  outline-offset: 2px;
}

@media (max-width: 1240px) {
  .tool-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  .tools-hero-grid,
  .dt-card-grid,
  .tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .tools-hero,
  .tool-filter-bar,
  .dt-section { border-radius: 16px; }
  .tools-hero-grid,
  .dt-card-grid,
  .tool-grid { grid-template-columns: 1fr; }
  .tool-card { min-height: 196px; }
  .tool-card-icon-wrap { width: 78px; height: 78px; border-radius: 20px; padding: 10px; }
  .tool-card-icon { width: 62px; height: 62px; }
}

@media (prefers-reduced-motion: reduce) {
  .tool-chip-btn,
  .tool-category-card,
  .tool-card { transition: none; }
}

/* Document Tool Page System (sub-pages) */
.tool-page-shell {
  width: min(var(--container), calc(100% - 28px));
  margin: 0 auto;
  padding-bottom: 56px;
}

.dt-hero {
  margin-top: 14px;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: var(--shadow);
  background:
    radial-gradient(circle at 8% 0%, rgba(34, 211, 238, 0.14), transparent 34%),
    radial-gradient(circle at 95% 100%, rgba(16, 185, 129, 0.15), transparent 34%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.96), rgba(30, 64, 175, 0.74));
}

.dt-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.34);
  background: rgba(255,255,255,.11);
  color: #e2e8f0;
  font-size: .78rem;
  font-weight: 800;
}

.dt-hero h1 {
  margin: 9px 0 8px;
  font-size: clamp(1.72rem, 3.6vw, 2.4rem);
  color: #f8fbff;
}

.dt-lead {
  margin: 0;
  color: #dbeafe;
  max-width: 72ch;
  line-height: 1.55;
}

.dt-card {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 20px;
  background: color-mix(in srgb, var(--panel-2) 88%, transparent);
}

.tool-upload-card {
  display: grid;
  gap: 12px;
}

.dt-card h3 {
  margin: 0 0 8px;
  font-size: 1.18rem;
  display: flex;
  align-items: center;
  gap: 10px;
}

.dt-state-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: .72rem;
  font-weight: 800;
}

.dt-state-badge.active {
  color: #d1fae5;
  border: 1px solid rgba(16,185,129,.45);
  background: rgba(16,185,129,.2);
}

.dt-state-badge.soon {
  color: #fde68a;
  border: 1px solid rgba(245,158,11,.45);
  background: rgba(245,158,11,.2);
}

.dt-label {
  font-size: .9rem;
  font-weight: 700;
  color: var(--text);
}

.dt-hidden-input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.dt-dropzone {
  border: 2px dashed color-mix(in srgb, var(--accent) 34%, var(--border));
  border-radius: 18px;
  min-height: 172px;
  padding: 18px;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 8px;
  background: linear-gradient(180deg, rgba(30,41,59,.6), rgba(15,23,42,.55));
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.dt-dropzone strong {
  font-size: 1.02rem;
  color: #e5f2ff;
}

.dt-dropzone span {
  color: #cbd5e1;
  font-size: .9rem;
}

.dt-dropzone:hover,
.dt-dropzone.is-dragover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent) 70%, #fff 30%);
  box-shadow: 0 12px 28px color-mix(in srgb, var(--accent) 18%, transparent);
}

.tool-select-button {
  border: 1px solid color-mix(in srgb, var(--accent) 64%, #fff 36%);
  border-radius: 11px;
  background: color-mix(in srgb, var(--accent) 20%, transparent);
  color: #eaf4ff;
  font-weight: 800;
  padding: 10px 14px;
}

.dt-mini-note,
.dt-summary {
  margin: 0;
  color: var(--muted);
  font-size: .88rem;
}

.dt-file-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.dt-file-item {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
}

.dt-file-item.is-drag-over,
.dt-file-item.is-dragging {
  border-color: color-mix(in srgb, var(--accent) 65%, var(--border));
}

.dt-file-actions {
  display: inline-flex;
  gap: 6px;
}

.dt-order-btn,
.dt-remove-btn,
.dt-range-chip {
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--panel-2) 92%, transparent);
  color: var(--text);
  border-radius: 9px;
  padding: 6px 10px;
  font-weight: 700;
}

.dt-btn-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 2px;
}

.dt-btn {
  border: 1px solid color-mix(in srgb, var(--accent) 62%, #fff 38%);
  background: color-mix(in srgb, var(--accent) 20%, transparent);
  color: #f8fbff;
  border-radius: 11px;
  padding: 10px 15px;
  font-weight: 800;
  text-decoration: none;
}

.dt-btn.dt-btn-soft {
  border-color: var(--border);
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
  color: var(--text);
}

.dt-btn:disabled {
  opacity: .56;
  cursor: not-allowed;
}

.dt-feedback {
  margin: 4px 0 0;
  font-weight: 700;
  font-size: .9rem;
}

.dt-feedback-info { color: #cbd5e1; }
.dt-feedback-success { color: #86efac; }
.dt-feedback-error { color: #fda4af; }

.tool-progress {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px;
  background: color-mix(in srgb, var(--panel) 89%, transparent);
  display: none;
}

.tool-progress.is-active,
.tool-progress.is-success,
.tool-progress.is-error {
  display: block;
}

.tool-progress-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: .84rem;
  color: var(--muted);
  font-weight: 700;
}

.tool-progress-track {
  margin-top: 7px;
  height: 10px;
  border-radius: 999px;
  background: rgba(148,163,184,.22);
  overflow: hidden;
}

.tool-progress-fill {
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #22d3ee, #34d399);
  transition: width .22s ease;
}

.tool-progress.is-error .tool-progress-fill {
  background: linear-gradient(90deg, #fb7185, #f97316);
}

.tool-progress.is-success .tool-progress-fill {
  background: linear-gradient(90deg, #34d399, #22d3ee);
}

.tool-limits-card {
  border: 1px solid rgba(245,158,11,.35);
  border-radius: 14px;
  padding: 12px;
  background: rgba(245,158,11,.09);
  color: #fde68a;
  display: grid;
  gap: 8px;
}

.tool-flow-pair {
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(148,163,184,.28);
  border-radius: 14px;
  padding: 9px 12px;
  background: rgba(15,23,42,.45);
}

.tool-flow-icon {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(148,163,184,.25);
}

.tool-flow-icon img {
  width: 36px;
  height: 36px;
  object-fit: contain;
}

.tool-flow-arrow {
  color: #cbd5e1;
  font-size: 1.3rem;
  font-weight: 900;
}

.tool-flow-caption {
  color: #dbeafe;
  font-size: .84rem;
  font-weight: 700;
}

.dt-history {
  margin-top: 14px;
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 16px;
  background: color-mix(in srgb, var(--panel) 91%, transparent);
}

.dt-history-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}

.dt-history-item {
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: 9px 11px;
  color: var(--text);
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
}

.dt-history-item.empty {
  color: var(--muted);
  border-style: dashed;
}

.dt-note {
  margin-top: 14px;
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 16px;
  background: color-mix(in srgb, var(--panel) 91%, transparent);
}

.dt-note ul {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 5px;
  color: var(--muted);
}

.dt-back-link {
  margin-top: 8px;
  display: inline-flex;
  margin-right: 10px;
  color: color-mix(in srgb, var(--accent) 70%, #fff 30%);
  text-decoration: none;
  font-weight: 700;
}

.dt-dropzone:focus-visible,
.dt-btn:focus-visible,
.dt-range-chip:focus-visible,
.dt-order-btn:focus-visible,
.dt-remove-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 70%, #fff 30%);
  outline-offset: 2px;
}

@media (max-width: 820px) {
  .tool-flow-pair {
    width: 100%;
    justify-content: space-between;
  }
  .tool-flow-caption {
    display: none;
  }
}

/* --- UX Polish Patch 20260601 --- */
.tool-card-icon-flow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 88px;
  padding: 8px 4px;
}

.tool-card-icon.is-flow {
  width: 52px;
  height: 52px;
  object-fit: contain;
  flex: 0 0 auto;
}

.tool-card-icon-arrow {
  font-size: 1.2rem;
  font-weight: 800;
  color: #cbd5e1;
  line-height: 1;
}

.tool-open-indicator {
  display: none !important;
}

.tool-progress {
  display: none;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px;
  background: color-mix(in srgb, var(--panel) 89%, transparent);
}

.tool-progress.is-active,
.tool-progress.is-success,
.tool-progress.is-error {
  display: block;
}

.tool-progress.is-idle {
  display: none;
}

.dt-card .tool-progress {
  margin: 6px 0 2px;
}

.dt-field {
  display: grid;
  gap: 8px;
}

.dt-input,
.dt-select,
select.dt-input,
select.dt-select,
input.dt-input,
textarea.dt-input {
  appearance: none;
  width: 100%;
  border: 1px solid color-mix(in srgb, var(--border) 78%, #ffffff 22%);
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  color: var(--text);
  border-radius: 12px;
  padding: 10px 12px;
  font-size: .95rem;
  line-height: 1.35;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

select.dt-input,
select.dt-select {
  padding-right: 36px;
  background-image: linear-gradient(45deg, transparent 50%, #cbd5e1 50%), linear-gradient(135deg, #cbd5e1 50%, transparent 50%);
  background-position: calc(100% - 20px) calc(50% - 2px), calc(100% - 14px) calc(50% - 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

.dt-input:focus,
.dt-select:focus,
select.dt-input:focus,
select.dt-select:focus,
input.dt-input:focus,
textarea.dt-input:focus {
  outline: 2px solid color-mix(in srgb, var(--accent) 68%, #fff 32%);
  outline-offset: 1px;
  border-color: color-mix(in srgb, var(--accent) 68%, var(--border));
}

.dt-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dt-inline-controls {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
  gap: 12px;
  align-items: end;
}

.dt-inline-controls .dt-field {
  min-width: 0;
}

.dt-inline-action {
  display: flex;
  align-items: end;
}

.dt-inline-action .dt-btn {
  min-height: 42px;
  white-space: nowrap;
}

.dt-segmented {
  display: inline-flex;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
  overflow: hidden;
}

.dt-segmented-button {
  border: 0;
  background: transparent;
  color: var(--text);
  font-weight: 700;
  padding: 8px 12px;
}

.dt-segmented-button.is-active {
  background: color-mix(in srgb, var(--accent) 24%, transparent);
  color: #f8fbff;
}

.dt-history[data-admin-only="true"] {
  display: none !important;
}

body.is-admin .dt-history[data-admin-only="true"] {
  display: block !important;
}

@media (max-width: 820px) {
  .tool-card-icon-flow {
    gap: 8px;
    min-height: 76px;
  }

  .tool-card-icon.is-flow {
    width: 46px;
    height: 46px;
  }

  .dt-inline-controls {
    grid-template-columns: 1fr;
  }

  .dt-inline-action .dt-btn {
    width: 100%;
  }
}

/* Document Editors */
.document-editor-page {
  min-height: 100vh;
}

.document-editor-shell {
  width: min(1760px, calc(100% - 24px));
  margin: 0 auto;
  padding: 14px 0 48px;
}

.editor-breadcrumb {
  margin-top: 0;
}

.editor-mobile-note {
  display: none;
  margin: 10px 0;
  border: 1px solid rgba(245, 158, 11, .34);
  border-radius: 12px;
  padding: 10px 12px;
  color: #fde68a;
  background: rgba(245, 158, 11, .08);
  font-weight: 700;
}

.editor-workspace {
  border: 1px solid var(--border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.editor-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px;
  border-bottom: 1px solid var(--border);
  background: rgba(15, 23, 42, .74);
}

.editor-toolbar-top {
  min-height: 70px;
}

.editor-toolbar-group,
.editor-file-group {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.editor-toolbar-push {
  margin-left: auto;
}

.editor-file-meta {
  display: grid;
  min-width: 220px;
  gap: 2px;
}

.editor-file-meta strong {
  color: var(--text);
  font-size: .94rem;
}

.editor-file-meta span,
.editor-status-bar {
  color: var(--muted);
  font-size: .84rem;
  font-weight: 700;
}

.editor-icon-btn {
  min-height: 38px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
  color: var(--text);
  padding: 8px 10px;
  font-weight: 800;
  cursor: pointer;
}

.editor-icon-btn:hover,
.dt-btn:hover {
  border-color: color-mix(in srgb, var(--accent) 60%, var(--border));
}

.editor-icon-btn:disabled,
.dt-btn.danger:disabled {
  opacity: .52;
  cursor: not-allowed;
}

.dt-btn.danger,
.editor-icon-btn.danger {
  border-color: rgba(244, 63, 94, .42);
  color: #fecdd3;
}

.editor-zoom-label {
  min-width: 54px;
  text-align: center;
  color: #e5f2ff;
  font-weight: 900;
}

.pdf-tool-strip,
.word-format-toolbar,
.word-find-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  background: rgba(15, 23, 42, .48);
}

.pdf-tool-strip .dt-segmented-button,
.word-format-toolbar .editor-icon-btn {
  border: 1px solid var(--border);
  border-radius: 10px;
}

.pdf-tool-strip .dt-segmented-button.is-active {
  border-color: rgba(248, 113, 113, .55);
  background: rgba(244, 63, 94, .22);
}

.editor-status-bar {
  min-height: 38px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
}

.editor-status-bar.is-error {
  color: #fda4af;
}

.editor-status-bar.is-success {
  color: #86efac;
}

.pdf-editor-layout,
.word-editor-layout {
  display: grid;
  min-height: calc(100vh - 250px);
}

.pdf-editor-layout {
  grid-template-columns: 276px minmax(0, 1fr) 318px;
}

.word-editor-layout {
  grid-template-columns: 230px minmax(0, 1fr);
}

.editor-panel {
  min-width: 0;
  border-right: 1px solid var(--border);
  background: rgba(15, 23, 42, .5);
}

.pdf-properties {
  border-right: 0;
  border-left: 1px solid var(--border);
}

.editor-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid var(--border);
}

.editor-panel-head strong {
  color: var(--text);
}

.editor-panel-actions,
.pdf-props-form {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.editor-panel-actions .dt-btn {
  width: 100%;
}

.editor-panel-empty {
  padding: 14px;
  color: var(--muted);
  font-weight: 700;
}

.pdf-page-list {
  list-style: none;
  margin: 0;
  padding: 10px;
  display: grid;
  gap: 10px;
  max-height: calc(100vh - 390px);
  overflow: auto;
}

.pdf-page-thumb {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 8px;
  color: var(--text);
  background: color-mix(in srgb, var(--panel-2) 88%, transparent);
  cursor: grab;
}

.pdf-page-thumb.is-active,
.pdf-page-thumb.is-selected {
  border-color: rgba(248, 113, 113, .65);
  box-shadow: 0 0 0 2px rgba(248, 113, 113, .14);
}

.pdf-page-thumb.is-drag-over {
  border-style: dashed;
}

.pdf-page-thumb img,
.pdf-import-card img {
  width: 100%;
  aspect-ratio: 1 / 1.32;
  object-fit: contain;
  background: #f8fafc;
  border-radius: 6px;
}

.pdf-page-thumb span {
  display: block;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 800;
}

.pdf-stage-panel,
.word-paper-scroll {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(45deg, rgba(148, 163, 184, .08) 25%, transparent 25%),
    linear-gradient(-45deg, rgba(148, 163, 184, .08) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, rgba(148, 163, 184, .08) 75%),
    linear-gradient(-45deg, transparent 75%, rgba(148, 163, 184, .08) 75%);
  background-size: 26px 26px;
  background-position: 0 0, 0 13px, 13px -13px, -13px 0;
}

.pdf-empty-state,
.word-dropzone {
  margin: 24px;
  min-height: 260px;
  display: grid;
  place-items: center;
  gap: 8px;
  text-align: center;
  border: 2px dashed color-mix(in srgb, var(--accent) 34%, var(--border));
  border-radius: 18px;
  padding: 22px;
  background: rgba(15, 23, 42, .68);
  cursor: pointer;
}

.pdf-empty-state strong,
.word-dropzone strong {
  color: #f8fbff;
}

.pdf-empty-state span,
.word-dropzone span {
  color: var(--muted);
}

.pdf-stage-scroll {
  width: 100%;
  height: calc(100vh - 250px);
  overflow: auto;
  padding: 26px;
}

.pdf-page-stage {
  position: relative;
  margin: 0 auto;
  transform-origin: top center;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .32);
}

#pdfPageImage {
  display: block;
  width: 100%;
  height: 100%;
  user-select: none;
  background: #fff;
}

.pdf-text-layer,
.pdf-overlay-layer,
.pdf-draw-layer {
  position: absolute;
  inset: 0;
}

.pdf-text-span {
  position: absolute;
  border: 1px dashed rgba(59, 130, 246, .6);
  background: rgba(59, 130, 246, .08);
  cursor: text;
}

.pdf-text-span:hover {
  background: rgba(59, 130, 246, .18);
}

.pdf-object {
  position: absolute;
  border: 1px solid rgba(34, 211, 238, .78);
  background: rgba(15, 23, 42, .08);
  cursor: move;
  touch-action: none;
}

.pdf-object.is-selected {
  border-color: #facc15;
  box-shadow: 0 0 0 2px rgba(250, 204, 21, .22);
}

.pdf-object[data-type="redaction"] {
  background: rgba(0, 0, 0, .78);
  border-color: rgba(248, 113, 113, .9);
}

.pdf-object-text {
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 3px;
  white-space: pre-wrap;
  color: #111827;
}

.pdf-object-signature {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  overflow: hidden;
  color: #111827;
  font-family: "Brush Script MT", "Segoe Script", cursive;
  font-size: 24px;
}

.pdf-object img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

.pdf-resize-handle {
  position: absolute;
  right: -6px;
  bottom: -6px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid #0f172a;
  background: #facc15;
  cursor: nwse-resize;
}

.editor-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.pdf-props-form .editor-field-grid:nth-of-type(4) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.editor-dialog {
  width: min(720px, calc(100% - 26px));
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 0;
  background: color-mix(in srgb, var(--panel) 96%, #020617 4%);
  color: var(--text);
  box-shadow: 0 28px 100px rgba(0, 0, 0, .5);
}

.editor-dialog::backdrop {
  background: rgba(2, 6, 23, .72);
}

.editor-dialog-body {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.editor-dialog-body h2 {
  margin: 0;
  font-size: 1.2rem;
}

.pdf-import-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  max-height: 360px;
  overflow: auto;
}

.pdf-import-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 8px;
  background: color-mix(in srgb, var(--panel-2) 90%, transparent);
  cursor: pointer;
}

.pdf-import-card.is-selected {
  border-color: rgba(34, 211, 238, .68);
}

#pdfSignatureCanvas {
  width: 100%;
  max-width: 100%;
  height: 180px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  touch-action: none;
}

.signature-type-input {
  font-family: "Brush Script MT", "Segoe Script", cursive;
  font-size: 1.6rem;
}

.word-style-select {
  min-width: 128px;
}

.word-size-input {
  width: 78px;
}

.word-color-input {
  width: 46px;
  min-height: 38px;
  padding: 4px;
}

.word-find-row {
  align-items: end;
}

.word-find-row .dt-field {
  min-width: 180px;
}

.word-outline {
  min-height: calc(100vh - 280px);
}

.word-outline-list {
  margin: 0;
  padding: 12px 12px 12px 28px;
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-weight: 700;
}

.word-outline-list a {
  color: var(--muted);
  text-decoration: none;
}

.word-paper-scroll {
  height: calc(100vh - 280px);
  overflow: auto;
  padding: 28px;
}

.word-dropzone {
  min-height: 140px;
  margin: 0 auto 18px;
  max-width: 860px;
}

.word-paper {
  width: min(794px, 100%);
  min-height: 1123px;
  margin: 0 auto;
  padding: 72px;
  background: #fff;
  color: #111827;
  border-radius: 2px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
  outline: none;
  line-height: 1.55;
}

.word-paper:focus-visible {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, .38), 0 24px 70px rgba(0, 0, 0, .34);
}

.word-paper h1,
.word-paper h2,
.word-paper h3,
.word-paper p {
  margin-top: 0;
}

.word-paper table {
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0;
}

.word-paper td,
.word-paper th {
  border: 1px solid #cbd5e1;
  padding: 8px;
  min-width: 80px;
}

.word-paper img {
  max-width: 100%;
  height: auto;
}

.word-paper hr[data-page-break="true"] {
  border: 0;
  border-top: 2px dashed #60a5fa;
  margin: 28px 0;
}

.word-paper hr[data-page-break="true"]::after {
  content: "Sayfa sonu";
  display: block;
  color: #2563eb;
  font-size: .78rem;
  text-align: center;
}

.pdf-sidebar.is-collapsed,
.pdf-properties.is-collapsed {
  display: none;
}

.pdf-editor-layout.sidebar-collapsed {
  grid-template-columns: minmax(0, 1fr) 318px;
}

.pdf-editor-layout.props-collapsed {
  grid-template-columns: 276px minmax(0, 1fr);
}

.pdf-editor-layout.sidebar-collapsed.props-collapsed {
  grid-template-columns: minmax(0, 1fr);
}

.editor-icon-btn:focus-visible,
.word-paper:focus-visible,
.editor-dialog button:focus-visible,
.pdf-page-thumb:focus-visible,
.pdf-empty-state:focus-visible,
.word-dropzone:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 70%, #fff 30%);
  outline-offset: 2px;
}

@media (max-width: 1120px) {
  .pdf-editor-layout {
    grid-template-columns: 230px minmax(0, 1fr);
  }
  .pdf-properties {
    grid-column: 1 / -1;
    border-left: 0;
    border-top: 1px solid var(--border);
  }
  .word-editor-layout {
    grid-template-columns: 1fr;
  }
  .word-outline {
    display: none;
  }
}

@media (max-width: 760px) {
  .document-editor-shell {
    width: min(100% - 14px, 1760px);
  }
  .editor-mobile-note {
    display: block;
  }
  .pdf-editor-layout {
    grid-template-columns: 1fr;
  }
  .editor-panel,
  .pdf-properties {
    border-right: 0;
    border-left: 0;
    border-bottom: 1px solid var(--border);
  }
  .pdf-page-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: 360px;
  }
  .pdf-stage-scroll,
  .word-paper-scroll {
    height: auto;
    min-height: 520px;
    padding: 14px;
  }
  .word-paper {
    min-height: 760px;
    padding: 34px 22px;
  }
  .editor-toolbar-push {
    margin-left: 0;
  }
  .editor-file-meta {
    min-width: 0;
  }
  .pdf-import-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .editor-icon-btn,
  .dt-btn,
  .pdf-object {
    transition: none;
  }
}