.lfr-layout-structure-item-container {padding: 0;} .lfr-layout-structure-item-row {overflow: hidden;} .portlet-borderless .portlet-content {padding: 0;}:root {
  --text: #6b6375;
  --text-h: #08060d;
  --bg: #fff;
  --border: #e5e4e7;
  --code-bg: #f4f3ec;
  --accent: #aa3bff;
  --accent-bg: rgba(170, 59, 255, 0.1);
  --accent-border: rgba(170, 59, 255, 0.5);
  --social-bg: rgba(244, 243, 236, 0.5);
  --shadow:
    rgba(0, 0, 0, 0.1) 0 10px 15px -3px, rgba(0, 0, 0, 0.05) 0 4px 6px -2px;
 
  --sans: system-ui, 'Segoe UI', Roboto, sans-serif;
  --heading: system-ui, 'Segoe UI', Roboto, sans-serif;
  --mono: ui-monospace, Consolas, monospace;
 
  font: 18px/145% var(--sans);
  letter-spacing: 0.18px;
  color-scheme: light dark;
  color: var(--text);
  background: var(--bg);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
   background-color: #FFFFFF;
  @media (max-width: 1024px) {
    font-size: 16px;
  }
}
 
@tailwind base;
@tailwind components;
@tailwind utilities;
 
@media (prefers-color-scheme: dark) {
  :root {
    --text: #9ca3af;
    --text-h: #f3f4f6;
    --bg: #16171d;
    --border: #2e303a;
    --code-bg: #1f2028;
    --accent: #c084fc;
    --accent-bg: rgba(192, 132, 252, 0.15);
    --accent-border: rgba(192, 132, 252, 0.5);
    --social-bg: rgba(47, 48, 58, 0.5);
    --shadow:
      rgba(0, 0, 0, 0.4) 0 10px 15px -3px, rgba(0, 0, 0, 0.25) 0 4px 6px -2px;
  }
 
  #social .button-icon {
    filter: invert(1) brightness(2);
  }
}
 
body {
  margin: 0;
}
 
#root {
  width: 1126px;
  max-width: 100%;
  margin: 0 auto;
  border-inline: 1px solid var(--border);
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 20px 40px;
}
 
h1,
h2 {
  font-family: var(--heading);
  font-weight: 500;
  color: var(--text-h);
}
 
h1 {
  font-size: 56px;
  letter-spacing: -1.68px;
  margin: 32px 0;
  @media (max-width: 1024px) {
    font-size: 36px;
    margin: 20px 0;
  }
}
h2 {
  font-size: 24px;
  line-height: 118%;
  letter-spacing: -0.24px;
  margin: 0 0 8px;
  @media (max-width: 1024px) {
    font-size: 20px;
  }
}
p {
  margin: 0;
}
 
code,
.counter {
  font-family: var(--mono);
  display: inline-flex;
  border-radius: 4px;
  color: var(--text-h);
}
 
code {
  font-size: 15px;
  line-height: 135%;
  padding: 4px 8px;
  background: var(--code-bg);
}
 
h3 {
  color: #1F3A8A;
}
 
.info {
    padding: 0px;
    border-radius: 6px;
    margin-bottom: 24px;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 1rem;
}
 
.metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}
 
.card {background: #f8fbff;border: 1px solid #3b82f6;border-radius: 8px;padding: 12px;position: relative;height: auto;display: flex;flex-direction: column;
          max-width: 24rem;
  }
 
