/* LIST */

.post-list .blog-post-thumb .post-meta {
  font-size: 14px;
  margin-top: 8px;
  margin-bottom: -6px;
  color: #888;
}

.blog-post-thumb .text {
  height: 68px;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* POST */

.post-body {
  background-color: #fff;
  padding: 30px;
  border-radius: 5px;
  color: #222;
  box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06);
}

.post-header h1,
.post-body > h1 {
  font-weight: bold;
  font-size: 32px;
  margin-bottom: 10px;
}

.post-meta .tag {
  color: #4a90d9;
  font-weight: 500;
}

/* View */

.post-view .post-body {
  padding: 40px;
}

.post-view .post-header {
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid #e6ecf1;
}

.post-view .post-title {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 14px;
}

.post-view .post-meta {
  font-size: 14px;
  color: #888;
}

.post-view .post-meta span {
  margin-right: 12px;
}

.post-view .post-meta .fa {
  margin-right: 2px;
  color: #aaa;
}

.post-view .post-meta .tag {
  display: inline-block;
  padding: 1px 10px;
  background-color: #eef4fb;
  color: #4a90d9;
  border-radius: 99px;
  font-weight: 500;
}

.post-view .post-meta a.post-source {
  color: #4a90d9;
}

.post-view .post-meta a.post-source:hover {
  text-decoration: underline;
}

.post-view .post-detail {
  padding: 0;
  background: transparent;
  min-height: auto;
}

.markdown-section blockquote p {
  margin: 0 !important;
}

.markdown-section p > img {
  cursor: default;
}

/* fix */

.page .page-bottom {
  padding-top: 60px;
  padding-bottom: 50px;
  font-size: 15px;
}

.post-body ul li {
  list-style-type: disc;
}

.post-view .post-detail p {
  margin-bottom: 0.85em;
  font-size: inherit;
  line-height: inherit;
}

/* DARK */

.dark-theme .page .page-bottom {
  background-color: var(--rb-dark-bg);
}

.dark-theme .page .cover:before {
  background-image: linear-gradient(127deg, var(--rb-dark-panel) 0%, var(--rb-dark-bg) 91%);
}

.dark-theme .blog-post-thumb {
  background-color: transparent;
}

.dark-theme .blog-post-thumb a h3 {
  color: var(--rb-dark-text);
}

.dark-theme .blog-post-thumb a:hover h3 {
  color: var(--rb-dark-link);
}

.dark-theme .blog-post-thumb .text,
.dark-theme .post-list .blog-post-thumb .post-meta {
  color: var(--rb-dark-muted);
}

.dark-theme .blog-post-thumb .blog-content .btn-primary-line {
  border-color: #4183c4;
  color: #4183c4;
}

.dark-theme .blog-post-thumb .blog-content .btn-primary-line:hover {
  background-color: #4183c4;
  color: #fff;
}

.dark-theme .post-body {
  background-color: var(--rb-dark-panel);
  color: var(--rb-dark-text);
}

.dark-theme .post-view .post-header {
  border-bottom-color: var(--rb-dark-border);
}

.dark-theme .post-view .post-meta,
.dark-theme .post-view .post-meta .fa {
  color: var(--rb-dark-muted);
}

.dark-theme .post-view .post-meta .tag {
  background-color: rgba(68, 147, 248, 0.12);
  color: var(--rb-dark-link);
}

.dark-theme .post-view .post-meta a.post-source {
  color: var(--rb-dark-link);
}

.dark-theme .page .cover .cover-bottom .breadcrumb {
  background-color: var(--rb-dark-panel);
  box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.5);
}

.dark-theme .page .cover .cover-bottom .breadcrumb li,
.dark-theme .page .cover .cover-bottom .breadcrumb li:after,
.dark-theme .page .cover .cover-bottom .breadcrumb li a {
  color: var(--rb-dark-muted);
}

.dark-theme .page .cover .cover-bottom .breadcrumb li.active {
  color: var(--rb-dark-text);
}

.dark-theme aside.default-aside .sidebar ul {
  background-color: var(--rb-dark-panel);
}

.dark-theme aside.default-aside .sidebar ul li:nth-child(even) {
  background-color: #1e242c;
}

/* DARK - Videos */

.dark-theme #playerModal .modal-content {
  background-color: var(--rb-dark-panel);
}

.dark-theme #playerModal .modal-header {
  border-bottom-color: var(--rb-dark-border);
}

.dark-theme #playerModal .modal-title {
  color: var(--rb-dark-text) !important;
}

.dark-theme #playerModal .modal-header .close {
  color: var(--rb-dark-muted);
}

/* MOBILE */

@media (max-width: 768px) {
  .page .page-bottom {
    padding-top: 30px;
    padding-bottom: 20px;
  }

  .post-view .post-body {
    padding: 5px;
    background-color: transparent;
    box-shadow: none;
    border-radius: 0;
  }

  .post-view .post-header {
    margin-bottom: 18px;
    padding-bottom: 16px;
  }

  .post-view .post-title {
    font-size: 22px;
  }

  .blog-post-thumb .blog-content {
    padding-top: 40px;
  }

  .default-aside {
    margin-top: 40px;
  }
}