.payrollCard{position:relative;overflow:hidden;border-radius:22px;padding:18px;border:1px solid rgba(15,23,42,.06);background:#fff;box-shadow:0 18px 42px rgba(15,23,42,.12);display:flex;flex-direction:column;gap:12px}
.pcHead{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pcTitle{font-size:18px;font-weight:900;letter-spacing:-0.01em;color:var(--text)}
.pcSub{font-size:13px;font-weight:800;color:var(--muted)}
.pcBody{display:flex;flex-direction:column;gap:10px}
.pcActionRow{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.pcHint{font-size:12.5px;color:var(--muted);font-weight:800}
.pcBadge{padding:8px 12px;border-radius:14px;background:rgba(5,76,92,.12);color:#054C5C;font-weight:900;border:1px solid rgba(5,76,92,.2)}
.payrollBtn{border:1px solid #cdd3dd;background:#e7eaef;color:var(--text);padding:12px 14px;border-radius:14px;font-weight:850;cursor:pointer;position:relative;overflow:hidden;isolation:isolate;box-shadow:none}
.payrollBtn.primary{background:#054C5C;color:#fff;border-color:#054C5C;box-shadow:none}
.payrollBtn.ghost{background:transparent;color:var(--text);border-color:var(--stroke)}
.payrollPill{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;border:1px solid rgba(0,0,0,.08);background:rgba(0,0,0,.02);font-weight:850;font-size:12px}
.payrollOverlay{position:fixed;inset:0;z-index:990;display:none;align-items:flex-start;justify-content:center;padding:calc(26px + var(--safe-top)) calc(18px + var(--safe-right)) calc(26px + var(--safe-bot)) calc(18px + var(--safe-left));background:rgba(0,0,0,.26);backdrop-filter:blur(10px);overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.payrollSheet{width:min(1100px,92vw);max-height:min(82dvh, calc(var(--app-height) * 0.82));overflow:hidden;display:flex;flex-direction:column;gap:12px;border-radius:22px;background:#fff;border:1px solid rgba(12,16,26,.08);box-shadow:0 24px 70px rgba(15,23,42,.16);padding:18px;align-self:flex-start}
.payrollTop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.payrollTitle{font-size:24px;font-weight:950;letter-spacing:-0.02em}
.payrollSub{font-size:13px;font-weight:820;color:var(--muted)}
.payrollBadgeRow{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.payrollSteps{display:flex;flex-direction:column;gap:12px}
.payrollPane{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:18px;border:1px solid var(--stroke);background:#fff}
.payrollGrid{display:grid;grid-template-columns:minmax(320px,1fr) minmax(280px,0.9fr);gap:12px;align-items:start}
.dropArea{border:1.5px dashed rgba(5,76,92,.28);border-radius:16px;padding:14px;background:rgba(5,76,92,.04);display:flex;flex-direction:column;gap:10px;cursor:pointer;transition:background .18s ease,border-color .18s ease}
.dropArea:hover:not(.locked):not(.drag){background:rgba(5,76,92,.08);border-color:rgba(5,76,92,.4)}
.dropArea.drag{border-color:rgba(5,76,92,.6);background:rgba(5,76,92,.12)}
.dropArea.locked{opacity:.78}

.uploadActions{display:flex;flex-wrap:wrap;gap:10px}
.progressShell{border:1px solid var(--stroke);border-radius:14px;overflow:hidden;background:rgba(0,0,0,.04);width:100%}
.progressLabel{padding:10px 12px;font-weight:850;font-size:13px;color:var(--muted);transition:opacity .55s ease}
.progressBar{width:100%;height:14px;background:rgba(0,0,0,.06)}
.progressFill{height:14px;background:linear-gradient(90deg,#054C5C,#054C5C);width:0%;transition:width .28s ease;will-change:width}
.progressShell.big .progressBar{height:16px}
.progressShell.big .progressFill{height:16px}

/* Upload progress: rotellina iOS */
.progressShell.progressAsSpinner{overflow:visible;border-color:rgba(5,76,92,.20);background:rgba(5,76,92,.04)}
.progressSpinRow{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px 12px;text-align:center}
.progressShell.progressAsSpinner .progressLabel{padding:0;font-size:14px;font-weight:900;color:rgba(12,16,26,.78)}
.progressShell.progressAsSpinner .progressBar{display:none!important}
.progressShell.progressAsSpinner .iosSpinner12{transform:scale(1.05);transform-origin:center;filter:drop-shadow(0 14px 30px rgba(15,23,42,.12))}
.progressShell.progressAsSpinner .iosSpinner12::before{content:"";position:absolute;left:50%;top:50%;width:64px;height:64px;transform:translate(-50%,-50%);border-radius:999px;background:rgba(5,76,92,.06);border:1px solid rgba(5,76,92,.14)}
.progressShell.progressAsSpinner .iosSpinner12 span{z-index:1}

.historyActions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 6px}
.pillBtn.danger{background:rgba(255,59,48,.12);border-color:rgba(255,59,48,.25);color:var(--bad)}
.historyCheck{display:flex;align-items:center;justify-content:center}
.historyCk{width:16px;height:16px}

.sendList{display:flex;flex-direction:column;gap:8px;max-height:360px;overflow:auto;padding-right:6px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.sendItem{display:flex;align-items:center;justify-content:space-between;border:1px solid rgba(0,0,0,.12);border-radius:16px;padding:10px 12px;background:rgba(255,255,255,.92)}
.sendLeft{display:flex;flex-direction:column;gap:2px;min-width:0}
.sendName{font-weight:850;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sendEmail{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sendStatus{font-weight:850;font-size:12px;color:var(--muted);white-space:nowrap}
.sendStatus.ok{color:var(--good)}
.sendStatus.err{color:var(--bad)}
.sendStatus.run{color:var(--primary)}

table.dirTable th:last-child, table.dirTable td:last-child{width:90px;text-align:right;white-space:nowrap;color:var(--muted);font-weight:850}

@media (max-width:900px){
  #adminAbsenceHome{display:none!important;}
}
.table{width:100%;border-collapse:collapse;font-size:13px}
.table th,.table td{padding:10px;border-bottom:1px solid rgba(0,0,0,.06);text-align:left;vertical-align:top}
/* Linee verticali tra colonne */
.table th:not(:last-child),
.table td:not(:last-child){
  border-right:1px solid rgba(0,0,0,.06);
}
.payrollGroupedTable td{font-size:12px}
.badgeTone{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:12px;font-weight:800}
.badgeTone.tone-ok{background:rgba(52,199,89,.14);color:#0b5d2a}
.badgeTone.tone-warn{background:rgba(255,159,10,.16);color:#8a4b00}
.badgeTone.tone-bad{background:rgba(255,59,48,.16);color:#8a1f1a}
.snippet{max-width:320px;white-space:pre-wrap}
.rowsScroll{max-height:360px;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.payrollNonAdminCard{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:18px;border:1px solid var(--stroke);background:#fff;box-shadow:0 14px 32px rgba(15,23,42,.1)}
.payrollNonAdminHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.payrollBadgeSmall{padding:8px 10px;border-radius:12px;background:rgba(0,0,0,.04);font-weight:850;font-size:12px;color:var(--muted)}
.payrollActionButtons{display:flex;flex-wrap:wrap;gap:10px}
.payrollChart{min-height:220px;border:1px dashed rgba(0,0,0,.08);border-radius:14px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-weight:800}
.payrollPreviewHint{padding:12px 14px;font-weight:820;color:var(--muted);background:linear-gradient(90deg,rgba(5,76,92,.12),rgba(255,255,255,.96))}
.payrollModalFrame{width:100%;height:440px;border:0;background:#fff;border-radius:14px;box-shadow:0 12px 28px rgba(15,23,42,.12)}
.pillGroup{display:flex;gap:8px;flex-wrap:wrap}
.payrollBadgeWarn{color:#8a4b00}
.payrollBadgeError{color:#8a1f1a}
.payrollInfo{color:var(--muted)}
.payrollInlineField{display:flex;flex-direction:column;gap:6px}
.payrollSelect{padding:10px 12px;border-radius:12px;border:1px solid var(--stroke);font-weight:850}
.payrollSearch{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.payrollHeroGreeting .headline{font-size:20px;font-weight:900}
.payrollHeroGreeting .lede{color:var(--muted);font-weight:800}
.payrollPreviewHint + iframe{width:100%;height:420px;border:0;display:block;background:#fff}
.payrollGlassRow{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px;margin-top:10px;align-items:stretch}
.payrollGlass{background:transparent;box-shadow:none;border:0}
.payrollChartCard{border:1px solid rgba(12,16,26,.08);border-radius:20px;padding:16px;background:#fff;box-shadow:0 16px 32px rgba(15,23,42,.12)}
.payrollPdfPreview{margin-top:14px;border:1px solid var(--stroke);border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 16px 32px rgba(15,23,42,.08)}
.payrollTabRow{display:flex;gap:10px;align-items:center;margin-top:10px;flex-wrap:wrap}
.payrollTab{border:1px solid var(--stroke);background:rgba(0,0,0,.04);padding:10px 14px;border-radius:12px;font-weight:850;cursor:pointer}
.payrollTab.active{background:rgba(5,76,92,.12);color:#054C5C;border-color:rgba(5,76,92,.24)}
.payrollHeroGreeting{display:flex;flex-direction:column;gap:6px}
.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-weight:900;font-size:12px;color:var(--muted)}
.payrollPagesMeta{font-weight:800;color:var(--muted)}
.payrollClose{border:1px solid var(--stroke);background:rgba(0,0,0,.04);border-radius:14px;width:42px;height:42px;font-size:20px;font-weight:900;cursor:pointer}
.directoryForm{display:none;flex-direction:column;gap:10px;margin-top:8px}
.directoryForm.isOpen{display:flex}
.dirActions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.pillBtn{border:1px solid var(--stroke);background:rgba(0,0,0,.04);padding:10px 12px;border-radius:14px;font-weight:850;position:relative;overflow:hidden;isolation:isolate}
.pillBtn.primary{background:rgba(5,76,92,.12);color:#054C5C;border-color:rgba(5,76,92,.2)}
.field{display:flex;flex-direction:column;gap:6px}
.field input{padding:10px 12px;border-radius:12px;border:1px solid var(--stroke);font-weight:850}
.payrollGroupedHint{padding:10px 12px;border-radius:12px;border:1px solid rgba(5,76,92,.22);background:rgba(5,76,92,.08);font-weight:820;color:#054C5C}
.adminModalOverlay{position:fixed;inset:0;z-index:1200;background:rgba(4,7,20,.56);backdrop-filter:blur(10px);display:flex;align-items:flex-start;justify-content:center;padding:calc(24px + var(--safe-top)) calc(14px + var(--safe-right)) calc(24px + var(--safe-bot)) calc(14px + var(--safe-left));overflow-y:auto;opacity:0;pointer-events:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.adminModalOverlay.show{opacity:1;pointer-events:auto}
.adminModalShell{width:min(1200px,96vw);background:#f8fafc;border-radius:26px;border:1px solid rgba(255,255,255,.6);box-shadow:0 26px 80px rgba(0,0,0,.2);overflow:hidden;display:flex;flex-direction:column;gap:14px;max-height:min(90dvh, calc(var(--app-height) - 24px));opacity:1}
.adminModalOverlay.show .adminModalShell{opacity:1}
.adminModalHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid rgba(0,0,0,.05);background:linear-gradient(120deg,rgba(255,255,255,.96),rgba(240,245,255,.92))}
.adminModalBody{padding:6px 16px 18px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
#sendLogModal .adminModalShell{width:min(980px,96vw);max-height:min(86dvh, calc(var(--app-height) - 24px))}
#sendLogModal .adminModalBody{max-height:calc(min(var(--app-height), 86dvh) - 72px)}
.adminModalBar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.adminModalClose{border:1px solid #cdd3dd;background:#e7eaef;border-radius:14px;padding:10px 12px;font-weight:850;cursor:pointer;box-shadow:none;position:relative;overflow:hidden;isolation:isolate;color:var(--text)}
.adminLauncherCard{display:flex;flex-direction:column;gap:10px}
.adminLauncherCard .pcSub{max-width:520px}
body.admin-modal-open{overflow:hidden}
.progressFill.active{background:linear-gradient(90deg,rgba(5,76,92,.65),rgba(5,76,92,.95),rgba(5,76,92,.65));background-size:220% 100%;animation:progressMove 3.6s ease-in-out infinite}
@keyframes progressMove{0%{background-position:0 0}100%{background-position:220% 0}}
.absenceCard{border:1px solid rgba(5,76,92,.18);background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(239,245,255,.92));border-radius:20px;padding:14px;box-shadow:0 16px 40px rgba(15,23,42,.1);display:flex;flex-direction:column;gap:12px}
.absenceFields{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.absenceFields .field{display:flex;flex-direction:column;gap:6px}
.absenceFields label{font-weight:850;font-size:13px;color:var(--muted)}
.absenceFields input,.absenceFields select,.absenceFields textarea{padding:10px 12px;border-radius:12px;border:1px solid var(--stroke);font-weight:820}
.absenceActions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.absenceList{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.absenceItem{border:1px solid rgba(0,0,0,.06);border-radius:14px;padding:10px 12px;background:#fff;box-shadow:0 10px 26px rgba(15,23,42,.08);display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.absenceMeta{display:flex;flex-direction:column;gap:4px;font-size:13px}
.absenceBadges{display:flex;gap:8px;flex-wrap:wrap}
.absenceBadge{padding:6px 10px;border-radius:12px;border:1px solid var(--stroke);background:rgba(0,0,0,.02);font-weight:850;font-size:11px}
.absenceFilters{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0}
.absenceFilters select,.absenceFilters input{padding:10px 12px;border-radius:12px;border:1px solid var(--stroke);font-weight:820}
.backBtn{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.08)}
@media (max-width:960px){
  .heroTitle{font-size:clamp(22px,6vw,28px)}
  .payrollListScroller{height:auto;max-height:min(70dvh, calc(var(--app-height) * 0.7))}
  .payrollListBody{display:flex;flex-direction:column;gap:8px}
  .payrollRowHeader{display:none}
  .payrollLine{flex-direction:column;align-items:flex-start}
  .payrollLineMain{width:100%}
}
@media (max-width:720px){
  .headerRow{flex-direction:column;align-items:flex-start}
.payrollGlassRow{flex-direction:column}
  .payrollChartCard{width:100%}
  .payrollListScroller{max-height:min(60dvh, calc(var(--app-height) * 0.6))}
  .matchTopBar{flex-direction:column;align-items:flex-start}
}
@media (max-width:900px){.payrollGrid{grid-template-columns:1fr}.payrollSheet{max-height:min(88dvh, calc(var(--app-height) * 0.88))}}

/* ===== UI FIX (2 colonne + lista) ===== */
/* Layout 2 colonne su desktop (admin) */
main.panelGrid{grid-template-areas:"access" "user" "admin"}
#accessArea{grid-area:access}
#userArea{grid-area:user}
#adminLauncher{grid-area:admin}
@media (min-width:1100px){
  body.role-admin main.panelGrid{
    grid-template-columns:minmax(420px,1fr) minmax(420px,1fr);
    grid-template-areas:"access admin" "user admin";
    align-items:start;
  }
  body:not(.role-admin) main.panelGrid{
    grid-template-columns:minmax(420px,1fr) minmax(420px,1fr);
    grid-template-areas:"access user";
  }
}

/* Nascondi pill/status inutili (restano gestiti dal JS se servono) */
.pillGroup{display:none!important}

/* Admin tabs: aspetto più pulito */
.segmentedControl{gap:2px}
.segmentedControl button{min-width:110px}

/* Lista match: stile “Settings list” */
.payrollListScroller{
  height:560px;
  overflow:auto;
  padding:0;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
}
.payrollListBody{gap:0}
.payrollRowHeader{
  position:sticky;
  top:0;
  z-index:3;
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.06);
  display:grid;
  grid-template-columns:240px minmax(420px, 1.4fr) 120px 120px 200px 90px;
  column-gap:12px;
  align-items:center;
  padding:8px 10px 10px;
  color:rgba(12,16,26,.52);
  font-weight:900;
  font-size:11px;
  letter-spacing:.05em;
  text-transform:uppercase;
  user-select:none;
  min-width:1040px;
}
.payrollLine{
  display:grid;
  grid-template-columns:240px minmax(420px, 1.4fr) 120px 120px 200px 90px;
  column-gap:12px;
  align-items:center;
  padding:12px 10px;
  border:0;
  border-top:1px solid rgba(0,0,0,.06);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  cursor:default;
  transition:none;
  min-width:1040px;
}
.payrollLine:hover{transform:none;box-shadow:none;background:rgba(0,0,0,.015)}
.payrollLine.warn{background:rgba(5,76,92,.06)}
.payrollLine.conflict{background:rgba(255,59,48,.06)}
.payrollCell{min-width:0}
.nameCell .name{font-weight:900;font-size:14px;letter-spacing:-0.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nameCell .sub{font-weight:850;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.emailInput{
  width:100%;
  border:0;
  border-bottom:1px solid rgba(15,23,42,.14);
  background:transparent;
  padding:7px 0 6px;
  font-weight:850;
  font-size:13px;
  min-width:420px;
}
.emailInput:focus{outline:none;box-shadow:none;border-bottom-color:rgba(5,76,92,.45)}
.emailText{
  display:block;
  padding:7px 0 6px;
  font-weight:850;
  font-size:13px;
  min-width:420px;
  color:rgba(0,0,0,.82);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  cursor:default;
}
.emailInput.invalid{border-bottom-color:rgba(255,59,48,.55)}
.monthCell.invalid{color:rgba(255,59,48,.9)}
.amountCell{font-weight:900}
.pageLink{
  border:1px solid rgba(0,0,0,.08);
  background:rgba(0,0,0,.03);
  padding:8px 12px;
  border-radius:999px;
  font-weight:900;
  color:rgba(0,0,0,.82);
  cursor:pointer;
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
}
.pageLink:hover{transform:translateY(-1px)}
.pageLink:active{transform:translateY(0)}
.toggleCell{display:flex;justify-content:flex-end}

@media (max-width:900px){
  .payrollRowHeader{display:none}
  .payrollLine{
    grid-template-columns:1fr 70px;
    grid-template-areas:
      "name toggle"
      "email toggle"
      "meta toggle";
    row-gap:10px;
    min-width:0;
  }
  .nameCell{grid-area:name}
  .emailCell{grid-area:email}
  .monthCell,.amountCell,.pagesCell{grid-area:meta}
  .emailInput{min-width:0}
}

/* Directory bulk bar */
.dirBulkBar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px;padding:10px 12px;border:1px solid rgba(0,0,0,.06);border-radius:16px;background:rgba(255,255,255,.75);backdrop-filter:blur(18px);box-shadow:var(--shadow-soft)}
.dirBulkLeft,.dirBulkRight{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.miniBtn.bad{background:rgba(255,59,48,.12);border-color:rgba(255,59,48,.25)}
table.dirTable th:first-child, table.dirTable td:first-child{width:36px}
.dirEditInput{width:100%;border:1px solid rgba(0,0,0,.12);border-radius:12px;padding:8px 10px;font-weight:850;font-size:13px;background:rgba(255,255,255,.85)}
.dirEditInput:focus{outline:none;box-shadow:0 0 0 4px rgba(5,76,92,.18);border-color:rgba(5,76,92,.42)}
table.dirTable td:nth-child(4){word-break:break-all;white-space:normal}
/* Directory (Dipendenti): lista alta, scorre solo la tabella */
#adminModal #payrollDirectoryPane{min-height:0;overflow:hidden}
#adminModal #payrollDirectoryPane .payrollDirectory{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}
#adminModal #payrollDirectoryPane .dirRowsScroll{flex:1;min-height:0;max-height:none;overflow:auto;margin-top:6px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}


  
  
/* === Desktop Admin full-screen + horizontal table visibility === */
@media (min-width: 900px){
  #adminModal.adminModalOverlay{padding:0;align-items:stretch;justify-content:stretch;overflow:hidden;}
  #adminModal .adminModalShell{width:100vw;max-width:none;height:var(--app-height);max-height:var(--app-height);border-radius:0;}
  #adminModal .adminModalBody{flex:1;overflow:hidden;min-height:0;display:flex;}

  /* Struttura: modale NON scrolla. Scorrono solo le liste interne. */
  #adminModal #adminArea{flex:1;min-height:0;position:relative;top:0;max-height:none;overflow:hidden;display:flex;flex-direction:column;}
  #adminModal #adminArea .payrollSteps{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;}

  /* Step Match: lista scrollabile + footer fisso con pulsanti */
  #adminModal #payrollStepMatch{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;}
  #adminModal #payrollStepMatch .matchGridShell{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;}
  #adminModal #payrollStepMatch .payrollListScroller{
    flex:1;
    min-height:0;
    height:auto;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }

  /* Storico: box compatto, scorre solo la lista */
  #adminModal #payrollStepMatch .uploadHistoryCard{
    flex:0 0 auto;
    max-height:clamp(170px, 24vh, 240px);
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  #adminModal #payrollStepMatch .uploadHistoryList{
    flex:1;
    min-height:0;
    max-height:none;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }

  /* Pulsanti sempre visibili in fondo */
  #adminModal #payrollStepMatch .pcActionRow{
    flex:0 0 auto;
    margin-top:10px;
    padding-top:12px;
    padding-bottom:calc(12px + var(--safe-bot));
    position:sticky;
    bottom:0;
    z-index:6;
    background:#f8fafc;
    border-top:1px solid rgba(0,0,0,.06);
  }

  /* Preview: tabella scrolla, pulsanti fissi in fondo */
  #adminModal #payrollStepPreview{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;}
  #adminModal #payrollStepPreview .rowsScroll{flex:1;min-height:0;max-height:none !important;overflow:auto !important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;border-radius:14px;}
  #adminModal #payrollStepPreview .pcActionRow{position:sticky;bottom:0;z-index:6;background:#f8fafc;border-top:1px solid rgba(0,0,0,.06);padding-top:12px;padding-bottom:calc(12px + var(--safe-bot));margin-top:10px;}

  /* Match: "Righe estratte" sempre dentro il riquadro + scroll verticale */
  #adminModal #payrollStepMatch .payrollRowHeader{display:none !important;}
  #adminModal #payrollStepMatch .payrollListScroller{overflow:auto !important;}
  #adminModal #payrollStepMatch .payrollListBody{gap:10px;}
  #adminModal #payrollStepMatch .payrollLine{
    display:grid !important;
    grid-template-columns:1fr 72px;
    grid-template-areas:
      "name toggle"
      "email toggle"
      "month toggle"
      "amount toggle"
      "pages toggle";
    row-gap:8px;
    column-gap:12px;
    min-width:0 !important;
    padding:12px 12px !important;
    border:1px solid rgba(0,0,0,.06) !important;
    border-radius:14px !important;
    background:#fff !important;
    box-shadow:var(--shadow-soft) !important;
  }
  #adminModal #payrollStepMatch .nameCell{grid-area:name;}
  #adminModal #payrollStepMatch .emailCell{grid-area:email;}
  #adminModal #payrollStepMatch .monthCell{grid-area:month;font-weight:850;color:var(--muted);}
  #adminModal #payrollStepMatch .amountCell{grid-area:amount;font-weight:900;}
  #adminModal #payrollStepMatch .pagesCell{grid-area:pages;}
  #adminModal #payrollStepMatch .toggleCell{grid-area:toggle;align-self:start;justify-self:end;}
  #adminModal #payrollStepMatch .emailInput{min-width:0 !important;}
  #adminModal #payrollStepMatch .payrollLine.isOff{opacity:.55; filter:saturate(.9);}
/* === Upload (desktop): testo chiaro, niente riquadri “schiacciati” === */
  #adminModal #payrollStepIdle .payrollGrid{
    grid-template-columns: minmax(560px, 1.25fr) minmax(420px, 0.75fr);
    gap: 16px;
    align-items: stretch;
  }
  #adminModal #payrollStepIdle .dropArea{
    padding: 20px;
    border-radius: 22px;
    gap: 12px;
    min-height: 320px;
    background: linear-gradient(160deg, rgba(255,255,255,.94), rgba(5,76,92,.06));
    border: 1.5px dashed rgba(5,76,92,.34);
  }
  #adminModal #payrollStepIdle .dropArea .pcTitle{
    font-size: 22px !important;
    line-height: 1.14;
    letter-spacing: -0.02em;
  }
  #adminModal #payrollStepIdle .dropArea .pcSub{
    font-size: 14px;
    line-height: 1.48;
    max-width: 74ch;
    overflow-wrap: anywhere;
  }      /* Pulsanti upload: singola CTA full-width (mobile-first) */
  #adminModal #payrollStepIdle .uploadActions{
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: stretch;
    margin-top: 4px;
  }
#adminModal #payrollStepIdle .uploadActions .payrollBtn{
    width: 100%;
    white-space: nowrap;
    justify-content: center;
  }
/* Stato upload */
  #adminModal #payrollStepIdle .progressShell{ border-radius: 18px; }
  #adminModal #payrollStepIdle .progressSpinRow{ padding: 18px 14px; gap: 12px; }
  #adminModal #payrollStepIdle .progressLabel{ font-size: 14px; }
  #adminModal #payrollStepIdle .miniHint{ font-size: 13px; }

  /* Box “Workflow ordinato” più arioso */
  #adminModal #payrollStepIdle .payrollGrid > .payrollPane{
    padding: 18px;
    border-radius: 22px;
  }
  #adminModal #payrollStepIdle .payrollGrid > .payrollPane .pcTitle{ font-size: 18px !important; }
  #adminModal #payrollStepIdle .payrollGrid > .payrollPane .pcHint{ font-size: 13.5px; line-height: 1.55; }

  /* Preview (desktop): tabella più leggibile, area più alta */
  #adminModal #payrollStepPreview .rowsScroll{
    max-height: min(58dvh, calc(var(--app-height) - 320px));
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    padding: 6px;
  }
  #adminModal #payrollStepPreview .table{ font-size: 14px; }
  #adminModal #payrollStepPreview table td{ padding: 12px 12px; }

  /* Liste e badge (desktop): leggibilità */
  #adminModal .uploadHistoryItem{ padding: 12px 14px; gap: 12px; }
  #adminModal .uploadHistoryMeta{ font-size: 13px; gap: 4px; }
  #adminModal .uploadHistoryTitle{ font-size: 14px; }
  #adminModal .pillTone{ padding: 7px 12px; border-radius: 12px; font-size: 12.5px; }
  #adminModal .pillTone{ overflow-wrap: anywhere; }


}

/* Canonical landing dependencies scoped to the embedded admin payroll shell. */
#payrollFlowMount{
      --bg:#ffffff;--bg2:#ffffff;--glass:rgba(255,255,255,0.9);--glass-strong:rgba(255,255,255,0.96);
      --stroke:rgba(12,22,52,.12);--stroke-strong:rgba(12,22,52,.2);--text:#0b0f1a;--muted:#2d3444;--accent:#054C5C;
      --good:#34c759;--warn:#ff9f0a;--bad:#ff3b30;--shadow:0 24px 60px rgba(15,23,42,.12);
      --radius:18px;--radius-lg:22px;--radius2:26px;
      --header-height:clamp(56px,9vw,60px);
      --safe-top: env(safe-area-inset-top, 0px);
      --safe-bot: env(safe-area-inset-bottom, 0px);
      --safe-left: env(safe-area-inset-left, 0px);
      --safe-right: env(safe-area-inset-right, 0px);
      --app-height: 100dvh;
      --space-1:6px;--space-2:10px;--space-3:14px;--space-4:18px;--space-5:22px;
      --shadow-soft:0 12px 32px rgba(15,23,42,.08),0 2px 12px rgba(15,23,42,.06);
      --shadow-hover:0 18px 42px rgba(15,23,42,.12);
      --focus-ring:0 0 0 3px rgba(5,76,92,.12),0 0 0 6px rgba(5,76,92,.08);
      --text-lg:clamp(20px,5vw,26px);
      --text-md:clamp(15px,3.8vw,17px);
      --text-sm:clamp(13px,3.4vw,15px);
      --text-xs:clamp(12px,3vw,13px);
      --keyboard-offset: 0px;
    }
#payrollFlowMount .srOnly{
      position:absolute !important;
      width:1px !important;
      height:1px !important;
      padding:0 !important;
      margin:-1px !important;
      overflow:hidden !important;
      clip:rect(0,0,0,0) !important;
      white-space:nowrap !important;
      border:0 !important;
    }
#payrollFlowMount button,
#payrollFlowMount .payrollBtn,
#payrollFlowMount .pageLink{min-height:44px;touch-action:manipulation;}
#payrollFlowMount .payrollBtn:active{transform:translateY(1px) scale(.98);box-shadow:none;filter:none;opacity:.92}
#payrollFlowMount .payrollBtn > *{position:relative;z-index:1}
#payrollFlowMount .neoBadge .icon{font-size:16px;color:rgba(5,76,92,.92)}
#payrollFlowMount .glassCard{
      border:1px solid rgba(15,23,42,.06);
      background:#fff;
      border-radius:22px;
      box-shadow:var(--shadow);
      padding:clamp(16px,4vw,20px);
      display:flex;
      flex-direction:column;
      gap:12px;
      position:relative;
      overflow:hidden;
    }
#payrollFlowMount .glassCard h2{margin:0;font-size:18px;font-weight:900;letter-spacing:-0.01em;line-height:1.25}
#payrollFlowMount .glassCard::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.28),rgba(255,255,255,0));opacity:.8}
#payrollFlowMount .btn.primary{background:#054C5C;color:white;border-color:#054C5C;box-shadow:none}
#payrollFlowMount .adminOnly{display:block}
#payrollFlowMount .miniHint{font-size:12px;color:var(--muted);font-weight:800}
#payrollFlowMount button,
#payrollFlowMount .payrollBtn,
#payrollFlowMount .pageLink,
#payrollFlowMount .empMiniBtn,
#payrollFlowMount .empBackBtn{
      box-shadow:none !important;
      filter:none !important;
    }
#payrollFlowMount button:hover,
#payrollFlowMount button:active,
#payrollFlowMount button:focus-visible,
#payrollFlowMount .payrollBtn:hover,
#payrollFlowMount .payrollBtn:active,
#payrollFlowMount .payrollBtn:focus-visible,
#payrollFlowMount .pageLink:hover,
#payrollFlowMount .pageLink:active,
#payrollFlowMount .pageLink:focus-visible,
#payrollFlowMount .empMiniBtn:hover,
#payrollFlowMount .empMiniBtn:active,
#payrollFlowMount .empMiniBtn:focus-visible,
#payrollFlowMount .empBackBtn:hover,
#payrollFlowMount .empBackBtn:active,
#payrollFlowMount .empBackBtn:focus-visible{
      box-shadow:none !important;
      filter:none !important;
    }
#payrollFlowMount #toast.show{display:flex}
#payrollFlowMount .adminStickyBar{position:sticky;top:0;z-index:10;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,247,251,.9));padding:var(--space-3);margin:-10px -10px var(--space-2);border-radius:18px;border:1px solid rgba(255,255,255,.7);backdrop-filter:blur(18px);box-shadow:0 24px 50px rgba(15,23,42,.12)}
#payrollFlowMount .adminBarTitle .pcTitle{font-size:20px}
#payrollFlowMount .adminBarTitle .pcSub{font-size:13px}
#payrollFlowMount .segmentedControl button.active{background:#fff;box-shadow:none;color:var(--text)}
#payrollFlowMount .searchField{position:relative;display:flex;align-items:center}
#payrollFlowMount .searchField input{padding:10px 12px 10px 36px;border-radius:14px;border:1px solid var(--stroke);background:#fff;min-width:220px;font-weight:820;transition:border-color .16s ease, box-shadow .2s ease}
#payrollFlowMount .searchField input:focus{border-color:rgba(5,76,92,.38);box-shadow:var(--focus-ring)}
#payrollFlowMount .searchField .icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:14px;color:var(--muted)}
#payrollFlowMount .toggleSwitch{display:inline-flex;align-items:center;gap:8px;font-weight:820;color:var(--muted);cursor:pointer;user-select:none}
#payrollFlowMount .toggleSwitch input{appearance:none;width:42px;height:24px;border-radius:24px;background:rgba(0,0,0,.14);position:relative;transition:background .2s ease}
#payrollFlowMount .toggleSwitch input::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:3px;left:4px;transition:transform .2s ease, box-shadow .2s ease;box-shadow:0 4px 10px rgba(0,0,0,.18)}
#payrollFlowMount .toggleSwitch input:checked{background:rgba(5,76,92,.36)}
#payrollFlowMount .toggleSwitch input:checked::after{transform:translateX(16px)}
#payrollFlowMount .warningBody.show{max-height:220px;opacity:1;padding-top:10px}
@media (max-width:900px){
#payrollFlowMount #adminArea{position:sticky;top:8px;max-height:calc(var(--app-height) - 90px);min-height:540px}
}
#payrollFlowMount .matchGridShell{margin-top:var(--space-2);border:1px solid rgba(0,0,0,.04);border-radius:20px;background:rgba(255,255,255,.95);box-shadow:var(--shadow);overflow:hidden;position:relative;padding:14px}
#payrollFlowMount #adminArea{overflow:auto;position:sticky;top:12px;align-self:flex-start;max-height:calc(var(--app-height) - 140px);min-height:640px}
#payrollFlowMount .payrollListScroller{height:560px;overflow-y:auto;padding:4px;border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(245,247,255,.9));border:1px solid rgba(0,0,0,.04);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
#payrollFlowMount .lineInput.invalid{border-bottom:1px solid rgba(255,59,48,.32);background:linear-gradient(180deg,rgba(255,59,48,.04),#fff)}
#payrollFlowMount .lineStatic.invalid{border-bottom:1px solid rgba(255,59,48,.32);background:linear-gradient(180deg,rgba(255,59,48,.04),#fff)}
#payrollFlowMount .toggleSwitch{position:relative;display:inline-flex;align-items:center;flex:0 0 auto;cursor:pointer}
#payrollFlowMount .toggleSwitch input{appearance:none;width:52px;height:30px;background:rgba(0,0,0,.12);border-radius:999px;position:relative;transition:background .2s ease, box-shadow .2s ease;outline:none;cursor:pointer}
#payrollFlowMount .toggleSwitch input::after{content:"";position:absolute;top:3px;left:4px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.18);transition:transform .2s ease}
#payrollFlowMount .toggleSwitch input:checked{background:linear-gradient(90deg,#054C5C,#3DD2A9)}
#payrollFlowMount .toggleSwitch input:checked::after{transform:translateX(22px)}
#payrollFlowMount .toggleSwitch input:disabled{opacity:.38;cursor:not-allowed}
#payrollFlowMount .toggleSwitch.alwaysOn{cursor:default}
#payrollFlowMount .toggleSwitch.alwaysOn input{pointer-events:none}
#payrollFlowMount .toggleSwitch.alwaysOn input:disabled{opacity:1;cursor:default}
#payrollFlowMount .toggleSwitch.alwaysOn span{opacity:.92}
#payrollFlowMount .toggleSwitch span{cursor:pointer}
#adminModal .adminModalCard{
      width:min(1920px, 98vw) !important;
      height:min(1080px, min(96dvh, calc(var(--app-height) * 0.96))) !important;
      max-width:1920px !important;
      max-height:min(1080px, var(--app-height)) !important;
      overflow:hidden !important;
    }
#adminModal .adminBody{
      height:100% !important;
      overflow:hidden !important;
    }
#adminModal .adminGrid{
      height:100% !important;
      overflow:hidden !important;
    }
#adminModal .adminLeft,
#adminModal .adminRight{
      height:100% !important;
      overflow:hidden !important;
    }
@keyframes authSpin{ from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
#payrollFlowMount .iosSpinner12{
  width:44px;height:44px; position:relative; flex:0 0 auto;
  filter:drop-shadow(0 8px 18px rgba(15,23,42,.10));
}
#payrollFlowMount .iosSpinner12 span{
  position:absolute; left:50%; top:50%;
  width:4px; height:11px;
  margin-left:-2px; margin-top:-20px;
  border-radius:999px;
  background:rgba(5,76,92,.92);
  transform-origin:2px 20px;
  animation:iosFade 1.4s ease-in-out infinite;
}
#payrollFlowMount .iosSpinner12 span:nth-child(1){transform:rotate(0deg);opacity:0.250;animation-delay:-1.400s;}
#payrollFlowMount .iosSpinner12 span:nth-child(2){transform:rotate(30deg);opacity:0.296;animation-delay:-1.283s;}
#payrollFlowMount .iosSpinner12 span:nth-child(3){transform:rotate(60deg);opacity:0.342;animation-delay:-1.167s;}
#payrollFlowMount .iosSpinner12 span:nth-child(4){transform:rotate(90deg);opacity:0.388;animation-delay:-1.050s;}
#payrollFlowMount .iosSpinner12 span:nth-child(5){transform:rotate(120deg);opacity:0.433;animation-delay:-0.933s;}
#payrollFlowMount .iosSpinner12 span:nth-child(6){transform:rotate(150deg);opacity:0.479;animation-delay:-0.817s;}
#payrollFlowMount .iosSpinner12 span:nth-child(7){transform:rotate(180deg);opacity:0.525;animation-delay:-0.700s;}
#payrollFlowMount .iosSpinner12 span:nth-child(8){transform:rotate(210deg);opacity:0.571;animation-delay:-0.583s;}
#payrollFlowMount .iosSpinner12 span:nth-child(9){transform:rotate(240deg);opacity:0.617;animation-delay:-0.467s;}
#payrollFlowMount .iosSpinner12 span:nth-child(10){transform:rotate(270deg);opacity:0.663;animation-delay:-0.350s;}
#payrollFlowMount .iosSpinner12 span:nth-child(11){transform:rotate(300deg);opacity:0.708;animation-delay:-0.233s;}
#payrollFlowMount .iosSpinner12 span:nth-child(12){transform:rotate(330deg);opacity:0.754;animation-delay:-0.117s;}
@keyframes iosFade{0%{opacity:1}100%{opacity:.35}}
#payrollFlowMount .payrollUserCard .payrollPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:9px 13px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.12);
  background:rgba(15,23,42,.05);
  color:#0b0f1a;
  font-weight:950;
  font-size:14px;
  letter-spacing:-0.01em;
  white-space:nowrap;
}
#payrollFlowMount .payrollNonAdminCard .pcTitle{
  font-size:clamp(22px, 5.8vw, 30px);
  font-weight:950;
  letter-spacing:-0.02em;
  color:#0b0f1a;
}
#payrollFlowMount .payrollNonAdminCard .pcSub{ font-size:14px; color:rgba(11,15,26,.72); }
#payrollFlowMount .payrollBtn.primary.black{
  background:#0b0f1a;
  border-color:#0b0f1a;
  box-shadow:0 14px 34px rgba(0,0,0,.18);
}
#payrollFlowMount .payrollBtn.primary.black:active{ transform:scale(.985); filter:brightness(.98); }
@media (max-width: 520px){
#payrollFlowMount .payrollNonAdminCard .pcTitle{ font-size:clamp(24px, 7vw, 32px); }
#payrollFlowMount .payrollActionButtons .payrollBtn{ width:100%; font-size:17px; padding:16px 16px; border-radius:18px; }
}
@media (min-width: 1024px){
#adminModal.adminModalOverlay{
    padding: 0 !important;
    overflow: hidden !important;
    align-items: stretch !important;
    justify-content: center !important;
  }
#adminModal .adminModalShell{
    width: 100vw !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }
#adminModal .adminModalHeader{
    flex: 0 0 auto !important;
  }
#adminModal .adminModalBody{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
  }
#adminModal #adminArea{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
    max-height: none !important;
    overflow: hidden !important;
    position: relative !important;
    top: 0 !important;
    align-self: stretch !important;
  }
#adminModal #adminArea .payrollSteps{
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
  }
#adminModal #adminArea .payrollPane{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
#adminModal #payrollStepMatch{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    /* display lasciato a JS/CSS base (no !important) */
flex-direction: column !important;
    gap: 12px !important;
  }
#adminModal #payrollStepMatch .payrollListScroller{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
#adminModal #payrollStepMatch .uploadHistoryCard{
    flex: 0 0 auto !important;
  }
