.contacts-panel { background: var(--bg-card); border: 1px solid rgba(15, 76, 117, 0.14); border-radius: 14px; overflow: hidden; box-shadow: 0 10px 28px rgba(15, 76, 117, 0.08); } .contacts-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.65rem; margin-bottom: 0.9rem; padding: 0.78rem 0.9rem; background: linear-gradient(135deg, rgba(15, 76, 117, 0.08) 0%, rgba(15, 76, 117, 0.02) 100%); border: 1px solid rgba(15, 76, 117, 0.12); border-radius: 12px; } .contacts-search { max-width: 460px; min-width: 280px; } .contacts-search .form-control, .contacts-search .input-group-text { border-color: rgba(15, 76, 117, 0.2); } .contacts-table { margin-bottom: 0; } .contacts-table thead th { border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: rgba(15, 76, 117, 0.06); color: var(--text-secondary); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; padding: 0.82rem 0.8rem; } .contacts-table tbody td { border-color: rgba(0, 0, 0, 0.06); padding: 0.85rem 0.8rem; } .contacts-table .contact-name { font-weight: 600; color: var(--text-primary); } .contacts-table .contact-name-link { color: var(--text-primary); text-decoration: none; border-bottom: 1px solid transparent; transition: color 0.15s ease, border-color 0.15s ease; } .contacts-table .contact-name-link:hover { color: var(--accent); border-color: rgba(15, 76, 117, 0.35); } .contacts-table .contact-email a { overflow-wrap: anywhere; } .contacts-table .contact-number { white-space: nowrap; } .contacts-table .contact-phone-wrap, .contacts-table .contact-mobile-wrap { display: inline-flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; } .contacts-table .btn-voip { border-color: rgba(25, 135, 84, 0.6); color: var(--theme-success-text, #198754); } .contacts-table .contact-phone-wrap .btn, .contacts-table .contact-mobile-wrap .btn { padding: 0.18rem 0.52rem; line-height: 1.2; } .contacts-table .primary-pill { font-size: 0.72rem; font-weight: 700; } @media(max-width:768px){.contacts-search{min-width:0;width:100%;max-width:none}.contacts-toolbar{align-items:stretch}} @media(max-width:992px){.contacts-toolbar{padding:.7rem}.contacts-search{max-width:none;min-width:0;width:100%}#contactsContainer{min-width:920px}}