/* ==========================================================
   PTUN KUPANG — DISPLAY HARI INI
   Direction: institutional digital signage / deep-blue editorial.
   Full-width rows, high contrast, optimized for TV & lobby screens.
   ========================================================== */

:root{
    --d-night:#020a18;
    --d-deep:#041a39;
    --d-blue:#0751ad;
    --d-royal:#1269dd;
    --d-cyan:#67dcff;
    --d-ice:#dff5ff;
    --d-white:#ffffff;
    --d-ink:#0b2144;
    --d-muted:#8eabc7;
    --d-line:rgba(143,199,255,.16);
    --d-panel:rgba(255,255,255,.965);
    --d-indigo:#5868ef;
    --d-gold:#f3c64f;
}

*{box-sizing:border-box}
html{background:var(--d-night);scroll-behavior:auto}
body.today-display{
    margin:0;
    min-height:100vh;
    overflow-x:hidden;
    color:#fff;
    font-family:"Manrope","Segoe UI",sans-serif;
    background:
        radial-gradient(circle at 92% 3%,rgba(18,105,221,.27),transparent 31rem),
        radial-gradient(circle at 10% 82%,rgba(88,104,239,.16),transparent 34rem),
        linear-gradient(135deg,#020912 0%,#031328 48%,#061f46 100%);
}

.today-atmosphere{
    position:fixed;
    inset:0;
    overflow:hidden;
    z-index:0;
    pointer-events:none;
}
.today-grid-pattern{
    position:absolute;
    inset:0;
    opacity:.13;
    background-image:
        linear-gradient(rgba(111,205,255,.10) 1px,transparent 1px),
        linear-gradient(90deg,rgba(111,205,255,.10) 1px,transparent 1px);
    background-size:64px 64px;
    mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.45) 58%,transparent 100%);
}
.today-orbit{
    position:absolute;
    border:1px solid rgba(117,213,255,.14);
    border-radius:50%;
}
.orbit-one{
    width:620px;height:620px;
    right:-220px;top:-300px;
    box-shadow:0 0 0 78px rgba(255,255,255,.018),0 0 0 156px rgba(255,255,255,.012);
}
.orbit-two{
    width:420px;height:420px;
    left:-230px;bottom:-180px;
    box-shadow:0 0 0 60px rgba(88,104,239,.025);
}

.today-shell{
    position:relative;
    z-index:1;
    width:min(1780px,calc(100% - 56px));
    margin:0 auto;
    padding:24px 0 20px;
}

/* Header */
.today-header{
    position:relative;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:28px;
    min-height:112px;
    padding:16px 22px;
    border:1px solid rgba(139,209,255,.16);
    border-radius:28px;
    background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.035));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 24px 60px rgba(0,0,0,.13);
    backdrop-filter:blur(16px);
}
.today-header::after{
    content:"";
    position:absolute;
    left:34px;right:34px;bottom:-1px;height:2px;
    background:linear-gradient(90deg,transparent,var(--d-cyan),var(--d-royal),transparent);
    opacity:.75;
}
.today-brand{
    display:flex;
    align-items:center;
    gap:16px;
    min-width:0;
}
.today-logo-wrap{
    width:70px;height:70px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border-radius:50%;
    border:1px solid rgba(103,220,255,.30);
    background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.16),rgba(18,105,221,.08));
    box-shadow:0 0 0 5px rgba(103,220,255,.045),0 12px 28px rgba(0,0,0,.22);
}
.today-logo-wrap img{width:58px;height:58px;object-fit:contain}
.today-brand-copy{min-width:0}
.today-brand-copy span{
    display:block;
    color:#8fc9f4;
    font-size:.68rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.16em;
    white-space:nowrap;
}
.today-brand-copy strong{
    display:block;
    margin-top:6px;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:1.17rem;
    font-weight:700;
    line-height:1.15;
    letter-spacing:-.025em;
    color:#fff;
}

.today-header-center{text-align:center}
.today-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:#8dd5ff;
    font-size:.67rem;
    font-weight:800;
    letter-spacing:.19em;
    text-transform:uppercase;
}
.today-kicker::before,
.today-kicker::after{
    content:"";
    width:22px;height:1px;
    background:rgba(103,220,255,.55);
}
.today-header-center h1{
    margin:4px 0 0;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:clamp(2rem,3.2vw,3.35rem);
    font-weight:720;
    letter-spacing:-.055em;
    line-height:.95;
}

