/* Project-specific overrides on top of AdminLTE 3 + FontAwesome Pro.
 * Loaded after AdminLTE in the master layout, so rules here always win.
 *
 * Per root CLAUDE.md: no inline `style="..."` attributes in Blade files -
 * add classes here instead. */

/* The sg redesign.css and admin.css are loaded as separate files
 * (public/css/redesign.css, public/css/admin.css). Only project-specific
 * rgadmin overrides live here. */


/* Sidebar user-panel: name only, centered (no avatar). */
.user-panel .info {
	padding-left: 0;
}

/* Dashboard KPI tile: shrink the % sign so it doesn't dominate the number. */
.small-box .small-sup {
	font-size: 0.55em;
	margin-left: 2px;
}

/* AI tools test-chat: preserve whitespace + wrap long lines in the response box. */
.text-wrap-pre {
	white-space: pre-wrap;
	word-break: break-word;
}

/* Sidebar brand logo image (replaces the plain text title). */
.brand-link {
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Full wordmark: fit to the sidebar width so the whole logo stays visible. */
.brand-link .brand-logo-full {
	max-width: 100%;
	width: auto;
	height: auto;
	display: inline-block;
}

/* Square monogram, shown only when the sidebar is collapsed (inverted to light). */
.brand-link .brand-logo-mini {
	display: none;
	width: 33px;
	height: 33px;
	filter: invert(1);
}

/* Collapsed sidebar: swap the wordmark for the inverted monogram. */
.sidebar-collapse .brand-link .brand-logo-full {
	display: none;
}
.sidebar-collapse .brand-link .brand-logo-mini {
	display: inline-block;
}

/* Hover-expanded collapsed sidebar: restore the full wordmark. */
.sidebar-collapse .main-sidebar:hover .brand-link .brand-logo-full {
	display: inline-block;
}
.sidebar-collapse .main-sidebar:hover .brand-link .brand-logo-mini {
	display: none;
}

/* List-filter panel (<x-admin.filter>): save/delete-search icons in the card
 * header (replaces the szake inline font-size styles - no inline CSS rule). */
.filter-savesearch {
	margin-left: 10px;
}
.filter-savesearch .filter-save-icon {
	font-size: 20px;
}
.filter-savesearch .filter-delete-icon {
	font-size: 18px;
	margin-left: 6px;
}
.filter-savesearch a {
	color: inherit;
}

/* Breadcrumb bar (content-header): tighten the auto-rendered row. */
.content-header .breadcrumb {
	margin-bottom: 0;
	background: transparent;
	padding-left: 0;
}

/* Favorite star in the breadcrumb (replaces the szake inline style - the
 * star is a flex item of the .breadcrumb <ol>, nudged down to sit on the
 * text baseline exactly like szake). Gold when favorited (fas), muted grey
 * when not (far). */
.breadcrumb .fav-star {
	cursor: pointer;
	margin-left: 5px;
	color: #f39c12;
	font-size: 12px;
	position: relative;
	top: 8px;
}
.breadcrumb .fav-star.far {
	color: #adb5bd;
}
.breadcrumb .fav-star:hover {
	color: #f39c12;
}

/* Email-template editor (settings/email_templates): clickable variable chips
 * that insert the {placeholder} at the cursor of the subject input or CKEditor. */
.email-var-list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.email-var-list .email-var {
	font-family: monospace;
}

/* Client-side form validation (data-required, public/js/admin-forms.js):
 * required fields' labels get an automatic red asterisk. The .required class
 * is added to the .form-group by JS on page load; the asterisk lives in a
 * pseudo-element so label.text() stays clean for the error messages. */
.form-group.required > label::after {
	content: " *";
	color: #dc3545;
}

/* Invalid state for select2 pickers: the native <select> is hidden, so the
 * red border must be painted on the rendered select2 container instead. Covers
 * both themes (rgadmin select2 is the bootstrap4 theme via admin-select2.js). */
select.is-invalid + .select2-container--default .select2-selection,
select.is-invalid + .select2-container--bootstrap4 .select2-selection {
	border-color: #dc3545;
}


/* Row-action cross-link icons (create-lease links, _create-links partial). */
.create-links-icons a,
.create-links-icons .row-action-disabled {
	margin-right: 4px;
}

/* Disabled placeholder action (e.g. Telekom until Phase 4): grey, no pointer. */
.row-action-disabled {
	color: #adb5bd;
	cursor: not-allowed;
}

/* Create-lease button set in card headers / detail cards. */
.create-links-buttons .btn {
	margin-left: 4px;
}

/* Detail-card modal: tighten the definition tables. */
#detailModal .table-sm td,
#detailModal .table-sm th {
	padding: 0.25rem 0.5rem;
}

