/* A4 yazdırma */
@page { size: A4; margin: 16mm; }

.page { font-family: Arial, sans-serif; color:#111; background:#f6f8fb; }
.wrapper { max-width: 960px; margin: 0 auto; padding: 18px; }

h1 { font-size: 20px; letter-spacing: .2px; }

.box {
  border: 1px solid #e1e6ef; border-radius: 12px; padding: 12px; margin: 10px 0;
  background:#fff; box-shadow: 0 8px 24px rgba(0,0,0,.06);
}

.row { display: flex; gap: 16px; flex-wrap: wrap; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

label { display:block; margin:8px 0 4px; font-weight:600; }
input, textarea, select {
  width: 100%; padding:10px; font-size: 14px; border:1px solid #cbd5e1; border-radius:8px;
  background:#fff; outline-color:#005aa3;
}

.logo-preview {
  margin-top:8px; border: 1px dashed #cbd5e1; min-height: 60px;
  display:flex; align-items:center; justify-content:center; color:#555; border-radius:8px;
}

.actions { margin-top: 14px; }
button { padding:10px 14px; font-size: 14px; border-radius:8px; cursor:pointer; }
.btn-primary { background:#005aa3; color:#fff; border:none; }
.btn-primary:hover { filter: brightness(1.05); }

/* Tema renkleri (Tip'e göre) */
:root { --theme-color:#005aa3; }
.t-Gefahrstoff { --theme-color:#E53935; }
.t-Biostoff    { --theme-color:#2E7D32; }
.t-Maschine    { --theme-color:#005AA3; }
.t-PSA         { --theme-color:#6A1B9A; }

/* Editor görsellik */
.hero {
  background: linear-gradient(120deg, var(--theme-color), #111);
  color:#fff; border-radius:10px; padding:16px 18px; margin-bottom:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.12);
}
.hero h1 { margin:0; font-size:20px; }

.pictos { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-start; }
.pic { border:1px solid #ccc; padding:6px; background:#fff; cursor:pointer; border-radius:6px; width:88px; text-align:center; }
.pic img { width:72px; height:72px; object-fit:contain; display:block; margin:0 auto 4px; }
.pic .code { font-size:11px; color:#555; }
.pic.selected { outline: 3px solid var(--theme-color); }

.small { font-size:12px; color:#555; }
.list  { border:1px solid #ddd; border-radius:4px; padding:10px; background:#fafafa; min-height:80px; }
#fontHint { color:#b40000; font-weight:bold; display:none; margin-top:8px; }