/* =========================================================
   NUJIZ — ENHANCE IMAGE PRO UI
   UI only — processing engine untouched
   ========================================================= */

body[data-tool-id="enhance"]{
    --enhance-purple:#7047f5;
    --enhance-purple-2:#8d68ff;
    --enhance-navy:#151633;
    --enhance-border:#e5e2f3;
}

/* ---------- Main application ---------- */

body[data-tool-id="enhance"] .tool-app,
body[data-tool-id="enhance"] .app-shell,
body[data-tool-id="enhance"] .tool-workspace{
    position:relative;
}

/* ---------- Preview ---------- */

body[data-tool-id="enhance"] canvas,
body[data-tool-id="enhance"] .preview-canvas,
body[data-tool-id="enhance"] .image-preview{
    max-width:100%;
}

body[data-tool-id="enhance"] .preview-panel,
body[data-tool-id="enhance"] .preview-area,
body[data-tool-id="enhance"] .canvas-wrap{
    border-radius:20px !important;
    overflow:hidden;
}

/* ---------- Controls ---------- */

body[data-tool-id="enhance"] #scale{
    min-height:48px !important;
    width:100% !important;

    padding-inline:15px 42px !important;

    border:1px solid var(--enhance-border) !important;
    border-radius:12px !important;

    background-color:#fff !important;
    color:#17182f !important;

    font-family:inherit !important;
    font-size:14px !important;
    font-weight:800 !important;

    cursor:pointer;
    outline:none !important;

    transition:
        border-color .2s ease,
        box-shadow .2s ease !important;
}

body[data-tool-id="enhance"] #scale:hover,
body[data-tool-id="enhance"] #scale:focus{
    border-color:rgba(112,71,245,.65) !important;
    box-shadow:0 0 0 4px rgba(112,71,245,.08) !important;
}

/* ---------- Enhancement strength ---------- */

body[data-tool-id="enhance"] #strength{
    width:100% !important;
    height:6px !important;

    accent-color:var(--enhance-purple) !important;

    cursor:pointer !important;
}

body[data-tool-id="enhance"] #strength::-webkit-slider-thumb{
    width:18px !important;
    height:18px !important;
    cursor:grab !important;
}

body[data-tool-id="enhance"] #strength:active::-webkit-slider-thumb{
    cursor:grabbing !important;
}

/* ---------- File row ---------- */

body[data-tool-id="enhance"] .file-row{
    min-height:64px !important;
    border-radius:14px !important;
    border:1px solid #ebe8f5 !important;
    background:#fbfbfe !important;
}

/* ---------- Remove button ---------- */

body[data-tool-id="enhance"] #removeFile{
    min-height:42px !important;
    padding:0 17px !important;

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

    background:#fff7f4 !important;
    color:#792b20 !important;
    -webkit-text-fill-color:#792b20 !important;

    font-weight:800 !important;
}

/* ---------- Main enhance button ---------- */

body[data-tool-id="enhance"] .process-btn,
body[data-tool-id="enhance"] .enhance-start-button,
body[data-tool-id="enhance"] [data-action="enhance"]{
    width:100% !important;
    min-height:54px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:12px !important;

    border:0 !important;
    border-radius:14px !important;

    background:
        linear-gradient(
            135deg,
            #17172f 0%,
            #23204a 100%
        ) !important;

    color:#fff !important;
    -webkit-text-fill-color:#fff !important;

    font-size:15px !important;
    font-weight:900 !important;

    box-shadow:
        0 13px 30px rgba(20,20,50,.17),
        inset 0 1px 0 rgba(255,255,255,.08) !important;

    cursor:pointer !important;

    transition:
        transform .2s ease,
        box-shadow .2s ease !important;
}

body[data-tool-id="enhance"] .process-btn *,
body[data-tool-id="enhance"] .enhance-start-button *,
body[data-tool-id="enhance"] [data-action="enhance"] *{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
}

body[data-tool-id="enhance"] .process-btn:hover:not(:disabled),
body[data-tool-id="enhance"] .enhance-start-button:hover:not(:disabled),
body[data-tool-id="enhance"] [data-action="enhance"]:hover:not(:disabled){
    transform:translateY(-2px) !important;

    box-shadow:
        0 17px 35px rgba(20,20,50,.22),
        0 0 0 4px rgba(112,71,245,.07) !important;
}

/* ---------- Download result ---------- */

body[data-tool-id="enhance"] .download-btn{
    min-height:52px !important;
    border-radius:14px !important;

    background:
        linear-gradient(
            135deg,
            var(--enhance-purple),
            var(--enhance-purple-2)
        ) !important;

    color:#fff !important;
    -webkit-text-fill-color:#fff !important;

    font-weight:900 !important;

    box-shadow:0 12px 28px rgba(112,71,245,.22) !important;
}

body[data-tool-id="enhance"] .download-btn *{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
}

/* ---------- Privacy message ---------- */

body[data-tool-id="enhance"] .privacy-line{
    min-height:42px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:11px !important;

    background:#fafafe !important;

    color:#74758a !important;
}

/* ---------- Result / metadata ---------- */

body[data-tool-id="enhance"] .image-meta,
body[data-tool-id="enhance"] .preview-meta{
    border-top:1px solid #e8e6f0 !important;
}

/* ---------- Desktop ---------- */

@media (min-width:900px){

    body[data-tool-id="enhance"] .tool-editor,
    body[data-tool-id="enhance"] .editor-grid,
    body[data-tool-id="enhance"] .workspace-grid{
        align-items:stretch !important;
    }

}

/* ---------- Mobile ---------- */

@media (max-width:760px){

    body[data-tool-id="enhance"] #scale{
        min-height:50px !important;
        font-size:16px !important;
    }

    body[data-tool-id="enhance"] .process-btn,
    body[data-tool-id="enhance"] .enhance-start-button,
    body[data-tool-id="enhance"] [data-action="enhance"],
    body[data-tool-id="enhance"] .download-btn{
        min-height:52px !important;
        font-size:14px !important;
    }

    body[data-tool-id="enhance"] .file-row{
        min-height:58px !important;
    }

}