#message-box.eqre-editor{position:relative}
#message-box.eqre-editor textarea.eqre-original-textarea{display:none!important}
#message-box.eqre-editor .fw-editor{border:1px solid #F3bb1499;border-radius: 20px; height:2.5em;outline:none;scrollbar-width:thin;width:100%;overflow:hidden;padding:5px 50px 5px 5px;font-size: 16px;box-sizing:border-box}
#message-box.eqre-editor.active .fw-editor{height:2.5em;overflow:auto}
#message-box.eqre-editor .fw-editor-smilies,#message-box.eqre-editor .fw-editor-counter{display:none;line-height:1.2em;position:absolute;z-index:10}
#message-box.eqre-editor.active .fw-editor-smilies{display:block;right:13px;top:6px;font-size:1.5em}
#message-box.eqre-editor.active .fw-editor-counter{display:flex;align-items:center;gap:2px;right:12px;top:40px}
.fw-editor[placeholder]:empty:before{content:attr(placeholder);cursor:text;display:block;line-height:1.5em;opacity:.7}
a.mention{font-weight:bold;color:rgba(243,187,20,.85)!important}
.fw-editor a.mention:hover{text-decoration:none}
.fw-smiley-container{max-height:200px;max-width:250px;overflow:auto;padding:4px}
.fw-smiley-container>a{display:inline-block;margin:4px}
.eqre-dropdown{position:fixed;z-index:10;min-width:170px;max-width:300px;background:#222;border:1px solid #F3bb1477;box-shadow:0 3px 10px rgba(0,0,0,.25);color:#f3bb14;border-radius:3px}
.eqre-dropdown .avatar {border-radius: 50%;border: 1px solid #f3bb1433;object-fit: cover;aspect-ratio: 1/1;}
.eqre-dropdown .fw-user-selector a img.avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 6px;
    object-fit: cover;
    border:1px solid #F3bb1433;
}
.eqre-dropdown .fw-user-selector a:not(:has(img.avatar))::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 6px;
    background-image: url("/images/avatars/gallery/no_avatar.jpg");
    background-size: cover;
    background-position: center;
    background-clip: padding-box;
    border:1px solid #F3bb1433;
}
.eqre-dropdown .fw-user-selector a span {
    font-size: 13px;
    vertical-align: middle;
}
.eqre-dropdown ul{list-style:none;margin:0;padding:0}
.eqre-dropdown li{margin:0;padding:0}
.eqre-dropdown li a{display:block;line-height:16px;padding:6px 10px;text-decoration:none;color:inherit;cursor:pointer}
.eqre-dropdown li a:hover,.eqre-dropdown li a.active{background:rgba(243,187,20,.12)}
.fw-user-selector{max-height:200px;overflow:auto;list-style:none;margin:0;padding:0}
.fw-user-selector .fw-user-avatar,.fw-user-selector img{height:27px;width:27px;object-fit:cover;vertical-align:middle}
.fw-user-selector li a>span{margin-left:5px;vertical-align:middle}

.eqre-smiley-button,.eqre-upload-button{
	position:absolute;
	border:0;
	background:transparent;
	padding:0;
	margin:0;
	cursor:pointer;
	color:#f3bb14;
	line-height:1;
	font-size:1.5em;
	display:none;
	z-index:10;
}
#quickmod .dropdown {
    z-index: 20 !important;
}
.eqre-smiley-button .icon {font-size: 20px;}
.eqre-upload-button .icon {font-size: 17px;}
.eqre-smiley-button{right:10px;top:12px}
.eqre-upload-button{right:12px;top:46px}
#message-box.eqre-editor.active .eqre-smiley-button,
#message-box.eqre-editor.active .eqre-upload-button{display:block}
.eqre-smiley-button:focus,.eqre-upload-button:focus{outline:1px dotted currentColor}
.eqre-smiley-button:hover,.eqre-upload-button:hover{opacity:.8}
.eqre-smiley-dropdown{max-width:250px;padding:4px}
.eqre-smiley-dropdown a{display:inline-block;margin:4px;line-height:0}

