/* === Stage 1: Enable mobile header === */
@media only screen and (max-width: 768px) {

    /* Hide desktop header */
    header, 
    .main-header-bar,
    .site-header {
        display: none !important;
    }

    /* Show mobile header */
    .g2-mobile-header {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        background: #ffffff;
        border-bottom: 1px solid #ddd;
        position: sticky;
        top: 0;
        z-index: 9999;
    }

    .g2-mobile-logo {
        font-size: 20px;
        font-weight: 700;
    }
}

/* === Layout fixes === */
@media (max-width: 768px) {

    #g2-container,
    .g2-container {
        max-width: 100% !important;
        width: 100% !important;
        padding: 10px !important;
        margin: 0 !important;
    }

    body {
        font-size: 18px !important;
        line-height: 1.5 !important;
    }

    h1, h2, h3 {
        font-size: 22px !important;
        line-height: 1.3 !important;
    }

    button, .button, .g2-btn {
        font-size: 18px !important;
        padding: 14px 18px !important;
    }

    .g2-cover img,
    .cover img,
    .post-cover img {
        width: 100% !important;
        height: auto !important;
    }

    .g2-card,
    .post-card {
        padding: 14px !important;
        margin-bottom: 16px !important;
    }
}

/* === Mobile Slide Menu (WORKING) === */
.g2-mobile-slide-menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 260px;
    height: 100vh;
    background: #fff;
    padding: 20px;
    overflow-y: auto;
    z-index: 9998;

    transform: translateX(-100%);
    transition: transform 0.3s ease;
}

.g2-mobile-slide-menu.active {
    transform: translateX(0);
}

/* === Mobile Menu Button === */
.g2-mobile-menu-btn {
    font-size: 32px !important;
    color: #007bff !important;
    font-weight: 900 !important;
    padding: 10px 14px !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25);
    border: none !important;
}

/* ============================
   G2 — Mobile Post Comment Modal
   ============================ */
   @media (max-width: 768px) {

    .galaxy-comments-modal {
      width: 100%;
      height: 100vh;
      margin: 0;
      padding: 15px;
      border-radius: 0;
      overflow-y: auto;
      box-sizing: border-box;
    }
  
    .galaxy-comments-modal .comment-box {
      font-size: 16px;
      line-height: 1.4;
    }
  
    .galaxy-comments-modal input[type="text"],
    .galaxy-comments-modal textarea {
      width: 100%;
      font-size: 15px;
      padding: 10px;
      box-sizing: border-box;
    }
  
    .galaxy-comments-modal .close-btn {
      position: fixed;
      top: 10px;
      right: 15px;
      font-size: 22px;
      z-index: 9999;
    }
  
    .galaxy-comments-modal .submit-btn {
      width: 100%;
      font-size: 16px;
      padding: 12px;
      margin-top: 10px;
    }
  }


@media (max-width: 768px) {

    /* Иконки — НЕ трогаем */
    .g2c-action-btn svg,
    .g2c-like-btn svg,
    .g2c-comment-btn svg,
    .g2c-open-share svg {
        width: 26px !important;
        height: 26px !important;
    }

    /* Цифры — делаем чуть крупнее, но не комиксы */
    .g2c-action-btn span,
    .g2c-like-btn span,
    .g2c-comment-btn span,
    .g2c-open-share span {
        font-size: 20px !important;
        line-height: 1.2 !important;
    }

    /* Зона нажатия */
    .g2c-action-btn {
        padding: 8px !important;
    }

    /* Расстояние между кнопками */
    .g2c-actions {
        gap: 16px !important;
    }
}


@media (max-width: 768px) {

    /* ============================================================
       JOIN COMMUNITY — MOBILE ADAPTATION
       ============================================================ */

    .page-template-join-community .galaxy2-testimonials-wrapper {
        padding: 20px;
    }

    .page-template-join-community .galaxy2-row {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }

    .page-template-join-community .galaxy2-card {
        max-width: 100%;
        width: 100%;
        font-size: 14px;
        padding: 18px;
    }

    /* Benefits */
    .page-template-join-community .galaxy2-benefits-3col-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .page-template-join-community .galaxy2-benefit-item {
        font-size: 15px;
        padding: 18px;
    }

    /* Stats */
    .page-template-join-community .galaxy2-stats-row {
        flex-direction: column;
        gap: 25px;
    }

    .page-template-join-community .galaxy2-stat-number {
        font-size: 32px;
    }

    .page-template-join-community .galaxy2-stat-label {
        font-size: 16px;
    }

    /* CTA buttons */
    .page-template-join-community .galaxy2-cta-buttons {
        margin: 30px 0;
    }

    .page-template-join-community .galaxy2-btn {
        display: block;
        width: 100%;
        max-width: 260px;
        margin: 10px auto;
        font-size: 17px;
        padding: 14px 20px;
    }
}