#adminModal #payrollStepMatch #payrollHistoryList{
    max-height: 180px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
#adminModal #payrollStepMatch .pcActionRow{
    flex: 0 0 auto !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 6 !important;
    background: linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.98) 44%) !important;
    border-top: 1px solid rgba(0,0,0,.08) !important;
    padding: 12px 0 calc(12px + env(safe-area-inset-bottom)) !important;
    margin-top: 0 !important;
  }
}
#sendLogModal .empToolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px}
#sendLogModal .empGrid{display:flex;gap:12px;margin-top:12px;min-height:0;flex:1;overflow:hidden}
#sendLogModal .empCol{min-height:0;display:flex;flex-direction:column;overflow:hidden}
#sendLogModal .empListCol{flex:0 0 340px;max-width:380px}
#sendLogModal .empDetailCol{flex:1}
#sendLogModal .empList{overflow:auto;border:1px solid var(--stroke);border-radius:16px;background:#fff;padding:10px;min-height:160px}
#sendLogModal .empDetail{overflow:auto;border:1px solid var(--stroke);border-radius:16px;background:#fff;padding:12px;min-height:160px}
#sendLogModal .empUserItem{width:100%;text-align:left;border:1px solid rgba(15,23,42,.06);background:rgba(0,0,0,.02);padding:10px 12px;border-radius:14px;cursor:pointer;display:flex;flex-direction:column;gap:4px;font-weight:850;transition:transform .12s ease, background .18s ease}
#sendLogModal .empUserItem:hover{transform:translateY(-1px)}
#sendLogModal .empUserItem.active{background:#fff;box-shadow:var(--shadow-soft)}
#sendLogModal .empUserSub{font-size:12px;color:var(--muted);font-weight:800;word-break:break-word}
#sendLogModal .empUserMetaRow{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
#sendLogModal .empLogList{margin-top:10px;display:flex;flex-direction:column;gap:8px}
#sendLogModal .empLogRow{border:1px solid rgba(15,23,42,.06);background:rgba(0,0,0,.02);border-radius:14px;padding:10px 12px;display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
#sendLogModal .empLogMain{min-width:0;flex:1}
#sendLogModal .empLogTitle{font-weight:900}
#sendLogModal .empLogSub{font-size:12px;color:var(--muted);font-weight:800;word-break:break-word}
#sendLogModal .empLogActions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
#sendLogModal .empMiniBtn{padding:8px 10px;border-radius:12px;border:1px solid var(--stroke);background:#fff;font-weight:900;cursor:pointer}
#sendLogModal .empMiniBtn:active{transform:scale(.98)}
#sendLogModal .empGrid{display:block}
#sendLogModal .empListCol{max-width:none;flex:0 0 auto}
#sendLogModal .empDetailCol{display:none}
#sendLogModal.empDetailMode .empListCol{display:none}
#sendLogModal.empDetailMode .empDetailCol{display:flex}
#sendLogModal .empDetailCol{gap:10px}
#sendLogModal .empDetailHead{
      display:flex;
      align-items:center;
      gap:10px;
      border:1px solid var(--stroke);
      border-radius:10px;
      background:#fff;
      padding:10px 12px;
    }