/* List-filter panel: shrink the select2 (bootstrap4 theme) single box to the
 * small-input height the filter uses (form-control-sm). The theme sets the
 * height with !important, so the override must too; the dropdown arrow is
 * theme-centered (top:50%, no height) and re-centers itself in the shorter box,
 * so it must NOT be given a height (that pushed it below the box). The selects
 * are auto-upgraded to select2 globally (admin-select2.js). */
.filter-form .select2-container--bootstrap4 .select2-selection--single {
	height: calc(1.5em + 0.5rem + 2px) !important;
}
.filter-form .select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
	line-height: calc(1.5em + 0.5rem);
}
/* Right-aligned checkbox bottom row: small gap above the field rows. */
.filter-checkboxes {
	margin-top: 0.25rem;
}

/* Money values: the thousands grouping is a CSS gap between digit-group spans
   (App\Support\Money::html), NOT a space character - copied values paste as a
   clean number ("230000"). */
.money .money-group + .money-group {
	margin-left: 0.22em;
}

/* Detail modal: gap between the Vissza button and the card title. */
#detailModal .js-detail-back {
	margin-right: 20px;
}


/* ============ Settlement matrix (Tartozások, admin/payments/matrix) ============ */

/* Scroll container: the grid is wide (16 month columns); cap the height so
   the sticky header has a scroll context. */
.pm-wrap {
	max-height: 75vh;
	overflow: auto;
}

.pm-table {
	margin-bottom: 0;
	white-space: nowrap;
}

/* Sticky month-header row (kept above the sticky group headers). */
.pm-table thead th {
	position: sticky;
	top: 0;
	z-index: 4;
	background: #fff;
}

/* Sticky first column (customer / property). */
.pm-table .pm-sticky-col {
	position: sticky;
	left: 0;
	z-index: 2;
	background: #fff;
	min-width: 220px;
	max-width: 280px;
	white-space: normal;
}
.pm-table thead .pm-sticky-col {
	z-index: 5;
}

.pm-table td,
.pm-table th {
	vertical-align: middle;
	text-align: center;
}
.pm-table .pm-sticky-col {
	text-align: left;
}

.pm-row-name {
	display: block;
	font-weight: 600;
}
.pm-row-detail {
	display: block;
	font-size: 0.85em;
	color: #6c757d;
}

/* Cell states (legacy color language, AdminLTE-toned). */
.pm-cell.pm-settled {
	background: #d4edda;
}
.pm-cell.pm-debt {
	background: #f8d7da;
}
.pm-cell.pm-due {
	background: #fff3cd;
}
.pm-cell.pm-blank {
	background: #f4f6f9;
}
/* The legacy blue tint: the cell has notes. */
.pm-cell.pm-has-notes {
	box-shadow: inset 0 0 0 2px #8994dc;
}

.pm-cell .pm-amount {
	display: block;
	color: inherit;
}
.pm-cell a.pm-amount:hover {
	text-decoration: underline;
}
.pm-cell .pm-paid-date {
	display: block;
	font-size: 0.78em;
	color: #6c757d;
}
.pm-cell .pm-adjust-line {
	display: block;
	font-size: 0.78em;
	color: #6c757d;
}
.pm-cell .pm-adjust-line .pm-credit {
	margin-left: 4px;
}

