/*
 * GNSCO365-QMS V138-R10
 * Actual domain rail label centering
 *
 * Targets the component visible in the screenshot:
 *   .qms-domain-rail
 *   .qms-domain-link
 *   .qms-domain-link-icon
 *   .qms-domain-link-label
 *
 * The icon remains on the left rail while the text is centered against the
 * full navigation row, not aligned to the far edge.
 */

@media (min-width: 993px) {
  /* Expanded rail: normal expanded state. */
  body:not(.login-body):not(.qms-rail-collapsed) .qms-domain-link,
  /* Collapsed rail temporarily expanded on hover. */
  body.qms-rail-collapsed.qms-rail-hover-expanded:not(.login-body) .qms-domain-link,
  /* Drawer/open state where full labels are visible. */
  body.qms-rail-drawer-open:not(.login-body) .qms-domain-link {
    box-sizing: border-box !important;
    justify-content: center !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
    position: relative !important;
    width: 100% !important;
  }

  body:not(.login-body):not(.qms-rail-collapsed) .qms-domain-link > .qms-domain-link-icon,
  body.qms-rail-collapsed.qms-rail-hover-expanded:not(.login-body) .qms-domain-link > .qms-domain-link-icon,
  body.qms-rail-drawer-open:not(.login-body) .qms-domain-link > .qms-domain-link-icon {
    left: 8px !important;
    margin: 0 !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  body:not(.login-body):not(.qms-rail-collapsed) .qms-domain-link > .qms-domain-link-label,
  body.qms-rail-collapsed.qms-rail-hover-expanded:not(.login-body) .qms-domain-link > .qms-domain-link-label,
  body.qms-rail-drawer-open:not(.login-body) .qms-domain-link > .qms-domain-link-label {
    display: block !important;
    flex: 1 1 auto !important;
    margin: 0 auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    width: 100% !important;
  }

  /* Center the Workspaces heading too, while keeping the collapse control at the edge. */
  body:not(.login-body):not(.qms-rail-collapsed) .qms-domain-rail-head,
  body.qms-rail-collapsed.qms-rail-hover-expanded:not(.login-body) .qms-domain-rail-head,
  body.qms-rail-drawer-open:not(.login-body) .qms-domain-rail-head {
    box-sizing: border-box !important;
    justify-content: center !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
    position: relative !important;
  }

  body:not(.login-body):not(.qms-rail-collapsed) .qms-domain-rail-heading,
  body.qms-rail-collapsed.qms-rail-hover-expanded:not(.login-body) .qms-domain-rail-heading,
  body.qms-rail-drawer-open:not(.login-body) .qms-domain-rail-heading {
    display: block !important;
    margin: 0 auto !important;
    text-align: center !important;
    width: 100% !important;
  }

  body:not(.login-body):not(.qms-rail-collapsed) .qms-domain-rail-collapse,
  body.qms-rail-collapsed.qms-rail-hover-expanded:not(.login-body) .qms-domain-rail-collapse,
  body.qms-rail-drawer-open:not(.login-body) .qms-domain-rail-collapse {
    margin: 0 !important;
    position: absolute !important;
    right: 2px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  /* The bottom Browse button text already uses a centered flex row; make it explicit. */
  body:not(.login-body) .qms-domain-browse-all {
    justify-content: center !important;
    text-align: center !important;
  }

  body:not(.login-body) .qms-domain-browse-all > span {
    text-align: center !important;
  }
}

/* Mobile/drawer: center labels without changing the icon column. */
@media (max-width: 992px) {
  body.qms-rail-drawer-open:not(.login-body) .qms-domain-link {
    box-sizing: border-box !important;
    justify-content: center !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
    position: relative !important;
  }

  body.qms-rail-drawer-open:not(.login-body) .qms-domain-link > .qms-domain-link-icon {
    left: 8px !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  body.qms-rail-drawer-open:not(.login-body) .qms-domain-link > .qms-domain-link-label {
    display: block !important;
    text-align: center !important;
    width: 100% !important;
  }
}