/* ============================================================
   sessioni.css — Accordion Sessioni Convegno FederMobilità
   ============================================================ */

/* ── OVERRIDE TEMA WordPress ─────────────────────────────────
   Il tema applica a #content-page .content-column:
   - p           { margin-bottom: 1rem }
   - ul li       { margin: 1rem 0; padding-left: 1rem }
   - ul li::before { content: "\f105" (freccia FontAwesome) }
   Questi reset annullano quei valori all'interno dell'accordion.
─────────────────────────────────────────────────────────── */
.acc-wrap p             { margin: 0 !important; text-align: left !important; }
.acc-wrap ul            { margin: 0 !important; padding: 0 !important; }
.acc-wrap ul li         { margin: 0 !important; padding: 0 !important; }
.acc-wrap ul li::before { display: none !important; content: none !important; }

/* ── NEUTRALIZZA <p> e <br> iniettati da WordPress tra i blocchi ── */
.acc-wrap > p,
.acc-wrap > br,
.acc-day > p,
.acc-day > br,
.acc-day-body > p,
.acc-day-body > br,
.acc-sess > p,
.acc-sess > br { display: none !important; height: 0 !important; margin: 0 !important; }

/* ── RESET / BASE ───────────────────────────────────────────── */
.acc-wrap *, .acc-wrap *::before, .acc-wrap *::after { box-sizing: border-box; margin: 0; padding: 0; }
.acc-wrap {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  color: #1a2a3a;
  line-height: 1.55;
  max-width: 100%;
  margin: 25px auto 0;
  text-align: left;
}

/* ── ACCORDION DAY (livello 1) ──────────────────────────────── */
.acc-day {
  border: 1px solid #c4d4e8;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 14px;
  box-shadow: 0 2px 8px rgba(0,40,100,0.07);
}
.acc-wrap > .acc-day:first-of-type { margin-top: 0; }
.acc-day-toggle { display: none; }

