/* MUTA v273 - 32-clocks-fix - Fix truncated times 18:... - Desktop + Mobile */
#clocksGrid{
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  gap: 14px !important;
}
#clocksGrid .clock-card{
  min-width: 0 !important;
  overflow: visible !important;
  padding: 14px 12px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
}
#clocksGrid .clock-card .city{
  font-size: .78rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: unset !important;
  max-width: 100% !important;
}
#clocksGrid .clock-card .time,
#clockTimeTehran, #clockTimeTokyo, #clockTimeLondon, #clockTimeNY,
[data-clock-time]{
  font-size: clamp(1rem, 1.8vw, 1.35rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: unset !important;
  max-width: 100% !important;
  min-width: 0 !important;
  direction: ltr !important;
  text-align: left !important;
  width: auto !important;
  display: block !important;
  font-variant-numeric: tabular-nums !important;
  line-height: 1.2 !important;
}
#clocksGrid .clock-card .date,
[data-clock-date]{
  font-size: .68rem !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: unset !important;
  max-width: 100% !important;
}

@media(max-width:1100px){
  #clocksGrid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #clocksGrid .clock-card .time{ font-size: clamp(1.1rem, 3vw, 1.4rem) !important; }
}
@media(max-width:720px){
  #clocksGrid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 10px !important; }
  #clocksGrid .clock-card{ padding: 12px 10px !important; }
  #clocksGrid .clock-card .time{ font-size: clamp(1rem, 4vw, 1.25rem) !important; }
}
@media(max-width:480px){
  #clocksGrid{ grid-template-columns: 1fr !important; }
  #clocksGrid .clock-card .time{ font-size: 1.4rem !important; }
}

/* Fix summary grid and home markets to prevent overflow */
#summaryGrid, .home-markets-grid-wrapper{
  overflow: visible !important;
}