/* ===== MARINECOS MOBILE UTILITIES ===== */
/* Breakpoints: --bp-sm 480 | --bp-md 768 | --bp-lg 1024 */

/* Global media safety */
img, video, iframe, svg { max-width: 100%; height: auto; }
pre, code { overflow-wrap: anywhere; word-break: break-word; }

/* Touch targets */
.u-touch-target { min-width: 44px; min-height: 44px; }

/* Safe area (iOS) */
.u-safe-bottom { padding-bottom: env(safe-area-inset-bottom, 0); }
.u-safe-top { padding-top: env(safe-area-inset-top, 0); }

/* Table scroll */
.u-table-scroll,
.table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Stack flex on tablet/mobile */
@media (max-width: 1024px) {
    .u-stack-lg { flex-direction: column !important; align-items: stretch !important; }
    .u-grid-1-lg { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; }
    .u-full-width-lg { width: 100% !important; max-width: 100% !important; }
    .u-hide-lg { display: none !important; }
}

@media (max-width: 768px) {
    .u-stack-md { flex-direction: column !important; align-items: stretch !important; }
    .u-grid-1-md { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; }
    .u-grid-2-md { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; }
    .u-full-width-md { width: 100% !important; max-width: 100% !important; }
    .u-hide-md { display: none !important; }
    .u-show-md-only { display: block !important; }

    /* Common inline grid overrides */
    [style*="grid-template-columns: 2fr 1fr"],
    [style*="grid-template-columns: 1fr 1fr"],
    [style*="grid-template-columns: repeat(2"],
    [style*="grid-template-columns: repeat(3"] {
        grid-template-columns: 1fr !important;
    }

    .form-row,
    .filter-row,
    .language-row {
        grid-template-columns: 1fr !important;
        flex-direction: column;
    }

    .modal-content,
    .modal-dialog {
        width: calc(100vw - 2rem) !important;
        max-width: calc(100vw - 2rem) !important;
        margin: 1rem auto !important;
        max-height: 90dvh;
        overflow-y: auto;
    }
}

@media (max-width: 480px) {
    .u-stack-sm { flex-direction: column !important; }
    [style*="grid-template-columns: repeat(6"] {
        grid-template-columns: 1fr !important;
    }
}

/* Guest auth fluid forms */
.guest-auth-page {
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto;
}
.guest-auth-form {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    box-sizing: border-box;
}
.guest-auth-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 24px 16px;
    padding-top: max(24px, env(safe-area-inset-top));
    padding-bottom: max(24px, env(safe-area-inset-bottom));
}

@media (max-width: 768px) {
    .guest-auth-form { max-width: 100%; padding: 20px 16px !important; }
    .role-select-grid { grid-template-columns: 1fr !important; }
}

/* Engine row in ad create */
.engine-row-grid { display: grid; gap: 8px; }
@media (max-width: 768px) {
    .engine-row-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
    .engine-row-grid { grid-template-columns: 1fr !important; }
}

/* Toast mobile */
@media (max-width: 768px) {
    .toast-container {
        left: 12px !important;
        right: 12px !important;
        top: max(12px, env(safe-area-inset-top)) !important;
    }
    .toast {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* Admin mobile drawer */
@media (max-width: 1024px) {
    .admin-mobile-topbar { display: flex !important; }
    .admin-side {
        transform: translateX(-100%);
        width: var(--sidebar-width) !important;
        transition: transform 0.28s ease;
    }
    .admin-side.is-open { transform: translateX(0); }
    .admin-side .brand-text,
    .admin-side .brand-sub,
    .admin-side .nav-section-label,
    .admin-side .admin-link span,
    .admin-side .nav-badge,
    .admin-side .nav-group-toggle span { display: inline !important; }
    .admin-side .admin-link { justify-content: flex-start !important; }
    .admin-main-wrap { margin-left: 0 !important; padding-top: 56px; }
    .admin-expand-handle { display: none !important; }
    .admin-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 99;
    }
    .admin-overlay.is-open { display: block; }
}

.admin-mobile-topbar {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 56px;
    z-index: 200;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    padding: 0 12px;
    align-items: center;
    gap: 10px;
}
.admin-mobile-topbar button {
    width: 40px; height: 40px;
    border: 1px solid var(--border);
    background: var(--bg);
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.admin-mobile-topbar button span {
    display: block;
    width: 18px; height: 2px;
    background: var(--text);
    border-radius: 2px;
}

/* Page split layouts (company panels) */
.u-page-split,
.application-detail-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 30px;
}
@media (max-width: 1024px) {
    .u-page-split,
    .application-detail-grid {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* Profile */
@media (max-width: 768px) {
    .profile-info { flex-direction: column; text-align: center; }
    .language-row { grid-template-columns: 1fr !important; }
    .profile-stats { grid-template-columns: repeat(2, 1fr) !important; }
}

/* Social */
@media (max-width: 768px) {
    .post-media-grid.cols-3,
    .post-media-grid.cols-4,
    .company-social .post-media-grid.cols-3 {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto !important;
    }
    .post-media-grid.cols-3 > :first-child { grid-row: auto !important; }
    .prf-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* Messages safe area */
@media (max-width: 768px) {
    .msg-shell { padding-bottom: env(safe-area-inset-bottom, 8px) !important; }
    .composer {
        padding-bottom: max(8px, env(safe-area-inset-bottom)) !important;
    }
}

/* Legacy messages index */
@media (max-width: 768px) {
    .messages-legacy-shell {
        grid-template-columns: 1fr !important;
        min-height: 0 !important;
        height: calc(100dvh - 70px) !important;
    }
}

/* Logistics / admin tables */
@media (max-width: 768px) {
    .logistics-stat-grid { grid-template-columns: 1fr !important; }
    .admin-detail-grid { grid-template-columns: 1fr !important; }
    .filter-bar-inline { flex-direction: column !important; align-items: stretch !important; }
    .filter-bar-inline > * { min-width: 0 !important; width: 100% !important; }
}