/* ==================================================================================
   KEEPGREEN COMPONENT LIBRARY - FORMS
   ==================================================================================
   Form control components with BEM naming convention.
   Extracted from inline styles across plant forms, identity pages, and task forms.

   Usage: Apply classes to form controls, floating labels, and input groups.
   Example: <input class="kg-form-control kg-form-control--rounded" />
   ================================================================================== */

/* ==================================================================================
   FORM CONTROLS - BASE
   ================================================================================== */

.kg-form-control {
    border: 0;
    background: var(--kg-color-gray-50);
}

.kg-form-control--rounded {
    border-radius: var(--kg-radius-xl); /* 12px */
}

.kg-form-control--rounded-sm {
    border-radius: var(--kg-radius-md); /* 8px */
}

/* Bootstrap form-control focus override */
.kg-form-control:focus,
.form-control.kg-form-control--rounded:focus {
    background-color: var(--kg-color-white) !important;
    box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.1);
    border: 1px solid var(--kg-color-success) !important;
}

/* Form select focus states */
.form-select.kg-form-control:focus,
.form-select.kg-form-control--rounded:focus {
    border-color: #a5d6a7;
    box-shadow: 0 0 0 0.25rem rgba(46, 125, 50, 0.1);
}

/* Floating label color when focused or filled */
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-select:focus ~ label {
    color: var(--kg-color-success-dark);
}

/* ==================================================================================
   FORM FLOATING LABELS
   ================================================================================== */

.kg-form-floating {
    margin-bottom: var(--kg-spacing-md);
}

.kg-form-floating .form-control {
    border: 0;
    background: var(--kg-color-gray-50);
    border-radius: var(--kg-radius-xl);
}

/* ==================================================================================
   FORM SELECT (Dropdowns)
   ================================================================================== */

.kg-form-select {
    width: auto;
    max-width: 250px;
    border-radius: var(--kg-radius-xl);
}

/* ==================================================================================
   TEXTAREA
   ================================================================================== */

.kg-textarea {
    resize: vertical;
    min-height: 100px;
    border: 0;
    background: var(--kg-color-gray-50);
    border-radius: var(--kg-radius-xl);
}

/* ==================================================================================
   BUTTON GROUPS
   ================================================================================== */

.kg-btn-group {
    border-radius: var(--kg-radius-lg); /* 10px */
    overflow: hidden;
}

/* ==================================================================================
   PLANT SEARCH INPUT (Homepage)
   ================================================================================== */

.kg-plant-search-input {
    border-radius: var(--kg-radius-md); /* 8px */
}

/* ==================================================================================
   VALIDATION FEEDBACK
   ================================================================================== */

.kg-validation-summary {
    border-radius: var(--kg-radius-xl);
    margin-bottom: var(--kg-spacing-md);
}

/* ==================================================================================
   HONEYPOT ANTI-BOT FIELD (Security)
   ================================================================================== */

.kg-honeypot {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
}

/* ==================================================================================
   TRANSITION UTILITIES
   ================================================================================== */

.kg-transition-all {
    transition: all var(--kg-transition-base);
}

/* ==================================================================================
   RESPONSIVE UTILITIES
   ================================================================================== */

/* ==================================================================================
   INPUT GROUP UTILITIES
   ================================================================================== */

.kg-input-group__input-left {
    border-radius: var(--kg-radius-xl) 0 0 var(--kg-radius-xl);
}

.kg-input-group__text-right {
    border-radius: 0 var(--kg-radius-xl) var(--kg-radius-xl) 0;
}

/* ==================================================================================
   RESPONSIVE OVERRIDES
   ================================================================================== */

@media (max-width: 576px) {
    .kg-form-card {
        padding: var(--kg-spacing-2xl) !important;
    }

    .kg-form-heading {
        font-size: var(--kg-font-size-2xl);
    }
}