/* CCB Theme v2.0 — Custom styles matching cadetcollegeblog.com */

/* -----------------------------------------------------------------------
   Base
----------------------------------------------------------------------- */
body {
  background: #fefefe;
  font-family: "SolaimanLipi", "Open Sans", Helvetica, sans-serif;
  color: #444444;
}

.container {
  padding-top: 1.5rem;
}

/* -----------------------------------------------------------------------
   Typography
----------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: "SolaimanLipi", "Open Sans", Helvetica, sans-serif;
}

h1 { font-size: 2.35rem; }

p { text-align: justify; }

p.comment-sig { color: #bbb; }

/* -----------------------------------------------------------------------
   Links  (only anchor elements, not bare <time>)
----------------------------------------------------------------------- */
a,
#sidebar .panel a,
.footer-widget .panel a,
span.author a,
.widget_categories ul li:before,
.widget_useronline ul li:before,
.widget_wppp ul li:before,
.bwp-rc-widget ul li:before,
ul.mfp_favorites li:before,
ol.commentlist li section.comment a.comment-reply-link {
  color: #008cba;
}

a:hover { color: #006a91; text-decoration: none; }

span.author a { font-weight: normal; }
span.author a,
a time { font-weight: normal; }

/* -----------------------------------------------------------------------
   Header / Top-bar
----------------------------------------------------------------------- */
.site-header {
  display: block;
  width: 100%;
  background: #222222;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.site-header .top-bar {
  display: block;
  width: 100%;
  max-width: 100%;
  background: #222222;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.site-header .top-bar::after {
  content: "";
  display: table;
  clear: both;
}

/* ---- Site title ---- */
.top-bar .name h1 {
  font-size: 1.4rem;
  line-height: 45px;
  margin: 0;
  padding: 0;
}

.top-bar .name h1 a {
  display: block;
  height: 45px;
  line-height: 45px;
  padding: 0 15px;
  color: #ffffff;
  font-weight: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  /* Foundation defaults width:50% on mobile — override so Bengali title shows */
  width: auto;
  max-width: 65vw;
}

/* ---- Nav links ---- */
.top-bar-section ul li > a {
  font-family: "SolaimanLipi", "Open Sans", sans-serif;
  font-size: 1rem;
}

.top-bar-section .dropdown li a {
  font-family: "SolaimanLipi", "Open Sans", sans-serif;
  font-size: 0.9rem;
}

/* Active / current page item */
.top-bar-section ul li.active > a,
.top-bar-section ul li.current-menu-item > a {
  background: #222222;
  color: #ffffff;
}

/* Dropdown arrow — keep vertically centred in 45px bar */
.top-bar-section .has-dropdown > a:after {
  top: 22.5px;
}

/* -----------------------------------------------------------------------
   Large-screen top-bar layout (≥ 40.063em = 641px)
   Foundation JS floats ul.right at runtime, but we add CSS so the layout
   is correct immediately on paint — no JS-timing flicker / left-drift.
----------------------------------------------------------------------- */
@media only screen and (min-width: 40.063em) {

  /* Full-width top-bar on large screens */
  .site-header .top-bar,
  .top-bar { overflow: visible; width: 100%; }

  /* Title link no longer needs vw cap */
  .top-bar .name h1 a {
    max-width: none;
    width: auto;
  }

  /* Title area floats left */
  .top-bar .title-area {
    float: left;
  }

  /* Nav section floats right — fills remaining width */
  .top-bar-section {
    float: right;
  }

  .top-bar-section ul {
    float: right;
    display: block;
    height: 45px;
  }

  .top-bar-section ul li {
    float: left;
    height: 45px;
    line-height: 45px;
  }

  .top-bar-section ul.right {
    float: right !important;
  }

  /* Dropdown opens below, aligned to right edge of parent */
  .top-bar-section ul.right li .dropdown {
    left: auto;
    right:  0;
  }
}

/* -----------------------------------------------------------------------
   Header image (if used)
----------------------------------------------------------------------- */
.header-image { margin-bottom: 1rem; }
.header-image img { border: 5px solid #eeeeee; }

/* -----------------------------------------------------------------------
   Entry meta
----------------------------------------------------------------------- */
.entry-meta {
  color: #aaaaaa;
  line-height: 1.5rem;
}

/* Author and category links — identical appearance */
.entry-meta .byline a,
.entry-meta .cat-links a {
  color: #008cba;
  font-weight: normal;
  text-decoration: none;
}

.entry-meta .byline a:hover,
.entry-meta .cat-links a:hover {
  color: #006a91;
}

.entry-meta .sep,
span.sep {
  border-top: 1px solid #ececec;
  display: block;
  margin: 15px 0;
  position: relative;
}

.entry-meta .posted-on,
.entry-meta .comments-link {
  font-size: 0.8rem;
  line-height: 20px;
  margin-right: 10px;
}

.entry-meta .posted-on a:hover,
.entry-meta .comments-link a:hover {
  text-decoration: none;
}

.entry-meta .posted-on i,
.entry-meta .comments-link i {
  font-size: 14px;
  margin-right: 2px;
}

/* -----------------------------------------------------------------------
   Post index cards
----------------------------------------------------------------------- */
article.index-card {
  border-bottom: 1px solid #ececec;
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
}

article.index-card h2 {
  font-size: 1.8rem;
  margin-bottom: 0.3rem;
}

article.index-card h2 a { color: #008cba; }
article.index-card h2 a:hover { color: #005f80; }

article.index-card .entry-content { margin-top: 0.5rem; }

article.index-card figure img {
  max-width: 100%;
  height: auto;
  margin-bottom: 0.8rem;
}

/* -----------------------------------------------------------------------
   Pagination
----------------------------------------------------------------------- */
.pagination-centered {
  text-align: center;
  margin: 1.5rem 0;
}

.pagination-centered ul.page-numbers {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 3px;
}

.pagination-centered ul.page-numbers li { display: inline-block; }

.pagination-centered ul.page-numbers li a,
.pagination-centered ul.page-numbers li span {
  display: inline-block;
  padding: 0.4rem 0.75rem;
  color: #008cba;
  border: 1px solid #ddd;
  border-radius: 3px;
  line-height: 1.4;
}

.pagination-centered ul.page-numbers li a:hover {
  background: #f5f5f5;
  text-decoration: none;
}

.pagination-centered ul.page-numbers li span.current {
  background: #008cba;
  color: #fff;
  border-color: #008cba;
}

.pagination-centered ul.page-numbers li span.dots {
  border: none;
  color: #aaa;
}

/* -----------------------------------------------------------------------
   Sidebars
----------------------------------------------------------------------- */
#sidebar .panel,
#sidebar-left .panel {
  background-color: #fff;
  border: none;
  padding: 0.75rem 0;
}

#sidebar .widget h4,
.footer-widget .widget h4,
#sidebar-left .widget h4 {
  font-size: 1.2rem;
  font-weight: normal;
}

#sidebar-left .widget h4 {
  border-bottom: 1px solid #dddddd;
  color: #888888;
  padding-bottom: 1rem;
}

#sidebar ul.bwp-rc-ulist li { margin: 0.9rem 0; }

/* Left sidebar category tree indentation */
#sidebar-left .children li::before {
  color: #dddddd;
  content: "─";
  left: 0;
  position: absolute;
  top: 1px;
}

