/*
 * Your global styles here
 */
html,
body {
  height: 100%;
  --dxp-c-image-alignment: flex-start !important;
  color: #333;
}
html {
  background: white;
}
body {
  font-family: "Poppins", sans-serif;
}

/* Styles for image */
img {
  margin-top: 10px;
  margin-bottom: 10px;
  border: 1px solid;
}
.removeImgBorder img {
  border: none !important;
}

/* Styles for different image sizes and classes */
.icon-image img {
  height: auto;
  width: 33px;
}
.x-small img {
  height: auto;
  width: 150px;
  --dxp-c-image-alignment: flex-start;
}

.small img {
  height: auto;
  width: 300px;
  --dxp-c-image-alignment: flex-start;
}
.x-medium img {
  height: auto;
  width: 450px;
  --dxp-c-image-alignment: flex-start !important;
}
.medium img {
  height: auto;
  width: 600px;
  --dxp-c-image-alignment: flex-start !important;
}
.x-large img {
  height: auto;
  width: 750px;
  --dxp-c-image-alignment: flex-start;
}
.large img {
  height: auto;
  width: 900px;
  --dxp-c-image-alignment: flex-start;
}
.x-extralarge img {
  height: auto;
  width: 1500px;
  --dxp-c-image-alignment: flex-start;
}
.extralarge img {
  height: auto;
  width: 3000px;
  --dxp-c-image-alignment: flex-start;
}
.fullsize img {
  height: auto;
  width: 1889px;
  --dxp-c-image-alignment: flex-start;
}

/* Heading styles (h1, h2, h3) for contents */

h1 {
  font-family: var(--dxp-s-text-heading-extra-large-font-family), sans-serif;
  font-size: var(--dxp-s-text-heading-extra-large-font-size);
  font-style: var(--dxp-s-text-heading-extra-large-font-style);
  font-weight: var(--dxp-s-text-heading-extra-large-font-weight);
  line-height: var(--dxp-s-text-heading-extra-large-line-height);
  text-decoration: var(--dxp-s-text-heading-extra-large-text-decorationt);
  text-transform: var(--dxp-s-text-heading-extra-large-text-transform);
  letter-spacing: var(--dxp-s-text-heading-extra-large-letter-spacing);
  color: var(--dxp-s-text-heading-extra-large-color);
  margin-bottom: 15px;
  word-spacing: 0px;
  display: block;
}

h2 {
  font-family: var(--dxp-s-text-heading-large-font-family), sans-serif;
  font-size: var(--dxp-s-text-heading-large-font-size);
  font-style: var(--dxp-s-text-heading-large-font-style);
  font-weight: var(--dxp-s-text-heading-large-font-weight);
  line-height: var(--dxp-s-text-heading-large-line-height);
  text-decoration: var(--dxp-s-text-heading-large-text-decorationt);
  text-transform: var(--dxp-s-text-heading-large-text-transform);
  letter-spacing: var(--dxp-s-text-heading-large-letter-spacing);
  color: var(--dxp-s-text-heading-large-color);
  word-spacing: 0px;
  margin-bottom: 15px;
}

h3 {
  font-family: var(--dxp-s-text-heading-medium-font-family), sans-serif;
  font-size: var(--dxp-s-text-heading-medium-font-size);
  font-style: var(--dxp-s-text-heading-medium-font-style);
  font-weight: var(--dxp-s-text-heading-medium-font-weight);
  line-height: var(--dxp-s-text-heading-medium-line-height);
  text-decoration: var(--dxp-s-text-heading-medium-text-decorationt);
  text-transform: var(--dxp-s-text-heading-medium-text-transform);
  letter-spacing: var(--dxp-s-text-heading-medium-letter-spacing);
  color: var(--dxp-s-text-heading-medium-color);
  word-spacing: 0px;
  margin-bottom: 15px;
}

