@font-face {
    font-family: 'Gilroy';
    src: url('font/Gilroy-Regular.ttf') format('truetype');
}



* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    direction: ltr;
    font-family: "Gilroy";
}



body {
    background-color: #000000;
    /* padding: 0 20px; */
    min-height: calc(100vh - 40px);
    height: 100%;
}

button {
    cursor: pointer;
}

input:focus,
select:focus {
    outline: none;
}

.yellow_button {
    background: #F6B439;
    border-radius: 14px;
    padding: 12px;
    font-size: 18px;
    font-weight: 600;
    border: none;
}

.container {
    max-width: 1314px;
    width: 100%;
    margin: auto;
    padding-right: 20px !important;
    padding-left: 20px !important;
}

.container_fluid {
    width: 100%;
    margin: auto;
}

.main_content {
    min-height: calc(100vh - 140px);
}


.w_100 {
    width: 100% !important;
}

.w_80 {
    width: 90px !important;
}

.category_label {
    font-size: 13px;
    font-weight: 500;
    color: #F6B439;
    background: #30250A;
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
    position: absolute;
    right: 20px;
    bottom: 20px;
    padding: 8px;
    border: none;
}

/* ===================================================================================================== */
/* header */
.header_holder .header_menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 !important;
    gap: 20px;
}

.pm_box {
    padding: 21px 14px;
    background: #1D1D1D;
    border-radius: 16px;
    position: absolute;
    max-width: 317px;
    width: 100%;
    z-index: 11111111111111111;
    transform: translate(-91%, 40px);
    display: none;
}

.pm_box .title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;

}

.view_in {
    width: 100%;
    background-color: #F6B439;
    border: none;
    border-radius: 8px;
    padding: 14px;
    font-size: 14px;
    font-weight: 600;
    margin-top: 20px;
}

.header_holder {
    width: 100%;
    background-color: #111111;
    padding: 5px 35px;
    border-radius: 16px;
    margin-top: 40px;
}

.header_holder .header_menu_list {
    display: flex;
    gap: 20px;
    list-style: none;
}

.header_holder .header_menu_list li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #DCDFE3;
    gap: 10px;
    font-size: 16px;
    width: 77px;
    height: 77px;
    justify-content: center;
    position: relative;
    transition: 0.4s;
}

.header_holder .header_menu_list li a.active::after,
.message_box .buttons_holder button.active::after,
.header_holder .header_menu_list li a::after {
    content: '';
    position: absolute;
    height: 1px;
    width: 40px;
    border-radius: 8px 8px 0px 0px;
    border: 1px solid #F6B439;
    background: #F6B439;
    bottom: 0;
    display: block;
    margin: auto;
    opacity: 0;
    transition: opacity 0.6s;
}

.header_holder .header_menu_list li a.active::after,
.message_box .buttons_holder button.active::after,
.header_holder .header_menu_list li a:hover::after {
    opacity: 1;
}

.header_holder .header_menu_list li a.active svg path {
    fill: #F6B439;
}

.header_holder .header_menu_left {
    display: flex;
    gap: 16px;
    align-items: center;
}

.header_holder .header_menu_left form {
    max-width: 277px;
    width: 100%;
    border: 1px solid #1D1D1D;
    border-radius: 8px;
    height: 48px;
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 17px;
}

.header_holder .header_menu_left input {
    background-color: inherit;
    border: none;
    height: 100%;
    width: 100%;
    color: #fff;
}

.header_holder .header_menu_left input::placeholder {
    color: #fff;
    font-weight: 500;
    font-size: 14px;
}

.header_holder .header_menu_right {
    display: flex;
    align-items: center;
    gap: 22px;
    height: 77px;
}

.header_holder .header_menu_right_user_info {
    display: flex;
    gap: 10px;
    align-items: center;
    position: relative;
    height: 120%;
    cursor: pointer;
}

.header_holder .header_menu_right_user_info span {
    color: #F6F6F6;
    font-size: 14px;
    font-weight: 500;
}

.header_holder .header_menu_right_user_info img {
    width: 42px;
    height: 42px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.header_holder .header_menu_right_notification_icons {
    position: relative;
}

.header_holder .header_menu_right_notification_icons span {
    position: absolute;
    right: 3px;
    top: 1px;
    width: 7px;
    height: 7px;
    background: #FFDFA2;
    border-radius: 50%;
}

.header_holder .header_menu_right_notification_icons:first-child span {
    right: 0;
    top: -8px;
}


/* ====================================================================================================== */

/* home page */

.home_page .top_seller_holder {
    box-shadow: 1px 4px 65px 0px #0000000F;
    background-color: #111111;
    border-radius: 16px;
    padding: 19px 26px;
}

.home_page {
    padding-top: 15px;
}

.home_page .top_seller {
    display: flex;
    gap: 26px;
    align-items: center;
}

.home_page .top_seller .owl-nav {
    display: none;
}

.home_page .top_seller .owl-stage {
    display: flex;
}

.home_page .top_seller_title {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 16px;
    font-weight: 500;
    color: #F6F6F6;
    min-width: fit-content;
}

.home_page .top_seller_list {
    list-style: none;
    display: flex;
    gap: 10px;
    overflow: hidden;
}

.home_page .top_seller_list_item a {
    display: flex;
    gap: 15px;
    align-items: center;
    color: #F6F6F6;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.home_page .top_seller_list_item a:hover {
    color: #fceeaf;
}

.home_page .top_seller_list_item a:hover div {
    padding: 1px;
    background-color: #ffcf00;
}

.home_page .top_seller_list_item a div {
    width: 55px;
    height: 53px;
    background-color: #F6B439;
    transition: 0.4s;
    padding: 3px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}


.home_page .top_seller_list_item a div img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home_page .top_seller_list_item::after,
.best_seller li .pic_holder:after {
    content: attr(data-number);
    display: inline-block;
    background-color: #35180251;
    position: absolute;
    color: #F6F6F6;
    border-radius: 2px;
    padding: 3px 4px;
    bottom: 0;
    left: 40px;
    font-size: 9px;
    font-weight: 600;
    backdrop-filter: blur(4px);
}



.content {
    padding: 15px 0;
    display: flex;
    gap: 20px;
    min-height: calc(100vh - 235px);
}

.add_story_section {
    position: relative;
    background-color: #111111;
    padding: 10px 22px;
    border-radius: 16px;
}

.add_story {
    list-style: none;
}

.add_story .owl-stage {
    display: flex;
}

.add_story .owl-prev {
    display: none;
}

.add_story .owl-next {
    color: #F6F6F6 !important;
    font-size: 40px !important;
    position: absolute;
    top: -5px;
    right: -18px;
    bottom: 0;
    background-color: #111111 !important;
    height: 100%;
    width: 60px;
    background-image: url("data:image/svg+xml,%3Csvg width='7' height='14' viewBox='0 0 7 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 12.8335L6 7.00016L1 1.16683' stroke='%23F6F6F6' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.add_story .owl-nav,
.post_images .owl-nav,
.view_story.owl-nav {
    display: flex;
    margin-top: 0;
    width: 100%;
    justify-content: space-between;
    height: 0;
}

.add_story .owl-nav button span,
.post_images .owl-nav button span,
.view_story .owl-nav button span {
    display: none !important;
}


.story_list {
    list-style: none;
    display: flex;
    gap: 17px;
    overflow: hidden;
}

.story_list_item a {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    color: #F6F6F6;
    text-decoration: none;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.4s ease;
}

.story_list_item a div {
    width: 63px;
    height: 63px;
    background-color: #F6B439;
    transform: scale(1);
    padding: 3px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.story_list_item a:hover {
    transform: scale(0.85);
}

.story_list_item.seen a div {
    background-color: #1D1D1D;
}

.story_list_item a div img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.yellow_tick {
    position: relative;
}

.story_list_item.yellow_tick:before {
    content: "";
    position: absolute;
    right: 3px;
    top: 0;
    z-index: 1;
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg width='19' height='18' viewBox='0 0 19 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.14886 1.2082C8.55081 0.189627 10.4492 0.189628 11.8511 1.2082L16.6594 4.70163C18.0614 5.7202 18.648 7.52567 18.1125 9.17376L16.2759 14.8262C15.7404 16.4743 14.2046 17.5902 12.4717 17.5902H6.52832C4.79541 17.5902 3.25959 16.4743 2.72409 14.8262L0.887491 9.17376C0.351994 7.52567 0.938627 5.7202 2.34058 4.70163L7.14886 1.2082Z' fill='%23F6B439'/%3E%3Cpath d='M6.5 9.5L8.5 11.5L13.5 6.5' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.donater_info.yellow_tick::before {
    content: "";
    position: absolute;
    left: 27px;
    top: -3px;
    z-index: 1;
    width: 15px;
    height: 15px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.58448 1.54163C6.65656 0.762714 8.10826 0.762714 9.18034 1.54163L12.8573 4.21307C13.9293 4.99198 14.3779 6.37263 13.9684 7.63293L12.564 11.9554C12.1545 13.2157 10.98 14.069 9.65487 14.069H5.10995C3.78479 14.069 2.61033 13.2157 2.20083 11.9554L0.796374 7.63294C0.386876 6.37263 0.835477 4.99198 1.90756 4.21307L5.58448 1.54163Z' fill='%23F6B439'/%3E%3Cpath d='M5.08789 7.8825L6.6173 9.41191L10.4408 5.58838' stroke='%23F6F6F6' stroke-width='1.14706' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.add_your_story {
    background-color: #1D1D1D !important;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle opacity='0.5' cx='15.0382' cy='14.5382' r='12.1154' stroke='%23F6B439' stroke-width='1.81731'/%3E%3Cg filter='url(%23filter0_d_619_7190)'%3E%3Cpath d='M18.6735 14.5385L15.0389 14.5385M15.0389 14.5385L11.4043 14.5385M15.0389 14.5385L15.0389 10.9038M15.0389 14.5385L15.0389 18.173' stroke='%23F6B439' stroke-width='1.81731' stroke-linecap='round'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_619_7190' x='5.49609' y='5.99512' width='19.0859' height='19.0864' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='1'/%3E%3CfeGaussianBlur stdDeviation='2.5'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.964706 0 0 0 0 0.705882 0 0 0 0 0.223529 0 0 0 0.2 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_619_7190'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_619_7190' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E");
}

.your_mind {
    background: #111111;
    border-radius: 16px;
    padding: 10px 20px;
    margin-top: 13px;
    display: flex;
    gap: 6px;
}

.your_mind_input_holder {
    width: 100%;
    margin-top: 8px;
}

.your_mind img {
    width: 61px;
    height: 61px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.your_mind_input_holder form {
    width: 100%;
}

.your_mind_input_holder input {
    padding: 16px;
    background-color: #1D1D1D;
    border-radius: 8px;
    width: 100%;
    color: #f6f6f6;
    border: none;
}

.your_mind_input_holder input::placeholder {
    color: #a0a0a0;
    font-size: 14px;
    font-weight: 500;
}

.yout_mind_buttons_holder {
    display: flex;
    gap: 13px;
    margin-top: 13px;
}

.yout_mind_buttons_holder button {
    display: flex;
    align-items: center;
    padding: 7px 9px 7px 9px;
    border-radius: 8px;
    gap: 6px;
    background: #1D1D1D;
    border: none;
    color: #F6F6F6;
    width: 110px;
    justify-content: center;
    transition: 0.4s;
}

.yout_mind_buttons_holder button:hover {
    background: #30250A;
}



.post_info {
    background: #111111;
    border-radius: 16px;
    box-shadow: 1px 4px 65px 0px #0000000F;
    margin-top: 13px;
    padding: 18px 21px;
    height: 100%;
}

.post_info_header {
    display: flex;
    justify-content: space-between;
}

.post_info_header_user_info {
    display: flex;
    gap: 12px;
    align-items: center;
}

.post_info_header_user_info img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 54px;
    height: 54px;
}

.post_info_header_user_info .user_name {
    font-size: 14px;
    font-weight: 500;
    color: #a0a0a0;
    display: block;
    margin-bottom: 8px;
}

.post_info_header_user_info .time {
    font-size: 12px;
    font-weight: 500;
    color: #F6B439;
    margin-left: 9px;
}

.post_info_header_user_info .time::before,
.message_info .time:before,
.latest_donate_item header .time::before,
.product_page_holder .left_section .left_section_header .user_info h5 .time::before,
.posts_products_list li a .user_info h5 .time::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    display: inline-block;
    background-color: #F6B439;
    margin-right: 8px;
}

.post_info_header_user_info .name {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
}

.post_info_header .more {
    background-color: unset;
    border: none;
}

.post_info .caption {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: #c6c6c6;
    margin-top: 13px;
}

.post_info_buttons_holder {
    display: flex;
    justify-content: space-between;
    padding: 5px 12px;
    margin-top: 13px;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.post_info_buttons_left button {
    background-color: unset;
    border: none;
    padding-right: 15px;
    transition: 0.3s;
}

.post_info_buttons_left button:hover {
    transform: scale(1.1);
}

.post_info_buttons_right button:first-child {
    color: #F6F6F6;
    border: 0.5px solid #FEF8EB;
    background-color: unset;
    margin-right: 8px;
}

.post_info_buttons_right button:last-child {
    color: #000000;
    border: 0.5px solid #F6B439;
    background-color: #F6B439;
}

.post_info_buttons_right button {
    width: 107px;
    font-size: 12px;
    font-weight: 600;
    height: 30px;
    border-radius: 8px;
    transition: 0.4s;
}

.post_info_buttons_right button:hover {
    transform: scale(1.08);
}

.add_comment {
    margin-top: 13px;
    padding: 11px 14px;
    display: flex;
    gap: 6px;
    background: #1D1D1D;
    border-radius: 8px;

}

.add_comment img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 43px;
    height: 43px;
}

.add_comment form {
    width: 100%;
}

.add_comment input {
    background: #111111;
    border-radius: 8px;
    width: 100%;
    border: none;
    padding: 11px 9px;
    height: 100%;
    color: #fff;
}

.add_comment input::placeholder {
    font-size: 12px;
    font-weight: 500;
    color: #a0a0a0;
}

.comments_holder {
    box-shadow: 1px 4px 65px 0px #0000000F;
    background: #000000;
    padding: 14px;
    border-radius: 12px;
    margin-top: 12px;
    /* display: none; */
}

.comments_holder_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #1D1D1D;
    border-radius: 12px;
    padding: 8px 11px;
}

.comments_number {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 12px;
    font-weight: 600;
    color: #F6F6F6;
}

.comments_holder_header .close {
    background-color: unset;
    border: none;
    font-size: 12px;
    font-weight: 600;
    color: #F6F6F6;
    display: flex;
    align-items: center;
    gap: 6px;
}

.comment_info {
    display: flex;
    gap: 8px;
    width: 100%;
    background: #1D1D1D;
    border-radius: 12px;
    padding: 12px 10px;
    margin-top: 8px;
}

.comment_info_user_img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 37px;
    height: 37px;
}

.comment_info_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.comment_info_header .user_name {
    font-size: 12px;
    font-weight: 600;
    color: #FFFFFF;
}

.comment_info_header .time {
    font-weight: 500;
    color: #DCDFE3;
    margin-left: 14px;
}

.comment_text {
    font-size: 12px;
    font-weight: 500;
    color: #F6F6F6;
    margin-top: 8px;
}

.comment_buttons_holder {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 8px;
}

.comment_buttons_holder button {
    background-color: unset;
    border: none;
    font-size: 12px;
    font-weight: 500;
    color: #DCDFE3;
    display: flex;
    align-items: center;
    gap: 6px;
}

.comment_holder .replies {
    margin-top: 10px;
    background: #111111;
    border-radius: 6px;
    padding: 10px 15px;
}

.comments_holder .see_more {
    padding: 10px 8px;
    background: #30250A;
    border-radius: 6px;
    border: none;
    margin-top: 8px;
    color: #F6B439;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    font-weight: 500;
    transition: 0.4s;

}

.comments_holder .see_more:hover {
    transform: scale(0.9);
}

.content_middle {
    width: 50%;
    display: flex;
    flex-direction: column;
}


.content_left {
    width: 100%;
    position: sticky;
    top: 10px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.content_left_holder,
.content_right_holder {
    width: 25%;
}

.content_left .user_info,
.message_box,
.latest_donate {
    background-color: #111111;
    box-shadow: 1px 4px 65px 0px #0000000F;
    border-radius: 16px;
    width: 100%;
}

.content_left .user_info {
    background-image: url('./../img/bg.png');
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    padding-top: 16px;
}

.content_left .personal_info img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 87px;
    height: 87px;
    display: block;
    margin: auto;
}

.content_left .personal_info .user_name {
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    color: #F6F6F6;
    margin-top: 15px;
    display: block;
}

.personal_info .activities {
    display: flex;
    justify-content: center;
    gap: 8px;
    list-style: none;
}

.personal_info .activities li {
    background: #30250A;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    color: #F6B439;
    padding: 6px 8px;
    border-radius: 4px;
    margin-top: 15px;
}

.view_profile {
    border: 1px solid #1D1D1D;
    border-radius: 8px;
    margin-top: 15px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    color: #F6F6F6;
    text-decoration: none;
    padding: 8px;
    width: 178px;
    display: block;
    margin: 15px auto;
    line-height: 25px;
    transition: 0.3s;
}

.view_profile:hover {
    border: 1px solid #F6B439;
}

.views_number {
    padding: 6px 12px 20px 12px;
}

.views_number li {
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    font-weight: 400;
    color: #F6F6F6;
    align-items: center;
    margin-top: 20px;
}

.views_number li:hover .number {
    transform: scale(1.15);
}

.views_number li .title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.views_number li .number {
    font-weight: 600;
    transition: 0.3s;
}






.message_box {
    margin-top: 14px;
    padding: 16px 14px;
    height: 100%;
}

.latest_donate {
    padding: 16px 14px;
    height: 100%;
}

.latest_donate_holder {
    position: sticky;
    top: 10px;
}

.message_box_title,
.latest_donate_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.message_box_title h5,
.latest_donate_title h5 {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
}

.message_box_title a,
.latest_donate_title a {
    font-size: 14px;
    font-weight: 500;
    color: #F6B439;
    text-decoration: none;
}

.buttons_holder {
    margin-top: 13px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #F6B43966;
    padding: 10px 20px;
    margin-bottom: 5px;
}

.buttons_holder button {
    background-color: unset;
    border: none;
    font-size: 14px;
    font-weight: 500;
    color: #F6F6F6;
    position: relative;
    padding-bottom: 5px;
}

.message_box .buttons_holder button.active:after {
    height: 3px;
    width: 110%;
    bottom: -10px;
    left: -5px;
    transition: width 4.4s;
}


.messages_holder {
    display: none;
    animation: leaves 0.4s ease-in-out;
    position: sticky;
    top: 10px;
}

.messages_holder.active {
    display: block;

}

@keyframes leaves {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

.message_item {
    background: #1D1D1D;
    padding: 5px 14px;
    border-radius: 8px;
    display: flex;
    gap: 10px;
    margin-top: 15px;
    transition: 0.3s;
}

.message_item:hover {
    transform: scale(1.05);
}

.message_item picture img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 50px;
    height: 50px;
    object-fit: cover;
}

.message_item picture {
    position: relative;
    height: fit-content;
}

.message_info header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.message_info .sender_name {
    font-size: 14px;
    font-weight: 600;
    color: #F6F6F6;
}

.message_info .time {
    font-size: 10px;
    font-weight: 600;
    color: #F6B439;
}

.message_info .time:before {
    margin-right: 5px;
}

.message_text {
    font-size: 12px;
    font-weight: 400;
    color: #F6F6F6;
    margin-top: 8px;
    line-height: 16px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.online {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background-color: #23A36D;
    border: 3px solid #F6F6F6;
    position: absolute;
    bottom: 9px;
    right: 3px;
}



.latest_donate_item .donater_info img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 42px;
    height: 42px;
    object-fit: cover;
}

.latest_donate_item .donater_info {
    gap: 6px;
    display: flex;
}

.latest_donate_item {
    background: #1D1D1D;
    border-radius: 8px;
    margin-top: 16px;
    padding: 6px 9px;
}

.latest_donate_item:hover .price_holder {
    box-shadow: 0px 4px 96px 0px #F6B4395E;
}

.donater_info .user_name {
    font-size: 14px;
    font-weight: 600;
    color: #F6F6F6;
}

.donater_info .donate_title {
    font-size: 12px;
    font-weight: 400;
    margin-top: 6px;
    color: #F6F6F6;
    display: block;

}

.latest_donate_item header .time {
    font-size: 12px;
    font-weight: 500;
    color: #F6B439;

}

.latest_donate_item header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.latest_donate_item .price_holder {
    background: #111111;
    padding: 15px 8px;
    margin-top: 11px;
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: 0.3s;
}

.price_holder .price {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;

}

.price_holder .price span {
    font-size: 12px;
    font-weight: 400;
    padding-left: 5px;
}

.price_holder button {
    border: none;
    background-color: #F6B439;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
    color: #000;
    padding: 7px 18px;
    transition: 0.3s;
}

.price_holder button:hover {
    transform: scale(1.1);
}





.post_images {
    width: 100%;
    height: 300px;
    margin-top: 12px;
}

.post_item {
    width: 100%;
    height: 300px;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
}

.show_product_info {
    content: '';
    width: 35px;
    height: 35px;
    background-color: #30250A;
    display: block;
    position: absolute;
    right: 19px;
    bottom: 14px;
    border-radius: 6px;
    background-image: url("data:image/svg+xml,%3Csvg width='19' height='19' viewBox='0 0 19 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.9154 3.50845L12.332 2.67755C10.9422 1.94818 10.2472 1.5835 9.49967 1.5835C8.75213 1.5835 8.05719 1.94818 6.66732 2.67755L5.08399 3.50845C3.67977 4.24535 2.85435 4.67851 2.34276 5.25788L9.49967 8.83633L16.6566 5.25788C16.145 4.67851 15.3196 4.24535 13.9154 3.50845Z' fill='%23F6B439'/%3E%3Cpath d='M17.2171 6.30527L10.0934 9.86712V17.3408C10.6618 17.1993 11.3084 16.8599 12.332 16.3228L13.9154 15.4919C15.6188 14.598 16.4705 14.151 16.9434 13.3479C17.4163 12.5447 17.4163 11.5453 17.4163 9.54647V9.45386C17.4163 7.9555 17.4163 7.01874 17.2171 6.30527Z' fill='%23F6B439'/%3E%3Cpath d='M8.90592 17.3408V9.86712L1.78222 6.30527C1.58301 7.01874 1.58301 7.9555 1.58301 9.45386V9.54647C1.58301 11.5453 1.58301 12.5447 2.05595 13.3479C2.52889 14.151 3.38059 14.598 5.08399 15.4919L6.66732 16.3228C7.6909 16.8599 8.33757 17.1993 8.90592 17.3408Z' fill='%23F6B439'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    border: none;
    transition: 0.4s;
}

.show_product_info:hover {
    transform: scale(1.2);
}

.post_item img {
    width: 100%;
    height: 100%;
}

.post_images .owl-dots,
.seller_page_products_list_items .owl-dots {
    position: absolute;
    bottom: 29px;
    height: 0;
    right: 0;
    left: 0;
}

.seller_page_products .comments_holder {
    display: none;
}

.seller_page_products .comments_holder.active {
    display: block;
}

.post_images .owl-dot span,
.seller_page_products_list_items .owl-dot span {
    width: 5px !important;
    height: 5px !important;
    background: #858585 !important;
    margin: 5px 2px !important;
}

.post_images .owl-dot.active span,
.seller_page_products_list_items .owl-dot.active span {
    width: 20px !important;
    height: 5px !important;
    background: #1D1D1D !important;
}

.post_images .owl-nav {
    opacity: 0;
    transition: all 0.4s;

}

.post_images:hover .owl-nav {
    display: flex;
    transition: all 0.4s;
    opacity: 1;

}

.post_images .owl-next,
.post_images .owl-prev,
.view_story .owl-next,
.view_story .owl-prev {
    color: #F6F6F6 !important;
    font-size: 40px !important;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    bottom: 0;
    background-color: #1D1D1D !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    width: 28px;
    height: 28px;
    opacity: 1;
}

.post_images .owl-prev,
.view_story .owl-prev {
    left: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='19' viewBox='0 0 20 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.5' d='M16.2228 10.0833C16.5449 10.0833 16.8061 9.82217 16.8061 9.5C16.8061 9.17783 16.5449 8.91667 16.2228 8.91667V10.0833ZM16.2228 8.91667H3.77832V10.0833H16.2228V8.91667Z' fill='%23F6F6F6'/%3E%3Cpath d='M8.44499 4.83301L3.77832 9.49967L8.44499 14.1663' stroke='%23F6F6F6' stroke-width='1.16667' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") !important;
}

.post_images .owl-next,
.view_story .owl-next {
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='19' viewBox='0 0 20 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.5' d='M3.77724 8.91667C3.45507 8.91667 3.1939 9.17783 3.1939 9.5C3.1939 9.82216 3.45507 10.0833 3.77723 10.0833L3.77724 8.91667ZM3.77723 10.0833L16.2217 10.0833L16.2217 8.91667L3.77724 8.91667L3.77723 10.0833Z' fill='%23F6F6F6'/%3E%3Cpath d='M11.555 14.167L16.2217 9.50033L11.555 4.83366' stroke='%23F6F6F6' stroke-width='1.16667' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") !important;
}

.product_info_holder {
    background-color: #1D1D1D;
    padding: 11px 8px;
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
    width: 100%;
    z-index: 1;
    justify-content: space-between;
    display: none;
}


.product_info_holder img {
    width: 76px !important;
    height: 38px;
    border-radius: 8px;
}

.product_info_holder .product_name {
    font-size: 13px;
    font-weight: 500;
    color: #F6F6F6;
}

.product_info_holder .category {
    font-size: 12px;
    font-weight: 500;
    color: #F6F6F6;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 5px;
    display: block;
}

.product_info {
    display: flex;
    align-items: center;
    gap: 17px;
}

.product_donate_now {
    background: #F6B439;
    border-radius: 8px;
    padding: 9px;
    font-size: 10px;
    font-weight: 600;
    color: #000000;
    border: none;
}






.profile_menu_holder {
    position: absolute;
    right: 0;
    z-index: 10;
    transition: 0.2s;
    top: 102px;
    display: none;

}

.header_menu_right_user_info.active .profile_menu_holder {
    display: block !important;
}

.profile_menu {
    background-color: #1D1D1D;
    padding: 10px 14px;
    border-radius: 16px;
    list-style: none;

}



.rotate {
    transform: rotate(0deg);
    transition: 0.4s;
}

.header_menu_right_user_info.active .rotate {
    transform: rotate(180deg);
}


.profile_menu li a {
    text-decoration: none;
    color: #F6F6F6;
    font-size: 16px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
    width: 224px;
    margin-top: 14px;
    position: relative;
}

.profile_menu li a:hover::after {
    content: '';
    width: 100%;

}

.profile_menu li a::after {
    content: '';
    width: 0;
    height: 1px;
    background-color: #F6B439;
    position: absolute;
    bottom: -7px;
    transition: 0.6s;
}

.profile_menu li a:last-child {
    margin-bottom: 14px;
}

/* ================================================================================================ */


/* explore */

.explore_content {
    background: #111111;
    border-radius: 16px;
    margin: 16px auto;
    padding: 22px 35px;
    min-height: calc(100vh - 180px);
}

.explore_content_search {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
}

.explore_content_search h2 {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
}

.explore_content .search_box {
    border: 1px solid #1D1D1D;
    background-color: inherit;
    padding: 16px;
    max-width: 410px !important;
    width: 410px !important;
    border-radius: 8px;
    padding-left: 50px;
    display: block !important;
    color: #f6f6f6;
}

.explore_content_search .search_box::placeholder {
    font-size: 12px;
    font-weight: 500;
    color: #FFFFFF;
}

.explore_content_search form {
    display: flex;
    align-items: center;
    width: max-content;
    position: relative;
    gap: 12px;
}

.explore_content_search .filter {
    background: #F6B439;
    border-radius: 14px;
    padding: 14px 24px;
    width: 108px;
    font-size: 13px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
    border: none;
    transition: 0.4s;
}

.explore_content_search .filter:hover {
    transform: scale(0.9);
}

.search_icon {
    position: absolute;
    left: 15px;
}


.explore_content_search_right_section {
    display: flex;
    gap: 35px;
    justify-content: flex-start;
    flex-direction: column;
}

.explore_content .switch_btn_holder button {
    font-size: 16px !important;
}

.explore_content .switch_btn_holder .active,
.seller_holder .switch_btn_holder .active {
    background: #30250A;
    color: #F6B439;
}





.gallery_holder img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    display: inline-block;
    transition: 0.3s;
}

.gallery_holder img:hover {
    transform: scale(0.95);
}

.gallery_holder>a {
    display: flex;
    justify-content: center;
    align-items: center;
}

.gallery_holder>a>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.gallery_holder {
    display: none;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(406px, 1fr));
    grid-auto-rows: 200px;
    grid-auto-flow: dense;
    margin-top: 20px;
}

.gallery_holder.active {
    display: grid !important;
}

.gallery_holder .wide {
    grid-column: span 2;
}

.gallery_holder .tall {
    grid-column: span 2;
    grid-row: span 2;
}

.gallery_holder .big {
    grid-column: span 2;
    grid-row: span 2;
}

.gallery_holder .half {
    grid-row: span 2;
}




.posts_page {
    display: flex;
    gap: 20px;
    margin-top: 24px;
    min-height: calc(100vh - 175px);
}

.explore_post_info {
    width: 50%;
}

.explore_post_info .post_info {
    margin-top: 0 !important;
}

.reloted_posts {
    width: 50%;
    background: #111111;
    border-radius: 16px;
    padding: 30px 21px;
    overflow: hidden;
}

.reloted_posts h3 {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
}

.reloted_posts .gallery_holder {
    overflow-y: scroll;
    height: 100vh;
}



.products {
    margin-top: 20px;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px 12px;
    display: none;
}

.products.active {
    display: grid !important;
}

.products_product_item {
    background: #1D1D1D;
    border-radius: 8px;
    padding: 9px 7px;
    text-decoration: none;
    transform: scale(1);
}

.products_product_item:hover {
    transform: scale(0.9);
    transition: 0.4s ease-in-out;
}

.products_product_item img {
    width: 100%;
    height: 106px;
    border-radius: 12px;
}

.products_product_item_title {
    color: #F6F6F6;
    font-size: 14px;
    font-weight: 600;
    margin-top: 13px;
}

.products_product_item_category {
    background: #30250A;
    color: #F6B439;
    font-size: 10px;
    font-weight: 500;
    padding: 8px 6px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
}

.products_product_item_price {
    font-size: 13px;
    font-weight: 500;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    gap: 6px;
}

.products_product_item footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}

