@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: 100;
    src:
        url("../fonts/woff/YekanBakhFaNum-thin.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-thin.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-Thin.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-Thin.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: 300;
    src:
        url("../fonts/woff/YekanBakhFaNum-Light.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-Light.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-Light.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-Light.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: normal;
    src:
        url("../fonts/woff/YekanBakhFaNum-Regular.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-Regular.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-Regular.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-Regular.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: 600;
    src:
        url("../fonts/woff/YekanBakhFaNum-SemiBold.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-SemiBold.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-SemiBold.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-SemiBold.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: bold;
    src:
        url("../fonts/woff/YekanBakhFaNum-Bold.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-Bold.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-Bold.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-Bold.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: 800;
    src:
        url("../fonts/woff/YekanBakhFaNum-ExtraBold.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-ExtraBold.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-ExtraBold.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-ExtraBold.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: 900;
    src:
        url("../fonts/woff/YekanBakhFaNum-Black.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-Black.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-Black.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-Black.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: 950;
    src:
        url("../fonts/woff/YekanBakhFaNum-ExtraBlack.woff") format("woff"),
        url("../fonts/woff2/YekanBakhFaNum-ExtraBlack.woff2") format("woff2"),
        url("../fonts/ttf/YekanBakhFaNum-ExtraBlack.ttf") format("truetype"),
        url("../fonts/otf/YekanBakhFaNum-ExtraBlack.otf") format("opentype");
}
@font-face {
    font-family: YekanBakhFaNum;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/ttf/YekanBakhFaNum-VF.ttf") format("truetype");
}
@font-face {
    font-family: IRANYekanXFaNum;
    font-style: normal;
    font-weight: normal;
    src:
        url("../fonts/woff/IRANYekanXFaNum-Regular.woff") format("woff"),
        url("../fonts/woff2/IRANYekanXFaNum-Regular.woff2") format("woff2"),
        url("../fonts/ttf/IRANYekanXFaNum-Regular.ttf") format("truetype");
}
@font-face {
    font-family: IRANYekanXFaNum;
    font-style: normal;
    font-weight: bold;
    src:
        url("../fonts/woff/IRANYekanXFaNum-Bold.woff") format("woff"),
        url("../fonts/woff2/IRANYekanXFaNum-Bold.woff2") format("woff2"),
        url("../fonts/ttf/IRANYekanXFaNum-Bold.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: 100;
    src:
        url("../fonts/woff2/PeydaWebFaNum-Thin.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-Thin.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-Thin.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: 200;
    src:
        url("../fonts/woff2/PeydaWebFaNum-ExtraLight.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-ExtraLight.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-ExtraLight.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: 300;
    src:
        url("../fonts/woff2/PeydaWebFaNum-Light.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-Light.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-Light.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: 500;
    src:
        url("../fonts/woff2/PeydaWebFaNum-Medium.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-Medium.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-Medium.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: 600;
    src:
        url("../fonts/woff2/PeydaWebFaNum-SemiBold.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-SemiBold.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-SemiBold.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: 800;
    src:
        url("../fonts/woff2/PeydaWebFaNum-ExtraBold.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-ExtraBold.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-ExtraBold.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: 900;
    src:
        url("../fonts/woff2/PeydaWebFaNum-Black.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-Black.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-Black.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: bold;
    src:
        url("../fonts/woff2/PeydaWebFaNum-Bold.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-Bold.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-Bold.ttf") format("truetype");
}
@font-face {
    font-family: PeydaWebFaNum;
    font-style: normal;
    font-weight: normal;
    src:
        url("../fonts/woff2/PeydaWebFaNum-Regular.woff2") format("woff2"),
        url("../fonts/woff/PeydaWebFaNum-Regular.woff") format("woff"),
        url("../fonts/ttf/PeydaFaNum-Regular.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 10;
    src:
        url("../fonts/woff2/DanaFaNum-Hairline.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Hairline.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Hairline.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 100;
    src:
        url("../fonts/woff2/DanaFaNum-Thin.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Thin.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Thin.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 200;
    src:
        url("../fonts/woff2/DanaFaNum-UltraLight.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-UltraLight.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-UltraLight.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 300;
    src:
        url("../fonts/woff2/DanaFaNum-Light.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Light.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Light.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 500;
    src:
        url("../fonts/woff2/DanaFaNum-Medium.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Medium.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Medium.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 600;
    src:
        url("../fonts/woff2/DanaFaNum-DemiBold.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-DemiBold.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-DemiBold.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 800;
    src:
        url("../fonts/woff2/DanaFaNum-ExtraBold.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-ExtraBold.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-ExtraBold.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 900;
    src:
        url("../fonts/woff2/DanaFaNum-Black.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Black.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Black.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 930;
    src:
        url("../fonts/woff2/DanaFaNum-ExtraBlack.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-ExtraBlack.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-ExtraBlack.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 960;
    src:
        url("../fonts/woff2/DanaFaNum-Heavy.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Heavy.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Heavy.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: 990;
    src:
        url("../fonts/woff2/DanaFaNum-Fat.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Fat.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Fat.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: bold;
    src:
        url("../fonts/woff2/DanaFaNum-Bold.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Bold.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Bold.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: normal;
    src:
        url("../fonts/woff2/DanaFaNum-Regular.woff2") format("woff2"),
        url("../fonts/woff/DanaFaNum-Regular.woff") format("woff"),
        url("../fonts/ttf/DanaFaNum-Regular.ttf") format("truetype");
}
@font-face {
    font-family: Dana;
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/ttf/DanaVF.ttf") format("truetype");
}
@font-face {
    font-family: IranYekan;
    font-style: normal;
    font-weight: 400;
    src:
        url("../fonts/woff/IranYekan/IRANYekanXFaNum-Regular.woff")
            format("woff"),
        url("../fonts/woff2/IranYekan/IRANYekanXFaNum-Regular.woff2")
            format("woff2"),
        url("../fonts/ttf/IranYekan/IRANYekanXFaNum-Regular.ttf")
            format("truetype");
}
@font-face {
    font-family: IranYekan;
    font-style: normal;
    font-weight: 200;
    src:
        url("../fonts/woff/IranYekan/IRANYekanXFaNum-UltraLight.woff")
            format("woff"),
        url("../fonts/woff2/IranYekan/IRANYekanXFaNum-UltraLight.woff2")
            format("woff2"),
        url("../fonts/ttf/IranYekan/IRANYekanXFaNum-UltraLight.ttf")
            format("truetype");
}
@font-face {
    font-family: IranYekan;
    font-style: normal;
    font-weight: 200;
    src:
        url("../fonts/woff/IranYekan/IRANYekanXFaNum-Light.woff") format("woff"),
        url("../fonts/woff2/IranYekan/IRANYekanXFaNum-Light.woff2")
            format("woff2"),
        url("../fonts/ttf/IranYekan/IRANYekanXFaNum-Light.ttf")
            format("truetype");
}
@font-face {
    font-family: IranYekan;
    font-style: normal;
    font-weight: 500;
    src:
        url("../fonts/woff/IranYekan/IRANYekanXFaNum-Medium.woff")
            format("woff"),
        url("../fonts/woff2/IranYekan/IRANYekanXFaNum-Medium.woff2")
            format("woff2"),
        url("../fonts/ttf/IranYekan/IRANYekanXFaNum-Medium.ttf")
            format("truetype");
}
@font-face {
    font-family: IranYekan;
    font-style: normal;
    font-weight: 600;
    src:
        url("../fonts/woff/IranYekan/IRANYekanXFaNum-DemiBold.woff")
            format("woff"),
        url("../fonts/woff2/IranYekan/IRANYekanXFaNum-DemiBold.woff2")
            format("woff2"),
        url("../fonts/ttf/IranYekan/IRANYekanXFaNum-DemiBold.ttf")
            format("truetype");
}
@font-face {
    font-family: IranYekan;
    font-style: normal;
    font-weight: 700;
    src:
        url("../fonts/woff/IranYekan/IRANYekanXFaNum-Bold.woff") format("woff"),
        url("../fonts/woff2/IranYekan/IRANYekanXFaNum-Bold.woff2")
            format("woff2"),
        url("../fonts/ttf/IranYekan/IRANYekanXFaNum-Bold.ttf")
            format("truetype");
}
@font-face {
    font-family: IranYekan;
    font-style: normal;
    font-weight: 900;
    src:
        url("../fonts/woff/IranYekan/IRANYekanXFaNum-ExtraBold.woff")
            format("woff"),
        url("../fonts/woff2/IranYekan/IRANYekanXFaNum-ExtraBold.woff2")
            format("woff2"),
        url("../fonts/ttf/IranYekan/IRANYekanXFaNum-ExtraBold.ttf")
            format("truetype");
}
::-moz-placeholder {
    font-family: "IranYekan" !important;
    font-variation-settings: "dots" 1;
    letter-spacing: 0 !important;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
a,
abbr,
acronym,
address,
big,
cite,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
input [type="button"],
input [type="checkbox"],
input [type="color"],
input [type="date"],
input [type="datetime-local"],
input [type="email"],
input [type="file"],
input [type="hidden"],
input [type="image"],
input [type="month"],
input [type="number"],
input [type="password"],
input [type="radio"],
input [type="range"],
input [type="reset"],
input [type="search"],
input [type="submit"],
input [type="tel"],
input [type="text"],
input [type="time"],
input [type="url"],
input [type="week"],
textarea,
button,
select,
option,
optgroup,
::placeholder {
    font-family: "IranYekan" !important;
    font-variation-settings: "dots" 1;
    letter-spacing: 0 !important;
}
pre > span,
code > span {
    font-family: var(--bs-font-monospace) !important;
}
h6,
.h6,
h5,
.h5,
h4,
.h4,
h3,
.h3,
h2,
.h2,
h1,
.h1 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-family: "IranYekan", sans-serif !important;
    font-weight: 700;
    line-height: 1.1;
    color: var(--bs-heading-color);
}
.text-slate-50 {
    color: #f8fafc;
}
.border-slate-50 {
    border-color: #f8fafc;
}
.bg-slate-50 {
    background-color: #f8fafc;
}
.text-slate-100 {
    color: #f1f5f9;
}
.border-slate-100 {
    border-color: #f1f5f9;
}
.bg-slate-100 {
    background-color: #f1f5f9;
}
.text-slate-200 {
    color: #e2e8f0;
}
.border-slate-200 {
    border-color: #e2e8f0;
}
.bg-slate-200 {
    background-color: #e2e8f0;
}
.text-slate-300 {
    color: #cbd5e1;
}
.border-slate-300 {
    border-color: #cbd5e1;
}
.bg-slate-300 {
    background-color: #cbd5e1;
}
.text-slate-400 {
    color: #94a3b8;
}
.border-slate-400 {
    border-color: #94a3b8;
}
.bg-slate-400 {
    background-color: #94a3b8;
}
.text-slate-500 {
    color: #64748b;
}
.border-slate-500 {
    border-color: #64748b;
}
.bg-slate-500 {
    background-color: #64748b;
}
.text-slate-600 {
    color: #475569;
}
.border-slate-600 {
    border-color: #475569;
}
.bg-slate-600 {
    background-color: #475569;
}
.text-slate-700 {
    color: #334155;
}
.border-slate-700 {
    border-color: #334155;
}
.bg-slate-700 {
    background-color: #334155;
}
.text-slate-800 {
    color: #1e293b;
}
.border-slate-800 {
    border-color: #1e293b;
}
.bg-slate-800 {
    background-color: #1e293b;
}
.text-slate-900 {
    color: #0f172a;
}
.border-slate-900 {
    border-color: #0f172a;
}
.bg-slate-900 {
    background-color: #0f172a;
}
.text-gray-50 {
    color: #f9fafb;
}
.border-gray-50 {
    border-color: #f9fafb;
}
.bg-gray-50 {
    background-color: #f9fafb;
}
.text-gray-100 {
    color: #f3f4f6;
}
.border-gray-100 {
    border-color: #f3f4f6;
}
.bg-gray-100 {
    background-color: #f3f4f6;
}
.text-gray-200 {
    color: #e5e7eb;
}
.border-gray-200 {
    border-color: #e5e7eb;
}
.bg-gray-200 {
    background-color: #e5e7eb;
}
.text-gray-300 {
    color: #d1d5db;
}
.border-gray-300 {
    border-color: #d1d5db;
}
.bg-gray-300 {
    background-color: #d1d5db;
}
.text-gray-400 {
    color: #9ca3af;
}
.border-gray-400 {
    border-color: #9ca3af;
}
.bg-gray-400 {
    background-color: #9ca3af;
}
.text-gray-500 {
    color: #6b7280;
}
.border-gray-500 {
    border-color: #6b7280;
}
.bg-gray-500 {
    background-color: #6b7280;
}
.text-gray-600 {
    color: #4b5563;
}
.border-gray-600 {
    border-color: #4b5563;
}
.bg-gray-600 {
    background-color: #4b5563;
}
.text-gray-700 {
    color: #374151;
}
.border-gray-700 {
    border-color: #374151;
}
.bg-gray-700 {
    background-color: #374151;
}
.text-gray-800 {
    color: #1f2937;
}
.border-gray-800 {
    border-color: #1f2937;
}
.bg-gray-800 {
    background-color: #1f2937;
}
.text-gray-900 {
    color: #111827;
}
.border-gray-900 {
    border-color: #111827;
}
.bg-gray-900 {
    background-color: #111827;
}
.text-rose-50 {
    color: #fff1f2;
}
.border-rose-50 {
    border-color: #fff1f2;
}
.bg-rose-50 {
    background-color: #fff1f2;
}
.text-rose-100 {
    color: #ffe4e6;
}
.border-rose-100 {
    border-color: #ffe4e6;
}
.bg-rose-100 {
    background-color: #ffe4e6;
}
.text-rose-200 {
    color: #fecdd3;
}
.border-rose-200 {
    border-color: #fecdd3;
}
.bg-rose-200 {
    background-color: #fecdd3;
}
.text-rose-300 {
    color: #fda4af;
}
.border-rose-300 {
    border-color: #fda4af;
}
.bg-rose-300 {
    background-color: #fda4af;
}
.text-rose-400 {
    color: #fb7185;
}
.border-rose-400 {
    border-color: #fb7185;
}
.bg-rose-400 {
    background-color: #fb7185;
}
.text-rose-500 {
    color: #f43f5e;
}
.border-rose-500 {
    border-color: #f43f5e;
}
.bg-rose-500 {
    background-color: #f43f5e;
}
.text-rose-600 {
    color: #e11d48;
}
.border-rose-600 {
    border-color: #e11d48;
}
.bg-rose-600 {
    background-color: #e11d48;
}
.text-rose-700 {
    color: #be123c;
}
.border-rose-700 {
    border-color: #be123c;
}
.bg-rose-700 {
    background-color: #be123c;
}
.text-rose-800 {
    color: #9f1239;
}
.border-rose-800 {
    border-color: #9f1239;
}
.bg-rose-800 {
    background-color: #9f1239;
}
.text-rose-900 {
    color: #881337;
}
.border-rose-900 {
    border-color: #881337;
}
.bg-rose-900 {
    background-color: #881337;
}
.text-zinc-50 {
    color: #fafafa;
}
.border-zinc-50 {
    border-color: #fafafa;
}
.bg-zinc-50 {
    background-color: #fafafa;
}
.text-zinc-100 {
    color: #f4f4f5;
}
.border-zinc-100 {
    border-color: #f4f4f5;
}
.bg-zinc-100 {
    background-color: #f4f4f5;
}
.text-zinc-200 {
    color: #e4e4e7;
}
.border-zinc-200 {
    border-color: #e4e4e7;
}
.bg-zinc-200 {
    background-color: #e4e4e7;
}
.text-zinc-300 {
    color: #d4d4d8;
}
.border-zinc-300 {
    border-color: #d4d4d8;
}
.bg-zinc-300 {
    background-color: #d4d4d8;
}
.text-zinc-400 {
    color: #a1a1aa;
}
.border-zinc-400 {
    border-color: #a1a1aa;
}
.bg-zinc-400 {
    background-color: #a1a1aa;
}
.text-zinc-500 {
    color: #71717a;
}
.border-zinc-500 {
    border-color: #71717a;
}
.bg-zinc-500 {
    background-color: #71717a;
}
.text-zinc-600 {
    color: #52525b;
}
.border-zinc-600 {
    border-color: #52525b;
}
.bg-zinc-600 {
    background-color: #52525b;
}
.text-zinc-700 {
    color: #3f3f46;
}
.border-zinc-700 {
    border-color: #3f3f46;
}
.bg-zinc-700 {
    background-color: #3f3f46;
}
.text-zinc-800 {
    color: #27272a;
}
.border-zinc-800 {
    border-color: #27272a;
}
.bg-zinc-800 {
    background-color: #27272a;
}
.text-zinc-900 {
    color: #18181b;
}
.border-zinc-900 {
    border-color: #18181b;
}
.bg-zinc-900 {
    background-color: #18181b;
}
.text-neutral-50 {
    color: #fafafa;
}
.border-neutral-50 {
    border-color: #fafafa;
}
.bg-neutral-50 {
    background-color: #fafafa;
}
.text-neutral-100 {
    color: #f5f5f5;
}
.border-neutral-100 {
    border-color: #f5f5f5;
}
.bg-neutral-100 {
    background-color: #f5f5f5;
}
.text-neutral-200 {
    color: #e5e5e5;
}
.border-neutral-200 {
    border-color: #e5e5e5;
}
.bg-neutral-200 {
    background-color: #e5e5e5;
}
.text-neutral-300 {
    color: #d4d4d4;
}
.border-neutral-300 {
    border-color: #d4d4d4;
}
.bg-neutral-300 {
    background-color: #d4d4d4;
}
.text-neutral-400 {
    color: #a3a3a3;
}
.border-neutral-400 {
    border-color: #a3a3a3;
}
.bg-neutral-400 {
    background-color: #a3a3a3;
}
.text-neutral-500 {
    color: #737373;
}
.border-neutral-500 {
    border-color: #737373;
}
.bg-neutral-500 {
    background-color: #737373;
}
.text-neutral-600 {
    color: #525252;
}
.border-neutral-600 {
    border-color: #525252;
}
.bg-neutral-600 {
    background-color: #525252;
}
.text-neutral-700 {
    color: #404040;
}
.border-neutral-700 {
    border-color: #404040;
}
.bg-neutral-700 {
    background-color: #404040;
}
.text-neutral-800 {
    color: #262626;
}
.border-neutral-800 {
    border-color: #262626;
}
.bg-neutral-800 {
    background-color: #262626;
}
.text-neutral-900 {
    color: #171717;
}
.border-neutral-900 {
    border-color: #171717;
}
.bg-neutral-900 {
    background-color: #171717;
}
.text-stone-50 {
    color: #fafaf9;
}
.border-stone-50 {
    border-color: #fafaf9;
}
.bg-stone-50 {
    background-color: #fafaf9;
}
.text-stone-100 {
    color: #f5f5f4;
}
.border-stone-100 {
    border-color: #f5f5f4;
}
.bg-stone-100 {
    background-color: #f5f5f4;
}
.text-stone-200 {
    color: #e7e5e4;
}
.border-stone-200 {
    border-color: #e7e5e4;
}
.bg-stone-200 {
    background-color: #e7e5e4;
}
.text-stone-300 {
    color: #d6d3d1;
}
.border-stone-300 {
    border-color: #d6d3d1;
}
.bg-stone-300 {
    background-color: #d6d3d1;
}
.text-stone-400 {
    color: #a8a29e;
}
.border-stone-400 {
    border-color: #a8a29e;
}
.bg-stone-400 {
    background-color: #a8a29e;
}
.text-stone-500 {
    color: #78716c;
}
.border-stone-500 {
    border-color: #78716c;
}
.bg-stone-500 {
    background-color: #78716c;
}
.text-stone-600 {
    color: #57534e;
}
.border-stone-600 {
    border-color: #57534e;
}
.bg-stone-600 {
    background-color: #57534e;
}
.text-stone-700 {
    color: #44403c;
}
.border-stone-700 {
    border-color: #44403c;
}
.bg-stone-700 {
    background-color: #44403c;
}
.text-stone-800 {
    color: #292524;
}
.border-stone-800 {
    border-color: #292524;
}
.bg-stone-800 {
    background-color: #292524;
}
.text-stone-900 {
    color: #1c1917;
}
.border-stone-900 {
    border-color: #1c1917;
}
.bg-stone-900 {
    background-color: #1c1917;
}
.text-green-50 {
    color: #f0fdf4;
}
.border-green-50 {
    border-color: #f0fdf4;
}
.bg-green-50 {
    background-color: #fafdf0;
}
.text-green-100 {
    color: #dcfce7;
}
.border-green-100 {
    border-color: #dcfce7;
}
.bg-green-100 {
    background-color: #dcfce7;
}
.text-green-200 {
    color: #bbf7d0;
}
.border-green-200 {
    border-color: #bbf7d0;
}
.bg-green-200 {
    background-color: #bbf7d0;
}
.text-green-300 {
    color: #86efac;
}
.border-green-300 {
    border-color: #86efac;
}
.bg-green-300 {
    background-color: #86efac;
}
.text-green-400 {
    color: #4ade80;
}
.border-green-400 {
    border-color: #4ade80;
}
.bg-green-400 {
    background-color: #4ade80;
}
.text-green-500 {
    color: #22c55e;
}
.border-green-500 {
    border-color: #22c55e;
}
.bg-green-500 {
    background-color: #22c55e;
}
.text-green-600 {
    color: #16a34a;
}
.border-green-600 {
    border-color: #16a34a;
}
.bg-green-600 {
    background-color: #16a34a;
}
.text-green-700 {
    color: #15803d;
}
.border-green-700 {
    border-color: #15803d;
}
.bg-green-700 {
    background-color: #15803d;
}
.text-green-800 {
    color: #166534;
}
.border-green-800 {
    border-color: #166534;
}
.bg-green-800 {
    background-color: #166534;
}
.text-green-900 {
    color: #052e16;
}
.border-green-900 {
    border-color: #052e16;
}
.bg-green-900 {
    background-color: #052e16;
}
.text-indigo-50 {
    color: #eef2ff;
}
.border-indigo-50 {
    border-color: #eef2ff;
}
.bg-indigo-50 {
    background-color: #eef2ff;
}
.text-indigo-100 {
    color: #e0e7ff;
}
.bborder-indigo-100 {
    border-color: #e0e7ff;
}
.bg-indigo-100 {
    background-color: #e0e7ff;
}
.text-indigo-200 {
    color: #c7d2fe;
}
.border-indigo-200 {
    border-color: #c7d2fe;
}
.bg-indigo-200 {
    background-color: #c7d2fe;
}
.text-indigo-300 {
    color: #a5b4fc;
}
.border-indigo-300 {
    border-color: #a5b4fc;
}
.bg-indigo-300 {
    background-color: #a5b4fc;
}
.text-indigo-400 {
    color: #818cf8;
}
.border-indigo-400 {
    border-color: #818cf8;
}
.bg-indigo-400 {
    background-color: #818cf8;
}
.text-indigo-500 {
    color: #6366f1;
}
.border-indigo-500 {
    border-color: #6366f1;
}
.bg-indigo-500 {
    background-color: #6366f1;
}
.text-indigo-600 {
    color: #4f46e5;
}
.border-indigo-600 {
    border-color: #4f46e5;
}
.bg-indigo-600 {
    background-color: #4f46e5;
}
.text-indigo-700 {
    color: #4338ca;
}
.border-indigo-700 {
    border-color: #4338ca;
}
.bg-indigo-700 {
    background-color: #4338ca;
}
.text-indigo-800 {
    color: #3730a3;
}
.border-indigo-800 {
    border-color: #3730a3;
}
.bg-indigo-800 {
    background-color: #3730a3;
}
.text-indigo-900 {
    color: #312e81;
}
.border-indigo-900 {
    border-color: #312e81;
}
.bg-indigo-900 {
    background-color: #312e81;
}
.text-sky-50 {
    color: #f0f9ff;
}
.border-sky-50 {
    border-color: #f0f9ff;
}
.bg-sky-50 {
    background-color: #f0f9ff;
}
.text-sky-100 {
    color: #e0f2fe;
}
.border-sky-100 {
    border-color: #e0f2fe;
}
.bg-sky-100 {
    background-color: #e0f2fe;
}
.text-sky-200 {
    color: #bae6fd;
}
.border-sky-200 {
    border-color: #bae6fd;
}
.bg-sky-200 {
    background-color: #bae6fd;
}
.text-sky-300 {
    color: #7dd3fc;
}
.border-sky-300 {
    border-color: #7dd3fc;
}
.bg-sky-300 {
    background-color: #7dd3fc;
}
.text-sky-400 {
    color: #38bdf8;
}
.border-sky-400 {
    border-color: #38bdf8;
}
.bg-sky-400 {
    background-color: #38bdf8;
}
.text-sky-500 {
    color: #0ea5e9;
}
.border-sky-500 {
    border-color: #0ea5e9;
}
.bg-sky-500 {
    background-color: #0ea5e9;
}
.text-sky-600 {
    color: #0284c7;
}
.border-sky-600 {
    border-color: #0284c7;
}
.bg-sky-600 {
    background-color: #0284c7;
}
.text-sky-700 {
    color: #0369a1;
}
.border-sky-700 {
    border-color: #0369a1;
}
.bg-sky-700 {
    background-color: #0369a1;
}
.text-sky-800 {
    color: #075985;
}
.border-sky-800 {
    border-color: #075985;
}
.bg-sky-800 {
    background-color: #075985;
}
.text-sky-900 {
    color: #0c4a6e;
}
.border-sky-900 {
    border-color: #0c4a6e;
}
.bg-sky-900 {
    background-color: #0c4a6e;
}
.text-violet-50 {
    color: #f5f3ff;
}
.border-violet-50 {
    border-color: #f5f3ff;
}
.bg-violet-50 {
    background-color: #f5f3ff;
}
.text-violet-100 {
    color: #ede9fe;
}
.border-violet-100 {
    border-color: #ede9fe;
}
.bg-violet-100 {
    background-color: #ede9fe;
}
.text-violet-200 {
    color: #ddd6fe;
}
.border-violet-200 {
    border-color: #ddd6fe;
}
.bg-violet-200 {
    background-color: #ddd6fe;
}
.text-violet-300 {
    color: #c4b5fd;
}
.border-violet-300 {
    border-color: #c4b5fd;
}
.bg-violet-300 {
    background-color: #c4b5fd;
}
.text-violet-400 {
    color: #a78bfa;
}
.border-violet-400 {
    border-color: #a78bfa;
}
.bg-violet-400 {
    background-color: #a78bfa;
}
.text-violet-500 {
    color: #8b5cf6;
}
.border-violet-500 {
    border-color: #8b5cf6;
}
.bg-violet-500 {
    background-color: #8b5cf6;
}
.text-violet-600 {
    color: #7c3aed;
}
.border-violet-600 {
    border-color: #7c3aed;
}
.bg-violet-600 {
    background-color: #7c3aed;
}
.text-violet-700 {
    color: #6d28d9;
}
.border-violet-700 {
    border-color: #6d28d9;
}
.bg-violet-700 {
    background-color: #6d28d9;
}
.text-violet-800 {
    color: #5b21b6;
}
.border-violet-800 {
    border-color: #5b21b6;
}
.bg-violet-800 {
    background-color: #5b21b6;
}
.text-violet-900 {
    color: #4c1d95;
}
.border-violet-900 {
    border-color: #4c1d95;
}
.bg-violet-900 {
    background-color: #4c1d95;
} /*!
 * Bootstrap  v5.3.0 (https://getbootstrap.com/)
 * Copyright 2011-2023 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
:root,
[data-bs-theme="light"] {
    --bs-blue: #559bfb;
    --bs-indigo: #323f9e;
    --bs-purple: #816bff;
    --bs-pink: #ff63a5;
    --bs-red: #e85347;
    --bs-orange: #ffa353;
    --bs-yellow: #f4bd0e;
    --bs-green: #1ee0ac;
    --bs-teal: #20c997;
    --bs-cyan: #09c2de;
    --bs-white: #fff;
    --bs-gray: #8091a7;
    --bs-gray-dark: #2b3748;
    --bs-gray-100: #ebeef2;
    --bs-gray-200: #e5e9f2;
    --bs-gray-300: #dbdfea;
    --bs-gray-400: #b7c2d0;
    --bs-gray-500: #8091a7;
    --bs-gray-600: #3c4d62;
    --bs-gray-700: #344357;
    --bs-gray-800: #2b3748;
    --bs-gray-900: #1f2b3a;
    --bs-primary: #733aea;
    --bs-secondary: #364a63;
    --bs-success: #0fca7a;
    --bs-info: #058efc;
    --bs-warning: #fd9722;
    --bs-danger: #f2426e;
    --bs-light: #e5e9f2;
    --bs-dark: #1f2b3a;
    --bs-gray: #8091a7;
    --bs-lighter: #f5f6fa;
    --bs-primary-rgb: 115, 58, 234;
    --bs-secondary-rgb: 54, 74, 99;
    --bs-success-rgb: 15, 202, 122;
    --bs-info-rgb: 5, 142, 252;
    --bs-warning-rgb: 253, 151, 34;
    --bs-danger-rgb: 242, 66, 110;
    --bs-light-rgb: 229, 233, 242;
    --bs-dark-rgb: 31, 43, 58;
    --bs-gray-rgb: 128, 145, 167;
    --bs-lighter-rgb: 245, 246, 250;
    --bs-primary-text-emphasis: #223e64;
    --bs-secondary-text-emphasis: #2b2f32;
    --bs-success-text-emphasis: #065131;
    --bs-info-text-emphasis: #023965;
    --bs-warning-text-emphasis: #653c0e;
    --bs-danger-text-emphasis: #611a2c;
    --bs-light-text-emphasis: #495057;
    --bs-dark-text-emphasis: #495057;
    --bs-primary-bg-subtle: #ddebfe;
    --bs-secondary-bg-subtle: #e2e3e5;
    --bs-success-bg-subtle: #cff4e4;
    --bs-info-bg-subtle: #cde8fe;
    --bs-warning-bg-subtle: #ffead3;
    --bs-danger-bg-subtle: #fcd9e2;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ced4da;
    --bs-primary-border-subtle: #bbd7fd;
    --bs-secondary-border-subtle: #c4c8cb;
    --bs-success-border-subtle: #9feaca;
    --bs-info-border-subtle: #9bd2fe;
    --bs-warning-border-subtle: #fed5a7;
    --bs-danger-border-subtle: #fab3c5;
    --bs-light-border-subtle: #e9ecef;
    --bs-dark-border-subtle: #adb5bd;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-font-sans-serif: Roboto, sans-serif;
    --bs-font-monospace:
        SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
        "Courier New", monospace;
    --bs-gradient: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.15),
        rgba(255, 255, 255, 0)
    );
    --bs-body-font-family: "IranYekan", sans-serif;
    --bs-body-font-size: 0.875rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.65;
    --bs-body-color: #526484;
    --bs-body-color-rgb: 82, 100, 132;
    --bs-body-bg: #f5f6fa;
    --bs-body-bg-rgb: 245, 246, 250;
    --bs-emphasis-color: #000;
    --bs-emphasis-color-rgb: 0, 0, 0;
    --bs-secondary-color: rgba(82, 100, 132, 0.75);
    --bs-secondary-color-rgb: 82, 100, 132;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-bg-rgb: 233, 236, 239;
    --bs-tertiary-color: rgba(82, 100, 132, 0.5);
    --bs-tertiary-color-rgb: 82, 100, 132;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248, 249, 250;
    --bs-heading-color: #364a63;
    --bs-link-color: #8e61ee;
    --bs-link-color-rgb: 142, 97, 238;
    --bs-link-decoration: none;
    --bs-link-hover-color: #6d33e9;
    --bs-link-hover-color-rgb: 109, 51, 233;
    --bs-link-hover-decoration: none;
    --bs-code-color: #ff63a5;
    --bs-highlight-bg: #fcf8e3;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dbdfea;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 4px;
    --bs-border-radius-sm: 3px;
    --bs-border-radius-lg: 5px;
    --bs-border-radius-xl: 8px;
    --bs-border-radius-xxl: 12px;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 3px 12px 1px rgba(43, 55, 72, 0.15);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(43, 55, 72, 0.15);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(43, 55, 72, 0.25);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-width: 0.25rem;
    --bs-focus-ring-opacity: 0.25;
    --bs-focus-ring-color: rgba(85, 155, 251, 0.25);
    --bs-form-valid-color: #0fca7a;
    --bs-form-valid-border-color: #0fca7a;
    --bs-form-invalid-color: #f2426e;
    --bs-form-invalid-border-color: #f2426e;
}
[data-bs-theme="dark"] {
    color-scheme: dark;
    --bs-body-color: #adb5bd;
    --bs-body-color-rgb: 173, 181, 189;
    --bs-body-bg: #212529;
    --bs-body-bg-rgb: 33, 37, 41;
    --bs-emphasis-color: #fff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: rgba(173, 181, 189, 0.75);
    --bs-secondary-color-rgb: 173, 181, 189;
    --bs-secondary-bg: #343a40;
    --bs-secondary-bg-rgb: 52, 58, 64;
    --bs-tertiary-color: rgba(173, 181, 189, 0.5);
    --bs-tertiary-color-rgb: 173, 181, 189;
    --bs-tertiary-bg: #2b3035;
    --bs-tertiary-bg-rgb: 43, 48, 53;
    --bs-primary-text-emphasis: #99c3fd;
    --bs-secondary-text-emphasis: #a7acb1;
    --bs-success-text-emphasis: #6fdfaf;
    --bs-info-text-emphasis: #69bbfd;
    --bs-warning-text-emphasis: #fec17a;
    --bs-danger-text-emphasis: #f78ea8;
    --bs-light-text-emphasis: #f8f9fa;
    --bs-dark-text-emphasis: #dee2e6;
    --bs-primary-bg-subtle: #111f32;
    --bs-secondary-bg-subtle: #161719;
    --bs-success-bg-subtle: #032818;
    --bs-info-bg-subtle: #011c32;
    --bs-warning-bg-subtle: #331e07;
    --bs-danger-bg-subtle: #300d16;
    --bs-light-bg-subtle: #343a40;
    --bs-dark-bg-subtle: #1a1d20;
    --bs-primary-border-subtle: #335d97;
    --bs-secondary-border-subtle: #41464b;
    --bs-success-border-subtle: #097949;
    --bs-info-border-subtle: #035597;
    --bs-warning-border-subtle: #985b14;
    --bs-danger-border-subtle: #912842;
    --bs-light-border-subtle: #495057;
    --bs-dark-border-subtle: #343a40;
    --bs-heading-color: inherit;
    --bs-link-color: #99c3fd;
    --bs-link-hover-color: #adcffd;
    --bs-link-color-rgb: 153, 195, 253;
    --bs-link-hover-color-rgb: 173, 207, 253;
    --bs-code-color: #ffa1c9;
    --bs-border-color: #495057;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
    --bs-form-valid-color: #78eccd;
    --bs-form-valid-border-color: #78eccd;
    --bs-form-invalid-color: #f19891;
    --bs-form-invalid-border-color: #f19891;
}
/* .btn-primary {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    --bs-btn-color: #fff;
    --bs-btn-border-color: #733aea;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #6231c7;
    --bs-btn-hover-border-color: #5c2ebb;
    --bs-btn-focus-shadow-rgb: 136, 88, 237;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #5c2ebb;
    --bs-btn-active-border-color: #562cb0;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #733aea;
    --bs-btn-disabled-border-color: #733aea;
} */
.btn-outline-primary {
    --bs-btn-color: #733aea;
    --bs-btn-border-color: #733aea;
    --bs-btn-hover-color: #733aea;
    --bs-btn-hover-bg: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    --bs-btn-hover-border-color: #733aea;
    --bs-btn-focus-shadow-rgb: 115, 58, 234;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #733aea;
    --bs-btn-active-border-color: #733aea;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #733aea;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #733aea;
}
/* .btn-secondary {
    border-radius: 2.5rem;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
    --bs-btn-color: #000;
    --bs-btn-border-color: #ffd200;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #f7971e;
    --bs-btn-hover-border-color: #ffd200;
    --bs-btn-focus-shadow-rgb: 84, 101, 122;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #ffd200;
    --bs-btn-active-border-color: #ffd200;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #ffd200;
    --bs-btn-disabled-border-color: #ffd200;
} */
.btn-success {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #00b09b 0%, #30d74b 100%);
    --bs-btn-color: #fff;
    --bs-btn-bg: #0fca7a;
    --bs-btn-border-color: #0fca7a;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #0dac68;
    --bs-btn-hover-border-color: #0ca262;
    --bs-btn-focus-shadow-rgb: 51, 210, 142;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #0ca262;
    --bs-btn-active-border-color: #0b985c;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #0fca7a;
    --bs-btn-disabled-border-color: #0fca7a;
}
.btn-info {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #3dc3ef 0%, #2f80ed 100%);
    --bs-btn-color: #fff;
    --bs-btn-bg: #058efc;
    --bs-btn-border-color: #058efc;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #0479d6;
    --bs-btn-hover-border-color: #0472ca;
    --bs-btn-focus-shadow-rgb: 43, 159, 252;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #0472ca;
    --bs-btn-active-border-color: #046bbd;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #058efc;
    --bs-btn-disabled-border-color: #058efc;
}
.btn-danger {
    border-radius: 2.5rem;
    background: var(--danger, linear-gradient(90deg, #f66 0%, #cc0101 100%));
    --bs-btn-color: #fff;
    --bs-btn-bg: #f2426e;
    --bs-btn-border-color: #f2426e;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #ce385e;
    --bs-btn-hover-border-color: #c23558;
    --bs-btn-focus-shadow-rgb: 244, 94, 132;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #c23558;
    --bs-btn-active-border-color: #b63253;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #f2426e;
    --bs-btn-disabled-border-color: #f2426e;
}
.btn-dark {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #000 0%, #171717 43%, #343434 100%);
    --bs-btn-color: #fff;
    --bs-btn-bg: #1f2b3a;
    --bs-btn-border-color: #1f2b3a;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #414b58;
    --bs-btn-hover-border-color: #35404e;
    --bs-btn-focus-shadow-rgb: 65, 75, 88;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #4c5561;
    --bs-btn-active-border-color: #35404e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #1f2b3a;
    --bs-btn-disabled-border-color: #1f2b3a;
}
.btn-warning {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #ffd200 0%, #fdcd32 100%);
    --bs-btn-color: #000;
    --bs-btn-bg: #fd9722;
    --bs-btn-border-color: #fd9722;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #d7801d;
    --bs-btn-hover-border-color: #ca791b;
    --bs-btn-focus-shadow-rgb: 253, 167, 67;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #ca791b;
    --bs-btn-active-border-color: #be711a;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #fd9722;
    --bs-btn-disabled-border-color: #fd9722;
}
.progress-primary {
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
}
.progress-secondary {
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
}
.progress-danger {
    background: linear-gradient(90deg, #f66 0%, #cc0101 100%);
}
.btn-primary.dropdown-toggle {
    background: #4776e6;
}
.dark-mode .btn-outline-primary {
    --bs-btn-color: #d3c6f0;
    --bs-btn-border-color: #d3c6f0;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    --bs-btn-hover-border-color: #d3c6f0;
    --bs-btn-focus-shadow-rgb: 115, 58, 234;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #733aea;
    --bs-btn-active-border-color: #733aea;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
    --bs-btn-disabled-color: #733aea;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #733aea;
}
body {
    background-color: #f2f2fd;
}
.uupload-ir {
    border-radius: 6px;
    min-height: 165px;
    border: 1px dashed #e5e9f2;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.uupload-ir .wrapper {
    text-align: center;
    margin: 1em 0;
    width: 100%;
}
.uupload-ir .wrapper .title {
    display: block;
    color: rgba(82, 100, 132, 0.6);
    font-size: 13px;
}
.custom-upload-wrapper {
    border-radius: 6px;
    min-height: 165px;
    border: 1px dashed #e5e9f2;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.custom-upload-wrapper label {
    text-align: center;
    margin: 1em 0;
    width: 100%;
}
.custom-upload-wrapper label input {
    display: none;
}
.custom-upload-wrapper label .upload-btn .title {
    display: block;
    color: rgba(82, 100, 132, 0.6);
    font-size: 13px;
}
.custom-upload-wrapper label .file-info {
    margin-top: 10px;
    display: none;
}
.custom-upload-wrapper label .file-info .file-name {
    display: block;
    font-size: 14px;
    margin-bottom: 5px;
    color: rgba(82, 100, 132, 0.6);
}
.custom-upload-wrapper label .file-info .file-icon {
    color: #fdcd32;
    font-size: 50px;
}
.icon-upload {
    color: #733aea;
    font-size: 1.25rem;
    height: 36px;
    width: 120px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.icon-upload input {
    display: none;
}
.uupload-icon a {
    font-size: 0.8125rem;
    height: 36px;
    width: 120px;
}
.file-info-single {
    margin-top: 10px;
    display: none;
}
.file-info-single .file-name {
    display: block;
    font-size: 14px;
    margin-bottom: 5px;
    color: rgba(82, 100, 132, 0.6);
}
.file-info-single .file-icon {
    color: #fdcd32;
    font-size: 50px;
}
.nk-sidebar-brand {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 30px 0;
}
.nk-sidebar-brand .nk-sidebar-logo .logo {
    display: flex;
    align-items: center;
    gap: 7px;
}
.nk-sidebar-brand .nk-sidebar-logo .logo img {
    width: 52px;
    height: 52px;
}
.nk-sidebar-brand .nk-sidebar-logo .logo .logo-text {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 5px;
}
.nk-sidebar-brand .nk-sidebar-logo .logo .logo-text .line {
    background-color: #fdcd32;
    height: 1px;
    width: 100%;
}
.nk-sidebar-brand .nk-sidebar-logo .logo .logo-text h5 {
    font-weight: 900;
}
.nk-sidebar-brand .nk-sidebar-logo .logo .logo-text h5,
.nk-sidebar-brand .nk-sidebar-logo .logo .logo-text h6 {
    margin: 0px;
}
.nk-sidebar .nk-menu > li.active > .nk-menu-link {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
}
.nk-sidebar .nk-menu > li.active > .nk-menu-link .nk-menu-icon {
    color: #fff;
}
.nk-sidebar .nk-menu > li.active > .nk-menu-link .nk-menu-icon em {
    color: #fff;
}
.nk-sidebar .nk-menu > li > .nk-menu-link:hover {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
}
.nk-sidebar .nk-menu > li > .nk-menu-link:hover .nk-menu-icon {
    color: #fff;
}
.nk-sidebar .nk-menu > li > .nk-menu-link:hover .nk-menu-icon em {
    color: #fff;
}
.nk-sidebar .nk-menu > li > .nk-menu-link {
    color: #313131;
}
.nk-sidebar .nk-menu > li > .nk-menu-link .nk-menu-icon {
    color: #313131;
}
.nk-sidebar .nk-menu > li > .nk-menu-link .nk-menu-icon em {
    color: #313131;
}
.nk-sidebar-menu .user-info {
    margin-top: 50px;
    padding-right: 20px;
}
.nk-sidebar-menu .user-info .logo {
    display: flex;
    align-items: center;
    gap: 7px;
}
.nk-sidebar-menu .user-info .logo img {
    width: 52px;
    height: 52px;
    border-radius: 50%;
}
.nk-sidebar-menu .user-info .logo .logo-text {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 5px;
}
.nk-sidebar-menu .user-info .logo .logo-text .line {
    background-color: #000;
    height: 1px;
    width: 100%;
}
.nk-sidebar-menu .user-info .logo .logo-text h5 {
    font-weight: 900;
}
.nk-sidebar-menu .user-info .logo .logo-text h5,
.nk-sidebar-menu .user-info .logo .logo-text h6 {
    margin: 0px;
}
.nk-sidebar {
    padding-top: 20px;
}
.toastr {
    background-color: #18212d;
    color: #abbbd7;
}
.dark-mode .nk-sidebar .nk-menu > li > .nk-menu-link {
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li > .nk-menu-link .nk-menu-icon {
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li > .nk-menu-link .nk-menu-icon em {
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li > .nk-menu-link:hover {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li > .nk-menu-link:hover .nk-menu-icon {
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li > .nk-menu-link:hover .nk-menu-icon em {
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li.active > .nk-menu-link {
    border-radius: 2.5rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li.active > .nk-menu-link .nk-menu-icon {
    color: #fff;
}
.dark-mode .nk-sidebar .nk-menu > li.active > .nk-menu-link .nk-menu-icon em {
    color: #fff;
}
.dark-mode .toastr {
    background-color: #fff;
    color: #18212d;
}
.payment-error-head {
    background-image: -webkit-linear-gradient(
        top,
        rgb(219, 30, 30),
        rgb(84, 20, 20)
    );
}
.payment-success-head {
    background-image: -webkit-linear-gradient(
        top,
        rgb(77, 219, 30),
        rgb(20, 84, 40)
    );
    font-size: 85px;
}
.loader {
    width: 0;
    height: 4.8px;
    display: inline-block;
    position: relative;
    background: #fff;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
    animation: animFw 8s linear infinite;
}
.loader::after,
.loader::before {
    content: "";
    width: 10px;
    height: 1px;
    background: #fff;
    position: absolute;
    top: 9px;
    right: -2px;
    opacity: 0;
    transform: rotate(-45deg) translateX(0px);
    box-sizing: border-box;
    animation: coli1 0.3s linear infinite;
}
.loader::before {
    top: -4px;
    transform: rotate(45deg);
    animation: coli2 0.3s linear infinite;
}
@keyframes animFw {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}
@keyframes coli1 {
    0% {
        transform: rotate(-45deg) translateX(0px);
        opacity: 0.7;
    }
    100% {
        transform: rotate(-45deg) translateX(-45px);
        opacity: 0;
    }
}
@keyframes coli2 {
    0% {
        transform: rotate(45deg) translateX(0px);
        opacity: 1;
    }
    100% {
        transform: rotate(45deg) translateX(-45px);
        opacity: 0.7;
    }
}
.nk-header-tools .nk-quick-nav .polls-dropdown a,
.nk-header-tools .nk-quick-nav .chats-dropdown a,
.nk-header-tools .nk-quick-nav .notification-dropdown a {
    background-color: #fff;
    border-radius: 10px;
    color: #000;
    position: relative;
}
.nk-header-tools .nk-quick-nav .polls-dropdown a .count,
.nk-header-tools .nk-quick-nav .chats-dropdown a .count,
.nk-header-tools .nk-quick-nav .notification-dropdown a .count {
    position: absolute;
    top: -6px;
    right: -6px;
    background-color: #fdcd32;
    color: rgba(0, 0, 0, 0.7882352941);
    width: 15px;
    height: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 10px;
    border-radius: 50%;
    padding: 3px 0 0 1px;
    margin: 0px;
}
.nk-header-tools .nk-quick-nav .polls-dropdown .nk-quick-nav-icon:before,
.nk-header-tools .nk-quick-nav .chats-dropdown .nk-quick-nav-icon:before,
.nk-header-tools
    .nk-quick-nav
    .notification-dropdown
    .nk-quick-nav-icon:before {
    background: rgba(0, 0, 0, 0);
}
.nk-header-tools .nk-quick-nav .user-dropdown a .user-avatar {
    border-radius: 10px;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
}
.vip-service {
    position: relative;
}
.vip-service .label {
    position: absolute;
    top: -12px;
    left: -23px;
    background-color: red;
    color: #fff;
    font-size: 11px;
    border-radius: 5px;
    padding: 0px 12px;
}
.dark-mode .nk-header-wrap .nk-header-tools .nk-quick-nav .polls-dropdown a,
.dark-mode .nk-header-wrap .nk-header-tools .nk-quick-nav .chats-dropdown a,
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .notification-dropdown
    a {
    border: 1px solid #410082;
    background: #18212d;
}
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .polls-dropdown
    a
    .count,
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .chats-dropdown
    a
    .count,
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .notification-dropdown
    a
    .count {
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
    color: #000;
}
.dark-mode .nk-header-wrap .nk-header-tools .nk-quick-nav .polls-dropdown a em,
.dark-mode .nk-header-wrap .nk-header-tools .nk-quick-nav .chats-dropdown a em,
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .notification-dropdown
    a
    em {
    color: #fff;
}
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .polls-dropdown
    .nk-quick-nav-icon:before,
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .chats-dropdown
    .nk-quick-nav-icon:before,
.dark-mode
    .nk-header-wrap
    .nk-header-tools
    .nk-quick-nav
    .notification-dropdown
    .nk-quick-nav-icon:before {
    background: rgba(0, 0, 0, 0);
}
.dark-mode .nk-header-wrap .nk-header-search input {
    background-color: rgba(0, 0, 0, 0) !important;
}
.table-tickets {
    width: 100%;
    display: table;
}
@media screen and (max-width: 768px) {
    .table-tickets {
        display: block;
    }
}
.table-tickets .header {
    display: table-row;
    background: var(
        --primary,
        linear-gradient(90deg, #4776e6 0%, #8e54e9 100%)
    );
    color: #fff;
    font-weight: 700;
}
@media screen and (max-width: 768px) {
    .table-tickets .header {
        display: none;
    }
}
.table-tickets .header .cell {
    display: table-cell;
    padding: 7px 10px;
}
@media screen and (max-width: 768px) {
    .table-tickets .header .cell {
        display: block;
    }
}
@media screen and (max-width: 1200px) {
    .table-tickets .header .date {
        display: none;
    }
}
.table-tickets .body {
    display: table-row;
    border-bottom: 1px solid var(--light, #f2f2fd);
}
@media screen and (max-width: 768px) {
    .table-tickets .body {
        display: none;
    }
}
.table-tickets .body .cell {
    display: table-cell;
    padding: 25px 15px;
    border-bottom: 1px solid var(--light, #f2f2fd);
}
.table-tickets .body .cell .view-checks {
    position: relative;
}
.table-tickets .body .cell .view-checks em {
    position: absolute;
    top: 0px;
    right: -20px;
}
.table-tickets .body .cell .view-checks em:last-child {
    right: -26px;
}
@media screen and (max-width: 1200px) {
    .table-tickets .body .date {
        display: none;
    }
}
.table-tickets .body-mobile {
    border-bottom: 1px solid var(--light, #f2f2fd);
    padding: 20px 10px;
}
.table-tickets .body-mobile .line1 {
    display: flex;
    justify-content: space-between;
}
.table-tickets .body-mobile .title {
    margin: 30px 0;
}
.table-tickets .body-mobile .btn {
    display: flex;
    justify-content: center;
}
.table-tickets .body-mobile .btn a {
    display: block;
    width: 100%;
    text-align: center;
}
.table-tickets .body-mobile .tk-status {
    margin: 0px;
}
@media screen and (min-width: 768px) {
    .table-tickets .body-mobile {
        display: none;
    }
}
.mobile-latest-tickets {
    display: none;
    position: absolute;
    top: 5px;
    left: -50px;
    z-index: 1000000000000000000000000000;
}
@media screen and (max-width: 576px) {
    .mobile-latest-tickets {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}
.mobile-latest-tickets a em {
    font-size: 20px;
}
.mobile-latest-tickets-modal {
    display: none;
    position: absolute;
    top: 67px;
    left: 400px;
    width: 100vw;
    height: 70vh;
    background-color: #efefef;
    z-index: 100000000000000000000000000000000000000000000000000000000;
    overflow: hidden;
}
@media screen and (max-width: 576px) {
    .mobile-latest-tickets-modal {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
}
.mobile-latest-tickets-modal .nk-msg-item {
    width: 100%;
    display: block;
}
.tickets-empty {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border-radius: 10px;
    padding: 25px 0 17px 0;
}
.tickets-empty img {
    width: 72%;
    border-radius: 10px;
}
.tickets-empty h3 {
    margin: 25px 0 10px 0;
}
.tickets-empty a {
    margin: 10px 0;
}
.tk-status {
    border-radius: 3.86988rem;
    padding: 3px 10px 2px 10px;
    margin-left: 25px;
    white-space: nowrap;
}
.tk-status-success {
    background-color: #a9ffae;
    color: #025f51;
}
.tk-status-warning {
    background-color: #ffdc67;
    color: #985c00;
}
.tk-status-danger {
    background-color: #ff7676;
    color: #8c0000;
    padding: 3px 20px 2px 20px;
}
.tk-view-btn {
    border-radius: 10px;
    background: var(
        --primary,
        linear-gradient(90deg, #4776e6 0%, #8e54e9 100%)
    );
    color: #fff;
    padding: 7px 45px 5px 45px;
    margin: 0 12px;
}
.ticket-rules {
    border-width: 0.19rem 0.12rem 1.2rem 0.12rem;
    border-style: solid;
    border-color: #ffd200;
    border-radius: 1.25rem;
    padding: 2rem;
}
.ticket-rules .header {
    display: flex;
    align-items: center;
    gap: 12px;
}
.ticket-rules .header .icon-wrapper {
    background-color: #ffd200;
    color: #000;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.ticket-rules .header .icon-wrapper em {
    font-size: 30px;
}
.ticket-rules .line {
    margin: 12px 0 30px 0;
    background-color: #ffd200;
    height: 2px;
    width: 75%;
}
.ticket-rules ul li {
    margin: 20px 0;
    list-style: initial;
    line-height: 35px;
}
.ticket-rules .highlight {
    background-color: #ffd200;
    border-radius: 5px 30px 5px 30px;
    text-align: center;
    color: #000;
    padding: 25px 15px;
    font-size: 14px;
    font-weight: 700;
}
.ticket-tags-wrapper {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 3px;
}
.ticket-tags-wrapper .ticket-tag {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
}
.nk-chat-body.profile-shown {
    padding: 0px;
}
.nk-chat-body.profile-shown .is-me .chat-msg {
    border-radius: 20px;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.2509803922);
    padding: 10px 40px;
    font-size: 14px;
    line-height: 24px;
}
.nk-chat-body.profile-shown .is-me .chat-msg a {
    margin-top: 10px;
    color: #efefef;
}
.nk-chat-body.profile-shown .is-me .chat-msg a:hover {
    color: #e0e0e0;
}
.nk-chat-body.profile-shown .is-me .chat-avatar {
    order: 2;
}
.nk-chat-body.profile-shown .is-me .chat-avatar .user-avatar {
    background: rgba(0, 0, 0, 0);
}
.nk-chat-body.profile-shown .is-me .chat-content {
    order: 1;
}
.nk-chat-body.profile-shown .is-you .chat-msg {
    border-radius: 20px;
    background: #fff;
    box-shadow: 0px 3px 8px 0px #606be8;
    padding: 10px 40px;
    font-size: 14px;
    line-height: 24px;
}
.nk-chat-body.profile-shown .nk-chat-head-user .lead-text {
    white-space: normal;
}
.nk-chat-panel {
    background-color: #fff;
}
.nk-chat-editor {
    border-top: 1px solid #e5e9f2;
}
.chat-meta li.attachment em {
    font-size: 25px;
}
.upload-message {
    font-size: 12px;
    display: none;
}
.card.pricing {
    position: relative;
}
.card.pricing .coupon {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 14px;
}
.pricing-media img {
    margin-top: 5px;
    max-width: 100%;
    border-radius: 5px;
}
.dark-mode .tickets-empty {
    background-color: #18212d;
}
.dark-mode .table-tickets .body {
    color: #8094ae;
    border-bottom: 1px solid #30314d;
}
.dark-mode .table-tickets .body .cell {
    border-bottom: 1px solid #30314d;
}
.dark-mode .ticket-rules .header h5 {
    color: #ffd200;
}
.dark-mode .ticket-rules ul li {
    color: #b6c6e3;
}
.dark-mode .chat-msg {
    color: #18212d;
}
.dark-mode .nk-chat-editor {
    border-color: #1d2d40;
}
.dark-mode #default-textarea {
    color: #dfdfdf;
}
.dark-mode .note-editable {
    color: #dfdfdf;
}
.filter-button-group .active {
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
}
.notification-card {
    background-color: #fff;
    border-radius: 25px;
    padding: 20px 30px;
    box-shadow: 0px 4px 6px 1px rgba(0, 0, 0, 0.25);
}
.notification-card .card-head {
    display: flex;
    justify-content: space-between;
}
.notification-card .card-head .icon {
    border-radius: 50%;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.notification-card .card-head .icon em {
    font-size: 30px;
}
.notification-card .card-head .link {
    color: #4776e6;
}
.notification-card .card-head .link .unseen {
    position: relative;
}
.notification-card .card-head .link .unseen em {
    position: absolute;
    top: -7px;
    right: -18px;
}
.notification-card .card-head .link .unseen em:last-child {
    right: -24px;
}
.notification-card .notif-btn {
    margin-top: 30px;
}
.notification-card .notif-btn a {
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
    display: block;
    text-align: center;
    border-radius: 16px;
}
.not-viewed .notification-card {
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    box-shadow: 0px 4px 6px 1px rgba(0, 0, 0, 0.25);
}
.not-viewed .notification-card .card-head .icon {
    background: #fff;
    color: #4776e6;
}
.not-viewed .notification-card .card-head .link {
    color: #fff;
}
.not-viewed .notification-card .notif-btn a {
    background: #fff;
    color: #4776e6;
}
.not-viewed .notification-card .card-body h6 {
    color: #fff;
    line-height: 2;
}
.notification-single-card .card-head {
    display: flex;
    justify-content: center;
    align-items: center;
}
.notification-single-card .card-head .icon {
    width: 40px;
    height: 40px;
}
.notification-single-card .card-head .icon em {
    font-size: 20px;
}
.notification-single-card .line {
    display: flex;
    justify-content: center;
    align-items: center;
}
.notification-single-card .card-body p {
    margin: 25px 0;
    line-height: 39px;
}
.notification-single-card .card-btn {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}
.notification-single-card .card-btn a {
    display: block;
    width: 30%;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    color: #fff;
    text-align: center;
    border-radius: 16px;
    padding: 5px 0;
}
@media screen and (max-width: 575px) {
    .notification-single-card .card-btn a {
        width: 80%;
    }
}
.notification-single-card .card-date {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.notification-single-card .card-date .date {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    color: #8e54e9;
}
.notification-single-card .card-date .date em {
    font-size: 20px;
}
.dark-mode .notification-card {
    background-color: #18212d;
    box-shadow: 0px 4px 6px 1px rgba(0, 0, 0, 0.25);
}
.emoji-picker {
    position: relative;
    transform: translateY(-32px);
}
@media screen and (max-width: 992px) {
    .emoji-picker {
        display: none;
    }
}
.emoji-picker .emoji-popover-btn {
    margin-left: 7px;
}
.emoji-picker .emoji-popover-btn i {
    font-size: 20px;
}
.emoji-picker .emoji-popover-btn:focus {
    outline: unset;
}
.emoji-picker .emoji-popover-container {
    width: 250px;
    position: absolute;
    bottom: 110%;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1921568627);
    padding: 10px 5px;
    z-index: 10000000;
    opacity: 0;
    pointer-events: none;
}
.emoji-picker .emoji-popover-container .emoji-icon {
    cursor: pointer;
    margin: 0px;
}
.course-block {
    padding: 0 12px;
}
.course-block .course-head {
    display: flex;
    justify-content: center;
    padding: 4px 0;
}
.course-block .course-head .btn-trigger:before {
    background-color: rgba(0, 0, 0, 0);
}
.course-block img {
    padding: 0 10px;
    border-radius: 7px;
}
.web-block .card {
    padding: 0 5px;
}
.web-block .card img {
    padding: 0 12px;
    border-radius: 7px;
}
.no-course {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
    height: 100%;
    width: 100%;
    padding-left: 25px;
}
.no-course img {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    border-radius: 15px;
    z-index: 1;
}
.no-course .text {
    position: relative;
    margin-top: 200px;
    margin-left: 50px;
    z-index: 2;
}
.project-meta {
    width: 100%;
}
.project-meta ul.project-users {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}
@media screen and (max-width: 575px) {
    .project-meta ul.project-users {
        flex-wrap: wrap;
    }
}
.project-meta ul.project-users li {
    padding: 0;
    flex-grow: 1;
}
.project-meta ul.project-users li a {
    width: 100%;
    display: flex;
    justify-content: center;
}
.plugin-domain {
    background-color: #81dffe;
    border-radius: 7px;
    text-align: center;
    color: #00408d;
    padding: 5px 0;
}
.license-limit-msg {
    margin-top: 15px;
    color: #de2424;
    font-size: 9px;
    text-align: center;
}
.file-download-btn-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.file-download-btn-wrapper a {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.file-wrapper {
    display: flex;
    align-items: center;
    font-size: 14px;
    position: relative;
    margin: 0 15px;
}
.file-wrapper a .nk-file-icon {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
.file-wrapper a .nk-file-icon .nk-file-icon-type {
    background-color: #fff;
    border-radius: 8px;
    padding: 8px;
    position: relative;
    width: 120px;
    height: 120px;
}
.file-wrapper a .nk-file-icon .nk-file-icon-type .count {
    position: absolute;
    top: 6px;
    right: 10px;
    background: linear-gradient(90deg, #fd6161 0%, #cf0606 120.93%);
    width: 22px;
    height: 22px;
    padding-top: 1px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color: #fff;
    padding-bottom: 2px;
}
.recent-files .card {
    min-height: 360px;
}
.dark-mode .file-wrapper .nk-file-icon .nk-file-icon-type {
    background-color: #18212d;
}
.cv-side {
    width: 30%;
    background: #fdcd32;
}
.cv-side .wrapper {
    padding: 0 40px;
}
.cv-side .wrapper .title {
    text-align: right;
}
.cv-side .wrapper .title h4 {
    color: #fff;
}
.cv-side .wrapper .desc {
    margin-top: 40px;
    padding: 15px 20px;
    border-radius: 8px;
    background-color: #fff;
}
@media screen and (max-width: 992px) {
    .cv-side .wrapper .desc {
        display: none;
    }
}
.cv-side .wrapper .desc p {
    color: #101924;
    line-height: 37px;
}
.cv-side .wrapper img {
    transform: scale(1.35) translate(-35px, 30px);
}
@media screen and (max-width: 992px) {
    .cv-side .wrapper img {
        display: none;
    }
}
.cv-side .wrapper img.portfolio {
    transform: scale(1.1) translate(19px, -75px);
}
@media screen and (max-width: 992px) {
    .cv-side .wrapper img.portfolio {
        display: none;
    }
}
.cv-form {
    width: 70%;
}
.cv-form-wrapper {
    background-color: #fff;
}
.dark-mode .cv-form-wrapper {
    background-color: #18212d;
}
#cv-form .buttons {
    display: flex;
    gap: 10px;
    margin-top: 15px;
}
#cv-form .cv-item {
    padding: 15px 15px 35px 15px;
    margin-top: 20px;
    border: 1px solid #dbdfea;
    border-radius: 10px;
    position: relative;
}
#cv-form .portfolio-note {
    display: none;
}
#cv-form .upload-avatar-wrapper {
    border: 1px dashed #b6b4b4;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
#cv-form .upload-avatar-wrapper img {
    border: 1px solid #b6b4b4;
    width: 100px;
    height: 100px;
    border-radius: 50%;
}
#cv-form .upload-portfolio-cover-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px dashed #b6b4b4;
    border-radius: 7px;
}
#cv-form .upload-portfolio-cover-wrapper input {
    display: none;
}
#cv-form .upload-portfolio-cover-wrapper label {
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
#cv-form .upload-portfolio-cover-wrapper label img {
    border: 1px solid #b6b4b4;
    width: 100px;
    height: 100px;
    border-radius: 50%;
}
#cv-form .upload-portfolio-cover-wrapper {
    padding: 30px 0;
}
#cv-form .upload-portfolio-cover-wrapper label svg,
#cv-form .upload-portfolio-cover-wrapper label img {
    border-radius: 7px;
    border: 0;
    width: 200px;
    height: 200px;
}
.timeline-item {
    position: relative;
}
.timeline-item .operations {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.cv-submit-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 25px;
}
.cv-submit-wrapper img {
    width: 450px;
}
.cv-img-wrapper {
    display: flex;
    width: 100%;
    justify-content: center;
}
.cv-img-wrapper .cv-index-img {
    width: 40%;
}
@media screen and (max-width: 575px) {
    .cv-img-wrapper .cv-index-img {
        width: 80%;
        margin-bottom: 20px;
    }
}
.start-cv-btn {
    display: flex;
    justify-content: center;
    width: 100%;
    gap: 25px;
}
.start-cv-btn .start-cv {
    display: inline;
    padding: 15px 50px;
    border-radius: 15px;
}
@media screen and (max-width: 575px) {
    .start-cv-btn .start-cv {
        padding: 10px 30px;
    }
}
.alert-message,
.pending-message,
.success-message {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}
.alert-message span,
.alert-message em,
.pending-message span,
.pending-message em,
.success-message span,
.success-message em {
    color: #de2424;
}
.alert-message em,
.pending-message em,
.success-message em {
    font-size: 25px;
    background-color: #fff;
    border-radius: 50%;
}
.pending-message span,
.pending-message em {
    color: #6300ff;
}
.copy-cv-url {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-bottom: 15px;
}
.copy-cv-url .title {
    color: #101924;
    font-weight: 700;
}
.copy-cv-url .url {
    border: 1px solid #101924;
    padding: 8px 35px;
    border-radius: 7px;
    cursor: pointer;
}
.success-message span,
.success-message em {
    color: #025f51;
}
.reject-message {
    padding: 10px 15px;
    border: 1px solid #de2424;
    border-radius: 5px;
}
.reject-message span {
    color: #de2424;
}
.reject-message span:last-child {
    color: #000;
}
.dark-mode .top-text {
    color: #8094ae;
}
.dark-mode .reject-message span:last-child {
    color: #8ca2be;
}
.dark-mode .pending-message span {
    color: #d1b4ff;
}
.dark-mode .success-message span {
    color: #05dbbb;
}
.dark-mode .copy-cv-url .title {
    color: #fff;
    font-weight: 700;
}
.dark-mode .copy-cv-url .url {
    border: 1px solid #abbbd7;
    color: #abbbd7;
}
.cropper-view-box,
.cropper-face {
    border-radius: 50%;
}
.cropper-view-box {
    outline: 0;
    box-shadow: 0 0 0 1px #fdcd32;
}
#avatar-modal {
    background-color: rgba(0, 0, 0, 0.7960784314);
}
#avatar-modal .cv-avatar-loader {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000000;
}
#avatar-modal .overlay {
    display: none;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7960784314);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100000;
}
.validation-error-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999999999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #dc2626;
    padding: 5px 15px;
}
.validation-error-bar .text {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.validation-error-bar .close {
    cursor: pointer;
}
.cv-show-body {
    background-color: #fff;
}
.cv-show-body .shape1 {
    width: 30%;
    z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    width: 33%;
    height: 700px;
    overflow: hidden;
}
.cv-show-body .shape1 .rect {
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
}
.cv-show-body .shape1 .dots {
    position: absolute;
    top: 100px;
    left: -300px;
}
.cv-show-body .shape2 {
    width: 25%;
    z-index: 1;
    position: absolute;
    right: 0;
    top: 100%;
    width: 33%;
    height: 1200px;
    overflow: hidden;
}
.cv-show-body .shape2 .rect {
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
}
.cv-show-body .shape2 .dots {
    position: absolute;
    top: 100px;
    right: -300px;
}
.cv-show-body nav {
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    z-index: 2;
    padding-top: 15px;
}
.cv-show-body nav .logo {
    display: flex;
    align-items: center;
    gap: 7px;
}
.cv-show-body nav .logo img {
    width: 52px;
    height: 52px;
}
@media screen and (max-width: 767px) {
    .cv-show-body nav .logo img {
        width: 26px;
        height: 26px;
    }
}
.cv-show-body nav .logo .logo-text {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 5px;
}
@media screen and (max-width: 767px) {
    .cv-show-body nav .logo .logo-text {
        display: none;
    }
}
.cv-show-body nav .logo .logo-text .line {
    background-color: #fdcd32;
    height: 1px;
    width: 100%;
}
.cv-show-body nav .logo .logo-text h5 {
    font-weight: 900;
}
.cv-show-body nav .logo .logo-text h5,
.cv-show-body nav .logo .logo-text h6 {
    margin: 0px;
}
.cv-show-body nav ul.tabs {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 70px;
}
@media screen and (max-width: 767px) {
    .cv-show-body nav ul.tabs {
        gap: 20px;
    }
}
.cv-show-body nav ul.tabs li a {
    color: #393939;
}
@media screen and (max-width: 767px) {
    .cv-show-body nav ul.tabs li a {
        font-size: 11px;
    }
}
@media screen and (max-width: 767px) {
    .cv-show-body nav .contact {
        display: none;
    }
}
.cv-show-body nav .contact a {
    padding: 7px 55px;
    border-radius: 12px;
    background-color: #fff;
    color: #393939;
}
.cv-show-body .intro-wrapper {
    display: flex;
    justify-content: center;
}
.cv-show-body .intro-wrapper .intro {
    background: linear-gradient(147deg, #ffd200 -6.76%, #ffd200 102.96%);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    margin-top: 70px;
    position: relative;
    z-index: 2;
    padding: 50px;
    background-color: #fdcd32;
    border-radius: 200px 2px 200px 2px;
    color: #393939;
    width: 100%;
}
@media screen and (max-width: 992px) {
    .cv-show-body .intro-wrapper .intro {
        width: 90%;
    }
}
@media screen and (max-width: 767px) {
    .cv-show-body .intro-wrapper .intro {
        width: 100%;
    }
}
.cv-show-body .intro-wrapper .intro .avatar {
    background-color: #fff;
    border-radius: 50%;
    border: 20px solid #fff;
}
.cv-show-body .intro-wrapper .intro .avatar img {
    width: 100%;
    border-radius: 50%;
    border: 10px solid #fdcd32;
}
.cv-show-body .intro-wrapper .intro .content {
    display: flex;
    flex-direction: column;
}
@media screen and (max-width: 767px) {
    .cv-show-body .intro-wrapper .intro .content {
        margin-top: 25px;
        align-items: center;
    }
    .cv-show-body .intro-wrapper .intro .content span {
        display: none;
    }
}
.cv-show-body .intro-wrapper .intro .content h1 {
    color: #000;
    font-size: 3.8rem;
    font-weight: 900;
}
@media screen and (max-width: 767px) {
    .cv-show-body .intro-wrapper .intro .content h1 {
        font-size: 5rem;
    }
}
@media screen and (max-width: 575px) {
    .cv-show-body .intro-wrapper .intro .content h1 {
        font-size: 2.5rem;
    }
}
.cv-show-body .intro-wrapper .intro .content .btn-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cv-show-body .intro-wrapper .intro .content .btn-wrapper .btn {
    width: 49%;
    display: flex;
    justify-content: center;
}
.cv-show-body .intro-wrapper .intro .content .btn-wrapper .btn-cv {
    background-color: #18212d;
    color: #fff;
}
.cv-show-body .intro-wrapper .intro .content .btn-wrapper .btn-port {
    background-color: #fff;
    color: #18212d;
}
.cv-show-body .box-wrapper {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    margin-top: 25px;
}
.cv-show-body .box-wrapper .box {
    width: 100%;
    background-color: #18212d;
    border-radius: 0.625rem;
    color: #fff;
    padding: 25px 20px;
}
@media screen and (max-width: 992px) {
    .cv-show-body .box-wrapper .box {
        width: 90%;
    }
}
@media screen and (max-width: 767px) {
    .cv-show-body .box-wrapper .box {
        width: 100%;
    }
}
.cv-show-body .box-wrapper .box .header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cv-show-body .box-wrapper .box .content-box {
    border-radius: 0.625rem;
    border: 3px solid var(--primary, #4776e6);
    background: rgba(217, 217, 217, 0);
    padding: 15px 20px;
    margin-top: 17px;
}
.cv-show-body .box-wrapper .box .content-box ul {
    list-style: none !important;
}
.cv-show-body .box-wrapper .box .content-box ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 18px 0;
}
.cv-show-body .box-wrapper .box .content-box ul li .title img {
    width: 28px;
    height: 28px;
    margin-left: 3px;
}
.cv-show-body .box-wrapper .box .content-box ul li .line {
    height: 1px;
    border: 1px dashed #4776e6;
    width: 74%;
}
@media screen and (max-width: 1200px) {
    .cv-show-body .box-wrapper .box .content-box ul li .line {
        width: 60%;
    }
}
@media screen and (max-width: 992px) {
    .cv-show-body .box-wrapper .box .content-box ul li .line {
        width: 50%;
    }
}
@media screen and (max-width: 768px) {
    .cv-show-body .box-wrapper .box .content-box ul li .line {
        width: 45%;
    }
}
@media screen and (max-width: 575px) {
    .cv-show-body .box-wrapper .box .content-box ul li .line {
        display: none;
    }
}
.cv-show-body .box-wrapper .skills-box {
    margin-top: 35px;
}
.cv-show-body .box-wrapper .skills-box .header .box-icon {
    background-color: #fff;
    position: absolute;
    border-radius: 50%;
    z-index: 3;
    left: 50%;
    transform: translate(-50%, -50%);
    top: -100%;
}
.cv-show-body .box-wrapper .skills-box .header img {
    width: 60px;
    height: 60px;
}
.cv-show-body .box-wrapper .skills-box .content-box .progress {
    border-radius: 20px;
}
.cv-show-body .box-wrapper .skills-box .content-box .progress .progress-bar {
    border-radius: 20px;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
}
.cv-show-body .box-wrapper .education-box {
    margin-top: 40px;
}
.cv-show-body .box-wrapper .education-box .header .box-icon {
    background-color: #fff;
    position: absolute;
    border-radius: 50%;
    z-index: 3;
    left: 50%;
    padding: 5px;
    transform: translate(-50%, -50%);
    top: -100%;
}
.cv-show-body .box-wrapper .education-box .header img {
    width: 60px;
    height: 60px;
}
.cv-show-body .box-wrapper .education-box .content-box .education {
    border-radius: 1.375rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    padding: 30px 15px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.cv-show-body .box-wrapper .education-box .content-box .education .title {
    display: flex;
    align-items: center;
    gap: 20px;
}
.cv-show-body .box-wrapper .education-box .content-box .education .title img {
    width: 32px;
    height: 32px;
}
.cv-show-body .box-wrapper .education-box .content-box .education .title h4 {
    font-weight: 900;
    color: #fff;
}
.cv-show-body .box-wrapper .work-box {
    margin-top: 40px;
}
.cv-show-body .box-wrapper .work-box .header .box-icon {
    background-color: #fff;
    position: absolute;
    border-radius: 50%;
    padding: 15px;
    z-index: 3;
    left: 50%;
    transform: translate(-50%, -50%);
    top: -100%;
}
.cv-show-body .box-wrapper .work-box .header img {
    width: 60px;
    height: 60px;
}
.cv-show-body .box-wrapper .work-box .content-box .work {
    border-radius: 1.375rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    padding: 30px 15px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.cv-show-body .box-wrapper .work-box .content-box .work .title {
    display: flex;
    align-items: center;
    gap: 20px;
}
.cv-show-body .box-wrapper .work-box .content-box .work .title img {
    width: 32px;
    height: 32px;
}
.cv-show-body .box-wrapper .work-box .content-box .work .title h4 {
    font-weight: 900;
    color: #fff;
}
.cv-show-body .box-wrapper .achievments-box {
    margin-top: 40px;
}
.cv-show-body .box-wrapper .achievments-box .header .box-icon {
    background-color: #fff;
    position: absolute;
    border-radius: 50%;
    padding: 15px;
    z-index: 3;
    left: 50%;
    transform: translate(-50%, -50%);
    top: -100%;
}
.cv-show-body .box-wrapper .achievments-box .header img {
    width: 60px;
    height: 60px;
}
.cv-show-body .box-wrapper .achievments-box .content-box .achievments {
    border-radius: 1.375rem;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    padding: 30px 15px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.cv-show-body .box-wrapper .achievments-box .content-box .achievments .title {
    display: flex;
    align-items: center;
    gap: 20px;
}
.cv-show-body
    .box-wrapper
    .achievments-box
    .content-box
    .achievments
    .title
    img {
    width: 32px;
    height: 32px;
}
.cv-show-body
    .box-wrapper
    .achievments-box
    .content-box
    .achievments
    .title
    h4 {
    font-weight: 900;
    color: #fff;
}
.cv-show-body .contact-me-wrapper {
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
    position: relative;
    overflow: hidden;
}
.cv-show-body .contact-me-wrapper .contact-me {
    background: linear-gradient(147deg, #ffd200 -6.76%, #ffd200 102.96%);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    margin-top: 70px;
    position: relative;
    z-index: 2;
    padding: 50px;
    background-color: #fdcd32;
    border-radius: 200px 2px 200px 2px;
    color: #393939;
    width: 100%;
}
@media screen and (max-width: 992px) {
    .cv-show-body .contact-me-wrapper .contact-me {
        width: 90%;
    }
}
@media screen and (max-width: 767px) {
    .cv-show-body .contact-me-wrapper .contact-me {
        width: 100%;
    }
}
.cv-show-body .contact-me-wrapper .contact-me .avatar {
    background-color: #fff;
    border-radius: 50%;
    border: 20px solid #fff;
}
.cv-show-body .contact-me-wrapper .contact-me .avatar img {
    width: 100%;
    border-radius: 50%;
    border: 10px solid #fdcd32;
}
.cv-show-body .contact-me-wrapper .contact-me .content {
    margin-top: 100px;
}
.cv-show-body .contact-me-wrapper .contact-me .content p.title {
    color: #393939;
}
.cv-show-body .contact-me-wrapper .contact-me .content .contact-icon-holder {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    border-radius: 50%;
    margin: 0 10px;
}
.cv-show-body .contact-me-wrapper .contact-me .content .contact-me-form-group {
    margin: 20px 0;
    display: flex;
    flex-direction: column;
    gap: 7px;
}
.cv-show-body
    .contact-me-wrapper
    .contact-me
    .content
    .contact-me-form-group
    input {
    border: 0px;
    border-radius: 5px;
    padding: 3px 7px;
    outline: 0;
}
.cv-show-body
    .contact-me-wrapper
    .contact-me
    .content
    .contact-me-form-group
    input:focus {
    border: 0;
    outline: 0;
}
.cv-show-body
    .contact-me-wrapper
    .contact-me
    .content
    .contact-me-form-group
    input:focus-visible {
    border: 0;
    outline: 0;
}
.cv-show-body
    .contact-me-wrapper
    .contact-me
    .content
    .contact-me-form-group
    button {
    margin-top: 20px;
    background-color: #18212d;
    border: 0;
    outline: 0;
    border-radius: 25px;
    color: #fff;
    padding: 5px 0;
}
.cv-show-body .contact-me-wrapper .shape4 {
    position: absolute;
    z-index: 1;
    bottom: -37%;
    right: -10%;
}
.cv-show-body .contact-me-wrapper .shape5 {
    position: absolute;
    z-index: 1;
    top: -47%;
    left: -20%;
}
.cv-show-body-pending {
    background-color: #101924;
}
.cv-show-body-pending .desktop-mode {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100vh;
}
@media screen and (max-width: 767px) {
    .cv-show-body-pending .desktop-mode {
        display: none;
    }
}
.cv-show-body-pending .desktop-mode .banner {
    border-radius: 10px;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
    position: relative;
    display: flex;
    justify-content: flex-end;
    gap: 25px;
    width: 800px;
    height: 165px;
    padding-left: 50px;
}
.cv-show-body-pending .desktop-mode .banner .pending-message {
    position: absolute;
    top: -120px;
    left: 65px;
    border-radius: 196.648px;
    background: #fff;
    box-shadow: 0px 12px 20px 1px #606be8;
    padding: 12px 80px;
}
@media screen and (max-width: 992px) {
    .cv-show-body-pending .desktop-mode .banner .pending-message {
        left: 30px;
    }
}
.cv-show-body-pending .desktop-mode .banner .logo {
    position: absolute;
    top: 8px;
    left: 66px;
    width: 301px;
}
.cv-show-body-pending .desktop-mode .banner .boy {
    position: absolute;
    top: -170px;
    right: 30px;
    width: 250px;
}
@media screen and (max-width: 992px) {
    .cv-show-body-pending .desktop-mode .banner .boy {
        right: 0;
    }
}
.cv-show-body-pending .desktop-mode .banner .link a {
    color: #000;
    background-color: #fff;
    padding: 10px 25px;
    border-radius: 25px;
    box-shadow: 0px 19.665px 29.497px 4.916px rgba(16, 16, 17, 0.26);
}
.cv-show-body-pending .mobile-mode {
    height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: space-between;
    gap: 100px;
}
@media screen and (min-width: 767px) {
    .cv-show-body-pending .mobile-mode {
        display: none;
    }
}
.cv-show-body-pending .mobile-mode .pending-message {
    border-radius: 196.648px;
    background: #fff;
    box-shadow: 0px 12px 20px 1px #606be8;
    padding: 12px 10px;
}
.cv-show-body-pending .mobile-mode .banner {
    position: relative;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.cv-show-body-pending .mobile-mode .banner .logo {
    position: absolute;
    top: 8px;
    left: 66px;
    width: 301px;
}
.cv-show-body-pending .mobile-mode .banner .boy {
    width: 200px;
}
.cv-show-body-pending .mobile-mode .banner .link {
    margin: 10px 0;
}
.cv-show-body-pending .mobile-mode .banner .link a {
    color: #000;
    background-color: #fff;
    padding: 10px 25px;
    border-radius: 25px;
    box-shadow: 0px 19.665px 29.497px 4.916px rgba(16, 16, 17, 0.26);
}
.portfolios-wrapper {
    position: relative;
    border-radius: 10px;
    background: #f2f2fd;
    box-shadow: 0px 4px 14.3px 5px rgba(179, 179, 179, 0.2509803922);
    z-index: 100;
    padding: 50px 75px;
    margin-top: 50px;
}
@media screen and (max-width: 575px) {
    .portfolios-wrapper {
        padding: 30px 15px;
    }
}
.portfolios-wrapper .portfolio-box-wrapper .portfolio-box {
    background-color: #fff;
    border-radius: 5px;
    max-height: 650px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    overflow: hidden;
}
.portfolios-wrapper .portfolio-box-wrapper .portfolio-box .cover {
    display: flex;
    justify-content: center;
    align-items: center;
}
.portfolios-wrapper .portfolio-box-wrapper .portfolio-box .cover img {
    max-width: 600px;
    max-height: 300px;
    border-radius: 5px;
}
@media screen and (max-width: 575px) {
    .portfolios-wrapper .portfolio-box-wrapper .portfolio-box .cover img {
        width: 100%;
    }
}
.portfolios-wrapper .portfolio-box-wrapper .portfolio-box .button a {
    width: 100%;
    display: block;
    background-color: #fdcd32;
    text-align: center;
    color: #000;
    border-radius: 8px;
}
.tags-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.tags-wrapper .tag {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 3px;
    border: 1px solid #dbdbdb;
    padding: 5px;
    min-width: 155px;
}
.upload-portfolio-cover .form-file-input:lang(fa) ~ .form-file-label::after {
    content: "انتخاب تصویر";
}
.my-portfolios {
    position: relative;
    padding: 25px;
}
.my-portfolios .portfolio-box-wrapper {
    padding: 10px;
}
.my-portfolios .portfolio-box-wrapper .portfolio-box {
    position: relative;
    background: #f2f2fd;
    box-shadow: 0px 4px 14.3px 5px rgba(179, 179, 179, 0.2509803922);
    border-radius: 5px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
    min-height: 516px;
    overflow: hidden;
}
.my-portfolios .portfolio-box-wrapper .portfolio-box .cover {
    display: flex;
    justify-content: center;
    align-items: center;
}
.my-portfolios .portfolio-box-wrapper .portfolio-box .cover img {
    max-width: 100%;
    max-height: 300px;
    border-radius: 5px;
}
.my-portfolios .portfolio-box-wrapper .portfolio-box .skills img {
    width: 18px;
}
.my-portfolios .portfolio-box-wrapper .portfolio-box .skills span {
    font-size: 14px;
}
.my-portfolios .portfolio-box-wrapper .portfolio-box .button a {
    width: 100%;
    display: block;
    background-color: #fdcd32;
    text-align: center;
    color: #000;
    border-radius: 8px;
}
.my-portfolios .portfolio-box-wrapper .portfolio-box .rejected {
    position: absolute;
    top: 5px;
    left: 5px;
}
.portfolio-show {
    padding: 50px 30px;
}
.portfolio-show .cover img {
    border-radius: 15px;
}
.portfolio-show .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 30px 0;
}
.portfolio-show .title .created-at {
    background-color: #efefef;
    padding: 2px 3px;
}
.portfolio-show .skills img {
    width: 18px;
}
.portfolio-show .description {
    text-align: justify;
}
.portfolio-show .links {
    margin: 15px 0;
}
.portfolio-show .links a.link {
    background-color: #fdcd32;
    color: #000;
    border-radius: 5px;
}
.portfolio-show .user-detail {
    padding: 25px;
    border: 1px solid #4776e6;
    border-radius: 12px;
}
.portfolio-show .user-detail .info {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.portfolio-show .user-detail .info .avatar img {
    width: 100px;
    border: 2px solid #fdcd32;
    border-radius: 50%;
}
.portfolio-show .user-detail .info .name strong {
    font-size: 20px;
    color: #000;
}
.portfolio-show .user-detail .skills {
    margin-top: 75px;
}
.portfolio-show .user-detail .skills .skills-box {
    background-color: #f2f2fd;
    padding: 8px 30px;
}
.portfolio-show .user-detail .skills .skills-box .progress {
    --bs-progress-bg: #fff;
    border-radius: 8px;
}
.portfolio-show .user-detail .others {
    margin-top: 25px;
}
.portfolio-show .user-detail .buttons {
    margin-top: 35px;
}
.portfolio-show .user-detail .buttons a {
    display: block;
    width: 100%;
    text-align: center;
    border-radius: 5px;
    margin: 10px 0;
}
.portfolio-show .user-detail .buttons a.resume {
    color: #6300ff;
    border: 1px solid #6300ff;
    background-color: rgba(0, 0, 0, 0);
}
.portfolio-show .user-detail .buttons a.edit-resume {
    color: #000;
    border: 1px solid #fdcd32;
    background-color: #fdcd32;
}
.dark-mode .my-portfolios .portfolio-box {
    background: #1e2a3a;
    box-shadow: 0px 4px 14.3px 5px rgba(8, 13, 48, 0.25);
}
.dark-mode .my-portfolios .portfolio-box .skills span {
    color: #9e9e9e;
}
.dark-mode .my-portfolios .portfolio-box .excerpt p {
    color: #c9c9c9;
}
.dark-mode .portfolio-show .title .created-at {
    background-color: #151b57;
    color: #efefef;
}
.dark-mode .portfolio-show .skills span {
    color: #9e9e9e;
}
.dark-mode .portfolio-show .description {
    color: #c9c9c9;
}
.dark-mode .portfolio-show .user-detail .info .name strong {
    color: #c9c9c9;
}
.dark-mode .portfolio-show .user-detail .skills .skills-box {
    background-color: #1a2738;
}
.dark-mode .portfolio-show .user-detail .buttons a.resume {
    color: #a973ff;
    border: 1px solid #a973ff;
}
#skills-filter {
    background-color: #f2f2fd;
}
.service-item-ul {
    display: block;
}
.service-item-ul li div {
    width: 100%;
}
.service-item-ul li div label {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.service-item-ul li div label .price {
    text-align: left;
}
.proceed-payment {
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 25px;
}
.proceed-payment form {
    background-color: #f2f2fd;
    width: 100%;
    text-align: center;
    margin-top: 8px;
    border-radius: 8px;
    padding: 25px;
}
.proceed-payment form .price-wrapper,
.proceed-payment form .project-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.proceed-payment form button {
    width: 100%;
    display: block;
    text-align: center;
    margin-top: 10px;
}
.vip-services .header {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 50px 0;
    gap: 10px;
}
.vip-services .header h1 {
    background: linear-gradient(90deg, #4776e6, #8e54e9);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    border-bottom: 1px solid #4776e6;
    padding-bottom: 20px;
    font-weight: bold;
}
.vip-services .header .buttons {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 50px;
}
.vip-services .header .buttons .btn-primary-dim {
    border: 1px solid #4776e6;
    color: #4776e6;
    border-radius: 25px;
}
.vip-services .header .buttons .btn-primary {
    border-radius: 25px;
    min-width: 180px;
    text-align: center;
    display: block;
}
.vip-services .information {
    margin: 10px 0 30px 0;
}
.vip-services .information .list .item {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    border: 1px solid #4776e6;
    border-radius: 10px;
    padding: 15px 0;
    margin: 40px 0;
}
.vip-services .information .list .item .text {
    font-size: 20px;
}
.vip-services .information .list .item .text span {
    color: #4776e6;
    font-weight: bold;
}
.vip-services .information .list .item .text strong {
    color: #000;
}
.vip-services .service-tab-cat {
    border-color: rgba(0, 0, 0, 0) !important;
    padding: 0;
}
.vip-services .service-tab-cat li a {
    border-radius: 5px;
    background-color: #f2f2fd;
    margin: 10px 0;
    color: #4776e6;
    border: 1px solid #4776e6;
}
.vip-services .service-tab-cat li a.active {
    background: linear-gradient(90deg, #4776e6, #8e54e9);
    color: #fff;
}
.vip-services .service-tab-cat li a.active::after {
    color: #fff;
}
.vip-services .service-content {
    background: linear-gradient(90deg, #4776e6, #8e54e9);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 7px;
}
.vip-services .service-content .service-detail-modal-button {
    margin-top: 4px;
}
.vip-services .service-content .full-capacity {
    color: #000;
    text-align: center;
    border-radius: 0.5rem;
    background: linear-gradient(90deg, #fdcd32 0%, #fdac32 100%);
}
.vip-services .service-content .full-capacity-red {
    color: #fff;
    text-align: center;
    border-radius: 0.5rem;
    background: linear-gradient(90deg, #f66 0%, #cc0101 100%);
}
.vip-services .service-content .accordion-item {
    border-radius: 8px;
}
.vip-services .faq .accordion-item {
    border-radius: 5px;
    background: #f2f2fd;
    color: #101924;
    margin: 10px 0;
    border: 1px solid #4776e6;
}
.vip-services .faq .accordion-item .accordion-body {
    color: #5c5c5c;
}
#init .page-title {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    align-items: center;
    padding: 30px 0 10px 0;
    gap: 20px;
}
#init .page-title h4 {
    font-size: 48px;
    font-weight: 800;
    background: -webkit-linear-gradient(91deg, #4776e6, #8e54e9 70%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    margin: 0;
}
@media screen and (max-width: 992px) {
    #init .page-title h4 {
        font-size: 44px;
    }
}
@media screen and (max-width: 767px) {
    #init .page-title h4 {
        font-size: 38px;
    }
}
@media screen and (max-width: 575px) {
    #init .page-title h4 {
        font-size: 32px;
    }
}
#init .page-title .line {
    height: 1px;
    width: 60%;
    background: -webkit-linear-gradient(91deg, #4776e6, #8e54e9 70%);
}
#init .desc {
    padding: 10px 200px;
}
#init .desc p {
    text-align: justify;
    -moz-text-align-last: center;
    text-align-last: center;
}
@media screen and (max-width: 1400px) {
    #init .desc {
        padding: 10px 150px;
    }
}
@media screen and (max-width: 992px) {
    #init .desc {
        padding: 10px 100px;
    }
}
@media screen and (max-width: 767px) {
    #init .desc {
        padding: 10px 70px;
    }
}
@media screen and (max-width: 575px) {
    #init .desc {
        padding: 10px 30px;
    }
}
#init .type {
    margin-top: 20px;
    padding: 10px 70px;
}
@media screen and (max-width: 992px) {
    #init .type {
        margin-top: 0px;
        padding: 10px 130px;
    }
}
@media screen and (max-width: 767px) {
    #init .type {
        margin-top: 0px;
        padding: 10px 70px;
    }
}
@media screen and (max-width: 575px) {
    #init .type {
        margin-top: 0px;
        padding: 10px 30px;
    }
}
#init .type .type-box {
    margin: 5px 0;
    padding: 30px 0 50px 0;
    border: 1px solid #4776e6;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    min-height: 150px;
    max-height: 150px;
    position: relative;
}
@media screen and (max-width: 992px) {
    #init .type .type-box {
        margin: 60px 0;
    }
}
@media screen and (max-width: 767px) {
    #init .type .type-box {
        margin: 60px 0;
    }
}
@media screen and (max-width: 575px) {
    #init .type .type-box {
        margin: 50px 0;
    }
}
#init .type .type-box .type-title h6 {
    color: #4776e6;
}
#init .type .type-box .type-img {
    position: absolute;
    top: 38%;
}
#init .group {
    margin-top: 70px;
    padding: 10px 70px 50px 70px;
}
@media screen and (max-width: 992px) {
    #init .group {
        margin-top: 0px;
        padding: 10px 130px 50px 130px;
    }
}
@media screen and (max-width: 767px) {
    #init .group {
        margin-top: 0px;
        padding: 10px 70px 50px 70px;
    }
}
@media screen and (max-width: 575px) {
    #init .group {
        margin-top: 0px;
        padding: 10px 30px 50px 30px;
    }
}
#init .group .group-box {
    background-color: #f2f2fd;
    border-radius: 12px;
    padding: 60px 30px;
    min-height: 225px;
    max-height: 225px;
    margin-top: 25px;
}
@media screen and (max-width: 575px) {
    #init .group .group-box {
        padding: 30px 10px;
    }
}
#init .group .group-box .content {
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 575px) {
    #init .group .group-box .content {
        flex-wrap: wrap;
    }
}
@media screen and (max-width: 575px) {
    #init .group .group-box .content .detail {
        order: 2;
        margin-top: 15px;
    }
}
#init .group .group-box .content .detail .title {
    font-weight: bold;
    margin-bottom: 10px;
    padding: 0 30px;
}
@media screen and (max-width: 575px) {
    #init .group .group-box .content .detail .title {
        text-align: center;
    }
}
#init .group .group-box .content .detail p {
    padding: 0 30px;
}
@media screen and (max-width: 575px) {
    #init .group .group-box .content .detail p {
        text-align: justify;
        -moz-text-align-last: center;
        text-align-last: center;
        padding: 0 20px;
    }
}
@media screen and (max-width: 575px) {
    #init .group .group-box .content .img {
        order: 1;
    }
}
#init .group .group-box .content .img img {
    width: 120px;
}
@media screen and (max-width: 575px) {
    #init .group .group-box .content .img img {
        width: 100px;
    }
}
#init .group .group-box .content .img-students img {
    width: 150px;
}
@media screen and (max-width: 575px) {
    #init .group .group-box .content .img-students img {
        width: 100px;
    }
}
@media screen and (max-width: 351px) {
    #init .group .stu-btn {
        font-size: 12px;
    }
}
.dark-mode .vip-services .information {
    margin: 10px 0 30px 0;
}
.dark-mode .vip-services .information .list .item .text strong {
    color: #c9c9c9;
}
.dark-mode .vip-services .service-tab-cat li a {
    background-color: #27303b;
    color: #bac6e2;
    border: 1px solid #bac6e2;
}
.dark-mode .vip-services .service-tab-cat li a.active {
    color: #fff;
}
.dark-mode .vip-services .service-content {
    background: linear-gradient(90deg, #4776e6, #8e54e9);
}
.dark-mode .vip-services .service-content .accordion-inner p {
    color: #efefef;
}
.dark-mode .vip-services .faq .accordion-item .accordion-body {
    color: #c9c9c9;
}
.dark-mode .proceed-payment {
    background-color: #27303b;
}
.dark-mode .proceed-payment form {
    background-color: #27303b;
}
.dark-mode #init .desc p {
    color: #b6c6e3;
}
.dark-mode #init .group .group-box {
    background-color: #101924;
}
.dark-mode #init .group .group-box .content .detail .title {
    color: #fff;
}
.dark-mode #init .group .group-box .content .detail p {
    color: #b6c6e3;
}
.pdf {
    direction: rtl;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pdf * {
    font-family: "yekan";
}
.pdf .logo {
    text-align: center;
    margin-bottom: 20px;
}
.pdf h2 {
    text-align: center;
    color: #fdcd32;
    font-family: "yekan";
}
.pdf .content p {
    text-align: justify;
}
#certificate-validation {
    direction: rtl;
    background-color: #fff;
}
@media screen and (min-width: 575px) {
    #certificate-validation .for-mobile {
        display: none !important;
    }
}
#certificate-validation .header {
    width: 100%;
    position: relative;
}
@media screen and (max-width: 574px) {
    #certificate-validation .header .header-pc {
        display: none;
    }
}
@media screen and (min-width: 575px) {
    #certificate-validation .header .header-mob {
        display: none;
    }
}
#certificate-validation .header img {
    width: 100%;
}
#certificate-validation .header .user-info {
    transform: translateY(-100px);
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}
@media screen and (min-width: 575px) {
    #certificate-validation .header .user-info {
        transform: none;
    }
}
@media screen and (max-width: 520px) {
    #certificate-validation .header .user-info {
        transform: translateY(-90px);
    }
}
@media screen and (max-width: 444px) {
    #certificate-validation .header .user-info {
        transform: translateY(-75px);
    }
}
@media screen and (max-width: 398px) {
    #certificate-validation .header .user-info {
        transform: translateY(-65px);
    }
}
@media screen and (max-width: 344px) {
    #certificate-validation .header .user-info {
        transform: translateY(-55px);
    }
}
#certificate-validation .header .user-info .avatar-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 210px;
    height: 210px;
    border: 1px solid #242760;
    border-radius: 50%;
}
@media screen and (max-width: 520px) {
    #certificate-validation .header .user-info .avatar-wrapper {
        width: 160px;
        height: 160px;
    }
}
@media screen and (max-width: 398px) {
    #certificate-validation .header .user-info .avatar-wrapper {
        width: 140px;
        height: 140px;
    }
}
@media screen and (max-width: 344px) {
    #certificate-validation .header .user-info .avatar-wrapper {
        width: 120px;
        height: 120px;
    }
}
#certificate-validation .header .user-info .avatar-wrapper img {
    width: 200px;
    height: 200px;
}
@media screen and (max-width: 520px) {
    #certificate-validation .header .user-info .avatar-wrapper img {
        width: 150px;
        height: 150px;
    }
}
@media screen and (max-width: 398px) {
    #certificate-validation .header .user-info .avatar-wrapper img {
        width: 130px;
        height: 130px;
    }
}
@media screen and (max-width: 344px) {
    #certificate-validation .header .user-info .avatar-wrapper img {
        width: 110px;
        height: 110px;
    }
}
#certificate-validation .header .user-info .fullname {
    color: #242760;
}
#certificate-validation .header .user-info .student {
    color: #544c4c;
    font-size: 13.5px;
}
#certificate-validation .header .user-info img.check {
    width: 91px;
    height: 91px;
}
#certificate-validation .header .user-info .approved {
    color: #00b09b;
}
#certificate-validation .header .user-info a.cv-link {
    background-color: #ffd200;
    color: #000;
    border-radius: 5px;
    padding: 7px 45px;
}
#certificate-validation .product-wrapper {
    padding: 20px;
    margin: -50px 15px 0 15px;
    background: #f2f2fd;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
