/* ==========================================================================
   v1.2.0-fix402 r5
   Headquarters home + company analytics responsive presentation.

   Presentation only. Analytics values, API, CSV, period and sorting logic are
   intentionally untouched.
   ========================================================================== */

.fix402-r5-headquarters-features{
  margin:20px 0 24px;
}

.fix402-r5-feature-card .store-ui-icon{
  pointer-events:none;
}

/* Desktop headquarters navigation: use the available PC width instead of a
   scroll strip. Never clip the menu with overflow:hidden. */
@media (min-width:1181px){
  .store-admin-body .headquarters-topbar .wrap{
    width:calc(100% - 24px);
    max-width:1360px;
  }

  .store-admin-body .headquarters-topbar .headquarters-navigation{
    gap:6px;
    overflow-x:visible;
    overscroll-behavior-x:auto;
    scrollbar-width:none;
  }

  .store-admin-body .headquarters-topbar .headquarters-navigation::-webkit-scrollbar{
    display:none;
  }

  .store-admin-body .headquarters-topbar .headquarters-navigation .headquarters-nav-button{
    flex:1 1 auto;
    min-width:0;
    min-height:40px;
    padding-left:9px;
    padding-right:9px;
    font-size:clamp(11px,.78vw,13px);
    white-space:nowrap;
  }
}

/* Tablet / narrow desktop: use the existing permission-aware headquarters
   drawer instead of preserving the legacy horizontal-scroll navigation. */
@media (min-width:761px) and (max-width:1180px){
  .store-admin-body .headquarters-topbar .wrap{
    width:calc(100% - 24px);
    max-width:1180px;
    grid-template-columns:155px minmax(0,1fr) auto!important;
    grid-template-rows:auto!important;
    column-gap:14px!important;
    row-gap:0!important;
    align-items:center!important;
    min-height:68px!important;
    padding-top:8px!important;
    padding-bottom:8px!important;
  }

  .store-admin-body .headquarters-topbar .wrap::before{
    grid-column:1!important;
    grid-row:1!important;
    width:155px!important;
    height:50px!important;
    min-width:155px!important;
    flex-basis:155px!important;
  }

  .store-admin-body .headquarters-topbar .headquarters-heading{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
  }

  .store-admin-body .headquarters-topbar .wrap>.headquarters-session-actions,
  .store-admin-body .headquarters-topbar .wrap>.headquarters-navigation{
    display:none!important;
  }

  .store-admin-body .headquarters-topbar .fix316-headquarters-menu-toggle{
    grid-column:3!important;
    grid-row:1!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:104px!important;
    max-width:none!important;
    min-height:44px!important;
    margin:0!important;
    padding:8px 12px!important;
    white-space:nowrap!important;
    font-size:14px!important;
    line-height:1!important;
  }
}