.products_product_item_price::before,
.product_item_info_price::before {
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle opacity='0.5' cx='9.06102' cy='9.0122' r='6.84911' stroke='%23F6F6F6' stroke-width='1.23284' /%3E%3Cpath d='M9.06055 12.4365V12.779V13.1214' stroke='%23F6F6F6' stroke-width='1.23284' stroke-linecap='round' /%3E%3Cpath d='M9.06055 4.90234V5.2448V5.58725' stroke='%23F6F6F6' stroke-width='1.23284' stroke-linecap='round' /%3E%3Cpath d='M11.1153 7.29919C11.1153 6.35353 10.1954 5.58691 9.06059 5.58691C7.92579 5.58691 7.00586 6.35353 7.00586 7.29919C7.00586 8.24486 7.92579 9.01147 9.06059 9.01147C10.1954 9.01147 11.1153 9.77808 11.1153 10.7237C11.1153 11.6694 10.1954 12.436 9.06059 12.436C7.92579 12.436 7.00586 11.6694 7.00586 10.7237' stroke='%23F6F6F6' stroke-width='1.23284' stroke-linecap='round' /%3E%3C/svg%3E");
    content: '';
    display: inline;
    width: 16px;
    height: 16px;
}

/* =============================================================================== */


/* products */
.products_empty {
    display: flex;
    flex-direction: column;
    gap: 31px;
    align-items: center;
    margin-top: 23px;
}

.products_empty p {
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #f6f6f6
}

.products_empty p span {
    border: 2px solid #c2c2c2;
    display: block;
    width: 29px;
    height: 29px;
    border-radius: 50%;
    line-height: 27px;
    margin: auto;
}

.products_empty img {
    max-width: 440px;
    width: 100%;
}

.products_page .content {
    min-height: calc(100vh - 160px);
}

.products_holder {
    background: #111111;
    border-radius: 16px;
    padding: 27px 23px;
    height: 100%;
}

.products_holder_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.products_holder_header h2 {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
    display: flex;
    align-items: center;
    gap: 10px;
}

.new_product_btn {
    background-color: #F6B439;
    border-radius: 14px;
    padding: 13px 10px;
    font-size: 10px;
    display: flex;
    gap: 5px;
    align-items: center;
    font-weight: 600;
    border: none;
}

.new_product_btn svg,
.choose_product_info button svg {
    transition: 0.3s;
}

.new_product_btn:hover svg,
.choose_product_info button:hover svg {
    transform: scale(1.2);
}

.search_product {
    border: 1px solid #FFFFFF47;
    max-width: 277px;
    border-radius: 8px;
    padding: 14px 11px;
    display: flex;
    align-items: center;
    margin-top: 15px;
    position: relative;
    padding-left: 30px;
}

.search_product input {
    background-color: unset;
    border: none;
    height: 100%;
    padding-left: 11px;
    color: #fff;
    display: block;
    width: 100%;
}

.search_product input::placeholder {
    color: #fff;
}

.product_item {
    background: #1D1D1D;
    border-radius: 8px;
    padding: 12px 13px;
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: 0.3s;
}

.product_item:hover {
    box-shadow: 0px 4px 96px 0px #F6B4395E;

}

.product_item_img {
    width: 182px !important;
    height: 86px;
    border-radius: 14px;
}

.product_item_info_container {
    display: flex;
    gap: 19px;
    align-items: center;
}

.product_item_info {
    list-style: none;
    color: #F6F6F6;
    font-size: 14px;
    font-weight: 400;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
}

.product_item_info li {
    display: flex;
    align-items: center;
    gap: 6px;
}

.product_item_info_name {
    font-size: 16px;
    font-weight: 600;
}

.product_item .action {
    display: flex;
    justify-content: flex-end;
}

.product_item .action button {
    border-radius: 8px;
    border: none;
    width: 40px;
    height: 40px;
}

.product_item .action button:hover svg {
    transform: scale(1.2);
}

.product_item .action button svg {
    transition: 0.3s;
}

.product_item .action button:first-child {
    background: #30250A;
    margin-right: 20px;
}

.product_item .action button:last-child {
    background: #37201D;

}

.product_item_info_price {
    position: relative;
}

/* ==================================================================================================== */

.create_product_form {
    margin-top: 27px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
}

.input_holder {
    width: 48%;
    position: relative;
}

.input_holder input,
.input_holder .choose_category,
.input_holder.description textarea {
    width: 100%;
    background: #1D1D1D;
    border-radius: 14px;
    border: none;
    height: 49px;
    padding: 16px 14px;
    color: #fff;
}

.input_holder input::placeholder,
.input_holder textarea::placeholder {
    color: #a0a0a0;
}

.input_holder label {
    font-size: 12px;
    font-weight: 500;
    color: #F6F6F6;
    padding-bottom: 8px;
    display: block;
}

.input_holder select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.5 9.5L12.5 15.5L5.5 9.5' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") !important;
    background-position: 95% center !important;
    background-repeat: no-repeat !important;
}

.upload_picture {
    width: 100% !important;
    color: #F6F6F6;
    margin-top: 17px;
    height: 300px;
    position: relative;
    border-radius: 14px;
    position: relative;
}


.upload_picture p {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    line-height: 32px;
}


.upload_picture,
.upload_picture::after {
    height: var(--box-height);
    width: var(--box-width);
    border: solid;
    --border-size: 2px;
    --box-width: 100%;
    --box-height: 299px;
    --dash-size: 1em;
}

.upload_image_holder {
    height: 100%;
    width: 100%;
    border: solid;
    --border-size: 2px;

    --dash-size: 1em;
}

.upload_image_holder::after {
    height: var(--box-height);
    width: var(--box-width);
    border: solid;
    --border-size: 2px;
    --box-width: 90%;
    --box-height: 83%;
    --dash-size: 1em;
}

