// ---------- Cards horizontal ----------

$card-horizontal-on-border: #65b6f0 !default;
$card-horizontal-on-border-width: 2px !default;

// Liferay Page Layouts Card

$lfr-page-layouts-card-after-highlight: () !default;
$lfr-page-layouts-card-after-highlight: map-merge(
	(
		border-radius: map-get($card-interactive-after-highlight, border-radius),
		bottom: map-get($card-interactive-after-highlight, bottom),
		content: map-get($card-interactive-after-highlight, content),
		height: map-get($card-interactive-after-highlight, height),
		left: map-get($card-interactive-after-highlight, left),
		position: map-get($card-interactive-after-highlight, position),
		right: map-get($card-interactive-after-highlight, right),
		transition: map-get($card-interactive-after-highlight, transition),
		hover-bg: map-get($card-interactive-primary-after-highlight, hover-bg),
		hover-height: map-get($card-interactive-after-highlight, hover-height),
		focus-bg: map-get($card-interactive-primary-after-highlight, focus-bg),
		focus-height: map-get($card-interactive-after-highlight, focus-height),
		active-bg: map-get($card-interactive-primary-after-highlight, active-bg),
		active-height: map-get($card-interactive-after-highlight, active-height),
	),
	$lfr-page-layouts-card-after-highlight
);

$lfr-page-layouts-card: () !default;
$lfr-page-layouts-card: map-merge(
	(
		border-width: map-get($card-type-template, border-width),
		box-shadow: map-get($card-type-template, box-shadow),
		cursor: map-get($card-interactive, cursor),
		outline: map-get($card-interactive, outline),
		transition: map-get($card-interactive, transition),
		hover-bg: map-get($card-interactive, hover-bg),
		hover-box-shadow: map-get($card-interactive-primary, hover-box-shadow),
		hover-text-decoration: map-get($card-interactive, hover-text-decoration),
		focus-bg: map-get($card-interactive-primary, focus-bg),
		focus-border-color: map-get($card-interactive, focus-border-color),
		focus-box-shadow: map-get($card-interactive, focus-box-shadow),
		active-bg: map-get($card-interactive-primary, active-bg),
		after-highlight: $lfr-page-layouts-card-after-highlight,
	),
	$lfr-page-layouts-card
);

$lfr-page-layouts-card-checked-after-highlight: () !default;
$lfr-page-layouts-card-checked-after-highlight: map-merge(
	(
		bg: map-get($card-interactive-primary-after-highlight, hover-bg),
		border-radius:
			map-get($card-interactive-primary-after-highlight, border-radius),
		bottom: map-get($card-interactive-after-highlight, bottom),
		content: map-get($card-interactive-after-highlight, content),
		height: map-get($card-interactive-after-highlight, active-height),
		left: map-get($card-interactive-after-highlight, left),
		position: map-get($card-interactive-after-highlight, position),
		right: map-get($card-interactive-after-highlight, right),
		transition: map-get($card-interactive-after-highlight, transition),
	),
	$lfr-page-layouts-card-checked-after-highlight
);

$lfr-page-layouts-card-checked: () !default;
$lfr-page-layouts-card-checked: map-merge(
	(
		bg: map-get($card-interactive, hover-bg),
		box-shadow: map-get($card-interactive-primary, hover-box-shadow),
		cursor: default,
		after-highlight: $lfr-page-layouts-card-checked-after-highlight,
	),
	$lfr-page-layouts-card-checked
);

// ---------- Dialogs ----------

$dialog-footer-bg: $white !default;
$dialog-footer-border-color: $modal-footer-border-color !default;
$dialog-footer-box-shadow: if(
	variable-exists(modal-footer-box-shadow),
	$modal-footer-box-shadow,
	null
) !default;
$dialog-footer-height: 60px;
$dialog-navbar-height: 48px !default;

$dialog-desktop-footer-bg: if(
	variable-exists(modal-desktop-footer-bg),
	$modal-desktop-footer-bg,
	$dialog-footer-bg
) !default;
$dialog-desktop-footer-height: 80px;
$dialog-desktop-navbar-height: if(
	variable-exists(navbar-desktop-height),
	$navbar-desktop-height,
	$dialog-navbar-height
) !default;

$dialog-footer-padding: 20px !default;
$dialog-iframe-padding: 0 !default;

// ---------- Toggle card ----------

$toggle-card-border-radius: 2px !default;

$toggle-card-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15) !default;

$toggle-card-icon-border-radius: 30px !default;
$toggle-card-icon-height: 32px !default;
$toggle-card-icon-width: 32px !default;

$toggle-card-border: #dce0e3 !default;
$toggle-card-border-width: 1px !default;
$toggle-card-icon-bg: $white !default;
$toggle-card-icon-border: #869cad !default;
$toggle-card-icon-border-width: 0 !default;

$toggle-card-on-border: #65b6f0 !default;
$toggle-card-on-border-width: 2px !default;
$toggle-card-on-icon-bg: $white !default;
$toggle-card-on-icon-border: #65b6f0 !default;
$toggle-card-on-icon-border-width: 0 !default;

// ---------- File icons colors ----------

$file-icon-color-0: $white !default;
$file-icon-color-1: $white !default;
$file-icon-color-2: $white !default;
$file-icon-color-3: $white !default;
$file-icon-color-4: $white !default;
$file-icon-color-5: $white !default;
$file-icon-color-6: $white !default;
$file-icon-color-7: $white !default;

// ---------- File icons text colors ----------

$file-icon-text-color-0: $gray-600 !default;
$file-icon-text-color-1: $gray-600 !default;
$file-icon-text-color-2: $teal-l1 !default;
$file-icon-text-color-3: $red-l1 !default;
$file-icon-text-color-4: $orange-l1 !default;
$file-icon-text-color-5: $purple-l1 !default;
$file-icon-text-color-6: $cyan-l1 !default;
$file-icon-text-color-7: $pink-l1 !default;

// ---------- User icons background colors ----------

$user-icon-bg-color-0: $white !default;
$user-icon-bg-color-1: $white !default;
$user-icon-bg-color-2: $white !default;
$user-icon-bg-color-3: $white !default;
$user-icon-bg-color-4: $white !default;
$user-icon-bg-color-5: $white !default;
$user-icon-bg-color-6: $white !default;
$user-icon-bg-color-7: $white !default;
$user-icon-bg-color-8: $white !default;
$user-icon-bg-color-9: $white !default;

// ---------- User icons border color ----------

$user-icon-border-color-0: $gray-300 !default;
$user-icon-border-color-1: $gray-300 !default;
$user-icon-border-color-2: $gray-300 !default;
$user-icon-border-color-3: $gray-300 !default;
$user-icon-border-color-4: $gray-300 !default;
$user-icon-border-color-5: $gray-300 !default;
$user-icon-border-color-6: $gray-300 !default;
$user-icon-border-color-7: $gray-300 !default;
$user-icon-border-color-8: $gray-300 !default;
$user-icon-border-color-9: $gray-300 !default;

// ---------- User icons colors ----------

$user-icon-color-0: $gray-600 !default;
$user-icon-color-1: $blue-l2 !default;
$user-icon-color-2: $orange-l1 !default;
$user-icon-color-3: $red-l1 !default;
$user-icon-color-4: $teal-l1 !default;
$user-icon-color-5: $pink-l1 !default;
$user-icon-color-6: $green-l1 !default;
$user-icon-color-7: $purple-l1 !default;
$user-icon-color-8: $yellow-d3 !default;
$user-icon-color-9: $cyan-l1 !default;

// ---------- Column widths ----------

$portlet-column-content-empty-padding: 50px;