*{box-sizing:border-box}

.k39-wrapper{
max-width:1400px;
margin:30px auto;
padding:45px;
background:#fff;
border-radius:20px;
box-shadow:0 8px 35px rgba(0,0,0,.08);
font-family:Arial,Helvetica,sans-serif;
text-align:center;
border-top:4px solid #d90032
}

.k39-wrapper h1{
margin:0;
font-size:38px;
font-weight:800;
color:#111
}

.k39-wrapper h1 span{
color:#d90032
}

.k39-wrapper p{
font-size:22px;
color:#555;
margin:15px 0 35px
}


.k39-upload{
height:310px;
border:3px dashed #aaa;
border-radius:20px;
display:flex;
align-items:center;
justify-content:center;
background:#fff;
position:relative
}


#excelFile{
font-size:16px;
padding:15px;
cursor:pointer
}



#k39-info{
margin-top:30px;
padding:20px;
border:1px solid #ddd;
border-radius:12px;
font-size:20px;
color:#333;
background:#fafafa
}


.k39-size{
margin:30px 0;
display:flex;
justify-content:center;
align-items:center;
gap:20px
}



.k39-buttons{
display:flex;
justify-content:center;
margin-top:15px;
flex-wrap:wrap
}


.k39-buttons button{
height:50px;
min-width:200px;
background:#d90032;
color:#fff;
border:none;
border-radius:8px;
font-size:22px;
font-weight:700;
cursor:pointer;
transition:.3s
}


.k39-buttons button:hover{
background:#b9002b;
transform:translateY(-2px)
}



/* ===== KHU VỰC TEM IN ===== */

#k39-preview{
width:210mm;
display:grid;
grid-template-columns:repeat(3,70mm);
justify-content:center;
background:#fff;
padding:10mm;
box-sizing:border-box;
}


/* ===== KÍCH THƯỚC TEM ===== */

.k39-tem{
position:relative;
width:70mm;
height:45mm;
overflow:hidden;
background:#fff;
border-radius:3mm;
box-sizing:border-box;
page-break-inside:avoid;
}


/* Ảnh nền tem */

.k39-tem img{
position:absolute;
width:100%;
height:100%;
left:0;
top:0;
object-fit:fill;
z-index:1;
border: solid 1px #ececec;
}


/* Tên sản phẩm */

.tem-name{
position:absolute;
top:5mm;
left:25mm;
width:40mm;
height:14mm;
font-size:10px;
font-weight:700;
line-height:1.15;
color:#000;
overflow:hidden;
z-index:5;
}


/* Barcode */

.tem-code{
position:absolute;
left:25mm;
bottom:5mm;
font-size:10px;
font-weight:600;
z-index:5;
margin-left: -60px;
}


/* Giá thường */

.tem-price{
position:absolute;
right:5mm;
bottom:4mm;
font-size:26px;
font-weight:900;
color:#e60000;
z-index:5;
margin-bottom: 12px;
margin-right: 25px;
}


/* Giá cũ SALE */

.tem-old{
position:absolute;
right:10mm;
bottom:15mm;
font-size:9px;
color:#555;
text-decoration:line-through;
z-index:5;
}


/* Giá mới SALE */

.tem-sale{
position:absolute;
right:5mm;
bottom:4mm;
font-size:26px;
font-weight:900;
color:#e60000;
z-index:5;
}


/* ===== IN PDF A4 ===== */

@media print{

#k39-preview{

width:210mm;
grid-template-columns:repeat(3,70mm);
gap:5mm;
padding:10mm;

}


.k39-tem{

width:70mm;
height:45mm;

}

}



.k39-help{
margin-top:40px;
padding:25px;
border-radius:12px;
background:#f1f7ff;
border:1px solid #cfe1ff;
text-align:left;
font-size:18px;
line-height:1.8
}


.k39-help strong{
color:#006cff;
font-size:22px
}



@media(max-width:768px){

.k39-wrapper{
padding:20px
}


.k39-wrapper h1{
font-size:26px
}


.k39-buttons button{
width:100%;
min-width:auto
}


.k39-preview{
grid-template-columns:repeat(1,60mm)
}


.k39-upload{
height:220px
}

}

.tem-old{
position:absolute;
right:35px;
bottom:45px;
font-size:13px;
color:#555;
text-decoration:line-through;
font-weight:bold;
z-index:3
}


.tem-price{
position:absolute;
right:10px;
font-size:22px;
font-weight:900;
color:#e60000;
z-index:3;
margin-bottom:-5px;
}


.tem-name{
position:absolute;
top:96px;
right:8px;
width:55%;
font-size:10px;
font-weight:bold;
line-height:1.2;
z-index:3;
margin-left: -65px;
text-align: left;
}