@charset "UTF-8";
@import "css/fonts.css";
@import "css/toc.css";
@import "css/lists.css";

/* === Основни елементи ============================================================================================================================================================================ */
*	{ margin: 0; padding: 0; }

h1	{ font-size: 175%; font-weight: var(--heavy); margin-bottom: 1em; }
h2	{ font-size: 150%; font-weight: var(--bold);  margin-bottom: 0.5em; overflow-x: hidden; border-bottom: 2px groove silver; display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: baseline; }
h3	{ font-size: 125%; font-weight: var(--bold);  margin-bottom: 0.5em; overflow-x: hidden; border-bottom: 1px solid silver;  display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: baseline; }

body[data-sizes~='md'] h2 ~ *		{ margin-left: 1rem; }
h2 ~ input + label					{ margin-left: 1ex; }
h2 + section > h3					{ border-bottom: none; }

h4 									{ font-size: inherit; font-weight: var(--semi-bold); }
section > h4:not(.inline) 			{ font-size: inherit; font-weight: var(--bold); }
h5									{ font-size: inherit; font-weight: var(--semi-bold); font-style: normal; }
h6									{ font-size: inherit; font-weight: var(--semi-bold); font-style: italic; }
li h6								{ font-size: inherit; text-decoration: underline; }

.section-header > nav:not(.pin) > *											{ display: inline-block; padding: 0 0.5ex; }
.section-header > nav:not(.pin) > *:not(:last-child)						{ border-inline-end: 1px solid silver; }

.section-header > nav:not(.pin) > span.nav-container > *					{ border-inline-end: 1px solid black; padding: 0 0.5ex; }
.section-header > nav:not(.pin) > span.nav-container > *:not(:last-child)	{ border-inline-end: 1px solid black; }

:not(section) > h4:not(.section-header), h4.inline,
:not(section) > h5:not(.section-header), h5.inline,
:not(section) > h6:not(.section-header), h6.inline	{ display: inline; }

section > h4,
section > h5,
section > h6		{ overflow-x: hidden; overflow-y: hidden; display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: baseline; }

h2 var, h3 var,
section > h4 var,
section > h5 var,
section > h6 var	{ font-style: inherit; }

h2 > nav:not(.pin):last-child,
h3 > nav:not(.pin):last-child,
section > h4 > nav:not(.pin):last-child,
section > h5 > nav:not(.pin):last-child,
section > h6 > nav:not(.pin):last-child
{
	font-size: 0.85rem;
	font-style: normal;
	font-weight: normal;
	overflow: hidden;
	text-align: right;
	max-width: 50%;
}

body[data-size='xs'] h2 > nav:not(.pin):last-child,
body[data-size='xs'] h3 > nav:not(.pin):last-child,
body[data-size='xs'] section > h4 > nav:not(.pin):last-child,
body[data-size='xs'] section > h5 > nav:not(.pin):last-child,
body[data-size='xs'] section > h6 > nav:not(.pin):last-child
{
	font-size: 0.75rem;
}

dfn, em							{ font-weight: var(--medium); font-style: italic; }
h4 em, h5 em, h6 em				{ font-weight: var(--bold); }
strong							{ font-weight: inherit; font-style: italic; }
strong.strong					{ font-weight: var(--medium); font-style: normal; }
small							{ display: block; font-size: 80%; }

section > *:not(img),
div > div, div > small, div > p,
td > div, td > small, td > p, th > p,
small > div
								{ margin-bottom: 0.5rem; }

div.inline-list > *				{ display: inline-block ! important; margin-right: 2ex; vertical-align: top; padding-top: 0 ! important; }
div.inline-list > table			{ display: inline-table; }

td > section:first-child > *:first-child	{ padding-top: 0; }
th > section:first-child > *:first-child	{ padding-top: 0; }

p								{  }

*.hf, p, small, div, li
{
	hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -webkit-hyphens: auto;
}

*.no-hf, .no-hf p, .no-hf small, .no-hf div, .no-hf li
{
	hyphens: manual; -moz-hyphens: manual; -ms-hyphens: manual; -webkit-hyphens: manual;
}

img[data-standalone-image]	{ max-width: calc(100% - 2ex); }

