/*
Theme Name: Theme daotaohuyenhoc
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

/* Custom Typography: Synchronized with lienhoathu.com (Times, Georgia, serif for all elements) */
body,
button,
input,
select,
textarea,
h1, h2, h3, h4, h5, h6,
p, span, a, li, ul, ol, div,
.menu-link,
.main-navigation,
.ast-button,
.ast-custom-button,
.filter-tab-item,
.tab-nav-item,
.course-card-meta,
.course-meta-hero,
.sidebar-features-list,
.course-card-btn,
.course-card-badge-cat,
.woocommerce-Price-amount,
.single_add_to_cart_button,
.tutor-btn,
.site-title,
.site-title a,
.widget-title,
.entry-title,
.product-title,
.woocommerce-loop-product__title,
.archive-title-main,
.course-title-main,
.course-card-title {
    font-family: Times, Georgia, serif !important;
}

/* Color overrides: change #4a4a4a and #4a4949 to pure black #000 */
:root {
    --fs-color-base: #000000 !important;
    --ast-global-color-7: #000000 !important;
    --e-global-color-astglobalcolor7: #000000 !important;
}

body, p, span, a, li, div, section, article {
    color: inherit;
}
body {
    color: #000000 !important;
}

/* Desktop layout column widths for Astra CSS compatibility */
@media (min-width: 922px) {

    .ast-left-sidebar #primary,
    .ast-right-sidebar #primary {
        width: 70%;
    }

    .ast-left-sidebar #secondary,
    .ast-right-sidebar #secondary {
        width: 30%;
    }

    .ast-no-sidebar #primary {
        width: 100%;
    }
}

/* Resolve background-color conflict with parent Flatsome theme's .secondary class */
#secondary.secondary {
    background-color: transparent;
}

@media only screen and (max-width: 48em) {
    /*************** ADD MOBILE ONLY CSS HERE  ***************/


}
.elementor-28 p {
    color: #000 !important;
}
.icon-search:before{
	display: none;
}
#primary {
    margin: 0;
    background-color: #fff !important;
}
.primary, input[type=submit], input[type=submit].button {
    background-color: var(--fs-color-primary) !important;
    color: #fff !important;
}

/* Custom styles for zen-masonry gallery */
.zen-masonry-gallery {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    column-gap: 20px !important;
    row-gap: 20px !important;
    padding: 0 !important;
    /* margin-bottom: 15px; */
}

@media (max-width: 1024px) {
    .zen-masonry-gallery {
        grid-template-columns: repeat(3, 1fr) !important;
        padding: 2rem !important;
    }
}

@media (max-width: 768px) {
    .zen-masonry-gallery {
        grid-template-columns: 1fr !important;
        padding: 1rem !important;
    }
}

.zen-masonry-item {
    position: relative;
    break-inside: avoid;
    margin-bottom: 15px !important;
    overflow: hidden;
    border-radius: 10px;
}

.zen-masonry-item img {
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.zen-masonry-item:hover img {
    transform: scale(1.05);
}

.zen-overlay {
    position: absolute;
    inset: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 1rem;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    opacity: 1;
    transition: opacity 0.4s ease;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.25), transparent 60%);
}

.zen-masonry-item:hover .zen-overlay {
    opacity: 1;
    pointer-events: auto;
}

.zen-info {
    text-align: left;
    color: #fff;
    font-weight: 300;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    margin-bottom: 0.5rem;
}

.zen-info h3 {
    margin: 0;
    font-size: 1.1rem;
    color: #fff;
    text-align: left;
    margin-bottom: 0.5rem;
}

.zen-price {
    font-size: 1rem;
    margin-top: 0.5rem;
    text-align: left;
    color: #fff;
}

.zen-price .woocommerce-Price-amount {
    color: #fff;
    font-weight: bold;
}

.zen-price .woocommerce-Price-currencySymbol {
    color: #fff;
}

