/* Login (Wila Dashboard/login.php) og forsiden (rod-index.php): centreret på sidens grund.
   Farver fra tokens.css; markup og logik i siderne er uændret. */
body.login { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 30px; }
.landing { text-align: center; max-width: 800px; width: 100%; }
.logos { display: flex; align-items: center; justify-content: center; gap: 28px; margin-bottom: 32px; flex-wrap: wrap; }
.logos img { height: 52px; width: auto; }
.logos .logo-wez { height: 34px; }
.logos .logo-separator { font-size: 26px; color: var(--baseline); font-weight: 300; }
.landing h1 { font-size: 22px; color: var(--ink); margin: 0 0 6px; }
.landing .subtitle { font-size: 14px; color: var(--muted); margin: 0 0 32px; }
.login-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 32px;
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
    text-align: left;
}
.login-card h1 { font-size: 22px; text-align: center; margin: 0 0 4px; }
.login-card h2 { font-size: 13px; color: var(--muted); text-align: center; font-weight: 400; margin: 0 0 28px; }
.login-card label { display: block; font-size: 13px; color: var(--ink-2); font-weight: 600; margin-bottom: 6px; }
.login-card input {
    width: 100%;
    padding: 10px 14px;
    background: var(--surface);
    color: var(--ink);
    border: 1px solid var(--baseline);
    border-radius: var(--radius-s);
    font: inherit;
    font-size: 14px;
    margin-bottom: 16px;
}
.login-card input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-wash); }
.login-card button {
    width: 100%;
    padding: 12px;
    background: var(--accent);
    color: var(--accent-ink);
    border: none;
    border-radius: var(--radius-s);
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}
.login-card button:hover { filter: brightness(1.08); }
.login-error { text-align: center; color: #e53e3e; font-size: 13px; margin-top: 14px; }
.app-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; max-width: 720px; margin: 0 auto; }
.app-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 26px 20px; text-decoration: none; display: block; }
.app-card:hover { border-color: var(--accent); background: var(--accent-wash); }
.app-card .icon { font-size: 34px; margin-bottom: 10px; }
.app-card .name { font-size: 16px; font-weight: 600; color: var(--ink); margin-bottom: 4px; }
.app-card .desc { font-size: 12px; color: var(--muted); }
.user-bar { margin-top: 32px; font-size: 13px; color: var(--muted); display: flex; align-items: center; justify-content: center; gap: 14px; }
.user-bar a { color: var(--ink-2); text-decoration: none; font-size: 12px; }
.user-bar a:hover { color: var(--ink); }
@media (max-width: 550px) {
    .logos { gap: 16px; }
    .logos img { height: 40px; }
    .logos .logo-wez { height: 26px; }
    .app-grid { grid-template-columns: 1fr; }
}