@font-face {
    font-family: 'Urbanist'; /* Choose a name for your font */
    src: url('../fonts/urbanist_variablefont_wght.ttf') format('truetype'); /* Path to the TTF file */
    font-weight: normal; /* Optional: specify the font weight */
    font-style: normal; /* Optional: specify the font style */
}

@font-face {
    font-family: 'Anton';
    src: url('../fonts/anton_regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

:root {

    --repcolor1:#98A2B3;
    --repcolor2:#EAECF0;
    --repcolor3:#EAECF0;
    --repcolor4:#F4EBFF;
    --repcolor5:#6941C6;
    --repcolor6:#FFFFFF;
    --repcolor7:#D0D5DD;
    --repcolor8:#7F56D9;
    --repcolor9:#F2F4F7;
    --repcolor11:rgba(71,84,103,1);
    --repcolor12:#333333;
     --repcolor10:var(--primary-green-btn);
    --white-color:#FFFFFF;


    --main-color: #3498db;
    --secondary-color: #2ecc71;
    --border-color:#dedede;
    --page-background-color:#ffffff;
    --xs-font-size:13px;
    --sm-font-size: 14px;
    --md-font-size: 15px;
    --lg--font-size:16px;
    --primary-font-family: 'Urbanist', sans-serif;
    --title-font-family:'Antom', sans-serif;
    --content-color:#000000;
    --bg-btn:#7F56D9;
   
    --primary-black-color:#000000;
    --secondary-black-color:#D0D5DD;
    --primary-green-btn:#009f74;
    --primary-btn-color:var(--primary-green-btn);
    /* --primary-btn-color:#007bff; */
    
   



}

*{margin:0;padding:0;box-sizing: border-box;}
.list,ul{list-style:none}
.input-field:focus{outline:none}
select{appearance: none !important;          
  -webkit-appearance: none !important; 
  -moz-appearance: none !important;}
.body a{text-decoration:none}
textarea,input-field,label,select{font-family:"Roboto", serif;}
.body,html{background:#fff;font-family:"Roboto", serif;color:var(--content-color);font-size:14px;font-weight:400;line-height:18px;width:100%;background:#eee}
.inline-flex{display:inline-flex;}
.d-flex{display:flex !important;}
.flex-wrap{flex-wrap: wrap;}
.flex-1{flex:1}
.flex-2{flex:2}
.order1{order:1}
.order2{order:2}
.justify-content-between{justify-content: space-between !important;}
.justify-content-around{justify-content: space-around !important;}
.justify-content-evenly{justify-content: space-evenly !important;}
.justify-content-start{justify-content:start !important;}
.justify-content-end{justify-content:end !important;}
.justify-content-center{justify-content: center;}
.align-item-start{align-items:flex-start !important;}
.flex-direction-column{flex-direction: column;}
.align-item-end{align-items:flex-end !important;}
.align-item-center{align-items:center !important;}
.align-item-baseline{align-items:baseline !important;}
.align-item-stretch{align-items: stretch !important}
.align-text-center{text-align:center;}
.align-text-left{text-align:left;}
.align-text-right{text-align:right}

.radius5{border-radius:5px}
.radius10{border-radius:10px}
.radius15{border-radius:15px}

.header-user .btn{margin-left:10px}
.pos-relative{position:relative;z-index: 1}

.container{width:calc(100% - 30px);margin:0 auto;}
.header{border-bottom:1px solid var(--repcolor3);width:100%;padding:10px 0;position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 1px 2px #1018280d}
.logo{width:75px;display:flex;align-items: center;padding:5px 0}
.logo img{width:100%;height:auto;}
.header_logo a{display:flex;}
/*.page-header-nav .nav{margin-left:20px}*/
.page-header-nav .nav a{text-decoration:none;color:#1D2939;font-size:16px;font-weight:400;padding:10px 15px;border-radius:10px}
.page-header-nav .nav a.active{background: var(--primary-green-btn);color:#fff}
#pGSNav .header-nav .icon{display:none}
.page-header-nav .nav-link{margin-left:15px}
/* Container alignment */
.header-creadit-btn, .header-user-account,.dropdown-circle-item {
  padding: 10px 15px;
  border-radius: 25px;
  cursor: pointer;
  background-color: #f5f5f5;
  font-weight: 500;
  text-align: center;
}
.header .dropdown-footer .upgrade-btn a{color:#fff}

.header-user-account,.dropdown-circle-item {
  background-color: var(--primary-green-btn);
  color: #fff;
}

/* Dropdown styling */
.user-dropdown {
  display: none;
  position: absolute;
  top: 54px;
  background-color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  z-index: 1000;
  width: 250px;
  overflow: hidden;
  right:0;
}

.user-dropdown .dropdown-item {
  padding: 10px 15px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 14px;
  color: #333;
  border-bottom: 1px solid #f0f0f0;
}

.user-dropdown .dropdown-item a{color: #333;text-decoration: none}

.user-dropdown .dropdown-item:last-child {
  border-bottom: none;
}

.user-dropdown .dropdown-item:hover {
  background-color: #f8f9fa;
}

.user-dropdown .user-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

.user-dropdown .user-info {
  display: flex;
  flex-direction: column;
}

.user-dropdown .user-name {
  font-weight: 500;
}

.user-dropdown .logout {
  color: red;
}

/* Transition effect */
.user-dropdown {
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.2s, transform 0.2s;
}

.user-dropdown.active {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

.header-creadit-btn{margin-right:10px}
/* Flex container */
.header-creadit-btn {
  padding: 10px 15px;
  border-radius: 5px;
  cursor: pointer;
  background-color: #f5f5f5;
  font-weight: 500;
  text-align: center;
  color: #333;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease;
}

.header-creadit-btn:hover {
  background-color: #e0e0e0;
}

/*.header-creadit-btn:hover + .credit-dropdown{display:block;opacity: 1}*/

/* Dropdown styling */
.credit-dropdown {
  display: none;
  position: absolute;
  top: 53px; /* Adjust based on button height */
  right: 0;
  background-color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  z-index: 1000;
  width: 300px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 100;
}

.credit-dropdown.active {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

/* Dropdown sections */
.dropdown-header {
  padding: 15px;
  background-color: #f9f9f9;
  border-bottom: 1px solid #e0e0e0;
  text-align: center;
}

.plan-title {
  font-size: 14px;
  color: #666;
}

.plan-name {
  font-size: 16px;
  font-weight: 500;
  color: #333;
}

.dropdown-body {
  padding: 15px;
}

.credit-item {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
  font-size: 14px;
  color: #555;
}
.credit-item:last-child{margin-bottom:0}

.credit-item.total {
  font-weight: 500;
  color: #000;
}

.dropdown-footer {
  padding:0 15px 15px;
  background-color: #f9f9f9;
  text-align: center;
}

.upgrade-btn {
  padding: 10px 20px;
  width: 100%;
  background-color: var(--primary-green-btn);
  color: #fff;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  transition: background-color 0.3s ease;
}

.upgrade-btn:hover {
  background-color: var(--primary-green-btn);
  opacity:.8;
}


.error, .text-error,.alert-error,.invalid-feedback,.alert-danger{color:#dc3545 !important}
.success, .text-success,.alert-success,.valid-feedback{color:#28a745 !important}
.warning, .text-warning{color:#ffc107 !important}
.text-white{color:#FFFFFF !important}
.text-info{color:#17a2b8 !important}

.bg-danger,.bg-error{background:#dc3545 !important;color:#fff}
.bg-success{background:#28a745 !important;color:#fff}
.bg-warning{background:#ffc107 !important;color:#fff}
.bg-info{background-color:#17a2b8 !important;color: #fff}

.response-message{margin-bottom:5px !important;width:100%}

.btn,.link-btn{border:1px solid var(--secondary-black-color);padding:10px 16px;cursor:pointer;}
.link-btn{padding:0}
.next-btn,.prev-btn{padding:10px 10px;font-size: var(--lg--font-size);font-weight:400;background:var(--repcolor2);color:var(--repcolor1);border:1px solid var(--repcolor2);border-radius:5px;pointer-events:none;cursor:pointer;}
.next-btn:hover{background:var(--primary-green-btn);color:#fff;opacity:.8}
.next-btn.active,.prev-btn.active{pointer-events:auto;background:var(--primary-green-btn);border:1px solid var(--primary-green-btn);color:var(--white-color);}
.link-btn a{display:block;text-decoration:none;color:var(--content-color);padding:10px 16px}
.form-btn{border-radius:10px;background: var(--primary-green-btn);color:#fff;border:1px solid var(--primary-green-btn);}
.primary-btn{background:var(--primary-btn-color);border:1px solid var(--primary-btn-color);color:var(--white-color); }
.primary-btn-black{background:#333;color:#fff;border:1px solid #333;}
.content{clear:both;float: none;width:100%}
/* .section-content{display:none} */
.pp-hide-section.active{display:block;}
.section-header{border:1px solid var(--repcolor3);width:100%;padding:10px 0;box-shadow:0 1px 2px #1018280d;background:#fff}
.section-header .s-heading{font-size:22px;line-height:32px;}
.section-header .p-small-text,.php-work .p-small-text{font-size:18px;line-height:26px;margin-bottom:20px}
.pp-section-content .section-header .p-small-text{font-size:17px}
.section-content-header{border:none;background:none;box-shadow:none;}
.section-header .header-nav{padding:15px 0;font-size: var(--lg--font-size);line-height:16px;font-weight:500;display:flex;align-items:center;margin-right:10px;background:var(--repcolor6);color:var(--repcolor7);pointer-events: none;border-radius:10px}
.section-header .header-nav.active{color:#333;pointer-events:auto;cursor:pointer;}
.section-header .header-nav.bg-active{color:#333}
.section-strip{background:var(--repcolor4);padding:12px 0;text-align:center;}
.section-strip strong{margin-right:5px}
.credit{background:var(--primary-green-btn);color:#fff;border-radius:10px;padding:5px 10px;margin-left:5px}
.upload-section-content,.summary-section-content{margin-top:20px;flex: 1;}
.summary-section-content{margin-top:15px}
.first-upload-product,.preview-item-list,.summary-product-item-list,.model-scroll-list,.genproject-item-list,.gen-product-list{height: calc(100vh - 220px );overflow-y: scroll;scroll-behavior: smooth;scrollbar-width: none; /* For Firefox */
    -ms-overflow-style: none; /* For Internet Explorer and Edge */}
.preview-item-list{height: calc(100vh - 250px )}
.summary-product-item-list,.gen-product-list{height: calc(100vh - 215px)}
.summary-product-item-list{height: calc(100vh - 135px)}
.genproject-item-list{height:calc(100vh - 75px);}
.model-scroll-list{height:calc(100vh - 125px);margin:10px auto 0;width:calc(100% - 30px);}
/*.first-upload-product::-webkit-scrollbar,.summary-product-item-list::-webkit-scrollbar,.preview-item-list::-webkit-scrollbar,.model-scroll-list::-webkit-scrollbar;.genproject-item-list::-webkit-scrollbar,.gen-product-list::-webkit-scrollbar{display:none}*/


.section-top-btn{padding: 8px 0;
    border-radius: 40px;
    gap: 4px;font-size:14px;font-weight:500}
.section-top-bg-btn{background-color:var(--repcolor9);padding-left:16px;padding-right:16px}

/* .upload-product-content{display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding-top: 20px;
    padding-bottom:20px;
    flex-direction: column;}
.upload-product-content img{width:332px}
.upload-product-content h1{font-size:18px;font-weight:600;color:#000;line-height:26px;text-align:center;}
.upload-product-content p{text-align:center;font-size:14px;line-height:22px} */

.upload-product-content{display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
  padding-top: 30px;
  padding-bottom:20px;
  flex-direction: column;}
.upload-product-content img{width:440px}
.upload-product-content h1{font-size:16px;font-weight:600;color:#000;line-height:22px;text-align:center;}
.upload-product-content p{text-align:center;font-size:14px;line-height:18px}
.preview-upload-product{flex-direction: column;flex-wrap:wrap;}
#uploadMulImage.btn span{font-size:13px}
.tab-type-selection{display:none;flex-direction:column;text-align:center;justify-content:center;}
.tab-type-selection.active{display:flex;}
.tab-type-selection p{font-size:15px;color:#333;font-weight:500;margin-bottom:10px;text-align:center}

.tab-type-selection .tt-list .type-tab{width:220px;cursor:pointer;}
.tab-type-selection .tt-list .type-tab .name{margin-bottom:10px;font-size:16px;font-weight:500}
.tab-type-selection .tt-list .type-tab img{width:100%;height:auto;border:3px solid #dedede;border-radius:10px}
.tab-type-selection .tt-list .type-tab .check{position:absolute;top:40px;font-size:16px;right:10px;display:none}
.tab-type-selection .tt-list .type-tab.visib-low{opacity:.5}
.tab-type-selection .tt-list .type-tab.active{opacity:1}
.tab-type-selection .tt-list .type-tab.active img{border:3px solid #2ecc71}
.tab-type-selection .tt-list .type-tab.active .check{color:#2ecc71;display:block;}

.preview-upload-product{flex-direction: column;flex-wrap:wrap;}

/*sidebar*/
.section-sidebar{
    display:flex;
    justify-content: center;
    align-items: center;
    width: 425px;
    border-radius:0;
    padding:15px 15px;
    gap: 10px;
    flex-direction:column;
    text-align: center;
    background:var(--repcolor9);
    margin-left:20px}
.sidebar-content{display: flex;flex-direction:column;align-items:center;justify-content: center}
.sidebar-content.no-mgb{margin-bottom:0}
.img-upload-info-sidebar .sidebar-img-list{gap: 20px;
    justify-content: space-evenly;
    padding-bottom:20px;
    display: flex;flex-direction: row;}
.img-upload-info-sidebar h2{font-size:18px;line-height:22px;margin-bottom:5px;font-weight:600}
.img-upload-info-sidebar p{font-size:14px;margin:0 18px}
.img-upload-info-sidebar .sidebar-img{border:1px solid white;width: 90px;
    height:auto;
    border-radius: 10px;margin-top:20px;position:relative;}
.img-upload-info-sidebar .sidebar-img img{object-fit: cover;
    width: 100%;
    height: 100%;
    position: relative;
    border-radius: 10px;}

.circle-icon{
    display:flex;
    align-items: center;
    justify-content: center;
    width:42px;
    height: 42px;
    stroke: #fff;
    background-color: #55b58b;
    position: absolute;
    bottom: -22px;
    border-radius: 50%;
    left:50%;
    margin:0 -21px;
    border: 3.91px solid white;color:#fff}
.red-circle{background:#e94c3c}
.preview-upload-btn{width:180px;
    height:222px;
    display:flex;
    justify-content: center;
    align-items: center;
    background-color:#FFFFFF;
    border-radius:0;
    border: 2px solid #dedede;
    cursor: pointer;
  }

.upload-image-modal .preview-upload-btn{width:200px;height:260px}
.center-circle-img{width: 56px;
    height: 56px;
    display:flex;
    justify-content: center;
    align-items: center;
    border-radius: 56px;
    background-color:#F2F4F7;border:1px solid #ccc;}

#sitmUploadImage .center-circle-img{border:1px solid #ccc;}
.preview-item{width:227px;
    height:300px;
    display:flex;
    flex-direction:column;
    text-align:left;
    justify-content: center;
    align-items:flex-start;
    background-color:#FFFFFF;
    border-radius:0;
    border: 2px solid #dedede;
    cursor: pointer;padding:4px 4px;margin-right:10px;margin-bottom:20px}
#selectProduct .preview-item{margin-right:0}



.preview-item-list{margin-top:20px}
.preview-item img{width:100%;height:auto;max-height:280px;object-fit: cover;object-position: top center;border-radius:0}
.preview-item-name{margin:10px 0 0;display:flex;justify-items:flex-start;align-items:flex-start;text-align:left;}
.preview-item .delete-btn,.delete-btn{position:absolute;width:26px;height:26px;font-size:14px;display:flex;border-radius:100%;flex-direction:column;align-items: center;justify-content:center;background:#ffffff;color:#000;display:none}
#uploadPreList .delete-btn{top:20px;left:20px;}
#selectProduct #uploadPreList .delete-btn{top:15px;left:15px}
.preview-item:hover .delete-btn{display:flex;}
#summaryProductList .preview-item img{max-height:300px}

.section-filter,.search-form{margin:20px 0}
.filter-option{gap:10px;display:flex;width:100%;cursor:pointer;}
.filter-option select{width:160px;height:38px;padding:0 5px;border-radius:10px;border:1px solid #dedede;margin-right:10px}
#selectModel .filter-option select{margin-right:0}
.filter-option select:focus{outline:none}
.model-item-list{display: grid !important;
    width: 100%;
    grid-gap: 15px;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr))}

.model-item{
    justify-content: center;
    align-items: center;
    width: 100%;
    border-radius: 10px;}
.model-item .model-item-img{margin-bottom:8px;border-radius:10px;cursor:pointer;border:2px solid #dedede;display:flex;justify-content:center;padding:4px 4px}
.model-item.active .model-item-img{border:2px solid var(--primary-green-btn);display:flex;flex-direction:column;cursor:pointer;}
.model-item .model-item-img img{object-fit: cover;width:100%;height:auto;border-radius:5px;display:flex;}
.model-item .select-model{position:absolute;top:15px;right:35px;display:none}
.model-item .select-model.active{display:block;}
.model-item .select-model .select-circle-icon, .mit-item .select-circle-icon,.uuproduct-list .select-model .select-circle-icon{
    display:flex;
    align-items: center;
    justify-content: center;
    width:22px;
    height: 22px;
    background-color: var(--primary-green-btn);
    position: absolute;
    border-radius: 100%;
    color:#fff}
.mit-item .select-circle-icon{top:10px;right:10px}

.sidebar-top-title{font-size:16px;font-weight:500}
.summary-sidebar .summary-product-name{margin-top:0}
.summary-sidebar .sidebar-model-img{width:200px;
    height: auto;
    object-fit: cover;
    border-radius: 6px;}

.summary-sidebar .sidebar-model-img{
    width:220px;
    height: auto;
    object-fit: cover;
    border-radius: 6px;margin-top:10px;padding:5px 5px;display:flex;}
.summary-sidebar .sidebar-model-img img{width:100%;height:auto;border-radius:10px}

.sidebar-form .btn{font-size: 16px;
    display: block;
    text-decoration: none;}


.summary-sidebar .form .input-field,.search-form .input-field{width:100%;padding:14px;border:1px solid #D0D5DD;border-radius:12px;color:#667085;background:#fff;gap:8px}
.search-form .input-field{min-width:240px;padding-left:30px;padding-top:10px;padding-bottom:10px}
.search-form .form-group{margin-right:10px}
.summary-sidebar .form .form-group.border-top{border-top: 1px solid #D0D5DD;}
.summary-sidebar .form .credit-count span{display:flex;text-align:left;color:#667085}
.summary-sidebar .form .credit-count span.count{font-size:16px;line-height:20px;color:#000;font-weight:400;text-align:center;}
.summary-sidebar .sidebar-form,.summary-sidebar .sidebar-content{width:100%}
.search-form .search-icon{position:absolute;left:10px;top:10px;color:#667085}
.header-new-btn a,.section-header a{text-decoration:none}
.imgGBtn{display: block;pointer-events: auto;}
.imgGBtn a{display:block;cursor:pointer;}
.imgGBtn.disable{pointer-events:none;opacity:.5}

.genproject-item-list{display: flex;}
.gen-project-item{width:240px;height:300px;display:flex;align-items:center;cursor:pointer;border-radius:10px;flex-direction: column;margin-bottom:0;justify-content:center;}
.genproject-item-list .gen-project-item{height:auto;width:auto;max-height:326px;min-height:326px}
.gen-project-item .layer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:rgba(0, 0, 0, .5);display:flex;justify-content: center;flex-direction:column;align-items: center;border-radius:10px;pointer-events:none}
.spinn-loder{width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    border-radius: 10px;
    padding: 5px;
    margin-bottom: 5px;}
.gen-project-item img{width:100%;height:100%;object-fit: contain;border-radius: 10px;object-position:center}
/*.gen-project-item img{width:100%;height: 100%;object-fit: cover;border-radius: 10px}*/
.gen-project-item .timer{position:absolute;top:10px;left:10px}
.gen-project-item .item-bottom{position:absolute;bottom:0;left: 10px;color:#fff;background:rgba(0, 0, 0, .5);border-bottom-left-radius:10px;border-bottom-right-radius:10px;width:100%;left:0;padding:5px 10px}
.timer,.item-bottom .count,.bottom-text .count{    border-radius: 5px;
    color: #667085;
    background: #ffffff;
    padding: 2px 5px;
    font-size: 12px;
    font-weight: 500;
    margin-right: 10px;}
.item-bottom .count{padding:4px 4px;width:42px;margin-right:5px;display:flex;align-items:center;justify-content:center;gap:3px;}
.item-bottom .name{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:auto;}
.gen-product-result .bottom-item{position:absolute;bottom:20px;left:15px}
#genProductList .gen-product-item .bottom-item{position:absolute;top: 15px;
    background: #333;
    color: #fff;
    padding: 5px 12px;
    border-radius: 5px;left:15px}


@media screen and (min-width: 768px) {
    .model-item .model-item-img img {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}

.gen-product-list{margin:10px 0 0;min-width:220px}
.gen-product-item{width: 220px;height:280px;border:2px solid #dedede;margin-bottom:20px;border-radius:8px;display:flex;cursor:pointer;}
.gen-product-item img{width:100%;height: auto;object-fit: cover;border-radius: 5px}
.gen-product-item.active{border:2px solid var(--primary-green-btn);}
.gen-product-result{display: flex;gap: 10px;padding:10px 21px 0;border-radius: 10px}
.gen-product-img{width:33%;height: auto;min-width:320px}
.gen-product-img img{width:100%;height:100%;object-fit: cover;border-radius: 10px}
#processGenerateSection .content-item{display:none}
#processGenerateSection .content-item.active{display: block}

/* General Modal Styling */
/* General Modal Styling */
.modal,.message-modal,#sitModal, .upload-image-modal,.c-message-modal {
  display: none; /* Initially hidden */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
  justify-content: center;
  align-items: center;
  z-index: 9999;
}


.modal-dialog,.message-modal .modal-dialog,.c-message-modal .modal-dialog {
  display: flex;
  flex-direction: row;
  width: 70%;
  max-width: 900px;
  background: #ffffff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}


.preview-modal-image .modal-dialog {
    width: 100%;
    max-width: 100%;
    height:100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background:transparent;
}


.preview-modal-image .modal-content {
    display: flex;
    flex-direction: column;
    width:100%;
    
}


/* Modal image container */
.preview-modal-image .modal-close{background:#fff;border-radius:25px;width:22px;height:22px;display:flex;align-items: center;justify-content: center;}
.preview-modal-image .pmm-view {
    width: 100%;
    height: 100vh;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center; 
    flex-direction: column;
   
    overflow: hidden; 
}

/* Image itself */
.preview-modal-image .pmm-view img {
    width: 100%;
    height: 100%; 
    object-fit: contain; 
    object-position: top center; 
    display: block;
    border-radius:10px;
}

.message-modal .modal-dialog,.c-message-modal .modal-dialog{width:380px}
.c-message-modal .modal-header{background-color:#dc3545;width:100%;padding:10px 10px;display:flex;justify-content:space-between;}
.c-message-modal.modal-error .modal-header{background:#dc3545 !important;color:#fff;}
.c-message-modal.modal-success .modal-header{background:var(--primary-green-btn) !important;color:#fff !important}
.c-message-modal .modal-content{flex-direction:column;}
.c-message-modal .modal-close{top:10px !important;right:10px !important;}
.c-message-modal.modal-error,.c-message-modal.modal-success{display:flex;}


.message-modal .modal-dialog .modal-half-icon{height:120px;display:flex;flex-direction:column;align-items: center;font-size:50px;justify-content:center;background:var(--primary-green-btn);color:#fff;border-top-left-radius:8px;border-top-right-radius:8px}
.message-modal .modal-close .fa-solid{color:#ffff}
.message-modal .modal-body,.c-message-modal .modal-body{padding:15px 20px;min-height:90px;display:flex;flex-direction:column;align-items: center;justify-content: center;}
.message-modal .modal-body .modal-message{font-size:15px;line-height:24px;font-weight:400;text-align:center;}


#sitModal .modal-header,.preview-modal-image .modal-header,.upload-image-modal .modal-header{padding:15px 15px;border-bottom:1px solid #dedede;margin-bottom:10px}
#sitModal .modal-dialog,.upload-image-modal .modal-dialog{flex-direction:column;width:50%}
#sitModal .modal-header h2,.upload-image-modal .modal-header h2{font-size:18px;font-weight:500}
#sitModal .mit-item,.upload-image-modal .mit-item{width:220px;height:auto;border:2px solid #dedede;border-radius:0;cursor:pointer;}
#sitModal .mit-item img,.upload-image-modal .mit-item img{height:auto;width:100%;object-fit: cover;border-radius:0;display:flex;}

#sitModal .mit-item.active{border:2px solid var(--primary-green-btn);}
#sitModal .select-type{display:none}
#sitModal .mit-item.active .select-type{display:block;}
#sitModal .name{position:absolute;top:10px;left:10px;background:#333;padding:5px 5px;color:#fff;border-radius:5px;font-size:13px;line-height:13px;font-weight:400}
#sitModal .modal-footer,.upload-image-modal .modal-footer{padding:15px 15px;display:flex;flex-direction: column;align-items: flex-end;}

#sitModal .modal-footer .btn.disable,.upload-image-modal .modal-footer .btn.disable{background:#EAECF0;pointer-events:none;color:#98A2B3;border-radius:10px;padding:15px 15px}
#sitModal .modal-footer .btn.active,.upload-image-modal .modal-footer .btn.active{background:var(--primary-green-btn);color:#fff;pointer-events:auto;}
#sitModal .modal-footer .btn.disable{padding:12px 15px !important}


#sitModal .modal-content,.upload-image-modal .modal-content,#infoModal .modal-content {flex-direction: column;padding:0 0 15px}
 #sitModal .mit-flex-item{gap:10px}
#sitModal #mitFirstStep .mit-flex-item{display:grid !important;
      grid-gap: 10px;
      grid-template-columns: repeat(3, 1fr);justify-content: center;padding:0 45px;}
#sitModal .modal-image-type{display:none}
#sitModal .modal-image-type.active{display:block;} 

#sitModal #sitmUploadImage p{margin:0 25px 15px;text-align: center;}
#sitModal #sitsmvBackUpload{margin:0 0 10px;} 

.pmform-modal .modal-dialog{width:450px}
.pmform-modal .modal-content{flex-direction:column;}
.pmform-modal .modal-content .modal-header{padding:18px 15px;border-bottom:1px solid #dedede;margin-bottom:10px}
.pmform-modal .modal-body{padding:0 15px}
.pmform-modal .form label{color:#333;margin-bottom:5px;display:block;font-weight:500}
.pmform-modal .form .input-textarea{font-size:14px;font-family:"Roboto", serif;width:100%;border:1px solid #dedede;padding:10px 10px;text-align:left;display:flex;align-items:flex-start;justify-content: flex-start;border-radius:5px}
.pmform-modal .form .input-textarea:focus{outline: none}
.modal-content,.message-modal .modal-content {
  display: flex;
  flex: 1;
  flex-direction: row;
  height: 100%;
}

.pmform-modal .select{width:100%;border:1px solid #dedede;padding:12px 10px;border-radius:5px}
#pInputText{display:none}

.form .input-field:focus{outline: none}

.message-modal .modal-content{flex-direction:column;padding:0}
/* Left Section: Dynamic Forms */
.modal-left {
  flex: 1;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.modal-steps {
  margin-bottom: 20px;
}

.modal-step {
  display: none; /* Hidden by default */
}

.modal-step.active {
  display: block; /* Only the active step is visible */
}

.modal-left h2 {
  font-size: 20px;
  margin-bottom: 10px;
  color: #333333;
}

.modal-left p {
  font-size: 13px;
  margin-bottom: 5px;
  color: #666666;
}
.response-message{margin-bottom:5px;clear:both;}

/* Form Styling */
.modal .form-group {
  margin-bottom: 12px;
}

.modal .input-field {
  width: 100%;
  padding: 12px 15px;
  font-size: 14px;
  border: 1px solid #ddd;
  border-radius: 5px;
  transition: border-color 0.3s ease;
}

.modal .input-field:focus {
  border-color: var(--primary-green-btn);
  outline: none;
}

.modal .btn {
  display: inline-block;
  width: 100%;
  padding: 10px 15px;
  font-size: 16px;
  font-weight:500;
  text-align: center;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.modal .primary-btn {
  background-color: var(--primary-green-btn);
  color: #ffffff;
}

.modal .primary-btn:hover {
  background-color: var(--primary-green-btn);
  opacity:.8;
}

.modal .secondary-btn {
  background-color: #f1f1f1;
  color: #333333;
}

.modal .secondary-btn:hover {
  background-color: var(--primary-green-btn);
}

.upload-image-modal .mit-flex-item{gap:15px;margin-bottom:0}
.upload-image-modal .modal-footer{padding:0 15px}
.upload-image-modal .checkbox-input{width:18px;height:18px}
.upload-image-modal .checkbox{margin:10px auto;display:flex;justify-content:center;}
.upload-image-modal .checkbox label{display: flex;
    align-items: center;
    gap:5px;cursor:pointer;}
  .upload-image-modal .modal-image-type p{width:80%;margin:0 auto 15px;text-align:center;}
  .upload-image-modal .preview-upload-btn{position:relative;}
  .upload-image-modal .uploaded-img, #sitModal .uploaded-img{position:absolute;top:0;left:0;width:100%;height:100%}
  .upload-image-modal .uploaded-img img,#sitModal .uploaded-img img{width:100%;height:100%;max-height:260px;border-radius:0;object-fit:cover;object-position:top;background:#fff}
  #uploadImageModal .modal-image-type{display:none;}
  #uploadImageModal .mit-flex-item,#sitModal .mit-flex-item {flex-wrap:wrap;padding:0 10px;}
  #uploadImageModal .modal-image-type.active{display:block;}
  #uploadImageModal .length-item,#sitModal .length-item{border:2px solid #dedede;border-radius:0;height:158px;width:120px;display: flex;justify-content: center;align-items: center;cursor: pointer;}
  #uploadImageModal .length-item img,#sitModal .length-item img{width:100%;height:100%;object-fit: cover;display:flex;border-radius:0;cursor: pointer;}
  #uploadImageModal .length-item.active,#sitModal .length-item.active{border:2px solid var(--primary-green-btn)}
  .upload-image-modal .modal-footer .btn.disable{padding:10px 15px;}
  #lengthSelection #mpUploadBtn{margin-top:10px !important;}
  #sitModal #sitlengthSelection p{text-align:center;margin:0 25px;margin-bottom:10px;}
  #sitModal .checkbox label,#sitModal .checkbox label .checkbox-input{cursor: pointer;} 
  #sitModal .modal-footer-btn .btn,  #sitModal .modal-footer-btn .btn.disable,#sitModal .sit-footer-btn .btn {height:38px !important;padding:10px 15px !important}
  /* Google Login Button */
#googleLoginBtn {
  align-items: center;
  justify-content: center;
  padding:0;
  display:flex;
  align-items: center ;
  justify-content: center;
}

#googleLoginBtn i {
  font-size: 18px;
}
#googleLoginBtn img{width:18px;height:auto; 
  margin-bottom:0 !important;margin-top:0 !important;margin-right:5px;}

#googleLoginBtn a{text-decoration:none;color: #333;font-weight:600;display:inline-flex;justify-content:center;width:100%;;padding:10px 15px;line-height:18px;}
#googleLoginBtn a:hover{color:#fff}
/* Right Section: Static Image */
.modal-img {
  flex: 1;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
}

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

.modal .modal-close{position: absolute;
    right: 18px;
    top: 18px;
    font-size: 15px;
    font-weight: 600;cursor:pointer;}
.modal .back-btn{position: absolute;
    left: 15px;
    top: 15px;
    font-size: 15px;
    font-weight: 600;
display:inline-block;width: auto;background:none;padding:0}
.modal .logo-img{width: 115px;
    height: auto;
    margin-bottom: 10px;
    margin-top: 15px;}
.modal .primary-btn{width:100%}

.modal .toggle-password{position: absolute;right:10px;top:14px;cursor:pointer;}

/* Responsive Design */
@media (max-width: 768px) {
  .modal-dialog {
    flex-direction: column;
    width: 90%;
  }

  .modal-img {
    display: none; /* Hide image on smaller screens */
  }

  .modal-left {
    padding: 15px;
  }
}

@media (max-width: 480px) {
  .modal-left h2 {
    font-size: 20px;
  }

  .modal-left p {
    font-size: 12px;
  }

  .modal .btn {
    font-size: 14px;
  }
}

#infoModal .modal-content{padding-bottom:0}
#infoModal.active{display:flex;}

#infoModal .mif-item-content{display:none !important}
#infoModal .mif-item-content.active{display:flex !important;flex-direction:column !important;}
#infoModal .minfo-item-img{position:relative;border:4px solid #fff;border-radius:4px}
#infoModal .minfo-item-img img{width:120px;height:100%;display:flex;object-fit:cover;}
#infoModal .modal-dialog{width:480px}
#infoModal .mif-header-content{height:150px;width:400px;margin:0 auto;display:flex;justify-content:center;flex-direction:column;align-items: center;text-align: center;}
#infoModal .mif-header-content h4{font-weight:500;font-size:20px;margin-bottom:8px;}
#infoModal .mif-header-content p{font-weight:400;line-height:22px;font-size:16px}
#infoModal .minfo-item{padding:40px 0;gap:20px;}
#infoModal .btn{width:calc(100% - 60px);margin:0 30px}
.minfo-item-bg{background: #eee;padding-bottom:15px}
.minfo-item-img {
    display: inline-block;
    animation: scaleLoop 2s ease-in-out infinite;
    transition: transform 0.3s ease-in-out;
}
.minfo-item-img:nth-child(1) { animation-delay: 0s; }
.minfo-item-img:nth-child(2) { animation-delay: .5s; }
.minfo-item-img:nth-child(3) { animation-delay: 1s; }
#layDont .circle-icon{background:  red}

#infoModal .close-btn{position:absolute;top:15px;right: 15px;cursor:pointer;}

@keyframes scaleLoop {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); } /* Scale up */
    100% { transform: scale(1); } /* Scale back */
}



/*pages*/
.content-bg{position:relative;display: flex;
    justify-content: center;
    z-index: 1;
    align-items: center;background-position: top center;background-size: cover;background-repeat: no-repeat;height:calc(100vh - 61px);width:100%}
.bg-overlay{position:relative;}
.bg-overlay:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.3);z-index:-1}
.page-section.cpassword-page-section,.ps-center-form {
    width: 100%;
    max-width: 450px; /* Set a maximum width for the form */
    background: #fff; /* Optional: Add a background color for the form */
    padding: 20px; /* Add some padding */
    border-radius: 10px; /* Optional: Rounded corners */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional: Add a shadow for better appearance */
}

.page-section-form .form-group {
    margin-bottom: 15px; /* Add spacing between form elements */
}
.section-content .psform-logo,.page-section-form .psform-logo {display:flex;align-items: center;justify-content: center;width:100%;height:auto;margin-bottom:15px} 
.section-content .psform-logo img,.page-section-form .psform-logo img{width:115px;height:auto;}
.section-content .h2{font-size: 20px;
    margin-bottom: 10px;
    color: #333333;}
.page-section-form .form-group label{margin-bottom:5px;display:flex;flex-direction:column;}
.page-section-form .form-group .input-field {
    width: 100%;
    padding: 10px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 5px;
    display: flex;
    flex-direction:column;
    resize: none;
}

.page-section-form .btn.primary-btn {
    width: 100%;
    padding: 10px;
    font-size: 16px;
    font-weight: 500;
    background-color: var(--primary-green-btn); /* Button color */
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.page-section-form .btn.primary-btn:hover {
    background-color: var(--primary-green-btn);
}


.page-section-form .toggle-password {
    position: absolute;right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #888;
}

.page-section-form .toggle-password:hover {
    color: #333;
}

.pgs-nav a{color:#333;text-decoration:none}
#allPreProjectList{margin-top:12px}
#allPreProjectList .project-date{position:absolute;right:5px;color:#333;top:5px;font-size:11px;background:#333;color:#fff;padding:2px 3px;border-radius:5px}
#allPreProjectList a{text-decoration:none;color:var(--primary-green-btn);}
#allPreProjectList .progress-bar{text-decoration:none;color:#fff}
.download-check-btn{position:absolute;bottom:10px;right:10px}
.download-check-btn .product-checkbox{ width: 18px;
    height: 18px;cursor:pointer;}
#selectAllBtn{background:#dedede;border:1px solid #dedede;color:#333}

select:focus{outline: none;cursor:pointer;}
.sidebar-select{width: 100%;
    padding: 12px 12px;
    border: 1px solid #dedede;
    border-radius: 10px;
   font-family:"Roboto", serif;cursor:pointer;}

.summary-sidebar .form .input-field{padding:12px 12px;border-radius:10px}
.section-sidebar .form-group{width:100% !important}
.section-sidebar #newInput .input-field{width:100%;padding:10px 10px;border:1px solid #dedede;border-radius:10px}
.section-sidebar .form-group.border-top{border-top:1px solid #dedede;padding-top:10px;}
#downloadSection #selectAllBtn{flex-direction: column;
    display: flex;
    width: 110px;
    background: rgb(222, 222, 222);
    color: rgb(51, 51, 51);
    align-items: center;
    padding: 10px;margin-top:10px;pointer-events:auto;border:1px solid rgb(222, 222, 222);}
.section-header-btn #dSelectedBtn{background:#dedede;border:1px solid #dedede;pointer-events:none;color:#333}
.section-header-btn #dSelectedBtn.active,#downloadSection #selectAllBtn.active{pointer-events: auto;
    background: var(--primary-green-btn);
    border: 1px solid var(--primary-green-btn);
    color: var(--white-color);}
#downloadSection .gen-product-item .layer{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);border-radius:5px;color:#fff;z-index:10}
.hide{
  display: none !important;
}

.none{
  display: none !important;
}

.show{
  display: block !important;
}

.loader-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.loader {
  border: 8px solid #f3f3f3; /* Light grey */
  border-top: 8px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 1s linear infinite;
}

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

.center-form{width: 100%;
    max-width: 450px;
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);display:flex;align-items:center;flex-direction:column;justify-content: center;}
.center-form .psform-logo img {
    width: 135px;
    height: auto;
}
.center-form .card{display:flex;flex-direction:column;width:100%}
.center-form .row,.center-form .col{width:100%}
.center-form h2{margin-bottom:10px;font-size:20px}
.center-form .col-form-label{margin-bottom:10px}
.center-form .form-control{width: 100%;
    padding: 10px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 5px;margin-bottom:10px;margin-top:5px}

.center-form .form-control:focus{outline:none}
.center-form .btn{    width: 100%;
    padding: 10px;
    font-size: 16px;
    font-weight: 500;
    background-color: var(--primary-green-btn);
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease;border-radius:10px}
  .center-form .logo-img{margin-bottom:10px}
  .center-form .form-check{margin-bottom:10px}
  .center-form .login-btn{margin-bottom:5px}
  .center-form .btn-link{background:none;color:var(--primary-green-btn);text-align: right;font-size:14px;font-weight:400;display:flex;flex-direction:column;text-decoration:underline;}
  .center-form .col span,.center-form .col span strong{font-size:14px;font-weight:400;margin-bottom:5px}

.create-project-btn{width:300px;position:absolute;left:50%;margin:-179px -150px;top:50%;border-radius:10px;display:flex;justify-content: center;align-items: center;flex-direction:column;align-items: center;padding:15px 15px;font-size:16px;font-weight:500;color:#333}
.create-project-btn .create-text{margin-bottom:10px;font-size:18px;}
.create-project-btn .btn{background:var(--primary-green-btn);color:#fff;border-radius:10px;width:100%;text-align:center;font-size:16px;font-weight:400;padding:0}
.create-project-btn .btn a{color:#fff;padding:10px 15px;display:block;}
.create-project-btn img{width:250px;height:auto;margin:0 auto 10px;border:1px solid #dedede;padding:0 20px;border-radius:10px}



#selectProduct .model-item-list {
    display: flex !important;
    flex-direction: column;
    gap: 10px; /* Adjust spacing between sections */
}
.user-upload-product{
    display: flex;
    gap:10px; 
    margin-top:20px;
  }
#selectProduct .user-upload-product{flex-direction:column;}
#selectProduct .uu-before-images{display:flex;gap:10px}
#selectProduct .uuproduct-list, #selectProduct .uu-before-images{flex-direction: row !important;flex-wrap:wrap;}

#selectProduct .uu-before-images{display:grid !important;width:100%;grid-gap:5px;
  grid-template-columns: repeat(auto-fill, minmax(242px, 1fr));}



#selectProduct .uuproduct-list .uu-before-images .preview-item{width:100%;}
.uuproduct-list .uu-before-images .preview-item:last-child{margin-right:0}
#selectProduct #uploadPreList .preview-item{min-width:180px;margin-left:10px}
#selectProduct #uploadPreList .preview-item img{max-height:239px;object-fit:cover;}

/*.userProductList{display:flex;overflow-x: auto;
    white-space: nowrap;scroll-snap-type: x mandatory;}*/
/*.userProductList::-webkit-scrollbar {
    height: 6px;
    display: none;
}*/

/*.userProductList::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 10px;
    display: none;
}*/

.user-upload-product .preview-upload-btn{min-width:246px;height:326px}
.preview-upload-btn .text{margin:10px 0;font-size:13px;font-weight:500;text-align:center;}
.preview-upload-btn .text span{font-size:12px;}

/*.upload-product-list {
    display: flex;
    flex-wrap: wrap;
    overflow-x: auto;
    white-space: nowrap;
    gap: 20px;
    padding: 10px 0;
    scroll-snap-type: x mandatory;
    width:100%;
}*/

.upload-product-list{
    display: grid !important;
    width: 100%;
    grid-gap: 15px;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

.upload-product-list .model-item-img, #uploadPreList .preview-item{width:100%;margin-bottom:0}
#uploadPreList .preview-item{min-width:220px}
#uploadPreList .preview-item{height:100%;}
.upload-product-list .model-item{width:auto}
.upload-product-list .model-item-img img, #uploadPreList .preview-item img{max-height:304px;object-fit:contain;object-position: top center}
#uploadPreList .preview-item img{height:100%}
.ru-product h2{font-size:18px ;font-weight:500;margin-bottom:10px;margin-top:10px}
/*.ru-product h2 span{border-bottom:3px solid #007bff;padding-bottom:3px;padding-right:10px}*/
#selectProduct .model-scroll-list{height: calc(100vh - 80px);}
/* #summaryProductList{height:calc(100vh - 208px);} */
#summaryProductList .preview-item{width:220px;max-height:288px;height:auto;margin-right:0;}
#summaryProductList .preview-item img{max-height:280px;object-fit: cover;object-position:top center}

.smv-item .preview-item{width:auto;height:100%;position:relative;margin-bottom:0;margin-right:0;}
#summaryModelView.smv-item .preview-item {max-width:450px;}
.smv-item .preview-item img{max-height:100%}
.summary-sidebar{margin-left:0}

.smv-item .preview-item .item-action-btn {
    position: absolute;
    right: calc(50% + 100px);
    transform: translateY(-50%);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight:500;
    z-index: 100;
    text-align:center;
}
.smv-item .preview-item .btn.btn-top,.smv-item .preview-item .add-layer-btn{z-index:200;}
.smv-item .btn .btn-bg{ background-color: var(--primary-btn-color); color: white;width: 120px; padding: 5px 5px; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);border-radius:5px;}
.smv-item .btn .btn-bg .fa-regular{display:none}
.smv-item .btn.check .btn-bg{background:#eee;color:#000;}
.smv-item .btn.check .btn-bg .fa-regular{display:inline;color:var(--primary-btn-color);}
.smv-item .preview-item .btn.disable,.preview-upload-btn.disable{pointer-events:none;opacity:.5;cursor: none}

.smv-item .preview-item .btn-top,.smv-item .preview-item .add-layer-btn {
    top: 30%; /* Chest level */
}

.smv-item .preview-item .btn-bottom {
    top: 63%; /* Knee level */
}

.smv-item .preview-item .btn .btn-bg:hover {
    background-color: var(--primary-green-btn);
    opacity:.9;
}

.smv-item .preview-item .btn-top::before,
.smv-item .preview-item .btn-bottom::before,.smv-item .preview-item .add-layer-btn::before {
    content: '';
    position: absolute;
    width: 66px; 
    height: 1px;
    background-color: #333;
    top: 50%; 
    right: -56px; 
    transform: translateY(-50%);
}

.smv-item .slide-down-options {
  display:none;
  position: absolute;
  top: 100%;
  left: -18px;
  transform: translateX(-50%);
  width: 100%;
  border-radius: 8px;
  z-index: 200;
  min-width:280px
}

.smv-item .slide-down-options .form-group,.smv-item .slide-down-options .img-upload-btn{margin-bottom:5px;background:#fff;box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);;padding:10px 10px;border-radius:5px;}

.smv-item .slide-down-options .optn-btn{display:flex;justify-content:center;align-items:center;width:100%;;margin-top:8px;padding:5px 8px;border-radius:5px;}
.smv-item .slide-down-options .form-group .input-field{display:block;border:1px solid #dedede;border-radius:5px;width:100%;padding:8px 8px;}
.smv-item .slide-down-options .form-group .checkbox-option{display:flex;cursor: pointer;}
.smv-item .slide-down-options .form-group .checkbox{height:18px;width:18px;margin-right:10px;}
.smv-item .img-upload-btn.active{background-color: var(--primary-green-btn);color:  #fff;}

.smv-item .select-option .disabled{pointer-events:none;opacity:.5;}

.smv-item .slide-down-options.open {
  display: block;
  animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
  from {
      opacity: 0;
      transform: translateY(-10px);
  }
  to {
      opacity: 1;
      transform: translateY(0);
  }
}

.smv-item .slide-down-options.active {
  display: block;
  max-height: 200px; /* Adjust height based on content */
}



.cp-section-active{display:block;}

.cps-center-section{border:1px solid #dedede;max-width:400px;margin-top:20px;border-radius:10px}
.cps-center-section .c-image{width:400px;}
.cps-center-section .c-image img{width:100%;height:auto;border-top-left-radius:10px;border-top-right-radius:5px}
.cps-content{padding:15px 15px}
.cps-center-section .cps-bar{border:1px solid #dedede;background:#333;color:#fff;border-radius:25px;padding:10px 15px;width:120px;margin-bottom:15px;display:flex;align-items: center;justify-content: center;}
.cps-center-section .h2{margin-bottom:5px;font-size:18px;font-weight:500}
.cps-center-section p {font:16px;line-height:22px;margin-bottom:10px}
.cps-center-section .btn{border-radius:10px;display:inline-block;background:var(--primary-green-btn);color:#fff}
.summary-product-item-list{flex-direction:column;align-items: center;}
.summary-product-name{font-size:16px;font-weight:500;margin:15px 0 10px;display:flex;align-items: center;justify-content: center;}
/*.cps-center-section .cps-center-content{border:1px solid #dedede}
.cps-center-section .cps-center-content .c-image{width:300px;}
.cps-center-section .cps-center-content .c-image img{width:100%;height:auto;}*/

#selectModel .category-filter-option{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 0}
#selectModel .category-filter-option .select{border:1px solid #dede de;padding:0 5px;border-radius:10px;height:38px;min-width:160px}
#selectModel .section-filter{margin-bottom:10px}


.filter-cat-list {
  overflow-x: auto; 
  scroll-behavior: smooth;
  display: flex;
  gap: 10px;
  width: 100%;
  margin: 15px 0 0 10px;
  padding-bottom: 5px; 
}

.filter-cat-list::-webkit-scrollbar {
  display: none; 
}

.filter-cat-list .cat-item {
  border-radius: 10px;
  height: 38px;
  display: flex;              
  align-items: center;        
  justify-content: center;    
  flex: 0 0 auto;             
  white-space: nowrap;        
}

.filter-cat-list .cat-item a {
  padding: 9px 15px;
  display: flex;             
  align-items: center;        
  justify-content: center;    
  background-color: #fff;
  border: 1px solid #dedede;
  color: #333;
  border-radius: 25px;
  font-size: 14px;
  text-decoration: none;      
  height: 100%;               
  width: 100%;                
  box-sizing: border-box;     
  cursor: pointer;            
}
.filter-cat-list .cat-item a.active,.filter-cat-list .cat-item a:hover{background-color:var(--primary-green-btn);border:1px solid var(--primary-green-btn);color:#fff;}
.filter-cat-list .cat-item a:hover{background:#333;color:#fff;border:1px solid #333;}
#sitModal .modal-text{text-align: center;margin-bottom:10px;padding:0 15px}
.uuproduct-list,.uu-before-images{display:flex;justify-content:flex-start;flex-direction:column;}
#selectProduct .uuproduct-list{flex-direction:row !important;}
/*.uuproduct-list{overflow-x: auto; 
  scroll-behavior: smooth;
 width:calc(100% - 220px);}*/
/*.uu-before-images{
  overflow-x: auto; 
  scroll-behavior: smooth;
  display: flex;
  width:calc(1920px - 1000px);
  flex:1;
}*/

.uu-before-images {
    display: flex;
    flex-wrap: nowrap;
}

/*.smv-upload-img-list {
    position: fixed;
    left:0;
    top:0;
    z-index: 999;
    background:rgba(0, 0, 0, .5);
    height:100%;
    overflow-y: scroll;
    scroll-behavior: smooth;
    width:100%;
}

.smv-upload-img-list .smvupload-imglist-contnet{background:#fff;margin:100px 100px;}*/

/*.smv-upload-img-list{position:fixed;left:0;top:60px;z-index:999;background:#fff;height:calc(100vh - 60px);overflow-y:scroll;scroll-behavior:smooth;
    padding: 15px 10px;}*/
.smv-upload-img-list{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, .5);z-index:999}
.smvupload-imglist-contnet{position: absolute;
    top: 80px;
    left: 112px;
    background: #fff;
    height: calc(100% - 160px);
    width: calc(100% - 224px);}
.smvupload-header{padding:10px 10px;border-bottom:1px solid #dedede;margin-bottom:10px}
.smv-upload-img-list .smvupload-header h3.title{margin-bottom:0}
.smv-upload-img-list .smvupload-header .close i{margin:1px 0 0}

.smv-upload-img-list h3.title{font-size:14px;margin-bottom:8px;font-weight:500}
.smv-upload-img-list .preview-upload-btn{margin-left:10px}

.smv-upload-img-list .upload-btn-list{gap: 10px;margin:0 0 10px}
.smv-upload-img-list::-webkit-scrollbar{display:none}
.smv-upload-img-list .uuproduct-list .uu-before-images .preview-item{margin-right:0}
.smv-upload-img-list .close{width:20px;height:20px;border:1px solid #dedede;display:flex;align-items:center;justify-content: center;border-radius:25px;cursor:pointer;}
/*.smv-btn{position: fixed;
    bottom:0;
    border-radius: 0;
    left: 0;
    width: 201px;
    text-align: center;z-index:300}*/
.smv-btn{width:130px;text-align: center;float:right;margin-right:10px;margin-top:10px}
.smv-btn.disable{pointer-events:none;opacity:.5;cursor:none;}

.smv-upload-img-list .uu-before-images{flex-direction:row;flex-wrap:wrap;}
.smv-upload-img-list .uu-before-images .preview-item{border:1px solid #dedede !important;}
.smv-upload-img-list .uu-before-images{gap:5px}
.smv-upload-img-list .uu-before-images .bottom-text{width:100%;bottom:0}
.smv-upload-img-list .uuproduct-list {
    overflow-y: auto;
    scroll-behavior: smooth;
    height: calc(100vh - 270px);
    width:100%;
}

.smv-upload-img-list .uu-before-preview .image-container{height:222px}

.smv-upload-img-list .smv-u-scroll{display:flex;gap:5px}


.summary-sidebar .step-content{display:flex;align-items: center;justify-content: center;gap:10px;margin-bottom:5px}
.summary-sidebar .sp-step-item{width:135px;height:152px;cursor:pointer;border:1px solid #dedede;display:flex;flex-direction:column;align-items: center;justify-content:center;text-align: center;margin-bottom:10px;background: #fff}
.summary-sidebar .sp-step-item .center-circle-img {
    width: 32px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 56px;
    margin-bottom: 5px;
    background-color: #F2F4F7;
    border:1px solid #ccc;
}
.summary-sidebar .sp-step-item .text{font-size:13px;font-weight:400}
.summary-sidebar .step2 .step-content{margin-bottom:5px}
.sp-step-item.disable{pointer-events:none;opacity:.5}
.summary-sidebar .sp-step-item img{width:100%;height:100%;object-fit:cover;display:flex;border-radius:0;max-height:200px;object-position:top}

.summary-sidebar .sidebar-content{justify-content:flex-start;align-items:flex-start;text-align:left;}
.summary-sidebar .step-process{display:flex;width:100%;flex-direction:column;}
.summary-sidebar .step-header .summary-product-name{margin-bottom:0;font-size:14px;font-weight:400;display:flex;gap:5px}
.summary-sidebar .step-header .summary-product-name span{font-size:13px;display:none;}
.summary-sidebar .step-header .clear-btn{font-size:13px;font-weight:400;display:none}
.summary-sidebar .step-header{align-items:center;justify-content:center;border-bottom:1px solid #dedede;width:100%;margin-bottom:10px;padding-bottom:5px}

.summary-sidebar .step-header .clear-btn{cursor:pointer;}
/*.summary-sidebar .step-header .clear-btn.disable{opacity:0;pointer-events:none}*/

.summary-sidebar.section-sidebar{justify-content:flex-start;}


.uuproduct-list .uu-before-images .preview-item{flex:0 0 auto;cursor:pointer;width:180px;height:auto;min-width:180px;min-height:auto;margin-bottom:0;transition: border 0.3s ease;}
.uuproduct-list .select-model,#selectProduct .select-model{position:absolute;top:20px;right:35px;display:none}

.smv-prev-upload-img .uuproduct-list .uu-before-images .preview-item{margin-bottom:0}

.uuproduct-list .uu-before-images .preview-item img{height:100%;max-height:280px}
.uuproduct-list .preview-item.active{border:2px solid var(--primary-green-btn);}
.uuproduct-list .preview-item.active .select-model{display:block !important;}
.gen-download-btn{position:absolute;top:10px;right:10px;background:var(--primary-green-btn);color:#fff;padding:10px 12px;border-radius:10px}
.download-project-btn{position:absolute;top:5px;left:5px;background:#fff;border:1px solid #dedede;width:22px;height:22px;border-radius:25px;display:flex;justify-content: center;align-items:center;text-align: center;font-size:12px;z-index:1}
#modelScrollList .page-center-text{padding:5px 10px;color:#333;border-radius:5px;display:inline-block;position:absolute;top:60%;left:50%;margin:0 -180px;font-size:15px;font-weight:400}
#uploadPreList .bottom-upload-text,.uu-before-images .bottom-text{position:absolute;bottom:5px;margin:0 auto;background:rgba(0, 0, 0, .5);color:#fff;padding:8px 8px;width:calc(100% - 7px);border-bottom-left-radius:0;border-bottom-right-radius:0}
.uu-before-images .date{position: absolute;
    bottom:34px;
    left: 0px;
    padding: 2px 5px;
    background: #333;
    color: #fff;
    font-size: 9px;
    }
#selectProduct .uu-before-images .date{left:4px}

.uu-before-images .uu-before-preview .delete-btn{bottom:60px;right:10px;cursor:pointer;}
#selectProduct .uu-before-images .uu-before-preview .delete-btn{bottom:45px !important;right:12px !important}
#selectProduct .uu-before-images .uu-before-preview .delete-btn{right:15px}
#selectProduct .uu-before-images .date{bottom:39px}
.uu-before-images .uu-before-preview:hover .delete-btn{display:flex;}
#uploadPreList .preview-item{margin-right:10px}
.scroll-container {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    width:100%;
  }

#selectProduct .scroll-container{display:table-row !important;}

.uuproduct-list {
    overflow-x: auto; 
    scroll-behavior: smooth;
    

}
.uuproduct-list::-webkit-scrollbar {
  display: none; 
}

.uu-before-preview .preview-item{
  perspective: 1000px;
}


.uu-before-preview .image-container,.hover-effect .image-container{
    width: 100%;
    height: 210px;
    position: relative;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

#selectProduct .uu-before-preview .image-container{height:315px;}
.hover-effect .image-container{height:520px;max-height:520px;}
#genASModel .hover-effect .image-container{min-width:434px !important;height:100%}
#genASModel .preview-item{min-width:440px;max-width:440px}
#selectProduct .uuproduct-list h3.title{margin-bottom:10px;}
.genASModel .image-container{height:100%}
#genASModel{height: calc(100vh - 80px);}
#genASModel .preview-item{border-radius:0;padding:0;border:none}

.uu-before-preview .preview-item:hover .image-container, .hover-effect:hover .image-container {
    transform: rotateY(180deg); /* Flip the image */
}

.uu-before-preview .front-image,
.uu-before-preview .back-image,.hover-effect .image-container .front-image,.hover-effect .image-container .back-image {
    width: 100%;
    height: 100%;
    backface-visibility: hidden; /* Hide the back when the front is visible */
    position: absolute;
    top: 0;
    left: 0;
}

.uu-before-preview .front-image,.hover-effect .front-image {
    z-index: 2; /* Keep the front image on top initially */
}

.uu-before-preview .back-image, .hover-effect .back-image {
    transform: rotateY(180deg); /* Position the back image flipped */
    z-index: 1;
}

.scroll-btn {
    display:none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.5);
    color: white;
    border: none;
    padding: 10px;
    cursor: pointer;
    font-size: 18px;
    z-index: 10;
    transition: background 0.3s;
}

.scroll-btn:hover {
    background: rgba(0, 0, 0, 0.8);
}

.left-btn {
    left: 0;
}

.right-btn {
    right: 0;
}
#dMessageModal .btn{margin:15px 0 0;min-width:120px}

/*--page-content--*/



.sm-container{width: calc(100% - 400px);margin: 0 auto;}
.page-title{display:flex;font-size:20px;font-weight:500;margin:20px 0;align-items:center;justify-content:center;}
.sbc-item{display:flex;flex-direction:column;margin-bottom:20px}
.sbc-item h2{font-size:17px;line-height:26px;}
.sbc-item h3{font-size:15px}
.sbc-item .list{margin-bottom:15px}
.sbc-item .list li{margin:5px 0 20px}
.sbc-item .dote-list{list-style:disc;margin-left:45px}
.sbc-item .list li:last-child{margin-bottom:0}
.sbc-item p{line-height:26px;}
.cpc-content{justify-content:center;display:flex;flex-direction: column;text-align: center;}
.cpc-content h4{font-size: 20px;
    margin-bottom: 10px;
    color: #333333;}
.cpc-content,.ppc-content{min-width: 325px;
    border: 1px solid #dedede;
    border-radius:10px;
    padding: 10px 10px 10px 10px;
    margin: 0 10px 0 0;}
  .ppc-content{display:flex;justify-content:center;flex-direction:column;align-items:center;}
.cpc-content p{margin-bottom:10px;line-height:22px;font-size:13px;font-weight:400}
.cpc-content p:last-child,.page-section-form .form-group:last-child{margin-bottom:0}
.page-section-form{flex:2;min-width:350px}

.ppc-content .plan-details {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom:25px;
  flex-direction:column;
}

.ppc-content .label {
  font-size: 14px;
  color: #555;
  font-weight: 500;
}

.ppc-content .value {
  font-size: 18px;
  color: #000;
  font-weight: 700;
}
.ppc-content .value span{font-size:13px;font-weight:400}


@media (max-width: 1024px) {
  .sm-container{width: calc(100% - 30px)}
}

@media (max-width: 992px) {
  .cp-section-content .contact-flex{display:block !important;}
  .cp-section-content .contact-flex .cpc-content{margin-bottom:15px}
  .page-section.cpassword-page-section, .ps-center-form{border-radius:0}
}

/*pricing*/
.icon-rg5{margin-right:5px}
.section-content-header{border:none;box-shadow:none;display:flex;flex-direction: column;justify-content: center;width:auto;align-items: center;padding:0}
.pp-section-content .tab-content{display:flex;justify-content:space-between;display:none}
.pp-section-content .tab-content.active{display:flex;}
.liner-g-bg{background: linear-gradient(135deg, 
        rgba(0, 0, 0, 0.1) 10%,   /* Light grey with 90% opacity */
        rgba(242, 244, 247, 0.5) 50%,  /* Mid-grey with 60% opacity */
        rgba(0, 0, 0, .2) 95%           /* Black with full opacity */
    );}
.p-small-text{font-size:16px;color: rgba(71,84,103,1)}
.section-p50{padding:50px 0}
.pp-section-content .tab-content {
    display: flex;
    flex-wrap: wrap;
    justify-content:flex-start;
    gap: 15px; 
    color: #fff;
}
.tab-flex-bg{background:var(--repcolor9);padding:15px 15px 25px;border-radius:10px;flex: 1 1 calc(33% - 15px);
    max-width: calc(33% - 15px);
    box-sizing: border-box;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1)}
.pp-section-content .tab-content .btn{width:100% !important;padding:0 !important;margin-bottom:10px;}
.plan-tab-bg{padding-top:40px}
.price-tab-content{flex-wrap:wrap;}
.price-tab-content .btn a{display:block;color: #fff;padding:12px 15px}
.tab-flex .btn{font-size: var(--md-font-size)}
.tab-title h2{font-size:16px !important;margin-bottom:10px;font-weight:500}
.tab-title .creadit{font-size:13px;color:#333;font-weight:400}
.tab-title .creadit span{font-size:17px;font-weight:500;color:var(--repcolor10);}
.tab-plan-description{width:200px;font-size:13px;line-height:18px;color:#333}
.tab-content .price{font-size:22px;margin:10px 0;font-weight:500;color:#333}
.tab-content .price .price-text{font-size:13px;font-weight:400;color:var(--repcolor12);}
.tab-content .tt-value-plan{position:absolute;top:5px;right:0}
.tt-value-plan {
    display: inline-block;
    padding: 5px 15px;
    font-size: 14px;
    font-weight: 500;
    color: white;
    background: linear-gradient(90deg, var(--primary-green-btn), #d6bbfb99);
    position: relative;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 1px;
    animation: shine 3s infinite linear;
    border-bottom-left-radius: 5px;
    border-top-left-radius:5px;
}

@keyframes shine {
    0% {
        background-position: -200%;
    }
    100% {
        background-position: 200%;
    }
}

.tt-value-plan::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 200%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.3));
    transform: skewX(-30deg);
    animation: shimmer 2s infinite;
}

@keyframes shimmer {
    0% {
        left: -100%;
    }
    100% {
        left: 100%;
    }
}
.flex-gap10{gap:10px}
.flex-gap50{gap:50px}
.tab-content.flex-gap,.flex-gap{gap:20px}

.price-slider{margin-bottom:20px;display:flex;align-items: center;display:none}

.switch-tabs{margin-bottom:25px;background:#fff;padding:8px 8px;border-radius:10px;font-size:16px}
.switch-tabs .tab{padding:15px 15px;background:transparent;border-radius:10px;cursor:pointer;}
.switch-tabs .tab.active{background:var(--repcolor12);color:var(--repcolor6);}
.switch-tabs .tab.active .tab-span-bg{background:#fff;color:#333}
.switch-tabs .tab .tab-span-bg{background:var(--repcolor9);padding:8px 8px;border-radius:10px;font-size:14px}
.feature h3{margin-top:15px;margin-bottom:15px;display:flex;align-items: center;flex-direction: column;font-size:14px;font-weight:500}
.feature ul{list-style:none;clear:both;float:none}
.feature ul li{margin-bottom:15px;}
.feature ul li span.icon{margin-right:5px;}
.feature ul li:last-child{margin-bottom:0;}

.advantage-item-content { display: flex; flex-wrap: wrap; gap: 20px;
 margin-top:20px; }

.advantage-item {
    flex: 1 1 calc(23% - 20px);
    box-sizing: border-box;
    border: 1px solid #ddd;
    padding: 15px;
    border-radius: 10px;
    background: #fff;
    text-align: left;
   
}

    .advantage-item img {
        max-width: 100%;
        height: auto;
        border-radius: 5px;
    }

    .advantage-item h2 {
        font-size:18px;
        margin: 10px 0;
    }

    .advantage-item p {
        font-size: 15px;
        line-height:22px;
        color: #555;
        height:60px;
    }

    .advantage-item-bottom span {
        display: inline-block;
        background:var(--repcolor12);
        color: white;
        padding: 8px 12px;
        border-radius: 10px;
        margin: 20px 5px 5px 0;
        font-size:13px;
    }

    /* Responsive Design */
    @media (max-width: 768px) {
        .advantage-item {
            flex: 1 1 calc(50% - 20px); /* Two items per row on tablets */
        }
    }

    @media (max-width: 480px) {
        .advantage-item {
            flex: 1 1 100%; /* One item per row on small screens */
        }
    }
.faqs-section,.faqs-section-content{width:60%;margin:0 auto;display:flex;flex-direction:column;gap: 20px}
.faq-item .faq-ques-item{border:1px solid #dedede;border-radius:10px;padding:15px 15px;margin-bottom:15px;cursor: pointer;}
.faq-item-content h6{font-size:15px;font-weight:400;color:var(--repcolor12);}
.faq-item-content p{font-size:14px;font-weight:400;line-height:22px;margin:0 0 25px 15px;position:relative;}
.faq-item-content p.dote{padding-left:20px}
.faq-item-content p.dote:before{content: '';
    position: absolute;
    top: 8px;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background: #333;}
.faq-ans-item{display:none;}
.faq-item.active .icon {
    transform: rotate(180deg); /* Rotate the icon when active */
    transition: transform 0.3s ease;
}
.faqs-section .section-header .s-heading{margin-bottom:15px}

 @media (max-width: 768px) {
       .faqs-section-content{width:100%}
    }

/*home screen*/
.sm-container{width:calc(100% - 400px);margin:0 auto;}
.full-page-banner {
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position:top 0;
    width: 100%;
    height:125vh;
    display: flex; 
    align-items: center;
    justify-content: flex-start;
    animation: moveBg 15s linear infinite alternate;
    position:relative;
}
.full-page-banner:after{content:'';position:absolute;background:rgba(0, 0, 0, .5);width:100%;height:100%;z-index:1}

.hb-content {
    text-align: left; 
    max-width: 600px; 
    padding-left: 20px;
    flex-direction: column;
    position:relative;
    z-index:2;
}
.video-source{display:none}
.video-source.active{display:block;}
.hb-content .hb-title{font-size:36px;line-height:46px;color: var(--repcolor12);margin-bottom:15px;font-weight:700;color:var(--repcolor6)}
.hb-content .hb-sm-title{font-size:18px;line-height:32px;font-weight:500;margin-bottom:25px;color:var(--repcolor6)}
.hb-content .btn{text-decoration: none;padding:18px 35px;font-size:18px;background:var(--repcolor12);border:1px solid var(--repcolor12);}
.hb-content .btn.store-btn{background:var(--repcolor6);color:var(--repcolor12);border:1px solid var(--repcolor6);}
.hb-content .btn.store-btn span{display:block;color:var(--repcolor12);font-size:13px}
.hpw-video-bg{background:#333;padding:20px 20px 0;width:100%;margin:0 auto 20px;border-radius:10px}
.hpw-video-bg .video{width:100%;height:auto;}
.hp-work-section .p-small-text,.hp-business-section .p-small-text{width:100%;margin:0 auto 40px;text-align:center;}
.hpw-tabs h3{font-size:20px;margin-bottom:10px}
.hpw-tabs p{font-size:15px;line-height:22px;font-weight:400;margin-bottom:5px;width:300px}
.hpw-tabs .hp-video-progress{margin-bottom:20px}
.htw-btn a{padding:20px 50px;font-size:18px;background:var(--repcolor12);color: var(--repcolor6);text-decoration:none} 
.hpb-group-itrems{display:flex;align-items: center;justify-content:center;margin:20px 0 30px;gap:60px}
.hp-brand-section h3,.hp-customer-section h3{font-size:22px;margin-bottom:25px;font-weight:500}
.hpc-section-bg{background:var(--repcolor12);color: #fff}
.hp-customer-section .list{margin:30px 0 0}
.hp-customer-section .item{width:150px;font-size:16px;text-align: center;font-weight:500}
.hp-customer-section .number{font-size:36px;line-height:42px;font-weight:500;margin-bottom:5px}
.res-image{width:100%;height:auto;}
.flex-img{max-width:500px}
.flex-caption{font-size:16px;margin-bottom:10px}
.hp-content .flex-content h2{font-size:22px;margin-bottom:15px}
.hp-content .flex-content p{font-size:18px;line-height:26px}

.hpb-group-itrems .brand-logo{width:160px;height:auto;}
.hpb-group-itrems .brand-logo img{width:100%;height:auto;}
/* General container styling */
.soulation-card-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 columns */
    gap: 30px; /* Space between grid items */
    margin: 50px 0 0;
}

.s-card {
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
}



/* Image styling */
.s-card img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}
.s-card h2{margin-bottom:10px;font-size:18px;line-height:26px;margin-top:10px}
.s-card p{line-height:22px;font-size:15px}

/* Responsive design */
@media (max-width: 1024px) {
    .soulation-card-list {
        grid-template-columns: repeat(2, 1fr); /* 2 columns on medium screens */
    }
}

@media (max-width: 768px) {
    .soulation-card-list {
        grid-template-columns: 1fr; /* 1 column on small screens */
    }
}

.hpb-flex-content .h2{margin-bottom:10px;font-size:22px}
.hpb-flex-content p{font-size:17px;line-height:26px;width:500px}


/*--testimonial-slider--*/

.testimonial-section {
    background-color: #f9f9f9;
    padding: 60px 20px;
}

/* Testimonial Content */
.testimonial-content {
    flex: 1;
    position: relative;
    max-width: 600px;
}

.testimonial-slider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.testimonial-card {
    display: none;
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15), 
                0 -10px 20px rgba(0, 0, 0, 0.1),
                10px 0 20px rgba(0, 0, 0, 0.1),
                -10px 0 20px rgba(0, 0, 0, 0.1);
    transition: opacity 0.5s ease-in-out, box-shadow 0.3s ease-in-out;
    margin-top:30px;
}



.testimonial-card.active {
    display:flex;
    opacity: 1;
}

.testimonial-card-img{width:600px;height:auto;}
.testimonial-card-img img{width:100%;height:auto;display:flex;border-top-left-radius:5px;border-bottom-left-radius:5px}
.testimonial-card-content{position:relative;padding:30px 30px}

.testimonial-text {
    font-size: 2.6rem;
    color: #555;
    margin-bottom: 20px;
    line-height:52px;
    width:80%;
}

.testimonial-author {
    display: flex;
    align-items: center;
    gap: 15px;
    position:absolute;
    bottom:30px;
    right:30px;
}

.author-img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
    border:2px solid #dedede;
    padding:5px 5px;
}

.author-info {
    text-align: left;
}

.author-name {
    font-size: 1rem;
    font-weight: 500;
    color: #333;
}

.author-role {
    font-size: 0.9rem;
    color: #777;
}

/* Slider Controls */
.slider-controls {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.slider-btn {
    background-color: var(--primary-green-btn);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.5rem;
    margin: 0 10px;
    transition: background-color 0.3s;
}

.slider-btn:hover {
    background-color: var(--primary-green-btn);
}

/* Testimonial Image */
.testimonial-image {
    flex: 1;
    display: flex;
    justify-content: center;
}

.testimonial-image img {
    max-width: 100%;
    border-radius: 10px;
}

/* Responsive Design */
@media (max-width: 768px) {
    .container {
        flex-direction: column;
        text-align: center;
    }

    .testimonial-content {
        max-width: 100%;
        margin-bottom: 20px;
    }

    .testimonial-image {
        order: -1;
    }
}



.footer {
    background-color: #111;
    color: white;
    padding: 40px 20px;
}



.footer-logo {
    flex: 1;
    min-width: 250px;
    margin-bottom: 20px;
}

.footer-logo h2 {
    font-size: 1.8rem;
    margin-bottom: 10px;
}

.footer-logo p {
    font-size: 1rem;
    line-height: 1.6;
    color: #ccc;
    width:500px;
}

.footer-links {
    display: flex;
    flex: 1;
    justify-content: space-around;
    min-width: 300px;
    margin-bottom: 20px;
}

.footer-links ul {
    list-style: none;
    padding: 0;
}

.footer-links ul li {
    margin-bottom: 10px;
}

.footer-links ul li a {
    text-decoration: none;
    color: #ccc;
    font-size: 1rem;
}

.footer-links ul li a:hover {
    text-decoration: underline;
    color: white;
}

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

.footer-socials a {
    color: white;
    font-size: 1.2rem;
    text-decoration: none;
}

.footer-socials a:hover {
    color: #ccc;
}

.footer-bottom {
    text-align: center;
    margin-top: 20px;
    font-size: 0.9rem;
    color: #666;
}

.footer-bottom a {
    text-decoration: none;
    color: #ccc;
}

.footer-bottom a:hover {
    color: white;
}

/*animtion*/
.animation-container {
    position: relative;
    width: 100%;
    height: 600px;
    border: 20px solid #333;
    padding: 20px;
    margin: 0 auto 20px;
    border-radius: 10px;
    overflow: hidden;
    display:none;
    justify-content: center;
    align-items: center;
}
.animation-container.active{display:flex;}

.animation-container .image {
    position: absolute;
    width: auto;
    height: 100%;
    opacity: 0;
    transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    object-fit: cover;
}

.animation-container .final {
    left: 50%;
    transform: translateX(-50%);
    animation: showFinal 1s ease-in-out 5s forwards;
}

.hpw-tab-logo img{position:absolute;z-index:1;width:90px;height:auto;top:35px;left:35px;}


.payment-history-table {
    width: 100%;
    border-collapse: separate;
    border-spacing:0;
    overflow: hidden;
    border:1px solid #ddd;
    border-radius:5px;

}

.payment-history-table th, 
.payment-history-table td {
    padding: 12px 15px;
    text-align: left;
    border: 1px solid #ddd;
    font-size: 13px;
    color: #333;
    font-weight:500;
    border-bottom:none;
    border-right:none;
    border-top:none;text-align: center;
}
.payment-history-table th:first-child, 
.payment-history-table td:first-child{
  border-left:none;
}

.payment-history-table td{font-weight:400}

.payment-history-table th {
    background-color: #fcfcfc;
    text-transform: uppercase;
}

.payment-history-table tr:nth-child(even) {
    background-color: #fcfcfc;
}



.payment-history-table .status {
    text-align: center;
/*    border-radius: 4px;*/
    padding: 5px;
    color: #fff;
}

.payment-history-table .status.success {
    background-color: #4caf50;
    color: #fff !important;
}

.payment-history-table .status.pending {
    background-color: #ff9800;
}

.payment-history-table .status.failed {
    background-color: #f44336;
}

.payment-history-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  border-bottom:1px solid #ddd;
}
.payment-history-table tbody {
  display: block;
  max-height:calc(100vh - 238px);
  overflow-y: auto;
  scroll-behavior:smooth;
}

.payment-history-table tbody::-webkit-scrollbar{display:none}

.payment-history-table thead,
.payment-history-table tbody tr {
  display: table;
  width: 100%;
  table-layout: fixed;
}

.filter-form .form-group{margin-right:10px;margin-bottom:10px;display:flex;flex-direction:column;}
.filter-form .form-group label{margin-bottom:3px;font-size:13px;font-weight:500;color:#333}
.filter-form .form-group .input-field{border:1px solid #dedede;padding:10px 10px;min-width:250px;font-size:13px;}
.filter-form .form-group.date-field .input-field{min-width:160px}
.filter-form .form-group .select{padding:10px 10px;min-width:160px;border:1px solid #dedede;font-size:13px;}
.filter-form .form-group .input-field, .filter-form .form-group .select,.filter-form .form-group .btn{border-radius:10px;font-family:"Roboto", serif;}
.input-icon {
    position: relative;
}
.input-icon i {
    position: absolute;
    top: 50%;
    left: 10px; 
    transform: translateY(-50%);
    font-size: 16px;
    color: #888;
    z-index: 10;
}
.input-icon .input-field,
.input-icon select {
    padding-left: 30px !important; 
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 100%;
    box-sizing: border-box;
    height: 38px;
}

.input-icon .date-picker {
    padding-left: 35px;
}
#paymentForm{max-height:calc(100vh - 200px);overflow-y:scroll;scroll-behavior:smooth;}
#paymentForm::-webkit-scrollbar {
  width: 5px; 
  height: 5px;
}

#paymentForm::-webkit-scrollbar-thumb {
  background: #888; 
  border-radius: 10px; 
}

#paymentForm::-webkit-scrollbar-thumb:hover {
  background: #555;
}

#paymentForm::-webkit-scrollbar-track {
  background: #f1f1f1; 
}

.hidden-scrollbar {
  overflow: hidden;
}

.scroll-visible {
  overflow: auto;
}

.gen-product-result .overlay-loader{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;background:#333;border-radius:10px;z-index:100;align-items:center;}

.alert{
  float:none;
  text-align:left;
  clear:both;
  width: 100%;
  margin-bottom:0;
}

#selectSummary .full-container,#selectModel .full-container{width:100% !important}
#genASModel.smv-item{display:flex !important;margin-top:10px}
.gen-asm-download-btn{background:var(--primary-green-btn);color:#fff;padding:10px 15px;font-size:14px;border-radius:10px;position:absolute;right:15px;z-index:99}
.gen-asm-download-btn a{color:#fff !important;}
.gen-asm-download-btn.active{opacity:1;pointer-events:all;visibility: visible;cursor:pointer;}
.sidebar-content .credit-count{font-size:13px;}
.upload-image-modal .uploaded-img:hover .delete-btn,#sitModal .uploaded-img:hover .delete-btn{display:flex !important;}
.upload-image-modal .uploaded-img .delete-btn,#sitModal .uploaded-img .delete-btn{top: 10px;right:10px}


.genproject-cp-item a{width:100%;height:326px;font-weight:500;background:#fff;border:1px solid #dedede;margin-right:0;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#333 !important}
.genproject-cp-item .center-circle-img{width: 56px;
    height: 56px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 56px;
    background-color: #F2F4F7;margin-bottom:8px}
#genASModel .layer{position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: rgba(0, 0, 0, .5);
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    border-radius:0;
    pointer-events: none;
    cursor:none;
    z-index:100;
  }

#genASModel .layer .layer-bg{background:#fff;padding:15px 15px;text-align:center;display:flex;align-items: center;justify-content: center;flex-direction: column;}
#genASModel .layer .layer-bg .shapes-8{margin-bottom:20px;margin-top:20px}
#genASModel .progress-bar{background:none;color:#333 !important;height:auto;padding:0;font-size:16px;font-weight:400; width: 300px;}
#genASModel .layer .progress-bar-line{display:flex;justify-content: center;align-items: center;}
#genASModel .layer .line-bar{position:relative;width:100%;height:5px;background:#dedede;margin-left:5px}
#genASModel .layer .line-bar-per{position:absolute;top:0;left:0;width:0;background:var(--primary-green-btn);height:5px}
#genASModel .layer .progress-message{margin-top:0}

#genASModel .progress-bar{color: #fff}
#summaryModelView .preview-item .item-action-btn.half-hidden-rectangle{left: calc(50% + 125px);width:120px}
#summaryModelView .btn-full:before{
    content: '';
    position: absolute;
    width: 38px;
    height: 1px;
    background-color: #333;
    top: 50%;
    left: -28px;
    transform: translateY(-50%);
}
#summaryModelView .btn-full:after{
 content: "";
    position: absolute;
    top: -70px;
    left: -83px;
    width: 53px;
    height: 191px;
    border: 2px solid #000;
    border-left: none;
    pointer-events: none;
    display:none;
}

#selectModel{position:relative;}

/* Filter Sidebar styles */
.filter-sidebar {
  position: absolute;
  top: 0;
  left: -300px; 
  width: 300px;
  height:calc(100vh - 60px);
  background: #fff;
  transition: left 0.3s ease;
  z-index: 1000;
}


.filter-sidebar.active {
  left: 0;
}


.filter-icon {
  background: var(--primary-green-btn);
  color: #fff;
  border: none;
  padding: 10px 15px;
  border-radius: 4px;
  cursor: pointer;
  z-index: 10;
  width:fit-content;
  font-weight:400;
}

.model-scroll-list {
  position: relative;
  
}

.filter-sidebar .filter-sidebar-header{padding:10px 10px 0;font-weight:500;cursor:pointer;}
.filter-sidebar .filter-sidebar-header .close{width:22px;height:22px;border:1px solid #dedede;border-radius:25px;display:flex;justify-content: center;align-items: center;}
.filter-sidebar .fs-content{height: calc(100vh - 95px);overflow-y:scroll;scroll-behavior: smooth;}
.filter-sidebar .fs-content::-webkit-scrollbar{display:none}
.filter-sidebar .fs-content .fs-title{font-size:14px;font-weight:500;border-bottom:1px solid #dedede;padding:10px 10px 5px;margin-bottom:10px}
.fs-itme-list{display:flex;gap:10px;flex-wrap:wrap;margin-left:10px;margin-right:10px;margin-bottom:10px}
.fs-itme-list .item{padding: 9px 15px;
  display: flex;             
  align-items: center;        
  justify-content: center;    
  background-color: #fff;
  border: 1px solid #dedede;
  color: #333;
  border-radius: 25px;
  font-size: 13px;
  text-decoration: none;      
  box-sizing: border-box;     
  cursor: pointer; }
  .fs-itme-list .item.active{border:1px solid var(--primary-green-btn);background:var(--primary-green-btn);color:#fff}
  .filter-wraper-content{transition: left 0.3s ease;}
  .filter-wraper-content.mgleft{margin-left:300px;transition: left 0.3s ease;}
#genASModel{flex-direction:row;justify-content: center;gap:0}
#genASModel .name{position:absolute;top:10px;left:10px;background:#333;color:#fff;border-radius:5px;padding:2px 3px;font-size:11px}
#selectProduct .model-scroll-list{width:100%}
#selectProduct .user-upload-product{margin-top:0}
#selectProduct hr{display:none}
.section-body-content .pagination{z-index:10;;position:fixed;font-size:13px;font-weight:400;text-align:center;bottom:10px;right:10px;display:flex;width:calc(100% - 30px);justify-content:space-between;align-items:center;}
.section-body-content .pagination ul.pagination{position:relative;width:100%;bottom:0}
.section-body-content #per_page{border:1px solid #dedede;border-radius:5px;padding:5px 10px}
.section-body-content .pagination ul li{border:1px solid #dedede;padding:5px 5px;border-radius:5px;margin-left:5px}
.section-body-content .pagination ul li.active{background:#333;color:#fff}
.section-body-content .p-2{margin-top:5px}
.section-body-content .pagination .pagination{width:400px;display:flex;justify-content: flex-end;overflow-x:scroll;scroll-behavior: smooth;}
.section-body-content .pagination .pagination::-webkit-scrollbar{display:none}
#summaryModelView .btn{padding:10px 10px}
.sm-show{display:none}
.price-page-section .section-header p{width:60%;margin:0 auto;font-size:14px !important;text-align:center;font-weight:400;margin-bottom:20px;line-height:22px;}
.plan-tab-bg{color:#333}
.price-tab-content p{font-size:13px;font-weight:400;margin-bottom:10px}
.price-info-content .h4{margin-bottom:10px}
.price-info-content ul li{margin-bottom:10px;font-size:13px;font-weight:400;display:flex;align-items:flex-start;}
.price-info-content ul li .fa-check{color:#009f74;margin-right:5px;margin-top:2px}
.price-info-content h4{font-weight:500;line-height:20px;font-size:14px}
.pp-section-content .tab-content{width:90%;margin:0 auto;}
.pp-section-content .section-header .h3{font-size:16px;margin-bottom:5px;font-weight:500}
.price-page-section .php-work .section-header p{font-size:16px !important}
.pp-work-content .credit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    justify-content: center;
    padding: 20px;
}

.pp-work-content .card {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
}

.pp-work-content .card h2{text-align: center;font-size:18px;font-weight:500}
.pp-work-content .credit-grid h3{font-size:14px;margin-bottom:10px ;font-weight:400;text-align:center;}
.pp-work-content .credit-grid .list{display:flex;flex-wrap: wrap;gap:10px;justify-content: center;}
.pp-work-content .credit-grid .list li{border:1px solid #dedede;padding:10px 10px;border-radius:10px;min-width:120px;display:flex;justify-content: center;align-items: center;font-weight:500;font-size:13px}

.php-work .p-small-text{width:80%;margin:0 10%}

.model-item-list{gap:0;grid-template-columns: repeat(4, 1fr);}
.model-item-list .model-item-content{position:absolute;bottom:0;width:100%;padding:10px 0;background:rgba(0,0,0,.5);color:#fff;display:none !important;}
.model-item-content .name{font-weight:600;display:none;}
.model-item-content .age-group{color:#fff;padding:2px 8px;text-align:left;}
.model-item-list .model-item .model-item-img{padding:0;margin-bottom:0;border-radius:0;border:none}
.model-item-list .model-item .model-item-img img{border-radius:0;}
.genproject-item-list{display:grid;grid-template-columns:repeat(6, 1fr);gap:5px;}
.preview-item.no-flip .image-container,.hover-effect.no-flip .image-container {
  transform: none !important; /* Prevent flipping if no back image */
}
#selectModel .model-item:hover .model-item-content,#selectModel .model-item:hover .fav-item{display:block !important;}
.filter-icon{position: relative;}
.filter-icon .box-top {position:absolute;top:0;color:#333;right:18%;margin:0 -24px;top:-9px;background-color:#eee;padding:0 10px 0;border:1px solid #333;color:#333;border-radius:25px;font-size:12px;line-height:16px}

#selectProduct .uuproduct-list .uu-before-images .preview-item img{object-fit: contain;
    object-position: center;
    width: 100%;
    max-width: 100%;
    max-height: 100%;}
.fw-header{padding:15px 15px 0 15px;}
.fw-header .filter-icon{margin-right:10px}

.fs-location-box{position:fixed;bottom:0;background:#fff;padding:10px 10px;width:300px;border-top:1px solid #dedede;cursor:pointer;}
.fs-location-box .fslocation-box-header{margin:0 0 5px}
.fs-location-box .beta{font-size:12px;color:var(--primary-green-btn);margin-left:3px;font-weight:500}
.fs-location-box img{width:100%;height:100%;display:flex;}

#selectModel .model-item .premium-item,#summaryModelView .premium-item{position:absolute;top:10px;left:10px;display:flex;align-items:center;justify-content:space-between;z-index:10}
#selectModel .model-item .premium-item,#summaryModelView .premium-item{border-radius:25px;border:1px solid #dedede;padding:5px 10px;background:#fff;font-size:13px;font-weight:400}
#selectModel .model-item .premium-item i,#summaryModelView .premium-item i{color:#FFC000;margin-right:3px}
#selectModel .model-item .fav-item{position:absolute;cursor:pointer;top:10px;right:10px;background:#333;padding:6px 6px;color:#fff;z-index:100;display:none}
#selectModel .model-item .fav-item.active{background: var(--primary-green-btn);color:#fff;display:block;}
#selectModel .select-model{top:10px}
#selectModel .model-item .select-model{top:50%;right:50%;width:42px;height:42px;margin:-21p -21px;background:var(--primary-green-btn);border-radius:25px;font-size:20px;font-weight:400;justify-content:center;align-items: center;}
#selectModel .model-item .select-model.active{display:flex;}
#selectModel .filter-icon{background:transparent !important;color:#333;border:1px solid #dedede;}
#selectModel .filter-icon.active{background:var(--primary-green-btn) !important;color:#fff}
#selectModel .model-item-list.none{display: none !important}

#selectModel .map-preview.none,#selectModel .model-item-list.none{display:none !important}

#selectModel #map{width:100%;height:calc(100vh - 130px);}

/* Hide Google logo */
#map .gm-style-cc, .gmnoprint a, .gmnoprint span {
    display: none !important;
}

/* Hide full-screen control */
#map .gm-fullscreen-control {
    display: none !important;
}

/* Hide bottom right navigation links */
#map div.gmnoprint {
    display: none !important;
}

#map .gm-style-cc, .gmnoprint a, #map .gmnoprint span {
    display: none !important;
    opacity: 0;
    visibility: hidden;
}

#selectModel #backLocation{display:none}
#selectSummary .preview-item,#selectSummary .preview-item img{border:none;border-radius:0;padding:0}
.summary-full-image{width:81%}
.summary-sidebar .spc-item{display:none}
.summary-sidebar .spc-item.active{display:block;}
.step-process-header{gap:0;margin-bottom:8px;border:1px solid #dedede;}
.step-process-header .stp-header-item{width:100%;padding:8px 0;cursor:pointer;display:flex;align-items: center;justify-content: center}
.step-process-header .stp-header-item.active{background:var(--primary-green-btn);color:#fff}
.soc-image{gap: 10px}
.step-process-content .step-option-content .input-field{width:100%;height:28px;border:1px solid #dedede;border-radius:0;padding:10px 10px;margin-bottom:5px}
.step-process-content .step-option-content .no-change-btn{width:100%;border:1px solid #dedede;padding:5px 10px;display:flex;justify-content: center;cursor:pointer;align-items: center;gap:5px;background: #fff}
.step-process-content .step-option-content .no-change-btn.active{background:var(--primary-green-btn);color:#fff}
.prev-btn{margin-left:15px;display:inline-block;margin-bottom:10px}

.step-process-content .step-option-content .disable{opacity:.5;pointer-events:none;cursor:none}
.step-process-content .disable{opacity:.5;pointer-events:none;cursor:none}


.stp-header-item.disable{opacity:.4;pointer-events: none;cursor: none}
.genproject-item-list .gen-project-item a{display:block;width:100%;height:100%}
.genproject-item-list .gen-project-item img{border-radius:0;background:#fff}

#genASModel .preview-item img{border-radius:0 !important;}
#genASModel .layer .shapes-8 {
  width: 20px;
  height: 20px;
  display: grid;
  animation: sh8-0 1.5s infinite linear;
}
.shapes-8:before,
.shapes-8:after {
  content: "";
  grid-area: 1/1;
  background:#25b09b;
  clip-path: polygon(0 0%,100% 0,100% 100%);
  animation: inherit;
  animation-name: sh8-1;
}
.shapes-8:after {
  --s:-1;
}

.map-search .search-container {
    position:absolute;
    z-index: 10;
    top:0;
    left:10px;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 280px;
    margin: 10px auto;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
    padding: 8px;
    font-weight:400;
}

.map-search #searchInput {
    width: 100%;
    border: none;
    padding: 5px 25px 5px 30px;
    font-size: 14px;
    font-weight:400;
    outline: none;
    border-radius: 8px;
}

.map-search .search-icon {
    position: absolute;
    left: 12px;
    color: #555;
    font-size: 16px;
    cursor: pointer;
    z-index: 9;
}
.map-search .search-close{position:absolute;right:6px;color:#555;font-size: 16px;
    cursor: pointer;
    padding:0 0 0 6px;
    z-index: 9;border-left:1px solid #dedede;height:42px;display:none;align-items: center;justify-content: center;}
.map-search .search-close.active{display:flex !important;}



.map-search-result{position:fixed;top:125px;left:0;padding:70px 24px 0 24px;width:328px;height:calc(100vh - 125px);background:#fff;display:none}
.map-search-result .msr-contnet-list{height:calc(100% - 40px);overflow-y:scroll;scroll-behavior: smooth;}
.map-search-result .msr-contnet-list::-webkit-scrollbar{display:none}
.msrc-list-item{border:1px solid #dedede;box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);;
    margin-bottom: 10px;
    padding: 10px 10px;
    border-radius: 5px;font-weight:400;cursor:pointer;}
.msrc-list-item .name{font-size: 20px;
    line-height: 26px;
    margin-bottom: 5px;font-weight:400}
.msrc-list-item.active{background:var(--primary-green-btn);color: #fff}





.map-search-result .img-list{display:flex;}
.map-search-result .img-list .img{width:200px;height:auto;}
.map-search-result .img-list .img img{width:100%;height:100%;object-fit:contain;}
.map-search-result h4{font-size:18px;font-weight:400;margin-bottom:10px}

 .autocomplete-suggestions {
    max-height: 150px;
    overflow-y: auto;
    position: absolute;
    background: white;
    width: 270px;
    z-index: 1000;
    top:45px;
}
 .autocomplete-suggestions::-webkit-scrollbar{display:none}
.autocomplete-suggestion {
    padding: 8px;
    cursor: pointer;
}
.autocomplete-suggestion:hover {
    background: #f0f0f0;
}

.imgGBtn .spendTime{display:flex;justify-content:center;align-items: center;margin-top:3px;font-size:11px;line-height:14px;font-weight:400;}


#totalCreditsCount{display:flex;align-items: center;justify-content: center;gap:5px}
#totalCreditsCount .sidebar-content .credit-count,#changePassForm .error{font-size:13px}


@keyframes sh8-0 {
  66%      {transform: skewX(0deg)}
  80%,100% {transform: skewX(-45deg)}
}
@keyframes sh8-1 {
  0%   {transform:scale(var(--s,1)) translate(-0.5px,0)}
  33%  {transform:scale(var(--s,1)) translate(calc(1px - 50%),calc(1px - 50%))}
  66%  {transform:scale(var(--s,1)) translate(calc(1px - 50%),0%)}
  100% {transform:scale(var(--s,1)) translate(calc(0.5px - 50%),0%)}
}

#previewModalImage .pmm-view img{border-radius:0}

#generateSection .section-header,#processGenerateSection .section-header{display:none}


#changePass .alert{font-size:13px;font-weight:400;margin-top:3px }

#otpStep .re-send-otp-content{margin:0 0 5px;font-size:13px;font-weight:400}
#otpStep .re-send-otp-content .resend-otp{display:none}
#otpStep .otp-time{color:#333}
#otpStep .otp-time #countdown-timer{color:#000}
#topStepImage .img-upload-btn:nth-child(1) {
    background-image: url('../img/twf.png'); 
    background-size: contain;
    background-position: center;
    background-repeat:no-repeat;
}

#topStepImage .img-upload-btn:nth-child(2) {
    background-image: url('../img/twb.png'); 
    background-size:contain;
    background-position: center;
    background-repeat:no-repeat;
}

#bottomStepImage .img-upload-btn:nth-child(1) {
    background-image: url('../img/bwf.png'); 
    background-size: contain;
    background-position: center;
    background-repeat:no-repeat;
}

#bottomStepImage .img-upload-btn:nth-child(2) {
    background-image: url('../img/bwb.png'); 
    background-size: contain;
    background-position: center;
    background-repeat:no-repeat;
}

#fullStepImage .img-upload-btn:nth-child(1) {
    background-image: url('../img/fbf.png'); 
    background-size: contain;
    background-position: center;
    background-repeat:no-repeat;
}

#fullStepImage .img-upload-btn:nth-child(2) {
    background-image: url('../img/fbb.png'); 
    background-size: contain;
    background-position: center;
    background-repeat:no-repeat;
}
.sm-nav{display:none}
.smv-upload-img-list .preview-item .count,.preview-map-content{display:none}

#selectSummary .uuproduct-list .uu-before-images .preview-item{width:auto !important;min-width:auto !important}
#selectSummary .smv-prev-upload-img{flex:1;width:100%;margin-right:10px} 
#selectSummary .uu-before-images{display:grid;grid-template-columns: repeat(6, 1fr);}


@keyframes moveBg {
    0% {
        background-position: 100% center; /* Start from right */
    }
    100% {
        background-position: 0% center; /* Move to left */
    }
}


#sitmUploadImage .preview-upload-btn,#mUploadImage .preview-upload-btn{background-size:contain;background-position:top center;background-repeat:no-repeat;}






/* Hide bottom-right corner copyright text */
/*#map .gm-style > div > div {
    display: none !important;
}*/


/*.pp-work-content .ppwc-item{min-width:250px;text-align: center;}
.pp-work-content .ppwc-item .h4{margin-bottom:10px}
.pp-work-content .ppwc-item li{margin-bottom:5px;margin-left:10px}*/




@media (max-width:1024px){
  .price-page-section .section-header p{width:100%}
  .pp-section-content .tab-content{width:100%}
  #selectSummary .uu-before-images,.genproject-item-list{grid-template-columns: repeat(4, 1fr);}
  .smvupload-imglist-contnet{width:96%;margin:0 auto;left:2%}
}

@media (min-width: 1024px) and (max-width: 1900px) {
  .hover-effect .image-container {
    height: 580px;
    max-height: 580px;
  }
}

@media (min-width:1024px) and (max-width:1400px){
  #sitModal .modal-dialog{width:auto !important;}
  #sitModal #mitFirstStep .mit-flex-item{padding:0 15px}
}



@media (max-width: 768px) {
    .header .nav,.lg-show,#selectProduct .pagination{display:none !important}
    .sm-show{display:flex;}
    .sm-show .bar{margin-right:10px;cursor:pointer;}
    .header .nav{position:absolute;top:60px;left:0;margin-left:0;text-align:left;background:#fff;width:100%;border-top:1px solid #dedede;border-bottom:1px solid #dedede;}
    .header .nav.active{display:block !important;}
    .header .nav a{border-radius:0}
    .header .nav .nav-link{display:flex;flex-direction:column;justify-content:flex-start;}
    /*.header_logo .bar{width:18px;height:18px;display:flex;align-items:center;justify-content: center;border:1px solid #dedede;border-radius:5px} */
    .faqs-section, .faqs-section-content,.footer-logo p,.hpw-tabs p{width:100%}
    .user-dropdown .user-info{align-items:flex-start;}
    .sm-container{width: calc(100% - 15px);margin: 0 auto;}
    .footer{text-align: left;}
    .footer-bottom{margin-top:0;line-height:24px}
    .section-p50{padding:25px 0}
    .hp-customer-section .list,.hpw-tabs{flex-direction:column;margin:0;gap:10px}
    .hp-customer-section .list .item{margin-bottom:20px}
    .hp-customer-section .list .item:last-child{margin-bottom:0}
    .hp-customer-section .number{font-size:28px;line-height:36px;margin-bottom:0}
    .hp-customer-section .item p{font-weight:400;line-height:18px;font-size:14px}
    .animation-container{border:10px solid #333;padding:10px 10px}
    .animation-container .image{width:100%;height:100%}
    .hb-content .hb-title{font-size:26px;line-height:36px}
    .full-page-banner{height:calc(90vh - 65px);}
    .tab-flex-bg{max-width: 100%;flex:1 1 100%}
    .filter-form .form-group{width:100%;text-align:left;margin-right:0}
    .filter-form .form-group:last-child label{display:none}
    .genproject-cp-item a,.gen-project-item,.uuproduct-list .uu-before-images .preview-item{min-width:auto;width:auto;height:auto;min-height:230px;margin-right:0;margin-bottom:0}
    .genproject-cp-item{display:flex;flex-direction:column;width:100%}
    .genproject-item-list,.model-item-list,#selectProduct .uu-before-images {
      display: grid;
      width: 100%;
      grid-gap:0px;
      grid-template-columns: repeat(2, 1fr); /* Exactly 2 equal columns */
    }
    .model-item-list{gap:0}
    #selectProduct .uu-before-preview .image-container{height:auto;}
    #genASModel.smv-item{flex-direction:column;padding-top:0;height:100%}
    .smv-item .preview-item{min-width:auto}
    .after-login .pos-relative{z-index:99}
    .first-upload-product, .preview-item-list, .summary-product-item-list, .model-scroll-list, .gen-product-list{height:100%}
    .genproject-item-list,#selectProduct .uu-before-images{gap:10px}
    .hover-effect .image-container{height:auto;min-height:520px}
    .filter-wraper-content.mgleft{margin-left:0;transition: left 0.3s ease;}
    #sitModal .mit-item, .upload-image-modal .mit-item{width:auto;}
    #sitModal .mit-flex-item,#uploadImageModal .mit-flex-item{ display:grid !important;
      width: 100%;
      grid-gap: 10px;
      grid-template-columns: repeat(2, 1fr);}
      #sitModal #mitFirstStep .mit-flex-item{grid-template-columns: repeat(3, 1fr);padding:0 15px}
      #sitModal #sitmUploadImage .mit-flex-item,#uploadImageModal #mUploadImage .mit-flex-item{width:400px;margin:0 auto;}
    .upload-image-modal .preview-upload-btn{height:222px}
    #sitModal #sitlengthSelection .mit-flex-item{display:flex;}
    #sitModal .modal-dialog, .upload-image-modal .modal-dialog{width:96%}
      #uploadImageModal .length-item, #sitModal .length-item{width:100%;height:auto;}
      #uploadImageModal #lengthSelection .mit-flex-item,#sitModal .mitThirdStep .mit-flex-item{height:calc(100vh - 300px);overflow-y:scroll;scroll-behavior:smooth;}
      #selectSummary .flex_content{flex-direction: column;}
      .smv-item .preview-item .item-action-btn{right: calc(50% + 0px)}
      #summaryModelView .preview-item .item-action-btn.half-hidden-rectangle{left:calc(50% + 0px);z-index:999}
      #summaryModelView .btn-full:after,#summaryModelView .btn-full:before,.smv-item .preview-item .btn-top::before, .smv-item .preview-item .btn-bottom::before, .smv-item .preview-item .add-layer-btn::before{display: none}
      .smv-item .slide-down-options{left:150px;background:#fff;padding:5px 5px}
      #fullOptions{left:-30px}
      #selectSummary .smv-item .preview-item,.section-sidebar{width:calc(100% - 20px);margin:0 10px 5px}
      .prev-btn{display:flex;margin:0 10px 10px;gap:5px;justify-content: center;align-items: center;}
      .section-sidebar{z-index:1}
      .smv-btn .smv-upload-img-list{z-index: 10}
      .smv-upload-img-list{top:60px;height: calc(100vh - 60px)}
      .summary-product-item-list{overflow-y:visible;}
      #selectSummary #summaryModelView .preview-item{z-index:99}
      .smv-btn{z-index:300}
      .smv-prev-upload-img .uuproduct-list .uu-before-images .preview-item{min-width:160px}
      .smv-upload-img-list .title,.tab-flex .price,.price-tab-content{text-align:left}
      .payment-history-table{width:900px}
      .hb-content{padding-left:0;text-align: center;}
      .hb-btn{flex-direction: column;justify-content: center;}
      .hb-content .hb-sm-title{margin-bottom:15px}
      .filter-sidebar{position:fixed;top:59px;height: calc(100vh - 58px);}
      /*.model-scroll-list{height:calc(100vh - 272px)}*/
      .map-search-result{top:272px}
      #genASModel .preview-item{min-width:300px;margin-bottom:10px;max-width:100%}
      #genASModel{overflow-y:scroll;scroll-behavior: smooth;}
      .preview-modal-image .pmm-view img{width:100%;height:auto;border-radius:0 !important}
      .preview-modal-image .modal-dialog{border-radius:0}
      .user-upload-product .d-flex{align-items: center;justify-content: center;}
      .upload-image-modal .preview-upload-btn,.preview-upload-btn{width:auto;font-size:13px}
      .preview-upload-btn .text,.upload-image-modal .modal-image-type p{font-size:12px;font-weight:400}
      .upload-image-modal .modal-image-type p,#sitModal #sitmUploadImage p{width:96%;margin:0 auto 10px;font-size:13px}
      .modal p{font-size:13px}
      #sitModal .modal-header, .preview-modal-image .modal-header, .upload-image-modal .modal-header{padding:12px 12px}
      #sitModal .modal-header h2, .upload-image-modal .modal-header h2{font-size:16px}
      .smvupload-imglist-contnet{top: 15px;
        left: 15px;
        width: calc(100% - 30px);
        height: calc(100% - 30px);}
      .smv-upload-img-list .uuproduct-list{height:calc(100vh - 200px);width:100%;margin:0 10px}
      .smv-upload-img-list .preview-upload-btn,.user-upload-product .preview-upload-btn{width:180px;}
     .sm-nav{display:block;}
     #selectSummary .uu-before-images{display:grid;grid-template-columns: repeat(3, 1fr);}
     .user-upload-product .preview-upload-btn{width:172px;min-width:172px;height:230px;display:flex !important;justify-content: center !important;}
     .genproject-item-list .gen-project-item{min-height:230px;max-height:230px}
     .user-upload-product .d-flex:nth-child(1){justify-content:flex-start;}
     .page-section.cpassword-page-section, .ps-center-form{padding:20px 15px}
     .page-section-form{width:100%}
     .full-page-banner{background-size:auto 100%}
     #selectProduct .uu-before-preview .image-container,.genproject-item-list{display:grid;grid-template-columns: repeat(3, 1fr)}
     #selectProduct .uu-before-preview .image-container{height:286px}
     .page-header-nav .nav-link{margin-left:0}
     #summaryModelView.smv-item .preview-item{max-width:auto}

}

@media (max-width: 480px) {
  .container{width:calc(100% - 20px)}
  .content .model-item-list{grid-template-columns:repeat(1, 1fr)}
  .fw-header,.fw-header-list{display:flex;flex-direction:column;width:100%}
  .fw-header-list .filter-icon{width:100%;margin-bottom: 10px;display:flex;align-items: center;justify-content: center;gap:5px}
  .fw-header .next-btn{display:flex;align-items: center;justify-content: center;gap:5px}
  .center-form{width:96%}
  .htw-btn a{width:100%}
  .map-search-result,#selectModel #map{height: calc(100vh - 275px);}
  .summary-full-image{width:100%;flex-direction:column;}
  .summary-sidebar .sp-step-item{width:150px;height:180px}
  #genASModel {
    height: calc(100vh - 110px);
  }
  .content .preview-modal-image .pmm-view img{width:auto;height:100%;border-radius:0 !important}
  .smv-upload-img-list .smv-u-scroll{flex-direction:column;}
  #selectSummary .uu-before-images{display:grid;grid-template-columns: repeat(2, 1fr);}
  #selectProduct .uu-before-preview .image-container,.genproject-item-list{grid-template-columns: repeat(2, 1fr) !important}  
  #selectProduct .uu-before-preview .image-container{height: 220px}
  #sitModal .mit-flex-item{grid-template-columns: repeat(2, 1fr)}
   #sitModal #sitmUploadImage .mit-flex-item,#uploadImageModal #mUploadImage .mit-flex-item{width:100%;margin:0 auto;}
   #infoModal .modal-dialog{width:96%}
   #infoModal .minfo-item-img img{width:90px}
   #infoModal .btn{width:calc(100% - 30px);margin:0 15px}
   #infoModal .mif-header-content p,#infoModal .mif-header-content{font-size:14px;width:96%;line-height:20px}
   #sitModal #mitFirstStep .mit-flex-item{grid-template-columns:repeat(2, 1fr)}
}

@media (max-width: 320px) {
  #selectProduct .uu-before-preview .image-container{height: 110px}
  .genproject-cp-item a, .gen-project-item, .uuproduct-list .uu-before-images .preview-item{min-height:auto;}
  .genproject-cp-item a,.genproject-item-list .gen-project-item{min-height:170px}
}



.fading{
  opacity: .7;
}