/* JEC Speaker Manager — Program "Timeline Premium"
   Colours 100% driven by Settings. Hardened against theme/Elementor CSS:
   every rule is scoped to .jec-program, structural props are reset, and
   identity props use !important so the design is faithful on any site. */

.jec-program {
    /* Injected inline on the element from Settings (primary/accent/secondary
       + auto-contrast on-primary/on-accent). */
    --jec-primary:      #6B3FA0;
    --jec-accent:       #9B6FC8;
    --jec-secondary:    #9B6FC8;
    --jec-on-primary:   #ffffff;
    --jec-on-accent:    #ffffff;
    --jec-text:         #1d2636;
    --jec-meta-color:   #5b6472;
    --jec-muted:        #6b7280;   /* AA on white */
    --jec-quiet:        #aab0bb;
    --jec-bg:           #ffffff;
    --jec-border:       #e4e6ee;
    --jec-rail:         #e4e6ee;
    --jec-radius:       12px;

    /* Keep a comfortable reading measure on wide pages */
    max-width: 1120px !important;
    margin-left: auto !important;
    margin-right: auto !important;

    /* Never inherit a theme's generic div background: blend into the page. */
    background: transparent !important;

    color: var(--jec-text);
    font-size: 16px;
    line-height: 1.5;
}

/* ── Scoped reset: neutralise inherited theme styles ── */
.jec-program *,
.jec-program *::before,
.jec-program *::after { box-sizing: border-box !important; }

.jec-program h3,
.jec-program h4,
.jec-program p,
.jec-program ul,
.jec-program li,
.jec-program figure,
.jec-program span,
.jec-program div {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 none !important;
    background: none !important;
    font-family: inherit !important;
    letter-spacing: normal !important;
    text-align: left;
    text-transform: none;
    float: none !important;
    box-shadow: none;
}
.jec-program .jec-prog-highlights,
.jec-program .jec-prog-highlights li { list-style: none !important; }

/* Lists typed in the Description editor keep real bullets/numbers */
.jec-program .jec-prog-desc ul { list-style: disc outside !important; padding-left: 20px !important; margin: 8px 0 !important; }
.jec-program .jec-prog-desc ol { list-style: decimal outside !important; padding-left: 22px !important; margin: 8px 0 !important; }
.jec-program .jec-prog-desc li { list-style: inherit !important; margin: 0 0 4px !important; padding: 0 !important; }
.jec-program img { max-width: 100% !important; height: auto; display: block; }
.jec-program .jec-prog-title,
.jec-program .jec-prog-room,
.jec-program .jec-prog-desc,
.jec-program .jec-prog-highlights li,
.jec-program .jec-speaker-name,
.jec-program .jec-speaker-talk,
.jec-program .jec-speaker-meta,
.jec-program .jec-prog-day-title { overflow-wrap: break-word !important; word-break: break-word; min-width: 0; }

/* ── Section motif (two dots) ── */
.jec-program .jec-prog-dots { display: inline-flex !important; gap: 5px; vertical-align: middle; }
.jec-program .jec-prog-dots i { width: 7px !important; height: 7px !important; border-radius: 50% !important; }
.jec-program .jec-prog-dots i:first-child { background: var(--jec-accent) !important; }
.jec-program .jec-prog-dots i:last-child  { background: var(--jec-secondary) !important; }

/* ── Day header banner ── */
.jec-program .jec-prog-day { margin: 0 0 26px !important; }

.jec-program .jec-prog-day-title {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    background: var(--jec-primary) !important;
    color: var(--jec-on-primary) !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
    margin: 34px 0 18px !important;
    padding: 13px 18px !important;
    border-radius: var(--jec-radius) !important;
    line-height: 1.3 !important;
}
.jec-program .jec-prog-day:first-child .jec-prog-day-title { margin-top: 0 !important; }

/* ── Timeline item [ time | rail+dot | card ] ── */
.jec-program .jec-prog-list { display: block !important; }

.jec-program .jec-prog-item {
    display: grid !important;
    grid-template-columns: 64px 26px 1fr !important;
    align-items: stretch !important;
}

.jec-program .jec-prog-when { text-align: right !important; padding: 16px 12px 0 0 !important; line-height: 1.25; }
.jec-program .jec-prog-t1 { display: block !important; font-size: 13px !important; font-weight: 800 !important; color: var(--jec-primary) !important; }
.jec-program .jec-prog-t2 { display: block !important; font-size: 12px !important; font-weight: 600 !important; color: var(--jec-muted) !important; }
.jec-program .jec-pgroup-logistics .jec-prog-t1 { color: var(--jec-muted) !important; }