#certificate-validation .product-wrapper .product-thumbnail {
    border-radius: 12px;
}
#certificate-validation .product-wrapper .product-link {
    width: 100%;
    margin-top: 10px;
    display: flex;
    justify-content: center;
}
#certificate-validation .desktop-user-info {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    transform: translateY(-70px);
}
@media screen and (max-width: 575px) {
    #certificate-validation .desktop-user-info {
        display: none;
    }
}
#certificate-validation .desktop-user-info .avatar-bg {
    background-color: #fff;
    border-radius: 50%;
    width: 300px;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (min-width: 575px) {
    #certificate-validation .desktop-user-info .avatar-bg {
        width: 160px;
        height: 160px;
    }
}
@media screen and (min-width: 992px) {
    #certificate-validation .desktop-user-info .avatar-bg {
        width: 200px;
        height: 200px;
    }
}
@media screen and (min-width: 1200px) {
    #certificate-validation .desktop-user-info .avatar-bg {
        width: 250px;
        height: 250px;
    }
}
#certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 250px;
    height: 250px;
    border: 1px solid #242760;
    border-radius: 50%;
}
@media screen and (min-width: 575px) {
    #certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper {
        width: 130px;
        height: 130px;
    }
}
@media screen and (min-width: 992px) {
    #certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper {
        width: 150px;
        height: 150px;
    }
}
@media screen and (min-width: 1200px) {
    #certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper {
        width: 200px;
        height: 200px;
    }
}
#certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper img {
    width: 240px;
    height: 240px;
}
@media screen and (min-width: 575px) {
    #certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper img {
        width: 120px;
        height: 120px;
    }
}
@media screen and (min-width: 992px) {
    #certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper img {
        width: 140px;
        height: 140px;
    }
}
@media screen and (min-width: 1200px) {
    #certificate-validation .desktop-user-info .avatar-bg .avatar-wrapper img {
        width: 190px;
        height: 190px;
    }
}
#certificate-validation .desktop-user-info .fullname {
    color: #242760;
}
#certificate-validation .desktop-user-info .student {
    color: #544c4c;
    font-size: 13.5px;
}
#certificate-validation .desktop-user-info img.check {
    width: 91px;
    height: 91px;
}
@media screen and (min-width: 575px) {
    #certificate-validation .desktop-user-info img.check {
        width: 50px;
        height: 50px;
    }
}
@media screen and (min-width: 1200px) {
    #certificate-validation .desktop-user-info img.check {
        width: 80px;
        height: 80px;
    }
}
#certificate-validation .desktop-user-info .approved {
    color: #00b09b;
}
@media screen and (min-width: 575px) {
    #certificate-validation .desktop-user-info .approved {
        font-size: 13px;
        margin-top: 5px;
    }
}
#certificate-validation .desktop-user-info a.cv-link {
    background-color: #ffd200;
    color: #000;
    border-radius: 5px;
    padding: 7px 45px;
}
@media screen and (min-width: 575px) {
    #certificate-validation .desktop-user-info a.cv-link {
        padding: 7px 25px;
        font-size: 13px;
    }
}
@media screen and (min-width: 1200px) {
    #certificate-validation .desktop-user-info a.cv-link {
        padding: 7px 35px;
        font-size: 13px;
    }
}
#certificate-validation .desktop-product-wrapper {
    width: 100%;
    margin-top: 20px;
    padding: 7px;
    background: #f2f2fd;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 575px) {
    #certificate-validation .desktop-product-wrapper {
        display: none;
    }
}
#certificate-validation .desktop-product-wrapper .product-thumbnail {
    border-radius: 12px;
}
#certificate-validation .desktop-product-wrapper .product-link {
    width: 100%;
    margin-top: 10px;
    display: flex;
    justify-content: center;
}
@media screen and (max-width: 991px) {
    #certificate-validation .portfolio-wrapper {
        display: none;
    }
}
#certificate-validation .portfolio-wrapper .portfolios {
    background: #f2f2fd;
    border-radius: 12px;
    margin-top: 20px;
    padding: 20px;
}
#certificate-validation .portfolio-wrapper .portfolios img {
    border-radius: 12px;
}
#certificate-validation .rejected p {
    font-weight: bold;
    font-size: 20px;
}
#certificate-validation .rejected a.link-to-academy {
    background-color: #ffd200;
    color: #000;
    border-radius: 5px;
    padding: 7px 75px;
}
#certificate-validation .reject-mob {
    font-weight: bold;
    font-size: 16px;
}
@media screen and (max-width: 575px) {
    #certificate-validation .for-desktop {
        display: none;
    }
}
.freelancers {
    position: relative;
    padding: 25px;
}
.freelancers .freelancer-box-wrapper {
    padding: 10px;
}
.freelancers .freelancer-box-wrapper .freelancer-box {
    position: relative;
    background: #f2f2fd;
    box-shadow: 0px 4px 14.3px 5px rgba(179, 179, 179, 0.2509803922);
    border-radius: 5px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 290px;
    overflow: hidden;
}
.freelancers .freelancer-box-wrapper .freelancer-box .info {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.freelancers .freelancer-box-wrapper .freelancer-box .info .avatar {
    background-color: #fff;
    width: 95px;
    height: 95px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.freelancers .freelancer-box-wrapper .freelancer-box .info .avatar img {
    width: 90px;
    height: 90px;
    border: 3px solid #fdcd32;
    border-radius: 50%;
}
.freelancers .freelancer-box-wrapper .freelancer-box .button a {
    width: 100%;
    display: block;
    background-color: #fdcd32;
    text-align: center;
    color: #000;
    border-radius: 8px;
}
.dark-mode .freelancers .freelancer-box {
    background: #1e2a3a;
    box-shadow: 0px 4px 14.3px 5px rgba(8, 13, 48, 0.25);
}
.dark-mode .freelancers .freelancer-box .skills span {
    color: #9e9e9e;
}
.dark-mode .freelancers .freelancer-box .excerpt p {
    color: #c9c9c9;
}
.freelancer-data-wrapper {
    border: 2px dashed #efefef;
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 50px;
    margin-top: 25px;
}
#search-show button {
    outline: 0;
    border: 0;
}
#search-show .green-btn {
    background-color: #00b09b;
    color: #fff;
    padding: 3px 25px;
    border-radius: 5px;
    font-size: 12px;
}
#search-show .yellow-btn {
    background-color: #fdcd32;
    color: #000;
    width: 100%;
    padding: 3px 0;
    border-radius: 5px;
    font-size: 12px;
}
#search-show .user-info {
    background-color: #f2f2fd;
    border-radius: 5px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 10px;
    height: 80%;
}
#search-show .user-info .avatar-wrapper {
    width: 140px;
    height: 140px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
