@use "foundations/colors/colors_definitions";

/* @settings

name: Fancy-a-Story
id: fancy-a-story
settings:
    - 
        id: colors
        title: Colors
        type: heading
        collapsed: true
        level: 1
    -
        id: fas-adaptive-accent
        title: Adaptive accent
        description: Dynamically adapt the accent color based on the background color. Aims at having a better contrast for dark accent color in dark mode, or light accent color in light mode.
        type: class-toggle
        default: false
    -
        id: fas-theme-dark-print
        title: Print with color scheme
        description: Export notes to PDF using the current color scheme. This option doesn't synchronize with the current mode being used, you have to manually change it. Custom colors for dark mode won't work.
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Dark
                value: fas-theme-dark-print
            - 
                label: Light
                value: fas-theme-light-print

    - 
        id: theme-variant-light
        title: Light color scheme
        description: Select from a list of existing themes, or create your own by choosing custom
        type: class-select
        allowEmpty: false
        default: fas-silver-light
        options:
            - 
                label: Art deco
                value: fas-art-deco
            - 
                label: Automn
                value: fas-automn
            - 
                label: Coffee
                value: fas-coffee-light
            - 
                label: Candy
                value: fas-candy
            - 
                label: Canyon
                value: fas-canyon
            - 
                label: Ice
                value: fas-ice
            - 
                label: Meadow
                value: fas-meadow
            - 
                label: Silver
                value: fas-silver-light
            - 
                label: Custom
                value: fas-custom-light
    - 
        id: theme-variant-dark
        title: Dark color scheme
        description: Select from a list of existing themes, or create your own by choosing custom
        type: class-select
        allowEmpty: false
        default: fas-silver-dark
        options:
            - 
                label: Art deco
                value: fas-art-deco
            - 
                label: Arctic
                value: fas-artic
            - 
                label: Atom
                value: fas-atom
            - 
                label: Chocolate
                value: fas-chocolate
            - 
                label: Coffee
                value: fas-coffee-dark
            - 
                label: Forest
                value: fas-forest
            - 
                label: Mystic
                value: fas-mystic
            - 
                label: Navy
                value: fas-navy
            - 
                label: Silver
                value: fas-silver-dark
            - 
                label: Swamp
                value: fas-swamp
            - 
                label: Underwater
                value: fas-unwerwater
            - 
                label: Volcano
                value: fas-volcano
            - 
                label: Custom
                value: fas-custom-dark
    - 
        id: fas-opposite-bg
        title: Opposite background
        description: Enable to use a light (resp. dark) app background in dark (resp. light) mode.
        type: class-toggle
        default: false
    - 
        id: custom-color-base-00
        title: Custom - Primary
        description: Color of the primary background (--color-base-00)
        type: variable-themed-color
        format: hex
        opacity: false
        default-light: '#{colors_definitions.$default-primary-light}'
        default-dark: '#{colors_definitions.$default-text-dark}'
    - 
        id: custom-color-base-100
        title: Custom - Text
        description: Color of the text (--color-base-100)
        type: variable-themed-color
        format: hex
        opacity: false
        default-light: '#{colors_definitions.$default-text-light}'
        default-dark: '#{colors_definitions.$default-primary-dark}'
    -
        id: custom-color-space
        title: Custom - Gradient color space
        description: Color space used in the color-mix() function creating the palette. They all give different effects for the colors between the primary background and the text foreground.
        type: variable-select
        default: srgb-linear
        options:
            - srgb-linear
            - srgb
            - lab
            - hsl
            - hwb

    - 
        id: rainbow-settings
        title: Rainbow settings
        type: heading
        collapsed: true
        level: 2
    - 
        id: rainbow-brightness
        title: Rainbow text brightness
        type: variable-number
        default: 1
    - 
        id: rainbow-saturation
        title: Rainbow text saturation
        type: variable-number
        default: 1

    - 
        id: note-accent
        title: Note accent colors
        type: heading
        collapsed: true
        level: 2
    -
        id: note-accent-1
        title: Note accent Color 1
        type: variable-themed-color
        opacity: false
        format: hsl-split
        default-light: '#ef476f'
        default-dark: '#ce3f61'
    -
        id: note-accent-2
        title: Note accent Color 2
        type: variable-themed-color
        opacity: false
        format: hsl-split
        default-light: '#f78c6b'
        default-dark: '#d57a5e'
    -
        id: note-accent-3
        title: Note accent Color 3
        type: variable-themed-color
        opacity: false
        format: hsl-split
        default-light: '#ffba1a'
        default-dark: '#dca119'
    -
        id: note-accent-4
        title: Note accent Color 4
        type: variable-themed-color
        opacity: false
        format: hsl-split
        default-light: '#0a916e'
        default-dark: '#07a47b'
    -
        id: note-accent-5
        title: Note accent Color 5
        type: variable-themed-color
        opacity: false
        format: hsl-split
        default-light: '#118ab2'
        default-dark: '#0d76a3'
    -
        id: note-accent-6
        title: Note accent Color 6
        type: variable-themed-color
        opacity: false
        format: hsl-split
        default-light: '#073b4c'
        default-dark: '#1f5e6e'

            
    - 
        id: accessibility
        title: Accessibility
        type: heading
        collapsed: true
        level: 1
    - 
        id: fas-accessibility
        title: Enable Accessibility variant
        description: This option makes the vault easier to read, with sans serif fonts, and increased font size and weight.
        type: class-toggle
        default: false
    - 
        id: fas-sans-serif
        title: Use sans serif fonts
        type: class-toggle
        default: false
    - 
        id: fas-bigger-font
        title: Increase default font size and weight
        type: class-toggle
        default: false
    - 
        id: fas-bg-textures
        title: Background textures
        description: Enable the background texture in the sidebars.
        type: class-toggle
        default: true
    - 
        id: fas-float-inline-margin
        title: Inline margin (left/right) for float elements
        description: Float elements are, for example, the fas-infobox callout, the polaroid callout, floating images, etc.
        type: variable-number
        format: px
        default: 12
    - 
        id: scrollbar-width-base
        title: Scrollbars width
        type: variable-number
        format: px
        default: 10
    -
        id: icon-opacity-inactive
        title: Icon opacity in inactive tabs
        type: variable-number-slider
        default: 0.3
        min: 0
        max: 1
        step: 0.05



    - 
        id: workspace
        title: Workspace
        type: heading
        collapsed: true
        level: 1
    - 
        id: status-bar-position
        title: Status bar position
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Default on hover
                value: fas-status-bar-default-hover
            - 
                label: Top
                value: fas-status-bar-top
            - 
                label: Ribbon
                value: fas-status-bar-ribbon
    -
        id: ribbon-position
        title: Ribbon position
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Floating horizontal, bottom
                value: fas-ribbon-horizontal-floating
            - 
                label: Floating horizontal, bottom, on hover
                value: fas-ribbon-horizontal-floating-hover
    -
        id: fas-left-toggle-button-in-root
        title: Left sidebar toggle button out of ribbon
        type: class-toggle
        default: false
    -
        id: fas-vault-menu-top
        title: Vault menu at the top
        type: class-toggle
        default: false
    -
        id: show-note-header-on-hover
        title: Show note header on hover
        type: variable-select
        default: disable
        options:
            - 
                label: Yes
                value: enable
            - 
                label: No
                value: disable
    -
        id: crop-root-corners
        title: Also crop the corners of the central pane
        type: variable-select
        default: disable
        options:
            - 
                label: Yes
                value: enable
            - 
                label: No
                value: disable


    -
        id: app-background-image
        title: App background image
        type: heading
        collapsed: true
        level: 2
    -
        id: fas-background-image
        title: Enable app background image
        type: class-toggle
        default: false
    -
        id: fas-background-image-url
        title: Image url
        type: variable-text
        default: url("")
    -
        id: fas-background-image-blur
        title: Blur
        type: variable-number
        default: 0
        format: px
    -
        id: fas-background-image-opacity
        title: Opacity
        type: variable-number-slider
        default: 1
        min: 0
        max: 1
        step: 0.05
    -
        id: fas-background-image-elements-opacity
        title: Content opacity
        type: variable-number-slider
        default: 1
        min: 0
        max: 1
        step: 0.05
        
    - 
        id: file-explorer
        title: File explorer
        type: heading
        collapsed: true
        level: 2
    - 
        id: fas-rainbow-folders
        title: Rainbow folders
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable
    -
        id: nav-item-children-margin-start
        title: Indentation for files and folders
        description: Left indentation of each child of a folder in the File explorer and the Bookmarks tree
        type: variable-number
        format: px
        default: 12
    -
        id: nav-item-padding-block
        title: Vertical spacing for files titles
        description: Padding of each file title in the File explorer and the Bookmarks tree
        type: variable-number
        format: px
        default: 4
    -
        id: nav-item-parent-padding-block
        title: Vertical spacing for folders titles
        description: Padding of each folder title in the File explorer and the Bookmarks tree
        type: variable-number
        format: px
        default: 4


    - 
        id: sidebar
        title: Sidebars
        type: heading
        collapsed: true
        level: 2
    -
        id: fas-bookmark-tabs
        title: Bookmark style for the tabs
        type: variable-select
        default: flat
        options:
            - 
                label: Disable
                value: disable
            - 
                label: Flat
                value: flat
            - 
                label: Volume
                value: volume
    - 
        id: sidedock-tab-header-padding-bottom
        title: Gap between the selected tab and the content in the sidebars
        description: If you're annoyed by the fact that they touch each other, increase this value
        type: variable-number-slider
        format: px
        default: 0
        min: 0
        max: 6
    -
        id: sidedock-inset-border-color
        title: Color of the inside border
        type: variable-text
        default: var(--background-secondary)
    -
        id: fas-sidebar-texture-custom
        title: Use custom sidebar texture
        type: class-toggle
        default: false
    - 
        id: sidebar-texture-custom
        title: Sidebar texture url
        type: variable-text
        default: url("")
    -
        id: sidebar-texture-blend-custom
        title: Sidebar texture blending mode, in light mode
        type: variable-select
        default: multiply
        options:
            - normal
            - color
            - color-burn
            - color-dodge
            - darken
            - difference
            - exclusion
            - hard-light
            - hue
            - lighten
            - luminosity
            - multiply
            - overlay
            - saturation
            - screen
            - soft-light
    -
        id: sidebar-texture-blend-custom-dark
        title: Sidebar texture blending mode, in dark mode
        type: variable-select
        default: multiply
        options:
            - normal
            - color
            - color-burn
            - color-dodge
            - darken
            - difference
            - exclusion
            - hard-light
            - hue
            - lighten
            - luminosity
            - multiply
            - overlay
            - saturation
            - screen
            - soft-light
    -
        id: sidebar-texture-size-custom
        title: Sidebar texture size
        type: variable-text
        default: 500px
    -
        id: sidebar-texture-position-custom
        title: Sidebar texture position
        type: variable-text
        default: center center
    -
        id: sidebar-texture-opacity-custom
        title: Sidebar texture opacity
        type: variable-number
        default: 1
    -
        id: fas-file-explorer-decoration-custom
        title: Use custom file explorer decoration
        type: class-toggle
        default: false
    - 
        id: file-explorer-decoration-custom
        title: File explorer decoration url
        type: variable-text
        default: url("")
    -
        id: file-explorer-decoration-blend-custom
        title: File explorer decoration blending mode, in light mode
        type: variable-select
        default: normal
        options:
            - normal
            - color
            - color-burn
            - color-dodge
            - darken
            - difference
            - exclusion
            - hard-light
            - hue
            - lighten
            - luminosity
            - multiply
            - overlay
            - saturation
            - screen
            - soft-light
    -
        id: file-explorer-decoration-blend-custom-dark
        title: File explorer decoration blending mode, in dark mode
        type: variable-select
        default: normal
        options:
            - normal
            - color
            - color-burn
            - color-dodge
            - darken
            - difference
            - exclusion
            - hard-light
            - hue
            - lighten
            - luminosity
            - multiply
            - overlay
            - saturation
            - screen
            - soft-light
    -
        id: file-explorer-decoration-size-custom
        title: File explorer decoration  size
        type: variable-text
        default: 150px
    -
        id: file-explorer-decoration-position-custom
        title: File explorer decoration position
        type: variable-text
        default: right bottom
    -
        id: file-explorer-decoration-opacity-custom
        title: File explorer decoration opacity
        type: variable-number
        default: 0.1
    - 
        id: file-explorer-hover-animation
        title: Animate the hover effect in the file explorer
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable



    - 
        id: editor
        title: Editor
        type: heading
        collapsed: true
        level: 1
    -
        id: file-line-width
        title: File line width
        type: variable-number
        format: px
        default: 700
    - 
        id: fas-compact
        title: Compact mode
        description: Enable to use a more compact layout in the editor, reducing multiple spacingg
        markdown: true
        type: class-toggle
    - 
        id: fas-floating-mode-button
        title: Floating button to switch note modes
        type: variable-select
        default: disable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable
    - 
        id: fas-floating-mode-button-position
        title: Floating button position
        type: variable-select
        default: right
        options:
            - 
                value: left
                label: Left
            - 
                value: right
                label: Right
    - 
        id: fas-highlight-active-note
        title: Highlight active note
        description: Inspired by the plugin Limelight, code adapted by @tif
        type: class-toggle
        default: false

    -
        id: note-background-image
        title: Background image
        type: heading
        collapsed: true
        level: 2
    -
        id: fas-note-background-image
        title: Enable note background image for all notes
        description: Use the cssclass "no-background" to disable in specific notes. If this option feature is disabled globally, you can use the cssclass "background-img" to enable it in specific notes.
        type: class-toggle
        default: false
    -
        id: fas-note-background-image-url
        title: Image url
        type: variable-text
        default: url("")
    -
        id: fas-note-background-image-blend-mode-light
        title: Blend mode, light mode
        type: variable-select
        default: normal
        options:
            - normal
            - multiply
            - screen
            - overlay
            - darken
            - lighten
            - color-dodge
            - color-burn
            - hard-light
            - soft-light
            - difference
            - exclusion
            - hue
            - saturation
            - color
            - luminosity
            - plus-darker
            - plus-lighter
    -
        id: fas-note-background-image-blend-mode-dark
        title: Blend mode, dark mode
        type: variable-select
        default: normal
        options:
            - normal
            - multiply
            - screen
            - overlay
            - darken
            - lighten
            - color-dodge
            - color-burn
            - hard-light
            - soft-light
            - difference
            - exclusion
            - hue
            - saturation
            - color
            - luminosity
            - plus-darker
            - plus-lighter
    -
        id: fas-note-background-image-repeat
        title: Repeat background image
        type: variable-select
        default: no
        options:
            - yes
            - no
    -
        id: fas-note-background-image-blur
        title: Blur
        type: variable-number
        default: 0
        format: px
    -
        id: fas-note-background-image-opacity
        title: Opacity
        type: variable-number-slider
        default: 1
        min: 0
        max: 1
        step: 0.05
    -
        id: fas-note-background-image-brightness-light
        title: Brightness (light mode)
        type: variable-number
        default: 1
    -
        id: fas-note-background-image-brightness-dark
        title: Brightness (dark mode)
        type: variable-number
        default: 1
    -
        id: fas-print-note-background
        title: Export to PDF
        description: Use the note's background when exporting the note to PDF.
        type: class-toggle
        default: false

    -
        id: banners
        title: Banners
        type: heading
        collapsed: true
        level: 2
    - 
        id: banner-height
        title: Banner height
        type: variable-number
        default: 300
        format: px
    - 
        id: banner-slope-angle
        title: Banner slope angle
        type: variable-number
        default: 4
        format: deg
    - 
        id: banner-print-width
        title: Banner width in print mode
        type: variable-select
        default: full-bleed
        options:
            - 
                value: full-bleed
                label: Full bleed
            - 
                value: margins
                label: Inside margins
    - 
        id: fas-banner-edit-mode
        title: Banner style in edit mode
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                value: fas-banner-edit-hide
                label: Hidden
            - 
                value: fas-banner-edit-small
                label: Small (100px)
            - 
                value: fas-banner-edit-icon
                label: Icon

    - 
        id: callouts
        title: Callouts
        type: heading
        collapsed: true
        level: 2
    - 
        id: fas-callout-cite-alt
        title: Theme quote callout
        description: Enable to use the Fancy-a-Story specific style for the quote and cite callouts (the style can still be used with `cite-fas` or `quote-fas` callout types if you keep this option disabled).
        markdown: true
        type: class-toggle
    - 
        id: fas-callout-infobox
        title: Use > [!infobox]
        description: Enable the usage of `infobox` as an alias for `fas-infobox`
        markdown: true
        type: class-toggle
    -
        id: callout-default
        title: Default color for callouts
        type: variable-select
        default: var(--color-blue-rgb)
        options:
            -
                value: var(--color-gray-rgb)
                label: Gray
            -
                value: var(--color-brown-rgb)
                label: Brown
            -
                value: var(--color-red-rgb)
                label: Red
            -
                value: var(--color-orange-rgb)
                label: Orange
            -
                value: var(--color-yellow-rgb)
                label: Yellow
            -
                value: var(--color-green-rgb)
                label: Green
            -
                value: var(--color-cyan-rgb)
                label: Cyan
            -
                value: var(--color-blue-rgb)
                label: Blue
            -
                value: var(--color-purple-rgb)
                label: Purple
            -
                value: var(--color-pink-rgb)
                label: Pink

    - 
        id: code
        title: Code
        type: heading
        collapsed: true
        level: 2
    - 
        id: limit-code-to-80-chars
        title: Limit code to 80 characterss
        description: Use the standard brought to us by the IBM's 1928 punch card format and limit the number of characters to 80 for your code (only affects reading mode).
        type: variable-select
        default: disable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable
    

    - 
        id: headings
        title: Headings
        type: heading
        collapsed: true
        level: 2
    - 
        id: header-color
        title: Color for the headings
        type: class-select
        allowEmpty: true
        default: fas-hue
        options:
            - 
                label: Hue
                value: fas-headings-hue
            - 
                label: Complementary hue
                value: fas-headings-complement
            - 
                label: Accent color
                value: fas-headings-accent
            - 
                label: Rainbow
                value: fas-headings-rainbow
    - 
        id: h1
        title: First level headings (H1)
        type: heading
        collapsed: true
        level: 3
    - 
        id: header-style-h1
        title: Appearance
        type: class-select
        allowEmpty: true
        default: fas-h1-display
        options:
            - 
                label: Display
                value: fas-h1-display
            - 
                label: Display - left aligned
                value: fas-h1-display-left-aligned
            - 
                label: Stroke
                value: fas-h1-stroke
            - 
                label: Stroke - left aligned
                value: fas-h1-stroke-left-aligned
    -
        id: h1-color
        title: Color
        type: variable-themed-color
        opacity: false
        format: hex
        default-light: '#000000'
        default-dark: '#d9d9d9'
    - 
        id: h1-size
        title: Font size (em)
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.802
        format: em
    - 
        id: h1-weight
        title: Weight
        description: Not affecting the Stroke appearance
        type: variable-number
        default: 700
    - 
        id: h1-variant
        title: Variant
        type: variable-select
        default: normal
        options:
            - normal
            - small-caps
            - all-small-caps
            - petite-caps
            - all-petite-caps
            - unicase
            - titling-caps
    - 
        id: h1-line-height
        title: Line height
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.2
    - 
        id: h1-style
        title: Style
        type: variable-select
        default: normal
        options:
            - normal
            - italic
            - oblique
        
    - 
        id: h2
        title: Second level headings (H2)
        type: heading
        collapsed: true
        level: 3
    - 
        id: header-style-h2
        title: Appearance
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Display
                value: fas-h2-display
            - 
                label: Display - left aligned
                value: fas-h2-display-left-aligned
            - 
                label: Stroke
                value: fas-h2-stroke
            - 
                label: Stroke - left aligned
                value: fas-h2-stroke-left-aligned
    -
        id: h2-color
        title: Color
        type: variable-themed-color
        opacity: false
        format: hex
        default-light: '#000000'
        default-dark: '#d9d9d9'
    - 
        id: h2-size
        title: Font size (em)
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.602
        format: em
    - 
        id: h2-weight
        title: Weight
        description: Not affecting the Stroke appearance
        type: variable-number
        default: 600
    - 
        id: h2-variant
        title: Variant
        type: variable-select
        default: normal
        options:
            - normal
            - small-caps
            - all-small-caps
            - petite-caps
            - all-petite-caps
            - unicase
            - titling-caps
    - 
        id: h2-line-height
        title: Line height
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.2
    - 
        id: h2-style
        title: Style
        type: variable-select
        default: normal
        options:
            - normal
            - italic
            - oblique
    - 
        id: h3
        title: Third level headings (H3)
        type: heading
        collapsed: true
        level: 3
    - 
        id: header-style-h3
        title: Appearance
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Display
                value: fas-h3-display
            - 
                label: Display - left aligned
                value: fas-h3-display-left-aligned
            - 
                label: Stroke
                value: fas-h3-stroke
            - 
                label: Stroke - left aligned
                value: fas-h3-stroke-left-aligned
    -
        id: h3-color
        title: Color
        type: variable-themed-color
        opacity: false
        format: hex
        default-light: '#000000'
        default-dark: '#d9d9d9'
    - 
        id: h3-size
        title: Font size (em)
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.424
        format: em
    - 
        id: h3-weight
        title: Weight
        description: Not affecting the Stroke appearance
        type: variable-number
        default: 600
    - 
        id: h3-variant
        title: Variant
        type: variable-select
        default: normal
        options:
            - normal
            - small-caps
            - all-small-caps
            - petite-caps
            - all-petite-caps
            - unicase
            - titling-caps
    - 
        id: h3-line-height
        title: Line height
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.3
    - 
        id: h3-style
        title: Style
        type: variable-select
        default: normal
        options:
            - normal
            - italic
            - oblique
    - 
        id: h4
        title: Fourth level headings (H4)
        type: heading
        collapsed: true
        level: 3
    - 
        id: header-style-h4
        title: Appearance
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Display
                value: fas-h4-display
            - 
                label: Display - left aligned
                value: fas-h4-display-left-aligned
            - 
                label: Stroke
                value: fas-h4-stroke
            - 
                label: Stroke - left aligned
                value: fas-h4-stroke-left-aligned
    -
        id: h4-color
        title: Color
        type: variable-themed-color
        opacity: false
        format: hex
        default-light: '#000000'
        default-dark: '#d9d9d9'
    - 
        id: h4-size
        title: Font size (em)
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.266
        format: em
    - 
        id: h4-weight
        title: Weight
        description: Not affecting the Stroke appearance
        type: variable-number
        default: 600
    - 
        id: h4-variant
        title: Variant
        type: variable-select
        default: normal
        options:
            - normal
            - small-caps
            - all-small-caps
            - petite-caps
            - all-petite-caps
            - unicase
            - titling-caps
    - 
        id: h4-line-height
        title: Line height
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.4
    - 
        id: h4-style
        title: Style
        type: variable-select
        default: normal
        options:
            - normal
            - italic
            - oblique
    - 
        id: h5
        title: Fifth level headings (H5)
        type: heading
        collapsed: true
        level: 3
    - 
        id: header-style-h5
        title: Appearance
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Display
                value: fas-h5-display
            - 
                label: Display - left aligned
                value: fas-h5-display-left-aligned
            - 
                label: Stroke
                value: fas-h5-stroke
            - 
                label: Stroke - left aligned
                value: fas-h5-stroke-left-aligned
    -
        id: h5-color
        title: Color
        type: variable-themed-color
        opacity: false
        format: hex
        default-light: '#000000'
        default-dark: '#d9d9d9'
    - 
        id: h5-size
        title: Font size (em)
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.125
        format: em
    - 
        id: h5-weight
        title: Weight
        description: Not affecting the Stroke appearance
        type: variable-number
        default: 600
    - 
        id: h5-variant
        title: Variant
        type: variable-select
        default: normal
        options:
            - normal
            - small-caps
            - all-small-caps
            - petite-caps
            - all-petite-caps
            - unicase
            - titling-caps
    - 
        id: h5-line-height
        title: Line height
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.5
    - 
        id: h5-style
        title: Style
        type: variable-select
        default: normal
        options:
            - normal
            - italic
            - oblique
    - 
        id: h6
        title: Sixth level headings (H6)
        type: heading
        collapsed: true
        level: 3
    - 
        id: header-style-h6
        title: Appearance
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                label: Display
                value: fas-h6-display
            - 
                label: Display - left aligned
                value: fas-h6-display-left-aligned
            - 
                label: Stroke
                value: fas-h6-stroke
            - 
                label: Stroke - left aligned
                value: fas-h6-stroke-left-aligned
    -
        id: h6-color
        title: Color
        type: variable-themed-color
        opacity: false
        format: hex
        default-light: '#000000'
        default-dark: '#d9d9d9'
    - 
        id: h6-size
        title: Font size (em)
        description: Not affecting the Display appearance
        type: variable-number
        default: 1
        format: em
    - 
        id: h6-weight
        title: Weight
        description: Not affecting the Stroke appearance
        type: variable-number
        default: 600
    - 
        id: h6-variant
        title: Variant
        type: variable-select
        default: normal
        options:
            - normal
            - small-caps
            - all-small-caps
            - petite-caps
            - all-petite-caps
            - unicase
            - titling-caps
    - 
        id: h6-line-height
        title: Line height
        description: Not affecting the Display appearance
        type: variable-number
        default: 1.5
    - 
        id: h6-style
        title: Style
        type: variable-select
        default: normal
        options:
            - normal
            - italic
            - oblique

    - 
        id: h-display-settings
        title: Headings Display settings
        type: heading
        collapsed: true
        level: 3
    - 
        id: h-display-line-height
        title: Line height (em)
        type: variable-number
        default: 1.2
        format: em
    -
        id: h-display-font
        title: Font family
        type: variable-text
        default: TT2020StyleE, Courier, monospace
    - 
        id: h-display-color
        title: Text color
        type: variable-themed-color
        format: hex
        opacity: false
        default-dark: '#1f1f1f'
        default-light: '#e7e7e7'
    - 
        id: h-display-background
        title: Background color
        type: variable-themed-color
        format: hex
        opacity: false
        default-dark: '#d9d9d9'
        default-light: '#000'
    - 
        id: h1-display-size
        title: H1 size (em)
        type: variable-number
        default: 3
        format: em
    - 
        id: h2-display-size
        title: H2 size (em)
        type: variable-number
        default: 2.8
        format: em
    - 
        id: h3-display-size
        title: H3 size (em)
        type: variable-number
        default: 2.6
        format: em
    - 
        id: h4-display-size
        title: H4 size (em)
        type: variable-number
        default: 2.4
        format: em
    - 
        id: h5-display-size
        title: H5 size (em)
        type: variable-number
        default: 2.2
        format: em
    - 
        id: h6-display-size
        title: H6 size (em)
        type: variable-number
        default: 2
        format: em

    - 
        id: hr
        title: Horizontal rules (HR)
        type: heading
        collapsed: true
        level: 2
    -
        id: fas-hr
        title: Enable custom HR
        type: class-toggle
        default: true
    - 
        id: hr-color
        title: Color
        type: variable-themed-color
        format: hex
        opacity: false
        default-dark: '#505050'
        default-light: '#c5c5c5'
    -
        id: hr-ornament
        title: Ornament shape url
        description: This image is used as a mask based on its alpha channel
        type: variable-text
        default: url("")
    - 
        id: hr-ornament-size
        title: Ornament size (em)
        description: Size of the ornament
        type: variable-number
        default: 1.5
        format: em
    - 
        id: hr-ornament-right
        title: Ornament right position (px)
        description: Space left at the right of the ornament
        type: variable-number
        default: 40
        format: px
    - 
        id: hr-ornament-padding
        title: Ornament padding (px)
        description: Space between the ornament and the line, on its left and right
        type: variable-number
        default: 5
        format: px
    - 
        id: hr-ornament-shadow-size
        title: Ornament shadow size (px)
        description: Size of the fading gradient of the line when going behind the ornament
        type: variable-number
        default: 10
        format: px

            
    - 
        id: images
        title: Images
        type: heading
        collapsed: true
        level: 2
    - 
        id: image-shadow-offset
        title: Shadow offset (px)
        description: Set to 0 for no shadow
        type: variable-number
        default: 8
        format: px
    - 
        id: image-shadow-stripe-thickness
        title: Shadow stripe thickness (px)
        type: variable-number
        default: 2
        format: px
    - 
        id: image-shadow-stripe-gap
        title: Shadow stripe gap (px)
        type: variable-number
        default: 4
        format: px
    - 
        id: image-centered
        title: Center images
        description: If enabled, the images will be centered if they are not in a paragraph (one empty line before and after)
        type: variable-select
        default: disable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable

    - 
        id: links
        title: Links
        type: heading
        collapsed: true
        level: 2
    -
        id: link-decoration
        title: Internal link decoration
        type: variable-select
        default: doodle
        options:
            - none
            -
                value: doodle
                label: doodle (on hover)
            - underline
            - overline
            - underline overline
    -
        id: link-external-decoration
        title: External link decoration
        type: variable-select
        default: underline
        options:
            - none
            -
                value: doodle
                label: doodle (on hover)
            - underline
            - overline
            - underline overline
            
    - 
        id: lists
        title: Lists
        type: heading
        collapsed: true
        level: 2
    -
        id: fas-bullet-style
        title: Bullet style
        type: variable-select
        default: doodle
        options:
            - normal
            - doodle
    -
        id: fas-checkbox-style
        title: Checkbox style
        type: variable-select
        default: doodle
        options:
            - normal
            - doodle
    - 
        id: fas-alternative-checkboxes
        title: Alternative checkboxes
        type: variable-select
        default: doodle
        options:
            - 
                value: doodle
                label: Enable - doodle
            - 
                value: normal
                label: Enable - normal
            - 
                value: disable
                label: Disable
    - 
        id: fas-rainbow-lists
        title: Rainbow lists markers
        type: variable-select
        default: disable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable
            
    - 
        id: pdfs
        title: PDFs
        type: heading
        collapsed: true
        level: 2
    -
        id: pdf-blend-mode-light
        title: Blend mode, light mode
        description: multiply mode suggested
        type: variable-select
        default: normal
        options:
            - normal
            - multiply
            - screen
            - overlay
            - darken
            - lighten
            - color-dodge
            - color-burn
            - hard-light
            - soft-light
            - difference
            - exclusion
            - hue
            - saturation
            - color
            - luminosity
            - plus-darker
            - plus-lighter
    -
        id: pdf-blend-mode-dark
        title: Blend mode, dark mode
        description: screen mode suggested, with "Invert in dark mode" enabled
        type: variable-select
        default: normal
        options:
            - normal
            - multiply
            - screen
            - overlay
            - darken
            - lighten
            - color-dodge
            - color-burn
            - hard-light
            - soft-light
            - difference
            - exclusion
            - hue
            - saturation
            - color
            - luminosity
            - plus-darker
            - plus-lighter
    - 
        id: pdf-invert-dark
        title: Invert in dark mode
        type: variable-select
        default: disable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable
            
    - 
        id: properties
        title: Properties
        type: heading
        collapsed: true
        level: 2
    - 
        id: properties-columns
        title: Number of columns
        type: variable-number
        default: 2
        min: 1
        max: 4
    -
        id: metadata-label-width
        title: Label width
        description: The width of the properties labels (also called keys, or names)
        type: variable-number
        default: 9
        format: em


    - 
        id: table
        title: Tables
        type: heading
        collapsed: true
        level: 2
    -
        id: table-style
        title: Table style
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                value: fas-border-tables
                label: With borders
            - 
                value: fas-plain-tables
                label: Plain
    - 
        id: table-margin-inline
        title: Table position
        type: variable-select
        default: auto
        options:
            - 
                value: 0 auto
                label: Left
            - 
                value: auto
                label: Centered
            - 
                value: auto 0
                label: Right
    - 
        id: table-source-min-width
        title: Wrap in source mode
        type: variable-select
        default: max-content
        options:
            - 
                value: max-content
                label: No
            - 
                value: min-content
                label: Yes

    - 
        id: typography
        title: Typography
        type: heading
        collapsed: true
        level: 2
    -
        id: bold-color
        title: Bold text color
        type: variable-themed-color
        opacity: false
        format: rgb
        default-light: '#000000'
        default-dark: '#ffffff'
    -
        id: italic-color
        title: Italic text color
        type: variable-themed-color
        opacity: false
        format: rgb
        default-light: '#000000'
        default-dark: '#ffffff'
    -
        id: text-highlight-bg
        title: Highlight background color
        type: variable-themed-color
        opacity: true
        format: rgb
        default-light: '#ffd00066'
        default-dark: '#ffd00066'
    -
        id: text-highlight-fg
        title: Highlight text color
        type: variable-themed-color
        opacity: false
        format: rgb
        default-light: '#000000'
        default-dark: '#ffffff'
    - 
        id: pen-highlighter-effect
        title: Pen highlighter effect
        type: variable-select
        default: disable
        options:
            - 
                value: enable
                label: Enable
            - 
                value: disable
                label: Disable


    - 
        id: community-plugins
        title: Community plugins
        type: heading
        collapsed: true
        level: 1
    - 
        id: fantasy-statblocks
        title: Fantasy Statblocks
        type: heading
        collapsed: false
        level: 2
    -
        id: fas-statblocks-custom
        title: Change the style of Fantasy Statblocks
        type: class-toggle
        default: false
    - 
        id: fas-statblocks-accent-class
        title: Accent color
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                value: fas-statblocks-accent
                label: Accent
            - 
                value: fas-statblocks-hue
                label: Hue
            - 
                value: fas-statblocks-complement
                label: Complementary hue


    - 
        id: skins
        title: Skins
        type: heading
        collapsed: true
        level: 1
    - 
        id: fas-skin-select
        title: Skin style
        type: class-select
        allowEmpty: true
        default: none
        options:
            - 
                value: fas-skin-art-deco
                label: Art Deco
            - 
                value: fas-skin-medieval
                label: Medieval
            - 
                value: fas-skin-sci-fi
                label: Sci-fi (wip)

    - 
        id: art-deco
        title: Art Deco
        type: heading
        collapsed: true
        level: 2
    -
        id: art-deco-fonts
        type: info-text
        markdown: true
        title: Art Deco fonts
        description: "To used the fonts setup with this skins as shown in the screenshot, add [art_deco_fonts.css](https://github.com/ElsaTam/obsidian-fancy-a-story/blob/main/snippets/skins/art_deco_fonts.css) to your [snippets folder](https://help.obsidian.md/Extending+Obsidian/CSS+snippets)."
    - 
        id: art-deco-color
        title: Color for the art deco elements
        type: variable-select
        allowEmpty: false
        default: var(--art-deco-color-custom)
        options:
            - 
                label: Accent
                value: var(--color-accent)
            - 
                label: Custom
                value: var(--art-deco-color-custom)
    - 
        id: art-deco-color-custom
        title: Custom color for the art deco elements
        type: variable-themed-color
        format: hex
        opacity: false
        default-light: '#161547'
        default-dark: '#e3c24a'
    - 
        id: art-deco-style-hr
        title: Change the horizontal lines
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-fonts
        title: Change the fonts
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-file-explorer-icons
        title: Add file explorer icons for files and folders
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Both
            - 
                value: folders
                label: Folders
            - 
                value: files
                label: Files
            - 
                value: disable
                label: None
    - 
        id: art-deco-style-sidebar-corners
        title: Change the corners in the sidebars
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-tab-flags
        title: Change the style of the sidebar tabs
        description: The bookmark style for the tabs must be enabled
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-file-header
        title: Add a decoration under the file header
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-ribbon-deco
        title: Add a decoration in the left ribbon
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-callouts
        title: Style the callouts
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-sidebar-textures
        title: Change the sidebar textures
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-properties
        title: Style the properties
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-lists
        title: Style the list items bullets
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-h-display
        title: Style the first headings
        description: The style must be set to Display
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-status-bar
        title: Style the status bar
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-empty-note
        title: Add a special styling to empty spaces (when no file is open)
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    - 
        id: art-deco-style-root-tabs
        title: Style the tabs in the main space
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No

    - 
        id: art-deco-h-display-settings
        title: Headings Display settings
        type: heading
        collapsed: true
        level: 3
    -
        id: h-display-art-deco-font
        title: Font family
        type: variable-text
        default: ParkLaneNF, Limelight, Impact, Inter
    - 
        id: h-display-art-deco-color
        title: Text color
        type: variable-themed-color
        format: hex
        opacity: false
        default-dark: '#e3c24a'
        default-light: '#161547'
    - 
        id: h-display-art-deco-weight
        title: Weight
        type: variable-number
        default: 500

    - 
        id: sci-fi
        title: Science-fiction
        type: heading
        collapsed: true
        level: 2
    - 
        id: sci-fi-style-fonts
        title: Change the fonts
        type: variable-select
        default: enable
        options:
            - 
                value: enable
                label: Yes
            - 
                value: disable
                label: No
    

    
    


    - 
        id: additional-content
        title: Additional content
        type: heading
        collapsed: true
        level: 1
    -
        id: additional-fonts
        type: info-text
        markdown: true
        title: Additional fonts
        description: "Multiple elements of this theme can use specific fonts if they are available. To download the required fonts, you can add the file [additional_fonts.css](https://github.com/ElsaTam/obsidian-fancy-a-story/blob/main/snippets/additional_fonts.css) to your [snippets folder](https://help.obsidian.md/Extending+Obsidian/CSS+snippets). This file can be very heavy. If you don't plan on using all of them, I would recommend deleting the unecessary @font-face from the snippet. You can see how which font is used [in the doc](https://elsatam.github.io/obsidian-fancy-a-story/docs/stylesettings/stylesettings.html#additional-fonts)"
    -
        id: canvas-node-bundle
        type: info-text
        markdown: true
        title: Canvas node tags
        description: "Usage of tags to define specific styling for canvas card can be very powerful. However, it requires a code that can cause performance issues. Also, such styling come as independant snippets. You can add the file [canvas-node-bundle](https://github.com/ElsaTam/obsidian-fancy-a-story/blob/main/snippets/canvas/canvas-node-bundle.css) to your [snippets folder](https://help.obsidian.md/Extending+Obsidian/CSS+snippets) to download all the effects. Or choose individual ones from [this list](https://github.com/ElsaTam/obsidian-fancy-a-story/tree/main/snippets/canvas)."


*/

