/****************************************
    PERTO FUNCTIONS CSSS
*******************************************/

/* format_fonts */
body.perto_format_fonts :not(i):not(.fa):not(.material-icons):not(.fas):not(.material-symbols-outlined),
body.perto_format_fonts d2l-menu-item,
body.perto_format_fonts d2l-menu-item-link,
body.perto_format_fonts d2l-button,
body.perto_format_fonts d2l-link,
body.perto_format_fonts d2l-organization-name,
body.perto_format_fonts d2l-organization-info,
body.perto_format_fonts d2l-organization-date,
body.perto_format_fonts d2l-alert,
body.perto_format_fonts d2l-tooltip,
body.perto_format_fonts d2l-tab-panel,
body.perto_format_fonts d2l-empty-state-simple,
body.perto_format_fonts d2l-html-block,
body.perto_format_fonts d2l-card-content,
body.perto_format_fonts d2l-card-content-meta,
body.perto_format_fonts d2l-card-footer-link,
body.perto_format_fonts d2l-object-property-list-item,
body.perto_format_fonts d2l-w2d-work-to-do {
    font-family: Arial, Helvetica, sans-serif !important;
}

/* underline_links */
body.perto_underline_links a,
body.perto_underline_links d2l-link,
body.perto_underline_links d2l-menu-item-link,
body.perto_underline_links d2l-card-footer-link,
body.perto_underline_links d2l-empty-state-action-link {
    text-decoration: underline !important;
    outline: rgba(255, 114, 22, 0.5) solid 2px !important;
    outline-offset: 2px !important;
}

/* underline_titles */
body.perto_underline_titles h1,
body.perto_underline_titles h2,
body.perto_underline_titles h3,
body.perto_underline_titles h4,
body.perto_underline_titles h5,
body.perto_underline_titles h6,
body.perto_underline_titles d2l-organization-name {
    text-decoration: underline !important;
}

/* uppercase_font */
body.perto_uppercase_font,
body.perto_uppercase_font ul li a,
body.perto_uppercase_font button,
body.perto_uppercase_font d2l-button,
body.perto_uppercase_font d2l-link,
body.perto_uppercase_font d2l-menu-item,
body.perto_uppercase_font d2l-tab-internal {
    text-transform: uppercase !important;
}


/*perto_align_text*/
body.perto_align_text_1 *:not(#perto-digital-tool *) {
    text-align: left !important;
}

body.perto_align_text_2 *:not(#perto-digital-tool *) {
    text-align: center !important;
}

body.perto_align_text_3 *:not(#perto-digital-tool *) {
    text-align: right !important;
}

body.perto_align_text_4 *:not(#perto-digital-tool *) {
    text-align: justify !important;
}

/*perto_between_words*/
body.perto_between_words_1 *:not(#perto-digital-tool *) {
    word-spacing: 0.16em !important;
}

body.perto_between_words_2 *:not(#perto-digital-tool *) {
    word-spacing: 0.32em !important;
}

body.perto_between_words_3 *:not(#perto-digital-tool *) {
    word-spacing: 0.64em !important;
}

