@import "variables.scss";

/*******************************
             Table
*******************************/

/*-------------------
       Element
--------------------*/

$verticalMargin: 1em;
$horizontalMargin: 0em;
$margin: $verticalMargin $horizontalMargin;
$borderCollapse: separate;
$borderSpacing: 0px;
$borderRadius: $defaultBorderRadius;
$transition:
  background $defaultDuration $defaultEasing,
  color $defaultDuration $defaultEasing
;
$background: $white;
$color: $textColor;
$borderWidth: 1px;
$border: $borderWidth solid $borderColor;
$boxShadow: none;
$textAlign: left;

/*--------------
     Parts
---------------*/

/* Table Row */
$rowBorder: 1px solid $internalBorderColor;

/* Table Cell */
$cellVerticalPadding: $relativeMini;
$cellHorizontalPadding: $relativeMini;
$cellVerticalAlign: inherit;
$cellTextAlign: inherit;
$cellBorder: 1px solid $internalBorderColor;

/* Table Header */
$headerBorder: 1px solid $internalBorderColor;
$headerDivider: none;
$headerBackground: $offWhite;
$headerAlign: inherit;
$headerVerticalAlign: inherit;
$headerColor: $textColor;
$headerVerticalPadding: $relativeSmall;
$headerHorizontalPadding: $cellHorizontalPadding;
$headerFontStyle: none;
$headerFontWeight: bold;
$headerTextTransform: none;
$headerBoxShadow: none;

/* Table Footer */
$footerBoxShadow: none;
$footerBorder: 1px solid $borderColor;
$footerDivider: none;
$footerBackground: $offWhite;
$footerAlign: inherit;
$footerVerticalAlign: middle;
$footerColor: $textColor;
$footerVerticalPadding: $cellVerticalPadding;
$footerHorizontalPadding: $cellHorizontalPadding;
$footerFontStyle: normal;
$footerFontWeight: normal;
$footerTextTransform: none;

/* Responsive Size */
$responsiveHeaderDisplay: block;
$responsiveFooterDisplay: block;
$responsiveRowVerticalPadding: 1em;
$responsiveRowBoxShadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important;
$responsiveCellVerticalPadding: 0.25em;
$responsiveCellHorizontalPadding: 0.75em;
$responsiveCellBoxShadow: none !important;

/*-------------------
       Types
--------------------*/

/* Definition */
$definitionPageBackground: $white;

$definitionHeaderBackground: transparent;
$definitionHeaderColor: $unselectedTextColor;
$definitionHeaderFontWeight: normal;

$definitionFooterBackground: $definitionHeaderBackground;
$definitionFooterColor: $definitionHeaderColor;
$definitionFooterFontWeight: $definitionHeaderFontWeight;

$definitionColumnBackground: $subtleTransparentBlack;
$definitionColumnFontWeight: bold;
$definitionColumnColor: $selectedTextColor;
$definitionColumnFontSize: $relativeMedium;
$definitionColumnTextTransform: '';
$definitionColumnBoxShadow: '';
$definitionColumnTextAlign: '';
$definitionColumnHorizontalPadding: '';


/*--------------
    Couplings
---------------*/

$iconVerticalAlign: baseline;

/*--------------
     States
---------------*/

$stateMarkerWidth: 0px;

/* Positive */
$positiveColor: $positiveTextColor;
$positiveBoxShadow: $stateMarkerWidth 0px 0px $positiveBorderColor inset;
$positiveBackgroundHover: darken($positiveBackgroundColor, 3);
$positiveColorHover: darken($positiveColor, 3);

/* Negative */
$negativeColor: $negativeTextColor;
$negativeBoxShadow: $stateMarkerWidth 0px 0px $negativeBorderColor inset;
$negativeBackgroundHover: darken($negativeBackgroundColor, 3);
$negativeColorHover: darken($negativeColor, 3);

/* Error */
$errorColor: $errorTextColor;
$errorBoxShadow: $stateMarkerWidth 0px 0px $errorBorderColor inset;
$errorBackgroundHover: darken($errorBackgroundColor, 3);
$errorColorHover: darken($errorColor, 3);

