/* Živý program TCC 2026 - /event/technical-computing-camp-2026/live/
   Vše je pod .tccLive, aby se styly nemíchaly se zbytkem webu.
   Barvy jsou ze site palety (init.css), akcent je matlabová oranžová jako
   u banneru celé akce. */

.tccLive {
   --tccLive-accent: #78b943;
   --tccLive-dark: var(--humusoft-base-color);
   --tccLive-link: #2c7fa7;
   --tccLive-ink: #262626;
   --tccLive-muted: #69777e;
   --tccLive-line: #d8e0e3;
   --tccLive-warm: color-mix(in srgb, #73ff00 15%, #FFFFFF 1%);
   padding-bottom: 3rem;
}

/* Web nemá vlastní pravidlo pro [hidden]; ať se na něj JS může spolehnout. */
.tccLive [hidden] {
   display: none !important;
}

/* Hodiny */

.tccLive .tccLiveClock {
   background-color: var(--tccLive-dark);
   color: #fff;
   margin-bottom: 2rem;
}

.tccLive .tccLiveClockRow {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: 1.5rem;
   padding: 1.4rem 0 1.5rem;
}

.tccLive .tccLiveClockLabel {
   font-size: 0.7rem;
   text-transform: uppercase;
   letter-spacing: 0.14em;
   color: #c6d3d9;
   margin: 0 0 0.4rem;
}

.tccLive .tccLiveDot {
   width: 8px;
   height: 8px;
   background-color: var(--tccLive-accent);
   display: inline-block;
   margin-right: 0.6rem;
}

.tccLive .tccLiveClockTime {
   font-size: 3rem;
   line-height: 1;
   letter-spacing: -0.03em;
   font-weight: 300;
   margin: 0;
}

.tccLive .tccLiveClockPlace {
   text-align: right;
   font-size: 0.8rem;
   color: #c6d3d9;
}

.tccLive .tccLiveClockPlace p {
   margin: 0;
   line-height: 1.5;
}

/* Právě probíhá */

.tccLive .tccLiveNow {
   position: relative;
   padding: 0 0 2rem 1.2rem;
   border-bottom: 1px solid var(--tccLive-line);
}

.tccLive .tccLiveNow:before {
   content: "";
   position: absolute;
   left: 0;
   top: 0.4rem;
   width: 4px;
   height: 4.2rem;
   background-color: var(--tccLive-accent);
}

.tccLive .tccLiveEyebrow,
.tccLive .tccLiveLabel {
   font-size: 1rem;
   letter-spacing: 0.14em;
   text-transform: uppercase;
   color: var(--tccLive-accent);
   margin: 0;
}

.tccLive .tccLiveLabel {
   color: #718087;
}

.tccLive .tccLiveTitle {
   font-size: 2rem;
   line-height: 1.15;
   font-weight: 300;
   letter-spacing: -0.02em;
   margin: 0.7rem 0 0.5rem;
   color: var(--tccLive-ink);
}

.tccLive .tccLiveSpeaker {
   font-size: 1rem;
   line-height: 1.4;
   margin: 0 0 0.8rem;
}

.tccLive .tccLiveDesc {
   font-size: 0.9rem;
   color: var(--tccLive-muted);
   line-height: 1.6;
   max-width: 40rem;
   margin: 0;
}

.tccLive .tccLiveMeta {
   display: flex;
   gap: 1.2rem;
   flex-wrap: wrap;
   margin: 1.1rem 0 0;
   font-size: 0.7rem;
   color: #718087;
}

.tccLive .tccLiveLinks {
   display: flex;
   gap: 1.3rem;
   flex-wrap: wrap;
   margin: 1.1rem 0 0;
}

.tccLive .tccLiveLinks a {
   font-size: 0.8rem;
   text-decoration: none;
   border-bottom: 1px solid #b9cbd4;
   padding-bottom: 2px;
}

/* Následuje */

.tccLive .tccLiveBand {
   padding: 1.5rem 1.2rem 1.6rem;
   background-color: var(--tccLive-warm);
   border-bottom: 1px solid var(--tccLive-line);
}

.tccLive .tccLiveBand h3 {
   font-weight: 300;
   font-size: 1.3rem;
   line-height: 1.25;
   margin: 0.5rem 0 0.3rem;
}

.tccLive .tccLiveBand p:last-child {
   margin: 0;
   font-size: 0.8rem;
   color: var(--tccLive-muted);
   line-height: 1.5;
}

/* Potom */

.tccLive .tccLiveLater {
   padding: 1.8rem 0 0 1.2rem;
}

.tccLive .tccLiveLaterItem {
   display: grid;
   grid-template-columns: 6.5rem 1fr;
   gap: 0.9rem;
   padding: 0.9rem 0;
   border-bottom: 1px solid var(--tccLive-line);
}

.tccLive .tccLiveLaterTime {
   font-size: 0.8rem;
   color: var(--tccLive-link);
}

.tccLive .tccLiveLaterTitle {
   font-size: 0.85rem;
   line-height: 1.45;
}

.tccLive .tccLiveLaterSpeaker {
   display: block;
   color: var(--tccLive-muted);
}

/* Patička bloku a hlášení o spojení */

.tccLive .tccLiveStamp,
.tccLive .tccLiveConnection {
   font-size: 0.7rem;
   color: #95a0a6;
   margin: 1.4rem 0 0;
   padding-left: 1.2rem;
}

.tccLive .tccLiveConnection {
   color: #9a6b16;
   padding-left: 1.2rem;
}

@media only screen and (min-width: 601px) {
   .tccLive .tccLiveClockTime {
      font-size: 3.4rem;
   }
}

@media only screen and (max-width: 480px) {
   .tccLive .tccLiveTitle {
      font-size: 1.6rem;
   }

   .tccLive .tccLiveLaterItem {
      grid-template-columns: 5.2rem 1fr;
   }
}

/* Testovací režim (?time=...) - musí být na první pohled vidět, že to není
   skutečný stav akce. Mimo produkci, viz EventsController. */

.tccLive .tccLiveSimulated {
   background-color: #9a6b16;
   color: #fff;
   font-size: 0.8rem;
   padding: 0.7rem 0;
   line-height: 1.5;
}

.tccLive .tccLiveSimulated code {
   background-color: rgba(255, 255, 255, 0.18);
   padding: 0 0.3rem;
}
