//==============================================
// Layout/Blog
//==============================================

/*
*  LOOP
*/

.home.blog .page_content {
  padding: 3rem 0;
}

.blog .post,
.archive.author .post,
.archive.category .post {
  margin-bottom: 2rem;
  padding-bottom: 1rem;
  background-color: var(--gray-100);
  border-radius: 4px;
}

/* Sticky posts */
.post.sticky {
  background-color: var(--brand-primary);
  border-radius: 4px;
}

.post.sticky .post_title a,
.post.sticky .post_title a:visited {
  color: var(--white);
  margin-left: 1rem;
}

.post.sticky a.btn.btn-secondary.mybooking-read-more-link {
  color: var(--white);
  background-color: transparent;
  border: 1px solid var(--white);
  margin-left: 1rem;
}

.post.sticky a.btn.btn-secondary.mybooking-read-more-link:hover {
  color: var(--brand-primary);
  background-color: var(--white);
  border: 1px solid var(--white);
}

h2.post_title {
  margin-bottom: 0;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  word-break: break-word;
}

h2.post_title > a {
  text-align: center;
}

.untitled {
  font-style: italic;
}

.block-ellipsis {
  display: block;
  display: -webkit-box;
  max-width: 100%;
  height: 2.05rem;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/*
 * Recent posts
 */
.widget_recent_entries ul {
  list-style: none;
  padding-left: 0;
}

/*
 * Recent comments
 */
.widget_recent_comments ul {
  list-style: none;
  padding-left: 0;
}

/*
*  HOME NEWS
*/

.news_container {
  padding: 50px 0;
}

.news_thumbnail {
  margin-bottom: 10px;
}

.news_thumbnail:hover {
	opacity: .8;
}

.news_post-image {
  display: block;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  width: 100%;
  height: 280px;
  overflow: hidden;
  border-radius: 3px;
}

.sticky .news_post-image {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.news_title {
	font-size: 1.5em;
	font-weight: 700;
}

.news_extract {
  color: var(--gray-600);
}

.news_extract .mybooking-read-more-link {
  margin-top: 10px;
}

/*
*  SINGLE
*/

/* -- Width -- */

.entry-content, .entry-footer, .mybooking-entry-links, .comments-title, .comment, .comment-respond {
    margin-left: auto;
    margin-right: auto;
}

// Large devices 
@media (min-width: 992px) {
  .post .entry-content, .post .entry-footer, .post .mybooking-entry-links,
  .post .comments-title, .post .comment, .post .comment-respond,
  .mybooking-comments .comments-title, .mybooking-comments .comment, .mybooking-comments .comment-respond, {
      width: var(--post-width);
  }

  .page .entry-content, .page .entry-footer, .page .mybooking-entry-links,
  .page .comments-title, .page .comment, .page .comment-respond {
      width: var(--page-width);
  }
}

/* -- Title -- */
.entry-title {
  margin-bottom: 2rem;
  font-weight: 700;
  text-align: center;
  font-size: 4.5rem;
  line-height: 1.2;
}

// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) {
  .entry-title {
    font-size: 2rem;
  }
}

/* -- Footer -- */
.entry-footer {
  clear: both;
  padding-top: 2rem;
}

.post_header {
  height: 50vh;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.post_content {
  background-color: var(--white);
  padding: 2rem 0 1rem 0;
}

.post_title {
  margin-bottom: 2rem;
  font-weight: 700;
  text-align: center;
  font-size: 4.5rem;
  line-height: 1.2;
}

// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) {
  .post_title{
    font-size: 3rem;
  }
}

.post_meta {
  margin: 1rem 0 3rem 0;
}

.edit-link > a.btn.btn-primary.post-edit-link {
  color: var(--brand-primary);
  background-color: var(--white);
  border: 1px solid var(--brand-primary);
  min-width: 10rem;
  text-transform: inherit;
  font-weight: 400;
  &:hover {
    color: var(--white);
    background-color: var(--brand-primary-dark);
    border: 1px solid var(--brand-primary-dark);
  }
}

.mybooking-post-edit-link.edit-link {
  margin-top: 1.5rem;
}

@media (max-width: 1024px) {
  .post_header {
    height: 35vh;
  }

  .post_header img {
    bottom: 0;
  }
}

.mybooking-entry-links {
  padding: 2rem 0;
  clear: both;
}

/*
*  COMMENTS
*/

.comments-link {
  margin: 1rem 0 2rem 0;
}

.comment-list {
  margin-top: 1.5rem;
}

ol.comment-list {
  list-style: none;
}

.comment {
  margin-top: 1.5rem;
  background-color: var(--comments-bg-color);
  padding: 1rem;
  border-radius: 5px;
}

.comment-metadata {
  margin-top: 0.5rem;
}

.comment-content {
  padding: 1rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.comments-area {
  margin-top: 1rem;
  padding: 2rem 0;
  border-top: 1px solid #efefef;
  clear: both;
}



h2.comments-title {
  font-size: 1.2em;
}

.comment-form label {
  display: block !important;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"] {
  display: inline-flex;
  padding: 0 0.8rem;
  font-size: var(--form-control-font-size);
  line-height: 18px;
  color: var(--form-control-color);
  border: 1px solid var(--form-control-border-color);
  border-radius: var(--flex-form-control-border-radius);
  height: var(--form-control-height);
  -webkit-box-shadow: none;
  box-shadow: none;
  min-width: 100%;
}

.comment-form input {
  &:focus {
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1),0 0 8px rgba(82,168,236,.6);
  }  
}

.comment-form-comment textarea {
  width: 100%;
  min-height: 300px;
  padding-top: 1rem;
  font-size: var(--form-control-font-size);
  line-height: 18px;
  color: var(--form-control-color);
  border: 1px solid var(--form-control-border-color);
  border-radius: var(--flex-form-control-border-radius);
  height: var(--form-control-height);
  -webkit-box-shadow: none;
  box-shadow: none;
  &:focus {
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1),0 0 8px rgba(82,168,236,.6);
  }
}

