/* ERP WaterSurf — тёмная тема, минималистичный интерфейс */ :root { --ws-bg-page: #0d1117; --ws-bg-surface: #161b22; --ws-bg-elevated: #21262d; --ws-bg-hover: #30363d; --ws-border: #30363d; --ws-border-focus: #58a6ff; --ws-text: #e6edf3; --ws-text-muted: #8b949e; --ws-accent: #2dd4bf; --ws-accent-hover: #5eead4; --ws-danger: #f87171; --ws-danger-bg: rgba(248, 113, 113, 0.12); --ws-success-bg: rgba(45, 212, 191, 0.12); --ws-radius: 8px; --ws-radius-sm: 6px; --ws-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); --ws-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; } * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { background: var(--ws-bg-page); color: var(--ws-text); font-family: var(--ws-font-sans); font-size: 15px; line-height: 1.6; min-height: 100vh; -webkit-font-smoothing: antialiased; } /* Навбар */ .navbar-ws { background: var(--ws-bg-surface) !important; border-bottom: 1px solid var(--ws-border); padding: 0.5rem 0; } .navbar-ws .navbar-brand { color: var(--ws-text) !important; font-weight: 600; font-size: 1.1rem; } .navbar-ws .navbar-brand:hover { color: var(--ws-accent) !important; } .navbar-ws .nav-link { color: var(--ws-text-muted) !important; border-radius: var(--ws-radius-sm); padding: 0.4rem 0.75rem !important; } .navbar-ws .nav-link:hover { color: var(--ws-text) !important; background: var(--ws-bg-hover); } .navbar-ws .dropdown-menu { background: var(--ws-bg-elevated); border: 1px solid var(--ws-border); border-radius: var(--ws-radius); box-shadow: var(--ws-shadow); padding: 0.25rem; } .navbar-ws .dropdown-item { color: var(--ws-text); border-radius: var(--ws-radius-sm); } .navbar-ws .dropdown-item:hover { background: var(--ws-bg-hover); color: var(--ws-text); } .navbar-ws .navbar-text { color: var(--ws-text-muted); font-size: 0.9rem; } .navbar-ws .navbar-toggler { border-color: var(--ws-border); color: var(--ws-text); } /* Контент */ .ws-main { max-width: 1200px; margin: 0 auto; padding: 1.5rem 1rem 3rem; } .ws-page-title { font-size: 1.5rem; font-weight: 600; margin-bottom: 1rem; color: var(--ws-text); } /* Карточки */ .ws-card { background: var(--ws-bg-surface); border: 1px solid var(--ws-border); border-radius: var(--ws-radius); padding: 1.25rem; margin-bottom: 1rem; } .ws-card-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1rem; } /* Таблицы */ .ws-table-wrap { overflow-x: auto; border-radius: var(--ws-radius); border: 1px solid var(--ws-border); } .ws-table { width: 100%; border-collapse: collapse; color: var(--ws-text); } .ws-table th, .ws-table td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid var(--ws-border); } .ws-table th { background: var(--ws-bg-elevated); font-weight: 600; font-size: 0.85rem; color: var(--ws-text-muted); text-transform: none; } .ws-table tbody tr:hover { background: var(--ws-bg-hover); } .ws-table tbody tr:last-child td { border-bottom: none; } .ws-table .ws-actions { white-space: nowrap; } .ws-table .ws-link { color: var(--ws-accent); text-decoration: none; font-size: 0.9rem; } .ws-table .ws-link:hover { color: var(--ws-accent-hover); text-decoration: underline; } .ws-table .ws-link-danger { color: var(--ws-danger); } .ws-table .ws-link-danger:hover { color: #fca5a5; } /* Кнопки */ .btn-ws-primary { background: var(--ws-accent); color: var(--ws-bg-page); border: none; border-radius: var(--ws-radius-sm); padding: 0.5rem 1rem; font-weight: 500; font-size: 0.9rem; } .btn-ws-primary:hover { background: var(--ws-accent-hover); color: var(--ws-bg-page); } .btn-ws-secondary { background: transparent; color: var(--ws-text-muted); border: 1px solid var(--ws-border); border-radius: var(--ws-radius-sm); padding: 0.5rem 1rem; font-size: 0.9rem; } .btn-ws-secondary:hover { background: var(--ws-bg-hover); color: var(--ws-text); border-color: var(--ws-border); } .btn-ws-danger { background: var(--ws-danger-bg); color: var(--ws-danger); border: 1px solid var(--ws-danger); border-radius: var(--ws-radius-sm); padding: 0.5rem 1rem; font-size: 0.9rem; } .btn-ws-danger:hover { background: var(--ws-danger); color: var(--ws-bg-page); } .ws-btn-group { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; } /* Формы */ .ws-form-group { margin-bottom: 1rem; } .ws-form-group label { display: block; font-weight: 500; font-size: 0.9rem; color: var(--ws-text-muted); margin-bottom: 0.35rem; } .ws-form-group input, .ws-form-group select, .ws-form-group textarea { width: 100%; max-width: 400px; padding: 0.5rem 0.75rem; background: var(--ws-bg-page); border: 1px solid var(--ws-border); border-radius: var(--ws-radius-sm); color: var(--ws-text); font-size: 0.95rem; } .ws-form-group input:focus, .ws-form-group select:focus, .ws-form-group textarea:focus { outline: none; border-color: var(--ws-border-focus); box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.25); } .ws-form-group input::placeholder, .ws-form-group textarea::placeholder { color: var(--ws-text-muted); opacity: 0.8; } .ws-form-login input, .ws-form-login input[type="text"], .ws-form-login input[type="password"] { width: 100%; max-width: 100%; padding: 0.5rem 0.75rem; background: var(--ws-bg-page); border: 1px solid var(--ws-border); border-radius: var(--ws-radius-sm); color: var(--ws-text); font-size: 0.95rem; } .ws-form-login input:focus { outline: none; border-color: var(--ws-border-focus); box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.25); } .ws-text-danger { color: var(--ws-danger); font-size: 0.85rem; display: block; margin-top: 0.25rem; } .ws-form-section { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--ws-border); } .ws-form-section-title { font-size: 1rem; font-weight: 600; margin-bottom: 0.75rem; color: var(--ws-text); } /* Сообщения (alerts) */ .ws-alert { padding: 0.75rem 1rem; border-radius: var(--ws-radius-sm); margin-bottom: 1rem; border: 1px solid transparent; } .ws-alert-success { background: var(--ws-success-bg); color: var(--ws-accent); border-color: rgba(45, 212, 191, 0.3); } .ws-alert-error, .ws-alert-danger { background: var(--ws-danger-bg); color: var(--ws-danger); border-color: rgba(248, 113, 113, 0.3); } .ws-alert-warning { background: rgba(251, 191, 36, 0.12); color: #fbbf24; border-color: rgba(251, 191, 36, 0.3); } .ws-alert .btn-close { filter: invert(1); opacity: 0.7; } /* Пустое состояние */ .ws-empty { text-align: center; padding: 2rem 1rem; color: var(--ws-text-muted); font-size: 0.95rem; } /* Логин */ .ws-login-card { max-width: 380px; margin: 2rem auto; padding: 2rem; } .ws-login-title { font-size: 1.5rem; font-weight: 600; margin-bottom: 1.5rem; text-align: center; } /* Главная */ .ws-hero { padding: 2rem 0; text-align: center; } .ws-hero h1 { font-size: 1.75rem; font-weight: 600; margin-bottom: 0.5rem; } .ws-hero p { color: var(--ws-text-muted); font-size: 1rem; } /* Подсказка удаления */ .ws-confirm-text { color: var(--ws-text-muted); margin-bottom: 1.25rem; } /* Таблица в форме заказа — инпуты */ .ws-table input.form-control, .ws-table select.form-select, .ws-table input[type="text"], .ws-table input[type="number"], .ws-table select { background: var(--ws-bg-page); border: 1px solid var(--ws-border); color: var(--ws-text); padding: 0.4rem 0.5rem; font-size: 0.9rem; } .ws-form-card .ws-form-group input, .ws-form-card .ws-form-group select, .ws-form-card .ws-form-group textarea { max-width: 100%; } .ws-table input[type="checkbox"] { width: 1rem; height: 1rem; accent-color: var(--ws-accent); } .ws-table input:focus, .ws-table select:focus { border-color: var(--ws-border-focus); box-shadow: 0 0 0 2px rgba(88, 166, 255, 0.2); } /* Списки документов — выравнивание чисел */ .ws-table .ws-num { text-align: right; font-variant-numeric: tabular-nums; }