/* --- consolidated from styles/36-price-screen-mobile-one-row-fullwidth.css --- */
/* TAIF V5 — Mobile Price Screen One Row Full Width V2
   Patch over ONE-ROW-V1: use full available width on mobile price rows. */

@media (max-width: 860px){
  body.taif-mobile-mode .panel[data-view="price-screen"]{
    overflow:hidden !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:2px 0 6px !important;
    gap:3px !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }

  /* Bleed the table softly into the panel edges so no large unused left space remains. */
  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__board-body,
  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__list{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    justify-items:stretch !important;
    align-items:stretch !important;
    width:calc(100% + 8px) !important;
    max-width:calc(100% + 8px) !important;
    min-width:0 !important;
    margin-inline:-4px !important;
    padding:0 2px !important;
    gap:3px !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__row{
    display:grid !important;
    grid-template-columns:
      minmax(36px,.56fr)
      minmax(74px,1.50fr)
      minmax(44px,.72fr)
      minmax(25px,.34fr)
      minmax(44px,.72fr)
      minmax(44px,.72fr)
      minmax(25px,.34fr)
      minmax(44px,.72fr) !important;
    width:100% !important;
    inline-size:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    justify-self:stretch !important;
    align-self:stretch !important;
    min-height:40px !important;
    padding:2px !important;
    gap:2px !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__row > *{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__name{
    padding-inline:4px !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__name-main{
    width:100% !important;
    max-width:100% !important;
    font-size:10.5px !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__code,
  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__num{
    font-size:10.2px !important;
  }
}

@media (max-width: 430px){
  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen{
    padding:1px 0 6px !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__board-body,
  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__list{
    width:calc(100% + 10px) !important;
    max-width:calc(100% + 10px) !important;
    margin-inline:-5px !important;
    padding:0 1px !important;
    gap:2px !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__row{
    grid-template-columns:
      minmax(34px,.56fr)
      minmax(68px,1.45fr)
      minmax(41px,.70fr)
      minmax(23px,.32fr)
      minmax(41px,.70fr)
      minmax(41px,.70fr)
      minmax(23px,.32fr)
      minmax(41px,.70fr) !important;
    min-height:37px !important;
    padding:2px 1px !important;
    gap:2px !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__row > *{
    height:31px !important;
    min-height:31px !important;
    max-height:31px !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__name-main{
    font-size:9.7px !important;
  }

  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__code,
  body.taif-mobile-mode .panel[data-view="price-screen"] .price-screen__num{
    font-size:9.4px !important;
  }
}
