/* style.css */

    body {
        font-family: 'Inter', sans-serif;
        background-color: #fee5ff; /* Light pink background */
    }

    /* Custom scrollbar for a touch of pink */
    ::-webkit-scrollbar {
        width: 8px;
    }

    ::-webkit-scrollbar-track {
        background: #fbcfe8; /* Lighter pink */
        border-radius: 10px;
    }

    ::-webkit-scrollbar-thumb {
        background: #db2777; /* Darker pink */
        border-radius: 10px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: #be185d; /* Even darker pink on hover */
    }

    /* Styles for the X icon in the footer */
    .x-icon-footer {
        width: 20px; /* Adjust size as needed */
        height: 20px; /* Adjust size as needed */
        vertical-align: middle; /* Align with text */
        margin-right: 4px; /* Space between icon and text */
        /* filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(93deg) brightness(103%) contrast(103%); /* Make it white for dark background - Removed as X_ICON is now white text on black */
    }

    /* Styles for VRChat icons */
    .vrc-icon {
        width: 300px;
        height: 300px;
        vertical-align: middle;
        margin-right: 8px;
        border-radius: 4px; /* Slightly rounded corners for icons */
    }

    /* Style to force word break for long URLs */
    .url-text-break {
        word-break: break-all;
        flex-grow: 1; /* Allow the text to take available space */
        min-width: 0; /* Important for flex items to shrink */
    }