/*
 Theme Name:     Fans-Of-Pets 
 Theme URI:      https://www.detype.com
 Description:    Custom theme
 Author:         DeType
 Author URI:     https://www.detype.com
 Template:       Divi
 Version:        1.0.0
*/






/* =Theme customization starts here
------------------------------------------------------- */

.acf-field input[type=text], .acf-field input[type=password], .acf-field input[type=date], .acf-field input[type=datetime], .acf-field input[type=datetime-local], .acf-field input[type=email], .acf-field input[type=month], .acf-field input[type=number], .acf-field input[type=search], .acf-field input[type=tel], .acf-field input[type=time], .acf-field input[type=url], .acf-field input[type=week], .acf-field textarea, .acf-field select {
    padding: 10px 8px;
    font-size: 16px !important;
    border-radius: 15px !important;
    border: 1px solid #cfcfcf !important;
}
.acf-fields.-border {
    border: #ccd0d4 solid 1px;
    background: #fff;
    border-radius: 15px;
}
.acf-fields>.acf-field{
	border: 0px !important;
}
.acf-google-map {
    border-radius: 17px;
    overflow: hidden;
}
.acf-field .acf-label {
    margin: 0 0 3px !important;
}




@media only screen and (max-width : 781px) {
.wp-grid-builder .wpgb-main{
  padding: 5% !important;
}
 
 .wpgb-facet.wpgb-facet-27, .wpgb-facet.wpgb-facet-22 {
    flex-basis: 50% !important;
}}

nav.footerfixednav{
  display: flex;
  justify-content: space-around;
  background-color: #de582c;
  padding: 0px ;
  position: fixed;
  bottom: 0;
  width: 100%;
  box-shadow: 0 0 15px #00000030;
}

r.footerfixednav .nav-item{
  display: flex;
  align-items: center;
  text-decoration: none;
  color: white;
  padding: 12px 16px;
  border-radius: 0;
  background-color: rgba(255, 255, 255, 0);
}

r.footerfixednav .nav-item span{
  width: 0;
  overflow: hidden;
}

.footerfixednav .nav-item:focus{
  text-decoration: none;
  color: black;
  background-color: rgba(255, 255, 255, 0.2);
  transition: .2s;
}

r.footerfixednav .nav-item:focus span{
  width: 100%;
  margin-left: 8px;
  transition: .2s;
}

r.footerfixednav *:focus{
  outline: none;
  border: none;
}

.footerfixednav .nav-item img{
    width: 30px;
    height: 30px;
    filter: brightness(100);
}

.footerfixednav .nav-item span {
    width: auto;
    overflow: visible;
    color: white;
    display: block;
    font-size: 12px;
    line-height: 23px;
    text-align: center;
}
.footerfixednav .nav-item {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: white;
    padding: 12px 5px;
    border-radius: 50px;
    background-color: rgba(255, 255, 255, 0);
    flex-direction: column;
}

    /* style the get started cta button */
        @media only screen and (min-width : 981px) {
            .get-started {
                border-radius: 0px;}
            .get-started a {
                color: #fff!important;}
                .et-fixed-header #top-menu .get-started a{
                	                color: #fff!important;

                }
            li.get-started {
                background-color:#df592c; 
                text-align: center; 
                padding: 13px 20px 16px 20px!important;
                border-radius: 100px;
                -moz-transition: all 0.5s; 
                -webkit-transition: all 0.5s;
                transition: all 0.5s;
                margin-right: 20px;
                height: 41px;}
            li.get-started:hover {
                background-color:#e8a63a;}
            .get-started a:hover {
                opacity: 1!important;}}
 
    /*make sure get started CTA text is white even when menu is fixed */
        @media only screen and (min-width : 981px) {
            .et-fixed-header #top-menu li.current-menu-ancestor>a#mp_get_started, 
            .et-fixed-header #top-menu li.current-menu-item>a#mp_get_started,
            .et-fixed-header #top-menu li.current_page_item>a#mp_get_started,
            .et-fixed-header #top-menu a#mp_get_started {
                color: white!important;}}



.pets-listing-home{
    padding-left: 0px !important;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}


