:root{--color-primary: #69bd45;--color-secondary: #007ab8;--color-tertiary: #1ea4a9;--color-state: #4b7e2b;--color-state-hover: #3c6721;--color-state-focus: #3c6721;--color-state-active: #30541a;--color-state-highlight: #f6f9d7;--color-state-highlight-neutral: var(--color-neutral-3);--color-state-disabled: var(--color-neutral-5);--color-neutral-1: #fff;--color-neutral-2: #fafafa;--color-neutral-3: #f7f7f7;--color-neutral-4: #e6e4e4;--color-neutral-5: #c7c7c7;--color-neutral-6: #767676;--color-neutral-7: #262626;--color-background: var(--color-neutral-1);--color-border: var(--color-neutral-5);--color-text: var(--color-neutral-7);--color-text-disabled: var(--color-neutral-5);--color-text-hint: var(--color-neutral-6);--link-color: var(--color-state);--link-color-hover: var(--color-state-hover);--nav-bg-color: #fff;--nav-text-color: var(--color-text);--footer-bg-color: #fff;--footer-text-color: var(--color-text);--footer-text-color-hover: var(--footer-text-color);--btn-accent-color: var(--color-state);--btn-accent-color-active: var(--color-state-active);--btn-accent-color-hover: var(--color-state-hover);--btn-accent-color-disabled: var(--color-state-disabled)}:root{--nav-bg-color: #ebecf5;--nav-text-color: #2d0087;--color-primary: #2d0087;--btn-prim-accent-color: #3E467f;--btn-accent-color: #3E467F;--link-color: #979DCC;--color-state: #2d0087;--color-text: #000000;--footer-bg-color: #535daa;--footer-text-color: #ffffff;--btn-prim-accent-color-focus: #343c75;--btn-prim-accent-color-active: #232b64;--btn-accent-color-focus: #343c75;--btn-accent-color-active: #232b64;--link-color-hover: #8d93c2;--color-state-hover: #23007d;--color-state-focus: #23007d;--color-state-active: #12006c;--footer-text-color-hover: #f5f5f5;}
/* Totara look and feel changes */
/* Brand colours – replace these with ones that are on-brand but serve similar semantic function*/
:root {
    --color-neutral-1: #ffffff;
    --color-neutral-3: #f7f7f7;
    --color-neutral-4: #ebecf5;
    --color-neutral-5: #c7c7c7;
    --color-neutral-6: #595a59;
    --color-neutral-7: #262626;
    --color-primary: #2d0087;
    --color-secondary: #535daa;
    --color-tertiary: #2293b4;
    --color-state: #3E467F;
    --color-state-hover: #595a59;
    --color-state-focus: #535daa;
    --color-state-active: #292e55;
    --color-state-highlight: #fde6d3;
    --color-state-highlight-neutral: var(--color-neutral-3);
    --color-state-disabled: var(--color-neutral-5);
    --color-prompt-info: #0040cb;
    --color-prompt-info-bg: #eaf1ff;
    --color-prompt-alert: #F26727;
    --color-prompt-alert-bg: #fde6d3;
    --color-prompt-warning: #F26727;
    --color-prompt-warning-bg: #fde6d3;
    --color-prompt-success: #588500;
    --color-prompt-success-bg: #EAF1FF;
    --color-chart-background-1: #535daa;
    --color-chart-transparent-1: rgba(0, 122, 184, 0.38);
    --color-chart-background-2: #F26727;
    --color-chart-transparent-2: rgba(218, 124, 47, 0.38);
    --color-chart-background-3: #bf6c78;
    --color-chart-transparent-3: rgba(191, 108, 120, 0.38);
    --color-chart-background-4: #dac725;
    --color-chart-transparent-4: rgba(218, 199, 37, 0.38);
    --color-chart-background-5: #5d5d5d;
    --color-chart-transparent-5: rgba(93, 93, 93, 0.38);
    --color-chart-background-6: #EAF1FF;
    --color-chart-transparent-6: rgba(152, 170, 218, 0.38);
    --color-chart-background-7: #2293b4;
    --color-chart-transparent-7: rgba(35, 193, 160, 0.38);
    --color-background: var(--color-neutral-1);
    --color-border: var(--color-neutral-5);
    --color-text: var(--color-neutral-7);
    --color-text-disabled: var(--color-neutral-5);
    --color-text-hint: var(--color-neutral-6);
    --link-color: var(--color-secondary);
    --link-color-hover: var(--color-state-hover);
    --color-backdrop-standard: rgba(0, 0, 0, 0.4);
    --color-backdrop-heavy: rgba(0, 0, 0, 0.8);
    --color-backdrop-contrast: var(--color-neutral-1);
    --color-heading-3: var(--color-text); /* Should probably be re-defined */
    --color-heading-4: var(--color-primary); /* Should probably be re-defined */
    --color-heading-5: var(--color-text); /* Should probably re-defined */
    --body-font-family: "Raleway", sans-serif; /* Ensure font file is loaded - e.g. at https://totara.sandpit.synapsys.co.nz/admin/settings.php?section=additionalhtml */
    --body-font-size: 16px;
}

/* HD Planner tasks */
/* left align media */
.mediaplugin > div {
    margin: inherit;
}
/* Buttons for activity links */
/* btn styled a links */
.path-course-view .course-content a.btn.btn-primary {
    color: white;
    text-decoration: none;
}
/* Hanging paragraph for answer options */
.que .answer>div {
    display: flex;
    flex-flow: row;
    align-items: baseline;
}
*/

/* Powered by Synapsys */
.footnote {
    display: flex;
    margin-top: 12px;
}

#page-footer .page-footer-main-content {
    margin-bottom: 6px;
}

