:root { --primary-color: #e63946; --secondary-color: #1d3557; --accent-color: #f1faee; --text-color: #2b2d42; --background-color: #f8f9fa; --card-bg: #ffffff; --footer-bg: #1d3557; } body { background-color: var(--background-color); color: var(--text-color); font-family: 'Roboto', sans-serif; min-height: 100vh; display: flex; flex-direction: column; } main { flex: 1 0 auto; padding: 2rem 0; } .navbar { background-color: var(--secondary-color) !important; border-bottom: 2px solid var(--primary-color); box-shadow: 0 2px 4px rgba(0,0,0,0.1); } .navbar-brand { color: var(--accent-color) !important; font-weight: bold; font-size: 1.5rem; } .nav-link { color: var(--accent-color) !important; transition: color 0.3s ease; } .nav-link:hover { color: var(--primary-color) !important; } .card { background-color: var(--card-bg); border: 1px solid rgba(0,0,0,0.1); border-radius: 10px; transition: transform 0.3s ease, box-shadow 0.3s ease; box-shadow: 0 2px 4px rgba(0,0,0,0.05); } .card:hover { transform: translateY(-5px); box-shadow: 0 5px 15px rgba(230, 57, 70, 0.2); } .card-title { color: var(--primary-color); } .btn-primary { background-color: var(--primary-color); border-color: var(--primary-color); transition: all 0.3s ease; } .btn-primary:hover { background-color: #d62839; border-color: #d62839; transform: translateY(-2px); } .btn-outline-primary { color: var(--primary-color); border-color: var(--primary-color); transition: all 0.3s ease; } .btn-outline-primary:hover { background-color: var(--primary-color); border-color: var(--primary-color); transform: translateY(-2px); } .footer { background-color: var(--footer-bg) !important; border-top: 2px solid var(--primary-color); color: var(--accent-color); padding: 1.5rem 0; margin-top: auto; } .hero-section { background: linear-gradient(rgba(29, 53, 87, 0.8), rgba(29, 53, 87, 0.8)), url('../images/hero-bg.jpg') center/cover; padding: 100px 0; margin-bottom: 50px; } .feature-icon { color: var(--primary-color); font-size: 2.5rem; margin-bottom: 1rem; } .alert { background-color: var(--card-bg); border-color: var(--primary-color); color: var(--text-color); border-radius: 10px; } /* Стили для форм */ .form-container { background-color: var(--card-bg); padding: 2rem; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); max-width: 500px; margin: 2rem auto; } .form-title { color: var(--primary-color); margin-bottom: 1.5rem; text-align: center; } .form-control { border-radius: 5px; border: 1px solid #dee2e6; padding: 0.75rem; transition: border-color 0.3s ease, box-shadow 0.3s ease; } .form-control:focus { border-color: var(--primary-color); box-shadow: 0 0 0 0.2rem rgba(230, 57, 70, 0.25); } .form-label { color: var(--secondary-color); font-weight: 500; } .form-text { color: #6c757d; } /* Анимации */ @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } .pulse { animation: pulse 2s infinite; } /* Стили для сообщений об ошибках */ .errorlist { color: var(--primary-color); list-style: none; padding: 0; margin: 0.5rem 0; } /* Стили для кнопок в формах */ .form-btn { width: 100%; padding: 0.75rem; font-size: 1.1rem; margin-top: 1rem; } /* Стили для ссылок в формах */ .form-link { color: var(--primary-color); text-decoration: none; transition: color 0.3s ease; } .form-link:hover { color: #d62839; text-decoration: underline; }