/* JDA Capital: mobile layout repairs (docs/JDA-MOBILE-AUDIT.md).
   Loaded by Views/Shared/_Layout.cshtml after the page stylesheet. The design's per-page files
   (assets/css/pages/*.css) are kept verbatim and most of them carry no phone rules: their fixed grids, flex rows and
   three-up carousels keep desktop widths on a phone and .jda-page{overflow-x:clip} then hides the overflow.
   Everything here applies below 720px (phones) unless noted; desktop and tablet rendering is unchanged. */

/* ---- all widths: safety nets ------------------------------------------------------------------------------- */
main img,main video,main iframe{max-width:100%}
main [id]{scroll-margin-top:112px}                         /* sticky header: in-page anchors land below it */
main ::placeholder{color:#5f6b7a;opacity:1}                /* 5.3:1 on the form background (was 4.3:1) */
.jd-hero .eyebrow,.jb-hero .eyebrow,.section-hero .eyebrow{color:#196a42} /* 5.1:1 on the grey hero band */
/* tables: assets/js/jda-site.js wraps every table in main that is not already in a scroll box */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.tbl-scroll>table.cmp{display:table;overflow:visible}
.tbl-hint{margin:6px 0 0;font:500 12px/16px var(--font-body);color:var(--text-muted);display:none}
.tbl-hint::before{content:"\2194\00a0"}
.is-scroll+.tbl-hint{display:block}
.jb-menu{min-height:44px}
.jb-menu[aria-expanded="true"]{background:var(--navy);color:var(--white)}

@media (max-width:720px){
  /* ---- type and chrome ------------------------------------------------------------------------------------ */
  body{font-size:16px;line-height:26px}
  main input:not([type=checkbox]):not([type=radio]),main select,main textarea{font-size:16px} /* no iOS zoom on focus */
  main input[type=checkbox],main input[type=radio]{width:22px;height:22px}
  .jda-logo-img{height:36px}
  .jd-head .jda-container{min-height:64px}
  .section-hero__crumb a,.crumbs a{display:inline-block;padding:6px 0}
  footer li a{display:inline-block;padding:4px 0}
  main table{display:block;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch} /* no-JS fallback */
  .tbl-scroll>table,.tx-w>table{display:table}

  /* ---- generic CTA bars and split cards ----------------------------------------------------------------- */
  .pc-bar,.obx-f,.rr-b,.rl-s,.b1-in,.b2-card,.sc-card,.oa-r{flex-direction:column;align-items:flex-start;flex-wrap:wrap}
  .rr-a,.rl-k{justify-content:flex-start}

  /* ---- contact-us ------------------------------------------------------------------------------------------ */
  .oc{grid-template-columns:1fr}
  .oc dl{grid-template-columns:96px minmax(0,1fr)}
  .sc-card{display:grid;grid-template-columns:1fr}
  .sc-l,.sc-r{padding:var(--space-6)}

  /* ---- download --------------------------------------------------------------------------------------------- */
  .dgl{grid-template-columns:1fr!important}
  .dgl .row{grid-template-columns:48px minmax(0,1fr)!important;row-gap:6px}
  .dgl .row>a{grid-column:2}
  .ad-g,.ad-t,.ad-m{grid-template-columns:1fr}
  .fbar2 input,.fbar2 select{min-width:0;width:100%}

  /* ---- policies --------------------------------------------------------------------------------------------- */
  .pt,.fw-g{grid-template-columns:1fr}
  .fw-c{padding:var(--space-6)}

  /* ---- investors -------------------------------------------------------------------------------------------- */
  .rs-g,.ii-g,.ii-t,.ri-g{grid-template-columns:1fr}
  .ri-t li{grid-template-columns:48px minmax(0,1fr)}
  .ri-t li>:nth-child(n+3){grid-column:2}
  .ri-t li b{white-space:normal;overflow-wrap:anywhere}

  /* ---- capital-raising -------------------------------------------------------------------------------------- */
  .pc-s .pc-top,.pc-r,.tm-pn,.tm-l{grid-template-columns:1fr}
  .tm-pn{padding:var(--space-6)}
  .sp .xgrid.x7,.sp .tk{grid-template-columns:1fr!important}

  /* ---- further-issues --------------------------------------------------------------------------------------- */
  .fi-tabs,.fi-st{flex-wrap:wrap}
  .fi-st label{flex:1 1 45%}
  .fi-sec .section-tabs__cols,.fi-sp,.fr-g,.fr-t{grid-template-columns:1fr}
  .fi-l .tk{grid-template-columns:1fr!important}
  .fi-rt{align-items:flex-start}

  /* ---- online-trading --------------------------------------------------------------------------------------- */
  .obx-l{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pax-g,.pax-t{grid-template-columns:1fr}

  /* ---- corporate-advisory ----------------------------------------------------------------------------------- */
  .cf-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cf-p,.hb-c{grid-template-columns:minmax(0,1fr)}
  .cf-btn{white-space:normal}
  .cf-r{align-items:flex-start}
  .mt-g li{flex:0 0 100%}

  /* ---- complaint-status, prospectus, business-partner, sitemap --------------------------------------------- */
  .fk{grid-template-columns:1fr}
  .dt-g,.wq-g,.wq-t,.sm{grid-template-columns:1fr}
  .dt-t{grid-template-columns:1fr;grid-auto-flow:row;grid-template-rows:none}

  /* ---- mergers-acquisitions --------------------------------------------------------------------------------- */
  .ma-top,.ma-t,.sf-g,.sf-r,.sd-cols,.sd-sc,.pr-g{grid-template-columns:1fr}
  .pr-sub .xgrid{grid-template-columns:1fr}
  .tlh{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vs-c{flex:0 0 100%}
  #vsr1:checked~.vs .vs-track{transform:translateX(0)}
  #vsr2:checked~.vs .vs-track{transform:translateX(calc(-1*(100% + var(--space-6))))}
  #vsr3:checked~.vs .vs-track{transform:translateX(calc(-2*(100% + var(--space-6))))}
  #vsr4:checked~.vs .vs-track{transform:translateX(calc(-3*(100% + var(--space-6))))}
  #vsr5:checked~.vs .vs-track{transform:translateX(calc(-4*(100% + var(--space-6))))}
  #vsr6:checked~.vs .vs-track{transform:translateX(calc(-5*(100% + var(--space-6))))}

  /* ---- demat ------------------------------------------------------------------------------------------------ */
  .dq-g{grid-template-columns:1fr}
  .dv-c{flex:0 0 100%}
  #dsr1:checked~.dv .dv-track{transform:translateX(0)}
  #dsr2:checked~.dv .dv-track{transform:translateX(calc(-1*(100% + var(--space-6))))}
  #dsr3:checked~.dv .dv-track{transform:translateX(calc(-2*(100% + var(--space-6))))}
  #dsr4:checked~.dv .dv-track{transform:translateX(calc(-3*(100% + var(--space-6))))}
  #dsr5:checked~.dv .dv-track{transform:translateX(calc(-4*(100% + var(--space-6))))}

  /* ---- main-board-ipo --------------------------------------------------------------------------------------- */
  .f7g,.p7g,.kt{grid-template-columns:1fr}
}

/* ---- footer registrations: one column on narrow phones, identifiers unbroken ------------------------------- */
@media (max-width:480px){
  .jd-fd{grid-template-columns:1fr}
  .jd-fd dd{overflow-wrap:normal}
}

/* ---- landscape phones: the header is a quarter of the height, so it stops being sticky ---------------------- */
@media (max-height:500px) and (max-width:1100px){
  .jd-head{position:static}
}