.page-footer-poweredby {
    display: none;
}

.synapsys-poweredby {
    margin-right: auto;
    padding: 1rem;
    background-color: var(--color-primary);
}

.synapsys-poweredby a {
    text-decoration: none !important;
}

/* END - Powered by Synapsys */

body {
    font-family: var(--body-font-family);
    font-size: var(--body-font-size);
    background-color: rgba(var(--color-primary-rgb), 0.05); /*Use this pattern for background colour with opacity. Ensure --color-primary-rgb (or similar) has been defined earlier */
}

body:not(.path-totara-dashboard) #page {
    background-color: var(--color-neutral-1);
}

/* Navbar */
.totaraNav_prim {
    padding: var(--gap-2) 0;
}

.totaraNav_prim .masthead_logo--header_img {
    height: 3.5rem;
}

#page-content .singlebutton input[type="submit"] {
    background-color: var(--color-primary);
    color: var(--color-neutral-1);
}

/* Activity buttons & links */
[class*="path-mod-"] .othernav a,
.path-mod-quiz .submitbtns a {
    display: inline;
    background-color: var(--color-primary);
    padding: 10px;
    color: var(--color-neutral-1);
    border-radius: var(--btn-radius);
    margin-left: 6px;
}

[class*="path-mod-"] .othernav a:hover {
    text-decoration: none;
}

[class*="path-mod-"] .singlebutton form {
    margin-top: 12px;
}

input.btn-primary[class*="mod_"] {
    background-color: var(--color-primary);
    color: var(--color-neutral-1);
}


/* Dashboards */
.path-totara-dashboard .block .block-header {
    background-color: var(--color-primary);
    color: var(--color-neutral-1);
}

.path-totara-dashboard .block .block-header .block_action a {
    color: var(--color-neutral-1);
    font-size: 14px; 
}

.path-totara-dashboard .block .block-header .block-title {
    text-transform: uppercase;
}

/* Course pages */
.path-course-view .course-content {
    h5, h4, h3:not(.sectionname) {
        margin-top: 18px;
    }
}
.path-course-view .course-content a {
    text-decoration: underline;
    color: var(--link-color);
}

.path-course-view .activityinstance a  {
   text-decoration: none;
}

.path-course-view .sectionname a  {
   text-decoration: none;
}

.path-course-view ul.section li.activity {
    padding-left: 0px;
}

.path-course-view .activity .activityinstance a {
     text-transform: uppercase;
}

