#rit-app {
	max-width: 1240px;
	margin: 0 auto;
}

.rit-menubar {
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 4px 6px;
	background: #2c3338;
	border: 1px solid #dcdcde;
	border-bottom: none;
}

.rit-menu {
	position: relative;
}

.rit-menu-trigger {
	padding: 6px 14px;
	border: none;
	background: none;
	color: #f0f0f1;
	font-size: 13px;
	cursor: pointer;
	border-radius: 3px;
}

.rit-menu-trigger:hover,
.rit-menu.is-open .rit-menu-trigger {
	background: #3c434a;
}

.rit-active-mode-badge {
	display: inline-block;
	margin-left: 6px;
	padding: 2px 8px;
	background: #2271b1;
	color: #fff;
	border-radius: 10px;
	font-size: 11px;
	font-weight: 600;
	vertical-align: middle;
}

.rit-menu-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 1200;
	min-width: 260px;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 0 4px 4px 4px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	padding: 6px;
	display: none;
	flex-direction: column;
	gap: 2px;
}

.rit-menu.is-open .rit-menu-dropdown {
	display: flex;
}

.rit-menu-item {
	display: block;
	width: 100%;
	text-align: left;
	padding: 8px 10px;
	border: none;
	background: none;
	border-radius: 3px;
	cursor: pointer;
	font-size: 13px;
	color: #1d2327;
}

.rit-menu-item:hover {
	background: #f0f0f1;
}

.rit-menu-item-primary {
	background: #2271b1;
	color: #fff;
}

.rit-menu-item-primary:hover {
	background: #135e96;
}

.rit-menu-label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 6px 10px;
	font-size: 12px;
	color: #646970;
}

.rit-menu-input {
	width: calc(100% - 20px);
	margin: 2px 10px 6px;
	padding: 5px 8px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
}

.rit-menu-select {
	padding: 3px 6px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
}

.rit-menu-divider {
	height: 1px;
	background: #dcdcde;
	margin: 4px 2px;
}

.rit-menu-checkbox {
	padding: 6px 10px;
	font-size: 12px;
}

.rit-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	padding: 10px;
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	border-bottom: none;
}

/* Toolbaren innehåller numera bara "Stäng ytan"-knappen (synlig enbart
 * under aktiv zon-ritning) och en dold filuppladdnings-input – klassen
 * sätts/tas bort i JS (se updateToolbarVisibility) istället för att
 * förlita sig på :has(), som saknas i äldre webbläsare. */
.rit-toolbar.is-empty {
	padding: 0;
	border-width: 0 1px;
}

.rit-mode-btn,
.rit-tool-btn {
	padding: 6px 12px;
	border: 1px solid #c3c4c7;
	background: #fff;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
}

.rit-mode-btn.is-active {
	background: #2271b1;
	border-color: #2271b1;
	color: #fff;
}

.rit-checkbox-label {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	color: #3c434a;
	white-space: nowrap;
	cursor: pointer;
}

.rit-checkbox-label input[type="checkbox"] {
	margin: 0;
	cursor: pointer;
}

.rit-primary {
	background: #2271b1;
	border-color: #2271b1;
	color: #fff;
}

.rit-close-zone-btn {
	background: #00a32a;
	border-color: #00a32a;
	color: #fff;
	font-weight: 600;
}

.rit-divider {
	width: 1px;
	height: 24px;
	background: #c3c4c7;
	margin: 0 4px;
}

#rit-title {
	padding: 5px 8px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
}

.rit-status {
	padding: 6px 10px;
	font-size: 13px;
	color: #2271b1;
	min-height: 20px;
}

#rit-canvas {
	display: block;
	border: 1px solid #dcdcde;
	background: #fff;
	cursor: crosshair;
	max-width: 100%;
}

.rit-help {
	font-size: 13px;
	color: #646970;
	margin-top: 10px;
}

.rit-props-panel {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	background: #eefaf0;
	border: 1px solid #b8e6c1;
	border-top: none;
	font-size: 13px;
}

.rit-props-field input {
	padding: 3px 6px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
	width: 90px;
}

.rit-danger {
	background: #d63638;
	border-color: #d63638;
	color: #fff;
}

.rit-props-hint {
	margin: 0;
	color: #646970;
}

.rit-port-list {
	margin: 6px 0 0;
	padding-left: 18px;
	font-size: 12px;
	color: #3c434a;
}

.rit-props-model-section {
	margin: 10px 0;
	padding-top: 8px;
	border-top: 1px solid #d4ecd9;
}

.rit-similar-models-list {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 4px;
}

.rit-similar-model-btn {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	padding: 6px 8px;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
	cursor: pointer;
	text-align: left;
	font-size: 12px;
}

.rit-similar-model-btn:hover {
	background: #f0f7f1;
	border-color: #00a32a;
}

.rit-similar-model-name {
	font-weight: 600;
	color: #1d2327;
}

.rit-similar-model-spec {
	color: #646970;
	white-space: nowrap;
}

/* .rit-3d-panel (yttre positionering/bakgrund) ersatt av
 * .rit-floating-panel + .rit-floating-panel-wide – se dessa nedan
 * tillsammans med resten av det flytbara fönstersystemet. */

.rit-3d-controls {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	margin-bottom: 12px;
	font-size: 13px;
}

.rit-3d-controls label {
	display: flex;
	align-items: center;
	gap: 6px;
}

.rit-3d-controls input[type="number"] {
	width: 70px;
}

.rit-3d-viewports {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.rit-3d-viewport h4 {
	margin: 0 0 6px;
	font-size: 13px;
	color: #646970;
}

.rit-3d-viewport canvas {
	border: 1px solid #dcdcde;
	background: #ccc;
	max-width: 100%;
}

.rit-cable-summary {
	padding: 10px 12px;
	margin-top: 10px;
	border-radius: 4px;
	font-size: 13px;
	line-height: 1.6;
}

.rit-cable-summary.is-ok {
	background: #eefaf0;
	border: 1px solid #b8e6c1;
	color: #00632a;
}

.rit-cable-summary.is-warn {
	background: #fcf3f3;
	border: 1px solid #f0b8b8;
	color: #8a2424;
}

.rit-cable-warning-link {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	color: #8a2424;
	font-size: 13px;
	text-decoration: underline;
	cursor: pointer;
	text-align: left;
}

.rit-cable-warning-link:hover {
	color: #d63638;
}

/* --- Projektförutsättningar --- */

.rit-project-settings {
	margin-top: 20px;
	padding: 14px 16px;
	background: #fafafa;
	border: 1px solid #dcdcde;
	border-radius: 6px;
}

.rit-project-settings h3 {
	margin: 0 0 10px;
	font-size: 14px;
}

.rit-project-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

.rit-project-grid label {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 12px;
	color: #646970;
}

.rit-project-grid select,
.rit-project-grid input {
	padding: 5px 8px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
	font-size: 13px;
	color: #1d2327;
}

/* --- Analyspanel --- */

.rit-analysis {
	margin-top: 20px;
}

.rit-analysis-section {
	margin-bottom: 18px;
	padding: 14px 16px;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 6px;
}

.rit-analysis-section h3 {
	margin: 0 0 10px;
	font-size: 14px;
}

.rit-analysis-empty {
	padding: 14px 16px;
	background: #f6f7f7;
	border: 1px dashed #c3c4c7;
	border-radius: 6px;
	color: #646970;
	font-size: 13px;
}

.rit-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
	margin-bottom: 10px;
}

