// OT-MMO: estados (beneficios y perjuicios) estilo WoW. Lo coloca y lo llena game_estados.lua.
// Fila de beneficios y, debajo, la de perjuicios. Cada estado: celda de 32 px con una casilla de 30 con el ícono, el barrido del tiempo
// que ya pasó (oscurece desde arriba) y el tiempo que queda debajo.
EstadoIcono < UIWidget
  size: 32 45
  focusable: false

  UIWidget
    id: casilla
    anchors.top: parent.top
    anchors.horizontalCenter: parent.horizontalCenter
    size: 30 30
    background-color: $otmmo-bg-2
    border-width: 1
    border-color: $otmmo-border
    phantom: true

    UIWidget
      id: imagen
      anchors.fill: parent
      margin: 1
      image-smooth: true
      phantom: true

    UIItem
      id: objeto
      anchors.fill: parent
      margin: 1
      virtual: true
      visible: false
      phantom: true

    UIWidget
      id: barrido
      anchors.top: parent.top
      anchors.left: parent.left
      anchors.right: parent.right
      margin: 1 1 0 1
      height: 0
      background-color: #10161CD0
      phantom: true

    Label
      id: cuenta
      anchors.bottom: parent.bottom
      anchors.right: parent.right
      margin: 0 2 1 0
      ttf-font: geistmono
      ttf-font-size: 11
      ttf-stroke: 1 #10161C
      color: $otmmo-text
      text-auto-resize: true
      phantom: true

  Label
    id: tiempo
    anchors.top: casilla.bottom
    anchors.horizontalCenter: casilla.horizontalCenter
    margin-top: 2
    ttf-font: geistmono
    ttf-font-size: 11
    ttf-stroke: 1 #10161C
    color: $otmmo-text
    text-auto-resize: true
    phantom: true

UIWidget
  id: estados
  size: 30 45
  phantom: true
  focusable: false

  UIWidget
    id: beneficios
    anchors.top: parent.top
    anchors.left: parent.left
    size: 30 45
    phantom: true

  UIWidget
    id: perjuicios
    anchors.top: beneficios.bottom
    anchors.left: parent.left
    margin-top: 4
    size: 30 45
    phantom: true