.upload_picture,
.upload_image_holder {
    border-image: repeating-linear-gradient(to right, #F6B43966 0, #F6B43966 var(--dash-size), transparent var(--dash-size), transparent calc(var(--dash-size) * 2), #F6B43966 calc(var(--dash-size) * 2), #F6B43966 calc(var(--dash-size) * 3), transparent calc(var(--dash-size) * 3), transparent calc(var(--dash-size) * 4));
    border-image-slice: 25;
    border-image-width: var(--border-size) 0;
}

.upload_picture::after,
.upload_image_holder::after {
    content: "";
    position: absolute;
    border-image: repeating-linear-gradient(to bottom, #F6B43966 0, #F6B43966 var(--dash-size), transparent var(--dash-size), transparent calc(var(--dash-size) * 2), #F6B43966 calc(var(--dash-size) * 2), #F6B43966 calc(var(--dash-size) * 3), transparent calc(var(--dash-size) * 3), transparent calc(var(--dash-size) * 4));
    border-image-slice: 23;
    border-image-width: 0 var(--border-size);
}

.upload_image_holder::after {
    top: 84px;
    right: 19px;
}

.upload_picture p span {
    font-weight: 300 !important;
}

.create_product_form .choose_product_info_holder {
    margin-top: 17px;
    width: 100%;
}



.product_info_img {
    display: grid;
    gap: 28px;
    justify-content: space-between;
    grid-template-columns: repeat(3, 1fr);
}

.product_info_img img {
    width: 100%;
    height: 86px;
    border-radius: 14px;
}

.choose_product_info {
    display: flex;
    gap: 19px;
    margin-top: 17px;
    align-items: end;
}

.choose_product_info button {
    display: flex;
    align-items: center;
    gap: 8px;
    border: none;
    font-size: 12px;
    font-weight: 700;
    max-width: 170px;
    width: 100%;
    justify-content: center;
    height: 49px;
    border-radius: 14px;
}

.remove_color {
    background: #37201D;
    color: #AF2A1A;
}


.choose_product_info .add_color {
    background: #30250A;
    color: #F6B439;
}

.description {
    margin-top: 17px;
}

.description {
    max-width: 100%;
    display: none;
}

.input_holder.description textarea {
    height: auto;
    resize: none;
}

.checkbox {
    font-size: 12px;
    font-weight: 500;
    color: #F6F6F6;
    margin-top: 29px;
    padding-left: 30px;
    padding-top: 3px;
}


.checkbox {
    display: block;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: unset;
    border: 1px solid #F6B43980;
    border-radius: 3px;
}

/* On mouse-over, add a grey background color */
.checkbox:hover input~.checkmark {
    border: 2px solid #F6B43980
}

/* When the checkbox is checked, add a blue background */
.checkbox input:checked~.checkmark {
    background: #E6A935;

}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.checkbox input:checked~.checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.checkbox .checkmark:after {
    left: 6px;
    top: 1px;
    width: 4px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.create_product_form .button_holder {
    margin-top: 30px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.create_product_form .button_holder button {
    font-size: 14px;
    font-weight: 600;
    border-radius: 14px;
    max-width: 144px;
    width: 100%;
    border: none;
    background-color: unset;
    transition: 0.3s;
    padding: 15px 10px;
}

.create_product_form .button_holder button:hover {
    transform: scale(1.1);
}

.create_product_form .button_holder button:first-child {
    background-color: #F6B439;
}

.create_product_form .button_holder button:last-child {
    color: #DCDFE3;
}


/* ============================================================================================= */
/* seller page */
.seller_holder {
    background: #111111;
    border-radius: 16px;
    margin-top: 24px;
    padding: 23px 35px;
    min-height: calc(100vh - 170px);
}

.seller_holder .switch_btn_holder button {
    font-size: 14px !important;
}

.Seller_title {
    display: flex;
    justify-content: space-between;
}

.Seller_title h3 {
    font-size: 20px;
    font-weight: 600;
    color: #F6F6F6;
}

.seller_holder .seller_choose_category {
    margin-top: 15px;
}

.seller_choose_category select {
    padding-left: 40px !important;
}

.seller_choose_category::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.7794 9.94078H3.22059M12.7794 9.94078V5.23096C12.7794 4.05245 12.7794 3.46319 12.4133 3.09707C12.0472 2.73096 11.4579 2.73096 10.2794 2.73096H5.72059C4.54208 2.73096 3.95282 2.73096 3.5867 3.09707C3.22059 3.46319 3.22059 4.05245 3.22059 5.23096V9.94078M12.7794 9.94078L13.8695 11.0659C13.8973 11.0946 13.9112 11.1089 13.9242 11.1232C14.1249 11.3436 14.2402 11.6284 14.2494 11.9262C14.25 11.9455 14.25 11.9655 14.25 12.0055C14.25 12.0988 14.25 12.1454 14.2475 12.1848C14.2078 12.8131 13.7071 13.3138 13.0788 13.3535C13.0395 13.356 12.9928 13.356 12.8996 13.356H3.10043C3.00718 13.356 2.96055 13.356 2.92118 13.3535C2.2929 13.3138 1.79218 12.8131 1.75249 12.1848C1.75 12.1454 1.75 12.0988 1.75 12.0055C1.75 11.9655 1.75 11.9455 1.7506 11.9262C1.75981 11.6284 1.87514 11.3436 2.07579 11.1232C2.0888 11.1089 2.10274 11.0946 2.13055 11.0659L3.22059 9.94078' stroke='white' stroke-width='1.125' stroke-linecap='round'/%3E%3Cpath opacity='0.5' d='M6.4375 11.7935H9.5625' stroke='white' stroke-width='1.125' stroke-linecap='round'/%3E%3Cpath opacity='0.5' d='M8.46875 4.44971C8.46875 4.70859 8.25888 4.91846 8 4.91846C7.74112 4.91846 7.53125 4.70859 7.53125 4.44971C7.53125 4.19082 7.74112 3.98096 8 3.98096C8.25888 3.98096 8.46875 4.19082 8.46875 4.44971Z' fill='white'/%3E%3C/svg%3E%0A");
    width: 15px;
    height: 15px;
    position: absolute;
    left: 15px;
    top: 17px;
}

.best_seller {
    list-style: none;
    margin-top: 10px;
    padding: 12px 18px;
    display: none;
    gap: 38px;
    flex-wrap: wrap;
}

.best_seller.active {
    display: flex !important;
}

.best_seller li {
    position: relative;
}

.best_seller li a {
    display: flex;
    flex-direction: column;
    gap: 15px;
    text-decoration: none;
    color: #F6F6F6;
    align-items: center;
    font-size: 10px;
    width: fit-content;
    transition: 0.4s;
}

.best_seller li a:hover {
    transform: scale(0.9);

}

.best_seller li a .name {
    font-size: 14px;
    font-weight: 500;
}


.best_seller picture {
    width: 87px;
    height: 87px;
    background-color: #F6B439;
    position: relative;
    transition: 0.4s;
    padding: 3px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.best_seller picture img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.best_seller .price {
    font-size: 16px;
    font-weight: 600;
    position: relative;
    top: -7px;
}

.pic_holder {
    position: relative;
    height: fit-content;
    width: fit-content;
    display: inline-flex;
}

.best_seller li .pic_holder:after {
    padding: 7px;
    bottom: -9px;
    left: 49px;
    font-size: 17px;
    font-weight: 600;
    backdrop-filter: blur(4px);
    height: fit-content;
    width: fit-content;
}

.following {
    margin-top: 35px;
}

.following form {
    max-width: 277px;
    width: 100%;
    height: 48px;
    padding: 14px 11px;
    border-radius: 8px;
    border: 1px solid #FFFFFF47;
    display: flex;
    align-items: center;
    gap: 11px;
    position: relative;
    padding-left: 40px;
}

.following form::before,
.explore_content_search form::before,
.products_holder form.search_product::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='21' viewBox='0 0 20 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9.58366' cy='10.3141' r='7.91667' stroke='%23F6F6F6' stroke-width='1.5' /%3E%3Cpath d='M15.417 16.1475L18.3337 19.0641' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round' /%3E%3C/svg%3E");
    width: 20px;
    height: 20px;
    position: absolute;
    left: 11px;
}

.following form input {
    height: 100%;
    background-color: unset;
    border: none;
    width: 100%;
    color: #fff;
}

.following form input::placeholder {
    color: #fff;
}

.following_holder {
    list-style: none;
    gap: 10px;
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
}


.following_holder .following_item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: fit-content;
    align-items: center;
    text-decoration: none;
    padding: 10px 14px;
    background: #1D1D1D;
    border-radius: 8px;
    transition: 0.4s;

}

.following_holder .following_item:hover {
    box-shadow: 0px 4px 96px 0px #F6B4395E;

}

.following_holder .following_item img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 87px;
    height: 87px;
    object-fit: cover;
}

.following_item .name {
    font-size: 14px;
    color: #F6F6F6;
    font-weight: 500;
}



/* ============================================================================= */

.order_details {
    margin-top: 22px;
    overflow-x: auto;
}

.order_details tbody {
    display: none;
}

.order_details tbody.active {
    display: contents !important;
}

.order_details table {
    width: 100%;
    color: #F6F6F6;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    border-collapse: collapse;
}

.order_details thead tr th:first-child {
    border-radius: 8px 0 0 8px;
}

.order_details thead tr th:last-child {
    border-radius: 0 8px 8px 0;
}

.order_details tbody button:hover {
    transform: scale(1.1);
}

.order_details tbody button {
    transition: 0.4s;
}

.order_details thead tr th {
    background: #1D1D1D;
    padding: 17px 10px;
    color: #bdbdbd;
    min-width: 150px;
}

.order_details tbody tr td:last-child {
    padding: 32px 10px;
    min-width: 210px;
}

.order_details tbody tr td {
    padding: 32px 10px;
}

.order_details table .succeful,
.order_details table .wait,
.order_details table .error {
    color: #23A36D;
    background: #23322C;
    width: 132px;
    padding: 8px;
    border-radius: 8px;
    display: block;
    margin: auto;
}

.order_details table .wait {
    color: #DD7208;
    background: #30250A;
}

.order_details table .error {
    color: #AF2A1A;
    background: #37201D;

}

.success_detail,
.wait_detail {
    margin: auto;
    font-size: 14px;
    font-weight: 600;
    padding: 12px 7px;
    border-radius: 5px;
}

.success_detail {
    width: 173px;
    background: #F6B439;
    border: none;
}

.wait_detail {
    background-color: unset;
    color: #fff;
    border: 1px solid #303030;
    margin-left: 10px;
}





.upload_box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 25px;
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    gap: 16px;
    color: #F6F6F6;
}













input[type="range"] {
    /* removing default appearance */
    -webkit-appearance: none;
    appearance: none;
    /* creating a custom design */
    width: 100%;
    cursor: pointer;
    outline: none;
    /*  slider progress trick  */
    overflow: hidden;
    border-radius: 16px;
}

/* Track: webkit browsers */
input[type="range"]::-webkit-slider-runnable-track {
    height: 10px;
    background: #ccc;
    border-radius: 16px;
}

/* Track: Mozilla Firefox */
input[type="range"]::-moz-range-track {
    height: 3px;
    background: #ccc;
    border-radius: 16px;
}

/* Thumb: webkit */
input[type="range"]::-webkit-slider-thumb {
    /* removing default appearance */
    -webkit-appearance: none;
    appearance: none;
    /* creating a custom design */
    height: 10px;
    width: 10px;
    background-color: #fff;
    border-radius: 50%;
    border: 2px solid #F6B439;
    /*  slider progress trick  */
    box-shadow: -407px 0 0 400px #F6B439;
}


/* Thumb: Firefox */
input[type="range"]::-moz-range-thumb {
    height: 15px;
    width: 15px;
    background-color: #fff;
    border-radius: 50%;
    border: 1px solid #F6B439;
    /*  slider progress trick  */
    box-shadow: -407px 0 0 400px #F6B439;
}





.product_page_holder {
    display: flex;
    gap: 20px;
    margin-top: 24px;
    min-height: calc(100vh - 200px);
}

.product_page_holder .left_section,
.product_page_holder .right_section {
    background: #111111;
    box-shadow: 1px 4px 65px 0px #0000000F;
    border-radius: 16px;
    padding: 15px;
    max-width: 50%;
    width: 100%;
}

.product_page_holder .left_section .left_section_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.product_page_holder .left_section .left_section_header .user_info,
.posts_products_list li a .user_info {
    display: flex;
    gap: 12px;
    align-items: center;
}

.product_page_holder .left_section .left_section_header .user_info img {
    width: 54px;
    height: 54px;
    object-fit: cover;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.product_page_holder .left_section .left_section_header .user_info div .user_name,
.posts_products_list li a .user_info div .user_name {
    font-size: 14px;
    font-weight: 500;
    color: #9a9a9a;
}

.product_page_holder .left_section .left_section_header .user_info div h5,
.posts_products_list li a .user_info div h5 {
    font-size: 16px;
    font-weight: 600;
    color: #f6f6f6;
    margin-top: 9px;
}

.product_page_holder .left_section .left_section_header .user_info h5 .time,
.posts_products_list li a .user_info h5 .time {
    font-size: 12px;
    font-weight: 500;
    color: #F6B439;
    margin-left: 9px;
}

.product_page_holder .left_section .left_section_header .more {
    background-color: unset;
    border: none;
}

.product_page_holder .left_section .product_title {
    font-size: 20px;
    font-weight: 600;
    color: #F6F6F6;
    margin-top: 12px;
}

.product_page_holder .left_section .choose_details {
    display: flex;
    justify-content: space-between;
    align-items: end;
}

.product_page_holder .left_section .choose_details .colors {
    display: flex;
    gap: 12px;
    list-style: none;
    margin-top: 30px;
}

.product_page_holder .left_section .choose_details .colors li {
    width: 25px;
    height: 25px;
    border-radius: 50%;
}

.product_page_holder .left_section .choose_details .colors li.active {
    border: 3px solid #111;
}

.product_page_holder .left_section .choose_details .number button {
    width: 25px;
    height: 25px;
    border: 1.5px solid #676767;
    background-color: unset;
    border-radius: 50%;
    color: #f6f6f6;
    transition: 0.3s;
}

.product_page_holder .left_section .choose_details .number button:hover,
.product_page_holder .left_section .donate:hover {
    transform: scale(1.1);
}

.product_page_holder .left_section .choose_details .number span {
    color: #676767;
    font-size: 20px;
    font-weight: 600;
    margin: 0 10px;
}

.product_page_holder .left_section .donate {
    background: #F6B439;
    border-radius: 8px;
    padding: 8px 20px;
    font-size: 12px;
    font-weight: 500;
    border: none;
    margin-top: 20px;
    margin-left: auto;
    display: block;
    margin-bottom: 35px;
    transition: 0.3s;

}



.switch_btn_holder {
    background: #1D1D1D;
    border-radius: 11px;
    padding: 7px;
    width: fit-content;
    transition: 0.4s;
}

.switch_btn_holder:hover {
    box-shadow: 0px 4px 96px 0px #F6B4395E;

}

.switch_btn_holder button {
    padding: 13px;
    border-radius: 4px;
    background-color: unset;
    border: none;
    font-size: 18px;
    font-weight: 600;
    color: #F6F6F6;
}

.switch_btn_holder button.active {
    background: #F6B439;
    color: #000;
}

.donation,
.rating,
.product_post {
    display: none;
}

.donation.active,
.rating.active,
.product_post.active,
.description.active {
    display: block;
}

.content_title {
    margin-top: 23px;
    font-size: 16px;
    font-weight: 500;
    color: #F6F6F6;
}

.content_title h5 {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    gap: 8px;
}

.best_buyer_table_holder {
    overflow-x: auto;

}

.best_buyer_table {
    margin-top: 25px;
    width: 100%;
    border-collapse: collapse;
}

.best_buyer_table td {
    border-bottom: 1px solid #1D1D1D;
    padding: 8px 0;
    min-width: 270px;
}

.best_buyer_table .buyer_info {
    display: flex;
    align-items: center;
    gap: 15px;
}

.best_buyer_table .buyer_info div {
    width: 55px;
    height: 53px;
    background-color: #F6B439;
    transition: 0.4s;
    padding: 3px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.best_buyer_table .buyer_info img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);

}

.best_buyer_table .buyer_info .name {
    font-size: 14px;
    font-weight: 600;
    color: #F6F6F6;
}

.best_buyer_table .amount {
    font-size: 14px;
    font-weight: 600;
    color: #F6F6F6;
    text-align: end;
}

.best_buyer_table .amount span {
    font-size: 23px;
    margin-left: 15px;
}

.description .content_text {
    font-size: 14px;
    font-weight: 500;
    color: #F6F6F6;
    line-height: 24px;
    margin-top: 14px;
}

.rating_holder_list {
    display: flex;
    list-style: none;
    gap: 8px;
}

.rating_holder {
    margin-top: 16px;
    display: flex;
    gap: 14px;
    align-items: center;
}

.rating_holder p {
    color: #FFFFFF;
    font-size: 12px;
    font-weight: 400;
}

.rating_holder p span:first-child {
    font-size: 16px;
    font-weight: 500;
}



.posts_products_list {
    list-style: none;
    margin-top: 14px;
    display: grid;
    grid-template-rows: auto auto;
    grid-auto-flow: column;
    overflow-x: scroll;
    gap: 14px 25px;
    width: 100%;
}

.posts_products_list li a {
    background: #1D1D1D;
    padding: 22px;
    border-radius: 16px;
    display: block;
    text-decoration: none;
    max-width: 366px;
    width: 100%;
    transition: 0.3s;
}

.posts_products_list li a:hover {
    transform: scale(0.95);
}

.posts_products_list li a .user_info img {
    width: 43.25px;
    height: 43.25px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);

}

.posts_products_list li a .explain {
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    color: #F6F6F6;
    margin-top: 13px;
}

.posts_products_list li a .product_img {
    width: 313px;
    height: 156px;
    border-radius: 4px;
    object-fit: cover;
    margin-top: 15px;
}









.seller_page_products {
    background: #111111;
    box-shadow: 1px 4px 65px 0px #0000000F;
    padding: 22px 35px;
    margin-top: 24px;
    border-radius: 16px;
    min-height: calc(100vh - 150px);
}

.sell_chart {
    display: none;

}

.seller_page_products .chart_holder {
    background: #1D1D1D;
    width: 100%;
    padding: 30px;
    margin-top: 20px;
    border-radius: 16px;
}

.sell_chart.active {
    display: block;
}

.seller_page_products_list_items {
    width: 100%;
}

.seller_page_products_list_items .owl-nav {
    display: none;
}

.seller_page_products_list_items .owl-dots {
    bottom: 41px;
}

.seller_page_products .chart_holder #chart {
    margin-top: 40px;
}

