/// Map deep get
/// @author Kitty Giraudel
/// @access public
/// @param {Map} $map - Map
/// @param {Arglist} $keys - Key chain
/// @return {*} - Desired value
@function map-deep-get($map, $keys...) {
    @each $key in $keys {
        $map: map-get($map, $key);
    }
    @return $map;
}


$color: (
  "baseline": (
    "primary": #00426f,
    "primary-variant": #1a5c89,
    "secondary": #00426f,
    "secondary-variant": #1a5c89,
    "background": #ffffff,
    "surface": #ffffff,
    "error": #b00020
  ),
  "social-area": (
    "base": #d6ae86,
    "darken": #C98536,
    "lighten": #EAE2DB
  ),
  "service": (
    "corpus-analysis": (
      "base": #aa9cc9,
      "darken": #6b3f89,
      "lighten": #ebe8f6
    ),
    "file-setup-pipeline": (
      "base": #d5dc95,
      "darken": #a1b300,
      "lighten": #f2f3e1
    ),
    "spacy-nlp-pipeline": (
      "base": #98acd2,
      "darken": #0064a3,
      "lighten": #e5e8f5
    ),
    "tesseract-ocr-pipeline": (
      "base": #a9d8c8,
      "darken": #00a58b,
      "lighten": #e7f4f1
    ),
    "transkribus-htr-pipeline": (
      "base": #607d8b,
      "darken": #37474f,
      "lighten": #cfd8dc
    )
  ),
  "status": (
    "corpus": (
      "UNPREPARED": #9e9e9e,
      "QUEUED": #2196f3,
      "BUILDING": #ffc107,
      "BUILT": #4caf50,
      "FAILED": #f44336,
      "STARTING_ANALYSIS_SESSION": #2196f3,
      "RUNNING_ANALYSIS_SESSION": #4caf50,
      "CANCELING_ANALYSIS_SESSION": #ff5722
    ),
    "job": (
      "INITIALIZING": #9e9e9e,
      "SUBMITTED": #9e9e9e,
      "QUEUED": #2196f3,
      "RUNNING": #ffc107,
      "CANCELING": #ff5722,
      "CANCELED": #ff5722,
      "COMPLETED": #4caf50,
      "FAILED": #f44336
    )
  ),
  "s-attr": (
    "PERSON": #a6e22d,
    "PER": #a6e22d,
    "NORP": #ef60b4,
    "FACILITY": #43c6fc,
    "ORG": #43c6fc,
    "GPE": #fd9720,
    "LOC": #fd9720,
    "PRODUCT": #a99dfb,
    "MISC": #a99dfb,
    "EVENT": #fc0,
    "WORK_OF_ART": #fc0,
    "LANGUAGE": #fc0,
    "DATE": #2fbbab,
    "TIME": #2fbbab,
    "PERCENT": #bbb,
    "MONEY": #bbb,
    "QUANTITY": #bbb,
    "ORDINAL": #bbb,
    "CARDINAL": #bbb
  )
);

@each $key, $color-code in map-get($color, "baseline") {
  .#{$key}-color {
    background-color: $color-code !important;
  }

  .#{$key}-color-border {
    border-color: $color-code !important;
  }

  .#{$key}-color-text {
    color: $color-code !important;
  }
}

@each $key, $color-code in map-get($color, "social-area") {
  .social-area-color-#{$key} {
    background-color: $color-code !important;
  }

  .social-area-color-border-#{$key} {
    border-color: $color-code !important;
  }
}

@each $service-name, $color-palette in map-get($color, "service") {
  .service-color[data-service="#{$service-name}"] {
    background-color: map-get($color-palette, "base") !important;

    &.darken {
      background-color: map-get($color-palette, "darken") !important;
    }

    &.lighten {
      background-color: map-get($color-palette, "lighten") !important;
    }
  }

  .service-color-border[data-service="#{$service-name}"] {
    border-color: map-get($color-palette, "base") !important;

    &.border-darken {
      border-color: map-get($color-palette, "darken") !important;
    }

    &.border-lighten {
      border-color: map-get($color-palette, "lighten") !important;
    }
  }

  .service-color-text[data-service="#{$service-name}"] {
    color: map-get($color-palette, "base") !important;

    &.text-darken {
      color: map-get($color-palette, "darken") !important;
    }

    &.text-lighten {
      color: map-get($color-palette, "lighten") !important;
    }
  }

  .service-scheme[data-service="#{$service-name}"] {
    background-color: map-get($color-palette, "lighten");

    .btn, .btn-small, .btn-large, .btn-floating {
      background-color: map-get($color-palette, "darken");

      &:hover {
        background-color: map-get($color-palette, "base");
      }
    }

    .pagination {
      li.active {
        background-color: map-get($color-palette, "darken");
      }
    }

    .table-of-contents {
      a.active, a:hover {
        border-color: map-get($color-palette, "darken");
      }
    }

    .tabs {
      .tab {
        &.disabled {
          a {
            color: inherit;

            &:hover {
              color: change-color(map-get($color-palette, "darken"), $alpha: 0.15);
            }
          }
        }

        a {
          color: inherit;

          &:focus, &:hover, &.active {
            color: map-get($color-palette, "darken");
          }

          &:focus, &.active, &.active:focus {
            background-color: change-color(map-get($color-palette, "darken"), $alpha: 0.15);
          }
        }
      }
      .indicator {
        background-color: map-get($color-palette, "darken");
      }
    }
  }
}

@each $ressource-name, $color-palette in map-get($color, "status") {
  @each $key, $color-code in $color-palette {
    .#{$ressource-name}-status-color[data-status="#{$key}"] {
      background-color: $color-code !important;
    }

    .#{$ressource-name}-status-color-border[data-status="#{$key}"] {
      border-color: $color-code !important;
    }

    .#{$ressource-name}-status-color-text[data-status="#{$key}"] {
      color: $color-code !important;
    }
  }
}


@each $key, $color-code in map-get($color, "s-attr") {
  .chip.s-attr[data-s-attr-type="ent"][data-s-attr-ent-type="#{$key}"] {
    background-color: $color-code !important;
  }
}


main {
  .btn, .btn-small, .btn-large, .btn-floating {
    background-color: map-deep-get($color, "baseline", "secondary");

    &:hover {
      background-color: map-deep-get($color, "baseline", "secondary-variant");
    }
  }

  .pagination {
    li.active {
      background-color: map-deep-get($color, "baseline", "secondary");
    }
  }

  .table-of-contents {
    a.active, a:hover {
      border-color: map-deep-get($color, "baseline", "secondary");
    }
  }

  .tabs {
    .tab {
      &.disabled {
        a {
          color: inherit;

          &:hover {
            color: change-color(map-deep-get($color, "baseline", "secondary"), $alpha: 0.15);
          }
        }
      }

      a {
        color: inherit;

        &:focus, &:hover, &.active {
          color: map-deep-get($color, "baseline", "secondary");
        }

        &:focus, &.active, &.active:focus {
          background-color: change-color(map-deep-get($color, "baseline", "secondary"), $alpha: 0.15);
        }
      }
    }
    .indicator {
      background-color: map-deep-get($color, "baseline", "secondary");
    }
  }
}
