/**
 * JCOGS Image Pro - Edit Connection Styles
 * ========================================
 * Styles for the cache connection editing interface.
 * Provides enhanced visual feedback for disabled fields and form states.
 * 
 * @category   ExpressionEngine Add-on
 * @package    JCOGS Image Pro
 * @author     JCOGS Design <contact@jcogs.net>
 * @copyright  Copyright (c) 2021 - 2025 JCOGS Design
 * @license    https://jcogs.net/add-ons/license/jcogs_img_pro
 * @version    2.0.6
 * @link       https://JCOGS.net/
 * @since      2.0.0
 */

/* Edit Connection Specific Styles */
.edit-connection-form .disabled-field {
    background-color: #f8f9fa;
    color: #6c757d;
    cursor: not-allowed;
}

.edit-connection-form .disabled-field:focus {
    box-shadow: none;
    border-color: #e1e7ed;
}

/* Read-only field indicators */
.edit-connection-form .field-readonly {
    position: relative;
}

.edit-connection-form .field-readonly::after {
    content: "Read-only";
    position: absolute;
    top: 0.25rem;
    right: 0.5rem;
    font-size: 0.75rem;
    color: #8892a4;
    background: #f8f9fa;
    padding: 0.125rem 0.25rem;
    border-radius: 2px;
    pointer-events: none;
}

/* Adapter group visibility animations */
.edit-connection-form [data-group] {
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

.edit-connection-form [data-group]:not([style*="display: none"]) {
    opacity: 1;
    visibility: visible;
}

/* Connection info header */
.edit-connection-header {
    border-bottom: 1px solid #e1e7ed;
    padding-bottom: 1rem;
    margin-bottom: 1.5rem;
}

.edit-connection-header h3 {
    margin: 0 0 0.5rem 0;
    color: #384551;
    font-weight: 600;
}

.edit-connection-header .connection-type-badge {
    display: inline-block;
    background: #e8f4ff;
    color: #1f7dc4;
    padding: 0.25rem 0.75rem;
    border-radius: 12px;
    font-size: 0.875rem;
    font-weight: 500;
    margin-left: 0.5rem;
}

/* Form field improvements */
.edit-connection-form .form-group {
    margin-bottom: 1.5rem;
}

.edit-connection-form .form-control[disabled] {
    background-color: #f8f9fa;
    opacity: 0.7;
}

.edit-connection-form .field-description {
    font-size: 0.875rem;
    color: #6c757d;
    margin-top: 0.25rem;
    line-height: 1.4;
}

/* Path field specific styling */
.edit-connection-form .path-field {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
    font-size: 0.875rem;
}

.edit-connection-form .path-field::placeholder {
    color: #adb5bd;
    font-style: italic;
}