.path-course-view :not(.modtype_book, .modtype_label, .modtype_page, .modtype_url, modtype_resource) .activityinstance a {
    color: var(--color-neutral-1);
    background-color: var(--color-primary);
    padding-left: 0.2em;
    min-height: fit-content;
    padding: 4px 8px 4px 4px;
    border-radius: var(--btn-radius);
}

.path-course-view .activity img {
    margin-left: 0px;
}

.path-course-view h3:not(.sectionname) {
    color: var(--color-primary);
    font-size: var(--font-size-24);
    text-transform: uppercase;
    font-weight: 700;
}

.path-course-view .course-content h3.sectionname a {
    color: var(--color-neutral-1);
}

.path-course-view h4 {
    color: var(--color-primary);
    font-size: var(--font-size-20);
    font-weight: 700;
}

.path-course-view h5 {
    color: var(--color-heading-5);
    font-size: var(--font-size-16);
    font-weight: 700;
}

.path-course-view h3.sectionname {
    background-color: var(--color-primary);
    text-transform: uppercase;
    padding: 6px;
}

.path-course-view h3 a {
    color: var(--color-neutral-1);
}

.path-course-view .header.block-header h2 {
    font-weight: bold;
    color: var(--color-deep-green);
}

.path-course-view .block .block-content h3.sectionname {
    font-size: var(--font-size-16);
    font-weight: 700;
    color: var(--color-heading-3);
    background-color: transparent;
    text-transform: none;
    padding: 0px;
}

.path-course-view .video-js {
    border: solid 1px var(--color-tertiary);
}

.path-course-view .vjs-control-bar {
    background-color: var(--color-primary);
}

.course-content ul.topics li.section .content {
    margin-bottom: 2rem;
}

.path-mod-quiz table.answer td.text {
    padding-right: 1rem;
}

/* Blocks */
.block {
    border: none;
}

.block .block-header {
    padding-top: 8px;
    min-height: fit-content;
}

.block .block-title {
    padding-bottom: 8px
}

.block .block-header .block-title {
    box-shadow: none;
}

.block .block-header .block-title h2 {
    font-size: 16px;
}

.block_current_learning .panel-footer {
    border-top: none;
}

.block .block-title .block_action {
    min-width: fit-content;
}

.block_current_learning-tile {
    border-radius: 0px;
    border: solid 1px var(--color-primary);
}

.block_current_learning-tile:hover {
    box-shadow: none;
}

.block_current_learning-tile__content {
    padding-bottom: 0px;
}

.block a.block_current_learning-tile__link h3.block_current_learning-tile__link_title {
    text-transform: uppercase;
    margin-top: var(--gap-2);
    color: var(--nav-bg-color);
}

.block .block_current_learning-tile__content_component {
    display: none;
}

.block_calendar_upcoming .footer .gotocal {
    margin-left: auto;
    color: var(--color-neutral-1);
    padding: 6px;
}

.block_calendar_upcoming .footer .gotocal a {
    background-color: var(--color-primary);
    color: var(--color-neutral-1);
    text-transform: uppercase;
    padding: 8px;
}

.block_calendar_upcoming .footer {
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.block-totara-featured-links-layout .block-totara-featured-links-tile.background-cover {
    background-size: unset;
}

.block_course_navigation  .block_tree .type_structure > p.tree_item {
    display: grid;
    grid-template-columns: 1fr 11fr;
}

.block_course_navigation  .block_tree p.tree_item.hasicon a {
    display: grid;
    grid-template-columns: 1fr 11fr;
}

/* General */
.pagination {
    border-radius: 0px;
}

.pagination > li > a,
.pagination > .disabled > a,
.pagination > li > a:hover,
.pagination > .disabled > a:hover {
    border-color: var(--color-primary);

}

.pagination > li:first-child > a,
.pagination > li:last-child > a {
    border-radius: 0px;
}

.pagination > .active > a {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}
.progress {
    box-shadow: none;
    border: 1px solid var(--color-primary);
    background-color: transparent;
    border-radius: 0px;
}

.flex-icon.tfont-var-caret-right-fill {
    color: var(--color-primary);
}

/* Custom classes */
.no-background-colour h3 {
    color: var(--color-primary);
    background-color: transparent;
}

.no-background-colour h3 a {
    color: var(--color-primary);
}

.h1-custom {
    font-size: var(--font-size-20);
    text-transform: uppercase;
    font-weight: bold;
}

.h1-custom .activityinstance a {
    text-transform: none;
    font-weight: normal;
    font-size: var(--font-size-16);
}

@media screen and (min-width: 768px) {
    .callout {
        width: 60%;
    } 
}
.callout {
    font-size: 18px;
    color: var(--color-primary);
    text-align: center;
    margin: auto;
}

footer#page-footer.page-footer {
    position: relative;
    height: 80px;
}

