/*--Import GLOBAL CSS--*/
@import url('global.css');

body{font-family:var(--font-family); font-size:var(--body-font-size);
    width: 100%;
    background-color: #EEEEEE}

.wrapper{
    
    height:100dvh; 
    height: calc(var(--vh, 1vh) * 100);    
    display:flex; 
    flex-direction:column; 
    flex-grow:1; 
    overflow:hidden; 
    position:relative;

    max-width: 900px;
    text-align: left;
    margin: 0px auto;
    background-color: #ffffff;
}
main{
    flex:1 0 0%; overflow-y:auto; -ms-overflow-style:none; scrollbar-width:none; 
    padding:1rem 1.5rem;
    overflow-x:hidden;
}
main::-webkit-scrollbar{display:none;}
main .section:not(:last-child){margin-bottom:2rem;}

header{padding:1.5rem; background:url(/static/app/images/body-bg.png) right top no-repeat; background-size:auto 100%;}
header > *:not(:last-child){margin-bottom:1.5rem;}
.logo img{max-width:5rem;}
.header-icon-group{display:inline-flex; align-items:center;}
.header-icon-group > *:not(:last-child){margin-right:2rem;}
.header-icon-group > * > img{max-width:2.6rem;}
.search{height:5rem; background-color:hsl(var(--white)); box-shadow:.4rem .3rem .8rem hsla(var(--black), 40%); display:flex;}
.search input{width:calc(100% - 5rem); font-weight:var(--fw-semibold); border:0; padding:1rem;}
.search input::placeholder{opacity:1; color:hsl(0, 2%, 69%); font-weight:var(--fw-semibold);}
.search input:focus::placeholder{opacity:0; color:transparent;}
.search button{width:5rem; background:url(/static/app/images/magnifier-icon.png) center center no-repeat; background-size:40% auto; position:relative;}
.search button::before{position:absolute; left:0; top:50%; transform:translateY(-50%); width:.2rem; height:calc(100% - 2rem); background-color:hsl(0, 2%, 69%); content:"";}
.header-links:not(:first-child){margin-top:1.5rem;}
.header-links{display:flex; align-items:center; justify-content:flex-end; margin:0 -1rem;}
.header-links a{font-weight:var(--fw-semibold); font-size:1.2rem; padding:0 1rem; display:flex; align-items:center; color:hsl(0, 0%, 22%);}
.header-links a img{max-width:1.3rem; margin-right:.5rem;}

footer{background-color:hsl(var(--yellow)); padding:.5rem 1.5rem;}
footer nav{display:flex; align-items:center; justify-content:space-between;}
footer a{font-size:.9rem; font-weight:var(--fw-semibold); flex:1 0 0%; display:flex; flex-direction:column; align-items:center; justify-content:center; color:hsl(0, 0%, 22%);}
footer a span{width:4rem; height:4rem; border-radius:100%; background-color:hsl(var(--white)); margin-bottom:.5rem; display:grid; place-items:center;}
footer a span img{max-width:60%;}
footer a.logo span{padding:.5rem; background-color:hsl(var(--white)); width:auto; height:auto;}
footer a.logo img{max-width:5rem;}
footer.footer{background-color:hsl(var(--white)); box-shadow:0 -.2rem .5rem hsla(var(--black), 10%); }
footer.footer span{border-radius:0; background:none;}

.banner{position:relative; overflow:hidden; border-radius:2rem; height:8rem; box-shadow:.4rem .3rem .8rem hsla(var(--black), 40%);}
.banner img{object-fit:cover; width:100%; height:100%;}
.banner-text{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); font-size:1.8rem; color:hsl(0, 0%, 22%); font-weight:var(--fw-semibold); background-color:hsl(var(--white)); padding:0 1rem; border-radius:2rem; box-shadow:.4rem .3rem .8rem hsla(var(--black), 40%); white-space:nowrap;}
main .banner:not(:last-child){margin-bottom:2rem;}

