/* ProPartners Platform Phase 2 UX v2
   Non-business-logic UI polish for account dashboards, lists, modals and mobile layouts. */
:root{
  --pp-ux-navy:#071a55;
  --pp-ux-blue:#1261ff;
  --pp-ux-soft:#f6f9ff;
  --pp-ux-line:#e2eaf6;
  --pp-ux-muted:#64748b;
  --pp-ux-card:#ffffff;
  --pp-ux-radius:18px;
  --pp-ux-shadow:0 18px 48px rgba(7,26,85,.08);
}

/* Account page rhythm */
.investor-shell main,
.fundraiser-shell main,
.account-shell main,
.pp-account-main,
.role-dashboard main{
  background:linear-gradient(180deg,#f7faff 0%,#ffffff 420px)!important;
}

.pp-account-card,
.account-card,
.dashboard-card,
.metric-card,
.kpi-card,
.panel,
.pp-card{
  border:1px solid var(--pp-ux-line)!important;
  border-radius:var(--pp-ux-radius)!important;
  background:var(--pp-ux-card)!important;
  box-shadow:var(--pp-ux-shadow)!important;
}

.pp-account-card h1,.pp-account-card h2,.pp-account-card h3,
.account-card h1,.account-card h2,.account-card h3,
.panel h1,.panel h2,.panel h3{
  letter-spacing:-.025em!important;
  color:var(--pp-ux-navy)!important;
}

/* Compact, readable tables */
.pp-table,
.account-table,
.messages-table,
.notifications-table,
table.dataTable,
.table,
.table-modern{
  width:100%!important;
  border-collapse:separate!important;
  border-spacing:0 8px!important;
}
.pp-table thead th,
.account-table thead th,
.messages-table thead th,
.notifications-table thead th,
table.dataTable thead th,
.table thead th,
.table-modern thead th{
  font-size:12px!important;
  line-height:1.15!important;
  text-transform:uppercase!important;
  letter-spacing:.055em!important;
  color:#526173!important;
  background:#f4f8ff!important;
  border-top:1px solid var(--pp-ux-line)!important;
  border-bottom:1px solid var(--pp-ux-line)!important;
  padding:10px 12px!important;
  white-space:nowrap!important;
}
.pp-table tbody tr,
.account-table tbody tr,
.messages-table tbody tr,
.notifications-table tbody tr,
table.dataTable tbody tr,
.table tbody tr,
.table-modern tbody tr{
  background:#fff!important;
  box-shadow:0 8px 20px rgba(7,26,85,.045)!important;
}
.pp-table tbody td,
.account-table tbody td,
.messages-table tbody td,
.notifications-table tbody td,
table.dataTable tbody td,
.table tbody td,
.table-modern tbody td{
  padding:12px!important;
  vertical-align:middle!important;
  border-top:1px solid #edf2fb!important;
  border-bottom:1px solid #edf2fb!important;
  line-height:1.35!important;
}
.pp-table tbody td:first-child,
.account-table tbody td:first-child,
.messages-table tbody td:first-child,
.notifications-table tbody td:first-child,
table.dataTable tbody td:first-child,
.table tbody td:first-child,
.table-modern tbody td:first-child{
  border-left:1px solid #edf2fb!important;
  border-top-left-radius:14px!important;
  border-bottom-left-radius:14px!important;
}
.pp-table tbody td:last-child,
.account-table tbody td:last-child,
.messages-table tbody td:last-child,
.notifications-table tbody td:last-child,
table.dataTable tbody td:last-child,
.table tbody td:last-child,
.table-modern tbody td:last-child{
  border-right:1px solid #edf2fb!important;
  border-top-right-radius:14px!important;
  border-bottom-right-radius:14px!important;
}

/* Keep action buttons on one line where possible */
.actions,
.row-actions,
.table-actions,
.pp-actions,
.message-actions,
.notification-actions,
td.actions,
td:last-child .btn,
td:last-child a.btn{
  white-space:nowrap!important;
}
.actions,
.row-actions,
.table-actions,
.pp-actions,
.message-actions,
.notification-actions,
td:last-child > div,
td:last-child .action-group{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:6px!important;
  flex-wrap:nowrap!important;
}
.btn,
.button,
.pp-btn,
.action-btn,
a.btn,
button.btn{
  border-radius:12px!important;
  min-height:34px!important;
  padding:8px 12px!important;
  font-weight:850!important;
  line-height:1!important;
}
.btn-sm,.button-sm,.pp-btn-sm,.action-btn.btn-sm{
  min-height:30px!important;
  padding:7px 10px!important;
  font-size:12px!important;
}

/* Communications: compact rows and better counters */
.pp-comm-toolbar,
.communication-toolbar,
.messages-toolbar,
.notifications-toolbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  flex-wrap:wrap!important;
  margin-bottom:14px!important;
}
.pp-comm-toolbar input,
.communication-toolbar input,
.messages-toolbar input,
.notifications-toolbar input,
.pp-comm-toolbar select,
.communication-toolbar select,
.messages-toolbar select,
.notifications-toolbar select{
  border:1px solid var(--pp-ux-line)!important;
  border-radius:12px!important;
  padding:10px 12px!important;
  background:#fff!important;
  min-height:40px!important;
}
.pp-counter-badge,
.badge-counter,
.unread-badge,
.nav-count,
.menu-count{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:20px!important;
  height:20px!important;
  padding:0 6px!important;
  border-radius:999px!important;
  background:#ef4444!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1!important;
}

