:root {
    --ios-font: -apple-system, BlinkMacSystemFont,
    "SF Pro Text", "SF Pro Display",
    system-ui, sans-serif;
    --bg: #f2f2f7;
    --separator: rgba(60,60,67,.29);
    --text-primary: #000;
    --text-secondary: rgba(60,60,67,.6);
    --border-color: #ccc;
    --radius: 4px;
}

* {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

html {
    -webkit-text-size-adjust: 100%;
}

body{
    font-family: var(--ios-font);
    font-size: 11pt;
    font-weight: normal;
    color:#000;
    margin: 0;
    background: #fff;
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    -webkit-overflow-scrolling: touch;
}
h1,h2,h3{
    margin: 0;
}
a, a:visited{
    text-decoration: none;
    color: #0d54e3;
}
a:hover,
a:active{
    text-decoration: none;
    color: #0d54e3;
}
*:focus {
    outline: none;
}
input.text-input[name="dau_chu"] {
	text-transform: capitalize;
}
input, select, textarea{
    color: #000;
}
textarea:focus, input:focus {
    color: #000;
}

.text-input,
.text-textarea,
.text-selectbox{
    width: 100%;
    border: 1px solid #ced4da;
    border-radius: var(--radius);
    font-size: 14px;
    line-height: 1.5;
    transition: border-color 0.2s;
    box-sizing: border-box;
    font-family:var(--ios-font);
    padding: 5px;
    text-indent: 18px;
}
.checkbox-input{
    border: solid 1px #ccc;
    margin: 0;
}

.text-input-line {
    padding: 5px 0;
    margin-bottom: 10px;
    position: relative;
    width: 100%;
}



.button{
    font-size: 11pt;
    font-family: var(--ios-font);
    border: solid 1px #0d54e3;
    padding: 5px 10px;
    cursor: pointer;
    font-weight: bold;
    background: #0d54e3;
    color: #fff;
    width: 35%;
}
.button.second-button{
    background: #ccc;
    border: solid 1px #ccc;
    color:#000;
}
.main-content{
	padding-bottom: 30px;

}
.main-content.product-page{
    margin-top: 108px;
}
.main-content.client-page{
    margin-top: 74px;
}
.head-page h1{
    float: left;
    width: 60%;
}
.head-page .actions-box{
    float: right;
    width: 30%;
    text-align: right;
}
.head-page:after{
    clear: both;
    display: block;
    content: ".";
    visibility: hidden;
    height: 0;
    overflow: hidden;
}
.item-list{
    list-style: none;
    padding: 0;
    margin: 0;
}
ul.item-list li.parent-item{
    list-style: none;
    padding: 0;
    padding-bottom: 15px;
    margin: 0;
    margin-bottom: 15px;
    border-bottom: solid 1px #999;
}
ul.item-list  .sub-item{
    list-style: none;
    padding: 0;
    margin: 0;
}
ul.item-list .sub-item li{
    border-bottom: dashed 1px #999;
    padding: 15px 0;
    list-style: none;
    padding-left: 30px;
}
ul.item-list .sub-item li:last-child{
    border-bottom: 0;
}
.item-price{
    border: solid 1px #ccc;
    margin-right: 20px;
    display: inline-block;
}
.item-price > span{
    display: block;
    float: left;
    line-height: 22px;
}
.item-price .price-label{
    font-size: 11px;
    background: #ccc;
}


.validation-message{
    margin: 0 auto;
}

.text-input-line label{
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
}
.validation-message p{
    color: red;
    margin: 0;
    padding: 0;
    margin-bottom: 5px;
}
.head-content{
    padding-top: 0;
    padding-bottom: 0;
    text-align: left;
    background: #0d54e3;
    color: #fff;
    margin-bottom: 0;
    position: fixed;
    width: 100%;
    top: 0;
    height: 40px;
    line-height: 36px;
    z-index: 99;
}
.head-content h1{
    color:#fff;
    font-size: 15px;
    font-weight: bold;
    height: 36px;
    overflow: hidden;
    float: left;
}
h1.product-list-header{
    padding-left: 5px;
    text-transform: uppercase;
    display: inline-block;
}
.button-actions{
    text-align: center;
}
.head-content .goback-button{
    position: absolute;
    width: 32px;
    height: 32px;
    background: url("../images/back-arrow-icon-32.png") no-repeat center center #032261;
    background-size: 20px;
    left: 0px;
    top: 2px;
}
.head-content a.home-icon,
.head-content a.home-icon:hover,
.head-content a.home-icon:active,
.head-content a.home-icon:visited{
    text-decoration: none;
    color:#fff;

   /* background-size: 30px;*/


}
.head-content .home-icon,
.head-content .post-icon,
.head-content .filter-link,

.head-content .add-content-link,
.head-content .clients-link{
    position: absolute;
    width: 32px;
    height: 32px;
    top: 2px;
    border: solid 0px #fff;
    border-radius: 100%;
    background-size: 24px;
    background-position: center center;
    background-repeat: no-repeat;
}

.head-content .add-content-link{
    background-image: url("../images/add-new-icon.png");
    right: 55px;
}
.head-content .clients-link{
    background-image: url("../images/client-icon.png");
}
.head-content .home-icon{
    background-image: url("../images/home-icon.png");
}
.head-content .post-icon{
    background-image: url("../images/comment-icon-32.png");
}
.head-content .settings-icon{
    background-image: url("../images/settings-icon-32.png");
    right: 5px;
}

.head-content .home-icon.left,
.head-content .clients-link.left,
.head-content .post-icon.left{
    left: 5px;
}
.head-content .home-icon.right,
.head-content .clients-link.right{
    right: 55px;
}

.head-content .filter-link{
    right: auto;
    left: 5px;
    background: url("../images/filter-icon.png") no-repeat center center;
}
.list-tin h3.content-icon{
    background-image: url("../images/content-icon.png");
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 40px;
}
.main-content{

}
.job-form-content{
    padding: 0 15px;
}
.table-list-wrapper{

}

.validation-message{
    padding-left: 2%;
    padding-right: 2%;
}
.validation-message p{
    padding-left: 0;
    padding-right: 0;
}
.login-content{
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 30px;
}
.login-content .text-input-line{
    text-align: center;
}
.login-content .text-input{
    width: 80%;
}

table.table-list{
    border-collapse: collapse;
    border: solid 1px #0d54e3;

    border-top: solid 1px #fff;
}
table.table-list tbody td{
    padding: 0px 5px;
    border-color: #0d54e3;
    vertical-align: top;
	line-height: 21px;

}

table.table-list tbody tr:nth-child(even){

}

table.table-list tbody tr:hover{

}

table.table-list thead th,
table.table-list thead td{
    padding: 12px 5px;
    border-color: #ffffff;
    vertical-align: top;
    color:#fff;
    border-bottom: solid 1px #0d54e3;
    text-align: left;
}
table.table-list thead td{
    padding:  5px;
}
table.table-list thead tr{
    background-color: #0d54e3;
}
form{
    margin: 0;
}
.delete-link{

}
.external-link{

}
.delete-link-act:visited,
.delete-link-act:hover,
.delete-link-act:active,
.delete-link-act{

}
.link-act:visited,
.link-act:hover,
.link-act:active,
.link-act{
    color:#000;
    text-decoration: none;
}
.address-name-link{
    font-weight: bold;
    white-space: normal;
}
.dat{

}
.nha{

}

a.sort-link,
a.sort-link:hover,
a.sort-link:visited,
a.sort-link:active{
    display: block;
    color:#fff;text-decoration: none;
}
.filter-box{
    
    margin-bottom: 0px;
    background: #0d54e3;
    position: fixed;
    left: 0;
    top: 40px;
    height: 34px;
    width: 100%;
    z-index: 99;
   
}
.sort-box,
.filter-box{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 5px;
    padding: 5px;
}
.input-filter input,
.input-filter select{
    border-radius: var(--radius);
}

.price-list{
    display: block;
    font-weight: bold;
    color:red;
}
.header-actions{
    position: fixed;
    right: 20px;
    top: 3px;
    z-index: 99;
}
.link-act.address-name-link{

}
.link-act.address-name-link.da-khao-sat{

}
.dat{
    color: #e520d4;
}
.cc{
    color: blueviolet;
}

.button-actions.form{
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
}
.button-actions.form:after{
    clear: both;
    content: ".";
    visibility: hidden;
    height: 0;
    display: block;
}
.button-actions.form .delete-link-act{
    float: left;
    background: #ccc;
    padding: 5px 10px;
    border-radius: 10px;
}
table.table-list thead th a,
table.table-list thead th a:hover,
table.table-list thead th a:visited,
table.table-list thead th a:active{
     color: #fff; text-decoration: none;
}
.link-act.address-name-link.dat{

}

.button-actions.form:after,
.job-form-content:after{
    clear: both;
    display: block;
    content: ".";
    visibility: hidden;
    height: 0;
}
.noi-dung-tin{
    line-height: 21px;
    padding: 10px 20px;
    position: relative;
    font-size: 15px;
}
.noi-dung-tin:nth-child(odd){
    background-color: #e9e9e9;
}
.list-tin{
    margin-top: 30px;
}
.list-tin h3{
    margin-bottom: 0;
    background-color: #ab0246;
    text-align: left;
    color: #fff;
    height: 35px;
    line-height: 35px;
}
.list-tin .address-tin{
    font-weight: bold;
    padding-left: 20px;
    padding-top: 10px;
}
.list-tin .one-item{
    border-bottom: solid 1px #999;
}
.list-tin:after,
.pagination:after{
    clear: both;
    display: block;
    content: ".";
    visibility: hidden;
    height: 0;
    overflow: hidden;
}


a.delete-tin-link,
a.delete-tin-link:visited,
a.delete-tin-link:active,
a.delete-tin-link:hover{
    color: red;
    text-decoration: none;
    margin-left: 10px;
    font-weight: normal;
}

.head-content .add-content-link:hover,
.head-content .add-content-link:visited,
.head-content .add-content-link:active,
.head-content .add-content-link{
    text-decoration: none;
}
.head-content .add-content-link span{
    background: red; color: #fff;
}
a.comment-icon,
a.comment-icon:visited,
a.comment-icon:active,
a.comment-icon:hover{
    text-decoration: none;
}
.comment-icon{
    background: url("../images/comment-icon.png") no-repeat left center;
    padding: 4px;
    padding-left: 18px;
    margin-left: 2px;
    background-size: 16px;
}
.comment-icon span{}

.noi-dung-tin:last-child{
    margin-bottom: 30px;
}
.ghi-chu{
    color: #333;
    position: relative;
    margin-top: 5px;
    background: #fff;
    padding: 5px 5px 0 5px;
}
.ghi-chu img{
    float: left;
    margin-right: 10px;
	width: 60px;
	height: 90px;
	border-radius: 5px;
}
a.client-name-link,
a.client-name-link:visited,
a.client-name-link:active,
a.client-name-link:hover{
    color: #000; text-decoration: none;
    background-image: url("../images/red-icon-16.png");
    background-size: 9px;
    padding-left: 12px;
    background-position: left center;
    background-repeat: no-repeat;
}
a.client-name-link.client-type-1{
    background-image: url("../images/green-icon-16.png");
}
a.client-name-link.client-type-3{
    background-image: url("../images/green-red-icon-16.png");
}

.note{
    color:#000;
	margin-top: 10px;
}

.update-client-link{
    background: url(../images/calendar-icon-32.png) left center no-repeat;
    background-size: 16px;
    padding-left: 16px;
    display: inline-block;
    white-space:nowrap;
    font-style: italic;
}
a.update-client-link,
a.update-client-link:visited,
a.update-client-link:hover,
a.update-client-link:active{
    color: #888;
    text-decoration: none;
}

.phone-text{
    margin-right: 10px;
}
.call-act,
.zalo-icon,
.facebook-icon{
    text-decoration: none !important;
    color: #000 !important;
    margin-right: 5px;
}

.settings{
    display: inline-block;
}
.settings .main-function{
    display: inline-block;
}
.settings .main-function li{
    border-bottom: solid 1px #c2cbda;
    padding-left: 0;
	

}
.settings .main-function li a{
    display: block;
    font-weight: normal;
	color:#000;
	text-decoration:none !important;
	padding-left: 25px;
    padding-right: 25px;
	padding-bottom: 5px;
	padding-top: 5px;
}
.settings .main-function li:last-child{
    border-bottom: 0;
}
.settings:hover ul.main-function{

}

.pagination{
    text-align: center;
    margin-bottom: 30px;
    margin-top: 30px;
}
.pagination a,
.pagination strong{
    padding: 5px 10px;
    border: solid 1px #999;
    border-radius: 3px;
    margin-right: 10px;
}

.number-counter{
   width: 20px;
    height: 20px;
    text-align: center;
    border-radius: 100%;
    color: #000;
    border: solid 1px #999;
    display: inline-block;
    margin-bottom: 5px;
}

.limited-posts{
    font-size: 12px; color: #fff;
     background: #ff1e78; border: solid 1px #ff1e78;
    border-radius: 5px;
    padding: 2px 3px;
}

.sort-box{
    text-align: right;
    padding: 5px 10px;
    background: #fff;
    border-bottom: solid 1px #032261;
    position: fixed;
    left: 0;
    top:74px;
    width: 100%;
    z-index: 99;
    height: 34px;
}
.sort-mode{
    font-family: var(--ios-font);
    font-size: 12px;
}
.input-filter{
    margin-bottom: 5px;
    width: 100%;
}

#ward.input-filter{

}
#status.input-filter{

}
.filter-box input[name="q"]{

}
#property_id.input-filter,
#status.input-filter,
#ward.input-filter{

}
#property_id.input-filter,
#status.input-filter,
#ward.input-filter{

}

