@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@700&display=swap');

/* --- Global Theme & Light Background --- */
body {
background-color: #ffffff !important;
color: #330000;
font-weight: bold;
font-family: "Comfortaa", sans-serif;
margin: 0;
}

/* --- Hide Chatovod Branding --- */
a[href="https://chatovod.com"][target="_blank"] {
display: none !important;
visibility: hidden !important;
}

/* ? Darker Red Gradient Header */
.chatHeaderWrapper {
background: linear-gradient(135deg, #800000 0%, #b30000 50%, #d90000 100%) !important;
position: relative;
color: #ffffff !important;
font-size: 16px;
border-bottom: 2px solid #660000;
box-shadow: 0 4px 15px rgba(128, 0, 0, 0.3);
}

/* ? Aesthetic Tabs */
.chatTabs .tab, .chatUsersTabTitle {
background: linear-gradient(180deg, #b30000 0%, #800000 100%) !important;
color: #ffffff !important;
border: 1px solid rgba(255, 255, 255, 0.2) !important;
border-bottom: none !important;
border-radius: 15px 15px 0 0 !important;
}

/* --- ? CHAT MESSAGES & USER LIST - MATCHING LIGHT GRADIENT ? --- /
.chatMessagesWrapper, .chatUsersTab {
/ Identical light gradient for both wrappers */
background: linear-gradient(180deg, #ffffff 0%, #fff5f6 100%) !important;
border-radius: 12px;
border: 1px solid rgba(255, 0, 51, 0.15);
box-shadow: 0 4px 20px rgba(255, 0, 51, 0.08) !important;
}

.chatMessagesWrapper {
font-size: 12.5px;
font-family: "Comfortaa", sans-serif !important;
font-weight: 700 !important;
}

.chatUsersTab {
font-family: "Times New Roman", Times, serif !important;
font-size: 14px !important;
}

.chatMessage {
font-family: "Comfortaa", sans-serif !important;
font-weight: 700 !important;
}

.chatMessage.hl {
background: linear-gradient(90deg, #ffeef1, #ffffff) !important;
border-left: 4px solid #cc0000 !important;
}

.chatUsersTab .searchWrapper input {
border-radius: 20px;
border: 1px solid #ffccd5;
padding: 4px 10px;
background: #fffcfc;
}

/* --- Input Area --- */
.chatSendControlsWrapper div.textareaWrapper textarea {
background-color: #ffffff !important;
border-radius: 12px !important;
border: 2px solid #ffccd5 !important;
font-family: "Comfortaa", sans-serif;
}

/* ? SMILEY ICON - PRESERVED ? */
.chatSendControlsWrapper div.textareaWrapper > i.smileys {
width: 18px;
height: 18px;
right: -5px;
top: 5px;
background-image: url("https://st1.chatovod.net/u/cs/2016/05_26/61/798561/1465049703_0.gif") !important;
background-size: contain;
background-repeat: no-repeat;
position: absolute;
}

/* ? SEND BUTTON */
.sendMessageButton {
display: inline-block;
padding: 8px 25px;
font-size: 15px;
font-weight: bold;
color: #fff !important;
text-transform: uppercase;
border-radius: 50px;
background: linear-gradient(135deg, #b30000 0%, #800000 100%);
box-shadow: 0 4px 12px rgba(128, 0, 0, 0.3);
border: none;
cursor: pointer;
}

/* --- PROTECTED SECTION: DO NOT TOUCH --- */
.nickIcon, .nickIcon .filler, .nickIcon .mask, .nickIcon .status { background: none !important; border: none !important; }
.nickIcon { width: 22px; height: 22px; display: inline-block; vertical-align: middle; margin-right: 3px !important; position: relative; z-index: 5; border-radius: 50%; overflow: hidden; }
.nickIcon .mask { width: 100%; height: 100%; display: block; background-size: cover !important; background-position: center !important; border-radius: 50%; border: 1px solid #ff0055; background-image: url("https://i.ibb.co/5gvHMNDQ/ezgif-48a8b572ff18e72f.jpg") !important; }

.admin .groupIcon { background-image: url("https://i.ibb.co/5W1tYQSk/b-VAz-Xe.gif") !important; }
.moderator .groupIcon { background-image: url("https://i.ibb.co/Y7QqC60L/4el8d1w.gif") !important; background-size: contain; }

.is-owner .mask { background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSsknOjkpFEGBl6KvWs_a02kxLZBO__Uz06Rw&s") !important; }
.vip.male .nickIcon[title="VIP"] .mask { background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcS3UXWvE-kHMX9hJ4E_a9fQn0UpRwR_mop9avQ5U5Xjdg&s=10") !important; }
.vip.female .nickIcon[title="VIP"] .mask { background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSJ-BzmzMUuyxMHN0vba4plVs7J9zaLyOgCovs-a6LYhw&s=10") !important; }
.admin.male .nickIcon .mask { background-image: url("https://i.ibb.co/yBSzf1rT/ezgif-36c44c4d2cd5e799.png") !important; }
.male.moderator .nickIcon .mask { background-image: url("https://i.ibb.co/LMjwkLT/ezgif-33bff606dddd04cd.png") !important; }
.male .nickIcon .mask { background-image: url("https://cdn-icons-png.flaticon.com/512/4128/4128349.png") !important; }
.admin.female .nickIcon .mask { background-image: url("https://i.ibb.co/N6n9SNTg/ezgif-531834e77816937e.png") !important; }
.female.moderator .nickIcon .mask { background-image: url("https://i.ibb.co/k6GHwQ1m/ezgif-690b487952a3c158.jpg") !important; }
.female .nickIcon .mask { background-image: url("https://cdn.vectorstock.com/i/500p/71/63/girl-icon-flat-style-vector-9137163.jpg") !important; }

.admin .chatUserName { color: #ff4500 !important; font-weight: 900 !important; text-transform: uppercase; }
.moderator .chatUserName { font-weight: bold; color: #ff69b4; }
.vip .chatUserName, a.user[title="H?????LPH??"], a.user[title="Pawan Rajput"] {
font-size: 18px; font-weight: 900; text-transform: uppercase; color: transparent !important;
background: linear-gradient(90deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #8b00ff);
-webkit-background-clip: text; background-clip: text;
}