.eqre-editor-attachments{
	display:flex;
	flex-wrap:wrap;
	gap:4px;
	margin:4px 0 0;
	padding:0;
	list-style:none;
}
.eqre-editor-attachments .attachment{
	position:relative;
	margin:0;
	width:64px;
	height:64px;
	list-style:none;
}
.eqre-editor-attachments .attachment-preview,
.eqre-editor-attachments .media-thumbnail{
	width:64px;
	height:64px;
}
.eqre-editor-attachments .media-thumbnail{
	overflow:hidden;
	border-radius:3px;
}
.eqre-editor-attachments .media-thumbnail img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}
.eqre-attachment-remove{
	position:absolute;
	top:2px;
	right:2px;
	width:18px;
	height:18px;
	line-height:18px;
	text-align:center;
	border-radius:50%;
	background:rgba(0,0,0,.65);
	color:#fff!important;
	text-decoration:none!important;
	font-size:11px;
}
.eqre-attachment-fields{display:none}

.eqre-smiley-loading,.eqre-smiley-empty{display:block;padding:10px;text-align:center;white-space:nowrap;opacity:.75}


/* Remote images inserted into the Quick Reply editor are intentionally
 * constrained to 20% of the editor width while preserving aspect ratio. */
#message-box.eqre-editor .fw-editor img.eqre-remote-image {
	display: block;
	width: 20%;
	max-width: 30%;
	height: auto;
	max-height: none;
	object-fit: contain;
}

.eqre-smiley-dropdown .fw-smiley-container img {
	max-width: 48px;
	height: auto;
	vertical-align: middle;
}

/* Smiley popup: keep it visible above the editor and make the phpBB
 * smiley images clickable on desktop and touch/WebView devices. */
.eqre-smiley-dropdown {
	box-sizing: border-box;
	padding: 6px;
	overflow: visible;
}
.eqre-smiley-dropdown .fw-smiley-container {
	display: grid;
	grid-template-columns: repeat(6, minmax(28px, 1fr));
	gap: 4px;
	max-height: 240px;
	max-width: 270px;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 4px;
	box-sizing: border-box;
}
.eqre-smiley-dropdown .eqre-smiley-item {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	min-height: 28px;
	margin: 0;
	padding: 3px;
	line-height: 0;
	cursor: pointer;
	text-decoration: none;
}
.eqre-smiley-dropdown .eqre-smiley-item img {
	display: block;
	max-width: 32px;
	max-height: 32px;
	width: auto;
	height: auto;
}
.eqre-smiley-dropdown .eqre-smiley-item:hover,
.eqre-smiley-dropdown .eqre-smiley-item:focus {
	background: rgba(243,187,20,.15);
	border-radius: 4px;
}

/* =========================================================
   QUICK REPLY - FINAL FACEBOOK-STYLE OVERRIDES
   ========================================================= */

/* The message box is the single positioning context for all
   four bottom actions. */
#message-box.eqre-editor {
	position: relative !important;
	width: 100%;
	min-width: 0;
	padding-bottom: 38px !important;
	box-sizing: border-box;
}

/* Comment editor */
#message-box.eqre-editor .fw-editor {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	min-width: 0 !important;
	min-height: 42px !important;
	max-height: 100px !important;
	box-sizing: border-box !important;

	padding: 8px 12px !important;

	border: 1px solid rgba(243,187,20,.60) !important;
	border-radius: 20px !important;

	outline: none !important;
	background: transparent !important;

	font-size: 16px !important;
	line-height: 1.45 !important;

	white-space: pre-wrap !important;
	overflow-wrap: anywhere !important;
	word-break: break-word !important;

	overflow-x: hidden !important;
	overflow-y: hidden;

	scrollbar-width: thin;
	scrollbar-color: rgba(243,187,20,.50) transparent;
}

