/*
Theme Name: FSE ISR Plus - 2025
Author: Jeff Cooper
Author URI: 
Theme URI: 
Tags: full-site-editing, editor-style, block-styles, block-patterns
Text Domain: fse-isr-plus-2025
Requires at least: 6.3
Requires PHP: 7.4
Tested up to: 6.3
Version: 1.0.0

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* Styles intended only for the front.*/
html {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}
}

body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}
.content-template-single-chapter main.wp-block-group {padding-top: 0;}
:where(.wp-site-blocks) > * {
    margin-block-start: 0;
    margin-block-end: 0;
}
.wp-site-blocks {
    padding-top: var(--wp--style--root--padding-top);
    padding-bottom: var(--wp--style--root--padding-bottom);
}

.wp-block-navigation__responsive-container.is-menu-open {
	padding: 30px;
}

.timeline-container {
  position: relative;
  padding: 10px 10px 10px 50px;
}
.timeline-container, .timeline-container * {box-sizing: border-box;}

.timeline-container::before {
  content: "";
  width: 5px;
  background-color: #d5d8dd;
  position: absolute;
  top: 0; bottom: 0; left: 15px;
}
.timeline-container div {
  position: relative;
}

/*.timeline-container div::before {
  content: "";
  border: 10px solid transparent;
  border-right-color: #fff;
  border-left: 0;
  position: absolute;
  top: 20%; left: -10px;
}*/
/*.timeline-container div>div::before {
  display: none;
}*/

.timeline-container div::after {
  content: "";
  background: #e4e6ea;
  border: 4px solid #205eb8;
  width: 16px; height: 16px;
  border-radius: 50%;
  position: absolute;
  top: 20%; left: -47px;
}

.timeline-container div>div::after {
  display: none;
}

.check-list {
    overflow: hidden;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 10;
    -webkit-box-orient: vertical;
}
ul.check-list {
    list-style: none;
    padding: 0px 15px;
}
.check-list li::before {
    color: #ffffff;
    content: "\f00c";
    font-family: FontAwesome;
    margin: 0px 4px 0px 0px;
    background: #3D975F;
    border-radius: 50%;
    padding: 5px;
    font-size: 10px;
}

.numbered-list {
    list-style: none;
    counter-reset: my-awesome-counter;
    padding: 0px 0px 0px 15px;
}
.numbered-list li {
    counter-increment: my-awesome-counter;
}
.numbered-list li::before {
    content: counter(my-awesome-counter) " ";
    color: #ffffff;
    margin: 0px 5px 0px 0px;
    background: #3D975F;
    border-radius: 50%;
    /* padding: 6px 7px 6px 7px; */
    width: 25px;
    height: 25px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    line-height: 24px;
}

.qsm-incorrect-answer-info + .qsm-inline-correct-info>.feedback-correct {
  display: none;
}

.qsm-correct-answer-info + .qsm-inline-correct-info>.feedback-incorrect {
  display: none;
}

.qmn_question_answer_incorrect .feedback-correct {
  display: none;
}
.qmn_question_answer_correct .feedback-incorrect {
  display: none;
}

.topbutton {
    position: fixed;
    font-size: 16px;
    font-weight: 600;
    right: 20px;
    bottom: 15px;
    Z-index: 1;
    background: #0273aa;
    display: none;
    padding: 5px 15px;
}

.isr-notification-banner.isr-notification-banner--success {
    border: 2px solid;
    border-color: #00703c;
    margin: 15px 0px 25px 0;
}
.isr-notification-banner__header {
    background: #00703c;
    color: #fff;
}
.isr-notification-banner__title {
    margin: 0;
    font-size: 16px;
    padding: 4px 15px;
}
.isr-notification-banner__content {
    background: #fff;
    padding: 1px 15px;
}


/* ~~~~~~~~~~~~~~~~ Landscape Tablets and Larger ~~~~~~~~~~~~~~~~~~~~~~ */
@media only screen and (min-width : 800px){
/* Make submenu full width - only for mega-menu class */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container {
    width: 60vw !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-75%) !important;
    max-width: none !important;
    padding: 25px 25px !important;
    box-sizing: border-box;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: flex-start !important;
    z-index: 20;
}

/* Target list items - only in mega-menu */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container .wp-block-navigation-item {
    flex: 1 1 calc(25% - 20px) !important;
    min-width: 200px !important;
    margin: 0 !important;
}

/* Style links with left alignment - only in mega-menu */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    width: 100%;
    display: block;
    padding: 15px;
    text-align: left !important;
}

/* Target the actual link element - only in mega-menu */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container a {
    text-align: left !important;
    display: block !important;
    width: 100%;
    padding: 15px;
    border-radius: 8px;
    position: relative;
}

/* Hover effect - only in mega-menu */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container a:hover {
    background-color: #f0f0f0;
    outline: 2px solid #f0f0f0;
    color: #0073aa;
}

/* Focus effect for accessibility - only in mega-menu */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container a:focus {
    outline: 2px solid #0073aa;
    outline-offset: 2px;
    background-color: #f0f0f0;
}

/* Active/Click effect - only in mega-menu */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container a:active {
    
}

/* Target any span or label inside - only in mega-menu */
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container .wp-block-navigation-item__label,
.wp-block-navigation .mega-menu.wp-block-navigation__submenu-container span {
    text-align: left !important;
    display: block !important;
    width: 100%;
}
}

/* ~~~~~~~~~~~~~~~~~~~~~~ Large Screens ~~~~~~~~~~~~~~~~~~~~~~~~~ */
@media only screen and (min-width : 1280px){

}