/*
 * Tilde Friends core stylesheet
 * This is a prototype; things may change based on feedback.
 *
 * This Software is an external library that is part of
 * Tilde Friends and is shared under the MIT license.
 *
 * Inject this file in your app at tildefriends.css
 * and use this tag to import it:
 * <link rel="stylesheet" href="tildefriends.css"/>
 *
 * Revision 0 / 2024 M02 19
 */

body {
	color: white;
	font-family: sans-serif;
}

button, .button {
	border: none;
	border-radius: 8px;
	padding: 8px 12px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px;
}

button:hover, .button:hover { 
	filter: brightness(0.75);
}

button.red, .button.red {
	background-color: #bd1e24;
	color: white;
}

button.green, .button.green {
	background-color: #18922d; 
	color: white;
}

button.blue, .button.blue {
	background-color: #0067a7;
	color: white;
}

button.yellow, .button.yellow {
	background-color: #ee9600;
	color: black;
}

a:link {
	color: #268bd2;
}

a:visited {
	color: #6c71c4;
}

a:hover {
	color: #859900;
}

a:active {
	color: #2aa198;
}

table {
	border-collapse: collapse;
	width: 100%;
}

td, th {
	border: 1px solid #ffffff40;
	text-align: left;
	padding: 8px;
}

tr:nth-child(even) {
	background-color: #ffffff20;
}

.flex {
	display: flex;
}

.flex-column {
	display: flex;
	flex-direction: column;
}

.flex-row {
	display: flex;
	flex-direction: row;
}

.inline-flex-row {
	display: inline-flex;
	flex-direction: row;
}

.box {
	background-color: #00000020;
	border: 1px solid grey;
	border-radius: 8px;
	padding: 16px;
	margin: 4px;
}