/* GLO Optical 1.1.8 — mobile-only glass navigation dock + GLO Guide bridge.
   Desktop/tablet (>=768px) are intentionally untouched. */
.glo-mobile-dock,
.glo-mobile-more { display:none; }

@media (max-width:767px) {
  :root {
    --glo-mobile-dock-h: 72px;
    --glo-mobile-dock-gap: 10px;
    --glo-mobile-safe: env(safe-area-inset-bottom, 0px);
  }

  /* The bottom dock replaces the old mobile hamburger/search/language controls. */
  .site-header .menu-trigger,
  .site-header .search-link,
  .site-header .language,
  .site-header .store-link { display:none !important; }
  .site-header .header-actions { display:none !important; }

  /* Keep homepage chapter progress safely above the dock. */
  .mobile-chapter {
    bottom: calc(var(--glo-mobile-dock-h) + var(--glo-mobile-dock-gap) + var(--glo-mobile-safe) + 10px) !important;
    left: 14px !important;
    z-index: 999900 !important;
  }

  /* Leave breathing room at the very end without changing page composition. */
  .site-footer {
    padding-bottom: calc(var(--glo-mobile-dock-h) + var(--glo-mobile-dock-gap) + var(--glo-mobile-safe) + 8px);
  }

  .glo-mobile-dock {
    position: fixed;
    z-index: 999940;
    left: 10px;
    right: 10px;
    bottom: calc(10px + var(--glo-mobile-safe));
    height: var(--glo-mobile-dock-h);
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    align-items: stretch;
    padding: 6px;
    border: 1px solid rgba(255,255,255,.115);
    border-radius: 24px;
    background:
      linear-gradient(180deg, rgba(18,27,29,.76), rgba(7,12,15,.83));
    box-shadow:
      0 18px 54px rgba(0,0,0,.36),
      inset 0 1px 0 rgba(255,255,255,.075);
    -webkit-backdrop-filter: blur(22px) saturate(145%);
    backdrop-filter: blur(22px) saturate(145%);
    transition: transform .28s cubic-bezier(.22,.8,.26,1), opacity .22s ease;
    isolation: isolate;
    direction: ltr;
  }

  html[dir="rtl"] .glo-mobile-dock { direction: rtl; }

  .glo-mobile-dock::before {
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    background: linear-gradient(100deg, rgba(243,192,24,.045), transparent 26%, transparent 72%, rgba(111,173,189,.035));
    z-index:-1;
  }

  .glo-mobile-dock__item {
    position:relative;
    min-width:0;
    min-height:58px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:5px 2px;
    border:0;
    border-radius:18px;
    background:transparent;
    color:rgba(236,241,236,.62);
    text-decoration:none !important;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    transition: color .2s ease, background .2s ease, transform .2s ease;
    font-family: Cairo, Manrope, system-ui, sans-serif;
  }
  html[lang="en"] .glo-mobile-dock__item { font-family: Manrope, Cairo, system-ui, sans-serif; }

  .glo-mobile-dock__item svg {
    width:20px;
    height:20px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.65;
    stroke-linecap:round;
    stroke-linejoin:round;
    flex:none;
  }
  .glo-mobile-dock__label {
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    line-height:1.2;
    font-weight:600;
  }
  html[lang="ar"] .glo-mobile-dock__label { font-size:10.5px; }

  .glo-mobile-dock__item[aria-current="page"],
  .glo-mobile-dock__item.is-active {
    color:#fff5d0;
    background:rgba(243,192,24,.075);
  }
  .glo-mobile-dock__item[aria-current="page"]::after,
  .glo-mobile-dock__item.is-active::after {
    content:"";
    position:absolute;
    bottom:3px;
    width:16px;
    height:2px;
    border-radius:99px;
    background:#f3c018;
    box-shadow:0 0 12px rgba(243,192,24,.32);
  }
  .glo-mobile-dock__item:active { transform:scale(.96); }
  .glo-mobile-dock__item:focus-visible { outline:2px solid #f3c018; outline-offset:2px; }

  /* Center GLO Chat: noticeable but still part of the dock, not a floating obstruction. */
  .glo-mobile-dock__chat {
    color:#1c1708;
    background:linear-gradient(145deg,#f8d145,#d9a914);
    border:1px solid rgba(255,231,142,.56);
    box-shadow:0 9px 24px rgba(243,192,24,.13), inset 0 1px 0 rgba(255,255,255,.35);
    transform:translateY(-7px);
    animation:gloDockChatAttention 6.4s cubic-bezier(.22,.8,.26,1) 1.8s infinite;
    overflow:hidden;
  }
  .glo-mobile-dock__chat::before {
    content:"";
    position:absolute;
    inset:-40% -65%;
    background:linear-gradient(105deg, transparent 39%, rgba(255,255,255,.12) 44%, rgba(255,255,255,.62) 50%, rgba(255,255,255,.10) 57%, transparent 63%);
    transform:translateX(-70%);
    animation:gloDockChatShimmer 6.4s ease-in-out 2.1s infinite;
    pointer-events:none;
  }
  .glo-mobile-dock__chat > * { position:relative; z-index:1; }
  .glo-mobile-dock__chat .glo-mobile-dock__label { font-weight:750; }
  .glo-mobile-dock__chat:disabled { opacity:.48; filter:saturate(.45); cursor:default; animation:none; }
  .glo-mobile-dock__chat:disabled::before { animation:none; opacity:0; }
  body.glo-guide-used .glo-mobile-dock__chat,
  body.glo-mobile-chat-open .glo-mobile-dock__chat { animation:none; }
  body.glo-guide-used .glo-mobile-dock__chat::before,
  body.glo-mobile-chat-open .glo-mobile-dock__chat::before { animation:none; opacity:0; }

  /* More sheet */
  .glo-mobile-more {
    position:fixed;
    z-index:999955;
    inset:0;
    display:block;
    pointer-events:none;
    visibility:hidden;
    opacity:0;
    transition:opacity .24s ease, visibility .24s step-end;
  }
  .glo-mobile-more.is-open {
    pointer-events:auto;
    visibility:visible;
    opacity:1;
    transition:opacity .24s ease, visibility 0s;
  }
  .glo-mobile-more__backdrop {
    position:absolute;
    inset:0;
    border:0;
    background:rgba(1,5,7,.48);
    -webkit-backdrop-filter:blur(7px);
    backdrop-filter:blur(7px);
  }
  .glo-mobile-more__sheet {
    position:absolute;
    left:10px;
    right:10px;
    bottom:calc(var(--glo-mobile-dock-h) + 18px + var(--glo-mobile-safe));
    max-height:min(70svh,580px);
    overflow:auto;
    border:1px solid rgba(255,255,255,.115);
    border-radius:26px;
    padding:18px;
    color:#f5f4eb;
    background:
      radial-gradient(90% 80% at 100% 0%, rgba(243,192,24,.075), transparent 55%),
      rgba(7,13,16,.89);
    box-shadow:0 26px 80px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.07);
    -webkit-backdrop-filter:blur(28px) saturate(145%);
    backdrop-filter:blur(28px) saturate(145%);
    transform:translateY(18px) scale(.985);
    transition:transform .28s cubic-bezier(.22,.8,.26,1);
    font-family:Cairo,Manrope,system-ui,sans-serif;
  }
  html[lang="en"] .glo-mobile-more__sheet { font-family:Manrope,Cairo,system-ui,sans-serif; }
  .glo-mobile-more.is-open .glo-mobile-more__sheet { transform:none; }
  .glo-mobile-more__header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px; }
  .glo-mobile-more__header strong { font-size:16px; font-weight:700; }
  .glo-mobile-more__header span { display:block; margin-top:2px; color:rgba(237,240,234,.46); font-size:10px; }
  .glo-mobile-more__close {
    width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
    color:rgba(255,255,255,.72);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);cursor:pointer;
  }
  .glo-mobile-more__close svg { width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round; }
  .glo-mobile-more__grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .glo-mobile-more__link {
    min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:12px 13px;border:1px solid rgba(255,255,255,.075);border-radius:16px;
    color:rgba(246,245,236,.82);background:rgba(255,255,255,.035);text-decoration:none!important;
    font-size:12px;font-weight:600;transition:background .2s,border-color .2s,color .2s,transform .2s;
  }
  .glo-mobile-more__link:active { transform:scale(.98); }
  .glo-mobile-more__link svg { width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;opacity:.7; }
  html[dir="rtl"] .glo-mobile-more__link svg.directional { transform:scaleX(-1); }
  .glo-mobile-more__link--accent { color:#f9e8a9;border-color:rgba(243,192,24,.17);background:rgba(243,192,24,.055); }
  .glo-mobile-more__language { margin-top:8px; grid-column:1/-1; }

  /* Bridge GLO Guide 1.0.2 into the dock on phones. Its original launcher is desktop-only now. */
  #glo-guide-root .glo-guide__launcher { display:none !important; }
  #glo-guide-root .glo-guide {
    position:fixed !important;
    inset:0 !important;
    z-index:1000000 !important;
    width:100% !important;
    height:100% !important;
    pointer-events:none;
  }
  #glo-guide-root .glo-guide__panel {
    position:fixed !important;
    inset:0 !important;
    width:100% !important;
    max-width:none !important;
    height:100dvh !important;
    min-height:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:
      radial-gradient(110% 70% at 100% 0%, rgba(243,192,24,.09), transparent 48%),
      radial-gradient(90% 80% at 0% 100%, rgba(44,91,99,.14), transparent 55%),
      rgba(5,10,13,.965) !important;
    box-shadow:none !important;
    pointer-events:auto;
    padding-top:env(safe-area-inset-top,0px);
    padding-bottom:env(safe-area-inset-bottom,0px);
    animation:gloMobileChatIn .28s cubic-bezier(.22,.8,.26,1) both !important;
  }
  #glo-guide-root .glo-guide__header {
    min-height:72px !important;
    padding:14px 18px !important;
    background:rgba(5,10,13,.38);
    border-bottom-color:rgba(255,255,255,.075) !important;
  }
  #glo-guide-root .glo-guide__headcopy strong { font-size:16px !important; }
  #glo-guide-root .glo-guide__headcopy small { font-size:11px !important; }
  #glo-guide-root .glo-guide__body { min-height:0; }
  #glo-guide-root .glo-guide__messages { padding:20px 16px 14px !important; }
  #glo-guide-root .glo-guide__message { max-width:90% !important; }
  #glo-guide-root .glo-guide__message-content { font-size:13.5px !important; line-height:1.78 !important; }
  #glo-guide-root .glo-guide__quick { padding:7px 16px 16px !important; gap:8px !important; }
  #glo-guide-root .glo-guide__quick button { min-height:38px !important; padding:8px 12px !important; font-size:11px !important; }
  #glo-guide-root .glo-guide__composer-wrap {
    padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px)) !important;
    background:rgba(3,7,9,.64) !important;
    -webkit-backdrop-filter:blur(16px);
    backdrop-filter:blur(16px);
  }
  #glo-guide-root .glo-guide__composer { border-radius:18px !important; }
  #glo-guide-root .glo-guide__composer textarea { font-size:16px !important; } /* avoids iOS zoom */

  body.glo-mobile-chat-open .glo-mobile-dock,
  body.glo-mobile-more-open .glo-mobile-dock { }
  body.glo-mobile-chat-open .glo-mobile-dock {
    transform:translateY(calc(120% + var(--glo-mobile-safe)));
    opacity:0;
    pointer-events:none;
  }

  html.glo-mobile-overlay-lock,
  body.glo-mobile-overlay-lock { overflow:hidden !important; overscroll-behavior:none; }

  @keyframes gloDockChatAttention {
    0%,72%,100% { transform:translateY(-7px) scale(1); box-shadow:0 9px 24px rgba(243,192,24,.13), inset 0 1px 0 rgba(255,255,255,.35); }
    78% { transform:translateY(-9px) scale(1.035); box-shadow:0 12px 31px rgba(243,192,24,.23), 0 0 0 5px rgba(243,192,24,.045), inset 0 1px 0 rgba(255,255,255,.4); }
    85% { transform:translateY(-7px) scale(1); }
  }
  @keyframes gloDockChatShimmer {
    0%,69% { transform:translateX(-70%); opacity:0; }
    74% { opacity:1; }
    84% { transform:translateX(70%); opacity:.82; }
    88%,100% { transform:translateX(70%); opacity:0; }
  }
  @keyframes gloMobileChatIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
}

