/* ==========================================================================
   Version 1.0 einvoix.com 16/09/2024
   
   Alekos
   ========================================================================== 
    
    00. General
	01. Header, Footer
    02. Index
    03. Einvoix
    04. Stripe
    
   ========================================================================== */


/* ==========================================================================
   00. General
   ========================================================================== */ 

    /* font size */
    .fs-12{
      font-size:12px !important;
    }
    .fs-14{
      font-size:14px !important;
    }
    .fs-16{
      font-size:16px !important;
    }
    .fs-intro{
      font-size: calc(1.465rem + 2.58vw) !important;
    }
    @media (min-width: 992px) {
      .fs-intro{
        font-size: 2.5rem !important;
      }
    }
    @media (min-width: 1200px) {
      .fs-intro{
        font-size: 3rem !important;
      }
    }
    @media (min-width: 1400px) {
      .fs-intro{
        font-size: 3.5rem !important;
      }
    }
    /* news h1, h2, h3*/
    .news h1{
      color: #3f78e0 !important;
    }
    .news h2{
      font-weight: 100;
    }
    
    /* BG FULL */
    .bg-full{
      background-size:cover;
    }
    
    /* Icon */
    .icon-svg-xl{
      width: 5rem;
      height: 5rem;
    }

    /* Circle */
    .btn-circle-small{
      width:1.5rem !important;
      height:1.5rem !important;
    }  
    
    
    /* BUTTON */
    @media (hover: none) and (pointer: coarse) {
        .btn:hover{
          position:static !important;
          transform:none !important;
          box-shadow:none !important;
        }
    }
    
    /* BTN-TIME */
    .btn-time{
        letter-spacing:0.05rem;
        font-size:12px;
    }
    @media (min-width: 400px) {
      .btn-time{
          font-size: 14px; 
      }
    }
    @media (min-width: 600px) {
      .btn-time{
          font-size: 16px; 
      }
    }
    @media (min-width: 800px) {
      .btn-time{
          font-size: 18px; 
      }
    }

    /* FORM */
    .form-control{
        font-size:16px !important;
    }
    .form-check-input:checked {
        background-color:#54a8c7;
        border-color: #54a8c7;
    }
    label.form-check-label{
        padding-left:5px;
        display:inline !important;
        margin-bottom:10px;
    }
    .form-control:disabled {
        background-color: var(--bs-pale-primary);
        opacity: 1;
    }
    
    /* DISPLAY ONLY */
    .app-only{
        display:block !important;
    }
    .web-only{
        display:none !important;
    }
    @media (min-width: 1200px) {
        .app-only{
            display:none !important;
        }
        .web-only{
            display:block !important;
        }
    }
    
    /* ALERT */
    .alert{
		word-break:break-word;
		max-height:300px;
		overflow:auto;
	}
    .alert-icon {
        padding-left: 1rem;
    }
    .alert-icon i{
        padding: 0;
        padding-right: 10px;
        position: static;
    }
    .alert-icon span{
        position:relative;
        top:-3px;
    }
    
    /* MODAL BOX */
    @media (max-width: 500px) {
        .modal-body{
            padding:2em;
        }
    }
    
    /* PROCESS LINE */
    @media (min-width: 0px) {
      .process-wrapper.line [class*=col-4] {
        position: relative;
      }
      .process-wrapper.line [class*=col-4]:after {
        width: 100%;
        position: absolute;
        content: "";
        height: 1px;
        background: none;
        border-top: 1px solid rgba(164, 174, 198, 0.2);
        top: 1.5rem;
        z-index: 1;
        left: 3rem;
      }
      .process-wrapper.line [class*=col-4]:last-child:after {
        display: none;
      }
    }
    
    
    /* SWIPER SLIDE */
    .swiper-slide figure .item-link{
        position:absolute !important;
    }
   
   
    /* FLOAT */
    .float-left{
        float:left;
    }
    .float-right{
        float:right;
    }
    
    /* LINK */
    .back{
        font-weight: 700;
        letter-spacing: -0.01rem;
        display: inline-block;
    }
    .back:before {
      line-height: 1;
      font-family: "Unicons";
      content: "\e949";
      padding-right: 0.05rem;
      font-size: 0.9rem;
      font-weight: normal;
      vertical-align: -3px;
      margin-left: -0.25rem;
      display: inline-block;
    }
    
    /* WHATSAPP */
    .wa-text{
        color: #25d366;
    }
    .wa-bg{
        background-color: #25d366;
    }