.rit-table th,
.rit-table td {
	padding: 6px 8px;
	text-align: left;
	border-bottom: 1px solid #f0f0f1;
}

.rit-table th {
	font-weight: 600;
	color: #1d2327;
	border-bottom: 2px solid #dcdcde;
	font-size: 12px;
}

.rit-table tr.rit-bad td {
	background: #fcf3f3;
}

.rit-list {
	margin: 0 0 10px;
	padding-left: 18px;
	font-size: 13px;
}

.rit-list li {
	margin-bottom: 4px;
}

.rit-ok {
	color: #00632a;
	font-size: 13px;
	margin: 0;
}

.rit-bad {
	color: #8a2424;
}

.rit-warn {
	color: #8a6420;
}

/* 3.156: bildverifiering – larmpunkterna som kameran verifierar. */
.rit-good {
	color: #1a6b2f;
}

.rit-muted {
	color: #646970;
	font-size: 12px;
	font-weight: 400;
}

.rit-dori-dot {
	display: inline-block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	margin-right: 5px;
	vertical-align: middle;
}

/* fixed, inte absolute (rättat 2.209.0): menyn placeras med
 * clientX/clientY, som räknas från fönstret. Med absolute hamnade den
 * fel så fort sidan var nedrullad. */
.rit-context-menu {
	position: fixed;
	z-index: 1000;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	min-width: 160px;
	padding: 4px 0;
}

.rit-context-menu-title {
	padding: 6px 12px;
	font-size: 12px;
	font-weight: 600;
	color: #646970;
	border-bottom: 1px solid #f0f0f1;
	margin-bottom: 2px;
}

.rit-context-menu-item {
	display: block;
	width: 100%;
	text-align: left;
	padding: 8px 12px;
	border: none;
	background: none;
	cursor: pointer;
	font-size: 14px;
}

.rit-context-menu-item:hover {
	background: #f0f0f1;
}

.rit-context-menu-item.rit-danger {
	color: #d63638;
}

/* Racksymbolens meny (2.219.0) */
.rit-context-menu-sub {
	padding: 6px 12px 2px;
	font-size: 12px;
	color: #646970;
}
.rit-context-menu-note {
	padding: 4px 12px 6px;
	font-size: 12px;
	color: #646970;
	max-width: 240px;
}
.rit-context-menu-check {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 5px 12px;
}
.rit-context-menu-check input { margin: 0; }

.rit-modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* display: flex ovan vinner annars över webbläsarens inbyggda
 * [hidden] { display: none }, så modalen skulle synas och fånga klick
 * trots hidden-attributet – måste vara explicit och läggas EFTER. */
.rit-modal-overlay[hidden] {
	display: none;
}

.rit-modal {
	background: #fff;
	border-radius: 6px;
	padding: 20px;
	width: 480px;
	max-width: 90vw;
	max-height: 80vh;
	overflow-y: auto;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
}

.rit-modal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 4px;
}

.rit-modal-header h3 {
	margin: 0;
}

.rit-modal-close {
	background: none;
	border: none;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	color: #646970;
	padding: 4px;
}

.rit-modal-close:hover {
	color: #1d2327;
}

/* Kameramodell-trädväljaren: märke (nivå 1, fetstil, klickbar för att
 * expandera/kollapsa) → typ (nivå 2, indragen) → modell (nivå 3,
 * ytterligare indragen, den faktiska klickbara raden som väljer
 * modellen och stänger modalen). */
.rit-camera-picker-tree {
	margin-top: 8px;
}

.rit-picker-brand {
	border-bottom: 1px solid #f0f0f1;
}

.rit-picker-brand-header {
	display: flex;
	align-items: center;
	gap: 6px;
	width: 100%;
	padding: 8px 4px;
	background: none;
	border: none;
	text-align: left;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
}

.rit-picker-brand-header:hover {
	background: #f6f7f7;
}

.rit-picker-brand-toggle {
	display: inline-block;
	width: 12px;
	transition: transform 0.1s ease;
}

.rit-picker-brand.is-open .rit-picker-brand-toggle {
	transform: rotate(90deg);
}

.rit-picker-brand-body {
	padding-left: 18px;
}

.rit-picker-brand-body[hidden] {
	display: none;
}

.rit-picker-type-label {
	font-size: 12px;
	font-weight: 600;
	color: #646970;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 6px 4px 2px;
}

.rit-picker-model {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 8px 10px;
	margin: 2px 0;
	background: none;
	border: 1px solid transparent;
	border-radius: 4px;
	text-align: left;
	cursor: pointer;
	font-size: 13px;
}

.rit-picker-model:hover {
	background: #f0f6fc;
	border-color: #c5d9ed;
}

.rit-picker-model-meta {
	color: #646970;
	font-size: 12px;
}

/* PDF-databladslänken i kameraträdväljaren (se renderCameraPickerTree()
 * i frontend.js) – en liten, diskret länk inuti modellraden. Måste
 * fortfarande vara tydligt klickbar (padding runt ikonen) trots att
 * hela raden också är klickbar (för att välja modellen) – e.target.
 * closest()-kontrollen i click-lyssnaren skiljer på de två, men en för
 * liten klickyta hade ändå gjort länken svår att träffa exakt.
 */
.rit-picker-model-datasheet {
	display: inline-block;
	padding: 2px 4px;
	margin-left: 4px;
	text-decoration: none;
	border-radius: 3px;
}

.rit-picker-model-datasheet:hover {
	background: #dcdcde;
}

.rit-drawing-list {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-top: 10px;
}

.rit-drawing-item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	padding: 8px 10px;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
	cursor: pointer;
	text-align: left;
	width: 100%;
}

.rit-drawing-item:hover {
	background: #f0f7f1;
	border-color: #00a32a;
}

.rit-drawing-item-name {
	font-weight: 600;
	color: #1d2327;
	font-size: 13px;
}

.rit-drawing-item-meta {
	font-size: 11px;
	color: #646970;
}

.rit-zone-status {
	font-weight: 600;
	font-size: 12px;
}

.rit-zone-status-full {
	color: #00632a;
}

.rit-zone-status-partial {
	color: #8a6420;
}

.rit-zone-status-none {
	color: #d63638;
}

.rit-zone-status-unanalyzed {
	color: #646970;
	font-style: italic;
}

.rit-floating-panel {
	position: fixed;
	top: 140px;
	right: 20px;
	width: 320px;
	max-height: 70vh;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 6px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
	z-index: 1500; /* under kontextmeny/modaler (2000+) men över canvasen */
	display: flex;
	flex-direction: column;
}

/* 3D-vyn behöver plats för två canvas-vyer sida vid sida (rummet + POV)
 * och kontrollreglagen ovanför dem – 320px (standardbredden) skulle
 * tvinga fram två rader smala, klämda canvasar. Startposition längre
 * till vänster än standardpanelen så den inte öppnas rakt ovanpå
 * zonstatuspanelen om båda används samtidigt. */
.rit-floating-panel-wide {
	width: 1240px;
	max-width: calc(100vw - 40px);
	right: auto;
	left: 20px;
}