/* Cell toolbar: hidden until the cell is hovered (keeps the grid readable). */
.pm-cell .pm-tools {
	display: block;
	font-size: 0.85em;
	visibility: hidden;
}
.pm-cell:hover .pm-tools {
	visibility: visible;
}
.pm-cell .pm-tools a {
	color: #6c757d;
	margin: 0 3px;
}
.pm-cell .pm-tools a:hover {
	color: #007bff;
}
/* Cells with notes show the comment icon even without hover. */
.pm-cell.pm-has-notes .pm-tools {
	visibility: visible;
}
.pm-note-count {
	font-size: 0.85em;
	margin-left: 2px;
}

/* Synced-invoice indicator: always visible (a month either has an invoice or
   not - the operator should see it at a glance, not only on hover). Info-teal
   when the billed gross matches the cell amount, danger-red when it differs. */
.pm-cell .pm-tools a.pm-action-invoice {
	visibility: visible;
	color: #17a2b8;
}
.pm-cell .pm-tools a.pm-action-invoice:hover {
	color: #117a8b;
}
.pm-cell .pm-tools a.pm-action-invoice.pm-invoice-mismatch {
	color: #dc3545;
}
.pm-cell .pm-tools a.pm-action-invoice.pm-invoice-mismatch:hover {
	color: #a71d2a;
}
.pm-inv-count {
	font-size: 0.85em;
	margin-left: 1px;
}

/* Closed (inactive) rows: muted - the legacy magenta replaced with grey. */
.pm-row-closed .pm-sticky-col,
.pm-row-closed .pm-cell {
	opacity: 0.55;
}

/* Hovered row: every cell state gets a stronger/darker shade so the eye can
   follow the row across the wide grid. */
.pm-table tbody tr:hover .pm-sticky-col {
	background: #e9edf2;
}
.pm-table tbody tr:hover .pm-cell.pm-settled {
	background: #b7dfc3;
}
.pm-table tbody tr:hover .pm-cell.pm-debt {
	background: #f3bdc3;
}
.pm-table tbody tr:hover .pm-cell.pm-due {
	background: #ffe79e;
}
.pm-table tbody tr:hover .pm-cell.pm-blank {
	background: #e4e7eb;
}

/* Customer detail-card opener (eye) next to the row name. */
.pm-row-eye {
	margin-left: 4px;
	color: #6c757d;
	font-size: 0.85em;
}
.pm-row-eye:hover {
	color: #007bff;
}

/* Font-size button group next to the pager. */
.pm-font-controls {
	margin-left: 8px;
}

/* Location group header: emphasized (brand navy) and sticky right below the
   month-header row. The top offset is the measured thead height (CSS var set
   by payment-matrix.js, re-measured after a font-size change); the label
   itself sticks horizontally inside the wide colspan cell. */
.pm-group-header td {
	background: #0e2a47;
	color: #fff;
	font-weight: 600;
	text-align: left;
	border-color: #0e2a47;
	position: sticky;
	top: var(--pm-head-h, 36px);
	z-index: 3;
}
.pm-group-header .pm-group-label {
	position: sticky;
	left: 12px;
	display: inline-block;
}
.pm-summary td {
	background: #f8f9fa;
	font-size: 0.85em;
	color: #495057;
}
.pm-summary .pm-debtors {
	color: #6c757d;
}

/* Global summary (tfoot). */
.pm-table tfoot td {
	background: #f1f3f5;
	font-weight: 600;
	font-size: 0.85em;
}

/* Current month column highlight. */
.pm-table th.pm-col-current {
	background: #e3f2fd;
}

/* Legend chips above the grid. */
.pm-legend {
	border-bottom: 1px solid #dee2e6;
	font-size: 0.85em;
}
.pm-legend-item {
	margin-right: 14px;
}
.pm-swatch {
	display: inline-block;
	width: 12px;
	height: 12px;
	border: 1px solid #ced4da;
	vertical-align: -1px;
	margin-right: 3px;
}
.pm-swatch.pm-settled {
	background: #d4edda;
}
.pm-swatch.pm-debt {
	background: #f8d7da;
}
.pm-swatch.pm-due {
	background: #fff3cd;
}
.pm-swatch.pm-has-notes {
	background: #fff;
	box-shadow: inset 0 0 0 2px #8994dc;
}

