@use '../base/common/base-variables' as *;

//Layout Variables Start
$kanban-icons-border-radius: $radius-4 !default;
$kanban-text-base: $text-base !default;
$kanban-mb-popup-container-box-shadow: 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12), 0 11px 15px -7px rgba(0, 0, 0, .2) !default;

//Layout Variables End
//Theme Variables Start
$kanban-column-bg-color: $content-bg-color-alt1 !default;
$kanban-default-font-color: $content-text-color !default;
$kanban-content-font: $content-text-color-alt1 !default;
$kanban-border-color: $border-dark !default;
$kanban-dialog-text-areas-border-color: $gray-300 !default;
$kanban-card-selection-bg-color: $content-bg-color !default;
$kanban-dropped-clone-bg-color: $primary-lighter !default;
$kanban-dropped-clone-border-color: $primary !default;
$kanban-dragged-clone-border-color: $border-dark !default;
$kanban-icons-color: $gray-500 !default;
$kanban-bg-color: $content-bg-color !default;
$kanban-card-bg-color: $content-bg-color !default;
$kanban-text-area-bg-color: initial !default;
$kanban-text-area-color: $content-text-color !default;
$kanban-popup-overlay-bg-color: $overlay-bg-color !default;
$kanban-min-color: $msg-warning-bg-color !default;
$kanban-max-color:$msg-danger-bg-color !default;
$kanban-header-border-color: $gray-300 !default;
$kanban-tags-bg-color: $content-bg-color-alt2 !default;
$kanban-tags-color: $content-text-color !default;
$kanban-tags-font-weight: $font-weight-medium !default;
$kanban-card-selection-box-shadow: 0 4px 6px -1px rgba($black, .05), 0 10px 15px -3px rgba($black, .1) !default;

//Theme Variables End

