function tpChange(prefix, delta, seg) {
    let d = parseInt(document.getElementById(prefix + '_d').value) || 0;
    let h = parseInt(document.getElementById(prefix + '_h')?.value) || 0;
    let m = parseInt(document.getElementById(prefix + '_m')?.value) || 0;
    if (seg === 'm') m += delta;
    else if (seg === 'h') h += delta;
    else d += delta;
    if (m >= 60) { h += Math.floor(m/60); m %= 60; }
    if (m < 0)   { const b = Math.ceil(-m/60); h -= b; m += b*60; }
    if (h >= 24) { d += Math.floor(h/24); h %= 24; }
    if (h < 0)   { const b = Math.ceil(-h/24); d -= b; h += b*24; }
    if (d < 0) d = 0;
    document.getElementById(prefix + '_d').value = d;
    if (document.getElementById(prefix + '_h'))
        document.getElementById(prefix + '_h').value = String(h).padStart(2, '0');
    if (document.getElementById(prefix + '_m'))
        document.getElementById(prefix + '_m').value = String(m).padStart(2, '0');
}

function tpToMinutes(prefix) {
    const d = parseInt(document.getElementById(prefix + '_d').value) || 0;
    const h = parseInt(document.getElementById(prefix + '_h')?.value) || 0;
    const m = parseInt(document.getElementById(prefix + '_m')?.value) || 0;
    return d * 1440 + h * 60 + m;
}

function tpFromMinutes(prefix, total) {
    total = total || 0;
    const d = Math.floor(total / 1440);
    const h = Math.floor((total % 1440) / 60);
    const m = total % 60;
    document.getElementById(prefix + '_d').value = d;
    if (document.getElementById(prefix + '_h'))
        document.getElementById(prefix + '_h').value = String(h).padStart(2, '0');
    if (document.getElementById(prefix + '_m'))
        document.getElementById(prefix + '_m').value = String(m).padStart(2, '0');
}

function tpHtml(prefix, initD, initH, initM) {
    const d = initD ?? 0, h = initH ?? 0, m = initM ?? 0;
    return `<div class="time-picker">` +
        `<div class="tp-seg"><button type="button" onclick="tpChange('${prefix}',-1,'d')">−</button><input type="text" id="${prefix}_d" value="${d}" readonly><button type="button" onclick="tpChange('${prefix}',1,'d')">+</button><span class="tp-label">Tage</span></div>` +
        `<div class="tp-seg"><button type="button" onclick="tpChange('${prefix}',-1,'h')">−</button><input type="text" id="${prefix}_h" value="${String(h).padStart(2,'0')}" readonly><button type="button" onclick="tpChange('${prefix}',1,'h')">+</button><span class="tp-label">Stunden</span></div>` +
        `<div class="tp-seg"><button type="button" onclick="tpChange('${prefix}',-1,'m')">−</button><input type="text" id="${prefix}_m" value="${String(m).padStart(2,'0')}" readonly><button type="button" onclick="tpChange('${prefix}',1,'m')">+</button><span class="tp-label">Minuten</span></div>` +
        `</div>`;
}

function tpHtmlDH(prefix, initD, initH) {
    const d = initD ?? 0, h = initH ?? 0;
    return `<div class="time-picker">` +
        `<div class="tp-seg"><button type="button" onclick="tpChange('${prefix}',-1,'d')">−</button><input type="text" id="${prefix}_d" value="${d}" readonly><button type="button" onclick="tpChange('${prefix}',1,'d')">+</button><span class="tp-label">Tage</span></div>` +
        `<div class="tp-seg"><button type="button" onclick="tpChange('${prefix}',-1,'h')">−</button><input type="text" id="${prefix}_h" value="${String(h).padStart(2,'0')}" readonly><button type="button" onclick="tpChange('${prefix}',1,'h')">+</button><span class="tp-label">Stunden</span></div>` +
        `</div>`;
}