/* JS controls the height dynamically from scrollHeight. */
#message-box.eqre-editor .fw-editor {
	height: 42px;
}
/* IMPORTANT:
   Smilies inserted into the editor must remain inline.
   Without this, another global img rule can make each smiley
   occupy its own line. */
#message-box.eqre-editor .fw-editor img.eqre-smiley {
	display: inline-block !important;
	width: auto !important;
	height: auto !important;
	max-width: 32px !important;
	max-height: 32px !important;
	vertical-align: middle !important;
	margin: 0 2px !important;
	object-fit: contain !important;
}

/* Remote images keep their existing behavior. */
#message-box.eqre-editor .fw-editor img.eqre-remote-image {
	display: block;
	width: 20%;
	max-width: 20%;
	height: auto;
	object-fit: contain;
}

/* Attachments stay below the editor and above the action row. */
#message-box.eqre-editor .eqre-editor-attachments {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin: 4px 0 0 !important;
	padding: 0;
	list-style: none;
}

/* =========================================================
   ONE COMMON BOTTOM ROW
   Upload | Smiley | Full Editor                         Send
   ========================================================= */

/* The submit fieldset is moved into #message-box by JS. */
#message-box.eqre-editor > .submit-buttons {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;

	display: block !important;
	width: 100% !important;
	height: 38px !important;
	min-height: 38px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	box-sizing: border-box !important;

	z-index: 10 !important;
}

/* Upload */
#message-box.eqre-editor .eqre-upload-button {
	position: absolute !important;
	left: 4px !important;
	right: auto !important;
	top: auto !important;
	bottom: 4px !important;

	display: block !important;
	width: 30px !important;
	height: 30px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;

	background: transparent !important;
	color: rgba(243,187,20,.80) !important;

	line-height: 30px !important;
	text-align: center !important;

	opacity: .80 !important;
	cursor: pointer !important;

	box-shadow: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

#message-box.eqre-editor .eqre-upload-button .icon {
	font-size: 22px !important;
	line-height: 30px !important;
	color: rgba(243,187,20,.80) !important;
}

/* Smiley */
#message-box.eqre-editor .eqre-smiley-button {
	position: absolute !important;
	left: 48px !important;
	right: auto !important;
	top: auto !important;
	bottom: 4px !important;

	display: block !important;
	width: 30px !important;
	height: 30px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;

	background: transparent !important;
	color: rgba(243,187,20,.80) !important;

	line-height: 30px !important;
	text-align: center !important;

	opacity: .80 !important;
	cursor: pointer !important;

	box-shadow: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

#message-box.eqre-editor .eqre-smiley-button .icon {
	font-size: 24px !important;
	line-height: 30px !important;
	color: rgba(243,187,20,.80) !important;
}