.seller_page_products .chart_holder .info {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.seller_page_products .chart_holder .info .title {
    font-size: 17px;
    font-weight: 600;
    color: #F6F6F6;

}

.seller_page_products .chart_holder .info .choose_time {
    background-color: unset;
    color: #F6F6F6;
    border: none;
    font-size: 17px;
    font-weight: 500;
}

.banner {
    background-image: url('../img/Rectangle\ 26.png');
    width: 100%;
    height: 165px;
    border-radius: 16px;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 19px;
}

.banner .edit {
    padding: 11px 21px;
    align-items: center;
    gap: 10px;
    border: none;
    border-radius: 14px;
    background: #30250A;
    color: #F6B439;
    float: right;
    display: none;
}

.banner:hover .edit {
    display: flex;
}

.seller_page_products_contents {
    display: flex;
    justify-content: center;
    gap: 25px;
    margin: 0 30px;
}

.seller_page_products .add_comment {
    background-color: #111;
}

.seller_page_products .add_comment form {
    background-color: #1d1d1d;
    border-radius: 8px;
}

.seller_page_products_contents .right_section .switch_btn_holder {
    margin-left: auto;
    margin-top: -27px;
}

.seller_page_products_contents .right_section {
    width: 80%;
}

.seller_page_products_contents .right_section form.search {
    border: 1px solid #FFFFFF47;
    border-radius: 8px;
    max-width: 277px;
    height: 48px;
    display: flex;
    align-items: center;
    padding: 14px 11px;
    gap: 11px;
}

.seller_page_products_contents .right_section form input {
    width: 100%;
    background-color: unset;
    height: 100%;
    border: none;
    color: #fff;
}

.seller_page_products_contents .right_section form input::placeholder {
    color: #fff;

}

.seller_page_products_list {
    gap: 15px 10px;
    margin-top: 20px;
    list-style: none;
    grid-template-columns: 50% 50%;
    display: grid;
}

.seller_page_products_list_item_holder {
    width: 100%;
}

.seller_page_products_list_holder {
    display: none;

}

.seller_page_products_list_holder.active {
    display: block;
    margin-top: 20px;
}

.seller_page_products_list li a {
    max-width: 454px;
    width: 100%;
    text-decoration: none;
}

.seller_page_products_list li a img {
    border-radius: 6px;
    height: 225px;
    object-fit: cover;
}

.seller_page_products_list li a .title {
    font-size: 15px;
    font-weight: 600;
    color: #F6F6F6;
    margin-top: 10px;
    display: block;
}

.seller_page_products_contents .post_info {
    padding: 0;
    background: #1D1D1D;
    box-shadow: 1px 4px 65px 0px #0000000F;
    border-radius: 16px;
    padding: 21px 43px;
    display: none;
    height: auto;
}

.seller_page_products_contents .logout {
    background-color: unset;
    border: none;
    width: 100%;
    display: block;
    text-align: center;
}

.seller_page_products_contents .post_info.active {
    display: block;
}

.sell_chart h3 {
    font-size: 18px;
    font-weight: 600;
    color: #F6F6F6;
}

.sale_statistics_list {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    list-style: none;
    flex-wrap: wrap;
}

.sale_statistics_list li {
    padding: 20px 30px;
    text-align: center;
    background: #1D1D1D;
    border-radius: 8px;
    flex: auto;
}

.sale_statistics_list li .title {
    font-size: 18px;
    font-weight: 500;
    color: #F6F6F6;
}

.sale_statistics_list li .value {
    font-size: 21px;
    font-weight: 600;
    color: #F6B439;
    margin-bottom: 11px;
    display: block;
}

.sale_statistics_list li .value.chart_rating {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 17px;
    gap: 6px;
    justify-content: center;
}

.seller_page_products_contents aside {
    padding: 19px 17px;
    background: #1D1D1D;
    border-radius: 16px;
    width: 20%;
    margin-top: -50px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}


.user_page_info .user_img {
    width: 95px;
    height: 95px;
    background-color: #F6B439;
    transition: 0.4s;
    padding: 3px;
    margin: auto;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.user_page_info .user_img img {
    width: 100%;
    height: 100%;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    object-fit: cover;

}

.user_page_info .user_id {
    font-size: 16px;
    font-weight: 500;
    color: #f6f6f6;
    margin-top: 15px;
}

.user_page_info .user_name {
    font-size: 20px;
    font-weight: 700;
    color: #f6f6f6;
    margin-top: 8px;
}

.user_page_info .follower_number {
    display: flex;
    gap: 20px;
    color: #f6f6f6;
    margin-top: 24px;
    justify-content: center;
}

.user_page_info .follower_number p {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
}

.user_page_info .follower_number p span {
    font-weight: 500;
    font-size: 14px;
    display: block;
    text-align: center;
    margin-top: 8px;
}

.user_page_info .button_holder {
    display: flex;
    gap: 8px;
    margin-top: 24px;
}

.user_page_info .button_holder button {
    background: #F6B439;
    width: 97px;
    height: 32px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
}

.user_page_info .button_holder button:last-child {
    background: #FFDFA2;
}

.user_page_info .explain {
    font-size: 14px;
    font-weight: 500;
    color: #cbcbcb;
    margin-top: 24px;
}

.user_page_info {
    text-align: center;
}






.profile_information {
    background: #111111;
    border-radius: 16px;
    padding: 22px 40px;
    margin-top: 24px;
    min-height: calc(100vh - 170px);
}

.profile_information header h2 {
    font-size: 20px;
    font-weight: 600;
    color: #f6f6f6;
    display: flex;
    align-items: center;
    gap: 10px;
}

.profile_information header {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
}

.profile_information_content {
    width: 100%;
    margin-top: 16px;
    display: none;
}

.profile_information_content.active {
    display: block;
}

.profile_information_content .profile_img {
    display: flex;
    align-items: center;
    gap: 10px;
}

.profile_information_content .profile_img img {
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    width: 75px;
    height: 75px;
    object-fit: cover;
}

.profile_information_content .profile_img button {
    width: 152px;
    height: 43px;
    border-radius: 14px;
    border: none;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
}

.profile_information_content .profile_img button.edit {
    color: #F6B439;
    background: #30250A;
}

.profile_information_content .profile_img button.remove {
    color: #AF2A1A;
    background: #37201D;
}

.profile_information_form {
    display: flex;
    gap: 16px 22px;
    flex-wrap: wrap;
    margin-top: 16px;
    justify-content: space-between;
}

.profile_information_form textarea {
    width: 100%;
    background: #1D1D1D;
    border-radius: 14px;
    border: none;
    resize: unset;
    padding: 14px;
}

.profile_information_form .input_holder label {
    color: #a0a0a0;
}

.profile_information_form .input_holder {
    max-width: none;
    position: relative;
    flex: auto;
}

.profile_information_form .name input,
.profile_information_form .phone input,
.profile_information_form .zip_code input,
.profile_information_form .city select,
.profile_information_form .country select {
    padding-left: 50px;
}

.profile_information_form .name::before,
.profile_information_form .phone::before,
.profile_information_form .zip_code::before,
.profile_information_form .city::before,
.profile_information_form .country::before {
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    left: 15px;
    top: 33px;
}

.profile_information_form .name::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='6.68701' r='4' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath opacity='0.5' d='M20 18.187C20 20.6723 20 22.687 12 22.687C4 22.687 4 20.6723 4 18.187C4 15.7017 7.58172 13.687 12 13.687C16.4183 13.687 20 15.7017 20 18.187Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3C/svg%3E%0A");
}

.profile_information_form .phone::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.00586 7.6201C5.04883 6.48661 5.70011 5.46125 6.53711 4.62424C7.93006 3.23129 10.1525 3.41845 11.0369 5.00318L11.6859 6.16611C12.2716 7.2156 12.0365 8.59234 11.114 9.51481M17.0662 19.6805C18.1997 19.6375 19.2251 18.9862 20.0621 18.1492C21.455 16.7563 21.2679 14.5338 19.6831 13.6494L18.5202 13.0004C17.4707 12.4147 16.094 12.6498 15.1715 13.5723' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath opacity='0.5' d='M5.00655 7.62012C4.93421 9.52825 5.41713 12.7687 8.6677 16.0193C11.9183 19.2699 15.1588 19.7528 17.0669 19.6805M15.1722 13.5723C15.1722 13.5723 14.0532 14.6912 12.0245 12.6625C9.99578 10.6338 11.1147 9.51483 11.1147 9.51483' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3C/svg%3E%0A");
}

.profile_information_form .zip_code::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='9.68701' r='2' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M13 15.687C13 16.7916 13 17.687 9 17.687C5 17.687 5 16.7916 5 15.687C5 14.5824 6.79086 13.687 9 13.687C11.2091 13.687 13 14.5824 13 15.687Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M2 12.687C2 8.91578 2 7.03016 3.17157 5.85858C4.34315 4.68701 6.22876 4.68701 10 4.68701H14C17.7712 4.68701 19.6569 4.68701 20.8284 5.85858C22 7.03016 22 8.91578 22 12.687C22 16.4582 22 18.3439 20.8284 19.5154C19.6569 20.687 17.7712 20.687 14 20.687H10C6.22876 20.687 4.34315 20.687 3.17157 19.5154C2 18.3439 2 16.4582 2 12.687Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M19 12.687H15' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M19 9.68701H14' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M19 15.687H16' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.profile_information_form .city::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.5' d='M12 22.687V20.687' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M4 17.2493C5.88838 19.3592 8.63263 20.687 11.687 20.687C17.3827 20.687 22 16.0697 22 10.374C22 7.31964 20.6722 4.57539 18.5623 2.68701' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath opacity='0.5' d='M7 5.23964C7.58518 5.79226 8.79066 7.30277 8.93111 8.92381C9.06238 10.439 10.0268 11.6703 11.5 11.6869C12.0662 11.6933 12.6388 11.2692 12.6373 10.682C12.6368 10.5005 12.6079 10.3148 12.5627 10.144C12.4998 9.90649 12.4942 9.6332 12.625 9.35363C13.0824 8.37562 13.982 8.11291 14.6949 7.58176C15.0111 7.34619 15.2995 7.09769 15.4266 6.89752C15.7777 6.34489 16.1289 5.23964 15.9533 4.68701M13.291 17.687C13.0714 17.2732 12.764 16.1974 13.291 15.2043C13.9497 13.9629 16.1455 13.9629 16.1455 13.9629C17.837 13.9452 18.4469 13.1814 18.7334 12.5006M19 10.687C19 14.553 15.866 17.687 12 17.687C8.13401 17.687 5 14.553 5 10.687C5 6.82102 8.13401 3.68701 12 3.68701C15.866 3.68701 19 6.82102 19 10.687Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M10 22.687H14' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.profile_information_form .country::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 1.93701C7.41421 1.93701 7.75 2.2728 7.75 2.68701V4.43701H8C8.01496 4.43701 8.02987 4.43701 8.04475 4.43701C8.47757 4.43696 8.8744 4.43691 9.19721 4.48031C9.55269 4.5281 9.92841 4.64055 10.2374 4.94958C10.5465 5.2586 10.6589 5.63432 10.7067 5.9898C10.7501 6.31262 10.7501 6.70945 10.75 7.14227C10.75 7.15714 10.75 7.17206 10.75 7.18701V8.56907C10.8169 8.62204 10.8818 8.67969 10.9445 8.74247C11.4 9.19794 11.5857 9.76474 11.6701 10.3925C11.7284 10.826 11.7442 11.3415 11.7484 11.937H12.25L12.25 8.39701C12.25 7.13866 12.2499 6.11 12.3656 5.32511C12.4856 4.51123 12.7528 3.78455 13.4336 3.31272C14.1145 2.84089 14.8887 2.84585 15.6929 3.01932C16.4684 3.1866 17.4316 3.54781 18.6098 3.98968L18.7057 4.02563C19.3012 4.24893 19.8051 4.43787 20.2009 4.63883C20.6219 4.85256 20.9859 5.11062 21.2603 5.50663C21.5347 5.90263 21.6486 6.33401 21.7009 6.80325C21.75 7.24447 21.75 7.78261 21.75 8.41859V21.937H22C22.4142 21.937 22.75 22.2728 22.75 22.687C22.75 23.1012 22.4142 23.437 22 23.437H2C1.58579 23.437 1.25 23.1012 1.25 22.687C1.25 22.2728 1.58579 21.937 2 21.937H2.25L2.25 12.635C2.24997 11.7365 2.24994 10.9873 2.32991 10.3925C2.41432 9.76474 2.59999 9.19794 3.05546 8.74247C3.11823 8.67969 3.18313 8.62204 3.25 8.56907V7.18701C3.25 7.17205 3.25 7.15714 3.25 7.14226C3.24995 6.70945 3.2499 6.31262 3.2933 5.9898C3.34109 5.63432 3.45354 5.2586 3.76256 4.94957C4.07159 4.64055 4.44731 4.5281 4.80279 4.48031C5.1256 4.43691 5.52243 4.43696 5.95525 4.43701C5.97012 4.43701 5.98504 4.43701 6 4.43701H6.25V2.68701C6.25 2.2728 6.58579 1.93701 7 1.93701ZM4.75 8.01113C5.33751 7.93696 6.07178 7.93698 6.94801 7.93701H7.05199C7.92822 7.93698 8.66249 7.93696 9.25 8.01113V7.18701C9.25 6.6944 9.24841 6.4004 9.22008 6.18968C9.20709 6.09312 9.1918 6.04476 9.18284 6.02298C9.18077 6.01793 9.17915 6.01462 9.17814 6.01268L9.17676 6.01025L9.17433 6.00887C9.1724 6.00786 9.16908 6.00625 9.16404 6.00417C9.14226 5.99521 9.09389 5.97992 8.99734 5.96694C8.78661 5.9386 8.49261 5.93701 8 5.93701H6C5.50739 5.93701 5.21339 5.9386 5.00266 5.96694C4.90611 5.97992 4.85774 5.99521 4.83596 6.00417C4.83092 6.00625 4.8276 6.00786 4.82567 6.00887L4.82324 6.01025L4.82186 6.01268C4.82085 6.01462 4.81923 6.01793 4.81716 6.02298C4.8082 6.04476 4.79291 6.09312 4.77992 6.18968C4.75159 6.4004 4.75 6.6944 4.75 7.18701V8.01113ZM3.75 21.937H6.25L6.25 16.635C6.24997 15.7365 6.24995 14.9873 6.32991 14.3925C6.41432 13.7647 6.59999 13.1979 7.05546 12.7425C7.51093 12.287 8.07773 12.1013 8.70552 12.0169C9.13855 11.9587 9.65344 11.9429 10.2482 11.9386C10.244 11.3684 10.23 10.9382 10.1835 10.5924C10.1214 10.1309 10.0142 9.93344 9.88388 9.80313C9.75357 9.67281 9.55607 9.56559 9.09461 9.50355C8.61157 9.4386 7.96401 9.43701 7 9.43701C6.03599 9.43701 5.38843 9.4386 4.90539 9.50355C4.44393 9.56559 4.24643 9.67281 4.11612 9.80313C3.9858 9.93344 3.87858 10.1309 3.81654 10.5924C3.75159 11.0754 3.75 11.723 3.75 12.687V21.937ZM7.75 21.937H16.25V16.687C16.25 15.723 16.2484 15.0754 16.1835 14.5924C16.1214 14.1309 16.0142 13.9334 15.8839 13.8031C15.7536 13.6728 15.5561 13.5656 15.0946 13.5035C14.6116 13.4386 13.964 13.437 13 13.437H11C10.036 13.437 9.38843 13.4386 8.90539 13.5035C8.44393 13.5656 8.24643 13.6728 8.11612 13.8031C7.9858 13.9334 7.87858 14.1309 7.81654 14.5924C7.75159 15.0754 7.75 15.723 7.75 16.687V21.937ZM17.75 21.937H20.25V8.45901C20.25 7.7718 20.2489 7.31776 20.2101 6.96939C20.1734 6.63973 20.1091 6.47894 20.0274 6.36102C19.9457 6.2431 19.8177 6.1265 19.5219 5.97635C19.2094 5.81767 18.7846 5.65724 18.1412 5.41594C16.8906 4.94698 16.0312 4.62679 15.3766 4.48559C14.7379 4.34784 14.468 4.42089 14.288 4.54561C14.108 4.67032 13.9448 4.89746 13.8496 5.54381C13.752 6.20631 13.75 7.12341 13.75 8.45901V11.9386C14.3455 11.9429 14.861 11.9586 15.2945 12.0169C15.9223 12.1013 16.4891 12.287 16.9445 12.7425C17.4 13.1979 17.5857 13.7647 17.6701 14.3925C17.7501 14.9873 17.75 15.7365 17.75 16.635L17.75 21.937ZM4.82324 6.01025C4.82357 6.00998 4.82364 6.00985 4.82324 6.01025C4.82278 6.01071 4.82296 6.01059 4.82324 6.01025ZM9.25 15.687C9.25 15.2728 9.58579 14.937 10 14.937H14C14.4142 14.937 14.75 15.2728 14.75 15.687C14.75 16.1012 14.4142 16.437 14 16.437H10C9.58579 16.437 9.25 16.1012 9.25 15.687ZM9.25 18.687C9.25 18.2728 9.58579 17.937 10 17.937H14C14.4142 17.937 14.75 18.2728 14.75 18.687C14.75 19.1012 14.4142 19.437 14 19.437H10C9.58579 19.437 9.25 19.1012 9.25 18.687Z' fill='%23F6F6F6'/%3E%3C/svg%3E%0A");
}




.address_modal .name input,
.address_modal .phone input,
.address_modal .zip_code input,
.address_modal .city select,
.address_modal .country select {
    padding-left: 50px;
}

.address_modal .name::before,
.address_modal .phone::before,
.address_modal .zip_code::before,
.address_modal .city::before,
.address_modal .country::before {
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    left: 15px;
    top: 33px;
}

.address_modal .name::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='6.68701' r='4' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath opacity='0.5' d='M20 18.187C20 20.6723 20 22.687 12 22.687C4 22.687 4 20.6723 4 18.187C4 15.7017 7.58172 13.687 12 13.687C16.4183 13.687 20 15.7017 20 18.187Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3C/svg%3E%0A");
}

.address_modal .phone::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.00586 7.6201C5.04883 6.48661 5.70011 5.46125 6.53711 4.62424C7.93006 3.23129 10.1525 3.41845 11.0369 5.00318L11.6859 6.16611C12.2716 7.2156 12.0365 8.59234 11.114 9.51481M17.0662 19.6805C18.1997 19.6375 19.2251 18.9862 20.0621 18.1492C21.455 16.7563 21.2679 14.5338 19.6831 13.6494L18.5202 13.0004C17.4707 12.4147 16.094 12.6498 15.1715 13.5723' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath opacity='0.5' d='M5.00655 7.62012C4.93421 9.52825 5.41713 12.7687 8.6677 16.0193C11.9183 19.2699 15.1588 19.7528 17.0669 19.6805M15.1722 13.5723C15.1722 13.5723 14.0532 14.6912 12.0245 12.6625C9.99578 10.6338 11.1147 9.51483 11.1147 9.51483' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3C/svg%3E%0A");
}

