/*.wp-site-blocks{
    padding: 0 !important;
}*/

.wc-block-cart__submit-container--sticky {
    position: static !important;
  }
input {
    font-size: 16px;
}
.is-success{
    display:none !important;
}

#alg_wc_pif_local_1
{font-size: 1vw !important;
}
#cropbutton{
    display:none !important;
}
.quantity{
    display: none !important;

}
.wc-block-components-quantity-selector{
    display:none !important;
}
.product_price{
    margin: 0 0 0 3% !important;
}
body{
    font-family: 'Gilroy', sans-serif !important;
    margin: 0 -5% 0 -5% !important;
}
label[for="alg_wc_pif_local_1"]{
    font-size:2.5vw !important;
}

.id-cardfront {
    width: 94%;
    height: 300px;
    padding: 20px 0 0 0;
    background-image: url('cardfrontnew.png'); /* Kép elérési útvonala */
    background-size: 140%;
    background-position: center;
    
    background-repeat: no-repeat;
    
    font-family: 'Gilroy', sans-serif !important;
    color:#432918;
    min-width: 90%;
    max-width: 90%;
}

#potkartya-container{
    margin: 0% 0% 4% 0% !important;
}

/*@media (max-width: 781px){
	.id-cardfront, .id-cardfront{
        font-size: 12px;
        width: 100%;
        min-width: none;
        max-width: none;
    }
    .front-box1{
        height: 8.6em !important;
    }
    .front-box2{
        grid-template-columns: 55% 39% !important;
        height: 2.8em !important;
        margin: .8em 0 0 0 !important;
    }
    .front-box3{
        height: 2.6em !important;
    }
    .cardfront-container{
        margin: 27% auto 0 auto !important;
        grid-template-columns: 37% 61% !important;
        height: 8.6em !important;
    }
}*/


/*@media (max-width: 1065px){
	.front-box2{
        margin: .6em 0 0 0 !important;
    }
    .front-box1 img{
        margin: 22.1% auto 0 auto !important;
    }
    .id-cardfront, .id-cardback{
        font-size:17px ;
    }
    .back-box1{
        margin: .7em 0 0 0 !important;
    }
}*/


/*@media (max-width: 1018px){
	.front-box2{
        margin: 1em 0 0 0 !important;
    }
    .front-box1 img{
        margin: 28% auto 0 auto !important;
    }
    .id-cardfront, .id-cardback{
        font-size:16px ;
    }
    .back-box1{
        margin: 1.2em 0 0 0 !important;
    }
}*/
@media (max-width: 1024px){
    .bevasarlas-margo{
        margin-left: 2% !important;
        margin-right: 2% !important;
    }
}

@media (max-width: 980px) {
    .wcpa_field_desc{
        font-size: 1.3vw !important;
    }
}

@media (max-width: 966px){
	.front-box2{
        margin: 0.8em 0 0 0 !important;
    }
    .front-box1 img{
        margin: 22.7% auto 0 auto !important;
    }
    .id-cardfront, .id-cardback{
        font-size:16px;
    }
    .back-box1{
        margin: 1em 0 0 0 !important;
    }
    .back-box3{
        margin: 0 0 0 0 !important;
    }
    .id-cardback{
        margin: -17% 0 0 0% !important;
    }
}
@media (max-width: 922px){
	.front-box2{
        margin: 1.4em 0 0 0 !important;
    }
    .front-box1 img{
        margin: 27% auto 0 auto !important;
    }
    .id-cardfront{
        font-size:15px ;
    }
    .back-box1{
        margin: 5% 0 0 0 !important;
    }
    .back-box2{
        margin: 0 0 0 0 !important;
    }
    .front-box1 img {
        width: 97% !important;
        height: 104% !important;
    }
}
@media (max-width: 887px){
	.front-box2{
        margin: 2em 0 0 0 !important;
    }
    .front-box1 img{
        margin: 31% auto 0 auto !important;
    }
    .id-cardfront{
        font-size:14px;
    }
    .back-box1{
        margin: 6% 0 0 0 !important;
    }
    .front-box1 img {
        height: 108% !important;
    }
    .genderimg{
        margin: 15% 0 0 16% !important;
    }
}
@media (max-width: 866px){
    .front-box1 img{
        width: 95% !important;
        height: 105% !important;
        margin: 34% auto 0 auto !important;
    }
	.front-box2{
        margin: 2em 0 0 0 !important;
    }
    .front-box3{
        margin: 0.2em 0 0 0 !important;
    }
    .front-box4{
        margin: 0em 0 0 0 !important;
    }
    .back-box1{
        margin: 7% 0 0 0 !important;
    }
    .back-box3{
        margin: -1.5% 0 0 0 !important;
    }
    .id-cardback{
        margin: -25% 0 0 0% !important;
    }
}