/* Full editor - NEW SVG supplied by user */
#message-box.eqre-editor #qr_full_editor {
	position: absolute !important;
	left: 92px !important;
	right: auto !important;
	top: auto !important;
	bottom: 4px !important;

	display: block !important;
	width: 30px !important;
	height: 30px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;

	background-color: transparent !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 24px 24px !important;

	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.0223 2.99928C11.3752 4.00973 11 5.21105 11 6.5C11 10.0899 13.9101 13 17.5 13C19.2469 13 20.8328 12.3109 22.0008 11.1896L22 14.75C22 16.5449 20.5449 18 18.75 18H12.9648L7.57814 21.8173C7.12752 22.1366 6.50337 22.0301 6.18407 21.5795C6.06432 21.4105 6 21.2085 6 21.0016L5.9992 18H5.25C3.45507 18 2 16.5449 2 14.75V6.25C2 4.45507 3.45507 3 5.25 3L12.0223 2.99928ZM17.5 1C20.5376 1 23 3.46243 23 6.5C23 9.53757 20.5376 12 17.5 12C14.4624 12 12 9.53757 12 6.5C12 3.46243 14.4624 1 17.5 1ZM17.5 2.5L17.4101 2.50806C17.206 2.5451 17.0451 2.70603 17.0081 2.91012L17 3L16.999 6H14L13.9101 6.00806C13.706 6.0451 13.5451 6.20603 13.5081 6.41012C13.5 6.5 13.5081 6.58988 13.9101 6.99194L14 7H16.999L17 10L17.0081 10.0899C17.0451 10.294 17.206 10.4549 17.4101 10.4919L17.5 10.5L17.5899 10.4919C17.794 10.4549 17.9549 10.294 17.9919 10.0899L18 10L17.999 7H21L21.0899 6.99194C21.294 6.9549 21.4549 6.79397 21.4919 6.58988L21.5 6.5L21.4919 6.41012C21.4549 6.20603 21.294 6.0451 21.0899 6.00806L21 6H17.999L18 3L17.9919 2.91012C17.9549 2.70603 17.794 2.5451 17.5899 2.50806L17.5 2.5Z' fill='%23f3bb14'/%3E%3C/svg%3E") !important;

	color: transparent !important;
	font-size: 0 !important;
	text-indent: -9999px !important;

	opacity: .80 !important;
	cursor: pointer !important;

	box-shadow: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

/* Send */
#message-box.eqre-editor .submit-buttons .button1 {
	position: absolute !important;
	right: 4px !important;
	left: auto !important;
	top: auto !important;
	bottom: 2px !important;

	display: block !important;
	width: 34px !important;
	height: 34px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;

	background-color: transparent !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 30px 30px !important;

	background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.3009 13.6949L20.102 3.89742M10.5795 14.1355L12.8019 18.5804C13.339 19.6545 13.6075 20.1916 13.9458 20.3356C14.2394 20.4606 14.575 20.4379 14.8492 20.2747C15.1651 20.0866 15.3591 19.5186 15.7472 18.3818L19.9463 6.08434C20.2845 5.09409 20.4535 4.59896 20.3378 4.27142C20.2371 3.98648 20.013 3.76234 19.7281 3.66167C19.4005 3.54595 18.9054 3.71502 17.9151 4.05315L5.61763 8.2523C4.48114 8.64037 3.91289 8.83441 3.72478 9.15032C3.56153 9.42447 3.53891 9.76007 3.66389 10.0536C3.80791 10.3919 4.34498 10.6605 5.41912 11.1975L9.86397 13.42C10.041 13.5085 10.1295 13.5527 10.2061 13.6118C10.2742 13.6643 10.335 13.7256 10.3876 13.7933C10.4468 13.87 10.491 13.9585 10.5795 14.1355Z' stroke='%23f3bb14' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

	color: transparent !important;
	font-size: 0 !important;
	text-indent: -9999px !important;

	opacity: .80 !important;
	cursor: pointer !important;

	box-shadow: none !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

/* Filled send state when editor contains text OR a smiley */
#message-box.eqre-editor.has-content .submit-buttons .button1 {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23f3bb14'%3E%3Cpath d='M10.3009 13.6949L20.102 3.89742M10.5795 14.1355L12.8019 18.5804C13.339 19.6545 13.6075 20.1916 13.9458 20.3356C14.2394 20.4606 14.575 20.4379 14.8492 20.2747C15.1651 20.0866 15.3591 19.5183 15.7472 18.3818L19.9463 6.08434C20.2845 5.09409 20.4535 4.59896 20.3378 4.27142C20.2371 3.98648 20.013 3.76234 19.7281 3.66167C19.4005 3.54595 18.9054 3.71502 17.9151 4.05315L5.61763 8.2523C4.48114 8.64037 3.91289 8.83441 3.72478 9.15032C3.56153 9.42447 3.53891 9.76007 3.66389 10.0536C3.80791 10.3919 4.34498 10.6605 5.41912 11.1975L9.86397 13.42C10.041 13.5085 10.1295 13.5527 10.2061 13.6118C10.2742 13.6643 10.3352 13.7253 10.3876 13.7933C10.4468 13.87 10.491 13.9585 10.5795 14.1355Z' stroke='%23000000' stroke-width='0.1' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	opacity: .90 !important;
}

