/* ===========================
   ENHANCED FORM STATES
   =========================== */

/* Base input styling with transitions */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="date"],
input[type="datetime-local"],
input[type="month"],
input[type="time"],
input[type="week"],
textarea,
select,
.form-control,
.form-select {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    background: var(--bg-input);
    border: 2px solid var(--border-primary);
    border-radius: var(--radius-md);
    font-size: var(--text-base);
    color: var(--text-primary);
    font-family: var(--font-sans);
    transition: all var(--transition-fast);
    box-sizing: border-box;
}

/* Hover state - subtle feedback */
input[type="text"]:not(:focus):hover,
input[type="email"]:not(:focus):hover,
input[type="url"]:not(:focus):hover,
input[type="number"]:not(:focus):hover,
input[type="password"]:not(:focus):hover,
input[type="search"]:not(:focus):hover,
input[type="tel"]:not(:focus):hover,
input[type="date"]:not(:focus):hover,
input[type="datetime-local"]:not(:focus):hover,
input[type="month"]:not(:focus):hover,
input[type="time"]:not(:focus):hover,
input[type="week"]:not(:focus):hover,
textarea:not(:focus):hover,
select:not(:focus):hover,
.form-control:not(:focus):hover,
.form-select:not(:focus):hover {
    background: var(--bg-input-hover);
    border-color: var(--border-hover);
}

/* Focus state - ring glow effect */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="date"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
textarea:focus,
select:focus,
.form-control:focus,
.form-select:focus {
    outline: none;
    border-color: var(--border-focus);
    box-shadow: 0 0 0 3px var(--overlay-primary);
    background: var(--bg-input);
}

/* Disabled state */
input:disabled,
textarea:disabled,
select:disabled,
.form-control:disabled,
.form-select:disabled {
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
    cursor: not-allowed;
    opacity: 0.6;
}

/* Read-only state */
input:read-only,
textarea:read-only,
select:read-only,
.form-control:read-only,
.form-select:read-only {
    background: var(--bg-tertiary);
    cursor: default;
}

/* Textarea specific */
textarea,
.form-control.textarea {
    min-height: 100px;
    resize: vertical;
}

/* Help text */
.help-text {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    margin-top: var(--space-2);
}

/* Form group spacing */
.form-group {
    margin-bottom: var(--space-6);
}

/* Form row - side-by-side inputs */
.form-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-4);
}

/* Labels */
label {
    display: block;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--space-2);
}

.form-group label {
    color: var(--text-secondary);
}

/* ===========================
   CHECKBOX AND RADIO INPUTS
   =========================== */

/* Checkbox and radio - auto width */
input[type="checkbox"],
input[type="radio"] {
    width: auto;
    margin-right: var(--space-2);
    cursor: pointer;
}

/* Checkbox/radio labels */
label:has(input[type="checkbox"]),
label:has(input[type="radio"]) {
    display: flex;
    align-items: center;
    font-weight: 400;
}

/* Bootstrap form-check compatibility */
.form-check-input {
    background-color: var(--bg-input);
    border-color: var(--border-primary);
    cursor: pointer;
}

.form-check-input:checked {
    background-color: var(--color-primary-600);
    border-color: var(--color-primary-600);
}

.form-check-input:focus {
    border-color: var(--border-focus);
    box-shadow: 0 0 0 3px var(--overlay-primary);
}

.form-check-label {
    color: var(--text-primary);
    cursor: pointer;
}

/* ===========================
   INPUT GROUPS
   =========================== */

.input-group {
    background: transparent;
    display: flex;
}

.input-group-text {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border: 2px solid var(--border-primary);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
}

/* ===========================
   MODAL FORM OVERRIDES
   =========================== */

/* Modal form elements */
.modal input:not([type="checkbox"]):not([type="radio"]),
.modal textarea,
.modal select,
.modal .form-control,
.modal .form-select {
    background: var(--bg-input);
    color: var(--text-primary);
    border-color: var(--border-primary);
}

.modal input:focus,
.modal textarea:focus,
.modal select:focus,
.modal .form-control:focus,
.modal .form-select:focus {
    border-color: var(--border-focus);
    box-shadow: 0 0 0 3px var(--overlay-primary);
}

/* ===========================
   ADDITIONAL UTILITY CLASSES
   =========================== */

/* Generic form classes */
.form-input,
.form-textarea {
    background: var(--bg-input);
    color: var(--text-primary);
    border: 2px solid var(--border-primary);
    border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4);
    transition: all var(--transition-fast);
}

.form-input:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--border-focus);
    box-shadow: 0 0 0 3px var(--overlay-primary);
}

/* Table info compatibility */
.table-info {
    color: var(--text-primary);
}