/* Samma display/[hidden]-fälla som .rit-modal-overlay tidigare gick i –
 * display: flex ovan vinner annars över webbläsarens inbyggda
 * [hidden] { display: none }, så panelen syns trots hidden-attributet. */
.rit-floating-panel[hidden] {
	display: none;
}

.rit-floating-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 10px;
	background: #f0f0f1;
	border-bottom: 1px solid #dcdcde;
	border-radius: 6px 6px 0 0;
	font-weight: 600;
	cursor: move;
	user-select: none;
}

.rit-floating-panel-body {
	padding: 10px 12px;
	overflow-y: auto;
}

.rit-my-camera-form {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 10px;
	margin-bottom: 10px;
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	font-size: 12px;
}

.rit-my-camera-form label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.rit-my-camera-form input,
.rit-my-camera-form select {
	width: 110px;
	padding: 3px 6px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
}

.rit-my-camera-form-actions {
	display: flex;
	gap: 8px;
	margin-top: 4px;
}

.rit-my-camera-save-btn {
	padding: 6px 12px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

.rit-my-camera-cancel-btn {
	padding: 6px 12px;
	border: 1px solid #c3c4c7;
	background: #fff;
	border-radius: 4px;
	cursor: pointer;
}

.rit-my-camera-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 8px 10px;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	margin-bottom: 4px;
	font-size: 12px;
}

.rit-my-camera-actions {
	display: flex;
	gap: 10px;
	margin-top: 4px;
}

.rit-my-camera-actions button {
	background: none;
	border: none;
	padding: 0;
	font-size: 12px;
	text-decoration: underline;
	cursor: pointer;
	color: #2271b1;
}

.rit-my-camera-actions button.rit-danger {
	color: #d63638;
}

.rit-mc-res-custom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	margin: -6px 0 2px;
	padding-left: 4px;
}

/* Se motsvarande kommentar i camera-catalog-page.css. */
.rit-mc-res-custom[hidden] {
	display: none;
}

.rit-mc-res-custom-label {
	font-size: 11px;
	color: #646970;
}

.rit-mc-res-custom-fields {
	display: flex;
	align-items: center;
	gap: 4px;
	white-space: nowrap;
}

.rit-mc-res-custom input {
	width: 56px !important;
	text-align: center;
}

.rit-mc-poe-preview {
	font-size: 11px;
}

.rit-mc-product-link {
	display: block;
	color: #2271b1;
}

.rit-datasheet-upload {
	margin-bottom: 10px;
}

.rit-datasheet-upload-btn {
	display: inline-block;
	padding: 6px 12px;
	background: #fff;
	border: 1px solid #2271b1;
	color: #2271b1;
	border-radius: 4px;
	cursor: pointer;
	font-size: 12px;
	font-weight: 600;
}

.rit-datasheet-upload-btn:hover {
	background: #f0f6fc;
}

.rit-datasheet-upload .rit-props-hint {
	margin-top: 4px;
	font-size: 11px;
}

.rit-datasheet-upload-btn.is-loading {
	opacity: 0.7;
	cursor: default;
	pointer-events: none;
}

.rit-datasheet-status {
	display: flex;
	align-items: center;
	gap: 5px;
	margin: 6px 0 0;
	padding: 6px 8px;
	border-radius: 4px;
	font-size: 11px;
}

.rit-datasheet-status[hidden] {
	display: none;
}

.rit-datasheet-status-loading {
	background: #f0f0f1;
	color: #3c434a;
}

.rit-datasheet-status-success {
	background: #edfaef;
	color: #00632a;
}

.rit-datasheet-status-error {
	background: #fcf0f1;
	color: #d63638;
}

.rit-datasheet-spinner {
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 2px solid rgba(60, 67, 74, 0.25);
	border-top-color: #3c434a;
	border-radius: 50%;
	animation: rit-datasheet-spin 0.7s linear infinite;
	flex-shrink: 0;
}

@keyframes rit-datasheet-spin {
	to {
		transform: rotate(360deg);
	}
}

.rit-datasheet-suggestion {
	padding: 10px;
	margin-bottom: 10px;
	background: #fef8ee;
	border: 1px solid #e8c789;
	border-radius: 6px;
}

/* Se motsvarande kommentar i camera-catalog-page.css. */
.rit-datasheet-suggestion[hidden] {
	display: none;
}

.rit-datasheet-suggestion h3 {
	margin: 0 0 6px;
	font-size: 13px;
}

.rit-datasheet-suggestion-fields {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 8px 0;
}

.rit-datasheet-field-btn {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	padding: 5px 8px;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	cursor: pointer;
	font-size: 11px;
	text-align: left;
}

.rit-datasheet-field-btn:hover {
	border-color: #2271b1;
	background: #f0f6fc;
}

.rit-datasheet-field-btn-label {
	color: #646970;
	font-size: 10px;
}

.rit-datasheet-field-btn-value {
	font-weight: 600;
	color: #1d2327;
}

.rit-datasheet-field-btn.is-applied {
	border-color: #00a32a;
	background: #edfaef;
}

.rit-datasheet-field-btn.is-applied .rit-datasheet-field-btn-value::after {
	content: " ✔";
	color: #00a32a;
}

#rit-placed-cameras-list .rit-my-camera-item {
	gap: 6px;
}

#rit-placed-cameras-list .rit-props-field {
	margin: 0;
	font-size: 11px;
}

#rit-placed-cameras-list .rit-props-field select {
	width: 100%;
	margin-top: 2px;
}

.rit-canvas-size-custom {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 4px 12px 8px;
}

.rit-canvas-size-custom[hidden] {
	display: none;
}

.rit-canvas-size-custom input {
	width: 70px;
	padding: 3px 6px;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
}

.rit-canvas-size-apply-btn {
	padding: 4px 10px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

/* Helskärmsknappen läggs sist i .rit-menubar (display:flex) – margin-
 * left: auto knuffar den till höger kant utan att röra ordningen på
 * övriga menyer (Fil/Redigera/Skapa/Visa/AI förblir vänsterjusterade). */
/* Lås layout-brytaren ligger direkt till vänster om helskärmsknappen
 * (som har margin-left: auto och därför redan knuffas till höger kant),
 * samma mörka tema som resten av .rit-menubar. */
.rit-lock-toggle {
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 6px 10px;
	border: 1px solid #4f5a61;
	border-radius: 4px;
	color: #f0f0f1;
	cursor: pointer;
	font-size: 13px;
	user-select: none;
	white-space: nowrap;
}

.rit-lock-toggle:has( input:checked ),
.rit-lock-toggle.is-active {
	background: #d63638;
	border-color: #d63638;
}

.rit-fullscreen-btn {
	margin-left: auto;
	padding: 6px 10px;
	background: transparent;
	border: 1px solid #4f5a61;
	border-radius: 4px;
	color: #f0f0f1;
	cursor: pointer;
	font-size: 16px;
	line-height: 1;
}

.rit-fullscreen-btn:hover,
.rit-fullscreen-btn.is-active {
	background: #4f5a61;
}

/* Helskärmsläge (Fullscreen API på #rit-app): appen ska fylla ut hela
 * skärmen och tillåta skrollning om canvasen (t.ex. 4K-storlek) är
 * större än den synliga ytan – annars skulle bara den övre vänstra
 * delen av en stor ritning synas med resten avklippt utanför skärmen.
 * :fullscreen är standardselector, :-webkit-full-screen för äldre
 * Safari-versioner som ännu inte stödjer standardnotationen. */
#rit-app:fullscreen,
#rit-app:-webkit-full-screen {
	background: #fff;
	overflow: auto;
	padding: 10px;
	box-sizing: border-box;
}