@media only screen and (max-width : 590px) {
.pets-listing-home li{
    width: 46% !important;
    list-style: none;   
    display: inline-block;
}
.pets-listing-home .lineheightlight{
    display: none;
}
.pets-listing-home li p {
    font-weight: 400;
    font-size: 12px;
    line-height: 120%;
    color: #9e9c9c;
    margin: 5px 0px 20px;
}
.pets-listing-home li p span{
    display: block;
}
.pets-listing-home li a.simplefavorite-button, .wpgb-block-4 a.simplefavorite-button {
    margin-bottom: -25px !important;
    right: 10px !important;
    top: 15px !important;
}
.pets-listing-home li a.simplefavorite-button .et-pb-icon,.wpgb-block-4 a.simplefavorite-button .et-pb-icon {
    font-size: 17px !important;
}
}



@media only screen and (min-width : 591px) {
.pets-listing-home li{
    list-style: none;   
    display: inline-block;
    width: 22% ;
}
}


.pets-listing-home li img{
    width: 100%;
    border-radius: 15px;
}
.pets-listing-home li a{
    font-size: 20px;
    line-height: 30px;
    color: black;
}
.pets-listing-home li p{
    font-weight: 400;
    font-size: 14px;
}

.pets-listing-home li a.simplefavorite-button, .wpgb-block-4 a.simplefavorite-button {
    font-size: 0px !important;
    float: right !important;
    margin-bottom: -37px !important;
    display: inline-block !important;
    right: 13px !important !important;
    top: 15px !important;
    position: relative !important;
    color: white !important;
    opacity: 1 !important;
}



.wpgb-block-4 a.simplefavorite-button .et-pb-icon {
    font-family: ETmodules !important;
    speak: none;
    font-weight: 400;
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    font-size: 96px;
    font-style: normal;
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    direction: ltr;
}
.pets-listing-home li a.simplefavorite-button .et-pb-icon,.wpgb-block-4 a.simplefavorite-button .et-pb-icon{
    cursor: pointer !important;
    background-color: #fff !important;



    font-size: 24px !important;
    padding: 4px !important;
    border-radius: 5px;
    margin-top: -4px;
    margin-right: 10px;
    margin-left: 10px;
    color: #e8a63a;
}

.wp-grid-builder .wpgb-card [class*="wpgb-block-"] svg{
    color: #e8a63a;
}



.bannersection .et_pb_blurb{
    display: inline-block;
    margin-right: 30px;
    margin-bottom: 20px !important;
        transition: all ease-out .3s;
    border: 1px solid white;
}
.et_pb_main_blurb_image{
    margin-bottom: 20px !important;
}
.bannersection .et_pb_blurb:hover{
    box-shadow: 0px 0px 30px #d4d3d3;
    transition: all ease-out .3s;
}





.favorites-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    gap: 4% !important;
}
.favorites-list>div{
    width: 30% !important;
    text-align: left !important;
}

.favlist{
    margin-bottom: 32px;
}
.favlist img{
    min-width: 100%;
    margin: auto;
}
.favlist .fvtbmn{
    max-height: 250px !important;
    display: block;
    object-fit: contain;
    overflow: hidden;
    display: flex !important;
    margin-bottom: 15px;
    border-radius: 15px;
}
.favlist .favorites-list a{
    display: block !important;
    font-size: 20px;
    color: black;
    font-weight: 800;
}
.favlist a.simplefavorite-button{
    padding: 7px 15px;
    background-color: #de582c;
    display: inline-block !important;
    margin-top: 10px;
    border-radius: 100px;
    color: white;
    cursor: pointer;
}

button.simplefavorites-clear{
        padding: 10px 25px;
    background-color: #de582c;
    display: inline-block !important;
    margin-top: 10px;
    border-radius: 100px;
    color: white;
    cursor: pointer;
    border: 0px;
    font-size: 20px;
    font-weight: 500;
}





li.Good.with.Kids:before{
    background-image: url(/wp-content/uploads/kidfriendly.svg);
}
li.Good.with.other.Dogs:before{
    background-image: url(/wp-content/uploads/dog-friendly.svg);
}
li.Friendly.with.Cats:before{
    background-image: url(/wp-content/uploads/cat-friendly.svg);
}

