/*
Theme Name: Đặc Sản Tây Bắc
Theme URI: https://dacsanvungtaybac.org
Author: Antigravity Architect
Description: Theme Custom tối ưu hóa tĩnh chuẩn PageSpeed Insights, không Page Builder, chuyên cho Đặc Sản Tây Bắc.
Version: 1.0.0
Text Domain: dacsan
*/

/* --- DESKTOP NAVIGATION STYLES --- */
#menu-primary-menu {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}
#menu-primary-menu li {
    position: relative;
    /* Ghi đè inline-block có thể còn kẹt ở đâu đó */
    display: block !important; 
}
#menu-primary-menu a {
    display: block;
    padding: 0.5rem 0;
    color: rgb(15, 52, 27); /* Màu xanh lá đậm theo yêu cầu */
    font-weight: 600;
    transition: color 0.3s;
}
#menu-primary-menu a:hover {
    color: #f0ad4e; /* Desktop 2-level dropdown logic */
}
@media (min-width: 1024px) {
    #menu-primary-menu > li {
        position: relative;
    }
    #menu-primary-menu > li > ul.sub-menu {
        display: block;
        opacity: 0;
        visibility: hidden;
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 200px;
        background: #fff;
        border: 1px solid #eee;
        z-index: 1000;
        box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
        transform: translateY(10px);
        transition: all 0.3s ease;
    }
    #menu-primary-menu > li:hover > ul.sub-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
}

/* ==========================================================================
   GUTENBERG BLOCK LAYOUT ALIGNMENTS (1280px Max Width)
   ========================================================================== */

.entry-content {
    width: 100%;
    margin-bottom: 3rem;
}

/* Tất cả các khối mặc định: Bị giới hạn ở 1280px */
.entry-content > *:not(.alignfull):not(.alignwide) {
    max-width: 1280px;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Khối Wide: 1440px */
.entry-content > .alignwide {
    max-width: 1440px;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Khối Full width: Vượt ra ngoài hoàn toàn 100% màn hình */
.entry-content > .alignfull {
    max-width: 100vw;
    width: 100vw;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0;
    padding-right: 0;
}

/* Căn giữa nội dung văn bản bên trong khối Banner (Cover/Group) */
.entry-content .alignfull > .wp-block-group__inner-container,
.entry-content .wp-block-cover__inner-container {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
/* Căn chỉnh các mục nhỏ bên trong Dropdown */
#menu-primary-menu .sub-menu li {
    display: block !important;
    width: 100%;
}
#menu-primary-menu .sub-menu a {
    padding: 0.6rem 1rem;
    font-weight: 500;
    font-size: 0.875rem;
    color: #4b5563; /* Màu chữ menu con */
}
#menu-primary-menu .sub-menu a:hover {
    background-color: #f9fafb; 
    color: #1f592d; /* Đổi màu nền nhẹ và chữ xanh khi tương tác menu con */
}

/* Kích hoạt Dropdown khi Hover */
#menu-primary-menu li:hover > .sub-menu {
    display: block;
    animation: fadeIn 0.2s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- MOBILE NAVIGATION STYLES --- */
#mobile-primary-menu li {
    display: block;
    width: 100%;
}
#mobile-primary-menu a {
    display: block;
    padding: 0.5rem 0;
    color: rgb(15, 52, 27);
    transition: color 0.3s;
}
#mobile-primary-menu a:hover {
    color: #f0ad4e;
}
/* Mobile Dropdown (Cấp 2) hiển thị thò thụt */
#mobile-primary-menu .sub-menu {
    padding-left: 1rem;
    margin-top: 0.25rem;
    border-left: 2px solid #e5e7eb;
}
#mobile-primary-menu .sub-menu a {
    font-weight: normal;
    font-size: 0.875rem;
    color: #6b7280;
}
#mobile-primary-menu .sub-menu a:hover {
    color: #f0ad4e;
}

/* --- PROSE (CONTENT) STYLING --- */
/* Căn đều 2 bên cho nội dung văn bản (Chỉ áp dụng cho trang Bài viết - Single Post) */
.single-post .prose {
    text-align: justify !important;
}
.single-post .prose p {
    margin-bottom: 1.25rem !important;
}
/* Hiển thị rõ các thẻ Headings */
.single-post .prose h1, .single-post .prose h2, .single-post .prose h3, .single-post .prose h4, .single-post .prose h5, .single-post .prose h6 {
    color: #0f341b !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    margin-top: 2rem !important;
    margin-bottom: 1rem !important;
    text-align: left !important;
    display: block !important;
}
.single-post .prose h1 { font-size: 2.25rem !important; }
.single-post .prose h2 { font-size: 1.875rem !important; }
.single-post .prose h3 { font-size: 1.5rem !important; }
.single-post .prose h4 { font-size: 1.25rem !important; }
.single-post .prose h5 { font-size: 1.125rem !important; }
.single-post .prose h6 { font-size: 1rem !important; }
/* Danh sách */
.single-post .prose ul {
    list-style-type: disc !important;
    padding-left: 1.5rem !important;
    margin-bottom: 1.25rem !important;
}
.single-post .prose ol {
    list-style-type: decimal !important;
    padding-left: 1.5rem !important;
    margin-bottom: 1.25rem !important;
}
.single-post .prose li {
    margin-bottom: 0.5rem !important;
    display: list-item !important;
}
.single-post .prose strong, .single-post .prose b {
    font-weight: 700 !important;
}
/* Links - Áp dụng chung cho cả trang sản phẩm */
.prose a {
    color: #1f592d; /* brand-light */
    text-decoration: underline;
    font-weight: 600;
    transition: color 0.3s ease;
}
.prose a:hover {
    color: #f0ad4e; /* brand-gold */
    text-decoration: none;
}

/* --- IMAGE CAPTION STYLING --- */
.prose figure, figure.wp-block-image, .wp-caption {
    margin-bottom: 1.5rem !important;
    display: flex !important;
    flex-direction: column !important;
    max-width: 100% !important;
    height: auto !important;
}
.prose figure a, figure.wp-block-image a, .wp-caption a {
    margin-bottom: 0 !important;
    display: block !important;
    max-width: 100% !important;
}
.prose img, .prose figure img, figure.wp-block-image img, .wp-caption img {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    display: block !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
}
.prose figcaption, figure.wp-block-image figcaption, .wp-caption-text {
    margin-top: 0 !important;
    padding: 8px 12px !important;
    background-color: #f3f4f6 !important;
    font-style: italic !important;
    text-align: center !important;
    color: #4b5563 !important;
    font-size: 0.9rem !important;
    line-height: 1.5 !important;
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}