/* Aba Hoje — réplica visual do TodayService do Waves Pro. */
.wf-today {
	--wf-bg: #ffffff;
	--wf-ink: #1a1e2a;
	--wf-mut: #7a8294;
	--wf-line: #eceef2;
	--wf-red: #fe0000;
	display: flex;
	flex-direction: column;
	gap: 14px;
	color: var(--wf-ink);
	font-family: inherit;
}
.wf-today--empty {
	padding: 16px;
	border: 1px dashed var(--wf-line);
	border-radius: 12px;
	color: var(--wf-mut);
	text-align: center;
}

/* Ramp → cor de acento por bucket de score. */
.wf-ramp--gray       { --wf-ramp: #9ca3af; }
.wf-ramp--red        { --wf-ramp: #ef4444; }
.wf-ramp--red-light  { --wf-ramp: #f97316; }
.wf-ramp--amber      { --wf-ramp: #f59e0b; }
.wf-ramp--green      { --wf-ramp: #22c55e; }
.wf-ramp--green-dark { --wf-ramp: #16a34a; }
.wf-ramp--teal       { --wf-ramp: #14b8a6; }

/* Veredito */
.wf-today__veredito {
	display: flex;
	gap: 18px;
	align-items: center;
	padding: 18px 20px;
	background: var(--wf-bg);
	border: 1px solid var(--wf-line);
	border-left: 4px solid var(--wf-ramp);
	border-radius: 16px;
}
.wf-veredito__score { display: flex; flex-direction: column; align-items: center; min-width: 84px; }
.wf-veredito__nota { font-size: 44px; font-weight: 800; line-height: 1; color: var(--wf-ramp); }
.wf-veredito__label { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-top: 4px; }
.wf-veredito__frase { margin: 0; font-size: 15px; line-height: 1.5; }
.wf-veredito__badge { display: inline-block; margin-top: 8px; font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.wf-veredito__badge--up { background: #ecfdf5; color: #16a34a; }
.wf-veredito__badge--down { background: #fef2f2; color: #ef4444; }

/* Melhor / pior janela */
.wf-today__destaques { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.wf-destaque {
	display: flex; flex-direction: column; gap: 3px;
	padding: 14px 16px; border-radius: 14px;
	border: 1px solid var(--wf-line); border-top: 3px solid var(--wf-ramp);
	background: var(--wf-bg);
}
.wf-destaque__cap { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--wf-mut); }
.wf-destaque__hora { font-size: 20px; font-weight: 800; }
.wf-destaque__nota { font-size: 13px; font-weight: 700; color: var(--wf-ramp); }
.wf-destaque__meta { font-size: 12px; color: var(--wf-mut); }

/* Janelas do dia */
.wf-today__h3 { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--wf-mut); margin: 0 0 8px; }
.wf-janelas__scroll { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x proximity; }
.wf-janela {
	position: relative; flex: 0 0 auto; width: 120px;
	display: flex; flex-direction: column; gap: 2px;
	padding: 12px; border-radius: 14px; scroll-snap-align: start;
	border: 1px solid var(--wf-line); border-top: 3px solid var(--wf-ramp);
	background: var(--wf-bg);
}
.wf-janela.is-now { box-shadow: 0 0 0 2px var(--wf-red); }
.wf-janela.is-best::after { content: "★"; position: absolute; top: 8px; right: 10px; color: var(--wf-ramp); font-size: 12px; }
.wf-janela__hora { font-size: 13px; font-weight: 800; }
.wf-janela__nota { font-size: 22px; font-weight: 800; color: var(--wf-ramp); line-height: 1; }
.wf-janela__label { font-size: 11px; font-weight: 600; color: var(--wf-mut); }
.wf-janela__surf { font-size: 13px; font-weight: 700; margin-top: 4px; }
.wf-janela__det, .wf-janela__vento { font-size: 11px; color: var(--wf-mut); }
.wf-janela__vtipo { font-style: normal; font-weight: 700; color: var(--wf-ink); }
.wf-janela__nowtag { margin-top: 4px; align-self: flex-start; font-size: 10px; font-weight: 700; text-transform: uppercase; color: #fff; background: var(--wf-red); padding: 1px 7px; border-radius: 999px; }

/* Maré & Sol */
.wf-today__maresol { padding: 16px; border: 1px solid var(--wf-line); border-radius: 16px; background: var(--wf-bg); }
.wf-maresol__head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 6px; }
.wf-maresol__cap { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--wf-mut); }
.wf-maresol__alt { font-size: 24px; font-weight: 800; }
.wf-maresol__sub { display: block; font-size: 12px; color: var(--wf-mut); }
.wf-maresol__lua { text-align: right; }
.wf-maresol__lua-cap { display: block; font-size: 11px; color: var(--wf-mut); }
.wf-maresol__lua-label { font-size: 13px; font-weight: 700; }
.wf-maresol__svg { width: 100%; height: auto; display: block; }
.wf-maresol__area { fill: rgba(74, 158, 230, 0.12); }
.wf-maresol__line { stroke: #4a9ee6; stroke-width: 2; }
.wf-maresol__tick, .wf-maresol__exlabel, .wf-maresol__sun { font-size: 8px; fill: var(--wf-mut); }
.wf-maresol__tick { text-anchor: middle; }
.wf-maresol__exlabel { text-anchor: middle; font-weight: 600; }
.wf-maresol__ex { fill: #4a9ee6; }
.wf-maresol__now { fill: var(--wf-red); }

/* Movimento */
.wf-today__movimento {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px;
	padding: 14px 16px; border-radius: 14px; background: var(--wf-bg);
	border: 1px solid var(--wf-line); border-left: 4px solid var(--wf-ramp);
}
.wf-movimento__cap { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--wf-mut); }
.wf-movimento__label { font-size: 16px; font-weight: 800; color: var(--wf-ramp); }
.wf-movimento__frase { font-size: 13px; color: var(--wf-mut); }

/* Complementares */
.wf-today__comp { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.wf-comp__chip { display: flex; flex-direction: column; gap: 2px; padding: 12px; border-radius: 12px; background: #f4f5f7; }
.wf-comp__cap { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--wf-mut); }
.wf-comp__val { font-size: 14px; font-weight: 700; }

@media (max-width: 560px) {
	.wf-today__destaques, .wf-today__comp { grid-template-columns: 1fr 1fr; }
}