/* ===== Base theme (как в profile.html) ===== */
:root{
  --bg:#2d4680;
  --card:#111827;
  --text:#e5e7eb;
  --muted:#9ca3af;
  --border:#334155;
  --border-soft:#1f2937;
  --accent:#22c55e;
  --accent-2:#1f78f6;
  --danger:#ef4444;
  --neutral:#0b1220;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:16px/1.45 system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

/* ===== Layout wrappers (общие для всех страниц) ===== */
.wrap,.container{
  max-width:960px;
  margin:0 auto;
  padding:24px 16px;
}
.card{
  background:var(--card);
  border:1px solid var(--border-soft);
  border-radius:16px;
  padding:20px;
  box-shadow:0 10px 25px rgba(0,0,0,.30);
}
.hr{height:1px;background:var(--border-soft);margin:16px 0}

/* ===== Typography ===== */
h1{margin:0 0 8px;font-size:28px}
h2{margin:0 0 8px;font-size:20px}
.subtitle{color:var(--muted);margin:0 0 16px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;color:#cbd5e1}

/* ===== Grid / Rows ===== */
.row{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.grid{display:grid;gap:14px;margin-top:8px}
@media(min-width:740px){.grid{grid-template-columns:repeat(3,1fr)}}

/* ===== Buttons & Links ===== */
a.btn, .btn{
  display:inline-flex;justify-content:center;align-items:center;gap:8px;
  padding:12px 16px;border-radius:12px;text-decoration:none;cursor:pointer;
  background:var(--neutral);border:1px solid var(--border);color:var(--text);font-weight:600;
  transition:transform .08s ease,border-color .08s ease,opacity .08s ease
}
.btn:hover{transform:translateY(-1px);border-color:#475569}
.btn.primary{background:linear-gradient(135deg,#16a34a,var(--accent));border:none;color:#04110a}
.btn.ghost{background:transparent;border:1px solid var(--border);color:var(--text)}
.badge{padding:4px 8px;border:1px solid var(--accent-2);border-radius:999px;background:var(--neutral);font-size:12px;color:#cbd5e1}

/* Кнопка входа через Google (рядом с табами) */
.google-btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;

  padding:10px 12px;
  border-radius:10px;
  border:1px solid var(--border);

  background:#fff;
  color:#444;
  font-weight:600;
  font-size:14px;
  cursor:pointer;

  transition:background 0.2s, box-shadow 0.2s, transform 0.1s ease;
}

.google-btn:hover {
  background:#f8f8f8;
  box-shadow:0 2px 6px rgba(0,0,0,0.1);
  transform:translateY(-1px);
}

.google-btn img {
  width:16px;
  height:16px;
}

/* Кнопки в таблицах (вкл/выкл) */
button.toggle{padding:6px 10px;border:0;border-radius:8px;font-size:12px;cursor:pointer}
button.toggle.on{background:#2563eb;color:#fff}
button.toggle.off{background:#9ca3af;color:#111}

/* ===== Tiles (profile.html) ===== */
.tile{
  display:block;padding:16px;border:1px solid var(--border);border-radius:14px;
  background:var(--neutral);text-decoration:none;color:var(--text);
  transition:transform .08s ease,border-color .08s ease
}
.tile:hover{transform:translateY(-1px);border-color:#475569}
.tile-title{font-weight:700;margin:0 0 4px}
.tile-desc{color:var(--muted);font-size:14px;margin:0}

/* ===== Forms (qr.html, login.html) ===== */
label{display:block;margin:0 0 6px;color:#cbd5e1}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="file"]{
  width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:12px;
  background:var(--neutral);color:var(--text);outline:none
}
input::placeholder{color:#94a3b8}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.error{color:var(--danger);min-height:1.2em;margin-top:8px}

/* ===== Tabs (login.html) ===== */
.tabs{display:flex;gap:8px;margin:0 0 12px}
.tab-btn{
  padding:10px 12px;border-radius:10px;border:1px solid var(--border);
  background:var(--neutral);color:var(--text);cursor:pointer;font-weight:600
}
.tab-btn.active{background:#0f172a;border-color:#475569}
.tab-panel{display:none}
.tab-panel.active{display:block}

/* ===== Auth wrapper (login.html) ===== */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.auth-wrap .card{max-width:420px;width:100%}
.title{margin:0 0 10px;text-align:center}

/* ===== Tables (index.html) ===== */
table{
  width:100%;border-collapse:collapse;margin-top:12px;background:var(--neutral);
  border-radius:12px;overflow:hidden;box-shadow:0 6px 24px rgba(0,0,0,.20)
}
thead th{
  text-align:left;font-size:12px;color:var(--muted);padding:10px;border-bottom:1px solid #263244
}
tbody td{
  padding:10px;border-bottom:1px solid #1c2738;font-size:14px;color:var(--text)
}
tbody tr:last-child td{border-bottom:0}

/* ===== Helpers ===== */
.hidden{display:none!important}
.center{display:grid;place-items:center}
.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}

/* Поля логина/пароля — делаем выше на 1.5 раза через padding */
input[name="username"],
input[name="password"] {
  padding-top: 10px;   /* вместо 12px */
  padding-bottom: 10px;
  font-size: 10px;
}

/* Пароль — в одной строке с меткой */
label.inline {
  display: flex;
  align-items: center;
  gap: 12px;
}

label.inline span {
  min-width: 70px;
}