li.Vaccinated:before{
    background-image: url(/wp-content/uploads/Vaccinated.svg);
}
li.Spayed.neutered:before{
    background-image: url(/wp-content/uploads/done-check.svg);
}
li.Microchipped:before{
    background-image: url(/wp-content/uploads/microchipped-icon.svg);
}


li.Friendly.with.Dogs:before{
    background-image: url(/wp-content/uploads/dog-friendly.svg);
}
li.Good.with.other.Cats:before{
    background-image: url(/wp-content/uploads/cat-friendly.svg);
}
li.Litter.trained:before{
    background-image: url(/wp-content/uploads/cat-litter.svg);
}
li.Eats.home.food:before{
    background-image: url(/wp-content/uploads/cat-food.svg);
}
li.Grooming.needed:before{
    background-image: url(/wp-content/uploads/Grooming-needed.svg);
}
li.Disabled.Pet:before{
    background-image: url(/wp-content/uploads/disabled-cat.svg);
}





.sidr{display:block;position:fixed;top:0;height:100%;z-index:999999;width:500px;overflow-x:hidden;overflow-y:auto;background-color: #fff;padding: 20px;max-width: 100% ; box-shadow: 4px 7px 53px #000000;}
.sidr.right{left:auto;right:-260px}
.sidr.left{left:-500px;right:auto}
.sidr form.acf-form {padding: 0;margin: 0 0 10px;}
.media-modal, .media-modal.acf-media-modal {z-index: 999999 !important;}
.sidr .acf-fields > .acf-field {padding-left: 0;padding-right: 0;}












.mobile_nav.opened .mobile_menu_bar:before {
 content: '\4d';
    color: #fff;
    transition: all ease-in-out 300ms;
        z-index: 100;
}
.mobile_nav.closed .mobile_menu_bar:before {
    transition: all ease-in-out 300ms;
}
body.noscroll {
    overflow-y: hidden !important;
}






a.edit-close {
    display: block;
    text-align: center;
    color: red;
    font-size: 14px;
    text-decoration: underline;
}
 input.acf-button.button.button-primary.button-large {
    display: inline-block;
    background-color: #254e3d;
    z-index: 9999;
    padding: 10px 23px;
    border-radius: 100px;
    color: white;
    bottom: 10px;
    border: 0;
    font-size: 20px;
    text-transform: capitalize;
}
.acf-form-submit {
    display: flex;
    justify-content: center;
    margin-top: 10px;
    margin-bottom: 10px;
}





/* Remove the top line in the mobile menu*/
.et_mobile_menu {
border-top:0;
}
/* Center-align moble menu items */
.et_mobile_menu li {
text-align:center !important;
}
  
.et_mobile_menu li li, .et_mobile_menu li ul {
padding-left:0 !important;
}
/* Make mobile menu fullwidth */
.et_mobile_menu {
min-width: 100vw;
margin-left: -5vw;
}

/* Make the mobile menu full height */
.et_mobile_menu {
min-height:100vh !important;
min-height: -webkit-fill-available;
padding-top:50px !important;
}
html {
height: -webkit-fill-available;
}
/* Remove the animation to avoid delay */
.mobile_nav.opened .et_mobile_menu {
display:block !important;
}





.acf-field p.description {
    color: #8d8d8d;
    font-size: 12px;
    line-height: 17px;
    font-weight: 400;
}


.mobtab ul {
    display: flex;
}
.mobtab ul li{
    padding-left: 10px;
    padding-right: 10px;
}
.et_pb_tabs{
    border: 0px !important;
}
ul.et_pb_tabs_controls {
    background-color: #254e3d;
    border: 0px;
}
.et_pb_tabs_controls li{
    border: 0px !important;
}
.et_pb_tabs_controls li a {
    text-decoration: none;
    color: #fff;
    padding: 10px 30px;
}
ul.et_pb_tabs_controls li {
    background-color: #1e3e31;
}
ul.et_pb_tabs_controls li:last-child {
    border-radius: 0 15px 0 0;
}
ul.et_pb_tabs_controls:after{
    border: 0px;
}













/* grid bulder per card styles */


.pet-card {
  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  transition: box-shadow 0.2s ease;
}
.pet-card:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.pet-card__image img {
  width: 100%;
  height: auto;
  display: block;
}
.pet-card__content {
  padding: 1rem;
}
.pet-card__title {
  margin: 0 0 0.5rem;
  font-size: 1.1rem;
  font-weight: bold;
}
.pet-card__meta, .pet-card__breed {
  font-size: 0.9rem;
  color: #555;
}
.wp-grid-builder .wpgb-card .wpgb-card-media-thumbnail div {
    border-radius: 20px;
}
.wpgb-card-media.wpgb-scheme-light {
    min-height: 250px;
}




/* grid bulder landing page changes */

h4.wpgb-facet-title {
    font-size: 13px !important;
    line-height: 14px !important;
    font-weight: 400 !important;
}
.wpgb-facet.wpgb-facet-24 {
    min-width: 50%;
}
.wpgb-facet .wpgb-input, .wpgb-facet select.wpgb-select{
    min-height: 45px !important;
    border: 1px solid #c8c8c8 !important;
    border-radius: 14px;
    background-color: #efefef00;
    padding-left: 16px;
}

/* Style the built-in geolocate control inside the input */
.wpgb-facet [data-action="geolocate"],
.wpgb-facet button[aria-label*="Locate"],
.wpgb-facet button[aria-label*="Current location"] {
  width: 34px;
  height: 34px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
  margin-right: 4px; /* keeps a bit of spacing from input edge */
}

/* Hover / focus states */
.wpgb-facet [data-action="geolocate"]:hover,
.wpgb-facet button[aria-label*="Locate"]:hover,
.wpgb-facet button[aria-label*="Current location"]:hover {
  background: #f5f5f5;
  border-color: #999;
}

/* Keep the icon nicely sized */
.wpgb-facet [data-action="geolocate"] svg,
.wpgb-facet button[aria-label*="Locate"] svg,
.wpgb-facet button[aria-label*="Current location"] svg {
  width: 16px;
  height: 16px;
}


@media only screen and (max-width: 767px) {
    .wp-grid-builder .wpgb-main {
    overflow: hidden;
    padding: 2em;
}
}


/* Ensure card wrapper can hold absolutely-positioned children */
.wpgb-card { position: relative; }

/* Corner ribbon */
.pet-ribbon{
    min-width: 100%;
    text-align: center;
    color: white !important;
    background: #e8a63adb;
  padding:6px 50px;
  font-size:13px; font-weight:700; text-transform:uppercase;
  transform:rotate(-45deg);
  box-shadow:0 2px 6px rgba(0,0,0,.2);
  z-index:9; pointer-events:none;
}
.pet-ribbon span { display:inline-block; }


/* Make adopted cards non-clickable */
r.wpgb-card.has-adopted,
r.wpgb-card.has-adopted .wpgb-link {
  pointer-events: none !important;
  cursor: not-allowed !important;
  opacity: .85;
}






.wpgb-card-media-content-center {
    display: flex !important
;
    flex-direction: row;
    justify-content: center;
}
/* Make the Simple Favorites button show only a Divi heart icon */
span.simplefavorite-button{
    font-family: "ETmodules" !important;
    color: #ffffff !important;
      text-shadow: 0 2px 4px rgba(0,0,0,0.3);
      font-size: 22px !important;
      cursor: pointer;
    margin-right: 15px;
    float: right;

}
.type-pets span.simplefavorite-button{
      margin-top: 18px !important;
      text-align: right;

}

span.simplefavorite-button.active{
    color: #df592c !important;
    opacity: 1 !important;
}
.wpgb-block-4 {
    text-align: right;
    padding-right: 15px !important;
    padding-top: 10px !important;
}
.wpgb-card:hover .viewbtnpetcard{
    opacity: 1 !important;
    transition: all ease-out .3s;
}
.viewbtnpetcard{
    opacity: 0;
        transition: all ease-out .3s;

}







/* home pets shortcode */

.hometumb {
    min-height: 290px;
    background-size: cover;
    background-position: center;
    border-radius: 25px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
        overflow: hidden !important;
}


@media(max-width:600px){
	.hometumb{
	min-height: 180px !important;
}
}

.pet-ribbon-cards {
    background-color: #e8a63a;
    text-align: center;
    color: white;
    padding: 7px;
    text-transform: uppercase;
    height: 40px;
}
.pet-ribbon--placeholder{
  height: 40px;
}
.viewbtncover {
    text-align: center;
    opacity: 1;
}
.viewbtncover a{
  color: #fff !important;
    background: #32373c;
    padding: .8em 1.5em;
    font-size: 1em;
    line-height: 1.4;
    text-align: center;
    transition-timing-function: linear;
    transition-duration: 350ms;
    border-radius: 100px;
    opacity: 0;
    font-size: 15px !important;
}
.hometumb:hover .viewbtncover a{
      transition-timing-function: linear;
    transition-duration: 350ms;
    opacity: 1 !important;
      color: #fff !important;
}
.hometumb .viewbtncover a:hover{
      background: #e8a63a;

      transition-timing-function: linear;
    transition-duration: 350ms;

}
p.pet-card-bio{
  padding: 0px;
    border-bottom: 1px solid #efefef;
font-weight: 600 !important;
}
h3.pet-card-title {
    padding-bottom: 5px;
  }


/* home category shortcode */

.pet-type-tiles {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

@media(min-width:901px) {
 .pet-type-card{
  flex: 1;
 }
}

@media(max-width:900px) {
  .pet-type-tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
  .pet-type-card{
    width: 23%;
  }
}

@media(max-width:600px) {
  .pet-type-tiles {
    grid-template-columns: 1fr
  }
  .pet-type-card{
    width: 30%;
  }
}

.pet-type-card {
  display: block;
  text-decoration: none;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .06);
  transition: .15s
}

.pet-type-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .1)
}

