﻿/* ===== DLSM News Theme v2.0 - Premium Light Mode ===== */
:root{
  --bg:#f4f6f9;--bg2:#ffffff;--bg3:#e9ecef;
  --brand-navy:#0f1625;
  --gold:#b88a44;--gold2:#cba26b;
  --text:#0f1625;--text-body:#4a5568;--text-muted:#718096;
  --border:rgba(15,22,37,0.08);
  --shadow:0 4px 20px rgba(15,22,37,0.04);
  --shadow-hover:0 12px 30px rgba(15,22,37,0.08);
  --radius:8px;--max-w:1200px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:'Noto Sans SC',sans-serif;background:var(--bg);color:var(--text-body);line-height:1.8;word-break:break-word;overflow-wrap:break-word}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold2)}
img{max-width:100%;height:auto;display:block}

/* ===== LAYOUT ===== */
.site-main{min-height:60vh}
.page-wrap{max-width:var(--max-w);margin:0 auto;padding:40px 20px;display:grid;grid-template-columns:1fr 300px;gap:40px;align-items:start}
.section-title{font-size:1.4rem;font-weight:700;color:var(--text);border-left:4px solid var(--gold);padding-left:12px;margin-bottom:28px}

/* ===== NEW CAROUSEL ===== */
.carousel {
    position: relative;
    width: 100%;
    height: 350px;
    overflow: hidden;
    border-radius: var(--radius);
    margin-bottom: 2rem;
    box-shadow: var(--shadow);
    border: 1px solid transparent;
}
.carousel-inner {
    display: flex;
    width: 300%;
    height: 100%;
    animation: slideShow 15s infinite;
}
.carousel-item {
    width: 33.3333%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 3rem;
}
.carousel-content {
    max-width: 600px;
    color: #fff;
}
.carousel-content h2 {
    font-size: 2.2rem;
    margin-bottom: 1rem;
    color: #fff;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}
.carousel-content p {
    font-size: 1.1rem;
    opacity: 0.9;
    line-height: 1.6;
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
@keyframes slideShow {
    0%, 20% { transform: translateX(0); }
    33.33%, 53.33% { transform: translateX(-33.3333%); }
    66.66%, 86.66% { transform: translateX(-66.6666%); }
    100% { transform: translateX(0); }
}

/* ===== NEW ARTICLE CARDS ===== */
.article-list{display:flex;flex-direction:column;gap:24px}
.article-card{
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 1.5rem;
    background:var(--bg2);
    border:1px solid transparent;
    border-radius:var(--radius);
    padding: 1.5rem;
    overflow:hidden;
    box-shadow: var(--shadow);
    transition:transform .3s ease, border-color .3s, box-shadow .3s;
}
.article-card:hover{
    border-color:var(--gold2);
    transform: translateY(-4px);
    box-shadow: var(--shadow-hover);
}
.card-thumb{
    flex-shrink: 0;
    width: 240px;
    height: 160px;
    overflow: hidden;
    border-radius: 6px;
    display: block;
}
.card-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition: transform 0.3s ease;
}
.article-card:hover .card-thumb img {
    transform: scale(1.05);
}
.card-body{
    display:flex;
    flex-direction:column;
    flex-grow: 1;
}
.card-meta{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-muted); margin-bottom: 8px;}
.cat-tag{background:rgba(203,162,107,0.1);color:var(--gold);font-size:12px;padding:2px 10px;border-radius:20px; font-weight:500;}
.card-title a{font-size:1.3rem;font-weight:700;color:var(--text);transition:color .2s; margin-bottom: 10px; display:block; line-height:1.4;}
.card-title a:hover{color:var(--gold)}
.card-intro{font-size:14px;color:var(--text-body);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden; margin-bottom: 12px; line-height: 1.6;}
.read-more{font-size:13px;color:var(--gold);margin-top:auto;align-self:flex-start; font-weight:500;}
.no-content{color:var(--text-muted);padding:40px 0;text-align:center}

/* ===== PAGINATION ===== */
.pagination{margin-top:32px;display:flex;justify-content:center;gap:8px}
.pagination a,.pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 12px;background:var(--bg2);border:1px solid var(--border);border-radius:4px;color:var(--text-body);font-size:14px;transition:all .2s; font-weight:500;}
.pagination a:hover{border-color:var(--gold);color:var(--gold); box-shadow:0 2px 8px rgba(203,162,107,0.15);}
.pagination .current{background:var(--brand-navy);border-color:var(--brand-navy);color:#ffffff}

/* ===== SIDEBAR ===== */
.site-sidebar{display:flex;flex-direction:column;gap:24px;position:sticky;top:80px}
.widget{background:#ffffff;border:1px solid rgba(203,162,107,0.15);box-shadow:var(--shadow);border-radius:var(--radius);padding:24px;transition:transform 0.3s ease,box-shadow 0.3s ease;}
.widget:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover);}
.widget-title{font-size:1.15rem;font-weight:700;color:var(--brand-navy);border-bottom:1px solid rgba(15,22,37,0.08);padding-bottom:12px;margin-bottom:16px;display:flex;align-items:center;}
.widget-title::before{content:'';display:inline-block;width:4px;height:18px;background:var(--gold);margin-right:10px;border-radius:2px;}

