// Customize the light and dark text colors for use in our color contrast function.
$white: #fff !default;
$black: #000 !default;
$primary: #3b71ca !default;

$color-contrast-dark: $black !default;
$color-contrast-light: $white !default;

$min-contrast-ratio: 2 !default;

// A list of pre-calculated numbers of pow(divide((divide($value, 255) + .055), 1.055), 2.4). (from 0 to 255)
// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern
$_luminance-list: 0.0008 0.001 0.0011 0.0013 0.0015 0.0017 0.002 0.0022 0.0025 0.0027 0.003 0.0033
  0.0037 0.004 0.0044 0.0048 0.0052 0.0056 0.006 0.0065 0.007 0.0075 0.008 0.0086 0.0091 0.0097
  0.0103 0.011 0.0116 0.0123 0.013 0.0137 0.0144 0.0152 0.016 0.0168 0.0176 0.0185 0.0194 0.0203
  0.0212 0.0222 0.0232 0.0242 0.0252 0.0262 0.0273 0.0284 0.0296 0.0307 0.0319 0.0331 0.0343 0.0356
  0.0369 0.0382 0.0395 0.0409 0.0423 0.0437 0.0452 0.0467 0.0482 0.0497 0.0513 0.0529 0.0545 0.0561
  0.0578 0.0595 0.0612 0.063 0.0648 0.0666 0.0685 0.0704 0.0723 0.0742 0.0762 0.0782 0.0802 0.0823
  0.0844 0.0865 0.0887 0.0908 0.0931 0.0953 0.0976 0.0999 0.1022 0.1046 0.107 0.1095 0.1119 0.1144
  0.117 0.1195 0.1221 0.1248 0.1274 0.1301 0.1329 0.1356 0.1384 0.1413 0.1441 0.147 0.15 0.1529
  0.1559 0.159 0.162 0.1651 0.1683 0.1714 0.1746 0.1779 0.1812 0.1845 0.1878 0.1912 0.1946 0.1981
  0.2016 0.2051 0.2086 0.2122 0.2159 0.2195 0.2232 0.227 0.2307 0.2346 0.2384 0.2423 0.2462 0.2502
  0.2542 0.2582 0.2623 0.2664 0.2705 0.2747 0.2789 0.2831 0.2874 0.2918 0.2961 0.3005 0.305 0.3095
  0.314 0.3185 0.3231 0.3278 0.3325 0.3372 0.3419 0.3467 0.3515 0.3564 0.3613 0.3663 0.3712 0.3763
  0.3813 0.3864 0.3916 0.3968 0.402 0.4072 0.4125 0.4179 0.4233 0.4287 0.4342 0.4397 0.4452 0.4508
  0.4564 0.4621 0.4678 0.4735 0.4793 0.4851 0.491 0.4969 0.5029 0.5089 0.5149 0.521 0.5271 0.5333
  0.5395 0.5457 0.552 0.5583 0.5647 0.5711 0.5776 0.5841 0.5906 0.5972 0.6038 0.6105 0.6172 0.624
  0.6308 0.6376 0.6445 0.6514 0.6584 0.6654 0.6724 0.6795 0.6867 0.6939 0.7011 0.7084 0.7157 0.7231
  0.7305 0.7379 0.7454 0.7529 0.7605 0.7682 0.7758 0.7835 0.7913 0.7991 0.807 0.8148 0.8228 0.8308
  0.8388 0.8469 0.855 0.8632 0.8714 0.8796 0.8879 0.8963 0.9047 0.9131 0.9216 0.9301 0.9387 0.9473
  0.956 0.9647 0.9734 0.9823 0.9911 1;

@function color-contrast(
  $background,
  $color-contrast-dark: $color-contrast-dark,
  $color-contrast-light: $color-contrast-light,
  $min-contrast-ratio: $min-contrast-ratio
) {
  $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;
  $max-ratio: 0;
  $max-ratio-color: null;

  @each $color in $foregrounds {
    $contrast-ratio: contrast-ratio($background, $color);
    @if $contrast-ratio > $min-contrast-ratio {
      @return $color;
    } @else if $contrast-ratio > $max-ratio {
      $max-ratio: $contrast-ratio;
      $max-ratio-color: $color;
    }
  }

  @warn "Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...";

  @return $max-ratio-color;
}

@function contrast-ratio($background, $foreground: $color-contrast-light) {
  $l1: luminance($background);
  $l2: luminance(opaque($background, $foreground));

  @return if($l1 > $l2, divide($l1 + 0.05, $l2 + 0.05), divide($l2 + 0.05, $l1 + 0.05));
}

