:root { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
body { margin:0; background:#f6f7fb; color:#111; }
.container { max-width: 85%; margin: 0 auto; padding: 24px; }
h1 { margin: 0 0 10px; font-size: 24px; }
p { margin: 8px 0; }
.muted { color:#667; }
.card { background:#fff; border-radius:14px; padding:16px; box-shadow: 0 6px 22px rgba(0,0,0,.06); }
label { display:block; margin: 12px 0 6px; font-size: 13px; color:#445; }
input { padding:10px 12px; border:1px solid #d7dbe7; border-radius:10px; background:#fff; }
button { margin-top: 0px; border:0; border-radius:10px; cursor:pointer; background:#111; color:#fff; }
.alert { padding:10px 12px; border-radius:10px; margin: 10px 0; }
.alert.error { background:#ffe8e8; color:#8a1f1f; }
.topbar { background:#111; color:#fff; }
.row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.link { color:#fff; text-decoration:none; opacity:.9; }
.link:hover { opacity:1; text-decoration:underline; }
.link.active { opacity:1; font-weight:600; text-decoration:underline; }

/* ── Shared ── */
.badge { display:inline-block; padding:4px 8px; border-radius:999px; font-size:12px; }
.b-pending  { background:#fff3cd; color:#7a5a00; }
.b-active   { background:#e8fff0; color:#116b2f; }
.b-rejected { background:#ffe8e8; color:#8a1f1f; }
.b-missing  { background:#ffe8e8; color:#8a1f1f; }
.b-ok       { background:#e8fff0; color:#116b2f; }
.b-bad      { background:#ffe8e8; color:#8a1f1f; }
.actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.btn { display:inline-block; padding:8px 10px; border-radius:10px; border:0; cursor:pointer; background:#111; color:#fff; font-size:13px; text-decoration:none; }
.btn.secondary { background:#e9ecf6; color:#111; }
.btn.disabled  { background:#cfd5e6; color:#556; cursor:not-allowed; }
.btn.danger    { background:#b42318; }
.nowrap { white-space:nowrap; }

/* ── translate.php ── */
.tl-toolbar { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:18px; }
.tl-toolbar select,
.tl-toolbar input[type="text"] { width:auto; padding:8px 12px; font-size:13px; }
.tl-toolbar .spacer { flex:1; }

.stats-bar { display:flex; gap:18px; margin-bottom:18px; flex-wrap:wrap; }
.stat-chip { background:#fff; border-radius:10px; padding:10px 16px;
             box-shadow:0 2px 8px rgba(0,0,0,.06); font-size:13px; color:#445; }
.stat-chip strong { display:block; font-size:20px; color:#111; }

.tl-wrap { overflow:auto; max-height:calc(100vh - 350px); }
table.tl { width:100%; border-collapse:collapse; font-size:13px; }
table.tl th { background:#fafbff; color:#445; font-weight:600;
              padding:9px 10px; border-bottom:2px solid #eef1f7; text-align:center; white-space:nowrap; min-width:200px;
              position:sticky; top:0; z-index:10; }
table.tl td { padding:6px 8px; border-bottom:1px solid #f0f2f8; vertical-align:middle; }
table.tl tr:hover td { background:#fafbff; }
table.tl td:first-child,
table.tl th:first-child { position:sticky; left:0; z-index:11; background:#fafbff; box-shadow:1px 0 0 #eef1f7; }
.tkey-cell { font-family:monospace; font-size:14px; color:#556; white-space:nowrap; font-weight:600; }

.cell-wrap { position:relative; }
.tl-input { width:100%; min-width:120px; padding:5px;
            border:1px solid; border-radius:6px; background:transparent;
            font-size:12px; resize:vertical; font-family:inherit; transition:.15s; }
.tl-input:focus  { border-color:#a0aec0; background:#fff; outline:none; box-shadow:0 0 0 2px #e8f0fe; }
.tl-input.saving { border-color:#f59e0b; background:#fffbeb; }
.tl-input.saved  { border-color:#22c55e; background:#f0fdf4; }
.tl-input.error  { border-color:#ef4444; background:#fef2f2; }

.src-badge { position:absolute; top:1px; right:-10px; font-size:10px; font-weight:700;
             border-radius:4px; padding:2px 3px; cursor:default; }
.src-M { background:#e0f2fe; color:#0369a1; }
.src-A { background:#fef9c3; color:#854d0e; }

.row-actions { display:flex; gap:6px; align-items:center; white-space:nowrap; justify-content:center; }
.btn-auto { font-size:11px; padding:4px 8px; border-radius:6px;
            background:#f0fdf4; color:#166534; border:1px solid #bbf7d0; cursor:pointer; }
.btn-auto:hover { background:#dcfce7; }
.btn-del  { font-size:11px; padding:4px 8px; border-radius:6px;
            background:#fff1f2; color:#9f1239; border:1px solid #fecdd3; cursor:pointer; }
.btn-del:hover { background:#ffe4e6; }

.new-key-form { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.new-key-form input { width:auto; }

.modal-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:999; align-items:center; justify-content:center; }
.modal-overlay.open { display:flex; }
.modal-box { background:#fff; border-radius:14px; padding:24px; width:340px; box-shadow:0 20px 60px rgba(0,0,0,.15); }
.modal-box h3 { margin:0 0 16px; }

.btn-primary { background:#111; color:#fff; border:0; border-radius:8px; padding:8px 16px; cursor:pointer; font-size:13px; }
.btn-primary:hover { background:#333; }
.btn-secondary { background:#f1f5f9; color:#334155; border:1px solid #e2e8f0; border-radius:8px; padding:8px 16px; cursor:pointer; font-size:13px; }
.btn-secondary:hover { background:#e2e8f0; }

#toast { position:fixed; bottom:24px; right:24px; background:#111; color:#fff;
         padding:10px 18px; border-radius:10px; font-size:13px;
         opacity:0; transform:translateY(8px); transition:.25s; pointer-events:none; z-index:9999; }
#toast.show { opacity:1; transform:translateY(0); }

/* ── pending.php ── */
table { width:100%; border-collapse:collapse; background:#fff; border-radius:14px; overflow:hidden; }
th, td { padding:10px 12px; border-bottom:1px solid #eef1f7; vertical-align:middle; font-size:13px; }
th { text-align:left; background:#fafbff; color:#445; font-weight:600; }
.mini { width:44px; height:44px; border-radius:10px; object-fit:cover; background:#f2f3f7; }
.filters { display:flex; gap:10px; flex-wrap:wrap; align-items:end; }
.filters label { margin:0; }
.filters input, .filters select { width:auto; min-width:220px; }
.pager { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:14px; }

/* ── partner.php ── */
.grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.card h2 { margin:0 0 10px; font-size:16px; }
.kv { display:grid; grid-template-columns:160px 1fr; gap:8px 12px; font-size:13px; }
.k { color:#556; }
.v code { font-size:12px; padding:2px 6px; background:#f1f3f9; border-radius:8px; }
textarea { width:100%; min-height:100px; padding:10px 12px; border:1px solid #d7dbe7; border-radius:10px; resize:vertical; }
@media (max-width:920px) { .grid { grid-template-columns:1fr; } }

/* ── categories.php ── */
input[type="number"], input[type="date"] { width:100%; min-width:180px; }

#doc-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
}

.doc-modal-bg {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.8);
}

.doc-modal-content {
  position: absolute;
  inset: 0;
  display:flex;
  justify-content:center;
}

.doc-modal-content img {
  max-width:50%;
  max-height:50%;
  background:#fff;
  border-radius:8px;
}
.doc-modal-content {
  padding:10px;
}
#doc-close {
  position:relative;
  top:0px;
  right:14px;
  font-size:28px;
  border:none;
  background:red;
  color:#fff;
  cursor:pointer;
  width:fit-content;
  height:fit-content;
}