.acc-day-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  background: linear-gradient(135deg, #004a9f 0%, #003370 100%);
  color: #fff;
  padding: 18px 22px;
  cursor: pointer;
  user-select: none;
  transition: background .2s;
  box-shadow: 0 4px 14px rgba(0,40,120,0.30);
}
.acc-day-label:hover { background: linear-gradient(135deg, #003d8a 0%, #002760 100%); }
.acc-day-label .day-title {
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .4px;
  text-shadow: 0 1px 3px rgba(0,0,0,0.25);
  text-align: left;
  flex: 1;
}

/* freccia generica */
.acc-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform .3s;
}
.acc-day-label .acc-arrow {
  width: 24px; height: 24px;
  border: 2px solid rgba(255,255,255,0.8);
  border-radius: 50%;
  flex-shrink: 0;
}
.acc-arrow::after {
  content: '';
  display: block;
  width: 7px; height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  margin-top: -3px;
}
.acc-day-label .acc-arrow::after { border-color: #fff; }

.acc-day-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s ease;
}
.acc-day-toggle:checked ~ .acc-day-body { max-height: 99999px; }
.acc-day-toggle:checked ~.acc-day-label .acc-arrow { transform: rotate(180deg); }

/* ── ACCORDION SESSIONE (livello 2) ─────────────────────────── */
.acc-sess { border-top: 1px solid #dde8f5; }
.acc-sess-toggle { display: none; }

.acc-sess-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0;
  background: #eef4fb;
  border-left: 5px solid #004080;
  padding: 0;
  cursor: pointer;
  user-select: none;
  transition: background .15s;
  min-width: 0;
}
.acc-sess-label:hover { background: #e2ecf8; }

.sess-label-inner {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex: 1 1 auto;
  padding: 13px 16px 13px 18px;
}
.sess-time {
  font-size: 15px;
  font-weight: 800;
  color: #004080;
  white-space: nowrap;
  flex-shrink: 0;
}
.sess-title {
  font-size: 13.5px;
  font-weight: 700;
  color: #003366;
  text-transform: uppercase;
  letter-spacing: .4px;
}
.acc-sess-label .acc-arrow {
  width: 28px; height: 28px;
  margin-right: 14px;
  color: #004080;
  border: 2px solid #b0c8e8;
  border-radius: 50%;
}
.acc-sess-toggle:checked ~.acc-sess-label .acc-arrow { transform: rotate(180deg); }
.acc-sess-toggle:checked ~.acc-sess-label { background: #ddeaf8; }

.acc-sess-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease;
}
.acc-sess-toggle:checked ~ .acc-sess-body { max-height: 9999px; }

/* ── CONTENUTO SESSIONE ──────────────────────────────────────── */
.sess-chair {
  font-size: 12px;
  color: #5a6a80;
  padding: 8px 22px 4px 22px;
  font-style: italic;
  border-bottom: 1px dashed #dde8f5;
}
.sess-sublabel {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: #7a8a9a;
  padding: 12px 22px 4px 22px;
}
.sess-sublabel.tavolo { color: #556070; }

/* ── SPEAKER ROW ─────────────────────────────────────────────── */
.spk-list { list-style: none; }
.acc-wrap .spk-list .spk-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 1rem !important;
  border-bottom: 1px solid #f0f5fb;
  transition: background .12s;
}
.spk-row:last-child { border-bottom: none; }
.spk-row:hover { background: #f7fafd; }
.spk-info { flex: 1 1 auto; min-width: 0; }
.spk-name  { font-weight: 700; color: #1a2a3a; font-size: 14px; }
.spk-role  { font-size: 12.5px; color: #4a5a6a; margin-top: 1px; }
.spk-sub   { font-size: 12px; color: #6a7a8a; font-style: italic; margin-top: 2px; }

/* Pulsante Visualizza */
.spk-view {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #004080;
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s;
  font-family: inherit;
}
.spk-view:hover { background: #002e5e; }
.spk-view svg {
  width: 13px; height: 13px;
  fill: none; stroke: #fff;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0;
}

/* ── RESPONSIVE accordion ───────────────────────────────────── */
@media (max-width: 580px) {
  .spk-row { flex-wrap: wrap; gap: 6px; }
  .sess-label-inner { flex-direction: column; gap: 2px; }
  .acc-day-label .day-title { font-size: 14px; }
}

/* ============================================================
   MODAL PRESENTAZIONI — viewer PDF singolo relatore
   ============================================================ */

#presModal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999999;
  flex-direction: column;
  font-family: Arial, Helvetica, sans-serif;

  --pres-bg1:    #0b1220;
  --pres-bg2:    #16233a;
  --pres-panel:  rgba(255,255,255,0.08);
  --pres-text:   #eef2ff;
  --pres-muted:  #b8c2d9;
  --pres-accent: #6ea8fe;
  --pres-gold:   #f5c518;
  --pres-shadow: 0 18px 50px rgba(0,0,0,0.40);

  color: var(--pres-text);
  background:
    radial-gradient(circle at top left,    rgba(110,168,254,0.18), transparent 24%),
    radial-gradient(circle at bottom right, rgba(64,224,208,0.12),  transparent 18%),
    linear-gradient(135deg, var(--pres-bg1), var(--pres-bg2));
}
#presModal.open { display: flex; }

#presModal .pres-viewer-topbar {
  flex: 0 0 auto;
  display: flex; align-items: center;
  flex-wrap: wrap;
  gap: 10px; padding: 10px 18px;
  backdrop-filter: blur(12px);
  background: rgba(11,18,32,0.60);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  z-index: 20;
  box-sizing: border-box;
}
#presModal .pres-topbar-head {
  display: flex; align-items: center; gap: 12px;
  flex: 0 0 auto; min-width: 0;
  order: 1;
}
#presModal .pres-toolbar {
  display: flex; align-items: center; gap: 8px;
  flex: 1 1 auto; flex-wrap: nowrap; justify-content: flex-end;
  order: 2;
}
#presModal .pres-end-group { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
#presModal .pres-close-btn { flex-shrink: 0; margin-left: 0; }

#presModal p { margin-bottom: 0 !important; }
#presModal .pres-title-wrap { min-width: 0; }
#presModal .pres-title-wrap h1 { font-size: 13px; font-weight: 700; line-height: 1.35; }
#presModal .pres-title-wrap p  { font-size: 12px; color: var(--pres-muted); margin-top: 2px; }

#presModal .pres-arrow {
  display: inline-block; width: 0; height: 0; vertical-align: middle;
  border-top: 5px solid transparent; border-bottom: 5px solid transparent;
}
#presModal .pres-arrow.pres-arrow-l { border-right: 7px solid #eef2ff; margin-right: 4px; }
#presModal .pres-arrow.pres-arrow-r { border-left:  7px solid #eef2ff; margin-left:  4px; }

#presModal .pres-btn-ui {
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,0.14);
  background: var(--pres-panel); color: var(--pres-text);
  border-radius: 999px; padding: 0 16px;
  height: 36px; box-sizing: border-box;
  font-size: 14px; cursor: pointer; white-space: nowrap;
  text-decoration: none; user-select: none;
  transition: background .15s, transform .1s;
  box-shadow: 0 4px 14px rgba(0,0,0,0.18);
}
#presModal .pres-btn-ui:hover    { background: rgba(255,255,255,0.15); transform: translateY(-1px); }
#presModal .pres-btn-ui:active   { transform: scale(.96); }
#presModal .pres-btn-ui:disabled { opacity: .38; cursor: not-allowed; transform: none; }
#presModal .pres-gold {
  background: var(--pres-gold) !important; border-color: transparent !important;
  color: #1a1000 !important; font-weight: 700;
  height: 36px !important; line-height: 1 !important;
}
#presModal .pres-gold:hover { background: #ffd84d !important; }
#presModal .pres-close-btn {
  font-size: 20px; padding: 0 14px;
  height: 36px !important; line-height: 1;
  background: rgba(200,30,30,0.25);
  border-color: rgba(255,100,100,0.3);
  flex-shrink: 0; margin-left: 6px;
}
#presModal .pres-close-btn:hover { background: rgba(200,30,30,0.55); }