#search-show .user-info .avatar-wrapper img {
    width: 130px;
    height: 130px;
    border: 5px solid #fdcd32;
    border-radius: 50%;
}
#search-show .products {
    min-height: 440px;
    padding: 0 20px;
    border-radius: 10px;
}
#search-show .products h6 {
    color: #101924;
    margin-bottom: 10px;
}
#search-show .products .item {
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 7px;
    border-radius: 10px;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    padding: 15px 5px;
    margin: 15px 0;
}
#search-show .products .item .icon {
    background-color: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
#search-show .products .item .icon img {
    width: 25px;
    height: 25px;
}
#search-show .products .item .title span {
    color: #fff;
    font-weight: bold;
}
#search-show .products .item .count {
    background-color: #fff;
    padding: 1px 15px;
    border-radius: 5px;
}
#search-show .products .item .count span {
    color: #4776e6;
}
#search-show .buttons a {
    background-color: #3dc3ef;
    color: #000;
    padding: 5px 50px;
    border-radius: 5px;
}
#search-show .table-tickets {
    margin-top: 50px;
}
.search-cv .bg-green {
    background-color: #00b09b;
}
.search-cv .bg-yellow {
    background-color: #fdcd32;
    color: #000;
}
.search-cv .bg-red {
    background-color: #f51010;
}
.home .head {
    width: 100%;
    min-height: 300px;
    max-height: 300px;
    padding: 90px 75px;
    position: relative;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
    border-radius: 12px;
    position: relative;
}
@media screen and (max-width: 767px) {
    .home .head {
        padding: 90px 25px;
    }
}
@media screen and (max-width: 575px) {
    .home .head {
        display: none;
    }
}
.home .head .home-default-avatar {
    position: absolute;
    top: -28px;
    right: 113px;
    width: 245px;
}
@media screen and (max-width: 992px) {
    .home .head .home-default-avatar {
        right: unset;
        left: 50px;
    }
}
@media screen and (max-width: 767px) {
    .home .head .home-default-avatar {
        left: 0;
    }
}
@media screen and (max-width: 575px) {
    .home .head .home-default-avatar {
        display: none;
    }
}
.home .head .avatar-wrapper {
    width: 265px;
    height: 265px;
    border-radius: 50%;
    background-color: #fff;
    margin-top: 25px;
    border-radius: 50%;
    position: absolute;
    top: -6px;
    right: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media screen and (max-width: 1440px) {
    .home .head .avatar-wrapper {
        right: 30px;
    }
}
@media screen and (max-width: 1200px) {
    .home .head .avatar-wrapper {
        right: 120px;
    }
}
@media screen and (max-width: 992px) {
    .home .head .avatar-wrapper {
        right: unset;
        left: 50px;
    }
}
@media screen and (max-width: 767px) {
    .home .head .avatar-wrapper {
        left: 25px;
        top: 50px;
        width: 150px;
        height: 150px;
    }
}
@media screen and (max-width: 575px) {
    .home .head .avatar-wrapper {
        display: none;
    }
}
.home .head .avatar-wrapper .home-avatar {
    border-radius: 50%;
    width: 245px;
    height: 245px;
    border: 5px solid #fdcd32;
}
@media screen and (max-width: 767px) {
    .home .head .avatar-wrapper .home-avatar {
        width: 135px;
    }
}
.home .head .logo {
    position: absolute;
    top: 0px;
    right: 0px;
}
.home .head .logo img {
    width: 100%;
}
.home .head .text {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 12px;
}
.home .head .text h4 {
    color: #000;
    font-weight: 300;
    width: 100%;
    text-align: right;
}
.home .head .text .line {
    width: 100%;
    height: 2px;
    background-color: #fff;
}
.home .head .text .bot {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.home .head .text .bot .date,
.home .head .text .bot .phone {
    color: #101924;
}
.home .head-responsive {
    width: 100%;
    position: relative;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    position: relative;
}
@media screen and (min-width: 575px) {
    .home .head-responsive {
        display: none;
    }
}
.home .head-responsive .date {
    position: absolute;
    top: 15px;
    left: 15px;
    color: #101924;
}
.home .head-responsive .logo {
    position: absolute;
    top: 0px;
    right: 0px;
}
.home .head-responsive .logo img {
    width: 100%;
}
.home .head-responsive .avatar-wrapper {
    width: 175px;
    height: 175px;
    border-radius: 50%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100;
}
.home .head-responsive .avatar-wrapper .home-avatar {
    border-radius: 50%;
    width: 150px;
    height: 150px;
    border: 5px solid #fdcd32;
}
.home .head-responsive .home-default-avatar {
    width: 200px;
}
.home .head-responsive h4 {
    margin-top: 25px;
    color: #000;
}
.home .head-responsive .line {
    width: 50%;
    height: 1px;
    background-color: #fff;
}
.home .head-responsive span {
    margin-top: 7px;
    color: #101924;
}
.home .alert-notif {
    background-color: #fff;
    padding: 15px;
    margin-top: 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.home .alert-notif .icon img {
    width: 30px;
    height: 30px;
}
.home .alert-notif span {
    color: #101924;
}
.home .content-wrapper .products {
    min-height: 440px;
    padding: 15px 20px;
    border-radius: 10px;
    background-color: #fff;
    margin-bottom: 20px;
}
.home .content-wrapper .products h6 {
    color: #101924;
    margin: 25px 0 35px 0;
}
.home .content-wrapper .products .item {
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 7px;
    border-radius: 10px;
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    padding: 15px 5px;
    margin: 15px 0;
}
.home .content-wrapper .products .item .icon {
    background-color: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.home .content-wrapper .products .item .icon img {
    width: 25px;
    height: 25px;
}
.home .content-wrapper .products .item .title span {
    color: #fff;
    font-weight: bold;
}
.home .content-wrapper .products .item .count {
    background-color: #fff;
    padding: 1px 15px;
    border-radius: 5px;
}
.home .content-wrapper .products .item .count span {
    color: #4776e6;
}
.home .content-wrapper .tickets {
    padding: 15px 20px;
    border-radius: 10px;
    background-color: #fff;
    position: relative;
    margin-bottom: 20px;
}
.home .content-wrapper .tickets .icon {
    position: absolute;
    top: 0px;
    left: 0px;
}
.home .content-wrapper .tickets h6 {
    color: #101924;
    margin: 25px 0 35px 0;
}
.home .content-wrapper .tickets .tickets-item {
    border: 2px solid #4776e6;
    border-radius: 10px;
    padding: 8px 12px;
}
.home .content-wrapper .tickets .tickets-item .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}
.home .content-wrapper .tickets .tickets-item .item:first-child {
    border-bottom: 1px solid #4776e6;
}
.home .content-wrapper .tickets .tickets-item .item .count {
    padding: 5px 12px;
    border-radius: 8px;
}
.home .content-wrapper .tickets .tickets-item .item .green {
    background-color: #00b09b;
    color: #fff;
}
.home .content-wrapper .tickets .tickets-item .item .yellow {
    background-color: #ffd200;
    color: #101924;
}
.home .content-wrapper .latest-tickets h6 {
    margin: 0 0 35px 0;
}
.home .content-wrapper .latest-tickets .tickets-item .item .count {
    padding: 0px 5px;
    border-radius: 20px;
}
.home .content-wrapper .latest-tickets .tickets-item .item .yellow {
    background-color: #ffdc67;
    color: #985c00;
}
.home .content-wrapper .latest-tickets .tickets-item .item .green {
    background-color: #a9ffae;
    color: #025f51;
}
.home .content-wrapper .latest-tickets .tickets-item .item .red {
    background-color: #ff7676;
    color: #8c0000;
}
.home .content-wrapper .user-status {
    min-height: 440px;
    padding: 15px 20px;
    border-radius: 10px;
    background-color: #fff;
    margin-bottom: 20px;
}
.home .content-wrapper .user-status h6 {
    color: #101924;
    margin: 25px 0 35px 0;
}
.home .content-wrapper .user-status .status-box {
    border: 2px solid #4776e6;
    border-radius: 10px;
    padding: 8px 12px;
}
.home .content-wrapper .user-status .status-box .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #4776e6;
}
.home .content-wrapper .user-status .status-box .item:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, 0);
}
.home .content-wrapper .user-status .status-box .item .label {
    padding: 8px 12px;
    border-radius: 10px;
}
.home .content-wrapper .user-status .status-box .item .green {
    background-color: #00b09b;
    color: #fff;
}
.home .content-wrapper .user-status .status-box .item .yellow {
    background-color: #ffd200;
    color: #101924;
}
.home .content-wrapper .user-status .status-box .item .red {
    color: #fff;
    background: linear-gradient(90deg, #f66 0%, #cc0101 100%);
}
.home .content-wrapper .user-status .status-box .item .purple {
    background-color: #7e00b0;
    color: #fff;
}
.home .coupon-wrapper {
    position: relative;
    overflow: auto;
}
.home .coupon-wrapper .icon {
    position: absolute;
    top: 18px;
    right: 0px;
}
.home .coupon-wrapper .icon img {
    width: 50px;
}
.home .coupon-wrapper .coupon {
    border-radius: 5px;
    background: linear-gradient(180deg, #ffd200 -27.43%, #f7971e 115.97%);
    min-height: 200px;
    margin-top: 25px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding: 0 45px 0 25px;
}
@media screen and (max-width: 733px) {
    .home .coupon-wrapper .coupon {
        justify-content: center;
        gap: 40px;
        padding: 50px 45px 50px 25px;
    }
}
.home .coupon-wrapper .coupon .description .title {
    color: #000;
    font-weight: 900;
    border-bottom: 1px solid #fff;
    padding-bottom: 5px;
    margin-bottom: 25px;
}
@media screen and (max-width: 733px) {
    .home .coupon-wrapper .coupon .description .title {
        text-align: center;
    }
}
.home .coupon-wrapper .coupon .description .coupon-text span {
    color: #101924;
}
.home .coupon-wrapper .coupon .description .coupon-text .coupon-code {
    background-color: #fff;
    padding: 4px 7px;
    margin: 0 3px;
    border-radius: 5px;
}
.home .coupon-wrapper .coupon .description .coupon-duration {
    margin-top: 12px;
}
.home .coupon-wrapper .coupon .description .coupon-duration span {
    color: #101924;
}
@media screen and (max-width: 733px) {
    .home .coupon-wrapper .coupon .description .coupon-duration {
        display: flex;
        justify-content: center;
        align-items: center;
    }
}
.home .coupon-wrapper .coupon .thumbnail {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 7px;
}
.home .coupon-wrapper .coupon .thumbnail img {
    width: 200px;
    border-radius: 8px;
}
.home .coupon-wrapper .coupon .thumbnail .product-detail {
    background-color: #fff;
    color: #000;
    padding: 5px 0;
    display: block;
    width: 100%;
    border-radius: 10px;
    text-align: center;
}
.nk-calendar {
    font-family: var(--bs-font-sans-serif);
}
.calendar-wrap {
    margin-bottom: 1rem;
}
.calendar-wrap .datepicker-plot-area .datepicker-day-view .table-days td:hover,
.calendar-wrap .datepicker-plot-area .datepicker-month-view .month-item:hover,
.calendar-wrap .datepicker-plot-area .datepicker-year-view .year-item:hover {
    background-color: rgba(0, 0, 0, 0) !important;
}
.nk-calendar-inline {
    width: 100%;
    min-height: 280px;
}
.calendar-info-title {
    margin-bottom: 0.75rem;
}
.calendar-info-title .title {
    font-size: 0.875rem;
    font-weight: 500;
    color: #364a63;
}
.nk-calendar-notes {
    margin-bottom: 1rem;
}
.calendar-note {
    display: flex;
    align-items: flex-start;
    padding: 1rem;
    border-radius: 0.375rem;
    background-color: #f5f6fa;
}
.note-success {
    border-left: 3px solid #1ee0ac;
}
.note-icon {
    flex-shrink: 0;
    margin-left: 0.75rem;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: rgba(30, 224, 172, 0.1);
    color: #1ee0ac;
    display: flex;
    align-items: center;
    justify-content: center;
}
.note-text {
    flex-grow: 1;
}
.note-text p {
    margin-bottom: 0.25rem;
    font-size: 0.875rem;
    color: #526484;
}
.calendar-events {
    position: relative;
}
.calendar-events .discount-img {
    position: absolute;
    top: -8px;
    left: -15px;
}
.calendar-events .discount-img img {
    width: 50px;
}
.calendar-event-list {
    margin-top: 0.5rem;
}
.calendar-event-item {
    display: flex;
    align-items: center;
    padding: 0.75rem 0;
}
.event-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-left: 0.75rem;
}
.event-content {
    flex-grow: 1;
}
.event-title {
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.25rem;
    color: #364a63;
}
.event-time {
    font-size: 0.75rem;
    color: #8094ae;
}
.datepicker-plot-area {
    font-family: var(--bs-font-sans-serif) !important;
    box-shadow: 0 0.125rem 0.25rem rgba(43, 55, 72, 0.15) !important;
    border-radius: 0.375rem !important;
    padding: 0.5rem !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td,
.datepicker-plot-area .datepicker-month-view .month-item,
.datepicker-plot-area .datepicker-year-view .year-item {
    font-size: 0.875rem !important;
    transition: all 0.3s ease !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td:hover,
.datepicker-plot-area .datepicker-month-view .month-item:hover,
.datepicker-plot-area .datepicker-year-view .year-item:hover {
    background-color: #ebedf2 !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td.selected span,
.datepicker-plot-area .datepicker-month-view .month-item.selected,
.datepicker-plot-area .datepicker-year-view .year-item.selected {
    background-color: #6576ff !important;
    color: #fff !important;
    text-shadow: none !important;
    border-radius: 50% !important;
}
.datepicker-plot-area .datepicker-day-view .table-days td span {
    width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
}
.datepicker-plot-area .datepicker-navigator {
    padding: 0.5rem !important;
}
.datepicker-plot-area .datepicker-navigator .pwt-btn-switch {
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #364a63 !important;
}
.datepicker-plot-area .datepicker-navigator .pwt-btn-prev,
.datepicker-plot-area .datepicker-navigator .pwt-btn-next {
    color: #6576ff !important;
}
@media (max-width: 767.98px) {
    .nk-calendar-inline {
        min-height: 240px;
    }
    .calendar-note {
        padding: 0.75rem;
    }
    .note-icon {
        width: 28px;
        height: 28px;
    }
}
@media (max-width: 575.98px) {
    .nk-calendar-inline {
        min-height: 220px;
    }
    .calendar-event-item {
        padding: 0.5rem 0;
    }
}
.profile-banner {
    position: relative;
    width: 100%;
    margin-bottom: 2rem;
    border-radius: 1rem;
    overflow: hidden;
    background: url(/img/Login/header-admin.png);
    background-size: cover;
}
.profile-banner .profile-name,
.profile-banner .detail-label {
    color: #212e3f;
}
.profile-banner .profile-greeting,
.profile-banner .detail-value {
    color: #364a63;
}
.profile-banner .detail-icon {
    background-color: rgba(54, 74, 99, 0.3215686275);
}
.profile-banner-wrap {
    position: relative;
    min-height: 220px;
}
.profile-banner-pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
}
.profile-banner-content {
    position: relative;
    display: flex;
    align-items: center;
    padding: 2rem 1rem;
    z-index: 3;
}
.profile-avatar {
    flex-shrink: 0;
    margin-left: 2rem;
}
.avatar-frame {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 4px solid rgba(255, 255, 255, 0.8);
    overflow: hidden;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    background-color: #fff;
}
.avatar-frame img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.profile-info {
    flex-grow: 1;
    color: #fff;
}
.profile-welcome {
    margin-bottom: 1.5rem;
}
.profile-name {
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.profile-greeting {
    font-size: 1rem;
    opacity: 0.9;
    margin-bottom: 0;
}
.profile-details {
    display: flex;
    flex-wrap: wrap;
}
.profile-detail-item {
    display: flex;
    align-items: center;
    margin-left: 2rem;
    margin-bottom: 0.5rem;
}
.detail-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.75rem;
}
.detail-icon .icon {
    font-size: 1.25rem;
    color: #fff;
}
.detail-content {
    display: flex;
    flex-direction: column;
}
.detail-label {
    font-size: 0.75rem;
    opacity: 0.8;
}
.detail-value {
    font-size: 0.9375rem;
    font-weight: 500;
}
@media (max-width: 767.98px) {
    .profile-banner-content {
        flex-direction: column;
        text-align: center;
        padding: 2rem 1rem;
    }
    .profile-avatar {
        margin-left: 0;
        margin-bottom: 1.5rem;
    }
    .profile-details {
        justify-content: center;
    }
    .profile-detail-item:last-child {
        margin-left: 0;
    }
}
@media (max-width: 575.98px) {
    .avatar-frame {
        width: 100px;
        height: 100px;
    }
    .profile-name {
        font-size: 1.5rem;
    }
    .profile-detail-item {
        margin-left: 1rem;
    }
}
.todo-widget {
    font-family: var(--bs-font-sans-serif);
}
.todo-add-form {
    margin-bottom: 1rem;
}
.todo-list {
    max-height: 320px;
    overflow-y: auto;
}
.todo-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-radius: 0.375rem;
    margin-bottom: 0.5rem;
    background-color: #f5f6fa;
    transition: all 0.3s ease;
}
.todo-item:hover {
    background-color: #ebedf2;
    transform: translateX(5px);
}
.todo-item .custom-control-label {
    display: flex;
    align-items: center;
    cursor: pointer;
}
.todo-text {
    margin-right: 0.5rem;
}
.todo-item .badge {
    margin-right: 0.75rem;
    font-size: 0.7rem;
    padding: 0.25rem 0.5rem;
}
.gradient-danger {
    background: linear-gradient(45deg, #e85347, #ff8e7b);
    color: #fff;
}
.gradient-warning {
    background: linear-gradient(45deg, #f4bd0e, #ffd861);
    color: #fff;
}
.gradient-info {
    background: linear-gradient(45deg, #09c2de, #74e0f0);
    color: #fff;
}
.gradient-success {
    background: linear-gradient(45deg, #1ee0ac, #8fecd3);
    color: #fff;
}
.gradient-primary {
    background: linear-gradient(45deg, #6576ff, #9fa8ff);
    color: #fff;
}
.gradient-purple {
    background: linear-gradient(45deg, #854fff, #b599ff);
    color: #fff;
}
.quick-nav-grid {
    padding: 0.5rem;
}
.quick-nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    transition: all 0.3s ease;
}
.quick-nav-item:hover {
    transform: translateY(-5px);
}
.btn-xl {
    width: 70px;
    height: 70px;
}
.fs-24px {
    font-size: 24px;
}
.quick-nav-text {
    font-size: 0.875rem;
    color: #526484;
    margin-top: 0.5rem;
    text-align: center;
}
.featured-nav-item {
    position: relative;
    transform: scale(1);
    transition: all 0.3s ease;
}
.featured-nav-item:hover {
    transform: scale(1.05);
}
.featured-btn-icon {
    position: relative;
    border: 2px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}
.featured-nav-item:hover .featured-btn-icon {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
.quick-nav-badge {
    position: absolute;
    top: 0;
    right: 0;
    background: linear-gradient(45deg, #f4bd0e, #f0c418);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    transform: translate(30%, -30%);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    z-index: 1;
}
.featured-section {
    padding: 0.5rem;
}
.featured-section-header {
    margin-bottom: 1.5rem;
    text-align: center;
}
.featured-section-title .title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.5rem;
}
.featured-section-title .subtitle {
    font-size: 0.875rem;
    color: #526484;
    margin-bottom: 0;
}
.featured-card {
    display: flex;
    background-color: #f5f6fa;
    border-radius: 0.5rem;
    padding: 1.5rem;
    height: 100%;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}
.featured-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.1),
        rgba(255, 255, 255, 0)
    );
    z-index: 1;
}
.cv-card {
    border-left: 4px solid #e85347;
}
.portfolio-card {
    border-left: 4px solid #854fff;
}
@media screen and (max-width: 768px) {
    .portfolio-title h6 {
        font-size: 12px;
    }
}
.featured-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(43, 55, 72, 0.1);
}
.featured-card-icon {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 1.25rem;
    font-size: 1.75rem;
}
.cv-card .featured-card-icon {
    background-color: rgba(232, 83, 71, 0.1);
    color: #e85347;
}
.portfolio-card .featured-card-icon {
    background-color: rgba(133, 79, 255, 0.1);
    color: #854fff;
}
.featured-card-content {
    flex-grow: 1;
}
.featured-card-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.5rem;
}
.featured-card-text {
    font-size: 0.875rem;
    color: #526484;
    margin-bottom: 1rem;
}
.featured-card-action {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.btn-outline-purple {
    color: #854fff;
    border-color: #854fff;
}
.btn-outline-purple:hover {
    background-color: #854fff;
    color: #fff;
}
.btn-outline-gray {
    color: #6e82a5;
    border-color: #6e82a5;
}
.btn-outline-gray:hover {
    background-color: #6e82a5;
    color: #fff;
}
@media (max-width: 767.98px) {
    .featured-card {
        flex-direction: column;
        text-align: center;
    }
    .featured-card-icon {
        margin-left: 0;
        margin-bottom: 1rem;
        margin-right: auto;
        margin-left: auto;
    }
    .featured-card-action {
        justify-content: center;
    }
}
@media (max-width: 575.98px) {
    .featured-section-title .title {
        font-size: 1.125rem;
    }
    .featured-card {
        padding: 1rem;
    }
    .featured-card-title {
        font-size: 1rem;
    }
}
.activity-chart-container {
    height: 350px;
}
.activity-chart {
    width: 100%;
    height: 100%;
}
@media (max-width: 767.98px) {
    .quick-nav-icon {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }
    .quick-nav-text {
        font-size: 0.75rem;
    }
    .calendar-date {
        width: 1.75rem;
        height: 1.75rem;
        font-size: 0.75rem;
    }
    .btn-xl {
        width: 60px;
        height: 60px;
    }
    .fs-24px {
        font-size: 20px;
    }
    .activity-chart-container {
        height: 250px;
    }
}
@media (max-width: 575.98px) {
    .btn-xl {
        width: 50px;
        height: 50px;
    }
    .fs-24px {
        font-size: 18px;
    }
    .quick-nav-text {
        font-size: 0.75rem;
    }
}
.skill-badge {
    font-size: 12px;
    padding: 2px 7px;
}
.slider-section {
    padding: 0.5rem;
}
.slider-section-header {
    margin-bottom: 1.5rem;
    text-align: center;
}
.slider-section-title .title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.5rem;
}
.slider-section-title .subtitle {
    font-size: 0.875rem;
    color: #526484;
    margin-bottom: 0;
}
.portfolio-slider-container {
    position: relative;
    padding: 0 1.5rem;
}
.portfolio-slider {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    margin: 0 -0.75rem;
}
.portfolio-slider-item {
    width: 50%;
    flex: 0 0 50%;
    padding: 0 0.75rem;
    transition: all 0.3s ease;
}
.portfolio-card {
    background-color: #fff;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(43, 55, 72, 0.1);
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
}
.portfolio-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(43, 55, 72, 0.15);
}
.portfolio-card::before,
.cv-card::before {
    z-index: 0;
}
.portfolio-card-image {
    position: relative;
    overflow: hidden;
    height: 0;
    padding-bottom: 60%;
}
.portfolio-card-image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.portfolio-card:hover .portfolio-card-image img {
    transform: scale(1.05);
}
.portfolio-card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.portfolio-card:hover .portfolio-card-overlay {
    opacity: 1;
}
.portfolio-card-content {
    padding: 1.25rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}
.portfolio-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.75rem;
    line-height: 1.4;
}
.portfolio-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
}
.portfolio-card-user {
    display: flex;
    align-items: center;
}
.portfolio-card-user img {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    -o-object-fit: cover;
    object-fit: cover;
    margin-left: 0.5rem;
}
.portfolio-card-user span {
    font-size: 0.875rem;
    color: #526484;
}
.portfolio-card-category {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}
.freelancer-slider-container {
    position: relative;
}
.freelancer-slider {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    margin: 0 -0.75rem;
}
.freelancer-slider-item {
    padding: 0 0.75rem;
    transition: all 0.3s ease;
}
.freelancer-card {
    background-color: #fff;
    border-radius: 0.5rem;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(43, 55, 72, 0.1);
    transition: all 0.3s ease;
    padding: 1.5rem;
    text-align: center;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.freelancer-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(43, 55, 72, 0.15);
}
.freelancer-card-avatar {
    width: 70%;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 1rem;
    border: 3px solid #f5f6fa;
    box-shadow: 0 0 0 3px rgba(133, 79, 255, 0.1);
}
.freelancer-card-avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
.freelancer-card-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.freelancer-card-name {
    font-size: 1rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.25rem;
}
.freelancer-card-title {
    font-size: 0.875rem;
    color: #8094ae;
    margin-bottom: 0.75rem;
}
.freelancer-card-skills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.25rem;
    margin-bottom: 1rem;
}
.freelancer-card-action {
    margin-top: auto;
}
.slider-arrows {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    z-index: 10;
}
.slider-arrow {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background-color: #fff;
    border: none;
    box-shadow: 0 3px 10px rgba(43, 55, 72, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    pointer-events: auto;
    transition: all 0.3s ease;
}
.slider-arrow:hover {
    background-color: #854fff;
    color: #fff;
}
.slider-arrow-prev {
    margin-right: -1.25rem;
}
.slider-arrow-next {
    margin-left: -1.25rem;
}
@media (max-width: 767.98px) {
    .slider-arrow {
        width: 2rem;
        height: 2rem;
    }
}
@media (max-width: 575.98px) {
    .slider-section-title .title {
        font-size: 1.125rem;
    }
    .portfolio-card-meta {
        flex-direction: column;
        align-items: flex-start;
    }
    .portfolio-card-category {
        margin-top: 0.5rem;
    }
}
.citizen-progress {
    padding: 0.5rem;
}
.citizen-progress-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}
.citizen-progress-title .title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.5rem;
}
.citizen-progress-title .subtitle {
    font-size: 0.875rem;
    color: #526484;
    margin-bottom: 0;
}
.citizen-progress-status .badge {
    font-size: 0.75rem;
    padding: 0.5rem 0.75rem;
    font-weight: 500;
}
.citizen-progress-bar {
    margin-bottom: 2rem;
}
.citizen-progress-bar .progress {
    height: 1rem;
    border-radius: 0.5rem;
    background-color: #ebeef2;
    margin-bottom: 0.5rem;
}
.citizen-progress-bar .progress-bar {
    border-radius: 0.5rem;
    text-align: right;
    padding-right: 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    transition: width 0.6s ease;
}
.citizen-progress-steps {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -0.75rem 2rem;
}
.citizen-progress-step {
    width: 33.333%;
    padding: 0 0.75rem;
    margin-bottom: 1.5rem;
    opacity: 0.6;
    transition: all 0.3s ease;
}
.citizen-progress-step.completed {
    opacity: 1;
}
.citizen-progress-step.next {
    opacity: 0.8;
}
.citizen-progress-step-icon {
    margin-bottom: 0.75rem;
}
.citizen-progress-step-icon .icon-circle {
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    background-color: #f5f6fa;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    color: #8094ae;
    font-size: 1.5rem;
    transition: all 0.3s ease;
}
.citizen-progress-step.completed .icon-circle {
    background-color: rgba(6, 174, 86, 0.1);
    color: #06ae56;
}
.citizen-progress-step.next .icon-circle {
    background-color: rgba(9, 113, 241, 0.1);
    color: #0971f1;
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(9, 113, 241, 0.4);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(9, 113, 241, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(9, 113, 241, 0);
    }
}
.citizen-progress-step-content {
    text-align: center;
}
.citizen-progress-step-content .step-title {
    font-size: 0.875rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.25rem;
}
.citizen-progress-step-content .step-desc {
    font-size: 0.75rem;
    color: #8094ae;
    margin-bottom: 0;
}
.citizen-progress-next {
    background-color: #f5f6fa;
    border-radius: 0.5rem;
    padding: 1.5rem;
}
.citizen-progress-next-header {
    margin-bottom: 1rem;
}
.citizen-progress-next-header .next-title {
    font-size: 1rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0;
}
.next-step-card {
    display: flex;
    align-items: center;
    background-color: #fff;
    border-radius: 0.5rem;
    padding: 1.25rem;
    box-shadow: 0 3px 10px rgba(43, 55, 72, 0.1);
}
.next-step-icon {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background-color: rgba(9, 113, 241, 0.1);
    color: #0971f1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-left: 1.25rem;
    flex-shrink: 0;
    animation: pulse 2s infinite;
}
.next-step-info {
    flex-grow: 1;
}
.next-step-title {
    font-size: 0.875rem;
    font-weight: 700;
    color: #364a63;
    margin-bottom: 0.25rem;
}
.next-step-desc {
    font-size: 0.75rem;
    color: #8094ae;
    margin-bottom: 0;
}
.next-step-action {
    margin-right: 1.25rem;
    flex-shrink: 0;
}
.badge-circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media (max-width: 991.98px) {
    .citizen-progress-step {
        width: 50%;
    }
}
@media (max-width: 767.98px) {
    .citizen-progress-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .citizen-progress-status {
        margin-top: 0.5rem;
    }
    .next-step-card {
        flex-direction: column;
        text-align: center;
    }
    .next-step-icon {
        margin-left: 0;
        margin-bottom: 1rem;
    }
    .next-step-info {
        margin-bottom: 1rem;
    }
    .next-step-action {
        margin-right: 0;
    }
}
@media (max-width: 575.98px) {
    .citizen-progress-step {
        width: 100%;
    }
    .citizen-progress-bar .progress-bar {
        padding-right: 0.5rem;
        font-size: 0.675rem;
    }
}
.progress-width-0 {
    width: 0%;
}
.progress-width-1 {
    width: 1%;
}
.progress-width-2 {
    width: 2%;
}
.progress-width-3 {
    width: 3%;
}
.progress-width-4 {
    width: 4%;
}
.progress-width-5 {
    width: 5%;
}
.progress-width-6 {
    width: 6%;
}
.progress-width-7 {
    width: 7%;
}
.progress-width-8 {
    width: 8%;
}
.progress-width-9 {
    width: 9%;
}
.progress-width-10 {
    width: 10%;
}
.progress-width-11 {
    width: 11%;
}
.progress-width-12 {
    width: 12%;
}
.progress-width-13 {
    width: 13%;
}
.progress-width-14 {
    width: 14%;
}
.progress-width-15 {
    width: 15%;
}
.progress-width-16 {
    width: 16%;
}
.progress-width-17 {
    width: 17%;
}
.progress-width-18 {
    width: 18%;
}
.progress-width-19 {
    width: 19%;
}
.progress-width-20 {
    width: 20%;
}
.progress-width-21 {
    width: 21%;
}
.progress-width-22 {
    width: 22%;
}
.progress-width-23 {
    width: 23%;
}
.progress-width-24 {
    width: 24%;
}
.progress-width-25 {
    width: 25%;
}
.progress-width-26 {
    width: 26%;
}
.progress-width-27 {
    width: 27%;
}
.progress-width-28 {
    width: 28%;
}
.progress-width-29 {
    width: 29%;
}
.progress-width-30 {
    width: 30%;
}
.progress-width-31 {
    width: 31%;
}
.progress-width-32 {
    width: 32%;
}
.progress-width-33 {
    width: 33%;
}
.progress-width-34 {
    width: 34%;
}
.progress-width-35 {
    width: 35%;
}
.progress-width-36 {
    width: 36%;
}
.progress-width-37 {
    width: 37%;
}
.progress-width-38 {
    width: 38%;
}
.progress-width-39 {
    width: 39%;
}
.progress-width-40 {
    width: 40%;
}
.progress-width-41 {
    width: 41%;
}
.progress-width-42 {
    width: 42%;
}
.progress-width-43 {
    width: 43%;
}
.progress-width-44 {
    width: 44%;
}
.progress-width-45 {
    width: 45%;
}
.progress-width-46 {
    width: 46%;
}
.progress-width-47 {
    width: 47%;
}
.progress-width-48 {
    width: 48%;
}
.progress-width-49 {
    width: 49%;
}
.progress-width-50 {
    width: 50%;
}
.progress-width-51 {
    width: 51%;
}
.progress-width-52 {
    width: 52%;
}
.progress-width-53 {
    width: 53%;
}
.progress-width-54 {
    width: 54%;
}
.progress-width-55 {
    width: 55%;
}
.progress-width-56 {
    width: 56%;
}
.progress-width-57 {
    width: 57%;
}
.progress-width-58 {
    width: 58%;
}
.progress-width-59 {
    width: 59%;
}
.progress-width-60 {
    width: 60%;
}
.progress-width-61 {
    width: 61%;
}
.progress-width-62 {
    width: 62%;
}
.progress-width-63 {
    width: 63%;
}
.progress-width-64 {
    width: 64%;
}
.progress-width-65 {
    width: 65%;
}
.progress-width-66 {
    width: 66%;
}
.progress-width-67 {
    width: 67%;
}
.progress-width-68 {
    width: 68%;
}
.progress-width-69 {
    width: 69%;
}
.progress-width-70 {
    width: 70%;
}
.progress-width-71 {
    width: 71%;
}
.progress-width-72 {
    width: 72%;
}
.progress-width-73 {
    width: 73%;
}
.progress-width-74 {
    width: 74%;
}
.progress-width-75 {
    width: 75%;
}
.progress-width-76 {
    width: 76%;
}
.progress-width-77 {
    width: 77%;
}
.progress-width-78 {
    width: 78%;
}
.progress-width-79 {
    width: 79%;
}
.progress-width-80 {
    width: 80%;
}
.progress-width-81 {
    width: 81%;
}
.progress-width-82 {
    width: 82%;
}
.progress-width-83 {
    width: 83%;
}
.progress-width-84 {
    width: 84%;
}
.progress-width-85 {
    width: 85%;
}
.progress-width-86 {
    width: 86%;
}
.progress-width-87 {
    width: 87%;
}
.progress-width-88 {
    width: 88%;
}
.progress-width-89 {
    width: 89%;
}
.progress-width-90 {
    width: 90%;
}
.progress-width-91 {
    width: 91%;
}
.progress-width-92 {
    width: 92%;
}
.progress-width-93 {
    width: 93%;
}
.progress-width-94 {
    width: 94%;
}
.progress-width-95 {
    width: 95%;
}
.progress-width-96 {
    width: 96%;
}
.progress-width-97 {
    width: 97%;
}
.progress-width-98 {
    width: 98%;
}
.progress-width-99 {
    width: 99%;
}
.progress-width-100 {
    width: 100%;
}
.dark-mode .home .alert-notif {
    background-color: #18212d;
}
.dark-mode .home .alert-notif span {
    color: #abbbd7;
}
.dark-mode .home .content-wrapper .products,
.dark-mode .home .content-wrapper .tickets,
.dark-mode .home .content-wrapper .lastest-tickets,
.dark-mode .home .content-wrapper .user-status {
    background-color: #18212d;
}
.dark-mode .home .content-wrapper .products h6,
.dark-mode .home .content-wrapper .tickets h6,
.dark-mode .home .content-wrapper .lastest-tickets h6,
.dark-mode .home .content-wrapper .user-status h6 {
    color: #f5f5f5;
}
.card-bordered.card-full {
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease;
}
.card-bordered.card-full:hover {
    transform: translateY(-5px);
}
.card-bg-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    pointer-events: none;
}
.card-bg-svg {
    position: absolute;
    top: 86px;
    right: 77px;
    width: 100%;
    height: 100%;
    filter: blur(40px);
}
.shape {
    transform-origin: center;
    animation-duration: 15s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}
