/* assets/style.css — same as auth build, with language switch */
:root { --bg:#0f172a; --card:#111827; --text:#e5e7eb; --muted:#9ca3af; --accent:#22c55e; --warn:#f59e0b; --danger:#ef4444; --border:#1f2937; }
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji";margin:0;padding:0;background:var(--bg);color:var(--text)}
.container{max-width:1100px;margin:30px auto;padding:0 16px}
.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
h1,h2,h3{margin:0 0 12px 0}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;box-shadow:0 10px 20px rgba(0,0,0,.2);margin-bottom:16px}
a{color:#93c5fd;text-decoration:none}a:hover{text-decoration:underline}
input,select,textarea{background:#0b1220;color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px 12px;width:100%}
label{display:block;font-size:14px;color:var(--muted);margin-bottom:6px}
.grid{display:grid;gap:12px}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;border:1px solid var(--border);background:#0b1220;color:var(--text);cursor:pointer}
.btn:hover{filter:brightness(1.15)}.btn-primary{background:var(--accent);color:#03220f;border-color:#16a34a}.btn-warn{background:var(--warn);color:#221a03;border-color:#d97706}.btn-danger{background:var(--danger);color:#220303;border-color:#dc2626}
table{width:100%;border-collapse:collapse;margin-top:10px}th,td{padding:10px;border-bottom:1px solid var(--border);text-align:left}th{color:var(--muted);font-weight:600}tr:hover td{background:#0b1220}
.badge{padding:4px 8px;border-radius:999px;font-size:12px;border:1px solid var(--border)}.badge-pending{background:#1f2937;color:#fbbf24}.badge-completed{background:#052e1a;color:#86efac;border-color:#16a34a}
.small{color:var(--muted);font-size:12px}
.userbox{display:flex;align-items:center;gap:10px}.userbox .name{color:var(--muted)}
.langsw{display:flex;gap:6px;align-items:center}.langsw a{padding:6px 8px;border:1px solid var(--border);border-radius:8px}

/* Mobile tweaks: stack grids and make tables scrollable on small screens. */
@media (max-width: 720px){
  /* Collapse multi-column grids to a single column */
  .grid-3, .grid-4 { grid-template-columns: 1fr; }
  /* Stack header items vertically and add spacing */
  .header { flex-direction: column; align-items: flex-start; gap: 10px; }
  /* Allow tables to scroll horizontally rather than shrinking columns */
  table { display: block; overflow-x: auto; white-space: nowrap; }
}
@media print{body{background:#fff;color:#000}.no-print{display:none!important}.card{box-shadow:none;border:none}a{color:#000;text-decoration:none}}
