/*
 * CUSTOMER-WORKSPACE-R1A
 *
 * Scoped entirely to a semantic customer-detail modal marked by
 * the additive JS layer.
 */

.modal.astra-customer-workspace-r1a{
  width:min(
    1380px,
    calc(100vw - 32px)
  );
  max-width:none;
  min-width:min(
    860px,
    calc(100vw - 32px)
  );
  max-height:calc(100vh - 28px);
  resize:horizontal;
  overflow:auto;
  position:relative;
}

/*
 * Use the available horizontal workspace instead of forcing
 * operator content through a narrow 760px column.
 */

.astra-customer-workspace-r1a
.grid.two{
  gap:18px;
}

.astra-customer-workspace-r1a
.customer-lifecycle-panel{
  display:grid;
  grid-template-columns:
    minmax(280px,1fr)
    auto;
  align-items:center;
  gap:10px 18px;
  padding:13px 15px;
}

.astra-customer-workspace-r1a
.customer-lifecycle-panel
.toolbar{
  justify-content:flex-end;
  flex-wrap:wrap;
}

.astra-customer-workspace-r1a
.customer-lifecycle-panel
.lifecycle-permission-note{
  grid-column:1 / -1;
}

/*
 * Service operational workspace.
 *
 * React DOM nodes are not moved.
 * CSS Grid positions existing direct children only.
 */

.astra-customer-workspace-r1a
.acw-services-list{
  display:grid;
  gap:14px;
}

.astra-customer-workspace-r1a
.acw-services-list
>
.acw-service-row{
  display:grid;
  grid-template-columns:
    minmax(360px,.82fr)
    minmax(520px,1.18fr);
  column-gap:14px;
  row-gap:11px;
  align-items:start;
  padding:15px;
}

.astra-customer-workspace-r1a
.acw-services-list
>
.acw-service-row
>
.split{
  grid-column:1 / -1;
  margin:0;
}

.astra-customer-workspace-r1a
.acw-services-list
>
.acw-service-row
>
.grid.three{
  grid-column:1 / -1;
  margin-top:0!important;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(148,163,184,.045);
}

/*
 * Left: authoritative network/quota status.
 * Right: accepted R14B passive Live Speed monitor.
 */

.astra-customer-workspace-r1a
.acw-services-list
>
.acw-service-row
>
.live-service-panel{
  grid-column:1;
  margin:0;
  align-self:stretch;
}

.astra-customer-workspace-r1a
.acw-services-list
>
.acw-service-row
>
.astra-live-speed-r14b{
  grid-column:2;
  margin-top:0;
  align-self:start;
}

/*
 * Give network/quota metrics enough horizontal room.
 */

.astra-customer-workspace-r1a
.live-subscriber-strip{
  grid-template-columns:
    repeat(
      2,
      minmax(0,1fr)
    );
}

/*
 * Reduce unnecessary vertical whitespace without turning the
 * screen into a dense table.
 */

.astra-customer-workspace-r1a
>
h3{
  margin-top:16px!important;
  margin-bottom:9px;
}

.astra-customer-workspace-r1a
.list-row{
  border-radius:13px;
}

/*
 * Desktop/laptop fallback.
 */

@media(max-width:1180px){
  .modal.astra-customer-workspace-r1a{
    width:calc(100vw - 24px);
    min-width:0;
  }

  .astra-customer-workspace-r1a
  .acw-services-list
  >
  .acw-service-row{
    grid-template-columns:1fr;
  }

  .astra-customer-workspace-r1a
  .acw-services-list
  >
  .acw-service-row
  >
  .split,
  .astra-customer-workspace-r1a
  .acw-services-list
  >
  .acw-service-row
  >
  .grid.three,
  .astra-customer-workspace-r1a
  .acw-services-list
  >
  .acw-service-row
  >
  .live-service-panel,
  .astra-customer-workspace-r1a
  .acw-services-list
  >
  .acw-service-row
  >
  .astra-live-speed-r14b{
    grid-column:1;
  }
}

/*
 * Tablet / mobile: restore natural application stacking.
 */

@media(max-width:980px){
  .modal.astra-customer-workspace-r1a{
    width:100%;
    max-width:100%;
    min-width:0;
    max-height:94vh;
    resize:none;
  }

  .astra-customer-workspace-r1a
  .customer-lifecycle-panel{
    grid-template-columns:1fr;
  }

  .astra-customer-workspace-r1a
  .customer-lifecycle-panel
  .toolbar{
    justify-content:flex-start;
  }

  .astra-customer-workspace-r1a
  .customer-lifecycle-panel
  .lifecycle-permission-note{
    grid-column:1;
  }
}

@media(max-width:700px){
  .astra-customer-workspace-r1a
  .grid.two{
    grid-template-columns:1fr;
  }

  .astra-customer-workspace-r1a
  .live-subscriber-strip{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }
}
