/* GGKEYS Live Chat page (/live-chat/, page 5685), 13 Oct 2026: one centred column, the chat is the main element.
   Loaded only on that page while inc/ggk-livechat.php applies (body class ggk-lc2). Shortcode markup: .ggk-lc */

/* the old widgets (title + 360px Tawk box) give way to the shortcode */
body.ggk-lc2 .elementor-element-a3cdf3c,body.ggk-lc2 .elementor-element-30ee3d8{display:none!important}
body.ggk-lc2 .elementor-element-ggklc01{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;padding:0!important}

.ggk-lc{--lc-o:#f04625;--lc-o2:#ff6a3d;--lc-ok:#2bd49a;--lc-warn:#ffb547;--lc-s1:#15181e;--lc-s2:#1b1f27;--lc-line:rgba(255,255,255,.07);--lc-line2:rgba(255,255,255,.12);--lc-text:#f5f6f8;--lc-muted:#a3a8b3;--lc-head:var(--g-head,"Readex Pro",Arial,sans-serif);--lc-body:var(--g-body,Inter,system-ui,Arial,sans-serif);width:100%;padding:18px 15px 72px;color:var(--lc-muted);font:400 15px/1.55 var(--lc-body)}
.ggk-lc *{box-sizing:border-box}
.ggk-lc p{margin:0}
.ggk-lc svg{width:16px;height:16px;flex:none}
.ggk-lc-wrap{width:100%;max-width:640px;margin:0 auto}

/* title row: heading + live status */
.ggk-lc-top{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;margin-bottom:16px}
.ggk-lc h1{margin:0 0 4px;color:var(--lc-text);font:700 32px/1.1 var(--lc-head);letter-spacing:-.015em}
.ggk-lc-top p{font-size:15px}
.ggk-lc-status{display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 12px;border-radius:999px;background:var(--lc-s1);border:1px solid var(--lc-line2);font-size:13px;white-space:nowrap}
.ggk-lc-status strong{color:var(--lc-text);font:600 13.5px/1.2 var(--lc-head)}
.ggk-lc-status [data-lc-sub]{color:var(--lc-muted)}
.ggk-lc-dot{position:relative;width:9px;height:9px;border-radius:50%;background:#6d7480;flex:none}
.ggk-lc[data-status="online"] .ggk-lc-dot{background:var(--lc-ok);box-shadow:0 0 0 3px rgba(43,212,154,.18)}
.ggk-lc[data-status="online"] .ggk-lc-dot:after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(43,212,154,.5);animation:ggklcping 1.8s ease-out infinite}
.ggk-lc[data-status="away"] .ggk-lc-dot{background:var(--lc-warn)}
.ggk-lc[data-status="loading"] .ggk-lc-dot{animation:ggklcblink 1s ease-in-out infinite}
@keyframes ggklcping{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.9);opacity:0}}
@keyframes ggklcblink{50%{opacity:.35}}

/* the chat */
.ggk-lc-card{position:relative;height:660px;overflow:hidden;border-radius:20px;background:var(--lc-s2);border:1px solid var(--lc-line2);box-shadow:0 30px 80px -36px rgba(0,0,0,.9),0 0 0 6px rgba(255,255,255,.02)}
.ggk-lc-card>div[id^="tawk_"]{position:relative;z-index:1;width:100%;height:100%}
.ggk-lc-card>div[id^="tawk_"] iframe{width:100%!important;height:100%!important;border:0!important}
.ggk-lc-loading{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;font-size:14px}
.ggk-lc-loading span{width:28px;height:28px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:var(--lc-o);animation:ggklcspin .8s linear infinite}
.ggk-lc.is-loaded .ggk-lc-loading{display:none}
@keyframes ggklcspin{to{transform:rotate(360deg)}}

/* under the chat: one hint, one row of small links */
.ggk-lc-hint{display:flex;align-items:flex-start;justify-content:center;gap:8px;margin-top:16px!important;font-size:13.5px;text-align:center}
.ggk-lc-hint svg{margin-top:2px;color:var(--lc-o2)}
.ggk-lc-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}
.ggk-lc-links a{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;background:var(--lc-s1);border:1px solid var(--lc-line);color:var(--lc-text)!important;font-size:13.5px;text-decoration:none;transition:border-color .15s,background .15s}
.ggk-lc-links a:hover{border-color:rgba(240,70,37,.55);background:rgba(240,70,37,.06)}
.ggk-lc-links svg{color:var(--lc-o2)}
.ggk-lc-short{display:none}

@media (max-width:767px){
	.ggk-lc{padding:6px 12px 44px}
	.ggk-lc h1{font-size:26px}
	.ggk-lc-top{align-items:flex-start;margin-bottom:12px}
	.ggk-lc-card{height:560px;border-radius:16px}
	.ggk-lc-hint{justify-content:flex-start;text-align:left}
	.ggk-lc-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
	.ggk-lc-links a{justify-content:center;padding:9px 8px;font-size:13px;white-space:nowrap}
	.ggk-lc-full{display:none}
	.ggk-lc-short{display:inline}
}
