Profit Calculator — Mohammad Amid
:root{
--bg:#ffffff;--card-bg:#f7f7f8;--text:#111111;--muted:#666666;
--input-bg:#ffffff;--accent:#007aff;
--profit-bg:#e9fbef;--profit-border:#28a745;--profit-text:#0a8a3a;
--loss-bg:#fff0f0;--loss-border:#ff3b30;--loss-text:#c21b1b;
--neutral-bg:#f1f1f1;--neutral-border:#d0d0d0;--neutral-text:#111;
}
@media(prefers-color-scheme:dark){
:root{--bg:#0f0f10;--card-bg:#121212;--text:#eaeaea;--muted:#bdbdbd;--input-bg:#1e1e1e;--accent:#007aff;
--profit-bg:#07210f;--profit-border:#28a745;--profit-text:#4cd964;
--loss-bg:#2f0a0a;--loss-border:#ff3b30;--loss-text:#ff453a;
--neutral-bg:#131313;--neutral-border:#333;--neutral-text:#eaeaea;}
}
html,body{height:100%;margin:0;padding:0;background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);}
.container{max-width:420px;margin:40px auto;padding:20px;background:var(--card-bg);border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,0.08);position:relative;}
h2{text-align:center;margin:6px 0 18px;font-size:20px;}
label{display:block;margin:12px 0 6px;font-size:14px;color:var(--muted);}
input{width:100%;padding:12px;border:none;border-radius:10px;background:var(--input-bg);color:var(--text);font-size:16px;margin-bottom:12px;outline:none;box-shadow:inset 0 1px 0 rgba(0,0,0,0.03);}
input:focus{box-shadow:0 0 0 3px rgba(0,122,255,0.12);}
button{width:100%;padding:14px;border:none;border-radius:10px;background:var(--accent);color:white;font-size:16px;cursor:pointer;}
button:hover{opacity:0.95;}
.result{margin-top:16px;padding:14px;border-radius:10px;font-weight:600;text-align:center;font-size:15px;}
.profit{background:var(--profit-bg);border:1px solid var(--profit-border);color:var(--profit-text);}
.loss{background:var(--loss-bg);border:1px solid var(--loss-border);color:var(--loss-text);}
.neutral{background:var(--neutral-bg);border:1px solid var(--neutral-border);color:var(--neutral-text);}
/* Watermark / copyright text in Arial */
.watermark {
position: absolute;
right: 18px;
bottom: 14px;
font-family: Arial, sans-serif;
font-size: 20px;
color: rgba(128,128,128,0.28);
}
@media(max-width:420px){.container{margin:18px 12px;}.watermark{font-size:18px;}}
📊 Profit % Calculator
Original Price (OP):
Current Price (CP):
Calculate
@MHT_AMID
const opEl=document.getElementById('op');
const cpEl=document.getElementById('cp');
const outEl=document.getElementById('output');
const calcBtn=document.getElementById('calcBtn');
function parseFormatted(v){return Number(String(v).replace(/,/g,''))||NaN;}
function formatNumber(n){return n.toLocaleString('en-US',{maximumFractionDigits:0});}
function formatInput(el){
let raw=el.value.replace(/,/g,'').replace(/\D/g,'');
if(raw===""){el.value="";return;}
el.value=formatNumber(Number(raw));
}
[opEl,cpEl].forEach(el=>el.addEventListener('input',()=>formatInput(el)));
function calculateProfit(){
const op=parseFormatted(opEl.value);
const cp=parseFormatted(cpEl.value);
if(isNaN(op)||isNaN(cp)||op 0).");return;}
const dld=op*0.04;
const totalCost=op+dld;
const grossDiff=cp-op;
const grossPercent=(grossDiff/op)*100;
const netDiff=cp-totalCost;
const netPercent=(netDiff/totalCost)*100;
outEl.style.display="block";
if(netDiff>0){outEl.className="result profit";}
else if(netDiff<0){outEl.className="result loss";}
else{outEl.className="result neutral";}
outEl.innerHTML=`
💰 Original Price (OP): ${formatNumber(op)}
🏢 DLD 4%: ${formatNumber(dld)}
📌 Total Cost (OP + DLD): ${formatNumber(totalCost)}
📈 Gross Profit: ${formatNumber(grossDiff)} (${grossPercent.toFixed(2)}%)
✅ Net Profit: ${formatNumber(netDiff)} (${netPercent.toFixed(2)}%)
`;
}
calcBtn.addEventListener('click',calculateProfit);
[opEl,cpEl].forEach(el=>el.addEventListener('keyup',e=>{if(e.key==='Enter')calculateProfit();}));