/* --- Връзки -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
a												{ color: #36B; text-decoration: none; --icon: none; }
a:visited										{ color: #36B; }
a:hover											{ text-decoration: underline; }
a:not(.no-icon):not(.icon-left):after			{ content: var(--icon); padding-left: 4px; }
a.icon-left:before								{ content: var(--icon); padding-right: 4px; }
*.link-here:before								{ content: "☞"; padding-right: 0.5ex; }
a[hreflang='en']								{ --icon: url(/$/icons/flags/gb.png); }
a[hreflang='bg']								{ --icon: url(/$/icons/flags/bg.png); }
a[hreflang='de']								{ --icon: url(/$/icons/flags/de.png); }
a[hreflang='ru']								{ --icon: url(/$/icons/flags/ru.png); }
a[hreflang='ja']								{ --icon: url(/$/icons/flags/jp.png); }
a.hidden-link									{ --icon: none; color: black; text-decoration: underline dashed 1px #EEE; }

a.broken										{ color: #B63; cursor: url("/$/cursors/broken-link.cur"), pointer; }
a.broken.visited								{ color: #B63; cursor: pointer; }

a[href^="#"]									{ color: blue; }
a[href^="#"].broken								{ color: red; }

a[href^="http://"], a[href^="https://"]			{ color: #349; }
a[href^="http://"].broken,
a[href^="https://"].broken						{ color: #943; }

a[href^="http://"],
a[href^="https://"]								{ --icon:url("/$/icons/external-doc.gif"); }
a[href$=".pdf"]                     			{ --icon:url("/$/icons/pdf.gif"); }
a[href*=".pdf#page"]							{ --icon:url("/$/icons/pdf-page.gif"); }
a[href$=".chm"], a[href*=".chm#"]				{ --icon:url("/$/icons/chm.gif"); }
a[href$=".xls"], a[href$=".xlsx"]				{ --icon:url("/$/icons/xls.gif"); }
a[href*="www.unicode.org"]						{ --icon:url("/$/icons/unicode.png"); }
a[href*=".wikipedia.org"]						{ --icon:url("/$/icons/wikipedia.gif"); }
a[href$=".doc"], a[href$=".docx"]				{ --icon:url("/$/icons/word.gif"); }
a[href*="developer.mozilla.org"]				{ --icon:url("/$/icons/mozilla.gif"); }
a[href-lang='bg']:not(:lang(bg))				{ --icon:url("/$/icons/cc/BG.png"); }

span[onclick]									{ color: blue; cursor: url("/$/cursors/open-text.cur"), pointer; }
span[onclick]:hover								{ text-decoration: underline; }
span.shown[onclick]								{ color: magenta; cursor: url("/$/cursors/close-text.cur"), pointer; }

a + .anchor-note:before							{ content: '('; }
a + .anchor-note:after							{ content: ')'; }

/* === Структура на документа ====================================================================================================================================================================== */

/* --- Основен документ ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
:root
{
	font-size: 1rem;
	height: 100%;
}

body
{
	background-color: white;
	font-family: "Text";
	font-synthesis:weight style small-caps;
	height: 100%;
	hyphens: manual; -moz-hyphens: manual; -ms-hyphens: manual; -webkit-hyphens: manual;
	text-rendering: optimizeLegibility;
	display: grid;
	grid-template-rows: auto 1fr auto;
}

/* --- Съдържание ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
nav > li							{ display: block; }
nav.inline							{ display: inline; }
nav.inline > *						{ display: inline; }

header > form > nav.inline > li:not(:last-child):after
{
	content: "|";
	padding-left: 0.5ex;
	padding-right: 0.5ex;
}

a.jump
{
	background-color: rgba(0,0,0,0.15);
	border-radius: 1em;
	color: white ! important;
	height: 2em;
	position: fixed;
	right: 24px;
	text-align: center;
	width: 2em;
	z-index: 101;
}

a.jump:hover			{ color: white; background-color: blue; }
a.jump > span			{ position: relative; top: 2px; }
a.jump[href='#top']		{ margin-top: 6px; }
a.jump[href='#bottom']	{ top: calc(100vh - 60px); }

nav.top-link
{
	bottom: 28px;
	display: none ! important;
	font-size: 9.5pt;
	left: 0;
	margin: 0;
	max-width: 1.5em;
	position: fixed ! important;
	overflow: hidden;
	text-overflow: ellipsis;
	writing-mode: vertical-lr;
	writing-mode: sideways-lr;
	z-index:10000;
}

nav.top-link > *		{ white-space: nowrap; }
nav.top-link var		{ font-style: inherit; }
nav.top-link var > var	{ display: none; }
nav.top-link > a		{ cursor: url("/$/cursors/sideways.cur") 3 14, pointer; }
nav.top-link > a var	{ display: none; }

*:is(h2,h3,h4,h5,h6,section)[id]		{ border-left: 1px inset transparent; border-top: 1px inset transparent; border-right: 1px inset transparent; border-top-left-radius: 15px; border-top-right-radius: 15px; }
*:is(h2,h3,h4,h5,h6,section)[id]:target	{ border-left: 1px inset red; 		 border-top: 1px inset red;       border-right: 1px inset red; }

*:target > nav.top-link,
*:target > h2 > nav.top-link,
*:target > h3 > nav.top-link,
*:target > h4 > nav.top-link	{ display: block ! important; }

/* nav.pin представлява бутона за "закопчаване" на раздела. Нормално този бутон не се вижда */
nav.pin > *									{ display: none; position: relative; top: -2ex; }
nav.pin										{ padding-left: 4px; }

