/*
 * Spritmonitor.de theme for Swagger UI.
 *
 * Loaded after dist/swagger-ui.css and dist/index.css and only overrides colours,
 * fonts and the page frame - it lives outside dist/ so that updating the bundled
 * Swagger UI distribution does not remove it.
 *
 * Palette (see public/www/css/screen.css of the main site):
 *   #4a70a7  blue    - header, headlines, primary buttons
 *   #fbe6a6  sand    - navigation bar
 *   #840008  red     - links
 *   #E2E2E2  grey    - page background, borders
 */

/*----------- Page frame -------------*/
body {
	margin: 0;
	padding: 0;
	background: #E2E2E2;
	font-family: Arial, Helvetica, sans-serif;
}

#page {
	margin: 20px auto;
	max-width: 986px;
	background-color: #fff;
	box-shadow: 0 0 7px rgba(0, 0, 0, .25);
	overflow: hidden;
}

/*----------- Header -------------*/
#header {
	margin: 0;
	background-color: #4a70a7;
	background-image: url(https://www.spritmonitor.de/pics/fadebackground.png);
	background-repeat: repeat-x;
	padding: 10px;
	overflow: hidden;
}

.spritmonitorLogo { float: left; }
.spritmonitorLogo img { display: block; border: 0; max-width: 100%; height: auto; }

#headerinfo {
	float: right;
	padding: 12px 0 0 10px;
	color: #ccc;
	text-align: right;
	font-size: 90%;
}

#headerinfo a { color: #fff; text-decoration: none; }
#headerinfo a:hover { text-decoration: underline; }

/*----------- Navigation -------------*/
#navi {
	margin: 0;
	background-color: #fbe6a6;
	overflow: hidden;
	font-size: 90%;
}

#navi ul { margin: 0; padding: 0; list-style-type: none; }
#navi li { display: inline; margin-right: 10px; }

#navilinks { padding: 2px 10px; color: #666; float: left; }
#navilinks_right { padding: 2px 10px 2px 0; float: right; }

#navi a { color: #840008; text-decoration: none; }
#navi a:hover { text-decoration: underline; }

/*----------- Footer -------------*/
#footer {
	clear: both;
	margin-top: 25px;
	padding: 5px 5px 30px;
	text-align: center;
	color: #666;
	font-size: 10px;
	border-top: 1px solid #ccc;
	font-family: Arial, Helvetica, sans-serif;
}

#footernavi { margin: 10px; }

#footer a { color: #840008; text-decoration: none; }
#footer a:hover { text-decoration: underline; }

/*----------- Swagger UI: typography -------------*/
.swagger-ui,
.swagger-ui .info li,
.swagger-ui .info p,
.swagger-ui .info table,
.swagger-ui .opblock-tag small,
.swagger-ui .opblock .opblock-summary-description,
.swagger-ui .opblock-description-wrapper,
.swagger-ui .opblock-external-docs-wrapper,
.swagger-ui .opblock-title_normal,
.swagger-ui .btn,
.swagger-ui select,
.swagger-ui label,
.swagger-ui .tab li {
	font-family: Arial, Helvetica, sans-serif;
}

.swagger-ui .wrapper { max-width: 986px; padding: 0 17px; }

/*----------- Swagger UI: info block -------------*/
.swagger-ui .info { margin: 25px 0; }

.swagger-ui .info .title {
	color: #4a70a7;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 28px;
}