#sendLogModal .empBackBtn{
      border:1px solid rgba(15,23,42,.12);
      background:#fff;
      border-radius:10px;
      padding:8px 10px;
      font-weight:900;
      cursor:pointer;
      transition:transform .12s ease, box-shadow .18s ease;
      flex:0 0 auto;
    }
#sendLogModal .empBackBtn:active{transform:scale(.98)}
#sendLogModal .empDetailHeadHint{font-size:13px;color:var(--muted);font-weight:800}
#sendLogModal .empList{border-radius:10px}
#sendLogModal .empDetail{border-radius:10px}
#sendLogModal .empUserItem{border-radius:10px}
#sendLogModal .empLogRow{border-radius:10px}
@media (max-width: 900px){
#sendLogModal .empGrid{flex-direction:column}
#sendLogModal .empListCol{flex:0 0 auto;max-width:none}
}
@keyframes spin{ to{ transform:rotate(360deg) } }
#sendLogModal.adminModalOverlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:stretch;
  justify-content:center;
  padding:calc(10px + var(--safe-top)) calc(10px + var(--safe-right)) calc(10px + var(--safe-bot)) calc(10px + var(--safe-left));
  background:rgba(0,0,0,.12);
  backdrop-filter:saturate(160%) blur(12px);
  z-index:9999;
  overscroll-behavior:contain;
}
#sendLogModal.adminModalOverlay.show{display:flex;}
#sendLogModal .adminModalShell{
  width:min(1100px, 100%);
  height:100%;
  max-height:var(--app-height);
  background:rgba(255,255,255,.96);
  border:1px solid rgba(0,0,0,.10);
  border-radius:16px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
