
/**
 * File: assets/archive.css
 * --------------------------------------------------------------

 */

/* assets/archive.css */
.canship-archive{ --gap:24px; --radius:16px; --shadow:0 4px 16px rgba(0,0,0,.06); --muted:#70757a; }

/* Featured posts (first 4) - hero + stacked list */
.canship-archive__featured{ 
  /* Height harmonization variable for list items */
  --list-h: clamp(140px, 15vw, 180px);
  display:grid; 
  grid-template-columns: 1.6fr 1fr; 
  gap:var(--gap); 
  margin-bottom:calc(var(--gap) * 2);
  align-items:start;
}
.canship-archive__featured-list{ 
  display:flex; 
  flex-direction:column; 
  gap:var(--gap);
}
@media (max-width: 1024px){
  .canship-archive__featured{ grid-template-columns: 1.3fr 1fr; }
}
@media (max-width: 768px){ 
  .canship-archive__featured{ 
    grid-template-columns:1fr; 
    gap:calc(var(--gap) * 0.75);
  }
}

/* Regular posts grid (remaining posts) */
.canship-archive__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--gap); }
@media (max-width: 1024px){ .canship-archive__grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width: 640px){ .canship-archive__grid{ grid-template-columns:1fr; } }

.canship-card{ background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); display:flex; flex-direction:column; }
.canship-card__thumb{ display:block; position:relative; background:#f2f4f7; }
.canship-archive__img{ 
  width:100%; height:100%; display:block; 
  background-size: cover; background-position:center; background-repeat:no-repeat;
}
.canship-card__body{ display:flex; flex-direction:column; min-height:0; padding:16px; gap:10px; }
.canship-archive__img.--placeholder{ width:100%; height:100%; background:linear-gradient(135deg,#f6f7f9,#e9ecf3); }
.canship-card__meta{ display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.canship-card__badge{ background:#e6f4ea; color:#137333; font-size:12px; font-weight:600; padding:4px 8px; border-radius:999px; }
.canship-card__date{ color:var(--muted); font-size:12px; }
.canship-card__title{ font-size:18px; margin:0; }
.canship-card__title a{ color:#111; text-decoration:none; }
.canship-card__title a:hover{ text-decoration:underline; }
.canship-card__excerpt{ color:#3c4043; margin:0; }
.canship-card__button{ align-self:flex-start; margin-top:auto; display:inline-block; padding:8px 14px; border-radius:999px; background:#111; color:#fff; text-decoration:none; font-size:14px; }
.canship-card__button:hover{ opacity:.9; }

/* Featured card styling - larger and more prominent */
.canship-card--featured{ 
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}
.canship-card--featured .canship-card__thumb{ 
  aspect-ratio: 4 / 3; /* default for featured unless overridden by variant */
}
.canship-card--featured .canship-card__body{ 
  padding:20px; 
  gap:12px; 
}
.canship-card--featured .canship-card__title{ 
  font-size:22px; 
  line-height:1.3;
}
.canship-card--featured .canship-card__excerpt{ 
  font-size:15px; 
  line-height:1.5;
}
.canship-card--featured .canship-card__badge{ 
  font-size:13px; 
  padding:5px 10px; 
}
.canship-card--featured .canship-card__date{ 
  font-size:13px; 
}
.canship-card--featured .canship-card__button{ 
  padding:10px 16px; 
  font-size:15px; 
}

/* Featured cards responsive adjustments */
@media (max-width: 768px){ 
  .canship-card--featured .canship-card__body{ 
    padding:16px; 
  }
  .canship-card--featured .canship-card__title{ 
    font-size:20px; 
  }
  .canship-card--featured .canship-card__excerpt{ 
    font-size:14px; 
  }
}

/* Variants within featured section */
.canship-card--hero{ 
  height: calc(var(--list-h) * 3 + var(--gap) * 2); 
  display:flex; 
  flex-direction:column; 
}
.canship-card--hero .canship-card__thumb{ 
  flex: 0 0 58%; 
  min-height: 0;
}
.canship-card--hero .canship-card__body{ 
  flex: 1; 
  display:flex; 
  flex-direction:column; 
  justify-content: space-between;
  padding: 20px;
  gap: 12px;
}
.canship-card--hero .canship-card__title{ 
  font-size:26px; 
  line-height: 1.3;
  margin: 0;
}
.canship-card--hero .canship-card__excerpt{ 
  font-size:16px; 
  line-height: 1.5;
  margin: 0;
}

.canship-card--list{ 
  flex-direction: row; 
  align-items: stretch; 
  height: var(--list-h); /* Fixed height for consistent sizing */
}
.canship-card--list .canship-card__thumb{ 
  width: 40%;
  flex: 0 0 40%;
  /* Force a consistent visual height for all stacked list items */
  height: 100%;
  aspect-ratio: auto;
  overflow: hidden;
}
.canship-card--list .canship-card__body{ 
  padding:12px 14px; 
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.canship-card--list .canship-card__title{ 
  font-size:16px; 
  line-height: 1.3;
  margin-bottom: 4px;
  display: -webkit-box;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.canship-card--list .canship-card__excerpt{ 
  display: none; /* Hide excerpt for list cards as requested */
}
.canship-card--list .canship-card__button{ 
  margin-top: auto;
  padding: 6px 12px;
  font-size: 13px;
  align-self: flex-start;
}

/* General spacing fixes */
.canship-card__meta{ margin-bottom: 6px; }

/* Ensure hero responsiveness when stacked on small screens */
@media (max-width: 768px){
  .canship-card--hero{ height: auto; }
  .canship-card--hero .canship-card__thumb{ flex: 0 0 auto; aspect-ratio: 16 / 9; }
}

.canship-archive__sentinel{ display:flex; justify-content:center; align-items:center; padding:28px 0; }
.canship-archive__spinner{ width:28px; height:28px; border-radius:50%; border:3px solid #e5e7eb; border-top-color:#111; animation:spin 1s linear infinite; display:inline-block; }
.canship-archive__sentinel.--done .canship-archive__spinner{ display:none; }
.canship-archive__sentinel.--loading .canship-archive__spinner{ opacity:1; }
@keyframes spin{ to { transform:rotate(360deg); } }


.canship-card--list .canship-card__title{
    margin-top: 0px !important;
}





@media (max-width: 768px){
    /* .canship-card--list .canship-card__title{
        font-size: 14px !important;
    } */
    .canship-card--list {
        height: 165px;
    }
}

/* ========================================
   SINGLE POST LAYOUT STYLES
   ======================================== */

/* Single Post Container */
.canship-single {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 20px;
}



/* Single Post Layout */
.canship-single__layout {
    display: grid;
    grid-template-columns: 1fr 0.3fr;
    gap: 0px;
    align-items: start;
}

/* Main Content */
.canship-single__main {
    min-width: 0; /* Prevent grid overflow */
}

.canship-single__post {
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.canship-single__header {
    padding: 30px 30px 0;
}

.canship-single__meta {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.canship-single__category {
    background: #e6f4ea;
    color: #137333;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.canship-single__date {
    color: var(--muted);
    font-size: 14px;
}

.canship-single__title {
    font-size: 32px;
    line-height: 1.2;
    margin: 0 0 25px 0;
    color: #111;
    font-weight: 700;
}

.canship-single__featured-image {
    margin: 0 -30px 30px;
}

.canship-single__image {
    width: 100%;
    height: auto;
    display: block;
}

.canship-single__content {
    padding: 0 30px 30px;
    line-height: 1.7;
    color: #374151;
    font-size: 16px;
}

.canship-single__content h2,
.canship-single__content h3,
.canship-single__content h4 {
    color: #111;
    /* margin-top: 30px; */
    /* margin-bottom: 15px; */
}

.canship-single__content h2 {
    font-size: 24px;
}

.canship-single__content h3 {
    font-size: 20px;
}

.canship-single__content h4 {
    font-size: 18px;
}

.canship-single__content p {
    margin-bottom: 20px;
}

.canship-single__content ul,
.canship-single__content ol {
    margin-bottom: 20px;
    padding-left: 20px;
}

.canship-single__content li {
    margin-bottom: 8px;
}

.canship-single__content blockquote {
    border-left: 4px solid #111;
    padding-left: 20px;
    margin: 25px 0;
    font-style: italic;
    color: #6b7280;
}

.canship-single__footer {
    padding: 0 30px 30px;
    border-top: 1px solid #e5e7eb;
    margin-top: 30px;
    padding-top: 30px;
}

.canship-single__tags {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.canship-single__tags-label {
    font-weight: 600;
    color: #111;
    font-size: 14px;
}

.canship-single__tag {
    background: #f3f4f6;
    color: #374151;
    padding: 4px 12px;
    border-radius: 999px;
    text-decoration: none;
    font-size: 12px;
    transition: all 0.2s ease;
}

.canship-single__tag:hover {
    background: #111;
    color: #fff;
}

/* Sidebar */
.canship-single__sidebar {
    position: sticky;
    top: 20px;
    margin-top: 65px;
}

.canship-sidebar {
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 0px;
}

.canship-sidebar__title {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 20px 0;
    color: #111;
    border-bottom: 2px solid #e5e7eb;
    padding-bottom: 10px;
}

.canship-sidebar__recent {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.canship-sidebar__post {
    display: flex;
    gap: 15px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f3f4f6;
}

.canship-sidebar__post:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.canship-sidebar__thumb {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    border-radius: 8px;
    overflow: hidden;
    background: #f3f4f6;
}

.canship-sidebar__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.canship-sidebar__post-content {
    flex: 1;
    min-width: 0;
}

.canship-sidebar__post-title {
    font-size: 14px;
    line-height: 1.4;
    margin: 0 0 8px 0;
    font-weight: 500;
}

.canship-sidebar__post-title a {
    color: #111;
    text-decoration: none;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.canship-sidebar__post-title a:hover {
    color: #6b7280;
}

.canship-sidebar__post-date {
    font-size: 12px;
    color: var(--muted);
}

.canship-sidebar__empty {
    color: var(--muted);
    font-style: italic;
    text-align: center;
    padding: 20px 0;
}

/* Error state */
.canship-single__error {
    background: #fef2f2;
    color: #dc2626;
    padding: 20px;
    border-radius: var(--radius);
    text-align: center;
    border: 1px solid #fecaca;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .canship-single__layout {
        grid-template-columns: 1fr 280px;
        gap: 30px;
    }
    
    .canship-single__title {
        font-size: 28px;
    }
}

@media (max-width: 768px) {
    .canship-single {
        padding: 0px;
    }
    
    .canship-single__layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .canship-single__sidebar {
        position: static;
    }
    
    .canship-single__header {
        padding: 20px 20px 0;
    }
    
    .canship-single__content {
        padding: 0 20px 20px;
    }
    
    .canship-single__footer {
        padding: 0 20px 20px;
    }
    
    .canship-single__title {
        font-size: 24px;
    }
    
    .canship-sidebar {
        padding: 20px;
    }
    

}

@media (max-width: 480px) {
    .canship-single__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .canship-single__title {
        font-size: 22px;
    }
    
    .canship-sidebar__post {
        flex-direction: column;
        gap: 10px;
    }
    
    .canship-sidebar__thumb {
        width: 100%;
        height: 120px;
    }
}

/* ========================================
   SIDEBAR WIDGETS & CUSTOM CONTENT
   ======================================== */

/* Widget area styling */
.canship-sidebar-widgets {
    margin-bottom: 30px;
}

.canship-sidebar-widget {
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    /* padding: 25px; */
    margin-bottom: 20px;
}

.canship-sidebar-widget:last-child {
    margin-bottom: 0;
}

.canship-sidebar-widget__title {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 20px 0;
    color: #111;
    border-bottom: 2px solid #e5e7eb;
    padding-bottom: 10px;
}

/* Custom content styling */
.canship-sidebar--custom {
    margin-bottom: 30px;
}

.canship-sidebar__custom-content {
    line-height: 1.6;
    color: #374151;
}

.canship-sidebar__custom-content h1,
.canship-sidebar__custom-content h2,
.canship-sidebar__custom-content h3,
.canship-sidebar__custom-content h4,
.canship-sidebar__custom-content h5,
.canship-sidebar__custom-content h6 {
    color: #111;
    margin-top: 20px;
    margin-bottom: 10px;
}

.canship-sidebar__custom-content h1 { font-size: 24px; }
.canship-sidebar__custom-content h2 { font-size: 22px; }
.canship-sidebar__custom-content h3 { font-size: 20px; }
.canship-sidebar__custom-content h4 { font-size: 18px; }
.canship-sidebar__custom-content h5 { font-size: 16px; }
.canship-sidebar__custom-content h6 { font-size: 14px; }

.canship-sidebar__custom-content p {
    margin-bottom: 15px;
}

.canship-sidebar__custom-content ul,
.canship-sidebar__custom-content ol {
    margin-bottom: 15px;
    padding-left: 20px;
}

.canship-sidebar__custom-content li {
    margin-bottom: 5px;
}

.canship-sidebar__custom-content a {
    color: #667eea;
    text-decoration: none;
}

.canship-sidebar__custom-content a:hover {
    text-decoration: underline;
}

.canship-sidebar__custom-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 10px 0;
}

.canship-sidebar__custom-content blockquote {
    border-left: 4px solid #667eea;
    padding-left: 15px;
    margin: 20px 0;
    font-style: italic;
    color: #6b7280;
}

/* Widget responsive adjustments */
@media (max-width: 768px) {
    .canship-sidebar-widgets {
        margin-bottom: 20px;
    }
    
    .canship-sidebar-widget {
        padding: 20px;
        margin-bottom: 15px;
    }
    
    .canship-sidebar--custom {
        margin-bottom: 20px;
    }
}

/* ========================================
   RECENT POSTS SHORTCODE
   ======================================== */

.canship-recent-posts {
    margin: 30px 0;
}

.canship-recent-posts__title {
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 25px 0;
    color: #111;
    border-bottom: 2px solid #e5e7eb;
    padding-bottom: 15px;
}

.canship-recent-posts__container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* List Layout (Default) */
.canship-recent-posts--list .canship-recent-posts__container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.canship-recent-posts--list .canship-recent-posts__post {
    display: flex;
    gap: 15px;
    /* padding: 20px; */
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.canship-recent-posts--list .canship-recent-posts__post:hover {
    transform: translateY(-2px);
    /* box-shadow: 0 8px 25px rgba(0,0,0,.1); */
}

.canship-recent-posts--list .canship-recent-posts__thumb {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    background: #f3f4f6;
}

.canship-recent-posts--list .canship-recent-posts__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.canship-recent-posts--list .canship-recent-posts__image--placeholder {
    background: linear-gradient(135deg, #f6f7f9, #e9ecf3);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.canship-recent-posts--list .canship-recent-posts__image--placeholder::before {
    content: "📄";
    font-size: 24px;
    opacity: 0.5;
}

.canship-recent-posts--list .canship-recent-posts__content {
    flex: 1;
    min-width: 0;
}

/* Grid Layout */
.canship-recent-posts--grid .canship-recent-posts__container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.canship-recent-posts--grid[data-columns="1"] .canship-recent-posts__container {
    grid-template-columns: 1fr;
}

.canship-recent-posts--grid[data-columns="2"] .canship-recent-posts__container {
    grid-template-columns: repeat(2, 1fr);
}

.canship-recent-posts--grid[data-columns="4"] .canship-recent-posts__container {
    grid-template-columns: repeat(4, 1fr);
}

.canship-recent-posts--grid[data-columns="5"] .canship-recent-posts__container {
    grid-template-columns: repeat(5, 1fr);
}

.canship-recent-posts--grid .canship-recent-posts__post {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.canship-recent-posts--grid .canship-recent-posts__post:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
}

.canship-recent-posts--grid .canship-recent-posts__thumb {
    display: block;
    aspect-ratio: 16 / 9;
    background: #f3f4f6;
}

.canship-recent-posts--grid .canship-recent-posts__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.canship-recent-posts--grid .canship-recent-posts__image--placeholder {
    background: linear-gradient(135deg, #f6f7f9, #e9ecf3);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.canship-recent-posts--grid .canship-recent-posts__image--placeholder::before {
    content: "📄";
    font-size: 36px;
    opacity: 0.5;
}

.canship-recent-posts--grid .canship-recent-posts__content {
    padding: 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Common Styles */
.canship-recent-posts__post-title {
    font-size: 16px;
    line-height: 1.4;
    margin: 0 0 8px 0;
    font-weight: 600;
}

.canship-recent-posts__post-title a {
    color: #111;
    text-decoration: none;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.canship-recent-posts__post-title a:hover {
    color: #667eea;
}

.canship-recent-posts__date {
    font-size: 13px;
    color: var(--muted);
    margin-bottom: 10px;
}

.canship-recent-posts__excerpt {
    font-size: 14px;
    line-height: 1.5;
    color: #6b7280;
    margin: 0;
    display: -webkit-box;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.canship-recent-posts__empty {
    text-align: center;
    color: var(--muted);
    font-style: italic;
    padding: 40px 20px;
    background: #f9fafb;
    border-radius: var(--radius);
    border: 2px dashed #d1d5db;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .canship-recent-posts--grid .canship-recent-posts__container {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .canship-recent-posts--grid[data-columns="1"] .canship-recent-posts__container {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .canship-recent-posts {
        margin: 20px 0;
    }
    
    .canship-recent-posts__title {
        font-size: 20px;
        margin-bottom: 20px;
    }
    
    .canship-recent-posts--grid .canship-recent-posts__container {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .canship-recent-posts--list .canship-recent-posts__post {
        /* padding: 15px; */
        gap: 12px;
    }
    
    .canship-recent-posts--list .canship-recent-posts__thumb {
        width: 60px;
        height: 60px;
    }
    
    .canship-recent-posts--grid .canship-recent-posts__content {
        padding: 15px;
    }
}