@media (max-width: 843px){
	.front-box2{
        margin: 2.3em 0 0 0 !important;
    }
    .front-box3{
        margin: 0em 0 0 0 !important;
    }
    .front-box4{
        margin: 0em 0 0 0 !important;
    }
    .back-box1 {
        margin: 8% 0 0 0 !important;
    }
    .back-box3{
        margin: -3% 0 0 0 !important;
    }
}
@media (max-width: 825px){
	.front-box2{
        margin: 2.6em 0 0 0 !important;
    }
    .front-box3{
        margin: 0.3em 0 0 0 !important;
    }
    .front-box1 img{
        height: 108% !important;
        margin: 40% auto 0 auto !important;
    }
    .id-cardfront{
        font-size:13px;
    }
    .back-box1 {
        margin: 9% 0 0 0 !important;
    }
    .back-box2 {
        
        margin: -3% 0 0 0;
    }
    .back-box3 {
        
        margin: -3% 0 0 0;
    }
    .back-box4 {
        
        margin: -3% 0 0 0;
    }
}
@media (max-width: 810px){
    .front-box2{
        margin: 2.8em 0 0 0 !important; 
    }
    .id-cardback{
        margin: -30% 0 0 0% !important;
    }
    .back-box2{
        margin: -.2em 0 0 0 !important;
    }
}
@media(max-width: 782px){

    .back-box1 {
        margin: 5% 0 0 0 !important;
    }
    .back-box2 {
        
        margin: 3% 0 0 0 !important;
    }
    .back-box3 {
        
        margin: 3% 0 0 0 !important;
    }
    .back-box4 {
        
        margin: 3% 0 0 0 !important;
    }
    .genderimg{
        margin: 12% 0 0 16% !important;
    }
    .cardfront-container{
        margin: 7% auto 0 auto !important;
        font-size: 16px !important;
    }
    .cardback-container{
        margin: 2% auto 0 19% !important;
        font-size: 16px !important;
    }
    .front-box1 img{
        margin: 22% 0 0 .3em !important;
        width: 95% !important;
        height: 95% !important;
    }
    .front-box1{
        height: 11.7em !important;
    }
    .front-box2{
        margin: 8% 0 0 0 !important;
    }
    .front-box3{
        margin: 1.3em 0 0 0 !important;
    }
    .front-box4{
        margin: 1.2em 0 0 0 !important;
    }
    .id-cardback{
        margin: 2% 0 0 0% !important;
    }
    .wcpa_field_desc{
        font-size: initial !important;
    }
}

@media (max-width: 780px){
    .id-cardback, .id-cardfront{
        height: 340px !important;
    }
    .front-box1 img{
        margin: 15% 0 0 3% !important;
        height: 112% !important;
        width: 95% !important;
    }
    .front-box2{
        margin: 6% 0 0 0 !important;
    }
    .front-box2{
        margin: 8% 0 0 0 !important;
    }
    .back-box2{
        margin: 3.7% 0 0 0 !important;
    }
    .back-box3{
        margin: 4% 0 0 0 !important;
    }
    .back-box3{
        margin: 5% 0 0 0 !important;
    }
}

