.messages { margin-bottom:1rem; padding:1rem; background:#2e7d32; color:#fff; border-radius:4px; }
.message.success { background:#2e7d32; }
.icon { width:20px; height:20px; }

.button { background:#3b82f6; border:0; color:#fff; padding:6px 14px; font-size:.9rem; cursor:pointer; border-radius:4px; margin-left:.5rem; line-height:1.5; display:inline-block; text-align:center; text-decoration:none; }
.button:hover { background:#2563eb; }

.inline-form { display:inline-flex; align-items:center; gap:.5rem; }
.inline-form select { padding:4px 6px; background:#1e1e1e; color:#ccc; border:1px solid #333; border-radius:3px; font-size:.85rem; }

body { background:#121212; color:#ccc; font-family:"Segoe UI", Tahoma, sans-serif; margin:0; padding:2rem; }

@media (max-width:600px){
    body { font-size:1.1rem; padding:.5rem; }
    .button { padding:3px 7px; font-size:.7rem; margin-left:.1rem; }
    .inline-form { gap:.1rem; font-size:.75rem; }
    .inline-form select { font-size:.75rem; }
}

.login-container { max-width:420px; margin:3rem auto; background:#1e1e1e; padding:2rem; border-radius:8px; box-shadow:0 0 10px rgba(0,0,0,.5); }
.login-container h2 { text-align:center; margin-bottom:1.25rem; color:#eee; font-weight:600; }

.login-container .button { width:100%; margin-top:1rem; }

.error-message { background:#f44336; color:#fff; padding:.8rem; border-radius:4px; margin-bottom:1rem; text-align:center; }
.links { display:flex; justify-content:space-between; margin-top:.75rem; font-size:.9rem; }

.stretched-link { position:relative; z-index:1; color:#93c5fd; text-decoration:none; }
.stretched-link::after { content:""; position:absolute; inset:-10px 0 -10px 0; z-index:0; }
.stretched-link:hover { text-decoration:underline; }

.logo { text-align:center; margin-bottom:1rem; }
.logo img { display:inline-block; width:50%; max-width:180px; filter: drop-shadow(0 0 8px rgba(0,0,0,.45)); }

/* ==== ALTCHA widget dark polish ==== */
altcha-widget {
    display:block;
    margin-top:.5rem;
    /* Try the built-in CSS vars if available in your version */
    --altcha-bg: #2a2a2a;
    --altcha-fg: #e5e7eb;
    --altcha-border: #333;
    --altcha-radius: 8px;
    --altcha-shadow: 0 0 0 1px #333;
    --altcha-link: #93c5fd;
    --altcha-accent: #3b82f6;
}

/* Fallback wrapper if CSS vars aren’t supported */
.altcha-wrap {
    background:#2a2a2a;
    border:1px solid #333;
    border-radius:8px;
    padding:12px;
    box-shadow: inset 0 0 0 1px #333;
}

.altcha-wrap { 
text-align: center; 
}

.altcha-wrap altcha-widget { 
display: inline-block; 
}

altcha-widget {
--altcha-border-width: 0;
}

/* Helper text */
.muted { color:#9ca3af; font-size:.85rem; text-align:center; margin-top:.5rem; }