// Disable the settings when not used
body:not(.fas-custom-light) .style-settings-container [data-id="custom-color-base-00"] .theme-light,
body:not(.fas-custom-light) .style-settings-container [data-id="custom-color-base-100"] .theme-light,
body:not(.fas-custom-dark) .style-settings-container [data-id="custom-color-base-00"] .theme-dark,
body:not(.fas-custom-dark) .style-settings-container [data-id="custom-color-base-100"] .theme-dark,
body:not(.fas-custom-light):not(.fas-custom-dark)
    .style-settings-container
    [data-id="custom-color-base-00"]
    .setting-item-info,
body:not(.fas-custom-light):not(.fas-custom-dark)
    .style-settings-container
    [data-id="custom-color-base-100"]
    .setting-item-info,
body:not(.fas-custom-light):not(.fas-custom-dark) .style-settings-container [data-id="custom-color-space"],
body.fas-accessibility .style-settings-container [data-id="fas-sans-serif"],
body.fas-accessibility .style-settings-container [data-id="fas-bigger-font"],
body:not(.fas-sidebar-texture-custom) .style-settings-container [data-id="sidebar-texture-custom"],
body:not(.fas-sidebar-texture-custom) .style-settings-container [data-id="sidebar-texture-blend-custom"],
body:not(.fas-sidebar-texture-custom) .style-settings-container [data-id="sidebar-texture-blend-custom-dark"],
body:not(.fas-sidebar-texture-custom) .style-settings-container [data-id="sidebar-texture-size-custom"],
body:not(.fas-sidebar-texture-custom) .style-settings-container [data-id="sidebar-texture-position-custom"],
body:not(.fas-sidebar-texture-custom) .style-settings-container [data-id="sidebar-texture-opacity-custom"],
body:not(.fas-file-explorer-decoration-custom) .style-settings-container [data-id="file-explorer-decoration-custom"],
body:not(.fas-file-explorer-decoration-custom)
    .style-settings-container
    [data-id="file-explorer-decoration-blend-custom"],