.comments-area [type="button"],
.comments-area [type="reset"],
.comments-area [type="submit"],
.comments-area button {
  color: var(--brand-primary);
  background-color: var(--white);
  border: 1px solid var(--brand-primary);
  border-radius: 3px;
  padding: 0.375rem 0.75rem;
  min-width: 10rem;
  &:hover {
    color: var(--white);
    background-color: var(--brand-primary-dark);
    border: 1px solid var(--brand-primary-dark);
  }
  &:focus {
    box-shadow: 0 0 0 .2rem rgba(38,143,255,.5);
  }
}

.edit-link > a.btn.btn-primary.comment-edit-link,
.reply > a.btn.btn-primary.comment-reply-link {
  color: var(--brand-primary);
  background-color: var(--white);
  border: 1px solid var(--brand-primary);
  text-transform: inherit;
  font-weight: 400;
  &:hover {
    color: var(--white);
    background-color: var(--brand-primary-dark);
    border: 1px solid var(--brand-primary-dark);
  }
}

.reply > a.btn.btn-primary.comment-reply-link {
  min-width: 10rem;
}

#cancel-comment-reply-link {
  margin-left: 1rem;
  color: var(--brand-primary);
  background-color: var(--white);
  border: 1px solid var(--brand-primary);
  border-radius: 3px;
  padding: 0.375rem 0.75rem;
  text-decoration: none;
  &:hover {
    color: var(--white);
    background-color: var(--brand-primary-dark);
    border: 1px solid var(--brand-primary-dark);
  }
}

.comment-respond {
  margin-top: 1.5rem;
}

.comment-reply-title {
  font-size: 1.2rem;
}

/**
 * TAGS and categories
 */
.cat-links > span > a {
  text-decoration: underline;
}

.tags-links > span > a {
  text-decoration: underline;
}

/** Other buttons **/

form.post-password-form input[type=submit],
form.wp-block-search input[type=submit] {
  color: var(--brand-primary);
  background-color: var(--white);
  border: 1px solid var(--brand-primary);
  text-transform: inherit;
  font-weight: 400;
  border-radius: 3px;
  padding: 0.375rem 0.75rem;
  &:hover {
    color: var(--white);
    background-color: var(--brand-primary-dark);
    border: 1px solid var(--brand-primary-dark);
  }
}
