/*.container-inner, .actualNode, .interactions-component, .interactions-region ,.interactions-element{
  height: 100%;
}*/

/*layout style*/

/*container for all info on page - top level page */
.hidden{
  display:none !important;
}
.container {
  padding: 40px 0;
}

/*container for all info on page - inner level page */
.container-inner {
  padding: 0;
}

.container-home {
  padding: 40px 0 0 0;
}

.content-wrap {
  max-width: 1056px;
  margin: 0 auto;

}
@media only screen and (max-width: 1056px) {
  
.content-wrap {
  padding: 0 32px;
}
}

.content-wrap.wide {
  max-width: 100%;
}

.content-bottom {
  padding: 32px 0;
  background: #f5f5f5;
  height: 100%;
}

.content-top {
  max-width: 1256px;
  margin: 0 auto;
  padding: 24px 0;
}

.content-centered {
  padding: 24px 0;
  max-width: 1256px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
}

.info-container {
  width: 100%;
  padding: 0 32px;
}

.section {
  margin-bottom: 40px;
}

/*general  style to override default*/

.ul {
  list-style: none;
}

/*text font  styles*/
p {
  color: rgba(0, 0, 0, 0.87);
}

/* flex */
.flex { display: flex;; }
.flex-1	{ flex: 1 1 0%; }
.flex-2	{ flex: 2 2 0%; }
.flex-3	{ flex: 3 3 0%; }
.flex-4	{ flex: 4 4 0%; }
.flex-auto { flex: 1 1 auto; }
.flex-initial	{ flex: 0 1 auto; }
.flex-none { flex: none; }
.flex-row { flex-direction: row; }
.flex-col { flex-direction: column; }
.justify-between { justify-content: space-between; }
.items-center { align-items: center; }

/* gap */
.gap-4 { gap:4px;}
.gap-8 { gap:8px;}
.gap-16 { gap:16px;}
.gap-32 { gap:32x;}

/* margin */
.mt-4 { margin-top: 4px; }
.mt-8 { margin-top: 8px; }
.mt-16 { margin-top: 16px; }
.mb-4 { margin-bottom: 4px; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }

.pagetitle-top-wrap {
  max-width: 1056px;
  margin: 0 auto;
  display: flex;
  padding-bottom: 32px;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 24px;
}

.pagetitle-wrap {
  max-width: 1056px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  gap: 4px;
  margin-bottom: 24px;
  flex-direction: column;
  gap: 4px;
}

.pagetitle-wrap.center {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.page-title {
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));
  font-family: "Noto Sans JP";
  font-size: 32px;
  font-weight: 800;
  line-height: normal;
}

.page-discription {
  color: rgba(0, 0, 0, 0.60);
  font-size: 16px;
}
.page-text{
    color: rgba(0, 0, 0, 0.87);
  font-size: 14px;
}



.section-title,

