/* =====================================================================
   CommHIT26 full agenda: tile in the Program band + the agenda viewer.
   Loaded only on the commhit26 page, after commhit26.css.
   ===================================================================== */

/* ---------- agenda tile (white card on the gold timeline) ---------- */
.ch-c26-days .ch-agenda-list .ch-agenda-cta{gap:6px}
.ch-agenda-cta__btn{all:unset;box-sizing:border-box;justify-self:start;display:inline-flex;align-items:center;gap:10px;margin-top:8px;padding:10px 16px 10px 18px;border-radius:999px;cursor:pointer;
  background:var(--ch-ink);color:#fff;font:600 14px/1 var(--ch-body);transition:background-color .3s,transform .35s var(--ch-ease)}
.ch-agenda-cta__btn svg{width:16px;height:16px;transition:transform .35s var(--ch-ease)}
.ch-agenda-cta__btn:hover{background:var(--ch-petrol)}
.ch-agenda-cta__btn:hover svg{transform:translateX(3px)}
.ch-agenda-cta__btn:focus-visible{outline:2px solid var(--ch-gold);outline-offset:3px}

/* ---------- viewer ---------- */
.ch-ag{margin:auto;inset:0;padding:0;border:0;width:min(1040px,calc(100vw - 32px));height:min(920px,calc(100vh - 32px));max-width:none;max-height:none;
  border-radius:24px;overflow:hidden;background:#fff;color:var(--ch-ink);box-shadow:0 50px 120px -30px rgba(5,7,13,.7)}
.ch-ag[open]{display:block;animation:ch-ag-in .45s var(--ch-ease) both}
.ch-ag::backdrop{background:rgba(10,14,32,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
@keyframes ch-ag-in{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.ch-ag__frame{display:flex;flex-direction:column;height:100%}

.ch-ag__head{position:relative;flex:none;padding:22px 28px 18px;color:#fff;
  background:radial-gradient(60% 140% at 100% 0%,rgba(242,190,70,.28),transparent 60%),linear-gradient(115deg,#1d4e62 0%,#1a3a54 48%,#1c2037 100%)}
.ch-ag__head::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,rgba(69,181,185,.7) 25%,var(--ch-gold) 70%,var(--ch-yellow))}
.ch-ag__top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.ch-ag__k{margin:0 0 6px;font:500 11px/1.2 var(--ch-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ch-yellow)}
.ch-ag__title{margin:0;font:400 clamp(22px,2.4vw,30px)/1.15 var(--ch-display);color:#fff}
.ch-ag__close{all:unset;box-sizing:border-box;flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.12);color:#fff;font-size:26px;line-height:1;transition:background-color .3s}
.ch-ag__close:hover{background:rgba(255,255,255,.24)}
.ch-ag__close:focus-visible{outline:2px solid var(--ch-yellow);outline-offset:2px}

.ch-ag__bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-top:18px}
.ch-ag__tabs{display:flex;gap:8px}
.ch-ag__tab{all:unset;box-sizing:border-box;cursor:pointer;display:grid;gap:3px;padding:10px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.18);
  background:rgba(12,20,44,.25);color:rgba(255,255,255,.72);transition:background-color .3s,border-color .3s,color .3s}
.ch-ag__tab b{font:600 15px/1.1 var(--ch-body);color:inherit}
.ch-ag__tab span{font:500 11px/1.2 var(--ch-mono);letter-spacing:.06em;color:inherit;opacity:.85}
.ch-ag__tab:hover{color:#fff}
.ch-ag__tab[aria-selected="true"]{background:rgba(255,255,255,.12);border-color:rgba(242,231,92,.7);color:#fff}
.ch-ag__tab[aria-selected="true"] span{color:var(--ch-yellow);opacity:1}
.ch-ag__tab:focus-visible{outline:2px solid var(--ch-yellow);outline-offset:2px}

.ch-ag__acts{display:flex;gap:8px;align-items:center}
.ch-ag__act{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;
  border:1px solid rgba(255,255,255,.3);color:#fff;font:600 14px/1 var(--ch-body);text-decoration:none;transition:background-color .3s,border-color .3s,transform .3s}
.ch-ag__act svg{width:17px;height:17px}
.ch-ag__act:hover{background:rgba(255,255,255,.12)}
.ch-ag__act--gold{background:var(--ch-gold);border-color:var(--ch-gold);color:#1b1505}
.ch-ag__act--gold:hover{background:#e4b13c;border-color:#e4b13c}
.ch-ag__act:focus-visible{outline:2px solid var(--ch-yellow);outline-offset:2px}
.ch-ag__share{position:relative}
.ch-ag__menu{position:absolute;z-index:5;right:0;top:calc(100% + 8px);min-width:190px;padding:6px;border-radius:14px;background:#fff;
  box-shadow:0 0 0 1px rgba(20,32,58,.08),0 24px 50px -18px rgba(5,7,13,.6)}
.ch-ag__menu[hidden]{display:none}
.ch-ag__menu>*{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border-radius:9px;
  font:500 14px/1.2 var(--ch-body);color:var(--ch-ink);text-decoration:none}
.ch-ag__menu>* svg{width:18px;height:18px;color:var(--ch-petrol)}
.ch-ag__menu>*:hover,.ch-ag__menu>*:focus-visible{background:var(--ch-mist,#eef4f6)}

.ch-ag__body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:22px 28px 26px;scroll-padding-top:12px}
.ch-ag__intro{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:16px;margin-bottom:8px;border-bottom:1px solid var(--ch-rule)}
.ch-ag__intro h3{margin:0 0 4px;font:400 clamp(20px,2vw,24px)/1.2 var(--ch-display);color:var(--ch-ink)}
.ch-ag__intro p{margin:0;font:500 12px/1.3 var(--ch-mono);letter-spacing:.06em;color:#a26f08}
.ch-ag__expand{all:unset;box-sizing:border-box;cursor:pointer;flex:none;padding:8px 14px;border-radius:999px;border:1px solid var(--ch-rule);
  font:600 13px/1 var(--ch-body);color:var(--ch-petrol);transition:border-color .3s,background-color .3s}
.ch-ag__expand:hover{border-color:var(--ch-teal)}
.ch-ag__expand:focus-visible{outline:2px solid var(--ch-gold);outline-offset:2px}

/* timeline */
.ch-ag__list{list-style:none;margin:0;padding:0}
.ch-ag__list>li{position:relative;padding-left:0}
.ch-ag__time{flex:none;width:118px;padding-right:18px;font:500 13px/1.35 var(--ch-mono);letter-spacing:.02em;color:#a26f08;font-variant-numeric:tabular-nums}
.ch-ag__main{position:relative;flex:1;min-width:0;display:grid;gap:4px;padding:0 0 0 24px;border-left:2px solid rgba(209,156,40,.35)}
.ch-ag__ses summary,.ch-ag__row{position:relative;display:flex;align-items:flex-start;padding:12px 6px 14px 0}
.ch-ag__ses summary{list-style:none;cursor:pointer;border-radius:12px;transition:background-color .25s}
.ch-ag__ses summary::-webkit-details-marker{display:none}
.ch-ag__ses summary:hover{background:#f6f9fa}
.ch-ag__ses summary:focus-visible{outline:2px solid var(--ch-gold);outline-offset:2px}
.ch-ag__ses .ch-ag__main::before{content:"";position:absolute;left:-7px;top:5px;width:12px;height:12px;border-radius:50%;background:var(--ch-yellow);
  box-shadow:0 0 0 4px rgba(242,231,92,.25),0 0 0 5px rgba(209,156,40,.35)}
.ch-ag__open{font:500 11px/1.3 var(--ch-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ch-teal)}
.ch-ag__ttl{font:400 clamp(16px,1.5vw,19px)/1.3 var(--ch-display);color:var(--ch-ink)}
.ch-ag__who{font:500 14px/1.45 var(--ch-body);color:#526072}
.ch-ag__soon{justify-self:start;margin-top:2px;padding:3px 10px;border-radius:999px;border:1px dashed rgba(20,32,58,.3);font:500 12px/1.4 var(--ch-body);color:#526072}
.ch-ag__tag{display:inline-block;margin-left:10px;padding:3px 9px;border-radius:999px;vertical-align:3px;background:#e6f1f2;color:var(--ch-petrol);
  font:600 10px/1.2 var(--ch-mono);letter-spacing:.12em;text-transform:uppercase}
.ch-ag__tag--gold{background:#fbefc9;color:#7a5306}
.ch-ag__chev{flex:none;width:30px;height:30px;margin-left:10px;border-radius:50%;border:1px solid var(--ch-rule);position:relative;transition:transform .35s var(--ch-ease),background-color .25s}
.ch-ag__chev::before{content:"";position:absolute;left:50%;top:45%;width:8px;height:8px;border-right:2px solid var(--ch-petrol);border-bottom:2px solid var(--ch-petrol);transform:translate(-50%,-50%) rotate(45deg)}
details[open]>summary .ch-ag__chev{transform:rotate(180deg);background:#f1f6f7}
.ch-ag__more{margin:-4px 0 12px 118px;padding:2px 0 6px 24px;border-left:2px solid rgba(209,156,40,.35);animation:ch-ag-more .35s var(--ch-ease) both}
@keyframes ch-ag-more{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.ch-ag__note{margin:0 0 10px;font:italic 400 14px/1.55 var(--ch-body);color:#3d4a5c}
.ch-ag__mod{margin:0 0 10px;font:500 14px/1.4 var(--ch-body);color:var(--ch-ink)}
.ch-ag__mod span{margin-right:6px;font:600 10.5px/1 var(--ch-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ch-teal)}
.ch-ag__spk{list-style:none;margin:0;padding:0;display:grid;gap:12px 24px}
.ch-ag__spk--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ch-ag__spk li{padding:2px 0 2px 12px;border-left:2px solid #e3eaed}
.ch-ag__spk b{display:block;font:600 14.5px/1.35 var(--ch-body);color:var(--ch-ink)}
.ch-ag__spk span{display:block;margin-top:2px;font:400 13.5px/1.5 var(--ch-body);color:#526072}

/* breaks: slim dashed rows */
.ch-ag__brk{display:flex;align-items:center;padding:6px 6px 6px 0}
.ch-ag__brk .ch-ag__time{color:#7a8596;font-size:12px}
.ch-ag__brk-t{position:relative;flex:1;padding:4px 0 4px 24px;border-left:2px dashed rgba(209,156,40,.35);
  font:600 11px/1.3 var(--ch-mono);letter-spacing:.14em;text-transform:uppercase;color:#7a8596}
.ch-ag__brk-t::before{content:"";position:absolute;left:-4px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:#c4ccd4}

.ch-ag__foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-top:22px;padding-top:18px;border-top:1px solid var(--ch-rule)}
.ch-ag__foot p{margin:0;font:400 13px/1.5 var(--ch-body);color:#526072}
.ch-ag__reg{display:inline-flex;align-items:center;gap:10px;padding:11px 18px 11px 20px;border-radius:999px;background:var(--ch-ink);color:#fff;
  font:600 14px/1 var(--ch-body);text-decoration:none;transition:background-color .3s}
.ch-ag__reg svg{width:16px;height:16px;transition:transform .35s var(--ch-ease)}
.ch-ag__reg:hover{background:var(--ch-petrol)}
.ch-ag__reg:hover svg{transform:translateX(3px)}

/* phones: full screen, stacked header */
@media (max-width:720px){
  .ch-ag{width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .ch-ag__head{padding:16px 16px 14px}
  .ch-ag__bar{margin-top:14px}
  .ch-ag__tabs{width:100%}
  .ch-ag__tab{flex:1;padding:9px 12px}
  .ch-ag__acts{width:100%}
  .ch-ag__acts>*{flex:1}
  .ch-ag__act{justify-content:center;width:100%}
  .ch-ag__body{padding:16px 14px 22px}
  .ch-ag__intro{flex-direction:column;align-items:flex-start}
  .ch-ag__ses summary,.ch-ag__row{flex-wrap:wrap;padding-top:10px}
  .ch-ag__time{width:100%;padding:0 40px 4px 26px}
  .ch-ag__brk .ch-ag__time{width:auto;padding:0 12px 0 0}
  .ch-ag__chev{position:absolute;right:4px;top:8px;width:28px;height:28px}
  .ch-ag__more{margin-left:0}
  .ch-ag__spk--2{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){.ch-ag[open],.ch-ag__more{animation:none}}