/* ATEX-märkning i kameraväljaren. Orange och versal – certifieringen
 * avgör om kameran över huvud taget får monteras på platsen, så den
 * ska gå att uppfatta i en snabb blick genom listan. */
.rit-atex-badge {
	display: inline-block;
	padding: 1px 5px;
	border-radius: 3px;
	background: #fdf0e6;
	border: 1px solid #d4622c;
	color: #a34a1f;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.04em;
	vertical-align: middle;
}

/* 3.074: IP-klassen i kameraväljaren – blå för utomhus, grå för inomhus. */
.rit-ip-badge {
	display: inline-block;
	padding: 1px 5px;
	border-radius: 3px;
	background: #e8f1fb;
	border: 1px solid #2c6fb7;
	color: #1d4f86;
	font-size: 10px;
	font-weight: 700;
	vertical-align: middle;
}
.rit-ip-badge.is-inne {
	background: #f0f0f1;
	border-color: #8c8f94;
	color: #50575e;
}

.rit-thermal-badge {
	display: inline-block;
	padding: 1px 5px;
	border-radius: 3px;
	background: #eef4fb;
	border: 1px solid #2271b1;
	color: #135e96;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.04em;
	vertical-align: middle;
}

/* -- Favoriter och egna priser i kameraväljaren --------------------- */