.jec-program .jec-prog-rail { position: relative !important; display: flex !important; justify-content: center !important; }
.jec-program .jec-prog-rail::before {
    content: "" !important;
    position: absolute !important;
    top: 0; bottom: 0; left: 50%;
    width: 2px !important;
    margin-left: -1px;
    background: var(--jec-rail) !important;
}
/* Dots are always solid so they stay visible; quieter tone for practical blocks */
.jec-program .jec-prog-dot {
    width: 13px !important; height: 13px !important;
    border-radius: 50% !important;
    background: var(--jec-accent) !important;
    margin-top: 18px !important;
    position: relative !important;
    z-index: 1 !important;
    box-shadow: 0 0 0 4px var(--jec-bg) !important;
}
.jec-program .jec-pgroup-logistics .jec-prog-dot {
    background: var(--jec-quiet) !important;
    width: 10px !important; height: 10px !important;
    margin-top: 17px !important;
}

.jec-program .jec-prog-body { padding: 8px 0 16px 16px !important; min-width: 0; }

/* One single card treatment — no greyed-out blocks */
.jec-program .jec-prog-card {
    background: var(--jec-bg) !important;
    border: 1px solid var(--jec-border) !important;
    border-radius: var(--jec-radius) !important;
    padding: 16px 18px !important;
    box-shadow: 0 1px 5px rgba(20, 30, 60, .06) !important;
    transition: box-shadow .2s ease, transform .2s ease;
}
.jec-program .jec-prog-card:hover { box-shadow: 0 10px 26px rgba(20, 30, 60, .10) !important; transform: translateY(-2px); }
/* Practical blocks: same card, just more compact and quieter typography */
.jec-program .jec-pgroup-logistics .jec-prog-card { padding: 13px 18px !important; }

.jec-program .jec-prog-type-tag {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .07em !important;
    color: var(--jec-primary) !important;
    margin: 0 0 4px !important;
}
.jec-program .jec-prog-type-tag::before { content: "" !important; width: 7px !important; height: 7px !important; border-radius: 2px !important; background: var(--jec-accent) !important; }
.jec-program .jec-pgroup-logistics .jec-prog-type-tag { color: var(--jec-muted) !important; }
.jec-program .jec-pgroup-logistics .jec-prog-type-tag::before { background: var(--jec-quiet) !important; }

.jec-program .jec-prog-title { color: var(--jec-primary) !important; font-weight: 800 !important; font-size: 16px !important; line-height: 1.35 !important; margin: 0 !important; }
.jec-program .jec-pgroup-logistics .jec-prog-title { color: var(--jec-text) !important; font-weight: 700 !important; font-size: 15px !important; }

.jec-program .jec-prog-room { color: var(--jec-muted) !important; font-size: 13px !important; margin: 5px 0 0 !important; }

/* Description: capped measure keeps lines readable on wide screens */
.jec-program .jec-prog-desc { color: var(--jec-meta-color) !important; font-size: 14.5px !important; line-height: 1.65 !important; margin: 10px 0 0 !important; max-width: 78ch !important; }
.jec-program .jec-prog-desc p { margin: 0 0 10px !important; font-size: inherit !important; line-height: 1.65 !important; color: inherit !important; }
.jec-program .jec-prog-desc p:last-child { margin-bottom: 0 !important; }
.jec-program .jec-prog-desc a { color: var(--jec-primary) !important; text-decoration: underline !important; text-underline-offset: 2px; font-weight: 600 !important; word-break: break-word; }
.jec-program .jec-prog-desc a:hover { color: var(--jec-accent) !important; }

.jec-program .jec-prog-highlights { margin: 12px 0 0 !important; padding: 0 !important; list-style: none !important; max-width: 78ch !important; }
.jec-program .jec-prog-highlights li { position: relative !important; padding: 0 0 0 18px !important; margin: 0 0 6px !important; color: var(--jec-meta-color) !important; font-size: 14.5px !important; line-height: 1.55 !important; }
.jec-program .jec-prog-highlights li::before { content: "" !important; position: absolute !important; left: 2px; top: .6em; width: 6px !important; height: 6px !important; border-radius: 50% !important; background: var(--jec-accent) !important; }

/* ── Linked speakers (scoped + hardened) ── */
.jec-program .jec-prog-speakers-out { display: flex !important; flex-wrap: wrap !important; gap: 14px 32px !important; margin: 16px 0 2px !important; }

