/*
Theme Name: GeneratePress Child
Template: generatepress
*/

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500&display=swap');

:root {
  --color-kem:  #F5EDD8;
  --color-kem2: #FAF6EE;
  --color-nau:  #8B5E3C;
  --color-nau2: #5a3e2b;
  --color-den:  #2C1810;
  --color-do:   #9B2335;
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body:    'Inter', system-ui, sans-serif;
}

/* ── Base ── */
body {
  font-family: var(--font-body);
  background-color: #FFFFFF;
  color: var(--color-den);
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--color-den);
}
a { color: var(--color-nau); text-decoration: none; }
a:hover { color: var(--color-do); }

/* ── Ẩn page title trên homepage ── */
.home .entry-header { display: none; }

/* ── Content full width ── */
.entry-content, .page-content {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.home.separate-containers .inside-article {
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ── HEADER ── */
.site-header {
  background-color: #FAF6EE !important;
  border-bottom: 1px solid #E8DCC8 !important;
  box-shadow: none !important;
}
.main-title a,
.main-title a:hover {
  font-family: var(--font-heading) !important;
  color: var(--color-den) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
}

/* Nav links — desktop & mobile, KHÔNG can thiệp display */
.main-navigation .main-nav ul li a,
.main-navigation .menu-toggle {
  color: var(--color-nau2) !important;
  font-family: var(--font-body) !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
  color: var(--color-do) !important;
}

/* Hamburger button — chỉ style màu, KHÔNG đụng display/visibility */
.menu-toggle {
  background: transparent !important;
  color: var(--color-den) !important;
  border: 1px solid #D4C4A0 !important;
  border-radius: 3px !important;
}
.menu-toggle:hover,
.menu-toggle:focus {
  background: var(--color-kem) !important;
  color: var(--color-do) !important;
  border-color: var(--color-do) !important;
}

/* Mobile nav background khi mở — chỉ màu nền */
.main-navigation.toggled,
.main-navigation.toggled .inside-navigation {
  background-color: #FAF6EE !important;
}
.main-navigation.toggled .main-nav ul li {
  border-bottom: 1px solid #E8DCC8;
}
.main-navigation.toggled .main-nav ul li:last-child {
  border-bottom: none;
}
.main-navigation.toggled .main-nav ul li a:hover {
  background-color: var(--color-kem) !important;
  color: var(--color-do) !important;
}

/* ── FOOTER ── */
.site-footer,
.footer-widgets,
.site-info {
  background-color: #FAF6EE !important;
  border-top: 1px solid #E8DCC8 !important;
  color: var(--color-nau2) !important;
}
.site-footer a { color: var(--color-nau); }
.site-footer a:hover { color: var(--color-do); }

/* ── BUTTONS ── */
.wp-block-button__link,
button[type="submit"],
input[type="submit"] {
  background-color: var(--color-do) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
}
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background-color: var(--color-nau) !important;
}

/* === Khối Tìm Kiếm sidebar (thiết kế lại) === */
.widget_search .search-form,
.widget_search form {
    display: flex;
    align-items: stretch;
    border: 1px solid #e2d9d4;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    transition: box-shadow .2s ease, border-color .2s ease;
}

.widget_search .search-form:focus-within {
    border-color: #8e2f3a;
    box-shadow: 0 0 0 3px rgba(142,47,58,0.12);
}

.widget_search input[type="search"] {
    flex: 1;
    border: none !important;
    outline: none !important;
    padding: 12px 14px;
    font-size: 15px;
    background: transparent;
}

.widget_search input[type="submit"] {
    border: none;
    background: #8e2f3a;
    color: #fff;
    font-weight: 600;
    padding: 0 22px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: background .2s ease;
}

.widget_search input[type="submit"]:hover {
    background: #6e2229;
}

.widget_search input[type="submit"]::before {
    content: "🔍";
    font-size: 13px;
}

/* === Fix ô Tìm Kiếm trên mobile (tránh tràn/xuống dòng) === */
.widget_search input[type="search"] {
    min-width: 0;
    white-space: nowrap;
    font-size: 14px;
}

.widget_search input[type="submit"] {
    white-space: nowrap;
    flex-shrink: 0;
    padding: 0 16px;
    font-size: 14px;
}

@media (max-width: 480px) {
    .widget_search input[type="search"] {
        padding: 10px 12px;
        font-size: 13px;
    }
    .widget_search input[type="submit"] {
        padding: 0 12px;
        font-size: 13px;
        gap: 4px;
    }
    .widget_search input[type="submit"]::before {
        display: none; /* bỏ icon kính lúp trên mobile để tiết kiệm chỗ */
    }
}

/* === Ẩn "Uncategorized" khỏi widget Chuyên Mục === */
.widget_categories .cat-item-1 {
    display: none !important;
}

/* === Fix lề nội dung trên mobile (tránh chữ dính sát mép màn hình) === */
@media (max-width: 768px) {
    .inside-article,
    .entry-content,
    .page .inside-article,
    .single .inside-article {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .site-content,
    .content-area {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (max-width: 480px) {
    .inside-article,
    .entry-content {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* === FIX THẬT: Ô Tìm Kiếm (Gutenberg block wp-block-search) === */
.wp-block-search__label {
    position: absolute !important;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
}

.wp-block-search {
    display: block !important;
}

.wp-block-search__inside-wrapper {
    display: flex !important;
    align-items: stretch;
    border: 1px solid #e2d9d4;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    width: 100%;
}

.wp-block-search__input {
    flex: 1;
    min-width: 0;
    border: none !important;
    outline: none !important;
    padding: 12px 14px;
    font-size: 14px;
    background: transparent;
}

.wp-block-search__button {
    border: none !important;
    background: #8e2f3a !important;
    color: #fff !important;
    font-weight: 600;
    padding: 0 18px;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
}

.wp-block-search__button:hover {
    background: #6e2229 !important;
}

/* === FIX THẬT: Ẩn Uncategorized khỏi Chuyên Mục === */
li.cat-item-1 {
    display: none !important;
}

/* ── Đồng bộ typography bài viết blog với style trang bài học/trang chủ ── */
.single-post .entry-content {
  max-width: 720px;
  margin: 0 auto;
  padding: 2.5rem 1.5rem 3rem;
}
.single-post .entry-content h2 {
  font-size: clamp(1.4rem, 3vw, 1.9rem);
  font-weight: 700;
  line-height: 1.3;
  margin: 2.2rem 0 1rem;
}
.single-post .entry-content h3 {
  font-size: clamp(1.15rem, 2.2vw, 1.4rem);
  font-weight: 600;
  line-height: 1.35;
  margin: 1.8rem 0 0.8rem;
}
.single-post .entry-content p,
.single-post .entry-content li {
  font-size: 0.97rem;
  line-height: 1.85;
  color: var(--color-nau2);
  margin: 0 0 1.25rem;
}
.single-post .entry-content figure {
  margin: 2rem 0;
}
.single-post .entry-content figcaption {
  font-size: 0.82rem;
  color: var(--color-nau);
  text-align: center;
  margin-top: 0.5rem;
}
.single-post .entry-content img {
  border-radius: 10px;
}

/* ── Giảm cỡ tiêu đề bài viết blog cho thanh thoát hơn ── */
.single-post .entry-title {
  font-size: clamp(1.5rem, 3.2vw, 2.1rem) !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  max-width: 720px;
  margin: 0 auto 0.5rem !important;
}
.single-post .entry-header {
  max-width: 720px;
  margin: 2rem auto 0 !important;
  padding: 0 1.5rem;
}

/* ── Padding cho bài viết trong danh sách (category/archive/blog/search) ── */
.blog .inside-article,
.archive .inside-article,
.category .inside-article,
.search .inside-article {
  padding: 1.5rem !important;
}
@media(max-width:480px){
  .blog .inside-article,
  .archive .inside-article,
  .category .inside-article,
  .search .inside-article {
    padding: 1.25rem 1rem !important;
  }
}

/* VTQ - Gioi han kich thuoc logo trong header */
.site-logo {
    display: inline-flex;
    align-items: center;
}
.site-logo img {
    max-height: 56px;
    width: auto;
    height: auto;
}
.site-branding {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* VTQ - Doi font ten site cho hop voi phong cach thu phap cua logo */
.main-title,
.main-title a {
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    letter-spacing: 0.01em;
}