.pet-type-media {
  aspect-ratio: 1.6/1;
}

.pet-type-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
    display: block;
    padding: 15px;
}

.pet-type-meta {
  padding: .9rem 1rem;
  text-align: center;
}

.pet-type-name {
  margin: 0;
    font-weight: 200 !important;
    color: #111;
    font-size: 19px;
    padding-bottom: 0px;
}

.pet-type-count {
      margin: .15rem 0 0;
    font-size: .9rem;
    color: #b1afaf;
    font-weight: 200;
}






/* shortlist style */

.shortlisted-pets li {
    list-style: none;
}
.shortlisted-pets {
    display: flex;
    flex-wrap: wrap;
    gap: 2%;
}
.shortlisted-pets li {
    width: 23%;
    margin-bottom: 30px;
}


@media only screen and (max-width: 780px) {
  .shortlisted-pets li {
    width: 32%;
    margin-bottom: 30px;
}
}

@media only screen and (max-width: 580px) {
  .shortlisted-pets li {
    width: 47%;
    margin-bottom: 30px;
}
.shortlisted-pets {
    gap: 5%;
}
}




/* Keep Google Places dropdown above modals/headers */
.pac-container { z-index: 100000; }

/* Optional: make it match your UI a bit more */
.pac-container { border-radius: 8px; }
.pac-item { line-height: 1.2; }