$kanban-table-border-spacing: 10px 4px !default;
$kanban-table-swimlane-border-spacing: 10px 0 !default;
$kanban-table-bigger-border-spacing: 12px 4px !default;
$kanban-table-bigger-swimlane-border-spacing: 12px 0 !default;
$kanban-table-col-collapse-width: 42px !default;
$kanban-table-col-collapse-bgr-width: 48px !default;
$kanban-frozen-swimlane-row-padding: 12px 12px 12px 20px !default;
$kanban-frozen-swimlane-row-bgr-padding: 16px 16px 16px 28px !default;
$kanban-frozen-swimlane-row-header-padding: 0 0 0 8px !default;
$kanban-frozen-swimlane-row-header-line-height: $leading-normal !default;
$kanban-frozen-swimlane-row-header-font-size: $text-sm !default;
$kanban-frozen-swimlane-row-header-bgr-font-size: $text-base !default;
$kanban-frozen-swl-row-head-item-count-font-size: $text-xs !default;
$kanban-frozen-swl-row-head-item-count-bgr-font-size: $text-xs !default;
$kanban-frozen-swl-row-head-item-count-line-height: $leading-normal !default;
$kanban-frozen-swl-row-head-item-count-bgr-line-height: $leading-relaxed !default;
$kanban-frozen-swl-row-head-item-count-padding: 3px !default;
$kanban-frozen-swl-row-head-item-count-bgr-padding: 4px !default;
$kanban-frozen-swl-row-head-item-count-opacity: .77 !default;
$kanban-frozen-swl-row-head-item-count-font-weight: $font-weight-medium !default;
$kanban-swl-frozen-header-item-count-color: $content-text-color-alt3 !default;
$kanban-swl-frozen-header-row-icon-border: 1px solid transparent !default;
$kanban-swl-frozen-header-row-icon-height: 20px !default;
$kanban-swl-frozen-header-row-icon-margin: 1px !default;
$kanban-swl-frozen-header-row-icon-padding: 2px !default;
$kanban-swl-frozen-header-row-icon-font-size: $text-sm !default;
$kanban-swl-frz-head-row-icon-hover-margin: 1px !default;
$kanban-swl-frz-header-row-icon-hover-padding: 2px !default;
$kanban-swl-frozen-header-row-icon-hover-bg-color: $secondary-bg-color-hover !default;
$kanban-swl-frozen-header-row-icon-focus-bg-color: $secondary-bg-color-hover !default;
$kanban-swl-frozen-header-row-icon-hover-border: 1px solid transparent !default;
$kanban-swl-frozen-header-row-icon-hover-box-shadow: none !default;
$kanban-swl-frozen-header-row-icon-hover-color: $white !default;
$kanban-swl-frozen-header-row-icon-focus-box-shadow: $secondary-shadow-focus !default;
$kanban-header-cell-height: 44px !default;
$kanban-header-cell-bgr-height: 48px !default;
$kanban-header-cell-padding: 8px !default;
$kanban-stacked-header-cell-border-btm: 1px solid $border !default;
$kanban-toggle-header-icon-font-size: $text-sm !default;
$kanban-toggle-header-icon-bgr-font-size: $text-sm !default;
$kanban-toggle-header-expand-icon-padding: 4px !default;
$kanban-toggle-header-collapse-icon-padding: 2px !default;
$kanban-toggle-header-collapse-width: 42px !default;
$kanban-header-text-font-size: $text-xs !default;
$kanban-header-text-font-weight: $font-weight-semibold !default;
$kanban-header-text-line-height: $leading-normal !default;
$kanban-header-text-overflow: ellipsis !default;
$kanban-header-text-bgr-font-size: $text-base !default;
$kanban-header-text-bgr-font-weight: $font-weight-medium !default;
$kanban-header-text-bgr-line-height: $leading-normal !default;
$kanban-header-text-bgr-transform: uppercase !default;
$kanban-header-item-count-font-size: $text-xxs !default;
$kanban-header-item-count-font-weight: $font-weight-medium !default;
$kanban-header-item-count-line-height: $leading-relaxed !default;
$kanban-header-item-count-opacity: 1 !default;
$kanban-header-item-count-margin-top: 1px !default; // no need for variable becuase it will cause issues when the margin is increased.
$kanban-header-item-count-text-transform: capitalize !default;
$kanban-header-item-count-bgr-font-size: $text-xs !default;
$kanban-header-item-count-bgr-font-weight: $font-weight-medium !default;
$kanban-header-item-count-bgr-line-height: $leading-normal !default;
$kanban-header-item-count-bgr-margin-top: 3px !default; // no need for variable becuase it will cause issues when the margin is increased.
$kanban-header-item-count-bgr-text-transform: capitalize !default;
$kanban-header-min-max-count-font-size: $text-xs !default;
$kanban-header-min-max-count-font-weight: $font-weight-medium !default;
$kanban-header-min-max-count-opacity: 1 !default;
$kanban-collapse-header-text-color: $content-text-color-alt1 !default;
$kanban-collapse-header-text-font-size: $text-xs !default;
$kanban-collapse-header-text-font-weight: $font-weight-medium !default;
$kanban-collapse-header-text-padding: 12px !default;
$kanban-collapse-header-text-transform: uppercase !default;
$kanban-card-container-padding: 12px 12px 0 !default;
$kanban-card-container-bgr-padding: 16px 16px 0 !default;
$kanban-empty-card-font-size: $text-sm !default;
$kanban-empty-card-line-height: $leading-normal !default;
$kanban-empty-card-padding: 20px 0 !default;
$kanban-empty-card-color: $content-text-color-alt2 !default;
$kanban-empty-card-margin: 0 auto !default;
$kanban-empty-card-display: table !default;
$kanban-card-margin-bottom: 12px !default;
$kanban-card-bgr-margin-bottom: 16px !default;
$kanban-card-border: 1px solid $border-light !default;
$kanban-card-border-radius: $radius-6 !default;
$kanban-card-normal-box-shadow: none !default;
$kanban-card-header-padding: 12px 14px 0 !default;
$kanban-card-header-bgr-padding: 24px 24px 0 !default;
$kanban-color-card-header-padding: 12px 14px 0 14px !default;
$kanban-color-card-header-bgr-padding: 12px 20px 0 20px !default;
$kanban-card-header-title-font-size: $text-sm !default;
$kanban-card-header-title-line-height: $leading-relaxed !default;
$kanban-card-header-title-font-weight: $font-weight-medium !default;
$kanban-card-header-title-bgr-font-size: $text-base !default;
$kanban-card-header-title-bgr-line-height: $leading-normal !default;
$kanban-card-footer-padding: 13px 14px !default;
$kanban-card-footer-bgr-padding: 0 24px 12px !default;
$kanban-color-card-footer-padding: 8px 18px 8px 16px !default;
$kanban-color-card-footer-bgr-padding: 0 24px 12px 22px !default;
$kanban-card-content-font-size: $text-sm !default;
$kanban-card-content-line-height: $leading-relaxed !default;
$kanban-card-content-padding: 8px 14px !default;
$kanban-color-card-content-padding: 8px 14px 12px 14px !default;
$kanban-card-content-bgr-font-size: $text-base !default;
$kanban-card-content-bgr-line-height: $leading-relaxed !default;
$kanban-card-content-bgr-padding: 8px 24px 12px !default;
$kanban-color-card-content-bgr-padding: 12px 20px 12px 20px !default;
$kanban-color-card-border: 1px solid $border-light !default;
$kanban-color-card-border-left: 2px solid !default;
$kanban-color-card-hover-border: 1px solid $border-dark !default;
$kanban-color-card-hover-border-left: 2px solid !default;
$kanban-color-card-hover-box-shadow:  $shadow-sm !default;
$kanban-color-card-focus-border: 1px solid $border-dark !default;
$kanban-color-card-focus-border-left: 2px solid !default;
$kanban-color-card-tags-padding: 8px 14px 0 12px !default;
$kanban-card-tags-padding: 12px 12px 0 !default;
$kanban-color-card-selection-border: 1px solid $primary !default;
$kanban-color-card-selection-border-left: 2px solid !default;
$kanban-color-card-selection-box-shadow: $kanban-card-normal-box-shadow !default;
$kanban-color-card-selection-hover-border: 1px solid $primary !default;
$kanban-color-card-selection-hover-border-left: 2px solid !default;
$kanban-color-card-selection-hover-box-shadow: $kanban-card-normal-box-shadow !default;
$kanban-color-card-selection-hover-padding: 0 !default;
$kanban-card-selection-border: 1px solid $primary !default;
$kanban-card-selection-box-shadow: $kanban-card-normal-box-shadow !default;
$kanban-card-selection-hover-border: 1px solid $primary !default;
$kanban-card-selection-hover-box-shadow: $kanban-card-normal-box-shadow !default;
$kanban-card-selection-hover-padding: 0 !default;
$kanban-card-tag-border-radius: $radius-2 !default;
$kanban-card-tag-font-size: $text-sm !default;
$kanban-card-tag-line-height: $leading-relaxed !default;
$kanban-card-tag-margin-right: 4px !default;
$kanban-card-tag-padding: 1px 4px !default;
$kanban-card-hover-border: 1px solid $border-dark !default;
$kanban-card-normal-hover-box-shadow: $kanban-card-normal-box-shadow !default;
$kanban-card-focus-border: 1px solid $border-dark !default;
$kanban-multi-card-text-bg-color: $content-bg-color !default;
$kanban-target-drag-drop-clone-margin-bottom: 12px !default;
$kanban-target-drag-drop-clone-bgr-margin-bottom: 16px !default;
$kanban-target-drag-drop-clone-border-radius: $radius-6 !default;
$kanban-target-dragged-clone-bg-color: $content-bg-color-alt3 !default;
$kanban-swl-row-height: 46px !default;
$kanban-swl-row-header-padding: 12px !default;
$kanban-swl-row-header-bgr-padding: 14px !default;
$kanban-swl-header-icon-border: 1px solid transparent !default;
$kanban-swl-header-icon-color: $kanban-icons-color !default;
$kanban-swl-header-icon-height: 20px !default;
$kanban-swl-header-icon-margin: 1px !default;
$kanban-swl-header-icon-rtl-margin: 1px !default;
$kanban-swl-header-icon-padding: 0 !default;
$kanban-swl-header-icon-font-size: $text-sm !default;
$kanban-swl-header-icon-bgr-font-size: $text-sm !default;
$kanban-swl-header-icon-hover-border: $kanban-swl-header-icon-border !default;
$kanban-swl-header-icon-hover-color: $icon-color-hover !default;
$kanban-swl-header-icon-hover-margin: 1px !default;
$kanban-swl-header-icon-hover-padding: 0 !default;
$kanban-swl-header-icon-hover-font-size: $text-sm !default;
$kanban-swl-header-icon-hover-background: none !default;
$kanban-swl-header-icon-hover-border-radius: $kanban-icons-border-radius !default;
$kanban-swl-header-icon-hover-box-shadow: $secondary-shadow-focus !default;
$kanban-swl-header-text-line-height: $leading-normal;
$kanban-swl-header-text-bgr-line-height: $leading-normal;
$kanban-swl-header-text-padding: 0 0 0 8px;
$kanban-swl-header-text-bgr-font-size: $text-base;
$kanban-swl-header-item-count-font-size: $text-xs;
$kanban-swl-header-item-count-line-height: 20px;
$kanban-swl-header-item-count-font-opacity: .8;
$kanban-swl-header-item-count-padding: 1px 2px;
$kanban-swl-header-item-count-color: inherit;
$kanban-swl-header-item-count-font-weight: $font-weight-medium;
$kanban-swl-header-item-count-bgr-font-size: $text-xs;
$kanban-swl-header-item-count-bgr-line-height: $leading-normal;
$kanban-swl-header-item-count-bgr-padding: 5px;
$kanban-content-cells-focus-border: 1px solid $transparent;
$kanban-content-cells-focus-box-shadow: $shadow-focus-ring1;
$kanban-mb-swl-name-font-size: $text-base;
$kanban-mb-swl-name-padding: 5px;
$kanban-mb-swl-name-color: inherit;
$kanban-mb-swl-name-font-weight: $font-weight-medium;
$kanban-mb-swl-name-line-height: $leading-normal;
$kanban-mb-swl-menu-icon-font-size: $text-lg;
$kanban-mb-swl-menu-icon-bgr-font-size: $text-xl;
$kanban-mb-swl-menu-icon-color: inherit;
$kanban-mb-swl-overlay-opacity: 1;
$kanban-dialog-form-table-td-line-height: $leading-normal;
$kanban-dialog-form-table-td-opacity: 1;
$kanban-dialog-form-table-td-padding: 8px 0;
$kanban-dialog-form-table-td-color: $content-text-color-alt1;
$kanban-dialog-form-table-td-font-weight: $font-weight-medium;
$kanban-mb-popup-content-padding: 5px !default;
$kanban-mb-popup-content-color: inherit !default;
$kanban-dialog-text-area-focus-shadow: 0 0 0 2px $primary !default;

