.time-input-section { background: var(--mm-bg-light); padding: 16px; border-radius: var(--mm-radius); border: 1px solid var(--mm-border-light); }
.time-field { margin-bottom: 15px; }
.time-field:last-child { margin-bottom: 0; }
.time-row { display: flex; gap: 15px; margin-bottom: 15px; flex-wrap: wrap; }
.time-col { flex: 1 1 calc(50% - 15px); min-width: 140px; }
.time-field label, .time-col label { display: block; font-size: 0.95em; margin-bottom: 6px; color: var(--mm-text-heading); font-weight: 600; }
.time-field select, .time-field input, .time-col input { width: 100%; padding: 10px; border: 1px solid var(--mm-border-input); border-radius: var(--mm-radius); box-sizing: border-box; font-family: inherit; font-size: 0.95em; color: var(--mm-text-dark); }
.time-field select:focus, .time-field input:focus, .time-col input:focus { outline: 2px solid var(--mm-primary); border-color: transparent; }
.time-result-box { margin-top: 20px; padding: 20px; background: #ffffff; border: 1px solid var(--mm-border); border-radius: var(--mm-radius); text-align: center; }
.time-label { font-size: 0.95em; color: var(--mm-text-muted); }
.time-exact { font-size: 2.2em; font-weight: bold; color: var(--mm-primary); margin: 8px 0; line-height: 1.1; }
.time-window { font-size: 0.95em; color: var(--mm-text-heading); margin-bottom: 16px; }
.time-note { font-size: 0.85em; color: var(--mm-text-muted); font-style: italic; border-top: 1px dashed var(--mm-border-input); padding-top: 12px; text-align: left; line-height: 1.4; }
@media (max-width: 600px) { .time-row { flex-direction: column; gap: 10px; } .time-col { flex: 1 1 100%; } }