.card h3 {
  margin: 0;
  font-size: 12px;
  color: #2563eb;
  color: var(--Text-Secondary, #076BCF);

/* Subheading/S2 (M) - Bold */
  font-family: var(--Font-Family-Font-Family, "Noto Sans");
  font-size: var(--font-size-s-2-b-2, 0.875rem);
  font-style: normal;
  font-weight: 700;
  line-height: var(--Line-Height-For-Font-Size---14, 1.3125rem); /* 150% */
  letter-spacing: var(--Letter-Spacing-Letter-Spacing, 0.0075rem);
}
 
.growth {
  position: absolute;
  top: 4px;
  right: 9px;
  color: #16a34a;
  font-size: 12px;
  font-weight: 600;
}
 
.value {font-size: 20px;font-weight: bold;color: #1e3a8a;margin-top: 6px;color: var(--Text-Primary, #2A3A8D);

/* Heading/H2 (L) - Bold */font-family: var(--Font-Family-Font-Family, "Noto Sans");font-size: var(--Font-Size-H2, 1.875rem);font-style: normal;font-weight: 700;line-height: var(--Line-Height-For-Font-Size---30, 2.8125rem); /* 150% */letter-spacing: var(--Letter-Spacing-Letter-Spacing, 0.0075rem);}
 
.dashboard {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
}
 
.panel {
        background: white;
        border: 1px solid #3b82f6;
        border-radius: 10px;
        max-width: 24rem;
}
 
.panel h2 {
  font-size: 15px;
  color: #2563eb;
  padding: 7px;
}
.item {
        border-bottom: 1px solid var(--neutral-bg-stroke-30, #E5E6E8);
        /* border-bottom: 1px solid #E5E6E8 !important; */
        padding-left: 12px !important;
        padding-right: 12px !important;
        padding-bottom:4px;
        padding-top:4px;
        width: 100%;
    }
.bar {
        background: #e5e7eb;
        height: 6px;
        border-radius: 5px;
        overflow: hidden;
        display: flex;
        height: 0.375rem;
        flex-direction: column;
        align-items: flex-start;
        align-self: stretch;
        border-radius: 0.125rem;
        background: var(--Neutral-300, #DFE0E2);
        border-radius: 0.125rem;
        background: var(--Neutral-300, #DFE0E2);
        border-radius: 0.125rem;
        /* background: var(--secondary-info-500-default, #076BCF); */
        margin-bottom: 5px;
    }
  
.bar div {
  height: 6px;
  background: #2563eb;
  border-radius: 0.125rem;
  background: var(--secondary-info-500-default, #076BCF);
}
.barTitle {
        margin: 0px 0px 0px 7px;
        font-size: 12px;
        color: #2563eb;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        flex: 1 0 0;
        border-radius: var(--Medium-M1, 0.75rem) var(--Medium-M1, 0.75rem) 0 0;
        /* border: 1px solid var(--secondary-info-500-default, #076BCF); */
        background: var(--Neutral-100, #FFF);
        padding: 8px;
        color: var(--Text-Secondary, #076BCF);
        font-family: var(--Font-Family-Font-Family, "Noto Sans");
        font-size: var(--font-size-s-2-b-2, 0.875rem);
        font-style: normal;
        font-weight: 700;
        line-height: var(--Line-Height-For-Font-Size---14, 1.3125rem); /* 150% */
        letter-spacing: var(--Letter-Spacing-Letter-Spacing, 0.0075rem);
        max-height: 3rem;
        /* border-radius: var(--Medium-M1, 0.75rem) var(--Medium-M1, 0.75rem) 0 0; */
        /* border: 1px solid var(--secondary-info-500-default, #076BCF); */
        background: var(--Neutral-100, #FFF);
    }
.barPercentageAnalytics{
color: #000;
font-family: var(--Font-Family-Font-Family, "Noto Sans");
font-size: var(--font-size-s-3-b-3, 0.75rem);
font-style: normal;
font-weight: 400;
line-height: var(--Line-Height-For-Font-Size---12, 1.125rem); /* 150% */
letter-spacing: var(--Letter-Spacing-Letter-Spacing, 0.0075rem);
  }
  
.center {
  text-align: center;
}
 
.pie {
  width: 140px;
  height: 140px;
  margin: 30px auto 0;
  border-radius: 50%;
  background: conic-gradient(
    #1e3a8a 0% 65%,
    #0ea5e9 65% 100%
  );
}
.font-medium{
	font-weight: 700;
	color:#2563EB;
}
 
.pageUpdate{color:#2563EB;color: var(--Text-Info, #076BCF);

/* Subheading/S3 (S) - Bold */font-family: var(--Font-Family-Font-Family, "Noto Sans");font-size: var(--font-size-s-3-b-3, 0.75rem);font-style: normal;line-height: var(--Line-Height-For-Font-Size---12, 1.125rem); /* 150% */letter-spacing: var(--Letter-Spacing-Letter-Spacing, 0.0075rem);}
 
.headDiv{color: #1F3A8A;font-weight: bold;font-size: 20px;color: var(--Text-Primary, #2A3A8D);

/* Heading/H2 (L) - Bold */font-family: var(--Font-Family-Font-Family, "Noto Sans");font-size: var(--Font-Size-H2, 1.875rem);font-style: normal;font-weight: 700;line-height: var(--Line-Height-For-Font-Size---30, 2.8125rem); /* 150% */letter-spacing: var(--Letter-Spacing-Letter-Spacing, 0.0075rem);}
 .info-icon {
        display: inline-flex;
        justify-content: center;
        font-size: 3px;
        font-weight: bold;
        cursor: pointer;
           }
.topPageLink{
color: #2563EB;
          display: flex;
        justify-content: center;
  text-decoration: none;
}
 
.cityName{
font-size: 12px;
  margin: 3px 0px;
}
 
.deviceName{
font-size: 12px;
  margin: 3px 0px;
}
 
.pagePercentageTop{
font-size: 12px;
}
 
.pageNameSpan{
  margin-top: 4px;
       
        font-size: 12px;
        overflow: hidden;
        color: var(--Text-Secondary, #076BCF);
        text-overflow: ellipsis;
        font-family: var(--Font-Family-Font-Family, "Noto Sans");
        font-size: var(--font-size-s-3-b-3, 0.75rem);
        font-style: normal;
        font-weight: 400;
        line-height: var(--Line-Height-For-Font-Size---12, 1.125rem);
        letter-spacing: var(--Letter-Spacing-Letter-Spacing, 0.0075rem);
        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;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;

}
  .pageIconSpan{
    display:none;
  }
.BarAndPercentageAnalytics {
        display: flex;
        padding: 0.375rem;
        align-items: flex-start;
        gap: 0.375rem;
        justify-content: space-between;
        border-bottom: 1px solid var(--neutral-bg-stroke-30, #E5E6E8);
    }

.etds-pie-chartMain{
    display: flex;
    width: 23.95831rem;
    height: 15.1875rem;
    justify-content: center;
    align-items: center;
    gap: 0.625rem;
}
  .etds-pie-chartDivOne{
 
width: 9.375rem !important;
    height: 9.375rem !important;
  }
.etds-analaytics-main-conatiner-page{
  padding:17px;
  @media (min-width:1370px){
padding-left: 17px;
    padding-right:0px
  }
}

@media (max-width: 1100px) {
  .metrics {
    grid-template-columns: 1fr;
  }
  .dashboard {
    grid-template-columns: 1fr;
  }
}


}

hr.divider {
      /* border-radius: var(--Medium-M1, 0.75rem) var(--Medium-M1, 0.75rem) 0 0; */
    border: 1px solid var(--secondary-info-500-default, #076BCF);
    background: var(--Neutral-100, #FFF);
    margin: 0px;
    align-items: flex-start;
    gap: var(--Small-S1, 0.25rem);
    align-self: stretch;
}

hr.divider {
      /* border-radius: var(--Medium-M1, 0.75rem) var(--Medium-M1, 0.75rem) 0 0; */
    border: 1px solid var(--secondary-info-500-default, #076BCF);
    background: var(--Neutral-100, #FFF);
    margin: 0px;
    align-items: flex-start;
    gap: var(--Small-S1, 0.25rem);
    align-self: stretch;
}
.ml-1, .mx-1 {

    margin-left: var(--spacer-1, 0.25rem) !important;
    width: 100%;
    height: 100%;

}.lfr-layout-structure-item-cbedb5fb-2ccf-5ed9-ff20-0ef4285b47d6 {
margin-top: var(--spacer-5,3rem) !important;
}