/*perto_between_paragraphs*/
body.perto_between_paragraphs_1 p:not(#perto-digital-tool p),
body.perto_between_paragraphs_1 li:not(#perto-digital-tool li),
body.perto_between_paragraphs_1 d2l-html-block {
    margin-bottom: 2em !important;
}

body.perto_between_paragraphs_2 p:not(#perto-digital-tool p),
body.perto_between_paragraphs_2 li:not(#perto-digital-tool li),
body.perto_between_paragraphs_2 d2l-html-block {
    margin-bottom: 2.5em !important;
}

body.perto_between_paragraphs_3 p:not(#perto-digital-tool p),
body.perto_between_paragraphs_3 li:not(#perto-digital-tool li),
body.perto_between_paragraphs_3 d2l-html-block {
    margin-bottom: 3em !important;
}

/* perto_text_block_width */
body.perto_text_block_width p:not(#perto-digital-tool p),
body.perto_text_block_width li:not(#perto-digital-tool li),
body.perto_text_block_width d2l-html-block,
body.perto_text_block_width d2l-card-content {
    max-width: 80ch;
    word-break: normal;
    overflow-wrap: break-word;
    white-space: normal;
}

/* high_contrast_dark */
body.perto_high_contrast_dark *:not(#perto-digital-tool *):not(a):not(input):not(d2l-link):not(d2l-input-text):not(d2l-input-search) {
    background-color: #181818 !important;
    color: #fff !important;
}

body.perto_high_contrast_dark input,
body.perto_high_contrast_dark d2l-input-text,
body.perto_high_contrast_dark d2l-input-search {
    color: #fff !important;
    border: solid 2px #fff !important;
    background-color: #181818 !important;
}

body.perto_high_contrast_dark a,
body.perto_high_contrast_dark d2l-link,
body.perto_high_contrast_dark d2l-menu-item-link {
    background-color: #181818 !important;
    color: #fff !important;
    outline: 2px solid #f2a762 !important;
    outline-offset: 1px !important;
}

/* high_contrast_clear */
body.perto_high_contrast_clear *:not(#perto-digital-tool *):not(a):not(input):not(d2l-link):not(d2l-input-text):not(d2l-input-search) {
    color: #27272d !important;
    background-color: #fff !important;
}

body.perto_high_contrast_clear input,
body.perto_high_contrast_clear d2l-input-text,
body.perto_high_contrast_clear d2l-input-search {
    color: #1f2533 !important;
    background-color: #fff !important;
    border: solid 2px #1f2533 !important;
}

body.perto_high_contrast_clear input::placeholder {
    color: #1f2533 !important;
}

body.perto_high_contrast_clear a,
body.perto_high_contrast_clear d2l-link,
body.perto_high_contrast_clear d2l-menu-item-link {
    color: #1f2533 !important;
    background-color: #fff !important;
    outline: 2px solid #f2a762 !important;
    outline-offset: 1px !important;
}

body.perto_high_contrast_clear a svg,
body.perto_high_contrast_clear a svg path {
    fill: #1f2533 !important;
}

/* contrast_mode */
body.perto_contrast_mode *:not(#perto-digital-tool *):not(a):not(d2l-link) {
    background-color: #000 !important;
    color: #fff !important;
}

body.perto_contrast_mode a,
body.perto_contrast_mode d2l-link,
body.perto_contrast_mode d2l-menu-item-link {
    background-color: #000 !important;
    color: #fff !important;
    outline-offset: 1px !important;
}

/* monochromatic */
html.perto_monochromatic {
    -webkit-filter: grayscale(100%) !important;
    filter: grayscale(100%) !important;
}

/* high_saturation */
html.perto_high_saturation {
    filter: contrast(125%) !important;
}

/* low_saturation */
html.perto_low_saturation {
    filter: contrast(50%) !important;
}

/* text_color */
body.perto_color_text p:not(#perto-digital-tool p),
body.perto_color_text li:not(#perto-digital-tool li),
body.perto_color_text span:not(#perto-digital-tool span),
body.perto_color_text label:not(#perto-digital-tool label),
body.perto_color_text d2l-html-block,
body.perto_color_text d2l-card-content,
body.perto_color_text d2l-alert {
    color: var(--perto-select-color_text) !important;
}

/* color_title */
body.perto_color_title h1,
body.perto_color_title h2,
body.perto_color_title h3,
body.perto_color_title h4,
body.perto_color_title h5,
body.perto_color_title h6,
body.perto_color_title d2l-organization-name {
    color: var(--perto-select-color_title) !important;
}

/* color_background */
body.perto_color_background *:not(#perto-digital-tool *) {
    background-color: var(--perto-select-color_background) !important;
}

/* cursor_white */
body.perto_cursor_white {
    cursor: url('../assets/functions/navigation/cursors/cursor_white.svg'), auto !important;
}

body.perto_cursor_white a,
body.perto_cursor_white button,
body.perto_cursor_white label,
body.perto_cursor_white d2l-button,
body.perto_cursor_white d2l-link,
body.perto_cursor_white d2l-tab-internal,
body.perto_cursor_white d2l-menu-item,
body.perto_cursor_white img {
    cursor: url('../assets/functions/navigation/cursors/cursor_white_pointer.svg'), auto !important;
}

/* cursor_black */
body.perto_cursor_black {
    cursor: url('../assets/functions/navigation/cursors/cursor_black.svg'), auto !important;
}

body.perto_cursor_black a,
body.perto_cursor_black button,
body.perto_cursor_black label,
body.perto_cursor_black d2l-button,
body.perto_cursor_black d2l-link,
body.perto_cursor_black d2l-tab-internal,
body.perto_cursor_black d2l-menu-item,
body.perto_cursor_black img {
    cursor: url('../assets/functions/navigation/cursors/cursor_black_pointer.svg'), auto !important;
}

/* keyboard_navigation & smart_navigation */
body.perto_keyboard_navigation *:focus,
body.perto_smart_navigation *:focus {
    outline: solid 3px #639af9 !important;
    border: 2px solid black !important;
    box-shadow: 5px 2px 7px 1px #5c5b5b !important;
    transition: none !important;
}

.perto_smart_navigation_tooltip {
    position: absolute !important;
    width: max-content;
    display: block;
    top: 100%;
    left: 50%;
    z-index: 99998 !important;
    padding: 4px 10px 2px !important;
    border-radius: 4px !important;
    border: 2px solid rgba(255, 255, 255, 0.25) !important;
    transform: translate(-50%, -50%) !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: bold !important;
    line-height: 1.3 !important;
    background: #0a0910de !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(8px);
    cursor: default !important;
}

.perto_smart_navigation_tooltip::before {
    position: absolute;
    width: 0;
    height: 0;
    content: "";
    bottom: 100%;
    left: 50%;
    transform: translate(-50%, -22%);
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 9px solid rgba(255, 255, 255, 0.25);
}

.perto_smart_navigation_tooltip::after {
    position: absolute;
    width: 0;
    height: 0;
    content: "";
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #0a0910;
}

/* Hide Images */
body.perto_hide_images img:not(#perto-digital-tool *),
body.perto_hide_images d2l-organization-image,
body.perto_hide_images d2l-course-image,
body.perto_hide_images d2l-profile-image-base,
body.perto_hide_images d2l-icon {
    visibility: hidden !important;
}

/* read_mode */
body.perto_read_mode nav,
body.perto_read_mode header,
body.perto_read_mode aside,
body.perto_read_mode footer,
body.perto_read_mode menu,
body.perto_read_mode form,
body.perto_read_mode i,
body.perto_read_mode d2l-menu,
body.perto_read_mode d2l-dropdown,
body.perto_read_mode d2l-labs-navigation,
body.perto_read_mode d2l-tabs,
body.perto_read_mode d2l-search-widget,
body.perto_read_mode d2l-filter {
    display: none !important;
}

/* dyslexia */
html body.perto_format_dyslexia body.perto_format_dyslexia *:not(i):not(.fa):not(.material-icons):not(.fas):not(.material-symbols-outlined) {
    font-family: PertoOpenDyslexic !important
}