.section .section-header:not(:last-child){margin-bottom:2rem;}
.border-headding{display:flex; align-items:center; justify-content:center; font-weight:var(--fw-semibold); font-size:1.2rem; color:hsl(0, 0%, 22%); position:relative; isolation:isolate;}
.border-headding span{background-color:hsl(var(--green)); padding:0 1rem; border-radius:1rem;}
.border-headding::after{position:absolute; left:50%; top:50%; transform:translateX(-50%); width:150vw; height:.1rem; background-color:#BDBDBD; content:""; z-index:-1;}

.items{display:flex; flex-wrap:wrap; justify-content:center; gap:1rem 2.5rem;}
.item{display:flex; flex-direction:column; align-items:center;}
.item-icon{width:6.4rem; height:6.4rem; border-radius:100%; background-color:hsl(var(--white)); border-width:.3rem; border-style:solid; box-shadow:0 .4rem .1rem hsla(var(--black), 20%); display:grid; place-items:center;}
.item p{font-size:1.1rem; font-weight:var(--fw-semibold); color:hsl(0, 0%, 22%); text-align:center;}
.item-icon:not(:last-child){margin-bottom:.5rem;}
.items.services .item:nth-child(odd) .item-icon{border-color:hsl(var(--green));}
.items.services .item:nth-child(even) .item-icon{border-color:hsl(var(--yellow));}
.item img{max-width:70%; max-height:70%;}

.swiper-notification{display:none;}
.banner-slider-wrapper{position:relative;}
.banner-slide{height:12vh; position:relative; overflow:hidden; border-radius:2rem;}
.banner-slide img{ height:100%;}
/* .banner-slide img{object-fit:cover; width:100%; height:100%;} */

.banner-slide p{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); font-size:1.2rem; color:hsl(0, 0%, 22%); font-weight:var(--fw-semibold); background-color:hsl(var(--white)); padding:0 1rem; border-radius:2rem;}
.swiper-pagination{display:flex; align-items:center; justify-content:center; margin-top:1rem; position:static;}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0;}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet:not(:last-child), .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:not(:last-child){margin-right:.5rem;}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{width:.8rem; height:.8rem; opacity:1; background-color:hsl(0, 10%, 90%);}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:hsl(0, 0%, 56%);}

.box-items{display:grid; grid-template-columns:repeat(3, 1fr); gap:1.5rem;}
.box-item{background-color:hsl(var(--white)); border-radius:2rem; box-shadow:0 0 1rem hsla(var(--black), 20%); height:13rem; padding:1rem 1.5rem; display:flex; flex-direction:column; align-items:center; justify-content:center;}
.box-item img{max-height:7rem;}
.box-item p{font-weight:var(--fw-semibold); font-size:1.2rem; color:hsl(0, 0%, 22%);}
.box-item p:not(:first-child){margin-top:.8rem;}
.box-item p{padding-top:.3rem; border-top:.1rem solid hsl(var(--yellow)); width:100%; text-align:center;}
.image-box-items{display:grid; grid-template-columns:repeat(3, 1fr); gap:1.5rem;}
.image-box-item{background-color:hsl(var(--white)); border-radius:2rem; box-shadow:0 0 1rem hsla(var(--black), 20%); height:10rem; padding:1rem 1.5rem; display:flex; flex-direction:column; align-items:center; justify-content:center;}
.image-box-item img{max-height:7rem;}

.modal-headding{text-align:center;}
.modal-headding h6{font-size:1.8rem; font-weight:var(--fw-semibold);}
.modal-headding h6:not(:last-child){margin-bottom:.5rem;}
.modal-headding h6 + p{font-size:1rem;}
.modal .modal-headding:not(:last-child){margin-bottom:2rem;}
.forms li:not(:last-child){margin-bottom:1rem;}
.forms li p{font-size:1.2rem; font-weight:var(--fw-semibold); color:hsl(0, 0%, 22%);}
.forms li p:not(:last-child){margin-bottom:.3rem;}
.form-control{font-size:1.4rem; width:100%; height:4rem; padding:0 1rem; border:.1rem solid hsl(0, 0%, 41%);}
.form-field{width:100%; height:4rem; padding:0 1rem; font-size:1.2rem; border:.1rem solid hsl(0, 0%, 41%);}