#presModal .pres-zoom-group { display: flex; align-items: center; gap: 4px; }
#presModal .pres-zoom-group .pres-btn-ui { padding: 0 14px; font-size: 18px; }
#presModal #presZoomLabel { font-size: 12px; color: var(--pres-muted); min-width: 42px; text-align: center; }
#presModal .pres-page-jump { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--pres-muted); }
#presModal .pres-page-jump input {
  width: 60px; text-align: center;
  background: var(--pres-panel); color: var(--pres-text);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 999px; padding: 0 8px;
  height: 36px; box-sizing: border-box;
  font-size: 13px; outline: none;
}
#presModal .pres-page-jump input:focus { border-color: var(--pres-accent); }

#presModal .pres-viewer-shell {
  flex: 1 1 auto; min-height: 0;
  display: flex; align-items: stretch; justify-content: center;
  padding: 18px; overflow: hidden;
}
#presModal .pres-viewer-card {
  flex: 1 1 auto; min-height: 0; max-height: 100%;
  width: min(100%, 1300px);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.03));
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: var(--pres-shadow);
  padding: 20px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; position: relative;
}

#presModal #presPanWrap {
  flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  will-change: transform;
}
#presModal #presBookStage {
  position: relative;
  box-shadow: 0 28px 70px rgba(0,0,0,0.65), 0 6px 20px rgba(0,0,0,0.45);
}

#presModal .pres-pg { position: absolute; top: 0; left: 0; background: #fff; overflow: hidden; }
#presModal .pres-pg .pres-port-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }

#presModal .pres-pg .pres-slot-spinner {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: #f8f8f8;
}
#presModal .pres-slot-ring {
  width: 36px; height: 36px; border-radius: 50%;
  border: 3px solid #ddd; border-top-color: #004080;
  animation: fbkSpin .7s linear infinite;
}

#presModal #presFlipCard { position: absolute; top: 0; left: 0; transform-style: preserve-3d; z-index: 10; pointer-events: none; }
#presModal .pres-fc-face {
  position: absolute; inset: 0;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
  overflow: hidden; background: #fff;
}
#presModal .pres-fc-face.pres-fc-back { transform: rotateY(180deg); }
#presModal .pres-fc-face .pres-port-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }

#presModal .pres-loading-overlay {
  position: absolute; inset: 0; z-index: 200; border-radius: 24px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  background: rgba(11,18,32,0.85); backdrop-filter: blur(8px);
}
#presModal .pres-loading-overlay.hidden { display: none; }
#presModal .pres-spinner {
  width: 54px; height: 54px; border-radius: 50%;
  border: 4px solid rgba(255,255,255,0.14); border-top-color: #6ea8fe;
  animation: fbkSpin 1s linear infinite;
}
#presModal .pres-loading-overlay p { color: #b8c2d9; font-size: 14px; }

#presModal .pres-hint {
  position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%);
  color: #b8c2d9; font-size: 12px;
  background: rgba(0,0,0,0.26); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 999px; padding: 6px 16px;
  backdrop-filter: blur(8px); pointer-events: none;
  white-space: nowrap; transition: opacity 1.8s; z-index: 10;
}
#presModal .pres-hint.pres-gone { opacity: 0; }

@keyframes fbkSpin { to { transform: rotate(360deg); } }

/* ── RESPONSIVE modal ───────────────────────────────────────── */
@media (max-width: 1200px) {
  #presModal #presZoomLabel,
  #presModal .pres-page-jump { display: none; }
}
@media (max-width: 1000px) {
  #presModal #presFitBtn,
  #presModal #presFsBtn { display: none; }
  #presModal .pres-toolbar { gap: 6px; }
  #presModal .pres-viewer-topbar { gap: 8px; padding: 10px 14px; }
}
@media (max-width: 768px) {
  #presModal .pres-viewer-shell { padding: 10px; }
  #presModal .pres-viewer-card  { padding: 10px; border-radius: 12px; }
}
@media (max-width: 560px) {
  #presModal .pres-topbar-head { flex: 1 1 100%; order: 1; }
  #presModal .pres-toolbar     { order: 2; flex: 1 1 100%; justify-content: center; flex-wrap: wrap; gap: 6px; }
  #presModal .pres-end-group   { flex-shrink: 0; }
}
@media (max-width: 480px) {
  #presModal .pres-btn-ui { padding: 0 10px; font-size: 13px; height: 32px; }
  #presModal .pres-zoom-group .pres-btn-ui { padding: 0 10px; }
  #presModal .pres-viewer-shell { padding: 6px; }
  #presModal .pres-viewer-card  { padding: 6px; border-radius: 8px; }
}