@function luminance($color) {
  $rgb: (
    'r': red($color),
    'g': green($color),
    'b': blue($color),
  );

  @each $name, $value in $rgb {
    $value: if(
      divide($value, 255) < 0.04045,
      divide(divide($value, 255), 12.92),
      nth($_luminance-list, $value + 1)
    );
    $rgb: map-merge(
      $rgb,
      (
        $name: $value,
      )
    );
  }

  @return (map-get($rgb, 'r') * 0.2126) + (map-get($rgb, 'g') * 0.7152) +
    (map-get($rgb, 'b') * 0.0722);
}

// Return opaque color
// opaque(#fff, rgba(0, 0, 0, .5)) => #808080
@function opaque($background, $foreground) {
  @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100%);
}

@function divide($dividend, $divisor, $precision: 10) {
  $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);
  $dividend: abs($dividend);
  $divisor: abs($divisor);
  @if $dividend == 0 {
    @return 0;
  }
  @if $divisor == 0 {
    @error "Cannot divide by 0";
  }
  $remainder: $dividend;
  $result: 0;
  $factor: 10;
  @while ($remainder > 0 and $precision >= 0) {
    $quotient: 0;
    @while ($remainder >= $divisor) {
      $remainder: $remainder - $divisor;
      $quotient: $quotient + 1;
    }
    $result: $result * 10 + $quotient;
    $factor: $factor * 0.1;
    $remainder: $remainder * 10;
    $precision: $precision - 1;
    @if ($precision < 0 and $remainder >= $divisor * 5) {
      $result: $result + 1;
    }
  }
  $result: $result * $factor * $sign;
  $dividend-unit: unit($dividend);
  $divisor-unit: unit($divisor);
  $unit-map: (
    'px': 1px,
    'rem': 1rem,
    'em': 1em,
    '%': 1%,
  );
  @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {
    $result: $result * map-get($unit-map, $dividend-unit);
  }
  @return $result;
}

$calendar-btn-tools-color: var(--mdb-body-color) !default;
$calendar-hover-btn-tools-color: var(--mdb-highlight-bg-color) !default;
$calendar-tools-heading-color: var(--mdb-body-color) !default;
$calendar-weekday-color: var(--mdb-body-color) !default;
$calendar-day-number-color: var(--mdb-body-color) !default;
$calendar-disabled-day-number-color: rgba(var(--mdb-body-color-rgb), 0.5) !default;
$calendar-current-day-bg: $primary !default;
$calendar-current-day-color: color-contrast($primary) !default;
$calendar-short-event-color: var(--mdb-body-color) !default;
$calendar-table-list-heading-bg: var(--mdb-secondary-color) !default;
$calendar-table-border-color: var(--mdb-border-color) !default;
$calendar-hover-table-cell-bg: var(--mdb-highlight-bg-color) !default;

