:root {
  --cedoly-primary: #054C5C;
  --cedoly-primary-rgb: 5, 76, 92;
  --cedoly-accent: #3DD2A9;
  --cedoly-accent-rgb: 61, 210, 169;
  --cedoly-on-primary: #ffffff;
  --cedoly-focus-ring: rgba(61, 210, 169, .38);
  --cedoly-spinner-track: rgba(5, 76, 92, .20);
  --cedoly-spinner-active: rgba(5, 76, 92, .95);

  /* Alias compatibili: mantengono stabili i selettori e gli identificatori esistenti. */
  --ilp-brand: var(--cedoly-primary);
  --ilp-brand-rgb: var(--cedoly-primary-rgb);
  --brand: var(--cedoly-primary);
  --brand-rgb: var(--cedoly-primary-rgb);
  --blue: var(--cedoly-primary);
  --accent: var(--cedoly-accent);
}

html {
  accent-color: var(--cedoly-primary);
}

::selection {
  color: var(--cedoly-primary);
  background: rgba(var(--cedoly-accent-rgb), .34);
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline-color: var(--cedoly-accent);
}

.cedolyLogo,
.brandLogo,
.ilpFooterLogo,
.dashAuthLogo,
.jetAuthLogo,
.sideFooterLogoImg {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  background: transparent;
}

/* ========================================================================== 
   Cedoly loading indicator — unica grammatica grafica
   Il riferimento è lo spinner usato dalla navigazione SoftNav tra le pagine.
   Manteniamo le logiche esistenti e uniformiamo soltanto la resa visiva.
   ========================================================================== */
@keyframes cedolySpinnerSpin {
  to { transform: rotate(360deg); }
}

/* Loader principali / full-screen: stessa misura e stesso anello. */
html body #ilpNavSpinner .ilpNavSpinnerRing,
html body .authSessionGate__spinner,
html body .pendingSpinner,
html body .bootSpinner .spin,
html body .pageLoadSpinner,
html body .iosSpinner12,
html body .winSpinner,
html body .timeQrScanLoaderSpinner {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
  border-radius: 50% !important;
  border: 3px solid var(--cedoly-spinner-track) !important;
  border-top-color: var(--cedoly-spinner-active) !important;
  background: transparent !important;
  background-image: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  box-shadow: none !important;
  filter: none !important;
  animation: cedolySpinnerSpin .85s linear infinite !important;
  transform-origin: 50% 50% !important;
}

/* Dashboard admin: durante la revalidazione i dati restano visibili.
   L'overlay iniziale .pageLoadOverlay mantiene invece il proprio fondo. */
html body #sectionLoadOverlay.sectionLoadOverlay {
  background: transparent !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

/* Il vecchio spinner iOS a 12 barre e quello SVG diventano lo stesso anello. */
html body .iosSpinner12 > span {
  display: none !important;
  animation: none !important;
}
html body .iosSpinner12::before {
  content: none !important;
  display: none !important;
}
html body .winSpinner > .winSpinnerSvg {
  display: none !important;
  animation: none !important;
}
html body #adminModal #payrollStepExtract .iosSpinner12 {
  width: 44px !important;
  height: 44px !important;
}

/* Loader compatti: stessa forma, stessa velocità, dimensione adatta al controllo. */
html body .authSpinner,
html body .jetWaitSpinner,
html body .jetAuthSpinner,
html body .dashWaitSpinner,
html body .dashAuthSpinner,
html body .pdfLoadingSpinner,
html body .rowSpinner {
  box-sizing: border-box !important;
  border-radius: 50% !important;
  border-style: solid !important;
  border-color: var(--cedoly-spinner-track) !important;
  border-top-color: var(--cedoly-spinner-active) !important;
  background: transparent !important;
  background-image: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  box-shadow: none !important;
  filter: none !important;
  animation: cedolySpinnerSpin .85s linear infinite !important;
  transform-origin: 50% 50% !important;
}

/* Su CTA piene l'anello resta identico ma usa il contrasto bianco. */
html body #authOverlay .jetAuthPrimary .jetAuthSpinner,
html body #dashAuthOverlay .dashAuthPrimary .dashAuthSpinner {
  border-color: rgba(255, 255, 255, .34) !important;
  border-top-color: #ffffff !important;
}

/* ========================================================================== 
   Auth: testata stabile tra "Crea il tuo account" e "Accedi".
   Il titolo duplicato sopra lo switch non serve e la card cresce solo verso il basso.
   ========================================================================== */
html body #authOverlay.authOverlay {
  align-items: flex-start !important;
  padding: max(56px, calc(env(safe-area-inset-top, 0px) + 40px)) 20px 48px !important;
}
html body #authOverlay .jetAuthPage {
  margin: 0 auto !important;
}
html body #authOverlay .jetAuthCardTop {
  display: none !important;
}

/* Il selettore Accedi / Crea account è già sufficiente: nessun banner di stato duplicato. */
html body #authOverlay .jetAuthReason,
html body #authOverlay #authReason {
  display: none !important;
}

/* Home: il banner operativo continua sempre, anche al passaggio del mouse. */
html body .ilpTrustBarStrip,
html body .ilpTrustBarStrip:hover {
  animation-play-state: running !important;
}