@media(max-width: 729px){
    .back-box1 {
        margin: 5.5% 0 0 0 !important;
    }
    .back-box2 {
        margin: 3.5% 0 0 0 !important;
    }
    .back-box3 {
        margin: 5% 0 0 0 !important;
    }
    .back-box4{
        margin: 4% 0 0 0 !important;
    }
    .front-box1{
        height: 10.6em !important;
    }
    .front-box1 img{
        margin: 21% 0 0 2% !important;
        height: 113% !important;
    }
    .front-box2{
        margin: 8%em 0 0 0 !important;
    }
    .front-box4{
        margin: -.6em 0 0 0 0 !important;
    }
    .front-box3{
        margin: 7% 0 0 0 !important;
    }
}
@media (max-width: 703px) {
    .genderimg {
        margin: 18% 0 0 16% !important;
    }
    .id-cardback{
        margin: -2% 0 0 0% !important;
    }
}
@media(max-width: 679px){
    .front-box2{
        margin: 10% 0 0 0 !important;
    }
    .front-box3{
        margin: 6% 0 0 0 !important;
    }
    .back-box1 {
        margin: 7% 0 0 0 !important;
    }
    .back-box2 {
        
        margin: 3% 0 0 0 !important;
    }
    .back-box3 {
        
        margin: 4% 0 0 0 !important;
    }
    .back-box4 {
        
        margin: 3% 0 0 0 !important;
    }
    .genderimg {
        margin: 13% 0 0 16% !important;
    }
}
@media(max-width: 641px){
    .front-box1{
        height: 10em !important;
    }
    .front-box1 img{
        margin: 31% 0 0 3% !important;
        height: 107% !important;
    }
    .front-box2{
        margin: 13% 0 0 0 !important;
    }
    .front-box4{
        margin: .6em 0 0 0 !important;
    }
    .front-box3{
        margin: 5% 0 0 0 !important;
    }
    .back-box1 {
        margin: 8.5% 0 0 0 !important;
    }
    .back-box2 {
        
        margin: 2.5% 0 0 0 !important;
    }
    .back-box3 {
        
        margin: 4% 0 0 0 !important;
    }
    .back-box4 {
        
        margin: 2.5% 0 0 0 !important;
    }
    .id-cardback{
        margin: -6% 0 0 0% !important;
    }
}
@media(max-width: 624px){
    .wcpa_field_desc{
        font-size: 2.3vw !important;
    }
}
@media(max-width: 603px){
    .front-box1{
        height: 9em !important;
    }
    .front-box1 img{
        margin: 37% 0 0 3% !important;
        height: 110% !important;
        width: 95%;
    }
    .front-box2{
        margin: 15% 0 0 0 !important;
    }
    .front-box3{
        margin: 4% 0 0 0 !important;
    }
    .front-box4{
        margin: .5em 0 0 0 !important;
    }
    .back-box1 {
        margin: 10% 0 0 0 !important;
    }
    .back-box2 {
        
        margin: 3% 0 0 0 !important;
    }
    .back-box3 {
        
        margin: 3% 0 0 0 !important;
    }
    .back-box4 {
        
        margin: 2% 0 0 0 !important;
    }
}
@media(max-width: 572px){
    .front-box1{
        height: 8.6em !important;
    }
    .front-box1 img{
        margin: 42% 0 0 3% !important;
    }
    .front-box2{
        margin: 18% 0 0 0 !important;
    }
    .genderimg {
        width: 20% !important;
        margin: 22% 0 0 16% !important;
    }
    .front-box3{
        margin: 4% 0 0 0 !important;
    }
    .front-box4{
        margin: 3% 0 0 0 !important;
    }
    .back-box1 {
        margin: 12% 0 0 0 !important;
    }
    .back-box2 {
        
        margin: 2% 0 0 0 !important;
    }
    .back-box3 {
        
        margin: 2% 0 0 0 !important;
    }
    .back-box4 {
        
        margin: 2% 0 0 0 !important;
    }
}
@media(max-width: 529px){
    .front-box1{
        height: 8em !important;
    }
    .front-box1 img{
        margin: 51% 0 0 3% !important;
    }
    .front-box2{
        margin: 21% 0 0 0 !important;
    }
    .front-box3{
        margin: 3% 0 0 0 !important;
    }
    .front-box4{
        margin: 2% 0 0 0 !important;
    }
    .genderimg {
        margin: 21% 0 0 16% !important;
    }
    .back-box1 {
        margin: 15% 0 0 0 !important;
    }
    .back-box2 {
        
        margin: 1.5% 0 0 0 !important;
    }
    .back-box3 {
        
        margin: 1.5% 0 0 0 !important;
    }
    .back-box4 {
        
        margin: 1.5% 0 0 0 !important;
    }
    .id-cardback{
        margin: -16% 0 0 0% !important;
    }
    .input-desc{
        font-size: 2.3vw !important;
    }
}
@media (max-width: 512px) {
    .genderimg {
        margin: 24% 0 0 16% !important;
    }
    #dog-picture{
        font-size: 12px !important;
    }
}
@media (max-width: 500px) {
    .back-box1 {
        margin: 13.5% 0 0 0 !important;
    }
}
@media(max-width: 490px){
    .genderimg {
        margin: 18% 0 0 16% !important;
    }
    .front-box1{
        height: 8.6em !important;
    }
    .front-box1 img{
        margin: 58% 0 0 2% !important;
        height: 108% !important;
    }
    .cardfront-container{
        font-size:14px !important;
    }
    .front-box2{
        margin: 27% 0 0 0 !important;
    }
    .front-box3{
        margin: 3% 0 0 0 !important;
    }
    .front-box4{
        margin: 3% 0 0 0 !important;
    }
    .back-box1 {
        margin: 17% 0 0 0 !important;
    }
    .back-box2 {
        margin: 0 0 0 0 !important;
    }
    .back-box3 {
        margin: .5% 0 0 0 !important;
    }
    .back-box4 {
        margin: .5% 0 0 0 !important;
    }
}
@media(max-width: 470px){
    .front-box1{
        height: 8.2em !important;
    }
    .front-box2{
        margin: 29% 0 0 0 !important;
    }
    .back-box2{
        margin: 18% 0 0 0 !important;
    }
    .front-box1 img{
        margin: 64% 0 0 3% !important;
    }
    .genderimg {
        margin: 23% 0 0 16% !important;
    }
    .id-cardback{
        font-size:15px !important;
    }
}
@media (max-width: 452px){
    .front-box1{
        height: 8em !important;
        margin: 10% 0 0 0 !important;
    }
    .front-box1 img{
        margin: 58% 0 0 4% !important;
        height: 108% !important;
        width: 92% !important;
    }
    .front-box2{
        margin: 32% 0 0 0 !important;
    }
    .front-box4{
        margin: 1% 0 0 0 !important;
    }
    .back-box1 {
        margin: 20% 0 0 0 !important;
    }
    .back-box2 {
        margin: 0 0 0 0 !important;
    }
    .back-box3 {
        margin: -1% 0 0 0 !important;
    }
    .back-box4{
        margin: -.5% 0 0 0 !important;
    }
}
@media (max-width: 438px) {
    #dog-dob{
        font-size: 12px;
    }
}
@media (max-width: 429px){
    .front-box1{
        height: 7.5em !important;
    }
    .front-box1 img{
        margin: 65% 0 0 4% !important;
    }
    .front-box2 {
        margin: 35% 0 0 0 !important;
    }
    .front-box3 {
        margin: 1% 0 0 0 !important;
    }
    .front-box4 {
        margin: 1% 0 0 0 !important;
    }
    .back-box1 {
        margin: 22% 0 0 0 !important;
    }
    .back-box2 {
        margin: -1.5% 0 0 0 !important;
    }
    .back-box3 {
        margin: -.5% 0 0 0 !important;
    }
    .id-cardback{
        font-size:14px !important
    }
}
@media (max-width: 412px){
    .front-box1{
        height: 7.3em !important;
    }
    .front-box1 img{
        margin: 70% 0 0 4% !important;
    }
    .front-box2{
        margin: 37% 0 0 0 !important;
    }
    .back-box1 {
        margin: 23% 0 0 0 !important;
    }
    .back-box2 {
        margin: -1% 0 0 0 !important;
    }
    .back-box3 {
        margin: -1% 0 0 0 !important;
    }
    .back-box4 {
        margin: -2% 0 0 0 !important;
    }
    .id-cardback{
        margin: -35% 0 0 0% !important;
    }

}
@media (max-width: 407px) {
    .genderimg {
        margin: 26% 0 0 16% !important;
    }
    #dog-picture{
        font-size: 10px !important;
    }
}
@media (max-width: 397px){
    .front-box1{
        height: 7em !important;
    }
    .front-box1 img{
        margin: 75% 0 0 4% !important;
    }
    .front-box2 {
        margin: 40% 0 0 0 !important;
    }
    .back-box1 {
        margin: 25% 0 0 0 !important;
    }
    .back-box2 {
        margin: -2% 0 0 0 !important;
    }
    .back-box3 {
        margin: -2% 0 0 0 !important;
    }
    .back-box4 {
        margin: -2% 0 0 0 !important;
    }
}
@media (max-width: 391px) {
    .front-box1 img{
        margin: 76% 0 0 4% !important;
    }
    #dog-dob{
        font-size: 10px !important;
    }
    .input-desc{
        font-size: 2.2vw !important;
    }
    #dog-picture-btn{
        font-size: 14px;
    }
}
@media (max-width: 380px){
    .front-box1{
        height: 6.7em !important;
    }
    .front-box1 img{
        margin: 82% 0 0 3% !important;
    }
    .front-box2{
        margin: 43% 0 0 0 !important;
    }
    .front-box4{
        margin: -3% 0 0 0 !important;
    }
    .genderimg {
        margin: 24% 0 0 16% !important;
    }
    .back-box1 {
        margin: 27% 0 0 0 !important;
    }
    .back-box2 {
        margin: -3% 0 0 0 !important;
    }
    .back-box3 {
        margin: -3% 0 0 0 !important;
    }
    .id-cardback{
        font-size:13px !important;
    }
}
@media (max-width:370px){
    .front-box1 img{
        margin: 86% 0 0 3% !important;
        height: 102% !important;
    }
    .front-box2{
        margin: 45% 0 0 0 !important;
    }
    .back-box1 {
        margin: 28% 0 0 0 !important;
    }
    .back-box2 {
        margin: -3% 0 0 0 !important;
    }
    .back-box3 {
        margin: -3% 0 0 0 !important;
    }
    .back-box4 {
        margin: -3% 0 0 0 !important;
    }
    #dog-dob{
        font-size: 10px !important;
    }
    .form-label{
        font-size: 14px !important;
    }
}

