/* flamenet-chatrooms — IRC-style Y2K chat window */

.fncr-wrap {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #333;
	margin: 0 0 12px;
}

.fncr-header {
	background: linear-gradient(180deg, #596EBB 0%, #1835A0 50%, #13297D 100%);
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	padding: 4px 8px;
	border: 1px solid #122678;
	border-bottom: none;
	text-transform: uppercase;
	letter-spacing: .04em;
	display: flex;
	align-items: center;
	gap: 10px;
}
.fncr-header a.fncr-back {
	color: #FFCC00;
	text-decoration: none;
	font-weight: bold;
	font-size: 11px;
}
.fncr-header a.fncr-back:hover { text-decoration: underline; }
.fncr-room-name { flex: 1; }

/* Scope the wrapper-body rule to direct children of .fncr-wrap so it doesn't
   cascade to the inline `.fncr-body` spans inside .fncr-msg (which would
   put a bordered white box around every message → visual overlap). */
.fncr-wrap > .fncr-body {
	border: 1px solid #7F9DB9;
	background: #fff;
	padding: 10px 12px;
}

.fncr-topic-bar {
	background: #EEF2FF;
	border: 1px solid #7F9DB9;
	border-top: none;
	padding: 4px 8px;
	font-size: 11px;
	color: #1835A0;
}
.fncr-topic-bar .fncr-topic-edit {
	font-size: 10px;
	color: #0000CC;
	margin-left: 6px;
}
.fncr-topic-form { display: inline-flex; gap: 4px; margin-left: 6px; }
.fncr-topic-form input[type="text"] {
	border: 1px solid #7F9DB9;
	padding: 2px 4px;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	min-width: 200px;
}

.fncr-notice {
	font-size: 11px;
	padding: 4px 8px;
	margin-bottom: 8px;
	border: 1px solid #7F9DB9;
	background: #EEF2FF;
	color: #1835A0;
}
.fncr-notice.error { background: #FFF0F0; border-color: #CC0000; color: #CC0000; }

.fncr-actions { margin-bottom: 8px; }

.fncr-btn {
	background: linear-gradient(180deg, #596EBB 0%, #1835A0 50%, #13297D 100%);
	color: #fff;
	border: none;
	padding: 4px 10px;
	font-size: 11px;
	font-weight: bold;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	display: inline-block;
}
.fncr-btn:hover {
	background: linear-gradient(180deg, #3F8BBD 0%, #0266A8 50%, #025286 100%);
	color: #fff;
}
.fncr-btn-link {
	color: #0000CC;
	text-decoration: underline;
	font-size: 11px;
	margin-left: 8px;
}

.fncr-empty {
	font-size: 11px;
	color: #666;
	font-style: italic;
	padding: 6px 0;
}

/* Room directory grid */
.fncr-room-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 8px;
}
.fncr-room-card {
	background: #EEF2FF;
	border: 1px solid #7F9DB9;
	padding: 8px 10px;
}
.fncr-room-title a {
	font-weight: bold;
	color: #0000CC;
	font-size: 12px;
	text-decoration: none;
}
.fncr-room-title a:hover { text-decoration: underline; color: #CC0000; }
.fncr-room-topic { color: #1835A0; font-size: 11px; margin: 2px 0; }
.fncr-room-desc  { color: #333; font-size: 11px; margin: 2px 0 4px; }
.fncr-room-meta  { display: flex; justify-content: space-between; align-items: center; font-size: 10px; color: #666; }
.fncr-room-slug  { font-family: monospace; }

.fncr-badge {
	background: #FFCC00;
	color: #003399;
	font-weight: bold;
	padding: 1px 6px;
	border: 1px solid #B98F00;
	font-size: 10px;
}

/* Room view: 2-column */
.fncr-room-body { padding: 0; }
.fncr-room-columns {
	display: flex;
	gap: 0;
}
.fncr-stream-col {
	flex: 1;
	min-width: 0;
	padding: 10px 12px;
	border-right: 1px solid #7F9DB9;
}
.fncr-presence-col {
	width: 160px;
	background: #EEF2FF;
	padding: 10px 12px;
}

.fncr-stream {
	height: 380px;
	overflow-y: auto;
	background: #FFFFFF;
	border: 1px solid #7F9DB9;
	padding: 6px 8px;
	font-size: 11px;
	line-height: 1.4;
}
.fncr-msg {
	padding: 1px 0;
}
.fncr-time { color: #666; font-size: 10px; margin-right: 6px; }
.fncr-nick { color: #0000CC; font-weight: bold; margin-right: 4px; }
.fncr-body { color: #333; word-wrap: break-word; }
.fncr-msg-system .fncr-body { color: #666; font-style: italic; }
.fncr-msg-action .fncr-body { color: #660099; font-style: italic; }

.fncr-compose {
	display: flex;
	gap: 6px;
	margin-top: 6px;
}
.fncr-compose input[type="text"] {
	flex: 1;
	border: 1px solid #7F9DB9;
	padding: 3px 6px;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
}
.fncr-compose input[type="text"]:focus { outline: none; border-color: #1835A0; }

.fncr-login-prompt {
	margin-top: 6px;
	padding: 6px;
	text-align: center;
	font-size: 11px;
	border: 1px dashed #7F9DB9;
	background: #EEF2FF;
}
.fncr-login-prompt a { color: #0000CC; }

.fncr-presence-header {
	font-weight: bold;
	color: #1835A0;
	font-size: 11px;
	border-bottom: 1px solid #7F9DB9;
	padding-bottom: 3px;
	margin-bottom: 6px;
	text-transform: uppercase;
	letter-spacing: .03em;
}
.fncr-presence-list {
	list-style: none;
	margin: 0; padding: 0;
}
.fncr-presence-list li {
	font-size: 11px;
	color: #333;
	padding: 1px 0;
}
.fncr-dot {
	display: inline-block;
	width: 7px; height: 7px;
	border-radius: 50%;
	background: #5BB85B;
	margin-right: 5px;
	vertical-align: middle;
}

/* Create-room form */
.fncr-form-stacked { display: block; }
.fncr-form-stacked .fncr-label {
	display: block;
	margin-bottom: 8px;
	font-size: 11px;
	color: #333;
}
.fncr-form-stacked .fncr-label input,
.fncr-form-stacked .fncr-label textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: 2px;
	border: 1px solid #7F9DB9;
	padding: 4px 6px;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
}
.fncr-form-actions { margin-top: 6px; }

/* Mini embed */
.fncr-mini {
	border: 1px solid #7F9DB9;
	background: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	margin-bottom: 12px;
}
.fncr-mini-header {
	background: linear-gradient(180deg, #596EBB 0%, #1835A0 50%, #13297D 100%);
	color: #fff;
	padding: 3px 6px;
	display: flex;
	justify-content: space-between;
	font-size: 11px;
	font-weight: bold;
}
.fncr-mini-header a { color: #fff; text-decoration: none; }
.fncr-mini-count { font-size: 10px; opacity: .85; }
.fncr-mini-stream {
	max-height: 160px;
	overflow-y: auto;
	padding: 4px 8px;
	font-size: 11px;
}
.fncr-mini-footer {
	text-align: right;
	font-size: 10px;
	padding: 2px 8px;
	border-top: 1px solid #EEF2FF;
	background: #F5F8FF;
}
.fncr-mini-footer a { color: #0000CC; }

/* Responsive */
@media (max-width: 600px) {
	.fncr-room-columns { flex-direction: column; }
	.fncr-stream-col { border-right: none; border-bottom: 1px solid #7F9DB9; }
	.fncr-presence-col { width: auto; }
	.fncr-stream { height: 280px; }
}