/* Modal standardization */
.modal,
.pp-modal,
.modal-backdrop .modal,
[role="dialog"]{
  --pp-modal-radius:22px;
}
.modal-content,
.pp-modal-content,
.dialog-content,
.pp-360-modal,
.investor-360-modal,
.fundraiser-360-modal{
  border:1px solid var(--pp-ux-line)!important;
  border-radius:var(--pp-modal-radius)!important;
  box-shadow:0 34px 90px rgba(7,26,85,.24)!important;
  overflow:hidden!important;
}
.modal-header,
.pp-modal-header,
.dialog-header,
.pp-360-modal-header{
  background:linear-gradient(135deg,#071a55 0%,#123c9c 100%)!important;
  color:#fff!important;
  padding:18px 22px!important;
  border-bottom:0!important;
}
.modal-header h1,.modal-header h2,.modal-header h3,.modal-title,
.pp-modal-header h1,.pp-modal-header h2,.pp-modal-header h3{
  color:#fff!important;
  margin:0!important;
  letter-spacing:-.025em!important;
}
.modal-body,
.pp-modal-body,
.dialog-body{
  padding:22px!important;
  background:#fff!important;
}
.modal-footer,
.pp-modal-footer,
.dialog-footer{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  padding:14px 22px!important;
  background:#f8fbff!important;
  border-top:1px solid var(--pp-ux-line)!important;
}

/* Wishlist cards */
.wishlist-grid,
.saved-campaigns-grid,
.watchlist-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;
  gap:18px!important;
}
.wishlist-card,
.saved-campaign-card,
.watchlist-card,
.campaign-card.saved{
  border:1px solid var(--pp-ux-line)!important;
  border-radius:20px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:var(--pp-ux-shadow)!important;
}
.wishlist-card img,
.saved-campaign-card img,
.watchlist-card img{
  width:100%!important;
  height:150px!important;
  object-fit:cover!important;
}
.wishlist-card .progress,
.saved-campaign-card .progress,
.watchlist-card .progress{
  height:8px!important;
  border-radius:999px!important;
  background:#e8eef8!important;
  overflow:hidden!important;
}

/* Document vault categories */
.document-vault-grid,
.doc-vault-grid,
.documents-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important;
  gap:16px!important;
}
.document-category,
.doc-category,
.document-group{
  border:1px solid var(--pp-ux-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  padding:16px!important;
  box-shadow:0 14px 38px rgba(7,26,85,.06)!important;
}
.document-category h3,
.doc-category h3,
.document-group h3{
  margin:0 0 12px!important;
  color:var(--pp-ux-navy)!important;
}
.document-item,
.doc-item{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:10px 0!important;
  border-top:1px solid #edf2fb!important;
}

/* Empty states */
.empty-state,
.pp-empty-state,
.no-records,
.no-data{
  border:1px dashed #c8d7ee!important;
  border-radius:20px!important;
  background:#f8fbff!important;
  padding:28px!important;
  text-align:center!important;
  color:var(--pp-ux-muted)!important;
}
.empty-state h3,.pp-empty-state h3,.no-records h3,.no-data h3{
  color:var(--pp-ux-navy)!important;
  margin:0 0 6px!important;
}

/* Mobile fixes */
@media(max-width:760px){
  .pp-comm-toolbar,.communication-toolbar,.messages-toolbar,.notifications-toolbar{align-items:stretch!important;flex-direction:column!important}
  .pp-comm-toolbar > *,.communication-toolbar > *,.messages-toolbar > *,.notifications-toolbar > *{width:100%!important}
  .pp-table,.account-table,.messages-table,.notifications-table,.table,.table-modern{border-spacing:0 10px!important}
  .pp-table thead,.account-table thead,.messages-table thead,.notifications-table thead,.table thead,.table-modern thead{display:none!important}
  .pp-table tbody tr,.account-table tbody tr,.messages-table tbody tr,.notifications-table tbody tr,.table tbody tr,.table-modern tbody tr{display:block!important;border:1px solid var(--pp-ux-line)!important;border-radius:16px!important;overflow:hidden!important;margin-bottom:12px!important}
  .pp-table tbody td,.account-table tbody td,.messages-table tbody td,.notifications-table tbody td,.table tbody td,.table-modern tbody td{display:flex!important;justify-content:space-between!important;gap:12px!important;border:0!important;border-bottom:1px solid #edf2fb!important;border-radius:0!important;padding:12px 14px!important}
  .pp-table tbody td:last-child,.account-table tbody td:last-child,.messages-table tbody td:last-child,.notifications-table tbody td:last-child,.table tbody td:last-child,.table-modern tbody td:last-child{border-bottom:0!important;justify-content:flex-start!important}
  .actions,.row-actions,.table-actions,.pp-actions,.message-actions,.notification-actions,td:last-child > div,td:last-child .action-group{justify-content:flex-start!important;flex-wrap:wrap!important}
  .modal-content,.pp-modal-content,.dialog-content,.pp-360-modal,.investor-360-modal,.fundraiser-360-modal{border-radius:18px!important;max-height:92vh!important;overflow:auto!important}
  .modal-body,.pp-modal-body,.dialog-body{padding:16px!important}
}