/* Company analytics: true mobile reflow, not a scaled/scrollable PC canvas. */
@media (max-width:760px){
  .store-admin-body main.company-analytics-page{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }

  .company-analytics-page > *,
  .company-analytics-filter,
  .company-analytics-summary,
  .company-analytics-overview,
  .company-trend-card,
  .company-channel-card,
  .company-comparison-table,
  .company-product-ranking{
    min-width:0;
    max-width:100%;
    box-sizing:border-box;
  }

  .company-analytics-filter-grid{
    grid-template-columns:1fr;
    align-items:stretch;
  }

  .company-analytics-filter-grid label:first-child,
  .company-analytics-filter-grid .btn{
    grid-column:auto;
  }

  .company-analytics-filter-grid label,
  .company-analytics-filter-grid .input,
  .company-analytics-filter-grid .btn{
    width:100%;
    min-width:0;
  }

  .company-analytics-summary{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }

  .company-analytics-stat{
    min-width:0;
    padding:13px;
  }

  .company-analytics-stat>b{
    overflow-wrap:anywhere;
  }

  .company-analytics-overview{
    width:100%;
    grid-template-columns:1fr;
  }

  .company-trend-card,
  .company-channel-card{
    width:100%;
  }

  .company-trend-card{
    overflow:visible;
    padding:13px 10px 11px;
  }

  .company-trend-chart{
    width:100%;
    max-width:100%;
    min-width:0;
    height:215px;
    gap:2px;
    overflow:visible;
  }

  .company-trend-column{
    width:0;
    min-width:0;
    flex:1 1 0;
    grid-template-rows:18px 168px 18px;
  }

  .company-trend-column>span,
  .company-trend-column>b{
    display:none;
  }

  .company-trend-column:first-child>b,
  .company-trend-column:last-child>b{
    display:block;
    max-width:none;
    overflow:visible;
    font-size:8px;
    white-space:nowrap;
  }

  .company-trend-column:first-child>b{
    justify-self:start;
  }

  .company-trend-column:last-child>b{
    justify-self:end;
  }

  .company-trend-column>div{
    width:100%;
    min-width:0;
  }

  .company-trend-column i{
    width:min(72%,22px);
  }

  .company-channel-card .company-dashboard-heading{
    width:100%;
  }

  .company-channel-legend>div{
    grid-template-columns:auto minmax(0,1fr) auto;
    min-width:0;
  }

  .company-channel-legend b,
  .company-channel-legend small{
    min-width:0;
  }

  .company-sort-select{
    width:100%;
    grid-template-columns:1fr;
    align-items:stretch;
  }

  .company-sort-select .input{
    width:100%;
    min-width:0;
  }

  /* Store comparison becomes a card list on mobile. The same sorted source
     rows and values are reused; only their layout changes. */
  .company-comparison-table{
    display:grid;
    gap:10px;
    width:100%;
    border:0;
    border-radius:0;
    background:transparent;
    overflow:visible;
  }

  .company-comparison-head{
    display:none;
  }

  .company-comparison-row{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    width:100%;
    min-width:0;
    padding:13px;
    border:1px solid var(--line);
    border-radius:15px;
    background:#fff;
  }

  .company-comparison-row.inactive{
    opacity:.65;
  }

  .company-comparison-store{
    grid-column:1/-1;
    grid-template-columns:28px 42px minmax(0,1fr);
    width:100%;
    min-width:0;
    padding-bottom:4px;
    border-bottom:1px solid var(--line);
  }

  .company-comparison-store b{
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .company-comparison-row>strong,
  .company-comparison-row>span{
    display:grid;
    align-content:start;
    gap:3px;
    min-width:0;
    padding:9px;
    border-radius:10px;
    background:#f6f6f3;
    font-size:13px;
    line-height:1.45;
    overflow-wrap:anywhere;
  }

  .company-comparison-row>strong::before,
  .company-comparison-row>span::before{
    color:var(--muted);
    font-size:10px;
    font-weight:900;
    line-height:1.2;
  }

  .company-comparison-row>strong:nth-child(2)::before{content:'総売上'}
  .company-comparison-row>span:nth-child(3)::before{content:'売上内訳'}
  .company-comparison-row>span:nth-child(4)::before{content:'会計'}
  .company-comparison-row>span:nth-child(5)::before{content:'平均会計'}
  .company-comparison-row>span:nth-child(6)::before{content:'予約'}

  .company-comparison-row>strong .company-analytics-change{
    width:max-content;
    max-width:100%;
  }

  .company-comparison-row>.state-btn{
    grid-column:1/-1;
    width:100%;
    min-width:0;
  }

  .company-product-ranking{
    width:100%;
    padding-left:12px;
    padding-right:12px;
  }

  .company-product-ranking>div{
    width:100%;
    min-width:0;
  }

  .company-product-ranking>div>span:nth-child(2),
  .company-product-ranking>div>span:nth-child(2)>b,
  .company-product-ranking strong{
    min-width:0;
    overflow-wrap:anywhere;
  }
}

@media (max-width:430px){
  .company-comparison-row{
    grid-template-columns:1fr;
  }

  .company-comparison-store,
  .company-comparison-row>.state-btn{
    grid-column:1;
  }
}

@media (max-width:390px){
  .company-analytics-summary{
    grid-template-columns:1fr;
  }
}