.address_modal .zip_code::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='9' cy='9.68701' r='2' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M13 15.687C13 16.7916 13 17.687 9 17.687C5 17.687 5 16.7916 5 15.687C5 14.5824 6.79086 13.687 9 13.687C11.2091 13.687 13 14.5824 13 15.687Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M2 12.687C2 8.91578 2 7.03016 3.17157 5.85858C4.34315 4.68701 6.22876 4.68701 10 4.68701H14C17.7712 4.68701 19.6569 4.68701 20.8284 5.85858C22 7.03016 22 8.91578 22 12.687C22 16.4582 22 18.3439 20.8284 19.5154C19.6569 20.687 17.7712 20.687 14 20.687H10C6.22876 20.687 4.34315 20.687 3.17157 19.5154C2 18.3439 2 16.4582 2 12.687Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M19 12.687H15' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M19 9.68701H14' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M19 15.687H16' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.address_modal .city::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.5' d='M12 22.687V20.687' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M4 17.2493C5.88838 19.3592 8.63263 20.687 11.687 20.687C17.3827 20.687 22 16.0697 22 10.374C22 7.31964 20.6722 4.57539 18.5623 2.68701' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath opacity='0.5' d='M7 5.23964C7.58518 5.79226 8.79066 7.30277 8.93111 8.92381C9.06238 10.439 10.0268 11.6703 11.5 11.6869C12.0662 11.6933 12.6388 11.2692 12.6373 10.682C12.6368 10.5005 12.6079 10.3148 12.5627 10.144C12.4998 9.90649 12.4942 9.6332 12.625 9.35363C13.0824 8.37562 13.982 8.11291 14.6949 7.58176C15.0111 7.34619 15.2995 7.09769 15.4266 6.89752C15.7777 6.34489 16.1289 5.23964 15.9533 4.68701M13.291 17.687C13.0714 17.2732 12.764 16.1974 13.291 15.2043C13.9497 13.9629 16.1455 13.9629 16.1455 13.9629C17.837 13.9452 18.4469 13.1814 18.7334 12.5006M19 10.687C19 14.553 15.866 17.687 12 17.687C8.13401 17.687 5 14.553 5 10.687C5 6.82102 8.13401 3.68701 12 3.68701C15.866 3.68701 19 6.82102 19 10.687Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M10 22.687H14' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.address_modal .country::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7 1.93701C7.41421 1.93701 7.75 2.2728 7.75 2.68701V4.43701H8C8.01496 4.43701 8.02987 4.43701 8.04475 4.43701C8.47757 4.43696 8.8744 4.43691 9.19721 4.48031C9.55269 4.5281 9.92841 4.64055 10.2374 4.94958C10.5465 5.2586 10.6589 5.63432 10.7067 5.9898C10.7501 6.31262 10.7501 6.70945 10.75 7.14227C10.75 7.15714 10.75 7.17206 10.75 7.18701V8.56907C10.8169 8.62204 10.8818 8.67969 10.9445 8.74247C11.4 9.19794 11.5857 9.76474 11.6701 10.3925C11.7284 10.826 11.7442 11.3415 11.7484 11.937H12.25L12.25 8.39701C12.25 7.13866 12.2499 6.11 12.3656 5.32511C12.4856 4.51123 12.7528 3.78455 13.4336 3.31272C14.1145 2.84089 14.8887 2.84585 15.6929 3.01932C16.4684 3.1866 17.4316 3.54781 18.6098 3.98968L18.7057 4.02563C19.3012 4.24893 19.8051 4.43787 20.2009 4.63883C20.6219 4.85256 20.9859 5.11062 21.2603 5.50663C21.5347 5.90263 21.6486 6.33401 21.7009 6.80325C21.75 7.24447 21.75 7.78261 21.75 8.41859V21.937H22C22.4142 21.937 22.75 22.2728 22.75 22.687C22.75 23.1012 22.4142 23.437 22 23.437H2C1.58579 23.437 1.25 23.1012 1.25 22.687C1.25 22.2728 1.58579 21.937 2 21.937H2.25L2.25 12.635C2.24997 11.7365 2.24994 10.9873 2.32991 10.3925C2.41432 9.76474 2.59999 9.19794 3.05546 8.74247C3.11823 8.67969 3.18313 8.62204 3.25 8.56907V7.18701C3.25 7.17205 3.25 7.15714 3.25 7.14226C3.24995 6.70945 3.2499 6.31262 3.2933 5.9898C3.34109 5.63432 3.45354 5.2586 3.76256 4.94957C4.07159 4.64055 4.44731 4.5281 4.80279 4.48031C5.1256 4.43691 5.52243 4.43696 5.95525 4.43701C5.97012 4.43701 5.98504 4.43701 6 4.43701H6.25V2.68701C6.25 2.2728 6.58579 1.93701 7 1.93701ZM4.75 8.01113C5.33751 7.93696 6.07178 7.93698 6.94801 7.93701H7.05199C7.92822 7.93698 8.66249 7.93696 9.25 8.01113V7.18701C9.25 6.6944 9.24841 6.4004 9.22008 6.18968C9.20709 6.09312 9.1918 6.04476 9.18284 6.02298C9.18077 6.01793 9.17915 6.01462 9.17814 6.01268L9.17676 6.01025L9.17433 6.00887C9.1724 6.00786 9.16908 6.00625 9.16404 6.00417C9.14226 5.99521 9.09389 5.97992 8.99734 5.96694C8.78661 5.9386 8.49261 5.93701 8 5.93701H6C5.50739 5.93701 5.21339 5.9386 5.00266 5.96694C4.90611 5.97992 4.85774 5.99521 4.83596 6.00417C4.83092 6.00625 4.8276 6.00786 4.82567 6.00887L4.82324 6.01025L4.82186 6.01268C4.82085 6.01462 4.81923 6.01793 4.81716 6.02298C4.8082 6.04476 4.79291 6.09312 4.77992 6.18968C4.75159 6.4004 4.75 6.6944 4.75 7.18701V8.01113ZM3.75 21.937H6.25L6.25 16.635C6.24997 15.7365 6.24995 14.9873 6.32991 14.3925C6.41432 13.7647 6.59999 13.1979 7.05546 12.7425C7.51093 12.287 8.07773 12.1013 8.70552 12.0169C9.13855 11.9587 9.65344 11.9429 10.2482 11.9386C10.244 11.3684 10.23 10.9382 10.1835 10.5924C10.1214 10.1309 10.0142 9.93344 9.88388 9.80313C9.75357 9.67281 9.55607 9.56559 9.09461 9.50355C8.61157 9.4386 7.96401 9.43701 7 9.43701C6.03599 9.43701 5.38843 9.4386 4.90539 9.50355C4.44393 9.56559 4.24643 9.67281 4.11612 9.80313C3.9858 9.93344 3.87858 10.1309 3.81654 10.5924C3.75159 11.0754 3.75 11.723 3.75 12.687V21.937ZM7.75 21.937H16.25V16.687C16.25 15.723 16.2484 15.0754 16.1835 14.5924C16.1214 14.1309 16.0142 13.9334 15.8839 13.8031C15.7536 13.6728 15.5561 13.5656 15.0946 13.5035C14.6116 13.4386 13.964 13.437 13 13.437H11C10.036 13.437 9.38843 13.4386 8.90539 13.5035C8.44393 13.5656 8.24643 13.6728 8.11612 13.8031C7.9858 13.9334 7.87858 14.1309 7.81654 14.5924C7.75159 15.0754 7.75 15.723 7.75 16.687V21.937ZM17.75 21.937H20.25V8.45901C20.25 7.7718 20.2489 7.31776 20.2101 6.96939C20.1734 6.63973 20.1091 6.47894 20.0274 6.36102C19.9457 6.2431 19.8177 6.1265 19.5219 5.97635C19.2094 5.81767 18.7846 5.65724 18.1412 5.41594C16.8906 4.94698 16.0312 4.62679 15.3766 4.48559C14.7379 4.34784 14.468 4.42089 14.288 4.54561C14.108 4.67032 13.9448 4.89746 13.8496 5.54381C13.752 6.20631 13.75 7.12341 13.75 8.45901V11.9386C14.3455 11.9429 14.861 11.9586 15.2945 12.0169C15.9223 12.1013 16.4891 12.287 16.9445 12.7425C17.4 13.1979 17.5857 13.7647 17.6701 14.3925C17.7501 14.9873 17.75 15.7365 17.75 16.635L17.75 21.937ZM4.82324 6.01025C4.82357 6.00998 4.82364 6.00985 4.82324 6.01025C4.82278 6.01071 4.82296 6.01059 4.82324 6.01025ZM9.25 15.687C9.25 15.2728 9.58579 14.937 10 14.937H14C14.4142 14.937 14.75 15.2728 14.75 15.687C14.75 16.1012 14.4142 16.437 14 16.437H10C9.58579 16.437 9.25 16.1012 9.25 15.687ZM9.25 18.687C9.25 18.2728 9.58579 17.937 10 17.937H14C14.4142 17.937 14.75 18.2728 14.75 18.687C14.75 19.1012 14.4142 19.437 14 19.437H10C9.58579 19.437 9.25 19.1012 9.25 18.687Z' fill='%23F6F6F6'/%3E%3C/svg%3E%0A");
}

.w_560 {
    max-width: 560px !important;
    width: 100%;
}

.w_280 {
    max-width: 270px !important;
}

.w_50 {
    width: 48% !important;
}

.w_33 {
    width: 32% !important;
}

.w_40 {
    width: 38% !important;
}

.w_20 {
    width: 20% !important;
}

.save {
    font-size: 16px;
    font-weight: 600;
    background: #F6B439;
    padding: 23px 46px;
    border: none;
    border-radius: 14px;
    margin-top: 25px;
    margin-left: auto;
    display: block;
}


.profile_information .security {
    background: #1D1D1D;
    border-radius: 16px;
    padding: 16px 24px;
}

.security_content {
    width: 100%;
}

.security_holder {
    max-width: 418px;
    width: 100%;
    color: #f6f6f6;
    display: none;
    margin-top: 20px;
}

.security_holder.active {
    display: block;
}

.profile_information .security header h5,
.add_acc h5 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
}

.add_acc h5::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.06 12.3105C23.06 11.5305 22.99 10.7805 22.86 10.0605H12.5V14.3205H18.42C18.16 15.6905 17.38 16.8505 16.21 17.6305V20.4005H19.78C21.86 18.4805 23.06 15.6605 23.06 12.3105Z' fill='%234285F4' /%3E%3Cpath d='M12.4997 23.0606C15.4697 23.0606 17.9597 22.0806 19.7797 20.4006L16.2097 17.6306C15.2297 18.2906 13.9797 18.6906 12.4997 18.6906C9.63969 18.6906 7.20969 16.7606 6.33969 14.1606H2.67969V17.0006C4.48969 20.5906 8.19969 23.0606 12.4997 23.0606Z' fill='%2334A853' /%3E%3Cpath d='M6.34 14.1504C6.12 13.4904 5.99 12.7904 5.99 12.0604C5.99 11.3304 6.12 10.6304 6.34 9.97037V7.13037H2.68C1.93 8.61037 1.5 10.2804 1.5 12.0604C1.5 13.8404 1.93 15.5104 2.68 16.9904L5.53 14.7704L6.34 14.1504Z' fill='%23FBBC05' /%3E%3Cpath d='M12.4997 5.44055C14.1197 5.44055 15.5597 6.00055 16.7097 7.08055L19.8597 3.93055C17.9497 2.15055 15.4697 1.06055 12.4997 1.06055C8.19969 1.06055 4.48969 3.53055 2.67969 7.13055L6.33969 9.97055C7.20969 7.37055 9.63969 5.44055 12.4997 5.44055Z' fill='%23EA4335' /%3E%3C/svg%3E");
    width: 24px;
    height: 24px;
    display: inline-flex;
}

.profile_information .security header {
    border-bottom: 1px solid #FCE8C2;
    padding-bottom: 18px;
}

.security .remove,
.add_acc .add {
    display: flex;
    gap: 6px;
    align-items: center;
    font-size: 14px;
    font-weight: 500;
    border: none;
    background-color: unset;
    color: #f6f6f6;

}

.security_input_holder {
    width: 100%;
}

.security_input_holder label {
    font-size: 16px;
    font-weight: 600;
    display: block;
}

.security_input_holder input {
    background-color: unset;
    color: #f6f6f6;
    margin-top: 10px;
    border: none;
    font-size: 16px;
    font-weight: 500;
    width: 100%;
}

.security_input_item {
    display: flex;
    justify-content: space-between;
    background-color: unset;
    border: none;
}

.security_input_item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 18px;
}

.security_input_item .update_btn {
    background-color: unset;
    border: none;
    color: #F6F6F6;
    font-size: 14px;
    font-weight: 600;
}

.add_acc {
    display: flex;
    align-items: center;
    background: #1D1D1D;
    border-radius: 16px;
    margin-top: 14px;
    padding: 16px 23px;
    justify-content: space-between;

}


/* ============================== */
.message_center_page {
    display: flex;
    gap: 22px;
    margin-top: 33px;
    min-height: calc(100vh - 200px);
}

.message_center_page .message_center {
    display: flex;
    gap: 22px;
}

.message_center .messages {
    background: #111111;
    border-radius: 16px;
    padding: 15px 11px;
    width: 311px;
}

.message_center .messages .title {
    display: flex;
    gap: 6px;
    align-items: center;
    color: #F6F6F6;
    font-size: 16px;
    font-weight: 600;
}

.message_center .messages form {
    border: 1px solid #FFFFFF47;
    display: flex;
    gap: 11px;
    margin-top: 15px;
    padding: 14px 17px;
    border-radius: 8px;
}

.message_center .messages form input {
    width: 100%;
    height: 100%;
    background-color: unset;
    border: none;
    color: #fff;
}

.message_center .messages .messages_holder {
    display: block;
    height: calc(100vh - 290px);
    overflow-y: auto;
    overflow-x: hidden;
}