body:not(.fas-file-explorer-decoration-custom)
    .style-settings-container
    [data-id="file-explorer-decoration-blend-custom-dark"],
body:not(.fas-file-explorer-decoration-custom)
    .style-settings-container
    [data-id="file-explorer-decoration-size-custom"],
body:not(.fas-file-explorer-decoration-custom)
    .style-settings-container
    [data-id="file-explorer-decoration-position-custom"],
body:not(.fas-file-explorer-decoration-custom)
    .style-settings-container
    [data-id="file-explorer-decoration-opacity-custom"],
body.fas-ribbon-horizontal-floating .style-settings-container [data-id="fas-left-toggle-button-in-root"],
body.fas-ribbon-horizontal-floating-hover .style-settings-container [data-id="fas-left-toggle-button-in-root"] {
    opacity: 0.5;
    pointer-events: none;
}
@container not style(--fas-bookmark-tabs: disable) {
    .style-settings-container [data-id="sidedock-tab-header-padding-bottom"] {
        opacity: 0.5;
        pointer-events: none;
    }
}
@container not style(--fas-rainbow-folders: enable) {
    .style-settings-container [data-id="rainbow-brightness"],
    .style-settings-container [data-id="rainbow-saturation"] {
        opacity: 0.5;
        pointer-events: none;
    }
}

