/* Global Styles */  
* {  
   box-sizing: border-box;  
   margin: 0;  
   padding: 0;  
}  
  
body {  
   font-family: Arial, sans-serif;  
   line-height: 1.6;  
   color: #333;  
   background-color: #f9f9f9;  
}  
  
.container {  
   max-width: 1200px;  
   margin: 40px auto;  
   padding: 20px;  
   background-color: #fff;  
   border: 1px solid #ddd;  
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);  
   border-radius: 10px;  
}  
  
.form-and-preview {  
   display: flex;  
   justify-content: space-between;  
   align-items: flex-start;  
}  
  
.form-container {  
   width: 50%;  
   padding: 20px;  
}  
  
.price-tag-preview {  
   width: 45%;  
   padding: 20px;  
   border: 5px solid #007bff; /* Blue thick border */  
   overflow-x: auto;  
}  
  
.price-tag-container {  
   display: grid;  
   grid-template-columns: repeat(4, 1fr); /* 4 tags per row */  
   gap: 10px 0; /* Vertical spacing between rows (reduced) */  
   padding: 10px;  
   width: 7.872in; /* Fit 4 tags across */  
   margin: 0 auto;  
}  
  
.price-tag {  
   position: relative;  
   width: 1.968in; /* Exact width */  
   height: 2.0in; /* Exact height */  
   box-sizing: border-box;  
   padding: 5px;  
   text-align: center;  
   display: flex;  
   flex-direction: column;  
   justify-content: space-between;  
   align-items: center;  
   margin: 0;  
   border-radius: 8px; /* Rounded corners */  
   overflow: hidden; /* Ensure wallpaper stays within bounds */  
   background-image: url('https://almirco.com/pos/tags/back.jpg'); /* Logo wallpaper */  
   background-size: cover; /* Ensure it fits perfectly */  
   background-repeat: no-repeat;  
   background-position: center;  
}  
  
.barcode-container {  
   display: flex;  
   justify-content: center;  
   align-items: center;  
   height: auto; /* Adjust height dynamically */  
}  
  
.barcode {  
   display: block;  
   width: 90%; /* Default width */  
   height: auto; /* Auto-adjust height */  
}  
  
.inline-options {  
   display: flex;  
   align-items: center;  
   gap: 5px;  
   font-size: 10px; /* Small font size for labels */  
}  
  
.price-section {  
   width: 100%; /* Full-width price background */  
   padding: 5px 0;  
   border: 1px solid black; /* Black border */  
   margin-top: 3px; /* Reduced margin-top to make space smaller */  
}  
  
.price {  
   font-weight: bold;  
}  
  
.generate-button,  
.add-button,  
.copy-button {  
   background-color: #007bff;  
   color: white;  
   padding: 8px 15px;  
   border: none;  
   cursor: pointer;  
   border-radius: 5px;  
   margin-right: 10px;  
   margin-top: 10px;  
}  
  
.generate-button:hover,  
.add-button:hover,  
.copy-button:hover {  
   background-color: #0056b3;  
}  
  
.action-buttons {  
   margin-top: 10px;  
}  
  
@media print {  
   @page {  
      size: A4;  
      margin: 1px; /* remove default margins for a full-page layout */  
   }  
   .form-and-preview, .form-container, .price-tag-preview {  
      display: none;  
   }  
   .print-area {  
      display: block !important; /* Ensure print area is visible */  
      width: auto; /* Reset width for printing */  
   }  
   .price-tag-container {  
      width: 7.872in; /* Adjust to fit 4 tags per row */  
   }  
   .price-tag {  
      page-break-inside: avoid;  
   }  
}