:root{
	--pv-primary: #2271b1;
	--pv-bg: #ffffff;
	--pv-bg-soft: #f6f8fa;
	--pv-text: #1d2327;
	--pv-text-soft: #646970;
	--pv-border: #e2e4e7;
	--pv-radius: 14px;
}

@media (prefers-color-scheme: dark) {
	.pv-widget{
		--pv-bg: #1e1e22;
		--pv-bg-soft: #2a2a2f;
		--pv-text: #f0f0f2;
		--pv-text-soft: #b3b3ba;
		--pv-border: #3a3a40;
	}
}

.pv-widget{
	max-width: 720px;
	background: var(--pv-bg);
	border: 1px solid var(--pv-border);
	border-radius: var(--pv-radius);
	padding: 20px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	color: var(--pv-text);
	box-sizing: border-box;
}
.pv-widget *{ box-sizing: border-box; }

.pv-error{
	color: #d63638;
	background: #fcf0f1;
	border-color: #d63638;
}

.pv-header{
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 14px;
}
.pv-city{
	font-size: 20px;
	font-weight: 700;
}
.pv-updated{
	font-size: 12px;
	color: var(--pv-text-soft);
}

.pv-current{
	display: flex;
	align-items: center;
	gap: 18px;
	background: var(--pv-bg-soft);
	border-radius: var(--pv-radius);
	padding: 16px;
	flex-wrap: wrap;
}
.pv-current-icon{
	font-size: 56px;
	line-height: 1;
}
.pv-current-main{
	min-width: 140px;
}
.pv-current-temp{
	font-size: 40px;
	font-weight: 800;
	color: var(--pv-primary);
	line-height: 1;
}
.pv-current-desc{
	font-size: 14px;
	margin-top: 4px;
}
.pv-current-feels{
	font-size: 12px;
	color: var(--pv-text-soft);
	margin-top: 2px;
}
.pv-current-details{
	display: grid;
	grid-template-columns: repeat(2, minmax(120px, 1fr));
	gap: 6px 18px;
	font-size: 13px;
	margin-left: auto;
}

.pv-section-title{
	font-size: 14px;
	font-weight: 700;
	margin: 18px 0 8px;
	color: var(--pv-text-soft);
	text-transform: uppercase;
	letter-spacing: .04em;
}

.pv-hourly-scroll{
	display: flex;
	gap: 10px;
	overflow-x: auto;
	padding-bottom: 6px;
	scrollbar-width: thin;
}
.pv-hour-item{
	flex: 0 0 auto;
	min-width: 70px;
	text-align: center;
	background: var(--pv-bg-soft);
	border-radius: 10px;
	padding: 10px 8px;
}
.pv-hour-time{ font-size: 12px; color: var(--pv-text-soft); }
.pv-hour-icon{ font-size: 24px; margin: 4px 0; }
.pv-hour-temp{ font-size: 14px; font-weight: 700; }
.pv-hour-rain{ font-size: 11px; color: var(--pv-text-soft); margin-top: 2px; }

.pv-daily-grid{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
	gap: 10px;
}
.pv-day-item{
	text-align: center;
	background: var(--pv-bg-soft);
	border-radius: 10px;
	padding: 12px 8px;
}
.pv-day-name{ font-size: 13px; font-weight: 700; }
.pv-day-icon{ font-size: 28px; margin: 6px 0; }
.pv-day-desc{ font-size: 11px; color: var(--pv-text-soft); min-height: 28px; }
.pv-day-temps{ margin-top: 6px; font-size: 13px; }
.pv-day-max{ font-weight: 700; }
.pv-day-min{ color: var(--pv-text-soft); margin-left: 6px; }
.pv-day-rain{ font-size: 11px; color: var(--pv-text-soft); margin-top: 4px; }

.pv-day-extra{
	font-size: 10px;
	color: var(--pv-text-soft);
	margin-top: 3px;
	line-height: 1.4;
}

.pv-footer{
	margin-top: 16px;
	font-size: 11px;
	color: var(--pv-text-soft);
	text-align: right;
}

/* ---- Kompaktan prikaz (za pocetnu stranicu / mali widget prostor) ---- */
.pv-compact{
	max-width: 420px;
	padding: 14px 16px;
}
.pv-compact .pv-current{
	padding: 10px;
	gap: 12px;
}
.pv-compact .pv-current-icon{
	font-size: 40px;
}
.pv-compact .pv-current-temp{
	font-size: 30px;
}
.pv-details-compact{
	display: flex;
	gap: 14px;
	margin-left: auto;
	font-size: 13px;
	grid-template-columns: none;
}
.pv-compact .pv-section-title{
	margin: 12px 0 6px;
	font-size: 12px;
}
.pv-daily-grid-compact{
	grid-template-columns: repeat(4, 1fr);
	gap: 6px;
}
.pv-daily-grid-compact .pv-day-item{
	padding: 8px 4px;
}
.pv-daily-grid-compact .pv-day-icon{
	font-size: 20px;
	margin: 4px 0;
}
.pv-daily-grid-compact .pv-day-temps{
	font-size: 12px;
}
.pv-hour-wind,
.pv-hour-uv{
	font-size: 10px;
	color: var(--pv-text-soft);
	margin-top: 2px;
}

/* ---- Admin panel ---- */
.pv-admin-wrap code{
	display: inline-block;
	background: #f0f0f1;
	padding: 4px 8px;
	border-radius: 4px;
	margin: 4px 0;
}
#pv_search_results .pv-result-item{
	padding: 8px 10px;
	border: 1px solid var(--pv-border);
	border-radius: 6px;
	margin-bottom: 6px;
	cursor: pointer;
	background: #fff;
}
#pv_search_results .pv-result-item:hover{
	background: #f0f6fc;
	border-color: var(--pv-primary);
}