html,
body,
#app {
  height: 100%;
  margin: 0;
  padding: 0;
}

html.dark {
  background: #27272a; /*bg-gray-800*/
	color: #f0f0f0;
	currentColor: #f0f0f0;
}
.right-item ul li {
	margin-left: 1em;
}
.features li b {
	color: #6366F1; /* indigo-600 */
	font-weight: 300;
}
.dark .features li b {
	color: #A5B4FC; /* indigo-400 */
}
li a, link,
.task a,h3 a,.link a, .link {
  color: #4F46E5; /*indigo-600*/
	text-decoration: underline;
}
.dark li a,.dark link,
.dark .task a,.dark h3 a,.dark .link a,.dark .link {
	color: #A5B4FC; /* indigo-400 */
}
.project-purpose, .project-name {
	width: 100%;
  padding: 4px 11px;
	border-radius: 20px;
	margin-bottom: 8px;
	border: 1px solid #A5B4FC; /* indigo-400 */
  background-color: #F3F4F6; /* gray-100 */
	color: #6366F1; /* indigo-600 */
	font-size: 1.02em;
	font-weight: 600;
}
.dark .project-purpose, .dark .project-name {
  background-color: #374151; /* gray-500 */
	border: 1px solid #9CA3AF; /* gray-400 */
	color: #A5B4FC; /* indigo-400 */
}
.dark svg {
	fill: #f0f0f0;
}
.openbox {
	border-radius: 10px;
	border: 1px solid #374151; /* gray-500 */
}
.dark .openbox {
	border: 1px solid #F3F4F66; /* gray-100 */
}
.msg-box {
	border-radius: 40px !important;
	border: 1px solid #374151; /* indigo-500 */
}
.dark .msg-box {
	border: 1px solid  #F3F4F6; /* gray-100 */
}
 .msg-ok {
  background: linear-gradient(135deg,  #83D475, #2EB62C) !important;
}
.msg-error {
  background: linear-gradient(135deg, #D90708, #9E1444) !important;
}
.msg-warn {
  background: linear-gradient(135deg, #FDA766, #FD7F2C) !important;
}
.msg-show {
  background: linear-gradient(135deg, #4949FF, #0000FF) !important;
}
.msg-info {
  background: linear-gradient(135deg, #9E9E9E, #696969) !important;
}
.hljs {
	background: none !important;
}
.markdown-body {
	margin: 2em;
}
.markdown-body p {
	margin-top: 1em;;
	font-size: 1em;
}

.markdown-body pre {
	padding: 2em;
	background: rgba(243,244,246);
}
.dark .markdown-body pre {
	background: rgba(75, 85, 99,var(--tw-bg-opacity))
}
.markdown-body a {
	color: rgba(37, 99, 235);
}
.no-list { list-style-type: none; margin-top: 1em;}
/* 
.btn {
  @apply px-4 py-1 rounded inline-block
    bg-teal-600 text-white cursor-pointer
    hover:bg-teal-700
    disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50;
}

.icon-btn {
  @apply inline-block cursor-pointer select-none
    opacity-75 transition duration-200 ease-in-out
    hover:opacity-100 hover:text-teal-600;
  font-size: 0.9em;
}
/*
.btn {
  @apply px-4 py-1 rounded inline-block
    bg-teal-600 text-white cursor-pointer
    hover:bg-teal-700
    disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50;
}

.icon-btn {
  @apply inline-block cursor-pointer select-none
    opacity-75 transition duration-200 ease-in-out
    hover:opacity-100 hover:text-teal-600;
  font-size: 0.9em;
}
*/
progress {
  margin-top: 0.5rem;
  width: 100%;
  height: 10px;
  margin-bottom: 0.4rem;
}

progress::-webkit-progress-bar {
  border-radius: 10px;
  background-color: #d1d5db;
  box-shadow: 0 2px 6px #555;
}

progress::-webkit-progress-value {
  border-radius: 10px 0 0 10px;
  background-image: linear-gradient(36deg, #d1fae5, #818cf8);
}

.prose>:first-child {
  margin-top: 0 !important;
}
.prose h2 {
  font-size: 1.5em;
  font-weight: 500;
  line-height: 1.3333333;
  /* margin-bottom: 1em; */
  /* margin-top: 2em; */
  text-transform: uppercase;
}
#cv-wrapper {
	box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px; 
	/* box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; */
	/* https://getcssscan.com/css-box-shadow-examples */
}
div strong, p strong, .itm-title { 
	color: #6366F1; /* indigo-600 */
	font-weight: 600;
}
.dark div strong, .dark p strong, .dark .itm-title { 
	color: #A5B4FC; /* indigo-400 */
	font-weight: 600;
}
img.project { 
	width: 10em;
	max-height: 5em;
 }
@media print {
	* {
		line-height: 1em !important;
	}
	.main-container { max-width: fit-content !important;}
  .noprint {
    visibility: hidden; 
		display: none;
		margin-top: 1em;
  }
	#cv-wrapper { margin-top: 0 !important;}
  .page-break { display: block; break-before: auto; }
}
/* @media all {
.page-break { display: none; }
} */