h4 {
  font-family: var(--dxp-s-text-heading-small-font-family), sans-serif;
  font-size: var(--dxp-s-text-heading-small-font-size);
  font-style: var(--dxp-s-text-heading-small-font-style);
  font-weight: var(--dxp-s-text-heading-small-font-weight);
  line-height: var(--dxp-s-text-heading-small-line-height);
  text-decoration: var(--dxp-s-text-heading-small-text-decorationt);
  text-transform: var(--dxp-s-text-heading-small-text-transform);
  letter-spacing: var(--dxp-s-text-heading-small-letter-spacing);
  color: var(--dxp-s-text-heading-small-color);
  word-spacing: 0px;
  margin-bottom: 15px;
}

h3 {
  margin-top: 15px;
}
/* Paragraph styles */

p {
  font-family: var(--dxp-s-body-font-family), sans-serif;
  font-size: var(--dxp-s-body-font-size);
  font-style: var(--dxp-s-body-font-style);
  font-weight: var(--dxp-s-body-font-weight);
  line-height: var(--dxp-s-body-line-height);
  text-decoration: var(--dxp-s-body-text-decorationt);
  text-transform: var(--dxp-s-body-text-transform);
  letter-spacing: var(--dxp-s-body-letter-spacing);
  color: var(--dxp-s-body-color);
  /* margin: 0 0 15px; */
}

/* added default margin for HTML editor <p> tag */
community_builder-html-editor p {
  margin: 0 0 15px;
}

/* Deeplinking class */

.deeplink {
  position: absolute;
  margin: -6.8em;
}
/* decrease the p tag line height when its have not content and added only for just space  */

.cb-outputRichText-container.ql-editor p:has(br) {
  line-height: 15px;
}

.cb-outputRichText-container.ql-editor p {
  color: #232323;
  /* line-height: 26px !important; */
  /* margin: 0 0 15px !important; */
  text-transform: none;
}

.left-20 {
  padding-left: 20px;
}

.left-60 {
  padding-left: 60px;
}

.left-40 {
  padding-left: 40px;
}

.left-80 {
  padding-left: 80px;
}

/* set color green for heading*/
dxp_base-text-block .text-color-green {
  --dxp-c-text-block-text-color: #39b44a !important;
}
/* for HTML editor */
.text-color-green {
  color: #39b44a !important;
  --dxp-c-text-block-text-color: #39b44a !important;
}
/* set color red for text*/
.text-color-red {
  color: red !important;
}

/* set color blue for text*/
.text-color-blue {
  color: blue !important;
}

/* Note styles */

.note {
  margin: 15px 0 !important;
  padding: 10px !important;
  background-color: #e8f6fb;
  border-left: 6px solid #27aae1;
  border-radius: 10px;
}

.note p {
  margin: 15px !important;
}
.note ul {
  padding-left: 15px !important;
}
/* .note img {
  padding-left: 15px !important;
} */

/* styles for table  */
.table {
  margin-bottom: 20px;
}
.table table .align-center tr th,
.table table .align-center tr td {
  text-align: center;
}

.table table {
  border: 0.06rem solid #000;
  font-size: 16px;
}
.table tbody {
  width: max-content;
}
.table th {
  padding: 10px;
  border: 0.06rem solid #000;
}
.table td {
  border: 0.06rem solid #000;
  padding: 10px;
  vertical-align: top;
}
.table .equalWidth td {
  width: 50%;
}
.table .textAlignCenter td {
  text-align: center;
}
.verticleAlignCenter td {
  vertical-align: middle !important;
}
.fixedWidth table,
.fixedWidth img,
.fixedWidth .note {
  width: 80% !important;
}
/* Styles for ordered list inside longform text */

/* .slds-text-longform ol {
   margin-left: 1.1em;
 }
 
 .slds-text-longform ul{
   padding-left: 40px;
 } */

/* for HTML editor list content style */
.slds-text-longform ul,
.slds-text-longform ol {
  margin-left: 2.5rem;
}
li.list-style-none {
  list-style-type: none;
}
.slds-text-longform ul li {
  margin-top: 10px;
  margin-bottom: 10px;
}

.slds-text-longform ol li {
  margin-top: 10px;
  margin-bottom: 10px;
}
.slds-text-longform .list-style-circle ul {
  list-style-type: circle !important;
}
.slds-text-longform ul ul ul ul {
  list-style-type: disc !important;
}
.slds-text-longform ul ul ul ul ul {
  list-style-type: circle !important;
}

