// Fonts
@import url('https://fonts.bunny.net/css?family=Nunito');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');

// Variables
@import 'variables';

// Bootstrap
@import 'bootstrap/scss/bootstrap';

$form-check-input-checked-border-color: #000000;

*,
::after,
::before {
	box-sizing: border-box;
}
input{
    color-scheme: dark !important;
}

body {
	font-family: 'Poppins', sans-serif;
	margin: 0;
    background-attachment: fixed;
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: cover;
}

h3 {
	font-size: 1.2375rem;
	color: #FFF;
}

a {
	cursor: pointer;
	text-decoration: none;
	font-family: 'Poppins', sans-serif;
}

li {
	list-style: none;
}
.form-select,.form-control {
    background: #000 !important;
    color: #fff !important;
}
/* Layout skeleton */

.wrapper {
	align-items: stretch;
	display: flex;
	width: 100%;
}

#sidebar {
    /* From https://css.glass */
background: rgba(0, 0, 0, 0.19);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(8.1px);
-webkit-backdrop-filter: blur(8.1px);
	max-width: 264px;
	min-width: 264px;
	transition: all 0.35s ease-in-out;

	z-index: 1111;
}

/* Sidebar collapse */

#sidebar.collapsed {
	margin-left: -264px;
}

.main {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	width: 100%;
	overflow: hidden;
	transition: all 0.35s ease-in-out;
}

.sidebar-logo {
	padding: 1.15rem 1.5rem;
}

.sidebar-logo a {
	color: #e9ecef;
	font-size: 1.25rem;
	font-weight: 600;
}

.sidebar-nav {
	padding: 0;
}

.sidebar-header {
	color: #e9ecef;
	font-size: .75rem;
	padding: 1.5rem 1.5rem .375rem;
}

a.sidebar-link {
	padding: .625rem 1.625rem;
	color: #e9ecef;
	position: relative;
	display: block;
	font-size: 1rem;
}

.sidebar-link[data-bs-toggle="collapse"]::after {
	border: solid;
	border-width: 0 .075rem .075rem 0;
	content: "";
	display: inline-block;
	padding: 2px;
	position: absolute;
	right: 1.5rem;
	top: 1.4rem;
	transform: rotate(-135deg);
	transition: all .2s ease-out;
}

.sidebar-link[data-bs-toggle="collapse"].collapsed::after {
	transform: rotate(45deg);
	transition: all .2s ease-out;
}

.content {
	flex: 1;
	max-width: 100vw;
	width: 100vw;
}

/* Responsive */

@media (min-width:768px) {
	.content {
		width: auto;
	}
}
    .auth-login-page {
        min-height: calc(100vh - 220px);
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1rem;
    
        border-radius: 12px;
    }

    .auth-login-card {
        width: 100%;
        max-width: 1024px;
        background: #2d2842;
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 18px 45px rgba(0, 0, 0, 0.25);
    }

    .auth-login-left {
        position: relative;
        min-height: 520px;
        color: #fff;
        background-image: linear-gradient(180deg, rgba(41, 23, 82, 0.35) 0%, rgba(16, 16, 24, 0.55) 100%),
        var(--auth-login-bg-image, none);
        background-size: cover;
        background-position: center;
    }

    .auth-login-left-content {
        position: absolute;
        left: 2rem;
        right: 2rem;
        bottom: 2rem;
    }

    .auth-login-right {
        padding: 2.5rem;
        color: #ffffff;
    }

    .auth-login-right .form-label,
    .auth-login-right .form-check-label,
    .auth-login-right .text-muted,
    .auth-login-right a {
        color: rgba(255, 255, 255, 0.78) !important;
    }

    .auth-login-right .form-control {
        background: rgba(255, 255, 255, 0.08);
        border: 1px solid rgba(255, 255, 255, 0.12);
        color: #fff;
    }

    .auth-login-right .form-control:focus {
        background: rgba(255, 255, 255, 0.12);
        border-color: rgba(142, 120, 255, 0.8);
        color: #fff;
        box-shadow: 0 0 0 .25rem rgba(122, 92, 255, .2);
    }

    .auth-login-right .form-control::placeholder {
        color: rgba(255, 255, 255, 0.45);
    }

    .auth-login-submit {
        background: #7c63ff;
        border-color: #7c63ff;
        font-weight: 600;
        padding: .65rem 1rem;
    }

    .auth-login-submit:hover,
    .auth-login-submit:focus {
        background: #6f56f2;
        border-color: #6f56f2;
    }

.rate-alert-shell {
    display: grid;
    grid-template-columns: 1fr 240px;
    gap: 12px;
    align-items: stretch;
}

.rate-alert-shell--only-right {
    display: flex;
    justify-content: flex-end;
}

.rate-alert-shell--only-right .rate-alert-right {
    width: 100%;
    max-width: 240px;
}

.rate-alert-left,
.rate-alert-right {
    background: rgba(255, 197, 66, 0.98);
    border: 1px solid rgba(111, 78, 0, 0.55);
    border-radius: 12px;
    padding: 6px 10px;
}

.rate-alert-title {
    font-size: 0.82rem;
    font-weight: 700;
    color: #4a3b00;
}

.rate-alert-message {
    margin-top: 0;
    font-size: 0.78rem;
    color: #3f320b;
}

.rate-alert-inline-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
}

.rate-alert-inline-message {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rate-alert-inline-form {
    min-width: 150px;
    max-width: 180px;
}

.rate-alert-inline-actions {
    display: inline-flex;
    gap: 4px;
}

.rate-alert-inline-actions .btn {
    padding: 0.2rem 0.45rem;
}

.rate-quick-form .form-control {
    background: #fff !important;
    color: #222 !important;
    border-color: rgba(178, 134, 32, 0.45);
}

.rate-alert-right {
    background: rgba(255, 255, 255, 0.95);
    border-color: rgba(0, 0, 0, 0.1);
    text-align: right;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.rate-chip-label {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6c757d;
}

.rate-chip-value {
    font-size: 1.08rem;
    line-height: 1.2;
    font-weight: 700;
    color: #1f2937;
}

.rate-chip-meta {
    margin-top: 1px;
    font-size: 0.68rem;
    color: #6c757d;
}

@media (max-width: 991.98px) {
    .rate-alert-shell {
        grid-template-columns: 1fr;
    }

    .rate-alert-inline-row {
        flex-wrap: wrap;
    }

    .rate-alert-inline-message {
        white-space: normal;
    }

    .rate-alert-right {
        text-align: left;
    }
}

    @media (max-width: 991.98px) {
        .auth-login-left {
            min-height: 260px;
        }

        .auth-login-right {
            padding: 2rem 1.25rem;
        }
    }