.calendar {
  --mdb-calendar-btn-tools-color: #{$calendar-btn-tools-color};
  --mdb-calendar-hover-btn-tools-color: #{$calendar-hover-btn-tools-color};
  --mdb-calendar-disabled-day-number-color: #{$calendar-disabled-day-number-color};
  --mdb-calendar-current-day-bg: #{$calendar-current-day-bg};
  --mdb-calendar-current-day-color: #{$calendar-current-day-color};
  --mdb-calendar-short-event-color: #{$calendar-short-event-color};
  --mdb-calendar-table-list-heading-bg: #{$calendar-table-list-heading-bg};
  --mdb-calendar-table-border-color: #{$calendar-table-border-color};
  --mdb-calendar-hover-table-cell-bg: #{$calendar-hover-table-cell-bg};

  font-size: 0.9rem;
  .calendar-tools {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;

    .calendar-heading {
      font-size: 1.4rem;
      font-weight: bold;
    }
    @media (max-width: 992px) {
      flex-direction: column;
      .calendar-heading {
        text-align: center;
        order: -1;
      }
      > .btn-group {
        transform: scale(0.9);
      }
    }
    .select-wrapper {
      width: 100px;
      margin-right: 20px;
    }

    .btn-link {
      color: var(--mdb-calendar-btn-tools-color);
      &:hover {
        background-color: var(--mdb-calendar-hover-btn-tools-color);
      }
    }
  }
  table {
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 4px;
    width: 100%;
    border: 1px solid var(--mdb-calendar-table-border-color);
    th {
      text-align: center;
      border-bottom: 1px solid var(--mdb-calendar-table-border-color);
      border-right: 1px solid var(--mdb-calendar-table-border-color);
      font-weight: 500;
      .day-field {
        width: 30px;
        height: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 8px auto;
        border-radius: 50%;
        font-size: 1.3rem;
      }
      &.today .day-field {
        color: var(--mdb-calendar-current-day-color);
        background-color: var(--mdb-calendar-current-day-bg);
      }
    }
    .long-event-row {
      height: 100px;
    }
    td {
      position: relative;
      vertical-align: top;
      border-bottom: 1px solid var(--mdb-calendar-table-border-color);
      border-right: 1px solid var(--mdb-calendar-table-border-color);
      &:hover,
      &:active,
      &.active {
        background-color: var(--mdb-calendar-hover-table-cell-bg);
      }
      &.dragenter {
        border: 2px dashed black;
      }
      &.disabled {
        .day-field-wrapper {
          .day-field {
            color: var(--mdb-calendar-disabled-day-number-color);
          }
        }
      }
      .day-field-wrapper {
        position: absolute;
        display: flex;
        justify-content: center;
        left: 0;
        top: 5px;
        width: 100%;
        pointer-events: none;
        .day-field {
          width: 20px;
          height: 20px;
          display: flex;
          justify-content: center;
          align-items: center;
          border-radius: 50%;
          font-size: 0.7rem;
          &::selection {
            background-color: transparent;
          }
        }
      }
      &.today .day-field-wrapper .day-field {
        color: var(--mdb-calendar-current-day-color);
        background-color: var(--mdb-calendar-current-day-bg);
      }
    }
    tr:last-child > td,
    tr:last-child > th.hour-field {
      border-bottom: none;
    }
    tr th:last-child,
    tr td:last-child {
      border-right: none;
    }
    &.month {
      td {
        padding-top: 30px;
        height: 100px;
      }
    }
    &.week {
      .weekday-field {
        padding-top: 5px;
      }
      .day-field {
        margin: 5px auto;
        margin-top: 0;
      }
    }
    &.list {
      th {
        text-align: left;
        padding: 5px 10px;
        background-color: var(--mdb-calendar-table-list-heading-bg);
      }
      td {
        padding: 5px 10px;
        cursor: pointer;
        &.td-readonly {
          cursor: default;
        }
        &.td-blur {
          opacity: 0.5;
        }
      }
    }
    .events-wrapper {
      display: flex;
      flex-wrap: wrap;
      width: calc(100% + 3px);
      margin-left: -1px;
    }
    .event {
      padding: 1px 5px;
      background-color: #cfe0fc;
      color: #0a47a9;
      font-size: 0.7rem;
      font-weight: 700;
      width: 100%;
      margin-bottom: 2px;
      margin-left: 4px;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      cursor: pointer;
      transition: opacity 0.2s;
      &.event-readonly {
        cursor: default;
      }
      &.event-blur {
        opacity: 0.5;
      }
      &.event-long {
        margin-left: 0;
        border-radius: 0;
      }
      &.event-end {
        margin-right: 5px;
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
      }
      &::selection {
        background-color: transparent;
      }
      &.event-short {
        background-color: transparent;
        color: var(--mdb-calendar-short-event-color);
      }
      &.active {
        opacity: 0.6;
      }
      &.dragging {
        opacity: 0.1;
      }
      .event-circle {
        pointer-events: none;
      }
    }
    .fake-event {
      padding: 1px 5px;
      font-size: 0.7rem;
      width: 100%;
      margin-bottom: 2px;
      visibility: hidden;
    }
    .hour-field {
      font-weight: 400;
      &::selection {
        background-color: transparent;
      }
    }
  }
}

.color-dropdown-menu {
  min-width: auto;
  width: 92px;
  &.show,
  &.animation {
    display: flex;
    flex-wrap: wrap;
  }
  & > li {
    i {
      pointer-events: none;
    }
  }
  & > li:first-child,
  & > li:first-child .dropdown-item {
    border-radius: 0;
    border-top-left-radius: 0.5rem;
  }
  & > li:nth-child(2) .dropdown-item {
    border-radius: 0;
    border-top-right-radius: 0.5rem !important;
  }
  & > li:nth-last-child(1) .dropdown-item {
    border-radius: 0;
    border-bottom-left-radius: 0.5rem !important;
  }
}

.was-validated .form-outline .form-control.calendar-invalid-input {
  margin-bottom: 0;
  border-color: #00b74a;
  & ~ .form-notch .form-notch-leading,
  & ~ .form-notch .form-notch-middle,
  & ~ .form-notch .form-notch-trailing {
    border-color: #00b74a;
  }
  & ~ .form-label {
    color: #00b74a;
  }
}

.was-validated .form-outline .form-control.calendar-invalid-input {
  margin-bottom: 0;
  border-color: #f93154;
  & ~ .form-notch .form-notch-leading,
  & ~ .form-notch .form-notch-middle,
  & ~ .form-notch .form-notch-trailing {
    border-color: #f93154;
  }
  & ~ .form-label {
    color: #f93154;
  }
}
