/* Каталог ссылок клиента: цветные категории и явные рабочие действия */
.client-links-catalog {
  --link-green: #e4f8f0;
  --link-green-border: #9edfc9;
  --link-blue: #e8f4fc;
  --link-blue-border: #acd4ee;
  --link-orange: #fff0e5;
  --link-orange-border: #f5c39f;
  --link-violet: #efeffd;
  --link-violet-border: #c7c8ef;
  --link-mint: #e8faf8;
  --link-mint-border: #a9e2dc;
  --link-sand: #fff7e8;
  --link-sand-border: #ead3a3;
}

.client-links-catalog .link-category-card {
  position: relative;
  border-width: 1px;
  box-shadow: 0 10px 28px rgba(36, 71, 63, 0.07);
}

.client-links-catalog .link-category-card:nth-child(6n + 1) { background: linear-gradient(145deg, #f5fffb, var(--link-green)); border-color: var(--link-green-border); }
.client-links-catalog .link-category-card:nth-child(6n + 2) { background: linear-gradient(145deg, #f8fcff, var(--link-blue)); border-color: var(--link-blue-border); }
.client-links-catalog .link-category-card:nth-child(6n + 3) { background: linear-gradient(145deg, #fffaf6, var(--link-orange)); border-color: var(--link-orange-border); }
.client-links-catalog .link-category-card:nth-child(6n + 4) { background: linear-gradient(145deg, #fbfbff, var(--link-violet)); border-color: var(--link-violet-border); }
.client-links-catalog .link-category-card:nth-child(6n + 5) { background: linear-gradient(145deg, #f7fffe, var(--link-mint)); border-color: var(--link-mint-border); }
.client-links-catalog .link-category-card:nth-child(6n) { background: linear-gradient(145deg, #fffdf8, var(--link-sand)); border-color: var(--link-sand-border); }

.client-links-catalog .link-category-title { align-items: center; }
.client-links-catalog .link-category-title h4 { color: #213d36; font-size: 19px; }
.client-links-catalog .link-category-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.client-links-catalog .link-category-add,
.client-links-catalog .link-category-delete {
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.88);
  cursor: pointer;
  pointer-events: auto;
  font-weight: 800;
}
.client-links-catalog .link-category-add { border: 1px solid rgba(38, 166, 136, 0.28); color: #187863; }
.client-links-catalog .link-category-delete { border: 1px solid rgba(204, 82, 67, 0.25); color: #b44738; }
.client-links-catalog .link-category-add:hover { background: #fff; box-shadow: 0 6px 16px rgba(38, 166, 136, 0.12); }
.client-links-catalog .link-category-delete:hover { background: #fff0ed; }

.client-links-catalog .link-tile { min-height: 118px; padding: 13px; border-color: rgba(48, 93, 83, 0.17); background: rgba(255, 255, 255, 0.9); box-shadow: 0 5px 15px rgba(38, 72, 64, 0.05); }
.client-links-catalog .link-tile strong { color: #213d36; font-size: 15px; }
.client-links-catalog .link-tile.empty-tile { background: rgba(255, 255, 255, 0.64); }
.client-links-catalog .link-tile.empty-tile button {
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid rgba(38, 166, 136, 0.35);
  border-radius: 9px;
  background: #fff;
  color: #187863;
  cursor: pointer;
  pointer-events: auto;
  font-weight: 800;
}
.client-links-catalog .link-tile.empty-tile button:hover { background: #dcf7ed; }
.client-links-catalog .link-tile-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; width: 100%; }
.client-links-catalog .link-tile-actions a,
.client-links-catalog .link-tile-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid rgba(38, 166, 136, 0.24);
  border-radius: 8px;
  background: #fff;
  color: #187863;
  cursor: pointer;
  pointer-events: auto;
  text-decoration: none;
  font-weight: 800;
}
.client-links-catalog .link-tile-actions a:hover,
.client-links-catalog .link-tile-actions button:hover { background: #dcf7ed; }
.client-links-catalog .link-tile-actions .danger-link { border-color: rgba(210, 86, 70, 0.24); color: #b44738; }
.client-links-catalog .link-tile-actions .danger-link:hover { background: #fff0ed; }

.modal-overlay {
  position: fixed;
  z-index: 3000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  overflow-y: auto;
  background: rgba(16, 31, 27, 0.58);
  backdrop-filter: blur(4px);
}
.modal-card.link-modal {
  width: min(580px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  padding: 24px;
  border: 1px solid rgba(38, 166, 136, 0.18);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 28px 90px rgba(12, 42, 34, 0.28);
}
.modal-card.link-modal.small { width: min(460px, calc(100vw - 32px)); }
.modal-card.link-modal .modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.modal-card.link-modal .modal-head h3 { margin: 0 0 6px; color: #203c35; font-size: 24px; }
.modal-card.link-modal .modal-head p { margin: 0; color: #6f807b; line-height: 1.45; }
.modal-card.link-modal .icon-button { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border: 0; border-radius: 50%; background: #edf6f3; color: #315e53; font-size: 25px; cursor: pointer; }
.modal-card.link-modal > label { display: grid; gap: 8px; margin-top: 14px; color: #405b54; font-size: 13px; font-weight: 800; }
.modal-card.link-modal input,
.modal-card.link-modal textarea,
.modal-card.link-modal .app-select,
.modal-card.link-modal .app-select-wrap { width: 100%; box-sizing: border-box; }
.modal-card.link-modal input,
.modal-card.link-modal textarea { padding: 11px 13px; border: 1px solid #d5e2de; border-radius: 11px; background: #fff; color: #243d36; font: inherit; }
.modal-card.link-modal input:focus,
.modal-card.link-modal textarea:focus { border-color: #49c8c0; outline: none; box-shadow: 0 0 0 4px rgba(73, 200, 192, 0.12); }
.modal-card.link-modal .modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }

@media (max-width: 560px) {
  .client-links-catalog .link-tile-actions { grid-template-columns: 1fr; }
  .client-links-catalog .link-category-title { align-items: flex-start; flex-direction: column; }
  .client-links-catalog .link-category-actions { width: 100%; margin-left: 0; }
  .client-links-catalog .link-category-actions button { flex: 1; }
  .modal-overlay { align-items: start; padding: 12px; }
  .modal-card.link-modal { width: 100%; max-height: calc(100vh - 24px); padding: 18px; border-radius: 18px; }
  .modal-card.link-modal .modal-actions { flex-direction: column-reverse; }
  .modal-card.link-modal .modal-actions button { width: 100%; }
}