/* TH826_TAB3_STEP5_VOICE_DURATION_CSS_V2 */

.th826-step5-block{
  display:grid;
  gap:11px;
}

.th826-step5-inherit-note{
  display:grid;
  gap:3px;
  padding:8px 10px;
  border:1px solid rgba(44,166,234,.28);
  border-radius:9px;
  background:rgba(8,64,103,.24);
}

.th826-step5-inherit-note b{
  color:#7ed7ff;
  font-size:10.5px;
}

.th826-step5-inherit-note span{
  color:#a8cce6;
  font-size:9.5px;
  line-height:1.4;
}

.th826-step5-grid{
  grid-template-columns:
    minmax(0,1.25fr)
    minmax(300px,.75fr) !important;
  align-items:stretch;
}

.th826-step5-voice-card,
.th826-step5-duration-card{
  min-width:0;
}

.th826-step5-basic-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:9px;
}

.th826-step5-basic-grid
.th826-ai-field:first-child{
  grid-column:1 / -1;
}

.th826-step5-advanced{
  margin-top:10px;
}

.th826-step5-advanced
.th826-voice-advanced-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:9px;
}

.th826-step5-pronunciation{
  margin-top:10px;
}

.th826-step5-pronunciation textarea{
  min-height:78px;
}

.th826-step5-seconds-input{
  display:grid;
  grid-template-columns:minmax(0,1fr) 42px;
  align-items:center;
  gap:7px;
}

.th826-step5-seconds-input b{
  color:#8fc9eb;
  font-size:9.5px;
  text-align:center;
}

#th826Step5CustomDurationField{
  opacity:.58;
  transition:opacity .16s ease;
}

#th826Step5CustomDurationField.is-active{
  opacity:1;
}

.th826-step5-duration-summary{
  display:grid;
  gap:3px;
  margin-top:10px;
  padding:9px 10px;
  border:1px solid rgba(40,199,139,.32);
  border-radius:9px;
  background:rgba(9,89,63,.20);
}

.th826-step5-duration-summary b{
  color:#70edb6;
  font-size:10px;
}

.th826-step5-duration-summary span{
  color:#a4d8c7;
  font-size:9px;
  line-height:1.4;
}

.th826-step5-duration-rules{
  display:grid;
  gap:6px;
  margin-top:9px;
}

.th826-step5-duration-rules label{
  min-height:30px;
  display:grid;
  grid-template-columns:15px minmax(0,1fr);
  gap:7px;
  align-items:center;
  padding:5px 8px;
  border:1px solid rgba(48,132,205,.24);
  border-radius:8px;
  background:rgba(5,29,53,.58);
}

.th826-step5-duration-rules input{
  width:13px;
  height:13px;
  margin:0;
}

.th826-step5-duration-rules span{
  color:#ddecf7;
  font-size:9.5px;
  font-weight:700;
}

.th826-step5-duration-guides{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:6px;
  margin-top:9px;
}

.th826-step5-duration-guides span{
  min-height:27px;
  display:grid;
  place-items:center;
  padding:4px 6px;
  border:1px solid rgba(49,125,198,.25);
  border-radius:7px;
  color:#91c8e9;
  background:rgba(5,23,42,.58);
  font-size:8.7px;
  text-align:center;
}

#th826Step5VoiceDuration select,
#th826Step5VoiceDuration input{
  min-height:36px;
}

#th826Step5VoiceDuration textarea{
  box-sizing:border-box;
  width:100%;
  resize:vertical;
}

#th826Step5VoiceDuration
.th826-ai-field small{
  display:block;
  margin-top:5px;
  color:#80aed0;
  font-size:8.8px;
  line-height:1.35;
}

@media(max-width:1100px){
  .th826-step5-grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:900px){
  .th826-step5-basic-grid,
  .th826-step5-advanced
  .th826-voice-advanced-grid{
    grid-template-columns:1fr;
  }

  .th826-step5-basic-grid
  .th826-ai-field:first-child{
    grid-column:auto;
  }
}

/* END_TH826_TAB3_STEP5_VOICE_DURATION_CSS_V2 */