.mobile-tools-trigger {
    appearance: none;
    background: transparent;
    border: none;
    color: inherit;
    text-align: center;
    cursor: pointer;
    width: 100%;

    @media (min-width: 1051px) {
        display: none;
    }
}

.mobile-tools-sheet {
    & .bottom-sheet-body {
        padding: 0;
    }

    & .tools-section {
        margin: 0;
        padding: 0;
        background: transparent;
    }

    & .tools-megamenu {
        --container-color: var(--background);
        --border-color: var(--ncs-container-strong);
        --main-color: var(--ncs-primary-contrast);
        --main-color-with-opacity: color-mix(in srgb, var(--main-color) 62%, transparent);
        --main-text-color: var(--ncs-on-primary);
        --default-text-color: color-mix(in srgb, var(--text) 62%, transparent);
        --category-text-color: var(--text);
        --small-font-size: var(--font-md);
        --font-size: var(--font-ml);
        --big-font-size: var(--font-xl);
        display: flex;
        flex-direction: column;
        gap: 0;
        max-height: none;

        .dark-mode & {
            --container-color: var(--background);
            --border-color: var(--ncs-container-strong-dark);
        }

        & .tools-selection-description {
            display: none !important;
        }

        & .tools-links {
            display: flex;
            flex-direction: column;
            gap: 8px;
            padding: 8px 16px 24px;
            max-height: none;
            overflow: visible;
            border: none;
            background: transparent;
            box-shadow: none;
        }

        & .tools-item-links {
            display: none;
        }

        & .tools-links-container {
            display: flex !important;
            flex-direction: column;
            gap: 2px;
            margin: 0;
            padding: 8px 0;
            border: none;
            border-radius: 0;
            background: transparent;
            position: static;
            width: 100%;

            &::before,
            &::after {
                display: none;
            }

            &[data-tools-key="translator"] {
                --main-color: var(--ncs-realtime-primary);
                --main-text-color: var(--ncs-realtime-on-primary);

                .dark-mode & {
                    --main-color: var(--ncs-realtime-primary-dark);
                    --main-text-color: var(--ncs-realtime-on-primary-dark);
                }
            }

            &[data-tools-key="transcribe"] {
                --main-color: var(--ncs-transcription-primary);
                --main-text-color: var(--ncs-transcription-on-primary);

                .dark-mode & {
                    --main-color: var(--ncs-transcription-primary-dark);
                    --main-text-color: var(--ncs-transcription-on-primary-dark);
                }
            }

            &[data-tools-key="subtitle"] {
                --main-color: var(--ncs-subtitle-primary);
                --main-text-color: var(--ncs-subtitle-on-primary);

                .dark-mode & {
                    --main-color: var(--ncs-subtitle-primary-dark);
                    --main-text-color: var(--ncs-subtitle-on-primary-dark);
                }
            }

            &[data-tools-key="dubbing"] {
                --main-color: var(--ncs-voiceover-primary);
                --main-text-color: var(--ncs-voiceover-on-primary);

                .dark-mode & {
                    --main-color: var(--ncs-voiceover-primary-dark);
                    --main-text-color: var(--ncs-voiceover-on-primary-dark);
                }
            }

            & + .tools-links-container {
                border-top: 1px solid color-mix(in srgb, var(--text) 8%, transparent);
                margin-top: 4px;
                padding-top: 12px;
            }

            & .category-link {
                list-style: none;
                width: 100%;

                & > :is(a, .category-label) {
                    display: flex;
                    align-items: center;
                    gap: 8px;
                    padding: 10px 12px 6px;
                    background: transparent;
                    border: none;
                    text-decoration: none;
                    cursor: default;
                    width: 100%;

                    & .title {
                        width: 100%;
                        color: var(--main-color) !important;
                        font-size: 1rem !important;
                        font-weight: var(--font-weight-bold);
                        line-height: 1.3;
                        text-transform: none;
                        text-shadow: none;
                    }
                }

                & .description {
                    display: none;
                }
            }

            & li {
                list-style: none;
                width: 100%;

                &:not(.category-link) a {
                    display: flex;
                    flex-direction: column;
                    gap: 4px;
                    padding: 12px;
                    min-height: 48px;
                    border: none;
                    border-radius: 10px;
                    text-decoration: none;
                    color: var(--text) !important;
                    background: transparent;
                    transition: background-color 0.15s ease;
                    width: 100%;
                    align-items: flex-start;
                    justify-content: center;

                    & .title {
                        font-size: 1rem !important;
                        font-weight: var(--font-weight-regular);
                        line-height: 1.3;
                        margin: 0;
                        color: var(--text) !important;
                        text-align: center;
                        text-transform: capitalize;
                        width: 100%;
                    }

                    & .description {
                        font-size: 0.82rem !important;
                        color: var(--default-text-color);
                        line-height: 1.4;
                        text-transform: none;
                        width: 100%;
                    }

                    &:hover,
                    &:active {
                        background-color: color-mix(in srgb, var(--main-color) 10%, transparent);
                    }

                    &:hover .title {
                        color: var(--main-color) !important;
                        text-decoration: none;
                    }
                }
            }
        }
    }
}