/*
 * FrontHub Create ZIP v118
 * PDF Tools visual standard.
 */

#fhzip118-modal *{box-sizing:border-box}

#fhzip118-modal .fhzip118-modal{
 width:min(720px,calc(100vw - 32px))!important;
}

#fhzip118-modal .fhzip118-titlebar{
 display:flex;
 align-items:center;
 justify-content:center;
 height:42px;
 margin:0 20px 12px;
 border-radius:11px;
 background:linear-gradient(135deg,#6659ef,#339cf3);
 color:#fff;
 font-size:12px;
 font-weight:850;
}

#fhzip118-modal .fhzip118-credit-summary{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:8px;
 margin-bottom:8px;
}

#fhzip118-modal .fhzip118-credit-summary>div{
 display:flex;
 align-items:center;
 justify-content:space-between;
 min-height:38px;
 padding:0 12px;
 border:1px solid #e1e6ef;
 border-radius:10px;
 background:#f8faff;
}

#fhzip118-modal .fhzip118-credit-summary span{
 color:#788499;
 font-size:10px;
}

#fhzip118-modal .fhzip118-credit-summary strong{
 color:#4d59d8;
 font-size:11px;
}

#fhzip118-modal .fhzip118-credit{
 margin-bottom:12px;
}

#fhzip118-modal .fhzip118-credit[hidden],
#fhzip118-modal .fhzip118-credit-panel[hidden]{
 display:none!important;
}

#fhzip118-modal .fhzip118-credit-toggle{
 display:grid;
 grid-template-columns:minmax(0,1fr) auto auto;
 align-items:center;
 gap:10px;
 width:100%;
 min-height:42px;
 padding:0 13px;
 border:1px solid #e1e6ef;
 border-radius:10px;
 background:#f8faff;
 color:#455268;
 font-size:11px;
 font-weight:700;
 text-align:left;
 cursor:pointer;
}

#fhzip118-modal .fhzip118-credit-toggle i{
 font-style:normal;
 transition:transform .18s;
}

#fhzip118-modal .fhzip118-credit-toggle.open i{
 transform:rotate(180deg);
}

#fhzip118-modal .fhzip118-credit-badge{
 padding:4px 8px;
 border-radius:999px;
 background:#eeefff;
 color:#5561df;
 font-size:9px;
 font-weight:800;
}

#fhzip118-modal .fhzip118-credit-panel{
 padding:10px 13px;
 border:1px solid #e1e6ef;
 border-top:0;
 border-radius:0 0 10px 10px;
 background:#fff;
}

#fhzip118-modal .fhzip118-credit-line{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:12px;
 padding:8px 0;
 border-bottom:1px solid #edf0f5;
}

#fhzip118-modal .fhzip118-credit-line strong,
#fhzip118-modal .fhzip118-credit-line small{
 display:block;
}

#fhzip118-modal .fhzip118-credit-line strong{
 color:#334155;
 font-size:10px;
}

#fhzip118-modal .fhzip118-credit-line small{
 margin-top:2px;
 color:#8490a3;
 font-size:9px;
}

#fhzip118-modal .fhzip118-credit-line>span{
 color:#5561df;
 font-size:10px;
 font-weight:800;
}

#fhzip118-modal .fhzip118-credit-total{
 display:flex;
 align-items:center;
 justify-content:space-between;
 padding-top:10px;
 color:#536074;
 font-size:10px;
}

#fhzip118-modal .fhzip118-credit-total strong{
 color:#4d59d8;
}

#fhzip118-modal .fhzip118-warning{
 margin-top:9px;
 padding:9px 10px;
 border-radius:8px;
 background:#fff1f1;
 color:#a92b22;
 font-size:10px;
}

#fhzip118-modal .fhzip118-drop{
 display:flex!important;
 flex-direction:column!important;
 align-items:center!important;
 justify-content:center!important;
 position:relative!important;

 width:100%!important;
 min-height:176px!important;
 padding:22px 20px!important;

 border:1.5px dashed #b9c6df!important;
 border-radius:15px!important;

 background:#fbfcff!important;
 color:#273348!important;
 text-align:center!important;

 cursor:pointer!important;
 pointer-events:auto!important;
 user-select:none!important;
}

