/* GGurgenidze stable UI v4 — authoritative UI layer */

/* Chat composer: no native file input, no preview row, one icon only. */
.gg-chat-compose{
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr) 44px!important;
    grid-template-areas:"attach input send" "status status status"!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    column-gap:9px!important;
    row-gap:6px!important;
    padding:12px 14px!important;
    margin:0!important;
    border-top:1px solid #e4e9f0!important;
    background:#fff!important;
}
.gg-chat-file-input,
.gg-chat-file-input[hidden]{
    display:none!important;
    position:absolute!important;
    width:0!important;
    height:0!important;
    opacity:0!important;
    pointer-events:none!important;
}
.gg-chat-attach,
.gg-chat-send{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:13px!important;
    display:grid!important;
    place-items:center!important;
    cursor:pointer!important;
}
.gg-chat-attach{
    grid-area:attach!important;
    background:#e8f2ff!important;
    color:#1676ed!important;
    box-shadow:inset 0 0 0 1px rgba(22,118,237,.12)!important;
}
.gg-chat-attach:hover{background:#dcecff!important}
.gg-chat-attach.is-selected{
    background:#e7f8ef!important;
    color:#178951!important;
    box-shadow:inset 0 0 0 1px rgba(23,137,81,.18)!important;
}
.gg-chat-send{
    grid-area:send!important;
    background:#1877f2!important;
    color:#fff!important;
}
.gg-chat-send:hover{filter:brightness(.96)}
.gg-chat-send:disabled{opacity:.58;cursor:not-allowed!important}
.gg-chat-attach svg,
.gg-chat-send svg{
    display:block!important;
    width:21px!important;
    height:21px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.9!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
}
.gg-chat-input{grid-area:input!important;min-width:0!important}
.gg-chat-input textarea{
    display:block!important;
    width:100%!important;
    min-height:44px!important;
    max-height:132px!important;
    margin:0!important;
    padding:11px 15px!important;
    resize:none!important;
    border:1px solid #dfe6ef!important;
    border-radius:15px!important;
    background:#f4f6f9!important;
    color:#172b4d!important;
    line-height:1.4!important;
    box-shadow:none!important;
}
.gg-chat-input textarea:focus{
    outline:3px solid rgba(24,119,242,.12)!important;
    border-color:#9bc5f7!important;
    background:#fff!important;
}
.gg-chat-compose .form-message{
    grid-area:status!important;
    min-height:0!important;
    margin:0!important;
    font-size:.8rem!important;
}
.gg-chat-compose .form-message:empty{display:none!important}

/* Own profile photo: native picker text removed, clean rectangle only. */
.gg-profile-photo-form{
    display:grid!important;
    justify-items:start!important;
    gap:14px!important;
}
.gg-profile-photo-picker{
    position:relative!important;
    display:block!important;
    width:min(320px,100%)!important;
    aspect-ratio:4/3!important;
    overflow:hidden!important;
    margin:0!important;
    border:1px solid #dbe4ee!important;
    border-radius:18px!important;
    background:#edf3f9!important;
    box-shadow:0 12px 30px rgba(31,53,82,.10)!important;
    cursor:pointer!important;
}
.gg-profile-photo-picker input[hidden]{display:none!important}
.gg-profile-photo-picker img,
.gg-profile-photo-picker > span{
    display:block!important;
    width:100%!important;
    height:100%!important;
    border:0!important;
    border-radius:0!important;
    object-fit:cover!important;
}
.gg-profile-photo-picker > span{
    display:grid!important;
    place-items:center!important;
    color:#1676ed!important;
    font-size:3rem!important;
    font-weight:900!important;
}

/* Public profile: isolated classes, no overlap with legacy styles. */
.ggp-page{display:grid!important;gap:24px!important;width:100%!important}
.ggp-hero{
    width:100%!important;
    padding:0!important;
    overflow:hidden!important;
    border-radius:20px!important;
}
.ggp-cover{
    width:100%!important;
    height:138px!important;
    background:
        radial-gradient(circle at 18% 0%,rgba(255,255,255,.34),transparent 34%),
        linear-gradient(135deg,#82b6f8 0%,#4a91e9 55%,#5d9fe9 100%)!important;
}
.ggp-identity{
    display:grid!important;
    grid-template-columns:156px minmax(0,1fr) auto!important;
    gap:24px!important;
    align-items:center!important;
    width:100%!important;
    margin:0!important;
    padding:28px 28px 30px!important;
    background:#fff!important;
}
.ggp-avatar-box{width:156px!important}
.ggp-avatar{
    display:block!important;
    width:156px!important;
    height:118px!important;
    margin:0!important;
    border:0!important;
    border-radius:18px!important;
    object-fit:cover!important;
    background:#edf3f8!important;
    box-shadow:0 12px 30px rgba(25,47,77,.14)!important;
}
.ggp-avatar-placeholder{
    display:grid!important;
    place-items:center!important;
    color:#1676ed!important;
    font-size:2.7rem!important;
    font-weight:900!important;
}
.ggp-info{min-width:0!important;padding-top:4px!important}
.ggp-name-row{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:10px!important;
}
.ggp-name-row h1{
    margin:0!important;
    color:#172b4d!important;
    font-size:clamp(1.75rem,3vw,2.25rem)!important;
    line-height:1.12!important;
}
.ggp-online{
    display:inline-flex!important;
    align-items:center!important;
    gap:6px!important;
    padding:5px 10px!important;
    border-radius:999px!important;
    background:#e9f8ef!important;
    color:#188049!important;
    font-size:.75rem!important;
    font-weight:800!important;
}
.ggp-online i{width:7px!important;height:7px!important;border-radius:50%!important;background:#24b864!important}
.ggp-member-since{margin:9px 0 0!important;color:#6f7f94!important;font-size:.98rem!important}
.ggp-stats{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:20px!important;
    margin-top:14px!important;
    color:#65768b!important;
    font-size:.88rem!important;
}
.ggp-stats strong{color:#1e324f!important}
.ggp-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex-wrap:wrap!important;
    gap:10px!important;
}
.ggp-actions form{display:block!important;margin:0!important}
.ggp-posts{width:100%!important}
.ggp-section-heading{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    margin:0 0 14px!important;
}
.ggp-section-heading h2{margin:0!important;font-size:1.7rem!important}
.ggp-section-heading span{color:#7a889b!important;font-size:.82rem!important}
.ggp-post-list{display:grid!important;gap:18px!important;width:100%!important}
.ggp-post{
    width:100%!important;
    padding:0!important;
    overflow:hidden!important;
    border-radius:19px!important;
}
.ggp-post-header{display:grid!important;gap:4px!important;padding:20px 22px 14px!important}
.ggp-post-header strong{color:#172b4d!important;font-size:.98rem!important}
.ggp-post-header time{color:#7d8a9d!important;font-size:.8rem!important}
.ggp-post-body{margin:0!important;padding:0 22px 18px!important;color:#223750!important;line-height:1.58!important}
.ggp-post-media{
    position:relative!important;
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    overflow:hidden!important;
    background:#101720!important;
}
.ggp-post-media img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-height:680px!important;
    object-fit:contain!important;
    background:#101720!important;
}
.ggp-media-count{
    position:absolute!important;
    right:14px!important;
    bottom:14px!important;
    min-width:38px!important;
    height:34px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    display:grid!important;
    place-items:center!important;
    background:rgba(10,21,36,.78)!important;
    color:#fff!important;
    font-size:.8rem!important;
    font-weight:900!important;
}
.ggp-post-footer{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    padding:14px 22px!important;
    border-top:1px solid #edf1f5!important;
    color:#68788d!important;
    font-size:.85rem!important;
}
.ggp-post-footer a{color:#246bc5!important;text-decoration:none!important;font-weight:700!important}
.ggp-empty{padding:36px!important;text-align:center!important}
.ggp-empty p{margin:7px 0 0!important;color:#718096!important}

@media(max-width:950px){
    .ggp-identity{
        grid-template-columns:136px minmax(0,1fr)!important;
        gap:20px!important;
        padding:24px!important;
    }
    .ggp-avatar-box{width:136px!important}
    .ggp-avatar{width:136px!important;height:104px!important}
    .ggp-actions{grid-column:1/-1!important;justify-content:flex-start!important}
}
@media(max-width:650px){
    .gg-chat-compose{
        grid-template-columns:40px minmax(0,1fr) 40px!important;
        column-gap:7px!important;
        padding:10px!important;
    }
    .gg-chat-attach,.gg-chat-send{width:40px!important;height:40px!important;min-width:40px!important}
    .ggp-cover{height:105px!important}
    .ggp-identity{
        grid-template-columns:112px minmax(0,1fr)!important;
        gap:15px!important;
        padding:20px 16px 22px!important;
    }
    .ggp-avatar-box{width:112px!important}
    .ggp-avatar{width:112px!important;height:88px!important;border-radius:15px!important}
    .ggp-name-row h1{font-size:1.5rem!important}
    .ggp-member-since{font-size:.86rem!important}
    .ggp-stats{gap:10px 16px!important;font-size:.8rem!important}
    .ggp-actions{width:100%!important}
    .ggp-actions .button{width:100%!important}
    .ggp-post-header{padding:17px 16px 12px!important}
    .ggp-post-body{padding:0 16px 16px!important}
    .ggp-post-footer{padding:13px 16px!important}
}
@media(max-width:450px){
    .ggp-identity{grid-template-columns:1fr!important}
    .ggp-avatar-box{width:132px!important}
    .ggp-avatar{width:132px!important;height:100px!important}
}