#sidebar-left .children li {
  border-left: 1px solid #dddddd;
  margin-left: 5px;
  padding-left: 20px;
  position: relative;
  list-style-type: none;
}

#sidebar-left ul.children { margin-left: 0; }

/* Category icons */
.widget_categories ul li { list-style-type: none; }
.widget_categories ul li::before {
  font-family: FontAwesome;
  content: '\f115';
  font-size: 14px;
  margin-right: 10px;
  color: #008cba;
}

/* User-online, popular posts, recent comments widget icons */
.widget_useronline ul li { list-style-type: none; padding: 0.2rem 0; }
.widget_useronline ul li::before { font-family: FontAwesome; content: '\f007'; margin-right: 0.3rem; color: #008cba; }

.widget_wppp ul li::before { font-family: FontAwesome; content: '\f091'; margin-right: 0.2rem; color: #008cba; }

.bwp-rc-widget ul li::before { font-family: FontAwesome; content: '\f075'; color: #008cba; }

ul.mfp_favorites { margin-left: 0; }
ul.mfp_favorites li { list-style-type: none; }
ul.mfp_favorites li::before {
  font-family: FontAwesome;
  content: '\f004';
  font-size: 0.8rem;
  margin-right: 0.3rem;
  color: #008cba;
}

/* -----------------------------------------------------------------------
   Search form (sidebar)
----------------------------------------------------------------------- */
#searchform .row { margin-bottom: 0; }
#searchform input[type="text"] { font-family: "SolaimanLipi", "Open Sans", sans-serif; }

/* -----------------------------------------------------------------------
   Recent comments block (sidebar)
----------------------------------------------------------------------- */
.wp-block-latest-comments,
ol.wp-block-latest-comments {
  padding: 0;
  margin: 0;
  list-style: none;
}

.wp-block-latest-comments__comment {
  display: flex;
  align-items: flex-start;
  margin-bottom: 0.9rem;
  gap: 0.5rem;
}

.wp-block-latest-comments__comment img.avatar {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 10px;
}

.wp-block-latest-comments__comment-meta {
  font-size: 0.85rem;
  line-height: 1.4;
}

.wp-block-latest-comments__comment-author,
.wp-block-latest-comments__comment-link {
  color: #008cba;
}

/* -----------------------------------------------------------------------
   Main content area
----------------------------------------------------------------------- */
#content { border: none; }

/* -----------------------------------------------------------------------
   Single post — breadcrumb
----------------------------------------------------------------------- */
.post-breadcrumb {
  font-size: 0.85rem;
  color: #aaa;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #ececec;
}

.post-breadcrumb a { color: #008cba; }
.post-breadcrumb a:hover { color: #006a91; }
.post-breadcrumb span { margin: 0 0.3rem; }

/* -----------------------------------------------------------------------
   Single post — author profile sidebar
----------------------------------------------------------------------- */
#author-sidebar {
  padding-right: 1rem;
}

.author-profile-box {
  text-align: center;
}

.author-avatar {
  margin-bottom: 0.5rem;
}

.author-avatar img {
  border-radius: 6px;
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.author-display-name {
  font-weight: bold;
  font-size: 0.95rem;
  color: #444;
  margin: 0.4rem 0 0.8rem;
  text-align: center;
}

.author-bio {
  font-size: 0.875rem;
  color: #555;
  text-align: left;
  border-top: 1px solid #ececec;
  padding-top: 0.75rem;
  margin-bottom: 0.75rem;
  line-height: 1.6;
}

.author-bio p { text-align: left; margin-bottom: 0.5rem; }

.author-favorites {
  text-align: left;
  margin-top: 1rem;
}

.author-favorites h5 {
  font-size: 1rem;
  font-weight: normal;
  color: #888;
  border-bottom: 1px solid #ddd;
  padding-bottom: 0.5rem;
  margin-bottom: 0.5rem;
}

.author-favorites ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.author-favorites ul li {
  padding: 0.25rem 0;
  font-size: 0.9rem;
}

.author-favorites ul li a {
  color: #008cba;
}

.author-favorites ul li a:hover {
  color: #006a91;
}

/* -----------------------------------------------------------------------
   Single post
----------------------------------------------------------------------- */
.entry-title {
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
}

.entry-content {
  margin-top: 1rem;
  line-height: 1.8;
}

.entry-footer {
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid #ececec;
  color: #aaa;
  font-size: 0.85rem;
}

/* Author bio box */
.entry-author {
  background: #f9f9f9;
  border-left: 3px solid #008cba;
  margin-top: 2rem;
}

.entry-author p {
  padding: 1rem 1rem 1rem 3.25rem;
  margin-bottom: 0;
}

/* Post navigation */
.nav-links {
  display: flex;
  justify-content: space-between;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid #ececec;
}

/* -----------------------------------------------------------------------
   Images
----------------------------------------------------------------------- */
.alignleft  { float: left; }
.alignright { float: right; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

img.alignleft  { margin: 5px 20px 5px 0; }
img.alignright { margin: 5px 0 5px 20px; }
img.aligncenter { margin: 5px auto; }
img.alignnone  { margin: 5px 0; }

.wp-caption.alignleft  { margin: 5px 10px 5px 0; }
.wp-caption.alignright { margin: 5px 0 5px 10px; }

.wp-caption.alignleft + ul,
.wp-caption.alignleft + ol { list-style-position: inside; }

.wp-caption {
  border: 1px solid #ddd;
  text-align: center;
  background-color: #f3f3f3;
  padding-top: 4px;
  margin: 10px auto;
  border-radius: 3px;
  display: block;
  max-width: 100%;
}

.wp-caption img { margin: 0; padding: 0; border: 0; }

.wp-caption p.wp-caption-text {
  font-size: 12px;
  font-family: "SolaimanLipi", BNG, Vrinda;
  line-height: 17px;
  padding: 0 4px 5px;
  margin: 0;
  text-align: center;
}

.avatar { border-radius: 10px; }

#profile-item img { margin: 0 auto; display: block; }

/* -----------------------------------------------------------------------
   Archive / search header
----------------------------------------------------------------------- */
.archive-header {
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #ececec;
}

.archive-header h1 { font-size: 1.6rem; color: #444; }

/* -----------------------------------------------------------------------
   Comments
----------------------------------------------------------------------- */
.comments-area { margin-top: 2rem; }

.comments-title {
  font-size: 1.3rem;
  border-bottom: 1px solid #ececec;
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}

ol.commentlist {
  list-style: none;
  margin-left: 0;
  padding: 0;
}

ol.commentlist li section.comment { margin-left: 0; }
ol.commentlist ul.children { margin-left: 1.5rem; }
ol.commentlist li section.comment a.comment-reply-link { font-weight: normal; }
.comment hr { margin-bottom: 0.2rem; }
ol.commentlist p { font-size: 0.9775rem; }
ol.commentlist li .author-meta cite.fn { font-weight: normal; }

.comment-awaiting-moderation {
  background: #fff8e1;
  border-left: 3px solid #ffc107;
  padding: 0.4rem 0.75rem;
  font-size: 0.85rem;
  color: #888;
}

.no-comments {
  color: #aaa;
  font-size: 0.9rem;
}

textarea#comment { min-height: 150px; }

/* -----------------------------------------------------------------------
   Tables
----------------------------------------------------------------------- */
table { width: 100%; }
table tr th, table tr td { padding: 0.3rem; }
table.zebra tr.alt td { background: #eeeeee; border-bottom: 1px solid #eeeeee; }

/* -----------------------------------------------------------------------
   Footer
----------------------------------------------------------------------- */
footer.full-width { border-top: none; }

footer.full-width .love-reverie {
  padding: 1rem 0;
  background: #f7f7f7;
  border-top: 1px solid #e5e5e5;
}

footer.full-width .love-reverie p { margin: 0; color: #888; font-size: 0.9rem; }

footer.full-width ul.inline-list { margin: 0; padding: 0; }
footer.full-width ul.inline-list li { display: inline-block; margin-left: 1rem; }
footer.full-width ul.inline-list li a { color: #888; font-size: 0.9rem; }
footer.full-width ul.inline-list li a:hover { color: #008cba; }

/* -----------------------------------------------------------------------
   Miscellaneous
----------------------------------------------------------------------- */
.breadcrumbs { background-color: #fafafa; border: none; padding: 0.5rem 0; font-size: 0.85rem; color: #888; }
.breadcrumbs a { color: #008cba; }

.wcp14-like { margin-bottom: 1rem; }
.wcup-user img { width: 20px; height: auto; }

/* -----------------------------------------------------------------------
   Responsive
----------------------------------------------------------------------- */

/* -----------------------------------------------------------------------
   Mobile (≤640px)
----------------------------------------------------------------------- */
@media only screen and (max-width: 40em) {

  /* No justified text — causes word-spacing gaps on narrow screens */
  p { text-align: left; }

  /* Scale down headings */
  h1 { font-size: 1.6rem; }
  article.index-card h2 { font-size: 1.3rem; }
  .entry-title { font-size: 1.4rem; }
  .archive-header h1 { font-size: 1.3rem; }

  /* All post images responsive */
  .entry-content img,
  .entry-content iframe {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Clear image floats — no room on narrow screens */
  img.alignleft,
  img.alignright {
    float: none;
    display: block;
    margin: 0.5rem auto;
    max-width: 100%;
  }
  .wp-caption.alignleft,
  .wp-caption.alignright {
    float: none;
    margin: 0.5rem auto;
    max-width: 100% !important;
    width: auto !important;
  }

  /* Tables: scroll horizontally instead of overflowing viewport */
  .entry-content table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  /* Entry meta: stack date and comments on their own lines */
  .entry-meta .posted-on,
  .entry-meta .comments-link {
    display: block;
    margin-right: 0;
    margin-bottom: 0.25rem;
  }

  /* Post prev/next navigation: stack vertically */
  .nav-links {
    flex-direction: column;
    gap: 0.5rem;
  }

  /* Author bio: remove large left-indent, float avatar */
  .entry-author p { padding: 0.75rem; }
  .entry-author img.avatar {
    float: left;
    margin: 0 0.75rem 0.5rem 0;
  }

  /* Sidebars: visual separator when stacked below content */
  #sidebar,
  #sidebar-left {
    margin-top: 1.5rem;
    border-top: 1px solid #ececec;
    padding-top: 1rem;
  }

  /* Reduce nested comment indent so it stays on screen */
  ol.commentlist ul.children { margin-left: 0.75rem; }

  /* Footer: center everything */
  footer.full-width .love-reverie .large-4,
  footer.full-width .love-reverie .large-8 { text-align: center; }
  footer.full-width ul.inline-list {
    float: none !important;
    text-align: center;
  }
  footer.full-width ul.inline-list li { margin: 0 0.5rem; }
}

/* -----------------------------------------------------------------------
   Tablet (641px – 1024px)
   Templates use medium-8 / medium-4 column classes, giving:
     Row 1 → [Content 8 cols] [Left sidebar 4 cols]
     Row 2 → [Right sidebar 12 cols full-width]
----------------------------------------------------------------------- */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {

  /* Moderate title sizes */
  article.index-card h2 { font-size: 1.5rem; }
  .entry-title { font-size: 1.6rem; }

  /* Wrap long prev/next post titles */
  .nav-links { flex-wrap: wrap; gap: 0.5rem; }

  /* Right sidebar separator when it reflows to its own row */
  #sidebar {
    margin-top: 1.5rem;
    border-top: 1px solid #ececec;
    padding-top: 1rem;
  }
}

/* -----------------------------------------------------------------------
   Large screens (≥1025px)
----------------------------------------------------------------------- */
@media only screen and (min-width: 64.063em) {
  #content { padding: 0; }
  .page   #content.large-9,
  .single #content.large-9,
  .archive #content.large-9,
  .author  #content.large-9 { padding-right: 2.125rem; }
}