@media (max-width:380px) {
  .glo-mobile-dock { left:7px; right:7px; padding:5px 3px; border-radius:22px; }
  .glo-mobile-dock__label { font-size:9px; }
  html[lang="ar"] .glo-mobile-dock__label { font-size:9.5px; }
  .glo-mobile-dock__item svg { width:19px; height:19px; }
  .glo-mobile-more__sheet { left:7px; right:7px; padding:15px; }
}

@media (max-width:767px) and (prefers-reduced-motion:reduce) {
  .glo-mobile-dock__chat,
  .glo-mobile-dock__chat::before,
  .glo-mobile-dock,
  .glo-mobile-more,
  .glo-mobile-more__sheet,
  #glo-guide-root .glo-guide__panel { animation:none !important; transition-duration:.01ms !important; }
}

/* GLO 1.3.0 — adaptive display-quality controls and non-blocking performance notice. */
@media (max-width:767px) {
  .glo-mobile-quality{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
  .glo-mobile-quality__heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px;color:rgba(246,245,236,.82);font-size:11px;font-weight:700}
  .glo-mobile-quality__heading small{color:rgba(237,240,234,.46);font-size:9px;font-weight:600}
  .glo-mobile-quality__options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .glo-mobile-quality__options button{min-height:38px;padding:7px 6px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.03);color:rgba(246,245,236,.66);font:600 10px/1.35 Cairo,Manrope,system-ui,sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .18s,border-color .18s,color .18s,transform .18s}
  html[lang="en"] .glo-mobile-quality__options button{font-family:Manrope,Cairo,system-ui,sans-serif}
  .glo-mobile-quality__options button:active{transform:scale(.98)}
  .glo-mobile-quality__options button.is-active,.glo-mobile-quality__options button[aria-pressed="true"]{color:#fff1b7;background:rgba(243,192,24,.075);border-color:rgba(243,192,24,.24)}
  .glo-performance-toast{position:fixed;z-index:1000010;left:50%;bottom:calc(var(--glo-mobile-dock-h) + 28px + var(--glo-mobile-safe));width:min(390px,calc(100% - 28px));display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid rgba(255,255,255,.11);border-radius:16px;background:rgba(7,13,16,.94);box-shadow:0 18px 52px rgba(0,0,0,.38);color:rgba(246,247,242,.82);font:600 11px/1.55 Cairo,Manrope,system-ui,sans-serif;transform:translate(-50%,10px);opacity:0;pointer-events:none;transition:opacity .24s ease,transform .24s ease}
  html[lang="en"] .glo-performance-toast{font-family:Manrope,Cairo,system-ui,sans-serif}
  .glo-performance-toast.is-visible{opacity:1;transform:translate(-50%,0);pointer-events:auto}
  .glo-performance-toast button{flex:none;border:0;border-radius:999px;padding:7px 10px;background:rgba(243,192,24,.1);color:#f3d769;font:700 10px/1 Cairo,Manrope,system-ui,sans-serif;cursor:pointer}
  html[data-glo-performance-tier="performance"] .glo-mobile-dock,
  html[data-glo-performance-tier="performance"] .glo-mobile-more__sheet,
  html[data-glo-performance-tier="performance"] .glo-mobile-more__backdrop{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  html[data-glo-performance-tier="performance"] .glo-mobile-dock__chat{animation:none}
  html[data-glo-performance-tier="performance"] .glo-mobile-dock__chat::before{animation:none;opacity:0}
}
@media(prefers-reduced-motion:reduce){.glo-performance-toast,.glo-mobile-quality__options button{transition:none!important}}
