/* Stylesheet for Yearbook PDF generation */
/* You can add specific CSS rules here that will be applied to your PDF document. */

/* Example:
body {
  font-family: 'Times New Roman', Times, serif;
}

.entry-title {
  font-size: 18pt;
  color: navy;
}
*/
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */


#search-icon {
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

#search-icon.loading {
  opacity: 1;
}

/* CUSTOMIZATION */

.card {
  padding: 32px;
}

.card.blog-post .post-text {
  padding: 32px;
}

.card.blog-post .post-text .post-info {
  margin: 0;
}

.card.blog-post .date {
  padding: 16px;
  background-color: #eeeeee;
  border: 1px solid #e9e9e9;
  border-radius: 0 8px;
  margin: 0 16px 8px 0;
  width: 6em;
}

.card.blog-post .date .year {
  display: block;
  font-size: 10px;
}

.card.blog-post .date a {
  text-decoration: none;
  color: #333;
}

.card .card-container {
  padding: 0;
}

.form-group-lg .form-control {
  height: 46px;
  padding: 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 4px;
}


/** ERRORS **/

#error_explanation {
  padding-bottom: 12px;
  margin-bottom: 20px;
  background-color: #f0f0f0;
}

#error_explanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  font-size: 12px;
  background-color: #c00;
  color: #fff;
}

#error_explanation p {
  color: #333;
  margin-bottom: 0;
  padding: 5px;
}

#error_explanation ul li {
  font-size: 12px;
  list-style: square;
}

/* calendar */

.calendar {
  margin: 0 auto;
}
.calendar .cal {
  float: left;
  width: 236px;
  margin-bottom: 20px;
}
.calendar .clndr .clndr-controls .clndr-previous-button {
  float: left;
  width: 80px;
  text-align: left;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.calendar .clndr .clndr-controls .month {
  text-align: center;
  width: 80%;
  margin: 0 auto;
}
.calendar .clndr .clndr-controls .clndr-next-button {
  float: right;
  width: 80px;
  text-align: right;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.calendar .clndr .clndr-grid {
  text-align: center;
  display: inline-block;
}
.calendar .clndr .clndr-grid .header-day {
  float: left;
  width: 32px;
  height: 32px;
  line-height: 32px;
  color: #999;
}
.calendar .clndr .clndr-grid .day {
  float: left;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 4px;
  cursor: pointer;
}
.calendar .clndr .clndr-grid .day:hover {
  background-color: #00000011;
}
.calendar .clndr .clndr-grid .day.event {
  cursor: pointer;
}
  .calendar .clndr .clndr-grid .day.event:hover {
    /* background-color: #C4F0AF; */
    background-color: #00000011;
  }
.calendar .clndr .clndr-grid .adjacent-month.day.event {
  background-color: inherit;
}
.calendar .clndr .clndr-grid .day.today {
  background-color: #ffeaa7;
  color: #333;
  border-radius: 4px;
}
  .calendar .clndr .clndr-grid .day.today:hover {
    background-color: #fdcb6e;
  }
.calendar .clndr .clndr-grid .adjacent-month.day.today {
  background-color: inherit;
}
.calendar .clndr .clndr-grid .empty,
.calendar .clndr .clndr-grid .adjacent-month {
  float: left;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 4px;
  opacity: 0.2;
}
.clndr-next-button,
.clndr-previous-button,
.clndr-next-year-button,
.clndr-previous-year-button {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.clndr-next-button.inactive,
.clndr-previous-button.inactive,
.clndr-next-year-button.inactive,
.clndr-previous-year-button.inactive {
  opacity: 0.5;
  cursor: default;
}

.calendar .days-of-the-week .days div {
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  overflow: hidden;
}

.mood-radio {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.mood-label {
  display: inline-block;
  transition: all 0.3s ease;
}

.direct-upload {
  display: inline-block;
  position: relative;
  padding: 2px 4px;
  margin: 0 3px 3px 0;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 3px;
  font-size: 11px;
  line-height: 13px;
}

.direct-upload--pending {
  opacity: 0.6;
}

.direct-upload__progress {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  opacity: 0.2;
  background: #0076ff;
  transition: width 120ms ease-out, opacity 60ms 60ms ease-in;
  transform: translate3d(0, 0, 0);
}

.direct-upload--complete .direct-upload__progress {
  opacity: 0.4;
}

.direct-upload--error {
  border-color: red;
}

input[type=file][data-direct-upload-url][disabled] {
  display: none;
}