article .row{margin:-1rem;}
article .row > *{padding:1rem;}
article h6{font-size:1.6rem; font-weight:var(--fw-semibold);}
article h6:not(:last-child){margin-bottom:1rem;}
article p{font-size:1.2rem; font-weight:var(--fw-semibold);}
article figure img{border-radius:3rem;}
article h6.bordered{position:relative; padding-bottom:1rem;}
article h6.bordered::after{position:absolute; left:0; bottom:0; transform:translateX(-25%); width:100%; height:.1rem; background-color:hsl(var(--green)); content:"";}
article h6.bordered.full::after{width:150vw; left:50%; transform:translateX(-50%);}

.page-banner:not(:last-child){margin-bottom:2rem;}
.page-banner{border-radius:2rem; overflow:hidden; height:12rem;}
.page-banner img{object-fit:cover; width:100%; height:100%;}

.icon-links:not(:last-child){margin-bottom:2rem;}
.icon-links{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:-.5rem -.8rem;}
.icon-links > *{position:relative;}
.icon-links > *:not(:last-child)::after{position:absolute; right:0; top:50%; width:.1rem; height:1.5rem; background-color:hsl(var(--yellow)); transform:translateY(-50%); content:"";}
.icon-link{font-size:1.2rem; font-weight:var(--fw-semibold); color:hsl(0, 0%, 22%); padding:.5rem .8rem; line-height:1; white-space:nowrap;}
.icon-link img{max-height:1.5rem; margin-right:.3rem;}

.product-boxes{display:grid; grid-template-columns:repeat(2, 1fr); gap:1.5rem;}
.product-box{background-color:hsl(var(--white)); border-radius:2rem; box-shadow:0 0 1rem hsla(var(--black), 20%); height:13rem; padding:1rem 1.5rem; display:flex; flex-direction:column; justify-content:center;}
.product-box figure{flex-grow:1;}
.product-box figure img{margin:0 auto; max-height:8rem;}
.product-box p{font-size:1.2rem; font-weight:var(--fw-semibold); color:hsl(0, 0%, 22%); padding-top:.5rem; position:relative;}
.product-box p::before{position:absolute; left:0; top:0; width:50%; height:.1rem; background-color:hsl(var(--yellow)); content:"";}

.section-content-block:not(:last-child){margin-bottom:3rem;}
.headding{display:flex;}
.headding p{font-weight:var(--fw-semibold); font-size:1.1rem; color:hsl(0, 0%, 22%); position:relative; background-color:hsl(var(--green)); padding:0 1rem 0 0; border-radius:0 1rem 1rem 0; min-width:8rem; text-align:center;}
.headding p::before{position:absolute; right:100%; top:0; width:100vw; height:100%; background-color:inherit; content:"";}
.section-content-block .headding:not(:last-child){margin-bottom:1rem;}
.product-slide{display:flex; flex-direction:column; align-items:center; justify-content:center;}
.product-slide figure{width:8rem; border-radius:2rem; overflow:hidden; box-shadow:0 0 1rem hsla(var(--black), 30%);}
.product-slide figure img{width:100%;}
.product-slide figure:not(:last-child){margin-bottom:1rem;}
.product-slide p{text-align:center; font-size:1rem; font-weight:var(--fw-medium); color:hsl(0, 0%, 22%);}
.product-slider .swiper-slide{width:auto;}
.product-slider-wrap{position:relative;}
.product-slide{width:11rem;}

.farm-list > li{padding:1.5rem 0; position:relative;}
.farm-list > li:not(:last-child)::after{position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:150vw; height:.1rem; content:"";}
.bullet-list li{font-size:1.2rem; font-weight:var(--fw-medium); position:relative; padding-left:1rem;}
.bullet-list li span{ font-size:1.2rem; font-weight:var(--fw-bold);color:hsl(var(--yellow)); position:relative; padding-left:1rem;}
.bullet-list li:not(:last-child){margin-bottom:.5rem;}
.bullet-list li::before{position:absolute; left:0; top:.8rem; width:.5rem; height:.5rem; border-radius:100%; background-color:hsl(0, 0%, 22%); content:"";}

.farm-list figure{width:8rem; border-radius:2rem; overflow:hidden; box-shadow:0 0 1rem hsla(var(--black), 30%);}
.farm-list .label{margin-left:.5rem;}

.swiper-pagination.absolute{margin-top:0; position:absolute;}

.floating-link{width:4rem; height:4rem; border-radius:100%; background-color:hsl(var(--green)); position:fixed; right:1.5rem; bottom:9rem; box-shadow:0 0 .5rem hsla(var(--black), 30%); display:grid; place-items:center;}
.floating-link img{max-width:80%; max-height:80%;}

