<script setup lang="ts">
import {Anchor} from "vuetify";

defineProps<{
    location?: Anchor;
    openDelay?: number;
}>();
</script>

<template>
    <v-tooltip :location="location ?? 'top'" :open-delay="openDelay ?? 200">
        <template #activator="activatorScope">
            <slot name="activator" v-bind="activatorScope" />
        </template>

        <template #default>
            <div class="glass-tooltip glass glass-border">
                <slot />
            </div>
        </template>
    </v-tooltip>
</template>

<style scoped>
:deep(.v-overlay__content) {
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
}

.glass-tooltip {
    background: var(--surface);
    border: 1px solid var(--table-border);
    border-radius: 8px;
    padding: 10px 14px;
    min-width: 180px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--text);
    font-size: 0.85rem;
}
</style>
