#menu2 .btn.item,
.btn-primary,
.btn.btn-primary:first-child:hover, :not(.btn-check)+.btn.btn-primary:hover,
:root {
	--bs-btn-disabled-bg: #192b59c4;
	--bs-btn-hover-bg: #efc883;
	--bs-btn-active-bg: #efc883;
	--bs-btn-bg: #f4d398;
	--bs-btn-hover-border-color: #244393;
	
	--bs-btn-border-color: #192b59;
	--bs-btn-active-border-color: #192b59;
	--bs-btn-active-bg: #efc883;
	--bs-btn-color: #414042;
	--bs-btn-disabled-bg: #efc883ba;
	--bs-btn-disabled-color:#414042c2;
	
	--doge-dt-row-icon-color:#987f52;
	--doge-dt-row-icon-color-hover:#786441;
}
#menu2 .btn.item {
	color:#000;
}


img {
	max-width:100%;
}

.ptr--ptr {
	background-color:#000;
	/* position:absolute; */
	top:0;
	left:0;
	right:0;
	z-index:999;
}

.btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning) {
	--bs-btn-hover-bg: #efc883;
	--bs-btn-active-bg: #efc883;
	--bs-btn-bg: #f4d398;
	border-color: #d8b880;
	/* border-color: transparent; */
}

.login_button {
	position: fixed;
    top: 10px;
    color: #fff;
    text-decoration: none;
    right: 10px;
}


body {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(var(--vh, 1vh) * 100 );
	/* min-width: calc(var(--vw, 1vw) * 100 ); */

}
#customer-login {
	color:#fff;
	display:flex;
	flex-direction:column;
}
#customer-login .modal-header {
	display: flex;
    justify-content: space-between;
}

#customer-login .modal-title {
	margin:0;
}
.page-id-10779,
.parent-pageid-10779 {
	text-align: center;
	color:#fff;
	background-color:#68161c;
	display: flex;
	justify-content: center;
	text-align:center;
	flex-direction:column;
}
.item-qr {
    padding: 3px;
	border-radius: 0px;
	background-color: transparent;
    display: inline-block;
    border:0px solid #000;
	position:relative;
	overflow: hidden;
	margin: 2px;
	line-height:0;
	width:110px;
	height:110px;
}

.item-qr:before {
	content: "";
	transition:background-color 1s;
	background-color:#0000;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:-1;
}
.item-qr:after {
	content:"";
	transition: opacity .2s, transform .6s;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    text-transform: uppercase;
    font-size: 15px;
    transform: translate(-50%, -50%) rotate(360deg) scale(2);
    font-weight: 700;
    white-space: nowrap;
    color: #fff;
    border-top: 3px solid;
    border-bottom: 3px solid;
    text-align: center;
    width: 108%;
    padding-bottom: 0.15em;
    line-height: normal;
	z-index:-1;
}
.item-qr.status-invalid:before {
	background-color:#ff000047;
	z-index:1;
}
.item-qr.status-invalid:after {
	opacity:1;
	content: "Invalid";
	/* font-size: 80px; */
	transform: translate(-50%, -50%) rotate(-45deg) scale(1);
	z-index:1;
}
.item-qr.status-claimed:before,
.item-qr.status-checked-in:before {	
	background-color:#00800073;
	z-index:1;
}
.item-qr.status-used:before {
	background-color:#7a6666c7;	
	z-index:1;
}
.item-qr.status-claimed:after,
.item-qr.status-used:after,
.item-qr.status-checked-in:after {
	opacity: 1;
    content: "Checked-in";
	transform: translate(-50%, -50%) rotate(-45deg) scale(1);
	z-index:1;
}
.item-qr.status-claimed:after {
	content: "Claimed";
}
.item-qr.status-used:after {
	content: "Used";
	z-index:1;
}


.no-item .item-qr {
	overflow:visible;
}
.no-item .item-qr:before {
    content: "Nothing here";
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    white-space: nowrap;
    position: absolute;
    top: -10px;
    left: -10px;
    bottom: -10px;
    right: -10px;
    font-size: 11px;
    z-index: 1;
    font-family: inherit;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.no-item .item-desc {
	height: 0;
}





.item-wrapper {
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
}
.item-desc {
	height:98px;
	padding-top:10px;
	font-size: 18px;
}
.item-wrapper.loading .item-desc{
	opacity:0;
}
.item-wrapper.loading .item-qr-wrapper {
	transform: scale(0);
}
.item-wrapper.loaded .item-qr-wrapper {
	transform: scale(0.8);
}
.enlarge-qr .item-wrapper .item-qr-wrapper {
	transform: scale(2.6) translateY(-21%);
}
.enlarge-qr .item-desc {
	height: 0;
	overflow:hidden;
}

body .enlarge-qr #main-menu-wrapper.item-selected #main-menu-logo-div {
	display:none;
}
body .enlarge-qr #main-menu-wrapper.item-selected #main-menu > .btn-wrapper-outer {
	transform: translate(calc( -50% - 85px ), calc( -100% - 15px ) ) rotate(360deg) scale(0);
}

