@import url("sidebars.css");
@import url("topbar.css");
@import url("form.css");
@import url("website.css");
@font-face {
	font-family: "antigone_compact_pro-regular";
	src: url("/web/assets/media/antigone_compact_pro-regular-webfont.71e8d880074477979df6.woff2") format("woff2"),
		url("/web/assets/media/antigone_compact_pro-regular-webfont.6ea2dde2e9fa2ed0c14c.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
body {
	min-height: 100vh;
	min-height: -webkit-fill-available;
}

html {
	height: -webkit-fill-available;
}

main {
	display: flex;
	flex-wrap: nowrap;
	height: 100vh;
	height: -webkit-fill-available;
	max-height: 100vh;
	overflow-x: auto;
	overflow-y: hidden;
}

body {
	min-width: 375px;
	font-family: "antigone_compact_pro-regular";
	font-size: 15px;
	/* line-height: 1.71429; */
	line-height: 1.618;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: var(--text-color);
	background-color: var(--bg-color);
	overflow: hidden;
	max-width: 100%;
	width: 100%;
}

/* .widget */

.widget-title {
	font-family: "antigone_compact_pro-regular";
	font-size: 18px;
	line-height: 1.33333;
	color: var(--heading-color);
	margin-bottom: 24px;
}
.overhide {
	overflow: hidden;
}

.widget {
	background-color: var(--widget-bg-color);
	border-radius: var(--br);
	border-color: var(--widget-border-color);
}
.widget-no-padding {
	padding: 0 !important;
}
/* .widget-no-padding .widget{
  padding: 0 !important;
} */

.widget-wrapper {
	border-radius: 10px;
	padding: 15px;
	/* background-color: #ccc; */
}

/* color */
.primary-color {
	color: var(--primary-color);
}
.accent1-color {
	color: var(--accent1-color);
}
.accent2-color {
	color: var(--accent2-color);
}
.accent3-color {
	color: var(--accent3-color);
}
.success-color {
	color: var(--success-color);
}
.danger-color {
	color: var(--danger-color);
}
.warning-color {
	color: var(--warning-color);
}
.info-color {
	color: var(--info-color);
}
.text {
	color: var(--text-color);
}

.bg-accent1 {
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-accent1-rgb), var(--bs-bg-opacity));
}

.bg-accent2 {
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-accent2-rgb), var(--bs-bg-opacity));
}

.bg-accent3 {
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-accent3-rgb), var(--bs-bg-opacity));
}

.bg-primary-10 {
	background-color: rgba(var(--bs-primary-rgb), 0.1);
}
.bg-accent1-10 {
	background-color: rgba(var(--bs-accent1-rgb), 0.1);
}
.bg-accent2-10 {
	background-color: rgba(var(--bs-accent2-rgb), 0.1);
}
.bg-accent3-10 {
	background-color: rgba(var(--bs-accent3-rgb), 0.1);
}
.bg-success-10 {
	background-color: rgba(var(--bs-success-rgb), 0.1);
}
.bg-warning-10 {
	background-color: rgba(var(--bs-warning-rgb), 0.1);
}
.bg-info-10 {
	background-color: rgba(var(--bs-info-rgb), 0.1);
}
.bg-danger-10 {
	background-color: rgba(var(--bs-danger-rgb), 0.1);
}

.bg-primary-30 {
	background-color: rgba(var(--bs-primary-rgb), 0.3);
}
.bg-accent1-30 {
	background-color: rgba(var(--bs-accent1-rgb), 0.3);
}
.bg-accent2-30 {
	background-color: rgba(var(--bs-accent2-rgb), 0.3);
}
.bg-accent3-30 {
	background-color: rgba(var(--bs-accent3-rgb), 0.3);
}
.bg-warning-30 {
	background-color: rgba(var(--bs-warning-rgb), 0.3);
}
.bg-success-30 {
	background-color: rgba(var(--bs-success-rgb), 0.3);
}
.bg-danger-30 {
	background-color: rgba(var(--bs-danger-rgb), 0.3);
}
.bg-info-30 {
	background-color: rgba(var(--bs-info-rgb), 0.3);
}

.bg-primary-70 {
	background-color: rgba(var(--bs-primary-rgb), 0.7);
}
.bg-accent1-70 {
	background-color: rgba(var(--bs-accent1-rgb), 0.7);
}
.bg-accent2-70 {
	background-color: rgba(var(--bs-accent2-rgb), 0.7);
}
.bg-accent3-70 {
	background-color: rgba(var(--bs-accent3-rgb), 0.7);
}
.bg-warning-70 {
	background-color: rgba(var(--bs-warning-rgb), 0.7);
}
.bg-success-70 {
	background-color: rgba(var(--bs-success-rgb), 0.7);
}
.bg-danger-70 {
	background-color: rgba(var(--bs-danger-rgb), 0.7);
}
.bg-info-70 {
	background-color: rgba(var(--bs-info-rgb), 0.7);
}

.bg-transparent {
	background-color: transparent;
}