/* FAQ base */
.fop-faq {
  display: grid;
  gap: 12px;
}

/* Each item */
.fop-faq__item {
  border: 1px solid #e9ecef;
  border-radius: 12px;
  padding: 0;
  background: #fff;
}

/* Summary (question) */
.fop-faq__item > summary.fop-faq__q {
  list-style: none;
  cursor: pointer;
  padding: 14px 16px;
  font-weight: 600;
  outline: none;
}

/* Remove default marker in some browsers */
.fop-faq__item > summary::-webkit-details-marker {
  display: none;
}

/* Answer */
.fop-faq__a {
  padding: 0 16px 16px 16px;
  font-size: 15px;
  line-height: 1.6;
}

.fop-faq-accordion .et_pb_toggle_open .et_pb_toggle_content { display: block !important; }
.fop-faq-accordion .et_pb_toggle_close .et_pb_toggle_content { display: none !important; }




/* Replace "Shortlist" with Divi heart icon */
#menu-item-222536 a {
    font-size: 0; /* hide text */
    position: relative;
}

#menu-item-222536 a::before {
    content: "\e089";
    font-family: "ETmodules";
    font-size: 25px;
    display: inline-block;
    line-height: 1;
    color: #df592c;
    vertical-align: bottom;
}
/* Hide the Shortlist text and show only icon */
#menu-item-222536 a {
    font-size: 0 !important; /* hides the text */
    position: relative;
}