/* ==========================================================================
   01. Header, Footer
   ========================================================================== 

    /* Navbar */
    @media (min-width: 992px) {
        .navbar-expand-lg[class*=navbar-bg-]:not(.fancy):not(.extended):not(.fixed) .navbar-collapse .nav-link {
            padding-top: 1.5rem;
            padding-bottom: 1.5rem;
        }
    }
    @media (max-width: 991.98px) {
        .navbar-expand-lg .navbar-brand {
            padding-top: 10px;
            padding-bottom: 10px;
        }
    }
    .navbar-stick:not(.navbar-dark) {
        background: rgba(var(--bs-white-rgb), 1);
    }
    
    .navbar-nav .nav-link {
        padding-right: 0;
        padding-left: 0;
    }
    
    .dropdown-toggle::after { /* dropdown menu */
        display: inline;
    }
    
    /* Tasto Accedi */
    @media (max-width: 400px){  
        .navbar .btn-sm, .navbar .btn-group-sm>.btn {
            font-size: 14px;
            padding: 5px 10px;
        }
    }
        
    
    /* Mobile Menu */
    .offcanvas-nav .offcanvas-header .btn-close { /* btn-close */
        margin-right:0;
    }
    @media (max-width: 991.98px) {
      .navbar-expand-lg .navbar-collapse.bg-white .nav-link {/* Menu ul */
          color: #343f52 !important;
          font-size: 24px;
      }
    }
    
    
    /* Breadcrumbs */
    .wrapper.breadcrumbs{
        border-top: 1px dashed rgba(8, 60, 130, 0.06);
    }


    /* Footer */
    .footer-badge{
        box-shadow: 0 0 0 0.05rem rgb(8 60 130 / 6%), 0rem 0rem 1.25rem rgb(30 34 40 / 4%);
        height:40px;
        border-radius:6px;
        margin-top:30px;
        margin-bottom:30px;
    }
    .social-gray a i{
        color: #cacaca !important;
    }
    .social-gray a:hover i{
        color: var(--primary-color)!important;
    }
    
    .end-footer{
        text-align:left;
        font-size:14px;
    }
    @media (min-width: 1200px) {
      .end-footer{
          text-align:center;
          font-size:14px;
      }
    }
    
    
  
  

/* ==========================================================================
   02. Index
   ========================================================================== */ 

    .card{
        overflow:hidden;
    }
	.shop-card{
        width:70px;
    }
    .card-img-top.border-dashed{
        border-bottom: 1px dashed rgba(8, 60, 130, 0.06);
    }
    
    @media (min-width: 320px) and (max-width: 500px){
      .card-body,
      .card-body.p-12{
          padding:1.5rem !important;
      }
      .card-body.p-1{
          padding:0.25rem !important;
      }
      .btn-cta{
          display:block !important;
      }
      .btn-cta .btn{
          margin-bottom:15px;
          width:100%;
      }
    }

	@media (min-width: 400px){
		.shop-card{
	        width:100px !important;
	    }
	}
	@media (min-width: 500px){
		.shop-card{
	        width:130px !important;
	    }
	}
    
    


