/* محدود کردن استایل‌ها فقط به فرم‌های خاص */
.custom-form {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    .custom-form {
        font-size: 16px;
    }
}

.custom-form .row {
    margin-right: unset;
    margin-left: unset;
}

.custom-form .boot_font {
    font-family: 'bootstrap-icons' !important;
}

/* -------- فرم‌ها -------- */
.custom-form input.form-control,
.custom-form select.form-control,
.custom-form textarea.form-control {
    border-radius: 0.5rem;
    padding: 0.75rem 1rem;
    border: 2px solid #ced4da;
    background-color: var(--bg-input);
    color: var(--text-input);
    transition: all 0.3s ease;
    box-shadow: none;
}

    /* حالت معتبر */
    .custom-form input.form-control.valid,
    .custom-form select.form-control.valid,
    .custom-form textarea.form-control.valid {
        border-color: var(--accent-color-filed);
        background-color: transparent;
    }

    /* حالت انتخاب شده */
    .custom-form input.form-control:focus,
    .custom-form select.form-control:focus,
    .custom-form textarea.form-control:focus,
    .custom-form .btn:focus,
    .custom-form .btn:active:focus,
    .custom-form .btn-link.nav-link:focus,
    .custom-form .form-check-input:focus {
        border-color: var(--accent-color);
        background-color: transparent;
        box-shadow: 0 0 0 0.05rem var(--accent-color-light);
    }

/* کانتینر فرم Floating */
.custom-form .form-group {
    position: relative;
    margin-bottom: 1.5rem;
}

    .custom-form .form-group .control-label {
        position: absolute;
        top: 0.75rem;
        right: 0.75rem;
        font-size: 1rem;
        color: var(--placeholder-color);
        pointer-events: none;
        transition: all 0.2s ease-out;
        background-color: transparent;
        padding: 0 0.25rem;
    }

        .custom-form .form-group .control-label.active {
            top: -0.7rem;
            right: 0.7rem;
            background-color: var(--bg-page);
        }

/* حالت خطا */
.custom-form input.input-validation-error,
.custom-form select.input-validation-error,
.custom-form textarea.input-validation-error {
    border-color: #b33642 !important;
}

/* تم لایت */
.custom-form:root {
    --bg-input: #ffffff;
    --text-input: #212529;
    --accent-color: #0d6efd;
    --accent-color-filed: rgb(77 133 48);
    --accent-color-light: rgba(13, 110, 253, 0.25);
    --placeholder-color: #6c757d;
    --bg-page: #f8f9fa;
}

/* تم دارک */
.custom-form[data-theme="dark"] {
    --bg-input: #212529;
    --text-input: #f8f9fa;
    --accent-color: #0d6efd;
    --accent-color-filed: rgb(77 133 48);
    --accent-color-light: rgba(13, 110, 253, 0.5);
    --placeholder-color: #adb5bd;
    --bg-page: #121212;
}

/* Tooltip */
.custom-form .tooltip-icon {
    position: relative;
    cursor: pointer;
}

    .custom-form .tooltip-icon::after {
        content: attr(data-tooltip);
        position: absolute;
        background-color: #333;
        color: #fff;
        padding: 4px 8px;
        border-radius: 4px;
        white-space: nowrap;
        font-size: 0.85rem;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s;
        z-index: 10;
    }

    .custom-form .tooltip-icon:hover::after {
        opacity: 1;
    }

    .custom-form .tooltip-icon.tooltip-right::after {
        top: 50%;
        left: 100%;
        transform: translateY(-50%) translateX(6px);
    }

    .custom-form .tooltip-icon.tooltip-left::after {
        top: 50%;
        right: 100%;
        transform: translateY(-50%) translateX(-6px);
    }

    .custom-form .tooltip-icon:not(.tooltip-right):not(.tooltip-left)::after {
        bottom: 100%;
        left: 50%;
        transform: translateX(-50%) translateY(-6px);
    }