/*
 * FrontHub Main Drop Converter UI v107
 * Scope:
 * Generic "Convert a file" modals opened from MAIN PAGE drag/drop only.
 */

.fh-main-credit-v107{
 margin:12px 0 14px!important;
}

.fh-main-credit-summary-v107{
 display:grid!important;
 grid-template-columns:1fr 1fr!important;
 gap:8px!important;
 margin-bottom:8px!important;
}

.fh-main-credit-summary-v107>div{
 display:flex!important;
 align-items:center!important;
 justify-content:space-between!important;

 min-height:38px!important;
 padding:0 12px!important;

 border:1px solid #e1e6ef!important;
 border-radius:10px!important;

 background:#f8faff!important;
}

.fh-main-credit-summary-v107 span{
 color:#788499!important;
 font-size:10px!important;
}

.fh-main-credit-summary-v107 strong{
 color:#4d59d8!important;
 font-size:11px!important;
}

.fh-main-credit-toggle-v107{
 display:grid!important;
 grid-template-columns:minmax(0,1fr) auto auto!important;
 align-items:center!important;
 gap:10px!important;

 width:100%!important;
 min-height:42px!important;
 padding:0 13px!important;

 border:1px solid #e1e6ef!important;
 border-radius:10px!important;

 background:#f8faff!important;
 color:#455268!important;

 font-size:11px!important;
 font-weight:650!important;
 text-align:left!important;

 cursor:pointer!important;
}

.fh-main-credit-toggle-v107 i{
 font-style:normal!important;
 transition:transform .18s!important;
}

.fh-main-credit-toggle-v107.open i{
 transform:rotate(180deg)!important;
}

.fh-main-credit-badge-v107{
 padding:4px 8px!important;

 border-radius:999px!important;

 background:#eeefff!important;
 color:#5561df!important;

 font-size:9px!important;
 font-weight:800!important;
}

.fh-main-credit-panel-v107{
 padding:10px 13px!important;

 border:1px solid #e1e6ef!important;
 border-top:0!important;
 border-radius:0 0 10px 10px!important;

 background:#fff!important;
 color:#748095!important;

 font-size:10px!important;
}

.fh-main-credit-panel-v107[hidden]{
 display:none!important;
}

.fh-main-credit-panel-v107 p{
 margin:0!important;
}

.fh-main-credit-warning-v107{
 margin-top:9px!important;
 padding:9px 10px!important;

 border-radius:8px!important;

 background:#fff1f1!important;
 color:#a92b22!important;
}

/*
 * MP3 generic converter output buttons.
 * Pure extension name only.
 */
.fh-main-mp3-format-grid-v107{
 display:grid!important;
 grid-template-columns:repeat(
  5,
  minmax(0,1fr)
 )!important;
 gap:9px!important;
}

.fh-main-convert-modal-v107
.fh-main-mp3-format-v107{
 display:flex!important;
 align-items:center!important;
 justify-content:center!important;

 width:100%!important;
 min-width:0!important;
 min-height:48px!important;

 padding:0 12px!important;

 border:1px solid #dfe5ee!important;
 border-radius:11px!important;

 background:#fff!important;
 color:#172033!important;

 font-size:13px!important;
 line-height:1!important;
 font-weight:800!important;

 text-align:center!important;
 white-space:nowrap!important;

 box-shadow:none!important;
 cursor:pointer!important;
}

.fh-main-convert-modal-v107
.fh-main-mp3-format-v107:hover{
 border-color:#8794ef!important;
 background:#f7f8ff!important;
 color:#4b58d8!important;
}

/* Dark mode */
html[data-theme="dark"]
.fh-main-credit-summary-v107>div,
html[data-theme="dark"]
.fh-main-credit-toggle-v107,
html.dark
.fh-main-credit-summary-v107>div,
html.dark
.fh-main-credit-toggle-v107{
 background:#111827!important;
 border-color:#334155!important;
 color:#e5e7eb!important;
}

html[data-theme="dark"]
.fh-main-credit-panel-v107,
html.dark
.fh-main-credit-panel-v107{
 background:#0f172a!important;
 border-color:#334155!important;
 color:#cbd5e1!important;
}

html[data-theme="dark"]
.fh-main-convert-modal-v107
.fh-main-mp3-format-v107,
html.dark
.fh-main-convert-modal-v107
.fh-main-mp3-format-v107{
 background:#111827!important;
 border-color:#334155!important;
 color:#f1f5f9!important;
}

@media(max-width:650px){
 .fh-main-credit-summary-v107{
  grid-template-columns:1fr!important;
 }

 .fh-main-mp3-format-grid-v107{
  grid-template-columns:repeat(
   3,
   minmax(0,1fr)
  )!important;
 }
}