/* Hover */
#message-box.eqre-editor .eqre-upload-button:hover,
#message-box.eqre-editor .eqre-smiley-button:hover,
#message-box.eqre-editor #qr_full_editor:hover,
#message-box.eqre-editor .submit-buttons .button1:hover {
	opacity: 1 !important;
	transform: scale(1.05);
}

/* Hide original button text */
#message-box.eqre-editor #qr_full_editor,
#message-box.eqre-editor .submit-buttons .button1 {
	text-shadow: none !important;
}

/* Smiley popup */
.eqre-smiley-dropdown {
	position: fixed !important;
	z-index: 10 !important;
	box-sizing: border-box !important;
	min-width: 170px !important;
	max-width: 280px !important;
	background: #222 !important;
	border: 1px solid rgba(243,187,20,.60) !important;
	border-radius: 10px !important;
	box-shadow: 0 4px 18px rgba(0,0,0,.45) !important;
	padding: 6px !important;
	overflow: visible !important;
}

.eqre-smiley-dropdown .fw-smiley-container {
	display: grid !important;
	grid-template-columns: repeat(6, minmax(28px, 1fr));
	gap: 4px;
	width: 100%;
	max-height: 240px;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 4px;
	box-sizing: border-box;
}

.eqre-smiley-dropdown .eqre-smiley-item {
	display: flex !important;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	min-height: 28px;
	margin: 0 !important;
	padding: 3px;
	cursor: pointer;
	line-height: 0;
	text-decoration: none;
}

.eqre-smiley-dropdown .eqre-smiley-item img {
	display: block !important;
	max-width: 32px !important;
	max-height: 32px !important;
	width: auto !important;
	height: auto !important;
}

/* Mobile/touch safety */
@media (max-width: 600px) {
	#message-box.eqre-editor .fw-editor {
		font-size: 16px !important;
	}

	#message-box.eqre-editor #qr_full_editor {
		left: 92px !important;
	}
}



/* =========================================================
   FINAL INTERACTION / RESIZE / PLACEHOLDER
   ========================================================= */

/* Keep the message box as the positioning context. */
#message-box.eqre-editor {
	position: relative !important;
}

/* The fieldset contains hidden fields + submit controls, but must
   never become a transparent click-blocking layer. */
#message-box.eqre-editor > .submit-buttons {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 38px !important;
	min-height: 38px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-sizing: border-box !important;
	z-index: 10 !important;
	pointer-events: none !important;
}

/* Re-enable interaction only for Full Editor and Send. */
#message-box.eqre-editor > .submit-buttons #qr_full_editor,
#message-box.eqre-editor > .submit-buttons .button1 {
	pointer-events: auto !important;
	z-index: 10 !important;
}

/* Upload and Smiley remain fully clickable. */
#message-box.eqre-editor > .eqre-upload-button,
#message-box.eqre-editor > .eqre-smiley-button {
	z-index: 10 !important;
	pointer-events: auto !important;
}

/* Placeholder */
#message-box.eqre-editor .fw-editor::before,
#message-box.eqre-editor .fw-editor:empty::before,
#message-box.eqre-editor:not(.has-content) .fw-editor::before {
	content: "Comment" !important;
	position: absolute !important;
	left: 12px !important;
	top: 8px !important;
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	color: currentColor !important;
	font: inherit !important;
	line-height: 1.45 !important;
	opacity: .60 !important;
	pointer-events: none !important;
}