.price-per-met{
	font-weight:normal;
	font-size:11px;
	color:#999;
}
.address-row{
    position: relative;
	font-size:11pt;
    padding-right: 70px;
}
.dien-tich-row,
.gia-row{
    position: absolute;
    top:-5px;
    right: 39px;
    width: 30px;
    height: 32px;
    background: #fff;
    color:#000;
    border: solid 1px #0d54e3;
    text-align: center;
    line-height: 26px;
    border-top: 0;
	font-size:13px;
}
.gia-row{
    right: 0;
    line-height: normal;
    width: 40px;
    text-align: center;
    background: #fff;
	

}
.gia-row small{
    display: block;
    color:#999;
}
.ghi-chu:after{
    clear: both;
    display: block;
    content: ".";
    visibility: hidden;
    overflow: hidden;
    height: 0;
}
.add-photo-link{
	margin-left: 15px;
	
    
}
a.add-photo-link:visited,
a.add-photo-link:hover,
a.add-photo-link:active,
a.add-photo-link{
    text-decoration: none;
    color: #000;
}

#upload-form-container{
    padding: 10px 20px;
}
.uppercase-name-input{

}

.list-photos-wrapper{
    margin-top: 30px;
}
.list-photos{
    list-style: none;
    padding: 0;
    margin: 0;
}
.list-photos li{
    list-style: none;
    padding-left: 0;
    display: inline-block;
    border: solid 1px #ab0246;
    margin-right: 10px;
    position: relative;
}
.product-image-delete-link{
    position: absolute;
    top: 0;
    right: 0;
    width: 18px;
    height: 18px;
    background: #ab0246;
    text-align: center;
    border: solid 1px #ab0246;
    color: #fff;

}
a.product-image-delete-link,
a.product-image-delete-link:hover,
a.product-image-delete-link:visited,
a.product-image-delete-link:active{
    color: #fff; text-decoration: none;
}
a.product-image-set-thumb-link{
    position: absolute;
    bottom: 0;
    right: 0;
    width: 18px;
    height: 18px;
    text-align: center;
    color: #888;
    text-decoration: none;
    line-height: 18px;
    background: #ccc;
    border: solid 1px #ccc;
}
.product-image-set-thumb-link.thumb-1{
    background: #008000;
    border: solid 1px #008000;
    color:#fff;
}

