/* Widget „Vremea în Cluj” - habitatcluj.ro */
.hcw {
	--hcw-r: var(--hc-r, 18px);
	position: relative;
	overflow: hidden;
	border-radius: var(--hcw-r);
	padding: 20px 20px 14px;
	color: #fff;
	background: linear-gradient(140deg, #1d3fbf 0%, #2f6ae0 55%, #4e9bf0 100%);
	box-shadow: 0 14px 30px -18px rgba(16, 40, 120, .7);
	font-family: "Jost", system-ui, sans-serif;
	line-height: 1.3;
}
.hcw--night { background: linear-gradient(150deg, #0d1640 0%, #1c2a6b 60%, #33307a 100%); }
.hcw--cloud.hcw--day, .hcw--fog.hcw--day { background: linear-gradient(140deg, #3a4f86 0%, #5b72a8 55%, #8195c2 100%); }
.hcw--rain.hcw--day, .hcw--storm.hcw--day { background: linear-gradient(140deg, #26365f 0%, #3c5488 60%, #5873a8 100%); }
.hcw::after {
	content: "";
	position: absolute;
	right: -60px; top: -60px;
	width: 200px; height: 200px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 255, 255, .22), rgba(255, 255, 255, 0) 70%);
	pointer-events: none;
}
.hcw p { margin: 0; }
.hcw a { color: inherit; }

.hcw-now { display: flex; align-items: center; justify-content: space-between; gap: 12px; position: relative; z-index: 1; }
.hcw-place { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; opacity: .85; }
.hcw-temp { font-size: 58px; font-weight: 700; line-height: 1; letter-spacing: -.04em; margin: 6px 0 4px !important; }
.hcw-temp span { font-size: 22px; font-weight: 600; vertical-align: super; margin-left: 2px; opacity: .9; letter-spacing: 0; }
.hcw-desc { font-size: 15px; font-weight: 600; }
.hcw-now > .hcw-icon { width: 88px; height: 88px; flex: 0 0 auto; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .18)); }

.hcw-stats {
	list-style: none; margin: 16px 0 0 !important; padding: 10px 0 !important;
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;
	border-top: 1px solid rgba(255, 255, 255, .22);
	border-bottom: 1px solid rgba(255, 255, 255, .22);
	position: relative; z-index: 1;
}
.hcw-stats li { display: flex; flex-direction: column; gap: 2px; margin: 0 !important; padding: 0 !important; border: 0 !important; }
.hcw-stats li::before { display: none !important; }
.hcw-stats span { font-size: 11px; opacity: .8; }
.hcw-stats strong { font-size: 15px; font-weight: 700; }

.hcw-days {
	list-style: none; margin: 12px 0 0 !important; padding: 0 !important;
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px;
	position: relative; z-index: 1;
}
.hcw-days li {
	display: flex; flex-direction: column; align-items: center; gap: 3px;
	margin: 0 !important; padding: 8px 2px !important; border: 0 !important;
	border-radius: 12px;
	background: rgba(255, 255, 255, .1);
	text-align: center;
}
.hcw-days li::before { display: none !important; }
.hcw-days li:first-child { background: rgba(255, 255, 255, .2); }
.hcw-day { font-size: 12px; font-weight: 700; }
.hcw-days .hcw-icon { width: 32px; height: 32px; }
.hcw-range { font-size: 13px; opacity: .85; white-space: nowrap; }
.hcw-range strong { font-weight: 700; opacity: 1; }
.hcw-rain { font-size: 11px; opacity: .75; }
.hcw-rain::before { content: "☂ "; }
.hcw-rain.is-wet { opacity: 1; color: #bfe6ff; font-weight: 700; }

.hcw-foot { margin-top: 10px !important; font-size: 11px; opacity: .7; text-align: right; position: relative; z-index: 1; }
.hcw-foot a { text-decoration: underline; text-underline-offset: 2px; }

@media (max-width: 380px) {
	.hcw-temp { font-size: 48px; }
	.hcw-now > .hcw-icon { width: 70px; height: 70px; }
}

/* tema impune fontul serif pe elementele din widgeturi */
.hcw, .hcw p, .hcw span, .hcw strong, .hcw li, .hcw a { font-family: "Jost", system-ui, sans-serif !important; }