/* Header controls: toggle + pager spacing (direct children only - the
   font-size btn-group must keep its joined look). */
.pm-closed-toggle {
	display: inline-block;
	margin-right: 12px;
	margin-bottom: 0;
}
.card-tools > .btn + .btn {
	margin-left: 4px;
}

/* Notes modal entries. */
.pm-note + .pm-note {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid #e9ecef;
}
.pm-note-text {
	white-space: pre-wrap;
}


/* ============ Residents (Lakólista) ============ */

/* The three contact-role headings (form + detail card) - a nod to the
   legacy color coding (owner purple, tenant green, contact dark red),
   toned to the admin palette. */
.resident-role-owner {
	color: #0e2a47;
}
.resident-role-tenant {
	color: #1e7e34;
}
.resident-role-contact {
	color: #8a3324;
}


/* ============ Newsletters (Hírlevelek) ============ */

/* Thin progress bars in the campaign list + detail card (the bar WIDTH stays a
   data-bound inline value - the Bootstrap idiom - only the height is a class). */
.progress-thin {
	height: 6px;
}
.progress-thin-lg {
	height: 10px;
}

/* Designer segment panels: ACTIVE (green) vs INACTIVE/ALL (red), tinted +
   bordered so the two audiences are never confused on a real send. */
.newsletter-seg-active {
	border: 1px solid #b7e0c0;
	background: #f2faf4;
	border-radius: 4px;
}
.newsletter-seg-inactive {
	border: 1px solid #efc4c4;
	background: #fdf5f5;
	border-radius: 4px;
}


/* ============ Dashboard widgets ============ */

/* Fixed-height box around the trend canvas - Chart.js runs with
   maintainAspectRatio: false, so the height must come from the parent. */
.dashboard-chart-box {
	position: relative;
	height: 300px;
}

/* Multi-link KPI tile footers (Lakások / Bérlemények / Garázs ...) - keep the
   AdminLTE footer look while holding several anchors side by side. */
.small-box .small-box-footer a {
	color: rgba(255, 255, 255, .85);
	display: inline-block;
	padding: 0 6px;
}
.small-box .small-box-footer a:hover {
	color: #fff;
}

/* Events list: fixed icon column so the rows align. */
.dash-event-icon {
	width: 1.75rem;
	text-align: center;
}


/* ============ Web content editor (admin/web) ============ */

/* Image slot: the preview shows the current main image (or the built-in
   default); the gallery (upload / main / crop) opens in the modal iframe. */
.wc-image-slot {
	display: inline-block;
}
.wc-image-preview {
	margin-bottom: 8px;
}
.wc-image-img {
	border: 1px solid #ced4da;
	border-radius: 4px;
	background: #f8f9fa;
	display: block;
}
/* Hero background previews are large (1920px source) - show at ~50% so the
   slot stays manageable; never overflow the card. */
.wc-image-preview-hero .wc-image-img {
	max-width: 960px;
	width: 100%;
	height: auto;
}
/* Non-hero images render at natural size, capped to the card width. */
.wc-image-preview-natural .wc-image-img {
	max-width: 100%;
	height: auto;
}
.wc-image-actions .btn + .btn {
	margin-left: 4px;
}

/* Gallery modal iframe (the shared admin.images gallery in embed mode). */
.wc-image-frame {
	width: 100%;
	height: 72vh;
	border: 0;
}
.wc-embed-body {
	background: #fff;
}

/* Crop page (Croppie) stage height so the viewport has room. */
.wc-crop-stage {
	min-height: 520px;
}

/* Image gallery (admin/images): drag&drop ordering + inactive cards. */
.img-drag-handle {
	cursor: grab;
	color: #6c757d;
}
.img-drag-handle:active {
	cursor: grabbing;
}
/* Sortable placeholder: the dashed slot the dragged card will drop into. */
.img-sort-placeholder {
	border: 2px dashed #adb5bd;
	border-radius: 4px;
	background: #f8f9fa;
}
/* Deactivated image: stays visible but clearly muted. */
.img-card-inactive {
	opacity: .55;
	filter: grayscale(60%);
}
/* Lightbox-openable thumbnails. */
a[data-toggle="lightbox"] img {
	cursor: zoom-in;
}

