/* ============================
   Form Styling Improvements
   ============================ */

/* -------------------------------------
   Tooltip Hint Icons
   ------------------------------------- */

/* Hint icon styling - positioned next to label */
.form-hint-icon {
    cursor: help;
    opacity: 0.5;
    font-size: 0.875em;
    transition: opacity 0.15s ease-in-out;
    vertical-align: baseline;
    position: relative;
    top: -1px;
    margin-left: 0.25rem;
}

.form-hint-icon:hover,
.form-hint-icon:focus {
    opacity: 1;
    color: var(--bs-primary);
}

/* Ensure label and icon are inline */
.form-group label,
.form-group .control-label {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.125rem;
}

/* -------------------------------------
   Compact Form Spacing
   ------------------------------------- */

/* Tighter spacing between form groups */
.form-group,
.mb-3:has(.form-control, .form-select, .form-check) {
    margin-bottom: 0.75rem !important;
}

/* -------------------------------------
   Select2 Adjustments
   ------------------------------------- */

/* Ensure Select2 matches form-control height */
.select2-container--bootstrap-5 .select2-selection {
    min-height: calc(1.5em + 0.75rem + 2px);
}

/* -------------------------------------
   Tooltip Customization
   ------------------------------------- */

/* Ensure tooltips are readable */
.tooltip {
    --bs-tooltip-max-width: 250px;
}

.tooltip-inner {
    text-align: left;
    padding: 0.5rem 0.75rem;
}

/* -------------------------------------
   Dark Mode Adjustments
   ------------------------------------- */

[data-bs-theme="dark"] {
    .form-hint-icon {
        opacity: 0.5;
    }
    
    .form-hint-icon:hover,
    .form-hint-icon:focus {
        opacity: 0.8;
    }
}