#sendLogModal .adminModalHeader{
  padding:12px 14px;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92));
  border-bottom:1px solid rgba(0,0,0,.08);
}
#sendLogModal .adminModalHeader .adminModalBar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
#sendLogModal .adminModalBody{
  flex:1;
  min-height:0;
  overflow:hidden;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
#sendLogModal .empToolbar{
  margin-top:0 !important;
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  align-items:stretch;
}
#sendLogModal .empToolbar .selectWrap{
  position:relative;
  display:flex;
  align-items:center;
}
#sendLogModal .empToolbar .selectWrap::before,
#sendLogModal .empToolbar .selectWrap::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  width:0;
  height:0;
  pointer-events:none;
}
#sendLogModal .empToolbar .selectWrap::before{
  top:-8px;
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-bottom:8px solid rgba(15,23,42,.14);
}
#sendLogModal .empToolbar .selectWrap::after{
  top:-7px;
  border-left:7px solid transparent;
  border-right:7px solid transparent;
  border-bottom:7px solid #fff;
}
#sendLogModal .empToolbar .selectWrap select{ width:100%; }
#sendLogModal .empToolbar .iosInput,
#sendLogModal .empToolbar .empMiniBtn{ width:100%; }
#sendLogModal .empToggle{
  justify-content:space-between;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  background:rgba(255,255,255,.75);
}
#sendLogModal .empGrid{
  flex:1;
  min-height:0;
  overflow:hidden;
  display:flex !important;
  flex-direction:column !important;
  gap:10px;
}
#sendLogModal .empListCol,
#sendLogModal .empDetailCol{
  flex:1;
  min-height:0;
  width:100%;
  max-width:none !important;
}
#sendLogModal .empDetailCol{ display:none; }
#sendLogModal.empDetailMode .empListCol{ display:none; }
#sendLogModal.empDetailMode .empDetailCol{
  display:flex;
  flex-direction:column;
  gap:10px;
}
#sendLogModal.empDetailMode .empToolbar{ display:none; }
#sendLogModal .empList,
#sendLogModal .empDetail{
  flex:1;
  min-height:0;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:10px;
  border-radius:12px !important;
}
#sendLogModal .empUserItem{
  border-radius:12px;
  padding:12px 12px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 10px 24px rgba(15,23,42,.06);
}
#sendLogModal .empUserItem:active{ transform:scale(.99); opacity:.94; }
#sendLogModal .empUserSub{ font-size:12px; }
#sendLogModal .empDetailHead{
  border-radius:12px;
  padding:12px 12px;
}
#sendLogModal .empBackBtn{
  border-radius:12px;
  padding:10px 12px;
  min-height:44px;
}
@media (min-width: 820px){
#sendLogModal.adminModalOverlay{ padding:18px; }
#sendLogModal .adminModalShell{ border-radius:18px; }
#sendLogModal .empToolbar{
    grid-template-columns: 1.6fr 1fr auto auto;
    align-items:center;
  }
#sendLogModal .empToolbar .iosInput{ min-width: 220px; }
#sendLogModal .empMiniBtn{ width:auto; }
#sendLogModal.empDetailMode .empToolbar{ display:grid; }
}
@media (max-width: 540px){
#sendLogModal.adminModalOverlay{
    padding:0;
    background:#fff;
    backdrop-filter:none;
  }
#sendLogModal .adminModalShell{
    border-radius:0;
    border:0;
    background:#fff;
  }
#sendLogModal .adminModalHeader{
    padding:calc(10px + var(--safe-top)) 14px 10px;
  }
#sendLogModal .adminModalBody{
    padding:12px 14px calc(12px + var(--safe-bot));
  }
}
#payrollFlowMount .hiddenFileInput{
      position:fixed;
      left:-9999px;
      top:-9999px;
      width:1px;
      height:1px;
      opacity:0;
    }

#sendLogModal .adminModalShell{
    display:flex;
    flex-direction:column;
    width:min(980px, 96vw);
    max-height:min(86dvh, calc(var(--app-height) - 24px));
    overflow:hidden;
    transform:none !important;
    transition:none !important;
  }
#sendLogModal.show .adminModalShell{opacity:1 !important; transform:none !important;}
#sendLogModal .adminModalHeader{flex:0 0 auto; width:100%;}
#sendLogModal .adminModalBody{
    flex:1 1 auto;
    min-height:0;
    width:100%;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    touch-action:pan-y;
  }
#sendLogModal .empToolbar{
    width:100%;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    margin-top:12px;
  }
#sendLogModal #empSearch{flex:1 1 260px; min-width:180px;}
#sendLogModal #empSort{flex:0 0 200px; max-width:260px;}
#sendLogModal .empToggle{flex:0 0 auto;}
#sendLogModal .empMiniBtn{flex:0 0 auto;}
#sendLogModal .empGrid{display:block; width:100%; margin-top:12px;}
#sendLogModal .empCol{width:100%; max-width:none; min-height:0; overflow:visible;}
#sendLogModal .empListCol{display:block; width:100%; max-width:none;}
#sendLogModal .empDetailCol{display:none; width:100%; max-width:none;}
#sendLogModal.empDetailMode .empListCol{display:none !important;}
#sendLogModal.empDetailMode .empDetailCol{display:block !important;}
#sendLogModal .empList,
#sendLogModal .empDetail{
    width:100%;
    border:1px solid var(--stroke, rgba(15,23,42,.12));
    border-radius:8px;
    background:#fff;
    padding:12px;
    overflow:visible;
  }
#sendLogModal .empDetailHead{
    width:100%;
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid var(--stroke, rgba(15,23,42,.12));
    border-radius:8px;
    background:#fff;
    padding:10px 12px;
    margin-bottom:10px;
  }
#sendLogModal .empBackBtn{
    border-radius:8px;
  }
#sendLogModal .empUserItem{
    width:100%;
    text-align:left;
    border:1px solid rgba(15,23,42,.10);
    background:rgba(0,0,0,.02);
    border-radius:8px;
    padding:12px 12px;
    margin:0 0 10px 0;
    transition:background .18s ease, transform .12s ease;
  }
#sendLogModal .empUserItem:hover{transform:none;}
#sendLogModal .empUserItem:active{transform:scale(.99);}
#sendLogModal .empUserItem:last-child{margin-bottom:0;}
#sendLogModal .empBound,
#sendLogModal .empSectionBar,
#sendLogModal .empLogRow,
#sendLogModal .empUserMetaRow{
    border-radius:8px !important;
  }
@media (max-width: 640px){
#sendLogModal #empSort{flex:1 1 160px;}
#sendLogModal .empMiniBtn{width:100%;}
#sendLogModal .empToggle{width:100%; justify-content:space-between;}
}

#payrollFlowMount{ --accent:#054C5C; }
#payrollFlowMount .headerBtn.primary,
#payrollFlowMount .btn.primary,
#payrollFlowMount .payrollBtn.primary,
#payrollFlowMount .pillBtn.primary{
      background:var(--accent)!important;
      background-image:none!important;
      border-color:rgba(5,76,92,.28)!important;
      color:#fff!important;
      box-shadow:none!important;
    }
#payrollFlowMount .headerBtn:not(.primary):not(.danger),
#payrollFlowMount .btn:not(.primary),
#payrollFlowMount .payrollBtn:not(.primary),
#payrollFlowMount .pillBtn:not(.primary){
      background:rgba(0,0,0,.03)!important;
      border-color:rgba(0,0,0,.10)!important;
      color:rgba(12,16,26,.92)!important;
      box-shadow:none!important;
    }
@media (max-width: 720px){
#payrollFlowMount .glassCard{ padding:16px; border-radius:22px; }
}
@media (prefers-reduced-motion: reduce){
#payrollFlowMount .adminModalOverlay,
#payrollFlowMount .adminModalShell{
        transition:none!important;
      }
}
#payrollFlowMount .monthChip.active{
      background:#054C5C;
      border-color:#054C5C;
      color:#fff;
      box-shadow:0 16px 34px rgba(5,76,92,.22);
    }
#payrollFlowMount .monthChip.active{
  box-shadow:0 16px 30px rgba(5,76,92,.20) !important;
}
#sendLogModal .adminModalBody{
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}
#sendLogModal .pcHead{ flex:0 0 auto !important; }
#sendLogModal .historyActions{
  display:grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 10px !important;
  margin-top: 12px !important;
}
#sendLogModal .historyActions .pillBtn{ width:100% !important; }
#sendLogModal #sendLogModalList{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow:auto !important;
  max-height:none !important;
  padding-bottom: 18px !important;
}
#sendLogModal .adminModalShell{
  overflow:hidden !important;
}
#adminModal #payrollStepIdle .uploadActions{ grid-template-columns: 1fr !important; }

@media (min-width: 1024px){
#adminModal.adminModalOverlay,
#sendLogModal.adminModalOverlay{
    padding: calc(24px + var(--safe-top)) calc(14px + var(--safe-right)) calc(24px + var(--safe-bot)) calc(14px + var(--safe-left)) !important;
    overflow: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    align-items: flex-start !important;
    justify-content: center !important;
  }
#adminModal .adminModalShell,
#sendLogModal .adminModalShell{
    width: min(980px, 96vw) !important;
    max-width: 1200px !important;
    height: auto !important;
    max-height: min(90dvh, calc(var(--app-height) - 24px)) !important;
    border-radius: 26px !important;
    overflow: hidden !important;
  }
#adminModal .adminModalBody,
#sendLogModal .adminModalBody{
    height: auto !important;
    max-height: calc(min(var(--app-height), 90dvh) - 72px) !important;
    overflow: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    display: block !important;
  }
#payrollFlowMount #adminArea{
    position: relative !important;
    top: auto !important;
    align-self: stretch !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
}
@media (min-width: 721px){
#payrollFlowMount .payrollGrid{grid-template-columns:1fr !important;}
}
#payrollFlowMount .heroGrid .glassCard{
  background: transparent !important;
  background-image: none !important;
  backdrop-filter: none !important;
}
#payrollFlowMount .heroGrid .glassCard::before{
  opacity: 0 !important;
  background: none !important;
}

