/** Shopify CDN: Minification failed

Line 84:27 The "-" operator only works if there is whitespace on both sides
Line 182:10 Expected identifier but found whitespace
Line 182:12 Unexpected "{"
Line 182:24 Expected ":"
Line 183:21 Expected identifier but found whitespace
Line 183:23 Unexpected "{"
Line 183:35 Expected ":"

**/
courses {
    /* background-color: pink; */
    display: flex;
    height: calc(100% - 83.31px);
    position: absolute;
    left: 0;
    width: 100%
}

chapter-sidebar {
    background-color: #f4f4f4;
    display: flex;
    min-height: 100%; 
    min-width: 330px;
    padding: 30px;

}

chapter-sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}
chapter-sidebar ul li span:hover{
    cursor: pointer;
    color: #9c6b48;
    opacity: 0.9;
}

.chapter-sidebar__group {
    border-bottom: solid 1px #ccc;
    font-weight: 700;
    margin-top: 10px;
    padding: 10px 0;
    position: relative;
}

.chapter-sidebar__group:first-of-type {
    margin-top: 0;
}

.chapter-sidebar__group::before {
    background: url('/cdn/shop/files/chevron-down.png?v=1714521554') 0 0 no-repeat transparent;
    background-size: 100% 100%;
    content: ' ';
    display: block;
    height: 22px;
    position: absolute;
    top: 50%;
    transform: rotate(0deg) translateY(-50%);
    right: 0;
    width: 22px;
}

.chapter-sidebar__group.sidebar-group-opened::before {
    transform: rotate(180deg) translateY(50%);
}

.chapter-sidebar--hidden {
    display: none;
}

.chapter-sidebar--show {
    display: flex;
}

@media screen and (max-width: 768px) {
    chapter-sidebar{
        position: absolute;
        transition: all 200ms ease-in-out;
        z-index: 99;
        height: calc(100vh -50px);
    }
    chapter-sidebar[data-hamburguer-state="open"]{
        left: 0;
        top: 0;
    }
    chapter-sidebar[data-hamburguer-state="close"]{
        left: -630px;
    }
}
.chapter-sidebar__item{
  padding:10px 0 0;
}

course-chapters {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
}

course-chapters > div {
    display: none;
}

course-chapters > div:first-child {
    display: block;
}



single-chapter {
    background-color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 0 30px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
}

.single-chapter--display {
    display: block;
}


/* Components Atoms */
.hide-chapter {
    display: none;
}

.show-chapter {
    display: block;
}

.chapter-component-image img {
    display: block;
    height: auto;
    max-width: 100%;
}

/* movil */
.toggle-sidebar {
    display: none;
}

/* Estilos para el sidebar en dispositivos móviles */
@media screen and (max-width: 768px) {
    toggle-sidebar{
        width: 100%;
        height: 50px;
        padding: 10px;
        display: block;
        border-bottom: solid 1px #ccc;
    }
    .toggle-sidebar {
        border: 0;
        cursor: pointer;
        display: block;
        height: 32px;
        left: 25px;
        position: absolute;
        top: 26px;
        transform: rotate(180deg) translateY(50%);
        width: 22px;
    }
}

.flexbox-container {
	display: -ms-flex;
	display: -webkit-flex;
	display: flex;
    color: {{ color_file }};
    background-color: {{ fondo_file }};
    margin: 20px 0;
}

.flexbox-container > div {
	width: 50%;
	padding: 10px;
  background: transparent;
}

.flexbox-container > div:first-child {
	margin-right: 20px;
}
.column1 {
  display: flex;
  text-align: left;
  align-items: center;
  justify-content: left;
}

.column2 {
  text-align: right; /* Alineamos el texto a la derecha */
}