// Show color for some text inputs
.style-settings-container [data-id="sidedock-inset-border-color"] .setting-item-control::before {
    content: "";
    display: block;
    height: 1em;
    width: 1em;
    background-color: var(--sidedock-inset-border-color);
    border-radius: 50%;
}

// Color the headers
@supports (color: hsl(from white h s l)) {
    .style-settings-container {
        > .style-settings-container {
            --current-h1-color: hsl(from var(--h1-color) h calc(s * 0.5) l);
        }
        > .style-settings-container > .style-settings-container {
            --current-h1-color: hsl(from var(--h1-color) h calc(s * 0.3) l);
        }
    }
}
@supports not (color: hsl(from white h s l)) {
    .style-settings-container {
        > .style-settings-container {
            --current-h1-color: color-mix(in hsl, var(--h1-color), var(--color-gray) 50%);
        }
        > .style-settings-container > .style-settings-container {
            --current-h1-color: color-mix(in hsl, var(--h1-color), var(--color-gray) 70%);
        }
    }
}

.style-settings-container {
    --h1-color: var(--text-accent);
    --current-h1-color: var(--h1-color);
    --pickr-size: 1.3em;

    .style-settings-heading .setting-item-name {
        color: var(--current-h1-color);
    }

    // Visualise the hiearchical structure
    & .style-settings-container {
        margin-left: 0;
        padding: var(--size-4-1) var(--size-2-3) 0 var(--size-4-6);
        border-left: 1px solid var(--current-h1-color);
    }

    // More compact color pickers
    & .pickr button {
        width: var(--pickr-size);
        height: var(--pickr-size);
        &::after,
        &::before {
            border-radius: 50%;
        }
    }
    & .pickr-reset button {
        padding: 4px;
        margin-left: 8px;
        height: fit-content;
        & svg {
            width: var(--pickr-size);
            height: var(--pickr-size);
        }
    }
    & .themed-color-wrapper {
        display: flex;
        gap: 8px;
        & > div {
            margin: 0;
            padding: calc(var(--pickr-size) * 0.3);
            background: var(--color-base-00);
        }
    }
    .themed-color-wrapper > div {
        --background-primary: var(--color-base-00);
    }

    // Title and description on the same line
    & .setting-item:not(.style-settings-info-text) .setting-item-info {
        > div {
            display: inline;
        }
        .setting-item-description:not(:empty)::before {
            content: "";
            border-left: 1px solid var(--color-base-30);
            margin: 0 5px;
            vertical-align: middle;
        }
    }
}
