/* ═══════════════════════════════════════
   SHARED – comune a tutte le pagine
   ═══════════════════════════════════════ */

/* ── VARIABILI ── */
:root {
  --primary:       #312783;
  --primary-light: #edeafb;   /* lavender: tinta viola, era azzurro */
  --accent:        #e8a020;
  --green:         #22a05a;
  --red:           #d63031;
  --gray:          #6b7280;
  --bg:            #f5f4fb;   /* sfondo leggermente viola, era azzurro */
  --card:          #ffffff;
  --border:        #dfdcee;   /* bordo viola-grigio, era azzurro */
  --text:          #1c1a30;   /* quasi nero con tinta viola */
  --text-light:    #8880aa;   /* grigio-viola, era azzurro */
}

* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }

body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; background: var(--bg); color: var(--text); }

/* ── HEADER BASE ── */
header { background: var(--primary); color: #fff; display: flex; align-items: center; box-shadow: 0 2px 8px rgba(0,0,0,.2); flex-shrink: 0; }
.header-logo { font-weight: 700; }
.header-logo span { color: var(--accent); }
.header-sub { font-size: .72rem; opacity: .75; margin-top: 1px; }

/* ── CARD BASE ── */
.card { background: var(--card); border: 1px solid var(--border); }
.card-title { font-weight: 700; color: var(--primary); display: flex; align-items: center; gap: 8px; }

/* ── BADGE ── */
.badge        { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: .72rem; font-weight: 600; white-space: nowrap; }
.badge-green  { background: #d4f4e2; color: #1a7a44; }
.badge-red    { background: #fde8e8; color: #a02020; }
.badge-orange { background: #fef0d0; color: #875500; }
.badge-indigo { background: #ede9fe; color: #312783; }

/* ── BUTTONS BASE ── */
.btn         { display: inline-flex; align-items: center; border: none; cursor: pointer; font-weight: 600; transition: opacity .15s, transform .1s; touch-action: manipulation; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-success { background: var(--green); color: #fff; }
.btn-outline { background: #fff; color: var(--primary); border: 1.5px solid var(--primary); }
.btn-full    { width: 100%; justify-content: center; }

/* ── FORM BASE ── */
.form-group label { font-size: .78rem; font-weight: 600; color: var(--gray); }
input:focus, select:focus, textarea:focus { border-color: var(--primary); outline: none; }

/* input valorizzato: sfondo lavanda, bordo primario attenuato */
input:not(:placeholder-shown),
textarea:not(:placeholder-shown) {
  background: var(--primary-light);
  border-color: color-mix(in srgb, var(--primary) 40%, transparent);
}
/* select: necessita attributo data-filled="1" settato via JS */
select[data-filled="1"] {
  background: var(--primary-light);
  border-color: color-mix(in srgb, var(--primary) 40%, transparent);
}

/* ── LOGIN COMUNE ── */
.login-divider { display: flex; align-items: center; gap: 10px; margin: 18px 0; color: var(--text-light); font-size: .78rem; }
.login-divider::before, .login-divider::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.login-error { color: var(--red); font-size: .82rem; min-height: 18px; margin-bottom: 10px; }

/* ── TOAST BASE ── */
#toast {
  position: fixed; left: 50%; transform: translateX(-50%);
  background: #222; color: #fff; padding: 10px 22px; border-radius: 24px;
  font-size: .85rem; opacity: 0; pointer-events: none; transition: opacity .3s;
  z-index: 999; white-space: nowrap; box-shadow: 0 4px 16px rgba(0,0,0,.3);
}
#toast.show { opacity: 1; }

/* ── LOGO IULM ── */
.login-iulm-logo { display: block; width: 200px; height: auto; margin: 0 auto 18px; }
.header-iulm-logo { height: 36px; width: auto; }