/* Items repeater: compact control column (up/down/remove icon links). */
.wc-repeater-controls-col {
	width: 90px;
}
.wc-repeater-controls {
	white-space: nowrap;
	text-align: center;
	vertical-align: middle !important;
}
.wc-repeater-controls a {
	color: #6c757d;
	display: inline-block;
	padding: 2px 5px;
}
.wc-repeater-controls a:hover {
	color: #0e2a47;
}
.wc-repeater-controls .wc-row-remove:hover {
	color: #dc3545;
}

/* Repeater polish: the first row cannot move up, the last cannot move down -
   hide the dead arrows (visibility keeps the icon spacing stable). */
.wc-repeater tbody tr:first-child .wc-row-up,
.wc-repeater tbody tr:last-child .wc-row-down {
	visibility: hidden;
}

/* Two consecutive repeaters in one form (the Web csomagok card: features +
   prices) - 20px gap between the first's "Új elem" button and the next
   repeater's label. (The CMS editor has one repeater per section card, so this
   adjacency only occurs on the Web csomagok form.) */
.wc-repeater + .wc-repeater {
	margin-top: 20px;
}

/* Per-row visibility checkbox column (saves with the form, not AJAX). The
   iCheck box is the row's only control there - center it, no label text. */
.wc-repeater-active-col {
	width: 40px;
	text-align: center;
}
.wc-repeater-active {
	text-align: center;
	vertical-align: middle !important;
}
.wc-repeater-active .icheck-primary {
	margin: 0;
	padding-left: 18px; /* center the 22px box in the narrow cell */
}

