/* tools/utility-tools/barcode-generator/style.css - Tool-specific styles */

.barcode-display {
    border: 2px solid var(--color-light-gray-2);
    border-radius: var(--border-radius-medium);
    padding: 20px;
    margin: 30px auto;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 150px; /* Ensure some height even if barcode is small */
    max-width: 550px; /* Limit max width of the display area */
    background-color: var(--color-white);
    box-shadow: var(--shadow-small);
    overflow: hidden; /* Hide anything that overflows */
}

.barcode-display svg {
    display: block; /* Remove extra space */
    max-width: 100%; /* Ensure barcode scales within its container */
    height: auto; /* Maintain aspect ratio */
}

/* Adjust specific input field sizes if needed */
#barcodeData {
    font-family: 'Inter', sans-serif;
}

/* Style for the requirement text */
.form-text-muted {
    font-size: 0.85em;
    color: var(--color-dark-gray);
    margin-top: 5px;
    display: block;
}

/* Action buttons grid (reused from common styles) */
.tool-actions {
    display: flex;
    flex-wrap: wrap; /* Allow wrapping on small screens */
    gap: 15px;
    margin-top: 30px;
    justify-content: center; /* Center buttons */
}

.tool-actions .btn {
    flex: 1 1 auto; /* Allow buttons to grow/shrink, with auto basis */
    min-width: 150px; /* Ensure a minimum width */
    max-width: 250px; /* Prevent buttons from becoming too wide on large screens */
}