.elementor-48330 .elementor-element.elementor-element-41dcb39{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:60px;--padding-bottom:60px;--padding-left:0px;--padding-right:0px;}.elementor-48330 .elementor-element.elementor-element-41dcb39:not(.elementor-motion-effects-element-type-background), .elementor-48330 .elementor-element.elementor-element-41dcb39 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFEFE;}.elementor-48330 .elementor-element.elementor-element-2904233{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-48330 .elementor-element.elementor-element-ec9bfb0{width:var( --container-widget-width, 48% );max-width:48%;--container-widget-width:48%;--container-widget-flex-grow:0;--e-icon-list-icon-size:16px;--icon-vertical-offset:0px;}.elementor-48330 .elementor-element.elementor-element-ec9bfb0 > .elementor-widget-container{background-color:#EAFFF8;padding:05px 2px 05px 015px;border-radius:20px 20px 20px 20px;box-shadow:2px 2px 2px 0px rgba(204.7550038465957, 207.92536163330078, 206.8094179688136, 0.5);}.elementor-48330 .elementor-element.elementor-element-ec9bfb0 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-48330 .elementor-element.elementor-element-ec9bfb0 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-48330 .elementor-element.elementor-element-ec9bfb0 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-48330 .elementor-element.elementor-element-ec9bfb0 .elementor-icon-list-item > a{font-family:"Outfit", Sans-serif;font-size:16px;}.elementor-48330 .elementor-element.elementor-element-ec9bfb0 .elementor-icon-list-text{color:#018363;transition:color 0.3s;}.elementor-48330 .elementor-element.elementor-element-9c0ae8b > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-48330 .elementor-element.elementor-element-9c0ae8b{text-align:start;}.elementor-48330 .elementor-element.elementor-element-9c0ae8b .elementor-heading-title{font-family:"Inter", Sans-serif;font-size:45px;font-weight:700;color:#000000;}.elementor-48330 .elementor-element.elementor-element-24cd2e3{font-family:"Inter", Sans-serif;font-size:18px;}.elementor-48330 .elementor-element.elementor-element-97527ce{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:40px;--padding-right:0px;}.elementor-48330 .elementor-element.elementor-element-f2563a7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-48330 .elementor-element.elementor-element-4a588b4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-48330 .elementor-element.elementor-element-4a588b4.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}@media(max-width:767px){.elementor-48330 .elementor-element.elementor-element-ec9bfb0{width:var( --container-widget-width, 261px );max-width:261px;--container-widget-width:261px;--container-widget-flex-grow:0;}.elementor-48330 .elementor-element.elementor-element-ec9bfb0 > .elementor-widget-container{padding:0px 19px 0px 15px;}.elementor-48330 .elementor-element.elementor-element-97527ce{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(min-width:768px){.elementor-48330 .elementor-element.elementor-element-2904233{--width:50%;}.elementor-48330 .elementor-element.elementor-element-97527ce{--width:50%;}.elementor-48330 .elementor-element.elementor-element-4a588b4{--width:95.566%;}}/* Start custom CSS for html, class: .elementor-element-286e102 *//* CSS Variables for colors */
:root {
    --primary-color: #00c49a;
    --primary-dark-color: #00b389;
    --blue-50: #eff6ff;
    --blue-100: #dbeafe;
    --blue-200: #bfdbfe;
    --blue-500: #3b82f6;
    --blue-600: #2563eb;
    --green-100: #dcfce7;
    --green-400: #4ade80;
    --green-500: #22c55e;
    --green-600: #16a34a;
    --purple-100: #f3e8ff;
    --purple-500: #a855f7;
    --purple-600: #9333ea;
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-900: #111827;
    --white: #ffffff;
}

/* Basic body style for centering and font */

/* Animations */
@keyframes bounce {
    0%, 100% {
        transform: translateY(-25%);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
        transform: translateY(0);
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
    }
}

@keyframes pulse {
    50% {
        opacity: .5;
    }
}

@keyframes ping {
    75%, 100% {
        transform: scale(2);
        opacity: 0;
    }
}

/* Main container and layout */
.container-wrapper {
    max-width: 560px;
    width: 100%;
}

.dashboard-container {
    position: relative;
}

.dashboard-bg {
    background-image: linear-gradient(to bottom right, rgba(0, 196, 154, 0.05), rgba(0, 196, 154, 0.1));
    border-radius: 1.5rem;
    padding: 1.5rem;
    border: 1px solid rgba(0, 196, 154, 0.1);
}

.dashboard-card {
    background-color: var(--white);
    border-radius: 1rem;
    padding: 1rem;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    border: 1px solid var(--gray-100);
}

/* Card Header */
.card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.card-title {
    font-weight: 600;
    color: var(--gray-900);
    font-size: 0.875rem;
}

.live-indicator {
    display: flex;
    align-items: center;
}

.live-indicator > :not([hidden]) ~ :not([hidden]) {
    margin-left: 0.5rem;
}

.live-dot {
    width: 0.5rem;
    height: 0.5rem;
    background-color: var(--green-500);
    border-radius: 9999px;
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.live-text {
    font-size: 0.75rem;
    color: var(--green-600);
    font-weight: 500;
}

/* Stats Grid */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.stat-card {
    border-radius: 0.75rem;
    padding: 0.75rem;
    border-width: 1px;
    border-style: solid;
}

.stat-card.answer-rate {
    background-image: linear-gradient(to bottom right, rgba(0, 196, 154, 0.1), rgba(0, 196, 154, 0.05));
    border-color: rgba(0, 196, 154, 0.2);
}

.stat-card.available {
    background-image: linear-gradient(to bottom right, var(--blue-50), var(--blue-100));
    border-color: var(--blue-200);
}

.stat-value {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.answer-rate .stat-value { color: var(--primary-color); }
.available .stat-value { color: var(--blue-600); }

.stat-label {
    font-size: 0.75rem;
    color: var(--gray-600);
}

.progress-bar-bg {
    width: 100%;
    background-color: var(--gray-200);
    border-radius: 9999px;
    height: 0.5rem;
    margin-top: 0.5rem;
    overflow: hidden;
}

.progress-bar {
    background-image: linear-gradient(to right, var(--primary-color), var(--primary-dark-color));
    height: 100%;
    border-radius: 9999px;
}

.stat-subtext {
    display: flex;
    align-items: center;
    margin-top: 0.5rem;
}

.stat-subtext svg {
    height: 0.75rem;
    width: 0.75rem;
    color: var(--blue-600);
    margin-right: 0.25rem;
}

.stat-subtext span {
    font-size: 0.75rem;
    color: var(--blue-600);
    font-weight: 500;
}

/* Activity Feed */
.activity-section > :not([hidden]) ~ :not([hidden]) {
    margin-top: 0.75rem;
}

.activity-title {
    font-weight: 600;
    color: var(--gray-900);
    font-size: 0.75rem;
    margin-bottom: 0.5rem;
}

.activity-feed > :not([hidden]) ~ :not([hidden]) {
    margin-top: 0.5rem;
}

.activity-item {
    display: flex;
    align-items: center;
    padding: 0.5rem;
    background-color: var(--gray-50);
    border-radius: 0.5rem;
}

.activity-item > :not([hidden]) ~ :not([hidden]) {
    margin-left: 0.75rem;
}

.activity-icon-wrapper {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.activity-item:nth-child(1) .activity-icon-wrapper { background-color: var(--green-100); }
.activity-item:nth-child(2) .activity-icon-wrapper { background-color: var(--blue-100); }

.activity-icon {
    height: 0.875rem;
    width: 0.875rem;
}

.activity-item:nth-child(1) .activity-icon { color: var(--green-600); }
.activity-item:nth-child(2) .activity-icon { color: var(--blue-600); }

.activity-details {
    flex: 1 1 0%;
}

.activity-main-text {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--gray-900);
}

.activity-sub-text {
    font-size: 0.75rem;
    color: var(--gray-500);
}

/* Decorator Elements */
.decorator {
    position: absolute;
    border-radius: 9999px;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

.phone-icon {
    top: -1rem;
    right: -1rem;
    width: 3rem;
    height: 3rem;
    background-image: linear-gradient(to bottom right, var(--primary-color), var(--primary-dark-color));
    display: flex;
    align-items: center;
    justify-content: center;
    animation: bounce 1.5s infinite;
}

.phone-icon svg {
    height: 1.5rem;
    width: 1.5rem;
    color: var(--white);
}

.bottom-pulse {
    bottom: -1rem;
    left: -1rem;
    width: 2rem;
    height: 2rem;
    background-image: linear-gradient(to bottom right, var(--blue-500), var(--purple-500));
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.side-ping {
    top: 25%;
    left: -0.5rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: linear-gradient(to bottom right, var(--green-400), var(--primary-color));
}

/* Adding a pseudo-element for the ping animation itself */
.side-ping::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 9999px;
    background-color: var(--primary-color);
    animation: ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite;
}

/* Responsive Styles */
@media (min-width: 768px) {
    .dashboard-bg { padding: 2rem; }
    .dashboard-card { padding: 1.5rem; }
    .card-header { margin-bottom: 1.5rem; }
    .card-title { font-size: 1rem; }
    .live-text { font-size: 0.875rem; }
    .stats-grid { gap: 1rem; margin-bottom: 1.5rem; }
    .stat-card { padding: 1rem; }
    .stat-value { font-size: 1.875rem; line-height: 2.25rem; }
    .stat-subtext svg { height: 1rem; width: 1rem; }
    .activity-title { font-size: 0.875rem; }
    .activity-item { padding: 0.75rem; }
    .activity-icon-wrapper { width: 2rem; height: 2rem; }
    .activity-icon { height: 1rem; width: 1rem; }
    .activity-main-text, .activity-sub-text { font-size: 0.875rem; }
    
    .decorator.phone-icon { top: -1.5rem; right: -1.5rem; width: 4rem; height: 4rem; }
    .decorator.phone-icon svg { width: 2rem; height: 2rem; }
    .decorator.bottom-pulse { bottom: -1.5rem; left: -1.5rem; width: 3rem; height: 3rem; }
    .decorator.side-ping { top: 25%; left: -1rem; width: 2rem; height: 2rem; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b9a2d86 */.analytics-section {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.container {
    max-width: 80rem;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
.grid-container {
    display: grid;
    gap: 2rem;
    align-items: center;
}

/* --- Left Column: Analytics Card --- */
.analytics-card-wrapper {
    position: relative;
}
.analytics-card-background {
    background-image: linear-gradient(to bottom right, #fff1f2, #ffedd5);
    border-radius: 1.5rem;
    padding: 1.5rem;
    border: 1px solid #fee2e2;
}
.dashboard-card {
    background-color: #ffffff;
    border-radius: 1rem;
    padding: 0.75rem;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
    border: 1px solid #f3f4f6;
    margin-bottom: 1.5rem;
}
.dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}
.dashboard-title {
    font-weight: 600;
    color: #111827;
    font-size: 0.875rem;
}
.pulse-dot-red {
    width: 0.75rem;
    height: 0.75rem;
    background-color: #ef4444;
    border-radius: 9999px;
}
.dashboard-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.missed-calls-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.summary-label {
    font-size: 0.75rem;
    color: #4b5563;
}
.summary-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: #dc2626;
}
.progress-bars-container {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.progress-bar-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.progress-label {
    width: 2rem;
    font-size: 0.75rem;
    color: #6b7280;
}
.progress-value {
    width: 2rem;
    font-size: 0.75rem;
    color: #dc2626;
}
.progress-track {
    flex-grow: 1;
    background-color: #e5e7eb;
    border-radius: 9999px;
    height: 0.5rem;
}
.progress-bar {
    background-image: linear-gradient(to right, #ef4444, #f97316);
    height: 0.5rem;
    border-radius: 9999px;
}
.activity-feed {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.activity-item {
    background-color: #ffffff;
    border-radius: 0.75rem;
    padding: 0.75rem;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.activity-item.missed-call {
    border-left: 4px solid #ef4444;
}
.activity-icon-wrapper {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.activity-icon-wrapper.red { background-color: #fee2e2; }
.activity-icon-wrapper.orange { background-color: #ffedd5; }
.activity-icon {
    font-size: 1.25rem;
}
.activity-icon.red { color: #dc2626; }
.activity-icon.orange { color: #ea580c; }
.activity-text .title {
    font-weight: 500;
    color: #111827;
    font-size: 0.875rem;
}
.activity-text .subtitle {
    font-size: 0.75rem;
    color: #4b5563;
}

/* --- Decorative Elements --- */
.deco-item { position: absolute; }
.deco-1 {
    width: 3rem; height: 3rem;
    top: -1.5rem; right: -1.5rem;
    background-color: #ef4444;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 0.875rem;
}
.deco-2 {
    width: 2rem; height: 2rem;
    bottom: -1rem; left: -1rem;
    background-color: #fb923c;
    border-radius: 9999px;
}

/* --- Right Column: Text Content --- */
.content-column {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.content-header {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.content-title {
    font-size: 1.875rem;
    line-height: 2.25rem;
    font-weight: 700;
    color: #111827;
}
.content-paragraph {
    font-size: 1.125rem;
    line-height: 1.75rem;
    color: #4b5563;
}
.feature-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.feature-item {
    display: flex;
    align-items: center;
    gap: 0.75rem; /* MODIFIED: Reduced gap for better balance */
}
.feature-icon-wrapper {
    width: 2.5rem; /* MODIFIED: Reduced icon wrapper size */
    height: 2.5rem; /* MODIFIED: Reduced icon wrapper size */
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}
.feature-item:hover .feature-icon-wrapper {
    transform: scale(1.1);
}
.feature-icon-wrapper.red { background-color: #fee2e2; }
.feature-icon-wrapper.orange { background-color: #ffedd5; }

.feature-icon {
    font-size: 1.25rem; /* MODIFIED: Reduced icon font size */
}
.feature-icon.red { color: #dc2626; }
.feature-icon.orange { color: #ea580c; }

.feature-title {
    font-size: 18px; /* MODIFIED: Set font size to 18px as requested */
    font-weight: 600;
    color: #111827;
}

/* --- Responsive Styles --- */
@media (min-width: 768px) {
    .analytics-section {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }
    .container {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .dashboard-card { padding: 1rem; }
    .dashboard-title { font-size: 1rem; }
    .summary-label { font-size: 0.875rem; }
    .summary-value { font-size: 1.5rem; }
    .activity-item { padding: 1rem; }
    .activity-text .title { font-size: 1rem; }
    .activity-text .subtitle { font-size: 0.875rem; }
    .content-title { font-size: 2.25rem; }
    .content-paragraph { font-size: 1.25rem; }
    /* The rule for feature-title was here, but has been removed to keep the size at 18px */
}

@media (min-width: 1024px) {
    .grid-container {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4rem;
    }
    .content-column { order: 2; }
    .analytics-card-wrapper { order: 1; }
}/* End custom CSS */