.mform .fitem .felement input[type="radio"] {
    vertical-align: unset;
}

/* Upcoming events block */
.block_calendar_upcoming .event {
    display: grid;
    grid-template-columns: 2fr 10fr;
    grid-template-areas: "left topright"
                                   "left middleright"
                                   "left bottomright";
}

.event .icon {
    grid-area: left;
}

.event .course {
    grid-area: topright;
}
.event > a {
    grid-area: middleright;
    align-self: center;
}

.content .event .date {
    grid-area: bottomright;
    padding-left: 0px;
}
 
/* Put messy bits here so they don't get accidentally messed up */

.block_calendar_upcoming .content [class*=" tfont-var-"]::before {
    content: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAAAfCAYAAABkitT1AAAACXBIWXMAAAsSAAALEgHS3X78AAABiUlEQVRYw+2XPUhCYRSGnzKUmxjS1IUiCwQhkhwaAhuEaIskiaZ+BqckKAKJIgoFiYaCAoMg0KZ+IISi36FCoiU0WiQkyYQMG3KJaLKloGi53aTucN/x45yP5zvv4TuckkKhgBTZ/E4TcAI445ORS2TI5neGgHx8MjIsJb70B3ebgFrAiXz1A01Sg0tRsBQNV9Lk6xx4t0yKrf3A6XvvydEUkAZCUuEKqq0qnAqnwqlw8mUUDMqEc7e42BlaxiqalQVnFc142nqVZ6tRMBDs9QGweBTmKptUDtxCzwR6ncDWxQHr8X3lVG7E0UdjjYVULoN/b+l/bLXX2XC3uL6d9dm7eH59YXQj8OuHlslNnOn2otcJ3Odz7CaiGAUDM91eAALbQW6fsv/3z41tzgIw3jGIVTR/6bPdRLQoLaKpclim5STe5R8o12hprrfS3tBKdaVIKpfBs+ZTxoSYP17lPBlDrxOK1mdFqdyHzm5iVGj1zB2ucP2YLvqCo+4QKpwK92lChCVu/H+uN8IoZz5DacVeAAAAAElFTkSuQmCC');
}

/*COMPLETION MARKERS - CIRCLES AND SQUARES*/
/*All circles*/
.section .activity .actions .autocompletion {
    color: var(color-prompt-alert) !important;
    font-family: "FontAwesome";
    color: var(--color-prompt-alert) !important;
    font-color: #fff !important;
    font-size: 30px;
    margin-right: -6px;
    display: block;
}

/*Automatically marked circles and also the circles on the Learning Plan page.*/
.ft-state-success {
    font-family: "FontAwesome" ;
    margin-right: -4px;
}

 /*manual tickbox*/
.jsenabled .completion-icon {
    font-family: "FontAwesome";
    font-size: 24px;
    color: transparent !important;
    width: 24px;
    height: 24px;
    outline: 2px solid var(--color-prompt-alert) !important;
    display: block;
    margin-right: 0px;
} 

 /* manual tickbox, when it has been ticked */
input.completion-icon[type=checkbox]:checked:before {
    font-family: "FontAwesome";
    content: "\f00c";
    font-size: 24px;
    color: transparent !important;
    display: block;
    width: 24px;
    height: 24px;
    color: var(--color-prompt-alert)  !important;
    background-color: var(--color-neutral-1) !important;
}

::selection {
    color: var(--color-neutral-1);
    background: var(--color-secondary);
}

.dropdown:hover .dropbtn {
    background-color: var(--color-primary);
}