.today-clock-panel{
    justify-self:end;
    display:grid;
    grid-template-columns:auto auto;
    align-items:end;
    column-gap:8px;
    text-align:right;
}
.today-clock-panel span{
    grid-column:1/-1;
    color:#8fb8dc;
    font-size:.72rem;
    font-weight:700;
    text-transform:capitalize;
}
.today-clock-panel strong{
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:2.25rem;
    line-height:1;
    letter-spacing:-.055em;
}
.today-clock-panel small{
    padding-bottom:3px;
    color:#73dfff;
    font-size:.62rem;
    font-weight:800;
    letter-spacing:.12em;
}

/* Summary rail */
.today-summary{
    display:grid;
    grid-template-columns:minmax(300px,1.4fr) repeat(3,minmax(150px,.55fr)) minmax(240px,.95fr);
    align-items:stretch;
    gap:10px;
    margin:14px 0 22px;
}
.today-summary > div{
    min-height:80px;
    border:1px solid rgba(134,202,255,.12);
    background:rgba(255,255,255,.045);
    border-radius:20px;
}
.today-summary-date{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:15px 20px;
    background:linear-gradient(135deg,rgba(18,105,221,.19),rgba(255,255,255,.045)) !important;
}
.today-summary-date span{
    color:#85b4d9;
    font-size:.66rem;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
}
.today-summary-date strong{
    margin-top:4px;
    font-size:.98rem;
    letter-spacing:-.01em;
}
.today-stat{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-template-rows:1fr 1fr;
    align-items:center;
    column-gap:9px;
    padding:11px 16px;
}
.today-stat-number{
    grid-row:1/3;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:2rem;
    font-weight:720;
    letter-spacing:-.055em;
}
.today-stat-label{
    align-self:start;
    color:#9ab6d0;
    font-size:.66rem;
    font-weight:700;
    line-height:1.25;
}
.today-stat-dot{
    display:none;
    width:7px;height:7px;border-radius:50%;
}
.today-stat-dot.hearing{background:var(--d-cyan)}
.today-stat-dot.prep{background:#9aa5ff}

.today-sync{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 17px;
}
.today-sync-pulse{
    width:10px;height:10px;
    flex:0 0 auto;
    border-radius:50%;
    background:var(--d-cyan);
    box-shadow:0 0 0 6px rgba(103,220,255,.09),0 0 20px rgba(103,220,255,.38);
}
.today-sync.is-stale .today-sync-pulse{
    background:#f3c64f;
    box-shadow:0 0 0 6px rgba(243,198,79,.09);
}
.today-sync span:not(.today-sync-pulse){
    display:block;
    color:#8faec9;
    font-size:.65rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
}
.today-sync strong{
    display:block;
    margin-top:3px;
    color:#fff;
    font-size:.77rem;
}

/* Vertical schedule list */
.today-main{min-height:55vh}
.today-list{
    display:flex;
    flex-direction:column;
    gap:16px;
    width:100%;
}
.today-card{
    position:relative;
    display:grid;
    grid-template-columns:64px 150px minmax(0,1fr) 250px;
    align-items:stretch;
    min-height:224px;
    overflow:hidden;
    color:var(--d-ink);
    border:1px solid rgba(117,188,255,.20);
    border-radius:28px;
    background:
        radial-gradient(circle at 100% 0%,rgba(34,139,255,.08),transparent 18rem),
        var(--d-panel);
    box-shadow:0 20px 60px rgba(0,0,0,.14);
}
.today-card::before{
    content:"";
    position:absolute;
    left:0;top:0;bottom:0;width:6px;
    background:linear-gradient(180deg,var(--d-cyan),var(--d-royal));
}
.today-card.is-preparation::before{
    background:linear-gradient(180deg,#aab2ff,var(--d-indigo));
}
.today-card::after{
    content:"";
    position:absolute;
    width:150px;height:150px;
    right:-72px;top:-82px;
    border-radius:50%;
    border:24px solid rgba(18,105,221,.045);
    pointer-events:none;
}
.today-sequence{
    display:grid;
    place-items:center;
    padding-left:5px;
    color:#7a9abb;
    background:linear-gradient(180deg,#f8fbff,#eef6ff);
    border-right:1px solid #e0ecf8;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:1rem;
    font-weight:800;
    letter-spacing:.05em;
}
.today-card.is-preparation .today-sequence{
    color:#6671d4;
    background:linear-gradient(180deg,#f8f8ff,#f0f1ff);
}
.today-time{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:18px;
    border-right:1px solid #e1ecf7;
    background:rgba(242,248,255,.72);
}
.today-card.is-preparation .today-time{background:rgba(244,244,255,.80)}
.today-time strong{
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:2.25rem;
    font-weight:750;
    line-height:1;
    letter-spacing:-.065em;
    color:#0751ad;
}
.today-card.is-preparation .today-time strong{color:#4e5bd1}
.today-time span{
    color:#7590ad;
    font-size:.62rem;
    font-weight:800;
    letter-spacing:.16em;
}

.today-card-body{
    min-width:0;
    padding:21px 25px 22px;
}
.today-card-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
    margin-bottom:8px;
}
.today-type,
.today-room{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:27px;
    padding:5px 10px;
    border-radius:999px;
    font-size:.65rem;
    font-weight:800;
}
.today-type{
    color:#0860ad;
    border:1px solid #cceaff;
    background:#e8f7ff;
    text-transform:uppercase;
    letter-spacing:.045em;
}
.today-card.is-preparation .today-type{
    color:#4b56c7;
    border-color:#dce0ff;
    background:#eff0ff;
}
.today-type i{
    width:6px;height:6px;border-radius:50%;
    background:#2ebdf2;
}
.today-card.is-preparation .today-type i{background:#7a86ef}
.today-room{
    color:#5f7791;
    border:1px solid #e0ebf6;
    background:#f6f9fc;
}
.today-room svg{width:13px;height:13px;fill:#437dbb}

.today-card-body h2{
    margin:0;
    color:#092b5b;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:clamp(1.35rem,2vw,2rem);
    font-weight:760;
    line-height:1.1;
    letter-spacing:-.035em;
}
.today-agenda{
    margin:7px 0 14px;
    color:#324f70;
    font-size:.96rem;
    font-weight:650;
    line-height:1.45;
}

.today-parties{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    padding-top:13px;
    border-top:1px dashed #d7e5f3;
}
.today-party{
    min-width:0;
    padding:11px 13px;
    border:1px solid #e0eaf5;
    border-radius:15px;
    background:#f9fcff;
}
.today-party-title{
    margin-bottom:7px;
    color:#2b62a3;
    font-size:.63rem;
    font-weight:850;
    text-transform:uppercase;
    letter-spacing:.10em;
}
.today-party ol{
    margin:0;
    padding-left:1.25rem;
    color:#425b78;
    font-size:.72rem;
    font-weight:600;
    line-height:1.45;
}
.today-party li{padding-left:2px;overflow-wrap:anywhere}
.today-party li+li{margin-top:4px}
.today-party li::marker{color:#1269dd;font-weight:800}
.today-party-empty{
    margin:0;
    color:#8092a6;
    font-size:.72rem;
    font-style:italic;
}

.today-side{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:22px;
    border-left:1px solid #e1ecf7;
    background:linear-gradient(160deg,#f7fbff,#edf6ff);
}
.today-card.is-preparation .today-side{
    background:linear-gradient(160deg,#fafaff,#f1f2ff);
}
.today-side-label{
    margin-bottom:7px;
    color:#7b91aa;
    font-size:.61rem;
    font-weight:850;
    letter-spacing:.13em;
    text-transform:uppercase;
}
.today-side strong{
    color:#163d6e;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:1.08rem;
    font-weight:720;
    line-height:1.25;
}
.today-side span{
    margin-top:8px;
    color:#7c91aa;
    font-size:.67rem;
    font-weight:650;
}

/* Empty state */
.today-empty{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:34px;
    min-height:460px;
    padding:50px;
    border:1px solid rgba(129,203,255,.15);
    border-radius:34px;
    background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.03));
    text-align:left;
}
.today-empty-calendar{
    width:150px;height:150px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:34px;
    border:1px solid rgba(103,220,255,.22);
    background:linear-gradient(145deg,rgba(18,105,221,.26),rgba(255,255,255,.04));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 22px 50px rgba(0,0,0,.14);
}
.today-empty-calendar span{
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:4rem;
    font-weight:760;
    line-height:.9;
}
.today-empty-calendar small{
    margin-top:10px;
    color:#7cdcff;
    font-size:.8rem;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase;
}
.today-empty-kicker{
    color:#7ddcff;
    font-size:.66rem;
    font-weight:850;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.today-empty h2{
    margin:6px 0 8px;
    font-family:"Bricolage Grotesque","Manrope",sans-serif;
    font-size:clamp(2rem,4vw,4rem);
    font-weight:720;
    letter-spacing:-.055em;
}
.today-empty p{margin:0;color:#92aec9}

/* Footer */
.today-footer{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:20px 4px 4px;
    color:#7697b6;
    font-size:.68rem;
    font-weight:650;
}
.today-footer > div{
    display:flex;
    align-items:center;
    gap:8px;
}
.today-footer-mark{
    width:7px;height:7px;border-radius:50%;
    background:#67dcff;
    box-shadow:0 0 0 5px rgba(103,220,255,.07);
}

/* Entrance */
@media (prefers-reduced-motion:no-preference){
    .today-card{
        animation:today-rise .55s cubic-bezier(.2,.7,.2,1) both;
    }
    .today-card:nth-child(2){animation-delay:.05s}
    .today-card:nth-child(3){animation-delay:.10s}
    .today-card:nth-child(4){animation-delay:.15s}
    @keyframes today-rise{
        from{opacity:0;transform:translateY(16px)}
        to{opacity:1;transform:translateY(0)}
    }
}

/* Responsive */
@media(max-width:1200px){
    .today-shell{width:min(100% - 30px,1600px)}
    .today-header{grid-template-columns:1fr 1fr}
    .today-header-center{display:none}
    .today-summary{
        grid-template-columns:minmax(260px,1.3fr) repeat(3,minmax(130px,.55fr));
    }
    .today-sync{display:none}
    .today-card{grid-template-columns:56px 130px minmax(0,1fr)}
    .today-side{
        grid-column:2/4;
        border-left:0;
        border-top:1px solid #e1ecf7;
        padding:12px 20px;
        flex-direction:row;
        justify-content:flex-start;
        gap:12px;
        align-items:center;
    }
    .today-side-label{margin:0}
    .today-side span{margin:0}
}
@media(max-width:800px){
    .today-shell{width:calc(100% - 20px);padding-top:10px}
    .today-header{
        grid-template-columns:1fr;
        gap:12px;
        border-radius:22px;
    }
    .today-clock-panel{justify-self:start;text-align:left}
    .today-brand-copy span{white-space:normal}
    .today-summary{
        grid-template-columns:repeat(3,1fr);
    }
    .today-summary-date{grid-column:1/-1}
    .today-card{
        grid-template-columns:56px 110px minmax(0,1fr);
        border-radius:22px;
    }
    .today-parties{grid-template-columns:1fr}
    .today-side{grid-column:1/-1}
}
@media(max-width:560px){
    .today-summary{grid-template-columns:1fr}
    .today-summary-date{grid-column:auto}
    .today-card{
        grid-template-columns:54px 1fr;
    }
    .today-time{
        border-right:0;
        border-bottom:1px solid #e1ecf7;
        align-items:flex-start;
    }
    .today-card-body{
        grid-column:1/-1;
        padding:18px;
    }
    .today-sequence{grid-row:1}
    .today-side{grid-column:1/-1}
    .today-footer{flex-direction:column}
}


/* Tergugat Intervensi: satu kartu dengan Tergugat, subjudul & nomor baru */
.today-party-subgroup + .today-party-subgroup{
    margin-top:12px;
    padding-top:12px;
    border-top:1px dashed #cfdeed;
}

.today-party-title-intervention{
    color:#5867d7;
}

.today-party-title-intervention::before{
    content:"";
    display:inline-block;
    width:6px;
    height:6px;
    margin-right:7px;
    border-radius:50%;
    background:#6c79e9;
    vertical-align:1px;
    box-shadow:0 0 0 4px rgba(108,121,233,.10);
}

.today-party-intervention li::marker{
    color:#5c6bdc;
}