#fhzip118-modal .fhzip118-drop:hover,
#fhzip118-modal .fhzip118-drop.drag{
 border-color:#6975ef!important;
 background:#f5f7ff!important;
}

#fhzip118-modal .fhzip118-drop *{
 pointer-events:none!important;
}

#fhzip118-modal .fhzip118-drop-icon{
 display:flex;
 align-items:center;
 justify-content:center;

 width:58px;
 height:58px;
 margin-bottom:12px;

 border-radius:15px;

 background:linear-gradient(135deg,#6659ef,#339cf3);
 color:#fff;

 font-size:10px;
 font-weight:900;
}

#fhzip118-modal .fhzip118-drop strong{
 color:#253247;
 font-size:14px;
 font-weight:850;
}

#fhzip118-modal .fhzip118-drop>span:not(.fhzip118-drop-icon){
 margin-top:6px;
 color:#8290a5;
 font-size:10px;
}

#fhzip118-modal .fhzip118-drop small{
 margin-top:6px;
 color:#9ba5b4;
 font-size:9px;
}

#fhzip118-modal .fhzip118-files{
 max-height:210px;
 margin-top:11px;
 overflow:auto;
 border:1px solid #e2e7ef;
 border-radius:11px;
 background:#fff;
}

#fhzip118-modal .fhzip118-files[hidden]{
 display:none!important;
}

#fhzip118-modal .fhzip118-file-row{
 display:grid;
 grid-template-columns:42px minmax(0,1fr) 30px;
 align-items:center;
 gap:9px;
 padding:8px 10px;
 border-bottom:1px solid #edf0f5;
}

#fhzip118-modal .fhzip118-file-row:last-child{
 border-bottom:0;
}

#fhzip118-modal .fhzip118-file-icon{
 display:flex;
 align-items:center;
 justify-content:center;
 width:40px;
 height:34px;
 border-radius:8px;
 background:#eef0ff;
 color:#5863e8;
 font-size:8px;
 font-weight:900;
}

#fhzip118-modal .fhzip118-file-row strong,
#fhzip118-modal .fhzip118-file-row small{
 display:block;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
}

#fhzip118-modal .fhzip118-file-row small{
 margin-top:2px;
 color:#8490a3;
 font-size:9px;
}

#fhzip118-modal .fhzip118-file-row button{
 border:0;
 background:transparent;
 color:#64748b;
 font-size:18px;
 cursor:pointer;
}

#fhzip118-modal .fhzip118-password-box{
 margin-top:12px;
 border:1px solid #e2e7ef;
 border-radius:11px;
 background:#fbfcfe;
}

#fhzip118-modal .fhzip118-switch-row{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:15px;
 padding:11px 12px;
 cursor:pointer;
}

#fhzip118-modal .fhzip118-switch-row strong,
#fhzip118-modal .fhzip118-switch-row small{
 display:block;
}

#fhzip118-modal .fhzip118-switch-row strong{
 color:#354155;
 font-size:10px;
}

#fhzip118-modal .fhzip118-switch-row small{
 margin-top:2px;
 color:#8490a3;
 font-size:9px;
}

#fhzip118-modal .fhzip118-switch{
 position:relative;
 width:38px;
 height:22px;
 flex:none;
}

#fhzip118-modal .fhzip118-switch input{
 position:absolute;
 opacity:0;
 pointer-events:none;
}

#fhzip118-modal .fhzip118-switch i{
 position:absolute;
 inset:0;
 border-radius:999px;
 background:#cfd6e2;
 transition:.18s;
}

#fhzip118-modal .fhzip118-switch i:after{
 content:'';
 position:absolute;
 top:3px;
 left:3px;
 width:16px;
 height:16px;
 border-radius:50%;
 background:#fff;
 box-shadow:0 1px 3px rgba(0,0,0,.18);
 transition:.18s;
}