.item-desc .item-number {
	font-family: monospace, 'Courier New';
	margin:5px 0 0 0;
	color:#fff;
	font-size: 1.5em;
	line-height:1;
}
.item-number span.character {
	padding-left:5px;
	padding-right:5px;
}
.item-number span.character.number {
	color:#0d6efd;
	
}
.item-number span.character.letter.upper {
	color:inherit;
}
.item-number span.character.letter.lower {
	color:#ffa500;
}

.item-desc .item-type {
	text-transform: uppercase;
    font-weight: 300;
    letter-spacing: 15px;
    max-width: 350px;
    padding-left: 15px;
    margin-bottom: 0;
    font-size: 15px;
    line-height: 1.4;
	
}
.modal-header, .modal-footer {
	border:0;
}

.modal-content:not(.bg-dark) .modal-header, button.btn-primary, button {
    background-color: var(--bs-btn-bg);
}

.item-qr > canvas,
.item-qr > img {
	max-width: 100%;
}

.modal-header .btn-close {
	/* background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat */
}
#login-div-wrapper {
	padding: 15px;
    max-width: 300px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
	z-index: 1;
    position: relative;
}
#emailOTP {
	margin-left: auto;
    margin-right: auto;
    display: block;
}
#sendOTPby {
	width: 229px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    padding: 15px;
}
button .doge-spinner-circle {
	margin-left: 5px;
    vertical-align: middle;
    margin-top: -5px;
}

input[doge-type="letter"]:focus, input[doge-type="number"]:focus,
input[doge-type="letter"], input[doge-type="number"] {
	background-color: transparent;
}
input[doge-type="letter"]:focus,
input[doge-type="letter"] {
	color:#fff;
}
input[doge-type="letter"][doge-case="lower"]:focus,
input[doge-type="letter"][doge-case="lower"] {
	color:#ffa500;
}
input[doge-type="number"]:focus,
input[doge-type="number"] {
	color: #0d6efd;
}

#fnbtoken-modal .modal-content {
    height: 300px;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
}
#fnbtoken-modal .modal-header {
	transition:opacity .2s linear;
	opacity:1;
}
.enlarge-qr #fnbtoken-modal .modal-content {
	height:0;
}
.enlarge-qr #fnbtoken-modal .modal-header {
	opacity:0;
}

.enlarge-qr #fnbtoken-modal .item-wrapper .item-qr-wrapper {
    transform: scale(2.6) translateY(-41%);
}

#manual-key-in-qr-modal .modal-header {
	position:relative;
}
#manual-key-in-qr-modal .modal-title {
    position: absolute;
	left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

#start-button {
	margin-left:3px;
	margin-right:3px;
}
#cam-list, #keyboard-button, #start-button, #stop-button {
	padding: 4px 6px;
	height:40px;
	vertical-align: middle;
	border-radius:6px;
	outline: none;
}

#qr-code-detected {
	z-index:1056;
    background-color: #000;	
}
#video-container {
	line-height: 0;
	position:relative !important;
	margin-left:auto;
	margin-right:auto;
	overflow:hidden;
	margin-bottom:73px;
}
@media (orientation:portrait) {
	#qr-video {		

	}
}
@media (orientation:landscape) {
	#qr-video {
		
		
	}
}
	
		
#qr-video {
	max-width: calc( (var(--vw, 1vw) * 100) - 30px );
	width:auto;
	height: calc( (var(--vh, 1vh) * 100) - 103px );
}
#video-container .scan-region-highlight-svg,
#video-container .code-outline-highlight {
	stroke: #244393 !important;
}

.bot-menu .controls select {
	border-color:transparent;
	-webkit-appearance: none;
	height:40px;
	background-color: var(--bs-btn-bg);
	padding:4px 8px;
	text-align:center;
	max-width: calc( 100vw - 176px );
	color: #414042;
}

.bot-menu {
	position:fixed;
	bottom:0;
	left:0;
	right:0;
	z-index: 9;
	background-color:#68161c;
	padding: 10px 15px;
	margin:0;
}
.bot-menu svg {
	color:#414042;
}
.bot-menu div {
    margin-bottom: 0;
    white-space: nowrap;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-x: scroll;
}

.bot-menu div::-webkit-scrollbar {
	display: none;
}


.bot-menu .controls {
	display:flex;
	justify-content: space-between;
}

#cam-has-camera {
	display:none;
}
#cam-qr-result{
	display:block;
	text-align:center;
	margin-bottom:8px;
	font-size:13px;
}

#keyInQRForm input {	
	font-family:monospace, 'Courier New';
	width:40px;
}
#manual-key-in-qr-modal {
	z-index:1054;
}

#keyInQRForm input:disabled {
	background-color:#000;
	opacity:0.5;
}