<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    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"
    android:theme="@style/Theme.Ecommerce_serang"
    tools:context=".ui.product.DetailProductActivity">

    <!-- Main Content -->
    <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <include
                android:id="@+id/searchContainer"
                layout="@layout/view_search"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                app:layout_constraintTop_toTopOf="parent" />

            <!-- Product Image -->
            <ImageView
                android:id="@+id/ivProductImage"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:scaleType="centerCrop"
                android:contentDescription="@string/product_image"
                tools:src="@drawable/placeholder_image" />

            <!-- Product Price and Name -->
            <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="0dp">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:padding="16dp">

                    <TextView
                        android:id="@+id/tvPrice"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:textColor="@color/black"
                        android:textSize="20sp"
                        android:textStyle="bold"
                        tools:text="Rp65.000" />

                    <TextView
                        android:id="@+id/tvProductName"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="4dp"
                        android:textColor="@color/black"
                        android:textSize="16sp"
                        tools:text="Keripik Ikan Tenggiri" />

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="8dp"
                        android:gravity="center_vertical"
                        android:orientation="horizontal">

                        <TextView
                            android:id="@+id/tvSold"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:textColor="@color/soft_gray"
                            android:textSize="14sp"
                            tools:text="@string/item_sold" />

                        <View
                            android:layout_width="16dp"
                            android:layout_height="0dp" />

                        <ImageView
                            android:id="@+id/star_product"
                            android:layout_width="16dp"
                            android:layout_height="16dp"
                            android:contentDescription="@string/rating"
                            android:src="@drawable/baseline_star_24"/>

                        <TextView
                            android:id="@+id/tvRating"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginStart="4dp"
                            android:textSize="14sp"
                            tools:text="4.5" />
                    </LinearLayout>
                </LinearLayout>
            </androidx.cardview.widget.CardView>
            <com.google.android.material.divider.MaterialDivider
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <!-- Buyer Reviews Section -->
            <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="0dp">

                <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">

                        <TextView
                            android:layout_width="0dp"
                            android:layout_height="wrap_content"
                            android:layout_weight="1"
                            android:text="@string/ulasan_pembeli"
                            android:textColor="@color/black"
                            android:textSize="16sp"
                            android:textStyle="bold" />

                        <TextView
                            android:id="@+id/tvViewAllReviews"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/lihat_semua"
                            android:textColor="@color/blue_500"
                            android:textSize="14sp" />
                    </LinearLayout>

                    <!-- RecyclerView for Reviews -->
                    <androidx.recyclerview.widget.RecyclerView
                        android:id="@+id/recyclerViewReviews"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="4dp"
                        android:layout_marginBottom="8dp"
                        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
                        tools:itemCount="1"
                        tools:listitem="@layout/item_review" />
                </LinearLayout>
            </androidx.cardview.widget.CardView>

            <com.google.android.material.divider.MaterialDivider
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <!-- Product Details Section -->
            <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="0dp">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:padding="16dp">

                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="@string/detail_produk"
                        android:textColor="@color/black"
                        android:textSize="16sp"
                        android:textStyle="bold" />

                    <TableLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="8dp">

                        <TableRow
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_marginBottom="8dp">

                            <TextView
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:text="@string/berat_produk"
                                android:fontFamily="@font/dmsans_semibold"
                                android:textSize="14sp" />

                            <TextView
                                android:id="@+id/tvWeight"
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:textColor="@color/blue_500"
                                android:textSize="14sp"
                                tools:text="200 gram" />
                        </TableRow>

                        <TableRow
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_marginBottom="8dp">

                            <TextView
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:text="@string/stock_product"
                                android:fontFamily="@font/dmsans_semibold"
                                android:textSize="14sp" />

                            <TextView
                                android:id="@+id/tvStock"
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:textColor="@color/blue_500"
                                android:textSize="14sp"
                                tools:text="100 buah" />
                        </TableRow>

                        <TableRow
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content">

                            <TextView
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:text="@string/kategori"
                                android:fontFamily="@font/dmsans_semibold"
                                android:textSize="14sp" />

                            <TextView
                                android:id="@+id/tvCategory"
                                android:layout_width="0dp"
                                android:layout_height="wrap_content"
                                android:layout_weight="1"
                                android:textColor="@color/blue_500"
                                android:textSize="14sp"
                                tools:text="Makanan Ringan" />
                        </TableRow>
                    </TableLayout>
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:text="@string/deskripsi_produk"
                        android:textColor="@color/black"
                        android:textSize="16sp"
                        android:layout_marginTop="8dp"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/tvDescription"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="8dp"
                        android:textColor="@color/black"
                        android:textSize="14sp"
                        tools:text="Terbuat dari tepung dan ikan tenggiri asli Serang Banten. Tahan selama 25 hari." />
                </LinearLayout>
            </androidx.cardview.widget.CardView>

            <!-- Product Description Section -->
            <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="0dp">

            </androidx.cardview.widget.CardView>
            <com.google.android.material.divider.MaterialDivider
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <!-- Seller Info Section -->
            <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="0dp">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal"
                    android:padding="16dp">

                    <de.hdodenhof.circleimageview.CircleImageView
                        android:id="@+id/ivSellerImage"
                        android:layout_width="48dp"
                        android:layout_height="48dp"
                        android:contentDescription="@string/seller_image"
                        tools:src="@drawable/placeholder_image" />

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="12dp"
                        android:orientation="vertical">

                        <TextView
                            android:id="@+id/tvSellerName"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:textColor="@color/black"
                            android:textSize="16sp"
                            android:textStyle="bold"
                            tools:text="SnackEnak" />

                        <TextView
                            android:id="@+id/tvSellerLocation"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:fontFamily="@font/dmsans_semibold"
                            android:textSize="14sp"
                            tools:text="Jakarta Selatan" />

                        <RatingBar
                            android:id="@+id/ratingBarSeller"
                            style="?android:attr/ratingBarStyleSmall"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginTop="4dp"
                            android:isIndicator="true"
                            android:numStars="5"
                            android:rating="5"
                            android:stepSize="0.1" />

                        <TextView
                            android:id="@+id/tvSellerRating"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginTop="2dp"
                            android:textSize="14sp"
                            android:textStyle="bold"
                            tools:text="5.0" />
                    </LinearLayout>
                </LinearLayout>
            </androidx.cardview.widget.CardView>

            <com.google.android.material.divider.MaterialDivider
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <!-- Other Products Section -->
            <androidx.cardview.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:cardElevation="0dp">

                <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">

                        <TextView
                            android:layout_width="0dp"
                            android:layout_height="wrap_content"
                            android:layout_weight="1"
                            android:text="@string/produk_lainnya"
                            android:textColor="@color/black"
                            android:textSize="16sp"
                            android:textStyle="bold" />

                        <TextView
                            android:id="@+id/tvViewAllProducts"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/lihat_semua"
                            android:textColor="@color/blue_500"
                            android:textSize="14sp" />
                    </LinearLayout>

                    <!-- RecyclerView for Other Products -->
                    <androidx.recyclerview.widget.RecyclerView
                        android:id="@+id/recyclerViewOtherProducts"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="16dp"
                        android:layout_marginBottom="8dp"
                        android:orientation="horizontal"
                        app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
                        tools:itemCount="3"
                        tools:listitem="@layout/item_related_product" />
                </LinearLayout>
            </androidx.cardview.widget.CardView>

            <!-- Bottom spacing -->
            <View
                android:layout_width="match_parent"
                android:layout_height="80dp" />
        </LinearLayout>
    </androidx.core.widget.NestedScrollView>

    <ProgressBar
        android:id="@+id/progress_bar_detail_prod"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="gone"
        android:layout_gravity="center"/>

    <!-- Bottom Action Bar -->
    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottomAppBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:contentInsetStart="0dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:orientation="horizontal">

            <com.google.android.material.button.MaterialButton
                android:id="@+id/btnChat"
                style="@style/Widget.MaterialComponents.Button.OutlinedButton"
                android:layout_width="48dp"
                android:layout_height="match_parent"
                android:layout_margin="4dp"
                android:insetTop="0dp"
                android:insetBottom="0dp"
                app:cornerRadius="4dp"
                app:icon="@drawable/baseline_chat_24"
                android:text="chat"
                app:iconGravity="end"
                app:iconTint="@color/blue_500" />

            <com.google.android.material.button.MaterialButton
                android:id="@+id/btnAddToCart"
                style="@style/Widget.MaterialComponents.Button.OutlinedButton"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_margin="4dp"
                android:layout_weight="1"
                android:insetTop="0dp"
                android:insetBottom="0dp"
                android:text="@string/add_to_cart"
                android:textColor="@color/blue_500"
                app:cornerRadius="4dp"
                app:icon="@drawable/baseline_add_24"
                app:iconGravity="textStart"
                app:iconTint="@color/blue_500"
                app:strokeColor="@color/blue_500" />

            <com.google.android.material.button.MaterialButton
                android:id="@+id/btnBuyNow"
                style="@style/Widget.MaterialComponents.Button"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_margin="4dp"
                android:layout_weight="1"
                android:backgroundTint="@color/blue_500"
                android:insetTop="0dp"
                android:insetBottom="0dp"
                android:text="@string/beli_sekarang"
                android:textColor="@color/white"
                app:cornerRadius="4dp" />
        </LinearLayout>
    </com.google.android.material.bottomappbar.BottomAppBar>
</androidx.coordinatorlayout.widget.CoordinatorLayout>