#sendLogModal .adminModalShell{
  display:flex !important;
  flex-direction:column !important;
  height:min(90dvh, calc(var(--app-height) - 24px)) !important;
  max-height:min(90dvh, calc(var(--app-height) - 24px)) !important;
}
#sendLogModal .adminModalBody{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  padding:14px !important;
}
#sendLogModal .empToolbar{
  display:grid !important;
  grid-template-columns: 1fr 180px auto auto;
  gap:10px;
  align-items:center;
  margin-top:0 !important;
}
#sendLogModal .empToggle{justify-content:flex-start; gap:10px;}
#sendLogModal .empGrid{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:100% !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-columns: 340px 1fr;
  gap:12px;
  margin-top:12px !important;
}
#sendLogModal .empCol{min-height:0 !important; overflow:hidden !important;}
#sendLogModal .empListCol{max-width:none !important;}
#sendLogModal .empDetailCol{min-width:0 !important;}
#sendLogModal .empList,
#sendLogModal .empDetail{
  height:100% !important;
  min-height:0 !important;
  overflow:auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
}
#sendLogModal .empList{padding:10px !important;}
#sendLogModal .empDetail{padding:12px !important;}
#sendLogModal .empUserItem{
  width:100%;
  text-align:left;
  border:1px solid rgba(15,23,42,.08);
  background:rgba(0,0,0,.02);
  padding:10px 12px;
  border-radius:14px;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  gap:6px;
  font-weight:850;
}
#sendLogModal .empUserItem.active{background:#fff;box-shadow:var(--shadow-soft)}
#sendLogModal .empUserTop{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
#sendLogModal .empUserName{font-weight:950;font-size:14px;line-height:1.15;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#sendLogModal .empUserPills{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;flex:0 0 auto}
#sendLogModal .empUserSub{font-size:12px;color:var(--muted);font-weight:800;word-break:break-word}
#sendLogModal .empUserMeta{font-size:12px;color:var(--muted);font-weight:800;opacity:.9}
#sendLogModal .empLogRow{
  border:1px solid rgba(15,23,42,.08);
  background:rgba(0,0,0,.02);
  border-radius:14px;
  padding:10px 12px;
  display:flex;
  gap:10px;
  align-items:flex-start;
  justify-content:space-between;
}
#sendLogModal .empLogMain{min-width:0;flex:1}
#sendLogModal .empLogTop{display:flex;align-items:center;justify-content:space-between;gap:10px}
#sendLogModal .empLogTitle{font-weight:950}
#sendLogModal .empLogPills{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
#sendLogModal .empLogSub{font-size:12px;color:var(--muted);font-weight:800;word-break:break-word}
#sendLogModal .empLogActions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
#sendLogModal .empMiniBtn{padding:8px 10px;border-radius:12px;border:1px solid var(--stroke);background:#fff;font-weight:900;cursor:pointer}
#sendLogModal .empMiniBtn:active{transform:scale(.98)}
#sendLogModal .empSectionBar{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:14px}
#sendLogModal .empSectionTitle{font-weight:950;font-size:14px}
#sendLogModal .empSectionMeta{font-size:12px;color:var(--muted);font-weight:800}
@media (max-width: 900px){
#sendLogModal .empToolbar{
    grid-template-columns: 1fr 1fr;
  }
#sendLogModal .empToolbar .empToggle{
    grid-column: 1 / -1;
  }
#sendLogModal .empGrid{
    grid-template-columns:1fr !important;
    grid-template-rows: 42% 58% !important;
  }
#sendLogModal .row2{
    grid-template-columns:1fr !important;
  }
#sendLogModal .empMiniBtn{padding:10px 10px}
}
#sendLogModal .empGrid{ display:block !important; }
#sendLogModal .empListCol,
#sendLogModal .empDetailCol{
  width:100% !important;
  max-width:none !important;
}
#sendLogModal .empListCol{
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
  height:100% !important;
}
#sendLogModal .empDetailCol{
  display:none !important;
  flex-direction:column !important;
  gap:10px !important;
  min-height:0 !important;
  height:100% !important;
}
#sendLogModal.empDetailMode .empListCol{ display:none !important; }
#sendLogModal.empDetailMode .empDetailCol{ display:flex !important; }
#sendLogModal .empList,
#sendLogModal .empDetail{
  flex:1 1 auto !important;
  height:auto !important;
  min-height:0 !important;
}
#sendLogModal .empList{
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  align-items:stretch !important;
  padding:10px !important;
}
#sendLogModal .empUserItem{
  margin:0 !important;
  box-sizing:border-box;
  min-height:66px;
  justify-content:center;
  padding:12px 14px !important;
  border-radius:12px !important;
}
#sendLogModal .empUserTop{
  display:grid !important;
  grid-template-columns: 1fr auto;
  align-items:center;
  gap:12px;
  min-width:0;
}
#sendLogModal .empUserName{
  min-width:0;
  line-height:1.2;
}
#sendLogModal .empUserPills{
  align-items:center;
}
#sendLogModal .empUserSub,
#sendLogModal .empUserMeta{
  line-height:1.25;
}
@media (max-width: 520px){
#sendLogModal .adminModalBody{ padding:12px !important; }
#sendLogModal .empList{ padding:10px !important; }
#sendLogModal .empUserItem{ padding:13px 14px !important; }
#sendLogModal .empUserName{ font-size:15px; }
}

#payrollFlowMount{
      /* fallback (se JS non riesce a misurare) */
      --fixed-header-h: calc(var(--header-height) + var(--safe-top));
      --fixed-footer-h: 0px;
      --fixed-footer-visual-h: 0px;
    }
#adminModal.adminModalOverlay,
#sendLogModal.adminModalOverlay{
      inset: var(--fixed-header-h) 0 0 0 !important;
    }
#adminModal.adminModalOverlay,
#sendLogModal.adminModalOverlay{
      padding: 16px calc(14px + var(--safe-right)) 16px calc(14px + var(--safe-left)) !important;
    }
@media (min-width:900px){
#adminModal .adminModalShell,
#sendLogModal .adminModalShell{
        max-height: 100% !important;
        height: auto !important;
      }
}

/* Canonical landing payroll UI: shared unchanged with the admin bridge. */
/* Canonical landing parity: style#payrollExtractUx */
/* Payroll — Estrazione: spinner “pulito” (senza riquadro) + frasi dinamiche */
  #adminModal #payrollStepExtract .progressShell{
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: 14px !important;
  }
  #adminModal #payrollStepExtract .progressSpinRow{
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    padding: 0 !important;
  }
  #adminModal #payrollStepExtract .iosSpinner12{
    width: 56px !important;
    height: 56px !important;
  }
  #adminModal #payrollStepExtract .progressLabel{
    text-align: center !important;
    padding: 0 !important;
    background: transparent !important;
  }
  /* Testi attorno allo spinner: più leggeri e ordinati */
  #adminModal .progressShell.progressAsSpinner .progressLabel{
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    color: rgba(12,16,26,.74) !important;
  }

  #adminModal #payrollStepExtract #payrollProgressLabelExtract{
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    color: rgba(12,16,26,.80) !important;
  
    transition: opacity .55s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(560px, 92vw);

  }

  #adminModal #payrollStepExtract #payrollProgressMetaExtract{
    margin-top: 2px;
    font-size: 12.5px;
    font-weight: 500;
    color: rgba(12,16,26,.56);
    text-align: center;
    min-height: 16px;
    transition: opacity .55s ease;
    padding: 0 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(560px, 92vw);

  }

    /* === Payroll upload/loading UI refresh (2026-01-06) === */
    .winSpinner{
      width:88px;
      height:88px;
      display:flex;
      align-items:center;
      justify-content:center;
      flex:0 0 auto;
      background:transparent;
    }
    .winSpinnerSvg{
      width:100%;
      height:100%;
      display:block;
      transform-origin:50% 50%;
      transform-box:fill-box;
      will-change:transform;
      animation:winSpinnerRotate 1.70s linear infinite;
    }
    .winSpinnerTrack{
      fill:none;
      stroke:rgba(12,16,26,.12);
      stroke-width:4;
    }
    .winSpinnerArc{
      fill:none;
      stroke:#054C5C;
      stroke-width:4;
      stroke-linecap:round;
      /* Rotazione a "peso" costante: nessuna variazione di lunghezza/spessore durante il giro */
      stroke-dasharray:72 54;
      stroke-dashoffset:-32;
    }
    @keyframes winSpinnerRotate{to{transform:rotate(360deg)}}
    
    @media (prefers-reduced-motion: reduce){
      .winSpinnerSvg{animation-duration:2.0s}
      .winSpinnerArc{animation:none;stroke-dasharray:72 54;stroke-dashoffset:-32}
    }

    /* Overlay: niente scuro, solo bianco pulito */
    #adminModal.adminModalOverlay{
      background:#fff !important;
      backdrop-filter:none !important;
    }
    #adminModal.adminModalOverlay.show{
      opacity:1 !important;
      transform:none !important;
    }
    /* Niente "card" centrale */
    #adminModal .adminModalShell{
      background:transparent !important;
      border:none !important;
      box-shadow:none !important;
    }
    #adminModal .adminModalHeader,
    #adminModal .adminModalBody{
      background:#fff !important;
    }

    #adminModal #adminArea.glassCard{
      background:transparent !important;
      border:none !important;
      box-shadow:none !important;
    }

    /* Stato caricamento: niente box */
    #adminModal #payrollStepExtract.payrollPane{
      background:transparent !important;
      border:none !important;
      box-shadow:none !important;
    }
    #adminModal #payrollStepExtract .progressShell,
    #adminModal #payrollStepIdle #payrollProgress.progressShell{
      background:transparent !important;
      border:none !important;
      box-shadow:none !important;
    }
    #adminModal #payrollStepExtract .progressSpinRow,
    #adminModal #payrollStepIdle #payrollProgress .progressSpinRow{
      padding:0 !important;
      justify-content:center !important;
    }
    #adminModal #payrollStepExtract .progressBar,
    #adminModal #payrollStepIdle #payrollProgress .progressBar{
      display:none !important;
    }

/* Canonical landing parity: style#uploadFlowFullWidth2026 */
/* Upload buste paga: percorso lineare (Carica → Analisi → Risultato) */
  /* - Nessun selettore "Carica/Match" */
  /* - Lista risultati a tutta larghezza */
  /* - CTA "Invia" fissa in fondo (solo quando c'è la lista) */
  #adminModal.adminModalOverlay{
    padding: 0 !important; /* usa tutta la larghezza disponibile (inset header/footer gestito altrove) */
  }
  #adminModal .adminModalShell{
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    max-height: 100% !important;
    border-radius: 0 !important;
  }

  /* Header sempre visibile (Annulla) */
  #adminModal .adminModalHeader{
    padding: 14px 16px !important;
    border-bottom: 1px solid rgba(15,23,42,.08) !important;
    background: rgba(255,255,255,.98) !important;
    backdrop-filter: blur(8px);
    position: sticky;
    top: 0;
    z-index: 60;
  }

  #adminModal .adminModalShell{ gap: 0 !important; }

  #adminModal .adminModalBody{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
  }

  /* Contenuto: niente "card" centrata */
  #adminModal #adminArea{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    margin: 0 !important;
  }

  /* Barra superiore dentro al flusso */
  #adminModal #adminArea .adminStickyBar{
    margin: 0 !important;
    border-radius: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: rgba(255,255,255,.98) !important;
    padding: 12px 16px !important;
  }

  /* Step container */
  #adminModal #adminArea .payrollSteps{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 16px 16px !important;
  }

  /* Risultati: lista grande + CTA fissa */
  #adminModal #payrollStepMatch{
    flex: 1 1 auto !important;
    min-height: 0 !important;
  }
  #adminModal #payrollStepMatch .matchGridShell{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    margin-top: 0 !important;
    padding: 12px !important;
    box-shadow: none !important;
  }
  #adminModal #payrollStepMatch .payrollListScroller{
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: auto !important;
  }

  #adminModal #payrollFixedSendBar{
    flex: 0 0 auto;
    position: sticky;
    bottom: 0;
    z-index: 30;
    background: rgba(255,255,255,.98);
    border-top: 1px solid rgba(15,23,42,.08);
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  }
  #adminModal #payrollFixedSendBar .payrollBtn{
    width: 100%;
    justify-content: center;
    font-size: 16px;
    padding: 16px 16px;
    border-radius: 18px;
  }

