/*
Theme Name: DaoGiao Theme
Theme URI: https://daogiao.vn
Author: DaoGiao Team
Description: Theme Đạo Giáo Việt Nam
Version: 1.0.0
Text Domain: daogiao

=== ẢNH CÒN DÙNG (11 ảnh) ===
Banner:   daogiao_08am/noon/pm/night/holiday.gif (920×378) → 5 ảnh
Box body: box1_02.gif (nền tiêu đề), box1_04.gif (nền nội dung) → 2 ảnh
Sidebar:  sidebar1_01.gif (nền tiêu đề block 1+2) → 1 ảnh
          sidebar2_01.gif (nền tiêu đề block 3+4) → 1 ảnh
Khác:     logo.png, na.png → 2 ảnh
*/

*{margin:0;padding:0;box-sizing:border-box}
body{background:#fff;font-family:'Times New Roman',Georgia,serif;color:#333}
a{text-decoration:none;color:inherit}
img{border:0;display:block}

/* ===== PAGE ===== */
.page-wrap{width:1280px;margin:0 auto}

/* ===== HEADER #E2C080 ===== */
.site-header{background:#E2C080;display:flex;align-items:center;height:70px;padding:0 20px}
.header-logo{flex-shrink:0;margin-right:20px}
.header-logo img{height:60px;width:auto}
.header-right{flex:1;display:flex;align-items:center}
.header-nav{flex:1;display:flex;align-items:center;justify-content:center;gap:30px}
.header-nav a{font-weight:bold;font-size:16px;color:#3a2a0a;padding:6px 10px}
.header-nav a:hover{color:#fff}
.header-search{flex-shrink:0;background:#E8CFA1;padding:8px 14px;border-radius:4px}
.header-search form{display:flex;gap:4px;margin:0}
.header-search input[type="text"],
.header-search input[type="search"]{width:170px;height:28px;font-size:13px;padding:2px 8px;border:1px solid #c4a05a;border-radius:3px;background:#fff}
.header-search input[type="submit"]{height:28px;font-size:13px;padding:0 14px;cursor:pointer;border:none;border-radius:3px;background:#8b7d3c;color:#fff}
.header-search input[type="submit"]:hover{background:#6d6230}

/* ===== BODY LAYOUT ===== */
.main-area{display:flex;background:#fff}
.content-main{width:920px;padding:10px 0}
.content-gap{width:40px}
.content-side{width:320px;padding:10px 0}
.banner img{width:920px;height:378px;object-fit:cover}
.two-cols{display:flex;gap:20px;padding:10px 0}
.col-l,.col-r{width:450px}

/* =============================================================
   BOX TIN TỨC BODY
   Viền: border 1px vàng, bo góc 6px dưới
   Ảnh: box1_02.gif (nền tiêu đề), box1_04.gif (nền nội dung)
   ============================================================= */
.box-block{
    border:1px solid #c4a05a;
    border-radius:12px;
    overflow:hidden;
    margin-bottom:15px;
}
.box-title{
    background:url('images/box1_02.gif') no-repeat center;
    background-size:100% 100%;
    text-align:center;font-size:22px;font-weight:bold;
    text-transform:uppercase;letter-spacing:2px;
    color:#3a2a0a;line-height:67px;height:67px;
}
.box-body{
    background:url('images/box1_04.gif') repeat-y center;
    background-size:100% auto;
    padding:10px;
}

/* Bài viết trong box */
.art-item{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid rgba(0,0,0,.06)}
.art-item:last-child{border-bottom:none}
.art-thumb{width:69px;height:69px;flex-shrink:0;overflow:hidden;border-radius:2px}
.art-thumb img{width:100%;height:100%;object-fit:cover}
.art-info{flex:1;min-width:0}
.art-title{font-size:15px;font-weight:bold;color:#1a3a1a;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:4px}
.art-title a{color:#1a3a1a}
.art-title a:hover{color:#8b7d3c}
.art-meta{font-size:12px;color:#888;font-weight:bold}
.btn-more{display:inline-block;padding:4px 20px;font-size:12px;font-weight:bold;color:#3a2a0a;background:#E2C080;border-radius:3px;margin:6px 0}
.btn-more:hover{background:#d4ad66}

/* =============================================================
   SIDEBAR BLOCKS
   Viền: border 1px vàng, bo góc 6px dưới
   Ảnh: sidebar1_01.gif hoặc sidebar2_01.gif (nền tiêu đề)
   Nội dung: nền trắng
   ============================================================= */
.sb-block{
    border:1px solid #c4a05a;
    border-radius:12px;
    overflow:hidden;
    margin-bottom:10px;
}
.sb-title{
    text-align:center;font-weight:bold;font-size:15px;
    color:#3a2a0a;padding:8px 0;
    /* background-image set inline per block */
    background-size:100% 100%;
    background-repeat:no-repeat;
    background-position:center;
}
.sb-content{background:#fff;padding:6px 8px}

/* Ngày vía */
.via-list{max-height:360px;overflow-y:auto;scrollbar-width:thin}
.via-list::-webkit-scrollbar{width:5px}
.via-list::-webkit-scrollbar-thumb{background:#c4a05a;border-radius:3px}
.via-item{display:flex;gap:8px;padding:5px 0;align-items:center;border-bottom:1px solid rgba(0,0,0,.06)}
.via-item:last-child{border-bottom:none}
.via-thumb{width:40px;height:40px;flex-shrink:0;border-radius:2px;overflow:hidden}
.via-thumb img{width:100%;height:100%;object-fit:cover}
.via-name{font-weight:bold;font-size:13px;color:#1a3a1a}
.via-name a{color:#1a3a1a}
.via-name a:hover{color:#8B4513}
.via-chi{font-weight:normal;font-size:12px;color:#888}
.via-date{font-style:italic;font-size:11px;color:#666;margin-top:1px}
.via-ancestor{background:#f9f5ee;border-radius:4px;padding:5px 4px;margin-top:2px}

/* Tabs */
.sb-tabs{display:flex}
.sb-tab{flex:1;text-align:center;padding:6px 0;font-weight:bold;font-size:13px;cursor:pointer}
.sb-tab.active{color:#3a2a0a;border-bottom:2px solid #8b7d3c}
.sb-tab:not(.active){color:#999;border-bottom:2px solid #ddd}
.tab-content{display:none}
.tab-content.active{display:block}

/* Bài sidebar */
.sb-art{display:flex;gap:8px;padding:6px 0;align-items:flex-start;border-bottom:1px solid rgba(0,0,0,.06)}
.sb-art:last-child{border-bottom:none}
.sb-art-thumb{width:60px;height:60px;flex-shrink:0;border-radius:2px;overflow:hidden}
.sb-art-thumb img{width:100%;height:100%;object-fit:cover}
.sb-art-title{font-size:13px;font-weight:bold;color:#1a3a1a;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sb-art-title a{color:#1a3a1a}
.sb-art-title a:hover{color:#8b7d3c}
.sb-art-meta{font-size:11px;color:#888;font-weight:bold;margin-top:3px}

/* Linh khí */
.lk-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:8px}
.lk-item{text-align:center}
.lk-img{width:60px;height:90px;margin:0 auto;border:1px solid #c4a05a;border-radius:2px;overflow:hidden}
.lk-img img{width:100%;height:100%;object-fit:cover}
.lk-name{font-size:12px;font-weight:bold;color:#1a3a1a;margin-top:4px;line-height:1.3}

/* Sư Tổ */
.suto-photo{width:200px;height:245px;margin:8px auto;overflow:hidden}
.suto-photo img{width:200px;height:245px;object-fit:cover;border-radius:9px}
.suto-name{font-weight:bold;font-size:15px;color:#1a3a1a;text-align:center}
.suto-via{font-style:italic;font-size:13px;color:#666;text-align:center}
.suto-text{font-size:13px;line-height:1.5;color:#333;padding:8px 12px;text-align:justify}

/* ===== FOOTER #DDBA78 ===== */
.site-footer{background:#DDBA78;padding:20px 0 0}
.footer-cols{display:flex;padding:0 20px;gap:20px}
.footer-col{padding:10px 0}
.ft-col1{width:340px;text-align:center}
.ft-col1 .ft-logo{max-width:200px;margin:0 auto 10px}
.ft-col1 .ft-desc{font-size:14px;line-height:1.5;color:#3a2a0a}
.ft-col2{width:280px}.ft-col3{width:280px}.ft-col4{flex:1}
.ft-title{font-size:18px;font-weight:bold;color:#3a2a0a;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid rgba(0,0,0,.15)}
.footer-col ul{list-style:none}
.footer-col ul li{font-size:15px;line-height:1.8;color:#3a2a0a}
.footer-col ul li a{color:#3a2a0a}
.footer-col ul li a:hover{color:#fff}
.footer-bottom{text-align:center;padding:8px 0;font-size:12px;color:#5a4a1a;font-weight:bold;border-top:1px solid rgba(0,0,0,.1);margin-top:15px}

/* =============================================================
   SINGLE POST – Trang bài viết đơn
   ============================================================= */
.single-post{padding:15px 20px 20px}
.single-cat{margin-bottom:6px}
.single-cat a{
    display:inline-block;padding:3px 12px;font-size:12px;font-weight:bold;
    background:#E2C080;color:#3a2a0a;border-radius:3px;
}
.single-cat a:hover{background:#d4ad66}
.single-title{font-size:26px;font-weight:bold;color:#1a3a1a;line-height:1.3;margin-bottom:8px}
.single-meta{font-size:13px;color:#888;font-weight:bold;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid #eee}
.single-thumb{margin-bottom:15px}
.single-thumb img{width:100%;height:auto;border-radius:4px}
.single-content{font-size:16px;line-height:1.8;color:#333}
.single-content p{margin-bottom:14px}
.single-content h2{font-size:22px;color:#1a3a1a;margin:20px 0 10px}
.single-content h3{font-size:18px;color:#3a2a0a;margin:16px 0 8px}
.single-content img{max-width:100%;height:auto;border-radius:4px;margin:10px 0}
.single-content blockquote{border-left:3px solid #c4a05a;padding:8px 16px;margin:14px 0;background:#faf6ed;font-style:italic}
.single-tags{margin-top:20px;padding-top:12px;border-top:1px solid #eee}
.tag-item{display:inline-block;padding:2px 10px;font-size:12px;background:#f0ead6;color:#5a4a1a;border-radius:3px;margin:0 4px 4px 0}
.tag-item:hover{background:#E2C080}

/* Bài viết cùng chuyên mục */
.related-section{padding:0 20px 20px}
.related-heading{
    font-size:18px;font-weight:bold;color:#3a2a0a;
    padding:10px 0 8px;margin-bottom:10px;
    border-top:2px solid #c4a05a;
}
.related-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.related-item{display:flex;gap:10px;padding:8px;border:1px solid #eee;border-radius:6px}
.related-item:hover{border-color:#c4a05a}
.related-item .art-thumb{width:69px;height:69px;flex-shrink:0;overflow:hidden;border-radius:2px}
.related-item .art-thumb img{width:100%;height:100%;object-fit:cover}

/* =============================================================
   ARCHIVE / CATEGORY / SEARCH – Trang danh mục & tìm kiếm
   ============================================================= */
.archive-wrap{max-width:1280px;margin:0 auto;padding:15px 20px 30px}
.archive-header{text-align:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #c4a05a}
.archive-title{font-size:28px;font-weight:bold;color:#1a3a1a}
.archive-desc{font-size:14px;color:#888;margin-top:4px}

/* Grid 3 cột */
.archive-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:15px;
}
.archive-item{
    display:flex;gap:10px;padding:10px;
    border:1px solid #eee;border-radius:8px;
    transition:border-color .2s;
}
.archive-item:hover{border-color:#c4a05a}
.archive-thumb{width:120px;height:120px;flex-shrink:0;overflow:hidden;border-radius:4px}
.archive-thumb img{width:100%;height:100%;object-fit:cover}
.archive-info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.archive-item-title{
    font-size:14px;font-weight:bold;color:#1a3a1a;line-height:1.3;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
    margin-bottom:6px;
}
.archive-item-title a{color:#1a3a1a}
.archive-item-title a:hover{color:#8b7d3c}
.archive-item-meta{font-size:12px;color:#888;font-weight:bold}

/* Phân trang */
.archive-pagination{
    display:flex;align-items:center;justify-content:center;
    gap:20px;margin-top:25px;padding-top:15px;
    border-top:1px solid #eee;
}
.page-arrow a{
    display:inline-block;padding:8px 20px;
    background:#E2C080;color:#3a2a0a;font-weight:bold;font-size:14px;
    border-radius:4px;transition:background .2s;
}
.page-arrow a:hover{background:#d4ad66}
.page-info{font-size:14px;color:#888;font-weight:bold}

/* Không có bài */
.archive-empty{text-align:center;padding:60px 20px}
.archive-empty p{font-size:16px;color:#666}

/* Form tìm kiếm lớn */
.search-again{text-align:center;margin-bottom:20px}
.search-again form{display:inline-flex;gap:6px}
.search-input-lg{
    width:350px;height:38px;font-size:15px;padding:4px 14px;
    border:1px solid #c4a05a;border-radius:4px;background:#fff;
}
.search-btn-lg{
    height:38px;padding:0 24px;font-size:14px;font-weight:bold;
    cursor:pointer;border:none;border-radius:4px;
    background:#8b7d3c;color:#fff;
}
.search-btn-lg:hover{background:#6d6230}

/* =============================================================
   404 – Trang lỗi
   ============================================================= */
.error-page{text-align:center;padding:60px 20px}
.error-code{font-size:100px;font-weight:bold;color:#c4a05a;line-height:1}
.error-title{font-size:28px;font-weight:bold;color:#1a3a1a;margin:10px 0}
.error-desc{font-size:16px;color:#888;margin-bottom:25px}

/* =============================================================
   HAMBURGER MENU (ẩn trên desktop)
   ============================================================= */
.menu-toggle{
    display:none;
    background:none;border:none;cursor:pointer;
    padding:6px;flex-direction:column;gap:5px;
}
.menu-toggle span{
    display:block;width:26px;height:3px;
    background:#3a2a0a;border-radius:2px;
    transition:all .3s;
}
.menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,6px)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-6px)}

/* =============================================================
   RESPONSIVE – IPAD (768px – 1024px)
   ============================================================= */
@media (max-width:1300px){
    .page-wrap{width:100%;max-width:1280px}
}

@media (max-width:1024px){
    /* Header */
    .site-header{padding:0 15px;height:60px}
    .header-logo img{height:45px}
    .header-nav{gap:15px}
    .header-nav a{font-size:14px;padding:4px 6px}
    .header-search input[type="text"],
    .header-search input[type="search"]{width:130px}

    /* Body: bỏ sidebar bên cạnh, main full */
    .main-area{flex-direction:column}
    .content-main{width:100%}
    .content-gap{display:none}
    .content-side{width:100%;max-width:700px;margin:0 auto;padding:10px 15px}

    /* Banner */
    .banner img{width:100%;height:auto}

    /* 2 cột body */
    .two-cols{gap:15px;padding:10px 15px}
    .col-l,.col-r{width:calc(50% - 8px)}

    /* Archive grid: 2 cột */
    .archive-grid{grid-template-columns:repeat(2,1fr)}

    /* Related: 2 cột giữ nguyên */
    .related-section{padding:0 15px 15px}

    /* Footer */
    .footer-cols{flex-wrap:wrap;gap:15px}
    .ft-col1{width:100%;margin-bottom:10px}
    .ft-col2,.ft-col3,.ft-col4{width:calc(33% - 12px)}
}

/* =============================================================
   RESPONSIVE – MOBILE (< 768px)
   ============================================================= */
@media (max-width:767px){
    /* Header: logo trái + hamburger phải */
    .site-header{
        height:56px;padding:0 12px;
        flex-wrap:wrap;position:relative;
    }
    .header-logo{flex:1}
    .header-logo img{height:40px}

    /* Hiện hamburger */
    .menu-toggle{display:flex;order:2}

    /* Menu + search: ẩn, hiện khi bấm hamburger */
    .header-right{
        display:none;
        width:100%;order:3;
        background:#E2C080;
        padding:10px 0;
        border-top:1px solid rgba(0,0,0,.1);
    }
    .header-right.open{display:block}

    /* Nav dọc */
    .header-nav{
        flex-direction:column;align-items:stretch;gap:0;
    }
    .header-nav a{
        display:block;padding:10px 20px;
        font-size:16px;border-bottom:1px solid rgba(0,0,0,.06);
    }
    .header-nav a:hover{background:#d4ad66}

    /* Search full-width */
    .header-search{
        margin:8px 12px 4px;border-radius:4px;padding:8px 10px;
    }
    .header-search input[type="text"],
    .header-search input[type="search"]{flex:1;width:auto}

    /* Body: 1 cột, block xếp dọc */
    .main-area{flex-direction:column}
    .content-main{width:100%;padding:8px}
    .content-gap{display:none}
    .content-side{width:100%;padding:8px}

    /* Banner */
    .banner img{width:100%;height:auto}

    /* 2 cột body → 1 cột */
    .two-cols{flex-direction:column;gap:10px;padding:8px 0}
    .col-l,.col-r{width:100%}

    /* Box block */
    .box-title{font-size:18px;line-height:55px;height:55px}

    /* Article items */
    .art-title{font-size:14px}
    .art-meta{font-size:11px}

    /* Sidebar */
    .sb-art-title{font-size:12px}
    .lk-grid{gap:8px;padding:6px}

    /* Single */
    .single-post{padding:10px 12px 15px}
    .single-title{font-size:22px}
    .single-content{font-size:15px;line-height:1.7}

    /* Related: 1 cột */
    .related-grid{grid-template-columns:1fr}
    .related-section{padding:0 12px 12px}

    /* Archive grid: 1 cột, ảnh nhỏ hơn */
    .archive-wrap{padding:10px 12px 20px}
    .archive-title{font-size:22px}
    .archive-grid{grid-template-columns:1fr}
    .archive-thumb{width:90px;height:90px}
    .archive-item{padding:8px}

    /* Pagination */
    .archive-pagination{gap:10px;flex-wrap:wrap;justify-content:center}
    .page-arrow a{padding:6px 14px;font-size:13px}

    /* Search form */
    .search-input-lg{width:100%;max-width:250px}
    .search-again form{flex-wrap:wrap;justify-content:center}

    /* 404 */
    .error-code{font-size:70px}
    .error-title{font-size:22px}

    /* Footer: chỉ cột 1 */
    .footer-cols{flex-direction:column;align-items:center;gap:0;padding:0 15px}
    .ft-col1{width:100%;max-width:400px;padding:15px 0}
    .ft-col2,.ft-col3,.ft-col4{display:none}
    .footer-bottom{font-size:11px}
}