figcaption:not(:target):hover > nav.pin > a,
*:not(:target) > h2:hover nav.pin > a,
*:not(:target) > h3:hover nav.pin > a,
*:not(:target) > h4:hover nav.pin > a,
*:not(:target) > h5:hover nav.pin > a,
*:not(:target) > h6:hover nav.pin > a		{ display: inline; text-decoration: none; font-size: 50%; }

figcaption:target > nav.pin > a + span,
*:target > h2 nav.pin > a + span,
*:target > h3 nav.pin > a + span,
*:target > h4 nav.pin > a + span,
*:target > h5 nav.pin > a + span,
*:target > h6 nav.pin > a + span			{ display: inline; font-size: 50%; }

/* --- Заглавка (навигационна лента) --------------------------------------------------------------------------------------------------------------------------------------------------------------- */
body > header
{
	background-color: white;
	border-bottom: 2px groove black;
	box-shadow: 0px 2px 1px 1px #CCC;
	font-size: smaller;
	padding-right: 4px;
	text-align: right;
	z-index: 100;
}

body > header nav var
{
	display: none;
}

/* --- Основен текст ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
body > main
{
	--left: 0.5ex;
	padding-left: var(--left);
	padding-right: 1rem;
}

@media (max-height: 550px)
{
	body	{ display: block; }
}

body > main:-moz-focusring
{
	outline: none;
}

/* --- Странѝчен текст ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
aside, figure
{
	border: 2px groove black;
	font-size: smaller;
	overflow-x: auto;
	padding: 4px;
	margin-top: 0;
	margin-right: 0.5ex;
	margin-bottom: 0;
	margin-left: var(--left);
	position: relative;
	z-index: 100;
}

aside.narrow, figure.narrow
{
	float: right;
	max-width: 20vw;
}

body:not([data-sizes~='md']) :is(aside,figure):not(.narrow)
{
	margin-right: auto ! important;
	margin-left: auto ! important;
	max-width: calc(100% - 24px);
}

body[data-sizes~='md'] :is(aside,figure):not(.narrow)
{
	float: inline-end;
	max-width: 40vw;
}

h2 + aside, h3 + aside, section > h4.plain + aside, section > h5.plain + aside, section > h6.plain + aside,
h2 + figure, h3 + figure, section > h4.plain + figure, section > h5.plain + figure, section > h6.plain + figure
{
	margin-top: 0.5em;
}

figure				{ width: min-content; width: -moz-min-content; width: -webkit-min-content; }
figcaption:empty	{ display: none; }

figcaption
{
	font-size: 112.5%;
	font-weight: var(--semi-bold);
}

figcaption:not(.visual-mark)
{
	margin-bottom: 0.5em;
}

figcaption:not(:first-child)	{ margin-top: 0.5rem; }
aside figcaption				{ border-bottom: 2px groove silver; }

/* --- Епилог -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
body > footer
{
	background-color: white;
	border-top:3px groove silver;
	box-shadow: 0px -2px 1px 1px #CCC;
	font-size: smaller;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

#modification-date > *	{ display: inline; white-space: nowrap;}
#confidential			{ color: red; padding-right: 4px; }

#exclusive-rights
{
	border-top: 1px solid silver;
	clear: both;
	margin-top: 5em;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	padding-right: 2ex;
}

#exclusive-rights > div[lang]
{
	margin-left: 3ex ! important;
	padding-left: 1.5ex;
	position: relative;
	text-align: left;
}

#exclusive-rights > div[lang]:before
{
	background-color: black;
	color: white;
	content: attr(lang);
	font-family: "Text";
	font-style: normal;
	font-variant: small-caps;
	left: -3ex;
	position: absolute;
	text-align: center;
	width: 3ex;
}

#exclusive-rights > div[lang='bg']:before {	content: "бг"; }
#exclusive-rights > div[lang='ru']:before { content: "ру"; }
#exclusive-rights > div[lang='jp']:before { content: "日"; }
#exclusive-rights > div[lang='he']:before { content: "עִב"; }
#exclusive-rights > div[lang='ar']:before { content: "ﺏﺥ"; }

#exclusive-rights > div:lang(jp):before
{
	top: 0.5em;
}

#exclusive-rights > div:lang(he), #exclusive-rights > div:lang(ar)
{
	direction: rtl;
}

/* --- @media -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
@media print
{
	body > header, body > footer, .jump
	{
		display: none;
	}

	h1, h2, h3
	{
		page-break-after: avoid;
	}

	*
	{
		orphans: 2;
		widows: 2;
	}
}

@media screen
{
	body > main
	{
		border-left: 1px solid gray;
		box-shadow: 4px 4px 4px 4px gray;
		margin-left: 2ex;
		overflow-y: auto;
	}

	body[data-size='xs'] > main                         { margin-left: 0; padding-left: 0; padding-right: 0; }
	body[data-size='xs'] :target > nav.inline.top-link  { display: none ! important; }
}

/* --- Езици --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
span[lang]:not(.no-prefix):before,      			*.vocabulary:lang(bg) > dfn[lang]:before,      *.vocabulary:lang(bg) > div > dfn[lang]:before			{ content: attr(lang) " "; }

:lang(bg) > span[lang='bg']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='bg']:before, *.vocabulary:lang(bg) > div > dfn[lang='bg']:before		{ content: "бг. "; }
:lang(bg) > span[lang='cs']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='cs']:before, *.vocabulary:lang(bg) > div > dfn[lang='cs']:before		{ content: "чеш. "; }
:lang(bg) > span[lang='de']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='de']:before, *.vocabulary:lang(bg) > div > dfn[lang='de']:before		{ content: "нем. "; }
:lang(bg) > span[lang='el']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='el']:before, *.vocabulary:lang(bg) > div > dfn[lang='el']:before		{ content: "ст.грц. "; }
:lang(bg) > span[lang='en']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='en']:before, *.vocabulary:lang(bg) > div > dfn[lang='en']:before		{ content: "англ. "; }
:lang(bg) > span[lang='it']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='it']:before, *.vocabulary:lang(bg) > div > dfn[lang='it']:before		{ content: "ит. "; }
:lang(bg) > span[lang='ja']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='ja']:before, *.vocabulary:lang(bg) > div > dfn[lang='ja']:before		{ content: "яп. ";  font-family: "Text"; }
:lang(bg) > span[lang='ko']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='ko']:before, *.vocabulary:lang(bg) > div > dfn[lang='ko']:before		{ content: "кор. "; font-family: "Text"; }
:lang(bg) > span[lang='la']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='la']:before, *.vocabulary:lang(bg) > div > dfn[lang='la']:before		{ content: "лат. "; }
:lang(bg) > span[lang='ru']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='ru']:before, *.vocabulary:lang(bg) > div > dfn[lang='ru']:before		{ content: "рус. "; }
:lang(bg) > span[lang='sr']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='sr']:before, *.vocabulary:lang(bg) > div > dfn[lang='sr']:before		{ content: "срб. "; }
:lang(bg) > span[lang='tr']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='tr']:before, *.vocabulary:lang(bg) > div > dfn[lang='tr']:before		{ content: "тур. "; }
:lang(bg) > span[lang='zh']:not(.no-prefix):before, *.vocabulary:lang(bg) > dfn[lang='zh']:before, *.vocabulary:lang(bg) > div > dfn[lang='zh']:before		{ content: "кит. "; font-family: "Text"; }

*:lang(bg) > span[lang]:not([lang='bg']) + span:not(.regular)[lang='bg']:before	{ content: "\2018"; }
*:lang(bg) > span[lang]:not([lang='bg']) + span:not(.regular)[lang='bg']:after	{ content: "\2019"; }

span[lang]:not(.regular)											{ font-style: italic; }
*:lang(ja), *:lang(zh), *:lang(ko)									{ font-family: Text; }
span[lang="ja"], span[lang="yue"], span[lang="zh"], span[lang="ko"]	{ font-style: normal ! important; }
span[lang]:not(.regular):before										{ font-style: normal; }
span[lang='ipa']:before, span[lang='ipa']:after						{ content: "/" ! important; }

/* --- Други елементи ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
address
{
	font-style: normal;
}

*.nohf
{
	hyphens: manual; -moz-hyphens: manual; -ms-hyphens: manual; -webkit-hyphens: manual;
}

.nobr
{
	white-space: nowrap ! important;
}

.br
{
	white-space: normal ! important;
}

mark
{
	color: green;
	background-color: transparent;
}

mark a	{ color: #088 ! important; }

mark[data-color]:lang(bg):empty:before		{ content: 'със зелен цвят'; }

ins
{
	font-style: italic;
	font-weight: var(--semi-light);
	text-decoration: none;
}

del
{
	font-style: italic;
	font-weight: var(--light);
	text-decoration: line-through;
	text-decoration-style: wavy;
}

del dfn, del em	{ font-weight: var(--semi-light); }

em.strong
{
	font-weight: var(--heavy);
	font-variant: small-caps;
}

del em.strong	{ font-weight: var(--semi-bold); }

ins > abbr, del abbr
{
	border-color: darkgray;
}

ins h3, ins h4, ins h5, ins dfn, ins em, ins dl:not(.light):not(.math1) > dt
{
	font-weight: bolder;
}

abbr
{
	border: none;
	cursor: help;
	text-decoration-line: underline; -ms-text-decoration-line: underline; -webkit-text-decoration-line: underline;
	text-decoration-style: dashed; -ms-text-decoration-style: dashed; -webkit-text-decoration-style: dashed;
	text-decoration-color: blue; -ms-text-decoration-color: blue; -webkit-text-decoration-color: blue;
}

h2 > nav.inline > abbr,
h3 > nav.inline > abbr
{
	text-decoration: none;
}

q:lang(bg):before						{ content: '„'; }
q:lang(bg):after						{ content: '“'; }

cite									{ font-style: italic; }
cite var								{ font-style: normal; }
rt         								{ font-weight: normal; font-variant-east-asian: ruby; }
rt:lang(bg)								{ font-style:italic; }
s										{ text-decoration: overline; }
s > s:only-child						{ border-top: 3px double black; }
sub										{ font-variant-position:sub; }
sup										{ font-variant-position:super; }
div.illustration, p.illustration		{ overflow-x: auto; margin-right: 4px; }
.sideways								{ writing-mode: vertical-lr; writing-mode: sideways-lr; }
input[readonly]							{ color: silver; color: GrayText; cursor: default; }
del a, a del, ins a, a ins				{ color: #112299; }

.no-clear								{ clear: none ! important; }
div.no-clear							{ overflow-x: hidden; }

span.empty								{ display: inline-block; }
span.empty[data-width='16']				{ width: 16px; }

body[data-size='xx'] #viewport:after { content: ' (XX) '; }
body[data-size='xl'] #viewport:after { content: ' (XL) '; }
body[data-size='lg'] #viewport:after { content: ' (LG) '; }
body[data-size='md'] #viewport:after { content: ' (MD) '; }
body[data-size='sm'] #viewport:after { content: ' (SM) '; }
body[data-size='xs'] #viewport:after { content: ' (XS) '; }

.size-xx, .size-xl, .size-lg, .size-md, .size-sm, .size-xs	{ display: none ! important; }

body[data-size='xx'] .size-xx { display: revert ! important; }
body[data-size='xl'] .size-xl { display: revert ! important; }
body[data-size='lg'] .size-lg { display: revert ! important; }
body[data-size='md'] .size-md { display: revert ! important; }
body[data-size='sm'] .size-sm { display: revert ! important; }
body[data-size='xs'] .size-xs { display: revert ! important; }

body:not([data-sizes~='sm']) .hide-xs		{ display: none; }

body:not([data-sizes~='sm']) .smaller-xs	{ font-size: smaller; }
body:not([data-sizes~='md']) .smaller-sm	{ font-size: smaller; }
body:not([data-sizes~='lg']) .smaller-md 	{ font-size: smaller; }
body:not([data-sizes~='xl']) .smaller-lg 	{ font-size: smaller; }
body:not([data-sizes~='xx']) .smaller-xl 	{ font-size: smaller; }

span#viewport::before						{ content: 'View port: '; }

html:not([data----debug]) *.if-debug     	{ display: none; }
