/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 29 2025 | 15:18:17 */
/*-------------- G E N E R A L ---------------*/
*{outline:0!important;list-style:none;text-decoration:none}
.page,.post{margin:0;overflow-x:hidden}
p{margin:0}
.widget,.elementor-widget:not(:last-child){margin:0}
::selection{background:#232323;color:#fff}
::-webkit-scrollbar{display: none;background:#d6d6d6}
::-webkit-scrollbar-thumb{background:#ddd}
::-webkit-scrollbar-thumb:hover{background:#c1c1c1}
div#content{min-height:667px}
.full-width-btn,.full-width-btn a{width:100%}
.rtl .wpcf7 input[type="url"],.rtl .wpcf7 input[type="email"],.rtl .wpcf7 input[type="tel"] {text-align: right;}
.elementor-text-editor p {margin: 0 0 15px 0;}
form[data-status="submitting"] input.wpcf7-submit {background: #c9c9c9;pointer-events: none;}
body {background: #F7F7FC}
a{color: #171A27;}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance:none;
}
input:-webkit-autofill {
    background-color: #F5F8FC !important; /* שינוי צבע הרקע */
    box-shadow: 0 0 0px 1000px #F5F8FC inset !important; /* שינוי הרקע באמצעות צללית פנימית */
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
    box-shadow: 0 0 0px 1000px transparent inset !important;
    transition: background-color 5000s ease-in-out 0s;
}
h1, h2, h3, h4, p, span, input, select, ul, li, div, button  {font-family: 'Clash Display','Ploni ML v2 AAA';}


/*-------------- E X T R A S ---------------*/
.action-is-open {
    overflow: hidden;
}


/*------ H E A D E R -----*/
.main-menu {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px 25px;
    background: #F5F8FC;
    border-radius: 10px 10px 0 0;
    z-index: 999;
}
.main-menu ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 0;
}
.main-menu ul li {
    width: 25%;
}
.main-menu ul li:not(.account) {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: calc(50% - 30px);
    padding: 3px 0 0 0;
    text-align: center;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 20px;
    color: #171A27;
    background: #f5f8fc;
    border-radius: 50px;
    letter-spacing: 0.65px;
    line-height: 0.85;
}
.home .main-menu ul li.active {
    background: #EBE9F6;
}
.main-menu ul li.account {
    width: 45px;
}
.main-menu ul li.account img {
    margin: 0 0 -5px;
    width: 45px;
    height: 45px;
    border-radius: 100px;
    object-fit: cover;
}







/*------------ W A L L E T ----------------*/
.workspace-header {
    position: sticky;
	top: 0;
    padding: 50px 20px 45px;
 	font-family: "Ploni ML v2 AAA-olive", sans-serif;
    text-align: center;
    color: #171A27;
    background-size: 300% 300%;
    animation: GradientLive 20s ease infinite;
    background-image: linear-gradient(60deg, #E2B6E8 20%, #CDDAF4 40%,  #BBF3F1 60%,#C2E5FF 80%);
}
@keyframes GradientLive {0%, 100% {background-position: 0% 50%;}25% {background-position: 50% 100%;}50% {background-position: 100% 50%;}75% {background-position: 50% 0%;}}
button.app-plus-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 30px;
    padding: 0;
    background: none;
    border: solid 1px #171A27;
    border-radius: 150px;
}
.workspace-header .subtitle {
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 18px;
    font-weight: 400;
    font-family: 'Ploni Tzar ML v2 AAA';
    line-height: 0.85;
}
.workspace-header .title {
	direction: ltr;
    display: flex;
    align-items: start;
    justify-content: center;
    margin: 20px 0;
}
.workspace-header .title span {font-family: "Ploni ML v2 AAA-olive", sans-serif !important;}
.workspace-header .title .amount,
.workspace-header .title .symbol {
    font-size: 50px;
    letter-spacing: -2px;
    line-height: 1;
}
.workspace-header .title .currency {
    margin: 0 0 0 7px;
    font-size: 15px;
    letter-spacing: 1px;
}
.workspace-header .action {
    display: flex;
    align-items: center;
    justify-content: center;
}
.workspace-header .action .btn.new-quote {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 3px 0 0 0;
    width: 225px;
    height: 55px;
    border-radius: 150px;
    background: #171A27;
    color: #fff;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 23px;
    font-weight: 300;
    letter-spacing: 0.65px;
    line-height: 0.9;
}
.workspace-header button.app-notification-button {
    position: absolute;
    top: 15px;
    right: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
	padding: 0;
    border-radius: 150px;
    border: unset;
    background: #00000015;
    backdrop-filter: blur(10px);
}
.workspace-header button.app-notification-button img {
    width: 19px;
    height: 19px;
}
.workspace-wrap {
    position: relative;
    margin: -20px 0 0;
    padding: 20px 20px 50px;
	color: #171A27;
    background: #F5F8FC;
    border-radius: 20px 20px 0 0;
    z-index: 9;
}
.workspace-search {
    position: relative;
}
.workspace-search button {
    position: absolute;
    top: 15px;
    left: 0;
    padding: 0;
    background: unset;
    border: unset;
    z-index: 9;
}
.workspace-search input {
    display: block;
    width: 100%;
    padding: 10px 0;
    border: 0;
    border-radius: 0;
    background: none;
    border-bottom: solid 1px #E8E6F0;
    font-size: 15px;
    letter-spacing: 0.25px;
    color: #171A27;
}
.workspace-search input::placeholder {
    color: #171A27;
}
.no-contracts {
    padding: 30px;
    text-align: center;
}
.contracts-wrap .contracts-item {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 20px 0 20px 25px;
    letter-spacing: 0.25px;
    border-bottom: solid 1px #E8E6F0;
    background-image: url(/wp-content/themes/happ/assets/svg/arrow-l.svg);
    background-position: center left;
    background-repeat: no-repeat;
    background-size: 5px;
}
.contracts-wrap .contracts-item img {
    position: absolute;
    left: 0;
    top: calc(50% - 7px);
    transform: rotate(180deg);
}
.workspace-wrap .load-more-btn {
    display: block;
    margin: 20px auto;
    padding: 0;
    border: 0;
    background: none;
    text-decoration: underline;
    font-size: 15px;
    letter-spacing: 0.5px;
}
.contracts-wrap .contracts-item .info {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 110px;
	text-align: left;
}
.contracts-wrap .contracts-item .info .price {
    width: 100%;
    margin: 0 0 5px;
    font-family: 'Ploni ML v2 AAA';
    font-weight: 400;
    font-size: 16px;
    line-height: 1;
}
.contracts-wrap .contracts-item .info .status,
.contract-summary-popup .status-container span.status {
    width: fit-content;
    padding: 5px 10px;
    background: #D5E7F1;
    border: solid 1px #C8DDE8;
    color: #7396A8;
    font-size: 12px;
    font-weight: 400;
    text-align: center;
    border-radius: 3px;
    line-height: 0.9;
    letter-spacing: 0.5px;
}
.contracts-wrap .contracts-item .title {
    margin: 0 0 5px;
    font-size: 21px;
    font-weight: 400;
    text-transform: capitalize;
    font-family: 'Ploni Tzar ML v2 AAA';
    line-height: 0.85;
}
.contracts-wrap .contracts-item .meta {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    line-height: 1.2;
    font-size: 13px;
}
.contracts-wrap .contracts-item .meta span {
    margin: 0 0 0 7px;
}















/*-------- H U B ---------*/
.hub-component {
    padding: 10px;
	font-family: "Ploni ML v2 AAA-olive", sans-serif;
	color: #171A27;
}
.hub-section-header .title {
    padding: 10px 0;
    font-size: 21px;
    color: #171A27;
}
.hub-section-navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0 0;
    padding: 0;
    background: #fff;
    border-radius: 3px;
}
.hub-section-notifications {
    min-height: 350px;
    margin: 10px 0 0;
    padding: 20px;
    background: #fff;
    border-radius: 3px;
}
.hub-section-notifications .notifications-header {
    display: flex;
    align-items: center;
    font-size: 15px;
}
.hub-section-notifications .notifications {
    padding: 15px 0;
    color: #171A27;
    opacity: 0.75;
    font-size: 13px;
    letter-spacing: 0.35px;
}
.hub-section-navigation .hub-nav {
    margin: 0;
    padding: 0;
    width: 100%;
}
.hub-section-navigation .hub-nav .item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 25px 20px;
    line-height: 1;
    border-bottom: solid 1px #E8E6F0;
    font-size: 15px;
}
.hub-section-navigation .hub-nav .item:last-child {
    border: 0;
}
.hub-section-navigation .hub-nav .item:after {
    content: "";
    display: block;
    width: 7px;
    height: 7px;
    background-image: url(/wp-content/themes/happ/assets/svg/arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	pointer-events: none;
}
.hub-section-projects {
    margin: 10px -10px;
}
.project-item {
    background-image: url(/wp-content/uploads/2024/05/card-textur-background.png);
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border-radius: 10px;
    text-align: center;
    font-size: 12px;
    overflow: hidden;
}
.project-item .flex-box {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 175px;
    padding: 20px;
    background-image: linear-gradient(35deg, #D4DAF1, #F2BBDE, #EFB79B);
    mix-blend-mode: color;
}
.project-item:nth-child(3n+1) .flex-box{background-image: linear-gradient(35deg, #D4F1F0, #DABBF2, #9BBFEF);}
.project-item:nth-child(3n+2) .flex-box{background-image: linear-gradient(35deg, #D4DAF1, #F2BBDE, #EFB79B);}
.project-item:nth-child(3n+3) .flex-box{background-image: linear-gradient(35deg, #9DE2E7, #BBD5F2, #D09BEF);}
.project-item .project-name {
    margin: 0 auto 10px;
	max-width: 90%;
    font-size: 25px;
    line-height: 1.1;
    color: #000000;
}
.project-item .project-info {
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    color: #000;
    letter-spacing: 1px;
	line-height: 1;
}
.project-item .project-info .date {
    margin: 0 0 0 10px;
    padding: 0 0 0 10px;
    border-left: solid 1px #000;
}





/*-------- A C T I O N - P O P U P ---------*/
.action-is-open .full-page-ol, .actions-is-open .full-page-ol, .login-is-open .full-page-ol, .action-is-open .full-page-ol, .notifications-is-open .full-page-ol, .gift-is-open .full-page-ol,
.contact-add-is-open .full-page-ol {
    visibility: visible;
    opacity: 1;
}
.full-page-ol {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    filter: brightness(0.8);
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    transition: all .35s ease-in-out;
}
.action-is-open .action-popup {
    bottom: 0;
}
.action-popup {
    position: fixed;
    bottom: -100%;
    right: 0;
    width: 100%;
	max-height: 83vh;
    padding: 0 20px 0;
    background: #fff;
    border-radius: 15px 15px 0 0;
    z-index: 9999999;
    overflow: auto;
    box-shadow: 0 -2px 7px 0 #00000010;
    text-align: center;
    transition: all 0.35s ease-in-out;
}

.action-popup .header {
    position: relative;
    top: 0;
    width: 100%;
    margin-bottom: 1px;
    padding: 20px 0;
/*     background: #fff; */
    text-align: center;
    z-index: 99;
}
.action-popup .icon {
    margin: 0 0 25px;
    text-align: center;
}
.action-popup .icon span {
    display: block;
    margin: 0 auto 6px;
    width: 30px;
    height: 2px;
    background: #DEDCE6;
    border-radius: 20px;
}
.action-popup form {
    text-align: right;
}
.action-popup .card {
    margin: 35px 0 10px;
    font-size: 23px;
    font-weight: 500;
    color: #171A27;
    line-height: 1;
    letter-spacing: 0.5px;
}
.action-popup .card .name {
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 35px;
    font-weight: 400;
    line-height: 1;
}
.action-popup input, .action-popup textarea, .action-popup select {
    display: block;
    margin: 5px 0 15px;
    width: 100%;
    padding: 15px;
    background: #fff;
    border-radius: 3px;
    border: solid 1px #E8E6F0;
    line-height: 1.2;
    font-family: "Ploni ML v2 AAA", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #171A27;
}
.action-popup textarea {
    min-height: 100px;
}
.action-popup label {
    display: block;
    line-height: 1.2;
    font-family: "Ploni ML v2 AAA", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #171A27;
}
.action-popup .actions {
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0;
    background: #fff;
}
.action-popup .actions button {
    display: block;
    width: 100%;
    margin: 0 5px;
    padding: 15px;
    background: #F7F7FC;
    border-radius: 150px;
    font-size: 15px;
	font-weight: 400;
    color: #786092;
    border: 0;
    line-height: 1;
    letter-spacing: 0.25px;
}
.action-popup .actions button[type="submit"] {
    background: #E3E1F3;
}
.mce-statusbar .mce-container-body {
    display: none;
}
.mce-statusbar {
    border: 0;
}
.mce-container {
    position: relative;
    box-shadow: unset;
}
.mce-tinymce.mce-container.mce-panel {
    margin: 7px 0 10px !important;
    border: solid 1px #E8E6F0;
}
.mce-toolbar-grp {
    background: #F7F7FC;
    border: 0;
}
.mce-toolbar .mce-ico {
    margin: 0 3px;
    color: #786092;
    width: 17px;
    height: 17px;
}
.edit-service-popup {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 99999999;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    visibility: hidden;
    transition: all 0.35s ease-in-out;
}
.edit-service-popup-open .edit-service-popup {
    visibility: visible;
}
.edit-service-popup .edit-service-action-popup {
    position: absolute;
    bottom: -100%;
    right: 0;
    width: 100%;
    height: calc(100vh - 30px);
    padding: 0 20px 0;
    background: #fff;
    border-radius: 15px 15px 0 0;
    z-index: 9999999;
    overflow: auto;
    box-shadow: 0 -2px 7px 0 #00000010;
    text-align: center;
    transition: all 0.35s ease-in-out;
}
.edit-service-popup-open .edit-service-popup .edit-service-action-popup {
    bottom: 0;
}
.edit-service-popup-open .card {
    margin: 35px 0 10px;
    font-size: 23px;
    font-weight: 500;
    color: #171A27;
    line-height: 1;
    letter-spacing: 0.5px;
}
.edit-service-action-popup form {
    text-align: left;
}
.edit-service-action-popup form label {
    display: block;
    line-height: 1.2;
    font-family: "Ploni ML v2 AAA", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #171A27;
}
.edit-service-action-popup form input {
    display: block;
    margin: 5px 0 15px;
    width: 100%;
    padding: 15px;
    background: #fff;
    border-radius: 3px;
    border: solid 1px #E8E6F0;
    line-height: 1.2;
    font-family: "Ploni ML v2 AAA", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #171A27;
}
.edit-service-action-popup .actions {
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0;
    background: #fff;
}
.edit-service-action-popup .actions button.btn.btn-primary {
    background: #E3E1F3;
}
.edit-service-action-popup .actions button{
    display: block;
    width: 100%;
    margin: 0 5px;
    padding: 15px;
    background: #F7F7FC;
    border-radius: 150px;
    font-size: 15px;
    font-weight: 400;
    color: #786092;
    border: 0;
    line-height: 1;
    letter-spacing: 0.25px;
}






.transaction-popup.action-popup {
    height: fit-content;
    padding-bottom: 65px;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    color: #171A27;
}
.transaction-popup .transaction-name {
    max-width: 80%;
    margin: 0px auto 7px;
    font-size: 23px;
    line-height: 1;
}
.transaction-popup .transaction-meta {
    font-size: 13px;
    letter-spacing: 0.75px;
}
.transaction-popup .transaction-type {
    margin: 0 3px 0 0;
    padding: 4px 10px;
    background: #D6CCEA;
    border-radius: 20px;
    font-size: 11px;
}
.transaction-popup .transaction-price {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    font-size: 40px;
}
.transaction-popup .transaction-price:before {
    content: "$";
}
.transaction-popup .transaction-price:after {
    content: "USD";
    margin: 12px 0 0 7px;
    font-size: 13px;
    letter-spacing: 1px;
}
.transaction-popup .action .label{
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 10px auto 30px;
    padding: 2px 30px 0;
    min-width: fit-content;
    width: 175px;
    height: 45px;
    border-radius: 150px;
    background: none;
    background: #171A27;
    color: #fff;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 15px;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 2px;
}
.transaction-popup .transaction-description {
    max-width: 80%;
    margin: auto;
    font-size: 13px;
    letter-spacing: 0.5px;
}




/*---------------- P O S T L I S T - P O P U P -----------------*/
.app-component {
    position: relative;
	padding-bottom: 75px;
    height: 100vh;
    overflow: auto;
}
.app-component.network-component {
    padding: 0 20px 100px;
}
.postlist-popup-is-open {overflow: hidden;}
.postlist-popups {
    position: fixed;
    top: 0;
    left: -150%;
    width: 100%;
    height: 100%;
    z-index: 9999;
	transition: all 0.2s ease-in-out;
}
.postlist-popup-is-open .postlist-popups {
    left: 0;
}
.postlist-popup {
    padding: 20px;
    background: #F1F5F9;
    overflow: auto;
	height: 100%;
    z-index: 9;
}
.postlist-popup-header {
    position: sticky;
    top: 0;
    padding: 30px 0;
	background: #F5F8FC;
    z-index: 99;
}
.postlist-popup-header .title, .settings-header .title {
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 50px;
    color: #171A27;
    line-height: 0.9;
}
.postlist-popup-header .actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0 0;
}
.postlist-popup-header .actions input {
    width: calc(100% - 65px) !important;
    margin: 0 !important;
}
.postlist-popup-header .new-contact-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 30px;
    padding: 0;
    background: none;
    border: solid 1px #171A27;
    border-radius: 150px;
}
.postlist-popup-header .close-popup {
    padding: 10px 0;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 14px;
    background: none;
    border: 0;
}
.postlist-popup-header .close-popup svg {
    margin: 0 10px 0 0;
}
.postlist-popup-header .post-count {
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 15px;
}
.postlist-popup-header input.search-input,
.postlist-popup-header .actions input {
    display: block;
    margin: 10px 0;
    padding: 7px 0 7px 22px;
    width: 100%;
    background: none;
    border: 0;
    border-bottom: solid 1px #cecadc;
    border-radius: 0;
    font-size: 18px;
    color: #171A27;
    letter-spacing: 0.5px;
    background-image: url(/wp-content/themes/happ/assets/svg/search.svg);
    background-size: 14px;
    background-position: center left;
    background-repeat: no-repeat;
}
.postlist-popup-header input.search-input::placeholder,
.postlist-popup-header .actions input::placeholder {
    font-size: 14px;
    color: #171a27;
}
.postlist-popup-contact .contacts-lists {
    margin: 10px 0 0;
    padding: 0;
}
.postlist-popup-contact .contact-item, .postlist-popup-contact .contact-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 12px 0;
	border-bottom: solid 1px #E8E6F0;
}
.postlist-popup-contact .contact-item .data, .postlist-popup-contact .contact-list-item .data {
    display: flex;
    align-items: center;
	justify-content: space-between;
	height: 45px;
    width: 100%;
}
.postlist-popup-contact .contact-item .data img, .postlist-popup-contact .contact-list-item .data img {
    margin: 0 0;
    width: 50px;
    height: 50px;
    object-fit: cover;
    object-position: center;
    border-radius: 150px;
}
.postlist-popup-contact .contact-item .data .meta, .postlist-popup-contact .contact-list-item .data .meta{
    font-family: "Ploni ML v2 AAA", sans-serif;
}
.postlist-popup-contact .contact-item .data .meta .name,
.postlist-popup-contact .contact-list-item .data .meta .name {
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 23px;
    font-weight: 400;
    line-height: 0.9;
}
.postlist-popup-contact .contact-item .data .profession, .postlist-popup-contact .contact-list-item .data .profession {
    margin: 2px 0 0;
	font-size: 11px;
	letter-spacing: 0.4px;
}
.action-popup.contact-data-popup .header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
	padding: 15px 20px;
}
.contact-data-popup button.app-notification-button {
    position: relative;
    top: 0;
    right: 0;
}
.action-popup.contact-data-popup .header .edit {
	padding: 0 25px 0 0;
    font-size: 14px;
    color: #171A27;
	background: none;
	border: unset;
    text-decoration: underline;
}
.action-popup.contact-data-popup .header button {display: none;}
.action-popup.contact-data-popup {
    max-height: 100%;
	height: 100%;
    padding: 0;
    border-radius: 0;
	background-image: linear-gradient(180deg, #dfddf8, #ffffff, #ffffff);	
}
.contact-card {
    position: relative;
    min-height: 100px;
    margin: 0;
    padding: 20px 0 0 120px;
    width: 100%;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-align: right;
}
.action-popup.contact-data-popup .icon {
	display: none;
    margin: 10px 0 5px 0;
}
.contact-card .contact-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 95px;
    height: 95px;
    border-radius: 150px;
    object-fit: cover;
    object-position: center;
    margin: 0 auto 7px;
}
.contact-data-popup .contact-img.show {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0000009e;
    border-radius: 0;
    object-fit: contain;
    object-position: center;
}
.contact-card .contact-name {
    margin: 0 0 5px;
    line-height: 0.8;
    letter-spacing: 0;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 37px;
}
.contact-data-popup .bbl-section {
    margin: 0;
    padding: 20px;
    text-align: right;
    font-size: 14px;
    color: #171A27;
    letter-spacing: 0.5px;
    border-bottom: solid 1px #E8E6F0;
}
.contact-data-popup .bbl-section .section-title,
.contact-data-popup .emp-section .section-title,
.contact-data-popup .emp-section .title {
    margin: 0;
    padding: 0;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 21px;
    font-weight: 400;
}
.contact-data-popup .col-2 {
    display: flex;
    align-items: center;
	margin: 0 0 5px;
}
.contact-data-popup .col-2 a{color:#171A27;}
.contact-data-popup .bbl-section .company-number,
.contact-data-popup .bbl-section .contact-phone{
    margin: 0 0 0 10px;
}
.contact-popup-ui.new-contact-popup,
.contact-popup-ui.edit-contact-popup {
    padding: 20px 0 0;
    height: 100%;
    border-radius: 0;
    left: auto;
    right: -150%;
    bottom: 0;
}
.new-contact-popup .form-wrap,
.edit-contact-popup .form-wrap{
    padding: 0 20px 20px;
}
.contact-data-popup .emp-section {
    margin: 0;
    padding: 20px;
    min-height: 150px;
    font-size: 13px;
    color: #171A27;
    letter-spacing: 0.5px;
    border-bottom: solid 1px #E8E6F0;
	text-align: right;
}
.contact-data-popup .emp-section .col-2 .title {min-width: 75px;}
.action-popup.contact-data-popup .contact-footer,
.new-contact-popup .contact-footer,
.edit-contact-popup .contact-footer {
    position: sticky;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #F7F7FC;
    z-index: 999;
}
.new-contact-popup .contact-footer,
.edit-contact-popup .contact-footer {background: #fff;}
.action-popup.contact-data-popup .contact-footer .actions,
.new-contact-popup .contact-footer .actions,
.edit-contact-popup .contact-footer  .actions{
    padding: 0;
    background: none;
}
.action-popup.contact-data-popup .contact-footer .actions button.new-contract-btn {
    padding: 10px 25px;
    background: #E3E1F3;
}
.action-popup.contact-data-popup .contact-footer .back-btn,
.new-contact-popup .contact-footer .back-btn,
.edit-contact-popup .contact-footer .back-btn {
    display: flex;
    align-items: center;
    gap: 10px;
	background: none;
	border: 0;
	padding: 0;
}
.action-popup.contact-data-popup .contact-footer .back-btn svg,
.new-contact-popup .contact-footer .back-btn svg,
.edit-contact-popup .contact-footer svg {
    transform: rotate(180deg);
}
.action-popup.contact-data-popup .contact-footer .new-contract {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% - 65px);
    height: 55px;
    padding: 0;
    background: none;
    border: solid 1px #171A27;
    border-radius: 150px;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 17px;
}
.action-popup.contact-data-popup .contact-footer .send-msg {
    display: flex;
    align-items: center;
    justify-content: center;
    border: solid 1px #000;
    width: 100%;
    padding: 0;
    height: 50px;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 16px;
    background: #fff;
    border-radius: 150px;
    letter-spacing: 0.35px;
}
.action-popup.contact-data-popup .contact-footer .contact-phone-tel {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 0 0 10px;
    width: 55px;
    height: 55px;
    min-width: 55px;
    background: #171A27;
    border-radius: 150px;
}
.postlist-popup-content .project-item {
    position: relative;
    margin: 0 0 10px;
    border-radius: 5px;
}
.postlist-popup-content .project-item:after {
    content: "";
    position: absolute;
    top: 40px;
    right: 20px;
    display: block;
    width: 9px;
    height: 9px;
    background-image: url(/wp-content/themes/happ/assets/svg/arrow.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    pointer-events: none;
}
.postlist-popup-content .project-item .flex-box {
    justify-content: start;
    text-align: left;
    height: unset;
    margin: 0;
    max-width: 100%;
    font-size: 12px;
    mix-blend-mode: multiply;
    padding: 30px 20px;
}
.postlist-popup-content .project-item .flex-box .box {
    width: 100%;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
}
.postlist-popup-content .project-item .project-name {
    margin: 0 0 5px;
    font-size: 17px;
}
.postlist-popup-content .project-item .project-info {
    justify-content: start;
}



/*----------------- D A S H B O A R D ------------------*/

.user-card {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100vh - 60px);
    padding: 0 0 100px 0;
    transform: scale(1);
    overflow: hidden;
    transform: rotate3d(1, 1, 1, 120deg);
    opacity: 0;
	transition: all 0.2s ease-in-out;
	visibility: hidden;
	z-index: 999;
}
.user-card-is-open .user-card {
	overflow: visible;
    transform: rotate3d(1, 1, 1, 0deg);
	visibility: visible;
    opacity: 1;
}
.user-card-is-open .app-component.account-component .toggle-user-card {
    position: absolute;
    top: 35px;
    left: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 50px;
    height: 50px;
    border: 0;
    color: #fff;
    background: #ffffff30;
    line-height: 1;
    border-radius: 150px;
    z-index: 9999;
}
.user-card-is-open .app-component.account-component .toggle-user-card img {filter: invert(1);}
.user-card video {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    object-fit: cover !important;
    object-position: right;
    z-index: 1;
}
.user-card .overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #000;
    opacity: 0.2;
    z-index: 2;
}
.user-card .flex-box {
    position: relative;
    display: flex;
    align-content: space-between;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    color: #fff;
    padding: 20px 30px;
    z-index: 9;
}
.user-card .flex-box .box {
    position: relative;
    padding: 20px 25px 25px;
    width: 100%;
    background: #ffffff20;
    border-radius: 15px;
    text-align: center;
    overflow: hidden;
}
.user-card .flex-box .box .bg-blur {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(50px);
    border-radius: 20px;
    z-index: 8;
}
.user-card .flex-box .box .innerbox {
    position: relative;
	width: 100%;
    z-index: 9;
}
.user-card .flex-box .box .user-image {
    width: 85px;
}
.user-card .flex-box .box .name {
    margin: 5px 0 10px;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 25px;
    font-weight: 300;
    line-height: 1;
}
.user-card .flex-box .box .company {
    display: inline-block;
    margin: 0;
    padding: 7px 35px;
    background: #fff3;
    border-radius: 50px;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0.75px;
}
.user-card .flex-box .box img.qr_code {
	display: block;
    margin: 20px auto 15px;
    width: 185px;
    opacity: 0.45;
}
.user-card .flex-box .box .scan-note {
    display: flex;
    justify-content: center;
    font-size: 12px;
    letter-spacing: 0.5px;
}
.user-card .flex-box .box .scan-note img {
    margin: 0 8px -2px 0;
}
.user-card .flex-box .actions {
    display: flex;
    align-items: start;
    justify-content: space-between;
	padding: 30px 0 30px;
    width: 100%;
}
.user-card .actions a {
    display: block;
	width: 33.3%;
    text-align: center;
    font-size: 13px;
    line-height: 1.2;
    color: #fff;
    letter-spacing: 0.35px;
}
.user-card .actions .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 7px;
    width: 60px;
    height: 60px;
    background: #ffffff30;
    border-radius: 150px;
}
.user-card .actions .icon img {
    max-height: 20px;
}

/*------ F O R M -------*/
.wpcf7-not-valid{border:solid 1px #cd3232 !important;}
span.wpcf7-not-valid-tip{font-family:heebo;color:#cd3232;font-size:13px;}
.wpcf7-validation-errors, div.wpcf7-acceptance-missing{display:none !important;}
div.wpcf7-mail-sent-ok{border:none;font-family:heebo;font-size:30px;margin:0;padding:0;}
div.wpcf7-mail-sent-ok::after{display:block;margin:-7px 0 0 0;content:"תודה שפנית אלינו, נחזור בהקדם האפשרי";font-family:heebo;font-size:14px;}


/*-------- Mobile Menu BTN --------*/
.mobile-menu-btn{display:inline-block;height:30px;margin-bottom:5px;}
.mobile-menu-btn .line{display:inline-block;position:relative;width:30px;height:3px;background-color:#132242;transition-property:background-color, transform;transition-duration:300ms;}
.mobile-menu-btn .line:before,.mobile-menu-btn .line:after{content:'';display:block;width:30px;height:3px;position:absolute;background:#132242;transition-property:margin, transform;transition-duration:300ms;}
.mobile-menu-btn .line:before{margin-top:-10px;}
.mobile-menu-btn .line:after{margin-top:10px;}
.mobile-menu-btn.open .line{background:rgba(0, 0, 0, 0);}
.mobile-menu-btn.open .line:before{margin-top:0;transform:rotate(45deg);}
.mobile-menu-btn.open .line:after{margin-top:0;transform:rotate(-45deg);}



/*--------- A D D  - N E W - C O N T A C T ----------------*/
.contact-add-is-open {overflow: hidden;}

.contact-popup-ui {
    position: fixed;
    bottom: -150%;
    left: 0;
    width: 100%;
    height: calc(100% - 50px);
    padding: 0 20px 50px;
    background: #F5F8FC;
    transition: all 0.35s ease-in-out;
    box-shadow: 0 -5px 10px 0 #00000020;
    border-radius: 15px 15px 0 10px;
    z-index: 99999;
    overflow: auto;
}
.contact-add-is-open::-webkit-scrollbar,
.contact-popup-ui::-webkit-scrollbar {display: none;}

.contact-add-is-open .new-contact-popup,
.contact-edit-is-open .edit-contact-popup {
    bottom: 0;
	right: 0;
}
.edit-contact-popup {transition: all 0s ease-in-out;}
.contact-popup-ui .popup-header {
    position: sticky;
    top: 0;
    margin: 0;
	padding: 30px 0 20px;
    background: #F5F8FC;
    z-index: 9;
}
.contact-popup-ui h3 {
    margin: 0 0 10px;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 45px;
    font-weight: 400;
    color: #171A27;
    line-height: 0.93;
    transition: all 0.35s ease-in-out;
}
.contact-popup-ui .popup-header button {
    position: absolute;
    top: 20px;
    left: 0px;
    width: 50px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 150px;
    border: 0;
    font-size: 25px;
    line-height: 1;
    background: none;
    border: solid 1px #171A27;
}
.contact-popup-ui .popup-header button img {
    transform: rotate(45deg);
}
.contact-popup-ui button.submit-new-contact,
.contact-popup-ui  button.submit-edit-contact{
    display: block;
    min-width: 200px;
    width: fit-content;
    margin: 0 5px;
    padding: 15px;
    background: #EBE9F6;
    border-radius: 150px;
    font-size: 15px;
    font-weight: 400;
    color: #786092;
    border: 0;
    line-height: 1;
    letter-spacing: 0.25px;
}
.account-component .user-component,
.contract-wizard .services-popup {
    position: fixed;
    top: 0;
    right: -150%;
    width: 100%;
    height: 100%;
    padding: 20px;
    background: #fff;
    overflow: auto;
    transition: all 0.35s ease-in-out;
    z-index: 99999;
}
.contract-wizard .services-popup {right: 0;}.contract-wizard-wrapper .close-wizard svg {
    transform: rotate(180deg);
}
.account-component .user-component.show {right: 0%;}
.account-component .user-component .services-wrap {
    min-height: 80vh;
}
.account-component .user-component .section-header .title {
    margin: 0 0 20px;
    padding: 10px 0 15px;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 35px;
    line-height: 1;
    border-bottom: solid 1px #E8E6F0;
    line-height: 0.9;
}
.user-component .change-password h2 {
    padding: 10px 0;
    font-size: 17px;
    font-weight: 400;
    border-bottom: solid 1px #E8E6F0;
    letter-spacing: 0.35px;
}
.account-component .user-component .section-footer,
.contract-wizard .services-popup .section-footer {
    position: sticky;
    bottom: -21px;
	margin: 0 -20px -20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    background: #F7F7FC;
}
.contract-wizard .services-popup .section-footer button.add-services-button {
    display: block;
    margin: 0 5px;
    padding: 15px 50px;
    background: #E3E1F3;
    border-radius: 150px;
    font-size: 15px;
    font-weight: 400;
    color: #786092;
    border: 0;
    line-height: 1;
    letter-spacing: 0.25px;
}
.contract-wizard-wrapper .services-component .section-header {
    margin: 0 0 10px;
    font-size: 21px;
    letter-spacing: 0.5px;
}
.contract-wizard-wrapper .services-component .section-header .title {
	font-family: 'Ploni Tzar ML v2 AAA';
    line-height: 0.9;
	font-size: 30px;
}
.contract-wizard-wrapper .services-component button.add-service {
    display: block;
    width: 100%;
    padding: 15px;
    font-size: 16px;
    color: #fff;
    background: #ffffff20;
    backdrop-filter: blur(10px);
    border: 0;
    border-radius: 150px;
}
.contract-wizard-wrapper .services.section .services-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0 0;
    padding: 17px 0 0;
    width: 100%;
    font-size: 17px;
    font-weight: 400;
    border-top: solid 1px #FFFFFF30;
}
.contract-wizard-wrapper .services.section .services-total .price {
    font-family: 'Ploni ML v2 AAA';
    font-weight: 300;
}
.selected-services .flex-box {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin: 0 0 10px;
    padding: 15px;
    border-radius: 5px;
    border: solid 1px #FFFFFF30;
    line-height: 1.2;
}
.selected-services .flex-box .total-price {
    font-family: 'Ploni ML v2 AAA';
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .left-side {
    width: calc(100% - 80px);
    padding-left: 30px;
    font-size: 15px;
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .left-side .unit-price {
    direction: ltr;
    text-align: right;
    font-family: 'Ploni ML v2 AAA';
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .right-side {
    width: 80px;
    text-align: left;
    font-size: 16px;
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .right-side .action-buttons {
    position: absolute;
    top: 15px;
    left: 15px;
    width: fit-content;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .right-side .action-buttons button {
    margin: 0 20px 0 0;
    padding: 0;
    border: 0;
    background: #ffffff00;
    filter: brightness(10);
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .right-side .action-buttons button.remove-service-button {
    filter: invert(1);
    margin: 0;
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .service-name {
    margin: 0 0 7px;
    font-size: 17px;
}
.contract-wizard-wrapper .services-component .selected-services .flex-box .service-excerpt {
    margin: 0 0 10px;
    font-size: 13px;
    opacity: 0.75;
    letter-spacing: 0.5px;
}




.account-component .user-component .section-footer button.back-to-settings {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    border: 0;
    background: none;
    font-size: 15px;
    line-height: 1;
    letter-spacing: 0.25px;
    color: #171A27;
}
.account-component .user-component .section-footer button.back-to-settings svg {
    transform: rotate(180deg);
}
.account-component .user-component .section-footer .add-btn button,
.contract-wizard .services-popup .section-footer button.add-new-service-button {
    padding: 12px 25px 8px;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 19px;
    border-radius: 150px;
    border: 0;
    background: #E3E1F3;
    color: #786092;
    letter-spacing: 0.25px;
}
.contract-wizard .services-popup .services-wrap {
    min-height: calc(100vh - 200px);
}
.contract-wizard .services-wrap .service-item {
    position: relative;
    padding-right: 50px;
}
.contract-wizard .services-wrap .service-item.selected {
    background: #E3E1F350;
}
.contract-wizard .services-wrap .service-item:after {
    content: "";
    position: absolute;
    top: 15px;
    right: 15px;
    width: 20px;
    height: 20px;
    border: solid 1px #BFBBD1;
    border-radius: 3px;
}
.contract-wizard .services-wrap .service-item.selected:after {
    background-color: #B0AADA;
    border-color: #B0AADA;
    background-image: url(/wp-content/uploads/2025/06/check.svg);
    background-size: 12px;
    background-position: center;
    background-repeat: no-repeat;
}
.contract-wizard .services-popup button.add-new-service-button {
    position: absolute;
    top: 20px;
    left: 20px;
    padding: 10px 20px;
    font-size: 14px;
    border-radius: 150px;
    border: 0;
    background: #E3E1F3;
    color: #786092;
    letter-spacing: 0.25px;
}
.contract-wizard .services-popup .section-header .title {
    margin: 0 0 20px;
    padding: 10px 0 25px;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 35px;
    line-height: 0.9;
    border-bottom: solid 1px #E8E6F0;
}
.contract-wizard .services-popup .section-footer button.close-popup {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    border: 0;
    background: none;
    font-size: 15px;
    line-height: 1;
    letter-spacing: 0.25px;
    color: #171A27;
}
.contract-wizard .services-popup .section-footer button.close-popup svg {
    transform: rotate(180deg);
}
.account-component .user-component .section-footer .add-btn button img {
    margin: 0 0 -3px;
}
.services-wrap .service-item {
    margin: 0 0 10px;
    padding: 15px;
    border: solid 1px #E8E6F0;
    border-radius: 5px;
}
.services-wrap .service-item .service-name {
    margin: 0 0 3px;
    font-family: "Ploni ML v2 AAA", sans-serif;
    font-size: 16px;
    line-height: 1;
}
.services-wrap .service-item .service-exerpt {
    display: -webkit-box !important;
    margin: 5px 0 20px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 13px;
    line-height: 1.2;
    overflow: hidden;
}
.services-wrap .service-item .btm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 500;
	
}
.services-wrap .service-item-wrap {position: relative;}
.services-wrap .service-item-wrap button.edit {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 15px;
    border: 0;
    background: none;
}
.services-wrap .service-item .btm .service-name {
    margin: 0;
    font-size: 15px;
}
.contract-wizard .contract-actions {
    width: calc(100% - 20px);
    margin: 0 auto 20px;
    padding: 10px 10px 20px;
    border-bottom: solid 1px #FFFFFF30;
}
.contract-wizard .contract-actions button {
    display: block;
    width: 100%;
    padding: 20px;
    font-size: 19px;
    font-weight: 300;
    color: #fff;
    letter-spacing: 1px;
    background: #ffffff55;
    backdrop-filter: blur(10px);
    border: 0;
    border-radius: 150px;
}





form .input-wrap {
    position: relative;
    margin: 0 0 12px;
}
form .input-wrap input, form .input-wrap textarea, form .input-wrap select {
    display: block;
    margin: 10px 0 0;
    width: 100%;
    padding: 25px 15px 10px;
    background: #fff;
    border-radius: 3px;
    border: solid 1px #E8E6F0;
    line-height: 1.2;
    font-size: 15px;
    font-weight: 400;
    color: #171A27;
}
form .input-wrap textarea {height: 120px;}
form .input-wrap label {
    position: absolute;
    top: 7px;
    right: 15px;
    font-size: 11px;
    letter-spacing: 0.5px;
    font-weight: 400;
    color: #171A27;
    line-height: 1;
    transition: all 0.35s ease-in-out;
}
form .input-wrap label[for="contact-notes"] {
    top: 20px !important;
}
form .input-wrap input:placeholder-shown:not(:focus) + label {
    top: 20px;
    left: 15px;
    font-size: 17px;
    opacity: 0.5;
}
.new-contact-popup .image-wrap,
.edit-contact-popup .image-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.new-contact-popup .image-wrap .input-wrap,
.edit-contact-popup .image-wrap .input-wrap{
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 200px;
}
.new-contact-popup form .input-wrap input[type="file"],
.edit-contact-popup .image-wrap input[type="file"]{
    width: 100px;
    height: 100px;
    padding: 0;
    border-radius: 150px;
}
.new-contact-popup .image-wrap h3,
.edit-contact-popup .image-wrap h3{
	margin: 0;
    font-size: 40px;
}
form .input-wrap label[for="contact-image"], form .input-wrap label[for="edit-contact-image"] {
    position: absolute;
    top: 15px;
    right: 5px;
    width: 90px;
    height: 90px;
    border: dashed 2px #E8E6F0;
    border-radius: 150px;
    font-size: 0;
    text-align: center;
}


/*---------------*/
.app-component.account-component {
    padding: 0 20px 100px;
}
.settings-header {
    position: relative;
    top: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 30px 0 10px;
    background: #F5F8FC;
    z-index: 99;
}
.user-card-btn {
    position: absolute;
    top: 35px;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 30px;
    padding: 0;
    background: none;
    border: solid 1px #171A27;
    border-radius: 150px;
    letter-spacing: 0.5px;
    font-size: 14px;
}
.settings-page {
    color: #20142D;
}
.settings-header .right {
    position: relative;
}
.settings-header .right img {
    width: 90px;
    height: 90px;
    border-radius: 100px;
    object-fit: cover;
}
.settings-page .my-account, .settings-page .contracta {
	margin: 0 0 30px;
}
.settings-page .my-account .title,
.settings-page .contracta .title,
.new-contact-popup .section-title {
    padding: 10px 0;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 21px;
    font-weight: 400;
    border-bottom: solid 1px #E8E6F0;
    letter-spacing: 0.35px;
    line-height: 0.9;
}
.new-contact-popup .section-title {
    margin: 15px 0 0;
    padding: 15px 0 0;
    border-top: solid 1px #E8E6F0;
	border-bottom: solid 0px #fff;
}
.settings-page ul {
    margin: 0;
    padding: 0;
}
.settings-page ul li {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 0;
    font-size: 15px;
    letter-spacing: 0.35px;
    border-bottom: solid 1px #E8E6F0;
}
.settings-page ul li:after {
    content: url(/wp-content/uploads/2025/05/arrow-right.svg);
    position: absolute;
    left: 0;
    top: 16px;
    transform: scale(0.9) rotate(180deg);
}
.settings-page .logout {
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.35px;
    text-decoration: underline;
}










.payments-component .payment-group .group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 10px;
    padding: 15px;
    border: solid 1px #E8E6F0;
    border-radius: 5px;
}
.payments-component .payment-group .group-header .data-box {
    display: flex;
    align-items: center;
}
.payments-component .payment-group .group-header .edit-section {
    padding: 10px;
    line-height: 1;
}
.payments-component .payment-group .group-header .desc {
    padding: 0 15px 0 0;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.5px;
    color: #171A27;
    line-height: 1.4;
}
.payments-component .payment-group .group-header .desc .name {
    font-size: 15px;
    font-weight: 400;
}
.payments-component .payment-group input[type="checkbox"] {
    position: relative;
    width: 40px;
    height: 25px;
    appearance: none;
    -webkit-appearance: none;
    border-radius: 50px;
    background: #E3E1F3;
}
.group-details.action-popup {
    visibility: hidden;
}
.popup-is-open .group-details.action-popup {
    visibility: visible;
}
.payments-component .payment-group input[type="checkbox"]:after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 19px;
    background: #fff;
    border-radius: 50px;
    transition: all 0.2s ease-in-out;
}
.payments-component .payment-group input[type="checkbox"]:checked {
    background: #B0AADA;
}
.payments-component .payment-group input[type="checkbox"]:checked:after {
    left: 17px;
}
.payment-popup-header .card img {
    width: 65px;
}
.payments-component .group-details form button[type="submit"] {
    margin: 35px 0 0;
}
.payments-component .group-details .form-group label {
    display: block;
    margin: 0 0 5px;
    font-size: 16px;
}
.payments-component .action-popup .header {
    margin: 0 0 10px;
    background: #F5F8FC;
}
.payments-component .group-details {
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    background: #F5F8FC;
}
.payment-popup-header .card .name {
    font-size: 20px;
}
.payments-component .group-details .form-group input {
    width: 100%;
    padding: 10px 20px;
    background: #fff;
    border: 0;
    border-radius: 50px;
}
.home .main-menu ul li.account.active {
    border-radius: 50px;
}
div#wire .action-popup, div#paypal .action-popup,
div#venmo .action-popup {visibility: hidden;}

.wire-is-open div#wire .action-popup,
.paypal-is-open div#paypal .action-popup,
.venmo-is-open div#venmo .action-popup,
.payoneer-is-open div#payoneer .action-popup {visibility: visible;}

.payments-component #wire .group-details .form-group {position: relative;margin: 0 0 10px;}
.payments-component #wire .group-details .form-group label {
    position: absolute;
    top: 7px;
    right: 20px;
    font-family: "Ploni ML v2 AAA", sans-serif;
    font-size: 11px;
    letter-spacing: 0.5px;
    font-weight: 400;
    color: #171A27;
    line-height: 1;
    transition: all 0.35s ease-in-out;
}
.payments-component #wire .group-details .form-group input {
    width: 100%;
    padding: 21px 20px 8px;
    background: #fff;
    border-radius: 25px;
    border: none;
    line-height: 1.2;
    font-family: "Ploni ML v2 AAA", sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #171A27;
}

/*------------ Business Term------------------*/
.term-add-is-open .term-add,
.term-edit-is-open .term-edit,
.term-is-open #term-popup {visibility: visible;}
.business-term-wrap .business-term-item {
    position: relative;
    display: flex;
    align-items: center;
    margin: 10px 0 0;
    background: #fff;
    font-family: "Ploni ML v2 AAA-olive", sans-serif;
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.5px;
    color: #171A27;
}
.business-term-wrap .business-term-item::selection{background:#fff;color:#171A27}
.business-term-wrap .business-term-item .drag-item img {
    width: 20px;
}
.business-term-wrap .business-term-item .item-data {
    position: relative;
	width: 100%;
    padding: 15px 15px 40px;
    border: solid 1px #E8E6F0;
    border-radius: 5px;
}
.business-term-wrap .business-term-item .business-term {
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    max-height: 50px;
    line-height: 1.2;
    overflow: hidden;
}
.business-term-wrap .business-term-item .edit-business-term {
    position: absolute;
    bottom: 10px;
    left: 10px;
    padding: 5px;
    background: none;
    border: 0;
}
.business-terms-page .action-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0;
}
.business-terms-page .action-wrap .search-wrap {
    width: 100%;
}
.search-wrap input {
    display: block;
    margin: 0 0 20px;
    padding: 7px 0 7px 22px;
    width: 100%;
    background: none;
    border: 0;
    border-bottom: solid 1px #E8E6F0;
    border-radius: 0;
    font-size: 18px;
    color: #171A27;
    letter-spacing: 0.5px;
    background-image: url(/wp-content/themes/happ/assets/svg/search.svg);
    background-size: 14px;
    background-position: center left;
    background-repeat: no-repeat;
}
.search-wrap input::placeholder {
    font-size: 14px;
    color: #171a27;
}
.business-terms-page .add-new-term {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 30px;
    padding: 0;
    background: none;
    border: solid 1px #171A27;
    border-radius: 150px;
}
.business-term-wrap .business-term-item .drag-item {
    padding: 20px 0 20px 15px;
}



/*-----------------------------------------------------------------*/
/*----------------- S I N G L E - Q U O T E -----------------------*/
/*-----------------------------------------------------------------*/
.single-contracts .contract-main-wrap{
    padding: 15px 15px 0;
    background-color: #0F3437;
    background-size: 100% 100% !important;
    background-position: top center !important;
    background-repeat: repeat-Y !important;
    color: #fff;
    font-weight: 300;
    font-size: 15px;
    letter-spacing: 0.5px;
}
.single-contracts .powered-by {
    margin: 50px -15px 0;
    padding: 15px;
    text-align: center;
    font-size: 12px;
    background: #00000020;
    letter-spacing: 2px;
    line-height: 1;
}
.single-contracts .glass-box {
    margin: 0 0 30px;
    padding: 20px 20px 30px;
    background-color: #ffffff17;
    backdrop-filter: blur(35px);
    border-radius: 15px;
}
.contract-main-wrap .top-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row-reverse;
    height: 350px;
}
.contract-main-wrap .top-wrap .logo-wrap img {
    padding: 10px 0 0;
    width: 180px;
    height: 100px;
    object-fit: contain;
    object-position: top left;
}
.contract-main-wrap .top-wrap .share-wrap {
    display: flex;
    align-items: center;
    gap: 20px;
}
.contract-main-wrap .top-wrap .share-wrap button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 150px;
    backdrop-filter: blur(10px);
    background-color: #ffffff30;
    border: solid 1px #ffffff30;
    cursor: pointer;
}

.single-contracts header.entry-header .meta {
    display: flex;
    align-items: start;
    justify-content: space-between;
    text-align: left;
    letter-spacing: 1px;
}
.single-contracts header .contracts-title {
    margin: 0;
    padding: 20px 0 10px;
    line-height: 1.1;
    font-size: 35px;
    font-weight: 500;
    letter-spacing: 0.5px;
}
.single-contracts header a {
    display: block;
    padding: 20px 0;
}
.single-contracts .entry-content {
    margin: 40px 0 0;
    border-top: solid 1px #ffffff30;
}
.single-contracts .entry-content .section-title {
    margin: 30px 0 10px;
    font-weight: 400;
    font-size: 27px;
}
.single-contracts .services-container .services-list .services-item {
    position: relative;
    padding: 20px 0 20px 40px;
    border-bottom: solid 1px #ffffff50;
    font-size: 14px;
}
.single-contracts .services-container .services-list .services-item:first-child,
.services-container .services-list .services-item:first-child button.more-info {
    padding-top: 0;
}
.single-contracts .services-container .services-list .services-item:first-child button.more-info {
    padding-top: 5px;
}

.single-contracts .services-container .services-list .services-item button.more-info {
    position: absolute;
    top: 0;
    left: 0;
    padding: 20px 20px 20px 0;
    background: none;
    border: 0;
	z-index: 9;
}
.single-contracts .services-container .services-item .item-data .title,
.single-contracts .payments-wrap .milestone .title{
    margin: 0 0 7px;
    font-size: 17px;
    font-weight: 400;
    line-height: 1;
}
.single-contracts .services-container .services-item .item-data .short-desc, 
.single-contracts .payments-wrap .milestone .description{
    line-height: 1.2;
	opacity: 0.75;
}
.single-contracts .services-container .services-item .item-data .price-box {
    display: flex;
    align-items: center;
    padding: 20px 0 0;
    line-height: 1;
	font-size: 15px;
}
.single-contracts .services-container .services-item .item-data .price-box .price {
	font-weight: 400;
}
.single-contracts .services-container .services-item .item-data .price-box .qty {
    margin: 0 7px 0 0;
    opacity: 0.8;
}
.single-contracts .services-wrap .subtotal,
.single-contracts .services-wrap .discount-wrap,
.single-contracts .services-wrap .total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0 0;
	line-height: 1.2;
}
.single-contracts .services-wrap .total {
    margin-bottom: 10px;
    font-size: 18px;
	font-weight: 400;
}
.single-contracts .services-wrap .vat-note {
    font-size: 12px;
    letter-spacing: 0.5px;
    opacity: 0.7;
}
.single-contracts .payments-wrap .milestone {
    display: flex;
    align-items: start;
    justify-content: space-between;
    position: relative;
    margin: 0 0 15px;
    padding: 0 0 15px;
    border-bottom: solid 1px #ffffff50;
    font-size: 14px;
    line-height: 1.2;
}
.single-contracts .payments-wrap .milestone .meta {
    width: 85%;
    padding: 0 10px 0 0;
}
.single-contracts .payments-wrap .milestone .price {
    display: flex;
    width: 15%;
    text-align: left;
    flex-direction: column;
	justify-content: space-between;
    align-self: stretch;
}
.single-contracts .payments-wrap .milestone .price .amount {
    display: flex;
    align-items: center;
    font-size: 14px;
    opacity: 0.5;
}
.single-contracts .payments-wrap .milestone .price .percentage {
	direction: ltr;
    margin: 0 0 5px;
    font-weight: 400;
    font-size: 19px;
    letter-spacing: 0;
}
.single-contracts .terms_conditions-wrap ul.terms-list li {
    list-style: auto;
    margin: 0 0 10px;
    padding: 0 0 0 7px;
    font-size: 14px;
    line-height: 1.2;
}
.single-contracts .terms_conditions-wrap ul.terms-list {
    margin: 0;
    padding: 0 10px 0 20px;
}
.single-contracts button.sign-online {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 55px;
    margin: 0 0 30px;
    padding: 0 0 2px;
    background-color: #ffffff40;
    backdrop-filter: blur(35px);
    border: 0;
    color: #fff;
    font-weight: 300;
    font-size: 19px;
    letter-spacing: 1px;
    line-height: 1;
    border-radius: 150px;
    cursor: pointer;
}
.single-contracts .owner-info {
    position: relative;
    padding: 20px 0 0;
    font-size: 18px;
    line-height: 1.2;
    border-top: solid 1px #ffffff30;
}
.single-contracts .owner-info .owner-dit {
    margin: 20px 0 0;
}
.single-contracts .owner-info .owner-dit a {
    display: block;
    padding: 7px 0;
    font-size: 14px;
    color: #fff;
    opacity: 0.6;
    letter-spacing: 1.5px;
    line-height: 1;
}
.single-contracts .owner-info .owner-dit img.signature {
    position: absolute;
    top: 5px;
    right: 20px;
	pointer-events: none;
}
.share-popup.active {
    display: flex !important;
}
.share-popup {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    padding: 10px;
    z-index: 999;
}
.share-popup .popup-overlay {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: #00000050;
    backdrop-filter: blur(10px);
    z-index: 8;
}
.share-popup .popup-body {
    position: relative;
    display: block;
    width: 100%;
    border-radius: 10px;
    background-color: #fff;
    z-index: 9;
}
.share-popup .popup-body button.close-ui {
    position: absolute;
    top: 15px;
    left: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 30px;
    border-radius: 150px;
    padding: 0;
    line-height: 1;
    border: 0;
    background: #fff;
    box-shadow: 0 2px 5px 0 #00000010;
    z-index: 9;
}
.share-popup .popup-body .popup-content {
    position: relative;
    padding: 70px 30px;
    background-image: linear-gradient(45deg, #B8ABFC, #EACFFD, #DAD1FF, #ACD3FB);
    border-radius: 10px 10px 0 0;
    text-align: center;
    color: #171A27;
    font-size: 15px;
}
.share-popup .popup-body .popup-content:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(0deg, white, transparent);
    z-index: 0;
}
.share-popup .popup-body .popup-content .title {
    position: relative;
    margin: 0 0 5px;
    font-family: "Ploni Tzar ML v2 AAA";
    font-size: 35px;
    font-weight: 500;
    line-height: 1;
    z-index: 9;
}
.share-popup .popup-body .popup-content .share-description {
    position: relative;
    margin: 0 0 30px;
    font-size: 15px;
    line-height: 1.3;
    z-index: 9;
}
.share-popup .popup-body .popup-content .share-buttons {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    z-index: 9;
}
.share-popup .popup-body .popup-content .share-buttons a,
.share-popup .popup-body .popup-content .share-buttons button {
    display: block;
    padding: 0;
    background: none;
    border: 0;
    font-size: 12px;
    color: #171A27;
    letter-spacing: 0.5px;
}
.share-popup .popup-body .popup-content .share-buttons .share-button-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    margin: 0 0 7px;
	background: #ffffffd1;
    border-radius: 150px;
    box-shadow: 1px 3px 7px 0 #00000020;
}
.share-popup .popup-body .popup-content .share-buttons a.sms-btn img {
    margin: 0 -7px -15px 0;
}
.share-popup .popup-body .popup-content .share-buttons a.email-btn img {
    margin: 0 0 0 -5px;
}
.share-popup .popup-body .copy-wrap {
    position: relative;
    margin: 0 0 40px;
    padding: 0 20px;
}
.share-popup .popup-body .copy-wrap .copy-text {
    margin: 0 0 5px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    color: #171A27;
}
.share-popup .popup-body .copy-wrap input.copy-input {
    display: block;
    width: 100%;
    padding: 12px 20px 12px 0;
    background: #F7F7FC;
    border: 0;
    border-radius: 150px;
}
.share-popup .popup-body .copy-wrap input.copy-input {
    direction: ltr;
    display: block;
    width: 100%;
    height: 50px;
    padding: 15px 55px 15px 20px;
    background: #F7F7FC;
    border: 0;
    border-radius: 150px;
    font-size: 14px;
}
.share-popup .popup-body .copy-wrap button.copy-button {
    position: absolute;
    right: 25px;
    bottom: 5px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #EBE9F6;
    border-radius: 150px;
    border: 0;
	transition: all 0.5s ease-in-out;
	cursor: pointer;
}
.share-popup .popup-body .copy-wrap button.copy-button[data-copied="1"]{
	transform: rotateY(360deg);
	background: #D8D5E7;
}




/*--------- W E L C O M E ------------*/
.welcome-container {
    display: flex;
    align-content: space-between;
	justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    padding: 20px 20px 30px;
    height: 95vh;
    background: #FFFFFF;
	color: #221530;
}
.welcome-container .login-container {
    position: relative;
    z-index: 9;
}
.welcome-container .welcome-header {
	position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    width: 100%;
    font-size: 14px;
	z-index: 9;
}
.welcome-container .welcome-header a {
    font-weight: 500;
}


.login-footer .top {
    margin: 20px 0;
    padding: 20px 30px;
    background: #F7F7FC;
    border-radius: 5px;
    text-align: center;
}
.login-footer .top .title {
    direction: ltr;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-weight: 500;
}
.login-footer .top .desc {
    max-width: 250px;
    margin: 6px auto;
    font-size: 13px;
    letter-spacing: 0.35px;
    line-height: 1.35;
}
.login-footer .bottom .all-rights {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
}
.login-footer .bottom .all-rights a {
    text-decoration: underline;
    margin: 0 10px 0 0;
}
.login-footer .bottom .all-rights a {
    text-decoration: underline;
    margin: 0 10px 0 0;
}
.welcome-container .login-container .login-header .title {
    margin: 0 0 10px;
    font-size: 40px;
    font-weight: 500;
    line-height: 1;
}
.welcome-container .login-container .login-header .title span.big {
    display: block;
    font-weight: 600;
}
.welcome-container .login-container .login-form {
    margin: 20px 0 0;
}
.welcome-container .login-container .login-form label {
    display: block;
    margin: 0 0 2px;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 21px;
    font-weight: 500;
}
.welcome-container .login-container .login-form input.phone-input {
    display: block;
    width: 100%;
    margin: 0 0 10px;
    padding: 15px 30px;
    border: 0;
    border-radius: 150px;
    background: #fff;
    box-shadow: 3px 3px 7px 0 #00000020;
    letter-spacing: 0.5px;
    color: #171A27;
    font-size: 17px;
}
.welcome-container .login-container .login-form button.btn-primary,
.welcome-container .login-container .otp-form button#verify-otp-btn {
    display: block;
    width: 100%;
    padding: 20px 20px 15px;
    background: #221530;
    color: #fff;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-weight: 300;
    font-size: 27px;
    border-radius: 150px;
    line-height: 1;
}
.welcome-container:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: calc(100% - 300px);
    background-image: url(http://app.happ.network/wp-content/uploads/2025/08/login_background.png);
    background-size: cover;
    background-position: top center;
    border-radius: 0 0 10px 10px;
    z-index: 8;
}
.welcome-container .login-container .login-otp {
    position: fixed;
    top: 80px;
    right: 0;
    height: calc(100% - 80px);
    padding: 20px;
    background: #fff;
    border-radius: 15px 15px 0 0;
    z-index: 999;
}
.welcome-container .login-container .login-otp {
    position: fixed;
    top: 80px;
    right: 0;
    height: calc(100% - 80px);
    width: 100%;
    flex-wrap: wrap;
    align-content: flex-start;
    padding: 20px;
    background: #fff;
    border-radius: 15px 15px 0 0;
    z-index: 999;
}
.welcome-message.welcome-message-error {
    background: #221530;
    width: 100%;
    text-align: center;
    padding: 20px;
    border-radius: 5px;
    color: #fff;
    font-size: 18px;
}

.welcome-container .login-container .login-otp .otp-header {
    margin: 0 0 50px;
}
.welcome-container .login-container .login-otp button.close-otp {
    margin: 0 0 50px;
    padding: 7px 25px;
    border: solid 1px #B9C5D4;
    background: none;
    border-radius: 150px;
}
.welcome-container .login-container .login-otp .otp-header .title {
    font-size: 15px;
    letter-spacing: 0.35px;
}
.welcome-container .login-container .login-otp .otp-header .title span.big {
    display: block;
    margin: 0 0 2px;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 35px;
    font-weight: 500;
    line-height: 0.8;
}
.welcome-container .login-container .otp-form {
    width: 100%;
    text-align: center;
    font-size: 17px;
    letter-spacing: 0.35px;
}
.welcome-container .login-container .otp-form span.phone {
    display: block;
    margin: 0 0 15px;
}
.welcome-container .login-container .otp-form span.text b {
    font-weight: 600;
}
.welcome-container .login-container .otp-form .otp-input input {
    width: 100%;
    padding: 15px 20px;
    background: #F4F4F9;
    border: 0;
    border-radius: 150px;
}
.welcome-container .login-container .otp-form .otp-input {
    margin: 0 0 35px;
}
.welcome-container .login-container .otp-form .resend-otp button {
    padding: 0;
    border: 0;
    background: none;
    font-weight: 600;
    color: #221530;
}
.welcome-container .login-container .otp-form .resend-otp {
    margin: 0 0 35px;
    font-size: 14px;
    color: #221530;
}


/*-------contract-summary-popup---------*/
.contract-summary-popup {
    position: fixed;
    right: 0;
    bottom: -100%;
    width: 100%;
    height: 100%;
    padding: 20px 20px 0;
    background: #fff;
	/*background-image: linear-gradient(180deg, #cef5ff, #ffffff, #ffffff);*/
    z-index: 9999999;
    box-shadow: 0 -2px 7px 0 #00000010;
    transition: all 0.35s ease-in-out;
	color: #171A27;
    overflow: auto;
}
.contract-summary-popup.active {
    bottom: 0;
}
.contract-summary-popup .contract-summary {
    min-height: calc(100vh - 20px);
}

.contract-summary-popup .status-container {
    text-align: center;
}
.contract-summary-popup .contract-title {
    max-width: 300px;
    margin: 20px auto 0;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 24px;
    text-align: center;
    line-height: 1.2;
}
.contract-summary-popup .summary-section.amount-section {
    margin: 0 0;
    padding: 15px 20px 15px 0;
    font-family: "Ploni ML v2 AAA-olive", sans-serif !important;
    font-size: 45px;
    font-weight: 500;
    letter-spacing: -1px;
    line-height: 1;
    text-align: center;
    border: 0;
}
.contract-summary-popup .summary-section.amount-section .currency {
    font-size: 30px;
}
.contract-summary-popup .contract-meta {
    margin: 0 0 20px;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0.5px;
}
.contract-summary-popup .contact-info {
    display: flex;
    align-items: center;
    gap: 10px;
}
.contract-summary-popup .contact-info p {
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 24px;
}
.contract-summary-popup .contact-info img {
    width: 35px;
    height: 35px;
    border-radius: 150px;
    object-fit: cover;
    object-position: center;
}
.contract-summary-popup .cta-container button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 5px auto 15px;
    padding: 15px 20px;
    width: fit-content;
    border-radius: 150px;
    background: #171A27;
    color: #fff;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 17px;
    font-weight: 300;
    letter-spacing: 0.65px;
    line-height: 0.9;
}
.contract-summary-popup .summary-section {
    padding: 15px 0;
    border-top: solid 1px #E8E6F0;
}
.contract-summary-popup .summary-section .section-title {
    margin: 0;
    font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 24px;
    font-weight: 500;
}
.contract-summary-popup .summary-section .service-item,
.contract-summary-popup .summary-section .milestone-item {
    display: flex;
    align-items: start;
    margin: 0 0 15px;
    font-size: 14px;
}
.contract-summary-popup .summary-section .service-item .service-info,
.contract-summary-popup .summary-section .milestone-item .milestone-info {
    width: calc(100% - 100px);
    padding: 0 0 0 15px;
}
.contract-summary-popup .summary-section .service-item .service-info .service-name,
.contract-summary-popup .summary-section .milestone-item .milestone-info .milestone-name {
    margin: 0;
    font-weight: 500;
    font-size: 15px;
}
.contract-summary-popup .summary-section .service-item .service-price,
.contract-summary-popup .summary-section .milestone-item .milestone-payment {
    direction: ltr;
    width: 100px;
    text-align: left;
    font-weight: 500;
}
.contract-summary-popup .summary-section .milestone-item .milestone-payment {
    display: flex;
    align-items: center;
    gap: 7px;
}
.contract-summary-popup .summary-section .milestone-item .milestone-payment .percentage {
    display: block;
    padding: 2px 0;
    width: 40px;
    background: #E5DAF7;
    font-size: 12px;
    border: solid 1px #D9C0FF;
    text-align: center;
    border-radius: 3px;
}
.contract-summary-popup .summary-content {
    padding-bottom: 50px;
}
.contract-summary-popup  .summary-actions {
    position: sticky;
    width: calc(100% + 40px);
    margin: 0 -20px 0 0;
    bottom: 0;
    padding: 17px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #F7F7FC;
    z-index: 999;
}
.contract-summary-popup .summary-actions .back-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    background: none;
    border: 0;
}
.contract-summary-popup .summary-actions .action-btns-container {
    display: flex;
    align-items: center;
}
.contract-summary-popup .summary-actions .action-btns-container button {
    padding: 10px 20px;
    border: 0;
    background: none;
    line-height: 1;
}
.contract-summary-popup .summary-actions .action-btns-container button.share-btn {
    display: block;
    width: 100%;
    margin: 0 10px 0 0;
    padding: 11px 27px;
    background: #E3E1F3;
    border-radius: 150px;
}
.contract-summary-popup .summary-actions .action-btns-container button.share-btn svg {
    width: 17px;
    height: 17px;
    margin: 0 0 -4px;
}
.contract-summary-popup .loading-indicator {
	display:flex;
	align-items: center;
	justify-content: center;
	height: 80vh;
	font-family: 'Ploni Tzar ML v2 AAA';
    font-size: 17px;
    font-weight: 500;
	letter-spacing: 0.5px;
}












































