/* Stili propri dell'area «logistics» nel restyling come HubLEM (docs/restyle).
   Schede autisti, conferimenti, logistica, prenotazioni, stazioni, gasolio e
   buoni carburante. Prefisso lg- per non toccare i componenti comuni. */

/* --- Testi e card generiche ------------------------------------------------ */
.lg-text-purple { color: #7e22ce !important; }
.lg-text-orange { color: #c2410c !important; }
.lg-stat__sub { font-size: .78rem; font-weight: 700; color: #4b5563; margin-top: .15rem; }
.lg-stat__label { margin: 0 0 .25rem; }

.lg-panel { border: 2px solid #e5e7eb; border-radius: 1rem; }
.lg-panel__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; background: #fff; border-bottom: 1px solid #f3f4f6; }
.lg-panel__head .hub-tabs { margin: 0; min-width: min(100%, 24rem); }

.lg-card { border: 1px solid #e5e7eb; border-radius: 1rem; overflow: hidden; }
.lg-card__head { display: flex; align-items: center; gap: .5rem; font-weight: 700; background: #fff; }
.lg-card__head--gray { background: #f9fafb; }
.lg-card--indigo { border-color: #c7d2fe; background: #eef2ff; }
.lg-card--emerald { border-color: #a7f3d0; }
.lg-card--emerald .lg-card__head { background: #ecfdf5; color: #065f46; }
.lg-card--blue .lg-card__head { background: #eff6ff; color: #1e40af; }
.lg-card--green .lg-card__head { background: #f0fdf4; color: #166534; }
.lg-step { display: none; }

/* Riga intera cliccabile (Diario: tutta la riga apre il dettaglio). */
.lg-click { position: relative; }
.lg-click .hub-row__title::after { content: ""; position: absolute; inset: 0; }
.lg-click .hub-row { cursor: pointer; }

/* Pallino di stato e chip del telefono. */
.lg-status-dot { width: 2.25rem; height: 2.25rem; flex: 0 0 2.25rem; border-radius: 999px; display: grid; place-items: center; color: #fff; }
.lg-chip { display: inline-block; padding: .35rem .9rem; border-radius: 999px; font-size: .72rem; font-weight: 900; }
.lg-chip--green { background: #dcfce7; color: #166534; }
.lg-chip--orange { background: #ffedd5; color: #9a3412; }
.lg-chip--blue { background: #dbeafe; color: #1e40af; }
.lg-chip--gray { background: #f3f4f6; color: #374151; }
.lg-chip--red { background: #fee2e2; color: #991b1b; }

/* Griglie di riquadri del telefono. */
.lg-mgrid { display: grid; gap: .5rem; margin: .5rem 0; }
.lg-mgrid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lg-mgrid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lg-mgrid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lg-mcard--sky { border-color: #e0f2fe; }
.lg-mcard--amber { border-color: #fde68a; }
.lg-mcard--teal { border-color: #ccfbf1; }
.lg-mcard--cyan { border-color: #cffafe; }
.lg-mcard--indigo { border-color: #e0e7ff; }
.lg-mcard--rose { border-color: #ffe4e6; }
.lg-mcard--green { border-color: #dcfce7; }
.lg-mbox--orange { background: #fff7ed; border-color: #fed7aa; color: #7c2d12; }
.lg-mbox--red { background: #fef2f2; border-color: #fecaca; color: #7f1d1d; }
.lg-mbox--gray { background: #f9fafb; border-color: #e5e7eb; color: #1f2937; }
.lg-mbox--yellow { background: #fefce8; border-color: #fef08a; color: #713f12; }
.lg-mbox--blue { background: #eff6ff; border-color: #bfdbfe; color: #1e3a8a; }
.lg-mbox--purple { background: #faf5ff; border-color: #e9d5ff; color: #581c87; }
.lg-mbox--green { background: #f0fdf4; border-color: #bbf7d0; color: #14532d; }

/* Elenco per giorno (Archivio schede, movimenti gasolio, DAS). */
.lg-days { display: grid; gap: .75rem; }
.lg-day { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; padding: 1rem 1.25rem; border: 2px solid #e5e7eb; border-radius: 1rem; background: #fff; color: inherit; text-decoration: none; }
.lg-day:hover { box-shadow: 0 6px 18px -6px rgba(0, 0, 0, .15); color: inherit; }
.lg-day__icon { width: 3rem; height: 3rem; border-radius: .9rem; display: grid; place-items: center; font-size: 1.35rem; flex: 0 0 3rem; }
.lg-day__icon--blue { background: #dbeafe; color: #1d4ed8; }
.lg-day__icon--orange { background: #ffedd5; color: #c2410c; }
.lg-day__icon--green { background: #dcfce7; color: #15803d; }
.lg-day__main { display: grid; flex: 1 1 12rem; min-width: 0; }
.lg-day__main strong { font-size: 1rem; }
.lg-day__main small { color: #6b7280; }
.lg-day__totals { gap: 1.5rem; text-align: right; }
.lg-day__totals > span { display: grid; }
.lg-day__totals small { font-size: .7rem; color: #6b7280; }
.lg-day__totals strong { font-size: 1.1rem; }

/* Etichetta / valore nelle card di dettaglio. */
.lg-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1.5rem; margin: 0; }
.lg-dl--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lg-dl dt { font-size: .75rem; font-weight: 500; color: #6b7280; }
.lg-dl dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.lg-dl__big { font-size: 1.25rem; }
@media (max-width: 575.98px) { .lg-dl, .lg-dl--3 { grid-template-columns: 1fr; } }
.lg-check { display: inline-flex; align-items: center; gap: .35rem; font-size: .85rem; color: #6b7280; }
.lg-check.is-ok { color: #15803d; font-weight: 600; }
.lg-big-btn { padding: .85rem; font-weight: 800; border-radius: .9rem; }

/* Interruttori grandi della checklist (telefono come HubLEM). */
.lg-checks { display: grid; gap: .75rem; }
@media (min-width: 768px) { .lg-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.lg-switch { display: flex; align-items: center; gap: .75rem; margin: 0; padding: .75rem 1rem; border: 2px solid #e5e7eb; border-radius: 1rem; cursor: pointer; background: #fff; }
.lg-switch input { width: 1.25rem; height: 1.25rem; accent-color: #16a34a; flex: 0 0 auto; }
.lg-switch span { display: grid; }
.lg-switch small { color: #6b7280; font-size: .72rem; }
.lg-switch:has(input:checked) { border-color: #86efac; background: #f0fdf4; }
.lg-switch--red input { accent-color: #dc2626; }
.lg-switch--red:has(input:checked) { border-color: #fca5a5; background: #fef2f2; }

/* «Stato Scheda»: due pulsanti interruttore. */
.lg-status-toggle { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.lg-status-toggle__option { display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .75rem; border: 2px solid #e5e7eb; border-radius: .9rem; font-weight: 800; cursor: pointer; }
.lg-status-toggle__option input { position: absolute; opacity: 0; pointer-events: none; }
.lg-status-toggle__option--open:has(input:checked) { border-color: #fb923c; background: #fff7ed; color: #9a3412; }
.lg-status-toggle__option--closed:has(input:checked) { border-color: #4ade80; background: #f0fdf4; color: #166534; }
.lg-ref-badge { display: inline-flex; gap: .5rem; align-items: center; padding: .4rem .8rem; border-radius: .75rem; background: #1e293b; color: #fff; margin-bottom: .75rem; }
.lg-ref-badge small { font-size: .65rem; font-weight: 900; opacity: .75; }

/* Risultati di «Cerca cliente del giro». */
.lg-customer-results { display: grid; gap: .5rem; margin-top: .5rem; }
.lg-customer { border: 1px solid #d1fae5; background: #f0fdf4; border-radius: .75rem; padding: .5rem .75rem; }

/* Telefono: le card dei moduli diventano passi numerati come HubLEM. */
@media (max-width: 767.98px) {
  .lg-sheet-form .lg-card, .lg-card.lg-mstep { border: 1px solid #f3f4f6; border-radius: 1.5rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .08); }
  .lg-sheet-form .lg-card__head, .lg-mstep .lg-card__head { border: 0; font-size: .75rem; font-weight: 900; color: #6b7280; letter-spacing: .03em; padding-bottom: 0; }
  .lg-sheet-form .lg-step, .lg-mstep .lg-step { display: grid; width: 1.35rem; height: 1.35rem; border-radius: .45rem; place-items: center; font-size: .7rem; background: #e0f2fe; color: #0369a1; }
  .lg-sheet-form .form-label { font-size: .72rem; font-weight: 900; color: #374151; }
  .lg-sheet-form .form-control, .lg-sheet-form .form-select { border-radius: .9rem; padding: .7rem .9rem; }
}

/* --- Conferimenti e logistica ---------------------------------------------- */
.lg-decide { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.lg-daynav { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.lg-daynav__label { display: grid; text-align: center; min-width: 9rem; padding: .35rem .75rem; border: 2px solid #e0e7ff; border-radius: .9rem; background: #fff; }
.lg-daynav__label small { font-size: .6rem; font-weight: 900; color: #6366f1; letter-spacing: .05em; }
.lg-mstep-box .lg-step--inline { display: none; }
@media (max-width: 767.98px) {
  .lg-mstep-box { background: #fff; border: 1px solid #f3f4f6; border-radius: 1.5rem; padding: 1rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .08); }
  .lg-mstep-box .lg-step--inline { display: inline-grid; width: 1.35rem; height: 1.35rem; border-radius: .45rem; place-items: center; font-size: .7rem; background: #e0e7ff; color: #4338ca; margin-right: .4rem; }
}

/* --- Portale trasportatore ------------------------------------------------- */
.lg-portal-row .lg-portal-row__icon { flex-basis: 3.5rem; width: 3.5rem; height: 3.5rem; font-size: 1.4rem; color: #2563eb; background: #dbeafe; border-color: #bfdbfe; }
.lg-portal-row__fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 575.98px) { .lg-portal-row__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* --- Stazioni di raccolta ---------------------------------------------------- */
.lg-station-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.lg-station-filters .form-select { width: auto; min-width: 12rem; }
.lg-count { font-size: .75rem; }
.lg-view-toggle { margin-left: auto; }
@media (max-width: 767.98px) {
  .lg-station-filters .form-select { width: 100%; min-width: 0; padding: .7rem .9rem; border-radius: .9rem; }
  .lg-view-toggle { margin-left: 0; width: 100%; }
  .lg-view-toggle .btn { flex: 1 1 0; }
}
.lg-station .lg-station__photo { flex: 0 0 10rem; width: 10rem; height: 10rem; }
.lg-station .lg-station__photo--own { flex-basis: 8rem; width: 8rem; height: 8rem; }
@media (min-width: 768px) { .lg-station { flex-direction: row; } }
@media (max-width: 767.98px) { .lg-station .lg-station__photo, .lg-station .lg-station__photo--own { flex-basis: 6rem; width: 6rem; height: 6rem; } .lg-station--own { flex-direction: row; } }
.lg-station__fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lg-station__mphoto { width: 100%; height: 12rem; object-fit: cover; border-radius: 1rem; }
.lg-station-map { height: 500px; }
.lg-station-photo { max-height: 24rem; }
.lg-station-preview { max-height: 12rem; }
.lg-sstep__head { display: flex; align-items: center; gap: .5rem; margin-bottom: .6rem; }
.lg-sstep__head strong { font-size: .85rem; font-weight: 900; }
.lg-sstep__badge { font-size: .62rem; font-weight: 900; padding: .2rem .5rem; border-radius: .5rem; color: #fff; }
.lg-sstep__badge--blue { background: #2563eb; }
.lg-sstep__badge--purple { background: #9333ea; }
.lg-sstep__badge--orange { background: #ea580c; }
.lg-sstep__badge--pink { background: #db2777; }
.lg-sstep__badge--gray { background: #6b7280; }
@media (max-width: 767.98px) {
  .lg-sstep { background: #fff; border: 2px solid #f3f4f6; border-radius: 1.5rem; padding: 1rem !important; margin-top: .75rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .06); }
  .lg-sstep--blue { border-color: #dbeafe; }
  .lg-sstep--purple { border-color: #f3e8ff; }
  .lg-sstep--orange { border-color: #ffedd5; }
  .lg-sstep--pink { border-color: #fce7f3; }
  .lg-sstep .form-label { font-size: .72rem; font-weight: 900; }
  .lg-gps-btn { width: 100%; color: #fff; background: linear-gradient(90deg, #2563eb, #4f46e5); border: 0; padding: .8rem; border-radius: .9rem; font-weight: 900; }
}

/* --- Import gasolio, movimenti e DAS ---------------------------------------- */
.lg-steps { padding-left: 1.25rem; margin-bottom: .75rem; }
.lg-steps li { margin-bottom: .3rem; }
.lg-dashed-btn { border: 2px dashed #fb923c; color: #c2410c; background: #fff7ed; font-weight: 700; border-radius: .9rem; }
.lg-dashed-btn:hover { background: #ffedd5; color: #9a3412; }
.lg-fuel-row .lg-fuel-row__icon, .lg-das__icon { flex-basis: 3.25rem; width: 3.25rem; height: 3.25rem; font-size: 1.4rem; }
.lg-fuel-row .lg-fuel-row__icon { color: #ea580c; background: #ffedd5; border-color: #fed7aa; }
.lg-das__icon { color: #16a34a; background: #dcfce7; border-color: #bbf7d0; }
.lg-fuel-row, .hub-row:has(.lg-das__icon) { flex-direction: row; }
.lg-fuel-row__fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lg-split { border: 1px solid #e5e7eb; border-radius: 1rem; padding: 1rem; background: linear-gradient(135deg, #f0fdf4, #fefce8 50%, #eff6ff); }
.lg-dl--rows { grid-template-columns: 1fr; gap: .35rem; }
.lg-dl--rows > div { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed #bbf7d0; padding-bottom: .25rem; }

/* --- Buoni carburante ------------------------------------------------------- */
.lg-voucher-stats .hub-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 767.98px) { .lg-voucher-stats .hub-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; } }
.lg-voucher-panel--available .lg-card__head { background: #f0fdf4; color: #166534; }
.lg-voucher-panel--assigned .lg-card__head { background: #eff6ff; color: #1e40af; }
.lg-voucher { display: flex; align-items: center; gap: .75rem; }
.lg-voucher.is-muted { opacity: .6; }
.lg-voucher__check input { width: 1.2rem; height: 1.2rem; }
.lg-voucher__icon { width: 2.5rem; height: 2.5rem; flex: 0 0 2.5rem; border-radius: .75rem; display: grid; place-items: center; background: #f3f4f6; color: #4b5563; }
.lg-voucher__icon--assigned { background: #dbeafe; color: #1d4ed8; }
.lg-voucher__icon--delivered { background: #ffedd5; color: #c2410c; }
.lg-voucher__icon--available { background: #dcfce7; color: #15803d; }
.lg-voucher__main { flex: 1 1 auto; min-width: 0; }
.lg-voucher__side { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .4rem; }
.lg-voucher__side form { margin: 0; }
.lg-voucher-list { max-height: 16rem; overflow-y: auto; }
.lg-dropzone { display: grid; justify-items: center; gap: .2rem; padding: 1.25rem; border: 2px dashed #fca5a5; border-radius: 1rem; background: #fef2f2; color: #991b1b; cursor: pointer; text-align: center; margin: 0; }
.lg-dropzone:hover { background: #fee2e2; }