.item-line:after{
    clear:both ;
    display: block;
    content: ".";
    visibility: hidden;
    overflow: hidden;
    height: 0;
}
.product-details{
    position: relative;
}


table.table-list tbody td{
    padding-top: 5px;
    padding-bottom: 5px;
	font-size:15px;
}
.product-attributes-wrapper{
    font-size: 13px;
    color: #666;
    display: flex;
    gap: 12px;
}
.product-bottom-links-wrapper{
    margin-left: 5px;
    text-align: left;
    float: left;
    width: 78px;
}
.product-attributes {
    
    padding-top: 5px;
    background: #fff;
}
.product-attributes:after{
    clear: both;
    display: block;
    content: ".";
    height: 0;
    overflow: hidden;
}

.original-details{
    border: solid 1px #ccc;
}
.original-address-wrapper,
.original-description-wrapper{
    padding: 5px 10px;
    font-size: 11pt;
    line-height: 22px;
}
.original-address-wrapper{
   background: #f0f0f0;
    border-bottom: solid 1px #ccc;

}
#pagination{
    text-align: center;
    margin-top: 10px;
}
#pagination a,
#pagination strong{
    display: inline-block;
    padding: 2px 6px;
    margin-right: 8px;
    border: solid 1px #0d54e3;
	text-decoration: none !important;
    border-radius:3px;
}
#pagination strong{
	color:#fff; background: #0d54e3;
	font-weight: normal;
}
.total-number-clients{
    height: 18px;
    padding: 3px;
    line-height: 13px;
    font-size: 12px;
    background: #fff;
    color: #000;
    border-radius:3px;
    display: inline-block;
    text-align: center;
    font-weight: normal;
}
.button-links-box{
    clear: both;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}