.jec-program .jec-speaker {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    flex: 0 1 auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    background: none !important;
    border: 0 none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Avatar: photo, or filled initials (primary) — accent when the speaker has a role */
.jec-program .jec-speaker-photo {
    position: relative !important;
    width: 54px !important;
    height: 54px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: 2px solid var(--jec-primary) !important;
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--jec-primary) !important;
}
.jec-program .jec-speaker-photo img { position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
.jec-program .jec-speaker-initials { position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 17px !important; font-weight: 800 !important; color: var(--jec-on-primary) !important; letter-spacing: .03em; line-height: 1 !important; }
.jec-program .jec-has-role .jec-speaker-photo { background: var(--jec-accent) !important; border-color: var(--jec-accent) !important; }
.jec-program .jec-has-role .jec-speaker-initials { color: var(--jec-on-accent) !important; }

/* Text block: name (+ inline role chip), then function · Company */
.jec-program .jec-speaker-body { display: block !important; flex: 0 1 auto !important; min-width: 0 !important; }
.jec-program .jec-speaker-name { display: block !important; font-weight: 700 !important; color: var(--jec-text) !important; font-size: 15px !important; line-height: 1.3 !important; margin: 0 !important; }
.jec-program .jec-speaker-role {
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 0 2px 8px !important;
    padding: 2px 8px !important;
    border: 0 none !important;
    border-radius: 999px !important;
    background: var(--jec-accent) !important;
    color: var(--jec-on-accent) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
}
.jec-program .jec-speaker-talk {
    display: block !important;
    color: var(--jec-primary) !important;
    font-weight: 600 !important;
    font-size: 13.5px !important;
    line-height: 1.4 !important;
    margin: 3px 0 0 !important;
    max-width: 46ch !important;
}
.jec-program .jec-speaker-meta { color: var(--jec-meta-color) !important; font-size: 13px !important; line-height: 1.4 !important; margin: 3px 0 0 !important; }
.jec-program .jec-speaker-meta .jec-position { color: var(--jec-meta-color) !important; }
.jec-program .jec-speaker-meta .jec-sep { color: var(--jec-muted) !important; margin: 0 3px !important; }
.jec-program .jec-speaker-meta .jec-company { color: var(--jec-text) !important; font-weight: 600 !important; }

/* ── Images / gallery ── */
.jec-program .jec-prog-gallery { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; margin: 14px 0 0 !important; }
.jec-program .jec-prog-figure { margin: 0 !important; flex: 1 1 220px !important; min-width: 0 !important; }
.jec-program .jec-prog-figure img { width: 100% !important; height: auto !important; border-radius: 10px !important; display: block !important; }

/* ── Responsive: stack the timeline on small screens ── */
@media (max-width: 700px) {
    .jec-program { font-size: 15px; }

    .jec-program .jec-prog-day-title { font-size: 15px !important; padding: 11px 14px !important; margin: 26px 0 14px !important; }

    /* No side rail: the time becomes a line above the card */
    .jec-program .jec-prog-item { display: block !important; }
    .jec-program .jec-prog-rail { display: none !important; }

    .jec-program .jec-prog-when {
        text-align: left !important;
        padding: 0 0 6px 2px !important;
        white-space: nowrap !important;
    }
    .jec-program .jec-prog-t1,
    .jec-program .jec-prog-t2 { display: inline !important; font-size: 13px !important; }
    .jec-program .jec-prog-t2::before { content: " – " !important; color: var(--jec-muted) !important; font-weight: 600 !important; }

    .jec-program .jec-prog-body { padding: 0 0 16px 0 !important; }
    .jec-program .jec-prog-card { padding: 14px 15px !important; }
    .jec-program .jec-prog-title { font-size: 15.5px !important; }
    .jec-program .jec-prog-desc,
    .jec-program .jec-prog-highlights li { font-size: 14px !important; }

    /* Speakers: one per row, slightly smaller avatar */
    .jec-program .jec-prog-speakers-out { gap: 12px !important; }
    .jec-program .jec-prog-speakers-out .jec-speaker { flex: 1 1 100% !important; }
    .jec-program .jec-speaker-photo { width: 46px !important; height: 46px !important; }
    .jec-program .jec-speaker-initials { font-size: 15px !important; }
    .jec-program .jec-speaker-name { font-size: 14.5px !important; }
    .jec-program .jec-speaker-role { margin-left: 6px !important; }

    .jec-program .jec-prog-figure { flex: 1 1 100% !important; }
}

/* ── Print: keep the structure readable without background colours ── */
@media print {
    .jec-program { max-width: none !important; }
    .jec-program .jec-prog-day-title {
        background: none !important;
        color: #000 !important;
        border: 1px solid #000 !important;
        border-left-width: 6px !important;
    }
    .jec-program .jec-prog-card { box-shadow: none !important; border: 1px solid #999 !important; }
    .jec-program .jec-prog-item { break-inside: avoid; page-break-inside: avoid; }
    .jec-program .jec-speaker-photo { border: 1px solid #000 !important; background: none !important; }
    .jec-program .jec-speaker-initials { color: #000 !important; }
    .jec-program .jec-speaker-role { background: none !important; color: #000 !important; border: 1px solid #000 !important; }
    .jec-program .jec-prog-desc a { text-decoration: underline !important; }
}
