<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:background="#121218">
 <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
     android:orientation="vertical" android:padding="16dp">

   <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
       android:orientation="horizontal" android:gravity="center_vertical">
     <ImageButton android:id="@+id/btnBack" android:layout_width="40dp" android:layout_height="40dp"
         android:src="@android:drawable/ic_menu_revert" android:background="?attr/selectableItemBackgroundBorderless"
         app:tint="#FFFFFF" xmlns:app="http://schemas.android.com/apk/res-auto"/>
     <TextView android:layout_width="0dp" android:layout_height="wrap_content"
         android:layout_weight="1" android:text="Average Call Duration of Connected Calls"
         android:textSize="18sp" android:textStyle="bold" android:textColor="#FFFFFF"
         android:layout_marginStart="8dp"/>
   </LinearLayout>

   <HorizontalScrollView android:layout_width="match_parent" android:layout_height="wrap_content"
       android:scrollbars="none" android:layout_marginTop="14dp">
     <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal">
       <TextView android:id="@+id/chipFilter" android:layout_width="wrap_content" android:layout_height="wrap_content"
           android:textColor="#2563EB" android:background="#1E293B"
           android:paddingHorizontal="12dp" android:paddingVertical="8dp"/>
       <TextView android:id="@+id/chipRange" android:layout_width="wrap_content" android:layout_height="wrap_content"
           android:textColor="#2563EB" android:background="#1E293B"
           android:paddingHorizontal="12dp" android:paddingVertical="8dp" android:layout_marginStart="8dp"/>
       <TextView android:id="@+id/chipExNo" android:layout_width="wrap_content" android:layout_height="wrap_content"
           android:textColor="#2563EB" android:background="#1E293B"
           android:paddingHorizontal="12dp" android:paddingVertical="8dp" android:layout_marginStart="8dp"/>
     </LinearLayout>
   </HorizontalScrollView>

   <TextView android:id="@+id/tvRange" android:layout_width="wrap_content" android:layout_height="wrap_content"
       android:textColor="#94A3B8" android:layout_marginTop="10dp" android:layout_marginBottom="14dp" android:textSize="13sp"/>

   <!-- Per-day card -->
   <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
       android:orientation="vertical" android:background="#1E1E2E" android:padding="18dp"
       android:layout_marginBottom="16dp">
     <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal">
       <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1"
           android:text="Average Duration per Day\nof Connected Call" android:textColor="#FFFFFF" android:textSize="15sp" android:textStyle="bold"/>
       <TextView android:id="@+id/tvPerDayBig" android:layout_width="wrap_content" android:layout_height="wrap_content"
           android:textColor="#FFFFFF" android:textSize="16sp" android:textStyle="bold"/>
     </LinearLayout>
     <View android:layout_width="match_parent" android:layout_height="1dp" android:background="#33FFFFFF" android:layout_marginVertical="12dp"/>
     <LinearLayout android:id="@+id/rowsPerDay" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"/>
   </LinearLayout>

   <!-- Per-call card -->
   <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content"
       android:orientation="vertical" android:background="#1E1E2E" android:padding="18dp">
     <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal">
       <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1"
           android:text="Average Duration per Call\nof Connected Call" android:textColor="#FFFFFF" android:textSize="15sp" android:textStyle="bold"/>
       <TextView android:id="@+id/tvPerCallBig" android:layout_width="wrap_content" android:layout_height="wrap_content"
           android:textColor="#FFFFFF" android:textSize="16sp" android:textStyle="bold"/>
     </LinearLayout>
     <View android:layout_width="match_parent" android:layout_height="1dp" android:background="#33FFFFFF" android:layout_marginVertical="12dp"/>

     <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:paddingBottom="8dp">
       <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="2" android:text=""/>
       <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="No of Calls" android:textColor="#94A3B8" android:textSize="11sp" android:gravity="end"/>
       <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="Duration" android:textColor="#94A3B8" android:textSize="11sp" android:gravity="end"/>
       <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:text="Avg. Duration" android:textColor="#94A3B8" android:textSize="11sp" android:gravity="end"/>
     </LinearLayout>
     <LinearLayout android:id="@+id/rowsPerCall" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"/>
   </LinearLayout>
 </LinearLayout>
</ScrollView>
