
/* Tracking Document - Frontend */
.td-wrap{max-width:980px;margin:24px auto;padding:0 14px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;}
.td-card{background:#fff;padding:18px 18px 22px;box-sizing:border-box;}
.td-card--border{border:2px solid #000;}
.td-round{border-radius:18px;}
.td-headline{background:#ffd400;color:#000;font-weight:800;padding:10px 12px;text-align:center;border:2px solid #000;margin-bottom:14px;}
.td-form{display:block}
.td-label{display:block;font-weight:700;margin:10px 0 6px}
.td-input{width:100%;padding:10px 12px;border:2px solid #000;border-radius:10px;font-size:16px;box-sizing:border-box}
.td-btn-row{display:flex;justify-content:center;margin-top:16px}
.td-btn{background:#000;color:#fff;border:0;padding:12px 30px;border-radius:999px;font-weight:800;cursor:pointer}
.td-msg{padding:14px;border:2px solid #000;border-radius:14px}
.td-msg--error{background:#fff2f2}

.td-result-top{display:grid;grid-template-columns:120px 1fr 180px;gap:14px;align-items:center;margin-bottom:10px}
.td-photo img{width:120px;height:150px;object-fit:cover;border:2px solid #000;border-radius:12px}
.td-photo-placeholder{width:120px;height:150px;border:2px dashed #000;border-radius:12px;display:flex;align-items:center;justify-content:center}
.td-top-head{font-size:18px;font-weight:900}
.td-permit-id{border:2px solid #000;border-radius:14px;padding:10px}
.td-permit-id-label{font-weight:800;font-size:12px;text-transform:uppercase}
.td-permit-id-val{font-weight:900;font-size:18px}

.td-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin-top:14px}
.td-grid>div{border:2px solid #000;border-radius:12px;padding:10px}
.td-k{display:block;font-weight:800;font-size:12px;text-transform:uppercase}
.td-v{display:block;font-weight:700;margin-top:4px}

.td-section{margin-top:16px}
.td-section-title{display:block;background:#ffd400;color:#000;font-weight:900;padding:8px 10px;border:2px solid #000;border-radius:12px;text-align:center;margin-bottom:10px}
.td-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:720px){
  .td-result-top{grid-template-columns:1fr;justify-items:center;text-align:center}
  .td-permit-id{width:100%}
  .td-grid,.td-grid--2{grid-template-columns:1fr}
}