@media (max-width: 360px){
    .front-box1{
        height: 6.4em !important;
    }
    .front-box1 img {
        margin: 91% 0 0 4% !important;
        height: 103% !important;
    }
    .front-box2 {
        margin: 47% 0 0 0 !important;
    }
    .front-box4 {
        margin: -3% 0 0 0 !important;
    }
    .back-box1 {
        margin: 29% 0 0 0 !important;
    }
    .back-box3 {
        margin: -4% 0 0 0 !important;
    }
    .back-box4 {
        margin: -3% 0 0 0 !important;
    }
}
@media (max-width: 350px){
    .front-box1{
        height: 6.2em !important;
    }
    .front-box1 img{
        margin: 95% 0 0 4% !important;
    }
    .front-box2 {
        margin: 49% 0 0 0 !important;
    }
    .back-box1 {
        margin: 31% 0 0 0 !important;
    }
    .back-box2 {
        margin: -4% 0 0 0 !important;
    }
    .back-box4 {
        margin: -4% 0 0 0 !important;
    }
    .input-desc{
        font-size: 2.1vw !important;
    }
    #dog-picture{
        font-size: 9px !important;
    }
}

/*@media (min-width: 782px){
	.id-cardfront, .id-cardfront{
        width: 100%;
        min-width: none;
        max-width: none;
    }
    .front-box3{
        height: 2.3em;
    }
    .cardfront-container{
        margin: 13% auto 0 auto !important;
        height: 8.3em !important;
    }
}*/
.genderimg{
    width: 25%;
    height: auto;
    display: block;
    margin: 24% 0 0 16%
}
.id-cardback {
    width: 94%;
    height: 300px;
    padding: 20px 0 0 0;
    background-image: url('cardbacknew.png'); /* Kép elérési útvonala */
    background-size: 140%;
    background-position: center;
    background-repeat: no-repeat;
    color:#432918;
    font-family: 'Gilroy', sans-serif;
    min-width: 90%;
    max-width: 90%;
    margin: -18% 0 0 0% ;
}
.id-card-content p {
    font-size: 16px;
    padding: 0px;
    margin: 0px;
}

