/* AlManara Mobile V6 — mobile-first visual upgrade without changing permissions or database. */
@media (max-width: 760px) {
  html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
  body { background:linear-gradient(180deg,#e5f3e0 0,#f4faf1 210px,#f8fcf7 100%); }
  .hero { padding:16px 14px 19px; border-bottom:3px solid #c0ed82; border-radius:0 0 22px 22px; }
  .hero-inner { align-items:flex-start; gap:14px; }
  .identity { width:100%; display:flex; justify-content:flex-start; align-items:center; gap:12px; }
  .mark { width:58px; height:58px; flex:0 0 58px; border-radius:19px; border-color:#b8e78c; }
  .identity h1 { font-size:clamp(16px,4.6vw,20px); line-height:1.45; }
  .identity p { font-size:11px; line-height:1.5; opacity:.93; }
  .hero-actions { display:flex; width:100%; gap:7px; flex-wrap:wrap; }
  .hero-actions .tag { flex:1 1 100%; max-width:100%; padding:6px 10px; border-radius:10px; }
  .hero-actions button { min-height:39px; padding:7px 10px; border-radius:11px; font-size:12px; }
  .shell { padding:18px 12px 34px; }
  .heading { margin-bottom:16px; }
  .heading h2 { font-size:20px; }
  .heading p { font-size:12px; }
  .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
  .card { border-radius:18px; box-shadow:0 9px 22px #17492313; }
  .card.click { padding:17px 12px; min-height:146px; text-align:right; }
  .card .symbol { font-size:31px; margin-bottom:7px; }
  .card-emblem { width:42px; height:42px; }
  .card h3 { font-size:14px; line-height:1.65; }
  .card p { font-size:11px; line-height:1.65; }
  .form-grid { grid-template-columns:1fr; gap:13px; }
  input,textarea,select { min-height:46px; font-size:16px; }
  textarea { min-height:100px; }
  .btn { min-height:44px; display:inline-flex; justify-content:center; align-items:center; gap:5px; }
  .btn.small { min-height:38px; }
  .panel { padding:16px; border-radius:20px; }
  .item { padding:14px; border-radius:16px; }
  .item-actions { justify-content:flex-start; }
  .toolbar { align-items:stretch; }
  .toolbar > * { max-width:100%; }
  .news-section { padding:16px; border-radius:21px; }
  .news-photo { aspect-ratio:16/9; }
  .news-item { border-radius:19px; }
  .news-content { padding:16px; }
  .hub-lounge { border-radius:21px; padding:22px; }
  .hub-lounge-btn { width:100%; }
  .games-hero { border-radius:21px; padding:21px; }
  .games-hero-icon { font-size:43px; }
  .game-columns { gap:15px; }
  .game-panel { border-radius:20px; }
  .auth-intro { padding:26px 16px 0; }
  .auth-emblem { width:150px; height:150px; }
  .auth-aside { padding:12px 12px 20px; }
  .auth-card { padding:25px 20px; border-radius:22px; }
  .notice-area { left:12px; right:12px; bottom:calc(88px + env(safe-area-inset-bottom)); max-width:none; }
  .chat-log { height:min(52dvh,460px); min-height:210px; padding:10px; }
  .chat-bubble { max-width:95%; }
  .chat-compose { display:grid; grid-template-columns:1fr; }
  body.mobile-app-active .shell { padding-bottom:calc(102px + env(safe-area-inset-bottom)); }
  body.mobile-app-active .footer { padding:4px 16px calc(93px + env(safe-area-inset-bottom)); }
  .mobile-tabbar {
    direction:rtl; position:fixed; inset:auto 9px calc(8px + env(safe-area-inset-bottom)) 9px;
    z-index:120; display:grid; grid-template-columns:repeat(4,1fr); align-items:stretch;
    padding:7px 6px; border:1px solid #d2e7cc; border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 13px 38px #0f422e35;
    -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  }
  .mobile-tabbar button { appearance:none; border:0; background:transparent; color:#42634e; border-radius:14px;
    min-height:52px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2px;
    padding:5px 1px; font-size:11px; font-weight:800; line-height:1.2; }
  .mobile-tabbar button:active { background:#e8f7e3; transform:scale(.98); }
  .mobile-tabbar button .tab-icon { font-size:23px; line-height:1.1; }
  .mobile-tabbar button:focus-visible { outline:2px solid #25733c; outline-offset:0; }
}
@media (min-width: 761px) { .mobile-tabbar { display:none!important; } }
@media (max-width: 365px) {
  .card.click { padding:12px 9px; min-height:146px; }
  .card h3 { font-size:13px; }
  .card p { font-size:10px; }
  .mobile-tabbar { left:5px; right:5px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .mobile-tabbar button { transition:none; }
}
/* إصلاح تنسيق التطبيق على شاشات الهواتف */

@media (max-width: 760px) {

    html, body {
        width: 100%;
        max-width: 100%;
        margin: 0;
        overflow-x: clip;
    }

    #root,
    .hero,
    .hero-inner,
    .shell,
    .grid {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .identity,
    .hero-actions {
        max-width: 100%;
        min-width: 0;
    }

    .identity > div {
        min-width: 0;
        flex: 1;
    }

    .identity h1,
    .identity p,
    .heading h2,
    .heading p {
        overflow-wrap: anywhere;
    }

    .grid > *,
    .card.click {
        min-width: 0;
        max-width: 100%;
    }
}

/* ترتيب البطاقات على الهواتف الصغيرة */

@media (max-width: 420px) {

    .grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .card.click {
        width: 100%;
        min-height: 115px;
        padding: 16px;
    }
}