/* Mobile header: usa il logo Cedoly completo e distribuisce meglio gli spazi. */
@media (max-width: 720px) {
  html body header.headerRow[data-ilp-header="1"] .headerInner {
    padding-left: max(14px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(10px, env(safe-area-inset-right, 0px)) !important;
  }
  html body header.headerRow[data-ilp-header="1"] .headerMain {
    width: 100% !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }
  html body header.headerRow[data-ilp-header="1"] .brand {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  html body header.headerRow[data-ilp-header="1"] .titleWrap,
  html body header.headerRow[data-ilp-header="1"] .brandLink,
  html body header.headerRow[data-ilp-header="1"] .brandPicture {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
  }
  html body header.headerRow[data-ilp-header="1"] .brandLogo {
    content: url('/immagini/logo-cedoly.png') !important;
    width: clamp(104px, 31vw, 128px) !important;
    height: auto !important;
    max-height: 38px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }
  html body header.headerRow[data-ilp-header="1"] .statusRow {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
  }
  html body header.headerRow[data-ilp-header="1"] .hamburgerBtn {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
  }
}

@media (max-width: 520px) {
  html body #authOverlay.authOverlay {
    padding: max(44px, calc(env(safe-area-inset-top, 0px) + 28px)) 14px 28px !important;
  }
  html body header.headerRow[data-ilp-header="1"] .brandLogo {
    width: clamp(98px, 30vw, 118px) !important;
  }
}


/* Shared waiting surface for sign-in and the dedicated company onboarding. */
@font-face{font-family:"DM Sans";src:url('/cedoly-site/dmsans-variable.ttf') format('truetype');font-weight:100 1000;font-display:swap}
@keyframes cedolyWaitEnter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.cedolyWait{box-sizing:border-box;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:32px max(24px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));background:#fff;color:#031f27;font-family:"DM Sans",Arial,sans-serif;text-align:center;font-synthesis:none;-webkit-font-smoothing:antialiased}
.cedolyWait *{box-sizing:border-box}
.cedolyWait [hidden],.cedolyWait[hidden]{display:none!important}
.cedolyWait__header{width:min(100%,1040px);min-height:44px;display:flex;align-items:center;flex:0 0 auto;text-align:left}
.cedolyWait__header img{display:block;width:148px;height:40px;object-fit:contain}
.cedolyWait__content{width:min(100%,620px);margin:auto;padding:64px 0 88px;animation:cedolyWaitEnter .24s ease-out both}
.cedolyWait__indicator{display:grid;place-items:center;width:76px;height:76px;margin:0 auto 28px;border-radius:50%;background:transparent;color:#003d4c}
.cedolyWait__spinner{display:block;width:44px;height:44px;box-sizing:border-box;border:3px solid rgba(0,61,76,.13);border-top-color:#003d4c;border-radius:50%;animation:cedolySpinnerSpin .85s linear infinite}
.cedolyWait h1{margin:0;font:750 clamp(36px,4.7vw,56px)/1.08 "DM Sans",Arial,sans-serif;letter-spacing:-.035em;text-wrap:balance;outline:none}
.cedolyWait__message{max-width:440px;min-height:56px;margin:22px auto 0;color:#52636b;font-size:17px;line-height:1.65;text-wrap:pretty}
.cedolyWait__actions{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:24px}
.cedolyWait__actions:has(> [hidden]:only-child),.cedolyWait__actions:not(:has(> :not([hidden]))){display:none}
.cedolyWait__action,.cedolyWait__secondary{min-height:52px;border:0;border-radius:100px;padding:14px 28px;font:650 16px/1.4 "DM Sans",Arial,sans-serif;cursor:pointer;touch-action:manipulation;transition:background-color .32s ease-in-out,color .32s ease-in-out,border-color .32s ease-in-out}
.cedolyWait__action{min-width:180px;background:#18e0ab;color:#031f27}
.cedolyWait__secondary{background:transparent;color:#52636b;font-weight:500;text-decoration:underline;text-underline-offset:4px}
.cedolyWait button:focus-visible{outline:3px solid #003d4c;outline-offset:4px}
.cedolyWait[data-state="error"] .cedolyWait__spinner{display:none}
.cedolyWait[data-state="error"] .cedolyWait__indicator{background:#eef3f2}
.cedolyWait[data-state="error"] .cedolyWait__indicator::after{content:"!";font-size:32px;font-weight:600}
html body .authSessionGate.cedolyWait{justify-content:flex-start;overflow-y:auto;background:#fff}
@media(hover:hover) and (pointer:fine){.cedolyWait__action:hover{background:#35e5b8}}
@media(max-width:600px){.cedolyWait{padding-top:max(24px,env(safe-area-inset-top));padding-right:max(22px,env(safe-area-inset-right));padding-left:max(22px,env(safe-area-inset-left))}.cedolyWait__header{min-height:34px}.cedolyWait__header img{width:112px;height:30px}.cedolyWait__content{padding:48px 0 64px}.cedolyWait__indicator{width:64px;height:64px;margin-bottom:24px}.cedolyWait__message{font-size:16px}.cedolyWait__action{width:min(100%,360px)}}
@media(prefers-reduced-motion:reduce){.cedolyWait__content,.cedolyWait__spinner{animation:none}.cedolyWait__action,.cedolyWait__secondary{transition:none}.cedolyWait__action:hover{transform:none}}

.cedolyWait__action:active{background:#20d5a5}
.cedolyWait__secondary:hover{color:#124450}
.cedolyWait__secondary:active{color:#031f27}

.cedolyWait__action,.cedolyWait__secondary{-webkit-tap-highlight-color:transparent}