.id-card-content span {
    font-weight: bold;
    padding: 0px;
    margin: 0px;
}

.cardfront-container {
    display: grid;
    grid-template-columns: 37% 65%;
    grid-template-rows: repeat(3, 1fr);
    height: 7.5em;
    margin: 15% auto 0 auto;
    background-color: transparent;
    padding: 0;
    width: 90%;
    max-width: 90%;
    min-width: 90%;
}

.cardback-container {
    display: grid;
    grid-template-rows: repeat(3, 1fr);
    height: 10.5em;
    width: 90%;
    margin: 10% auto 0 19%;
    padding: 0;
    max-width: 90%;
    min-width: 90%;
    background-color: transparent;
}

.front-box1 {
    grid-row: span 3;
    height: 7.6em;
    width: 94%;
}

.front-box1 img{
    width: 95%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    margin: 16.5% auto 0 auto;
    object-position: 50% 50%;
    border: 3.3px solid #4d1d0e;
}

.front-box2 {
    display: grid;
    grid-template-columns: 51% 39%;
    padding: 0 0 0 0;
    margin: .3em 0 0 0;
    height: 2.7em;
}
.front-box2 div {
    padding: 0 0 0 0;
    margin: 0;
    height: 2.5em;
}
.front-box3 {
    grid-column: span 1;
    height: 2.7em;
    padding: 0 0 0 0;
    margin: 0;
}
.front-box4 {
    grid-column: span 1;
    padding: 0 0 0 0;
    margin: 0;
    height: 3em;
}
.back-box1{
    margin: .3em 0 0 0;
    height: 2.62em;
}
.back-box2{
    height: 2.62em;
}
.back-box3{
    height: 2.62em;
    margin: -.2em 0 0 0;
}
.back-box4{
    height: 2.62em;
    margin: -.2em 0 0 0;
}

