/* JASPEST — pemberitahuan cookie (versi 2). Kelas berawalan .ck-; gerbang video memakai .video-consent/.cc-btn */
.ck-bar{position:fixed;left:50%;bottom:20px;z-index:90;transform:translateX(-50%);width:min(980px,calc(100vw - 32px));box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:18px 20px 18px 22px;border-radius:16px;background:#102548;color:#e9eefb;font-family:var(--font,Arial,Helvetica,sans-serif);box-shadow:0 20px 60px #04102a66,0 0 0 1px #ffffff1f inset;animation:ck-up .45s cubic-bezier(.2,.8,.2,1) both}
.ck-msg{display:flex;align-items:flex-start;gap:14px;min-width:0}
.ck-ico{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#ffffff14;color:#ffb3bb}
.ck-title{margin:0 0 4px;font-size:15px;font-weight:700;color:#fff;line-height:1.3}
.ck-text{margin:0;font-size:12.5px;line-height:1.65;color:#bdcbe6}
.ck-inline{display:inline;padding:0;border:0;background:none;font:inherit;font-weight:700;color:#fff;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.ck-actions{flex:none;display:flex;align-items:center;gap:10px}
.ck-btn{min-height:42px;padding:10px 18px;border-radius:10px;border:1.5px solid transparent;font:inherit;font-size:13px;font-weight:700;line-height:1.2;cursor:pointer;white-space:nowrap;transition:background-color .15s,border-color .15s,transform .15s}
.ck-solid{background:var(--red,#e02028);color:#fff}
.ck-solid:hover{background:var(--red-dark,#bd161e)}
.ck-line{background:transparent;color:#fff;border-color:#ffffff59}
.ck-line:hover{background:#ffffff14;border-color:#fff}
.ck-ghost{background:transparent;color:#bdcbe6;padding-inline:10px;text-decoration:underline;text-underline-offset:4px}
.ck-ghost:hover{color:#fff}
.ck-bar :focus-visible,.ck-panel :focus-visible{outline:3px solid #7fb0ff;outline-offset:2px;border-radius:8px}
.ck-open .chat-launcher{bottom:calc(var(--ck-h,0px) + 40px)}

.ck-panel{margin:0 0 0 auto;padding:0;border:0;width:min(440px,100vw);max-width:100vw;height:100dvh;max-height:100dvh;background:#fff;color:var(--ink,#132b4e);box-shadow:-20px 0 60px #04102a40;font-family:var(--font,Arial,Helvetica,sans-serif)}
.ck-panel[open]{animation:ck-in .3s cubic-bezier(.2,.8,.2,1) both}
.ck-panel::backdrop{background:#07172c99;backdrop-filter:blur(3px)}
.ck-panel-in{display:flex;flex-direction:column;height:100%}
.ck-panel header{display:flex;justify-content:space-between;gap:16px;padding:26px 24px 14px;border-bottom:1px solid var(--line,#e2e8f2)}
.ck-panel h2{margin:0 0 6px;font-size:21px;letter-spacing:-.5px;line-height:1.25}
.ck-panel header p{margin:0;font-size:12.5px;line-height:1.65;color:#4d607c}
.ck-x{flex:none;align-self:flex-start;width:38px;height:38px;border:1px solid var(--line,#e2e8f2);border-radius:10px;background:#fff;font-size:22px;line-height:1;color:var(--ink,#132b4e);cursor:pointer}
.ck-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:6px 24px}
.ck-cat{padding:20px 0;border-top:1px solid var(--line,#e2e8f2)}
.ck-cat:first-child{border-top:0}
.ck-cat-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ck-cat h3{margin:0;font-size:15px}
.ck-cat>p{margin:8px 0 0;font-size:12.5px;line-height:1.7;color:#4d607c}
.ck-cat ul{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:6px}
.ck-cat li{padding:9px 12px;border-radius:8px;background:var(--light,#f4f7fc);font-size:12px;line-height:1.6;color:#4d607c}
.ck-cat code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11.5px;font-weight:700;color:var(--ink,#132b4e)}
.ck-always{padding:5px 11px;border-radius:99px;background:#e6f6ed;color:#1c7a4a;font-size:11px;font-weight:700;white-space:nowrap}
.ck-switch{position:relative;display:inline-flex;flex:none;cursor:pointer}
.ck-switch input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.ck-track{position:relative;width:46px;height:26px;border-radius:99px;background:#b9c4d6;transition:background-color .2s}
.ck-track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s}
.ck-switch input:checked+.ck-track{background:var(--blue,#00a8f0)}
.ck-switch input:checked+.ck-track::after{transform:translateX(20px)}
.ck-switch input:focus-visible+.ck-track{outline:3px solid #2b7de9;outline-offset:2px}
.ck-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ck-panel footer{display:flex;flex-wrap:wrap;gap:10px;padding:16px 24px 22px;border-top:1px solid var(--line,#e2e8f2)}
.ck-panel footer .ck-btn{flex:1 1 120px}
.ck-panel footer .ck-line{color:#0a6c9c;border-color:var(--blue,#00a8f0)}
.ck-panel footer .ck-line:hover{background:#eef3fd}

/* Gerbang video TikTok (dipakai app.js) */
.cc-btn{min-height:40px;padding:9px 16px;border-radius:10px;border:2px solid #fff;font:inherit;font-size:12px;font-weight:700;cursor:pointer;background:#fff;color:#0a6c9c}
.cc-btn:hover{background:#eef3fd}
.video-consent{position:absolute;left:20px;right:20px;bottom:18px;z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:14px 16px;border-radius:12px;background:#081b36d9;backdrop-filter:blur(6px);color:#e8eefb}
.video-consent p{margin:0;font-size:12px;line-height:1.6;color:#e8eefb}

@keyframes ck-up{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes ck-in{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
@media(max-width:820px){
  .ck-bar{flex-direction:column;align-items:stretch;gap:14px;bottom:12px;width:calc(100vw - 24px);padding:16px}
  .ck-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .ck-solid{grid-column:1 / -1;order:-1}
  .ck-ghost{grid-column:auto}
  .ck-open .chat-launcher{bottom:calc(var(--ck-h,0px) + 28px)}
}
@media(prefers-reduced-motion:reduce){.ck-bar,.ck-panel[open]{animation:none}.ck-track,.ck-track::after{transition:none}}
@media print{.ck-bar,.ck-panel{display:none!important}}