.delete-bookmark-button{

    border: 1px solid #ccc;
    padding: 5px 20px;
    background: #eee;
}
.counter-box{

}
.sort-box .input-filter{
    margin-bottom: 0;
}
.filter-box input.input-filter[name="client_phone"],
.filter-box select[name="client_status"],
.filter-box select[name="client_type"],
.sort-box .input-filter,
.filter-box input[name="q"],
.sort-box input[name="from_price"],
.sort-box input[name="to_price"] {

}
select#phongthuy,
select#iscarway,
select#sort-mode,
.sort-box input[name="from_price"],
.sort-box input[name="to_price"]
{

}


.view-mode-ghi-chu.disabled{
    display: none;
}
.view-mode-ghi-chu.enabled{
    display: block;
}


.head-title-address-list{
    position: relative;
}
.so-do-icon{

}

.utility-text-wrapper{
	padding: 10px;
}
.utility-text-wrapper h3{
	    text-transform: uppercase;
    border-bottom: dashed 1px #000;
}


.edit-product-description-link,
.copy-product-link,
.bookmark-product-link{
    margin-left: 15px;
}
.copy-product-link:active,
.copy-product-link:focus,
.copy-product-link:hover{
    background-color: #c2bcbc;
}

.total-beds-icon,
.bed_per_floor,
.so-do-icon,
.direction-icon,
.road_of_front,
.car_destination,
.quy-hoach-icon{
    margin-right: 5px;
    display: inline-block;
}
.date-display{
	font-size: 13px;
	text-transform: capitalize;
	font-weight:normal;
	color:cyan;
}