.shape-1 {
    animation-name: float-shape-1;
}
.shape-2 {
    animation-name: float-shape-2;
    animation-delay: 0.5s;
}
.shape-3 {
    animation-name: float-shape-3;
    animation-delay: 1s;
}
@keyframes float-shape-1 {
    0% {
        transform: translate(0, 0);
    }
    25% {
        transform: translate(20px, -15px);
    }
    50% {
        transform: translate(0, -30px);
    }
    75% {
        transform: translate(-20px, -15px);
    }
    100% {
        transform: translate(0, 0);
    }
}
@keyframes float-shape-2 {
    0% {
        transform: translate(0, 0);
    }
    25% {
        transform: translate(-15px, 10px);
    }
    50% {
        transform: translate(-30px, 0);
    }
    75% {
        transform: translate(-15px, -10px);
    }
    100% {
        transform: translate(0, 0);
    }
}
@keyframes float-shape-3 {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    25% {
        transform: translate(10px, 10px) rotate(5deg);
    }
    50% {
        transform: translate(20px, 0) rotate(10deg);
    }
    75% {
        transform: translate(10px, -10px) rotate(5deg);
    }
    100% {
        transform: translate(0, 0) rotate(0deg);
    }
}
.dark-mode .home .alert-notif {
    background-color: #18212d;
}
.dark-mode .home .alert-notif span {
    color: #abbbd7;
}
.dark-mode .home .content-wrapper .products,
.dark-mode .home .content-wrapper .tickets,
.dark-mode .home .content-wrapper .lastest-tickets,
.dark-mode .home .content-wrapper .user-status {
    background-color: #18212d;
}
.dark-mode .home .content-wrapper .products h6,
.dark-mode .home .content-wrapper .tickets h6,
.dark-mode .home .content-wrapper .lastest-tickets h6,
.dark-mode .home .content-wrapper .user-status h6 {
    color: #f5f5f5;
}
.dark-mode .calendar-note,
.dark-mode .featured-card {
    background-color: #101924;
}
.dark-mode .title {
    color: #8094ae;
}
.dark-mode .citizen-progress-next {
    background-color: #101924;
}
.dark-mode .citizen-progress-next .next-step-card {
    background-color: #18212d;
}
.dark-mode .citizen-progress-next .next-title {
    color: #8094ae;
}
.dark-mode .freelancer-card {
    background-color: #101924;
}
#checkout {
    width: 35%;
}
@media screen and (max-width: 1500px) {
    #checkout {
        width: 40%;
    }
}
@media screen and (max-width: 1400px) {
    #checkout {
        width: 45%;
    }
}
@media screen and (max-width: 1200px) {
    #checkout {
        width: 50%;
    }
}
@media screen and (max-width: 992px) {
    #checkout {
        width: 60%;
    }
}
@media screen and (max-width: 768px) {
    #checkout {
        width: 70%;
    }
}
@media screen and (max-width: 575px) {
    #checkout {
        width: 100%;
    }
}
#checkout .wrapper {
    background-color: #fff;
    border-radius: 35px;
}
#checkout .wrapper .desc {
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 15px;
    padding: 25px 75px;
    border-radius: 35px 35px;
}
@media screen and (max-width: 992px) {
    #checkout .wrapper .desc {
        padding: 25px 40px;
    }
}
@media screen and (max-width: 575px) {
    #checkout .wrapper .desc {
        padding: 25px 20px;
        border-radius: 0 0 25px 25px;
    }
}
#checkout .wrapper .desc h4 {
    color: #3a3c3f;
}
#checkout .wrapper .desc img {
    border-radius: 8px;
}
#checkout .wrapper .desc .price,
#checkout .wrapper .desc .original-price {
    background-color: #25d482;
    color: #fff;
    border-radius: 24px;
    width: 100%;
    padding: 10px 0;
    text-align: center;
    font-weight: bold;
}
#checkout .wrapper .desc .original-price {
    background-color: #ff4040;
    padding: 2px 0;
}
#checkout .wrapper .payment-info {
    padding: 10px 75px 35px 75px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 15px;
}
@media screen and (max-width: 992px) {
    #checkout .wrapper .payment-info {
        padding: 25px 40px;
    }
}
@media screen and (max-width: 575px) {
    #checkout .wrapper .payment-info {
        padding: 10px 20px 25px 20px;
    }
}
#checkout .wrapper .payment-info .info-field {
    display: flex;
    justify-content: space-between;
    outline: 0px;
    border: 0px;
    border-bottom: 2px solid #25d482;
    width: 100%;
    background-color: #eaecee;
    border-radius: 16px;
    padding: 12px 25px;
}
#checkout .wrapper .payment-info .info-field span {
    font-weight: bold;
}
#checkout .wrapper form {
    padding: 10px 75px 35px 75px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 15px;
}
@media screen and (max-width: 992px) {
    #checkout .wrapper form {
        padding: 25px 40px;
    }
}
@media screen and (max-width: 575px) {
    #checkout .wrapper form {
        padding: 10px 20px 25px 20px;
    }
}
#checkout .wrapper form .input-holder {
    width: 100%;
}
#checkout .wrapper form .input-holder input {
    outline: 0px;
    border: 0px;
    border-bottom: 2px solid #25d482;
    width: 100%;
    background-color: #eaecee;
    border-radius: 16px;
    padding: 12px;
}
#checkout .wrapper form .input-holder button {
    width: 100%;
    outline: 0px;
    border: 0px;
    background-color: #25d482;
    color: #fff;
    font-weight: bold;
    border-radius: 16px;
    padding: 12px;
    box-shadow: 0px 11px 15px -2px rgba(37, 212, 130, 0.4);
}
#checkout .wrapper form .pay-date-exceeded {
    color: #fff;
    border-radius: 24px;
    width: 100%;
    text-align: center;
    font-weight: bold;
    background-color: #ff4040;
    padding: 2px 0;
}
#checkout .wrapper form .warning p {
    font-size: 13px;
    text-align: justify;
    -moz-text-align-last: center;
    text-align-last: center;
}
@media screen and (max-width: 768px) {
    #checkout .wrapper form .warning p {
        font-size: 11px;
    }
}
#payment {
    width: 35%;
}
@media screen and (max-width: 1500px) {
    #payment {
        width: 40%;
    }
}
@media screen and (max-width: 1400px) {
    #payment {
        width: 45%;
    }
}
@media screen and (max-width: 1200px) {
    #payment {
        width: 50%;
    }
}
@media screen and (max-width: 992px) {
    #payment {
        width: 60%;
    }
}
@media screen and (max-width: 768px) {
    #payment {
        width: 70%;
    }
}
@media screen and (max-width: 575px) {
    #payment {
        width: 100%;
        height: 100vh;
        background-color: #fff;
    }
}
#payment .header {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 50px 50px 0 0;
    padding: 70px 0;
    gap: 15px;
}
@media screen and (max-width: 575px) {
    #payment .header {
        border-radius: 0;
    }
}
#payment .header img {
    width: 114px;
    height: 114px;
}
#payment .header h3 {
    color: #fff;
    font-weight: bold;
}
#payment .header-error {
    background: url(/img/Payment/errorbg.png);
    background-size: cover;
    background-color: #fb3f3f;
}
#payment .header-success {
    background: url(/img/Payment/successbg.png);
    background-size: cover;
    background-color: #25d381;
}
#payment .header-success span {
    color: #fff;
}
#payment .body {
    background-color: #fff;
    width: 100%;
    padding: 0 90px 30px 90px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