/* Canonical landing parity: style#payrollMatchFullScreenListFix */
/* =============================
     MATCH (post-upload):
     - Lista a tutto schermo (senza riquadri)
     - Ogni riga su una riga sola
     - Selezione con flag (checkbox)
     - Righe senza mail / mail errata in rosso
     - Pulsanti nel menu laterale
  ============================== */

  /* Header: in match/invio la chiusura sta nel menu laterale */
  #adminModal[data-payroll-step="match"] #btnCloseAdmin,
  #adminModal[data-payroll-step="sending"] #btnCloseAdmin{display:none !important;}

  /* Più spazio: niente header/titoli/riquadri superflui */
  #adminModal[data-payroll-step="match"] .adminModalHeader,
  #adminModal[data-payroll-step="sending"] .adminModalHeader{display:none !important;}
  #adminModal[data-payroll-step="match"] .adminModalBody,
  #adminModal[data-payroll-step="sending"] .adminModalBody{padding:0 !important;}
  #adminModal[data-payroll-step="match"] #adminArea,
  #adminModal[data-payroll-step="sending"] #adminArea{border:0 !important;background:transparent !important;box-shadow:none !important;}
  #adminModal[data-payroll-step="match"] #adminArea .adminStickyBar,
  #adminModal[data-payroll-step="sending"] #adminArea .adminStickyBar{display:none !important;}
  #adminModal[data-payroll-step="match"] #adminArea .payrollSteps,
  #adminModal[data-payroll-step="sending"] #adminArea .payrollSteps{padding:0 !important;}

  /* Container match: niente card */
  #adminModal[data-payroll-step="match"] #payrollStepMatch,
  #adminModal[data-payroll-step="sending"] #payrollStepSending{
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    gap:0 !important;
    overflow:hidden !important;
  }

  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchLayout,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchLayout{
    flex:1;
    min-height:0;
    display:flex;
    overflow:hidden;
    background:transparent;
  }

  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchMain,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchMain{
    flex:1;
    min-width:0;
    min-height:0;
    display:flex;
    flex-direction:column;
  }

  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchHeader,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchHeader{
    padding:16px 24px 12px;
    border-bottom:1px solid rgba(15,23,42,.08);
    background:rgba(255,255,255,.96);
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchHeader .pcTitle,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchHeader .pcTitle{
    font-size:18px;
    font-weight:900;
    letter-spacing:-0.01em;
  }
    /* Header risultati match: cockpit (azienda / mese / totale / dipendenti) */
  #payrollMatchResultsTitle{
    width:100%;
    display:block;
  }
  #payrollMatchResultsTitle .matchCockpit{
    display:grid;
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:12px;
  }
  #payrollMatchResultsTitle .mcBox{
    position:relative;
    border:1px solid rgba(15,23,42,.10);
    background:rgba(255,255,255,.92);
    border-radius:16px;
    padding:12px 14px 12px 18px;
    overflow:hidden;
    min-height:64px;
  }
  #payrollMatchResultsTitle .mcBox::before{
    content:"";
    position:absolute;
    left:0;
    top:10px;
    bottom:10px;
    width:3px;
    border-radius:6px;
    background:#054C5C;
  }
  #payrollMatchResultsTitle .mcLabel{
    font-size:11px;
    font-weight:900;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:rgba(15,23,42,.55);
  }
  #payrollMatchResultsTitle .mcValue{
    margin-top:6px;
    font-size:15px;
    font-weight:950;
    letter-spacing:-0.01em;
    color:#0b0f1a;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #payrollMatchResultsTitle .mcValue.big{
    font-size:17px;
  }
  #payrollMatchResultsTitle .mcMeta{
    font-size:12px;
    font-weight:900;
    color:rgba(15,23,42,.55);
    margin-left:8px;
    white-space:nowrap;
  }
  @media (max-width:900px){
    #payrollMatchResultsTitle .matchCockpit{grid-template-columns:repeat(2, minmax(0,1fr));}
  }
  @media (max-width:520px){
    #payrollMatchResultsTitle .matchCockpit{grid-template-columns:1fr;}
    #payrollMatchResultsTitle .mcValue{white-space:normal;}
  }


  /* Scroller: niente riquadri */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollListScroller,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollListScroller{
    flex:1;
    min-height:0;
    height:auto;
    max-height:none;
    overflow:auto;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }

  /* Tabella match (vera <table>): colonne SEMPRE allineate */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable{
    width:max-content;
    min-width:100%;
    border-collapse:separate;
    border-spacing:0;
    table-layout:fixed;
  }

  /* Colonne (in ordine: flag / nome / CF / importo / email / pagine) */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable col.colFlag,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable col.colFlag{width:46px;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable col.colName,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable col.colName{width:280px;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable col.colCF,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable col.colCF{width:200px;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable col.colAmount,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable col.colAmount{width:140px;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable col.colEmail,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable col.colEmail{width:360px;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable col.colPages,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable col.colPages{width:130px;}

  /* Header sticky */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable thead th,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable thead th{
    position:sticky;
    top:0;
    z-index:3;
    background:rgba(249,251,255,.98);
    border-bottom:1px solid rgba(0,0,0,.06);
    padding:10px 12px;
    font-weight:900;
    font-size:12px;
    color:var(--muted);
    text-transform:uppercase;
    letter-spacing:.06em;
    text-align:left;
    white-space:nowrap;
  }

  /* Linee verticali tra colonne (header + celle) */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable thead th:not(:last-child),
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable thead th:not(:last-child){
    border-right:1px solid rgba(0,0,0,.06);
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable thead th.flagHead,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable thead th.flagHead{ text-align:center; }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable thead th.pagesHead,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable thead th.pagesHead{ text-align:right; }

  /* Celle */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody td,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody td{
    padding:10px 12px;
    border-bottom:1px solid rgba(0,0,0,.06);
    vertical-align:middle;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:50%; /* richiesto: metà rispetto ad ora */
  }

  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody td:not(:last-child),
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody td:not(:last-child){
    border-right:1px solid rgba(0,0,0,.06);
  }

  /* Hover riga */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr:hover,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr:hover{
    background:rgba(0,0,0,.02);
  }

  /* Stati riga */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail{background:rgba(255,59,48,.12) !important;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.warn,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.warn{background:rgba(255,159,10,.12) !important;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.conflict,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.conflict{background:rgba(255,59,48,.08) !important;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail td,
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.warn td,
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.conflict td,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail td,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.warn td,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.conflict td{
    background:inherit !important;
  }

  /* Fallback: applica colori anche senza data-payroll-step */
  #payrollStepMatch .payrollMatchTable tbody tr.badEmail{background:rgba(255,59,48,.12) !important;}
  #payrollStepMatch .payrollMatchTable tbody tr.warn{background:rgba(255,159,10,.12) !important;}
  #payrollStepMatch .payrollMatchTable tbody tr.conflict{background:rgba(255,59,48,.08) !important;}
  #payrollStepMatch .payrollMatchTable tbody tr.badEmail td,
  #payrollStepMatch .payrollMatchTable tbody tr.warn td,
  #payrollStepMatch .payrollMatchTable tbody tr.conflict td{
    background:inherit !important;
  }

  /* Flag */
  #adminModal[data-payroll-step="match"] #payrollStepMatch td.flagCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending td.flagCell{ text-align:center; }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .rowFlag,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .rowFlag{width:18px;height:18px;cursor:pointer;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .headerFlag,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .headerFlag{margin:0;accent-color:var(--accent);}

  /* Nome */
  #adminModal[data-payroll-step="match"] #payrollStepMatch td.nameCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending td.nameCell{font-weight:950;letter-spacing:-0.01em;}

  /* Codice fiscale */
  #adminModal[data-payroll-step="match"] #payrollStepMatch td.cfCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending td.cfCell{
    font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-weight:900;
    color:var(--muted);
    letter-spacing:0.02em;
  }

  /* Importo */
  #adminModal[data-payroll-step="match"] #payrollStepMatch td.amountCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending td.amountCell{font-weight:900;}

  /* Email: campo compilabile */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .emailInput,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .emailInput{
    width:100%;
    min-width:0 !important;
    border:0 !important;
    border-bottom:1px solid rgba(15,23,42,.18) !important;
    border-radius:0 !important;
    background:transparent !important;
    padding:8px 0 !important;
    font-weight:850;
    font-size:inherit !important;
    outline:none;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .emailInput:focus,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .emailInput:focus{
    border-bottom-color:rgba(5,76,92,.65) !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .emailInput.invalid,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .emailInput.invalid{
    border-bottom-color:rgba(255,59,48,.9) !important;
  }

  /* Pagine (cliccabile) */
  #adminModal[data-payroll-step="match"] #payrollStepMatch td.pagesCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending td.pagesCell{
    text-align:right;
    font-weight:850;
    color:var(--muted);
    overflow:visible;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .pageLink,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .pageLink{
    font-size:inherit !important;
    background:transparent;
    border:1px solid rgba(0,0,0,.18);
    border-radius:10px;
    padding:6px 10px;
    font-weight:850;
    color:var(--primary);
    cursor:pointer;
    white-space:nowrap;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .pageLink:hover,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .pageLink:hover{background:rgba(5,76,92,.06);}

  /* Email errata/mancante => testi più rossi */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail td.nameCell,
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail td.cfCell,
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail td.pagesCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail td.nameCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail td.cfCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail td.pagesCell{
    color:rgba(138,31,26,.95);
  }

  /* Menu laterale */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchSide,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchSide{
    flex:0 0 320px;
    width:320px;
    max-width:320px;
    border-left:1px solid rgba(15,23,42,.10);
    background:rgba(255,255,255,.96);
    padding:14px 14px calc(14px + var(--safe-bot));
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .sideBlock,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .sideBlock{display:flex;flex-direction:column;gap:10px;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .sideBlock.stats,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .sideBlock.stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .sideStat,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .sideStat{border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:10px 12px;background:rgba(0,0,0,.02);} 
  #adminModal[data-payroll-step="match"] #payrollStepMatch .sideStat .k,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .sideStat .k{font-size:12px;font-weight:900;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .sideStat .v,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .sideStat .v{font-size:20px;font-weight:950;letter-spacing:-0.02em;}
  #adminModal[data-payroll-step="match"] #payrollStepMatch .sideBlock.actions .payrollBtn,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .sideBlock.actions .payrollBtn{width:100%;justify-content:center;}

  @media (max-width:900px){
    #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchLayout,
    #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchLayout{flex-direction:column;}
    #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchSide,
    #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchSide{
      width:100%;
      max-width:none;
      flex:0 0 auto;
      border-left:0;
      border-top:1px solid rgba(15,23,42,.10);
    }
    /* Mantieni una riga: abilita scroll orizzontale se serve */
    #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable,
    #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable{min-width:1180px;}
  }

/* Canonical landing parity: style#patchTable_20260124 */
/* PATCH 2026-01-24 — Match table: testo più grande + email box 3px + altezza piena tra header e footer */

  /* Tabella a tutta altezza (fra header e footer, dentro la modale) */
  #adminModal[data-payroll-step="match"] .adminModalShell,
  #adminModal[data-payroll-step="sending"] .adminModalShell{
    height:100% !important;
    max-height:100% !important;
  }
  #adminModal[data-payroll-step="match"] .adminModalBody,
  #adminModal[data-payroll-step="sending"] .adminModalBody{
    flex:1 1 auto !important;
    min-height:0 !important;
    height:100% !important;
    overflow:hidden !important;
    padding:0 !important;
  }
  #adminModal[data-payroll-step="match"] #adminArea,
  #adminModal[data-payroll-step="sending"] #adminArea{
    padding:0 !important;
    margin:0 !important;
  }
  #adminModal[data-payroll-step="match"] #adminArea .payrollSteps,
  #adminModal[data-payroll-step="sending"] #adminArea .payrollSteps{
    padding:0 !important;
    gap:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch,
  #adminModal[data-payroll-step="sending"] #payrollStepSending{
    height:100% !important;
    min-height:0 !important;
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    flex:1 1 auto !important;
    padding:0 !important;
    margin:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchLayout,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchLayout{
    height:100% !important;
    min-height:0 !important;
    align-items:stretch !important;
    width:100% !important;
    flex:1 1 auto !important;
    margin:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchMain,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchMain{
    height:100% !important;
    min-height:0 !important;
    width:100% !important;
    flex:1 1 auto !important;
    display:flex !important;
    flex-direction:column !important;
    margin:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollListScroller,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollListScroller{
    height:100% !important;
    min-height:0 !important;
    width:100% !important;
    flex:1 1 auto !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchSide,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchSide{
    height:100% !important;
    min-height:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable{
    width:100% !important;
    min-width:100% !important;
    table-layout:fixed !important;
  }

  /* Risultati: tabella attaccata al footer */
  #adminModal[data-payroll-step="match"] #payrollStepMatch,
  #adminModal[data-payroll-step="sending"] #payrollStepSending{
    padding-bottom:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchLayout,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchLayout{
    height:100% !important;
    padding-bottom:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchMain,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchMain{
    height:100% !important;
    padding-bottom:0 !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollListScroller,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollListScroller{
    flex:1 1 0 !important;
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }

  /* Testi tabella più grandi */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable thead th,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable thead th{
    font-size:14px !important;
    padding:12px 14px !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody td,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody td{
    font-size:14px !important;
    padding:12px 14px !important;
  }

  /* Checkbox un filo più visibile */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .rowFlag,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .rowFlag{
    width:20px !important;
    height:20px !important;
  }

  /* Campo mail: riquadro con bordo 3px */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .emailInput,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .emailInput{
    border:3px solid rgba(15,23,42,.20) !important;
    border-radius:12px !important;
    background:rgba(255,255,255,.96) !important;
    padding:10px 12px !important;
    height:44px !important;
    line-height:22px !important;
    box-shadow:none !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .emailInput:focus,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .emailInput:focus{
    border-color:rgba(5,76,92,.70) !important;
    box-shadow:0 0 0 4px rgba(5,76,92,.14) !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .emailInput.invalid,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .emailInput.invalid{
    border-color:rgba(255,59,48,.90) !important;
    box-shadow:0 0 0 4px rgba(255,59,48,.12) !important;
  }

  /* Pagine: leggibile */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .pageLink,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .pageLink{
    font-size:14px !important;
    padding:8px 12px !important;
  }

/* Canonical landing parity: style#patchGap0_TableFooter_20260124 */
/* PATCH 2026-01-24 — ZERO GAP tra tabella "risultati" e footer (0px) */

  /* 1) Rimuovi padding/margini residui nel pannello Match */
  #adminModal.show #payrollStepMatch,
  #adminModal.show #payrollStepSending{
    margin:0 !important;
    padding:0 !important;
  }
  #adminModal.show #payrollStepMatch .payrollMatchLayout,
  #adminModal.show #payrollStepMatch .payrollMatchMain,
  #adminModal.show #payrollStepSending .payrollMatchLayout,
  #adminModal.show #payrollStepSending .payrollMatchMain{
    margin:0 !important;
    padding:0 !important;
  }
  #adminModal.show #payrollStepMatch .payrollListScroller,
  #adminModal.show #payrollStepSending .payrollListScroller{
    margin:0 !important;
    padding:0 !important;
  }
  #adminModal.show #payrollStepMatch .payrollMatchTable,
  #adminModal.show #payrollStepSending .payrollMatchTable{
    margin:0 !important;
  }

  /* 2) Il gap era il padding-bottom dello step container (16px) + padding scroller (4px) = ~20px.
        Lo azzeriamo SOLO quando lo step Match è visibile. */
  #adminModal.show #adminArea .payrollSteps:has(#payrollStepMatch:not([style*="display:none"]):not([style*="display: none"])),
  #adminModal.show #adminArea .payrollSteps:has(#payrollStepSending:not([style*="display:none"]):not([style*="display: none"])){
    padding-bottom:0 !important;
  }

  /* 3) Fallback (browser senza :has) — mantieni comunque 0 gap quando la modale è aperta */
  @supports not(selector(:has(*))){
    #adminModal.show #adminArea .payrollSteps{ padding-bottom:0 !important; }
  }

/* Canonical landing parity: style#gap0_final_adminTableFooter_20260124 */
/* FINAL PATCH 2026-01-24 — ZERO GAP reale tra tabella "risultati" e footer ("Accesso sicuro • Documenti riservati") */

  /* 0) Overlay admin: niente padding sotto (la shell arriva fino al footer) */
  #adminModal.adminModalOverlay{ padding-bottom:0 !important; }

  /* 1) Card contenitore (glassCard): rimuovi il padding-bottom che creava ~16/20px di vuoto */
  #adminModal.show #adminArea,
  #adminModal.show #adminArea.glassCard{
    padding-bottom:0 !important;
  }

  /* 2) Wrapper step: in alcune patch aveva padding-bottom:16px → azzera */
  #adminModal.show #adminArea .payrollSteps{
    padding-bottom:0 !important;
  }

  /* 3) Scroller tabelle: nessun padding/margine sotto */
  #adminModal.show #payrollStepMatch .payrollListScroller,
  #adminModal.show #payrollStepSending .payrollListScroller,
  #adminModal.show #payrollStepPreview .rowsScroll{
    padding-bottom:0 !important;
    margin-bottom:0 !important;
  }

  /* 4) Extra-sicurezza: body modale senza padding sotto */
  #adminModal.show .adminModalBody{
    padding-bottom:0 !important;
  }

/* Canonical landing parity: style#resultsTableNoBottomGap_20260205 */
/* Tabella risultati: nessun margine inferiore, nessun vuoto a fine pagina */
  #adminModal.show #payrollStepMatch,
  #adminModal.show #payrollStepSending{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }
  #adminModal.show #payrollStepMatch .payrollMatchMain,
  #adminModal.show #payrollStepMatch .payrollListScroller,
  #adminModal.show #payrollStepSending .payrollMatchMain,
  #adminModal.show #payrollStepSending .payrollListScroller{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }
  #adminModal.show #payrollStepMatch .payrollMatchTable,
  #adminModal.show #payrollStepSending .payrollMatchTable{
    margin-bottom:0 !important;
  }

/* Canonical landing parity: style#resultsTableNoFooterInset_20260205 */
/* Risultati: elimina l'inset verso il footer per usare tutta l'altezza */
  #adminModal.show[data-payroll-step="match"],
  #adminModal.show[data-payroll-step="sending"]{
    inset: var(--fixed-header-h) 0 0 0 !important;
  }
  #adminModal.show[data-payroll-step="match"] .adminModalShell,
  #adminModal.show[data-payroll-step="sending"] .adminModalShell{
    height:100% !important;
    max-height:100% !important;
  }
  #adminModal.show[data-payroll-step="match"] .adminModalBody,
  #adminModal.show[data-payroll-step="sending"] .adminModalBody{
    height:100% !important;
    max-height:100% !important;
  }

/* Canonical landing parity: style#matchScrollerFooterSafePadding_20260210 */
/* Match: lascia spazio sotto la tabella per evitare sovrapposizione col footer fisso */
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch .payrollListScroller{
    padding-bottom: calc(clamp(0px, var(--fixed-footer-h), 80px) + 16px) !important;
  }

/* Canonical landing parity: style#sentRowsToggle_20260125 */
/* Righe già inviate: nascoste di default (toggle dal menu laterale) */
  #payrollStepMatch .payrollMatchTable tbody tr.sentRow{
    background: rgba(52,199,89,.10) !important;
  }
  #payrollStepMatch .sentBadge{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-left:8px;
    padding:3px 7px;
    border-radius:10px;
    border:1px solid rgba(52,199,89,.22);
    background: rgba(52,199,89,.10);
    color:#0b5d2a;
    font-weight:650;
    font-size:11px;
    letter-spacing:-0.01em;
    line-height:1;
    vertical-align:middle;
    white-space:nowrap;
  }
  #btnPayrollToggleSent[aria-pressed="true"]{
    background: rgba(5,76,92,.10) !important;
    border-color: rgba(5,76,92,.22) !important;
    color:#054C5C !important;
  }

/* Canonical landing parity: style#sendRowsSpinner_20260125 */
/* Invio: spinner per riga (gira) + layout compatto */
  #payrollStepSending .sendRowTail{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
  }
  #payrollStepSending .rowSpinner{
    width:18px;
    height:18px;
    border-radius:999px;
    border:2px solid rgba(0,0,0,.14);
    border-top-color:rgba(5,76,92,.92);
    animation:rowSpin .85s linear infinite;
    flex:0 0 auto;
  }
  #payrollStepSending .rowSpinner.placeholder{ opacity:0; }
  #payrollStepSending .rowSpinnerErr{
    width:18px;
    height:18px;
    border-radius:999px;
    border:2px solid rgba(255,59,48,.35);
    color:rgba(255,59,48,.95);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:950;
    font-size:13px;
    line-height:1;
    flex:0 0 auto;
  }
  @keyframes rowSpin{ to{ transform:rotate(360deg); } }

  /* Menu laterale invio: nascondi barra di caricamento (resta il contatore) */
  #payrollStepSending #payrollSendSideMenu .progressShell.big{ display:none !important; }
  #btnPayrollSendToggleSent[aria-pressed="true"]{
    background: rgba(5,76,92,.10) !important;
    border-color: rgba(5,76,92,.22) !important;
    color:#054C5C !important;
  }