//Color Start
$kanban-header-text-color: $content-text-color-alt1 !default;
$kanban-header-item-count-color: $content-text-color-alt3 !default;
$kanban-header-limits-color: $content-text-color-alt3 !default;
$kanban-col-expand-collapse-bg-color: none;
$kanban-col-expand-collapse-color: $primary;
$kanban-col-expand-collapse-border: 1px solid $transparent;
$kanban-col-expand-collapse-box-shadow: $shadow-focus-ring1;
$skeleton-card-color: $content-bg-color-alt3;
$skelton-box-shadow: $shadow-sm;

//Color End

//Start of Typography Variables Implementation
//font-size
$kanban-dialog-form-table-td-font-size: $text-sm !default;
$kanban-swl-header-text-font-size: $text-sm !default;
$kanban-big-mb-toolbar-swl-font-size: $text-lg !default;
$kanban-mb-popup-content-font-size: 15px !default;
$kanban-collapsed-header-item-count-font-size: 13px !default;

//font-weight
$kanban-mb-popup-content-font-weight: 500 !default;
$kanban-dialog-text-areas-font-weight: 400 !default;
$kanban-frozen-swimlane-row-header-font-weight: 400 !default;
$kanban-header-item-count-font-weight: 400 !default;
$kanban-swl-header-text-font-weight: 400 !default;

