/* admin_style.css (v9.66.17 - Styles for AJAX version with UI Enhancements) */
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; line-height: 1.65; margin: 0; background-color: #f8f9fa; color: #212529; font-size: 16px; }
.container { max-width: 1800px; margin: 25px auto; padding: 25px; background-color: #fff; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.08); }
.login-form { max-width: 350px; margin: 60px auto; padding: 35px; background-color: #fff; border: 1px solid #dee2e6; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.08); }
.message { color: #0f5132; background-color: #d1e7dd; border: 1px solid #badbcc; padding: 10px 15px; border-radius: 4px; margin-bottom: 15px; text-align: center; }
.error { color: #842029; background-color: #f8d7da; border: 1px solid #f5c2c7; padding: 10px 15px; border-radius: 4px; margin-bottom: 15px; text-align: center; }
.header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 15px; border-bottom: 1px solid #dee2e6; margin-bottom: 20px; flex-wrap: wrap; gap: 10px;}
.header h1 { margin: 0; font-size: 1.8em; color: #343a40; }
.header-nav { display: flex; align-items: center; gap: 15px; flex-wrap: wrap;}
.header-nav a { text-decoration: none; color: #0d6efd; font-weight: 500;}
.header-nav a:hover { text-decoration: underline;}
.logout-link { text-decoration: none; color: #0d6efd; font-weight: 500; padding: 5px 10px; border: 1px solid transparent; border-radius: 4px; margin-left: 15px;}
.logout-link:hover { text-decoration: none; background-color: #e2e6ea; border-color: #dae0e5;}
h2 { color: #495057; border-bottom: 1px solid #dee2e6; padding-bottom: 8px; margin: 40px 0 20px 0; }
h2:first-of-type { margin-top: 0; }
.back-link { margin-bottom: 15px; display: inline-block; color: #0d6efd; text-decoration: none; font-weight: 500; }
.back-link:hover { text-decoration: underline; }
/* --- Filter Forms --- */
.kaskad-filter-form, .date-filter-form, .keyword-search-form { margin-bottom: 15px; padding: 10px 15px; background-color: #f8f9fa; border: 1px solid #dee2e6; border-radius: 5px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.kaskad-filter-form label, .date-filter-form label, .keyword-search-form label { font-weight: 500; color: #495057; white-space: nowrap; margin-right: 5px; margin-bottom: 0;}
.kaskad-filter-form select, .date-filter-form input[type="date"], .keyword-search-form input[type="text"], .keyword-search-form select { display: inline-block; width: auto; padding: 6px 10px; border: 1px solid #ced4da; border-radius: 4px; font-size: 0.9em; margin-bottom: 0;}
.keyword-search-form input[type="text"] { flex-grow: 1; min-width: 150px; }
.date-filter-form button, .keyword-search-form button { padding: 7px 15px; font-size: 0.9em; cursor: pointer; border-radius: 4px; border: none; transition: background-color 0.2s ease; }
.date-filter-form button[type="submit"], .keyword-search-form button { background-color: #0d6efd; color: white; }
.date-filter-form button[type="submit"]:hover, .keyword-search-form button:hover { background-color: #0b5ed7; }
.date-filter-form a.reset-button, .keyword-search-form a.reset-button, .kaskad-filter-form a.reset-button { display: inline-block; padding: 6px 12px; font-size: 0.9em; cursor: pointer; border-radius: 4px; background-color: #6c757d; color: white; text-decoration: none; margin-left: 5px; transition: background-color 0.2s ease; line-height: normal; }
.date-filter-form a.reset-button:hover, .keyword-search-form a.reset-button:hover, .kaskad-filter-form a.reset-button:hover { background-color: #5a6268; }
/* --- Add Project Form --- */
.add-project-form { max-width: 600px; margin-top: 25px; padding: 25px; border: 1px solid #dee2e6; border-radius: 5px; background-color: #f8f9fa;} .add-project-form div { margin-bottom: 15px; } .add-project-form label { display: block; margin-bottom: 5px; font-weight: 500; } .add-project-form input[type="text"], .add-project-form input[type="number"], .add-project-form input[type="file"] { display: block; width: 100%; padding: 8px 10px; border: 1px solid #ced4da; border-radius: 4px; box-sizing: border-box; } .add-project-form input[type="file"] { padding: 5px; } .add-project-form button { padding: 10px 20px; font-size: 1em; background-color: #198754; color: white; border: none; border-radius: 4px; cursor: pointer; transition: background-color 0.2s ease; } .add-project-form button:hover { background-color: #157347; } .form-notes { font-size: 0.9em; color: #6c757d; margin-top: 10px; }
/* --- Tables --- */
.table-wrapper { overflow-x: auto; width: 100%; margin-bottom: 1rem; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; margin-top: 20px; table-layout: auto; font-size: 0.9em; }
th, td { border: 1px solid #dee2e6; padding: 8px 12px; text-align: left; vertical-align: middle; word-wrap: break-word; }
th { background-color: #f1f3f5; color: #495057; font-weight: 600; white-space: nowrap; }
th a { color: inherit; text-decoration: none; display: block; } th a:hover { color: #0056b3; }
td { background-color: #fff; transition: background-color 0.15s ease-in-out; }
tr:nth-child(even) td { background-color: #f8f9fa; }
tr:hover td { background-color: #e9ecef; }
.summary-table td:nth-child(1) a, .keyword-summary-table td a { font-weight: 500; color: #0056b3; }
.keyword-summary-table td a:hover { text-decoration: underline;}
.summary-details { font-size: 0.85em; color: #6c757d; white-space: nowrap; display: block; line-height: 1.3; margin-top: 3px; }
/* Table Inputs */
.summary-table input[type="text"].kaskad-input { width: calc(100% - 10px); padding: 3px 5px; border: 1px solid #ced4da; border-radius: 3px; font-size: 0.9em; box-sizing: border-box; margin-top: 4px; display: block; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; }
.summary-table input[type="number"] { width: 60px; padding: 3px 5px; border: 1px solid #ced4da; border-radius: 3px; text-align: right; font-size: 0.9em; -moz-appearance: textfield; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; }
.project-keys-table input[type="text"] { width: 95%; padding: 4px 6px; font-size: 0.95em; border: 1px solid #ced4da; border-radius: 3px; box-sizing: border-box; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; }
.project-keys-table input[type="number"].frequency-input,
.dirty-nf-keys-table input[type="number"].frequency-input { width: 60px; padding: 4px 6px; font-size: 0.95em; text-align: center; border: 1px solid #ced4da; border-radius: 3px; -moz-appearance: textfield; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;}
input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.actions-cell input[type="checkbox"] { vertical-align: middle; cursor: pointer; }
/* Specific Alignments & Widths */
.summary-table th:nth-child(1), .summary-table td:nth-child(1) { width: 35%; text-align: left; }
.summary-table th:nth-child(2), .summary-table td:nth-child(2) { width: 7%; text-align: center; }
.summary-table th:nth-child(3), .summary-table td:nth-child(3) { width: 8%; text-align: right; }
.summary-table th:nth-child(n+4):not(:last-child), .summary-table td:nth-child(n+4):not(:last-child) { width: 10%; text-align: right;}
.summary-table th:last-child, .summary-table td:last-child { text-align: center; }
.keyword-summary-table th:nth-child(1), .keyword-summary-table td:nth-child(1) { width: 30%; }
.keyword-summary-table th:nth-child(n+2), .keyword-summary-table td:nth-child(n+2) { text-align: center;}
.project-keys-table th:nth-child(1), .project-keys-table td:nth-child(1) { width: 4%; text-align: center; }
.project-keys-table th:nth-child(2), .project-keys-table td:nth-child(2) { width: 7%; text-align: center; }
/* ... (other project keys widths if needed) ... */
.project-keys-table th:last-child, .project-keys-table td:last-child { text-align: center; }
.dirty-nf-keys-table th:nth-child(1), .dirty-nf-keys-table td:nth-child(1) { width: 24%; }
.dirty-nf-keys-table th:nth-child(n+2), .dirty-nf-keys-table td:nth-child(n+2) { text-align: center; }
.dirty-nf-keys-table th:last-child, .dirty-nf-keys-table td:last-child { text-align: center; }
/* Status */
.status-active { color: #198754; font-weight: bold; } .status-inactive { color: #dc3545; }
.status-toggle-button { padding: 2px 6px; font-size: 0.85em; border-radius: 3px; border: 1px solid; cursor: pointer; line-height: 1.2; display: inline-block; }
.status-toggle-button.activate { background-color: #d1e7dd; border-color: #a3cfbb; color: #0a3622; }
.status-toggle-button.deactivate { background-color: #f8d7da; border-color: #f1aeb5; color: #58151c; }
.status-toggle-button:hover:not([disabled]) { filter: brightness(95%); }
/* --- Action Containers & Buttons --- */
.summary-actions-container, .table-actions-container { margin-top: 15px; display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px; background-color: #f8f9fa; border: 1px solid #dee2e6; border-radius: 5px;}
.summary-actions-container .left-actions, .summary-actions-container .right-actions,
.table-actions-container .left-actions, .table-actions-container .right-actions { display: flex; gap: 10px; align-items: center; }
.summary-actions-container button, .table-actions-container button { padding: 8px 15px; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 0.95em; white-space: nowrap; transition: background-color 0.2s ease, filter 0.2s ease; }
.summary-actions-container button:hover:not([disabled]), .table-actions-container button:hover:not([disabled]) { filter: brightness(90%); }
.summary-actions-container button:disabled, .table-actions-container button:disabled { background-color: #adb5bd; cursor: not-allowed; }
button.save-button { background-color: #198754; } /* Green */
button.delete-button { background-color: #dc3545; } /* Red */
button.activate-selected { background-color: #198754; } /* Green */
button.deactivate-selected { background-color: #6c757d; } /* Gray */
button.update-button { background-color: #0d6efd; } /* Blue */
/* --- Mass Frequency --- */
.mass-frequency-form { margin-bottom: 15px; padding: 10px 15px; background-color: #f8f9fa; border: 1px solid #dee2e6; border-radius: 5px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mass-frequency-form label { font-weight: 500; color: #495057; margin-bottom: 0; margin-right: 5px; }
.mass-frequency-form input[type="number"] { width: 80px; padding: 4px 8px; border: 1px solid #ced4da; border-radius: 4px; font-size: 0.95em; text-align: center; margin-bottom: 0; box-sizing: border-box; -moz-appearance: textfield; }
.mass-frequency-form input[type=number]::-webkit-outer-spin-button, .mass-frequency-form input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.mass-frequency-form button { padding: 5px 12px; font-size: 0.9em; color: white; border: none; border-radius: 4px; cursor: pointer; background-color: #198754; transition: background-color 0.2s ease; }
.mass-frequency-form button:hover { background-color: #157347; filter: none; }
.mass-frequency-form span { font-size: 0.85em; color: #6c757d; margin-left: 5px; }
/* --- Pagination --- */
.pagination-controls { margin-top: 15px; margin-bottom: 20px; padding: 10px; background-color: #f8f9fa; border: 1px solid #e9ecef; border-radius: 4px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px; font-size: 0.9em;}
.pagination-controls .count-info { color: #6c757d; }
.pagination-controls .limit-selector { display: flex; align-items: center; gap: 5px; color: #6c757d; }
.pagination-controls .limit-selector select { font-size: 0.95em; padding: 3px 5px; border: 1px solid #ced4da; border-radius: 3px; margin-right: 5px;}
.pagination-controls .limit-selector button { padding: 4px 8px; font-size: 0.9em;}
.pagination-controls .load-buttons { display: flex; gap: 10px; flex-wrap: wrap;}
.pagination-controls .load-buttons a { display: inline-block; padding: 5px 12px; text-decoration: none; color: white; border-radius: 4px; font-size: 0.9em; transition: background-color 0.2s ease; text-align: center;}
.pagination-controls .load-buttons a.load-more { background-color: #0d6efd; }
.pagination-controls .load-buttons a.load-more:hover { background-color: #0b5ed7; }
/* Select All */
.actions-header { vertical-align: middle; }
.select-all-trigger { font-size: 0.9em; color: #0d6efd; cursor: pointer; text-decoration: none; white-space: nowrap; transition: color 0.2s ease, text-decoration 0.2s ease; }
.select-all-trigger:hover { color: #0b5ed7; text-decoration: underline; }
/* Input Highlighting */
.input-edited { border-color: #fd7e14 !important; background-color: #fff3e0 !important; box-shadow: 0 0 3px rgba(253, 126, 20, 0.5); }
/* Chart */
.chart-container {
    margin: 30px 0; /* Увеличим отступы */
    border: 1px solid #dee2e6;
    padding: 20px; /* Увеличим внутренний отступ */
    box-sizing: border-box;
    background-color: #fff; /* Добавим фон для контраста */
    border-radius: 5px; /* Слегка скруглим углы */
    min-height: 300px; /* <-- ДОБАВЛЕНО: Задаем минимальную высоту */
    position: relative; /* Добавим для правильного ресайза canvas */
}

.chart-container h3 {
    margin-top: 0;
    margin-bottom: 15px;
    text-align: center;
    color: #495057;
    font-weight: 500;
}

.chart-wrapper {
    position: relative;
    height: 400px; /* Задаем фиксированную высоту для читаемости */
    width: 100%;
    margin-bottom: 25px; /* Добавим отступ между графиками */
}

.chart-wrapper:last-child {
    margin-bottom: 0;
}

/* Убираем старые, возможно конфликтующие стили для .chart-container */
/* .chart-container { position: relative; height: 35vh; width: 100%; margin: 20px 0; border: 1px solid #dee2e6; padding: 15px; box-sizing: border-box; } */
.chart-container.hidden { display: none; }
p.no-chart-data { display: none; margin-top: -10px; margin-bottom: 10px; color: #6c757d; text-align: center; font-style: italic; }
/* Tabs */
.detail-tabs { margin: 25px 0 15px; padding-bottom: 10px; border-bottom: 1px solid #dee2e6; display: flex; gap: 20px; flex-wrap: wrap; }
.detail-tabs a { text-decoration: none; padding: 10px 18px; font-weight: 500; color: #6c757d; border-radius: 5px 5px 0 0; border: 1px solid transparent; border-bottom: none; white-space: nowrap; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; }
.detail-tabs a:hover { background-color: #e9ecef; color: #495057; border-color: transparent; }
.detail-tabs a.active { color: #0d6efd; background-color: #fff; border-color: #dee2e6 #dee2e6 #fff #dee2e6; position: relative; top: 1px; font-weight: 600; }
/* --- AJAX Feedback --- */
#ajax-spinner { display: none; position: fixed; top: 10px; right: 10px; width: 25px; height: 25px; border: 4px solid rgba(0, 0, 0, 0.1); border-top-color: #0d6efd; border-radius: 50%; animation: spin 1s linear infinite; z-index: 1001; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
#ajax-toast { display: none; position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); background-color: #333; color: white; padding: 12px 20px; border-radius: 5px; z-index: 1000; font-size: 0.9em; box-shadow: 0 2px 5px rgba(0,0,0,0.2); transition: opacity 0.3s ease-in-out; opacity: 0;}
#ajax-toast.error { background-color: #dc3545; }
#ajax-toast.success { background-color: #198754; }
/* --- Row Update Highlight --- */
@keyframes highlight-fade { from { background-color: #d1e7dd; } to { background-color: transparent; } }
tr.row-updated > td { animation: highlight-fade 2s ease-out; }
/* Responsive */
@media (max-width: 768px) {
    .summary-actions-container, .table-actions-container { flex-direction: column; align-items: stretch; gap: 10px; }
    .summary-actions-container .left-actions, .summary-actions-container .right-actions, .table-actions-container .left-actions, .table-actions-container .right-actions { width: 100%; justify-content: center;}
    .summary-actions-container .left-actions, .table-actions-container .left-actions { margin-bottom: 10px; flex-wrap: wrap;}
    .summary-actions-container button, .table-actions-container button { width: auto; flex-grow: 1; min-width: 100px; }
    .summary-actions-container .right-actions button, .table-actions-container .right-actions button { min-width: 150px; }
    .kaskad-filter-form, .date-filter-form, .keyword-search-form, .mass-frequency-form { flex-direction: column; align-items: stretch;}
    .kaskad-filter-form select, .date-filter-form input, .keyword-search-form input, .keyword-search-form select, .mass-frequency-form input { width: 100%; }
    .mass-frequency-form span { margin-left: 0; text-align: center; display: block; margin-top: 5px;}
}
/* Focus state for inputs/selects */
input[type="text"]:focus, input[type="number"]:focus, input[type="date"]:focus, input[type="file"]:focus, select:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}