/* styles for breadcrumb article  */
.breadcrumb-link a {
  cursor: text;
}

/* Styles for standard RichTextEditor components */
outputRichText-container.ql-editor ul {
  padding-left: 1.25em;
}
.cb-outputRichText-container.ql-editor li:not(.ql-direction-rtl) {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}
.cb-outputRichText-container.ql-editor li:not(.ql-direction-rtl) {
  padding-left: 1.25em;
}

.cb-outputRichText-container ql-editor p img {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* code palette */
.link-color-red a {
  color: red !important;
}
.link-color-blue a {
  color: blue !important;
}
.link-disable lightning-formatted-rich-text a {
  color: #232323 !important;
  pointer-events: none;
  cursor: pointer;
}
/*  Styles for site page sidebar accordion*/

.slds-accordion__summary {
  background-color: transparent;
}

.slds-accordion__summary h2 {
  margin-bottom: 0px !important;
}
.SideBar span.slds-accordion__summary-content {
  display: flex;
  white-space: normal;
  text-transform: none !important;
}

.slds-button.slds-accordion__summary-action {
  align-items: baseline;
  padding-right: 0 !important;
  text-transform: none;
  white-space: normal;
}

.Container span.slds-accordion__summary-content,
.cardContainer span.slds-accordion__summary-content {
  font-size: 1rem !important;
  font-family: "Poppins", sans-serif !important;
  color: #333 !important;
}
.cardContainer span.slds-accordion__summary-content:hover {
  color: #27aae1 !important; /* Hover color */
}
.slds-accordion__summary-heading .slds-button:focus {
  text-decoration: none;
  color: #40474f !important;
}
.slds-accordion__summary-heading:hover .slds-accordion__summary-content {
  color: #27aae1 !important;
}
.slds-accordion__summary-heading {
  --slds-g-shadow-outline-focus-1: none;
}
.slds-button:focus {
  outline: none;
  --_slds-g-shadow-outline-focus: none;
}
.Container[c-kbPageLayout_kbPageLayout] {
  font-size: 14px !important;
}

/*  Styles for SLDS card component  */

.slds-card {
  line-height: 1.7em;
  padding-right: 18px;
  padding-left: 20px;
  margin-bottom: 30px;
  background-color: #fbfbfb;
}

/*  Styles for cutsom Image carousel component  */

.slds-carousel__content {
  color: black;
  height: 50px;
}
.slds-carousel__image > img {
  border-color: black;
}

.slds-carousel__indicator-action.slds-is-active,
.slds-carousel__indicator-action.slds-is-active:hover {
  background: #39b44a;
  border-color: #39b44a;
}

/* for site search standard component  */
.gsc-control-cse {
  width: 100% !important;
  /* position: absolute; */
  padding: 0 !important;
  border-radius: 5px;
}
.gsc-input-box {
  border-radius: 5px 0px 0px 5px;
}
.gsc-search-button {
  margin: 0;
}
.gsc-search-button-v2 {
  padding: 6px 15px !important;
  border-color: #27aae1 !important;
  background-color: #27aae1 !important;
}
table.gsc-search-box,
form.gsc-search-box {
  margin-bottom: 0 !important;
}

table.gsc-search-box td.gsc-input {
  padding: 0 !important;
}
.gsc-cursor-current-page {
  color: #008000 !important;
}

/* .gsc-webResult.gsc-result --> search result as per query  */
.gsc-webResult.gsc-result {
  padding: 5px !important;
  font-family: "Poppins";
}
.gs-webResult .gs-snippet {
  font-family: "Poppins";
  font-size: 18px;
}
.gsc-results .gsc-cursor {
  color: #333;
  display: inline;
  fill: #333;
  font-size: 18px;
}
.gsc-cursor-current-page {
  color: #39b44a !important;
}
.gsc-results .gsc-cursor-box .gsc-cursor-page:hover {
  text-decoration: underline;
  color: #27aae1 !important;
}
/*.gsc-above-wrapper-area--> It displays this line "about 112000 results in 0.17s"
   .gsc-url-top  --> link of the article page
   .gsc-table-result --> Description content of particular article 
   .gcsc-more-maybe-branding-root --> "Search for {entered query in search box} on Google" at bottom of div*/

.gsc-above-wrapper-area,
.gsc-url-top,
.gcsc-more-maybe-branding-root {
  display: none;
}

.gsc-webResult .gsc-url-top {
  display: none !important;
}
community_builder-output-rich-text {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
}
#ardr-search {
  background-color: #fff;
  border-radius: 5px;
  margin: auto;
  width: 80%;
  padding-right: 4px;
}
.gsc-control-cse .gs-result .gs-title * {
  font-size: 18px !important;
}
.searchText h2 {
  font-size: var(--dxp-s-text-heading-extra-large-font-size) !important;
  font-weight: normal !important;
}