/* Warning */
$warningColor: $warningTextColor;
$warningBoxShadow: $stateMarkerWidth 0px 0px $warningBorderColor inset;
$warningBackgroundHover: darken($warningBackgroundColor, 3);
$warningColorHover: darken($warningColor, 3);

/* Active */
$activeColor: $textColor;
$activeBackgroundColor: #E0E0E0;
$activeBoxShadow: $stateMarkerWidth 0px 0px $activeColor inset;

$activeBackgroundHover: #EFEFEF;
$activeColorHover: $selectedTextColor;

/*--------------
     Types
---------------*/

/* Attached */
$attachedTopOffset: 0px;
$attachedBottomOffset: 0px;
$attachedHorizontalOffset: -$borderWidth;
$attachedWidth: calc(100% + #{$attachedHorizontalOffset * -2});
$attachedBoxShadow: none;
$attachedBorder: $borderWidth solid $solidBorderColor;
$attachedBottomBoxShadow:
  $boxShadow,
  $attachedBoxShadow
;

/* Striped */
$stripedBackground: rgba(0, 0, 50, 0.02);
$invertedStripedBackground: rgba(255, 255, 255, 0.05);

/* Selectable */
$selectableBackground: $transparentBlack;
$selectableTextColor: $selectedTextColor;
$selectableInvertedBackground: $transparentWhite;
$selectableInvertedTextColor: $invertedSelectedTextColor;

/* Sortable */
$sortableBackground: '';
$sortableColor: $textColor;

$sortableBorder: 1px solid $borderColor;
$sortableIconWidth: auto;
$sortableIconDistance: 0.5em;
$sortableIconOpacity: 0.8;
$sortableIconFont: 'Icons';
$sortableIconAscending: '\f0d8';
$sortableIconDescending: '\f0d7';
$sortableDisabledColor: $disabledTextColor;

$sortableHoverBackground: $transparentBlack;
$sortableHoverColor: $hoveredTextColor;

$sortableActiveBackground: $transparentBlack;
$sortableActiveColor: $selectedTextColor;

$sortableActiveHoverBackground: $transparentBlack;
$sortableActiveHoverColor: $selectedTextColor;

$sortableInvertedBorderColor: transparent;
$sortableInvertedHoverBackground: $transparentWhite $subtleGradient;
$sortableInvertedHoverColor: $invertedHoveredTextColor;
$sortableInvertedActiveBackground: $strongTransparentWhite $subtleGradient;
$sortableInvertedActiveColor: $invertedSelectedTextColor;

/* Colors */
$coloredBorderSize: 0.2em;
$coloredBorderRadius: 0em 0em $borderRadius $borderRadius;

/* Inverted */
$invertedBackground: #333333;
$invertedBorder: none;
$invertedCellBorderColor: $whiteBorderColor;
$invertedCellColor: $invertedTextColor;

$invertedHeaderBackground: $veryStrongTransparentBlack;
$invertedHeaderColor: $invertedTextColor;
$invertedHeaderBorderColor: $invertedCellBorderColor;

$invertedDefinitionColumnBackground: $subtleTransparentWhite;
$invertedDefinitionColumnColor: $invertedSelectedTextColor;
$invertedDefinitionColumnFontWeight: bold;

/* Basic */
$basicTableBackground: transparent;
$basicTableBorder: $borderWidth solid $borderColor;
$basicBoxShadow: none;

$basicTableHeaderBackground: transparent;
$basicTableCellBackground: transparent;
$basicTableHeaderDivider: none;
$basicTableCellBorder: 1px solid rgba(0, 0, 0, 0.1);
$basicTableCellPadding: '';
$basicTableStripedBackground: $transparentBlack;

/* Padded */
$paddedVerticalPadding: 1em;
$paddedHorizontalPadding: 1em;
$veryPaddedVerticalPadding: 1.5em;
$veryPaddedHorizontalPadding: 1.5em;

/* Compact */
$compactVerticalPadding: 0.5em;
$compactHorizontalPadding: 0.7em;
$veryCompactVerticalPadding: 0.4em;
$veryCompactHorizontalPadding: 0.6em;


/* Sizes */
$small: 0.9em;
$medium: 1em;
$large: 1.1em;