.rit-picker-star {
	cursor: pointer;
	font-size: 15px;
	line-height: 1;
	color: #b0b6bd;
	margin-right: 6px;
	/* Egen klickyta: stjärnan sitter inuti knappen som väljer modellen,
	 * och en för liten yta gör den svår att träffa utan att av misstag
	 * placera kameran. */
	padding: 2px 3px;
	border-radius: 3px;
}
.rit-picker-star:hover { background: #e8eaed; color: #6b7076; }
.rit-picker-star.is-favourite { color: #e6a700; }
.rit-picker-star.is-favourite:hover { color: #c48f00; }

/* Favoritgruppen högst upp – markerad så den skiljer sig från
 * märkesgrupperna under. */
.rit-picker-favourites {
	border-bottom: 2px solid #e6a700;
	margin-bottom: 6px;
}
.rit-picker-favourites .rit-picker-brand-header { color: #8a6d00; }

/* Luft mellan modellnamnet och FOV-uppgiften – utan den satt de ihop
 * ("P3268-LVE100°×55°") eftersom raden är en flex-container utan gap. */
.rit-picker-model > span + span {
	margin-left: 10px;
}

.rit-picker-price {
	margin-left: auto;
	padding-left: 10px;
	font-size: 12px;
	color: #646970;
	white-space: nowrap;
}
.rit-picker-price input {
	width: 68px;
	font-size: 12px;
	padding: 1px 4px;
	text-align: right;
}

.rit-picker-ai-toggle {
	display: block;
	margin: 10px 0 4px;
	font-size: 13px;
}

.rit-warn-list {
	margin: 4px 0 10px 18px;
	padding: 0;
	font-size: 13px;
	color: #8a2b2b;
}

/* Checklistan i analyssektionen – punkter verktyget inte kan räkna på
 * men som avgör om analysen fungerar i verkligheten. */
.rit-analytics-checklist {
	margin: 4px 0 0 18px;
	padding: 0;
	font-size: 12px;
	line-height: 1.5;
}

/* Bladväxlaren i verktygsraden. Visas bara när projektet har flera
 * blad – se renderSheetList(). */
.rit-sheet-list {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px;
	margin-left: 8px;
}

.rit-sheet-btn {
	padding: 3px 9px;
	font-size: 12px;
	border: 1px solid #4a5568;
	background: transparent;
	color: #cbd5e0;
	border-radius: 3px;
	cursor: pointer;
}

.rit-sheet-btn:hover { background: #2d3748; }

.rit-sheet-btn.is-current {
	background: #2271b1;
	border-color: #2271b1;
	color: #fff;
	font-weight: 600;
}

/* Sök- och filterrad i kameraväljaren. Med hundratals modeller är den
 * snabbaste vägen till rätt kamera att skriva några bokstäver, inte
 * att bläddra i trädet. */
.rit-picker-filter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 10px 0;
}

.rit-picker-search {
	flex: 1 1 200px;
	min-width: 160px;
	padding: 6px 10px;
	font-size: 14px;
}

.rit-picker-fav-only {
	font-size: 13px;
	white-space: nowrap;
}

.rit-picker-count {
	font-size: 12px;
	color: #646970;
	margin-left: auto;
	white-space: nowrap;
}

/* Kopplingsschema: en tabell per switch. */
.rit-patch-switch {
	margin: 14px 0 6px;
	font-size: 13px;
	font-weight: 700;
}

.rit-patch-switch:first-child {
	margin-top: 0;
}

/* Lediga portar dämpas men döljs inte – utrymmet för utbyggnad är
 * en av de uppgifter man faktiskt läser schemat för. */
.rit-patch-table tr.rit-muted td {
	color: #8a8f94;
}

/* Rackvy. */
.rit-rack-wrap {
	overflow-x: auto;
	padding: 4px 0 8px;
}

.rit-rack-key {
	display: inline-block;
	width: 11px;
	height: 11px;
	border-radius: 2px;
	margin: 0 3px 0 10px;
	vertical-align: -1px;
}

.rit-rack-key:first-child {
	margin-left: 0;
}

/* HANDBOKEN – kapitelnavigering till vänster, innehåll till höger. */
.rit-help {
	max-width: 1100px;
	width: 94vw;
	max-height: 90vh;
	display: flex;
	flex-direction: column;
}

.rit-help-body {
	display: flex;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.rit-help-nav {
	flex: 0 0 210px;
	padding: 16px 12px;
	border-right: 1px solid rgba(18, 24, 31, 0.1);
	overflow-y: auto;
	background: #f6f7f7;
}

.rit-help-nav a {
	display: block;
	padding: 7px 10px;
	margin-bottom: 2px;
	border-radius: 4px;
	color: #1E3A5F;
	text-decoration: none;
	font-size: 13px;
}

.rit-help-nav a:hover {
	background: #e8eef5;
}

.rit-help-content {
	flex: 1 1 auto;
	padding: 20px 28px 40px;
	overflow-y: auto;
	scroll-behavior: smooth;
	font-size: 14px;
	line-height: 1.55;
	color: #12181F;
}

.rit-help-content section {
	margin-bottom: 40px;
	padding-top: 6px;
}

.rit-help-content h3 {
	margin: 0 0 12px;
	padding-bottom: 6px;
	border-bottom: 2px solid #1E3A5F;
	font-size: 18px;
}

.rit-help-content ul,
.rit-help-content ol {
	padding-left: 22px;
}

.rit-help-content li {
	margin-bottom: 6px;
}

/* Skärmbilder: full bredd med tunn ram, så de läses som illustration
 * och inte som en del av det riktiga gränssnittet bakom modalen. */
.rit-help-img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 12px 0 16px;
	border: 1px solid rgba(18, 24, 31, 0.15);
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.rit-help-tip {
	padding: 10px 14px;
	background: #fdf8e8;
	border-left: 3px solid #e6a700;
	border-radius: 0 4px 4px 0;
}

.rit-help-keys {
	border-collapse: collapse;
	width: 100%;
}

.rit-help-keys td {
	padding: 7px 10px;
	border-bottom: 1px solid rgba(18, 24, 31, 0.08);
	vertical-align: top;
}

.rit-help-keys td:first-child {
	width: 150px;
	white-space: nowrap;
}

.rit-help-keys kbd {
	display: inline-block;
	padding: 2px 7px;
	border: 1px solid #c3c4c7;
	border-bottom-width: 2px;
	border-radius: 4px;
	background: #f6f7f7;
	font-family: inherit;
	font-size: 12px;
}

@media (max-width: 700px) {
	.rit-help-body { flex-direction: column; }
	.rit-help-nav { flex: 0 0 auto; border-right: none; border-bottom: 1px solid rgba(18, 24, 31, 0.1); }
	.rit-help-nav a { display: inline-block; }
}

/* BETA-märkning på AI-menyn. Liten och dämpad – den ska sänka
 * förväntningarna, inte dra blicken från menyn. */
.rit-beta-badge {
	display: inline-block;
	margin-left: 4px;
	padding: 1px 5px;
	border-radius: 3px;
	background: #e6a700;
	color: #12181F;
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.06em;
	vertical-align: 1px;
}

/* Tredjepartstabellen i handboken – samma stil som tangenttabellen,
 * men fyra kolumner och länkar. */
.rit-help-thirdparty th { text-align: left; padding: 4px 8px; border-bottom: 1px solid #ccc; }
.rit-help-thirdparty td { vertical-align: top; }
.rit-help-thirdparty a { text-decoration: underline; }

/* Underrubriker i handboken (nya avsnitt inom ett kapitel). */
.rit-help-content h4 { margin: 18px 0 6px; font-size: 14px; }
.rit-help-content h4 .rit-beta-badge { vertical-align: 2px; }

/* Underrubrik i egenskapspanelen (t.ex. "Nätverk" på en kamera). */
.rit-props-subhead {
	margin: 14px 0 4px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: #646970;
}

/* --- Arbetsyta: ritning + sidospalt ------------------------------- */

.rit-workspace {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.rit-canvas-col {
	flex: 1 1 auto;
	min-width: 0;          /* låter canvas krympa i stället för att spränga raden */
}

.rit-side {
	flex: 0 0 330px;
	max-width: 330px;
	max-height: 820px;
	overflow-y: auto;
	padding-right: 4px;
}

/* Under 1100 px finns inte plats för två spalter – panelerna hamnar
 * under ritningen igen, i full bredd. */
@media ( max-width: 1100px ) {
	.rit-workspace { display: block; }
	.rit-side { max-width: none; max-height: none; overflow: visible; margin-top: 16px; }
}

.rit-side .rit-analysis { margin-top: 0; }
.rit-side .rit-props-panel,
.rit-side .rit-cable-summary { border-top: 1px solid #b8e6c1; margin-bottom: 12px; }

/* --- Hopfällbara paneler ------------------------------------------ */

.rit-analysis-section { margin-bottom: 8px; padding: 0; overflow: hidden; }

.rit-sec-head {
	display: flex;
	align-items: center;
	margin: 0;
	font-size: 13px;
}

.rit-sec-toggle {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 9px 10px;
	background: none;
	border: 0;
	font: inherit;
	font-weight: 600;
	color: #1d2327;
	text-align: left;
	cursor: pointer;
}

.rit-sec-toggle:hover { background: #f6f7f7; }

.rit-sec-caret {
	flex: 0 0 auto;
	width: 0;
	height: 0;
	border-left: 5px solid #646970;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	transition: transform 0.12s ease;
}

.rit-analysis-section.is-open .rit-sec-caret { transform: rotate(90deg); }

.rit-sec-pop {
	flex: 0 0 auto;
	margin-right: 6px;
	padding: 2px 7px;
	background: none;
	border: 1px solid transparent;
	border-radius: 4px;
	color: #646970;
	font-size: 13px;
	line-height: 1.4;
	cursor: pointer;
}

.rit-sec-pop:hover { border-color: #c3c4c7; background: #fff; color: #1d2327; }

.rit-sec-body {
	padding: 0 12px 12px;
	border-top: 1px solid #f0f0f1;
}

/* Tabeller i en 330 px spalt: låt dem rulla i sidled i stället för att
 * tvinga ut spalten på bredden. I det stora fönstret behövs det inte. */
.rit-side .rit-sec-body { overflow-x: auto; }
.rit-side .rit-sec-body table { min-width: 100%; }

/* --- Utfällt fönster ---------------------------------------------- */

.rit-side-overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba( 0, 0, 0, 0.45 );
}

.rit-side-overlay[hidden] { display: none; }

.rit-side-window {
	display: flex;
	flex-direction: column;
	width: min( 1100px, 100% );
	max-height: 100%;
	background: #fff;
	border-radius: 6px;
	box-shadow: 0 8px 30px rgba( 0, 0, 0, 0.3 );
}

/* Helskärmsläget: fönstret fyller hela rutan. */
.rit-side-overlay.is-max { padding: 0; }
.rit-side-overlay.is-max .rit-side-window { width: 100%; height: 100%; max-height: none; border-radius: 0; }

.rit-side-window-head {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px;
	border-bottom: 1px solid #dcdcde;
}

.rit-side-window-head h3 { flex: 1 1 auto; margin: 0; font-size: 15px; }

.rit-side-window-body {
	flex: 1 1 auto;
	overflow: auto;
	padding: 16px;
}

/* Ingen bakgrundsrullning medan fönstret är öppet. */
body.rit-side-open { overflow: hidden; }

/* Redigera-länk i analysen: liten penna som markerar objektet och
 * öppnar egenskapspanelen. Dämpad tills raden hovras, så listorna
 * fortfarande går att läsa. */
.rit-edit-link {
	margin-left: 4px;
	padding: 0 4px;
	background: none;
	border: 1px solid transparent;
	border-radius: 3px;
	color: #a7aaad;
	font-size: 11px;
	line-height: 1.4;
	cursor: pointer;
}

tr:hover .rit-edit-link,
li:hover .rit-edit-link,
.rit-edit-link:focus { color: #2271b1; border-color: #c3c4c7; }
.rit-edit-link:hover { color: #fff; background: #2271b1; border-color: #2271b1; }

/* Zoomreglaget ovanför ritningen. */
.rit-canvas-tools { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.rit-canvas-tools .button { min-width: 30px; }
.rit-zoom-level { min-width: 52px; text-align: center; font-size: 12px; color: #646970; }
.rit-canvas-tools-hint { margin-left: auto; font-size: 11px; color: #8c8f94; }
#rit-canvas.is-panning { cursor: grab; }

/* Snabbtangentlistan (visas med ? eller ⌨-knappen). */
.rit-shortcuts {
	margin: 0 0 8px;
	padding: 10px 14px;
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	border-radius: 6px;
	font-size: 12px;
}
.rit-shortcuts h4 { margin: 0 0 6px; font-size: 13px; }
.rit-shortcuts ul { display: grid; grid-template-columns: repeat( auto-fit, minmax( 230px, 1fr ) ); gap: 2px 18px; margin: 0; padding: 0; list-style: none; }
.rit-shortcuts kbd {
	display: inline-block;
	min-width: 16px;
	padding: 1px 5px;
	background: #fff;
	border: 1px solid #c3c4c7;
	border-bottom-width: 2px;
	border-radius: 3px;
	font-family: inherit;
	font-size: 11px;
}

/* Lagerknappar och snap-rutan ovanför ritningen. */
.rit-layers { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-bottom: 6px; font-size: 12px; color: #1d2327; }
.rit-layers-title { font-weight: 600; }
.rit-layers label { display: inline-flex; align-items: center; gap: 4px; }
.rit-layers-hint { margin-left: auto; font-size: 11px; color: #8c8f94; }
.rit-snap-label { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: #1d2327; }

/* Sökrutan i listan över placerade kameror. */
.rit-placed-search { width: 100%; margin: 0 0 8px; }

/* Kryssruta i egenskapspanelen och underrubrik i en analysdel. */
.rit-props-check { display: flex; align-items: center; gap: 6px; }
.rit-sub { margin: 12px 0 4px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; color: #646970; }

/* --- Pekskärm och små skärmar ------------------------------------ */

/* Webbläsaren ska inte scrolla eller zooma sidan när man ritar. */
#rit-canvas { touch-action: none; }
/* 3.093: dubbelklick i ritytan (avsluta vägg/zon) markerade all text i sidopanelen. */
.rit-canvas-col, #rit-canvas { user-select: none; -webkit-user-select: none; }

/* Canvas fyller spalten; höjden sätts i JS efter skärmen. */
.rit-canvas-col #rit-canvas { width: 100%; height: auto; }

body.rit-touch .rit-tool-btn,
body.rit-touch .rit-mode-btn,
body.rit-touch .rit-canvas-tools .button {
	min-height: 40px;          /* tummen behöver yta */
	padding: 8px 12px;
}

/* Penn-länken i analysen syns bara vid hovring på mus – på touch
 * finns ingen hovring, så den är alltid synlig. */
body.rit-touch .rit-edit-link { color: #2271b1; border-color: #c3c4c7; }

@media ( max-width: 782px ) {
	/* Menyraden radbryter i stället för att skära av knappar. */
	.rit-menubar, .rit-toolbar { flex-wrap: wrap; gap: 6px; }

	/* Zoomreglaget: knapparna först, hjälptexten bort. */
	.rit-canvas-tools { flex-wrap: wrap; }
	.rit-canvas-tools-hint, .rit-layers-hint { display: none; }

	/* Lagerknapparna i två kolumner i stället för en rad. */
	.rit-layers { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; }

	/* Panelerna: full bredd under ritningen, inget eget rullfält. */
	.rit-side { max-width: none; max-height: none; overflow: visible; }

	/* Egenskapsfälten under varandra – två kolumner blir för smalt. */
	.rit-props-field { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; }
	.rit-props-field input, .rit-props-field select { width: 100%; }

	/* Utfällt fönster fyller skärmen på telefon. */
	.rit-side-overlay { padding: 0; }
	.rit-side-window { width: 100%; height: 100%; max-height: none; border-radius: 0; }

	/* Tabeller i analysen rullar i sidled i stället för att spränga sidan. */
	.rit-analysis .rit-table { display: block; overflow-x: auto; white-space: nowrap; }

	.rit-shortcuts { display: none; }   /* tangentbord saknas ändå */
}

/* Gesthjälpen visas bara på pekskärm. */
.rit-touch-hint { display: none; }
body.rit-touch .rit-touch-hint { display: block; width: 100%; font-size: 11px; color: #8c8f94; }

/* Listväljaren i kameraväljaren. */
.rit-picker-list-pick { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; }
.rit-picker-list-pick select { max-width: 200px; }
.rit-picker-listbox { margin-right: 6px; transform: scale( 1.2 ); }

/* Checklistan för bilaga A: kryssrutorna ska vara lätta att träffa. */
.rit-annexa-list { list-style: none; margin: 8px 0; padding: 0; }
.rit-annexa-list li { margin-bottom: 6px; }
.rit-annexa-list label { display: flex; align-items: flex-start; gap: 8px; cursor: pointer; }
.rit-annexa-list input { margin-top: 2px; flex: 0 0 auto; }

/* Förhandsvisning av handlingen: PDF:en ska fylla fönstret. */
.rit-pdf-window { width: min( 1200px, 100% ); height: 92vh; }
.rit-pdf-frame { flex: 1 1 auto; width: 100%; border: 0; background: #525659; }
.rit-side-window-head .description { flex: 0 1 auto; margin-right: auto; }
@media ( max-width: 782px ) {
	.rit-pdf-window { width: 100%; height: 100%; }
}

/* --- Maximerat läge ("helskärm") ------------------------------------
 * Ersätter Fullscreen API:t, som webbläsaren lämnar så fort en
 * dialogruta visas – och verktyget frågar med dialogrutor (zonens
 * namn, sträckans längd, portnummer). Appen fyller i stället fönstret
 * med position: fixed. Flikraden syns kvar; F11 tar bort den också. */
body.rit-maximized {
	overflow: hidden;
}

body.rit-maximized #rit-app {
	position: fixed;
	inset: 0;
	/*
	 * max-width: none är det som gör det till helskärm. #rit-app har
	 * annars max-width: 1240px för den vanliga sidvyn, och den gränsen
	 * gäller ÄVEN när elementet ligger fast – så det täckte exakt 1240
	 * px och sidan syntes till höger om det.
	 */
	width: 100vw;
	max-width: none;
	height: 100vh;
	z-index: 99990;          /* över WP:s adminbar (99999 är dess z) – men under våra egna overlays */
	margin: 0;
	padding: 10px;
	box-sizing: border-box;
	background: #fff;
	overflow: auto;
}

/* Sidospalten och ritytan får använda hela bredden i helskärm. */
body.rit-maximized .rit-workspace {
	max-width: none;
}
body.rit-maximized .rit-side {
	flex-basis: 380px;
	max-width: 380px;
	max-height: none;
}

/* Adminbaren ska inte ligga över verktyget. */
body.rit-maximized #wpadminbar {
	display: none;
}

/* Våra egna fönster (förhandsgranskning, historik, utfälld panel)
 * måste ligga över den maximerade appen. */
body.rit-maximized .rit-side-overlay,
body.rit-maximized .rit-modal-overlay {
	z-index: 100000;
}

/* Zoomreglaget i egenskapspanelen: reglage och siffra sida vid sida. */
.rit-props-zoom { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.rit-props-zoom input[type="range"] { flex: 1 1 120px; min-width: 100px; }

/* PTZ-förinställningar i egenskapspanelen och analysens kedjerader. */
.rit-preset {
	margin: 6px 0;
	padding: 8px 10px;
	border: 1px solid #d9c8ee;
	border-left: 3px solid #7b2cbf;
	border-radius: 4px;
	background: #faf6ff;
}
.rit-preset .rit-props-field { margin: 3px 0; }
.rit-preset .rit-tool-btn { margin: 4px 6px 0 0; }
.rit-ptz-row { padding: 6px 0; border-bottom: 1px solid #f0f0f1; }
.rit-ptz-row:last-of-type { border-bottom: 0; }
.rit-preset-patrol { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 4px 0; }

/* Larmsimuleringens uppspelningsrad. */
.rit-sim-panel {
	margin: 8px 0 12px;
	padding: 10px 12px;
	background: #fdf6f6;
	border: 1px solid #f0c6c6;
	border-radius: 6px;
}
.rit-sim-controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rit-sim-controls input[type="range"] { flex: 1 1 200px; min-width: 140px; }
.rit-sim-now { margin-top: 8px; font-size: 13px; line-height: 1.8; }
.rit-sim-now span { margin-right: 4px; }
@media ( max-width: 782px ) {
	.rit-sim-controls { gap: 8px; }
	.rit-sim-controls .rit-tool-btn { min-height: 40px; min-width: 44px; }
}
.rit-sim-events li { margin-bottom: 3px; }

/* Motljus: norr och ort direkt i analysavsnittet (2.216.0). */
.rit-motljus-inst {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 8px 12px;
	margin: 8px 0 10px;
	padding: 8px 10px;
	background: #f6f7f7;
	border-radius: 6px;
}
.rit-motljus-inst label {
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: 12px;
	color: #50575e;
}
.rit-motljus-inst input[type="number"] {
	width: 7em;
}

/* Handboken: flikar för enkelt och avancerat läge, bilder med bildtext (2.219.5) */
.rit-help-flikar {
	display: flex;
	gap: 4px;
	padding: 8px 16px 0;
	border-bottom: 1px solid rgba(18, 24, 31, 0.12);
	background: #fff;
	flex: 0 0 auto;
}
.rit-help-flik {
	padding: 8px 16px;
	border: 1px solid transparent;
	border-bottom: none;
	border-radius: 6px 6px 0 0;
	background: none;
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	color: #50575e;
	cursor: pointer;
	margin-bottom: -1px;
}
.rit-help-flik:hover { color: #1E3A5F; }
.rit-help-flik.is-vald {
	color: #1E3A5F;
	background: #fff;
	border-color: rgba(18, 24, 31, 0.12);
	border-bottom: 1px solid #fff;
}
.rit-help-body[hidden] { display: none; }
.rit-help-fig { margin: 12px 0 18px; }
.rit-help-fig .rit-help-img { margin: 0 0 4px; }
.rit-help-fig figcaption { font-size: 12px; color: #646970; }
/* Smala bilder (paneler, menyer) ska inte blåsas upp. */
.rit-help-content img.rit-help-img { width: auto; }
@media ( max-width: 700px ) {
	.rit-help-flik { padding: 8px 10px; font-size: 13px; }
}

/* Frågan när AI-förslaget körs igen (2026-09-26). */
.rit-ai-omkorning .rit-modal p { margin: 8px 0; }
.rit-ai-omkorning-info { color: #50575e; font-size: 13px; }
.rit-ai-omkorning-knappar {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 14px;
}
.rit-ai-omkorning-knappar .rit-g-knapp { flex: 1 1 auto; }
body.rit-maximized .rit-ai-omkorning { z-index: 100001; }

/* Zonmallar (2.92.0): krav och praxis i egenskapspanelen. */
.rit-zonmall-rader {
	list-style: none;
	margin: 4px 0 10px;
	padding: 0;
	font-size: 12px;
	line-height: 1.45;
}
.rit-zonmall-rader li {
	margin-bottom: 6px;
}
.rit-niva {
	display: inline-block;
	padding: 0 6px;
	border-radius: 3px;
	font-size: 11px;
	font-weight: 600;
}
.rit-niva-krav {
	background: #fde2e1;
	color: #8a1f11;
}
.rit-niva-praxis {
	background: #fcf3cf;
	color: #6b5200;
}

/* 3.064: PTZ – knappar, simuleringens rad och konfigurationsbladet */
.rit-ptz-knappar { display: flex; flex-wrap: wrap; gap: 4px; margin: 4px 0; }
.rit-ptz-sim { position: absolute; top: 8px; left: 50%; transform: translateX(-50%); z-index: 20; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; max-width: calc(100% - 16px); background: rgba(255,255,255,.96); border: 1px solid #7b2cbf; border-radius: 6px; padding: 4px 8px; font-size: 12px; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.rit-ptz-sim button { border: 1px solid #c3c4c7; background: #f6f7f7; border-radius: 3px; padding: 2px 7px; cursor: pointer; }
.rit-ptz-sim button.is-active { background: #7b2cbf; color: #fff; border-color: #7b2cbf; }
.rit-ptz-sim-text { color: #1d2327; }
.rit-ptz-sim [data-ptz-sim="larm"].is-active { background: #d63638; border-color: #d63638; color: #fff; }
.rit-ptz-sim-hall input { width: 4em; font-size: 12px; }
.rit-ptz-blad { max-width: 860px; width: 100%; max-height: 90vh; overflow: auto; }
.rit-ptz-blad h4 { margin: 14px 0 6px; }
.rit-ptz-tabell { border-collapse: collapse; width: 100%; font-size: 12.5px; }
.rit-ptz-tabell th, .rit-ptz-tabell td { border-bottom: 1px solid #dcdcde; padding: 3px 6px; text-align: left; vertical-align: top; }
.rit-ptz-tabell th { background: #f0f0f1; }
.rit-ptz-karta { display: block; max-width: 100%; max-height: 380px; margin: 10px auto; border: 1px solid #dcdcde; }
.rit-ptz-fel { color: #8a2424; }
.rit-ptz-blad-knappar { margin-top: 12px; text-align: right; }
.rit-canvas-col { position: relative; }

/* 3.065: Höjd och lutning i kamerans egenskaper. */
.rit-hojd-lutning .rit-props-field { display: block; margin: 4px 0; }
.rit-hojd-lutning .rit-props-field input { width: 90px; }

/* 3.066: perimeterguiden (radar, värme, analys och PTZ). */
.rit-perimeter { position: fixed; right: 16px; top: 90px; width: 420px; max-width: calc(100vw - 32px); max-height: calc(100vh - 110px); display: flex; flex-direction: column; background: #fff; border: 1px solid #c3c4c7; border-radius: 8px; box-shadow: 0 8px 28px rgba(0,0,0,.18); z-index: 9990; font-size: 13px; }
.rit-perimeter[hidden] { display: none; }
.rit-pg-huvud { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; border-bottom: 1px solid #e0e0e0; }
.rit-pg-huvud h3 { margin: 0; font-size: 15px; }
.rit-pg-steg { display: flex; flex-wrap: wrap; gap: 4px; list-style: none; margin: 0; padding: 8px 12px 0; }
.rit-pg-steg button { border: 1px solid #c3c4c7; background: #f6f7f7; border-radius: 12px; padding: 2px 8px; cursor: pointer; font-size: 12px; }
.rit-pg-steg button.is-aktiv { background: #12181F; color: #fff; border-color: #12181F; }
.rit-pg-rubrik { margin: 8px 12px 4px; font-size: 14px; }
.rit-pg-innehall { overflow: auto; padding: 0 12px 8px; flex: 1 1 auto; }
.rit-pg-innehall h5 { margin: 12px 0 4px; font-size: 13px; }
.rit-pg-innehall select { max-width: 100%; }
.rit-pg-innehall input[type=number] { width: 60px; }
.rit-pg-fot { display: flex; justify-content: space-between; padding: 8px 12px; border-top: 1px solid #e0e0e0; }
.rit-pg-primar { background: #0a58ca; color: #fff; border-color: #0a58ca; }
.rit-pg-warn { color: #8a6100; }
.rit-pg-bad { color: #b42318; }
.rit-pg-info { color: #50575e; }
.rit-pg-issues { margin: 4px 0 4px 16px; padding: 0; }
.rit-pg-issues li { margin: 2px 0; }
.rit-pg-lista { margin: 4px 0 4px 16px; padding: 0; }
.rit-pg-zon { border-left: 3px solid #e0e0e0; padding: 2px 0 2px 8px; margin: 8px 0; }
.rit-pg-produkter { list-style: none; margin: 4px 0; padding: 0; }
.rit-pg-produkt { display: block; width: 100%; text-align: left; background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 6px; padding: 6px 8px; margin: 3px 0; cursor: pointer; }
.rit-pg-produkt:hover { border-color: #0b7a75; }
.rit-pg-produkt b, .rit-pg-produkt span, .rit-pg-produkt small { display: block; }
.rit-pg-produkt span { color: #3c434a; font-size: 12px; }
.rit-pg-produkt small { color: #646970; font-size: 11px; margin-top: 2px; }
.rit-pg-val summary { cursor: pointer; font-weight: 600; margin-top: 8px; }
.rit-pg-schema { border: 1px solid #e0e0e0; border-radius: 6px; padding: 4px; background: #fff; overflow-x: auto; }
.rit-pg-schema svg { display: block; max-width: none; }
.rit-pg-lank { background: none; border: none; padding: 0; cursor: pointer; color: #0a58ca; text-align: left; }

/* 3.067: åtgärder vid larm i perimeterguiden. */
.rit-pg-kedja .rit-pg-atgard { margin: 4px 0; }
.rit-pg-etikett { display: block; font-weight: 600; font-size: 12px; margin-top: 4px; }
.rit-pg-rad { display: block; margin: 3px 0; font-size: 12px; }
.rit-pg-rad select { max-width: 230px; }

/* 3.068: perimeterguiden som steg i enkla lägets guide */
.rit-perimeter-inline { display: block; font-size: 13px; margin-top: 8px; }
.rit-perimeter-inline .rit-pg-steg { padding: 0 0 4px; }
.rit-perimeter-inline .rit-pg-innehall { overflow: visible; padding: 0; }
.rit-perimeter-inline .rit-pg-fot { padding: 8px 0 0; border-top: 1px solid #e0e0e0; margin-top: 8px; gap: 8px; }
.rit-perimeter-inline .rit-pg-fot .rit-tool-btn:last-child { white-space: normal; text-align: left; }
.rit-perimeter-inline .rit-pg-fot .rit-tool-btn:first-child { white-space: nowrap; }
.rit-pg-ptz { border-top: 1px dashed #c3c4c7; padding-top: 6px; margin-top: 8px; }
.rit-pg-ptz .rit-pg-falt { display: block; margin: 6px 0; }
.rit-pg-ptz .rit-pg-falt select { display: block; width: 100%; margin-top: 2px; }

/* 3.071: perimeterguidens fönster går att flytta (dra i rubrikraden) */
.rit-perimeter .rit-pg-huvud { cursor: move; user-select: none; touch-action: none; }
.rit-perimeter .rit-pg-huvud .rit-modal-close { cursor: pointer; }
.rit-pg-grepp { color: #8c8f94; margin-right: 4px; }
.rit-perimeter.is-dras { box-shadow: 0 12px 36px rgba(0,0,0,.28); opacity: .96; }
.rit-g-pg-status { list-style: none; margin: 8px 0; padding: 0; }
.rit-g-pg-status li { margin: 2px 0; }
.rit-g-pg-status button { display: flex; gap: 6px; width: 100%; text-align: left; background: none; border: 1px solid transparent; border-radius: 4px; padding: 3px 6px; cursor: pointer; font: inherit; }
.rit-g-pg-status button:hover, .rit-g-pg-status .is-aktiv button { border-color: #c3c4c7; background: #f6f7f7; }

/* 3.073: PTZ-mönstret klickas ut – fönstret fälls ihop till en rad */
.rit-perimeter.is-valjer { max-height: none; }
.rit-pg-valjrad { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; background: #fff8e5; border-top: 1px solid #f0c33c; }
.rit-pg-stopp { margin: 6px 0 6px 18px; padding: 0; }
.rit-pg-stopp li { margin: 2px 0; }
.rit-pg-stopp .rit-tool-btn { padding: 0 6px; min-height: 0; line-height: 1.6; }

/* 3.075: välj vilka handlingar som följer med i PDF:en. */
.rit-pdfval {
	position: fixed;
	inset: 0;
	z-index: 100050;
	background: rgba(0, 0, 0, 0.35);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
}
.rit-pdfval-ruta {
	background: #fff;
	border-radius: 6px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25);
	padding: 16px 20px;
	width: 100%;
	max-width: 420px;
	max-height: calc(100vh - 32px);
	overflow: auto;
	font-size: 14px;
}
.rit-pdfval-ruta h3 { margin: 0 0 10px; font-size: 16px; }
.rit-pdfval-rad { display: block; padding: 3px 0; cursor: pointer; }
.rit-pdfval-rad.is-last { color: #646970; cursor: default; }
.rit-pdfval-grupp { margin: 10px 0 2px; font-weight: 600; }
.rit-pdfval-knappar { margin-top: 12px; display: flex; gap: 8px; }

/* 3.097: prisspalter i materiallistan. */
.rit-table .rit-num { text-align: right; white-space: nowrap; }

/* 3.127: modell och hastighet per nätverkskort. */
.rit-nic-kort{display:flex;flex-direction:column;gap:4px;margin:2px 0 8px}
.rit-nic-kort-rad{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px;align-items:center}
.rit-nic-kort-nr{grid-column:1 / -1;font-size:12px;color:#50575e}
.rit-nic-kort-rad select,.rit-nic-kort-rad input{min-width:0;width:100%;box-sizing:border-box}
.rit-nic-kort-rad input{grid-column:1 / -1}

/* 3.154: integritetsmasker i egenskapspanelen */
.rit-mask-lista { list-style: none; margin: 0 0 6px; padding: 0; }
.rit-mask-lista li { display: flex; align-items: center; gap: 4px; margin: 2px 0; }
.rit-mask-lista input[type="text"] { flex: 1; min-width: 0; }
.rit-maskera-zon { white-space: nowrap; }

/* 3.154: arbete i offerten */
.rit-arbete { margin: 8px 0; }
.rit-arbete summary { cursor: pointer; font-weight: 600; }
.rit-arbete-falten { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; margin: 6px 0; }
.rit-arbete-falt { font-size: 13px; }
.rit-arbete-falt input[type="number"] { width: 70px; }