//border-radius
$kanban-mb-popup-container-border-radius: $radius-2 !default;
$kanban-default-border-radius: $radius-4 !default;
$skelton-box-border-radius: $radius-4 !default;
$kanban-dialog-text-areas-border-radius: $radius-4 !default;
$kanban-skeleton-header-small-border-radius: $radius-4 $radius-4 $radius-0 $radius-0 !default;
$kanban-skeleton-header-large-border-radius: $radius-4 !default;
$kanban-not-swl-content-border-radius: $radius-4 !default;

//padding
$kanban-cells-add-icon-padding: 11px !default;
$kanban-swimlane-header-toolbar-padding: 10px !default;
$kanban-mb-swl-menu-icon-padding: 7px !default;
$Kanban-popup-device-padding: 15px !default;
$kanban-header-min-max-count-padding: 4px 8px !default;
$kanban-dialog-text-areas-padding: 4px 8px 4px 12px !default;

//padding top
$kanban-header-limits-padding-top: 3px !default;
$kanban-mobile-popup-header-padding-top: 3px !default;
$kanban-swl-header-icon-bgr-small-padding-top: 4px !default;
$kanban-swl-header-icon-bgr-hover-padding-top: 4px !default;
$kanban-swimlane-toolbar-menu-title-padding-top: 6px !default;
$kanban-frozen-toolbar-swl-item-count-padding-top: 9px !default;

