@import "./actiontext.scss";

@import "selectize/dist/css/selectize";
@import "selectize/dist/css/selectize.default";

//shadow for text on landing page
.text-shadow { text-shadow: 1px 1px black; }

//light background
body { background-color: #ede3d5; }

//for all purple brand elements
.purple-background { background-color: #563d7c; }
//white background for all tables
.table { background: white; }

//dark background style
//body { background: #2a4054; color: #ebedf0; }
//.card, .jumbotron, .list-group-item { color: #2a4054; }
//hr { background-color: white; }

//hide simple_form checkmarks
.form-control.is-invalid{ background-image: none; }
.form-control.is-valid{ background-image: none; }

//_lesson_fields - shadow on hover
.nested-fields.container.rounded {
    background-color: rgb(238, 238, 238);
    border: 1px solid rgba(255, 255, 255, 0.30);
    z-index: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}
.nested-fields.container.rounded:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
  position:relative;
  z-index: 3;
}

//highlight for drag and drop functionality
.ui-state-highlight { height: 3em; line-height: 1.2em; background-color: yellow; }

//custom bootstrap button color
$custompurple:#563d7c;
.btn-custom-purple {
  color: #fff;
  background-color: $custompurple;
  border-color: $custompurple;
}

//no action_text attachment button
//.trix-button-group--file-tools { display: none !important; }

//2 cards in a column row (not default 3)
//.card-columns {
//    -webkit-column-count:2;
//    -moz-column-count:2;
//    column-count:2;
//}

// header navbar dropdown on top of all other content
.dropdown {z-index: 9999;}

// simple_form input for rich_text_area
trix-editor.form-control {
  height: auto;
}

// footer on bottom
html {
    margin: 0;
}
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
footer {
    margin-top: auto;
}

// lesson show - scrollable lessons list
#scrollable{
    max-height: 100vh;
    overflow-y:scroll;
    -webkit-overflow-scrolling: touch;
}

// embed vimeo size
.embed-responsive-3by2 {
  padding-top: 66.66666667%; /* 3:2 Aspect Ratio */
}