/* Chicks Roulette: skin for the Meetgle video chat (chat page only).
   Idea: the partner is a "card" in the deck, the other card peeks out behind it. */
body.cr-chat{--ink:#1D1626;--coral:#FF4D7E;--gold:#FF9A5B;--lilac:#F0E1F2;--lilac2:#E6CFEA;--mute:#7A6F89;background:var(--lilac)}
body.cr-chat .cr-chatbar{background:transparent;border:0;height:60px}
body.cr-chat .cr-chatstage{position:relative;isolation:isolate;height:calc(100vh - 60px);background:
  radial-gradient(520px 380px at 88% 8%,rgba(255,154,91,.35),transparent 70%),
  radial-gradient(560px 420px at 4% 96%,rgba(255,77,126,.22),transparent 70%),var(--lilac);overflow:hidden}

/* layout: reset plugin sizing, then a two-column grid */
body.cr-chat #meetgle-video-container{display:block!important;width:100%!important;min-width:0!important;max-width:none!important;height:100%!important;min-height:0!important;max-height:none!important;overflow:visible!important;padding:6px 22px 22px;box-sizing:border-box;font-family:'DM Sans',system-ui,sans-serif;color:var(--ink)}
body.cr-chat #meetgle-video-container .video-chat-layout{display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(320px,1fr);gap:26px;width:100%;height:100%!important;min-height:0!important;max-height:none!important}
body.cr-chat #meetgle-video-container .video-section{max-width:none!important;height:100%;min-height:0;padding:0 14px 14px 0;box-sizing:border-box}
body.cr-chat #meetgle-video-container .controls-and-chat{max-width:none!important;min-width:0!important;background:transparent!important;height:100%;min-height:0;gap:12px}

/* partner card with a second card behind it */
body.cr-chat #meetgle-video-container .video-wrapper.remote-video{position:relative;height:100%!important;border-radius:30px!important;background:var(--ink)!important;overflow:visible;box-shadow:0 24px 50px -22px rgba(29,22,38,.55)}
body.cr-chat #meetgle-video-container .video-wrapper.remote-video::before{content:"";position:absolute;inset:0;transform:translate(14px,14px) rotate(1.6deg);background:linear-gradient(135deg,#FFD0DC,#FFD9B8);border-radius:30px;z-index:-1;display:block}
body.cr-chat #meetgle-video-container .video-wrapper.remote-video video{border-radius:30px;object-fit:cover;width:100%;height:100%}
body.cr-chat #meetgle-video-container .remote-loading-spinner{border-radius:30px;background:rgba(29,22,38,.55)}
body.cr-chat #meetgle-video-container .spinner{border-color:rgba(255,255,255,.25);border-top-color:var(--coral)}

/* my camera: a small tile, not half the screen */
body.cr-chat #meetgle-video-container .video-wrapper.local-video{flex:0 0 auto!important;height:auto!important;aspect-ratio:16/10;border-radius:22px!important;background:var(--ink)!important;overflow:hidden;position:relative;border:3px solid #fff;box-shadow:0 14px 30px -18px rgba(29,22,38,.6)}
body.cr-chat #meetgle-video-container .local-video video{width:100%;height:100%;object-fit:cover;border-radius:0}
body.cr-chat #meetgle-video-container .local-video .user-avatar{display:none}
body.cr-chat #meetgle-video-container .local-video .control-container{position:absolute;left:10px;bottom:10px;z-index:5;display:flex;gap:8px;width:auto;margin:0;padding:0;background:none}
body.cr-chat #meetgle-video-container #muteBtn,body.cr-chat #meetgle-video-container #switchCameraBtn,body.cr-chat #meetgle-video-container .cr-ctl{color:var(--ink);width:38px;height:38px;border-radius:50%;padding:0;background:rgba(255,255,255,.92);border:0;box-shadow:0 4px 12px -4px rgba(0,0,0,.4);display:grid;place-items:center;cursor:pointer}
body.cr-chat #meetgle-video-container #muteBtn.muted,body.cr-chat #meetgle-video-container .cr-ctl.off{background:var(--coral);color:#fff}
body.cr-chat #meetgle-video-container .cr-cammask{position:absolute;inset:0;z-index:4;background:linear-gradient(135deg,#2a1f38,#1D1626);display:grid;place-items:center;color:#fff;font:600 13px 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase}
body.cr-chat #meetgle-video-container .cr-cammask[hidden]{display:none}

/* report + flag + heart on the partner card */
body.cr-chat #meetgle-video-container .remote-video-report{top:14px!important;left:14px!important}
body.cr-chat #meetgle-video-container #reportBtn{background:rgba(255,255,255,.9)!important;border-radius:999px!important;padding:6px 8px!important;box-shadow:0 4px 12px -6px rgba(0,0,0,.5)}
body.cr-chat #meetgle-video-container .remote-video-buttons{left:14px!important;bottom:14px!important;gap:8px!important}
body.cr-chat #meetgle-video-container #heartBtn,body.cr-chat #meetgle-video-container #remoteFlag{background:rgba(255,255,255,.92);border:0;border-radius:999px;min-width:42px;height:42px;display:inline-grid;place-items:center;font-size:20px;box-shadow:0 6px 14px -6px rgba(0,0,0,.5)}

/* buttons */
body.cr-chat #meetgle-video-container .controls-and-chat>.control-container{display:flex;gap:10px;margin:0;padding:0;background:none;width:100%}
body.cr-chat #meetgle-video-container #chatActionBtn{flex:3;height:54px;border:0;border-radius:999px;font:700 17px 'DM Sans',sans-serif;color:#fff;cursor:pointer;background:linear-gradient(120deg,var(--coral),var(--gold));box-shadow:0 14px 26px -12px rgba(255,77,126,.7);transition:transform .15s}
body.cr-chat #meetgle-video-container #chatActionBtn:hover{transform:translateY(-2px)}
body.cr-chat #meetgle-video-container #stopChatBtn{flex:1;height:54px;border-radius:999px;border:2px solid var(--ink);background:transparent;color:var(--ink);font:600 15px 'DM Sans',sans-serif;cursor:pointer}
body.cr-chat #meetgle-video-container #stopChatBtn:disabled{opacity:.35;cursor:default}
body.cr-chat #meetgle-video-container .meetgle-extra-btn{height:54px;border-radius:999px!important;display:flex;align-items:center;justify-content:center;font-weight:700;text-decoration:none}

/* chat sheet */
body.cr-chat #meetgle-video-container .text-chat{flex:1 1 0!important;height:auto!important;min-height:140px;background:#fff;border-radius:24px!important;box-shadow:0 14px 30px -20px rgba(29,22,38,.5);overflow:hidden}
body.cr-chat #meetgle-video-container .messages{background:transparent;color:var(--ink);padding:14px 16px;font-size:15px;line-height:1.5}
body.cr-chat #meetgle-video-container #statusOutput{font:500 12px 'JetBrains Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--coral);margin:0 0 8px}
body.cr-chat #meetgle-video-container .interest-tags-container select{background:var(--lilac);border:0;border-radius:999px;color:var(--ink);padding:10px 14px;font-size:14px}
body.cr-chat #meetgle-video-container .input-container{display:flex;gap:8px;padding:10px;border-top:1px solid var(--lilac2);background:#fff}
body.cr-chat #meetgle-video-container #chatInput{flex:1;border:0;background:var(--lilac);border-radius:999px;padding:12px 16px;font:500 15px 'DM Sans',sans-serif;color:var(--ink)}
body.cr-chat #meetgle-video-container #sendMessageBtn{border:0;border-radius:999px;padding:0 20px;background:var(--ink);color:#fff;font-weight:700;cursor:pointer}

/* partner offer (injected by chat.js, text and link come from the Customizer) */
.cr-offer{position:relative;flex:none;display:flex;align-items:center;gap:12px;padding:14px 40px 14px 14px;background:#fff;border-radius:20px;box-shadow:0 18px 36px -14px rgba(29,22,38,.65);animation:cr-offer-in .4s cubic-bezier(.3,1.4,.5,1) both}
.cr-offer[hidden]{display:none}
.cr-offer .tag{position:absolute;top:-9px;left:16px;background:var(--ink);color:#fff;font:500 10px 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:6px}
.cr-offer .txt{flex:1;min-width:0}
.cr-offer .txt b{display:block;font:700 14px 'DM Sans',sans-serif;color:var(--ink)}
.cr-offer .txt span{display:block;font-size:13px;color:var(--mute);margin-top:2px}
.cr-offer .go{flex:none;background:var(--coral);color:#fff!important;text-decoration:none;font:700 13px 'DM Sans',sans-serif;padding:10px 16px;border-radius:999px;white-space:nowrap}
.cr-offer .go:hover{background:var(--ink)}
.cr-offer .x{position:absolute;top:6px;right:6px;width:28px;height:28px;border:0;border-radius:50%;background:transparent;color:var(--mute);font-size:20px;line-height:1;cursor:pointer}
.cr-offer .x:hover{background:var(--lilac)}
@keyframes cr-offer-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* phones and tablets: stack, let the page scroll */
@media (max-width:900px){
  body.cr-chat .cr-chatstage{height:auto;min-height:calc(100vh - 60px);overflow:visible}
  html:has(body.cr-chat),body.cr-chat{overflow:auto!important;height:auto!important}
  body.cr-chat #meetgle-video-container{padding:4px 14px 24px;height:auto!important}
  body.cr-chat #meetgle-video-container .video-chat-layout{grid-template-columns:1fr;gap:18px;height:auto!important}
  body.cr-chat #meetgle-video-container .video-section{height:auto;padding:0 10px 10px 0}
  body.cr-chat #meetgle-video-container .video-section{display:block!important;max-width:none!important}
  body.cr-chat #meetgle-video-container .video-wrapper.remote-video{flex:none!important;display:block!important;height:auto!important;aspect-ratio:4/5!important;max-height:46vh!important;min-height:0!important;width:100%!important}
  body.cr-chat #meetgle-video-container .video-wrapper.local-video{flex:none!important;display:block!important;width:100%!important;height:auto!important;max-height:22vh!important;aspect-ratio:16/8!important}
  body.cr-chat #meetgle-video-container .text-chat{flex:none!important;height:auto!important;min-height:300px!important;max-height:none!important}
  body.cr-chat #meetgle-video-container .controls-and-chat{height:auto}
  .cr-offer{flex-wrap:wrap}
  .cr-offer .go{width:100%;text-align:center}
}
@media (prefers-reduced-motion:reduce){.cr-offer{animation:none}body.cr-chat #meetgle-video-container #chatActionBtn{transition:none}}

/* ---- report pop-up (patched plugin) ---- */
body.cr-chat .meetgle-report-modal{background:rgba(29,22,38,.62);backdrop-filter:blur(3px);font-family:'DM Sans',system-ui,sans-serif}
body.cr-chat .meetgle-report-card{width:min(440px,100%);padding:26px 24px 22px;border-radius:28px;background:#fff;color:var(--ink);box-shadow:0 30px 60px -24px rgba(29,22,38,.7);position:relative}
body.cr-chat .meetgle-report-card::before{content:"";position:absolute;inset:auto 18px -10px 18px;height:100%;background:linear-gradient(135deg,#FFD0DC,#FFD9B8);border-radius:28px;z-index:-1;transform:rotate(-1.2deg)}
body.cr-chat .meetgle-report-card h3{font:700 22px 'Sora','DM Sans',sans-serif;letter-spacing:-.02em;margin:0 0 6px}
body.cr-chat .meetgle-report-card p{color:var(--mute);font-size:14px;margin:0 0 16px}
body.cr-chat .meetgle-report-option{border:1.5px solid var(--lilac2);border-radius:16px;min-height:48px;font-weight:500;transition:border-color .15s,background .15s}
body.cr-chat .meetgle-report-option:hover{border-color:var(--coral)}
body.cr-chat .meetgle-report-option:has(input:checked){border-color:var(--coral);background:rgba(255,77,126,.08)}
body.cr-chat .meetgle-report-option input{accent-color:var(--coral)}
body.cr-chat .meetgle-report-actions button{min-height:50px;border-radius:999px;font-family:inherit}
body.cr-chat .meetgle-report-send{background:linear-gradient(120deg,var(--coral),var(--gold))!important;color:#fff;border:0}
body.cr-chat .meetgle-report-send:hover,body.cr-chat .meetgle-report-send:focus-visible{filter:brightness(1.05)}
body.cr-chat .meetgle-report-cancel{border:2px solid var(--ink)!important;color:var(--ink)}

/* ---- weak connection notes ---- */
body.cr-chat .meetgle-quality{left:14px;right:14px;bottom:66px}
body.cr-chat .meetgle-quality-line{max-width:440px;border-radius:16px;background:#fff;color:var(--ink);border:1.5px solid var(--gold);box-shadow:0 12px 24px -14px rgba(29,22,38,.6);font:500 13px/1.4 'DM Sans',sans-serif;padding:9px 14px}
body.cr-chat .meetgle-quality-line::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);margin-right:8px;vertical-align:1px}