<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextArea?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>

<BorderPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="800.0" prefWidth="1200.0" xmlns="http://javafx.com/javafx/22" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.example.ShopController">
   <top>
      <HBox id="header" alignment="CENTER" prefHeight="60.0" prefWidth="631.0" spacing="20.0" styleClass="header" BorderPane.alignment="CENTER">
         <children>
            <!-- Main Title -->
            <Label id="mainTitle" styleClass="mainTitle" text="Bookshop - Fantasy Brigade" />
            
            <!-- Spacer for alignment -->
            <Pane HBox.hgrow="ALWAYS" />
            
            <!-- Buttons -->
            <Button id="cartBtn" fx:id="cartBtn" mnemonicParsing="false" onAction="#handleCartButton" styleClass="cartBtn" text="Cart" />
            <Button id="loginBtn" fx:id="loginBtn" mnemonicParsing="false" onAction="#handleLoginButton" styleClass="loginBtn" text="Login" />
         </children>
         <padding>
            <Insets bottom="10.0" left="20.0" right="20.0" top="10.0" />
         </padding>
      </HBox>
   </top>
   <center>
      <GridPane id="main" styleClass="main" BorderPane.alignment="CENTER">
         <columnConstraints>
            <ColumnConstraints hgrow="SOMETIMES" minWidth="100.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="100.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="100.0" prefWidth="100.0" />
            <ColumnConstraints hgrow="SOMETIMES" minWidth="100.0" prefWidth="100.0" />
         </columnConstraints>
         <rowConstraints>
            <RowConstraints minHeight="30.0" prefHeight="30.0" vgrow="SOMETIMES" />
            <RowConstraints minHeight="30.0" prefHeight="30.0" vgrow="SOMETIMES" />
         </rowConstraints>
         <BorderPane.margin>
            <Insets />
         </BorderPane.margin>
         <children>
            <!-- Card 1: Lord of the Rings -->
            <VBox id="cardDiv1" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="Lord of the Rings" />
                  <Button id="cardBtn" fx:id="cardBtn1" mnemonicParsing="false" onAction="#handleAddToCartButton1" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A high-fantasy epic by J.R.R. Tolkien. The story follows the journey of Frodo Baggins and his companions as they attempt to destroy the One Ring and defeat the Dark Lord Sauron." wrapText="true">
                     <opaqueInsets>
                        <Insets />
                     </opaqueInsets>
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin></TextArea>
               </children>
            </VBox>
            <!-- Card 2: The Wheel of Time -->
            <VBox id="cardDiv2" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv" GridPane.columnIndex="1">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="The Wheel of Time" />
                  <Button id="cardBtn" fx:id="cardBtn2" mnemonicParsing="false" onAction="#handleAddToCartButton2" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A sprawling epic fantasy series by Robert Jordan. It follows the journey of Rand al'Thor as he struggles to control his newfound powers and faces the ultimate battle between light and shadow." wrapText="true">
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin></TextArea>
               </children>
            </VBox>
            <!-- Card 3: The Chronicles of Narnia -->
            <VBox id="cardDiv3" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv" GridPane.columnIndex="2">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="The Chronicles of Narnia" />
                  <Button id="cardBtn" fx:id="cardBtn3" mnemonicParsing="false" onAction="#handleAddToCartButton3" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A classic series by C.S. Lewis. The Chronicles of Narnia explores the adventures of children who discover a magical world, Narnia, and become part of its struggle against the forces of evil." wrapText="true">
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin></TextArea>
               </children>
            </VBox>
            <!-- Card 4: The Earthsea Cycle -->
            <VBox id="cardDiv4" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv" GridPane.columnIndex="3">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="The Earthsea Cycle" />
                  <Button id="cardBtn" fx:id="cardBtn4" mnemonicParsing="false" onAction="#handleAddToCartButton4" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A fantasy series by Ursula K. Le Guin. The Earthsea Cycle follows Ged, a young wizard, as he embarks on a journey of self-discovery and learns the true meaning of power." wrapText="true">
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin></TextArea>
               </children>
            </VBox>
            <!-- Card 5: The First Law Trilogy -->
            <VBox id="cardDiv5" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv" GridPane.rowIndex="1">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="The First Law Trilogy" />
                  <Button id="cardBtn" fx:id="cardBtn5" mnemonicParsing="false" onAction="#handleAddToCartButton5" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A dark fantasy series by Joe Abercrombie. It focuses on a group of characters navigating a brutal world, where honor and loyalty are tested by betrayal and violence." wrapText="true">
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin></TextArea>
               </children>
            </VBox>
            <!-- Card 6: The Kingkiller Chronicle -->
            <VBox id="cardDiv6" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv" GridPane.columnIndex="1" GridPane.rowIndex="1">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="The Kingkiller Chronicle" />
                  <Button id="cardBtn" fx:id="cardBtn6" mnemonicParsing="false" onAction="#handleAddToCartButton6" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A tale of magic and music by Patrick Rothfuss. The series follows Kvothe, a legendary figure, as he recounts his life story filled with adventures, heartbreaks, and personal struggles." wrapText="true">
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin></TextArea>
               </children>
            </VBox>
            <!-- Card 7: The Mistborn Series -->
            <VBox id="cardDiv7" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv" GridPane.columnIndex="2" GridPane.rowIndex="1">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="The Mistborn Series" />
                  <Button id="cardBtn" fx:id="cardBtn7" mnemonicParsing="false" onAction="#handleAddToCartButton7" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A magic-based series by Brandon Sanderson. Set in a world where ash falls from the sky, the series follows Vin, a young woman who discovers her incredible magical abilities and joins a group of rebels." wrapText="true">
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin></TextArea>
               </children>
            </VBox>
            <!-- Card 8: The Stormlight Archive -->
            <VBox id="cardDiv8" prefHeight="200.0" prefWidth="100.0" styleClass="cardDiv" GridPane.columnIndex="3" GridPane.rowIndex="1">
               <children>
                  <Label id="cardTitel" styleClass="cardTitel" text="The Stormlight Archive" />
                  <Button id="cardBtn" fx:id="cardBtn8" mnemonicParsing="false" onAction="#handleAddToCartButton8" styleClass="cardBtn" text="Add to Cart" />
                  <TextArea id="cardText" editable="false" prefRowCount="4" styleClass="cardText" text="Description: A high-fantasy epic by Brandon Sanderson. The series explores the lives of several characters on the Shattered Plains, as they fight to survive and uncover a dark secret that threatens their world." wrapText="true">
                     <VBox.margin>
                        <Insets top="10.0" />
                     </VBox.margin>
                  </TextArea>
               </children>
            </VBox>
         </children>
      </GridPane>
   </center>
   <bottom>
      <VBox id="footer" prefHeight="188.0" prefWidth="1200.0" styleClass="footer" BorderPane.alignment="CENTER">
         <children>
            <HBox id="footerLinks" alignment="TOP_CENTER" prefHeight="100.0" prefWidth="200.0">
               <children>
                  <VBox id="quickLinks" alignment="TOP_LEFT" prefHeight="145.0" prefWidth="470.0" spacing="10.0">
                     <children>
                        <Label id="footerText" prefHeight="25.0" prefWidth="226.0" styleClass="footerHeading" text="Quick Links" />
                        <Label id="footerHome" styleClass="footerText" text="Home" />
                        <Label id="footerAbout" styleClass="footerText" text="About Us" />
                        <Label id="footerContact" styleClass="footerText" text="Contact" />
                     </children>
                  </VBox>
                  <VBox id="contactUs" prefHeight="145.0" prefWidth="583.0" spacing="10.0">
                     <children>
                        <Label id="footerHeading2" prefWidth="534.0" styleClass="footerHeading" text="Contact Us" />
                        <Label id="footerEmail" styleClass="footerText" text="Email: info@example.com" />
                        <Label id="footerPhone" styleClass="footerText" text="Phone: +1 123 456 7890" />
                     </children>
                  </VBox>
                  <VBox id="followUs" alignment="TOP_RIGHT" spacing="10.0">
                     <children>
                        <Label id="footerHeading3" styleClass="footerHeading" text="Follow Us" />
                        <Label id="footerFacebook" styleClass="footerLink" text="Facebook" />
                        <Label id="footerBluesky" styleClass="footerLink" text="Bluesky" />
                        <Label id="footerInstagram" styleClass="footerLink" text="Instagram" />
                     </children>
                  </VBox>
               </children>
            </HBox>
            <VBox id="footerCopy" alignment="BOTTOM_CENTER" prefHeight="68.0" prefWidth="1170.0" spacing="10.0">
               <children>
                  <Label id="footerCopyText" alignment="CENTER" contentDisplay="CENTER" styleClass="footerCopy" text="© 2024 My Website. All rights reserved." />
               </children>
            </VBox>
         </children>
      </VBox>
   </bottom>
</BorderPane>
