* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter',sans-serif; background: url('bg-tamak2.jpg') no-repeat center center fixed; background-size: cover; color:#1e2a32; overflow-x:hidden; min-height: 100vh; }
body::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.15); z-index: -1; }
:root { --tamak-green:#007A48; --tamak-green-light:#e0f2e9; --tamak-green-dark:#005a36; --tamak-white:#FFFFFF; --tamak-gray:#4a627a; --tamak-border:#d4e2dc; --tamak-bg-light:#f8fbf9; }
.app-header { background:var(--tamak-white); border-bottom:1px solid var(--tamak-border); padding:12px 32px; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:16px; }
.app-header .logo-area { display:flex; align-items:center; gap:12px; }
.app-header .logo-svg { width:44px; height:44px; }
.app-header .logo-text { font-weight:700; font-size:22px; color:#007A48; letter-spacing:-0.5px; line-height:1.2; }
.order-checkbox, .d-select-all, .m-select-all { width: 18px; height: 18px; cursor: pointer; accent-color: #007A48; }
.delete-selected-btn { margin-bottom: 12px; }
.app-header .logo-sub { font-size:14px; color:#007A48; margin-top:2px; }
.role-switcher { display:flex; gap:6px; background:#f1f5f9; border-radius:40px; padding:4px; border:1px solid var(--tamak-border); }
.role-btn { padding:8px 24px; border:none; border-radius:30px; font-weight:600; font-size:0.85rem; cursor:pointer; background:transparent; color:#4a627a; transition:0.25s; font-family:inherit; }
.role-btn.active-role { background:var(--tamak-green); color:#fff; box-shadow:0 2px 8px rgba(0,122,72,0.25); }
.role-btn:hover:not(.active-role) { background:#e2e8f0; }
.role-btn i { margin-right:6px; }
.logout-btn { background: #d32f2f; color: white; border: none; padding: 8px 20px; border-radius: 30px; font-weight: 600; font-size: 0.85rem; cursor: pointer; transition: 0.25s; font-family: inherit; }
.logout-btn:hover { background: #b71c1c; }
#soundToggleBtn { background:transparent; border:none; cursor:pointer; font-size:1.2rem; padding:6px 10px; transition: 0.2s; }
#soundToggleBtn:hover { transform: scale(1.15); }
.header-actions { display:flex; align-items:center; gap:8px; }
.cabinet { display:none; animation:fadeCabinet 0.3s ease; }
.cabinet.active-cabinet { display:block; }
@keyframes fadeCabinet { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
.d-top-header { background:var(--tamak-white); border-bottom:1px solid var(--tamak-border); padding:12px 28px; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.d-top-header .d-manager-info { background:var(--tamak-green-light); border-radius:30px; padding:6px 16px; font-size:0.82rem; color:var(--tamak-green-dark); display:flex; align-items:center; gap:14px; }
.d-news-bell { position:relative; cursor:pointer; font-size:1.3rem; color:var(--tamak-green); }
.d-news-badge { position:absolute; top:-8px; right:-12px; background:red; color:white; border-radius:20px; padding:2px 6px; font-size:0.65rem; font-weight:bold; }
.d-tabs-container { background:var(--tamak-white); border-bottom:1px solid var(--tamak-border); padding:0 16px; overflow-x:auto; }
.d-tabs-list { display:inline-flex; gap:4px; }
.d-tab-btn { display:inline-flex; align-items:center; gap:6px; padding:12px 16px; font-size:0.82rem; font-weight:500; color:#2c3e50; background:transparent; border:none; border-bottom:3px solid transparent; cursor:pointer; white-space:nowrap; position:relative; }
.d-tab-btn i { font-size:1rem; color:#5b7a9a; }
.d-tab-btn.active { color:var(--tamak-green); border-bottom-color:var(--tamak-green); }
.d-tab-btn.active i { color:var(--tamak-green); }
.d-tab-btn:hover:not(.active) { background:#f1f5f9; border-radius:12px 12px 0 0; }
.d-tab-badge { position:absolute; top:4px; right:4px; background:#d32f2f; color:white; border-radius:20px; padding:1px 6px; font-size:0.6rem; font-weight:bold; min-width:16px; text-align:center; line-height:1.4; }
.d-main-content { padding:22px 28px; max-width:1600px; margin:0 auto; }
.d-section { display:none; }
.d-section.active-section { display:block; }
.m-top-header { background:var(--tamak-white); border-bottom:1px solid var(--tamak-border); padding:12px 28px; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:16px; }
.m-top-header .m-manager-info { background:var(--tamak-green-light); border-radius:30px; padding:6px 16px; font-size:0.82rem; color:var(--tamak-green-dark); display:flex; align-items:center; gap:14px; }
.m-news-bell { position:relative; cursor:pointer; font-size:1.3rem; color:var(--tamak-green); }
.m-news-badge { position:absolute; top:-8px; right:-12px; background:red; color:white; border-radius:20px; padding:2px 6px; font-size:0.65rem; font-weight:bold; }
.m-tabs-container { background:var(--tamak-white); border-bottom:1px solid var(--tamak-border); padding:0 16px; overflow-x:auto; }
.m-tabs-list { display:inline-flex; gap:4px; }
.m-tab-btn { display:inline-flex; align-items:center; gap:6px; padding:12px 16px; font-size:0.82rem; font-weight:500; color:#2c3e50; background:transparent; border:none; border-bottom:3px solid transparent; cursor:pointer; white-space:nowrap; position:relative; }
.m-tab-btn i { font-size:1rem; color:#5b7a9a; }
.m-tab-btn.active { color:var(--tamak-green); border-bottom-color:var(--tamak-green); }
.m-tab-btn.active i { color:var(--tamak-green); }
.m-tab-btn:hover:not(.active) { background:#f1f5f9; border-radius:12px 12px 0 0; }
.m-tab-badge { position:absolute; top:4px; right:4px; background:#d32f2f; color:white; border-radius:20px; padding:1px 6px; font-size:0.6rem; font-weight:bold; min-width:16px; text-align:center; line-height:1.4; }
.m-main-content { padding:22px 28px; max-width:none; width:100%; box-sizing:border-box; margin:0 auto; }
.m-section { display:none; }
.m-section.active-section { display:block; }
.card { background:var(--tamak-white); border-radius:24px; box-shadow:0 4px 12px rgba(0,122,72,0.05); padding:22px 26px; margin-bottom:24px; border:1px solid var(--tamak-border); }
.card-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; flex-wrap:wrap; gap:10px; }
.card-header h3 { font-weight:600; font-size:1.25rem; color:var(--tamak-green); }
.btn-primary { background:var(--tamak-green); color:white; border:none; padding:9px 18px; border-radius:40px; font-weight:500; cursor:pointer; font-size:0.8rem; display:inline-flex; align-items:center; gap:6px; transition:0.2s; }
.btn-primary:hover { background:var(--tamak-green-dark); transform:translateY(-1px); }
.btn-outline { background:transparent; border:1px solid var(--tamak-green); color:var(--tamak-green); padding:7px 14px; border-radius:30px; font-weight:500; cursor:pointer; font-size:0.8rem; transition:0.2s; }
.btn-outline:hover { background:var(--tamak-green-light); }
.btn-danger-sm { background:#ffe6e6; color:#d32f2f; border:1px solid #d32f2f; padding:4px 10px; border-radius:20px; font-weight:500; cursor:pointer; font-size:0.75rem; transition:0.2s; }
.btn-danger-sm:hover { background:#d32f2f; color:#fff; }
.btn-edit-sm { background:#e6f7e6; color:#007A48; border:1px solid #007A48; padding:4px 10px; border-radius:20px; font-weight:500; cursor:pointer; font-size:0.75rem; transition:0.2s; }
.btn-edit-sm:hover { background:#007A48; color:#fff; }
table { width:100%; border-collapse:collapse; font-size:0.82rem; display:block; overflow-x:auto; }
table th, table td { overflow-wrap:anywhere; word-break:break-word; }
#mOrdersTable { display:table; max-width:100%; font-size:clamp(0.62rem, 0.72vw, 0.82rem); table-layout:fixed; }
#mOrdersTable th, #mOrdersTable td { padding:7px 5px; vertical-align:middle; }
#mOrdersTable th:nth-child(1), #mOrdersTable td:nth-child(1) { width:30px; }
#mOrdersTable th:nth-child(2) { width:7%; }
#mOrdersTable th:nth-child(3) { width:9%; }
#mOrdersTable th:nth-child(4) { width:6%; }
#mOrdersTable th:nth-child(5) { width:10%; }
#mOrdersTable th:nth-child(6) { width:6%; }
#mOrdersTable th:nth-child(7) { width:9%; }
#mOrdersTable th:nth-child(8) { width:7%; }
#mOrdersTable th:nth-child(9) { width:6%; }
#mOrdersTable th:nth-child(10) { width:8%; }
#mOrdersTable th:nth-child(11) { width:8%; }
#mOrdersTable th:nth-child(12) { width:12%; }
#mOrdersTable th:nth-child(13) { width:12%; }
th, td { text-align:left; padding:10px 6px; border-bottom:1px solid var(--tamak-border); white-space:nowrap; }
th { color:var(--tamak-green-dark); font-weight:600; background-color:#f8fbf9; cursor:pointer; user-select:none; }
.status-badge { background:#e6f7e6; color:var(--tamak-green-dark); border-radius:40px; padding:3px 10px; font-size:0.7rem; display:inline-block; }
.status-warning { background:#fff3e0; color:#b45f06; }
.status-danger { background:#ffe6e6; color:#cc0000; }
/* Компактные цветные значки статуса заказа (вместо длинного текста) */
.st-badge { display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:22px; padding:0 6px; border-radius:5px; font-size:0.68rem; font-weight:700; line-height:1; white-space:nowrap; cursor:default; }
.st-badge + .st-badge { margin-left:3px; }
.st-new { background:#e3f2fd; color:#0d47a1; }            /* Новый */
.st-agreed { background:#e6f7e6; color:#007A48; }          /* Согласовано */
.st-rejected { background:#ffe6e6; color:#cc0000; }        /* Не согласовано */
.st-paid { background:#d7f0e8; color:#0b6e4f; }            /* Оплачено */
.st-unpaid { background:#ffebee; color:#b71c1c; }          /* Не оплачено */
.st-shipped { background:#ede7f6; color:#4527a0; }         /* Отгружено */
.st-done { background:#e0e0e0; color:#37474f; }            /* Завершён */
.st-canceled { background:#eceff1; color:#607d8b; }        /* Аннулирован */
.st-accepted { background:#e8f5e9; color:#1b5e20; }        /* Принято */
.st-notaccepted { background:#fbe9e7; color:#bf360c; }     /* Не принято */
.st-progress { background:#e3f2fd; color:#1976d2; }        /* В обработке */
.filter-row { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:16px; align-items:center; }
.filter-row select, .filter-row input { padding:7px 12px; border-radius:30px; border:1px solid var(--tamak-border); background:white; font-family:inherit; font-size:0.8rem; }
.search-box { border:1px solid var(--tamak-border); border-radius:48px; padding:6px 14px; display:flex; align-items:center; gap:8px; background:var(--tamak-bg-light); }
.search-box input { border:none; background:transparent; outline:none; width:160px; font-size:0.8rem; }
.grid-2cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:20px; }
.grid-3cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:18px; }
.tabs-mini { display:flex; gap:10px; border-bottom:1px solid var(--tamak-border); margin-bottom:16px; }
.tab-mini { padding:6px 4px 10px; cursor:pointer; font-weight:500; color:#5e7188; border-bottom:2px solid transparent; font-size:0.82rem; }
.tab-mini.active-tab { color:var(--tamak-green); border-bottom-color:var(--tamak-green); }
.deadline-critical { background-color:#ffe6e6; color:#cc0000; font-weight:600; }
.deadline-warning { background-color:#fff3e0; color:#e67e22; }
.modal { display:none; position:fixed; z-index:1000; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.5); align-items:center; justify-content:center; }
.modal-content { background:white; border-radius:28px; max-width:800px; width:92%; padding:24px; max-height:90vh; overflow-y:auto; }
.modal-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; border-bottom:1px solid var(--tamak-border); padding-bottom:10px; }
.modal-header h3 { color:var(--tamak-green); }
.close-modal { font-size:28px; cursor:pointer; color:#aaa; background:none; border:none; }
.form-group { margin-bottom:16px; }
.form-group label { display:block; font-weight:600; margin-bottom:6px; font-size:0.85rem; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:9px 12px; border:1px solid var(--tamak-border); border-radius:14px; font-family:inherit; font-size:0.9rem; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
.cart-item { display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid #eee; flex-wrap:wrap; gap:6px; }
.client-card { cursor:pointer; border:1px solid var(--tamak-border); border-radius:16px; padding:14px; transition:0.2s; }
.client-card:hover { box-shadow:0 4px 8px rgba(0,0,0,0.05); }
.chart-container { position:relative; width:100%; max-width:600px; margin:0 auto; }
.sort-icon { font-size:0.65rem; margin-left:3px; color:#aaa; }
.greeting-block { margin-bottom:22px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.greeting-block h2 { font-size:1.6rem; font-weight:600; color:var(--tamak-green-dark); }
.greeting-highlight { color:#005a36; font-weight:600; font-size:1.05rem; margin-top:6px; }
@media (max-width:780px) { .app-header { padding:10px 16px; } .role-btn { padding:6px 14px; font-size:0.75rem; } .d-main-content, .m-main-content { padding:16px; } .card { padding:16px; } .d-tab-btn, .m-tab-btn { padding:8px 12px; font-size:0.75rem; } .d-tab-btn i, .m-tab-btn i { display:none; } .grid-2cols, .grid-3cols { grid-template-columns:1fr; } .filter-row { flex-direction:column; align-items:stretch; } .filter-row select, .filter-row input { width:100%; } #mOrdersTable { font-size:0.58rem; } #mOrdersTable th, #mOrdersTable td { padding:5px 3px; } }
@media (max-width:480px) { .app-header .logo-text { font-size:18px; } .app-header .logo-svg { width:36px; height:36px; } .d-top-header .d-manager-info, .m-top-header .m-manager-info { font-size:0.7rem; padding:4px 12px; } }
.modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 999; display: none; align-items: center; justify-content: center; }
.modal-overlay.active { display: flex; }
.modal-box { background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-radius: 24px; padding: 32px 30px 30px; max-width: 440px; width: 95%; box-shadow: 0 20px 60px rgba(0,0,0,0.3); position: relative; border: 1px solid rgba(255,255,255,0.3); max-height: 90vh; overflow-y: auto; }
.login-logo { text-align: center; margin-bottom: 20px; }
.login-logo img { width: 80px; height: auto; display: inline-block; }
.login-title { text-align: center; font-size: 26px; font-weight: 700; color: #1e5a38; letter-spacing: 1px; margin-bottom: 4px; }
.login-subtitle { text-align: center; font-size: 16px; color: #6c757d; margin-bottom: 24px; font-weight: 400; }
.login-form .form-group { margin-bottom: 18px; }
.login-form label { display: block; font-weight: 600; font-size: 14px; color: #1e2a3a; margin-bottom: 6px; }
.login-form input, .login-form select { width: 100%; padding: 10px 14px; border-radius: 30px; border: 1px solid #ced4da; font-size: 14px; background: rgba(255, 255, 255, 0.8); transition: border-color 0.3s, box-shadow 0.3s; }
.login-form input:focus, .login-form select:focus { border-color: #1e5a38; box-shadow: 0 0 0 3px rgba(30, 90, 56, 0.15); outline: none; background: #fff; }
.password-wrapper { position: relative; }
.password-wrapper input { padding-right: 44px; }
.toggle-password { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); cursor: pointer; color: #6c757d; font-size: 18px; transition: color 0.2s; background: none; border: none; padding: 4px; }
.toggle-password:hover { color: #1e5a38; }
.login-btn { width: 100%; padding: 12px; border: none; border-radius: 40px; background: #1e5a38; color: #fff; font-weight: 700; font-size: 16px; cursor: pointer; transition: background 0.3s, transform 0.2s; }
.login-btn:hover { background: #15472a; transform: translateY(-2px); }
.login-btn:active { transform: scale(0.98); }
#loginError { margin-top: 12px; text-align: center; font-size: 14px; color: #dc3545; }
.login-footer { text-align: center; margin-top: 16px; font-size: 13px; color: #adb5bd; }
.login-footer a { color: #1e5a38; text-decoration: none; font-weight: 600; }
.login-footer a:hover { text-decoration: underline; }
.admin-tabs { display: flex; gap: 8px; margin: 16px 0 20px; border-bottom: 2px solid #dee2e6; padding-bottom: 8px; flex-wrap: wrap; }
.admin-tab-btn { padding: 8px 24px; border-radius: 40px; background: #f1f3f5; cursor: pointer; font-size: 14px; font-weight: 500; border: none; color: #495057; transition: 0.2s; }
.admin-tab-btn:hover { background: #dee2e6; }
.admin-tab-btn.active { background: #1e5a38; color: #fff; }
.admin-user-list { background: #fff; border-radius: 12px; padding: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); margin-top: 8px; }
.admin-user-item { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid #e9ecef; }
.admin-user-item:last-child { border-bottom: none; }
.admin-user-item .user-info { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.admin-user-item .user-info .name { font-weight: 600; }
.admin-user-item .user-info .login { color: #6c757d; font-size: 13px; }
.admin-user-item .user-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.admin-user-item .user-actions button { padding: 4px 12px; font-size: 12px; border-radius: 30px; border: none; cursor: pointer; transition: 0.2s; }
.admin-user-item .user-actions .view-btn { background: #e9ecef; color: #495057; }
.admin-user-item .user-actions .view-btn:hover { background: #dee2e6; }
.admin-user-item .user-actions .edit-btn { background: #1e5a38; color: #fff; }
.admin-user-item .user-actions .edit-btn:hover { background: #15472a; }
.admin-user-item .user-actions .delete-btn { background: #dc3545; color: #fff; }
.admin-user-item .user-actions .delete-btn:hover { background: #b02a37; }
.admin-add-user { background: #fff; border-radius: 12px; padding: 16px 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.06); margin-bottom: 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.admin-add-user .title { font-weight: 600; font-size: 16px; color: #1e5a38; margin-right: 8px; }
.admin-add-user input, .admin-add-user select { padding: 6px 12px; border-radius: 30px; border: 1px solid #ced4da; font-size: 14px; background: #fff; min-width: 140px; }
.admin-add-user .add-btn { background: #1e5a38; color: #fff; border: none; padding: 6px 18px; border-radius: 30px; cursor: pointer; font-size: 14px; transition: 0.2s; }
.admin-add-user .add-btn:hover { background: #15472a; }
.view-user-modal .modal-box { max-width: 500px; }
.view-user-modal .info-row { display: flex; padding: 8px 0; border-bottom: 1px solid #e9ecef; }
.view-user-modal .info-row .label { font-weight: 600; width: 140px; flex-shrink: 0; color: #1e5a38; }
.view-user-modal .info-row .value { color: #1e2a3a; }
#loginModalOld { display: none; }
#sRegisterSectionHide { display: none; }
.profile-field { margin-bottom: 14px; }
.profile-field .pf-label { font-size: 0.78rem; color: #6c757d; margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.5px; }
.profile-field .pf-value { font-size: 1rem; color: #1e2a3a; font-weight: 500; padding: 8px 0; border-bottom: 1px solid #e9ecef; }
.profile-section-title { font-size: 1.05rem; font-weight: 700; color: var(--tamak-green-dark); margin: 20px 0 12px; padding-bottom: 6px; border-bottom: 2px solid var(--tamak-green-light); }
.profile-section-title:first-child { margin-top: 0; }
.profile-loading { text-align: center; padding: 40px; color: #6c757d; }
.profile-loading i { font-size: 2rem; color: var(--tamak-green); animation: spin 1s linear infinite; display: block; margin-bottom: 12px; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.profile-empty { text-align: center; padding: 30px; color: #6c757d; font-style: italic; }
.d-profile-modal .modal-box { max-width: 520px; }
.d-profile-modal .modal-box h3 { color: var(--tamak-green-dark); margin-bottom: 16px; font-size: 1.3rem; }
.d-profile-modal .modal-box .form-group { margin-bottom: 14px; }
.d-profile-modal .modal-box .form-group label { font-size: 0.85rem; color: #495057; }
.d-profile-modal .modal-box .form-group input { border-radius: 12px; }
.d-profile-modal .modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; }
.d-profile-modal .modal-actions .btn-cancel { background: #6c757d; color: #fff; border: none; padding: 10px 20px; border-radius: 30px; cursor: pointer; font-size: 0.9rem; }
.d-profile-modal .modal-actions .btn-cancel:hover { background: #5a6268; }
.d-profile-modal .modal-actions .btn-save { background: var(--tamak-green); color: #fff; border: none; padding: 10px 20px; border-radius: 30px; cursor: pointer; font-size: 0.9rem; }
.d-profile-modal .modal-actions .btn-save:hover { background: var(--tamak-green-dark); }
.d-profile-modal .modal-actions .btn-save:disabled { background: #aaa; cursor: not-allowed; }
.d-profile-modal .modal-message { margin-top: 12px; text-align: center; font-size: 0.9rem; min-height: 20px; }
.d-profile-modal .modal-message.success { color: var(--tamak-green); }
.d-profile-modal .modal-message.error { color: #dc3545; }
.plan-editing-highlight { background: #fff8e1 !important; border: 2px solid #f9a825 !important; border-radius: 12px; }
.claim-photos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; margin-top: 10px; }
.claim-photos-grid img { width: 100%; height: 120px; object-fit: cover; border-radius: 10px; border: 1px solid var(--tamak-border); cursor: pointer; transition: 0.2s; }
.claim-photos-grid img:hover { transform: scale(1.03); box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
.claim-files-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.claim-files-list a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--tamak-bg-light); border: 1px solid var(--tamak-border); border-radius: 10px; text-decoration: none; color: var(--tamak-green-dark); font-size: 0.85rem; transition: 0.2s; }
.claim-files-list a:hover { background: var(--tamak-green-light); }
.claim-detail-row { display: flex; padding: 8px 0; border-bottom: 1px solid #e9ecef; }
.claim-detail-row .label { font-weight: 600; width: 180px; flex-shrink: 0; color: var(--tamak-green-dark); }
.claim-detail-row .value { color: #1e2a3a; flex: 1; }
.task-card { background: #fff; border: 1px solid var(--tamak-border); border-radius: 16px; padding: 16px; margin-bottom: 12px; transition: 0.2s; cursor: pointer; position: relative; }
.task-card:hover { box-shadow: 0 4px 12px rgba(0,122,72,0.1); border-color: var(--tamak-green); }
.task-card-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 10px; }
.task-card-title { font-size: 1.05rem; font-weight: 600; color: #1e2a3a; flex: 1; margin-right: 10px; }
.task-card-meta { display: flex; gap: 15px; flex-wrap: wrap; font-size: 0.8rem; color: #6c757d; margin-top: 8px; }
.task-card-meta span { display: inline-flex; align-items: center; gap: 5px; }
.task-status-new { background: #e3f2fd; color: #1976d2; }
.task-status-progress { background: #fff3e0; color: #f57c00; }
.task-status-done { background: #e8f5e9; color: #388e3c; }
.task-overdue { border-left: 4px solid #d32f2f; }
.task-comment-item { background: #f8fbf9; padding: 10px; border-radius: 10px; margin-bottom: 8px; border: 1px solid #eee; }
.task-comment-author { font-weight: 600; color: var(--tamak-green-dark); font-size: 0.85rem; }
.task-comment-date { font-size: 0.75rem; color: #999; margin-left: 8px; }
.task-comment-text { margin-top: 4px; font-size: 0.9rem; color: #333; white-space: pre-wrap; }
.task-file-item { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; background: #f1f5f9; border-radius: 8px; margin-bottom: 6px; }
.task-file-item a { text-decoration: none; color: var(--tamak-green-dark); font-weight: 500; display: flex; align-items: center; gap: 8px; }
.d-news-item { background: #fff; border: 1px solid var(--tamak-border); border-radius: 16px; padding: 18px 20px; margin-bottom: 14px; transition: 0.2s; position: relative; }
.d-news-item.unread { border-left: 4px solid #d32f2f; background: #fff8f8; }
.d-news-item:hover { box-shadow: 0 4px 12px rgba(0,122,72,0.08); }
.d-news-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 10px; }
.d-news-title { font-size: 1.1rem; font-weight: 600; color: var(--tamak-green-dark); margin: 0; flex: 1; }
.d-news-date { font-size: 0.78rem; color: #6c757d; white-space: nowrap; }
.d-news-text { font-size: 0.92rem; color: #333; line-height: 1.5; white-space: pre-wrap; margin-bottom: 10px; }
.d-news-files { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.d-news-files a { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; background: var(--tamak-green-light); border-radius: 20px; text-decoration: none; color: var(--tamak-green-dark); font-size: 0.8rem; transition: 0.2s; }
.d-news-files a:hover { background: #c8e6d4; }
.d-news-delete-btn { background: #ffe6e6; color: #d32f2f; border: 1px solid #d32f2f; padding: 4px 12px; border-radius: 20px; font-weight: 500; cursor: pointer; font-size: 0.75rem; transition: 0.2s; }
.d-news-delete-btn:hover { background: #d32f2f; color: #fff; }
.d-news-empty { text-align: center; padding: 40px; color: #6c757d; }
.d-news-empty i { font-size: 3rem; color: #ccc; display: block; margin-bottom: 12px; }
.ticket-row { cursor: pointer; transition: 0.2s; }
.ticket-row:hover { background: #f8fbf9; }
.ticket-row td { padding: 12px 8px; }
.ticket-row.unread-row { background: #fff8e1; }
.ticket-row.unread-row td:first-child::before { content: '●'; color: #d32f2f; margin-right: 6px; font-size: 0.7rem; }
.ticket-status-new { background: #fff3e0; color: #b45f06; }
.ticket-status-progress { background: #e3f2fd; color: #1976d2; }
.ticket-status-closed { background: #e8f5e9; color: #388e3c; }
.ticket-detail-section { margin-bottom: 18px; }
.ticket-detail-label { font-weight: 600; color: var(--tamak-green-dark); font-size: 0.85rem; margin-bottom: 4px; }
.ticket-detail-value { font-size: 0.92rem; color: #1e2a3a; padding: 6px 0; }
.ticket-files-list { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; }
.ticket-files-list a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--tamak-bg-light); border: 1px solid var(--tamak-border); border-radius: 10px; text-decoration: none; color: var(--tamak-green-dark); font-size: 0.85rem; transition: 0.2s; }
.ticket-files-list a:hover { background: var(--tamak-green-light); }
.ticket-chat-box { background: #f8fbf9; border-radius: 14px; padding: 14px; max-height: 340px; overflow-y: auto; border: 1px solid var(--tamak-border); display: flex; flex-direction: column; gap: 10px; }
.chat-msg { padding: 10px 14px; border-radius: 16px; max-width: 85%; word-wrap: break-word; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.chat-msg-dealer { background: #e3f2fd; color: #0d47a1; align-self: flex-end; border-bottom-right-radius: 4px; }
.chat-msg-support { background: #e0f2e9; color: #1b5e20; align-self: flex-start; border-bottom-left-radius: 4px; }
.chat-msg-header { font-size: 0.75rem; opacity: 0.75; margin-bottom: 4px; display: flex; gap: 8px; justify-content: space-between; }
.chat-msg-author { font-weight: 600; }
.chat-msg-text { font-size: 0.9rem; white-space: pre-wrap; line-height: 1.4; }
.chat-msg-files { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.chat-msg-files a { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: rgba(255,255,255,0.7); border-radius: 10px; font-size: 0.78rem; text-decoration: none; color: inherit; }
.chat-msg-files a:hover { background: #fff; }
.chat-input-row { display: flex; gap: 10px; margin-top: 12px; align-items: flex-end; }
.chat-input-row textarea { flex: 1; padding: 10px; border-radius: 14px; border: 1px solid var(--tamak-border); font-family: inherit; font-size: 0.9rem; resize: vertical; min-height: 44px; max-height: 120px; }
.chat-attach-label { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 10px 12px; border-radius: 14px; background: #f1f5f9; border: 1px solid var(--tamak-border); color: var(--tamak-green-dark); transition: 0.2s; }
.chat-attach-label:hover { background: var(--tamak-green-light); }
.chat-attach-label input[type=file] { display: none; }
.file-preview-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.file-preview-item { background: #fff; padding: 4px 10px; border-radius: 12px; font-size: 0.78rem; border: 1px solid var(--tamak-border); color: #495057; display: inline-flex; gap: 6px; align-items: center; }
.empty-msg { text-align: center; padding: 30px; color: #6c757d; font-style: italic; }
.modal-close { position: absolute; top: 14px; right: 18px; background: none; border: none; font-size: 24px; cursor: pointer; color: #aaa; line-height: 1; padding: 0; }
.modal-close:hover { color: #333; }

/* The manager needs the whole workspace when reviewing a long order. */
.m-order-details-content {
  width: calc(100% - 32px);
  max-width: none;
  height: calc(100vh - 32px);
  max-height: none;
  padding: 28px 32px;
  border-radius: 18px;
}
.order-status-panel {
  margin-top: 20px;
  padding: 18px;
  border: 1px solid var(--tamak-border);
  border-radius: 14px;
  background: #f8fbf9;
}
.order-status-title {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--tamak-green-dark);
}
.order-current-status {
  font-size: 14px;
  padding: 7px 13px;
  background: #fff3cd;
  color: #664d03;
}
.order-status-hint {
  margin-top: 8px;
  color: #6c757d;
  font-size: 13px;
}
.order-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.transport-details-panel {
  margin-top: 20px;
  padding: 18px;
  border: 1px solid var(--tamak-border);
  border-radius: 14px;
  background: #fffdf5;
}
.transport-details-panel h4 {
  margin: 0 0 14px;
  color: var(--tamak-green-dark);
}
.transport-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.transport-details-grid label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: #495057;
  font-size: 13px;
  font-weight: 600;
}
.transport-details-grid input {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid var(--tamak-border);
  border-radius: 10px;
  font: inherit;
  font-weight: 400;
}
.transport-info-cell {
  min-width: 150px;
  line-height: 1.35;
}
.transport-info-cell small {
  color: #6c757d;
}
.transport-poa-block {
  margin-top: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid #eee2ad;
}
.transport-missing {
  color: #b42318;
  font-weight: 600;
}
.transport-readonly-note {
  margin-top: 12px;
  color: #6c757d;
  font-size: 13px;
}
.order-chat-files {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  padding-top: 7px;
  border-top: 1px solid #edf0ed;
}
@media (max-width: 640px) {
  .m-order-details-content {
    width: 100%;
    height: 100vh;
    padding: 18px 14px;
    border-radius: 0;
  }
  .order-status-actions .btn-outline {
    flex: 1 1 100%;
  }
  .transport-details-grid {
    grid-template-columns: 1fr;
  }
}
.order-unassigned { background-color: #ffe6f0 !important; cursor: pointer; }
.order-unassigned:hover { background-color: #ffd6e5 !important; }
.order-assigned { background-color: #e6f7e6 !important; cursor: pointer; }
.order-assigned:hover { background-color: #d5f0d5 !important; }

/* ===== Cleanup 2026-09: скрытие шапки до авторизации ===== */
body.is-guest .app-header { display: none !important; }

/* ===== Кнопка-ссылка (замена <a href="javascript:void(0)">) ===== */
.link-file {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  color: #007A48;
  cursor: pointer;
  text-decoration: underline;
  font: inherit;
  font-size: inherit;
}
.link-file:hover { color: #005f38; }

/* ===== Переключатель формата в форме заказа (смешанные позиции) ===== */
#dOrderFormatSwitcher { border-bottom: 1px solid var(--tamak-border); }
.fmt-btn {
  padding: 8px 14px;
  border: 1px solid var(--tamak-border);
  border-radius: 20px;
  background: #f1f5f9;
  color: #495057;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.85rem;
  font-weight: 600;
}
.fmt-btn:hover { background: #e9eef5; }
.fmt-btn-active { background: #007A48; color: #fff; border-color: #007A48; }
.fmt-btn-active:hover { background: #005f38; }