/* Canonical landing parity: style#payrollUxPatch_20260125 */
/* Search field: full width nel menu laterale */
  #payrollMatchSideMenu .searchField,
  #payrollSendSideMenu .searchField{
    width:100%;
  }
  #payrollMatchSideMenu .searchField input,
  #payrollSendSideMenu .searchField input{
    width:100%;
    min-width:0 !important;
  }

  /* Pulsanti: fissati in basso nel menu laterale */
  #payrollMatchSideMenu,
  #payrollSendSideMenu{
    display:flex;
    flex-direction:column;
    background:#f8fafc;
    border-left:1px solid rgba(15,23,42,.12);
    box-shadow:inset 1px 0 0 rgba(255,255,255,.7);
    padding:18px 16px calc(18px + var(--safe-bot));
    gap:16px;
  }
  #payrollMatchSideMenu .sideBottom,
  #payrollSendSideMenu .sideBottom{
    margin-top:auto;
    display:flex;
    flex-direction:column;
    gap:12px;
    padding-bottom: calc(10px + clamp(0px, var(--fixed-footer-h), 80px));
  }
  #payrollMatchSideMenu > .sideBlock + .sideBlock,
  #payrollSendSideMenu > .sideBlock + .sideBlock{
    padding-top:12px;
    border-top:1px solid rgba(15,23,42,.08);
  }

  /* Switch: salva email per il prossimo invio */
  #payrollMatchSideMenu .toggleSwitch.payrollSaveEmailsToggle{
    width:100%;
    justify-content:space-between;
    gap:12px;
    flex-direction:row-reverse;
  }
  #payrollMatchSideMenu .toggleSwitch.payrollSaveEmailsToggle span{
    flex:1;
    font-size:12px;
    line-height:1.25;
    font-weight:850;
    color:var(--muted);
  }
  #payrollMatchSideMenu .toggleSwitch,
  #payrollSendSideMenu .toggleSwitch{
    width:100%;
    justify-content:space-between;
    gap:12px;
    color:#475569;
  }
  #payrollMatchSideMenu .toggleSwitch span,
  #payrollSendSideMenu .toggleSwitch span{
    font-size:12.5px;
    line-height:1.3;
    font-weight:750;
  }

  #payrollMatchSideMenu .searchField input,
  #payrollSendSideMenu .searchField input{
    background:#fff;
    border-color:rgba(15,23,42,.12);
    font-weight:750;
  }
  #payrollMatchSideMenu .searchField .icon,
  #payrollSendSideMenu .searchField .icon{
    color:#94a3b8;
    font-size:13px;
  }

  #payrollMatchSideMenu .sideBlock.actions .payrollBtn,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    text-align:left;
    padding:10px 12px 10px 18px;
    border-radius:12px;
    background:#fff;
    border-color:rgba(15,23,42,.12);
    color:#0f172a;
    font-weight:750;
    transition:background .16s ease, border-color .16s ease, color .16s ease;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn:hover,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn:hover{
    background:rgba(5,76,92,.05);
    border-color:rgba(5,76,92,.22);
    color:#0f172a;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn.primary,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn.primary{
    background:#054C5C;
    border-color:#054C5C;
    color:#fff;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn.primary:hover,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn.primary:hover{
    background:#054C5C;
    border-color:#054C5C;
    color:#fff;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"],
  #payrollSendSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"]{
    color:#054C5C;
    font-weight:800;
    background:rgba(5,76,92,.08);
    border-color:rgba(5,76,92,.28);
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"]::before,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"]::before{
    content:"";
    position:absolute;
    left:0;
    top:8px;
    bottom:8px;
    width:3px;
    border-radius:4px;
    background:#054C5C;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn[data-state="complete"],
  #payrollSendSideMenu .sideBlock.actions .payrollBtn[data-state="complete"]{
    color:#475569;
    font-weight:750;
    padding-right:36px;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn[data-state="complete"]::after,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn[data-state="complete"]::after{
    content:"✓";
    position:absolute;
    right:14px;
    top:50%;
    transform:translateY(-50%);
    color:#16a34a;
    font-weight:900;
    font-size:14px;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn:disabled,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn:disabled{
    background:#f1f5f9;
    border-color:rgba(148,163,184,.4);
    color:#94a3b8;
    cursor:not-allowed;
    box-shadow:none;
  }
  #payrollMatchSideMenu .sideBlock.actions .payrollBtn:disabled:hover,
  #payrollSendSideMenu .sideBlock.actions .payrollBtn:disabled:hover{
    background:#f1f5f9;
    border-color:rgba(148,163,184,.4);
  }

  /* Email errata/mancante: evidenzia SOLO il campo email (niente riga rossa) */
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail,
  #payrollStepMatch .payrollMatchTable tbody tr.badEmail,
  #payrollStepSending .payrollMatchTable tbody tr.badEmail{
    background:transparent !important;
  }

  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail td.nameCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail td.nameCell{
    color:var(--text) !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail td.cfCell,
  #adminModal[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody tr.badEmail td.pagesCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail td.cfCell,
  #adminModal[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody tr.badEmail td.pagesCell{
    color:var(--muted) !important;
  }

/* Canonical landing parity: style#postSendPromptsStyles_20260128 */
.fadeHint{
    margin-top:8px;
    font-size:12px;
    font-weight:850;
    color:rgba(15,23,42,.62);
    opacity:0;
    transform:translateY(4px);
    transition:opacity .55s ease, transform .55s ease;
    will-change:opacity,transform;
  }
  .fadeHint.show{ opacity:1; transform:none; }

  /* Prompt overlay (riutilizzabile) */
  .promptOverlay{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px calc(14px + var(--safe-right)) 18px calc(14px + var(--safe-left));
    background:rgba(15,23,42,.45);
    backdrop-filter: blur(10px);
    opacity:0;
    pointer-events:none;
    transition: opacity .18s ease;
  }
  .promptOverlay[aria-hidden="false"]{ opacity:1; pointer-events:auto; }

  .promptShell{
    width:min(440px, 92vw);
    border-radius:22px;
    border:1px solid var(--stroke);
    background:rgba(255,255,255,.96);
    box-shadow: var(--shadow-soft);
    padding:18px;
    transform: translateY(10px) scale(.985);
    opacity:0;
    transition: transform .18s ease, opacity .18s ease;
  }
  .promptOverlay[aria-hidden="false"] .promptShell{ transform:none; opacity:1; }

  .promptTitle{ font-size:18px; font-weight:950; letter-spacing:-0.01em; margin:0; }
  .promptBody{ margin-top:10px; color:rgba(15,23,42,.68); font-weight:820; font-size:13px; line-height:1.35; }
  .promptActions{ margin-top:14px; display:flex; flex-direction:column; gap:10px; }
  .promptBtn{
    width:100%;
    border-radius:16px;
    padding:13px 14px;
    font-weight:950;
    border:1px solid rgba(12,22,52,.14);
    background:rgba(0,0,0,.03);
    color:var(--text);
    cursor:pointer;
  }
  .promptBtn.secondary{ background:transparent; }
  .promptBtn.primary{ background:#054C5C; border-color:#054C5C; color:#fff; }
  .promptBtn.gold{
    background: linear-gradient(180deg, #fde08a 0%, #e1b021 100%);
    color:#2a1b00;
    border-color: rgba(140, 92, 0, .22);
    box-shadow: 0 10px 22px rgba(178, 128, 12, .18);
  }
  .promptBtn.gold .crown{ margin-right:8px; }

/* Canonical landing parity: style#payrollSideMenuClean_20260205 */
/* Match/Sending side menu — clean, minimal, no bold */
  #payrollMatchSideMenu,
  #payrollSendSideMenu{
    background:#fff !important;
    border-left:1px solid rgba(15,23,42,.10) !important;
    box-shadow:none !important;
    padding:18px 16px calc(18px + var(--safe-bot)) !important;
    gap:16px !important;
  }

  #payrollMatchSideMenu > .sideBlock + .sideBlock,
  #payrollSendSideMenu > .sideBlock + .sideBlock{
    padding-top:12px !important;
    border-top:none !important;
  }

  /* Search */
  #payrollMatchSideMenu .searchField input,
  #payrollSendSideMenu .searchField input{
    font-weight:400 !important;
  }

  /* Stats */
  #payrollMatchSideMenu .sideStat,
  #payrollSendSideMenu .sideStat{
    background:transparent !important;
    border:1px solid rgba(15,23,42,.08) !important;
    border-radius:14px !important;
    padding:10px 12px !important;
  }
  #payrollMatchSideMenu .sideStat .k,
  #payrollSendSideMenu .sideStat .k{
    font-size:12px !important;
    font-weight:450 !important;
    text-transform:none !important;
    letter-spacing:0 !important;
    color:rgba(45,52,68,.74) !important;
  }
  #payrollMatchSideMenu .sideStat .v,
  #payrollSendSideMenu .sideStat .v{
    font-size:20px !important;
    font-weight:450 !important;
    letter-spacing:-0.01em !important;
    color:rgba(11,15,26,.92) !important;
  }

  /* Toggles */
  #payrollMatchSideMenu .toggleSwitch span,
  #payrollSendSideMenu .toggleSwitch span{
    font-weight:450 !important;
    color:rgba(45,52,68,.82) !important;
  }
  #payrollMatchSideMenu .toggleSwitch.payrollSaveEmailsToggle span{
    font-weight:450 !important;
  }

