/* Custom CSS for smaller font and reduced spacing */
        body {
            font-size: 12px; /* Base font size for the body */
        }
        .form-group {
            margin-bottom: 0.5rem; /* Slightly increased margin between form groups for better separation */
        }
        label {
            font-size: 12px; /* Apply 12px font size to labels */
            margin-bottom: 0.2rem; /* Reduce space below labels */
        }

        /* --- Key Styles for Consistent Height --- */
        /* Define a consistent height for all form controls and buttons */
        /* This calc ensures consistency with Bootstrap's rem/em units and padding */
        .form-control,
        .custom-select,
        .btn,
        .input-group-text {
            font-size: 12px; /* Ensure font size is consistent */
            padding: 0.2rem 0.5rem; /* Adjusted padding to decrease height */
            height: calc(1.5em + 0.4rem + 2px); /* Calculate height based on font-size + padding + border */
            /* 1.5em is line-height, 0.4rem is total vertical padding (0.2rem * 2), 2px for borders */
            border-radius: 0.25rem; /* Add border-radius for rounded corners */
        }

        /* Adjustments for buttons specifically */
        .btn-sm {
            padding: 0.2rem 0.5rem; /* Match padding for small buttons */
            font-size: 12px; /* Match font size for small buttons */
            height: calc(1.5em + 0.4rem + 2px); /* Ensure small buttons have the same calculated height */
            border-radius: 0.25rem;
        }

        /* Aligning input-group elements */
        .input-group-append .btn,
        .input-group-prepend .btn,
        .input-group-append .input-group-text,
        .input-group-prepend .input-group-text {
            height: calc(1.5em + 0.4rem + 2px); /* Explicitly set height to match form controls */
            display: flex; /* Use flexbox to center content vertically if needed */
            align-items: center; /* Center content vertically */
            border-radius: 0.25rem; /* Apply border-radius */
        }

        /* Specific border-radius for input group elements to ensure continuity */
        .input-group > .form-control:not(:last-child),
        .input-group > .custom-select:not(:last-child) {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
        }
        .input-group > .form-control:not(:first-child),
        .input-group > .custom-select:not(:first-child) {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }
        .input-group-append .btn,
        .input-group-append .input-group-text {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }
        .input-group-prepend .btn,
        .input-group-prepend .input-group-text {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
        }

        /* Adjust alignment for the "New" button, specifically for vertical alignment */
        .row.no-gutters.align-items-end .col-md-auto.pr-1 .form-group .btn {
            margin-top: 0; /* Remove default margin-top if present */
            margin-bottom: 0; /* Remove default margin-bottom if present */
            /* To precisely align it with inputs, you might need to adjust based on label height */
            /* A more robust way would be to put it in an input-group like the search button */
            /* For now, let's just make sure its height is consistent */
            height: calc(1.5em + 0.4rem + 2px); /* Ensure it matches input height */
        }

        /* Fine-tuning for the "Create" button to align with inputs if it's not within an input-group */
        .col-md-auto.col-sm-2 .form-group .btn {
            height: calc(1.5em + 0.4rem + 2px); /* Ensure it matches input height */
        }

        /* Adjustments for row margins */
        .row {
            margin-bottom: 0.5rem; /* Reduce margin between rows */
        }

        /* Specific alignment for labels to sit correctly above inputs */
        .col-form-label {
            padding-top: calc(0.2rem + 1px); /* Align labels with new smaller inputs padding-top */
            padding-bottom: calc(0.2rem + 1px); /* Align labels with new smaller inputs padding-bottom */
        }