<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".home.MangaFragment">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipChildren="false"
        android:clipToPadding="false">

        <!-- Add a LinearLayout or other ViewGroup as a direct child of SwipeRefreshLayout -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <LinearLayout
                android:id="@+id/animeTitleContainer"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="32dp"
                android:orientation="horizontal">

                <com.google.android.material.textfield.TextInputLayout
                    android:id="@+id/offlineMangaSearchBar"
                    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu"
                    android:layout_width="0dp"
                    android:layout_height="56dp"
                    android:layout_marginEnd="8dp"
                    android:layout_weight="1"
                    android:fontFamily="@font/poppins_bold"
                    android:hint="Something"
                    android:textColorHint="@color/bg_opp"
                    android:transitionName="@string/search"
                    app:boxBackgroundColor="?attr/colorPrimaryContainer"
                    app:boxCornerRadiusBottomEnd="28dp"
                    app:boxCornerRadiusBottomStart="28dp"
                    app:boxCornerRadiusTopEnd="28dp"
                    app:boxCornerRadiusTopStart="28dp"
                    app:boxStrokeColor="@color/text_input_layout_stroke_color"
                    app:endIconDrawable="@drawable/ic_round_search_24"
                    app:endIconTint="@color/bg_opp"
                    app:hintAnimationEnabled="true">

                    <AutoCompleteTextView
                        android:id="@+id/animeSearchBarText"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:fontFamily="@font/poppins_bold"
                        android:imeOptions="actionSearch"
                        android:inputType="textPersonName"
                        android:padding="8dp"
                        android:selectAllOnFocus="true"
                        android:textSize="14sp"
                        tools:ignore="LabelFor,TextContrastCheck" />
                </com.google.android.material.textfield.TextInputLayout>

                <com.google.android.material.card.MaterialCardView
                    android:id="@+id/offlineMangaAvatarContainer"
                    android:layout_width="52dp"
                    android:layout_height="match_parent"
                    android:layout_marginTop="4dp"
                    app:cardBackgroundColor="?attr/colorPrimaryContainer"
                    app:cardCornerRadius="26dp"
                    app:strokeColor="@color/text_input_layout_stroke_color">

                    <com.google.android.material.imageview.ShapeableImageView
                        android:id="@+id/offlineMangaUserAvatar"
                        android:layout_width="52dp"
                        android:layout_height="52dp"
                        android:scaleType="center"
                        android:tint="@color/bg_opp"
                        app:srcCompat="@drawable/ic_round_settings_24"
                        tools:ignore="ContentDescription,ImageContrastCheck" />

                </com.google.android.material.card.MaterialCardView>

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_vertical"
                android:orientation="horizontal"
                android:paddingLeft="32dp"
                android:paddingRight="32dp">

                <TextView
                    android:id="@+id/total"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:fontFamily="@font/poppins_bold"
                    android:gravity="center_vertical"
                    android:hint="Type"
                    android:textSize="14sp"
                    tools:ignore="HardcodedText,RtlSymmetry" />

                <ImageView
                    android:id="@+id/downloadedList"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    android:alpha="0.33"
                    android:padding="8dp"
                    app:srcCompat="@drawable/ic_round_view_list_24"
                    app:tint="?attr/colorOnBackground"
                    tools:ignore="ContentDescription,ImageContrastCheck" />

                <ImageView
                    android:id="@+id/downloadedGrid"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_gravity="end"
                    android:alpha="0.33"
                    android:padding="8dp"
                    app:srcCompat="@drawable/ic_round_grid_view_24"
                    app:tint="?attr/colorOnBackground"
                    tools:ignore="ContentDescription,ImageContrastCheck" />

            </LinearLayout>
            <!-- This TextView might overlap with GridView if GridView has items -->
            <TextView
                android:id="@+id/noMangaOffline"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="@string/no_offline_manga_found"
                android:textColor="?attr/colorOnSurface"
                android:textSize="18sp"
                android:visibility="gone" />
            <!-- for large view  -->
            <GridView
                android:id="@+id/gridView"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:gravity="center"
                android:horizontalSpacing="10dp"
                android:numColumns="1"
                android:paddingStart="25dp"
                android:paddingEnd="25dp"
                android:scrollbars="none"
                android:verticalSpacing="20dp"
                android:visibility="gone" />
            <!-- for compact view -->
            <GridView
                android:id="@+id/gridView1"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:columnWidth="138dp"
                android:gravity="center"
                android:horizontalSpacing="-30dp"
                android:numColumns="auto_fit"
                android:paddingStart="-10dp"
                android:paddingEnd="-10dp"
                android:scrollbars="none"
                android:verticalSpacing="20dp"
                android:visibility="gone" />
        </LinearLayout>
    </FrameLayout>

    <androidx.cardview.widget.CardView
        android:id="@+id/mangaPageScrollTop"
        android:layout_width="48dp"
        android:layout_height="48dp"
        android:layout_gravity="bottom|center_horizontal"
        android:layout_marginBottom="16dp"
        app:cardBackgroundColor="?android:colorBackground"
        app:cardCornerRadius="24dp"
        app:contentPadding="12dp">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:rotation="90"
            app:srcCompat="@drawable/ic_round_arrow_back_ios_new_24"
            app:tint="?attr/colorOnSurface"
            tools:ignore="ContentDescription" />
    </androidx.cardview.widget.CardView>

</FrameLayout>
