Box < UIWidget
  border-width-top: 1
  border-color-top: black
  border-width-left: 1
  border-color-left: black
  border-width-bottom: 1
  border-color-bottom: gray
  border-width-right: 1
  border-color-right: gray
  image-smooth: true
  image-fixed-ratio: false

HistoryEntry < UIWidget
  anchors.top: parent.top
  anchors.right: parent.right
  margin-right: 8
  margin-top: 24
  size: 535 15
  background-color: #484848

  Label
    id: historyDate
    anchors.left: parent.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 3

  Label
    id: historyBalance
    anchors.left: parent.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 147

  Label
    id: historyDescription
    anchors.left: parent.left
    anchors.verticalCenter: parent.verticalCenter
    margin-left: 242

RowStore < StoreLightFlatPanel
  height: 78
  margin: 2
  border: 0 white

  $focus:
    border: 2 white

  Box
    id: image
    size: 64 64
    anchors.top: parent.top
    anchors.left: parent.left
    margin: 5 0 0 5

  Label
    id: lblName
    anchors.top: parent.top
    anchors.left: prev.right
    anchors.right: parent.right
    margin: 8 0 0 8
    text-auto-resize: true
    text-wrap: true
  Panel
    id: StackOffers
    margin-left: 31
    height: 80
    margin-top: 12
    anchors.top: prev.bottom
    anchors.left: image.right
    anchors.right: parent.right
    layout:
      type: grid
      cell-size: 145 20
      cell-spacing: 5
      flow: true
      fit-children: true

MenuCategoryStore < UIWidget
  height: 22
  image-source: images/longButton
  image-border: 5
  margin: 3
  image-clip: 0 0 166 22
  text-align: left
  text-offset: 25 0
  text-wrap: true
  icon-align: left
  icon-offset: 6 0

  $pressed:
    text-offset: 25 0

  $focus:
    image-clip: 0 22 166 22