/* ==========================================================================
   03. Einvoix
   ========================================================================== */ 

    /* MAIN LOGO MOBILE */
    .e-logo {
        display: block;
        padding: 0;
        width: 150px;
        height: 50px;
        margin: 0 !important;
        background: url(../img/einvoix.svg);
        background-size: 126%;
        background-repeat: no-repeat;
        background-position: center center;
        position: relative;
        left: -11px;
        top: -2px;
    }
    
    
    /* EX MAIN LOGO SOLO WEB 
    .e-logo{
        display: block;
        padding: 0;
        width: 195px;
        height:50px;
        margin:0 !important;
        background: url(../img/einvoix.svg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        position:relative;
        left:-31px;
        top:-2px;
    }
    */
    
    /* CART */
    .shopping-cart.checkout .card{
        width:80px !important;
        height:80px !important;
    }
    .shopping-cart.checkout img{
        width:100% !important;
        height:100% !important;
    }
    .price {
        min-width: 70px;
    }
    
    
    /* SPINNER */
	@-webkit-keyframes spin {
	  0% { -webkit-transform: rotate(0deg); }
	  100% { -webkit-transform: rotate(360deg); }
	}
	@keyframes spin {
	  0% { transform: rotate(0deg); }
	  100% { transform: rotate(360deg); }
	}
	.loader {
		margin:auto;
		border: 16px solid #eee; /* Light grey */
        border-top: 16px solid #54a8c7; /* Acqua */
        border-radius: 50%;
        width: 120px;
        height: 120px;
		margin-bottom:10px;
		-webkit-animation: spin 1s linear infinite; /* Safari */
		animation: spin 1s linear infinite;
	}
	
	/* HELP */ 
	.j-help figure{
	    width:80%;
	    max-width:500px;
	}
	@media (min-width: 768px){
	   .j-help{
	       display:none;
	   }
	}


    /* GO TOP */   
    .progress-wrap {
        bottom: 120px !important;
        right: 48px !important;
    }
    
    
    /* GUESTY */
    .bg-soft-guesty{
        background-color: #faf5f0 !important;
    }
    .btn-guesty {
        --bs-btn-color: #fff;
        --bs-btn-bg: #007a67;
        --bs-btn-border-color: #007a67;
        --bs-btn-hover-color: #fff;
        --bs-btn-hover-bg: #007a67;
        --bs-btn-hover-border-color: #007a67;
        --bs-btn-focus-shadow-rgb: 82, 92, 108;
        --bs-btn-active-color: #fff;
        --bs-btn-active-bg: #007a67;
        --bs-btn-active-border-color: #007a67;
        --bs-btn-active-shadow: 0rem 0.25rem 0.75rem rgba(30, 34, 40, 0.15);
        --bs-btn-disabled-color: #fff;
        --bs-btn-disabled-bg: #007a67;
        --bs-btn-disabled-border-color: #007a67;
    }
    .btn-outline-guesty {
        --bs-btn-color: #007a67;
        --bs-btn-border-color: #007a67;
        --bs-btn-hover-color: #fff;
        --bs-btn-hover-bg: #007a67;
        --bs-btn-hover-border-color: #007a67;
        --bs-btn-focus-shadow-rgb: 52, 63, 82;
        --bs-btn-active-color: #fff;
        --bs-btn-active-bg: #007a67;
        --bs-btn-active-border-color: #007a67;
        --bs-btn-active-shadow: 0rem 0.25rem 0.75rem rgba(30, 34, 40, 0.15);
        --bs-btn-disabled-color: #007a67;
        --bs-btn-disabled-bg: transparent;
        --bs-btn-disabled-border-color: #007a67;
        --bs-gradient: none;
    }
    
  
    

/* ==========================================================================
   04. Stripe
   ========================================================================== */ 


    /* STRIPE FORM */
    #payment-form input,
    #payment-form select{
      display: block;
      width: 100%;
      padding: 0.6rem 1rem;
      font-size: 0.75rem;
      font-weight: 500;
      line-height: 1.7;
      color: #60697b;
      background-color: #fff;
      background-clip: padding-box;
      border: 1px solid rgba(8, 60, 130, 0.06);
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border-radius: 0.4rem;
      box-shadow: 0rem 0rem 1.25rem rgba(30, 34, 40, 0.04);
      transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
      margin-bottom: 1rem !important;
    }
    #payment-form label{
      display: none;
    }
    #submit-button{
      display: inline-block;
      font-weight: 700;
      line-height: 1.7;
      letter-spacing: -0.01rem;
      color: #60697b;
      text-align: center;
      white-space: nowrap;
      vertical-align: middle;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      background-color: transparent;
      border: 2px solid transparent;
      box-sizing: border-box;
      transform: translateY(0);
      padding: 0.5rem 1.2rem;
      font-size: 0.8rem;
      border-radius: 0.4rem;
      transition: all 200ms ease-in-out;
      color: #fff;
      background-color: #54a8c7;
      border-color: #54a8c7;
      margin-bottom: 1rem !important;
      margin-top: 1rem !important;
      border-radius: 50rem !important;
    }
    @media (max-width: 501px){
      #submit-button{
        width:100%;
      }
    }
  
    #mandate-acceptance{
      font-size:12px;
    }
  
    #iban-element{
      border-radius: 0.4rem;
      box-shadow: 0rem 0rem 1.25rem rgb(30 34 40 / 4%);
      height: 50px;
      padding: 15px;
      border: 1px solid rgba(8, 60, 130, 0.06);
    }
  
    #error-message{
      padding-left: 15px;
      color: #fa755a;
      font-size: 13px;
      line-height: 16px;
      margin-top: 5px;
    }



/* ==========================================================================
   bottom of file
   ========================================================================== */