/* Gosscard chat — full page improvements + FB-style mini widget */

/* Full-page chat — viewport layout, scroll only in #chatBox */
body.gc-page-chat {
    overflow: hidden;
}

/*
 * Na iOS Safari (a některých Android prohlížečích) "dvh" NEREAGUJE na otevřenou
 * virtuální klávesnici (známé omezení) — .app-wrapper tak zůstane "velký" i po
 * otevření klávesnice a spodek chatu (zprávy + textové pole) skončí pod klávesnicí.
 * --gc-app-vh nastavuje js/gosscard-chat.js podle window.visualViewport.height,
 * který se korektně zmenší. Dokud JS neproběhne (nebo mimo chat), platí dvh fallback.
 */
body.gc-page-chat .app-wrapper {
    height: var(--gc-app-vh, 100dvh);
}

body.gc-page-chat .page-body,
.page-body:has(.pageBodyChat) {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    flex: 1 1 auto;
    min-height: 0;
}

body.gc-page-chat .page-head,
.app-wrapper:has(.pageBodyChat) .page-head {
    position: relative;
    flex-shrink: 0;
}

body.gc-page-chat .pageBodyChat,
.page-body:has(.pageBodyChat) .pageBodyChat {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    margin-top: 0 !important;
    overflow: hidden;
}

body.gc-page-chat .bodyChatList,
.page-body:has(.pageBodyChat) .bodyChatList {
    float: none !important;
    width: 235px;
    height: auto !important;
    max-height: none !important;
    min-height: 0;
    flex-shrink: 0;
    align-self: stretch;
    padding-bottom: 0;
    margin-top: 0 !important;
    overflow-y: auto;
    overflow-x: hidden;
}

body.gc-page-chat .page-footer-body,
.page-body:has(.pageBodyChat) .page-footer-body {
    display: none !important;
}

