/* Respondo AI – iPhone app polish, v4 (2026-10-09).
   Scoped entirely to /app and /assistant; leaves embedded customer bots alone.
   Readable navigation: four primary sections + a real accessible More sheet. */
@media screen and (max-width:760px){
  #app .dashboard-premium-shell .dashboard-simple-main{
    padding-inline:clamp(12px,3.8vw,19px)!important;
    padding-bottom:calc(114px + env(safe-area-inset-bottom))!important;
  }
  #app .dashboard-premium-shell .dashboard-head h1{
    font-size:clamp(31px,8.1vw,40px)!important;
    font-weight:770!important;line-height:1.09!important;
    margin:9px 0 9px!important;color:#182136!important;
    letter-spacing:-.052em!important;
  }
  #app .dashboard-premium-shell .dashboard-head p{font-size:13px!important;line-height:1.56!important}
  #app .dashboard-premium-shell .premium-chat-host .live-preview-panel{
    border-radius:26px!important;
    box-shadow:0 19px 54px rgba(28,48,91,.10),0 2px 6px rgba(24,46,83,.025)!important;
    border:1px solid #e6eaf1!important;
    overflow:hidden!important;
  }
  /* The three soft window dots and address treatment carry the reference
     floating-window aesthetic into the actual interactive chat component. */
  #app .dashboard-premium-shell .premium-chat-host .live-preview-panel::before{
    content:"respondoai.fi";
    display:block!important;flex:0 0 39px!important;height:39px!important;
    box-sizing:border-box;padding:0 11px 0 0;text-align:center;
    font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;
    font-size:10px;font-weight:650;letter-spacing:.015em;color:#a2adbd;
    line-height:39px;
    background:
      radial-gradient(circle at 18px 19px,#ff635d 0 4px,transparent 4.5px),
      radial-gradient(circle at 34px 19px,#ffbd48 0 4px,transparent 4.5px),
      radial-gradient(circle at 50px 19px,#46c86c 0 4px,transparent 4.5px),
      linear-gradient(#fff,#fbfcfe);
    border-bottom:1px solid #eff1f6;
  }
  #app .dashboard-premium-shell .premium-chat-host .live-preview-panel>.panel-head{
    padding:18px 19px 15px!important;
    background:#fff!important;
  }
  #app .dashboard-premium-shell .preview-device-top{
    min-height:64px!important;padding:13px 19px!important;
  }
  #app .dashboard-premium-shell .preview-device-top b{
    font-size:14px!important;letter-spacing:-.02em!important;
  }
  #app .dashboard-premium-shell .preview-chat{
    min-height:330px!important;height:clamp(330px,49dvh,470px)!important;
    max-height:490px!important;
    padding:25px 18px!important;
    background:linear-gradient(150deg,#fcfdff 0%,#f2f5fa 100%)!important;
  }
  #app .dashboard-premium-shell .preview-bubble{
    font-size:14px!important;line-height:1.65!important;
    max-width:87%!important;border-radius:19px!important;
    padding:13px 17px!important;
  }
  #app .dashboard-premium-shell .preview-form{
    padding:14px 15px 15px!important;
    grid-template-columns:minmax(0,1fr) 50px!important;
    gap:9px!important;
  }
  #app .dashboard-premium-shell .preview-form input[name="question"]{
    height:53px!important;min-height:53px!important;
    border-radius:16px!important;font-size:16px!important;
  }
  #app .dashboard-premium-shell .preview-form button{
    height:53px!important;min-height:53px!important;width:50px!important;
    border-radius:15px!important;
    background:#1b2944!important;
  }
  /* Real tabbar is not seven illegible 7px labels: keep the seven original
     view buttons in DOM, surface the remaining three through More. */
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar]{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:3px!important;
    min-height:74px!important;height:74px!important;
    padding:7px!important;
    border-radius:23px!important;
    box-shadow:0 13px 50px rgba(32,52,98,.15)!important;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar]>button:nth-of-type(n+5):not(.premium-mobile-more-button){
    display:none!important;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar]>button{
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:center!important;gap:5px!important;
    width:100%!important;max-width:100%!important;min-width:0!important;
    height:58px!important;min-height:58px!important;
    padding:6px 2px!important;font-size:11px!important;
    border-radius:16px!important;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar] .premium-mobile-nav-icon{
    width:24px!important;height:24px!important;flex:0 0 24px!important;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar] .premium-mobile-nav-label{
    white-space:nowrap!important;overflow:visible!important;
    font-size:clamp(9px,2.65vw,11.5px)!important;
    line-height:1.1!important;letter-spacing:-.01em!important;
    font-weight:660!important;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar]>button.premium-mobile-more-button{
    display:flex!important;border:1px solid transparent!important;background:transparent!important;
    color:#6b7891!important;grid-column:5;cursor:pointer;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar]>button.premium-mobile-more-button.active{
    color:#2a4c91!important;background:#edf2fc!important;border-color:#e6ecfa!important;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-layer[hidden]{display:none!important}
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-layer{
    display:grid!important;place-items:end center!important;
    position:fixed!important;inset:0!important;z-index:2147483100!important;
    padding:14px 14px calc(24px + env(safe-area-inset-bottom))!important;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-backdrop{
    position:absolute;inset:0;border:0;background:rgba(15,23,42,.36);
    -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);cursor:pointer;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card{
    position:relative;width:100%;max-width:480px;
    border:1px solid rgba(215,223,235,.8);border-radius:27px;
    padding:22px 20px 19px;background:#fff;
    box-shadow:0 27px 75px rgba(19,35,72,.24);
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card header{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:0 0 17px;margin:0 0 12px;border-bottom:1px solid #edf0f5;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card h2{
    margin:0;color:#1c2944;font-size:21px;letter-spacing:-.04em;line-height:1.2;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card header button{
    width:37px;height:37px;border-radius:50%;border:1px solid #edf0f5;
    background:#f4f6fa;font-size:23px;color:#66748d;cursor:pointer;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card nav{display:grid;gap:7px}
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card nav button{
    display:flex;align-items:center;gap:15px;width:100%;min-height:59px;
    background:#f8faff;border:1px solid #edf0f5;border-radius:14px;
    padding:10px 14px;color:#263754;cursor:pointer;text-align:left;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card nav button>span{
    width:24px;height:24px;display:grid;place-items:center;
    color:#4d6389;flex:0 0 24px;
  }
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card nav button svg{width:22px;height:22px}
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card nav button b{font-size:14px;font-weight:710}
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .premium-mobile-more-card nav button em{
    font-size:25px;margin-left:auto;font-style:normal;color:#9ba7b9;font-weight:300;
  }
  body.premium-more-open{overflow:hidden!important}
  /* Demo header uses two efficient rows, not a tall three-row navbar that
     pushes the product below the fold. Language switch stays visible. */
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar{
    display:grid!important;
    grid-template-columns:36px minmax(93px,1fr) auto!important;
    grid-template-rows:40px 38px!important;
    gap:5px 6px!important;align-items:center!important;
    padding:9px 11px!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar .dashboard-topbar-brand{
    display:flex!important;grid-column:1!important;grid-row:1!important;
    margin:0!important;min-width:0!important;padding:0!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar .premium-language-picker{
    display:flex!important;grid-column:2!important;grid-row:1!important;
    align-items:center!important;justify-content:center!important;min-width:0!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar .app-language-switch{
    display:inline-flex!important;margin:0!important;padding:2px!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar .demo-public-actions{
    display:flex!important;grid-column:3!important;grid-row:1!important;
    min-width:0!important;justify-content:flex-end!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar .demo-section-strip{
    display:flex!important;grid-column:1/-1!important;grid-row:2!important;
    margin:0!important;min-width:0!important;overflow-x:auto!important;
    gap:5px!important;min-height:38px!important;padding:0!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar .demo-section-strip>button{
    min-height:35px!important;font-size:11px!important;flex:0 0 auto!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar.is-condensed{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:40px!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar.is-condensed .dashboard-section-picker{
    display:block!important;grid-column:1!important;grid-row:1!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar.is-condensed .demo-public-actions{
    grid-column:2!important;grid-row:1!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar.is-condensed .premium-language-picker,
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar.is-condensed .demo-section-strip{
    display:none!important;
  }
}
@media screen and (max-width:375px){
  #app .dashboard-premium-shell:not(.demo-dashboard-shell) .ios-workspace-tabs[data-premium-tabbar] .premium-mobile-nav-label{
    font-size:9px!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-sticky-topbar{
    grid-template-columns:31px minmax(100px,1fr) auto!important;
    padding-inline:8px!important;
  }
  #app .dashboard-premium-shell.demo-dashboard-shell .demo-header-trial{
    padding-inline:8px!important;font-size:10px!important;
  }
}
