/* Vars */
:root {
  --main-color: #008B09;
}

/* General */
body{font-family: 'Inter'; font-size: 15px; font-weight: 400; letter-spacing: 0.3px; min-width: 320px; min-height: 100vh; display: flex; flex-direction: column;}
.cont{max-width: 1200px; padding: 0 15px; margin: 0 auto;}
.flex{display: flex;}
a:focus, a:active{outline: none;}
*{-webkit-tap-highlight-color: transparent;}
*::selection{background-color: var(--main-color); color: #fff;}

.alerts .alert-item{font-weight: 700; line-height: 130%; padding: 15px 20px 13px;}
.alerts .alert-item:not(:first-child){margin-top: 15px;}
.alerts .alert-item.success{color: #155724!important; background-color: #d4edda; border-color: #c3e6cb;}
.alerts .alert-item.danger{color: #721c24!important; background-color: #f8d7da; border-color: #f5c6cb;}
.alerts .alert-item.alert-dark{color: #1b1e21!important; background-color: #d6d8d9; border-color: #c6c8ca;}

/* Buttons */
.btn-general{cursor: pointer; line-height: 100%; text-align: center; text-decoration: none; padding: 13px 25px; border: 1px solid var(--main-color)!important; border-radius: 10px; display: inline-block; user-select: none;}
.btn-general.btn-background{color: #fff; background-color: var(--main-color);}
.btn-general.btn-border{color: var(--main-color); background-color: #fff;}
.btn-general:focus{outline: none;}

/* Form */
input[type="text"], input[type="password"], input[type="number"], textarea, select{font-size: 15px; width: 100%; border: 1px solid #ccc; background-color: #fff; transition: all .1s;}
input[type="text"], input[type="password"], input[type="number"], select{line-height: 100%; padding: 0 10px; height: 43px;}
textarea{padding: 10px; height: 130px; resize: none;}
input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, textarea:focus{outline: none; border-color: var(--main-color);}
.field-required::after{content: '\2a'; font-family: 'Awesome Solid'; font-size: 11px; color: #ff0000; margin-left: 3px; display: inline-block;}

button{-webkit-appearance: none; -moz-appearance: none; appearance: none;}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button{-webkit-appearance: none;}
input[type="number"]{-webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield;}

/* PWA */
.pwa{display: none;}
.mfp-content .pwa{padding: 40px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.pwa-popup.mfp-close-btn-in .mfp-close{color: #000}
.pwa{text-align: center; width: 100%; height: 100%; min-height: 100vh; background-color: #fff;}
.pwa .icon{width: 100%; height: 96px; background: url('/local/templates/florist/assets/img/icons/android-icon-96x96.png') center no-repeat;}
.pwa .title{font-size: 28px; font-weight: 700; color: #333; line-height: 130%;margin-top: 20px;}
.pwa .txt{margin-top: 5px;}
.pwa .btns{margin-top: 20px;}
.pwa .btns button:not(:last-child){margin-right: 15px;}

/* Alert cookie */
.alert__cookie{width: 100%; position: fixed; left: 0; bottom: 25px; z-index: 110;}
.alert__cookie .cookies__desc{font-size: 13px; padding: 16px;  border-radius: 5px; display: flex; align-items: center; background-color: #fff; box-shadow: 0 4px 4px rgba(0, 0, 0, .04), 0 4px 20px rgba(0, 0, 0, .1);}
.alert__cookie .cookies__desc p{margin: 0; padding: 0 20px 0 0;}



@media (min-width: 992px){
  .btn-general{transition: all .1s;}
}

@media (max-width: 992px){
  body{font-size: 16px;}
  .alert__cookie{bottom: 10px;}
}

@media(max-width: 768px){
  .alert__cookie .cookies__desc{font-size: 12px; flex-direction: column;}
  .alert__cookie .cookies__desc p{margin-bottom: 20px; padding: 0;}
  .alert__cookie .cookies__desc .btn{text-align: center; width: 100%;}
}

@media(max-width: 576px){
	.alert__cookie .btn-general{width: 100%;}

  /* PWA */
  .mfp-content .pwa{padding: 40px 20px;}
}