﻿/* =========================
   GLOBAL
========================= */
.items-wrapper {
    width: 100%;
}

/* =========================
   TABLE DEFAULT (DESKTOP)
========================= */
.items-table input {
    width: 100%;
}
.items-table tr:hover {
    transform: scale(1.01);
}

#logoPreview,
#signaturePreview {
    min-height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    #logoPreview img,
    #signaturePreview img {
        max-height: 80px;
        max-width: 100%;
    }

/* =========================
   MOBILE FIX
========================= */
/*@media (max-width: 768px) {*/
@media (max-width: 800px) {

    #itemsTable thead {
        display: none;
    }

    #itemsTable,
    #itemsTable tbody,
    #itemsTable tr,
    #itemsTable td {
        display: block;
        width: 100%;
    }

        #itemsTable tr {
            margin-bottom: 16px;
            border: 1px solid #e5e7eb;
            padding: 14px;
            border-radius: 12px;
            background: #fff;
        }

        #itemsTable td {
            display: flex;
            align-items: center;
            justify-content: space-between;
            border: none !important;
            padding: 8px 0;
            gap: 10px;
        }

            /* 🔥 LABEL KIRI */
            #itemsTable td::before {
                content: attr(data-label);
                font-weight: 600;
                color: #374151;
                flex: 1;
            }

            /* 🔥 INPUT / VALUE KANAN */
            #itemsTable td > * {
                flex: 2;
                text-align: right;
            }

        #itemsTable input,
        #itemsTable textarea {
            width: 100%;
            text-align: right;
        }

        /* 🔥 BUTTON HAPUS FULL */
        #itemsTable td:last-child {
            display: block;
        }

            #itemsTable td:last-child::before {
                display: none;
            }

        #itemsTable .btn {
            width: 100%;
        }

        /* 🔥 HILANGKAN DUPLICATE LABEL */
        #itemsTable td label {
            display: none !important;
        }
}