/* Hide placeholder whenever JS knows that content exists. */
#message-box.eqre-editor.has-content .fw-editor::before,
#message-box.eqre-editor.has-content .fw-editor:empty::before {
	content: none !important;
	display: none !important;
}

/* Smilies remain inline. */
#message-box.eqre-editor .fw-editor img.eqre-smiley {
	display: inline-block !important;
	vertical-align: middle !important;
	width: auto !important;
	height: auto !important;
	max-width: 32px !important;
	max-height: 32px !important;
	margin: 0 2px !important;
	object-fit: contain !important;
}

/* Prevent global image rules from changing smiley layout. */
#message-box.eqre-editor .fw-editor img {
	max-width: 100%;
}

/* Remote images keep their existing behavior. */
#message-box.eqre-editor .fw-editor img.eqre-remote-image {
	display: block !important;
	width: 20% !important;
	max-width: 20% !important;
	height: auto !important;
	object-fit: contain !important;
}

/* Attachments stay above the action row. */
#message-box.eqre-editor > .eqre-editor-attachments {
	position: relative;
	z-index: 10;
}

/* Mobile/touch */
@media (max-width: 600px) {
	#message-box.eqre-editor .fw-editor {
		font-size: 16px !important;
	}

	#message-box.eqre-editor #qr_full_editor {
		left: 92px !important;
	}
}
/* =========================================================
   CBB MEDIA DIALOG - DARK / GOLD THEME
   ========================================================= */