/* Sidebar Grid */
.sidebar-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; list-style: none; padding: 0; margin: 0; }
.sidebar-grid li { margin: 0 !important; }
.sidebar-grid a { background: #f8f9fa; padding: 10px 4px; display: block; text-align: center; border-radius: 6px; font-size: 13px; font-weight: 500; color: var(--text-body); border: 1px solid transparent; transition: all 0.3s; }
.sidebar-grid a:hover { background: var(--brand-navy); color: #fff; border-color: var(--brand-navy); box-shadow: 0 4px 10px rgba(15,22,37,0.1); transform: translateY(-2px); }

/* Sidebar Lists */
.cat-list,.recent-list{list-style:none;display:flex;flex-direction:column;gap:0}
.cat-list a,.recent-list a{position:relative;color:var(--text-body);font-size:14px;transition:all .3s ease;display:flex;justify-content:space-between;padding:12px 0 12px 14px;border-bottom:1px solid var(--border);line-height:1.5}
.cat-list li:last-child a,.recent-list li:last-child a{border-bottom:none;padding-bottom:4px;}
.cat-list a::before,.recent-list a::before{content:'';position:absolute;left:0;top:20px;width:5px;height:5px;background:var(--gold);border-radius:50%;transition:all .3s ease;}
.cat-list a:hover,.recent-list a:hover{color:var(--brand-navy);padding-left:18px;font-weight:500;}
.cat-list a:hover::before,.recent-list a:hover::before{background:var(--brand-navy);transform:scale(1.2);}
.cat-count {font-size: 12px; color: var(--text-muted);}

/* Tag Cloud */
.tag-cloud { display: flex; flex-wrap: wrap; gap: 8px; }
.tag-cloud a { background-color: #f8f9fa; color: var(--text-body); padding: 6px 14px; border-radius: 4px; font-size: 13px; border:1px solid var(--border); transition: all 0.3s; }
.tag-cloud a:hover { background-color: var(--brand-navy); color: #fff; border-color:var(--brand-navy); transform: translateY(-1px); }

/* Promo Block */
.promo-block { background: linear-gradient(135deg, #0f1625, #1a2540); border: none; text-align: center; padding: 28px 24px; box-shadow: var(--shadow); border-radius: var(--radius); }
.promo-block h3 { color: var(--gold2); margin-bottom: 12px; font-size: 1.25rem; font-weight: 700;}
.promo-block p { font-size: 13px; color: #a0aec0; margin-bottom: 24px; line-height: 1.6; }
.promo-btn { display: inline-block; background: var(--gold2); color: #0f1625 !important; font-weight: 700; padding: 12px 28px; border-radius: 30px; transition: all 0.3s; box-shadow: 0 4px 15px rgba(203,162,107,0.3); }
.promo-btn:hover { background: #dfb67e; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(203,162,107,0.4); }

/* ===== SINGLE ARTICLE ===== */
.single{grid-column:1}
.page-wrap:has(.single){grid-template-columns:1fr 300px}
.single-header{margin-bottom:24px}
.single-header h1{font-size:2rem;line-height:1.4;color:var(--text);margin:12px 0; font-weight:700;}
.single-meta{display:flex;gap:16px;font-size:13px;color:var(--text-muted)}
.single-thumb{width:100%;border-radius:var(--radius);margin-bottom:28px;max-height:450px;object-fit:cover; box-shadow:var(--shadow);}
.single-content{color:var(--text-body);font-size:1.05rem;line-height:1.9}
.single-content h2, .single-content h3 { color: var(--text); margin: 36px 0 16px; font-size: 1.5rem; font-weight: 700; border-left: 4px solid var(--gold); padding-left: 14px; }
.single-content p { margin-bottom: 24px; }
.single-content strong { color: var(--text); font-weight:600;}
.single-content img{border-radius:var(--radius);margin:24px 0; box-shadow: 0 2px 10px rgba(0,0,0,0.05);}
.risk-disclaimer{margin-top:40px;padding:20px;background:#f8f9fa;border-left:4px solid var(--brand-navy);border-radius:4px;font-size:13.5px;color:var(--text-body); line-height:1.6;}

/* Related Posts Spider Trap */
.related-posts { margin-top: 48px; padding: 24px; background: rgba(203,162,107,0.03); border: 1px solid rgba(203,162,107,0.2); border-radius: var(--radius); }
.related-posts h3 { font-size: 1.15rem; color: var(--brand-navy); margin-bottom: 20px; font-weight: 700; display: flex; align-items: center; }
.related-posts h3::before { content: ''; display: inline-block; width: 4px; height: 18px; background: var(--gold); margin-right: 10px; border-radius: 2px; }
.related-posts ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.related-posts li { margin: 0 !important; }
.related-posts li a { display: block; padding: 12px 16px; background: #fff; border-radius: 6px; border: 1px solid var(--border); color: var(--text-body); font-size: 14px; line-height: 1.5; transition: all 0.3s ease; }
.related-posts li a:hover { color: var(--gold); border-color: var(--gold); box-shadow: 0 4px 12px rgba(203,162,107,0.1); transform: translateX(4px); }

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .page-wrap{grid-template-columns:1fr}
  .site-sidebar{position:static}
  .article-card{flex-direction:column; gap: 1rem;}
  .card-thumb{width:100%;height:200px}
  .carousel{height: 250px;}
  .carousel-item{padding: 1.5rem;}
  .carousel-content h2{font-size: 1.5rem;}
}