@media screen and (max-width: 1400px) {
    #payment .body {
        padding: 0 55px 30px 55px;
    }
}
@media screen and (max-width: 1200px) {
    #payment .body {
        padding: 0 45px 30px 45px;
    }
}
@media screen and (max-width: 992px) {
    #payment .body {
        padding: 0 35px 30px 35px;
    }
}
@media screen and (max-width: 767px) {
    #payment .body {
        padding: 0 25px 30px 25px;
    }
}
@media screen and (max-width: 575px) {
    #payment .body {
        padding: 0 10px 30px 10px;
    }
}
#payment .body .error-box {
    background-color: #eaecee;
    padding: 25px 30px;
    text-align: center;
    margin-top: 50px;
    border-radius: 10px;
    border-bottom: 1px solid red;
}
#payment .body .error-box .message {
    font-weight: bold;
    color: #3a3c3f;
}
#payment .body .price {
    margin-top: 25px;
    background-color: #25d482;
    color: #fff;
    border-radius: 24px;
    width: 100%;
    padding: 10px 0;
    text-align: center;
    font-weight: bold;
}
#payment .body .info {
    background-color: #eaecee;
    width: 100%;
    padding: 30px 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-top: 20px;
    border-radius: 15px;
    border-bottom: 3px solid #25d381;
}
#payment .body .info .highlight {
    font-size: 15px;
    font-weight: bold;
    color: #3a3c3f;
}
#payment .body .info .divider {
    width: 100%;
    height: 2px;
    background-color: #25d381;
}
#payment .body .info .user-info {
    width: 100%;
}
#payment .body .info .user-info .user-info-content {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#payment .body .info .factor-info {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#payment a {
    margin: 10px 0 10px 0;
    display: block;
    width: 80%;
    box-shadow: 0px 11px 15px -2px rgba(90, 37, 212, 0.4);
}
.error {
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 0 50px;
    background: url(/img/Error/desktop.png);
    background-size: cover;
    background-position: center;
}
@media screen and (max-width: 600px) {
    .error {
        background: url(/img/Error/mobile.png);
        background-size: cover;
        background-position: center;
    }
}
.error .status-code h1 {
    color: #d7d5e4;
    font-size: 120px;
}
@media screen and (max-width: 992px) {
    .error .status-code h1 {
        font-size: 100px;
    }
}
@media screen and (max-width: 575px) {
    .error .status-code h1 {
        font-size: 80px;
    }
}
.error .status-text h1 {
    color: #9e9bb2;
    font-size: 50px;
}
@media screen and (max-width: 992px) {
    .error .status-text h1 {
        font-size: 40px;
    }
}
@media screen and (max-width: 575px) {
    .error .status-text h1 {
        font-size: 30px;
    }
}
@media screen and (max-width: 400px) {
    .error .status-text h1 {
        font-size: 24px;
    }
}
.error .detail {
    background-color: #fff;
    border-radius: 10px;
    padding: 8px 25px;
    margin-top: 10px;
}
.error .detail p {
    color: #0c091e;
    text-align: justify;
    -moz-text-align-last: center;
    text-align-last: center;
}
.error .back {
    margin-top: 50px;
}
@media screen and (max-width: 400px) {
    .error .back {
        margin-top: 100px;
        transform: translateX(-50px);
    }
}
.error .back * {
    color: #fff;
    font-size: 40px;
}
@media screen and (max-width: 992px) {
    .error .back * {
        font-size: 30px;
    }
}
@media screen and (max-width: 575px) {
    .error .back * {
        font-size: 20px;
    }
}
@media screen and (max-width: 400px) {
    .error .back * {
        font-size: 20px;
    }
}
#stream {
    margin-top: auto;
    margin-bottom: auto;
    width: 35%;
}
@media screen and (max-width: 1500px) {
    #stream {
        margin-top: 0;
        width: 40%;
        margin-bottom: auto;
    }
}
@media screen and (max-width: 1400px) {
    #stream {
        width: 45%;
    }
}
@media screen and (max-width: 1200px) {
    #stream {
        width: 50%;
    }
}
@media screen and (max-width: 992px) {
    #stream {
        width: 60%;
    }
}
@media screen and (max-width: 768px) {
    #stream {
        width: 70%;
    }
}
@media screen and (max-width: 575px) {
    #stream {
        width: 100%;
        height: 100vh;
        background-color: #fff;
    }
}
#stream .wrapper {
    background-color: #fff;
    padding: 0 0 55px 0;
    border-radius: 35px;
}
#stream .wrapper .header-start {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 50px 50px 0 0;
    padding: 40px 0;
    gap: 0;
    background: url(/img/Login/headerbg.png);
    background-size: cover;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .header-start {
        border-radius: 0;
        background: url(/img/Login/header-bg-mob.png);
        background-size: cover;
    }
}
#stream .wrapper .header-start img {
    width: 150px;
    height: 150px;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .header-start img {
        width: 100px;
        height: 100px;
    }
}
#stream .wrapper .header-start h3 {
    color: #fff;
    font-weight: bold;
    margin: 10px 0 3px 0;
}
#stream .wrapper .header-start span {
    color: #fff;
}
#stream .wrapper .header-video {
    position: sticky;
    top: 33px;
    z-index: 999999999999;
    display: none;
    background-image: url(/img/Stream/loader.gif);
    background-repeat: no-repeat;
    background-position: center;
    background-color: #fff;
}
#stream .wrapper .header-video video {
    width: 100%;
    box-shadow: 0px 12px 27px 7px #f2f2fd;
}
#stream .wrapper .header-video video::-webkit-media-controls {
    display: none !important;
}
#stream .wrapper .title h2 {
    color: #000;
    font-size: 28px;
    background-color: #ffd200;
    display: inline;
    border-radius: 4px;
}
#stream .wrapper .title h4 {
    font-size: 18px;
    color: #364a63;
}
#stream .wrapper .photo {
    background-color: #fdce32;
    margin-top: 10px;
}
#stream .wrapper .photo img {
    max-width: 100%;
}
#stream .wrapper .main-price-number {
    text-decoration: line-through;
}
#stream .wrapper .price-box-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    padding: 10px 0 20px 0;
    margin-top: 15px;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .price-box-container {
        gap: 10px;
        padding: 0;
        margin-top: 0px;
    }
}
#stream .wrapper .price-box-container .original-price-tag {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-radius: 50px;
    padding: 8px 25px;
    width: 100%;
}
#stream .wrapper .price-box-container .original-price-tag img {
    width: 100px;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .price-box-container .original-price-tag {
        padding: 0 25px;
    }
}
#stream
    .wrapper
    .price-box-container
    .original-price-tag
    .original-price-label {
    color: #6e6e6e;
    font-weight: 500;
    font-size: 14px;
}
#stream
    .wrapper
    .price-box-container
    .original-price-tag
    .original-price-value {
    color: #6e6e6e;
    font-weight: 700;
    position: relative;
}
#stream .wrapper .price-box-container .original-price-tag .cut-line {
    position: absolute;
    top: 50%;
    right: 0;
    width: 0;
    height: 2px;
    background-color: #e94a3f;
    animation: strike-price 2.5s ease-in-out infinite;
    transform-origin: left center;
}
#stream .wrapper .price-box-container .special-offer-tag {
    width: 80%;
    background: linear-gradient(135deg, #00b05d 0%, #00965f 100%);
    border-radius: 15px;
    padding: 20px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(0, 176, 93, 0.35);
}
@media screen and (max-width: 575px) {
    #stream .wrapper .price-box-container .special-offer-tag {
        width: 90%;
        padding: 15px;
    }
}
#stream .wrapper .price-box-container .special-offer-tag:before {
    content: "";
    position: absolute;
    top: -20%;
    left: -20%;
    width: 60%;
    height: 60%;
    background: radial-gradient(
        circle,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0) 70%
    );
    border-radius: 50%;
}
#stream .wrapper .price-box-container .special-offer-tag:after {
    content: "";
    position: absolute;
    bottom: -30%;
    right: -10%;
    width: 50%;
    height: 50%;
    background: radial-gradient(
        circle,
        rgba(255, 255, 255, 0.2) 0%,
        rgba(255, 255, 255, 0) 70%
    );
    border-radius: 50%;
}
#stream .wrapper .price-box-container .special-offer-tag .offer-badge {
    position: absolute;
    top: 0;
    right: 20px;
    background-color: #e94a3f;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    padding: 5px 12px;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 3px 6px rgba(233, 74, 63, 0.3);
    z-index: 2;
}
#stream .wrapper .price-box-container .special-offer-tag .free-offer {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
}
#stream
    .wrapper
    .price-box-container
    .special-offer-tag
    .free-offer
    .free-text {
    font-size: 28px;
    font-weight: 900;
    color: #fff;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    animation: pulse-text 2s infinite;
}
@media screen and (max-width: 575px) {
    #stream
        .wrapper
        .price-box-container
        .special-offer-tag
        .free-offer
        .free-text {
        font-size: 22px;
    }
}
#stream
    .wrapper
    .price-box-container
    .special-offer-tag
    .free-offer
    .time-limited-badge {
    display: flex;
    align-items: center;
    gap: 5px;
    background-color: rgba(255, 255, 255, 0.25);
    padding: 5px 12px;
    border-radius: 50px;
}
#stream
    .wrapper
    .price-box-container
    .special-offer-tag
    .free-offer
    .time-limited-badge
    em {
    color: #fff;
}
#stream
    .wrapper
    .price-box-container
    .special-offer-tag
    .free-offer
    .time-limited-badge
    span {
    color: #fff;
    font-size: 13px;
    font-weight: 500;
}
#stream .wrapper .price-box-container .special-offer-tag .capacity-limit {
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: #fff;
    font-weight: 500;
}
#stream
    .wrapper
    .price-box-container
    .special-offer-tag
    .capacity-limit
    .capacity-number {
    background-color: #fff;
    color: #00b05d;
    font-size: 18px;
    font-weight: 900;
    padding: 2px 10px;
    border-radius: 8px;
    display: inline-block;
    animation: blink 1.5s infinite;
}
#stream .wrapper .price-box-container .special-offer-tag .sale-price {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}
#stream
    .wrapper
    .price-box-container
    .special-offer-tag
    .sale-price
    .sale-price-label {
    color: rgba(255, 255, 255, 0.8);
    font-size: 14px;
}
#stream
    .wrapper
    .price-box-container
    .special-offer-tag
    .sale-price
    .sale-price-value {
    color: #fff;
    font-size: 22px;
    font-weight: 900;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
@keyframes pulse-text {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.8;
    }
    100% {
        opacity: 1;
    }
}
@keyframes blink {
    0%,
    100% {
        box-shadow: 0 0 10px 3px rgba(255, 255, 255, 0.5);
    }
    50% {
        box-shadow: 0 0 10px 3px rgba(255, 255, 255, 0);
    }
}
@keyframes strike-price {
    0% {
        width: 0;
        opacity: 1;
    }
    50% {
        width: 170;
        opacity: 1;
    }
    90% {
        width: 170;
        opacity: 0;
    }
    100% {
        width: 0;
        opacity: 0;
    }
}
#stream .wrapper .price {
    margin-top: 20px;
    background-color: #ff4040;
    color: #fff;
    border-radius: 24px;
    width: 100%;
    padding: 5px 25px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    font-weight: bold;
    width: 50%;
    opacity: 0.7;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .price {
        width: 80%;
        margin-top: 5px;
    }
}
#stream .wrapper .onsale-price {
    margin-top: 10px;
    background-color: #25d482;
    padding: 12px 25px;
    border-radius: 8px;
    width: 80%;
    position: relative;
    box-shadow: 0 5px 15px rgba(37, 212, 130, 0.4);
    animation: pulse 2s infinite;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .onsale-price {
        width: 95%;
    }
}
@keyframes pulse {
    0% {
        box-shadow: 0 5px 15px rgba(37, 212, 130, 0.4);
    }
    50% {
        box-shadow: 0 5px 25px rgba(37, 212, 130, 0.7);
    }
    100% {
        box-shadow: 0 5px 15px rgba(37, 212, 130, 0.4);
    }
}
#stream .wrapper .onsale-price .free-tag {
    font-weight: bold;
    font-size: 1.3em;
    color: #fff;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    animation: bounce 1.5s infinite alternate;
    display: inline-block;
    margin: 0 5px;
}
@keyframes bounce {
    from {
        transform: translateY(0);
    }
    to {
        transform: translateY(-5px);
    }
}
#stream .wrapper .onsale-price .limited-text {
    display: block;
    margin-top: 5px;
    font-weight: bold;
}
#stream .wrapper .onsale-price .limited-text .capacity-number {
    font-size: 1.2em;
    font-weight: 900;
    color: #fff;
    background-color: #168340;
    padding: 2px 8px;
    border-radius: 5px;
    display: inline-block;
    margin: 0 3px;
    animation: highlight-capacity 2s infinite;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .onsale-price .limited-text {
        font-size: 12px;
    }
}
@keyframes highlight-capacity {
    0% {
        background-color: #299954;
    }
    50% {
        background-color: #37c06c;
    }
    100% {
        background-color: #299954;
    }
}
#stream .wrapper .info-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 75px 35px 75px;
    margin-top: 10px;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .info-row {
        padding: 5px 10px;
    }
}
#stream .wrapper .info-row .info-box {
    display: flex;
    align-items: center;
    background-color: #f9f9fb;
    border-radius: 10px;
    padding: 8px 15px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
    width: 48%;
    transition: transform 0.2s ease;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .info-row .info-box {
        padding: 5px;
    }
}
#stream .wrapper .info-row .info-box .icon-holder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    margin-left: 15px;
}
#stream .wrapper .info-row .info-box .content {
    display: flex;
    flex-direction: column;
}
#stream .wrapper .info-row .info-box .content .label {
    font-size: 0.85em;
    color: #8094ae;
    margin-bottom: 3px;
}
#stream .wrapper .info-row .info-box .content .value {
    font-weight: bold;
    font-size: 0.75em;
}
#stream .wrapper .info-row .info-box .content .capacity-value {
    color: #ff4040;
    font-weight: 900;
    font-size: 1.2em;
}
#stream .wrapper .info-row .capacity-box .icon {
    color: #ff4040;
}
#stream .wrapper .info-row .date-box .icon {
    color: #25d482;
}
#stream .wrapper form {
    padding: 10px 75px 35px 75px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 15px;
}
@media screen and (max-width: 992px) {
    #stream .wrapper form {
        padding: 15px 30px;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper form {
        padding: 5px 8px;
        gap: 5px;
    }
}
#stream .wrapper form.highlight-form {
    animation: form-highlight 1.5s ease;
}
@keyframes form-highlight {
    0% {
        box-shadow: 0 0 0 rgba(37, 212, 130, 0);
    }
    50% {
        box-shadow: 0 0 20px rgba(37, 212, 130, 0.5);
    }
    100% {
        box-shadow: 0 0 0 rgba(37, 212, 130, 0);
    }
}
#stream .wrapper form .input-holder {
    width: 100%;
}
#stream .wrapper form .input-holder input {
    outline: 0px;
    border: 0px;
    border-bottom: 2px solid #25d482;
    width: 100%;
    background-color: #eaecee;
    border-radius: 16px;
    padding: 12px;
    transition: border-color 0.3s ease;
}
@media screen and (max-width: 575px) {
    #stream .wrapper form .input-holder input {
        padding: 6px;
    }
}
#stream .wrapper form .input-holder input.border-red-500 {
    border-bottom: 2px solid #f43f5e;
}
#stream .wrapper form .input-holder .error-message {
    font-size: 0.875rem;
    line-height: 1.25rem;
    min-height: 10px;
}
#stream .wrapper form .input-holder button {
    width: 100%;
    outline: 0px;
    border: 0px;
    background-color: #25d482;
    border: 0px;
    color: #fff;
    font-weight: bold;
    border-radius: 16px;
    padding: 12px;
    box-shadow: 0px 11px 15px -2px rgba(37, 212, 130, 0.4);
}
#stream .wrapper form .pay-date-exceeded {
    color: #fff;
    border-radius: 24px;
    width: 100%;
    text-align: center;
    font-weight: bold;
    background-color: #ff4040;
    padding: 2px 0;
}
#stream .wrapper form .warning p {
    font-size: 13px;
    text-align: justify;
    -moz-text-align-last: center;
    text-align-last: center;
}
@media screen and (max-width: 768px) {
    #stream .wrapper form .warning p {
        font-size: 11px;
    }
}
#stream .wrapper form .pay-button {
    background-color: #25d482;
    cursor: pointer;
    color: #fff;
    font-weight: bold;
    border-radius: 16px;
    padding: 12px;
    box-shadow: 0px 11px 15px -2px rgba(37, 212, 130, 0.4);
}
#stream .wrapper form .countdown-timer {
    margin-top: 15px;
    text-align: center;
}
#stream .wrapper form .countdown-timer .timer-message {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff4040;
    font-weight: bold;
    border: 1px dashed #ff4040;
    border-radius: 10px;
    padding: 8px 15px;
    margin: 0 auto;
    background-color: rgba(255, 64, 64, 0.05);
    animation: pulse-red 1.5s infinite;
    font-size: 12px;
}
@keyframes pulse-red {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 64, 64, 0.4);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(255, 64, 64, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 64, 64, 0);
    }
}
#stream .wrapper form .countdown-timer .timer-message .icon {
    color: #ff4040;
    margin-left: 8px;
    font-size: 18px;
}
#stream .wrapper form .countdown-timer .timer-message .timer-value {
    font-size: 1.1em;
    font-weight: 900;
    margin: 0 4px;
}
#stream .wrapper .teacher {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
#stream .wrapper .teacher-title {
    font-weight: bold;
}
#stream .wrapper .teacher-info {
    margin-top: 5px;
    padding: 25px 12px 25px 0;
    border-right: 2px solid #000;
}
#stream .wrapper .teacher-photo img {
    min-width: 170px;
    max-width: 170px;
}
#stream .wrapper #accordion {
    margin: 20px 10px;
    border-radius: 10px;
}
#stream .wrapper #accordion * {
    background-color: #f9f9fb !important;
}
@media screen and (max-width: 575px) {
    #stream .wrapper #accordion h6.title {
        font-size: 12px;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper #accordion .accordion-inner p {
        font-size: 12px;
    }
}
#stream .wrapper .start-pending {
    margin-top: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