@media (max-width: 600px) {

	/* ---------- Dialog ---------- */

	.cbb-modal-dialog.media.media-modal.fixed {
		position: fixed;
		top: 20% !important;
		left: 50% !important;
		transform: translateX(-50%);

		width: calc(100% - 10px);
		max-width: 420px;

		height: 40vh;
		max-height: 50vh;

		display: flex;
		flex-direction: column;

		background: #181818;
		border: 1px solid #f3bb1488;
		border-radius: 10px;

		box-shadow:
			0 8px 30px rgba(0, 0, 0, 0.65),
			0 0 12px rgba(243, 187, 20, 0.08);

		overflow: hidden;

		color: rgba(243, 187, 20, 0.8);
		animation: cbbModalFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
		will-change: transform, opacity;
	}
	
    @keyframes cbbModalFadeIn {
        0% {
            opacity: 0;
            transform: translateX(-50%) scale(0.92) translateY(-20px);
        }
        100% {
            opacity: 1;
            transform: translateX(-50%) scale(1) translateY(0);
        }
    }

	/* ---------- Left / Top Menu ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-menu {
		background: #111111;
		border-bottom: 1px solid rgba(243, 187, 20, 0.25);
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-menu li a {
		color: rgba(243, 187, 20, 0.8);
		background: transparent;
		transition: background 0.2s ease, color 0.2s ease;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-menu li a:hover,
	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-menu li a.active {
		color: #f3bb14;
		background: #242424;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-menu li a .fa {
		color: #f3bb14;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-menu .row-separator {
		border-color: rgba(243, 187, 20, 0.18);
	}


	/* ---------- Header ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-header {
		background: #1c1c1c;
		border-bottom: 1px solid rgba(243, 187, 20, 0.25);
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-header h1 {
		color: rgba(243, 187, 20, 0.8);
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-close {
		color: #f3bb14;
		background: transparent;
		border-radius: 6px;
		transition: background 0.2s ease, color 0.2s ease;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-close:hover {
		color: #111111;
		background: #f3bb14;
	}


	/* ---------- Content ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content {
		flex: 1 1 auto;
		min-height: 0;

		height: auto;
		max-height: none !important;

		overflow-y: auto;
		overflow-x: hidden;

		background: #181818;
		border-color: #f3bb1455 !important;

		color: rgba(243, 187, 20, 0.8);

		scrollbar-width: thin;
		scrollbar-color: rgba(243, 187, 20, 0.45) #111111;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content::-webkit-scrollbar {
		width: 5px;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content::-webkit-scrollbar-track {
		background: #111111;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content::-webkit-scrollbar-thumb {
		background: rgba(243, 187, 20, 0.45);
		border-radius: 10px;
	}
	.cbb-modal-dialog .cbb-section-content {
		right: 0 !important;
	}
    .cbb-modal-dialog .cbb-inputbox {
        border: 1px solid #f3bb1455 !important;
    }

    /* Hiệu ứng khi nhấp chuột gõ chữ (Focus) */
    .cbb-modal-dialog .cbb-inputbox:focus {
        border-color: #f3bb1455 !important;
        box-shadow: 0 0 6px rgba(243, 187, 20, 0.5) !important; /* Phát sáng vàng nhẹ */
    }

	/* ---------- Content Text ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content,
	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content p,
	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content span,
	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-content label {
		color: rgba(243, 187, 20, 0.8);
	}


	/* ---------- Empty Message ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-message {
		background: #222222;
		border: 1px solid rgba(243, 187, 20, 0.18);
		border-radius: 6px;

		color: rgba(243, 187, 20, 0.65);
	}


	/* ---------- Buttons ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-btn {
		background: #111111;
		border: 1px solid #f3bb1499;
		border-radius: 6px;

		color: #f3bb14;

		transition:
			background 0.2s ease,
			border-color 0.2s ease;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-btn:hover,
	.cbb-modal-dialog.media.media-modal.fixed .cbb-btn:focus {
		background: #f3bb1455;
		border-color: #f3bb1488;
		color: #111111;
	}


	/* ---------- Toolbar ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-toolbar {
		flex: 0 0 auto;

		background: #111111;
		border-top: 1px solid rgba(243, 187, 20, 0.5);

		color: rgba(243, 187, 20, 0.8);
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-toolbar .count {
		color: rgba(243, 187, 20, 0.7);
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-dialog-toolbar .count .value {
		color: #f3bb14;
	}


	/* ---------- Inputs ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-inputbox {
		background: #111111;
		border: 1px solid #444444;
		border-radius: 6px;

		color: rgba(243, 187, 20, 0.8);
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-inputbox:focus {
		border-color: #f3bb14;
		outline: none;
		box-shadow: 0 0 0 1px rgba(243, 187, 20, 0.15);
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-inputbox::placeholder {
		color: rgba(243, 187, 20, 0.4);
	}


	/* ---------- Upload Area ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .upload-ui,
	.cbb-modal-dialog.media.media-modal.fixed .uploader-inline {
		background: #1c1c1c;
		color: rgba(243, 187, 20, 0.8);
		padding-top: 10px;
	}

	.cbb-modal-dialog.media.media-modal.fixed .uploader-inline {
		border: 1px dashed rgba(243, 187, 20, 0.35);
		border-radius: 8px;
		margin: 10px;
		top: 5px !important;
	}

	.cbb-modal-dialog.media.media-modal.fixed .uploader-inline h3,
	.cbb-modal-dialog.media.media-modal.fixed .uploader-inline p {
		color: rgba(243, 187, 20, 0.75);
	}


	/* ---------- Attachment Items ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .cbb-media-attachments .attachment {
		background: #202020;
		border: 1px solid #333333;
		border-radius: 7px;
	}

	.cbb-modal-dialog.media.media-modal.fixed .cbb-media-attachments .attachment:hover {
		border-color: rgba(243, 187, 20, 0.6);
	}


	/* ---------- Check Button ---------- */

	.cbb-modal-dialog.media.media-modal.fixed .media-check {
		background: #111111;
		border: 1px solid #f3bb14;
		border-radius: 50%;

		color: #f3bb14;
	}

	.cbb-modal-dialog.media.media-modal.fixed .media-check:hover {
		background: #f3bb14;
		color: #111111;
	}
}