/* Custom Accordion Tab Styles for Product Pages */
.ast-woocommerce-accordion {
    border-top: 1px solid var(--ast-border-color, #e2e2e2);
    border-bottom: 1px solid var(--ast-border-color, #e2e2e2);
    margin: 2em 0;
    clear: both;
}

.ast-single-tab {
    border-bottom: 1px solid var(--ast-border-color, #e2e2e2);
}

.ast-single-tab:last-child {
    border-bottom: 0;
}

.ast-accordion-header {
    font-size: 1.1rem;
    font-weight: 600;
    padding: 1.25rem 0;
    margin: 0;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #3a3a3a;
}

.ast-accordion-header svg {
    width: 16px;
    height: 16px;
    fill: #808285;
}

/* Handle plus/minus toggle display based on active class */
.ast-accordion-header span.ahfb-svg-iconset:nth-of-type(1) {
    display: inline-flex;
}

.ast-accordion-header span.ahfb-svg-iconset:nth-of-type(2) {
    display: none;
}

.ast-accordion-header.active span.ahfb-svg-iconset:nth-of-type(1) {
    display: none;
}

.ast-accordion-header.active span.ahfb-svg-iconset:nth-of-type(2) {
    display: inline-flex;
}

.ast-accordion-content {
    padding: 0 0 1.25rem 0;
    display: none;
}

.ast-accordion-content.active {
    display: block;
}

.ast-accordion-wrap {
    font-size: 1rem;
    line-height: 1.6;
}

/* Styling for single product page matching the Astra theme demo */
.single-product div.product {
    font-family: Times, Georgia, serif !important;
    color: #3a3a3a !important;
}

.single-product div.product h1,
.single-product div.product h2,
.single-product div.product h3,
.single-product div.product h4,
.single-product div.product h5,
.single-product div.product h6,
.single-product div.product .entry-title,
.single-product div.product .product_title {
    font-family: Times, Georgia, serif !important;
    color: #3a3a3a !important;
    font-weight: 600;
}

.single-product div.product .product_title {
    font-size: 24px !important;
    font-size: 1.41176rem !important;
    line-height: 1.3 !important;
    margin-bottom: 0.5em !important;
}

.single-product div.product p.price,
.single-product div.product span.price,
.single-product div.product .price,
.single-product div.product .price .woocommerce-Price-amount {
    font-size: 22px !important;
    font-size: 1.29411rem !important;
    color: #3a3a3a !important;
    font-weight: 600 !important;
}

.single-product div.product .woocommerce-product-details__short-description {
    font-family: Times, Georgia, serif !important;
    font-size: 17px !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    color: #3a3a3a !important;
    margin-bottom: 2em !important;
}

.single-product div.product .woocommerce-product-details__short-description p {
    font-family: Times, Georgia, serif !important;
    font-size: 17px !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    margin-bottom: 0.5em !important;
    color: #3a3a3a !important;
}

.single-product div.product .woocommerce-product-details__short-description p strong {
    font-weight: bold !important;
}

/* Quantity input and Add to cart button styling */
.single-product div.product form.cart {
    margin: 2em 0 !important;
}

.single-product div.product form.cart .quantity {
    margin-right: 15px !important;
}

.single-product div.product form.cart .quantity .qty {
    width: 60px !important;
    height: 40px !important;
    padding: 5px !important;
    text-align: center !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-family: inherit !important;
    font-size: 16px !important;
}

.single-product div.product form.cart .single_add_to_cart_button {
    height: 40px !important;
    padding: 0 25px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    border-radius: 30px !important;
    background-color: transparent !important;
    border: 1px solid #3a3a3a !important;
    color: #3a3a3a !important;
    transition: all 0.3s !important;
    cursor: pointer !important;
    line-height: 1em !important;
}

.single-product div.product form.cart .single_add_to_cart_button:hover {
    background-color: #3a3a3a !important;
    color: #fff !important;
    border-color: #3a3a3a !important;
}

/* Accordion Tab Fonts */
.ast-woocommerce-accordion .ast-accordion-header {
    font-family: Times, Georgia, serif !important;
    font-size: 1.1rem !important;
    color: #3a3a3a !important;
}

.ast-woocommerce-accordion .ast-accordion-content,
.ast-woocommerce-accordion .ast-accordion-wrap {
    font-family: Times, Georgia, serif !important;
    font-size: 17px !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    color: #3a3a3a !important;
}

.ast-woocommerce-accordion .ast-accordion-wrap p,
.ast-woocommerce-accordion .ast-accordion-wrap ul,
.ast-woocommerce-accordion .ast-accordion-wrap li {
    font-family: Times, Georgia, serif !important;
    font-size: 17px !important;
    font-size: 1rem !important;
    line-height: 1.65 !important;
    color: #3a3a3a !important;
}

/* Gallery Trigger Button styling (Search/Magnify Icon) */
.woocommerce-product-gallery {
    position: relative !important;
}

.woocommerce-product-gallery .woocommerce-product-gallery__trigger {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 999 !important;
    /* width: 2.5em !important;
    height: 2.5em !important; */
    background: #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
}

.woocommerce-product-gallery .woocommerce-product-gallery__trigger:hover {
    background-color: #3a3a3a !important;
    transform: scale(1.05) !important;
}

/* Custom CSS magnifying glass icon inside trigger button */
.woocommerce-product-gallery .woocommerce-product-gallery__trigger::before {
    content: "" !important;
    display: inline-block !important;
    /* width: 12px !important;
    height: 12px !important; */
    border: 2px solid #3a3a3a !important;
    border-radius: 50% !important;
    position: absolute !important;
    /* top: 30% !important;
    left: 30% !important; */
    text-indent: 0 !important;
    transition: all 0.3s ease !important;
}

.woocommerce-product-gallery .woocommerce-product-gallery__trigger::after {
    content: "" !important;
    display: inline-block !important;
    /* width: 8px !important;
    height: 2px !important; */
    background-color: #3a3a3a !important;
    transform: rotate(45deg) !important;
    position: absolute !important;
    /* top: 60% !important;
    left: 56% !important; */
    text-indent: 0 !important;
    transition: all 0.3s ease !important;
}

.woocommerce-product-gallery .woocommerce-product-gallery__trigger:hover::before {
    border-color: #fff !important;
}

.woocommerce-product-gallery .woocommerce-product-gallery__trigger:hover::after {
    background-color: #fff !important;
}

/* Circle Button Styles (Prioritized Original Styles) */
button.circle-button,
.circle-button {
    width: 150px !important;
    height: 150px !important;
    border-radius: 50% !important;
    background-color: transparent !important;
    background-image: none !important;
    color: #4B4F58 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #4B4F58 !important;
    box-shadow: none !important;
    cursor: pointer !important;
    font-size: 18px !important;
    transition: all 0.3s ease !important;
    padding: 0 !important;
    text-transform: none !important;
    line-height: normal !important;
    white-space: nowrap !important;
}

/* Hover style for the first button (blue hover) */
button.circle-button.blue-hover:hover,
.circle-button.blue-hover:hover {
    background-color: #ffffff !important;
    color: #0000ff !important;
    border: 1px solid #0000ff !important;
}

/* Hover style for other buttons (no background change, only color black) */
button.circle-button:hover,
.circle-button:hover {
    background-color: transparent !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
}

/* Modifier for the smaller button */
button.circle-button.small-btn,
.circle-button.small-btn {
    width: 130px !important;
    height: 130px !important;
    font-size: 16px !important;
    border: 1px solid #4B4F58 !important;
}

@media (max-width: 600px) {
    button.circle-button,
    .circle-button {
        width: 100px !important;
        height: 100px !important;
        font-size: 12px !important;
    }
}

/* Fix marquee logo layout stacking */
#marq a {
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

#marq img {
    display: inline-block !important;
    vertical-align: middle !important;
    max-height: 150px !important;
    width: auto !important;
}

/* ==========================================================================
   TUTOR LMS CUSTOM STYLING - HUYỀN HỌC & TÂM THỨC
   ========================================================================== */

/* Variables / Color Tokens */
:root {
    --huyenhoc-dark-bg: linear-gradient(135deg, #0d0f14 0%, #1a1e26 100%);
    --huyenhoc-gold: #c5a059;
    --huyenhoc-gold-hover: #b38f47;
    --huyenhoc-gold-light: rgba(197, 160, 89, 0.12);
    --huyenhoc-text-dark: #111111;
    --huyenhoc-text-muted: #666666;
    --huyenhoc-card-border: rgba(0, 0, 0, 0.05);
    --huyenhoc-shadow-sm: 0 4px 15px rgba(0, 0, 0, 0.03);
    --huyenhoc-shadow-md: 0 10px 30px rgba(0, 0, 0, 0.05);
    --huyenhoc-shadow-lg: 0 20px 40px rgba(197, 160, 89, 0.08);
}

/* Base structural layout fixes */
.custom-course-archive-layout,
.custom-course-single-layout {
    width: 100% !important;
    background-color: #ffffff;
    box-sizing: border-box;
}

/* Center and align containers with theme style */
.tutor-container {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* --- 1. COURSE CATALOG / ARCHIVE STYLES --- */
.custom-course-archive-layout {
    background-color: #fafbfc;
    min-height: 100vh;
}

.archive-hero-banner {
    background-image: linear-gradient(rgba(13, 15, 20, 0.78), rgba(26, 30, 38, 0.88)), url('http://localhost:8080/daotaohuyenhoc/wp-content/uploads/2026/06/mystical_banner.png');
    background-size: cover;
    background-position: center;
    padding: 90px 20px !important;
    color: #ffffff;
    border-bottom: 2px solid var(--huyenhoc-gold);
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
    text-align: center;
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

.archive-title-main {
    font-family: Times, Georgia, serif !important;
    font-size: 38px !important;
    color: var(--huyenhoc-gold) !important;
    margin: 0 0 15px 0 !important;
    font-weight: bold !important;
    letter-spacing: 0.5px;
}

.archive-subtitle-main {
    font-family: Times, Georgia, serif !important;
    font-size: 17px;
    color: #d1d5db;
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Category Filter Tabs */
.course-filter-tabs-wrapper {
    margin-top: -25px; /* Pull filters slightly upwards for visual overlap style */
    z-index: 10;
    position: relative;
}

.course-filter-tabs {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

.filter-tab-item {
    font-size: 14px;
    padding: 8px 22px;
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 30px;
    color: #333333;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    font-weight: 500;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
}

.filter-tab-item:hover {
    border-color: var(--huyenhoc-gold);
    color: var(--huyenhoc-gold);
    transform: translateY(-2px);
}

.filter-tab-item.active {
    background-color: var(--huyenhoc-gold);
    border-color: var(--huyenhoc-gold);
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(197, 160, 89, 0.25);
}

/* Grid Layout */
.course-grid-row {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

/* Premium Card Design */
.course-premium-card {
    background-color: #ffffff;
    border: 1px solid var(--huyenhoc-card-border);
    border-radius: 10px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: var(--huyenhoc-shadow-sm);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.course-premium-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--huyenhoc-shadow-lg);
    border-color: rgba(197, 160, 89, 0.35);
}

.course-card-image-box {
    position: relative;
    height: 190px;
    overflow: hidden;
}

.course-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.course-premium-card:hover .course-card-img {
    transform: scale(1.04);
}

.course-card-badge-cat {
    position: absolute;
    top: 15px;
    left: 15px;
    background-color: var(--huyenhoc-gold);
    color: #ffffff;
    padding: 3px 10px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 3px;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.course-card-body {
    padding: 22px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.course-card-meta {
    display: flex;
    gap: 15px;
    font-size: 12px;
    color: var(--huyenhoc-text-muted);
    margin-bottom: 12px;
}

.course-card-meta i {
    font-size: 13px;
    margin-right: 4px;
    vertical-align: middle;
    color: var(--huyenhoc-gold);
}

.course-card-title {
    font-family: Times, Georgia, serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 0 10px 0 !important;
    color: var(--huyenhoc-text-dark) !important;
}

.course-card-title a {
    color: inherit;
    transition: color 0.2s ease;
}

.course-card-title a:hover {
    color: var(--huyenhoc-gold) !important;
}

.course-card-excerpt {
    font-family: Times, Georgia, serif !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: var(--huyenhoc-text-muted) !important;
    margin-bottom: 15px !important;
}

.course-card-author {
    margin-top: auto;
    font-size: 12px;
    color: var(--huyenhoc-text-muted);
    border-top: 1px solid rgba(0, 0, 0, 0.04);
    padding-top: 12px;
}

.course-card-author .author-name {
    font-weight: 600;
    color: var(--huyenhoc-text-dark);
}

/* Card Footer */
.course-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 22px;
    background-color: #fafafa;
    border-top: 1px solid var(--huyenhoc-card-border);
}

.course-card-price {
    font-size: 16px;
}

.course-card-price .woocommerce-Price-amount {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--huyenhoc-text-dark) !important;
}

.course-card-price ins .woocommerce-Price-amount {
    color: var(--huyenhoc-gold) !important;
}

.course-card-price del {
    font-size: 13px !important;
    color: #999999 !important;
    margin-right: 5px;
}

.course-card-btn {
    display: inline-block;
    padding: 6px 16px;
    background-color: transparent;
    border: 1px solid var(--huyenhoc-text-dark);
    color: var(--huyenhoc-text-dark) !important;
    border-radius: 30px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    transition: all 0.3s ease;
    letter-spacing: 0.3px;
}

.course-card-btn:hover {
    background-color: var(--huyenhoc-text-dark);
    color: #ffffff !important;
}


/* --- 2. SINGLE COURSE DETAILS STYLES --- */
.custom-course-single-layout {
    background-color: #ffffff;
}

.course-hero-banner {
    background-image: linear-gradient(rgba(13, 15, 20, 0.8), rgba(26, 30, 38, 0.9)), url('http://localhost:8080/daotaohuyenhoc/wp-content/uploads/2026/06/mystical_banner.png');
    background-size: cover;
    background-position: center;
    padding: 80px 0 65px 0 !important;
    color: #ffffff;
    border-bottom: 2px solid var(--huyenhoc-gold);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

.course-breadcrumbs {
    font-size: 12px;
    color: #a0aec0;
    margin-bottom: 20px;
}

.course-breadcrumbs a {
    color: inherit;
    transition: color 0.2s ease;
}

.course-breadcrumbs a:hover {
    color: var(--huyenhoc-gold) !important;
}

.course-breadcrumbs .sep {
    margin: 0 6px;
}

.course-breadcrumbs .current {
    color: var(--huyenhoc-gold);
}

.course-hero-content {
    max-width: 850px;
}

.course-badge-category {
    background-color: var(--huyenhoc-gold-light);
    color: var(--huyenhoc-gold);
    border: 1px solid rgba(197, 160, 89, 0.4);
    padding: 3px 12px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 4px;
    letter-spacing: 0.5px;
    display: inline-block;
    margin-bottom: 15px;
}

.course-title-main {
    font-family: Times, Georgia, serif !important;
    font-size: 34px !important;
    font-weight: bold !important;
    color: #ffffff !important;
    line-height: 1.3 !important;
    margin: 0 0 15px 0 !important;
}

.course-excerpt-main {
    font-family: Times, Georgia, serif !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: #cbd5e0 !important;
    margin: 0 0 25px 0 !important;
}

.course-meta-hero {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-size: 13px;
}

.meta-item-hero {
    display: inline-flex;
    align-items: center;
    color: #e2e8f0;
}

.meta-item-hero i {
    font-size: 15px;
    margin-right: 6px;
    color: var(--huyenhoc-gold);
}

.meta-item-hero strong {
    color: #ffffff;
    margin-left: 3px;
}

/* Left Column Main */
.course-media-wrapper {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: var(--huyenhoc-shadow-md);
    border: 1px solid rgba(0, 0, 0, 0.04);
}

.course-media-wrapper img {
    width: 100%;
    height: auto;
    display: block;
}

/* Navigation Tabs */
.course-custom-tabs-wrapper {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.course-custom-tabs-nav {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 30px;
}

.tab-nav-item {
    font-size: 15px;
    font-weight: 600;
    padding: 12px 0;
    color: var(--huyenhoc-text-muted);
    cursor: pointer;
    position: relative;
    transition: color 0.3s ease;
}

.tab-nav-item:hover {
    color: var(--huyenhoc-text-dark);
}

.tab-nav-item.active {
    color: var(--huyenhoc-gold);
}

.tab-nav-item.active::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: var(--huyenhoc-gold);
    border-radius: 3px 3px 0 0;
}

/* Tab Panels Content */
.tab-content-panel {
    display: none;
}

.tab-content-panel.active {
    display: block;
    animation: fadeIn 0.4s ease;
}

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

.section-title-custom {
    font-family: Times, Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    color: var(--huyenhoc-text-dark) !important;
    margin: 0 0 15px 0 !important;
    border-left: 3px solid var(--huyenhoc-gold);
    padding-left: 12px;
    line-height: 1.2 !important;
}

.content-wysiwyg p {
    font-family: Times, Georgia, serif !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
    color: #2d3748 !important;
    margin: 0 0 15px 0 !important;
}

/* Sub-section cards: Benefits, Requirements, Target Audience */
.tutor-course-benefits-wrap,
.tutor-course-requirements-wrap,
.tutor-course-target-audience-wrap,
.tutor-course-material-includes-wrap {
    background-color: #fafbfd;
    border: 1px solid var(--huyenhoc-card-border);
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
    box-shadow: var(--huyenhoc-shadow-sm);
}

.tutor-course-benefits-wrap h4,
.tutor-course-requirements-wrap h4,
.tutor-course-target-audience-wrap h4,
.tutor-course-material-includes-wrap h4 {
    font-family: Times, Georgia, serif !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    color: var(--huyenhoc-text-dark) !important;
    margin: 0 0 15px 0 !important;
}

.tutor-course-benefits-items,
.tutor-course-requirements-items,
.tutor-course-target-audience-items {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

.tutor-course-benefits-items li,
.tutor-course-requirements-items li,
.tutor-course-target-audience-items li {
    font-family: Times, Georgia, serif !important;
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: #4a5568 !important;
    margin-bottom: 10px !important;
    position: relative !important;
    padding-left: 24px !important;
}

.tutor-course-benefits-items li::before,
.tutor-course-requirements-items li::before,
.tutor-course-target-audience-items li::before {
    content: "\e5ca" !important;
    font-family: "tutor-icon" !important;
    position: absolute !important;
    left: 0 !important;
    top: 2px !important;
    color: var(--huyenhoc-gold) !important;
    font-size: 15px !important;
    font-weight: bold !important;
}

/* Instructor Section */
.tutor-instructor-card {
    background-color: #ffffff;
    border: 1px solid var(--huyenhoc-card-border);
    border-radius: 8px;
    padding: 24px;
    display: flex;
    gap: 20px;
    align-items: center;
    box-shadow: var(--huyenhoc-shadow-sm);
}

.tutor-instructor-card img {
    border-radius: 50%;
    width: 70px;
    height: 70px;
    object-fit: cover;
}

/* Curriculum/Course Topics Accordion */
.tutor-course-topics-wrap .tutor-accordion-item {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    border-radius: 8px !important;
    margin-bottom: 12px !important;
    overflow: hidden !important;
}

.tutor-course-topics-wrap .tutor-accordion-header {
    background-color: #f7fafc !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03) !important;
    padding: 15px 20px !important;
}

.tutor-course-topics-wrap .tutor-accordion-header.active {
    background-color: #ffffff !important;
}

/* Right Sidebar Purchase Widget */
.course-sticky-sidebar-box {
    background-color: #ffffff;
    border: 1px solid var(--huyenhoc-card-border);
    border-radius: 12px;
    padding: 30px;
    box-shadow: var(--huyenhoc-shadow-md);
    position: sticky;
    top: 100px;
}

.course-sticky-sidebar-box .tutor-price-preview {
    font-size: 26px !important;
    font-weight: bold !important;
    color: var(--huyenhoc-text-dark) !important;
    margin-bottom: 20px;
    text-align: center;
}

.course-sticky-sidebar-box .tutor-price-preview .woocommerce-Price-amount {
    font-size: 26px !important;
    font-weight: 700 !important;
}

.course-sticky-sidebar-box .tutor-course-entry-box {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.tutor-course-purchase-box {
    text-align: center;
}

/* Purchase Box Buttons Styling */
.tutor-course-purchase-box .tutor-btn,
.tutor-course-purchase-box .single_add_to_cart_button,
.tutor-course-purchase-box .tutor-btn-login {
    display: block !important;
    width: 100% !important;
    padding: 12px 20px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-radius: 30px !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

.tutor-course-purchase-box .single_add_to_cart_button {
    background-color: var(--huyenhoc-text-dark) !important;
    border: 1px solid var(--huyenhoc-text-dark) !important;
    color: #ffffff !important;
}

.tutor-course-purchase-box .single_add_to_cart_button:hover {
    background-color: var(--huyenhoc-gold) !important;
    border-color: var(--huyenhoc-gold) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(197, 160, 89, 0.25) !important;
}

.tutor-course-purchase-box .tutor-btn-enroll {
    background-color: var(--huyenhoc-gold) !important;
    border: 1px solid var(--huyenhoc-gold) !important;
    color: #ffffff !important;
}

.tutor-course-purchase-box .tutor-btn-enroll:hover {
    background-color: var(--huyenhoc-gold-hover) !important;
    border-color: var(--huyenhoc-gold-hover) !important;
}

.course-sidebar-features {
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    padding-top: 20px;
}

.sidebar-title-custom {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--huyenhoc-text-dark) !important;
    margin-bottom: 12px !important;
}

.sidebar-features-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar-features-list li {
    font-size: 14px;
    color: var(--huyenhoc-text-muted);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.sidebar-features-list li i {
    font-size: 17px;
    color: var(--huyenhoc-gold);
    width: 20px;
    text-align: center;
}

/* Accordion texts */
.tutor-accordion-item-header {
    font-size: 15px !important;
    font-weight: 600 !important;
}

.tutor-accordion-item-body {
    font-size: 14px !important;
}

/* Grid Spacing fix inside main layouts */
.tutor-row {
    margin-left: -15px !important;
    margin-right: -15px !important;
}

.tutor-col-xl-8,
.tutor-col-xl-4,
.tutor-col-12 {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .course-grid-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .course-grid-row {
        grid-template-columns: 1fr;
    }
    
    .archive-title-main {
        font-size: 30px !important;
    }
    
    .archive-subtitle-main {
        font-size: 15px;
    }
    
    .course-title-main {
        font-size: 26px !important;
    }
    
    .course-excerpt-main {
        font-size: 15px !important;
    }
    
    .course-custom-tabs-nav {
        gap: 15px;
    }
    
    .tab-nav-item {
        font-size: 14px;
    }
    
    .course-sticky-sidebar-box {
        position: static;
        margin-top: 30px;
    }
}

/* WooCommerce block templates and empty cart layout alignment fix */
.site-content > .ast-container > .wp-site-blocks,
.site-content > .ast-container > .wp-block-group,
.site-content > .ast-container > .entry-content,
.site-content > .ast-container > .woocommerce-coming-soon {
    width: 100% !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
    flex-grow: 1 !important;
}

/* WooCommerce Cart & Checkout Layout stacking fix */
.woocommerce-cart .site-content > .ast-container,
.woocommerce-checkout .site-content > .ast-container {
    flex-direction: column !important;
}
.woocommerce-cart #primary .checkout-page-title,
.woocommerce-cart #primary .cart-container,
.woocommerce-checkout #primary .checkout-page-title,
.woocommerce-checkout #primary .cart-container {
    width: 100% !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}

/* WooCommerce Cart collaterals width and spacing fix */
.woocommerce-cart .cart-collaterals .cart_totals {
    width: 100% !important;
    float: none !important;
}

/* Center Elementor full-width parent containers on desktop (post 324 / elementor-28) */
@media (min-width: 768px) {
    .elementor-28 .elementor-element.e-parent.e-con-full,
    .elementor-28 .elementor-element.elementor-element-d4f155d,
    .elementor-28 .elementor-element.elementor-element-840d2e4,
    .elementor-28 .elementor-element.elementor-element-b51338e,
    .elementor-28 .elementor-element.elementor-element-78ff3c5,
    .elementor-28 .elementor-element.elementor-element-66cacdd,
    .elementor-28 .elementor-element.elementor-element-1511bff {
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* Custom post metadata styling */
.elementor-posts .elementor-post__meta-data {
    color: #adadad;
    font-size: 14px !important;
    line-height: 1.3em;
    margin-bottom: 5px !important;
    margin-top: 4px !important;
}

.entry-content {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

/* Custom Contact Page Style Enhancements */

/* Make form elements more premium */
.contact-form-col form p {
    margin-bottom: 18px !important;
}

.contact-form-col label {
    font-size: 0.9em !important;
    font-weight: 600 !important;
    color: #4b5563 !important;
    margin-bottom: 6px !important;
    display: block !important;
}

.contact-form-col input[type="text"],
.contact-form-col input[type="email"],
.contact-form-col textarea {
    border: 1px solid #e5e7eb !important;
    border-radius: 6px !important;
    padding: 10px 14px !important;
    background-color: #f9fafb !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
    box-sizing: border-box !important;
    color: #1f2937 !important;
    font-family: inherit !important;
}

.contact-form-col input[type="text"]:focus,
.contact-form-col input[type="email"]:focus,
.contact-form-col textarea:focus {
    border-color: #c5a059 !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(197, 160, 89, 0.15) !important;
    outline: none !important;
}

/* Premium submit button styling centered */
.contact-form-col input[type="submit"] {
    background: #c5a059 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 30px !important;
    padding: 12px 35px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    display: block !important;
    margin: 20px auto 0 auto !important; /* Centers the button! */
    box-shadow: 0 4px 10px rgba(197, 160, 89, 0.2) !important;
}

.contact-form-col input[type="submit"]:hover {
    background: #b08d4b !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 15px rgba(197, 160, 89, 0.35) !important;
}

/* Premium circular icon styling and hover micro-animations */
.contact-detail-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background-color: rgba(197, 160, 89, 0.1) !important;
    color: #c5a059 !important;
    font-size: 1.15em !important;
    flex-shrink: 0 !important;
    border: 1px solid rgba(197, 160, 89, 0.25) !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.contact-detail-item {
    display: flex !important;
    align-items: center !important;
    transition: all 0.3s ease !important;
}

.contact-detail-item:hover .contact-detail-icon {
    background-color: #c5a059 !important;
    color: #ffffff !important;
    transform: scale(1.1) rotate(8deg) !important;
    box-shadow: 0 4px 10px rgba(197, 160, 89, 0.3) !important;
}

/* Center and widen the main content area on builder pages */
.ast-page-builder-template #content.content-area,
.ast-page-builder-template .content-area {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 auto !important;
}

/* Custom class for white background cards in Flatsome columns */
.white-card > .col-inner {
    background-color: #ffffff !important;
}

/* --- 3. GÓI DỊCH VỤ (SERVICE PACKAGES) STYLES --- */

/* Scroll card style */
.parchment-scroll-card {
    overflow: visible !important;
}

.parchment-scroll-card > .col-inner {
    background-image: url('/daotaohuyenhoc/wp-content/uploads/2026/06/giay_do_scroll_card.png?v=2') !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 70px 45px 75px 45px !important; /* Top and bottom padding to avoid rollers */
    min-height: 520px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
    mix-blend-mode: multiply !important;
    overflow: visible !important;
}

.parchment-scroll-card:hover > .col-inner {
    transform: translateY(-8px) scale(1.02) !important;
}

/* Typography on scroll */
.scroll-card-category {
    font-family: Georgia, Times, serif !important;
    font-size: 11px !important;
    color: #c92a2a !important; /* Elegant red seal color */
    border: 1px solid #c92a2a !important;
    padding: 3px 10px !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 12px;
    font-weight: 600;
    display: inline-block;
    border-radius: 3px;
    background-color: rgba(201, 42, 42, 0.04) !important;
}

.scroll-card-title {
    font-family: Times, Georgia, serif !important;
    font-size: 21px !important;
    font-weight: bold !important;
    color: #1a0f00 !important;
    line-height: 1.35 !important;
    margin-top: 5px !important;
    margin-bottom: 15px !important;
}

.scroll-card-excerpt {
    font-family: Times, Georgia, serif !important;
    font-size: 14px !important;
    color: #4a3b2c !important;
    line-height: 1.7 !important;
    margin-bottom: 25px !important;
    flex-grow: 1;
    max-width: 90%;
}

.scroll-card-btn {
    display: inline-block !important;
    padding: 8px 24px !important;
    background-color: #8b5e1a !important;
    border: 1px solid #8b5e1a !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    font-family: Georgia, Times, serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    text-decoration: none !important;
    box-shadow: 0 4px 10px rgba(139, 94, 26, 0.2) !important;
}

.scroll-card-btn:hover {
    background-color: #2b1f0d !important;
    border-color: #2b1f0d !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 15px rgba(43, 31, 13, 0.35) !important;
}

/* Zen Subpage Styles */
.zen-quote-container {
    text-align: center;
    max-width: 700px;
    margin: 40px auto 40px auto;
    padding: 0 20px;
}

.zen-quote-text {
    font-family: Times, Georgia, serif !important;
    font-style: italic;
    font-size: 19px !important;
    color: #555555 !important;
    line-height: 1.8 !important;
    position: relative;
    display: inline-block;
}

.zen-quote-text::before {
    content: "“";
    font-size: 60px;
    color: rgba(197, 160, 89, 0.25);
    position: absolute;
    top: -25px;
    left: -25px;
    font-family: Georgia, serif;
}

.zen-quote-author {
    font-family: Times, Georgia, serif !important;
    font-size: 13px !important;
    color: var(--huyenhoc-gold) !important;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-top: 12px;
    display: block;
    font-weight: 600;
}

/* Companionship Suitability Box */
.suitability-box {
    background-color: #fdfaf6 !important;
    border: 1px dashed rgba(197, 160, 89, 0.45) !important;
    border-radius: 8px !important;
    padding: 35px !important;
    height: 100%;
    box-shadow: 0 4px 15px rgba(197, 160, 89, 0.04) !important;
}

.suitability-title {
    font-family: Times, Georgia, serif !important;
    font-size: 19px !important;
    font-weight: 600 !important;
    color: #8b5e1a !important;
    margin-bottom: 20px !important;
    display: flex;
    align-items: center;
    gap: 10px;
}

.suitability-list {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

.suitability-list li {
    font-family: Times, Georgia, serif !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
    color: #4f3d24 !important;
    margin-bottom: 12px !important;
    position: relative !important;
    padding-left: 25px !important;
}

.suitability-list li::before {
    content: "🌸" !important;
    position: absolute !important;
    left: 0 !important;
    top: 2px !important;
    font-size: 13px !important;
}

/* --- 4. SIDE-BY-SIDE SERVICE LAYOUT STYLES --- */

.service-text-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 20px 0;
}

.service-text-cat {
    font-family: Georgia, Times, serif !important;
    font-size: 12px !important;
    color: #c92a2a !important; /* Elegant red seal color */
    border: 1px solid #c92a2a !important;
    padding: 3px 10px !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 15px;
    font-weight: 600;
    display: inline-block;
    border-radius: 3px;
    background-color: rgba(201, 42, 42, 0.03) !important;
    align-self: flex-start; /* Prevent stretching full width */
}

.service-text-title {
    font-family: Times, Georgia, serif !important;
    font-size: 26px !important;
    font-weight: bold !important;
    color: #1a0f00 !important;
    line-height: 1.35 !important;
    margin-bottom: 15px !important;
    margin-top: 5px !important;
}

.service-text-desc {
    font-family: Times, Georgia, serif !important;
    font-size: 15.5px !important;
    color: #4a3b2c !important;
    line-height: 1.8 !important;
    margin-bottom: 25px !important;
}

.service-text-btn {
    display: inline-block !important;
    padding: 10px 30px !important;
    background-color: #8b5e1a !important;
    border: 1px solid #8b5e1a !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    font-family: Georgia, Times, serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    text-decoration: none !important;
    box-shadow: 0 4px 10px rgba(139, 94, 26, 0.2) !important;
    align-self: flex-start;
}

.service-text-btn:hover {
    background-color: #2b1f0d !important;
    border-color: #2b1f0d !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 15px rgba(43, 31, 13, 0.35) !important;
}

/* Hover effects for service images */
.service-image {
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
    overflow: visible !important;
}

.service-image .img-inner {
    border-radius: 8px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05) !important;
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
    overflow: hidden !important;
}

.service-image:hover .img-inner {
    transform: translateY(-6px) scale(1.01) !important;
    box-shadow: 0 20px 40px rgba(197, 160, 89, 0.18) !important;
}

/* --- 5. ZEN SUBPAGE DETAILS STYLES --- */

/* Framed quote container */
.zen-quote-container {
    text-align: center;
    max-width: 800px;
    margin: 40px auto 40px auto;
    padding: 35px 50px !important;
    background-color: #fdfaf6 !important;
    border: 1px solid rgba(197, 160, 89, 0.2) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 15px rgba(197, 160, 89, 0.03) !important;
    position: relative;
    overflow: visible !important;
}

/* Suitability Box Hover Lift */
.suitability-box {
    background-color: #fdfaf6 !important;
    border: 1px solid rgba(197, 160, 89, 0.25) !important;
    border-radius: 8px !important;
    padding: 35px !important;
    height: 100%;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.03) !important;
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.suitability-box:hover {
    transform: translateY(-6px) !important;
    border-color: rgba(197, 160, 89, 0.6) !important;
    box-shadow: 0 20px 40px rgba(197, 160, 89, 0.15) !important;
}

/* Custom Process Steps */
.process-step {
    display: flex;
    gap: 15px;
    margin-bottom: 22px;
    align-items: flex-start;
}

.step-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background-color: rgba(197, 160, 89, 0.08);
    color: #8b5e1a;
    font-family: Georgia, serif;
    font-weight: bold;
    font-size: 13.5px;
    flex-shrink: 0;
    border: 1px solid rgba(197, 160, 89, 0.25);
}

.step-content {
    font-family: Times, Georgia, serif;
    font-size: 15.5px;
    color: #4a3b2c;
    line-height: 1.75;
}

.step-content strong {
    color: #1a0f00;
    font-size: 16px;
    display: block;
    margin-bottom: 4px;
}

/* Large CTA Button for subpages */
.subpage-cta-btn {
    display: inline-block !important;
    padding: 12px 40px !important;
    background-color: #8b5e1a !important;
    border: 1px solid #8b5e1a !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    font-family: Georgia, Times, serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(139, 94, 26, 0.2) !important;
}

.subpage-cta-btn:hover {
    background-color: #2b1f0d !important;
    border-color: #2b1f0d !important;
    color: #ffffff !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(43, 31, 13, 0.35) !important;
}

@media (min-width: 993px) {
    .ast-separate-container #primary, .ast-separate-container.ast-left-sidebar #primary, .ast-separate-container.ast-right-sidebar #primary {
        margin: 0;
        padding: 0;
    }
}

.ast-theme-transparent-header [data-section="section-header-mobile-trigger"] .ast-button-wrap .ast-mobile-menu-trigger-minimal {
    background: transparent;
    margin: 0 !important;
}

@media (max-width: 767px) {
    .elementor-28 .elementor-element.e-con,
    .elementor-28 .elementor-element.e-parent,
    .elementor-28 .elementor-element.elementor-element-d4f155d,
    .elementor-28 .elementor-element.elementor-element-840d2e4,
    .elementor-28 .elementor-element.elementor-element-b51338e,
    .elementor-28 .elementor-element.elementor-element-78ff3c5,
    .elementor-28 .elementor-element.elementor-element-66cacdd,
    .elementor-28 .elementor-element.elementor-element-1511bff,
    .elementor-28 .elementor-element.elementor-element-907cd95 {
        --width: 100% !important;
        --content-width: 100% !important;
        width: 100% !important;
    }
}

@media (max-width: 767px) {
    .elementor-28 .elementor-element.elementor-element-48a6679 {
        --width: 50% !important;
        --padding-top: 0px !important;
        --padding-bottom: 0px !important;
        --padding-left: 0px !important;
        --padding-right: 0 !important;
    }
}

@media (max-width: 767px) {
    .elementor-28 .elementor-element.elementor-element-20d7808 {
        --width: 50% !important;
        --gap: 8px 8px !important;
        --row-gap: 0 !important;
        --column-gap: 0 !important;
        --padding-top: 0px !important;
        --padding-bottom: 0px !important;
        --padding-left: 0 !important;
        --padding-right: 0px !important;
        margin-top: 15px !important;
    }
}

.main-header-menu .menu-link, .main-header-menu>a {
    text-decoration: none;
    padding: 0 12px !important;
    display: inline-block;
    transition: all .2s linear;
}

.ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item {
    line-height: 100px !important;
    margin-bottom: 0 !important;
}

/* ==========================================================================
   BLOG PAGE REDESIGN - SLEEK FULL-WIDTH GRID & CARDS
   ========================================================================== */

/* Full-width container adjustments */
.blog-full-width {
    width: 100% !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
    float: none !important;
}

/* Blog grid layout */
.blog-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 30px !important;
    margin-top: 40px !important;
    margin-bottom: 50px !important;
    width: 100% !important;
}

@media (max-width: 991px) {
    .blog-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
}

@media (max-width: 600px) {
    .blog-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Premium Card Design */
.blog-card {
    background-color: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
    display: flex !important;
    flex-direction: column !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    box-sizing: border-box !important;
}

.blog-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.07) !important;
    border-color: rgba(197, 160, 89, 0.35) !important;
}

/* Card Thumbnail */
.blog-card-thumbnail {
    position: relative !important;
    overflow: hidden !important;
    aspect-ratio: 16 / 10 !important;
    background-color: #f7fafc !important;
}

.blog-card-thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.blog-card:hover .blog-card-thumbnail img {
    transform: scale(1.04) !important;
}

/* Card Body */
.blog-card-body {
    padding: 22px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    box-sizing: border-box !important;
}

/* Card Meta */
.blog-card-meta {
    font-size: 12px !important;
    color: #888888 !important;
    margin-bottom: 12px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
}

.blog-card-meta a {
    color: #666666 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.blog-card-meta a:hover {
    color: var(--huyenhoc-gold) !important;
}

.blog-card-meta .sep {
    color: #e2e8f0 !important;
}

/* Card Title */
.blog-card-title {
    font-family: Times, Georgia, serif !important;
    font-size: 19px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 0 12px 0 !important;
    color: #111111 !important;
}

.blog-card-title a {
    color: inherit !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.blog-card-title a:hover {
    color: var(--huyenhoc-gold) !important;
}

/* Card Excerpt */
.blog-card-excerpt {
    font-family: Times, Georgia, serif !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    color: #555555 !important;
    margin-bottom: 20px !important;
    flex-grow: 1 !important;
}

.blog-card-excerpt p {
    margin: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
}

/* Read More Link */
.blog-card-more {
    margin-top: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    color: var(--huyenhoc-gold) !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.blog-card-more:hover {
    color: var(--huyenhoc-gold-hover) !important;
}

/* Blog Hero Banner */
.blog-hero-banner {
    background-image: linear-gradient(rgba(13, 15, 20, 0.76), rgba(26, 30, 38, 0.86)), url('http://localhost:8080/daotaohuyenhoc/wp-content/uploads/2026/06/mystical_banner.png');
    background-size: cover !important;
    background-position: center !important;
    padding: 85px 20px !important;
    color: #ffffff !important;
    border-bottom: 2px solid var(--huyenhoc-gold) !important;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5) !important;
    text-align: center !important;
    width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    margin-bottom: 40px !important;
    box-sizing: border-box !important;
}

.blog-hero-title {
    font-family: Times, Georgia, serif !important;
    font-size: 38px !important;
    color: var(--huyenhoc-gold) !important;
    margin: 0 0 15px 0 !important;
    font-weight: bold !important;
    letter-spacing: 0.5px !important;
    line-height: 1.25 !important;
}

.blog-hero-subtitle {
    font-family: Times, Georgia, serif !important;
    font-size: 17px !important;
    color: #cbd5e0 !important;
    max-width: 680px !important;
    margin: 0 auto !important;
    line-height: 1.65 !important;
}

/* Pagination custom override */
.blog-pagination .navigation.pagination {
    display: inline-block !important;
    margin: 20px 0 !important;
}

.blog-pagination .nav-links {
    display: flex !important;
    gap: 8px !important;
    justify-content: center !important;
    align-items: center !important;
}

.blog-pagination .page-numbers {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    background-color: #ffffff !important;
    color: #333333 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
}

.blog-pagination .page-numbers:hover {
    border-color: var(--huyenhoc-gold) !important;
    color: var(--huyenhoc-gold) !important;
    transform: translateY(-1px) !important;
}

.blog-pagination .page-numbers.current {
    background-color: var(--huyenhoc-gold) !important;
    border-color: var(--huyenhoc-gold) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 10px rgba(197, 160, 89, 0.25) !important;
}

.blog-pagination .page-numbers.dots {
    border: none !important;
    background: transparent !important;
}

/* Fix flex stretch height for blog and archive page headers */
.blog .site-content > .ast-container,
.archive .site-content > .ast-container {
    flex-direction: column !important;
}

/* ==========================================================================
   SINGLE POST REDESIGN - SIDEBAR REMOVAL & READABILITY ENHANCEMENTS
   ========================================================================== */

/* Center container and restrict width for optimal reading line length */
.single-post-container {
    width: 100% !important;
    max-width: 850px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
    float: none !important;
}

.single-post-card {
    background-color: #ffffff !important;
    padding: 0 !important;
    margin-bottom: 50px !important;
}

/* Elegant header */
.single-post-header {
    text-align: center !important;
    margin-bottom: 35px !important;
    margin-top: 40px !important;
}

.single-post-title {
    font-family: Times, Georgia, serif !important;
    font-size: 34px !important;
    font-weight: bold !important;
    line-height: 1.3 !important;
    color: #111111 !important;
    margin-bottom: 15px !important;
}

.single-post-meta {
    font-size: 13px !important;
    color: #888888 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
}

.single-post-meta a {
    color: inherit !important;
    text-decoration: none !important;
}

.single-post-meta a:hover {
    color: var(--huyenhoc-gold) !important;
}

.single-post-meta .sep {
    color: #cbd5e0 !important;
}

/* Beautiful featured image */
.single-post-featured-image {
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    margin-bottom: 40px !important;
}

.single-post-featured-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* Comfortable article readability */
.single-post-content {
    font-family: Times, Georgia, serif !important;
    font-size: 17.5px !important;
    line-height: 1.85 !important;
    color: #2d3748 !important;
}

.single-post-content p {
    margin-bottom: 1.5rem !important;
}

.single-post-content h2 {
    font-family: Times, Georgia, serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #111111 !important;
    margin-top: 2rem !important;
    margin-bottom: 1rem !important;
    line-height: 1.35 !important;
}

.single-post-content h3 {
    font-family: Times, Georgia, serif !important;
    font-size: 21px !important;
    font-weight: 600 !important;
    color: #111111 !important;
    margin-top: 1.8rem !important;
    margin-bottom: 1rem !important;
    line-height: 1.35 !important;
}

.single-post-content blockquote {
    border-left: 4px solid var(--huyenhoc-gold) !important;
    background-color: #faf7f2 !important;
    padding: 20px 25px !important;
    margin: 30px 0 !important;
    font-style: italic !important;
    color: #4a4a4a !important;
    font-size: 18px !important;
}

/* Footer tags & category styles */
.single-post-footer {
    border-top: 1px solid #edf2f7 !important;
    padding-top: 25px !important;
    margin-top: 40px !important;
    font-size: 14px !important;
    color: #666666 !important;
}

.single-post-footer .cat-links,
.single-post-footer .tags-links {
    margin-bottom: 10px !important;
}

.single-post-footer a {
    color: #111111 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.single-post-footer a:hover {
    color: var(--huyenhoc-gold) !important;
}