#stream .wrapper .start-pending span {
    background-color: #ffd200;
    color: #000;
    font-weight: bold;
    font-size: 20px;
    padding: 2px 0;
}
#stream .wrapper .start-pending p {
    text-align: justify;
    -moz-text-align-last: center;
    text-align-last: center;
    text-wrap: wrap;
    font-size: 16px;
    padding: 15px 40px 5px 40px;
}
#stream .wrapper .start-pending .time-remaining {
    color: #ff4040;
    text-align: center;
    border: 2px solid #ff4040;
    padding: 15px 30px;
    border-radius: 10px;
}
#stream .wrapper .start-pending .time-remaining span {
    background-color: rgba(0, 0, 0, 0);
    color: #ff4040;
    font-weight: normal;
}
#stream .wrapper .start-pre {
    margin-top: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
#stream .wrapper .start-pre span {
    font-size: 20px;
    font-weight: bold;
}
#stream .wrapper .start-pre a {
    width: 40%;
    display: flex;
    justify-content: center;
    margin-top: 15px;
}
#stream .wrapper .chats {
    position: relative;
}
#stream .wrapper .chats .messages {
    margin-top: 50px;
    padding: 0 25px;
}
#stream .wrapper .chats .messages .message-item {
    margin: 15px 0;
}
#stream .wrapper .chats .messages .message-item .owner {
    padding: 5px;
    font-weight: bold;
    margin-bottom: 3px;
}
#stream .wrapper .chats .messages .message-item .text {
    background: linear-gradient(90deg, #4776e6 0%, #8e54e9 100%);
    padding: 8px 25px;
    border-radius: 10px 0 10px 10px;
    color: #fff;
    display: inline-block;
    min-width: 100px;
    position: relative;
}
#stream .wrapper .chats .messages .message-item .time {
    margin-top: 10px;
    font-size: 12px;
    color: gray;
}
#stream .wrapper .head-bar {
    width: 100%;
    position: fixed;
    display: flex;
    justify-content: space-between;
    padding: 5px 10px;
    background-color: #fff;
    top: 0;
    z-index: 100000000000000000000000000;
    width: 35%;
    display: none;
}
@media screen and (max-width: 1500px) {
    #stream .wrapper .head-bar {
        width: 40%;
    }
}
@media screen and (max-width: 1400px) {
    #stream .wrapper .head-bar {
        width: 45%;
    }
}
@media screen and (max-width: 1200px) {
    #stream .wrapper .head-bar {
        width: 50%;
    }
}
@media screen and (max-width: 992px) {
    #stream .wrapper .head-bar {
        width: 60%;
    }
}
@media screen and (max-width: 768px) {
    #stream .wrapper .head-bar {
        width: 70%;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper .head-bar {
        width: 100%;
    }
}
#stream .wrapper .head-bar .count .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
#stream .wrapper .head-bar .count span {
    font-weight: bold;
}
#stream .wrapper .head-bar .attender {
    font-weight: bold;
}
#stream .wrapper .links {
    padding: 7px 5px 0px 5px;
    margin-bottom: 0px;
    position: fixed;
    bottom: 60px;
    z-index: 999999999;
    background-color: #fff;
    width: 35%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    box-shadow: -2px -9px 27px -4px #f2f2fd;
    display: none;
}
@media screen and (max-width: 1500px) {
    #stream .wrapper .links {
        width: 40%;
    }
}
@media screen and (max-width: 1400px) {
    #stream .wrapper .links {
        width: 45%;
    }
}
@media screen and (max-width: 1200px) {
    #stream .wrapper .links {
        width: 50%;
    }
}
@media screen and (max-width: 992px) {
    #stream .wrapper .links {
        width: 60%;
    }
}
@media screen and (max-width: 768px) {
    #stream .wrapper .links {
        width: 70%;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper .links {
        width: 100%;
    }
}
#stream .wrapper form#send-text {
    padding: 9px 5px 11px 5px;
    margin-bottom: 0px;
    position: relative;
    border-top: 2px solid rgba(0, 0, 0, 0.1019607843);
    position: fixed;
    bottom: 0;
    z-index: 999999999;
    background-color: #fff;
    width: 35%;
    display: none;
}
@media screen and (max-width: 1500px) {
    #stream .wrapper form#send-text {
        width: 40%;
    }
}
@media screen and (max-width: 1400px) {
    #stream .wrapper form#send-text {
        width: 45%;
    }
}
@media screen and (max-width: 1200px) {
    #stream .wrapper form#send-text {
        width: 50%;
    }
}
@media screen and (max-width: 992px) {
    #stream .wrapper form#send-text {
        width: 60%;
    }
}
@media screen and (max-width: 768px) {
    #stream .wrapper form#send-text {
        width: 70%;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper form#send-text {
        width: 100%;
    }
}
#stream .wrapper form#send-text input {
    width: 100%;
    border: 0;
    outline: 0;
}
#stream .wrapper form#send-text button {
    position: absolute;
    left: 15px;
    border: 0px;
    outline: 0px;
}
#stream .wrapper form#send-text button em {
    color: #25d482;
    font-size: 30px;
}
#stream .wrapper #start-body {
    display: none;
    position: relative;
}
#stream .wrapper .testimonials-section {
    padding: 20px 40px 10px 40px;
    margin-top: 20px;
}
@media screen and (max-width: 992px) {
    #stream .wrapper .testimonials-section {
        padding: 15px 30px;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper .testimonials-section {
        padding: 10px 8px;
    }
}
#stream .wrapper .testimonials-section h4 {
    color: #364a63;
    margin-bottom: 15px;
    font-weight: bold;
}
#stream .wrapper .testimonials-section .testimonial-slider {
    margin-bottom: 20px;
}
#stream .wrapper .testimonials-section .testimonial-slider .carousel-inner {
    padding-bottom: 30px;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-control-prev-icon {
    color: #000;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-control-prev,
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-control-next {
    color: #25d482;
    opacity: 0.8;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-control-prev:hover,
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-control-next:hover {
    opacity: 1;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-indicators {
    bottom: -30px;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-indicators
    button {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ddd;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .carousel-indicators
    button.active {
    background-color: #25d482;
}
#stream .wrapper .testimonials-section .testimonial-slider .testimonial-box {
    display: flex;
    background-color: #f9f9fb;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    min-height: 240px;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .testimonial-box:hover {
    transform: translateY(-5px);
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1);
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .testimonial-box
    .icon-holder {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 5px 10px 0 0;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .testimonial-box
    .icon-holder
    .icon {
    color: #25d482;
    font-size: 40px;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .testimonial-box
    .content {
    flex: 1;
    display: flex;
    flex-direction: column;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .testimonial-box
    .content
    .testimonial-text {
    margin-bottom: 10px;
    color: #526484;
    line-height: 1.6;
    text-align: justify;
}
#stream
    .wrapper
    .testimonials-section
    .testimonial-slider
    .testimonial-box
    .content
    .writer-name {
    font-weight: bold;
    color: #364a63;
    margin-top: auto;
    padding-top: 5px;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
}
#stream .wrapper .students-ticker-section {
    padding: 20px 40px 10px 40px;
    margin-top: 20px;
}
@media screen and (max-width: 992px) {
    #stream .wrapper .students-ticker-section {
        padding: 15px 30px;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper .students-ticker-section {
        padding: 10px 8px;
    }
}
#stream .wrapper .students-ticker-section h4 {
    color: #364a63;
    margin-bottom: 15px;
    font-weight: bold;
    text-align: center;
}
#stream .wrapper .students-ticker-section .students-ticker-wrapper {
    width: 100%;
    background-color: #f9f9fb;
    border-radius: 10px;
    padding: 10px;
    overflow: hidden;
    position: relative;
    height: 80px;
    direction: ltr;
}
#stream .wrapper .students-ticker-section .students-ticker-track {
    display: flex;
    width: -moz-max-content;
    width: max-content;
    animation: ticker-scroll 30s linear infinite;
    position: absolute;
    top: 10px;
}
#stream .wrapper .students-ticker-section .students-ticker-track:hover {
    animation-play-state: paused;
}
#stream .wrapper .students-ticker-section .ticker-item {
    margin: 0 10px;
    width: 60px;
    height: 60px;
}
#stream .wrapper .students-ticker-section .ticker-item img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid #25d482;
    -o-object-fit: cover;
    object-fit: cover;
    transition: transform 0.3s ease;
}
#stream .wrapper .students-ticker-section .ticker-item img:hover {
    transform: scale(1.15);
    border-color: #fdce32;
}
#stream .wrapper .students-ticker-section .ticker-item img.active {
    border-color: #ff4040;
    transform: scale(1.1);
}
@keyframes ticker-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}
#stream .wrapper .features-banner-section {
    padding: 20px 40px 10px 40px;
    margin-top: 15px;
}
@media screen and (max-width: 992px) {
    #stream .wrapper .features-banner-section {
        padding: 15px 30px;
    }
}
@media screen and (max-width: 575px) {
    #stream .wrapper .features-banner-section {
        padding: 10px 8px;
    }
}
#stream .wrapper .features-banner-section .features-banner {
    background: linear-gradient(135deg, #f7f7fb 0%, #eaeaf3 100%);
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
}
#stream .wrapper .features-banner-section .features-banner:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 150px;
    height: 150px;
    background: linear-gradient(
        225deg,
        rgba(37, 212, 130, 0.15) 0%,
        rgba(37, 212, 130, 0) 70%
    );
    border-radius: 0 0 0 150px;
    z-index: 1;
}
#stream .wrapper .features-banner-section .features-banner:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100px;
    height: 100px;
    background: linear-gradient(
        45deg,
        rgba(233, 74, 63, 0.1) 0%,
        rgba(233, 74, 63, 0) 70%
    );
    border-radius: 0 100px 0 0;
    z-index: 1;
}
#stream .wrapper .features-banner-section .features-banner .features-header {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    position: relative;
    z-index: 2;
}
#stream .wrapper .features-banner-section .features-banner .features-header h4 {
    font-size: 20px;
    font-weight: bold;
    color: #364a63;
    margin: 0 10px 0 0;
}
@media screen and (max-width: 575px) {
    #stream
        .wrapper
        .features-banner-section
        .features-banner
        .features-header
        h4 {
        font-size: 16px;
    }
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-header
    .header-icon {
    width: 40px;
    height: 40px;
    background-color: #ffd200;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-header
    .header-icon
    em {
    font-size: 20px;
    color: #364a63;
}
@media screen and (max-width: 575px) {
    #stream
        .wrapper
        .features-banner-section
        .features-banner
        .features-header
        .header-icon {
        width: 32px;
        height: 32px;
    }
    #stream
        .wrapper
        .features-banner-section
        .features-banner
        .features-header
        .header-icon
        em {
        font-size: 16px;
    }
}
#stream .wrapper .features-banner-section .features-banner .features-list {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
@media screen and (max-width: 575px) {
    #stream .wrapper .features-banner-section .features-banner .features-list {
        gap: 10px;
    }
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-list
    .feature-item {
    display: flex;
    align-items: center;
    gap: 15px;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 12px 15px;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.03);
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-list
    .feature-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 575px) {
    #stream
        .wrapper
        .features-banner-section
        .features-banner
        .features-list
        .feature-item {
        padding: 8px 12px;
        gap: 10px;
    }
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-list
    .feature-item
    .feature-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-list
    .feature-item
    .feature-icon
    em {
    font-size: 22px;
}
@media screen and (max-width: 575px) {
    #stream
        .wrapper
        .features-banner-section
        .features-banner
        .features-list
        .feature-item
        .feature-icon
        em {
        font-size: 18px;
    }
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-list
    .feature-item
    .feature-text {
    flex-grow: 1;
}
#stream
    .wrapper
    .features-banner-section
    .features-banner
    .features-list
    .feature-item
    .feature-text
    span {
    font-size: 16px;
    color: #526484;
    font-weight: 500;
    line-height: 1.5;
}
@media screen and (max-width: 575px) {
    #stream
        .wrapper
        .features-banner-section
        .features-banner
        .features-list
        .feature-item
        .feature-text
        span {
        font-size: 14px;
    }
}
#stream .ending-box-section {
    padding: 20px 40px 30px 40px;
    margin-top: 20px;
}
@media screen and (max-width: 992px) {
    #stream .ending-box-section {
        padding: 15px 30px 25px 30px;
    }
}
@media screen and (max-width: 575px) {
    #stream .ending-box-section {
        padding: 10px 8px 20px 8px;
    }
}
#stream .ending-box-section .ending-box {
    background: linear-gradient(135deg, #25d482 0%, #2bbb7f 100%);
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 10px 20px rgba(43, 187, 127, 0.25);
    text-align: center;
    position: relative;
    overflow: hidden;
}
#stream .ending-box-section .ending-box:before {
    content: "";
    position: absolute;
    top: -50px;
    right: -50px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.1);
}
#stream .ending-box-section .ending-box:after {
    content: "";
    position: absolute;
    bottom: -60px;
    left: -60px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.1);
}
#stream .ending-box-section .ending-box .ending-box-content {
    position: relative;
    z-index: 2;
}
#stream .ending-box-section .ending-box .ending-box-content h3 {
    color: #fff;
    font-size: 22px;
    margin-bottom: 15px;
    font-weight: bold;
}
@media screen and (max-width: 575px) {
    #stream .ending-box-section .ending-box .ending-box-content h3 {
        font-size: 18px;
        margin-bottom: 10px;
    }
}
#stream .ending-box-section .ending-box .ending-box-content p {
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 25px;
    font-size: 16px;
}
@media screen and (max-width: 575px) {
    #stream .ending-box-section .ending-box .ending-box-content p {
        font-size: 14px;
        margin-bottom: 20px;
    }
}
#stream
    .ending-box-section
    .ending-box
    .ending-box-content
    .scroll-to-form-btn {
    background-color: #fff;
    color: #25d482;
    border: none;
    border-radius: 50px;
    padding: 12px 32px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
#stream
    .ending-box-section
    .ending-box
    .ending-box-content
    .scroll-to-form-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
#stream
    .ending-box-section
    .ending-box
    .ending-box-content
    .scroll-to-form-btn:active {
    transform: translateY(-1px);
}
@media screen and (max-width: 575px) {
    #stream
        .ending-box-section
        .ending-box
        .ending-box-content
        .scroll-to-form-btn {
        padding: 10px 25px;
        font-size: 14px;
    }
}
#payment .body-guest {
    padding: 0 50px 30px 50px;
}
#payment .time-remaining {
    color: #ff4040;
    border: 2px solid #ff4040;
    padding: 15px 30px;
    border-radius: 10px;
}
#payment .title-stream-guest h2 {
    color: #25d482;
    font-weight: bold;
}
#payment .header-stream video {
    width: 100%;
}
jdp-container .jdp-btn-close,
jdp-container .jdp-btn-empty,
jdp-container .jdp-btn-today {
    background: #7f5be9;
}
jdp-container .jdp-day-name {
    background: #fdcd32;
}
jdp-container .jdp-day-name.selected,
jdp-container .jdp-day.selected {
    background-color: #3d5abb !important;
} /*# sourceMappingURL=theme.min.css.map */