.szallitas span.wc-block-components-totals-item__label {
    font-size: 0; /* elrejti az eredeti szöveget */
}
  
.szallitas span.wc-block-components-totals-item__label::after {
    content: "Szállítás";
    font-size: 1.125rem;
}

.wc-block-components-totals-shipping-address-summary{
    font-size: 0;
}

.wc-block-components-totals-shipping-address-summary::after{
    content: "Szállítás";
    font-size: 1.125rem;
}

.szallitas div.wc-block-components-shipping-address{
    display: none;
}

.szallitas div.wc-block-components-totals-shipping__via{
    display: none;
}


#custom-form{
    background: #f1e8e0 !important;
    align-content: center;
    border-radius: 15px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
}

#form-flex-container{
    display: flex;
    flex-direction: column;
    margin: 0 auto 0 auto !important;
    gap: 20px; /* kis térköz a sorok között */ 
}

.row-flex{
    display: flex;
    flex-direction: row;
    gap: 20px; /* kis térköz az oszlopok között */
}

.form-label{
    font-size: 16px;
    color: hsl(0, 0%, 25.9%);
    margin: 0 0 8px 0;
    display: inline-block;
}

.input-desc{
    font-size: 13px;
    color: hsl(0, 0%, 47.5%);
    margin: 0 0 8px;
}
.form-input{
    height: 45px;
    border: 1px solid hsl(222.9, 44.3%, 84.5%);
    border-radius: 6px;
    line-height: 25px;
    padding: 5px 10px;
    box-sizing: border-box;
    color: hsl(0, 0%, 36.5%);
    width: 100%;
    min-width: 0;
}
.form-input:focus{
    border: 1px solid #666; /* ne legyen vastagabb fókuszban sem */
    box-shadow: none; /* néhány böngésző árnyékot ad fókuszban */
    outline: none; /* hogy ne legyen kék keret */
}
.input-col1{
    width: 50%;
}
.input-col2{
    width: 50%;
}
#form-radio-group{
    display: grid;
    grid-template-columns: 100%;
    gap: 10px 20px;
    align-items: flex-start;
}
.form-radio{
    position: relative;
}
.radio-btn, .radio-btn{
    width: 20px;
    height: 20px;
    flex: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 1px solid HSL(214.3, 42.9%, 80.8%);
    background-color: rgba(0,0,0,0);
    border-radius: 50%;
    margin: 0 5px 0 0;
}
.radio-btn::after{
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: hsl(235.1, 64.5%, 51.4%);
    border-radius: 50%;
    transform: scale(0);
    transition: all ease-in-out .2s;
}
.radio-input{
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
    margin: 3px 3px 3px 4px;
}
.form-radio-label{
    color: hsl(0, 0%, 29%);
    font-size: 14px;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
}
.radio-input:checked + .radio-btn::after {
    transform: scale(1);
}
.radio-input:checked + .radio-btn {
    border-color: hsl(235.1, 64.5%, 51.4%);
}
#form-checkbox-label{
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
    color: hsl(0, 0%, 29%);
    font-size: 14px;
}
.checkbox-input{
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
    margin: 3px 3px 3px 4px;
}
.checkbox-custom{
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border: 1px solid HSL(214.3, 42.9%, 80.8%);
    border-radius: 4px;
    margin: 0 5px 0 5px;
    cursor: pointer;
    flex: 20px 0 0;
}
.checkbox-custom::after{
    content: "";
    position: absolute;
    width: 9px;
    height: 4px;
    border: solid hsl(0, 0%, 100%);;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg);
    visibility: hidden;
    opacity: 0;
    margin-top: -2px;
    transform: scale(0) rotate(45deg);
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out, visibility 0.2s;
}
.checkbox-input:checked + .checkbox-custom::after {
    visibility: visible;
    opacity: 1;
    transform: scale(1) rotate(-45deg);
}
.checkbox-input:checked + .checkbox-custom {
    background-color: hsl(235.1, 64.5%, 51.4%);
    border-color: hsl(235.1, 64.5%, 51.4%);
}
.fade {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 0.4s ease, max-height 0.4s ease;
    pointer-events: none;
}
  
.fade.show {
    opacity: 1;
    max-height: 200px; /* állítsd be elég nagyra, hogy elférjen a tartalom */
    pointer-events: auto;
}

#dog-picture-btn{
    display: inline-block;
    padding: 0.2em 0.8em;
    background-color: #cab29d;
    color: white;
    border-radius: 6px;
    cursor: pointer;
}

.file-name {
    margin-top: 0.5em;
    font-size: 0.9em;
    color: #333;
    font-style: italic;
}

#potkartya-container{
    margin: 0 50% 4% 0;
    padding: 10px;
    border: 1px solid #ccc;
    background-color: #f8f8f8;
    border-radius: 5px;
}

.required-star{
    color: red;
    font-size: 0.6em;
    vertical-align: super;
    line-height: 1;
}
button {
    background-color: #b2947b !important;
    color: white !important;
    border: none !important;
    padding: 10px 20px !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    line-height: inherit;
    font-family: inherit;
    text-decoration: none !important;
}
button:hover {
    background-color: #8b6f5a;
}

.bevasarlas-margo{
    margin-left: auto ;
    margin-right: auto ;
}