/* Pagina di accesso nello stile del login TRADE: fondo #0E3A2F, logo centrato, pulsante a contorno verde. */
:root { --bg: #0e3a2f; --text: #ffffff; --muted: rgba(255, 255, 255, .7); --accent: #78f9ad; --line: rgba(255, 255, 255, .18); --err: #ff9a9c; color-scheme: dark; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { background: var(--bg); color: var(--text); font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif; }

.containerLogin { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 32px 16px; position: relative; overflow: hidden; isolation: isolate; }
.containerLogin::before, .containerLogin::after { content: ''; position: absolute; border-radius: 50%; filter: blur(90px); z-index: -1; pointer-events: none; }
.containerLogin::before { width: 560px; height: 560px; top: -180px; left: 10%; background: radial-gradient(circle, rgba(149, 225, 168, .22), rgba(149, 225, 168, 0) 70%); }
.containerLogin::after { width: 480px; height: 480px; bottom: -160px; right: 6%; background: radial-gradient(circle, rgba(52, 148, 121, .32), rgba(52, 148, 121, 0) 70%); }

.logo { height: 50px; width: auto; }
.module { margin: 0 0 10px; font-size: 12px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--accent); }

.loginCard { width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 8px; padding: 28px 28px 30px; border-radius: 18px; background: linear-gradient(180deg, rgba(255, 255, 255, .06) 0%, rgba(255, 255, 255, .02) 100%), #14342a; border: 1px solid rgba(255, 255, 255, .09); box-shadow: 0 12px 32px rgba(0, 0, 0, .25); }
h1 { margin: 0; font-size: 20px; font-weight: 800; letter-spacing: -.2px; }
.hint { margin: 0 0 8px; font-size: 12.5px; color: var(--muted); line-height: 1.45; }
label { font-size: 11px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: var(--muted); margin-top: 8px; }
input[type=text], input[type=password] { width: 100%; font: inherit; font-size: 14px; color: var(--text); background: rgba(255, 255, 255, .06); border: 1px solid var(--line); border-radius: 10px; padding: 11px 12px; }
input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-color: transparent; }
.pwWrap { position: relative; }
.pwWrap input { padding-right: 44px; }
.pwToggle { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; }
.pwToggle:hover, .pwToggle[aria-pressed="true"] { color: var(--accent); }
.pwToggle:focus-visible { outline: 2px solid var(--accent); }

.btn-lineOnly-Light { margin-top: 18px; align-self: stretch; font: inherit; font-size: 13px; font-weight: 700; letter-spacing: 1px; color: var(--accent); background: transparent; text-align: center; border: 2px solid var(--accent); padding: 10px 30px; border-radius: 10px; cursor: pointer; transition: background-color .3s ease, color .3s ease, box-shadow .3s ease; }
.btn-lineOnly-Light:hover:not(:disabled) { background: var(--accent); color: var(--bg); box-shadow: 0 0 18px rgba(120, 249, 173, .35); }
.btn-lineOnly-Light:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.btn-lineOnly-Light:disabled { opacity: .7; cursor: default; }

.msg { display: none; margin: 0; font-size: 12.5px; font-weight: 600; padding: 9px 12px; border-radius: 10px; color: var(--err); background: rgba(220, 38, 41, .12); border: 1px solid rgba(220, 38, 41, .35); }
.msg.show { display: block; }
.foot { margin: 8px 0 0; font-size: 11.5px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
