// Copyright (c) 2014, 2023, Oracle and/or its affiliates.  Licensed under The Universal Permissive License (UPL), Version 1.0 as shown at https://oss.oracle.com/licenses/upl/

// !!!
// WARNING: do not directly import this file, instead import the
//          version in your theme's directory,
//          for example alta/widgets/_oj.alta.dvt.timeline.scss
// !!!

@import "../../utilities/oj.utilities";

@if $includeTimelineClasses != false {
  @include module-include-once("common.timeline") {

    // This is to prevent the flash of unstyled content before the html becomes JET components.
    @if $initialVisibility == hidden {
      oj-timeline:not(.oj-complete) {
        visibility: hidden;
      }
    }

    .oj-timeline {
      outline:none;

        border-color:$dvtTimelineBorderColor;
        @include oj-user-select-property(none);

    }

    .oj-timeline-item {
     
        background-color:$dvtTimelineItemBgColor;
        border-color:$dvtTimelineItemBorderColor;
        padding-top:5px;
    }

    .oj-timeline-item.oj-hover {

        border-color:$dvtTimelineItemBorderColorHover;

    }

    .oj-timeline-item.oj-selected {

        border-color:$dvtTimelineItemBorderColorSelected;

    }

    .oj-timeline-item-description {

        color:$dvtTimelineItemDescriptionColor;
        font-size:$smallFontSize;

      white-space:nowrap;
    }

    .oj-timeline-item-title {

        color:$dvtTimelineItemTitleColor;
        font-size:$smallFontSize;

      white-space:nowrap;
      font-weight:bold;
    }

    .oj-timeline-major-axis-label {

        color:$dvtTimelineMajorAxisLabelColor;
        font-size:$fontSize;

      white-space:nowrap;
      font-weight:bold;
    }

    .oj-timeline-major-axis-separator {

        color:$dvtTimelineMajorAxisSeparatorColor;

    }

    .oj-timeline-minor-axis {

        background-color:$dvtTimelineMinorAxisBgColor;
        border-color:$dvtTimelineMinorAxisBorderColor;

    }

    .oj-timeline-minor-axis-label {

        color:$dvtTimelineMinorAxisLabelColor;
        font-size:$smallFontSize;

      white-space:nowrap;
    }

    .oj-timeline-minor-axis-separator {

        color:$dvtTimelineMinorAxisSeparatorColor;

    }

    .oj-timeline-overview {

        background-color:$dvtTimelineOverviewBgColor;

    }

    .oj-timeline-overview-label {

        color:$dvtTimelineOverviewLabelColor;
        font-size:$smallFontSize;

      white-space:nowrap;
      font-weight:bold;
    }

    .oj-timeline-overview-window {

        background-color:$dvtTimelineOverviewWindowBgColor;
        border-color:$dvtTimelineOverviewWindowBorderColor;

    }

    .oj-timeline-reference-object {

        color:$dvtTimelineReferenceObjectColor;

    }

    .oj-timeline-series {

        background-color: $dvtTimelineSeriesBgColor;

    }

    .oj-timeline-series-label {

        color:$dvtTimelineSeriesLabelColor;
        font-size:$fontSize;

      white-space:nowrap;
      font-weight:bold;
    }

    .oj-timeline-series-empty-text {

        color:$dvtTimelineSeriesEmptyTextColor;
        font-size:$dvtNoDataMessageFontSize;

      white-space:nowrap;
    }

    .oj-timeline-tooltip-label {

          font-size: $smallFontSize;
          color: $formControlLabelColor;

    }

    /* override dvt button styling for backwards variable compatibility */
    .oj-timeline .oj-dvt-button-outlined,
    .oj-timeline .oj-dvt-button-outlined.oj-hover,
    .oj-timeline .oj-dvt-button-outlined.oj-disabled {
      stroke: $dvtPanelBorderColor;
      fill: none;
    }

    .oj-timeline .oj-dvt-button-outlined.oj-active {
      stroke: $dvtIconBorderColorActive;
      fill: $dvtIconBgColorActive;
    }

    .oj-timeline .oj-dvt-button-outlined.oj-active .oj-dvt-icon {
      fill: $dvtIconColorActive;
    }
  }
}