/* avatar */
.avatar {
	position: relative;
	display: inline-block;
	height: 40px;
	border-radius: 50%;
	margin-right: 10px;
}
.avatar-30 {
	height: 30px;
}
.avatar-35 {
	height: 35px;
}
.avatar-50 {
	height: 50px;
}
.avatar-60 {
	height: 60px;
}
.avatar img {
	height: 100%;
	width: 100%;
	border-radius: 50%;
}
.avatar.no-status:after {
	display: none;
}
.avatar:after {
	content: "";
	height: 14px;
	width: 14px;
	position: absolute;
	bottom: 2px;
	right: -2px;
	border-radius: 50%;
	border: 3px solid #fff;
}
.avatar-50:after,
.avatar-60:after {
	height: 17px;
	width: 17px;
}
.avatar-35:after,
.avatar-30:after {
	height: 12px;
	width: 12px;
}
.avatar.away:after {
	background-color: var(--warning-color);
}
.avatar.online:after {
	background-color: var(--success-color);
}
.avatar.offline:after {
	background-color: var(--lightgrey-color);
}
.avatar.blocked:after {
	background-color: var(--danger-color);
}

/* 
.bg-primary-10 .avatar:after{
  border-color: rgba(var(--bs-primary-rgb),0.1);
}
.bg-accent1-10 .avatar:after{
  border-color: rgba(var(--bs-accent1-rgb),0.1);
}
.bg-accent2-10 .avatar:after{
  border-color: rgba(var(--bs-accent2-rgb),0.1);
}
.bg-accent3-10 .avatar:after{
  border-color: rgba(var(--bs-accent3-rgb),0.1);
} */

/* badge */
.badge {
	font-weight: 500;
	padding: 7px 15px;
}

/* typography  */

h1,
h2,
h3 {
	font-family: "antigone_compact_pro-regular", sans-serif;
	font-weight: normal;
	color: var(--large-heading-color);
	line-height: 1.618;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.618;
}

h1 {
	font-size: 42px;
}
h2 {
	font-size: 38px;
}
h3 {
	font-size: 30px;
}
h4 {
	font-size: 24px;
}
h5 {
	font-size: 20px;
}
h6 {
	font-size: 16px;
}

.light {
	opacity: 0.7;
}
.nav-link {
	color: var(--primary-color);
}
a {
	color: var(--primary-color);
}

/* icon  */

.icon svg {
	stroke: var(--text-color);
	height: 20px;
	width: 20px;
	opacity: 0.7;
	margin: 0 0 0 10px;
}

.icon-left-align .icon svg {
	margin: 0 15px 0 0px;
}

.icon.primary-color svg {
	stroke: var(--primary-color);
}
.icon.accent1-color svg {
	stroke: var(--accent1-color);
}
.icon.accent2-color svg {
	stroke: var(--accent2-color);
}
.icon.accent3-color svg {
	stroke: var(--accent3-color);
}
.icon.success-color svg {
	stroke: var(--success-color);
}
.icon.warning-color svg {
	stroke: var(--warning-color);
}
.icon.info-color svg {
	stroke: var(--info-color);
}
.icon.danger-color svg {
	stroke: var(--danger-color);
}

/* .tooltip */

.tooltip-inner {
	background-color: var(--text-color);
}
.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before,
.bs-tooltip-top .tooltip-arrow::before {
	top: -1px;
	border-width: 0.4rem 0.4rem 0;
	border-top-color: var(--text-color);
}

/*.list-group-item*/

.list-group-item {
	font-family: antigone_compact_pro-regular;
	color: var(--text-color);
	border-bottom: 1px solid #f1f1f1 !important;
}

.list-group-item strong {
	font-weight: 500;
	font-family: antigone_compact_pro-regular;
	color: var(--large-heading-color);
}
.list-group-flush > .list-group-item:last-child {
	border-bottom-width: 0 !important;
	border-width: 0 !important;
	border: 0px solid #f1f1f1 !important;
}
.list-group-item strong.primary-color {
	color: var(--primary-color);
}
/* border */
/* .border-bottom {
  border-bottom: 1px solid #f1f1f1!important;
} */

/* responsive  */
.screen-type {
	position: fixed;
	top: 85px;
	right: 0px;
	color: white;
	padding: 0 5px;
	background-color: var(--primary-color);
	z-index: 999;
}
/* .top-ref{
  position: fixed;
  top: 30px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: red;
  z-index: 10000;
} */

/* overlay scroll  */
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle {
	background: rgba(0, 0, 0, 0.1);
}
.os-theme-dark > .os-scrollbar > .os-scrollbar-track > .os-scrollbar-handle.active,
.os-theme-dark > .os-scrollbar:hover > .os-scrollbar-track > .os-scrollbar-handle {
	background: rgba(0, 0, 0, 0.25);
}

/* progress  */

.progress {
	height: 10px;
	border-radius: 10px;
	background-color: rgba(33, 33, 33, 0.1);
}
.progress-sm {
	border-radius: 10px;
	height: 7px;
}
.progress-bar {
	border-radius: 10px;
}
.progress.multi .progress-bar {
	border-radius: 0px;
}

