/* ── LinCom — Frontoffice Responsive Enhancements ────────── */

/* Global media safety */
img, video, iframe, embed, object {
    max-width: 100%;
    height: auto;
}

/* Embedded maps keep aspect ratio */
.embed-responsive, .ratio {
    position: relative;
    overflow: hidden;
}
.embed-responsive iframe, .ratio iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Tables: always scrollable on mobile */
.table-responsive, .table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ── Hero adjustments (mobile) ──────────────────── */
@media (max-width: 639px) {
    /* Hero text size */
    .hero h2 { font-size: 1.75rem !important; }
    .hero p   { font-size: .9rem; }

    /* Page title */
    .page-title .heading { padding: 100px 0 40px; }
    .page-title .heading h1 { font-size: 1.6rem; }

    /* Section padding reduced */
    section, .section { padding: 36px 0; }
}

/* ── Org / profile page cards ───────────────────── */
@media (max-width: 767px) {
    /* Cards with inline flex that might overflow */
    .lc-card-row, .lc-profile-row {
        flex-direction: column !important;
    }

    /* Stat bars in org page */
    .lc-stat-bar { min-width: auto !important; }

    /* Contact/info tables */
    .contact .info-container { margin-bottom: 20px; }
    .contact .php-email-form { padding: 20px 16px; }

    /* Footer columns spacing */
    .footer .footer-top > .row > div { margin-bottom: 24px; }
}

/* ── E-Market cards grid ────────────────────────── */
@media (max-width: 480px) {
    /* Force single-column on very small phones */
    .mkt-grid-2 { grid-template-columns: 1fr !important; }
    .emarket-card { width: 100% !important; }
}

/* ── Forum / blog lists ─────────────────────────── */
@media (max-width: 639px) {
    .forum-item-meta { flex-wrap: wrap; gap: 6px; }
    .blog-posts .post-img { max-height: 180px; }
}

/* ── Messagerie (public) ────────────────────────── */
@media (max-width: 767px) {
    /* On mobile, chat panels should stack and fill screen */
    .lc-chat-layout {
        flex-direction: column;
        height: auto;
    }
    .lc-chat-contacts {
        width: 100% !important;
        max-height: 240px;
        overflow-y: auto;
        border-right: none !important;
        border-bottom: 1px solid #e5e7eb;
    }
    .lc-chat-main {
        width: 100% !important;
        min-height: 50vh;
    }
}

/* ── Notifications page ─────────────────────────── */
@media (max-width: 639px) {
    .notif-item { flex-direction: column; gap: 8px; }
    .notif-actions { align-self: flex-end; }
}

/* ── Registration / login forms ─────────────────── */
@media (max-width: 639px) {
    /* Two-column form grids stack */
    .reg-grid-2 { grid-template-columns: 1fr !important; }
    .form-col-2 { flex-direction: column; }
    .form-col-2 > * { width: 100% !important; }

    /* Buttons full-width */
    .btn-submit-full { width: 100%; text-align: center; }
}

/* ── Accessibility widget: stay above mobile nav ── */
@media (max-width: 767px) {
    #a11y-trigger {
        bottom: 16px !important;
        left: 10px !important;
        z-index: 900;
    }
}