.advisors{display:grid; grid-template-columns:repeat(2, 1fr); gap:3rem 2.5rem;}
.advisor figure{box-shadow:0 0 1rem hsla(var(--black), 30%); border-radius:2rem; overflow:hidden;}
.advisor figure img{object-fit:cover; width:100%; height:100%;}
.advisor figure:not(:last-child){margin-bottom:1rem;}
.advisor-content{padding:0 1rem;}
.advisor-content h5{font-size:1.4rem; font-weight:var(--fw-semibold); color:hsl(0, 0%, 22%);}
.advisor-content h6{font-size:1.2rem; font-weight:var(--fw-semibold); color:hsl(0, 0%, 22%);}
.advisor-content p{font-size:1rem; color:hsl(0, 0%, 22%); font-weight:var(--fw-semibold);}
.advisor-content h6:not(:last-child){margin-bottom:.5rem;}

.register-header:not(:last-child){margin-bottom:2rem;}
.register-header{display:flex; flex-direction:column; align-items:center; justify-content:center;
    background: url(/static/app/images/body-bg.png) right top no-repeat;
    background-size: auto 100%;
}
.register-header .logo:not(:last-child){margin-bottom:2rem;}
.register-header .logo img{
    max-width:10rem;
}
.register-header h6{font-weight:var(--fw-medium); color:hsl(var(--black)); font-size:2rem; padding:.2rem 1rem; font-weight:var(--fw-semibold);}
.register-content .form-field{border:0; box-shadow:0 0 .5rem hsla(var(--black), 30%);}
.register-content .form-field::placeholder{text-align:center; font-size:1rem; font-weight:var(--fw-semibold); opacity:.3;}
.register-content .form-field:focus::placeholder{opacity:0;}
.register-content select.form-field{border-radius:0; background:url(/static/app/images/caret-down.png) calc(100% - 1rem) center no-repeat hsl(var(--white)); color:hsl(var(--black)); background-size:1rem auto; padding-right:3rem;}

.login-header {
    padding: 1.5rem;
    background: url(/static/app/images/body-bg.png) right top no-repeat;
    background-size: auto 100%;
}

.btn-block{width: 100%;}


.icon-circle {
    width: 48px;
    aspect-ratio: 1;
    border-radius: 100%;
    display: grid;
    place-items: center;    
}

#homeload { width: 100%; 
    height: 100%; 
    position: fixed; left:0%; top: 0%; text-align: center; 
    z-index: 9999; 
    background: url("/static/app/images/loading.svg") no-repeat center center rgba(0, 0, 0, 0.25) 
}

.mb-5p{margin-bottom: 5px;}
.mb-10{margin-bottom: 10px;}
.mb-20{margin-bottom: 20px;}
.mb-30{margin-bottom: 30px;}
.mb-40{margin-bottom: 40px;}
.mb-50{margin-bottom: 50px;}
.mb-1000{margin-bottom: 100px;}

.mt-5p{margin-top: 5px;}
.mt-10{margin-top: 10px;}
.mt-20{margin-top: 20px;}
.mt-30{margin-top: 30px;}
.mt-40{margin-top: 40px;}
.mt-50{margin-top: 50px;}
.mt-1000{margin-top: 100px;}

.mr-5{margin-right: 5px;}
.mr-10{margin-right: 10px;}
.mr-20{margin-right: 20px;}
.mr-30{margin-right: 30px;}
.mr-40{margin-right: 40px;}
.mr-50{margin-right: 50px;}
.mr-1000{margin-right: 100px;}


.profilelabel{
    color:black;
    background-color: #ffe0af;
    font-size: 10pt;
    margin-right: 10px;
    width:130px;
    text-align: left;
    padding-left: 10px;

}

.modal-title{
    font-size: 14pt;
    font-weight: 600;
    margin-left: 20px;
}

.form-label{
    color:grey;
}

.w-20{width: 20px;}

.parsley-required{
    color:red;
    font-size:8pt;
}

.body-bg{    
    background: url(/static/app/images/body-bg1.png) right top no-repeat;
    background-color: #ffffff;
}