.message_center_chat {
    padding: 17px 15px;
    background: #111111;
    border-radius: 16px;
    width: 100%;
    max-width: 979px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.message_center_chat header {
    padding: 6px 17px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #1D1D1D;
    border-radius: 8px;
}

.message_center_chat header .user_info {
    display: flex;
    gap: 10px;
    font-size: 16px;
    font-weight: 600;
    color: #f6f6f6;
    align-items: center;
}

.message_center_chat header .user_info picture {
    position: relative;
}

.message_center_chat header .user_info picture img {
    position: relative;
    width: 50px;
    height: 50px;
    object-fit: cover;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.message_center_chat header .more {
    background-color: unset;
    border: none;
}

.message_center_chat .chat_body {
    margin-top: 5px;
    height: 100%;
    overflow-y: scroll;
}

.message_center_chat .chat_box_holder .chat_body .message_text {
    display: flex;
    gap: 10px;
    margin-top: 30px;
}

.package_status_chat .message_center_chat .chat_body .message_text {
    display: flex;
    align-items: start;
    gap: 6px;
}

.message_center_chat .chat_body .message_text img {
    width: 38px;
    height: 38px;
    object-fit: cover;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.message_center_chat .chat_body .message_text .user_name {
    font-size: 12px;
    font-weight: 600;
}

.message_center_chat .chat_body .message_text .user_name .time {
    color: #DCDFE3;
    font-weight: 500;
    padding-left: 15px;
    color: #fff;
}

.message_center_chat .chat_body .message_text .user_text {
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    margin-top: 8px;
    color: #fff;
}

.chat_box_holder {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    height: calc(100vh - 262px);
}

.message_center_chat .type_text {
    background: #1D1D1D;
    border-radius: 8px;
    padding: 6px 10px;
    display: flex;
    justify-content: space-between;
    height: 55px;
    margin-top: 20px;
}

.message_center_chat .type_text input {
    background-color: unset;
    height: 100%;
    width: 100%;
    color: #f6f6f6;
    border: none;
}

.message_center_chat .type_text .send {
    padding: 14px 30px;
    border-radius: 8px;
    border: none;
    background: #F6B439;
    font-size: 14px;
    font-weight: 600;
    transition: 0.4s;
}

.message_center_chat .type_text .send:hover {
    transform: scale(0.9);
}

.donate_now {
    padding: 22px 25px;
    background: #111111;
    box-shadow: 1px 4px 65px 0px #0000000F;
    border-radius: 16px;
    max-width: 777px;
    width: 100%;
}

.information {
    padding: 10px 6px;
    background: #1D1D1D;
    border-radius: 14px;
    margin-top: 26px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #f6f6f6;
}

.information .device_info .device_img {
    width: 203px;
    height: 102px;
    border-radius: 8px;
}

.information .device_info {
    display: flex;
    gap: 14px;
}

.information .user_info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.information .user_info span {
    font-size: 14px;
    font-weight: 600;
}

.information .user_info img {
    width: 55px;
    height: 55px;
    object-fit: cover;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}

.device_info_item {
    list-style: none;
}

.device_info_item .name {
    font-size: 24px;
    font-weight: 500;
}

.device_info_item .color_info {
    font-size: 19px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;

}

.device_info_item .color_info span {
    display: flex;
    align-items: center;
    gap: 10px;
}

.device_info_item .color_info .color {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #DAE1AE;
    display: inline-block;
}

.category {
    font-size: 19px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;
}

.device_info_item li:not(:first-child) {
    margin-top: 12px;
}

.donate_now_content .amount {
    display: grid;
    gap: 27px 14px;
    margin-top: 30px;
    list-style: none;
    color: #f6f6f6;
    font-size: 21px;
    font-weight: 500;
    grid-template-columns: repeat(5, 1fr);
    text-align: center;
}

.donate_now_content .amount li {
    border: 0.9px solid #1D1D1D;
    border-radius: 7px;
    padding: 14px 10px;
    max-width: 134px;
    width: 100%;
    display: block;
    transition: 0.3s;
}

.donate_now_content .amount li:hover {
    box-shadow: 0px 4px 96px 0px #F6B4395E;

}

.desired_amount {
    margin-top: 30px;
    width: 100%;
    position: relative;

}

.desired_amount::before {
    content: '';
    position: absolute;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='21' viewBox='0 0 20 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.8'%3E%3Ccircle opacity='0.5' cx='9.99935' cy='10.7591' r='8.33333' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M10 5.75928V15.7593' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M12.5 8.67611C12.5 7.52551 11.3807 6.59277 10 6.59277C8.61929 6.59277 7.5 7.52551 7.5 8.67611C7.5 9.8267 8.61929 10.7594 10 10.7594C11.3807 10.7594 12.5 11.6922 12.5 12.8428C12.5 13.9934 11.3807 14.9261 10 14.9261C8.61929 14.9261 7.5 13.9934 7.5 12.8428' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E%0A");
    right: 13px;
    bottom: 25px;
    width: 20px;
    height: 20px;
}

.desired_amount label {
    color: #DCDFE3;
    font-size: 16px;
    font-weight: 600;
}

.desired_amount input {
    display: block;
    width: 100%;
    background: #1D1D1D;
    border-radius: 14px;
    height: 70px;
    border: none;
    padding: 25px 15px;
    margin-top: 12px;
    color: #fff;
}



/* ========================================================================================= */

/* package_status_holder  */

.package_status_holder {
    margin-top: 35px;
    display: flex;
    gap: 40px;
    min-height: calc(100vh - 200px);
}

.package_status_information {
    background: #111111;
    border-radius: 16px;
    padding: 20px 30px;
    max-width: 50%;
    width: 100%;
}

.package_status_information .title {
    font-size: 20px;
    font-weight: 600;
    color: #F6F6F6;
}

.package_status_information .accept_package {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
}

.package_status_information .accept_package .yellow_button {
    padding: 20px 32px;
}

.package_status_information .accept_package p {
    color: #F6F6F6;
    font-size: 16px;
    font-weight: 500;
}

.package_status_information .accept_package p span {
    font-size: 26px;
    font-weight: 600;
    display: block;
    margin-top: 11px;
}

.info_category {
    margin-top: 15px;

}

.info_category ul {
    list-style: none;
    margin-top: 10px;
    font-size: 16px;
    font-weight: 500;
    color: #F6F6F6;
    width: 100%;

}

.info_category ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}

.info_category ul li span {
    font-weight: 600;

}

.package_status_chat {
    padding: 30px 20px;
    background: #111111;
    border-radius: 16px;
    max-width: 50%;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 30px;
    min-height: 100vh;
}

.package_status_map {
    border-radius: 16px;
    max-width: 637px;
    width: 100%;
    overflow: hidden;
}

.package_status_map img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.package_status_chat .chat_body .chat_box {
    margin-top: 5px;
    height: 100%;
    overflow-y: scroll;
}

.package_status_chat .status {
    font-size: 20px;
    font-weight: 600;
    color: #FFFFFF;
    text-align: center;
}

.package_status_chat .status span {
    color: #F6B439;
    margin-left: 30px;
}

.package_status_chat .chat_body {
    background: #FFFFFF;
    border-radius: 16px;
    padding: 20px 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
    height: 100vh;
}

.package_status_chat .chat_body .message_text {
    background: #D7D7D7;
    padding: 5px 10px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
}

.chat_body .message_text.user {
    flex-direction: row-reverse;
    margin-left: auto;
}

.chat_body .message_text img {
    width: 50px;
    height: 50px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    object-fit: cover;
}

.chat_body .message_text p {
    font-size: 14px;
    font-weight: 500;
    color: #000000;

}

.chat_body form {
    background: #D9D9D9;
    border-radius: 15px;
    height: 43px;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.chat_body form input {
    width: 100%;
    height: 100%;
    background-color: unset;
    border: none;
}



/* ====================================================================================== */

/* button_holder_type3 */

.button_holder_type3 {
    display: flex;
    gap: 25px;
    justify-content: center;
    align-items: center;
    margin-top: 28px;
}

.button_holder_type3 button {
    border-radius: 14px;
    padding: 20px 55px;
    font-size: 16px;
    font-weight: 600;
    color: #f6f6f6;
    background-color: unset;
    border: none;
    transition: 0.3s;
}

.button_holder_type3 button:hover {
    transform: scale(1.1);
}

.button_holder_type3 .next_btn {
    background: #F6B439;
    color: #000;
}


/* ======================================================================================================= */

/* modals style */

.modal {
    display: block;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 1;
    padding: 30px;
    left: 0;
    top: 0;
    z-index: 111111;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
}

.modal_holder {
    background: #111111;
    box-shadow: 1px 4px 65px 0px #0000000F;
    padding: 18px 22px;
    width: 100%;
    border-radius: 16px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    overflow-y: auto;
    max-height: 90%;
    display: none;
}

.modal_holder header .title {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
}

.close {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: #c8c8c8;
    text-decoration: none;
    cursor: pointer;
}

.modal_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.modal_header .title {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
}


/* add story uploaded modal */

.add_story_uploaded {
    background: #1D1D1D;
    padding: 13px;
    border-radius: 8px;
    position: relative;
    margin-top: 25px;
}

.add_story_uploaded img {
    width: 100%;
    height: 430px;
    object-fit: cover;

}

.add_story_uploaded .user_info {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    font-size: 10px;
    color: #F6F6F6;
    position: absolute;
    top: 24px;
    left: 26px;
}

.add_story_uploaded .user_info img {
    width: 28px;
    height: 28px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    object-fit: cover;
}

.add_story_uploaded_holder {
    max-width: 310px;
}

.add_story_uploaded_content .size_range input {
    width: 160px;
}

.progress_holder {
    background-color: #3737377d;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
}

.add_story_uploading {
    max-width: 213px;
    width: 100%;
    display: block;
    height: 3px;
    border-radius: 20px;
    overflow: hidden;
}

progress::-webkit-progress-bar {
    background-color: #686868;
}

progress::-webkit-progress-value {
    background-color: #EAEAEA;
}

.add_story_uploaded_action {
    margin-top: 20px;
    padding: 0 23px;
}

.size_range {
    position: relative;
    width: fit-content;
    display: block;
    margin: auto;
    width: 74%;
}

.size_range::before {
    content: '';
    position: absolute;
    left: -30px;
    height: 18px;
    width: 18px;
    top: 0;
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='19' viewBox='0 0 18 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 9.5C1.5 5.96447 1.5 4.1967 2.59835 3.09835C3.6967 2 5.46447 2 9 2C12.5355 2 14.3033 2 15.4016 3.09835C16.5 4.1967 16.5 5.96447 16.5 9.5C16.5 13.0355 16.5 14.8033 15.4016 15.9016C14.3033 17 12.5355 17 9 17C5.46447 17 3.6967 17 2.59835 15.9016C1.5 14.8033 1.5 13.0355 1.5 9.5Z' stroke='%23F6F6F6' stroke-width='1.22727'/%3E%3Ccircle opacity='0.5' cx='12' cy='6.5' r='1.5' stroke='%23F6F6F6' stroke-width='1.22727'/%3E%3Cpath opacity='0.5' d='M1.5 9.8751L2.81369 8.72563C3.49714 8.12762 4.52721 8.16192 5.16936 8.80407L8.38666 12.0214C8.90208 12.5368 9.71343 12.6071 10.3098 12.1879L10.5335 12.0308C11.3916 11.4277 12.5527 11.4975 13.3324 12.1992L15.75 14.3751' stroke='%23F6F6F6' stroke-width='1.22727' stroke-linecap='round'/%3E%3C/svg%3E%0A");
}

.size_range::after {
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.08398 12.4997C2.08398 7.58921 2.08398 5.13398 3.60947 3.60849C5.13496 2.08301 7.59019 2.08301 12.5007 2.08301C17.4111 2.08301 19.8663 2.08301 21.3918 3.60849C22.9173 5.13398 22.9173 7.58921 22.9173 12.4997C22.9173 17.4101 22.9173 19.8654 21.3918 21.3909C19.8663 22.9163 17.4111 22.9163 12.5007 22.9163C7.59019 22.9163 5.13496 22.9163 3.60947 21.3909C2.08398 19.8654 2.08398 17.4101 2.08398 12.4997Z' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Ccircle opacity='0.5' cx='16.6673' cy='8.33333' r='2.08333' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath opacity='0.5' d='M2.08398 13.0213L3.90855 11.4248C4.85779 10.5942 6.28844 10.6419 7.18032 11.5338L11.6488 16.0022C12.3647 16.7181 13.4915 16.8157 14.3198 16.2336L14.6304 16.0153C15.8224 15.1776 17.435 15.2747 18.5178 16.2492L21.8757 19.2713' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
    content: '';
    position: absolute;
    right: -35px;
    height: 25px;
    width: 25px;
    display: inline-block;
    top: -4px;
}

.add_story_uploaded_action .button_holder,
.add_story_tag_product .button_holder {
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;
}

.add_story_uploaded_action .button_holder button,
.add_story_tag_product .button_holder button {
    width: 96px;
    padding: 12px 5px;
    border-radius: 14px;
    font-size: 10px;
    font-weight: 500;
    border: none;
    background-color: unset;
    color: #F6F6F6;
    border: 1px solid #1D1D1D;
    transition: 0.3s;
}


.add_story_uploaded_action .button_holder button:hover,
.add_story_tag_product .button_holder button:hover {
    transform: scale(1.1);
}

.add_story_uploaded_action .button_holder button:first-child,
.add_story_tag_product .button_holder button:first-child {
    background-color: #F6B439;
    color: #000;
    border: 1px solid #F6B439
}


/* upload image modal */
.modal_holder.upload_image {
    max-width: 440px;
    width: 100%;
}

.upload_image_holder {
    margin-top: 38px;
    border-radius: 14px;
    padding: 154px 24px;
}

.upload_image_holder h4 {
    font-size: 20px;
    font-weight: 600;
}

.upload_img_btn {
    background: #F6B439;
    border-radius: 14px;
    border: none;
    padding: 15px 30px;
    font-size: 13px;
    font-weight: 700;
    transition: 0.3s;
    z-index: 1111;
}

.upload_img_btn:hover {
    transform: scale(1.1);
}

/* add story tag product */
.add_story_tag_product_holder {
    max-width: 478px;
}

.add_story_tag_product {
    margin-top: 30px;
    color: #F6F6F6;
}

.add_story_tag_product h4 {
    font-size: 16px;
    font-weight: 600;
}

.add_story_tag_product .explain {
    font-size: 12px;
    font-weight: 500;
    display: block;
    margin-top: 11px;
}

.add_story_tag_product table {
    border-collapse: collapse;
    width: 100%;
    margin-top: 15px;
}

.add_story_tag_product table td {
    padding: 15px 10px;
    text-align: left;
    font-size: 12px;
    font-weight: 500;
}

.add_story_tag_product table .product_title {
    font-size: 14px;
    font-weight: 600;
}

.add_story_tag_product table td {
    border-bottom: 1px solid #1D1D1D
}


/* add post description */
.add_post_description {
    max-width: 653px;
}

.add_post_description form {
    margin-top: 30px;
    width: 100%;
}

.add_post_description form label {
    font-size: 12px;
    font-weight: 500;
    color: #F6F6F6;
}

.add_post_description form textarea {
    display: block;
    width: 100%;
    background: #1D1D1D;
    border-radius: 14px;
    border: none;
    margin-top: 8px;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: #F6F6F6;
    text-align: left;
    padding: 20px 14px;
    resize: none;
}

.add_post_description form .add_photo {
    width: 150px;
    height: 43px;
    margin-top: 18px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    background: #30250A;
    font-size: 12px;
    font-weight: 700;
    color: #F6B439;
    border: none;
}

.add_post_description form .add_photo:hover svg {
    transform: scale(1.2);
}

.add_post_description form .add_photo svg {
    transition: 0.3s;
}

.add_post_description .button_holder_type3 {
    margin-top: 30px;
}

.add_post_description .button_holder_type3 button {
    padding: 15px 58px;
}

/* add post _ add photo */

.add_post_add_photo {
    max-width: 900px;
    width: 100%;
}

.add_post_add_photo .button_holder_type3 button {
    padding: 15px 56px;
}

.add_post_add_photo_upload {
    width: 100%;
    height: 508px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #1D1D1D;
    border-radius: 8px;
    margin-top: 20px;
}

.add_post_add_photo_upload h5 {
    font-size: 20px;
    font-weight: 600;
}

.add_post_add_photo_upload p {
    font-size: 14px;
    font-weight: 500;
}

.add_post_add_photo_upload button {
    background: #F6B439;
    border-radius: 12px;
    padding: 16px;
    border: none;
    font-size: 13px;
    font-weight: 700;
    transition: 0.4s;
}

.add_post_add_photo_upload button:hover {
    transform: scale(1.1);
}


/* add post modal */
.add_post {
    max-width: 900px;
}

.add_post_content {
    display: flex;
    justify-content: center;
    gap: 18px;
    min-height: 480px;
    padding: 18px;
}

.add_post_content .left_section img {
    width: 480px;
    height: 240px;
    margin: 80px auto;
}

.add_post .left_section .button_holder {
    display: flex;
    gap: 8px;
    justify-content: center;
}

.add_post .left_section {
    background: #1D1D1D;
    border-radius: 8px;
    padding: 17px;
}

.add_post .left_section .button_holder button {
    background: #30250A;
    color: #F6B439;
    border-radius: 14px;
    border: none;
    width: 150px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.add_post .left_section .button_holder button svg,
.add_post .right_section .button_holder button svg {
    transition: 0.3s;

}

.add_post .left_section .button_holder button:hover svg,
.add_post .right_section .button_holder button:hover svg {
    transform: scale(1.2);
}

.add_post .right_section {
    background: #1D1D1D;
    padding: 15px;
    border-radius: 8px;
    max-width: 480px;
    width: 100%;
    position: relative;
}

.add_post .gallery_content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.add_post .right_section .gallery img {
    width: 100%;
    height: 65px;
}

.add_post .right_section .gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 20px;
}

.add_post .right_section .gallery .number {
    font-size: 10px;
    font-weight: 500;
    color: #F6F6F6;
    position: absolute;
    top: 0;
}

.add_post .right_section .gallery {
    position: relative;
    padding-top: 30px;
}


.add_post .right_section .gallery div {
    padding: 30px 0;
    border-radius: 8px;
    position: relative;
}

.add_post .right_section .gallery div.active {
    border: 2px solid #F6B439;
}

.add_post .right_section .gallery div:after {
    content: attr(data-number);
    display: inline-block;
    position: absolute;
    color: #F6F6F6;
    bottom: -17px;
    left: 5px;
    font-size: 10px;
    font-weight: 500;
}

.add_post .right_section .button_holder {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: center;
}

.add_post .right_section .button_holder button {
    width: 48px;
    height: 48px;
    border-radius: 6px;
    border: none;
}

.add_post .right_section .button_holder button:first-child {
    background: #37201D;
}

.add_post .right_section .button_holder button:last-child {
    background: #30250A;

}

.add_post_upload {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.add_post_upload h4 {
    font-size: 16px;
    font-weight: 600;
}

.add_post_upload p {
    font-size: 11px;
    font-weight: 500;
}

.add_post_upload button {
    background: #F6B439;
    border-radius: 14px;
    border: none;
    padding: 13px;
    font-size: 10px;
    font-weight: 700;
    transition: 0.3s;
}

.add_post_upload button:hover,
.photo_size .load:hover {
    transform: scale(1.1);
}

.add_post_upload .back {
    position: absolute;
    top: 23px;
    left: 23px;
}

.add_post_right_section_content {
    display: none !important;
}

.add_post_right_section_content.active {
    display: flex !important;
}

.add_post_tag_product {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.add_post_tag_product .back,
.photo_size .back {
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 12px;
    font-weight: 600;
    color: #F6F6F6;
    text-decoration: none;
}

.add_post_tag_product .text {
    font-size: 12px;
    font-weight: 400;
    margin-top: 15px;
    color: #F6F6F6;
}

.add_post_tag_product form {
    margin-top: 12px;
    border: 1px solid #FFFFFF47;
    border-radius: 8px;
    height: 36px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px;
    position: relative;
    padding-left: 40px;
}

.add_post_tag_product form::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='7.6875' cy='7.6875' r='5.9375' stroke='%23F6F6F6' stroke-width='1.5' /%3E%3Cpath d='M12.0625 12.0625L14.25 14.25' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round' /%3E%3C/svg%3E");
    width: 15px;
    height: 15px;
    position: absolute;
    left: 11px;
}

.add_post_tag_product form input {
    height: 100%;
    background-color: unset;
    border: none;
    width: 100%;
    color: #fff;
}

.add_post_tag_product .search_items {
    margin-top: 12px;
    list-style: none;
}

.add_post_tag_product .search_items li {
    margin-top: 16px;
    display: block;
    color: #F6F6F6;
    padding: 8px 10px;
}

.add_post_tag_product .search_items li.active {
    background: #111111;
    border-radius: 4px;
}

.add_post_tag_product .search_items li h6 {
    font-size: 12px;
    font-weight: 500;
}

.add_post_tag_product .search_items li p {
    font-size: 10px;
    font-weight: 500;
    margin-top: 6px;
}

.add_tag_btn {
    width: 100%;
    border-radius: 14px;
    padding: 8px;
    border: none;
    font-size: 10px;
    background: #F6B439;
    transition: 0.3s;
    font-weight: 600;
}

.add_tag_btn:hover {
    transform: scale(1.05);
}

.photo_size {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.photo_size .load {
    width: 40px;
    height: 40px;
    background: #30250A;
    border-radius: 5px;
    border: none;
    margin: 17px 0 17px 0;
    transition: 0.4s;
}



/* view story */
.view_story {
    max-height: 780px;
    height: 100%;
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 90%;
    max-width: 438px;
    width: 100%;
}


.stories img,
.stories {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.stories .owl-stage-outer,
.stories .owl-stage,
.stories .owl-item,
.stories .stories_item {
    height: 100%;

}

.stories .stories_item {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
}

.stories .stories_item .device_info {
    background: #1D1D1D;
    padding: 11px 32px;
    position: absolute;
    bottom: 0;
    width: 100%;
    display: none;
    align-items: center;
    justify-content: space-between;
}

.stories .user_info {
    display: flex;
    align-items: center;
    gap: 13px;
    font-size: 16px;
    font-weight: 500;
    color: #F6F6F6;
    position: absolute;
    top: 28px;
    left: 14px;
}

.stories .user_info img {
    width: 42px;
    height: 42px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    object-fit: cover;
}

.stories .device_info_list {
    list-style: none;
    color: #F6F6F6;
}

.stories .device_info_list_img img {
    width: 111px;
    height: 56px;
    border-radius: 8px;
}

.stories .device_info_list_name {
    font-size: 15px;
    font-weight: 500;
    margin-top: 14px;
}

.device_info_list_price {
    font-size: 12px;
    font-weight: 500;
    margin-top: 8px;
    display: flex;
    gap: 10px;
    align-items: end;
}

.stories .stories_item .device_info button {
    padding: 9px 13px;
    border-radius: 8px;
    background: #F6B439;
    font-size: 10px;
    font-weight: 500;
    border: none;
}


.progress-container {
    position: absolute;
    top: 10px;
    width: 100%;
}

.progress {
    height: 2px;
    flex-grow: 1;
    border-radius: 4px;
    margin: 0 5px;
    display: flex;
    background-image: -webkit-linear-gradient(left,
            rgba(255, 255, 255, .5) 0%,
            #F6B439 50%,
            rgba(88, 89, 104, .5) 50.001%,
            rgba(88, 89, 104, .5) 100%);
    background-repeat: no-repeat;
    background-size: 200%;
    background-color: #666;
    background-position: 100% 50%;
    animation-timing-function: linear;
    animation-delay: .2s;
}

.progress.active {
    animation-name: Loader;
}

.progress.passed {
    background-position: 0 0;
}

@-webkit-keyframes Loader {
    0% {
        background-position: 100% 0;
    }

    100% {
        background-position: 0 0;
    }
}


/* add address modal */
.add_addres_modal {
    max-width: 1186px;
    display: block;
}

.add_addres_modal .map_holder_modal {
    margin-top: 30px;
    position: relative;
}

.add_addres_modal .map_holder_modal img {
    height: auto;
    width: 100%;
    object-fit: cover;
}

.add_addres_enter_location {
    position: absolute;
    background: #FCE8C2;
    border-radius: 14px;
    padding: 20px 40px;
    font-size: 16px;
    font-weight: 600;
    top: 30px;
    left: 30px;
    border: none;
}

/* add_addres_info_modal */
.add_addres_info_modal,
.enter_location_modal {
    max-width: 665px;
    display: block;
}

.add_addres_info_modal label {
    font-size: 14px;
    color: #c7c7c7;
}

.add_addres_info_form {
    margin-top: 6px;
}


.add_addres_modal .distance {
    display: flex;
    gap: 18px;
    align-items: center;
    margin-top: 30px;
}

.add_addres_info_form .input_holder {
    margin-top: 22px;
    max-width: none;
    width: 100%;
}

.enter_location_location_info {
    display: flex;
    justify-content: space-between;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.enter_location_location_info p {
    background: #111111;
    border-radius: 14px;
    padding: 23px 13px;
    margin-bottom: 15px;
    margin-left: 33px;
}


/* enter_location_form */

.enter_location_form {
    background: #1D1D1D;
    padding: 15px 28px;
    border-radius: 14px;
    margin-top: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 60px;
    position: relative;
}

.enter_location_form::before {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11.5' cy='11.5' r='9.5' stroke='%23F6F6F6' stroke-width='1.5'/%3E%3Cpath d='M18.5 18.5L22 22' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E%0A");
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    left: 28px;
}

.enter_location_form button {
    background-color: unset;
    border: none;
}

.enter_location_form input {
    width: 100%;
    height: 100%;
    background-color: unset;
    border: none;
    color: #fff;
}


/* search_results */
.search_results {
    margin-top: 23px;
}

.search_results .title {
    font-size: 16px;
    font-weight: 700;
    color: #F5F5F5;

}

.search_results_items {
    margin-top: 23px;
    list-style: none;
}

.search_results_items li,
.enter_location_location_info p {
    font-size: 16px;
    font-weight: 700;
    color: #F5F5F5;
    display: flex;
    align-items: center;
    gap: 18px;
}

.search_results_items li {
    margin-top: 15px;
}

.search_results_items li::before,
.enter_location_location_info p::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='27' height='33' viewBox='0 0 27 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.4987 0.666504C6.50309 0.666504 0.832031 7.00393 0.832031 14.1248C0.832031 21.1899 4.87479 28.8695 11.1824 31.8177C12.6528 32.505 14.3446 32.505 15.815 31.8177C22.1226 28.8695 26.1654 21.1899 26.1654 14.1248C26.1654 7.00393 20.4943 0.666504 13.4987 0.666504ZM13.4987 16.4998C15.2476 16.4998 16.6654 15.0821 16.6654 13.3332C16.6654 11.5843 15.2476 10.1665 13.4987 10.1665C11.7498 10.1665 10.332 11.5843 10.332 13.3332C10.332 15.0821 11.7498 16.4998 13.4987 16.4998Z' fill='%23F6F6F6'/%3E%3C/svg%3E%0A");
    display: inline-block;
    width: 25px;
    height: 31px;
    background-size: contain;
    background-repeat: no-repeat;
}

/* address modal */
.address_modal {
    box-shadow: 1px 4px 65px 0px #0000000F;
    background: #111111;
    border-radius: 16px;
    max-width: 1186px;
    width: 100%;
    display: block;
}

.address_modal .yellow_button {
    width: fit-content;
    display: block;
    margin: 26px auto;
    font-size: 16px;
    padding: 23px 80px;
    transition: 0.3s;
}

.address_modal .yellow_button:hover {
    transform: scale(1.1);
}

.address_modal form {
    margin-top: 30px;
    width: 100%;
    display: flex;
    gap: 16px 20px;
    flex-wrap: wrap;
}

.address_modal form .input_holder {
    max-width: unset;
    flex: auto;
}

.address_modal form .input_holder label {
    color: #a0a0a0;
}

.security_modal {
    max-width: 743px;
    width: 100%;
}

.security_modal .button_holder_type3 button {
    padding: 20px 40px;
}

.security_modal .title {
    font-size: 24px;
    font-weight: 600;
    color: #f6f6f6;
}

.security_modal .security_description {
    font-size: 20px;
    font-weight: 400;
    margin-top: 27px;
    color: #f6f6f6;

}

.security_modal form {
    margin-top: 30px;
    position: relative;
}

.security_modal form .input_holder {
    max-width: 396px;
    margin-top: 25px;
}

.security_modal form .input_holder label {
    font-size: 14px;
    color: #a0a0a0;
}

.security_modal form .input_holder .see {
    background-color: unset;
    border: none;
    position: absolute;
    right: 15px;
    top: 38px;
}

/* ================================================================================================== */
/* map styles */

.info_label {
    background: #F6B539;
    border-radius: 9px;
    padding: 13px 16px;
    font-size: 20px;
    font-weight: 600;
    display: block;
    width: fit-content;
}

.driver_distance {
    margin: 20px auto;
}

.delivery_type:after {
    content: '';
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg width='28' height='29' viewBox='0 0 28 29' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.5' d='M1.54176 14.621L2.41483 14.6792L1.54176 14.621ZM1.27768 18.5823L0.404617 18.5241L1.27768 18.5823ZM26.7225 18.5823L27.5956 18.5241L26.7225 18.5823ZM26.4591 14.6308L25.586 14.689V14.689L26.4591 14.6308ZM23.2457 11.3174L23.1702 12.1891L23.2457 11.3174ZM4.74413 11.3116L4.82081 12.1833L4.74413 11.3116ZM5.32156 4.13627L6.16289 4.37665L5.32156 4.13627ZM22.6786 4.13627L23.52 3.89589V3.89588L22.6786 4.13627ZM11.837 16.1489C11.3537 16.1489 10.962 16.5406 10.962 17.0239C10.962 17.5071 11.3537 17.8989 11.837 17.8989V16.1489ZM16.1632 17.8989C16.6465 17.8989 17.0382 17.5071 17.0382 17.0239C17.0382 16.5406 16.6465 16.1489 16.1632 16.1489V17.8989ZM14.8751 1.52148C14.8751 1.03824 14.4833 0.646484 14.0001 0.646484C13.5168 0.646484 13.1251 1.03824 13.1251 1.52148H14.8751ZM11.837 4.25169C11.3537 4.25169 10.962 4.64344 10.962 5.12669C10.962 5.60994 11.3537 6.00169 11.837 6.00169V4.25169ZM16.1632 6.00169C16.6465 6.00169 17.0382 5.60994 17.0382 5.12669C17.0382 4.64344 16.6465 4.25169 16.1632 4.25169V6.00169ZM3.39103 21.7107V24.9553H5.14103V21.7107H3.39103ZM10.1883 24.9553V21.7107H8.43832V24.9553H10.1883ZM6.78968 28.354C8.6667 28.354 10.1883 26.8324 10.1883 24.9553H8.43832C8.43832 25.8659 7.7002 26.604 6.78968 26.604V28.354ZM3.39103 24.9553C3.39103 26.8324 4.91266 28.354 6.78968 28.354V26.604C5.87916 26.604 5.14103 25.8659 5.14103 24.9553H3.39103ZM17.8119 21.7107V24.9553H19.5619V21.7107H17.8119ZM24.6092 24.9553V21.7107H22.8592V24.9553H24.6092ZM21.2105 28.354C23.0875 28.354 24.6092 26.8324 24.6092 24.9553H22.8592C22.8592 25.8659 22.121 26.604 21.2105 26.604V28.354ZM17.8119 24.9553C17.8119 26.8324 19.3335 28.354 21.2105 28.354V26.604C20.3 26.604 19.5619 25.8659 19.5619 24.9553H17.8119ZM0.668702 14.5628L0.404617 18.5241L2.15074 18.6405L2.41483 14.6792L0.668702 14.5628ZM4.8749 23.3023H23.1253V21.5523H4.8749V23.3023ZM27.5956 18.5241L27.3321 14.5726L25.586 14.689L25.8494 18.6405L27.5956 18.5241ZM23.3213 10.4456C16.8926 9.8886 11.1505 9.86972 4.66746 10.44L4.82081 12.1833C11.1987 11.6222 16.8389 11.6405 23.1702 12.1891L23.3213 10.4456ZM27.3321 14.5726C27.1878 12.4075 25.5064 10.635 23.3213 10.4456L23.1702 12.1891C24.4718 12.3019 25.4976 13.3621 25.586 14.689L27.3321 14.5726ZM23.1253 23.3023C25.7169 23.3023 27.768 21.11 27.5956 18.5241L25.8494 18.6405C25.9545 20.2163 24.7046 21.5523 23.1253 21.5523V23.3023ZM0.404617 18.5241C0.232224 21.11 2.28326 23.3023 4.8749 23.3023V21.5523C3.29558 21.5523 2.04569 20.2163 2.15074 18.6405L0.404617 18.5241ZM2.41483 14.6792C2.50309 13.3553 3.52416 12.2973 4.82081 12.1833L4.66746 10.44C2.48646 10.6318 0.812662 12.4034 0.668702 14.5628L2.41483 14.6792ZM4.0258 11.8564L6.16289 4.37665L4.48022 3.89589L2.34314 11.3757L4.0258 11.8564ZM8.78805 2.39648H19.2121V0.646484H8.78805V2.39648ZM21.8373 4.37665L23.9744 11.8564L25.6571 11.3757L23.52 3.89589L21.8373 4.37665ZM19.2121 2.39648C20.4311 2.39648 21.5024 3.20456 21.8373 4.37665L23.52 3.89588C22.9704 1.97252 21.2125 0.646484 19.2121 0.646484V2.39648ZM6.16289 4.37665C6.49777 3.20457 7.56907 2.39648 8.78805 2.39648V0.646484C6.78772 0.646484 5.02975 1.97253 4.48022 3.89589L6.16289 4.37665ZM11.837 17.8989H16.1632V16.1489H11.837V17.8989ZM13.1251 1.52148V5.12669H14.8751V1.52148H13.1251ZM11.837 6.00169H14.0001V4.25169H11.837V6.00169ZM14.0001 6.00169H16.1632V4.25169H14.0001V6.00169Z' fill='black'/%3E%3C/svg%3E%0A");
    display: inline-flex;
}

.delivery_type {
    display: flex;
    align-items: center;
    gap: 10px;
}

.finish {
    position: absolute;
    bottom: 52px;
    left: 50%;
    transform: translateX(-50%);
    padding: 22px 75px;
}

.gps {
    background-color: #111;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    margin-left: auto;
    display: block;
    margin-right: 40px;
    margin-bottom: 30px;
}

.details {
    background: #E2E2E2;
    border-radius: 21px 21px 21px 0px;
    padding: 14px 20px;
    width: fit-content;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 257px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.details ul {
    font-size: 16px;
    font-weight: 500;
    color: #161616;
    list-style: none;
}

.details ul li {
    display: flex;
    gap: 35px;
    margin-top: 15px;
    text-align: center;
    font-weight: 600;
    justify-content: center;
}

.details .details_btn {
    background: #F6B439;
    font-family: Gilroy;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    letter-spacing: 0em;
    text-align: center;
    color: #161616;
    border-radius: 6px;
    border: none;
    padding: 10px 25px;
    margin: auto;
    margin-top: 15px;
    display: block;
}


.map_holder_header {
    display: flex;
    justify-content: space-between;
    padding: 28px 40px;
    backdrop-filter: blur(10px);

}

.map_holder_header .title {
    font-size: 24px;
    font-weight: 600;
    color: #F6F6F6;
    text-align: center;
}

.map_holder_container {
    position: absolute;
    top: 0;
    width: 100%;
}

.map_holder_footer {
    padding: 30px 20px;
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.map_holder_footer_container {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.map_holder_footer .left_section {
    display: flex;
    gap: 25px;
}

.map_holder_footer .left_section .user_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.map_holder_footer .left_section .user_info img {
    width: 50px;
    height: 50px;
    clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
    object-fit: cover;
}

.map_holder_footer .left_section .user_info span {
    font-size: 14px;
    font-weight: 600;
    color: #f6f6f6;
    margin-top: 8px;
}

.map_holder_footer .left_section .device_info_item {
    color: #f6f6f6;

}



.switch {
    position: relative;
    display: inline-block;
    width: 53px;
    height: 29px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 19px;
    width: 19px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.slider {
    background-color: #F6B439;
}

input:focus+.slider {
    box-shadow: 0 0 1px #F6B439;
}

input:checked+.slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

.switch_label {
    font-size: 20px;
    font-weight: 600;
    color: #F6F6F6;
}

.map_holder_header form {
    display: flex;
    align-items: center;
    gap: 18px;
}


.right_section .price {
    color: #FFFFFF;
    font-size: 20px;
    font-weight: 800;
    padding-right: 40px;
}

.map_holder.order_selection .title {
    text-align: center;
    width: 100%;

}


.map_holder {
    margin-top: 25px;
    border-radius: 16px;
    width: 100%;
    overflow: hidden;
    position: relative;
    min-height: calc(100vh - 160px);
    display: grid;
    padding: 0 !important;
}

.map_holder img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}




.order_selection_footer {
    position: absolute;
    bottom: 40px;
    display: block;
    font-size: 24px;
    font-weight: 500;
    color: #f6f6f6;
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding-left: 40px;
}



/* rules */
.rules_holder {
    margin-top: 30px;
    list-style: none;
    display: none;
}

.rules_holder.active {
    display: block;
}

.rules_holder .rule_item {
    margin-top: 16px;
}

.rules_holder .rule_item h6 {
    font-size: 16px;
    font-weight: 600;
    color: #f6f6f6
}

.rules_holder .rule_item p {
    font-size: 14px;
    font-weight: 400;
    color: #d1d1d1;
    line-height: 24px;
    margin-top: 16px;
}








.acc_questions_holder {
    display: none;
}

.acc_questions_holder.active {
    display: block;
}


.questions_accordion_btn {
    border: 1px solid #1D1D1D;
    padding: 19px 50px 19px 15px;
    border-radius: 8px;
    margin-top: 16px;
    position: relative;
    transition: 0.3s;

}

.questions_accordion_btn.active_acc {
    background: #1D1D1D;
}

.questions_accordion_title {
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 10px;
    color: #F6F6F6;
}

.active_acc .questions_accordion_title {
    color: #F6B439;
    font-weight: 600;
}


.active_acc .questions_accordion_content {
    max-height: 100vh;
}

.questions_accordion_content {
    transition: max-height 0.5s ease-in-out;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #cbc8c8;
    max-height: 0;
    overflow: hidden;
}

.questions_accordion_content p {
    margin-top: 15px;
}

.questions_accordion_btn::before {
    content: '';
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19 9.06055L12 15.0605L5 9.06055' stroke='%23F6F6F6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
    position: absolute;
    right: 20px;
    width: 24px;
    height: 24px;
    text-align: center;
    border-radius: 6px;
    transition: 0.3s;
}

.questions_accordion_btn.active_acc::before {
    content: '-';
    transform: rotate(180deg);
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19 9.06055L12 15.0605L5 9.06055' stroke='%23F6B439' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ============================================================= */

/* Register */
.login_container {
    width: 100%;
    height: 100%;
    background-color: #000000;
    padding: 53px 10px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 100vh;
}

.login_container_content {
    display: flex;
    justify-content: space-around;
    align-items: center;
    max-width: 1230px;
    width: 100%;
    margin-top: 30px;
    margin-right: auto;
    margin-left: auto;
    gap: 20px;
}

.login_container header {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 38px;
    font-weight: 600;
    color: #FFFFFF;
    gap: 14px;

}

.login_left_section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    max-width: 505px;
    width: 100%;
}

.login_left_section img{
    margin: auto;
    display: block;
    width: 100%;
}

.login_right_section {
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 15px;
    max-width: 357px;
    width: 100%;
}

.login_left_section .text {
    font-size: 30px;
    font-weight: 700;
    line-height: 54px;
    letter-spacing: 0em;
    text-align: center;
    font-size: 30px;
    font-weight: 500;
    color: #f6f6f6;
    margin-top: 58px;
}

.login_left_section .text span {
    color: #F6B439;
    font-weight: 700;
}

.login_right_section.login_button_holder a {
    padding: 24px;
    max-width: 385px;
    width: 100%;
    display: block;
    margin: auto;
    border-radius: 14px;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    transition: 0.3s;
    text-align: center;
}

.login_right_section.login_button_holder a:hover,
.regist_with_google:hover,
.login_right_section .login_btn:hover {
    transform: scale(1.1);
}

.login_right_section.login_button_holder a:first-child {
    background: #F6B439;
    color: #000;
}

.login_right_section .form_title {
    font-size: 32px;
    font-weight: 600;
    color: #FFFFFF;
}

.login_right_section .form_description {
    font-size: 16px;
    font-weight: 600;
    color: #F6F6F6;
}

.login_right_section form {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 27px;
    margin-top: 5px;
}

.login_right_section form .input {
    background: #111111;
    padding: 22px 14px;
    border: none;
    width: 100%;
    border-radius: 14px;
    position: relative;
}

.login_right_section form .input input {
    width: 100%;
    background-color: unset;
    color: #fff;
    border: none;
    height: 100%;
    padding-left: 35px;
}

.login_right_section form .input input::placeholder {
    font-size: 16px;
    font-weight: 600;
    color: #a0a0a0;
}

.login_right_section form .input.username::before,
.login_right_section form .input.pass::before {
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
}

.login_right_section form .input.username::before {
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.2587 3.99994H16.7413C17.5463 3.99993 18.2106 3.99992 18.7518 4.04413C19.3139 4.09006 19.8306 4.18862 20.316 4.43591C21.0686 4.81941 21.6805 5.43133 22.064 6.18398C22.3113 6.66931 22.4099 7.18602 22.4558 7.74811C22.5 8.2893 22.5 8.95366 22.5 9.75862V14.2413C22.5 15.0462 22.5 15.7106 22.4558 16.2518C22.4099 16.8139 22.3113 17.3306 22.064 17.8159C21.6805 18.5686 21.0686 19.1805 20.316 19.564C19.8306 19.8113 19.3139 19.9098 18.7518 19.9557C18.2106 20 17.5463 20 16.7413 19.9999H8.25872C7.45374 20 6.78938 20 6.24817 19.9557C5.68608 19.9098 5.16937 19.8113 4.68404 19.564C3.93139 19.1805 3.31947 18.5686 2.93597 17.8159C2.68868 17.3306 2.59012 16.8139 2.54419 16.2518C2.49998 15.7106 2.49999 15.0462 2.5 14.2412V9.75864C2.49999 8.95367 2.49998 8.28931 2.54419 7.74811C2.59012 7.18602 2.68868 6.66931 2.93597 6.18398C3.31947 5.43133 3.93139 4.81941 4.68404 4.43591C5.16937 4.18862 5.68608 4.09006 6.24817 4.04413C6.78937 3.99992 7.45373 3.99993 8.2587 3.99994ZM6.41104 6.03749C5.97262 6.07331 5.74842 6.13824 5.59202 6.21793C5.2157 6.40967 4.90973 6.71563 4.71799 7.09196C4.6383 7.24836 4.57337 7.47256 4.53755 7.91098C4.50078 8.36107 4.5 8.94336 4.5 9.79994V14.1999C4.5 15.0565 4.50078 15.6388 4.53755 16.0889C4.57337 16.5273 4.6383 16.7515 4.71799 16.9079C4.90973 17.2842 5.2157 17.5902 5.59202 17.782C5.74842 17.8616 5.97262 17.9266 6.41104 17.9624C6.86113 17.9992 7.44342 17.9999 8.3 17.9999H16.7C17.5566 17.9999 18.1389 17.9992 18.589 17.9624C19.0274 17.9266 19.2516 17.8616 19.408 17.782C19.7843 17.5902 20.0903 17.2842 20.282 16.9079C20.3617 16.7515 20.4266 16.5273 20.4624 16.0889C20.4992 15.6388 20.5 15.0565 20.5 14.1999V9.79994C20.5 8.94336 20.4992 8.36107 20.4624 7.91098C20.4266 7.47256 20.3617 7.24836 20.282 7.09196C20.0903 6.71563 19.7843 6.40967 19.408 6.21793C19.2516 6.13824 19.0274 6.07331 18.589 6.03749C18.1389 6.00072 17.5566 5.99994 16.7 5.99994H8.3C7.44342 5.99994 6.86113 6.00072 6.41104 6.03749Z' fill='%23F6F6F6'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.67548 8.43425C6.9879 7.97883 7.61036 7.8629 8.06578 8.17532L11.9344 10.8292C12.2753 11.063 12.7249 11.063 13.0658 10.8292L16.9344 8.17532C17.3898 7.8629 18.0123 7.97883 18.3247 8.43425C18.6371 8.88968 18.5212 9.51214 18.0658 9.82456L14.1972 12.4784C13.1745 13.18 11.8257 13.18 10.803 12.4784L6.93441 9.82456C6.47898 9.51214 6.36305 8.88968 6.67548 8.43425Z' fill='%23F6F6F6'/%3E%3C/svg%3E%0A");
}


.login_right_section form .input.pass::before {
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='24' viewBox='0 0 25 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.5 5.99994C8.5 3.7908 10.2909 1.99994 12.5 1.99994C14.7091 1.99994 16.5 3.7908 16.5 5.99994V10.9999H14.5V5.99994C14.5 4.89537 13.6046 3.99994 12.5 3.99994C11.3954 3.99994 10.5 4.89537 10.5 5.99994V10.9999H8.5V5.99994Z' fill='%23F6F6F6'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10.2587 8.99994H14.7413C15.5463 8.99993 16.2106 8.99992 16.7518 9.04413C17.3139 9.09006 17.8306 9.18862 18.316 9.43591C19.0686 9.81941 19.6805 10.4313 20.064 11.184C20.3113 11.6693 20.4099 12.186 20.4558 12.7481C20.5 13.2893 20.5 13.9537 20.5 14.7587V16.2412C20.5 17.0462 20.5 17.7106 20.4558 18.2518C20.4099 18.8139 20.3113 19.3306 20.064 19.8159C19.6805 20.5686 19.0686 21.1805 18.316 21.564C17.8306 21.8113 17.3139 21.9098 16.7518 21.9557C16.2106 22 15.5463 22 14.7413 21.9999H10.2587C9.45374 22 8.78938 22 8.24818 21.9557C7.68608 21.9098 7.16937 21.8113 6.68404 21.564C5.93139 21.1805 5.31947 20.5686 4.93597 19.8159C4.68868 19.3306 4.59012 18.8139 4.54419 18.2518C4.49998 17.7106 4.49999 17.0462 4.5 16.2412V14.7586C4.49999 13.9537 4.49998 13.2893 4.54419 12.7481C4.59012 12.186 4.68868 11.6693 4.93597 11.184C5.31947 10.4313 5.93139 9.81941 6.68404 9.43591C7.16937 9.18862 7.68608 9.09006 8.24817 9.04413C8.78937 8.99992 9.45373 8.99993 10.2587 8.99994ZM8.41104 11.0375C7.97262 11.0733 7.74842 11.1382 7.59202 11.2179C7.2157 11.4097 6.90973 11.7156 6.71799 12.092C6.6383 12.2484 6.57337 12.4726 6.53755 12.911C6.50078 13.3611 6.5 13.9434 6.5 14.7999V16.1999C6.5 17.0565 6.50078 17.6388 6.53755 18.0889C6.57337 18.5273 6.6383 18.7515 6.71799 18.9079C6.90973 19.2842 7.2157 19.5902 7.59202 19.782C7.74842 19.8616 7.97262 19.9266 8.41104 19.9624C8.86113 19.9992 9.44342 19.9999 10.3 19.9999H14.7C15.5566 19.9999 16.1389 19.9992 16.589 19.9624C17.0274 19.9266 17.2516 19.8616 17.408 19.782C17.7843 19.5902 18.0903 19.2842 18.282 18.9079C18.3617 18.7515 18.4266 18.5273 18.4624 18.0889C18.4992 17.6388 18.5 17.0565 18.5 16.1999V14.7999C18.5 13.9434 18.4992 13.3611 18.4624 12.911C18.4266 12.4726 18.3617 12.2484 18.282 12.092C18.0903 11.7156 17.7843 11.4097 17.408 11.2179C17.2516 11.1382 17.0274 11.0733 16.589 11.0375C16.1389 11.0007 15.5566 10.9999 14.7 10.9999H10.3C9.44342 10.9999 8.86113 11.0007 8.41104 11.0375Z' fill='%23F6F6F6'/%3E%3Cpath d='M11.5 15.9999C11.5 15.4477 11.9477 14.9999 12.5 14.9999C13.0523 14.9999 13.5 15.4477 13.5 15.9999V16.9999C13.5 17.5522 13.0523 17.9999 12.5 17.9999C11.9477 17.9999 11.5 17.5522 11.5 16.9999V15.9999Z' fill='%2312131A'/%3E%3C/svg%3E%0A");
}

.login_right_section .login_btn {
    background: #F6B439;
    padding: 20px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 14px;
    color: #000;
    border: none;
    transition: 0.3s;
}

.login_right_section .or {
    display: flex;
    font-size: 14px;
    font-weight: 600;
    color: #F6F6F6;
    text-align: center;
    align-items: center;
    gap: 13px;
    margin-top: 27px;
}

.login_right_section .or::before,
.login_right_section .or::after {
    content: '';
    height: 1px;
    width: 50%;
    background-color: #1d1d1d;
    display: inline-flex;
}

.regist_with_google {
    background: #FFDFA2;
    border-radius: 14px;
    display: flex;
    justify-content: center;
    text-decoration: none;
    font-size: 16px;
    font-weight: 600;
    color: #1d1d1d;
    padding: 22px;
    margin-top: 27px;
    gap: 10px;
    transition: 0.3s;
}

.login_right_section .have_acc {
    font-size: 16px;
    font-weight: 500;
    color: #f6f6f6;
    text-align: center;
    margin-top: 20px;

}

.login_right_section .have_acc a {
    font-weight: 700;
    color: #F6B439;
    text-decoration: none;
}

.login_right_section .view_pass {
    position: absolute;
    right: 14px;
    background-color: unset;
    border: none;
}

.code_input {
    display: flex;
    gap: 12px;
    margin-top: 22px;
    justify-content: center;
}

.code_input input {
    width: 47px;
    height: 51px;
    border-radius: 14px;
    background-color: unset;
    color: #fff;
    text-align: center;
    font-size: 24px;
    font-weight: 500;
    background: #111111;
    border: none;
}


.code_input input:focus {
    border: 1px solid #758195;
}

.login_right_section .forgot {
    font-size: 16px;
    font-weight: 500;
    color: #F6B439;
    text-align: right;
    text-decoration: none;
    margin-top: -10px;
}

.login_message {
    width: 100%;
    padding: 20px 14px;
    background: #FFDFA2;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

.loader-line {
    width: 100%;
    height: 4px;
    position: relative;
    overflow: hidden;
    background-color: transparent;
    position: absolute;
    bottom: 0;
    left: 0;
}

.loader-line:before {
    content: "";
    position: absolute;
    left: -50%;
    height: 4px;
    width: 40%;
    background-color: #FFAE18;
    -webkit-animation: lineAnim 1s linear infinite;
    -moz-animation: lineAnim 1s linear infinite;
    animation: lineAnim 1s linear infinite;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
}

@keyframes lineAnim {
    0% {
        left: -40%;
    }

    50% {
        left: 20%;
        width: 80%;
    }

    100% {
        left: 100%;
        width: 100%;
    }
}


/* ================================================================== */

/* splash */

.splash_container {
    width: 100%;
    min-height: 100vh;
    background-color: #000;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 90px 10px;
}

.splash_container .logo {
    font-size: 52px;
    font-weight: 600;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 32px;
    justify-content: center;
    align-items: center;
}

.loader {
    border: 10px solid #1D1D1D;
    border-radius: 50%;
    border-top: 10px solid #F6B439;
    width: 85px;
    height: 85px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


/* ================================================================== */

/* introduction */
.intro_container {
    width: 100%;
    height: 100vh;
    background-color: #F6B439;
    position: relative;

}

.introduction_slider {
    width: 100%;
    min-height: 100vh;
    height: 100%;
}


.introduction_slider .slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.introduction_slider .slide footer {
    padding: 38px 63px;
    backdrop-filter: blur(20px);
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    border-radius: 30px 30px 0 0;
    background-color: #00000024;
}

.introduction_slider .slide footer .intro_title {
    color: #fff;
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    align-items: flex-start;
    gap: 60px;
}

.introduction_slider .slide footer .intro_title h3 {
    font-size: 32px;
    font-weight: 600;
}

.introduction_slider .slide footer .intro_title p {
    font-size: 16px;
    font-weight: 600;
}

.intro_button_holder {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 31px;
}

.intro_button_holder button {
    height: 72px;
    max-width: 386px;
    width: 100%;
    border: none;
    background-color: unset;
    font-size: 18px;
    font-weight: 600;
}

.intro_button_holder button.next_page {
    background: #000000;
    color: #fff;
    border-radius: 14px;
}

.introduction_slider .slide {
    display: none;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.introduction_slider .active-slide {
    display: block;
}

.intro_logo {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-size: 38px;
    font-weight: 600;
    color: #fff;
    position: absolute;
    top: 35px;
    left: 63px;
    z-index: 1;
}


.dot_container {
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    bottom: 255px;
}

.dot {
    height: 12px;
    width: 12px;
    margin: 0 2px;
    background: #000;
    border-radius: 2px;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.dot.active,
.dot:hover {
    background-color: #F6B439;
    width: 52px;
    height: 12px;
}




/* responsive */

.package_status_message_btn {
    display: none;
}

.d_desktop_none {
    display: none !important;
}

.open_sidebar {
    display: none;
}

@media only screen and (max-width : 1500px) {
    .price_holder .price {
        font-size: 13px;
    }

}

@media only screen and (max-width : 1300px) {}

@media only screen and (min-width:991px) and (max-width: 1300px) {
    .latest_donate_item .price_holder {
        flex-direction: column;
        gap: 15px;
    }

    .price_holder button {
        width: 100%;
    }
}

@media only screen and (min-width:991px) and (max-width: 1200px) {
    .latest_donate_item header {
        flex-direction: column;
        gap: 11px;
        justify-content: start;
        width: 100%;
    }

    .latest_donate_item header .time,
    .latest_donate_item .donater_info {
        width: 100%;
    }

    .content_left_holder .message_item picture img {
        width: 35px;
        height: 35px;
    }

    .content_left_holder .online {
        width: 10px;
        height: 10px;
        border: 2px solid #F6F6F6;
        bottom: 6px;
        right: 5px;
    }

    .content_left_holder .message_item {
        padding: 5px 10px;
    }

    .content_left_holder .message_info .sender_name {
        font-size: 11px;
    }

    .content_left_holder .message_text {
        font-size: 10px;
    }

    .buttons_holder {
        padding: 10px 6px;
    }
}

@media only screen and (max-width : 991px) {
    .add_post .right_section{
        max-width: 40%;
    }
    .add_post .left_section{
        max-width: 60%;
    }
    .add_post_content .left_section img{
        width: 100%;
    }
    .login_right_section {
        max-width: unset;
        width: 100%;
        padding: 16px;
    }

    .login_left_section {
        display: none;
    }

    .register_page .login_left_section {
        display: block;
    }

    .login_container_content {
        flex-direction: column;
    }

    .content_left_holder {
        display: none;
    }

    .content_right_holder {
        width: 40%;
    }

    .content_middle {
        width: 60%;
    }

    .yout_mind_buttons_holder button {
        font-size: 0;
        width: auto;
    }

    .products {
        grid-template-columns: repeat(3, 1fr);
    }

    .open_sidebar {
        position: absolute;
        right: -11px;
        height: 95px;
        width: 12px;
        top: 50%;
        color: #fff;
        display: block;
        background-color: #5c5c5cb5;
        transform: translateY(-50%);
        border-radius: 0 5px 5px 0;
    }

    .seller_page_products_contents aside {
        position: fixed;
        left: -250px;
        height: 100%;
        top: 50px;
        z-index: 111;
        transition: 0.4s;
        width: 250px;
        z-index: 1111111;
    }

    .seller_page_products_contents.active aside {
        left: 0;
    }

    .seller_page_products_contents .right_section {
        width: 100%;
    }

    .posts_page {
        flex-direction: column;
    }

    .explore_post_info,
    .reloted_posts {
        width: 100%;
    }

}

@media only screen and (max-width : 767px) {
    .introduction_slider .slide footer .intro_title{
        flex-direction: column;
        gap: 20px;
    }
    .introduction_slider .slide footer .intro_title h3{
        text-align: center;
        width: 100%;
        font-size: 20px;
    }
    .introduction_slider .slide footer .intro_title p{
        width: 100%;
        text-align: center;
        font-size: 10px;
        line-height: 16px;
    }
    .add_post_content{
        flex-direction: column;
    }
    .photo_size{
        min-height: 200px;
    }
    .add_post .left_section,.add_post .right_section{
        max-width: 100%;
    }
    .seller_page_products_contents {
        margin: 0;
    }

    .seller_page_products .chart_holder {
        padding: 15px;
    }

    .message_center_page {
        margin-top: 10px;
    }

    .device_info_item li svg {
        width: 20px;
    }

    .device_info_item .color_info .color {
        width: 20px;
        height: 20px;
    }

    .device_info_item .name,
    .right_section .price,
    .yellow_button {
        font-size: 16px;
    }

    .device_info_item .color_info,
    .category {
        font-size: 14px;
    }

    .header_holder .header_menu_left input::placeholder {
        font-size: 10px;
    }

    .map_holder_header {
        padding: 12px 18px;
    }

    main {
        margin-bottom: 71px !important;
    }

    .header_holder {
        margin-top: 0;
    }

    .d_phone_none {
        display: none !important;
    }

    .d_desktop_none {
        display: flex !important;
    }

    .header_holder .header_menu_left {
        gap: 10px;
    }

    .header_menu_list {
        position: fixed;
        bottom: 0px;
        z-index: 11111;
        backdrop-filter: blur(20px);
        background-color: #0006;
        width: 100%;
        right: 0;
        justify-content: center;
        left: 0;
        gap: 13px !important;
    }

    .profile_menu_holder {
        left: 0;
        width: fit-content;
    }

    .content_right_holder {
        display: none;
    }

    .content_middle {
        width: 100%;
    }

    .add_story_section {
        padding: 10px;
    }

    .home_page .top_seller_title {
        flex-direction: column;
    }

    .products {
        grid-template-columns: repeat(2, 1fr);
    }

    .explore_content_search_right_section {
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        align-items: center;
    }

    .explore_content_search form {
        margin-top: 11px;
        width: 100%;
    }

    .explore_content .search_box {
        max-width: unset !important;
        width: 100% !important;
    }

    .profile_information .profile_information_header {
        justify-content: space-between;
        flex-direction: column;
        align-items: baseline;
    }

}


@media only screen and (max-width : 576px) {
    .intro_logo{
        left: 50%;
        transform: translateX(-50%);
    }
    .login_container header {
        font-size: 30px;
    }
    .information .device_info .device_img{
        width: 110px;
    }
    .information .user_info{
        margin-left: auto;
    }
    .modal_holder .donate_now_content .information{
        flex-direction: column;
    align-items: baseline;
    }
    .button_holder_type3 button{
        padding: 20px 40px;
    }
    .product_page_holder .left_section .product_title {
        font-size: 16px;
    }
    .create_product_form .button_holder button {
        font-size: 12px;
    }

    .Seller_title {
        flex-direction: column;
        gap: 15px;
    }

    .choose_product_info {
        flex-direction: column;
    }

    .product_info_img {
        gap: 12px;
    }

    .security_holder {
        max-width: unset;
    }

    .your_mind {
        display: none;
    }

    .home_page .top_seller_list_item {
        display: flex;
        flex-direction: row-reverse;
        gap: 5px;
    }

    .home_page .top_seller_list_item a div {
        display: none;
    }

    .home_page .top_seller_list_item::after {
        position: initial;
    }

    .home_page .top_seller_list_item a,
    .home_page .top_seller_title {
        font-size: 10px;
    }

    .top_seller_title svg {
        width: 18px;
        height: 18px;
    }

    .post_info {
        padding: 18px 14px;
    }

    .product_info_holder img {
        display: none !important;
    }

    .home_page .top_seller_holder {
        padding: 19px 15px;
    }

    .gallery_holder {
        grid-template-columns: repeat(auto-fit, minmax(33.33%, 1fr));
    }

    .products_product_item_title,
    .products_product_item_price {
        font-size: 10px;
    }

    .products_product_item_category {
        font-size: 8px;
    }

    .explore_content .switch_btn_holder button,
    .switch_btn_holder button {
        font-size: 12px !important;
    }

    .input_holder {
        width: 100%;
    }

    .create_product_form {
        gap: 20px;
    }

    .product_item_img {
        width: 90px !important;
    }

    .product_item_info_name {
        font-size: 13px;
    }

    .product_item_info {
        font-size: 12px;
    }

    .product_item .action button:first-child {
        margin-right: 12px;
    }

    .product_item .action button {
        width: 35px;
        height: 35px;
    }

    .seller_page_products_list {
        grid-template-columns: 100%;
    }

    .profile_information_form .input_holder {
        width: 100% !important;
    }

    .map_holder_header {
        flex-direction: column;
        align-items: end;
        gap: 15px;
    }

    .switch_label {
        font-size: 15px;
    }

    .map_holder_header .title {
        width: 100%;
        text-align: left;
        font-size: 18px;
    }

    .info_label {
        font-size: 16px;
    }

    .Seller_title h3 {
        font-size: 18px;
    }

    .map_holder_footer {
        flex-direction: column;
        gap: 31px;
        align-items: flex-start;
    }

    .map_holder_footer .right_section {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: end;
    }

    .info_category ul li {
        flex-direction: column;
        align-items: baseline;
        gap: 11px;
    }
    .package_status_information{
        padding: 20px 10px;
    }
}

@media only screen and (max-width : 450px) {
    .product_item_info_container {
        flex-direction: column;
        width: 100%;
        align-items: baseline;
    }

    .product_item {
        flex-direction: column;
        gap: 15px;
    }

    .product_item_img {
        width: 100% !important;
        height: 160px;
    }

    .product_item .action {
        width: 100%;
    }
}

@media only screen and (max-width : 860px) {

    .product_page_holder .left_section,
    .product_page_holder .right_section {
        max-width: unset;
    }

    .product_page_holder {
        flex-direction: column;
    }

    .package_status_holder {
        flex-direction: column;
    }

    .package_status_information,
    .section_two {
        max-width: unset;
    }

    .package_status_message_btn {
        font-size: 14px;
        background-color: #F6B439;
        border: none;
        padding: 10px 20px;
        border-radius: 10px;
        font-weight: bold;
        margin-top: 20px;
        display: block;
    }

    .section_two {
        display: none;
    }

    .message_center .message_info {
        width: 100%;
    }

    .message_center .messages {
        width: 100%;
        height: 100%;
        position: absolute;
        right: 0;
        z-index: 1;
    }

    .message_center_chat {
        max-width: unset;
    }

    .message_center_page {
        gap: 0;
    }
}

@media only screen and (max-width : 1090px) {

    .header_holder .header_menu_right_user_info span,
    .header_holder .header_menu_right_user_info svg {
        display: none;
    }

    .header_holder .header_menu_list li a {
        font-size: 14px;
        width: 60px;
    }
}

@media only screen and (max-width : 576px) {}

@media only screen and (min-width:577px) and (max-width: 767px) {}

@media only screen and (min-width:768px) and (max-width: 991px) {}