.bg-accent3-marker .progress-bar:after,
.bg-accent3-10 .progress.marker .progress-bar:after {
	background-color: #f5f5f5;
	border: 3px solid var(--accent3-color);
}
.bg-primary-marker .progress-bar:after,
.bg-primary-10 .progress.marker .progress-bar:after {
	background-color: #f5f5f5;
	border: 3px solid var(--primary-color);
}
.bg-accent1-marker .progress-bar:after,
.bg-accent1-10 .progress.marker .progress-bar:after {
	background-color: #f5f5f5;
	border: 3px solid var(--accent1-color);
}
.bg-accent2-marker .progress-bar:after,
.bg-accent2-10 .progress.marker .progress-bar:after {
	background-color: #f5f5f5;
	border: 3px solid var(--accent2-color);
}
.bg-accent3-marker .progress-bar:after,
.bg-accent3-10 .progress.marker .progress-bar:after {
	background-color: #f5f5f5;
	border: 3px solid var(--accent3-color);
}
.progress.marker,
.progress.marker .progress-bar {
	overflow: visible !important;
}

.progress.marker .progress-bar {
	position: relative;
}
.progress.marker .progress-bar:after {
	content: "";
	height: 15px;
	width: 15px;
	position: absolute;
	right: -13px;
	border-radius: 50%;
}

.file-icon {
	font-size: 75px;
	display: inline-block;
	height: 85px;
	line-height: 85px;
}

.copyright-bar {
	font-family: "antigone_compact_pro-regular";
	margin-top: 20px;
	background-color: #e15e36;
	/* width: 100vw; */
	padding: 5px;
	color: #eeeeee;
	text-align: center;
	/* margin-left: -15px; */
	position: absolute;
	bottom: 0;
	width: 100%;
}

.copyright-bar a {
	color: #eeeeee;
	font-weight: bold;
	display: inline-block;
	padding: 5px 20px;
	text-decoration: none;
}

.copyright-bar a:hover {
	text-decoration: underline;
}

.login-otp-step1 {
	display: inline-block;
}
.login-otp-step2 {
	display: none;
}

#signinForm,
.signin-with-email-field,
.signin-with-phone-field,
#signupForm,
.signup-with-email-field,
.signup-with-phone-field {
	display: none;
}

.btn-primary.disabled,
.btn-primary:disabled {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
	opacity: 0.5;
	/* cursor: ; */
}

#signinMessage,
#signupMessage {
	color: #e15e36;
	font-weight: bold;
}

#signin-back,
#signup-back {
	/* position: absolute; */
	top: 0;
	left: 40px;
	width: auto;
	font-weight: bold;
	margin: 0;
	cursor: pointer;
}
.login-with-tiktok-btn,
.login-with-google-btn {
	transition: background-color 0.3s, box-shadow 0.3s;
	padding: 12px 16px 12px 42px;
	border: none;
	border-radius: 3px;
	box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 1px 1px rgba(0, 0, 0, 0.5);
	color: #424242;
	font-size: 16px;
	font-weight: 500;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue",
		sans-serif;
	background-color: white;
	background-repeat: no-repeat;
	background-position: 12px 11px;
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
	margin-bottom: 20px;
	display: inline-block;
}
.login-with-tiktok-btn {
	/* background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=); */
	background-image: url("../images/tik-tok.png");
	background-size: 24px;
	background-position: 9px 13px;
}
.login-with-google-btn {
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
}

.login-with-tiktok-btn:hover,
.login-with-google-btn:hover {
	box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 2px 4px rgba(0, 0, 0, 0.25);
}
.login-with-tiktok-btn:active,
.login-with-google-btn:active {
	background-color: #eeeeee;
}
.login-with-tiktok-btn:focus,
.login-with-google-btn:focus {
	outline: none;
	box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 2px 4px rgba(0, 0, 0, 0.25), 0 0 0 3px #c8dafc;
}
.login-with-tiktok-btn:disabled,
.login-with-google-btn:disabled {
	filter: grayscale(100%);
	background-color: #ebebeb;
	box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 1px 1px rgba(0, 0, 0, 0.25);
	cursor: not-allowed;
}

#signin-with-phone,
#signin-with-email,
#signup-with-email,
#signup-with-phone {
	display: inline-block;
	width: auto;
	transition: background-color 0.3s, box-shadow 0.3s;
	padding: 8px 16px 8px 16px;
	border: none;
	border-radius: 3px;
	box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.04), 0 1px 1px rgba(0, 0, 0, 0.5);
	color: #424242;
	font-size: 16px;
	font-weight: 500;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue",
		sans-serif;
	margin: 10px;
	cursor: pointer;
}

#signin-with-phone:hover,
#signin-with-email:hover,
.login-with-tiktok-btn:hover,
.login-with-google-btn:hover,
#signup-with-email:hover,
#signup-with-phone:hover {
	text-decoration: underline;
	color: #222222;
}