.info-title {
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.section-title {
  color: rgba(0, 0, 0, 0.87);
  font-size: 24px;
}

.section-title-wrap {
  margin-bottom: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.title-wrap {
  margin-bottom: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}


.section-title-inner {
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  color: rgba(0, 0, 0, 0.87);
  font-size: 24px;
  margin-bottom: 16px;
}

.card-title {
  color: var(--alpha-black-87, rgba(6, 2, 19, 0.87));
  font-family: "Noto Sans JP";
  font-size: 16px;
margin-bottom: 0 !important;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.card-title.lg {
  font-size: 20px;
}

.info-title {
  color: rgba(0, 0, 0, 0.87);
  font-size: 16px;
}
.info-title.sm {
  color: rgba(0, 0, 0, 0.87);
  font-size: 14px;
  font-weight: 800;
}

.data-discription {
  color: rgba(0, 0, 0, 0.60);
  font-size: 12px;
}
.section-discription {
  color: rgba(0, 0, 0, 0.60);
  font-size: 14px;
}




/*breadcrumbs*/

.lower-step {
  font-size: 12px;
  font-weight: 500;
  color: var(--alpha-black-60, rgba(0, 0, 0, 0.60)) !important;
}

.current-step {
  font-size: 12px;
  font-weight: 500;
  color: var(--alpha-black-60, rgba(0, 0, 0, 0.87)) !important;
}

.breadcrumbs img {
  width: 16px;
  height: 16px;
}

/*cards  style*/
.card {
  border-radius: 8px;
  padding: 16px;
  background-color: #F5F5F5;
}

.card.big {
  padding: 24px;
}

.card.white {
  background-color: #fff;
}

.card.border {
  border: 1px solid var(--Neutral-200, #E0E0E0);
  background-color: #fff ;
}

.card-action {
  border-radius: 8px;
  padding: 16px;
  border: 1px solid var(--Neutral-200, #E0E0E0);
  background: #fff !important;
  text-decoration: none!important;
  color: rgba(0, 0, 0, 0.87)!important;
}

.card-action:hover {
background: var(--Neutral-150, #EBEBEB)!important;
text-decoration: none!important;
color: rgba(0, 0, 0, 0.87)!important;
}



/*alignment  style*/
.default-alignment {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.central-alignment{
  display: flex;

      flex-direction: column;
      align-items: center;
}
.horizontal-alignment {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.horizontal-alignment.left{
  gap: 4px;
  justify-content: flex-start;
} 

.vertical-alignment {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  gap: 4px;
}

.align-wrap {
  display: flex;
  align-items: stretch;
  align-content: flex-start;
  gap: 24px;
  align-self: stretch;
  flex-wrap: wrap;
}

.info-horizontal {
  display: flex;
  gap: 16px;
  width: 100%;
}
.info-horizontal.spacebetween {
justify-content: space-between;
}

.info-horizontal .label {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.60);
  min-width: 200px;
}
.user-info-card .info-horizontal .label{
  max-width: 200px;
}

.info-horizontal .label span,
.info-horizontal .data span {
  display: block;
}

.info-horizontal .data {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.87);
}

.detail-body .info-horizontal .data {
  flex: 4 0 0;
}



/*table style*/

.table-wrap {
  background: #fff;
  max-height: 400px; 
  overflow-y: auto;
  padding: 0px;
}


.customer-table {
  width: 100%;
  border-collapse: separate;
}
.customer-table  thead {
  position: sticky;
  top: 0;
  background: white;
  z-index: 1;
  /*border-bottom: 2px solid var(--Neutral-300, #B3B3B3);*/
}

.customer-table th{
  padding: 10px 16px;
  text-align: left;
  font-weight: bold;
  border-bottom: 2px solid var(--Neutral-300, #B3B3B3);
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
}


.customer-table  td {
  color: var(--alpha-black-60, var(--alpha-black-60, rgba(0, 0, 0, 0.60)));
  border-bottom: 1px solid var(--Neutral-300, #B3B3B3);
  font-size: 14px;
  font-weight: 400;
  padding: 10px 16px;
  text-align: left;
  min-height: 48px;
}

.breadcrumbs {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  gap: 4px;
}

.breadcrumbs step-previouse {
  color: var(--alpha-black-60, rgba(0, 0, 0, 0.60)) !important;
  font-family: "Noto Sans JP";
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-decoration: none;
}

.breadcrumbs step-current {
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));

  /* Medium/12pt */
  font-family: "Noto Sans JP";
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.btn {

  height: 32px;
  width: fit-content;
  min-width: 64px;
  font-size: 14px;
  padding: 0px 16px 0px 12px;
  text-decoration: none;

  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: capitalize;

  border-radius: 4px;
  border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12));
  background: var(--Neutral-700, #292929);
  color: #fff ;

}

.icon-button {
  display: flex;
  width: 28px;
  height: 28px;
  border-radius: 14px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  background-color: initial;
  border: none;
}
.icon-button:hover {
  background-color: var(--alpha-black-12, rgba(0, 0, 0, 0.12));
}
.icon-button img {
  width: 16px;
  max-width: inherit;
  height: 16px;
}
.icon-button .altText {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.btn.sm {
  padding: 0px 8px 0px 6px;
  min-width: 56px;
  height: 28px;
  font-size: 12px;
}

.btn.lg {
  font-size: 16px;
  height: 40px;
  min-width: 80px;
  padding: 0px 16px 0px 12px;
}
.btn.primary{
  background: var(--Neutral-700, #292929)!important;
  color: #fff !important;
}

.btn.danger {
  background: var(--Red-400, #D62846) !important;
}

.btn.secondary {
  border-radius: 4px;
  border: 1px solid var(--Neutral-700, #292929)!important;
  background: var(--Neutral-50, #F5F5F5)!important;
  color: var(--Neutral-800, #1F1F1F) !important;
}

.btn:hover {
  /*background: linear-gradient(270deg, #6B3AFB 0%, #0B6BFF 100%)!important;*/
  background: var(--Neutral-550, #3D3D3D)!important;
  text-decoration: none!important;
}
.btn.danger:hover {
background: var(--Red-600, #BF2641)!important;
text-decoration: none!important;
}
.btn:active {
  background: var(--accent-deepblue-700, #133DDA);
}
.btn.secondary:hover {
color:#fff!important;

}
.btn.icon:hover img {
  fill: white;
}

.btn:focus {
  border: 3px solid #0B6BFF;
}

.btn:disabled {

  background: var(--Neutral-350, #949494);
}

.btn-text {
  width: fit-content;
  background: none;
  display: flex;
  height: 32px;
  min-width: 64px;
  padding: 0px 12px 0px 16px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87)) !important;
  /* Medium/14pc -titleCase */
  font-family: "Noto Sans JP";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: none;
   flex-shrink: 0;

}

.btn-text.sm{
  display: flex;
height: 28px;
min-width: 56px;
padding: 0px 8px 0px 6px;
justify-content: center;
align-items: center;
gap: 4px;
color: var(--Neutral-800, #1F1F1F);

/* Medium/12pt */
font-family: "Noto Sans JP";
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: normal;
}
.btn-text.main {
 color: var(--Primary-800, #1565C0)!important;

/* Medium/14pc -titleCase */
font-family: "Noto Sans JP";
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: normal;

}
.btn-text.main :hover {
   color: var(--Primary-800, #1565C0);
}

.btn-text:hover {
  border-radius: 4px;
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87)) ;
  background: var(--Neutral-150, #EBEBEB) !important;
  text-decoration: none!important;
}

.btn-text:active {
  border-radius: 4px;
  border: 1px solid var(--alpha-primary-20, rgba(25, 118, 210, 0.20));
  background: var(--Primary-100, #BBDEFB);
}


.actionbtn-list {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  gap: 8px;
}
.text-link{
  color: var(--Primary-800, #1565C0)!important;
/* Medium/14pt */
font-family: "Noto Sans JP";
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: normal;
}

.text-link.secondary{
color: var(--Neutral-800, #1F1F1F)!important;
}
.text-link.sm{
  font-size: 12px;
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));
}
.text-link.sm:hover{
  font-size: 12px;
}

table a{
  color: var(--Primary-800, #1565C0)!important;
}

.text-link:hover{
  color: var(--Primary-900, #1C4A90)!important;
  font-family: "Noto Sans JP";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

/* icon */
.icon img {
  width: 16px;
}


/*footer*/

footer {
  position: relative;
  width: 100%;

  background: var(--Neutral-700, #292929);
  color: white;
  font-size: 14px;
  display: flex;
  flex-shrink: 0;
  height: 96px;
  padding: 0px 24px 0px 32px;
  justify-content: center;
  align-items: center;
  align-self: stretch;

}

footer p {
  color: var(--Neutral-250, #C7C7C7);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}



/*header*/
header {
  display: flex;
  justify-content: space-between;
  /* Aligns the items horizontally */
  align-items: center;
  /* Aligns the items vertically */
  padding: 0 32px;
  height: 64px;
  border-bottom: 1px solid var(--Neutral-200, #E0E0E0);
  background: var(--Neutral-White, #FFF);
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 2;
}

nav {
  height: 100%;
}

.nav-links {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  align-self: stretch;
}
.nav-links .slds-button_neutral{
  background: var(--Neutral-700, #fff) !important;
  border: 0px;
}

.nav-links ul {
  list-style: none;
}

.nav-links li {
  height: 100%;
  align-content: center;
}

.nav-links a {
  position: relative;
  display: flex;
  min-width: 64px;
  padding: 0px 16px 0px 12px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  flex: 1 0 0;
  align-self: stretch;
  height: 100%;

  text-decoration: none !important;
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87)) !important;
  /* Medium/14pc -titleCase */
  font-family: "Noto Sans JP";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: capitalize;
}



.nav-links a:hover {
  background: rgba(0, 0, 0, 0.02)!important;
}


.nav-links a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background-color: rgba(0, 0, 0, 0.87);
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  /*transition: width 0.2s ease;*/
  width: 0;
}

.nav-links a:hover::after {
  width: 100%;
}

.nav-links .active a::after {
  width: 100%;
}

/*Dropdown*/

.user_menu.active .menuwrap::after{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  background-color: rgba(0, 0, 0, 0.87);
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  /*transition: width 0.2s ease;*/
  width: 0;
}

.nav-links  .user_menu a {
height: 40px;
}
.nav-links  .user_menu a::after {
  width: 0%;
}


.nav-links  .user_menu a:hover {
  background: var(--Neutral-150, #EBEBEB);
  border: none!important;
}
.nav-links  .user_menu .slds-dropdown{
  width: 170px;
}

.flow-domain {}




/*warning text*/
.warning_text {
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;

  display: flex;
  padding: 3.5px 8px;
  align-items: center;
  gap: 4px;
  border-radius: 4px;
  background: var(--Yellow-50, #FFF5BD);

  flex-direction: column;
    align-items: self-start;
}

.warning_text.neutral {
  background: var(--Neutral-200, #E0E0E0);
}

.warning_text.danger {
  background: var(--Red-50, #FFE7E2);
}
.chip {
  white-space: nowrap; /* ensures domain doesn't break into 2 lines */
  max-width: none;      /* prevent shrinking */
}

.chip{
      width: fit-content;
  border-radius: 4px;
background: var(--Neutral-150, #EBEBEB);

  display: flex;
  height: 20px;
  padding: 0px 8px;
  justify-content: center;
  align-items: center;
  gap: 4px;

  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));

/* Medium/12pt */
font-family: "Noto Sans JP";
font-size: 12px;
font-style: normal;
font-weight: 500;
line-height: normal;

}
/* status label */
.status-label {
  width: fit-content;
  display: flex;
  height: 24px;
  padding: 0px 8px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  align-self: stretch;
  border-radius: 4px;

  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));
  /* Medium/12pt */
  font-family: "Noto Sans JP";
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.status-label.sm {
  height: 20px;
}

.status-label.yellow {
  background: var(--Yellow-50, #FFF5BD);
}

.status-label.green {
  background: var(--Green-50, #E6F9BD);
}

.status-label.gray {

  background: var(--Neutral-150, #EBEBEB);
}

.status-label.red {

  background: var(--Red-100, #FFB6BB);
}

.status-label.leaf {

  background: var(--accent-leaf-100, #CFFFCC);
}

.status-label.skyblue {

  background: var(--accent-skyblue-100, #D0F1FF);
}

.status-label.purple {

  background: var(--accent-purple-100, #E6DBFD);
}

.status-label.scarlet {

  background: var(--accent-scarlet-100, #FFCACA);
}

.status-label.pink {

  background: var(--accent-pink-100, #FCD4FF);
}

.status-label.orange {

  background: var(--accent-orange-100, #FFD5BD);
}

.status-label.lemon {

  background: var(--accent-lemon-100, #FFFCBC);
}

.status-label.deepblue {

  background: var(--accent-deepblue-100, #C1CEFF);
}

/* Make the page full height */

:host {
  display: block;
  min-height: 100vh;
  /* Ensure full height */
}

.columns-content {
  max-width: 100% !important;
  max-height: 100% !important;
  height: 100% !important;
  margin: 0;
}

.column-content {
  max-width: 100% !important;
  max-height: 100% !important;
  height: 100% !important;
}

.content-container {
  height: 100%;
}

.wrapper {
  padding-top: 60px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.slot-wrapper {
  flex-grow: 1;
  /* Pushes the footer to the bottom */
}

.comm-section-container {
  padding: 0 !important;
  height: 100%;
}

.content-wrap {
  height: 100%;
}

.conrtact-info{
    display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  flex: 1 0 0;
  min-width: 252px;
  max-width: 290px;
  
}
.service-info {
  display: flex;
  /*padding: 24px; Changed on 04.08.2025 */
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  flex: 1 0 0;
  min-width: 452px;
  /* max-width: 452px; Changed on 04.08.2025 */
  max-width: 456px;
}

.service-info-inner {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: stretch;
  gap: 24px;
  align-self: stretch;
}

.service-info-title {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;

}

.service-info-name {
  margin-right: auto;
}

.service-info-details {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-left: 48px;
}

.service-info-details .overview {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.service-info-details .features {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.logininfo {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.info-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  flex: 1;
  width: 100%;
}

.info-list.lg {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  flex: 1;
  width: 100%;
}

.announcment-body{
  padding: 16px;
  margin-bottom: 24px;
}
.announcment-body a{
  color: var(--Primary-800, #1565C0)!important;
  /* Medium/14pt */
  font-family: "Noto Sans JP";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.news-container {

  display: flex;
  padding: 8px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.news-card {
  max-width: 1056px;
  margin: 0 auto;
  display: flex;
  padding: 16px;
  align-items: center;
  gap: 16px;
  align-self: stretch;

  border-radius: 8px;
  border: 1px solid var(--Neutral-200, #E0E0E0);
  background: var(--Neutral-White, #FFF);
}

.news-card:hover {
  text-decoration: none !important;
  border: 1px solid var(--Neutral-200, #E0E0E0) !important;
  background: var(--Neutral-150, #EBEBEB) !important;
}

.news-title {
  color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));

  /* Bold/16pt */
  font-family: "Noto Sans JP";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  word-wrap: break-word; /* Allow wrapping of long titles */
}

.news-date {
  flex-shrink: 0; /* Prevent the date from shrinking */
  width: 72px;
  text-align: center;
  margin-right: 15px;

  color: var(--alpha-black-60, rgba(0, 0, 0, 0.60));

  /* Regular/14pt */
  font-family: "Noto Sans JP";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.news-content {
  flex-grow: 1;
  gap: 8px; /* Adjust spacing between title and description */

}

.news-description {
  color: var(--alpha-black-60, rgba(0, 0, 0, 0.60));
  font-size: 14px;
  font-weight: 400;
  margin-top: 4px;
}

.initial-settings {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

.initial-settings .card-action {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  gap: 8px;
  max-width: 400px;
  flex: 1 1 0px;
  align-self: stretch;
  color: var(--alpha-black-87, rgba(6, 2, 19, 0.87));

  /* Regular/14pt */
  font-family: "Noto Sans JP";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.initial-settings .card-action img {
  width: 40px;
  height: 40px;
}

.helpcenter-links {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  gap: 16px;
  align-self: stretch;
  flex-wrap: wrap;
}

.helpcenter-links .card-action {
  display: flex;
  width: 300px;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
}
.request-links{
  padding: 16px 0;
  justify-content: flex-start;
    gap: 8px;
}


.tenant-info-overview{
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}



.detail-list {
  gap: 32px;
}

.detail-body .card .card-item {
  font-size: 14px;
}
.detail-body .card .card-item img {
  vertical-align: bottom;
  margin-right: 4px;
}

/*contract*/
.contract-service-licence{
  padding: 4px 0;
}



/*SF override*/
.component-wrapper-spacer {
  margin-bottom: 0;
}
.navigation-bar__right-align{
  display: flex;
}

/*flow css override*/
.slds-modal__footer .slds-p-left--x-small{
      display: flex;
    flex-direction: row-reverse;
}

.flowruntimeBody,
.flowruntimeBody__lwc {
  margin: 0;
  padding: 0;
}

.field-element .container {
  padding: 0;
}

.flowruntimeBody .section {
  padding: 0;
  margin: 0;
}

.slds-card__footer footer {
  background: none;
}

.slds-button_brand {
  height: 32px;
  min-width: 64px;
  font-size: 14px;
  padding: 0px 16px 0px 12px;
  text-decoration: none;

  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: capitalize;

  border-radius: 4px;
  border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12));
  background: var(--Neutral-700, #292929) !important;
  color: #fff !important;

}
.slds-button_neutral{
  font-size: 14px;
  border-radius: 4px;
  border: 1px solid var(--Neutral-700, #292929);
 
  background: var(--Neutral-50, #F5F5F5)!important;
  color: var(--Neutral-800, #1F1F1F) !important;
}
.slds-button_neutral:hover{
  color: var(--Neutral-700, #fff) !important;
  background: var(--Neutral-800, #1F1F1F) !important;
}




/*Input ( add/delete password*/
.domain-delete-select .flowruntime-input-label span{
  color: rgba(0, 0, 0, 0.87)!important;
}

.domain-delete-select .slds-textarea{
  padding: 8px 12px;
  border-radius: 4px!important;
border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12))!important;
background: var(--Neutral-White, #FFF);
}
.domain-delete-select  .slds-hint-parent{
  height: 48px;
}
.domain-delete-select .slds-p-around--none {
  border: none;
}
.domain-delete-select  .slds-theme_shade{
  background: #fff;
}
.domain-delete-select  .slds-table_header-fixed_container {
  padding-top: 48px;
}
.domain-delete-select  .slds-th__action {
 height: 48px;
}


.flow-domain .flowruntime-input-label span{
  color: rgba(0, 0, 0, 0.87)!important;
}

.flow-domain .slds-textarea{
  padding: 8px 12px;
  border-radius: 4px!important;
border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12))!important;
background: var(--Neutral-White, #FFF);
}
/*pasword reset*/

/*
.forgotPassword .comm-forgot-password__title{
  color:#fff !important;

}*/

.forgotPassword .slds-input{
  height: 40px!important;
  padding: 8px 12px;
  border-radius: 4px!important;
border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12))!important;
background: var(--Neutral-White, #FFF);
width: 446px;
}

.forgotPassword .slds-form-element__label{
  color: #000;
}

.forgotPassword .comm-forgot-password__container{
  border-radius: 8px;
  border: 0px solid var(--alpha-black-12, rgba(15, 20, 20, 0.12));
  background: var(--Neutral-White, #FFF)!important;
max-width: 528px!important;
padding: 40px 40px 48px 40px;
color: rgba(0, 0, 0, 0.87)!important;

/* Regular/16pt */
font-family: "Noto Sans JP";
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;



}

.forgotPassword  .slds-form-element{
  display: flex!important;
}

.comm-forgot-password__cancel-button, .comm-forgot-password__submit-button{
  height: 40px;
}

/*login screen*/

.loginscreen{

}
/*l
.loginscreen .comm-login-form__title{
  color:#fff !important;

}
*/
.loginscreen .slds-input{
  height: 40px!important;
  padding: 8px 12px;
  border-radius: 4px!important;
border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12))!important;
background: var(--Neutral-White, #FFF);
width: 446px;
}

.loginscreen .slds-form-element__label{
  color: #000;
}

.loginscreen .comm-login-form__container{
  border-radius: 8px;
  border: 0px solid var(--alpha-black-12, rgba(15, 20, 20, 0.12));
  background: var(--Neutral-White, #FFF)!important;
max-width: 528px!important;
padding: 40px 40px 48px 40px;
color: rgba(0, 0, 0, 0.87)!important;

/* Regular/16pt */
font-family: "Noto Sans JP";
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
}

.loginscreen  .slds-form-element{
  display: flex!important;
}
.loginscreen .comm-login-form__forgot-password{
  color: rgba(0, 0, 0, 0.87)!important;
}
.loginscreen .comm-login-form__login-button{
  width: 100%;
  height: 40px;
}
.loginscreen .slds-form-element__control{
  width: 100%;
  
}

.loginscreen-note{
  border-radius: 8px;
  border: 0px solid var(--alpha-black-12, rgba(15, 20, 20, 0.12));
  background: var(--Neutral-White, #FFF) !important;
  max-width: 528px !important;
  padding: 16px 40px;
  color: rgba(0, 0, 0, 0.87) !important;
  font-family: "Noto Sans JP";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin: 16px auto;
}

/* Tooltip */
.tooltip {
  position: relative;
  display: inline-block;
}
.tooltip .tooltiptext {
  visibility: hidden;
  width: 12rem;
  height: auto;
  background-color: rgba(0, 0, 0, 0.87);
  color: #fff;
  text-align: center;
  padding: 4px 8px;
  border-radius: 4px;
  position: absolute;
  z-index: 1;
  bottom: 32px;
  left: 50%;
  margin-left: -6rem;
  opacity: 0;
  transition: opacity 0.3s;
}
.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.87) transparent transparent transparent;
}
.tooltip .tooltiptext.tooltiptext-show {
  visibility: visible;
  opacity: 1;
}




/*resetpassword*/

.resetpassword{

}
/*l
.resetpassword .comm-check-email__title{
  color:#fff !important;

}*/
.resetpassword .slds-input{
  height: 40px!important;
  padding: 8px 12px;
  border-radius: 4px!important;
border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12))!important;
background: var(--Neutral-White, #FFF);
width: 446px;
}

.resetpassword .slds-form-element__label{
  color: #000;
}

.resetpassword .comm-check-email__container{
  border-radius: 8px;
  border: 0px solid var(--alpha-black-12, rgba(15, 20, 20, 0.12));
  background: var(--Neutral-White, #FFF)!important;
max-width: 528px!important;
padding: 40px 40px 48px 40px;
color: rgba(0, 0, 0, 0.87)!important;

/* Regular/16pt */
font-family: "Noto Sans JP";
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;



}

.resetpassword  .slds-form-element{
  display: flex!important;
}

.resetpassword .comm-check-email_return-button{
  width: 100%;
  height: 40px;
}
.resetpassword .slds-form-element__control{
  width: 100%;
  
}

.tenant-wrapper {
  max-height: 13rem;
  overflow-y: auto;
}

/*.tenant-info-row{
  display: flex;
  align-items: center;
  gap: 8px;
  align-self: stretch;
}*/

.tenant-info-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  max-width: 1256px;

  width: 100%;
}
.tenant-list{
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 16px;
align-self: stretch;
}

.tenant_record{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--Neutral-50, #F5F5F5)!important;
  padding: 8px;
  position: relative;
}
.tenant_record:hover{
  text-decoration: none;
  background: var(--Neutral-150, #EBEBEB)!important;
}
.domain-image-wrap{
  display: flex;
width: 64px;
height: 64px;
justify-content: center;
align-items: center;
gap: 8px;
}

.tenant-overlay-button {
  position: absolute;
    bottom: 24px;
    right: 24px;
    border-radius: 4px;

    display: flex;
height: 32px;
min-width: 64px;
padding: 0px 12px 0px 16px;
justify-content: center;
align-items: center;
gap: 4px;
border-radius: 4px;
border: 1px solid var(--alpha-black-12, rgba(0, 0, 0, 0.12));
background: var(--Neutral-700, #292929);
  color: white;


  font-size: 14px;
  font-weight: 500;
  opacity: 0;
  transition: opacity 0.2s ease, background-color 0.2s ease;
  pointer-events: none;
}

.tenant_record:hover .tenant-overlay-button {
  opacity: 1;
}
.tenant-data{
  display: flex;
  align-items: flex-start;
  padding: 0 32px;
  justify-content: flex-end;
  gap: 32px;
}

.tenant-data div:first-child{
  width: 270px;
  overflow: auto;
}
.domain-list {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  align-items: center;
  overflow: hidden;
}

.domain-list-wrapper {
  width: 400px;
  max-width: 400px;
  overflow: hidden;
}



.section-tenant-info {
  padding: 24px 0;
}

.slds-file-selector_files{
  width: 100%;
  display: inline;
}

.slds-file-selector__dropzone{
  display: flex;
padding: 16px 24px;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 24px;
align-self: stretch;
border-radius: 4px;
border: 2px dashed var(--alpha-black-12, rgba(0, 8, 16, 0.12));
background: var(--Neutral-50, #F7F8FA);
}

.contracts .plan-name{
     min-height: 58px;
}

.pre-wrap{
  white-space: pre-wrap;
}


/*Self register page*/
                .selfregisterscreen{
                      max-width: 1056px;
                      margin: 0 auto;
                }

           .selfregisterscreen  .pagetitle-wrap {
                display: flex;
                flex-direction: column;
                gap: 8px;
                align-content: center;
                align-items: center;
                margin-bottom: 32px;
                font-size: 16px;
                font-weight: 400;
            }
           .selfregisterscreen  h2 {
                color: var(--alpha-black-87, rgba(0, 0, 0, 0.87));
                font-family: "Noto Sans JP";
                font-size: 32px;
                font-style: normal;
                font-weight: 500;
                line-height: normal;
            }
            .errorMsg {
                color: red;
            }
            .selfregisterscreen .login-form-container {

                width: 528px;
                padding: 40px 40px 48px 40px;
                margin: 0 auto;
               
            }
            .selfregisterscreen .login-form {
                display: flex;
                flex-direction: column;
                gap: 24px;
            }
            .selfregisterscreen .login-form-input-fields {
                display: flex;
                flex-direction: column;
                gap: 16px;
            }
            .selfregisterscreen .input-group {
                display: flex;
                flex-direction: column;
                gap: 4px;
            }
            .selfregisterscreen .input-group label {
                color: var(--alpha-black-87, rgba(6, 2, 19, 0.87));
                font-size: 14px;
                font-style: normal;
                font-weight: 400;
                line-height: normal;
            }
            .selfregisterscreen label.form-input-display {
                font-weight: 600;
            }
            .selfregisterscreen .input-group .form-input {
                padding: 10px;
                border: 1px solid #ccc;
                border-radius: 4px;
            }
            .selfregisterscreen .comm-login-form__login-button {
                width: 100%;
                
            }

:root {
  --neutral-25: 250 250 250;
  --neutral-50: 245 245 245;
  --neutral-100: 240 240 240;
  --neutral-150: 235 235 235;
  --neutral-200: 224 224 224;
  --neutral-250: 199 199 199;
  --neutral-300: 179 179 179;
  --neutral-350: 148 148 148;
  --neutral-400: 138 138 138;
  --neutral-450: 97 97 97;
  --neutral-500: 66 66 66;
  --neutral-550: 61 61 61;
  --neutral-600: 51 51 51;
  --neutral-700: 41 41 41;
  --neutral-800: 31 31 31;
  --neutral-900: 15 15 15;
  --alpha-black: 0 0 0;
  --alpha-white: 255 255 255;
  --primary-50: 227 242 253;
  --primary-100: 187 222 251;
  --primary-200: 144 202 249;
  --primary-400: 66 165 245;
  --primary-600: 30 136 229;
  --primary-700: 25 118 210;
  --primary-800: 21 101 192;
  --primary-900: 28 74 144;
  --red-50: 255 231 226;
  --red-100: 255 182 187;
  --red-400: 214 40 70;
  --red-600: 191 38 65;
  --yellow-50: 255 245 189;
  --yellow-300: 255 233 115;
  --yellow-350: 248 215 41;
  --yellow-400: 255 185 0;
  --yellow-600: 234 136 18;
  --green-50: 230 249 189;
  --green-300: 171 235 133;
  --green-400: 14 180 8;
  --green-600: 2 130 61;
  --accent-purple-100: 230 219 253;
  --accent-purple-700: 132 74 255;
  --accent-pink-100: 252 212 255;
  --accent-pink-700: 239 132 249;
  --accent-scarlet-100: 255 202 202;
  --accent-scarlet-700: 255 79 79;
  --accent-orange-100: 255 213 189;
  --accent-orange-700: 253 98 11;
  --accent-lemon-100: 255 252 188;
  --accent-lemon-700: 255 248 85;
  --accent-leaf-100: 207 255 204;
  --accent-leaf-700: 157 231 152;
  --accent-skyblue-100: 208 241 255;
  --accent-skyblue-700: 96 167 255;
  --accent-deepblue-100: 193 206 255;
  --accent-deepblue-700: 19 61 218;
  --accent-navy-100: 188 188 255;
  --accent-navy-700: 36 36 80
}