//
// Variables
// --------------------------------------------------


// Dimensions
// --------------------------------------------------

$space-min:    4px;
$space-xs:     8px;
$space-sm:    12px;
$space-md:    16px;
$space-lg:    24px;
$space-xl:    32px;
$space-xxl:   48px;
$space-max:   64px;

$space-thumb: 42px;


// Typography
// --------------------------------------------------

$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
$font-family-base:       $font-family-sans-serif;

$font-size-base:   13px;

$font-size-h1: 20px;
$font-size-h2: 16px;

$line-height-base:           1.539;
$line-height-computed:       ceil($font-size-base * $line-height-base);

// todo: line-height-small
$line-height-large: 26px;
$line-height-large-touch: $space-thumb;

$link-hover-decoration: underline;

$headings-font-family:    inherit;
$headings-font-weight:    400;
$headings-line-height:    1.2;


// Components
// --------------------------------------------------

$padding-base-vertical: 2px;

$padding-base-horizontal: $space-xs;
$padding-large-horizontal: $space-sm;

$border-radius-small: 3px;
$border-radius-base:  4px;
$border-radius-large: 6px;

$border-width: 1px;

$separator-width: 1px;

// Buttons
// --------------------------------------------------

$btn-disabled-opacity: 0.5;

// Z-index master list
// --------------------------------------------------

$z-index-mobile-nav:     0;
$z-index-navbar-bg:     10;
$z-index-main:          10;
$z-index-level:         10;
$z-index-level-active:  20;
$z-index-navbar:        20;
$z-index-menu:          30;
$z-index-modal:         40;
$z-index-drag-layer:    50;
$z-index-loading-cover: 60;

// Item pane
// --------------------------------------------------
$item-pane-sections: (
	"info": var(--accent-blue),
	"abstract": var(--accent-azure),
	"attachments": var(--accent-green),
	"notes": var(--accent-yellow),
	"attachment-info": var(--accent-green),
	"attachment-preview": #926d70,
	"attachment-annotations": var(--tag-purple),
	"libraries-collections": var(--accent-teal),
	"tags": var(--accent-orange),
	"related": var(--accent-wood),
);

$tagColorsLookup: (
	'#ff6666': --tag-red,
	'#ff8c19': --tag-orange,
	'#999999': --tag-gray,
	'#5fb236': --tag-green,
	'#009980': --tag-teal,
	'#2ea8e5': --tag-blue,
	'#576dd9': --tag-indigo,
	'#a28ae5': --tag-purple,
	'#a6507b': --tag-plum,
);