@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=Sora:wght@500;600;700;800&display=swap');

:root{--color-primary:#1b3a5c;--color-primary-hover:#2c5d8f;--color-primary-active:#14304c;--color-accent:#e8703a;--color-accent-hover:#d45f2b;--color-bg:#f5f7f9;--color-surface:#fff;--color-surface-raised:#fff;--color-tint-primary:#e7eef4;--color-text:#1a2733;--color-text-secondary:#5b6b78;--color-text-muted:#8a97a3;--color-text-on-primary:#fff;--color-border:#e2e5e9;--color-success:#2e8b57;--color-success-soft:#e3f3ea;--color-warning:#d9822b;--color-warning-soft:#fbebda;--color-danger:#c4432e;--color-danger-soft:#f9e4e0;--shadow-sm:0 1px 2px rgb(26 39 51 / 6%);--shadow-md:0 4px 12px rgb(26 39 51 / 8%);--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-pill:999px;--font-display:Sora,system-ui,sans-serif;--font-body:'IBM Plex Sans',system-ui,sans-serif;--transition:220ms cubic-bezier(.4,0,.2,1)}
[data-theme=dark]{--color-primary:#4c86bf;--color-primary-hover:#6aa0d6;--color-primary-active:#3a6c9e;--color-bg:#10161c;--color-surface:#182029;--color-surface-raised:#1e2732;--color-tint-primary:#1a2733;--color-text:#eaeef2;--color-text-secondary:#a6b2bd;--color-text-muted:#6e7b87;--color-text-on-primary:#0e1418;--color-border:#2a343e;--color-success:#4fb077;--color-success-soft:#17291f;--color-warning:#e0a050;--color-warning-soft:#2e2415;--color-danger:#dd6a54;--color-danger-soft:#2e1b17;--shadow-sm:0 1px 2px rgb(0 0 0 / 30%);--shadow-md:0 4px 16px rgb(0 0 0 / 35%)}
*{box-sizing:border-box}body{margin:0;background:var(--color-bg);color:var(--color-text);font:15px/1.5 var(--font-body);-webkit-font-smoothing:antialiased;transition:background var(--transition),color var(--transition)}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}button:disabled{cursor:wait;opacity:.65}
.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top right,#e7eef4 0,var(--color-bg) 45%)}.login-card{width:min(100%,470px);padding:36px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.login-card h1{margin:8px 0;font:700 29px/1.2 var(--font-display);letter-spacing:-.03em}.login-card p{margin:0 0 28px;color:var(--color-text-secondary)}.eyebrow{color:var(--color-text-muted);font-size:11px;font-weight:700;letter-spacing:.16em}.login-form label{display:block;margin-bottom:7px;color:var(--color-text-secondary);font-size:13px;font-weight:600}.login-input-row{display:flex;gap:8px}.login-input-row input{min-width:0}
.shell{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:32px;max-width:1180px;margin:0 auto;padding:32px 24px 56px}.topbar{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-bottom:24px;border-bottom:1px solid var(--color-border)}.topbar h1{margin:5px 0 2px;font:700 27px/1.2 var(--font-display);letter-spacing:-.03em}.topbar p{margin:0;color:var(--color-text-secondary)}.topbar-actions{display:flex;align-items:center;gap:12px}.status{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--color-border);border-radius:var(--radius-pill);padding:9px 12px;background:var(--color-surface);color:var(--color-text-secondary);font-size:12px;font-weight:600}.status i{width:8px;height:8px;border-radius:50%;background:var(--color-warning)}.status.ok i{background:var(--color-success)}.theme-toggle{border:1px solid var(--color-border);border-radius:var(--radius-pill);padding:8px 12px;background:var(--color-surface);color:var(--color-text-secondary);font-size:12px;font-weight:600}.theme-toggle:hover{border-color:var(--color-primary);color:var(--color-primary)}
.tabs{grid-column:2;grid-row:2 / span 2;align-self:start;display:flex;flex-direction:column;gap:12px}.tab{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:var(--radius-md);padding:15px 18px;background:var(--color-primary);color:var(--color-text-on-primary);font-size:14px;font-weight:600;text-align:left;transition:transform 150ms ease,background 150ms ease}.tab::after{content:'+';display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:rgb(255 255 255 / 18%);font-size:17px;font-weight:400}.tab:hover{background:var(--color-primary-hover);transform:translateX(2px)}.tab.active{background:var(--color-accent)}.tab.active:hover{background:var(--color-accent-hover)}
.panel{display:none;grid-column:1;grid-row:2;padding:24px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.panel.active{display:block}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-heading h2{margin:5px 0 0;font:700 23px/1.2 var(--font-display);letter-spacing:-.025em}.hint{color:var(--color-text-muted);font-size:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px 20px}.form-grid label{color:var(--color-text-secondary);font-size:12px;font-weight:600}.form-grid input,.form-grid select,.form-grid textarea{display:block;width:100%;margin-top:7px;padding:10px 12px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-raised);color:var(--color-text);font-size:14px;transition:border var(--transition),box-shadow var(--transition)}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px rgb(44 93 143 / 13%);outline:0}.wide{grid-column:1/-1}.optional{color:var(--color-text-muted);font-weight:400}.check{display:flex;align-items:center;gap:9px}.check input{width:16px;margin:0}.actions{display:flex;align-items:center;gap:14px}.btn,button.primary,.monitor-toolbar button{border:0;border-radius:var(--radius-pill);padding:10px 16px;background:var(--color-primary);color:var(--color-text-on-primary);font-size:13px;font-weight:600;transition:background 150ms ease,transform 150ms ease}.btn:hover,button.primary:hover,.monitor-toolbar button:hover{background:var(--color-primary-hover)}.btn:active,button.primary:active{transform:translateY(1px)}.primary span{margin-left:8px;font-size:16px}.message{font-size:13px;color:var(--color-text-secondary)}.message.success{color:var(--color-success)}.message.error{color:var(--color-danger)}
.records{margin-top:28px;padding-top:14px;border-top:1px solid var(--color-border)}.record{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--color-border);font-size:13px}.record strong{display:block;color:var(--color-text)}.record small{display:block;margin-top:3px;color:var(--color-text-secondary)}.badge{display:inline-flex;align-items:center;border-radius:var(--radius-sm);padding:4px 8px;background:var(--color-tint-primary);color:var(--color-primary);font-size:11px;font-weight:600}.record-actions{display:flex;align-items:center;gap:8px}.edit-button{border:1px solid var(--color-border);border-radius:var(--radius-pill);padding:6px 10px;background:transparent;color:var(--color-text-secondary);font-size:11px;font-weight:600}.edit-button:hover{border-color:var(--color-primary);color:var(--color-primary)}.monitor-toolbar{display:flex;align-items:center;gap:8px}.monitor-toolbar select{width:auto;margin:0;padding:8px 10px;font-size:12px}.monitor-toolbar button{padding:8px 12px;border-radius:var(--radius-sm)}.monitor-note{margin-top:-12px}.email-record{align-items:flex-start}.status-badge.pending{background:var(--color-warning-soft);color:var(--color-warning)}.status-badge.processing{background:var(--color-tint-primary);color:var(--color-primary)}.status-badge.sent{background:var(--color-success-soft);color:var(--color-success)}.status-badge.failed{background:var(--color-danger-soft);color:var(--color-danger)}code{border-radius:4px;padding:2px 5px;background:var(--color-tint-primary);color:var(--color-primary)}:where(#app-shell)[hidden]{display:none!important}
@media(max-width:860px){.shell{display:block;padding:24px 16px 40px}.topbar{margin-bottom:22px}.tabs{flex-direction:row;overflow-x:auto;margin:0 0 18px;padding-bottom:3px}.tab{min-width:175px}.panel{padding:20px}.topbar-actions{margin-top:12px}.topbar{align-items:flex-start}}@media(max-width:600px){.topbar,.section-heading{display:block}.topbar-actions{justify-content:space-between}.section-heading .hint,.monitor-toolbar{margin-top:14px}.form-grid{grid-template-columns:1fr}.wide{grid-column:auto}.actions{display:block}.actions .message{margin-top:10px}.login-card{padding:28px 22px}.login-input-row{display:block}.login-input-row button{width:100%;margin-top:10px}.record{align-items:flex-start;flex-direction:column}.record-actions{align-self:flex-end}}

/* Controlli uniformi: dimensioni, stati e contrasto condivisi in tutta la console. */
button{border:1px solid transparent;transition:background 150ms ease,border-color 150ms ease,color 150ms ease,box-shadow 150ms ease,transform 150ms ease}
input,select,textarea{border-color:var(--color-border);background:var(--color-surface-raised);color:var(--color-text);transition:border-color var(--transition),box-shadow var(--transition),background var(--transition)}
input::placeholder,textarea::placeholder{color:var(--color-text-muted);opacity:.85}
input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb,var(--color-primary) 42%,var(--color-border))}
input:focus,select:focus,textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px rgb(44 93 143 / 13%);outline:0}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--color-text-secondary) 50%),linear-gradient(135deg,var(--color-text-secondary) 50%,transparent 50%);background-position:calc(100% - 16px) calc(50% - 2px),calc(100% - 11px) calc(50% - 2px);background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:34px}
.login-form>input,.login-input-row input{display:block;width:100%;padding:11px 13px}.login-form>input{margin-bottom:16px}.login-input-row{gap:10px}
.theme-toggle,#logout-button{border-color:var(--color-border);background:var(--color-surface)}.theme-toggle:hover,#logout-button:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-tint-primary)}
.check input{width:17px;height:17px;margin:0;accent-color:var(--color-primary);box-shadow:none}.check input:focus{box-shadow:none}
@media(max-width:600px){.login-input-row{display:block}.login-input-row button{margin-top:10px}}

/* Login: campi più leggibili e proporzionati alla card. */
.login-form{margin-top:4px}
.login-form label{margin-bottom:8px;letter-spacing:.01em}
.login-form>input,.login-input-row input{height:46px;padding:0 14px;border-radius:10px;background:var(--color-bg);font-size:15px;box-shadow:inset 0 1px 2px rgb(26 39 51 / 4%)}
.login-form>input{margin-bottom:18px}
.login-input-row{display:flex;align-items:stretch;gap:10px}
.login-input-row input{flex:1}
.login-input-row button{min-width:92px;height:46px;border-radius:10px;box-shadow:0 3px 8px rgb(27 58 92 / 18%)}
.login-form>input:focus,.login-input-row input:focus{background:var(--color-surface);box-shadow:0 0 0 3px rgb(44 93 143 / 13%),inset 0 1px 2px rgb(26 39 51 / 4%)}
.login-form .message{min-height:20px;margin-top:14px}
@media(max-width:600px){.login-input-row{display:block}.login-input-row button{width:100%;margin-top:12px}}