/* Lucide icon picker modal: responsive grid of name-labelled icon buttons. */
.wc-lucide-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
	gap: 6px;
}
.wc-lucide-item {
	border: 1px solid #e9ecef;
	background: #fff;
	border-radius: 4px;
	padding: 10px 4px 6px;
	text-align: center;
	cursor: pointer;
}
.wc-lucide-item:hover {
	border-color: #0e2a47;
	background: #f8f9fa;
}
.wc-lucide-item svg {
	width: 22px;
	height: 22px;
	stroke: #0e2a47;
}
.wc-lucide-item span {
	display: block;
	font-size: 11px;
	color: #6c757d;
	margin-top: 4px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Property web-listing fact rows: narrow icon column (lucide input-group). */
.wc-fact-icon-col {
	width: 200px;
}

/* ---------------------------------------------------------------------------
   Documents (the polymorphic file manager + viewer)
   --------------------------------------------------------------------------- */
/* Type icon in the manager list - colored by document kind. */
.doc-type-icon {
	font-size: 18px;
}
.doc-type-image { color: #17a2b8; }
.doc-type-pdf   { color: #dc3545; }
.doc-type-other { color: #6c757d; }
/* Deactivated document row: visible but muted. */
.doc-row-inactive {
	opacity: .6;
}
.doc-drag-handle {
	cursor: grab;
	color: #adb5bd;
}
/* PDF viewer popup page: a thin title/download bar + the inline <embed> filling
   the rest of the popup window (flex column). */
.doc-viewer {
	display: flex;
	flex-direction: column;
	height: calc(100vh - 28px);
}
.doc-viewer-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 2px 0 10px;
}
.doc-viewer-name {
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-right: 12px;
}
.doc-pdf-embed {
	flex: 1 1 auto;
	width: 100%;
	min-height: 400px;
	border: 1px solid #dee2e6;
}
/* Read-only documents list inside a detail card / form section. */
.doc-list {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}
.doc-list li {
	padding: 4px 0;
	border-bottom: 1px solid #f1f1f1;
}
.doc-list li:last-child {
	border-bottom: 0;
}

/* Üzenetek (web_messages) inbox - unread marker dot in the received column. */
.wm-unread-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ffc107;
	vertical-align: middle;
	margin-right: 2px;
}

/* Tartozások matrix - quick client-side filter bar above the legend. */
.pm-filterbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	background: #f8f9fa;
	border-bottom: 1px solid #e9ecef;
}
.pm-filterbar .pm-filter-debtors {
	margin-bottom: 0;
}
.pm-filterbar .pm-filter-search {
	width: 240px;
	max-width: 100%;
}
.pm-filterbar .pm-filter-loc {
	width: 220px;
	max-width: 100%;
}
.pm-filterbar .pm-filter-count {
	font-weight: 600;
}

/* Tartozáslista (flat debt list): the view switch + the list-specific cells.
   The list reuses .pm-table (so payment-matrix.js filtering + cell styling
   apply), but its info columns are left-aligned and wrap. */
.pm-view-switch .btn.active {
	pointer-events: none;
}
.pm-list-table td.pm-list-text,
.pm-list-table th.pm-list-text {
	text-align: left;
	white-space: normal;
}
.pm-list-table td.pm-list-text {
	min-width: 160px;
}
/* Every listed month is overdue: show the (passed) deadline in muted red. */
.pm-list-table .pm-deadline-over {
	color: #b02a37;
	white-space: nowrap;
}

/* ---------------------------------------------------------------------------
   In-app manual (Súgó) help panel - the AdminLTE control-sidebar
   (#rgHelpPanel) widened + the rg-help-* content styles (manual-help.js).
   ------------------------------------------------------------------------- */
/* The header opener: a labelled brand pill instead of a bare nav icon. */
.main-header .rg-help-open {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 16px;
	margin-right: 10px;
	border-radius: 999px;
	background: #0E2A47;
	border: 1px solid #0E2A47;
	color: #fff;
	font-weight: 600;
	font-size: 0.9rem;
	line-height: 1.2;
	white-space: nowrap;
}
.main-header .rg-help-open:hover,
.main-header .rg-help-open:focus {
	background: #B8924A;
	border-color: #B8924A;
	color: #fff;
	text-decoration: none;
}
.main-header .rg-help-open .far {
	font-size: 1.05rem;
}
.control-sidebar,
.control-sidebar::before {
	bottom: 0;
	width: 420px;
	right: -420px;
}
.control-sidebar-slide-open .control-sidebar,
.control-sidebar-slide-open .control-sidebar::before,
.control-sidebar-open .control-sidebar,
.control-sidebar-open .control-sidebar::before {
	right: 0;
}
#rgHelpPanel {
	overflow: hidden;
}
#rgHelpPanel .rg-help {
	display: flex;
	flex-direction: column;
	height: 100%;
}
.rg-help-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 14px;
	border-bottom: 1px solid #dee2e6;
	background: #0E2A47;
	color: #fff;
}
.rg-help-head-title {
	font-weight: 600;
}
.rg-help-head-context {
	display: block;
	font-size: 0.78rem;
	font-weight: 400;
	opacity: 0.75;
}
.rg-help-close {
	color: #fff;
	opacity: 0.8;
	padding: 2px 6px;
}
.rg-help-close:hover {
	color: #fff;
	opacity: 1;
}
.rg-help-search {
	display: flex;
	gap: 6px;
	padding: 10px 14px;
	border-bottom: 1px solid #dee2e6;
	background: #f8f9fa;
}
.rg-help-body {
	flex: 1;
	overflow-y: auto;
	padding: 12px 14px;
	font-size: 0.875rem;
}
.rg-help-loading {
	text-align: center;
	color: #6c757d;
	padding: 18px 0;
}
.rg-help-block {
	margin-bottom: 16px;
}
.rg-help-block-title {
	font-weight: 600;
	color: #0E2A47;
	margin-bottom: 6px;
}
.rg-help-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.rg-help-list > li {
	margin-bottom: 4px;
}
.rg-help-hit,
.rg-help-chapter {
	display: block;
	padding: 6px 8px;
	border: 1px solid #e9ecef;
	border-radius: 4px;
	color: #212529;
	background: #fff;
}
.rg-help-hit:hover,
.rg-help-chapter:hover {
	background: #f1f5f9;
	text-decoration: none;
	color: #0E2A47;
}
.rg-help-hit-title {
	display: block;
	font-weight: 600;
}
.rg-help-hit-crumb {
	display: block;
	font-size: 0.76rem;
	color: #6c757d;
}
.rg-help-hit-snippet {
	display: block;
	margin-top: 3px;
	font-size: 0.8rem;
	color: #495057;
}
.rg-help-hit-snippet mark,
.rg-help-section-body mark {
	padding: 0 1px;
	background: #ffe58a;
}
.rg-help-hit-expand {
	margin: 4px 0 8px;
	padding: 8px 10px;
	border-left: 3px solid #B8924A;
	background: #fbfaf7;
}
.rg-help-noresult {
	color: #6c757d;
}
.rg-help-bubble {
	margin-bottom: 10px;
	padding: 8px 12px;
	border-radius: 10px;
	max-width: 95%;
}
.rg-help-bubble-user {
	background: #0E2A47;
	color: #fff;
	margin-left: auto;
	border-bottom-right-radius: 2px;
	width: fit-content;
}
.rg-help-bubble-answer {
	background: #f1f3f5;
	border-bottom-left-radius: 2px;
}
.rg-help-reader-head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
}
.rg-help-reader-title {
	font-weight: 600;
	color: #0E2A47;
}
.rg-help-toc {
	list-style: none;
	margin: 0 0 12px;
	padding: 8px 10px;
	background: #f8f9fa;
	border-radius: 4px;
	font-size: 0.82rem;
}
.rg-help-toc-l3 {
	padding-left: 14px;
}
.rg-help-h2 {
	font-size: 1rem;
	font-weight: 700;
	color: #0E2A47;
	margin: 14px 0 6px;
	padding-top: 8px;
	border-top: 1px solid #e9ecef;
}
.rg-help-h3 {
	font-size: 0.9rem;
	font-weight: 600;
	margin: 10px 0 4px;
}
/* Manual tables are wide - scroll them inside the panel, never the panel. */
.rg-help-section-body table {
	display: block;
	overflow-x: auto;
	max-width: 100%;
	font-size: 0.8rem;
	border-collapse: collapse;
}
.rg-help-section-body th,
.rg-help-section-body td {
	border: 1px solid #dee2e6;
	padding: 3px 6px;
	vertical-align: top;
}
.rg-help-section-body p,
.rg-help-section-body ul {
	margin-bottom: 0.5rem;
}
.rg-help-open-chapter {
	display: inline-block;
	margin-top: 6px;
	border: 0;
	padding: 0;
	background: none;
	color: #0E2A47;
	font-weight: 600;
}
/* AI answer (env-gated): offer button under the results + the AI bubble. */
.rg-help-ai-offer {
	margin-top: 8px;
	text-align: right;
}
.rg-help-bubble-ai {
	border-left: 3px solid #B8924A;
	background: #fbfaf7;
}
.rg-help-ai-tag {
	font-size: 0.76rem;
	font-weight: 600;
	color: #B8924A;
	margin-bottom: 4px;
}
.rg-help-ai-sources {
	margin-top: 8px;
	font-size: 0.78rem;
	font-weight: 600;
	color: #6c757d;
}
/* "Hasznos volt?" thumbs under an answer bubble. */
.rg-help-feedback {
	margin-top: 8px;
	padding-top: 6px;
	border-top: 1px dashed #dee2e6;
	font-size: 0.78rem;
	color: #6c757d;
	display: flex;
	align-items: center;
	gap: 10px;
}
.rg-help-feedback .rg-help-fb {
	color: #6c757d;
	font-size: 0.95rem;
}
.rg-help-feedback .rg-help-fb:hover {
	color: #0E2A47;
}
/* Kézikönyv import page: monospace source editor + panel-style preview. */
.rg-manual-src {
	font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
	font-size: 0.82rem;
	white-space: pre;
}
.rg-manual-preview {
	max-height: 75vh;
	overflow-y: auto;
	font-size: 0.875rem;
}