@namespace MadCap url(http://www.madcapsoftware.com/Schemas/MadCap.xsd);
/*<meta />*/

:root
{
	--text-color: #252525;

	--basis-gray-light: #e1e6ea;
	--basis-gray: #bdcad2;
	--basis-gray-dark: #678698;
	--basis-gray-darker: #536b79;
	--basis-purple-light: #dfdaf1;
	--basis-purple-medium: #9e8fd6;
	--basis-purple-medium-dark: #4b3696;
	--basis-purple: #3b2b77;
	--basis-purple-dark: #2f225e;
	--link-blue: #285abd;
	--link-blue-dark: #1f4693;

	--basis-purple-hue: 253;
	--basis-purple-saturation: 47%;

	--link-blue-background: rgba(40, 115, 189, 0.1);
	--link-purple: #5a28bd;
	--link-purple-dark: #461f93;
	--link-purple-background: rgba(90, 40, 189, 0.1);
	
	--deprecated-text: #bd2828;
	--deprecated-text-dark: #931f1f;
	--deprecated-text-background: rgba(189, 40, 40, 0.1);
	--deprecated-text-light: #f7d4d4;

	--text-width: 60em;
	--content-indent: 0.5em;
	--code-font: Consolas, 'Courier New', Courier, 'Droid Sans Mono', monospace;
	--normal-font: Arial, sans-serif;
	/* todo: expand upon these fonts */
}

body
{
	padding: 1em;
	text-align: left;
	font-family: var(--normal-font);
	font-size: 90%;
	/* Allegedly, using a percentage as the base font size and using ems for everything else is the best way to go. (Previously 10pt) */
	color: var(--text-color);
}

body.archived
{
	background-image: url('../Images/archived.png');
	background-repeat: repeat !important;
	background-attachment: fixed;
}

div.page-content
{
	max-width: var(--text-width);
	/* 1024px */
	/*	margin: auto; */
}

.body-container
{
	border-left: 1px solid var(--basis-gray);
	border-top: 1px solid var(--basis-gray);
}

p,
p.Normal	/* Use "Normal" sparingly, to override inherited styles and force normal paragraph styling */
{
	margin-left: 0.5em;
	/* max-width: var(--text-width); */
}

h1
{
	font-size: 1.5em;
	font-weight: bold;
	mc-next-tag: p;
}

img.logo_image
{
	max-height: inherit;
	position: relative;
	top: 3.5px;
	margin-right: 3px;
	transition: box-shadow 0.5s;
	border-radius: 2px;
	animation: wobble 7s infinite;
}

@keyframes wobble{
  2% {transform: rotate(-5deg);}
  6% {transform: rotate(5deg);}
  10% {transform: rotate(-5deg);}
  14% {transform: rotate(5deg);}
  18% {transform: rotate(-5deg);}
  20% {transform: rotate(0deg);}
}

img.logo_image:hover
{
  box-shadow: 2px 2px 10px 2px var(--link-blue-dark);
}

.BBj::before {
	content: "";
	display: inline-block;
	background-image: url("../../images/bbj40.png");
	background-size: contain;
	background-repeat: no-repeat;
	width: 1.25em;
	height: 1.25em;
	margin-right: 0.3em;
	vertical-align: middle;
}

h2
{
	font-size: 1.25em;
	mc-next-tag: p;
}

h3
{
	font-weight: bold;
	font-size: 1.1em;
	mc-next-tag: p;
}

h4
{
	font-size: 1em;
	font-weight: bold;
	mc-next-tag: p;
	color: var(--basis-purple);
}

h5
{
	font-size: 1em;
	font-weight: bold;
	mc-next-tag: p;
}

ul
{
	list-style-type: disc;
}

ul ul
{
	list-style-type: square;
}

ol
{
	list-style-type: decimal;
}

ol ol
{
	list-style-type: lower-alpha;
}

dl
{
	display: inline;
}

dt
{
	font-family: var(--code-font);
	font-weight: bold;
	float: left;
	margin-right: 3em;
}

dd
{
	font-family: var(--normal-font);
	font-weight: normal;
	margin-left: 3em;
}

li
{
	margin-top: 1em;
}

figcaption
{
	font-style: italic;
}

.Code, code
{
	font-weight: bold;
	font-family: var(--code-font);
	white-space: normal;
	hyphens: none;
}

.file	/* Use this for file/directory names */
{
	font-weight: bold;
	font-family: var(--code-font);
	white-space: normal;
	hyphens: none;
}

.terminal	/* Use this for representations of a terminal/CLI */
{
	font-family: var(--code-font);
	font-weight: bold;
	background-color: #3a3a3a;
	color: #FFFFFF;
	padding: 1em;
	border-radius: 10px;
}

.terminal p
{
	margin-top: 0.1em;
	margin-bottom: 0.1em;
}

.deprecated
{
	color: var(--deprecated-text);
}

p.GraphicSpace
{
	margin-top: 5.00pt;
	margin-bottom: 5.00pt;
}

p.Block_Text	/* creates a hanging indent style */
{
	margin-left: 24.00pt;
	margin-top: 6.00pt;
	margin-bottom: 0.00pt;
	text-indent: -24.00pt;
}

symbol
{
	margin-left: 18.00pt;
	margin-top: 6.00pt;
	margin-bottom: 0.00pt;
	text-indent: -18.00pt;
}

kbd
{
	font-family: var(--code-font);
	/*	margin: 5.5em .1em; */
	padding: 0em .2em;
	border: 1px solid black;
	border-radius: 2px;
	font-weight: bold;
	text-shadow: 0 1px 0 hsl(0, 0%, 100%);
	background-color: var(--basis-gray-light);
	box-shadow: 0 1px 1px hsla(210, 8%, 5%, 0.15), inset 0 1px 0 0 #fff;
}

var
{
	font-weight: normal;
	font-family: var(--code-font);
}

img
{
	max-width: 100%;
}

img.Thumbnail	/* Use this to make images small until you hover over them */
{
	mc-thumbnail: popup;
	mc-thumbnail-max-height: 100px;
}


img .bordered
{
	margin-left: calc(2 * var(--content-indent, 1em));
    border: 1px solid var(--basis-gray);
    border-radius: 0.5em;
    box-shadow: 0 0.1em 0.5em var(--basis-gray-light);
}

img.EM_icon
{
	position: relative;
	top: .15rem;
	padding-left: .25em;
	padding-right: .50em;
}

img.GUI_button /* Use this to position buttons and icons in line with text */
{
	max-height: 1.5rem;
	max-width: auto;
	position: relative;
	top: .15rem;
	padding-left: .25em;
	padding-right: .25em;
}

img.shadow_box
{
  margin: 5px;
  padding: 0px;
  border-radius: 5px;
  box-shadow: 0px 5px 8px rgba(0, 0, 0, 0.5);
  max-width: 80%;
  height: auto;
}
  
div.center
{
	text-align: center;
}

button
{
	min-width: 8em;
	padding: 0.25em;
    background: var(--basis-purple-light);
	border: thin solid;
	border-radius: 0.25em;
    border-color: var(--basis-purple);
    color: var(--basis-purple);
	transition: all 100ms ease-out;
	font-weight: bold;	
}

button:hover
{
	background: var(--basis-purple-medium-dark);
	border-color: var(--basis-purple-light);
	color: var(--basis-purple-light);
}

button:active
{
	background: var(--basis-purple-dark);
}

span.UIElement
{
	font-weight: bold;
}

span.Parameter /* Use <var> instead */
{
	font-weight: normal;
	font-family: var(--code-font);
}

span.keyword	/*Use this style for keywords and key phrases and phrases that are important */
{
	font-weight: bold;
}

span.title	/* Use for titles of articles, citations, etc. */
{
	font-style: italic;
}

.Interface
{
	font-weight: normal;
	font-style: italic;
}

span.reference	/* Use this style for Figure and Table names */
{
	font-weight: bold;
}

span.emphasis	/* Use this for words/phrases that need emphasis */
{
	font-style: italic;
}

span.Normal	/* Use sparingly, to override other styles when needed */
{
	font-family: var(--normal-font);
	font-weight: normal;
}

a.deprecated:link,
MadCap|xref.deprecated
{
	color: var(--deprecated-text);
}

a.deprecated:visited,
MadCap|xref.deprecated
{
	color: var(--deprecated-text-dark);
}

a.deprecated:active,
MadCap|xref.deprecated:active
{
	color: var(--deprecated-text-dark);
}

a.deprecated:hover,
MadCap|xref.deprecated:hover
{
	background-color: var(--deprecated-text-background);
}

a:link,
MadCap|xref
{
	color: var(--link-blue);
}

a:visited,
MadCap|xref:visited
{
	color: var(--link-purple);
}

a:visited:hover,
MadCap|xref:visited:hover
{
	color: var(--link-purple);
	background-color: var(--link-purple-background);
}

a:visited:active,
MadCap|xref:visited:active
{
	color: var(--link-purple-dark);
	background-color: var(--link-purple-background);
}

a:hover,
MadCap|xref:hover
{
	color: var(--link-blue);
	background-color: var(--link-blue-background);
}

a:active,
MadCap|xref:active
{
	color: var(--link-blue-dark);
	background-color: var(--link-blue-background);
}

div.FlexContainer > div > a:hover
{
	background-color: inherit;
}

div.searchContainer
{
	vertical-align: bottom;
	min-width: 55%;
	mc-hidden: hidden;
}

p.Figure
{
	margin-top: 4pt;
	margin-left: 4pt;
	font-weight: bold;
	margin-bottom: 11pt;
	mc-next-tag: p;
}

p.Caption	/* Use for captions below figures */
{
	margin-top: 0.1em;
	margin-bottom: 0.4em;
	font-style: italic;
}

MadCap|breadcrumbsProxy
{
	mc-breadcrumbs-count: 6;
}

MadCap|popupBody.popupBody_1
{
	font-family: 'Microsoft Sans Serif';
	font-size: 8pt;
	padding: 10px 10px;
	color: #000000;
	background-color: #ffffc0;
	margin: 0px;
}

MadCap|indexProxy
{
	mc-output-support: all;
}

p.IndexHeading
{
	font-size: 12pt;
	margin-right: 6.5pt;
}

p.Title-Bar
{
	font-size: 16pt;
	font-weight: bold;
	font-style: normal;
	margin-right: 6.5pt;
	padding-left: 50px;
	padding-top: 16px;
}

div.note,
div.versioned,
div.deprecated_note,
div.superseded_note,
div.archived_note
{
	border-radius: 10px;
	padding: 0.25em;
	max-width: var(--text-width);
	margin: var(--content-indent);
}

div.note
{
	background-color: var(--basis-purple-light);
	border-left: solid 8px var(--basis-purple);
}

div.note > h2
{
	color: var(--basis-purple);
	font-size: 1em;
	margin-top: 0.5em;
	font-weight: bold;
	mc-next-tag: p;
}

div.versioned,
div.archived_note
{
	background-color:  var(--basis-gray-light);
	border-left: solid 8px var(--basis-gray-darker);
}

div.versioned > p:nth-child(1)
{
	font-weight: bold;
	font-style: italic;
	background-image: url("../SVG/history.svg");
	background-repeat: no-repeat;
	background-size: auto 100%;
	padding-left: 1.5em;
}

div.deprecated_note
{
	background-color: var(--deprecated-text-light);
	border-left: solid 8px var(--deprecated-text);
}

div.deprecated_note::before
{
	content: 'Deprecated \A';
	white-space: pre;
	font-weight: bold;
	font-size: 16px;
	line-height: 26px;
}

div.superseded_note
{
	background-color: #cfe6fc;
	border-left: solid 8px #3d99f5;
}

div.superseded_note::before
{
	content: 'Superseded \A';
	white-space: pre;
	font-weight: bold;
	font-size: 16px;
	line-height: 26px;
}

/* ############################################ */
/* ############     TABLE STYLES      ######### */
/* ############################################ */

table
{
	border-collapse: collapse;
	table-layout: auto;
	/* width: var(--text-width); */
	/* margin: var(--content-indent); */
	border: 1px solid #000000;
}

td > table
{
	margin: 5px;
}

th
{
	font-weight: bold;
	text-align: left;
	font-family: var(--normal-font);
	padding: 0.4em;
}

td
{
	padding: 0.3em;
	vertical-align: top;
}

th > p
{
	margin: 0em;
	/* Prevents paragraphs inside table headings having different spacing than those without paragraphs */
}

td > p
{
	margin: 0em;
	/* Prevents paragraphs inside cells having different spacing than those without paragraphs */
}

td p + p
{
    margin-top: 10px; 
	/* Adds vertical spacing if a cell has multiple paragraphs */
}

td > ul
{
	margin: 0.5em 0em 0.5em 0em;
	padding-left: 1.5em;
}

td li
{
	margin: 0.5em 0em 0.5em 0em;
}

td > ol
{
	margin: 0.5em 0em 0.5em 0em;
	padding-left: 1.5em;
}

td.Yes_Box
{
	font-weight: bold;
	background-color: lightgreen;
	border: 1px Solid #000000;
}

td.No_Box
{
	font-weight: bold;
	background-color: red;
	border: 1px Solid #000000;
}

td.Partial_Box
{
	font-weight: bold;
	background-color: yellow;
	border: 1px Solid #000000;
}

td.NA_Box
{
	font-weight: bold;
	background-color: white;
	border: 1px Solid #000000;
}

table.Code_Table
{
	/* width: clamp(max(50%, 300px), 700px, max(100%, calc(100vw - 350px))); */
	min-width: 300px;
	margin-bottom: 0.75em;
	margin-top: 0.75em;
	border: none;
}

table.Code_Table td
{
	background-color: transparent;
	border: none !important;
	padding: 15px 5px 10px;
}

table.CheckBox_Table
{
	border-width: 0;
}

table.CheckBox_Table td
{
 	text-align: center !important;
  	border: 1px solid #000000 !important;
	padding-bottom: 5px;
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 10px;
}

table.CheckBox_Table td:nth-child(1)
{
	font-weight: bold;
	text-align: left !important;
	font-family: var(--normal-font);
}


table.CheckBox_Table th
{
	font-weight: normal;
	font-style: italic;
	border-width: 0;
	font-size: .95em;
	background-color: white;
}

div.Hover_Interface
/* displays a text box when hovering over a link */
{
	margin: 5px;
	background-color: var(--basis-gray);
	border: 1px solid #000000;
	border-radius: 8px;
	padding: 10px;
	display: none;
	position: absolute;
	z-index: 2;
	transition-property:display;
	transition-delay: 1s;
	mc-hidden: hidden;
}

table.CheckBox_Table td >a:hover + div
{
	display: block;
}

div.Pivot_Point_th
{
	height: 140px;
	position: relative;
	mc-hidden: hidden;
}

span.Rotate_th
{
	bottom: 0px;
	left: 15%;
	position: absolute;
	transform: rotate(315deg);
	transform-origin: bottom left;
	white-space: nowrap;
	padding: 5px;
	background-color: white;
	mc-hidden: hidden;
}

table.Methods_Table,
table.Parameter_Table,
table.Code_Description_Table
{
	min-width: 33%;
}

table.Methods_Table
{
	font-family: var(--code-font);
	font-weight: bold;
}

/* Keeps "Return Value" in one line */
table.Methods_Table th:nth-child(1)
{
	overflow:hidden;
	white-space: nowrap;
	mc-hidden: hidden;
}

/* For right-aligned first columns in What's New page */
table.Date_Table
{
	table-layout: fixed;
	width: 100%;
}

table.Date_Table li,
table.Date_Table ul
{
	margin: 0em;
}

table.Date_Table col:nth-child(1)
{
	width: 110px;
	mc-hidden: hidden;
}

table.Date_Table td:nth-child(1),
table.Date_Table th:nth-child(1)
{
	text-align: right;
	mc-hidden: hidden;
}

table.Methods_Table th,
table.Callback_Code_Table th,
table.CheckBox_Table td:nth-child(1),
table.Date_Table th,
table.Parameter_Table th,
table.Flag_Table th,
table.Basic_Table th,
table.Code_Description_Table th
{
	background-color: var(--basis-gray);
	border-right: 1px Solid #000000;
	border-bottom: 1px solid #000000;
	border-top: 1px solid #000000;
	mc-hidden: hidden;

}

table.Methods_Table td,
table.Callback_Code_Table td,
table.CheckBox_Table td,
table.Date_Table td,
table.Parameter_Table td,
table.Flag_Table td,
table.Basic_Table td,
table.Code_Description_Table td
{
	border-right: 1px Solid #000000;
	mc-hidden: hidden;
}

table.Methods_Table td
{
	padding-left: 5em;
	text-indent: -4.5em;
	mc-hidden: hidden;
}

table.Methods_Table tr:nth-child(even),
table.Callback_Code_Table tr:nth-child(even),
table.CheckBox_Table tr:nth-child(even),
table.Date_Table tr:nth-child(even),
table.Parameter_Table tr:nth-child(even),
table.Flag_Table tr:nth-child(even),
table.Basic_Table tr:nth-child(even),
table.Code_Description_Table tr:nth-child(even)
{
	background-color: var(--basis-gray-light);
	mc-hidden: hidden;
}

table.Methods_Table tr:nth-child(odd),
table.Callback_Code_Table tr:nth-child(odd),
table.CheckBox_Table tr:nth-child(odd),
table.Date_Table tr:nth-child(odd),
table.Parameter_Table tr:nth-child(odd),
table.Flag_Table tr:nth-child(odd),
table.Basic_Table tr:nth-child(odd),
table.Code_Description_Table tr:nth-child(odd)
{
	background-color: #FFFFFF;
	mc-hidden: hidden;
}

table.Callback_Code_Table td:nth-child(1),
table.Callback_Code_Table td:nth-child(4),
table.Parameter_Table td:nth-child(odd),
table.Flag_Table td:nth-child(odd),
table.Code_Description_Table td:nth-child(1)
{
	font-family: var(--code-font);
	font-weight: bold;
	mc-hidden: hidden;
}

table.Methods_Table td:nth-child(3n),
table.Parameter_Table td:nth-child(3n)	/* Allows an optional third column for descriptions */
{
	font-family: var(--normal-font);
	padding-left: 0.5em;
	text-indent: 0;
	/* Don't create a hanging indent in this third column. */
	font-weight: normal;
	mc-hidden: hidden;
}

table.Flag_Table tr:nth-child(odd).highlighted
{
	background-color: #bfb5e3 !important;

}

table.Flag_Table tr:nth-child(even).highlighted
{
	background-color: var(--basis-purple-medium) !important;
}

table.Flag_Table thead > tr:nth-child(2) th:nth-child(1)
{
	font-family: var(--code-font);
}

table.Flag_Table thead > tr:nth-child(2) th:nth-child(2)
{
	font-weight: normal;
}

table.Flag_Table > tbody > tr:hover
{
	background-color: var(--link-purple-background);
	cursor: pointer;
}

table.Flag_Table > thead > tr:nth-child(2)
{
	background-color: var(--basis-purple-light);
	border: var(--basis-purple);
}

tr.flag_head th {
	background-color: var(--basis-purple-light);
}

/* ########################################### */
/* ############   FLEX BOX STYLES    ######### */
/* ########################################### */

div.SimpleFlexContainer
{
	display: flex;
	justify-content: flex-start;
	gap: 10px;
}

div.SimpleFlexContainer > div > img.shadow_box
{
	max-width: 300px;
}

div.FlexContainer
{
	display: flex;
	flex-wrap: wrap;
	width: inherit;
}

div.NoFlexContainer,
div.FlexContainer > div
{
	flex-basis: 22em;
	flex-grow: 1;
	margin: 1em;
	padding: 1em;
	background-color: var(--basis-gray);
	color: var(--basis-purple);
	box-shadow: 0 5px 10px rgba(0,0,0,0.3);
	transition: all 0.3s;
}

div.NoFlexContainer:hover,
div.FlexContainer > div:hover
{
	background-color: #f5f5f5;
	box-shadow: 0 12px 24px rgba(0,0,0,0.5);
}

div.FlexContainer > div > a > h2
{
	text-align: center;
	margin-top: 0pt;
}

div.FlexContainer > div > a
{
	display: block;
	padding: 1em;
	color: inherit;
	text-decoration: none;
}

p.MiniTOC1
{
	color: var(--link-blue);
	text-decoration: underline;
	font-weight: bold;
}

p.MiniTOC2,
p.MiniTOC3,
p.MiniTOC4,
p.MiniTOC5
{
	color: var(--link-blue);
	text-decoration: underline;
}

p.Index1
{
	font-weight: bold;
}

p.Index2,
p.Index3,
p.Index4,
p.Index5
{

}

td[data-mc-source-selector="p.Index1"] > span > a
{
	/* This selects the link after an Index1 entry. */
	/* Note that it does NOT select the commas between links */
}

MadCap|codeSnippet
{
	font-size: 1em;
	font-family: var(--code-font);
	border: solid 2px #696969;
	margin: var(--content-indent);
	line-height: normal;
	background: var(--basis-gray);
	padding: 0.5em;
}

MadCap|codeSnippetCopyButton
{
	font-family: vor(--normal-font);
	font-size: 1.1em;
	border: solid 2px #696969;
	border-radius: 4px;
	font-weight: bold;
	/* this doesn't seem to be working */
	background: var(--basis-gray-light);
	padding: 0.5em;
	mc-label: 'Copy';
	padding-bottom: 0.5em;
	padding-top: 0.5em;
	padding-right: 0.5em;
	margin: 0;
	margin-bottom: 0.5em;
}

MadCap|codeSnippetCaption
{
	font-family: Arial;
	font-weight: bold;
	font-size: 1.1em;
	text-decoration: none;
	border: none;
	margin: 0;
	margin-top: 0;
	margin-left: 0;
	text-indent: 0;
	text-align: left;
}

MadCap|codeSnippetCopyButton:hover
{
	background: #FFFFFF;
	color: #285abd;
}

MadCap|codeSnippetCopyButton:active
{
	background: var(--basis-gray-light);
	color: #285abd;
}

MadCap|codeSnippetBody
{
	line-height: 1.4em;
	background: var(--basis-gray-light);
	padding: 1em;
	border: solid 1px #000000;
	margin: 0;
}

/* ########################################### */
/* ##########     Style to remove      ####### */
/* ########################################### */

p.Tip_Note_Heading	/* should be removed, but it is currently used on lots of pages */
{
	margin-top: 6.00pt;
	margin-bottom: 0.00pt;
	font-weight: bold;
	mc-hidden: hidden;
}

p.TableHead	/* Remove this style */
{
	font-family: Arial;
	font-weight: bold;
	mc-hidden: hidden;
}

p.Feature_Grid	/* Remove this style */
{
	margin-top: 0.00pt;
	margin-bottom: 0.00pt;
	mc-hidden: hidden;
}

MadCap|toggler
{
	mc-closed-image: url('../../images/arrowright.gif');
	mc-open-image: url('../../images/arrowdown.gif');
}

.Updated
{
	background-color: #ffebc3;
	border-top: solid 1px #ffbb33;
	border-bottom: solid 1px #ffbb33;
}