.search .input-wrapper {
  height: 140% !important;
}
.search button {
  height: 140% !important;
}
.search .input-wrapper {
  height: 140% !important;
}
.search .search-input-with-button {
  padding-left: 40px !important;
}
.bold-string-title[lwc-tseoq9qiqi] {
  font-weight: var(--lwc-fontWeightBold, 600);
}

.slds-rich-text-editor__output,
.slds-rich-text-editor__textarea {
  font-family: "Open Sans";
  font-size: large;
}

lightning-formatted-url a:hover:not(.slds-button, .slds-dropdown__item > a) {
  text-decoration: underline !important;
}
lightning-formatted-rich-text em {
  background-color: yellow;
}

/* set icon color for Generate URL component */

.form-icon lightning-primitive-icon {
  color: white !important;
}
.GenerateUrl .slds-button--success,
.GenerateUrl .slds-button_success,
.GenerateUrl .slds-button_success:hover,
.GenerateUrl .slds-button_success:active {
  background-color: #39b44a;
  border-color: #39b44a;
  color: white;
  padding: 6px 18px;
}
.outputURL lightning-textarea {
  --sds-c-textarea-sizing-min-height: 110px;
}

/* Responsive styles for mobile screens */

@media screen and (max-width: 480px) {
  .menulist .slds-accordion .slds-button,
  lightning-button::part(button),
  .menulist .slds-accordion .slds-button.slds-accordion__summary-action {
    font-size: 14px;
    font-family: "Poppins", sans-serif;
    color: #333333;
    line-height: 20px;
    font-weight: 600;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    width: 100%;
    border-bottom: solid 1px #e0e0e0;
    padding: 10px 0 !important;
    margin-bottom: -1px;
  }
  /* gcsc-find-more-on-google-root class used for display "Search for {entered query in search box} on Google" at footer */
  .gcsc-find-more-on-google-root {
    display: none;
  }
}

/* current menu color set for mobile and tablet device Header */

.menucolor span.slds-accordion__summary-content {
  color: #39b44a !important;
}
/* Responsive styles for tablet screens */

@media only screen and (min-width: 481px) and (max-width: 768px) {
  .menulist .slds-accordion .slds-button,
  lightning-button::part(button),
  .menulist .slds-accordion .slds-button.slds-accordion__summary-action {
    font-size: 14px;
    color: #333333;
    line-height: 20px;
    font-weight: 600;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    width: 100%;
    border-bottom: solid 1px #e0e0e0;
    padding: 10px 0 !important;
    margin-bottom: -1px;
  }
  /* gcsc-find-more-on-google-root class used for display "Search for {entered query in search box} on Google" at footer */
  .gcsc-find-more-on-google-root {
    display: none;
  }
}
@media (min-width: 1024px) {
  .slds-accordion__summary-content {
    max-width: 100%;
    /* text-wrap: wrap ;  */
    white-space: normal;
  }
}
/* For ipad pro landing page  */
@media screen and (min-width: 1024px) and (max-width: 1366px) {
  .columns-content {
    flex-direction: row !important;
  }
  #ardr-search {
    background-color: #fff;
    border-radius: 5px;
    margin: auto;
    width: 80%;
    padding-right: 4px;
  }
}
.columns-content {
  display: inline !important;
}
.cardColumn .columns-content {
  display: flex !important;
}