/* === Flamingo — Unified Mobile Layout for All Pages === */
@media (max-width: 768px) {

    /* Центральная колонка — аккуратные боковые отступы */
    .galaxy2-content-center,
    .g2-container,
    #g2-container {
        width: 100% !important;
        padding: 0 14px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    /* Общий контейнер страницы */
    .galaxy2-page-layout {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Посты */
    .galaxy2-feed-item {
        border-radius: 12px !important;
        padding: 16px !important;
        margin-bottom: 18px !important;
        box-sizing: border-box !important;
    }

    /* Кнопки */
    button,
    .button,
    .g2-btn,
    .galaxy2-post-actions button {
        font-size: 17px !important;
        padding: 14px !important;
        border-radius: 10px !important;
    }

    /* Текст */
    body {
        font-size: 17px !important;
        line-height: 1.45 !important;
    }

    h1, h2, h3 {
        font-size: 22px !important;
        line-height: 1.3 !important;
    }

    /* Комментарии */
    .galaxy2-comment-item {
        font-size: 16px !important;
        padding: 14px !important;
        border-radius: 10px !important;
    }

    /* Горизонтальные карточки */
    .galaxy2-horizontal-bar-wrapper img,
    .galaxy2-card img {
        height: 140px !important;
        border-radius: 10px !important;
    }

    /* Cover — НЕ трогаем */
    .galaxy2-cover {
        margin-bottom: 16px !important;
    }
}

@media (max-width: 768px) {

    /* Полное отключение любых сеток на мобильных */
    [class*="page-layout"],
    [class*="layout"],
    [class*="container"],
    .galaxy2-page-layout,
    .g2-container,
    #g2-container {
        display: block !important;
        grid-template-columns: none !important;
        gap: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* Убираем боковые зазоры у постов */
    .galaxy2-feed-item {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Возвращаем share внутрь поста */
    .g2c-actions,
    .g2c-action-btn {
        max-width: 100% !important;
        overflow: hidden !important;
    }
}

@media (max-width: 768px) {

    /* Главный контейнер Flomingo постбокса */
    .flomingo-postbox,
    .postbox,
    .g2-postbox,
    .g2-new-post {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Контейнер с кнопками — перенос обязателен */
    .flomingo-postbox-actions,
    .postbox-actions,
    .g2-postbox-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        gap: 10px !important;
        box-sizing: border-box !important;
    }

    /* Поле ввода */
    .flomingo-postbox textarea,
    .postbox textarea,
    .g2-postbox textarea {
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Кнопка POST — отдельная строка */
    #galaxy2-postbox-submit,
    .post-submit,
    .g2-post-submit {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 12px !important;
        box-sizing: border-box !important;
    }

    /* Кнопка Choose Files */
    #galaxy2-postbox-media,
    .post-media,
    .g2-post-media {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 768px) {
    #galaxy2-postbox-submit {
        margin-left: 0 !important;
        width: 100% !important;
        display: block !important;
    }
}

/* === FINAL FIX — Galaxy2 POST button === */
@media (max-width: 768px) {
    #galaxy2-postbox-submit {
        margin-left: 0 !important;
        width: 100% !important;
        display: block !important;
        box-sizing: border-box !important;
    }
}

/* === FINAL CONTAINER FIX — Galaxy2 POSTBOX === */
@media (max-width: 768px) {

    .galaxy2-postbox-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        gap: 12px !important;
    }

    #galaxy2-postbox-submit {
        flex: 0 0 100% !important;
        width: 100% !important;
        display: block !important;
        box-sizing: border-box !important;
    }
}

.g2-mobile-slide-menu {
    padding-top: 90px !important;
}