/* 유서치 오픈채팅 (Shared/OpenChatCard.razor) — 카카오 노랑, 라이트·다크 공통 */

/* 1) PC 왼쪽 메뉴 카드 */
.us .openChat{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:12px 12px 12px 14px;border-radius:14px;border:1px solid color-mix(in srgb,#FEE500 38%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,#FEE500 16%,var(--surface)),color-mix(in srgb,#FFB547 10%,var(--surface)));color:var(--ink);text-align:left;text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s}
.us .openChat:hover{transform:translateY(-1px);border-color:color-mix(in srgb,#FEE500 70%,var(--line));box-shadow:0 6px 16px rgba(120,90,0,.12)}
.us .openChat:focus-visible,.us .ocFab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.us .openChat .ocText{display:flex;flex-direction:column;gap:2px;min-width:0}
.us .openChat .ocSub{font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.us .openChat .ocTitle{font-size:14.5px;font-weight:900;letter-spacing:-.03em;white-space:nowrap}
.us .openChat .ocIcon{flex:none;width:38px;height:38px;border-radius:11px;background:#FEE500;display:grid;place-items:center;box-shadow:0 2px 6px rgba(120,90,0,.18)}
.us .openChat .ocIcon svg{width:24px;height:23px}
@media (max-width:1080px){
  .us .openChat{justify-content:center;padding:6px;border:0;background:transparent}
  .us .openChat:hover{box-shadow:none}
  .us .openChat .ocText{display:none}
}

/* 2) 모바일: 오른쪽 아래(하단 탭 바로 위)에 떠 있는 동그란 카카오톡 버튼 — 767px 이하에서만.
      z-index는 하단 탭(35)보다 위, 영상 요약 패널(41)·메뉴(45)보다 아래 */
.us .ocFab{display:none}
@media (max-width:767px){
  .us .ocFab{display:grid;place-items:center;position:fixed;right:16px;bottom:calc(80px + env(safe-area-inset-bottom,0px));z-index:36;width:54px;height:54px;border-radius:50%;border:0;padding:0;background:#FEE500;box-shadow:0 6px 18px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.12);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .15s}
  .us .ocFab .ocFabIcon{display:grid;place-items:center}
  .us .ocFab svg{width:30px;height:28px}
  .us .ocFab:active{transform:scale(.93)}
}