/* Message bubbles */
.gc-chat-msg.chat-bubble--out .viewStateDivLtextText {
    background-color: var(--gc-primary-strong, #0069d9);
    color: #fff;
}

.gc-chat-msg.chat-bubble--in .viewStateDivLtextText {
    background-color: #e4e6eb;
    color: #050505;
}

.gc-chat-msg.chat-bubble--in {
    align-self: flex-start;
}

/* Full-page chat — override legacy .ltext / .viewStateDivLtext* from public.css */
.pageBodyChat .gc-chat-msg {
    width: auto !important;
    max-width: min(75%, 520px);
}

.pageBodyChat .gc-chat-msg.chat-bubble--out {
    align-self: flex-end;
}

.pageBodyChat .gc-chat-msg .viewStateDivLtext,
.pageBodyChat .gc-chat-msg .gc-chat-msg-inner {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    width: auto;
}

.pageBodyChat .gc-chat-msg.chat-bubble--out .viewStateDivLtext,
.pageBodyChat .gc-chat-msg.chat-bubble--out .gc-chat-msg-inner {
    flex-direction: row-reverse;
}

.pageBodyChat .gc-chat-msg .viewStateDivLtextImg {
    flex-shrink: 0;
}

.pageBodyChat .gc-chat-msg .viewStateDivLtextText {
    width: auto !important;
    max-width: 100%;
    flex: 0 1 auto;
    margin-left: 0 !important;
}

.pageBodyChat .gc-chat-msg.chat-bubble--out .viewStateDivLtextTime {
    text-align: right;
}

.pageBodyChat .gc-chat-msg.chat-bubble--in .viewStateDivLtextTime {
    text-align: left;
}

.gc-chat-msg-footer {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    align-self: flex-end;
    width: auto;
    max-width: 100%;
    box-sizing: border-box;
    padding-right: 43px;
    margin-top: 2px;
}

.gc-chat-msg-footer-meta {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    max-width: 100%;
}

.gc-chat-msg.chat-bubble--in .gc-chat-msg-footer-meta {
    justify-content: flex-start;
}

.gc-chat-msg.chat-bubble--in .gc-chat-msg-footer {
    align-items: flex-start;
    align-self: flex-start;
    padding-right: 0;
    padding-left: 43px;
}

.gc-mini-chat-win-messages .gc-chat-msg-footer {
    padding-right: 0;
    padding-left: 0;
}

.pageBodyChat .gc-chat-msg .viewStateDivLtextTime {
    width: auto !important;
    margin-top: 0;
    font-size: 11px;
    color: #65676b;
    padding-right: 0;
    padding-left: 0;
}

.gc-chat-msg-inner {
    position: relative;
}

.gc-chat-msg-actions {
    display: none;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 3px;
}

.gc-chat-msg.gc-chat-msg--show-actions .gc-chat-msg-actions,
.gc-chat-msg:focus-within .gc-chat-msg-actions {
    display: flex;
}

.gc-chat-msg.gc-chat-msg--editing .gc-chat-msg-actions {
    display: none !important;
}

.gc-chat-msg-action {
    border: 0 !important;
    background: transparent !important;
    color: #65676b !important;
    min-height: 0 !important;
    height: auto !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 6px !important;
    display: inline-flex !important;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 3px 6px !important;
    margin: 0;
    cursor: pointer;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: none !important;
    transition: background 0.15s ease, color 0.15s ease;
}

.gc-chat-msg-action i {
    font-size: 10px;
    flex-shrink: 0;
    pointer-events: none;
}

.gc-chat-msg-action-label {
    display: inline;
    font-size: 11px;
    line-height: 1.2;
}

.gc-chat-msg-action--edit:hover,
.gc-chat-msg-action--edit:focus-visible {
    background: rgba(0, 123, 255, 0.1) !important;
    color: #007bff !important;
}

.gc-chat-msg-action--delete:hover,
.gc-chat-msg-action--delete:focus-visible {
    background: rgba(228, 30, 63, 0.08) !important;
    color: #e41e3f !important;
}

.gc-chat-msg-action--delete i,
.gc-chat-msg-action--delete .gc-chat-msg-action-label {
    color: inherit;
}

.pageBodyChat .gc-chat-msg .viewStateDivLtextText.gc-chat-msg-text--edit-mode,
.gc-mini-chat-win-messages .gc-chat-msg .viewStateDivLtextText.gc-chat-msg-text--edit-mode {
    width: auto !important;
    min-width: 200px;
    max-width: min(420px, 100%) !important;
    background: #fff !important;
    color: #050505 !important;
    padding: 8px 10px !important;
    border-radius: 18px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

.gc-chat-msg-edit-form {
    display: block;
    width: 100%;
    box-sizing: border-box;
}

.pageBodyChat .gc-chat-msg--editing .viewStateDivLtextText.gc-chat-msg-text--edit-mode,
.gc-mini-chat-win-messages .gc-chat-msg--editing .viewStateDivLtextText.gc-chat-msg-text--edit-mode {
    margin-left: 0 !important;
}

.pageBodyChat .gc-chat-msg.chat-bubble--out .viewStateDivLtextText .gc-chat-msg-edit-form,
.gc-mini-chat-win-messages .gc-chat-msg.chat-bubble--out .viewStateDivLtextText .gc-chat-msg-edit-form {
    background: transparent;
    padding: 0;
    box-shadow: none;
    border-radius: 0;
}

.gc-chat-msg-edit-input {
    display: block;
    width: 100% !important;
    min-height: 38px;
    max-height: 120px;
    resize: vertical;
    border: 0 !important;
    border-radius: 0;
    padding: 0;
    margin: 0;
    font: inherit;
    font-size: 14px;
    color: inherit;
    background: transparent !important;
    box-sizing: border-box;
    outline: none;
    box-shadow: none !important;
}

.gc-chat-msg-edit-actions {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    margin-top: 8px;
}

.gc-chat-msg-edit-save,
.gc-chat-msg-edit-cancel {
    border: 0 !important;
    border-radius: 999px !important;
    padding: 4px 12px !important;
    min-height: 0 !important;
    height: auto !important;
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto;
    font-size: 11px !important;
    font-weight: 600;
    line-height: 1.3;
    cursor: pointer;
    box-shadow: none !important;
    white-space: nowrap;
}

.gc-chat-msg-edit-save {
    background: var(--gc-primary-strong, #0069d9) !important;
    color: #fff !important;
}

.gc-chat-msg-edit-save:hover {
    background: #0073e6 !important;
}

.gc-chat-msg-edit-cancel {
    background: #e4e6eb !important;
    color: #050505 !important;
}

.gc-chat-msg-edit-cancel:hover {
    background: #d8dadf !important;
}

.gc-chat-msg-deleted {
    font-style: italic;
    opacity: 0.85;
}

.gc-chat-msg.chat-bubble--out .gc-chat-msg-deleted {
    opacity: 0.9;
}

.gc-chat-msg-edited {
    font-size: 10px;
    color: #8a8d91;
    margin-left: 4px;
}

/* „Zobrazeno" sedí v patičce zprávy, tedy na #f0f2f5, ne uvnitř modré bubliny.
   #007bff tam mělo naměřeno 3,55:1 při 11px/600 — pod prahem 4,5:1 (WCAG 1.4.3).
   --gc-primary-strong dává na téže ploše 4,65:1. */
.gc-chat-msg-seen {
    font-size: 11px;
    color: var(--gc-primary-strong, #0069d9);
    font-weight: 600;
    margin-left: 4px;
}

.chat-bubble--out .gc-chat-msg-seen {
    color: var(--gc-primary-strong, #0069d9);
}

.gc-mini-chat-win-messages .gc-chat-msg-actions {
    display: none;
}
/* Kompaktní patička: čas + „Zobrazeno" vedle sebe na jednom řádku, minimální mezery */
.gc-mini-chat-win-messages .gc-chat-msg-footer {
    margin-top: 0;
}
.gc-mini-chat-win-messages .gc-chat-msg-footer-meta {
    flex-wrap: nowrap;
    gap: 5px;
}
.gc-mini-chat-win-messages .viewStateDivLtextTime {
    width: auto !important;
    margin: 0 !important;
    font-size: 9px;
    line-height: 1.2;
}
.gc-mini-chat-win-messages .gc-chat-msg-seen {
    font-size: 10px;
    margin-left: 0;
    line-height: 1.2;
}
.gc-mini-chat-win-messages .gc-chat-msg-action {
    font-size: 10px;
    padding: 2px 5px !important;
}
.gc-mini-chat-win-messages .gc-chat-msg-action i {
    font-size: 9px;
}

.pageBodyChat .bodyChatRoom:has(#chatBox) {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto;
    grid-template-columns: minmax(0, 1fr);
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    width: auto !important;
    margin-left: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
    box-sizing: border-box;
}

.pageBodyChat .bodyChatRoom:not(:has(#chatBox)) {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    width: auto !important;
    margin-left: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
    overflow-y: hidden !important;
    box-sizing: border-box;
}

.pageBodyChat .bodyChatRoom:has(#chatBox) .chatUserImgBody {
    grid-row: 1;
}

.pageBodyChat .bodyChatRoom:has(#chatBox) .chat-box {
    grid-row: 2;
    flex: none;
    min-height: 0;
    max-height: none !important;
    overflow-y: auto;
    overflow-x: hidden;
}

.pageBodyChat .bodyChatRoom:has(#chatBox) .sendBtnChatBody {
    grid-row: 3;
}

/* Krátká konverzace visela u HORNÍHO okraje a pod ní zůstalo ~690 px prázdna
   (naměřeno 2026-08-19 při 1280×860, dvě zprávy). Chat se čte odspodu, nová
   zpráva má být u pole na psaní.

   `margin-top: auto` na PRVNÍ bublině, ne `justify-content: flex-end` na
   kontejneru: auto-okraj se ve flexu při přetečení dopočítá na 0, takže se
   historie nikdy neusekne nad horní hranou (což `flex-end` v prohlížečích dělá).
   Cílíme jen na `.gc-chat-msg`, aby to nešáhlo na prázdný stav (ten je
   vystředěný vlastním pravidlem). */
.pageBodyChat .bodyChatRoom:has(#chatBox) .chat-box > .gc-chat-msg:first-of-type {
    margin-top: auto;
}

.pageBodyChat .chatUserImgBody {
    flex-shrink: 0;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 10px;
    margin-left: 0 !important;
    background: #fff;
    border-bottom: 1px solid #e4e6eb;
    padding: 8px 12px;
    box-sizing: border-box;
    min-height: 0;
}

.pageBodyChat .chatUserImgBody > .clear {
    display: none !important;
}

.pageBodyChat .chatUserImg {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    margin: 0;
}

.pageBodyChat .chatUserNameAndFormaneStatusBody {
    flex: 1 1 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
    margin-left: 0 !important;
}

.pageBodyChat .chatUserNameAndFormaneStatusBody > .clear {
    display: none !important;
}

.pageBodyChat .chatUserNameAndFormane {
    flex: 0 1 auto;
    min-width: 0;
    font-size: 16px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pageBodyChat .chatUserNameAndFormane a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pageBodyChat .chatUserStatus {
    flex: 0 1 auto;
    min-width: 0;
}

.pageBodyChat .chatUserStatusOnline {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pageBodyChat .chatUserStatusOnline .online,
.pageBodyChat .chatUserStatusOnline #onlineText {
    float: none !important;
    margin-top: 0 !important;
}

.pageBodyChat .chatUserStatusOnline .online {
    flex-shrink: 0;
}

.pageBodyChat .chatUserStatusOnline #onlineText {
    padding: 0 !important;
}

.pageBodyChat .bodyChatListUserDelete {
    float: none !important;
    flex: 0 0 auto;
    width: auto;
    margin-left: 0 !important;
    padding-top: 0 !important;
}

.pageBodyChat .chat-box {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none !important;
    padding: 12px 8px 16px;
    background: #f0f2f5;
    border-radius: 12px;
    scroll-behavior: smooth;
    overflow-y: auto;
    overflow-x: hidden;
}

.pageBodyChat .sendBtnChatBody {
    position: relative;
    flex-shrink: 0;
    z-index: 10001;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-end !important;
    gap: 8px;
    padding: 4px 12px;
    padding-bottom: max(10px, env(safe-area-inset-bottom, 0px));
    border-top: 1px solid #e4e6eb;
    border-radius: 0 0 12px 12px;
    background: #fff;
    overflow: visible;
    box-sizing: border-box;
}

.pageBodyChat .sendBtnChatBody #emojiBtn,
.pageBodyChat .sendBtnChatBody .emojiBtnChat {
    position: relative !important;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none !important;
    border-radius: 50%;
    background: transparent !important;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.pageBodyChat .gc-chat-emoji-wrap {
    position: relative;
    flex: 0 0 40px;
    flex-shrink: 0;
    width: 40px;
    min-width: 40px;
    height: 40px;
    z-index: 2;
}

.pageBodyChat .gc-chat-emoji-wrap #emojiPicker {
    position: fixed !important;
    top: auto;
    margin-left: 0 !important;
    z-index: 11002;
    display: none;
    grid-template-columns: repeat(5, 1fr);
    width: 220px;
    height: 220px;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    overflow-y: auto;
    pointer-events: auto;
}

.pageBodyChat .sendBtnChatBody .emojiBtnChat:hover {
    background: #f0f2f5 !important;
}

.pageBodyChat .messageChat {
    margin-left: 0 !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    border-color: #ccd0d5;
    padding: 10px 14px;
}

.pageBodyChat .sendBtnChat {
    flex-shrink: 0;
    margin-left: 0;
    /* Přebíjí `.sendBtnChat` níž, které už na `-strong` převedené je — bez téhle
       záměny mělo tlačítko na stránce chatu bílou ikonu na #007bff (3,98:1). */
    background-color: var(--gc-primary-strong, #0069d9);
}

.pageBodyChat .bodyChatListUser:hover {
    background: #f0f2f5;
    border-radius: 10px;
}

/* Vybraná konverzace nese bílé jméno (15px/700) i náhled poslední zprávy.
   Na #007bff mělo jméno 3,98:1 a náhled ještě míň — obojí pod 4,5:1. */
.pageBodyChat .bodyChatListUserSelect {
    background-color: var(--gc-primary-strong, #0069d9) !important;
    border-color: var(--gc-primary-strong, #0069d9) !important;
}

/* Floating map actions — chat, camera (unified look) */
.gosscard-map-fab,
.gc-mini-chat-toggle.gosscard-map-fab,
#mapNavigationImgQuickUpload.gosscard-map-fab {
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;
    border: none;
    border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    overflow: hidden;
    /* Bílá ikona na #007bff měla 3,98:1, tedy pod prahem WCAG 1.4.3 (4,5:1) —
       a u FABu s počítadlem nepřečtených zpráv je to text, ne dekorace.
       --gc-primary-strong dává 5,22:1 při zachování značkové modré. */
    background: var(--gc-primary-strong, #0069d9);
    color: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-sizing: border-box;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.gosscard-map-fab:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.32);
}

.gosscard-map-fab i {
    pointer-events: none;
}

#mapNavigationImgQuickUpload.gosscard-map-fab {
    position: relative;
    float: none;
    margin: 0;
}

/* Mini chat widget — fixed bottom-right (FB Messenger style) */
/* Odstup FAB sloupce od spodní hrany okna. Vlastní hodnota je jen `--gc-mini-chat-gap`
   (mobilní breakpoint níž ji zmenšuje), `--gc-safe-bottom` k ní přičte systémovou
   lištu — v prohlížeči 0, v PWA home indikátor, v nativní appce spodní lišta Androidu.
   Bez toho spadl poslední FAB (trasa) pod tlačítka zpět/domů, viz gosscard-theme.css. */
.gc-mini-chat {
    --gc-mini-chat-gap: 16px;
    position: fixed;
    right: 16px;
    bottom: calc(var(--gc-mini-chat-gap, 16px) + var(--gc-safe-bottom, 0px));
    z-index: 9998;
    font-family: inherit;
    pointer-events: none;
}

.gc-mini-chat > * {
    pointer-events: auto;
}

.gc-mini-chat-dock {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 10px;
    /* FAB (poslední dítě) zůstává vpravo u pravého okraje, okna chatů se otevírají vlevo od něj. */
    flex-direction: row;
}

.gc-mini-chat-fab-col {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: 10px;
}

.gc-mini-chat-toggle.gosscard-map-fab,
#mapNavigationImgQuickUpload.gosscard-map-fab {
    position: relative;
    flex-shrink: 0;
    border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
}

.gc-mini-chat-toggle.gosscard-map-fab {
    overflow: visible;
}

.gc-mini-chat-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    z-index: 0;
    min-width: 20px;
    height: 20px;
    padding: 0 4px;
    border-radius: 10px;
    background: #e41e3f;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    text-align: center;
    display: none;
    pointer-events: none;
    border: 2px solid #fff;
}

.gc-mini-chat-panel {
    position: absolute;
    right: 0;
    bottom: 68px;
    width: 320px;
    max-height: 420px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.gc-mini-chat-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    background: var(--gc-primary-strong, #0069d9);
    color: #fff;
    font-weight: 600;
    font-size: 15px;
}

.gc-mini-chat-panel-close {
    background: transparent;
    border: none;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    padding: 4px 8px;
    line-height: 1;
}

.gc-mini-chat-contacts {
    overflow-y: auto;
    max-height: 340px;
}

.gc-mini-chat-contact {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 14px;
    border: none;
    background: #fff;
    cursor: pointer;
    text-align: left;
    border-bottom: 1px solid #f0f2f5;
    transition: background 0.12s;
}

.gc-mini-chat-contact:hover {
    background: #f0f2f5;
}

.gc-mini-chat-contact-avatar {
    position: relative;
    flex-shrink: 0;
}

.gc-mini-chat-contact-avatar img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
}

.gc-mini-chat-online-dot {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 10px;
    height: 10px;
    background: #31a24c;
    border: 2px solid #fff;
    border-radius: 50%;
}

.gc-mini-chat-contact-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.gc-mini-chat-contact-name {
    font-weight: 600;
    font-size: 14px;
    color: #050505;
}

.gc-mini-chat-contact-preview {
    font-size: 12px;
    color: #65676b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gc-mini-chat-contact-badge {
    flex-shrink: 0;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 9px;
    background: #e41e3f;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.gc-mini-chat-empty,
.gc-mini-chat-win-empty {
    padding: 24px 16px;
    text-align: center;
    color: #65676b;
    font-size: 13px;
}

.gc-mini-chat-panel-foot {
    padding: 10px;
    border-top: 1px solid #f0f2f5;
    text-align: center;
}

.gc-mini-chat-open-full {
    color: #007bff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.gc-mini-chat-open-full:hover {
    text-decoration: underline;
    color: #0066cc;
}

/* Chat windows */
.gc-mini-chat-windows {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    flex-direction: row-reverse;
}

.gc-mini-chat-window {
    width: 300px;
    background: #fff;
    border-radius: 12px 12px 0 0;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.gc-mini-chat-window.is-minimized .gc-mini-chat-win-messages,
.gc-mini-chat-window.is-minimized .gc-mini-chat-win-compose {
    display: none;
}

.gc-mini-chat-win-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    background: var(--gc-primary-strong, #0069d9);
    color: #fff;
    cursor: pointer;
}

.gc-mini-chat-win-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
}

.gc-mini-chat-win-title {
    flex: 1;
    font-weight: 600;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gc-mini-chat-win-expand,
.gc-mini-chat-win-min,
.gc-mini-chat-win-close {
    background: transparent;
    border: none;
    color: #fff;
    cursor: pointer;
    padding: 4px 6px;
    font-size: 14px;
    line-height: 1;
    opacity: 0.9;
}

.gc-mini-chat-win-expand {
    font-size: 12px;
}

.gc-mini-chat-win-expand:hover,
.gc-mini-chat-win-min:hover,
.gc-mini-chat-win-close:hover {
    opacity: 1;
}

.gc-mini-chat-win-messages {
    height: 280px;
    overflow-y: auto;
    padding: 8px;
    background: #f0f2f5;
    display: flex;
    flex-direction: column;
    gap: 4px;
    scroll-behavior: smooth;
}

.gc-mini-chat-win-messages .gc-chat-msg {
    width: 100%;
}

.gc-mini-chat-win-messages .viewStateDivLtextImg {
    display: none;
}

.gc-mini-chat-win-messages .viewStateDivLtextText {
    font-size: 14px;
    padding: 8px 12px;
}

.gc-mini-chat-win-messages .viewStateDivLtextTime {
    font-size: 10px;
    color: #65676b;
    margin-top: 2px;
}

.gc-mini-chat-win-compose {
    display: flex;
    align-items: flex-end;
    gap: 6px;
    padding: 8px;
    border-top: 1px solid #e4e6eb;
    background: #fff;
}

.gc-mini-chat-win-input {
    flex: 1;
    border: none;
    background: #f0f2f5;
    border-radius: 18px;
    padding: 8px 12px;
    font-size: 14px;
    resize: none;
    max-height: 80px;
    outline: none;
    font-family: inherit;
}

.gc-mini-chat-win-send {
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: var(--gc-primary-strong, #0069d9);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.gc-mini-chat-win-send:disabled {
    opacity: 0.5;
    cursor: default;
}

/* === Grafické doladění mini okna chatu — víc kontrastu a hloubky === */
.gc-mini-chat-window {
    border: 1px solid #d7dbe0;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
}
.gc-mini-chat-win-head {
    background: linear-gradient(180deg, var(--gc-primary-strong, #0069d9) 0%, var(--gc-primary-darker, #0056b3) 100%);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
    position: relative;
    z-index: 1;
}
.gc-mini-chat-win-messages {
    background: #f5f6f8;
    gap: 2px;
    padding: 10px 10px 8px;
}
/* Bubliny: jemný stín + „ocásek" (asymetrický roh) */
.gc-mini-chat-win-messages .viewStateDivLtextText {
    border-radius: 16px;
    box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.10);
    line-height: 1.35;
}
/* Bílý text na tomhle přechodu měl 3,13:1 nahoře a 3,98:1 dole. Stejná dvojice
   tokenů jako u `.gc-mini-chat-win-send` výš drží 5,22:1 → 7,04:1. */
.gc-mini-chat-win-messages .chat-bubble--out .viewStateDivLtextText {
    background: linear-gradient(180deg, var(--gc-primary-strong, #0069d9) 0%, var(--gc-primary-darker, #0056b3) 100%);
    border-bottom-right-radius: 5px;
}
.gc-mini-chat-win-messages .chat-bubble--in .viewStateDivLtextText {
    background: #ffffff;
    color: #0f172a;
    border: 1px solid #e4e7ec;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    border-bottom-left-radius: 5px;
}
/* Compose: jasnější oddělení + focus stav */
.gc-mini-chat-win-compose {
    border-top: 1px solid #e6e8ec;
    box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.03);
}
.gc-mini-chat-win-input {
    border: 1px solid #e2e6ea;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.gc-mini-chat-win-input:focus {
    border-color: #007bff;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.12);
}
.gc-mini-chat-win-send {
    box-shadow: 0 2px 6px rgba(0, 123, 255, 0.35);
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}
.gc-mini-chat-win-send:hover:not(:disabled) {
    background: #0069d9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.42);
}

/* Hide mini chat on full chat page (already have dedicated UI) */
body.gc-page-chat .gc-mini-chat {
    display: none !important;
}

/* Sidebar — following list when no conversations */
.bodyChatListSectionDivider {
    height: 1px;
    background: #e4e6eb;
    margin: 8px 12px;
}

.pageBodyChat .bodyChatListUserName {
    height: auto !important;
    min-height: 0;
    padding-bottom: 2px;
}

.bodyChatListUserPreview {
    display: none;
    font-size: 12px;
    color: #65676b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 135px;
    margin-top: 2px;
    line-height: 1.3;
}

/* 85% bílá dá i nad ztmaveným pozadím jen 4,21:1 — plná bílá 5,22:1. */
.bodyChatListUserSelect .bodyChatListUserPreview {
    color: #fff;
}

.gc-mini-chat-section-divider {
    height: 1px;
    background: #e4e6eb;
    margin: 4px 14px;
}

.bodyChatListSectionTitle {
    font-size: 13px;
    font-weight: 700;
    color: #65676b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 12px 12px 4px;
}

.bodyChatListSectionHint {
    font-size: 12px;
    color: #8a8d91;
    padding: 0 12px 8px;
    line-height: 1.35;
}

.bodyChatListEmpty {
    padding: 24px 16px;
    text-align: center;
    color: #65676b;
    font-size: 13px;
}

.bodyChatListEmpty i {
    font-size: 28px;
    color: #bcc0c4;
    margin-bottom: 10px;
}

.bodyChatListEmptyLink {
    display: inline-block;
    margin-top: 10px;
    color: #007bff;
    font-weight: 600;
    text-decoration: none;
}

.bodyChatListEmptyLink:hover {
    text-decoration: underline;
}

@media only screen and (max-width: 955px) {
    .pageBodyChat--mobile-sidebar-hidden #bodyChatList {
        display: none !important;
    }

    .pageBodyChat--mobile-sidebar-hidden #bodyChatListButtonHide {
        display: none !important;
    }

    .pageBodyChat--mobile-sidebar-hidden #bodyChatListButtonOpen {
        display: block !important;
    }

    .pageBodyChat .bodyChatRoom {
        width: 100% !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .pageBodyChat .chat-box {
        border-radius: 0;
        margin-top: 0 !important;
        padding-bottom: 12px !important;
    }

    .pageBodyChat .chatUserImgBody {
        padding-left: 8px;
        padding-right: 8px;
    }

    .pageBodyChat .bodyChatRoom:has(#chatBox) {
        padding-bottom: var(--gc-chat-compose-height, 72px);
    }

    .pageBodyChat .bodyChatRoom:has(#chatBox) .sendBtnChatBody {
        position: fixed !important;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10001;
        margin: 0;
        border-radius: 0;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.12);
        padding-bottom: max(10px, var(--gc-safe-bottom, 0px));
    }

    /* LIŠTA PWA TU NEPOSOUVÁ NIC — ani obsah, ani kompozér.
       Dřív tu byly dvě pravidla pro otevřenou lištu:
         .sendBtnChatBody                → bottom: 96px
         .bodyChatRoom:has(#chatBox)     → padding-bottom: 72px + 96px
       To druhé zkrátilo `#chatBox` o 96 px (naměřeno 2026-08-16 při 390×900:
       728 → 536 px) a spodek stránky vyskočil nahoru; první posouvalo psací pole.
       Na přání 2026-08-16 obojí pryč: lišta má `position: fixed` a z-index 10030,
       takže při otevření kompozér PŘEKRYJE a psát jde až po jejím zavření
       (křížek vpravo v liště). Stejné pravidlo drží i gosscard-pwa-install.css. */

    .pageBodyChat .sendBtnChatBody {
        z-index: 10001;
    }
}

body.gc-page-chat .gc-mini-chat {
    display: none;
}

.chatRoomEmpty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 140px);
    padding: 40px 24px;
    text-align: center;
    color: #65676b;
}

.chatRoomEmptyIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: rgba(0, 123, 255, 0.1);
    color: #007bff;
    font-size: 32px;
    line-height: 1;
}

.gc-chat-empty-messages {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    min-height: 200px;
    padding: 32px 24px;
    margin: auto 0;
    text-align: center;
    background: transparent;
    border: none;
}

.gc-chat-empty-messages-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: 12px;
    border-radius: 50%;
    background: rgba(0, 123, 255, 0.1);
    color: #007bff;
    font-size: 28px;
    line-height: 1;
}

.gc-chat-empty-messages-text {
    margin: 0;
    font-size: 15px;
    font-weight: 500;
    color: #65676b;
    line-height: 1.4;
}

.chatRoomEmptyTitle {
    font-size: 20px;
    font-weight: 700;
    color: #050505;
    margin: 0 0 8px;
}

.chatRoomEmptyText {
    font-size: 14px;
    max-width: 360px;
    line-height: 1.5;
    margin: 0;
}

.chatRoomEmptyBtn {
    display: inline-block;
    margin-top: 16px;
    padding: 10px 20px;
    background: var(--gc-primary-strong, #0069d9);
    color: #fff !important;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
}

.chatRoomEmptyBtn:hover {
    background: #006dd1;
    color: #fff;
    text-decoration: none;
}

.gc-mini-chat-following-hint {
    padding: 10px 14px 6px;
    font-size: 12px;
    color: #65676b;
    border-bottom: 1px solid #f0f2f5;
}

/* `!important` tu přebíjí i globální barvu odkazů z public.css, takže na rozdíl
   od ostatních modrých odkazů v tomhle souboru zůstávalo #007bff (3,98:1). */
.gc-mini-chat-contact-write {
    color: var(--gc-primary-strong, #0069d9) !important;
    font-weight: 600;
}

@media only screen and (max-width: 768px) {
    .gc-mini-chat {
        right: 12px;
        /* Jen vlastní odstup — systémovou lištu drží `bottom` v základním pravidle. */
        --gc-mini-chat-gap: 12px;
    }

    .gc-mini-chat-panel {
        width: calc(100vw - 20px);
        max-width: 320px;
    }

    .gc-mini-chat-windows {
        display: none;
    }

    .gc-mini-chat.is-open .gc-mini-chat-windows {
        display: none;
    }

    .gc-mini-chat-contact:active {
        background: #e4e6eb;
    }
}

@media only screen and (min-width: 769px) {
    .gc-mini-chat-panel {
        bottom: 68px;
    }

    .gc-mini-chat--map .gc-mini-chat-panel {
        bottom: 120px;
    }
}

/* Panel zpráv: VŽDY ukotvit dole a nikdy nepřetéct k hornímu okraji obrazovky
   (platí na všech šířkách). Strop výšky dle okna; hlavička/patička pevné,
   seznam kontaktů se zkrátí a scrolluje uvnitř. */
.gc-mini-chat-panel {
    top: auto !important;
    max-height: min(360px, calc(100vh - 120px)) !important;
    max-height: min(360px, calc(100dvh - 120px)) !important;
}
.gc-mini-chat-panel-head,
.gc-mini-chat-panel-foot {
    flex: 0 0 auto !important;
}
.gc-mini-chat-contacts {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
}
/* Na mapě: panel posadit až ke spodnímu okraji a vlevo od sloupce FABů —
   stejně jako okno konkrétního chatu (aby FABy nepřekrýval). */
.gc-mini-chat--map .gc-mini-chat-panel {
    right: 64px !important;
    bottom: 0 !important;
    width: min(320px, calc(100vw - 84px)) !important;
    max-height: min(320px, calc(100vh - 90px)) !important;
    max-height: min(320px, calc(100dvh - 90px)) !important;
}

/* Otevřený seznam kontaktů nepřekrývat s otevřenými okny chatu —
   okna posunout vlevo od panelu (panel ~320px + odsazení od FABů). */
.gc-mini-chat--map.is-open .gc-mini-chat-windows {
    margin-right: 340px !important;
}

/* Full-page chat compose — final overrides (chat.phtml reloads this sheet last) */
body.gc-page-chat .pageBodyChat .sendBtnChatBody #emojiBtn,
body.gc-page-chat .pageBodyChat .sendBtnChatBody .emojiBtnChat {
    position: relative !important;
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.gc-page-chat .pageBodyChat .gc-chat-emoji-wrap {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    overflow: visible !important;
}

body.gc-page-chat .pageBodyChat .sendBtnChatBody .messageChat,
body.gc-page-chat .pageBodyChat .sendBtnChatBody textarea.messageChat {
    margin-left: 0 !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
}

body.gc-page-chat .page-footer-body,
body.gc-page-chat #page-footer-body {
    display: none !important;
}

/* Chat header — one row (Bootstrap 3 has no .d-flex) */
body.gc-page-chat .gc-chat-header,
.pageBodyChat .gc-chat-header {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    float: none !important;
}

body.gc-page-chat .gc-chat-header .chatUserImg,
.pageBodyChat .gc-chat-header .chatUserImg {
    grid-column: 1 !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    float: none !important;
}

body.gc-page-chat .gc-chat-header .chatUserNameAndFormaneStatusBody,
.pageBodyChat .gc-chat-header .chatUserNameAndFormaneStatusBody {
    grid-column: 2 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    margin: 0 !important;
    float: none !important;
}

body.gc-page-chat .gc-chat-header .chatUserNameAndFormane a,
.pageBodyChat .gc-chat-header .chatUserNameAndFormane a {
    display: inline !important;
    float: none !important;
}

body.gc-page-chat .gc-chat-header .chatUserStatus,
.pageBodyChat .gc-chat-header .chatUserStatus {
    float: none !important;
}

body.gc-page-chat .gc-chat-header .chatUserStatusOnline,
.pageBodyChat .gc-chat-header .chatUserStatusOnline {
    display: inline-flex !important;
    float: none !important;
}

body.gc-page-chat .gc-chat-header .chatUserStatusOnline .online,
body.gc-page-chat .gc-chat-header .chatUserStatusOnline #onlineText,
.pageBodyChat .gc-chat-header .chatUserStatusOnline .online,
.pageBodyChat .gc-chat-header .chatUserStatusOnline #onlineText {
    float: none !important;
    margin: 0 !important;
}

body.gc-page-chat .gc-chat-header .bodyChatListUserDelete,
.pageBodyChat .gc-chat-header .bodyChatListUserDelete {
    grid-column: 3 !important;
    float: none !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    overflow: hidden !important;
}

body.gc-page-chat .gc-chat-header .bodyChatListUserDelete a,
.pageBodyChat .gc-chat-header .bodyChatListUserDelete a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    color: #fff !important;
    text-decoration: none !important;
}

body.gc-page-chat .gc-chat-header .bodyChatListUserDelete .glyphicon,
.pageBodyChat .gc-chat-header .bodyChatListUserDelete .glyphicon {
    position: static !important;
    top: auto !important;
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 1 !important;
}

/* === Úpravy chatu (2026-07-09): kulaté fotky, bílý panel === */

/* 1) Všechny fotky uživatelů v chatu KULATÉ.
   Pozn.: avatary zpráv měly třídu `rounded-circle` (Bootstrap 4/5), ale app běží
   na Bootstrapu 3 → třída je neúčinná a fotky byly čtvercové. */
.pageBodyChat .bodyChatListUserImgProfile,
.pageBodyChat .bodyChatListUserImg img,
.pageBodyChat .chatUserImg img,
.gc-chat-header .chatUserImg img,
.pageBodyChat .viewStateDivLtextImg img,
.gc-mini-chat .viewStateDivLtextImg img {
    border-radius: 50% !important;
    object-fit: cover;
}

/* 2) Levý panel (seznam chatů) — VŽDY celé bílé pozadí.
   Bezpodmínečný selektor (bez `:has()`, který starší prohlížeče zahodí i s celou
   skupinou) + oprava neplatného `#ffff` z public.css. Výšku drží stretch níž. */
.bodyChatList {
    background: #fff !important;
}
.pageBodyChat .bodyChatList,
body.gc-page-chat .bodyChatList {
    align-self: stretch !important;
    min-height: 100% !important;
}

/* 3) Skrýt patičku mini-chat panelu */
.gc-mini-chat-panel-foot {
    display: none !important;
}

/* Potvrzení mazání konverzace — akce je nevratná a maže historii i protistraně. */
.gc-chat-confirm {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, .45);
}

.gc-chat-confirm[hidden] { display: none; }

.gc-chat-confirm__box {
    background: #fff;
    border-radius: 14px;
    padding: 20px;
    max-width: 380px;
    width: 100%;
    box-shadow: 0 18px 48px rgba(0, 0, 0, .25);
}

.gc-chat-confirm__title { margin: 0 0 8px; font-size: 17px; font-weight: 700; }
.gc-chat-confirm__msg { margin: 0 0 16px; font-size: 14px; line-height: 1.45; color: #4a5568; }
.gc-chat-confirm__actions { display: flex; gap: 10px; justify-content: flex-end; }
.bodyChatListUserDelete button { background: none; border: 0; color: inherit; cursor: pointer; }

/* Hláška „zprávu se nepodařilo odeslat" nad polem pro psaní. */
.gc-chat-send-error {
    margin: 8px 0 0;
    padding: 8px 12px;
    border-radius: var(--gc-radius, 12px);
    background: #fdecea;
    color: #a4262c;
    font-size: 14px;
    line-height: 1.4;
}
.gc-chat-send-error[hidden] { display: none; }

/* ==========================================================================
   PRÁZDNÝ CHAT NA MOBILU (2026-08-07)
   Pod 955 px je `.bodyChatList` `position: absolute` a leží nad chatovou
   plochou. Když žádná konverzace otevřená není, překrýval prázdný stav
   plochy — z něj byl vidět jen levý ústřižek textu a půlka tlačítka.
   Bez otevřené konverzace proto seznam zabírá celou šířku a plocha se skryje.
   ========================================================================== */
@media only screen and (max-width: 955px) {
    .pageBodyChat--no-active .bodyChatList {
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    .pageBodyChat--no-active .bodyChatRoom {
        display: none !important;
    }
}