.swagger-ui .info .title small { background: #7d8492; }
.swagger-ui .info .title small.version-stamp { background-color: #840008; }

/* a.nostyle deliberately not listed here: Swagger uses it for the tag headers and
   operation paths, where it is meant to inherit the surrounding colour */
.swagger-ui .info a,
.swagger-ui .renderedMarkdown a {
	color: #840008;
	font-family: Arial, Helvetica, sans-serif;
}

.swagger-ui .info a:hover { color: #840008; text-decoration: underline; }

/*----------- Swagger UI: server / authorize bar -------------*/
.swagger-ui .scheme-container {
	background: #f6f6f6;
	border-left: 10px solid #4a70a7;
	box-shadow: none;
	margin: 0 0 20px;
	padding: 20px 0;
}

.swagger-ui .btn.authorize {
	border-color: #4a70a7;
	color: #4a70a7;
}

.swagger-ui .btn.authorize svg { fill: #4a70a7; }

/*----------- Swagger UI: buttons -------------*/
.swagger-ui .btn {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

.swagger-ui .btn.execute {
	background-color: #840008;
	border-color: #840008;
	color: #fff;
}

.swagger-ui .btn.cancel {
	background-color: transparent;
	border-color: #840008;
	color: #840008;
}

.swagger-ui .btn.try-out__btn {
	border-color: #4a70a7;
	color: #4a70a7;
}

/*----------- Swagger UI: tag sections -------------*/
.swagger-ui .opblock-tag {
	color: #4a70a7;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	border-bottom: 1px solid #E2E2E2;
}

.swagger-ui .opblock-tag:hover { background: #f6f6f6; }
.swagger-ui .opblock-tag small { color: #666; }

/*----------- Swagger UI: operations -------------*/
/* the coloured method badges stay as they are - the tinted panels around them
   are toned down to the neutral greys used on the rest of the site */
.swagger-ui .opblock,
.swagger-ui .opblock.opblock-get,
.swagger-ui .opblock.opblock-post,
.swagger-ui .opblock.opblock-put,
.swagger-ui .opblock.opblock-delete,
.swagger-ui .opblock.opblock-patch,
.swagger-ui .opblock.opblock-head,
.swagger-ui .opblock.opblock-options {
	background: #fff;
	border-color: #E2E2E2;
	border-radius: 0;
	box-shadow: none;
}

.swagger-ui .opblock .opblock-summary,
.swagger-ui .opblock.opblock-get .opblock-summary,
.swagger-ui .opblock.opblock-post .opblock-summary,
.swagger-ui .opblock.opblock-put .opblock-summary,
.swagger-ui .opblock.opblock-delete .opblock-summary,
.swagger-ui .opblock.opblock-patch .opblock-summary,
.swagger-ui .opblock.opblock-head .opblock-summary,
.swagger-ui .opblock.opblock-options .opblock-summary {
	border-color: #E2E2E2;
}

.swagger-ui .opblock .opblock-summary-method {
	border-radius: 3px;
	font-family: Arial, Helvetica, sans-serif;
	min-width: 80px;
}

.swagger-ui .opblock.opblock-get .opblock-summary-method { background: #4a70a7; }
.swagger-ui .opblock.opblock-post .opblock-summary-method { background: #840008; }

.swagger-ui .opblock.opblock-get .tab-header .tab-item.active h4 span:after { background: #4a70a7; }
.swagger-ui .opblock.opblock-post .tab-header .tab-item.active h4 span:after { background: #840008; }

.swagger-ui .opblock .opblock-section-header {
	background: #f6f6f6;
	box-shadow: none;
}

/*----------- Swagger UI: response media type hint -------------*/
.swagger-ui .response-control-media-type--accept-controller select { border-color: #4a70a7; }
.swagger-ui .response-control-media-type__accept-message { color: #4a70a7; }

/*----------- Swagger UI: models -------------*/
.swagger-ui section.models {
	border: 1px solid #E2E2E2;
	border-radius: 0;
}

.swagger-ui section.models.is-open h4 { border-bottom: 1px solid #E2E2E2; }

.swagger-ui section.models h4 {
	color: #4a70a7;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
}

.swagger-ui section.models .model-container { background: #f6f6f6; border-radius: 0; }

/*----------- Swagger UI: bits we do not need -------------*/
.swagger-ui .info__tos,
.swagger-ui .download-contents { display: none; }

/*----------- Small screens -------------*/
@media screen and (max-width: 600px) {
	#page { margin-top: 0; }
	#headerinfo { float: none; clear: both; padding: 10px 0 0 0; text-align: left; }
	.spritmonitorLogo { float: none; }
	#navilinks, #navilinks_right { float: none; padding: 2px 10px; }
	.swagger-ui .wrapper { padding: 0 10px; }
}