.ghi-chu,
.note{
	line-height: 22px;
}

.is-cert-0,
.is-cert-1{
	margin-left:10px;
	padding:3px;
	border-radius: 3px;
}
a.is-cert-1,
a.is-cert-1:visited,
a.is-cert-1:active,
a.is-cert-1:hover{
	background:green;
	color:#fff;
	text-decoration: none;
}
a.is-cert-0,
a.is-cert-0:visited,
a.is-cert-0:active,
a.is-cert-0:hover{
	background:#ccc;
	color:#888;
	text-decoration: none;
}

.is-cert-image-1 img{
	border: dashed 2px green;
}
div#upload-form-container{
	line-height: 22px;
}
.refresh-client-link{

}
.date-box{
	padding-top:10px;
}
.create-date-client{
	color:#888;
	white-space: nowrap;
    font-style: italic;
}
a.call-dc,
a.call-dc:hover,
a.call-dc:active{
	font-size:13px;
	color: #666;
	text-decoration: none;
}

.address-input-icon,
.ward-input-icon,
.property-input-icon,
.book-input-icon,
.area-input-icon,
.bed-input-icon,
.bed-per-floor-input-icon,
.direction-input-icon,
.carway-input-icon,
.status-input-icon,
.car-destination-input-icon,
.road-input-icon,
.qh-input-icon,
.bath-input-icon{
    position: relative;
}

