/* BuddySocial v9.72 - Chat URL Preview Frame */

.friend-chat-window .chat-url-preview{
  margin-top:7px !important;
  border:1px solid #bfd1df !important;
  border-radius:10px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(239,247,252,.97)) !important;
  box-shadow:0 2px 8px rgba(31,65,91,.09) !important;
  overflow:hidden !important;
  max-width:260px !important;
  color:#294f69 !important;
}

.friend-chat-window .chat-bubble.mine .chat-url-preview{
  border-color:#d8b66f !important;
  background:linear-gradient(180deg,#fffdf8,#fff3da) !important;
}

.friend-chat-window .chat-url-preview-meta{
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  gap:7px !important;
  align-items:center !important;
  padding:8px !important;
}

.friend-chat-window .chat-url-preview-icon{
  width:30px !important;
  height:30px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:8px !important;
  background:linear-gradient(180deg,#eef8ff,#d9edf9) !important;
  border:1px solid #bed5e4 !important;
  font-size:15px !important;
}

.friend-chat-window .chat-url-preview-meta>div{
  min-width:0 !important;
}

.friend-chat-window .chat-url-preview-meta b,
.friend-chat-window .chat-url-preview-meta small{
  display:block !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.friend-chat-window .chat-url-preview-meta b{
  color:#27628e !important;
  font-size:10px !important;
}

.friend-chat-window .chat-url-preview-meta small{
  margin-top:2px !important;
  color:#718797 !important;
  font-size:8px !important;
}

.friend-chat-window .chat-url-preview-actions{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  border-top:1px solid #d8e4ec !important;
}

.friend-chat-window .chat-url-preview-actions a,
.friend-chat-window .chat-url-preview-actions button{
  min-height:29px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:0 !important;
  border-radius:0 !important;
  background:#f7fbfd !important;
  color:#2c6694 !important;
  font-size:9px !important;
  font-weight:800 !important;
  text-decoration:none !important;
  cursor:pointer !important;
  box-shadow:none !important;
}

.friend-chat-window .chat-url-preview-actions>*+*{
  border-left:1px solid #d8e4ec !important;
}

.friend-chat-window .chat-url-preview-actions a:hover,
.friend-chat-window .chat-url-preview-actions button:hover{
  background:#e7f4fc !important;
  color:#174e79 !important;
}

/* Full viewer inside BuddySocial */
.buddy-url-viewer[hidden]{
  display:none !important;
}

.buddy-url-viewer{
  position:fixed !important;
  inset:0 !important;
  z-index:10050 !important;
}

.buddy-url-viewer-backdrop{
  position:absolute !important;
  inset:0 !important;
  background:rgba(19,40,57,.72) !important;
  backdrop-filter:blur(3px) !important;
}

.buddy-url-viewer-panel{
  position:absolute !important;
  inset:5vh 4vw !important;
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) !important;
  overflow:hidden !important;
  background:#fff !important;
  border:1px solid #6f98b4 !important;
  border-radius:12px !important;
  box-shadow:0 24px 80px rgba(0,0,0,.38) !important;
}

.buddy-url-viewer-panel>header{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  min-height:52px !important;
  padding:8px 11px !important;
  background:linear-gradient(180deg,#4b8dc4,#2f6fa8) !important;
  color:#fff !important;
}

.buddy-url-viewer-title{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
}

.buddy-url-viewer-title>span{
  font-size:20px !important;
}

.buddy-url-viewer-title b,
.buddy-url-viewer-title small{
  display:block !important;
}

.buddy-url-viewer-title small{
  margin-top:2px !important;
  color:#dff0fb !important;
}

.buddy-url-viewer-actions{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
}

.buddy-url-viewer-actions a,
.buddy-url-viewer-actions button{
  min-height:34px !important;
  padding:6px 10px !important;
  border:1px solid rgba(255,255,255,.30) !important;
  border-radius:8px !important;
  background:rgba(255,255,255,.14) !important;
  color:#fff !important;
  font-weight:800 !important;
  text-decoration:none !important;
  cursor:pointer !important;
}

.buddy-url-viewer-actions button{
  width:36px !important;
  padding:0 !important;
  font-size:20px !important;
}

.buddy-url-viewer-note{
  padding:6px 10px !important;
  background:#fff8e6 !important;
  border-bottom:1px solid #e8d39f !important;
  color:#74551b !important;
  font-size:10px !important;
}

.buddy-url-viewer iframe{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  border:0 !important;
  background:#fff !important;
}

body.buddy-url-viewer-open{
  overflow:hidden !important;
}

@media(max-width:760px){
  .friend-chat-window .chat-url-preview{
    max-width:100% !important;
  }

  .buddy-url-viewer-panel{
    inset:max(8px,env(safe-area-inset-top)) 7px max(8px,env(safe-area-inset-bottom)) 7px !important;
    border-radius:10px !important;
  }

  .buddy-url-viewer-title small{
    max-width:44vw !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  .buddy-url-viewer-actions a{
    padding:6px 8px !important;
    font-size:10px !important;
  }
}