StoreWindow
  size: 780 537
  !text: tr('Store')
  color: #909090
  visible: false
  @onEscape: modules.game_store.toggle()

  StoreButton
    id: btnClose
    size: 45 20
    anchors.bottom: parent.bottom
    anchors.right: parent.right
    !text: tr('Close')
    font: cipsoftFont
    @onClick: modules.game_store.toggle()

  StoreButton
    id: btnHistory
    size: 45 20
    anchors.bottom: parent.bottom
    anchors.right: btnClose.left
    margin-right: 5
    !text: tr('History')
    font: cipsoftFont
    @onClick: modules.game_store.toggleTransferHistory()

  Panel
    id: lblCoins
    size: 260 20
    anchors.bottom: parent.bottom
    anchors.left: parent.left
    margin-bottom: 2
    image-color: #1111118c
    focusable: false
    phantom: true
    image-source: /game_store/images/panel
    image-border: 3
    Label
      id: lblTibiaCoins
      anchors.bottom: parent.bottom
      anchors.left: parent.left
      focusable: false
      margin-left:22
      margin-bottom: 3
      text-auto-resize: true
      phantom: true

    UIWidget
      id: icono
      anchors.bottom: parent.bottom
      anchors.left: prev.right
      margin-left: 5
      margin-bottom: 3
      image-source: /images/ui/tibiaCoin
      focusable: false
      phantom: true

    Label
      id: lblTibiaTransfer
      anchors.bottom: parent.bottom
      anchors.left: prev.right
      text-auto-resize: true
      margin-left:5
      margin-bottom: 3 
      phantom: true

    UIWidget
      id: iconodos
      anchors.bottom: parent.bottom
      anchors.left: prev.right
      focusable: false
      phantom: true
      margin-left:5
      margin-bottom: 3
      image-source: images/icon-tibiacointransferable
    Label
      anchors.bottom: parent.bottom
      anchors.left: prev.right
      !text: tr(")")
      focusable: false
      phantom: true
      margin-left:5
      margin-bottom: 3 

  StoreButton
    id: btnCoins
    size: 64 20
    anchors.bottom: parent.bottom
    anchors.left: prev.right
    margin-left: 5
    margin-bottom: 2
    !tooltip: tr('Get Tibia Coins')
    image-color: green
    icon: /images/ui/tibiaCoin
    icon-align: center
    icon-offset: 10 -1
    text-offset: -10 0
    !text: tr('Get')
    font: cipsoftFont
    @onClick: modules.game_store.getCoinsWebsite()

    $pressed:
      text-offset: -18 0
      icon-offset: 10 0

  StoreButton
    id: transferPoints
    anchors.top: btnCoins.top
    !tooltip: tr('Transfer Coins')
    anchors.left: btnCoins.right
    margin-left: 5
    icon-align: center
    icon-source: images/iconTransfer
    size: 64 20

  StoreButton
    anchors.top: transferPoints.top
    !tooltip: tr('Setup up an auction to sell you currents characters.')
    anchors.left: transferPoints.right
    margin-left: 5
    icon-align: center
    icon-source: images/icon-trade
    size: 64 20

  HorizontalSeparator
    anchors.bottom: prev.top
    anchors.left: parent.left
    anchors.right: parent.right
    margin-bottom: 8

  UIScrollArea
    id: listCategory
    size: 190 450
    anchors.top: parent.top
    anchors.left: parent.left
    anchors.bottom: prev.top
    image-source: images/panel
    image-border: 3
    auto-focus: none
    layout: verticalBox
    margin-bottom: 8
    padding: 5

  TextEdit
    id: SearchEdit
    anchors.bottom: listCategory.bottom
    anchors.left: parent.left
    margin-left: 5
    margin-bottom: 10
    height: 17
    width: 180
    placeholder: Type to search
    placeholder-color: #6E706F

  UIWidget
    id: SearchClearButton
    anchors.right: SearchEdit.right
    anchors.top: SearchEdit.top
    margin-top: 1
    margin-right: 2
    image-source: /game_cyclopedia/images/button_clear_search
    image-color: white
    opacity: 0.8
    @onClick: modules.game_store.search()
    $hover:
      opacity: 1.0
      image-color: white
    $pressed:
      opacity: 1.0
      image-color: gray

  StoreLightFlatPanel
    id: panelItem
    anchors.top: parent.top
    anchors.left: listCategory.right
    anchors.right: parent.right
    anchors.bottom: listCategory.bottom
    margin-left: 8

    padding: 6

    UIWidget
      id: comboBoxContainer
      height: 20
      anchors.top: parent.top
      anchors.left: parent.left
      anchors.right: parent.right
      layout: horizontalBox
      margin-right:22
      QtComboBox
        id: showAll
        width: 260
        height: 20
        mouse-scroll: false

      QtComboBox
        id: MostPopularFirst
        width: 260
        margin-left: 12
        height: 20
        mouse-scroll: false

    UIScrollArea
      id: listProduct
      size: 260 407
      anchors.top: comboBoxContainer.bottom
      anchors.left: parent.left
      anchors.bottom: parent.bottom
      vertical-scrollbar: scrollList
      image-source: images/panel
      image-border: 3
      layout: verticalBox
      padding: 5
      margin-top:5
      auto-focus: none
    
    VerticalScrollBar
      id: scrollList
      anchors.top: listProduct.top
      anchors.bottom: listProduct.bottom
      anchors.left: listProduct.right
      step: 14
      pixels-scroll: true

    Label
      id: lblName
      anchors.top: comboBoxContainer.bottom
      anchors.horizontalCenter: parent.horizontalCenter
      margin-left: 140
      text-wrap: true
      text-auto-resize: true
      text-align: center
      text: Prismatic Unicorn
      margin-top:5

    Box
      id: image
      size: 96 96
      anchors.top: lblName.bottom
      anchors.left: scrollList.right
      margin: 8 0 0 8

    Panel
      id: StackOffers
      anchors.top: prev.top
      anchors.left: prev.right
      anchors.right: parent.right
      margin-left: 10
      layout:
        type: grid
        cell-size: 145 50
        cell-spacing: 3
        flow: true
        fit-children: true

    UIWidget
      id: descriptionPanel
      image-source: /game_store/images/panel_flat
      image-border: 1
      clipping: true
      anchors.top: image.bottom
      anchors.left: scrollList.right
      anchors.right: parent.right
      anchors.bottom: scrollList.bottom
      margin-left: 8
      margin-top: 7

      VerticalScrollBar
        id: descriptionScrollbar
        anchors.top: parent.top
        anchors.bottom: parent.bottom
        anchors.right: parent.right
        step: 14
        pixels-scroll: true

      UIScrollArea
        id: descriptionScrollArea
        anchors.top: parent.top
        anchors.bottom: parent.bottom
        anchors.left: parent.left
        anchors.right: descriptionScrollbar.left
        vertical-scrollbar: descriptionScrollbar
        padding: 3
        layout: verticalBox

  QtPanel
    id: transferHistory
    anchors.top: parent.top
    anchors.left: listCategory.right
    anchors.right: parent.right
    anchors.bottom: listCategory.bottom
    margin-left:10
    visible: false

    Panel
      id: historyPanel
      anchors.top: parent.top
      anchors.left: parent.left
      anchors.right: parent.right
      anchors.bottom: parent.bottom
      margin-bottom: 22
      background-color: #363636
      border: 1 black
      layout:
        type: verticalBox

    Button
      id: btnNextPage
      anchors.bottom: parent.bottom
      anchors.right: parent.right
      margin-bottom:-5
      !text: tr('Next Page')
      @onClick: modules.game_store.requestTransactionHistory(self)

    Label
      id: lblPage
      anchors.bottom: parent.bottom
      anchors.horizontalCenter: parent.horizontalCenter
      !text: tr('Page 1 / 4')

    Button
      id: btnPrevPage
      anchors.bottom: parent.bottom
      anchors.left: parent.left
      margin-bottom:-5
      !text: tr('Prev Page')
      @onClick: modules.game_store.requestTransactionHistory(self)

  StoreLightFlatPanel
    id: HomePanel
    anchors.top: parent.top
    anchors.left: listCategory.right
    anchors.right: parent.right
    anchors.bottom: listCategory.bottom
    margin-left: 8
    padding: 6
    UIWidget
      id: HomeImagen
      height: 20
      size: 530 202
      anchors.top: parent.top
      anchors.left: parent.left
      anchors.right: parent.right
      margin-right:10
    UIButton
      id: prevImagen
      anchors.verticalCenter: prev.verticalCenter
      anchors.left: prev.left
      size: 16 29
      image-source: images/button-featured-offers-left
      margin-left: 15
      @onClick: modules.game_store.changeImagenHome(self:getId())
      $pressed :
        image-source: images/button-featured-offers-left-highlight
      $hover:
        image-source: images/button-featured-offers-left-highlight


    UIButton
      id: nextImagen
      anchors.verticalCenter: prev.verticalCenter
      anchors.right: HomeImagen.right
      size: 16 29
      margin-right: 15
      image-source: images/button-featured-offers-right
      @onClick: modules.game_store.changeImagenHome(self:getId())
      $pressed:
        image-source: images/button-featured-offers-right-highlight
      $hover:
        image-source: images/button-featured-offers-right-highlight

    MiniPanel
      id:HomeRecentlyAdded
      anchors.top: HomeImagen.bottom
      anchors.left: parent.left
      anchors.bottom: parent.bottom
      size: 530 407
      margin-top:10
      text: Recently Added
      UIScrollArea
        id: HomeProductos
        size: 505 190
        vertical-scrollbar: scrollList2
        image-border: 3
        layout: verticalBox
        margin-right:10


        auto-focus: none
        anchors.fill: parent
        layout:
          type: grid
          cell-size: 254 94
          flow: true

      
      VerticalScrollBar
        id: scrollList2
        anchors.top: HomeProductos.top
        anchors.bottom: HomeProductos.bottom
        anchors.left: HomeProductos.right
        step: 14
        pixels-scroll: true