/* Buttons (più grandi, senza bordi) */
#payrollMatchSideMenu .sideBlock.actions .payrollBtn,
#payrollSendSideMenu .sideBlock.actions .payrollBtn{
  border:none !important;
  box-shadow:none !important;
  background:rgba(15,23,42,.04) !important;
  color:rgba(11,15,26,.92) !important;
  font-weight:500 !important;
  font-size:15.5px !important;
  padding:14px 16px !important;
  border-radius:12px !important;
  text-align:center !important;
  justify-content:center !important;
  transition:background .16s ease, filter .16s ease, opacity .16s ease;
}
#payrollMatchSideMenu .sideBlock.actions .payrollBtn:hover,
#payrollSendSideMenu .sideBlock.actions .payrollBtn:hover{
  background:rgba(15,23,42,.06) !important;
}
#payrollMatchSideMenu .sideBlock.actions .payrollBtn.primary,
#payrollSendSideMenu .sideBlock.actions .payrollBtn.primary{
  background:#054C5C !important;
  color:#fff !important;
}
#payrollMatchSideMenu .sideBlock.actions .payrollBtn.primary:hover,
#payrollSendSideMenu .sideBlock.actions .payrollBtn.primary:hover{
  filter:brightness(.97) !important;
}
#payrollMatchSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"],
#payrollSendSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"]{
  background:rgba(5,76,92,.10) !important;
  color:#054C5C !important;
  font-weight:550 !important;
}
#payrollMatchSideMenu .sideBlock.actions .payrollBtn[data-state="complete"],
#payrollSendSideMenu .sideBlock.actions .payrollBtn[data-state="complete"]{
  padding-right:40px !important;
}
#payrollMatchSideMenu .sideBlock.actions .payrollBtn:disabled,
#payrollSendSideMenu .sideBlock.actions .payrollBtn:disabled{
  background:rgba(15,23,42,.03) !important;
  color:rgba(45,52,68,.40) !important;
  opacity:.7 !important;
  cursor:not-allowed !important;
}
  /* Microcopy */
  #payrollMatchSideMenu .miniHint,
  #payrollSendSideMenu .miniHint{
    font-weight:400 !important;
  }

  /* Save-email sync indicator (injected by JS) */
  #payrollMatchSideMenu .ilp-payroll-saveemails-sync,
  #payrollSendSideMenu .ilp-payroll-saveemails-sync{
    font-weight:400 !important;
    color:rgba(45,52,68,.72) !important;
  }

/* Canonical landing parity: style#matchUiLikeDipendenti_20260214 */
/* Area Match (match + invio): UI unica — cockpit identico a Dipendenti, side menu coerente, niente header/footer */

  /* Safety extra: se per qualche motivo non scatta il toggle JS, header/footer non devono mai comparire in Area Match */
body:has(#adminModal.show[data-payroll-step="match"]),
  body:has(#adminModal.show[data-payroll-step="sending"]),
  body:has(#adminModal.show[data-payroll-step="history"]),
  body:has(#adminModal.show[data-payroll-step="extracting"]){
    --fixed-header-h: 0px !important;
    --fixed-footer-h: 0px !important;
  }
  body:has(#adminModal.show[data-payroll-step="match"]) #appFooter,
  body:has(#adminModal.show[data-payroll-step="sending"]) #appFooter,
  body:has(#adminModal.show[data-payroll-step="history"]) #appFooter,
  body:has(#adminModal.show[data-payroll-step="extracting"]) #appFooter{ display:none !important; }

  /* Cockpit sempre visibile in Area Match (match + invio) */
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch .payrollMatchHeader,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending .payrollMatchHeader{
    position:sticky;
    top:0;
    z-index:80;
    background:transparent !important;
    border-bottom:0 !important;
    padding:26px calc(26px + var(--safe-right)) 18px calc(26px + var(--safe-left)) !important;
  }

  /* In invio: manteniamo solo cockpit (stato invio = righe + menu laterale) */
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending #payrollSendTitle,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending #payrollSendSummary{
    display:none !important;
  }

  /* Reset peso testo container (il wrapper aveva font-weight molto alto) */
  #adminModal.show[data-payroll-step="match"] #payrollMatchResultsTitle,
  #adminModal.show[data-payroll-step="sending"] #payrollSendCockpitTitle{ font-weight:400 !important; }

  /* Cockpit (clone Dipendenti) */
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard{
    width:100%;
    background:#fff;
    border:1px solid rgba(15,23,42,.08);
    border-radius:16px;
    box-shadow:none;
    display:grid;
    grid-template-columns: 1.55fr 1.05fr 1fr 1fr;
    overflow:hidden;
    margin:0;
  }
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .cockpitCell,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .cockpitCell{
    padding:22px 22px;
    min-width:0;
  }
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .cockpitCell + .cockpitCell,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .cockpitCell + .cockpitCell{
    border-left:1px solid rgba(15,23,42,.07);
  }
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .cockpitMetric,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .cockpitMetric{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:2px;
  }
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .metricLabel,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .metricLabel{
    font-size:12px;
    font-weight:520;
    color:rgba(15,23,42,.55);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .metricValue,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .metricValue{
    margin-top:8px;
    font-size:28px;
    font-weight:840;
    letter-spacing:-0.02em;
    color:rgba(11,15,26,.92);
    line-height:1.1;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .companyTitle,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .companyTitle{
    margin-top:8px;
    font-size:28px;
    font-weight:840;
    letter-spacing:-0.02em;
    color:rgba(11,15,26,.92);
    line-height:1.1;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .monthTitle,
  #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .monthTitle{
    margin-top:8px;
    font-size:28px;
    font-weight:840;
    letter-spacing:-0.02em;
    color:rgba(11,15,26,.92);
    line-height:1.1;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  @media (max-width: 980px){
    #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard,
    #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard{ grid-template-columns: 1fr 1fr; }

    #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .cockpitCell:nth-child(3),
    #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .cockpitCell:nth-child(4),
    #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .cockpitCell:nth-child(3),
    #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .cockpitCell:nth-child(4){
      border-top:1px solid rgba(15,23,42,.07);
    }
    #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .cockpitCell:nth-child(3),
    #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .cockpitCell:nth-child(3){
      border-left:none;
    }
  }

  @media (max-width: 520px){
    #adminModal.show[data-payroll-step="match"] #payrollStepMatch .payrollMatchHeader,
    #adminModal.show[data-payroll-step="sending"] #payrollStepSending .payrollMatchHeader{
      padding:16px calc(14px + var(--safe-right)) 12px calc(14px + var(--safe-left)) !important;
    }
    #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .companyTitle,
    #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .companyTitle{ font-size:23px; }
    #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .monthTitle,
    #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .monthTitle{ font-size:24px; }
    #adminModal.show[data-payroll-step="match"] .ilpMatchCockpitCard .metricValue,
    #adminModal.show[data-payroll-step="sending"] .ilpMatchCockpitCard .metricValue{ font-size:18px; }
  }

  /* Tabelle Match/Sending: testi meno bold (più elegante) */
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable thead th,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable thead th{
    font-weight:650 !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch .payrollMatchTable tbody td,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending .payrollMatchTable tbody td{
    font-weight:450 !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch td.nameCell,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending td.nameCell{ font-weight:650 !important; }
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch td.cfCell,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending td.cfCell{ font-weight:600 !important; }
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch td.amountCell,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending td.amountCell{ font-weight:650 !important; }
  #adminModal.show[data-payroll-step="match"] #payrollStepMatch .emailInput,
  #adminModal.show[data-payroll-step="sending"] #payrollStepSending .emailInput{ font-weight:450 !important; }

  /* Menu laterale destro (Area Match): coerente (brand blue) + niente linee/bordi */
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu{
    background:#054C5C !important;
    border-left:0 !important;
    box-shadow:none !important;
    color:rgba(255,255,255,.92) !important;
  }

  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu > .sideBlock + .sideBlock,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu > .sideBlock + .sideBlock{
    border-top:0 !important;
    padding-top:0 !important;
  }

  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .searchField .icon,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .searchField .icon{
    color:rgba(15,23,42,.48) !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .searchField input,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .searchField input{
    background:rgba(255,255,255,.96) !important;
    border-color:rgba(255,255,255,.22) !important;
    font-weight:450 !important;
  }

  /* Stats + counter (invio) */
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideStat,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideStat{
    background:rgba(255,255,255,.14) !important;
    border:0 !important;
  }
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .payrollPill{
    background:rgba(255,255,255,.14) !important;
    border-color:rgba(255,255,255,.22) !important;
    color:#fff !important;
    font-weight:650 !important;
  }

  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideStat .k,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideStat .k{
    color:rgba(255,255,255,.80) !important;
    font-weight:520 !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideStat .v,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideStat .v{
    color:#fff !important;
    font-weight:750 !important;
  }

  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .toggleSwitch span,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .toggleSwitch span{
    color:rgba(255,255,255,.92) !important;
    font-weight:450 !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .miniHint,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .miniHint{
    color:rgba(255,255,255,.86) !important;
    font-weight:450 !important;
  }

  /* Buttons */
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideBlock.actions .payrollBtn,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideBlock.actions .payrollBtn{
    background:rgba(255,255,255,.14) !important;
    border-color:rgba(255,255,255,.22) !important;
    color:#fff !important;
    font-weight:550 !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideBlock.actions .payrollBtn:hover,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideBlock.actions .payrollBtn:hover{
    background:rgba(255,255,255,.18) !important;
    border-color:rgba(255,255,255,.26) !important;
  }

  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideBlock.actions .payrollBtn.primary,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideBlock.actions .payrollBtn.primary{
    background:#fff !important;
    border-color:#fff !important;
    color:#054C5C !important;
    font-weight:700 !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideBlock.actions .payrollBtn.primary:hover,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideBlock.actions .payrollBtn.primary:hover{
    background:rgba(255,255,255,.94) !important;
    border-color:rgba(255,255,255,.94) !important;
  }

  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"],
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"]{
    background:rgba(255,255,255,.22) !important;
    border-color:rgba(255,255,255,.30) !important;
    color:#fff !important;
    font-weight:650 !important;
  }

  /* Rimuove la “linea” a sinistra sul bottone attivo */
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"]::before,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .sideBlock.actions .payrollBtn[aria-pressed="true"]::before{ display:none !important; }

/* Canonical landing parity: style#matchSideMenuUiTweak_20260216 */
/* Area Match — menu laterale destro: search + stats + switch + anteprima hover */

  /* Search: più grande, meno stondato, con mini contorno elegante + SVG */
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .searchField input,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .searchField input{
    height:46px !important;
    padding:0 12px 0 44px !important;
    border-radius:12px !important;
    font-size:14px !important;
    border:1px solid rgba(15,23,42,.14) !important;
    box-shadow:0 1px 0 rgba(15,23,42,.04) !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .searchField input:hover,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .searchField input:hover{
    border-color:rgba(15,23,42,.22) !important;
  }
  #adminModal.show[data-payroll-step="match"] #payrollMatchSideMenu .searchField input:focus,
  #adminModal.show[data-payroll-step="sending"] #payrollSendSideMenu .searchField input:focus{
    border-color:rgba(5,76,92,.45) !important;
    box-shadow:0 0 0 3px rgba(5,76,92,.14) !important;
  }

  #payrollMatchSideMenu .searchField .icon,
  #payrollSendSideMenu .searchField .icon{
    left:14px;
    width:18px;
    height:18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:rgba(15,23,42,.55);
  }
  #payrollMatchSideMenu .searchField .icon svg,
  #payrollSendSideMenu .searchField .icon svg{
    width:18px;
    height:18px;
    display:block;
  }

  /* Riquadri "Da inviare" + "Senza email": una sola colonna (full width) */
  #adminModal[data-payroll-step="match"] #payrollStepMatch #payrollMatchSideMenu .sideBlock.stats,
  #adminModal[data-payroll-step="sending"] #payrollStepSending #payrollSendSideMenu .sideBlock.stats{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  #adminModal[data-payroll-step="match"] #payrollStepMatch #payrollMatchSideMenu .sideBlock.stats .sideStat,
  #adminModal[data-payroll-step="sending"] #payrollStepSending #payrollSendSideMenu .sideBlock.stats .sideStat{
    width:100% !important;
  }

  /* Switch "Mostra senza email": testo prima, switch dopo */
  #payrollMatchSideMenu label.toggleSwitch{
    width:100%;
    justify-content:space-between;
    gap:12px;
  }

  /* Anteprima (pageLink): niente movimento al passaggio mouse, solo fade colore */
  #adminModal .pageLink{
    transition:background-color .16s ease, border-color .16s ease, color .16s ease, opacity .16s ease;
  }
  #adminModal .pageLink:hover{
    transform:none !important;
    opacity:.96;
    background:rgba(5,76,92,.06);
    border-color:rgba(5,76,92,.22);
  }

/* La shell paghe condivisa copre sempre l'intero viewport, senza mostrare il
   contenuto della landing o della dashboard dietro ai bordi. */
#payrollFlowMount > #adminModal.adminModalOverlay{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  min-height:100vh !important;
  min-height:100dvh !important;
  padding:0 !important;
  margin:0 !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  overflow:hidden !important;
  background:#fff !important;
  backdrop-filter:none !important;
  z-index:2147483000 !important;
}
#payrollFlowMount > #adminModal.adminModalOverlay > .adminModalShell{
  width:100vw !important;
  max-width:none !important;
  height:100vh !important;
  height:100dvh !important;
  max-height:none !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
#payrollFlowMount > #adminModal .adminModalBody{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:100% !important;
  max-height:none !important;
  padding:0 !important;
}

/* The PDF viewer is shared by the landing and admin launchers. Keep it above
   the full-viewport payroll shell, whose layer intentionally sits near the
   browser z-index ceiling to cover the host dashboard without visual leaks. */
#pdfPreviewOverlay.pdfPreviewOverlay{
  z-index:2147483647 !important;
}
