/* =====================================
   YOU MMO — GLOBAL RESPONSIVE STYLE
   ===================================== */

/* CONTAINER REDUCE PADDING ON MOBILE */
@media (max-width: 600px) {
    .container {
        padding: 0 14px;
    }
}

/* GLOBAL TYPOGRAPHY */
@media (max-width: 600px) {
    body {
        font-size: 15px;
        line-height: 1.65;
    }
}

/* GLOBAL TITLES */
@media (max-width: 600px) {
    h1 { font-size: 24px; }
    h2 { font-size: 22px; }
    h3 { font-size: 18px; }
}

/* VIDEO GRID — FALLBACK FOR ANY MODULE */
@media (max-width: 1024px) {
    .video-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 650px) {
    .video-grid {
        grid-template-columns: repeat(1, 1fr) !important;
    }
}

/* BREADCRUMB */
@media (max-width: 600px) {
    .yoummo-breadcrumb {
        font-size: 13px;
        overflow-x: auto;
        white-space: nowrap;
    }
}

/* FORMS */
@media (max-width: 600px) {
    input[type="search"],
    input[type="text"],
    textarea {
        font-size: 15px;
    }
}

/* BUTTON */
@media (max-width: 600px) {
    .yoummo-btn,
    button,
    input[type="submit"] {
        width: 100%;
        padding: 12px 16px;
        font-size: 15px;
    }
}

/* RELATED VIDEOS — ENSURE MOBILE LIST */
@media (max-width: 600px) {
    .related-videos {
        display: block !important;
    }
    .related-item {
        margin-bottom: 20px;
    }
}

/* SINGLE CONTENT */
@media (max-width: 650px) {
    .single-wrapper {
        padding: 0 20px;
    }
    .video-embed iframe {
        height: 230px !important;
    }
}

/* FOOTER */
@media (max-width: 700px) {
    .footer-links li,
    .footer-menu li {
        display: block;
        margin-bottom: 10px;
    }

    .yoummo-footer {
        padding: 30px 0;
        text-align: center;
    }
}

/* HEADER ICON SPACING ON SMALL DEVICES */
@media (max-width: 600px) {
    .mobile-menu-icon span {
        width: 24px;
        height: 3px;
    }
}

/* SEARCH FORM WIDTH FIX */
@media (max-width: 650px) {
    .yoummo-search-form,
    .yoummo-search {
        flex-direction: column;
    }
    .yoummo-search-button {
        width: 100%;
    }
}

/* HERO SMALL SCREEN TUNING */
@media (max-width: 650px) {
    .hero-title {
        font-size: 26px !important;
    }
    .hero-desc {
        font-size: 15px;
        margin-bottom: 22px;
    }
}

/* GLOBAL SPACING */
@media (max-width: 650px) {
    .section-title {
        font-size: 20px;
        margin-bottom: 14px;
    }
}
/* Fix hiện video liên quan — luôn luôn ngang */
.related-videos {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
    gap: 22px !important;
    margin-top: 20px !important;
}

/* Fix item */
.related-item {
    display: block !important;
    width: 100% !important;
}

/* Fix ảnh 16:9 */
.related-thumb {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16/9 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: #eee !important;
}

.related-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* Fix text */
.related-name {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-top: 8px !important;
}

/* MOBILE FIX */
@media (max-width: 600px) {
    .related-videos {
        grid-template-columns: 1fr 1fr !important;
        gap: 14px !important;
    }

    .related-name {
        font-size: 14px !important;
    }
}
/* ===========================
   BREADCRUMB FIX — YouMMO
=========================== */

.yoummo-breadcrumb {
    font-size: 14px;
    color: #555;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 18px;
}

.yoummo-breadcrumb .bc-item a {
    color: #007aff;
    text-decoration: none;
}

.yoummo-breadcrumb .bc-item a:hover {
    text-decoration: underline;
}

.yoummo-breadcrumb .separator {
    color: #999;
    margin: 0 4px;
    font-weight: 400;
}

.yoummo-breadcrumb .current {
    font-weight: 600;
    color: #111;
}

/* Mobile */
@media (max-width: 600px) {
    .yoummo-breadcrumb {
        font-size: 13px;
        gap: 4px;
    }
}