#edit-form-page .text-input-line .text-input,
#edit-form-page .text-input-line .text-selectbox,
#add-form-page .text-input-line .text-input,
#add-form-page .text-input-line .text-selectbox{
    text-indent: 18px;
}
#edit-form-page .text-input,
#add-form-page .text-input{
    height: 29px;
}
.highlight-price{
	color:red;
}

.zalo-dc{
	margin-left: 12px;
	vertical-align: middle;
}
.thong-tin-chuc-nang{
	margin-top: 5px;
}


.show-more-client-details-box{
    border: dashed 1px #666;
    background: #fff;
    display: none;
    border-radius: 3px;
    margin-top: 10px;
    color:#666;
    font-style: italic;
}
.show-more-client-details-box.enabled{
    display: block;
}
.show-more-client-details-box .viewed-bds-box{
    border-top: dashed 1px #666;
}
.show-more-client-details-box .cccd-box,
.show-more-client-details-box .viewed-bds-box{
    padding-left: 5px;
    padding-right: 5px;
}
.more-details-client-link{
    margin-left: 20px;
}
.list-photos li{
    width: 30%;
    margin-right: 2%;
    float: left;
    margin-bottom: 2%;
}
.list-photos:after{
    clear: both;
    display: block;
    content: '.';
    visibility: hidden;
    height: 0;
    overflow: hidden;
}

.list-photos li:nth-child(3n){
    margin-right: 0;
}
.list-photos li:nth-child(3n+1){
    clear: left;
}

.list-photos li.product-image img{
    max-width: 100%;
    width: 100%;
    object-fit: contain;
}
.ghi-chu img{

}

/*** theme color ****/
body,
.dien-tich-row,
.gia-row{

}
.head-content,
.filter-box,
table.table-list thead tr{
    background: #032261;
}
table.table-list thead th, table.table-list thead td{
    border-bottom: solid 1px #032261;
}
table.table-list{
    border: solid 1px #032261;
}
.dien-tich-row, .gia-row{
    border-left: solid 1px #032261;
    border-right: solid 1px #032261;
    border-bottom: solid 1px #032261;
}
.dien-tich-row{
    border-bottom-left-radius: 3px;
}
.gia-row{
    border-bottom-right-radius: 3px;
}
table.table-list tbody td{
    border-color: #032261;
   
}

.button{
    background: #032261;
    border:solid 1px #032261;
    border-radius: 10px;
}
.add-photo-link.is-cert-image-1:before{
    color: red;
}
.is-cert-image-1 img{
    border: solid 2px red;
}
a.is-cert-1, a.is-cert-1:visited, a.is-cert-1:active, a.is-cert-1:hover{
    background: red;
}

.client-avatar{
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
    border-radius: 100%;
}
.client-avatar img{
    border-radius: 100%;
}

