.sml-wrap { max-width: 1100px; margin: 0 auto; }
.sml-controls { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin: 1rem 0 1.25rem; }
@media (min-width: 900px) { .sml-controls { grid-template-columns: 2fr repeat(4, 1fr); } }
.sml-controls input[type="search"], .sml-controls select {
  width: 100%; padding: .55rem .65rem; border: 1px solid var(--wp--preset--color--contrast-3, #ccc); border-radius: .5rem; background: #fff;
}
.sml-list { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 700px) { .sml-list { grid-template-columns: 1fr 1fr; } }
.sml-card { border: 1px solid var(--wp--preset--color--contrast-3, #e3e3e3); border-radius: .75rem; padding: 1rem; }
.sml-title { font-weight: 700; margin: 0 0 .25rem; }
.sml-meta { font-size: .9rem; opacity: .8; margin-bottom: .5rem; }
.sml-player { margin-top: .5rem; }
.sml-tags { margin-top: .5rem; font-size: .85rem; opacity: .85; }
.sml-empty { padding: 2rem; text-align: center; opacity: .8; }
/* Prevent time digits in the audio controls from being clipped (Chrome/Mobile) */
.sml-card { overflow: visible; }                 /* don’t clip descendants */
.sml-player { padding-bottom: 6px; }             /* give the control bar breathing room */
.sml-player audio { 
  display: block; 
  width: 100%;
  height: 40px;                                  /* ensures a tall-enough control bar */
  line-height: normal; 
  vertical-align: middle;
}

/* WebKit-specific: nudge the internal panel a touch lower */
.sml-player audio::-webkit-media-controls-panel { 
  padding-bottom: 4px;
}

/* Optional: tiny nudge for the time labels (current/remaining) */
.sml-player audio::-webkit-media-controls-current-time-display,
.sml-player audio::-webkit-media-controls-time-remaining-display {
  margin-bottom: 2px;
}

/* Mobile safety: avoid iOS zoom & give extra room on small screens */
@media (max-width: 768px) {
  .sml-player audio { height: 44px; font-size: 16px; }
}
/* --- Fix clipped time digits in Chrome / mobile --- */
.sml-card,
.sml-player,
.sml-player * {
  overflow: visible !important;         /* don't cut off controls */
}

.sml-player { 
  padding: 8px 0 12px;                  /* more breathing room under controls */
}

.sml-player audio {
  display: block;
  width: 100%;
  height: 48px;                         /* taller control bar */
  box-sizing: content-box;
  line-height: normal;
}

/* Chromium/WebKit-specific tweaks */
.sml-player audio::-webkit-media-controls-enclosure { 
  height: 40px;                         /* ensure enclosure is tall enough */
}

.sml-player audio::-webkit-media-controls-panel {
  padding-bottom: 6px;
}

.sml-player audio::-webkit-media-controls-current-time-display,
.sml-player audio::-webkit-media-controls-time-remaining-display {
  margin-bottom: 3px;
}

/* Elementor containers sometimes clip descendants */
.elementor-widget-container { overflow: visible; }

/* Mobile: avoid iOS zoom + give extra room */
@media (max-width: 768px) {
  .sml-player audio { height: 52px; font-size: 16px; }
}