//padding left
$rte-kanban-form-table-padding-left: 10px !default;
$kanban-multi-card-text-padding-left: 8px !default;
$kanban-header-text-padding-left: 5px !default;
$kanban-mb-swl-menu-icon-padding-left: 4px !default;

//padding right
$rte-kanban-form-table-padding-right: 0 !default;
$kanban-header-text-padding-right: 5px !default;
$kanban-dialog-form-table-padding-right: 10px !default;
$kanban-header-text-padding-right-rtl: initial;

//margin
$kanban-skeleton-card-margin: 8px !default;
$kanban-cells-add-button-margin: 8px 8px 0 !default;
$kanban-mb-popup-container-margin: 0 !default;

//margin bottom
$kanban-swimlane-header-toolbar-margin-bottom: 3px !default;
$kanban-big-swl-header-toolbar-margin-bottom: 5px !default;

//margin left
$kanban-dialog-delete-btn-margin-left: 0 !default;

//border
$kanban-table-border: 0 !default;
$kanban-mobile-popup-border: 0 !default;
$kanban-column-border: 1px dashed $kanban-border-color;
$kanban-cells-add-button-border: 1px dashed $kanban-dropped-clone-border-color;
$kanban-cells-add-button-focus-border: 1px dashed $kanban-border-color;
$kanban-multi-card-clone-border: 1px solid $kanban-dragged-clone-border-color;
$kanban-dragged-clone-border: 1px dashed $kanban-dragged-clone-border-color;
$kanban-dropped-clone-border: 1px dashed $kanban-dropped-clone-border-color;
$kanban-not-swl-content-border: 1px solid transparent;
$kanban-not-swl-content-dropping-border: 1px dashed $kanban-border-color;
$kanban-swl-resource-border: 1px solid $kanban-header-border-color;
$kanban-delete-border: 1px solid !default;
$kanban-header-column-border: 1px solid transparent !default;

//border top
$kanban-skeleton-content-border-top: 1px solid $kanban-border-color;
$kanban-target-clone-border-top: 1px solid $kanban-border-color;

//border bottom
$kanban-card-header-border-bottom: 0 !default;
$kanban-collapsed-not-swl-border-bottom: 0 !default;
$kanban-swimlane-header-toolbar-border-bottom: 0 !default;
$kanban-header-swl-cells-border-bottom: 0 !default;
$kanban-target-column-key-border-bottom: 1px dashed $kanban-border-color;

//border left
$kanban-target-column-key-border-left: 1px dashed $kanban-border-color;

//border right
$kanban-target-column-key-border-right: 1px dashed $kanban-border-color;

// height
$kanban-limits-height: 26px !default;
$kanban-add-button-height: 36px !default;
$card-wrapper-container-height: inherit !default;
$kanban-multi-card-clone-height: 34px !default;
$kanban-swl-resource-height: 100% !default;
$kanban-mb-popup-container-height: 60px !default;
$kanban-big-swl-header-min-height: 56px !default;

//End of Typography Variables Implementation
