/* A.L.Fa. Campus UI — interfaccia accessibile con fondale dinamico di brand. */
:root{
  --blue:#123f69;
  --navy:#082640;
  --accent:#287aae;
  --gold:#d3aa57;
  --gold-light:#f0d799;
  --gold-ink:#7d5b16;
  --bg:#f3f7fb;
  --surface:#fff;
  --soft:#eaf2f8;
  --text:#12263a;
  --muted:#60758a;
  --line:#d6e2ec;
  --danger:#aa3048;
  --shadow:0 12px 34px rgba(16,54,84,.08);
  --radius:20px;
  --campus-blue:#3d86b8;
  --campus-ice:#eaf5fb;
}

body{
  background:#f3f7fb;
  color:var(--text);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

body[data-theme=dark]{
  --bg:#091723;
  --surface:#102536;
  --soft:#173246;
  --text:#eef7fc;
  --muted:#abc0cf;
  --line:#29475a;
  --accent:#78b9df;
  --gold-ink:#f0d799;
  --shadow:0 16px 38px rgba(0,0,0,.28);
  --campus-ice:#102b3e;
}

#app{
  position:relative;
  min-height:100vh;
  overflow-x:clip;
  background:
    linear-gradient(180deg,rgba(255,255,255,.72),rgba(243,247,251,.94) 390px),
    #f3f7fb !important;
}

body[data-theme=dark] #app{
  background:linear-gradient(180deg,rgba(9,23,35,.78),rgba(9,23,35,.97) 390px),#091723 !important;
}

#app::before{
  content:"";
  position:fixed;
  z-index:0;
  inset:72px 0 0;
  pointer-events:none;
  background:url("assets/alfa-campus-pattern.svg") center top/cover no-repeat;
  opacity:.42;
}

#app>.topbar,#app>.layout,#app>.catalog-onboarding,#app>.onboarding,#app>.boot{
  position:relative;
  z-index:1;
}

/* Il precedente fondale generico resta disattivato. */
.area-atmosphere{display:none!important}
.home-scene-light,.home-scene-trajectory,.home-particle,.area-ribbon-glow,
.area-ribbon-grid,.area-ribbon-status i,.area-spark,.news-orbs *,
.news-spark,.scene-signal,.scene-gear,.scene-spark,.scene-terrain,
.scene-hiker,.scene-atom,.scene-pulse,.scene-heart,.scene-bar,
.scene-trend,.scene-network circle,.scene-book,.scene-book-star,.scene-star{
  animation:none!important;
}

/* Fondale dinamico A.L.Fa.: movimento molto lento, dietro a tutti i contenuti. */
.alfa-logo-atmosphere{
  position:fixed;
  z-index:0;
  inset:72px 0 0;
  overflow:hidden;
  pointer-events:none;
  contain:paint;
}
.alfa-float{
  position:absolute;
  display:block;
  width:clamp(190px,28vw,470px);
  height:auto;
  opacity:.065;
  user-select:none;
  mix-blend-mode:multiply;
  filter:saturate(.82) drop-shadow(0 22px 32px rgba(22,92,137,.14));
  will-change:transform;
}
.alfa-float-one{
  top:4%;right:-7%;
  animation:alfa-drift-one 24s ease-in-out infinite alternate;
}
.alfa-float-two{
  bottom:-13%;left:-7%;
  width:clamp(170px,23vw,360px);
  opacity:.052;
  animation:alfa-drift-two 31s ease-in-out -9s infinite alternate;
}
.alfa-float-three{
  right:28%;bottom:3%;
  width:clamp(120px,14vw,220px);
  opacity:.038;
  animation:alfa-drift-three 20s ease-in-out -5s infinite alternate;
}
.alfa-light{
  position:absolute;
  display:block;
  border-radius:50%;
  opacity:.34;
  filter:blur(2px);
  will-change:transform;
}
.alfa-light-one{
  width:42vw;height:42vw;right:-15vw;top:-14vw;
  background:radial-gradient(circle,rgba(72,155,205,.22),transparent 68%);
  animation:alfa-light-pulse 18s ease-in-out infinite alternate;
}
.alfa-light-two{
  width:36vw;height:36vw;left:-14vw;bottom:-16vw;
  background:radial-gradient(circle,rgba(211,170,87,.12),transparent 69%);
  animation:alfa-light-pulse 23s ease-in-out -7s infinite alternate-reverse;
}
body[data-theme=dark] .alfa-float{opacity:.085;mix-blend-mode:screen;filter:saturate(.8) brightness(1.1) drop-shadow(0 20px 34px rgba(91,174,222,.12))}
body[data-theme=dark] .alfa-float-two{opacity:.067}
body[data-theme=dark] .alfa-float-three{opacity:.052}
@keyframes alfa-drift-one{to{transform:translate(-44px,46px) rotate(-4deg) scale(1.055)}}
@keyframes alfa-drift-two{to{transform:translate(54px,-38px) rotate(5deg) scale(.96)}}
@keyframes alfa-drift-three{to{transform:translate(-38px,-30px) rotate(-6deg) scale(1.08)}}
@keyframes alfa-light-pulse{to{transform:translate(-3vw,4vh) scale(1.14);opacity:.55}}