#fhzip118-modal .fhzip118-switch input:checked+i{
 background:linear-gradient(135deg,#6659ef,#339cf3);
}

#fhzip118-modal .fhzip118-switch input:checked+i:after{
 transform:translateX(16px);
}

#fhzip118-modal .fhzip118-password-wrap{
 display:grid;
 grid-template-columns:34px minmax(0,1fr);
 align-items:center;
 gap:8px;
 padding:0 12px 12px;
}

#fhzip118-modal .fhzip118-password-wrap[hidden]{
 display:none!important;
}

#fhzip118-modal .fhzip118-password-wrap input{
 width:100%;
 height:39px;
 padding:0 10px;
 border:1px solid #dce2eb;
 border-radius:9px;
 background:#fff;
 color:#172033;
}

#fhzip118-modal .fhpdf-status{
 margin-top:13px;
}

#fhzip118-modal .fhpdf-progress{
 height:8px;
 overflow:hidden;
 border-radius:999px;
 background:#e9edf4;
}

#fhzip118-modal .fhpdf-progress i{
 display:block;
 width:0;
 height:100%;
 border-radius:999px;
 background:linear-gradient(90deg,#6659ef,#339cf3);
 transition:width .25s;
}

#fhzip118-modal .fhpdf-status[hidden],
#fhzip118-modal .fhpdf-ready[hidden],
#fhzip118-modal .fhpdf-error[hidden]{
 display:none!important;
}

#fhzip118-modal .fhpdf-download-btn{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 height:39px;
 padding:0 16px;
 border:0;
 border-radius:10px;
 background:linear-gradient(135deg,#2a9363,#47b878);
 color:#fff;
 font-weight:850;
 text-decoration:none;
 cursor:pointer;
}

#fhzip118-modal .fhpdf-actions{
 display:flex;
 justify-content:flex-end;
 gap:8px;
 margin-top:18px;
}

#fhzip118-modal .fhpdf-actions button{
 height:39px;
 padding:0 15px;
 border-radius:10px;
 font-weight:850;
}

#fhzip118-modal .fhpdf-secondary{
 border:1px solid #dce2eb;
 background:#fff;
 color:#596477;
}

#fhzip118-modal .fhpdf-primary{
 border:0!important;
 background:linear-gradient(135deg,#6659ef,#339cf3)!important;
 color:#fff!important;
}

html[data-theme="dark"] #fhzip118-modal .fhzip118-drop,
html.dark #fhzip118-modal .fhzip118-drop{
 background:#0f172a!important;
 border-color:#475569!important;
 color:#e5e7eb!important;
}

html[data-theme="dark"] #fhzip118-modal .fhzip118-drop strong,
html.dark #fhzip118-modal .fhzip118-drop strong{
 color:#f1f5f9!important;
}

html[data-theme="dark"] #fhzip118-modal .fhzip118-credit-summary>div,
html[data-theme="dark"] #fhzip118-modal .fhzip118-credit-toggle,
html[data-theme="dark"] #fhzip118-modal .fhzip118-password-box,
html.dark #fhzip118-modal .fhzip118-credit-summary>div,
html.dark #fhzip118-modal .fhzip118-credit-toggle,
html.dark #fhzip118-modal .fhzip118-password-box{
 background:#111827;
 border-color:#334155;
 color:#e5e7eb;
}

html[data-theme="dark"] #fhzip118-modal .fhzip118-credit-panel,
html[data-theme="dark"] #fhzip118-modal .fhzip118-files,
html.dark #fhzip118-modal .fhzip118-credit-panel,
html.dark #fhzip118-modal .fhzip118-files{
 background:#0f172a;
 border-color:#334155;
}

html[data-theme="dark"] #fhzip118-modal .fhzip118-password-wrap input,
html.dark #fhzip118-modal .fhzip118-password-wrap input{
 background:#0f172a;
 border-color:#475569;
 color:#e5e7eb;
}

@media(max-width:620px){
 #fhzip118-modal .fhzip118-credit-summary{
  grid-template-columns:1fr;
 }
}