.add-avatar-link{
    margin-left: 10px;
}
.page-container{

    margin: 0 auto;

}
.head-content{
    left: 0;
    position: fixed;
    width: 100%;
    top:0;
}
ul.main-nav{
    display: inline-block;
    margin: 0;
    padding: 0;
    float: right;
}
ul.main-nav li{
    display: inline;
}
.head-content:after{
    clear: both;
    content: ".";
    visibility: hidden;
    height: 0;
    overflow: hidden;
}
.add-product-link,
.nav-property-list-icon,
.nav-client-list-icon,
.nav-utility-link,
.nav-logout-icon{
    position: relative;
    font-size: 0;
    margin-right: 25px;
}
.nav-logout-icon{
    margin-right: 5px;
}
.add-product-link{
    margin-right: 0;
    margin-left: 5px;
    float: left;
}
.
.client-info-box .buttom-client-action,
.client-info-box .note{
    background: #fff;
    padding-left: 5px;
    padding-right: 5px;
}
.client-contact-methods{
    font-size: 10pt;
    font-weight: normal;
}
.client-info-box .note{
    margin-top: 0;
}
.client-info-box .buttom-client-action{
    position: relative;
}
.client-info-box .more-details-client-link{
    position: absolute;
    right: 10px;
    bottom: 1px;
}
.edit-product-description-link,
.bookmark-product-link{
    display: none;
}
.filter-box input[name="q"],
#property_id.input-filter,
#status.input-filter,
#ward.input-filter{
    width: calc((100% - 15px) / 4);
    border: solid 1px #ccc;
}
select#phongthuy,
select#iscarway,
select#sort-mode,
.sort-box input[name="from_price"],
.sort-box input[name="to_price"]{
    width: calc((100% - 15px) / 4);
    border: solid 1px #ccc;
}
.sort-box{padding: 5px 5px;}

.item-line{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}
.text-input-line{
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    width: 100%;
}
.text-input-line label{
    position: absolute;
    left: 4px;
    top: 18px;
    transform: translateY(-50%);
    z-index: 5;
    margin-bottom: 0;
    pointer-events: none;
    display: flex;
    align-items: center;
    color: #555;
}
.text-input-line label svg{
    width: 18px;
    height: 18px;
}
.required svg{
    color: red;
}
.btn{
    padding: 12px 20px;
    border: none;
    font-weight: 600;
    border-radius: var(--radius);
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
    font-size: 15px;
}
.submit-btn{
    background-color: #032261;
    color: #fff;
    border: solid 1px #032261;
    flex: 2;
}
.back-btn{
    flex: 1;
    border: solid 1px var(--border-color);
}
.delete-btn{
    background-color: red;
    color: #fff;
    border: solid 1px red;;
}
#cboxClose{
    border: solid 1px var(--border-color) !important;
    border-radius: var(--radius);
}
.status-2,
.status-1,
.status-3{
    width: 12px;
    height: 12px;
    display: inline-flex;
}
.status-2{
    color: red;
}
.status-1{
    color: green;
}
.status-3{
    color: #e9c71e;
}
.product-attributes svg,
.add-photo-link svg,
.add-photo-link svg{
    width: 16px;
    height: 16px;
    display: inline-flex;
    stroke-width: 2;
}
.product-attributes{
    display: flex;
    gap: 12px;
}
#pagination .pagination {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 5px;
    justify-content:center;
}
#pagination .pagination li{
    list-style: none;
}
#pagination .pagination li.active a{
    background-color: #032261;
    border-color: #032261;
    color: #fff !important;
    font-weight: bold;
    cursor: default;
    pointer-events: none;
    box-shadow: 0 2px 4px rgb(0 123 255 / 30%);
}
#pagination .pagination li a{
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 5px;
    text-decoration: none;
    color: #333;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    transition: all 0.2s ease-in-out;
    background-color: #ccc;
}
.head-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.product-list-header {
    margin: 0;
    font-size: 20px;
    color: #333333;
    flex: 1;
}
.head-content svg{
    height: 18px;
    width: 18px;
    stroke-width: 3px;
}
.main-nav {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 15px;
}

.main-nav li {
    display: inline-flex;
    align-items: center;
}

.add-product-link,
.nav-property-list-icon,
.nav-client-list-icon,
.nav-utility-link,
.nav-logout-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    transition: color 0.2s ease;
    text-decoration: none;
}