.ht3{
    height: 2.7rem;
}


.crop-list figure{width:100%; border-radius:1rem; overflow:hidden; box-shadow:0 0 1rem hsla(var(--black), 30%);}
.crop-list .label{margin-left:.5rem;}

.leveler-slider{overflow-x: hidden;}

/* livestock ui NEW */

   .livestock-btn-div button {
    background-color: #d1cdcd; 
    color: #fff;
    padding: 8px;
    
}

.livestock-btn-div button:hover {
    background-color: #A5CC40; 
}

.showDisease-btn-div a {
    background-color: #d1cdcd; 
    color: #fff;
    padding: 8px;
    
}

.showDisease-btn-div button {
    background-color: #A5CC40; 
    color: #fff;
    padding: 8px;
    
}

.showDisease-btn-div a:hover {
    background-color: #A5CC40; 
}

.livestock-custom-checkbox-row {
    display: flex;
    align-items: baseline;
    margin-bottom: 10px; /* Add space between rows */
}

.livestock-custom-checkbox-row .custom-control-label {
    flex-grow: 1; /* Allow the label to expand and take up available space */
    margin-left: 10px; /* Add space between checkbox and label */
}

.livestock-custom-checkbox-row input[type="checkbox"]{
    accent-color: #a5cc40;
   
.livestock-custom-checkbox-row input[type="checkbox"]:checked {
    background-color: #a5cc40;
}

}
@media screen and (max-width: 365px) {
    .livestock-custom-checkbox-row .custom-control-label {
        font-size: 14px; /* Adjust label font size for smaller screens */
    }
}

.custom-swal{
    border-radius: 2rem;
}







.listing-header{display: flex; align-items: center; justify-content: space-between;}
.listing-header:not(:last-child){margin-bottom: 3rem;}
.listing-header p{font-weight: var(--fw-medium);}
.list-dropdown{display: inline-flex; position: relative;}
.list-dropdown span{height: 2rem; display: flex; align-items: center; justify-content: space-between; gap:.5rem; font-size: 1rem; font-weight: var(--fw-medium); background-color: hsl(var(--green)); padding: .2rem 1rem; border-radius: 2rem;}
.list-dropdown ul{position: absolute; right: 0; top: 100%; min-width: 100%; background-color: hsl(0, 0%, 95%); box-shadow:0 .4rem .4rem hsla(var(--black), 25%); padding: .5rem; display: none;}
.list-dropdown ul.active{display: block;}
.list-dropdown ul li:not(:last-child){margin-bottom: 1rem;}
.list-checkbox input[type="radio"]{display: none;}
.list-checkbox label{font-size: 1rem; display: block; line-height: 1; padding-left: 1.4rem; position: relative;}
.list-checkbox label::before{width: 1rem; height: 1rem; border: .1rem solid hsl(var(--black)); content: ""; position: absolute; left: 0; top: 50%; transform:translateY(-50%); background-color: hsl(0, 0%, 85%);}
.list-checkbox input[type="radio"]:checked ~ label::before{background-color: hsl(var(--green));}
.my-list li:not(:last-child){margin-bottom: 2rem;}
.my-list li p{font-size: 1rem; font-weight: var(--fw-medium);}
.my-list li{display: flex; gap:2rem; align-items: center;}
.my-list-image figure{background-color: hsl(var(--white)); border-radius: 1.8rem; padding: .5rem; box-shadow: .4rem -.1rem .8rem hsla(var(--black), 25%); width: 10rem;}
.my-list-image figure:not(:last-child){margin-bottom: .5rem;}
.my-list-row:not(:last-child){margin-bottom: .5rem;}
.my-list-row{display: flex; gap:1rem; align-items: center; justify-content: space-between;}
.my-list-content{flex:1 0 0%;}
.my-list-content p a{color: hsl(var(--black)); text-decoration: underline;}
.my-list-content p a:hover{text-decoration: none;}
.my-list-buttons{display: flex; align-items: center; gap:.5rem;}
.my-list-buttons .list-dropdown span{width: 100%;}
.my-list-label{font-size: 1rem; height: 2rem; border-radius: 2rem; display: inline-flex; align-items: center; justify-content: center; padding: 0 1rem;}
.my-list-label.in-stock{background-color: hsl(var(--yellow));}