h1,h2,h3{color:var(--text)}
h1{font-weight:820;letter-spacing:-.045em}
h2{font-weight:760}

.topbar{
  position:sticky;
  top:0;
  z-index:80;
  padding:10px 24px;
  color:var(--text);
  border-bottom:1px solid rgba(28,89,130,.15);
  background:rgba(255,255,255,.9);
  box-shadow:0 6px 28px rgba(16,54,84,.06);
  -webkit-backdrop-filter:blur(16px) saturate(145%);backdrop-filter:blur(16px) saturate(145%);
}

body[data-theme=dark] .topbar{background:rgba(9,23,35,.9)}
.header-inner{max-width:1280px;min-height:62px}

.wordmark{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--navy);
  font-size:1.25rem;
  font-weight:850;
  letter-spacing:.04em;
}

.wordmark::before{
  content:"";
  width:52px;
  height:52px;
  flex:0 0 52px;
  border-radius:14px;
  background:url("assets/alfa-logo-app.png") center/contain no-repeat;
  box-shadow:inset 0 0 0 1px rgba(45,116,163,.12);
}

.wordmark span{
  color:var(--muted);
  font-size:.72rem;
  font-weight:650;
  letter-spacing:.02em;
  margin-top:3px;
}

body[data-theme=dark] .wordmark{color:#fff}
.topbar .wordmark{font-size:1.25rem}
.header-course{max-width:430px;color:var(--muted);font-size:.82rem;text-align:right}
.avatar{
  width:46px;height:46px;
  background:var(--navy);
  color:#fff;
  border:3px solid #dcecf6;
  box-shadow:0 7px 18px rgba(8,38,64,.18);
}

.layout{
  width:min(1280px,100%);
  grid-template-columns:226px minmax(0,1fr);
  gap:26px;
  padding:24px 22px 60px;
}

.nav{
  top:108px;
  padding:12px;
  border:1px solid rgba(28,89,130,.14);
  border-radius:22px;
  background:rgba(255,255,255,.84)!important;
  box-shadow:var(--shadow);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
}

body[data-theme=dark] .nav{background:rgba(16,37,54,.9)!important}
.nav::before{
  content:"Il tuo spazio";
  padding:8px 12px 10px;
  color:var(--muted);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.nav button{
  min-height:48px;
  padding:11px 13px;
  border:1px solid transparent;
  border-radius:13px;
  color:var(--muted);
  font-size:.88rem;
  transition:background-color .16s ease,color .16s ease,transform .16s ease;
}

.nav button:hover{background:var(--soft);color:var(--text);transform:translateX(2px)}
.nav button.active{
  color:#fff!important;
  border-color:#184f7a!important;
  background:linear-gradient(135deg,#0c3152,#1d5e8c)!important;
  box-shadow:0 9px 20px rgba(8,49,82,.2)!important;
}
.nav button.active .ico{color:var(--gold-light)!important}

main.content{
  width:100%;
  max-width:1030px;
  padding:13px 4px 48px;
  background:transparent!important;
}

main.content::before{display:none!important}
.connection{min-height:1.2em;margin:0 0 9px;color:var(--muted)}

.page-top{
  min-height:104px;
  align-items:flex-end;
  margin:0 0 18px;
  padding:8px 2px 15px;
  border-bottom:1px solid rgba(28,89,130,.14);
}

.page-top::after{display:none!important}
.page-top h1{margin-bottom:5px;font-size:clamp(2rem,4.5vw,3.15rem)}
.page-top .eyebrow{color:var(--accent);font-size:.7rem;font-weight:850;letter-spacing:.14em}

.card{
  border:1px solid rgba(28,89,130,.14);
  border-radius:20px;
  background:rgba(255,255,255,.92)!important;
  box-shadow:var(--shadow)!important;
}

body[data-theme=dark] .card{background:rgba(16,37,54,.94)!important}
.card:hover{border-color:rgba(40,122,174,.27)}

.hero{
  min-height:245px;
  display:grid;
  align-content:center;
  padding:32px;
  border:0;
  background:
    linear-gradient(112deg,rgba(6,36,60,.98),rgba(21,83,123,.93)),
    url("assets/alfa-campus-pattern.svg") center/cover!important;
  box-shadow:0 20px 44px rgba(8,38,64,.23)!important;
}

.hero h1,.hero h2,.hero .big-number{color:#fff}
.hero:after{right:34%;background:linear-gradient(transparent,rgba(240,215,153,.4),transparent)}
.hero .eyebrow,.hero .muted{color:#c9dce9}
.ring{width:122px;height:122px}
.hero-footer{margin-top:25px;padding-top:20px}

.quick-actions{gap:13px;margin:15px 0 3px}
.btn{
  min-height:50px;
  border-radius:13px;
  background:linear-gradient(135deg,#123f69,#246f9f);
  box-shadow:0 7px 17px rgba(18,63,105,.15);
}
.btn:hover{filter:brightness(1.06)}
.btn.secondary{background:var(--surface);box-shadow:none}
.btn.gold-btn{background:linear-gradient(135deg,#d2a854,#efd593);color:#1d2a36}
.icon-btn{border:1px solid var(--line)}

.field input,.field select,.field textarea{
  border-color:#cbdbe7;
  border-radius:12px;
  background:rgba(255,255,255,.9);
}
body[data-theme=dark] .field input,body[data-theme=dark] .field select,body[data-theme=dark] .field textarea{background:#102536}

.home-agenda{
  border-top:0;
  border-left:5px solid var(--accent);
  background:linear-gradient(120deg,rgba(255,255,255,.96),rgba(234,245,251,.94))!important;
}
.agenda-orbit{background:var(--navy)}
.agenda-day{border-color:#d8e6ef}
.agenda-day.is-today{border-color:var(--accent);background:#edf7fc}

.mobility-card{border-top:0;border-left:5px solid #3a8b7b}
.mobility-symbol{background:linear-gradient(145deg,#166f70,#2a9790)}
.support-card{border-top:0;border-left:5px solid var(--gold)}
.support-avatar{background:var(--navy)}

.calendar-dock{
  border-color:rgba(40,122,174,.2);
  background:rgba(255,255,255,.86);
  box-shadow:0 8px 20px rgba(16,54,84,.06);
}
.calendar-dock-date{background:var(--navy)}

.section-title{margin-top:30px}
.section-title h2{font-size:1.22rem}
.stat .value{color:var(--navy);font-size:1.8rem}
body[data-theme=dark] .stat .value{color:#fff}

.tabs button,.chips button{border-radius:999px;background:rgba(255,255,255,.84)}
.tabs button.selected,.chips button.selected{background:var(--navy);border-color:var(--navy)}

.timeline-year{border-color:rgba(28,89,130,.16);box-shadow:0 8px 22px rgba(16,54,84,.05)}
.timeline-year>summary{background:rgba(255,255,255,.85)}
.timeline-marker{background:var(--navy);color:var(--gold-light)}
.timeline-semester{background:rgba(241,247,251,.86)}
.study-activity{padding-block:19px}
.study-cfu{background:#e8f3fa;color:#155b88}
.plan-progress,.plan-progress h2,.plan-progress h3{color:#fff}
.plan-progress h2 small,.plan-progress p{color:#d8e6f0}
.bus-head h2,.bus-head h3{color:#fff}

.news-spotlight{
  border-top:0;
  border-left:5px solid var(--accent);
  background:linear-gradient(115deg,#edf7fc,#fff)!important;
}
.news-orbs{display:none}
.news-spark{background:var(--navy)}
.news-story{border-left:4px solid #75a9c9}
.news-story.is-urgent{border-top:1px solid rgba(28,89,130,.14);border-left-color:var(--gold)}

.install-nudge{
  right:24px;
  bottom:24px;
  border-color:rgba(255,255,255,.22);
  background:linear-gradient(135deg,#082b48,#1b668f);
}

/* Catalogo iniziale */
.catalog-onboarding{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:100vh;
  padding:28px 24px 100px;
  background:
    linear-gradient(180deg,rgba(7,37,61,.98) 0,rgba(16,67,101,.95) 410px,rgba(243,247,251,.97) 410px),
    url("assets/alfa-campus-pattern.svg") top center/cover no-repeat!important;
}
.catalog-onboarding::before,
.catalog-onboarding::after{
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  background:url("assets/alfa-logo-app.png") center/contain no-repeat;
  opacity:.095;
  filter:brightness(1.42) saturate(.72);
  will-change:transform;
}
.catalog-onboarding::before{
  width:min(43vw,520px);height:min(43vw,520px);right:-7vw;top:-65px;
  animation:catalog-alfa-drift 25s ease-in-out infinite alternate;
}
.catalog-onboarding::after{
  width:min(24vw,290px);height:min(24vw,290px);left:4vw;top:245px;
  opacity:.055;
  animation:catalog-alfa-drift-small 20s ease-in-out -7s infinite alternate;
}
@keyframes catalog-alfa-drift{to{transform:translate(-45px,35px) rotate(-4deg) scale(1.06)}}
@keyframes catalog-alfa-drift-small{to{transform:translate(35px,-24px) rotate(5deg) scale(.94)}}

.catalog-hero{
  max-width:1220px;
  grid-template-columns:280px minmax(0,1fr);
  gap:64px;
  padding:18px 8px 66px;
}
.catalog-hero .wordmark{align-self:start;color:#fff;font-size:1.6rem}
.catalog-hero .wordmark::before{width:76px;height:76px;flex-basis:76px;border-radius:19px}
.catalog-hero .wordmark span{color:#cfe0ec}
.catalog-hero h1{max-width:850px;font-size:clamp(2.5rem,6vw,5.2rem);color:#fff;letter-spacing:-.055em}
.catalog-hero p{max-width:680px;color:#d6e5ee;font-size:1.12rem}
.catalog-hero-benefits{display:flex;flex-wrap:wrap;gap:8px;margin-top:21px}
.catalog-hero-benefits span{padding:7px 10px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.08);color:#eef7fb;font-size:.75rem;font-weight:700}

.catalog-browser{max-width:1220px}
.catalog-search-panel{padding:20px;border:0;border-radius:22px;box-shadow:0 22px 52px rgba(6,37,61,.16)}
.catalog-search{border-color:#dce8f0;background:#f2f7fa}
.catalog-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(40,122,174,.1)}
.catalog-search input{min-height:66px;font-size:1.06rem}
.catalog-filters select{border-color:#d4e1ea;background:#fff}
.catalog-results-head{padding:7px 2px}
.catalog-results-head h2{font-size:1.8rem}
.catalog-course-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.catalog-course-card{
  min-height:235px;
  padding:21px;
  border:1px solid rgba(28,89,130,.13);
  border-top:5px solid var(--course-color);
  border-radius:18px;
  box-shadow:0 9px 24px rgba(14,57,87,.07);
}
.catalog-course-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--course-color) 38%,#d7e4ed);box-shadow:0 18px 38px rgba(14,57,87,.13)}
.catalog-course-name{font-size:1.2rem}
.catalog-card-action{display:flex;align-items:center;justify-content:space-between;margin-top:14px;color:var(--course-color);font-size:.76rem;font-weight:800}
.catalog-selection{bottom:18px;border:1px solid rgba(255,255,255,.18);background:rgba(7,37,61,.96);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}

.onboarding{max-width:660px}
.onboarding .brand-panel{
  min-height:150px;
  display:flex;
  align-items:center;
  padding:28px;
  background:linear-gradient(120deg,#082d4a,#1b638f),url("assets/alfa-campus-pattern.svg") center/cover;
}
.onboarding .brand-panel .wordmark{color:#fff}
.onboarding .card{padding:30px}

dialog{border-radius:22px;border-color:rgba(28,89,130,.18)}

@media(min-width:1100px){
  .two-col-desktop{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
}

@media(max-width:900px){
  .catalog-hero{grid-template-columns:1fr;gap:30px}
  .catalog-course-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:800px){
  #app::before{inset:68px 0 0;background-size:auto 760px;background-position:center top;opacity:.55}
  .alfa-logo-atmosphere{inset:68px 0 0}
  .alfa-float-one{top:8%;right:-27%;width:310px;opacity:.052}
  .alfa-float-two{bottom:6%;left:-28%;width:245px;opacity:.043}
  .alfa-float-three{right:9%;bottom:28%;width:135px;opacity:.03}
  .topbar{padding:8px 14px}
  .header-inner{min-height:58px}
  .wordmark::before{width:45px;height:45px;flex-basis:45px;border-radius:12px}
  .topbar .wordmark{font-size:1.05rem}
  .layout{display:block;padding:0}
  main.content{padding:18px 14px calc(112px + env(safe-area-inset-bottom))}
  .nav{
    position:fixed;
    z-index:80;
    inset:auto 0 0;
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:minmax(68px,1fr);
    gap:3px;
    height:auto;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom));
    overflow-x:auto;
    border:0;
    border-top:1px solid var(--line);
    border-radius:18px 18px 0 0;
    background:rgba(255,255,255,.96)!important;
    box-shadow:0 -9px 30px rgba(8,38,64,.1);
  }
  body[data-theme=dark] .nav{background:rgba(16,37,54,.98)!important}
  .nav::before{display:none}
  .nav button,.nav button:hover{min-width:68px;padding:6px 4px;transform:none;font-size:.68rem}
  .nav button.active{background:#e5f1f8!important;color:var(--navy)!important;border-color:transparent!important;box-shadow:none!important}
  body[data-theme=dark] .nav button.active{background:#22475e!important;color:#fff!important}
  .nav button.active .ico{color:var(--accent)!important}
  .page-top{min-height:86px;padding-top:2px}
  .page-top h1{font-size:2rem}
  .hero{min-height:225px;padding:23px}
  #app .install-nudge{left:12px;right:12px;bottom:calc(86px + env(safe-area-inset-bottom))!important}
}

@media(max-width:600px){
  .catalog-onboarding{padding:17px 12px 110px;background:linear-gradient(180deg,#082d4a 0,#145b84 390px,#f3f7fb 390px)!important}
  .catalog-onboarding::before{width:310px;height:310px;right:-116px;top:40px;opacity:.085}
  .catalog-onboarding::after{width:170px;height:170px;left:-55px;top:275px;opacity:.045}
  .catalog-hero{padding:6px 5px 42px}
  .catalog-hero .wordmark::before{width:62px;height:62px;flex-basis:62px}
  .catalog-hero h1{font-size:2.5rem}
  .catalog-hero p{font-size:.96rem}
  .catalog-search-panel{padding:13px}
  .catalog-filters{grid-template-columns:1fr}
  .catalog-course-grid{grid-template-columns:1fr}
  .catalog-course-card{min-height:205px}
  .catalog-selection{grid-template-columns:1fr 105px;bottom:8px}
  .quick-actions{grid-template-columns:1fr}
  .hero-main{align-items:flex-start}
  .ring{width:98px;height:98px}
  .agenda-days{overflow-x:auto;grid-template-columns:repeat(5,minmax(82px,1fr));padding-bottom:4px}
}

@media(max-width:390px){
  .topbar .wordmark span{display:none}
  .header-inner{gap:8px}
  .avatar{width:42px;height:42px}
  main.content{padding-inline:11px}
  .card{padding:17px}
  .hero{padding:19px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
  .alfa-logo-atmosphere,.catalog-onboarding::before,.catalog-onboarding::after{transform:none!important}
}