/* Guild chat drawer, concept B (guild-drawer.js). Art: /v2/art/guild-drawer/ cut by Astra from the approved concept.
   The existing chat panel becomes a full height drawer on the right, ending on the nav rail; on a phone it takes the
   whole width. Messages are lines on the dark surface, own messages on the right, no bubbles. */
html.gcd-on body #chatPanel.chat-panel{position:fixed!important;top:0!important;right:0!important;left:auto!important;bottom:var(--gcd-bottom,0px)!important;width:min(400px,100vw)!important;height:auto!important;max-height:none!important;min-height:0!important;border:0!important;border-radius:0!important;resize:none!important;z-index:850!important;display:flex;flex-direction:column;padding:0!important;background:#120c10 url('/v2/art/guild-drawer/drawer-bg.webp') center/100% 100% no-repeat!important;box-shadow:-24px 0 60px #000a!important}
html.gcd-on body #chatPanel.chat-panel-open{animation:gcdIn .26s cubic-bezier(.2,.8,.2,1)}
@keyframes gcdIn{from{transform:translateX(100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){html.gcd-on body #chatPanel.chat-panel-open{animation:none}}

html.gcd-on body #chatPanel .chat-header{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;min-height:72px;padding:14px 52px 10px 18px!important;background:url('/v2/art/guild-drawer/header-bg.webp') center/100% 100% no-repeat!important;border:0!important;cursor:default!important}
html.gcd-on body #chatPanel .gcd-title{flex:1 1 100%;display:flex;align-items:center;gap:10px;min-width:0}
html.gcd-on body #chatPanel .gcd-title[hidden]{display:none}
html.gcd-on body #chatPanel .gcd-crest{flex:0 0 40px;height:40px;background:url('/v2/art/guild-drawer/crest.webp') center/contain no-repeat}
html.gcd-on body #chatPanel .gcd-title b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 21px/1.15 var(--font-display,Georgia,serif);color:#f3cf86;text-shadow:0 2px 0 #2a1606}
html.gcd-on body #chatPanel .chat-tabs{display:flex;gap:18px;background:none!important;border:0!important;padding:0!important}
html.gcd-on body #chatPanel .chat-tab{min-height:32px;padding:4px 2px!important;background:none!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;box-shadow:none!important;color:#bfae93!important;font:600 14px/1 var(--font-body,inherit)!important;letter-spacing:.04em}
html.gcd-on body #chatPanel .chat-tab.active{color:#ffe2a0!important;border-bottom-color:#d9b064!important}
html.gcd-on body #chatPanel .chat-header-btns{position:absolute;top:12px;right:10px}
html.gcd-on body #chatPanel .chat-close-btn{width:40px;height:40px;background:none!important;border:0!important;color:#d9c9b4!important;font-size:26px!important;line-height:1!important;cursor:pointer}
html.gcd-on body #chatPanel .chat-close-btn:hover{color:#ffe2a0!important}

html.gcd-on body #chatPanel .chat-messages{flex:1 1 auto;min-height:0;max-height:none!important;overflow-y:auto;padding:8px 14px 8px 18px!important;background:none!important;scrollbar-width:thin;scrollbar-color:#6b5536 transparent}
html.gcd-on body #chatPanel .chat-msg:not(.chat-msg-premium){padding:8px 0!important;border-bottom:1px solid #c9a05a14!important;background:none!important;box-shadow:none!important}
html.gcd-on body #chatPanel .chat-msg-premium{margin:6px 0}
html.gcd-on body #chatPanel .chat-msg:has(.chat-msg-me){flex-direction:row-reverse;text-align:right}
html.gcd-on body #chatPanel .chat-msg:has(.chat-msg-me) .chat-msg-header{justify-content:flex-end}

html.gcd-on body #chatPanel .chat-input-row{display:flex;align-items:center;gap:10px;padding:12px 14px 14px 18px!important;background:none!important;border:0!important}
html.gcd-on body #chatPanel .chat-input{flex:1 1 auto;min-width:0;min-height:48px;padding:0 16px!important;background:url('/v2/art/guild-drawer/input-bg.webp') center/100% 100% no-repeat!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:#f4e8d5!important;font:15px/1.2 var(--font-body,inherit)!important}
html.gcd-on body #chatPanel .chat-input::placeholder{color:#a3927a;font-style:italic}
html.gcd-on body #chatPanel .chat-send-btn{flex:0 0 48px;width:48px;height:48px;padding:0!important;font-size:0!important;color:transparent!important;background:url('/v2/art/guild-drawer/send.webp') center/contain no-repeat!important;border:0!important;box-shadow:none!important;cursor:pointer}

/* The handle: glued to the right edge, middle of the screen; when the drawer is open it rides on the drawer's edge. */
.gcd-handle{position:fixed;z-index:851;top:50%;right:0;width:48px;height:144px;margin-top:-72px;padding:0;border:0;background:url('/v2/art/guild-drawer/handle.webp') center/100% 100% no-repeat;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;filter:drop-shadow(-6px 0 12px #0009);transition:right .26s cubic-bezier(.2,.8,.2,1)}
.gcd-handle[hidden]{display:none}
.gcd-handle:focus-visible{outline:2px solid #ffe2a0;outline-offset:2px}
html.gcd-open .gcd-handle{right:min(400px,100vw)}
.gcd-chev{width:12px;height:12px;border-left:2px solid #f3cf86;border-bottom:2px solid #f3cf86;transform:translateX(2px) rotate(45deg)}
html.gcd-open .gcd-chev{transform:translateX(-2px) rotate(-135deg)}
.gcd-talk{position:relative;width:20px;height:15px;border:2px solid #d9b064;border-radius:9px}
.gcd-talk:after{content:"";position:absolute;left:3px;bottom:-6px;border:4px solid transparent;border-top-color:#d9b064;border-left-color:#d9b064}
.gcd-badge{min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:#d9a441;color:#1e1206;font:800 12px/22px var(--font-body,inherit);text-align:center;box-shadow:0 0 0 2px #1a0f0a}
.gcd-badge[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.gcd-handle{transition:none}}
@media (max-width:700px){
  html.gcd-on body #chatPanel.chat-panel{width:100vw!important;padding-top:env(safe-area-inset-top,0)!important}
  html.gcd-open .gcd-handle{display:none}
  .gcd-handle{width:40px;height:120px;margin-top:-60px}
}

/* Guild chat only (Mark 11.11.2026: "usunmy zakladke globalny"): the tab row goes, the header shows the guild. */
html.gcd-on body #chatPanel .chat-tabs{display:none!important}
html.gcd-on body #chatPanel .chat-header{min-height:64px}

/* Mark 11.11 evening (DrThread: "to full for Chat"): a message shows only avatar, name, level and Power. Titles, the
   Founder badge and tag, the guild tag (it is the guild chat), the Veil moon and the Elo number are left out. */
html.gv-v2 #chatPanel .chat-msg :is(.chat-founder-badge,.chat-msg-founder-tag,.chat-msg-tag,.chat-msg-title,.chat-msg-faction){display:none!important}
html.gv-v2 #chatPanel .chat-msg .chat-msg-stat + .chat-msg-stat{display:none!important}
html.gv-v2 #chatPanel .chat-msg .chat-msg-header{flex-wrap:nowrap;min-width:0}
html.gv-v2 #chatPanel .chat-msg .chat-msg-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto}
