body {font-family: 'Roboto', Arial, sans-serif; margin:0; padding:40px; background:#fff;}
.certificate {width:800px; margin:auto; border:2px solid #000; padding:40px; background:#fff;}
.header{text-align:center;margin-bottom:20px;}
.header h1{
  margin:0;
  font-size:36px;
  font-family: 'Montserrat', 'Roboto', Arial, sans-serif;
  font-weight:900;
  letter-spacing:1px;
}
.header .green {color:#23c169;font-family: 'Montserrat', sans-serif;}
.header .black {color:#111;}
.legal-text{font-size:12px;text-align:center;margin:10px 0 30px;}
.section-title{font-weight:bold;font-size:15px;margin-top:20px;border-bottom:1px solid #000;padding-bottom:5px;}
.description[contenteditable] {
  font-size:12px;
  margin-top:10px;
  background: #f9f9f9;
  border: 1px dashed #ccc;
  padding: 4px 8px;
  outline: none;
  min-height: 32px;
  cursor: text;
}
.row-controls{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:11px;}
.row-controls .editable-row-helper {
  flex:1; text-align:right; margin-left:16px;
}
.editable-helper[contenteditable] {
  background: #f9f9f9;
  border: 1px dashed #ccc;
  border-radius:6px;
  padding: 2px 8px;
  outline:none;
  display:inline-block;
  min-width:200px;
  cursor: text;
}
.add-product{margin-top:10px;font-size:12px;}
.checkbox-list{margin-top:10px;font-size:12px;}
.checkbox-list label{display:block;}
.gray-details-table {
  width:100%;
  margin-top:28px;
  background:#f5f5f7;
  border-radius:8px;
  border:1.5px solid #e1e1e1;
  padding: 18px 14px 10px 14px;
  box-sizing: border-box;
}
.gray-details-table table { width:100%; margin:0; background:none; border:none; }
.gray-details-table td { padding:4px; border:none; background:none; }
.details-table { font-size:12px;}
.note{text-align:center;font-size:12px;font-style:italic;margin-top:15px;}
.upload-block{margin-top:20px;text-align:center;}
#logoPreview{max-height:60px;margin:15px auto 0 auto;display:block;}
#logoUploadBlock { transition: opacity 0.3s; }
.floating-row { position: relative; }
.floating-remove-btn {
  position: absolute;
  right: -25px;
  top: 50%;
  transform: translateY(-50%);
  background: #fff0f0;
  color: #e74c3c;
  border: none;
  border-radius: 50%;
  padding: 0 8px;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  line-height: 22px;
  height: 22px;
  width: 22px;
  box-shadow: 0 0 2px #e74c3c20;
  display: inline-block;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s;
  z-index: 2;
}
.floating-remove-btn:hover {
  background: #e74c3c;
  color: #fff;
  box-shadow: 0 0 8px #e74c3c60;
}
#insulationTable {
  width: 100%;
  margin: 0;
  padding: 0;
  border-collapse: collapse;
  table-layout: fixed;
}
#insulationTable th, #insulationTable td {
  border: 1px solid #000;
  padding: 5px 6px;
  font-size: 12px;
}
.area-col { width: 60%; }
.type-col { width: 13.3%; }
.narrow-col { width: 13.3%; }
.narrow2-col { width: 13.4%; }
input[type="text"], input[type="number"], input[type="date"]{
  width:100%;border:none;background:transparent;font-size:12px;
}
select{width:100%;font-size:12px;border:none;background:transparent;}
.outside-buttons {
  display:flex;
  justify-content:center;
  gap:16px;
  margin: 38px auto 0 auto;
  width:800px;
  max-width:96vw;
}
.custom-btn {
  background: #23c169;
  color: #fff;
  border: none;
  font-family:'Montserrat', Arial, sans-serif;
  font-weight: bold;
  font-size:15px;
  padding:8px 22px;
  border-radius: 8px;
  margin: 0 6px;
  cursor:pointer;
  transition: background 0.18s, color 0.18s, box-shadow 0.18s;
  box-shadow:0 2px 12px #23c16910;
}
.custom-btn.secondary {
  background: #e1e1e1;
  color: #222;
  border: 1px solid #bbb;
}
.custom-btn:active {
  background: #1fa857;
}
@media print {
  .floating-remove-btn, #logoUploadBlock, .outside-buttons { display: none !important; }
  .gray-details-table { background: none !important; border: none !important; }
}

body {font-family: 'Roboto', Arial, sans-serif; margin:0; padding:40px; background:#fff;}
.certificate {width:800px; margin:auto; border:2px solid #000; padding:40px; background:#fff;}
.header{text-align:center;margin-bottom:20px;}
.header h1{
  margin:0;
  font-size:36px;
  font-family: 'Montserrat', 'Roboto', Arial, sans-serif;
  font-weight:900;
  letter-spacing:1px;
}
.header .green {color:#23c169;font-family: 'Montserrat', sans-serif;}
.header .black {color:#111;}
.legal-text{font-size:12px;text-align:center;margin:10px 0 30px;}
.section-title{font-weight:bold;font-size:15px;margin-top:20px;border-bottom:1px solid #000;padding-bottom:5px;}
.description[contenteditable] {
  font-size:12px;
  margin-top:10px;
  background: #f9f9f9;
  border: 1px dashed #ccc;
  padding: 4px 8px;
  outline: none;
  min-height: 32px;
  cursor: text;
}
.row-controls{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:11px;}
.row-controls .editable-row-helper {
  flex:1; text-align:right; margin-left:16px;
}
.editable-helper[contenteditable] {
  background: #f9f9f9;
  border: 1px dashed #ccc;
  border-radius:6px;
  padding: 2px 8px;
  outline:none;
  display:inline-block;
  min-width:200px;
  cursor: text;
}
.add-product{margin-top:10px;font-size:12px;}
.checkbox-list{margin-top:10px;font-size:12px;}
.checkbox-list label{display:block;}
.gray-details-table {
  width:100%;
  margin-top:28px;
  background:#f5f5f7;
  border-radius:8px;
  border:1.5px solid #e1e1e1;
  padding: 18px 14px 10px 14px;
  box-sizing: border-box;
}
.gray-details-table table { width:100%; margin:0; background:none; border:none; }
.gray-details-table td { padding:4px; border:none; background:none; }
.details-table { font-size:12px;}
.note{text-align:center;font-size:12px;font-style:italic;margin-top:15px;}
.upload-block{margin-top:20px;text-align:center;}
#logoPreview{max-height:60px;margin:15px auto 0 auto;display:block;}
#logoUploadBlock { transition: opacity 0.3s; }
.floating-row { position: relative; }
.floating-remove-btn {
  position: absolute;
  right: -25px;
  top: 50%;
  transform: translateY(-50%);
  background: #fff0f0;
  color: #e74c3c;
  border: none;
  border-radius: 50%;
  padding: 0 8px;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  line-height: 22px;
  height: 22px;
  width: 22px;
  box-shadow: 0 0 2px #e74c3c20;
  display: inline-block;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s;
  z-index: 2;
}
.floating-remove-btn:hover {
  background: #e74c3c;
  color: #fff;
  box-shadow: 0 0 8px #e74c3c60;
}
#insulationTable {
  width: 100%;
  margin: 0;
  padding: 0;
  border-collapse: collapse;
  table-layout: fixed;
}
#insulationTable th, #insulationTable td {
  border: 1px solid #000;
  padding: 5px 6px;
  font-size: 12px;
}
.area-col { width: 60%; }
.type-col { width: 13.3%; }
.narrow-col { width: 13.3%; }
.narrow2-col { width: 13.4%; }
input[type="text"], input[type="number"], input[type="date"]{
  width:100%;border:none;background:transparent;font-size:12px;
}
select{width:100%;font-size:12px;border:none;background:transparent;}
.outside-buttons {
  display:flex;
  justify-content:center;
  gap:16px;
  margin: 38px auto 0 auto;
  width:800px;
  max-width:96vw;
}
.custom-btn {
  background: #23c169;
  color: #fff;
  border: none;
  font-family:'Montserrat', Arial, sans-serif;
  font-weight: bold;
  font-size:15px;
  padding:8px 22px;
  border-radius: 8px;
  margin: 0 6px;
  cursor:pointer;
  transition: background 0.18s, color 0.18s, box-shadow 0.18s;
  box-shadow:0 2px 12px #23c16910;
}
.custom-btn.secondary {
  background: #e1e1e1;
  color: #222;
  border: 1px solid #bbb;
}
.custom-btn:active {
  background: #1fa857;
}
@media print {
  .floating-remove-btn, #logoUploadBlock, .outside-buttons { display: none !important; }
  .gray-details-table { background: none !important; border: none !important; }
}