.gradient-bg { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); } .card-gradient { background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); } .card-gradient-2 { background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); } .card-gradient-3 { background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%); } .card-gradient-4 { background: linear-gradient(135deg, #fa709a 0%, #fee140 100%); } .btn-primary { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); transition: all 0.3s ease; } .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(102, 126, 234, 0.3); } .btn-success { background: linear-gradient(135deg, #56ab2f 0%, #a8e6cf 100%); } .btn-danger { background: linear-gradient(135deg, #ff416c 0%, #ff4b2b 100%); } .animate-fade-in { animation: fadeIn 0.5s ease-in; } @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .form-input { transition: all 0.3s ease; border: 2px solid #e2e8f0; } .form-input:focus { border-color: #667eea; box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1); } .stats-card { transition: all 0.3s ease; } .stats-card:hover { transform: translateY(-5px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1); } /* Исправление модальных окон */ .modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); display: none; justify-content: center; align-items: center; z-index: 1000; overflow: hidden; /* Блокируем прокрутку фона */ } .modal.show { display: flex; } .modal-content { background: white; border-radius: 12px; padding: 0; width: 90%; max-width: 800px; max-height: 90vh; /* Ограничиваем высоту модального окна */ display: flex; flex-direction: column; box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25); position: relative; overflow: hidden; /* Контролируем overflow на уровне контейнера */ } .modal-header { padding: 1.5rem; border-bottom: 1px solid #e5e7eb; flex-shrink: 0; /* Заголовок не сжимается */ } .modal-body { padding: 1.5rem; overflow-y: auto; /* Прокрутка только для содержимого */ flex-grow: 1; /* Занимает доступное пространство */ max-height: calc(90vh - 120px); /* Оставляем место для заголовка и футера */ } .modal-footer { padding: 1.5rem; border-top: 1px solid #e5e7eb; flex-shrink: 0; /* Футер не сжимается */ background: #f9fafb; } /* Блокировка прокрутки body при открытом модальном окне */ body.modal-open { overflow: hidden; } /* Улучшенные стили для блоков в отчете */ .report-section { background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%); border-left: 4px solid #667eea; margin-bottom: 1.5rem; padding: 1.5rem; border-radius: 8px; } .report-section.income { border-left-color: #10b981; background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%); } .report-section.expenses { border-left-color: #ef4444; background: linear-gradient(135deg, #fef2f2 0%, #fecaca 100%); } .report-section.wages { border-left-color: #f59e0b; background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%); } /* Скроллбар для модального окна */ .modal-body::-webkit-scrollbar { width: 8px; } .modal-body::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 4px; } .modal-body::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 4px; } .modal-body::-webkit-scrollbar-thumb:hover { background: #a1a1a1; } /* Цвета текста для дашборда */ .text-white-contrast { color: #ffffff !important; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3); }