/* Bug Reporter – widget na fronte (LifeKOMPAS® brand: Poppins, #0DC6F7, #0D3540) */

#bugrep-btn {
	position: fixed;
	top: 50%;
	z-index: 999998;
	writing-mode: vertical-rl;
	transform: translateY(-50%) rotate(180deg);
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 16px 11px;
	border: 0;
	font: 600 14px/1 "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	letter-spacing: .4px;
	cursor: pointer;
	box-shadow: 0 2px 12px rgba(13, 53, 64, .3);
	opacity: .95;
	transition: opacity .15s ease, padding .15s ease;
}
#bugrep-btn:hover { opacity: 1; padding-top: 20px; padding-bottom: 20px; }
/* rotate(180deg) – radius je zadaný zrkadlovo, vizuálne je oblý smerom do stránky */
#bugrep-btn.bugrep-right { right: 0; border-radius: 0 10px 10px 0; }
#bugrep-btn.bugrep-left { left: 0; transform: translateY(-50%); border-radius: 0 10px 10px 0; }
.bugrep-btn-icon { font-size: 16px; line-height: 1; }

#bugrep-modal {
	position: fixed;
	inset: 0;
	z-index: 999999;
	background: rgba(13, 53, 64, .5);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
}

.bugrep-panel {
	background: #fff;
	color: #0d3540;
	border-radius: 18px;
	width: 100%;
	max-width: 460px;
	max-height: 94vh;
	overflow-y: auto;
	box-shadow: 0 24px 70px rgba(13, 53, 64, .45);
	font: 14px/1.55 "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.bugrep-head {
	position: relative;
	background: #0d3540;
	color: #fff;
	padding: 22px 24px 26px;
	border-radius: 18px 18px 0 0;
}
.bugrep-head-icon {
	display: block;
	font-size: 24px;
	margin-bottom: 10px;
}
.bugrep-title {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.35;
	padding-right: 24px;
}
.bugrep-close {
	position: absolute;
	top: 14px;
	right: 14px;
	border: 0;
	background: none;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	color: rgba(255, 255, 255, .8);
	padding: 0 4px;
}
.bugrep-close:hover { color: #fff; }

.bugrep-view {
	padding: 20px 24px 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.bugrep-view[hidden],
#bugrep-thumbwrap[hidden],
#bugrep-shot-btn[hidden] {
	display: none;
}

.bugrep-view input[type="text"],
.bugrep-view input[type="email"],
.bugrep-view textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid #d8e2e7;
	border-radius: 10px;
	font: inherit;
	color: inherit;
	background: #fff;
	box-sizing: border-box;
}
.bugrep-view input:focus,
.bugrep-view textarea:focus {
	outline: none;
	border-color: #0dc6f7;
	box-shadow: 0 0 0 3px rgba(13, 198, 247, .18);
}
.bugrep-view ::placeholder { color: #8fa5ae; }
.bugrep-view textarea { resize: vertical; min-height: 110px; }

.bugrep-attach { display: flex; align-items: center; }
#bugrep-shot-btn {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px;
	border: 1px solid #d8e2e7;
	border-radius: 10px;
	background: #fff;
	color: #4a626d;
	font: 500 13px/1 inherit;
	cursor: pointer;
}
#bugrep-shot-btn:hover { background: #f2fbfe; border-color: #0dc6f7; }
#bugrep-shot-btn:disabled { opacity: .6; cursor: default; }

#bugrep-thumbwrap { position: relative; display: inline-block; }
#bugrep-thumb {
	max-height: 90px;
	max-width: 160px;
	border: 1px solid #d8e2e7;
	border-radius: 8px;
	cursor: pointer;
	display: block;
}
#bugrep-thumb-remove {
	position: absolute;
	top: -8px;
	right: -8px;
	width: 22px;
	height: 22px;
	border: 0;
	border-radius: 50%;
	background: #0d3540;
	color: #fff;
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
}

/* honeypot – skryté pole pre botov */
#bugrep-website {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.bugrep-submit {
	border: 0;
	border-radius: 60px;
	padding: 14px 16px;
	font: 700 14px/1 inherit;
	letter-spacing: .2px;
	cursor: pointer;
	transition: filter .15s ease, transform .1s ease;
}
.bugrep-submit:hover { filter: brightness(1.05); transform: translateY(-1px); }
.bugrep-submit:disabled { opacity: .7; cursor: default; transform: none; }

.bugrep-privacy {
	font-size: 11px;
	color: #8fa5ae;
	text-align: center;
	line-height: 1.4;
}
.bugrep-privacy a { color: #4a626d; }

.bugrep-msg { min-height: 1em; font-size: 13px; }
.bugrep-msg:empty { display: none; }
.bugrep-ok { color: #00753a; font-weight: 600; }
.bugrep-err { color: #d63638; font-weight: 600; }

/* ------ anotácia screenshotu ------ */
.bugrep-toolbar {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.bugrep-tool,
.bugrep-undo {
	border: 1px solid #d8e2e7;
	background: #fff;
	border-radius: 60px;
	padding: 8px 15px;
	font: 500 13px/1 inherit;
	cursor: pointer;
	color: #0d3540;
}
.bugrep-tool.bugrep-active {
	background: #0d3540;
	color: #fff;
	border-color: #0d3540;
}
.bugrep-done {
	margin-left: auto;
	border: 0;
	border-radius: 60px;
	padding: 9px 20px;
	font: 700 13px/1 inherit;
	cursor: pointer;
}
#bugrep-canvas {
	width: 100%;
	height: auto;
	display: block;
	border: 1px solid #d8e2e7;
	border-radius: 10px;
	cursor: crosshair;
	touch-action: none;
}

/* pri anotácii rozšír panel, nech je screenshot väčší */
.bugrep-panel:has(#bugrep-view-annotate:not([hidden])) { max-width: 680px; }

@media (max-width: 480px) {
	.bugrep-panel { max-height: 96vh; border-radius: 14px; }
	.bugrep-title { font-size: 16px; }
}