.wpcf7 label.eacf7-form-label {
    display: flex;
    gap: 8px;
    cursor: pointer;
    flex-direction: column-reverse;

    &.eacf7-label-float-inside,
    &.eacf7-label-float-outside,
    &.eacf7-label-inside-hide {
        .eacf7-label-input:has(.eacf7-tel-country-enabled)~.eacf7-label-content {
            margin-left: 40px;
        }
    }

    .eacf7-label-content {
        display: inline-flex;
        align-items: center;
        gap: 6px;
    }

    .eacf7-field-label {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .eacf7-field-label svg {
        width: 1em;
        height: 1em;
        fill: currentColor;
        vertical-align: -0.125em;
    }

    .eacf7-label-text {
        line-height: 1.4;
    }

    .eacf7-label-tooltip {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-left: 4px;
        cursor: help;
        vertical-align: middle;

        .eacf7-tooltip-trigger {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 16px;
            height: 16px;
            border-radius: 50%;
            background: #e2e8f0;
            color: #475569;
            font-size: 11px;
            font-weight: 700;
            line-height: 1;
            font-family: inherit;
            transition: background 0.2s ease, color 0.2s ease;
        }

        &:hover,
        &:focus {
            .eacf7-tooltip-trigger {
                background: #2563eb;
                color: #ffffff;
            }

            .eacf7-tooltip-bubble {
                visibility: visible;
                opacity: 1;
            }
        }

        .eacf7-tooltip-bubble {
            visibility: hidden;
            opacity: 0;
            position: absolute;
            bottom: calc(100% + 6px);
            left: 50%;
            transform: translateX(-50%);
            background: #1e293b;
            color: #ffffff;
            font-size: 12px;
            font-weight: 400;
            padding: 5px 9px;
            border-radius: 4px;
            white-space: normal;
            min-width: 200px;
            max-width: 50vw;
            text-align: center;
            line-height: 1.35;
            pointer-events: none;
            transition: opacity 0.2s ease, visibility 0.2s ease;
            z-index: 100;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -2px rgba(0, 0, 0, 0.1);

            &::after {
                content: "";
                position: absolute;
                top: 100%;
                left: 50%;
                margin-left: -4px;
                border-width: 4px;
                border-style: solid;
                border-color: #1e293b transparent transparent transparent;
            }
        }
    }

    // ==========================================
    // Label Position & Floating Modes
    // ==========================================

    // 1. Hide Label
    &.eacf7-label-hide .eacf7-label-content {
        display: none !important;
    }

    // 2. Float Inside
    &.eacf7-label-float-inside,
    .eacf7-label-float-inside & {
        position: relative !important;
        display: block !important;
        margin-bottom: 12px;
        flex-direction: column !important;

        .eacf7-label-input {
            display: block;
            width: 100%;
        }

        input:not(:focus):placeholder-shown::placeholder,
        textarea:not(:focus):placeholder-shown::placeholder {
            opacity: 0 !important;
        }

        .eacf7-label-content,
        >span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
            position: absolute !important;
            left: 14px !important;
            top: 50% !important;
            transform: translateY(-50%) !important;
            transform-origin: left top !important;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
            z-index: 2 !important;
            line-height: 1 !important;
        }

        &:has(textarea) .eacf7-label-content,
        &:has(textarea)>span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
            top: 20px !important;
            transform: none !important;
        }

        &:focus-within,
        &:has(input:not(:placeholder-shown)),
        &:has(textarea:not(:placeholder-shown)),
        &:has(.eacf7-has-value),
        &.eacf7-has-value {

            .eacf7-label-content,
            >span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
                top: 6px !important;
                transform: translateY(0) scale(0.78) !important;
                color: var(--eacf7-float-color, #2563eb) !important;
            }
        }
    }

    // 3. Float Outside
    &.eacf7-label-float-outside,
    .eacf7-label-float-outside & {
        position: relative !important;
        display: block !important;
        margin-top: 10px !important;
        margin-bottom: 12px;
        flex-direction: column !important;

        .eacf7-label-input {
            display: block;
            width: 100%;
        }

        input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]),
        select,
        textarea {
            width: 100% !important;
            box-sizing: border-box !important;

            .eacf7-label-tooltip {
                display: none;
            }
        }

        input:not(:focus):placeholder-shown::placeholder,
        textarea:not(:focus):placeholder-shown::placeholder {
            opacity: 0 !important;
        }

        .eacf7-label-content,
        >span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
            position: absolute !important;
            left: 12px !important;
            top: 50% !important;
            transform: translateY(-50%) !important;
            transform-origin: left center !important;
            transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
            z-index: 2 !important;
            line-height: 1 !important;
            background-color: transparent !important;
        }

        &:has(textarea) .eacf7-label-content,
        &:has(textarea)>span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
            top: 20px !important;
            transform: none !important;
        }

        &:focus-within,
        &:has(input:not(:placeholder-shown)),
        &:has(textarea:not(:placeholder-shown)),
        &:has(.eacf7-has-value),
        &.eacf7-has-value {

            .eacf7-label-content,
            >span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
                top: 0 !important;
                transform: translateY(-50%) scale(0.8) !important;
                background: linear-gradient(0deg, var(--eacf7-float-bg, #ffffff) 51%, transparent 49%) !important;
                padding: 0 5px !important;
                border-radius: 2px !important;
                font-weight: 600 !important;
                color: var(--eacf7-float-color, #2563eb) !important;
            }
        }
    }

    // 4. Inside & Hide on Text
    &.eacf7-label-inside-hide {
        position: relative !important;
        display: block !important;
        margin-bottom: 12px;
        flex-direction: column !important;

        .eacf7-label-input {
            display: block;
            width: 100%;
        }

        input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]),
        select,
        textarea {
            width: 100% !important;
            box-sizing: border-box !important;

            .eacf7-label-tooltip {
                display: none;
            }
        }

        input:not(:focus):placeholder-shown::placeholder,
        textarea:not(:focus):placeholder-shown::placeholder {
            opacity: 0 !important;
        }

        .eacf7-label-content,
        >span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
            position: absolute !important;
            left: 14px !important;
            top: 50% !important;
            transform: translateY(-50%) !important;
            pointer-events: none !important;
            transition: opacity 0.3s ease, visibility 0.3s ease !important;
            z-index: 2 !important;
            line-height: 1 !important;
        }

        &:has(textarea) .eacf7-label-content,
        &:has(textarea)>span:first-child:not(.wpcf7-form-control-wrap):not(.eacf7-label-input) {
            top: 20px !important;
            transform: none !important;
        }

        &:has(input:focus),
        &:has(textarea:focus) {
            .eacf7-label-content {
                opacity: 0 !important;
                visibility: hidden !important;
            }
        }

        &:has(input:not(:placeholder-shown)),
        &:has(textarea:not(:placeholder-shown)),
        &:has(.eacf7-has-value),
        &.eacf7-has-value {

            .eacf7-label-content {
                opacity: 0 !important;
                visibility: hidden !important;
            }
        }
    }
}