Files
erv-ticket-dev/css/main.css
Fedor 2c516362df feat: Secure SMS verification with Redis (Predis)
- Added Predis library for Redis connection (no PHP extension required)
- Server-side SMS code generation and storage in Redis
- Rate limiting and brute-force protection
- Integration with n8n webhook for SMS sending
- Environment variables moved to .env file
- Fixed policy verification endpoint
- Added file-based fallback if Redis unavailable
2026-01-15 15:40:13 +03:00

610 lines
12 KiB
CSS
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@font-face {
font-family: "r-regular";
font-weight: normal;
font-style: normal;
src: url("../fonts/Roboto/Roboto-Regular.eot");
src: url("../fonts/Roboto/Roboto-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto/Roboto-Regular.woff") format("woff"), url("../fonts/Roboto/Roboto-Regular.ttf") format("truetype");
}
@font-face {
font-family: "r-medium";
font-weight: normal;
font-style: normal;
src: url("../fonts/Roboto/Roboto-Medium.eot");
src: url("../fonts/Roboto/Roboto-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto/Roboto-Medium.woff") format("woff"), url("../fonts/Roboto/Roboto-Medium.ttf") format("truetype");
}
@font-face {
font-family: "r-bold";
font-weight: normal;
font-style: normal;
src: url("../fonts/Roboto/Roboto-Bold.eot");
src: url("../fonts/Roboto/Roboto-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto/Roboto-Bold.woff") format("woff"), url("../fonts/Roboto/Roboto-Bold.ttf") format("truetype");
}
@font-face {
font-family: "r-light";
font-weight: normal;
font-style: normal;
src: url("../fonts/Roboto/Roboto-Light.eot");
src: url("../fonts/Roboto/Roboto-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto/Roboto-Light.woff") format("woff"), url("../fonts/Roboto/Roboto-Light.ttf") format("truetype");
}
@font-face {
font-family: "r-semibold";
font-weight: normal;
font-style: normal;
src: url("../fonts/Roboto/Roboto-SemiBold.eot");
src: url("../fonts/Roboto/Roboto-SemiBold.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto/Roboto-SemiBold.woff") format("woff"), url("../fonts/Roboto/Roboto-SemiBold.ttf") format("truetype");
}
/*!
* Bootstrap Reboot v4.0.0 (https://getbootstrap.com)
* Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
*/
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
font-family: 'r-regular',Arial,sans-serif;
line-height: 1.15;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-ms-overflow-style: scrollbar;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
@-ms-viewport {
width: device-width;
}
article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section {
display: block;
}
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #212529;
text-align: left;
background-color: #fff;
}
[tabindex="-1"]:focus {
outline: 0 !important;
}
.container {
max-width: 900px;
margin: 0 auto;
padding-left: 10px;
padding-right: 10px;
}
.form{
padding-top: 100px;
max-width: 760px;
margin: 0 auto;
}
.form__title{
font-weight: normal;
text-align: center;
font-size: 24px;
line-height: 1.5;
max-width: 560px;
margin: 0 auto;
margin-bottom: 50px;
}
.form__title strong{
font-weight: bold;
}
.form-item {
margin-bottom: 20px;
}
.form-item .form-item__label {
font-size: 20px;
line-height: 1.55;
display: block;
padding-bottom: 5px;
}
.form-item .form-item__sublabel {
/* font-family: r-light; */
margin-bottom: 25px;
font-size: 16px;
line-height: 1.55;
display: block;
}
.form-item .form-item__sublabel a{
color: #ff8562;
text-decoration: none;
}
.form-item .form-input, .form-item .t-datepicker{
margin: 0;
font-size: 100%;
height: 60px;
padding: 0 20px;
font-size: 16px;
line-height: 1.33;
width: 100%;
border: 0 none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
outline: none;
-webkit-appearance: none;
border-radius: 0;
color: #000000;
border: 1px solid #000000;
font-family: 'r-regular',Arial,sans-serif;
}
input::placeholder{
color: #ff000083;
}
.select-wrap{
position: relative;
}
.select-wrap:after{
content: ' ';
width: 0;
height: 0;
border-style: solid;
border-width: 6px 5px 0 5px;
border-color: #000 transparent transparent transparent;
position: absolute;
right: 20px;
top: 0;
bottom: 0;
margin: auto;
pointer-events: none;
}
.form-item .form-input--date{
background: url('../img/date.svg') no-repeat right 14px center;
background-size: 27px;
width: 245px;
}
.form-item .form-input::placeholder{
color:#7f7f7f4d;
}
.form-item .form-item__warning {}
.form-item .form-input--textarea{
height: 102px;
padding-top: 17px;
}
.form-step{
display: none;
}
.form-step.active
{
display: block;
}
.form__warning{
background: #F95D51;
padding: 10px;
height: 70px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
margin-bottom: 20px;
color:#fff;
text-align: center;
font-size: 20px;
line-height: 1.55;
}
.t-check-in, .t-check-out, .t-datepicker{
float: none !important;
}
.form__action{
position: relative;
display: flex;
justify-content: space-between;
}
.progress-row{
position: absolute;
left: 0;
top:-25px;
width: 100%;
display: flex;
justify-content: center;
}
.progress-row .span-progress{
transform: translateY(40px);
}
.btn{
height: 45px;
border: none;
outline: none;
font-size: 14px;
padding-left: 30px;
padding-right: 30px;
background: #000;
text-decoration: none;
display: flex;
justify-content: center;
align-items: center;
color:#fff;
}
.form-note {
font-size: 15px;
line-height: 1.55;
text-align: center;
margin-top: 20px;
}
.form-note a{
color: #ff8562;
text-decoration: none;
}
.btn span.icon{
width: 18px;
height: 16px;
position: relative;
margin-left: 5px;
}
.btn--next{
margin-left: auto;
}
.btn--next span.icon{
margin-left: 5px;
}
.btn--prev span.icon{
margin-left: 5px;
}
.btn span.icon:after{
color:#fff;
position: absolute;
left: 0;
top: 0;
height: 100%;
line-height: 100%;
font-size: 14px;
display: inline-block;
font-family: Arial,Helvetica,sans-serif;
}
.btn--next span.icon:after{
content: '→';
}
.btn--prev span.icon:after{
content: '←';
}
.form-step__info{
font-family: 'r-regular',Arial,sans-serif;
display: block;
margin-bottom: 20px;
}
.form-item input[type="file"]{
display: none;
}
.form-item input[type="file"] +label {
height: 45px;
border: none;
outline: none;
font-size: 14px;
padding-left: 30px;
padding-right: 30px;
background: #000;
text-decoration: none;
display: inline-flex;
justify-content: center;
align-items: center;
color:#fff;
font-family: r-bold;
}
.iti{
width: 100%;
}
.span-progress {
font-size: 12px;
opacity: 0.6;
}
.span-progress .current {}
.span-progress .total {}
.datepicker__header{
background: #efefef !important;
}
.form-item__warning{
color: red;
font-size: 13px;
display: block;
margin-top: 5px;
}
.form-item__warning--success{
color: #28a745 !important; /* Зеленый цвет для успешных сообщений */
}
.datepicker__day.is-today,.qs-current{
background: #bdbdbd !important;
color:#fff !important;
border-radius: 50% !important;
}
.checkbox-item {}
.checkbox-item .form-checkbox {
display: none;
}
.checkbox-item .form-checkbox + label{
padding-left: 30px;
position: relative;
}
.checkbox-item .form-checkbox + label:after{
content: '';
position: absolute;
display: inline-block;
vertical-align: middle;
height: 20px;
top: 0;
width: 20px;
border: 2px solid #000;
box-sizing: border-box;
margin-right: 10px;
-webkit-transition: all 0.2s;
transition: all 0.2s;
opacity: .6;
left: 0
}
.checkbox-item .form-checkbox + label:before{
content: '';
position: absolute;
display: inline-block;
vertical-align: middle;
height: 20px;
top: 0;
width: 20px;
box-sizing: border-box;
margin-right: 10px;
-webkit-transition: all 0.2s;
transition: all 0.2s;
opacity: .6;
left: 0;
opacity: 0;
background: url('../img/check.svg') no-repeat center;
background-size: 13px;
}
.checkbox-item .form-checkbox + label:before{
}
.checkbox-item .form-checkbox:checked + label:before{
opacity: 1;
background: url('../img/check.svg') no-repeat center;
background-size: 13px;
}
.w-100{
width: 100% !important;
}
.sms-action{
/* display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center; */
margin-top: 20px;
margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
.form-item .form-input--date{
width: 100%;
}
.form__title {
font-size: 16px;
}
.form-item .form-input, .form-item .t-datepicker {
height: 50px;
}
}
.disabled{
opacity: 0.3;
pointer-events: none;
}
.disabled+label{
opacity: 0.3;
pointer-events: none;
}
button[disabled=disabled], button:disabled {
opacity: 0.4;
}
.js-code-warning{
color: #88b56d;
text-align: center;
font-size: 15px;
display: block;
}
.modal{
max-width: 400px !important;
}
.modal h4.title{
text-align: center;
}
.modal p{
text-align: center;
}
.modal{
position: relative;
}
.loader-wrap{
width: 100%;
height: 100%;
background: rgba(255,255,255,0.5);
position: absolute;
z-index: 1000;
backdrop-filter: blur(8px);
left: 0;
top:0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
pointer-events: none;
}
.loader {
width: 48px;
height: 48px;
display: inline-block;
position: relative;
}
.loader::after,
.loader::before {
content: '';
box-sizing: border-box;
width: 48px;
height: 48px;
border: 2px solid rgb(182, 179, 179);
position: absolute;
left: 0;
top: 0;
animation: rotationBreak 3s ease-in-out infinite alternate;
}
.loader::after {
border-color: #36353e;
animation-direction: alternate-reverse;
}
.loader-info{
display: block;
width: 100%;
text-align: center;
font-size: 18px;
padding-left: 20px;
padding-right: 20px;
color: #3d2626;
font-weight: bold;
margin-bottom: 30px;
}
@keyframes rotationBreak {
0% {
transform: rotate(0);
}
25% {
transform: rotate(90deg);
}
50% {
transform: rotate(180deg);
}
75% {
transform: rotate(270deg);
}
100% {
transform: rotate(360deg);
}
}
.d-none{
display: none;
}
.form-item{
position: relative;
}
.form-item__dropdown{
position: absolute;
width: 100%;
background: #fff;
font-size: 13px;
box-shadow: 0 0 15px rgba(0,0,0,.05);
z-index: 123;
}
.form-item input[type="file"] +label{
background: none;
color:#999999;
text-decoration: underline;
padding-left: 0;
margin-left: 0;
font-weight: normal;
}
.fileList{
list-style: none;
padding-left: 0;
margin-left: 0;
}
.fileList li{
display: flex;
justify-content: space-between;
padding-top: 3px;
padding-bottom: 3px;
border-bottom: 1px solid #f5f2f2;
}
.fileList li strong{
width: 70%;
font-weight: normal;
font-size: 14px;
}
.fileList li span{
width: 20%;
font-size: 14px;
}
.fileList li .removefile{
width: 20px;
height: 20px;
background: url('../img/close.svg') no-repeat center;
background-size: 10px;
}
.upload-action{
display: flex;
justify-content: flex-end;
}
.disabled{
pointer-events: none;
opacity: 0.5;
}
.country-select{
width: 100% !important;
}
.form-row{
display: flex;
justify-content: space-between;
}
.form-col{
width: 48%;
}
.js-result{
color:#30cc11c2;
margin-top: 10px;
margin-bottom: 10px;
}
.js-result.danger{
color:#F95D51;
}
.js-result.form-item__warning--success{
color: #28a745 !important; /* Зеленый цвет для успешных сообщений */
}
.suсcess-upload{
margin-bottom: 2px;
margin-top: 2px;
}
.form-text{
margin-bottom: 30px;
margin-top: 30px;
text-align: center;
display: block;
}