@import url('./md3base.css');

:root{
    --bg-color: #fefbff;
    --outline-color: #1c1b1d;
    --regular-text-color: #4d4256;
    --header-color: #f2ecee;
    --link-color: #6442d6;
    --tone-bg-color:#f1d3f900;
    --tone-text-color: #1c1b1d;
    --tone-bg-color-hover: #f1d3f99f;
    --status-bg-color: #dcdaf500;
    --status-bg-color-hover: #dcdaf5;
    --status-active-bg-color: #4d425614;
    --status-active-bg-color-hover: #d1cee9;
    --input-bg-color: #f8f1f680;
    --input-bg-color-hover: #f8f1f6;
    --input-bottom-border-color: #4d425680;
    --input-bg-color-focus: #dcdaf5;
    --output-border-color: #e8e0e8;
}

#fox-toggle-fullscreen {
    --icon-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%2321182b'%3E%3Cpath d='M120-120v-320h80v184l504-504H520v-80h320v320h-80v-184L256-200h184v80H120Z'/%3E%3C/svg%3E") var(--h-icon-size);
}

#fox-toggle-fullscreen.active {
    --icon-image-active: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%2321182b'%3E%3Cpath d='m136-80-56-56 264-264H160v-80h320v320h-80v-184L136-80Zm344-400v-320h80v184l264-264 56 56-264 264h184v80H480Z'/%3E%3C/svg%3E") var(--h-icon-size);
}

#fox-open-file{
    --icon-image: url("../icons/md3light/file_open_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
}

#fox-save-file{
    --icon-image: url("../icons/md3light/save_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
}

#fox-rename-file{
    --icon-image: url("../icons/md3light/edit_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
}

#fox-print{
    --icon-image: url("../icons/md3light/print_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
}

#fox-docs{
    --icon-image: url("../icons/md3light/developer_guide_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
}

#fox-duowindow{
    --icon-image: url("../icons/md3light/open_in_new_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
    --icon-image-active: url("../icons/md3light/open_in_new_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
}

#fox-change-theme{
    --icon-image: url("../icons/md3light/palette_24dp_E2E0FB_FILL0_wght400_GRAD0_opsz24.svg") var(--h-icon-size);
}