/* fengxi-solartime-hint.css — 真太陽時提示條樣式
   全部以 .fxh- 前綴 scope,不污染母工具。可覆寫。 */

.fxh-box {
  background: #fff;
  border: 0.5px solid rgba(0,0,0,0.12);
  border-radius: 12px;
  padding: 14px 16px;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang TC", "Microsoft JhengHei", Arial, sans-serif;
  color: #2c2c2a;
}
.fxh-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.fxh-title { font-size: 14px; font-weight: 600; color: #0C447C; }
.fxh-geo {
  font-size: 12px; padding: 4px 12px; border-radius: 999px;
  border: 0.5px solid rgba(12,68,124,0.3); background: #fff; color: #0C447C;
  cursor: pointer; font-family: inherit; white-space: nowrap; transition: background .15s;
}
.fxh-geo:hover { background: #E6F1FB; }
.fxh-geo:active { transform: scale(.97); }
.fxh-geo:disabled { opacity: .5; cursor: default; }

.fxh-msg { font-size: 11px; line-height: 1.6; padding: 0; border-radius: 6px; display: none; margin-bottom: 8px; }
.fxh-msg.show { display: block; padding: 6px 10px; }
.fxh-msg.ok { background: #E3F2EC; color: #0F6E56; }
.fxh-msg.err { background: #FAEEDA; color: #854F0B; }

.fxh-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 8px; }
.fxh-box input, .fxh-box select {
  width: 100%; padding: 7px 9px; font-size: 14px;
  border: 0.5px solid rgba(0,0,0,0.15); border-radius: 8px;
  background: #fff; color: #2c2c2a; font-family: inherit;
}
.fxh-box input:focus, .fxh-box select:focus {
  outline: 2px solid #378ADD; outline-offset: -1px; border-color: #378ADD;
}

.fxh-out {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px;
  background: #f5f5f0; border-radius: 8px; padding: 10px 12px; margin-top: 4px;
}
.fxh-cell { display: flex; flex-direction: column; gap: 2px; text-align: center; }
.fxh-l { font-size: 11px; color: #5f5e5a; }
.fxh-v { font-size: 18px; font-weight: 500; color: #2c2c2a; font-variant-numeric: tabular-nums; }
.fxh-tip { font-size: 11px; color: #888780; margin: 8px 0 0; line-height: 1.6; }

@media (max-width: 420px) {
  .fxh-out { grid-template-columns: 1fr; gap: 6px; }
  .fxh-cell { flex-direction: row; justify-content: space-between; text-align: left; }
}