/* Rumi's Den staff portal — self-contained, theme independent */
.rcf-portal {
	--rcf-ink: #1b1b1f;
	--rcf-muted: #6b6b76;
	--rcf-line: #e4e2dd;
	--rcf-accent: #8b1e2d;
	--rcf-bg: #faf8f5;
	max-width: 1180px;
	margin: 0 auto;
	padding: 8px 16px 48px;
	color: var(--rcf-ink);
	font-size: 16px;
	line-height: 1.55;
	box-sizing: border-box;
}
.rcf-portal *, .rcf-portal *::before, .rcf-portal *::after { box-sizing: border-box; }
.rcf-portal h2, .rcf-portal h3, .rcf-portal h4 { margin: 0 0 8px; line-height: 1.25; }
.rcf-portal h3 { font-size: 20px; }
.rcf-portal h4 { font-size: 17px; }

.rcf-p-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 0 16px; flex-wrap: wrap; }
.rcf-p-brand { font-size: 22px; font-weight: 700; letter-spacing: -0.01em; }
.rcf-p-muted { color: var(--rcf-muted); }
.rcf-p-small { font-size: 13px; }

.rcf-p-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--rcf-line); margin-bottom: 20px; flex-wrap: wrap; }
.rcf-p-tab { padding: 10px 16px; text-decoration: none; color: var(--rcf-muted); font-weight: 600; border-bottom: 2px solid transparent; }
.rcf-p-tab:hover { color: var(--rcf-ink); }
.rcf-p-tab.is-active { color: var(--rcf-accent); border-bottom-color: var(--rcf-accent); }

.rcf-p-card { background: #fff; border: 1px solid var(--rcf-line); border-radius: 12px; padding: 20px 22px; margin-bottom: 20px; }
.rcf-p-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 10px; flex-wrap: wrap; }
.rcf-p-card-head h3, .rcf-p-card-head h4 { margin: 0; }
.rcf-p-narrow { max-width: 420px; margin: 40px auto; }
.rcf-p-two { display: grid; grid-template-columns: 1.4fr 1fr; gap: 20px; align-items: start; }
.rcf-p-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 860px) { .rcf-p-two, .rcf-p-grid2 { grid-template-columns: 1fr; } }

.rcf-p-label { display: block; font-size: 13px; font-weight: 600; margin: 14px 0 5px; }
.rcf-p-input { width: 100%; padding: 10px 12px; border: 1px solid #cfccc6; border-radius: 8px; font: inherit; background: #fff; color: var(--rcf-ink); }
.rcf-p-input:focus { outline: 2px solid rgba(139, 30, 45, 0.35); border-color: var(--rcf-accent); }
select.rcf-p-input { appearance: auto; }
.rcf-p-check { display: block; margin: 14px 0; font-size: 14px; }
.rcf-p-copy { font-size: 13px; }

.rcf-p-btn { display: inline-block; background: var(--rcf-accent); color: #fff !important; border: 1px solid var(--rcf-accent); border-radius: 8px; padding: 10px 18px; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; }
.rcf-p-btn:hover { filter: brightness(1.08); }
.rcf-p-btn-block { width: 100%; margin-top: 18px; }
.rcf-p-btn-ghost { background: #fff; color: var(--rcf-accent) !important; }
.rcf-p-link { color: var(--rcf-accent); font-weight: 600; text-decoration: none; }
.rcf-p-link:hover { text-decoration: underline; }

.rcf-p-notice { background: #eef7ee; border: 1px solid #bcdcbc; padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; }
.rcf-p-error { background: #fdeceb; border: 1px solid #f0bfbb; padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; }

.rcf-p-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin-bottom: 20px; }
.rcf-p-stat { background: #fff; border: 1px solid var(--rcf-line); border-radius: 12px; padding: 16px 18px; }
.rcf-p-stat-n { display: block; font-size: 30px; font-weight: 700; line-height: 1.1; }
.rcf-p-stat-l { display: block; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--rcf-muted); margin-top: 4px; }

.rcf-p-filters { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.rcf-p-filters .rcf-p-input { width: auto; min-width: 170px; }

.rcf-p-table-wrap { overflow-x: auto; }
.rcf-p-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.rcf-p-table th { text-align: left; font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--rcf-muted); border-bottom: 1px solid var(--rcf-line); padding: 8px 10px; }
.rcf-p-table td { border-bottom: 1px solid #f0eee9; padding: 12px 10px; vertical-align: top; }

.rcf-p-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; background: #eee; }
.rcf-p-pill-new { background: #e6f0fb; color: #1c4f86; }
.rcf-p-pill-in_review { background: #fdf3d9; color: #7a5b00; }
.rcf-p-pill-assigned { background: #e9e6fb; color: #4b3f9e; }
.rcf-p-pill-completed { background: #e6f5ea; color: #1f6b38; }
.rcf-p-pill-archived { background: #eeeeee; color: #666; }

.rcf-p-answers { margin: 12px 0 0; }
.rcf-p-answers dt { font-size: 13px; font-weight: 700; color: var(--rcf-muted); margin-top: 14px; }
.rcf-p-answers dd { margin: 2px 0 0; }
.rcf-p-list { margin: 8px 0 14px; padding-left: 18px; }
.rcf-p-inline { display: flex; gap: 8px; }
.rcf-p-inline .rcf-p-input { flex: 1; }

/* form builder rows (shared markup with wp-admin) */
.rcf-p-builder .rcf-field-row { display: flex; gap: 14px; border: 1px solid var(--rcf-line); border-radius: 10px; padding: 14px; margin-bottom: 10px; background: var(--rcf-bg); }
.rcf-p-builder .rcf-field-main { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.rcf-p-builder .rcf-field-side { width: 210px; display: flex; flex-direction: column; gap: 8px; }
.rcf-p-builder .rcf-field-row input[type="text"], .rcf-p-builder .rcf-field-row textarea, .rcf-p-builder .rcf-field-row select { width: 100%; padding: 8px 10px; border: 1px solid #cfccc6; border-radius: 8px; font: inherit; }
.rcf-p-builder .rcf-field-options { display: none; }
.rcf-p-builder .rcf-has-options .rcf-field-options { display: block; }
.rcf-p-builder .rcf-is-section .rcf-field-help { display: none; }
.rcf-p-builder .rcf-drag { color: #b5b1a8; cursor: grab; }
.rcf-p-builder .rcf-field-buttons { display: flex; gap: 6px; }
.rcf-p-builder .rcf-field-buttons .button { background: #fff; border: 1px solid #cfccc6; border-radius: 6px; padding: 4px 10px; cursor: pointer; font: inherit; }
@media (max-width: 700px) {
	.rcf-p-builder .rcf-field-row { flex-direction: column; }
	.rcf-p-builder .rcf-field-side { width: 100%; }
}

.rcf-p-builder .rcf-field-body { display: none; }
.rcf-p-builder .rcf-has-body .rcf-field-body { display: block; }
