/* Authority Planer CSS Components
 * Stable UI building blocks layered on top of core.
 */

:root{
  --icon-on-light: var(--primary-strong);
  --icon-on-dark: #ffffff;
  --icon-on-muted: var(--text-muted);
  --action-bg-soft: var(--panel-soft);
  --action-bg-strong: var(--primary);
  --source-card-accent: rgba(33,90,94,.08);
}

.nav a{position:relative}
.nav-icon,
.ui-icon{
  display:inline-block;
  width:18px;
  height:18px;
  flex:0 0 18px;
  background-color:currentColor;
  mask-repeat:no-repeat;
  -webkit-mask-repeat:no-repeat;
  mask-position:center;
  -webkit-mask-position:center;
  mask-size:18px 18px;
  -webkit-mask-size:18px 18px;
}
.nav a{color:#dbe6e5}
.nav a:hover,.nav a:focus-visible{color:#fff}
.icon-dashboard,.ui-icon-dashboard{mask-image:url('../icons/dashboard.svg');-webkit-mask-image:url('../icons/dashboard.svg')}
.icon-projects,.ui-icon-projects{mask-image:url('../icons/projects.svg');-webkit-mask-image:url('../icons/projects.svg')}
.icon-new,.ui-icon-plus{mask-image:url('../icons/plus.svg');-webkit-mask-image:url('../icons/plus.svg')}
.icon-industries{mask-image:url('../icons/library.svg');-webkit-mask-image:url('../icons/library.svg')}
.icon-sources{mask-image:url('../icons/sources.svg');-webkit-mask-image:url('../icons/sources.svg')}
.icon-users{mask-image:url('../icons/users.svg');-webkit-mask-image:url('../icons/users.svg')}
.icon-logout{mask-image:url('../icons/logout.svg');-webkit-mask-image:url('../icons/logout.svg')}
.ui-icon-copy{mask-image:url('../icons/copy.svg');-webkit-mask-image:url('../icons/copy.svg')}
.ui-icon-link{mask-image:url('../icons/link.svg');-webkit-mask-image:url('../icons/link.svg')}
.ui-icon-open{mask-image:url('../icons/open.svg');-webkit-mask-image:url('../icons/open.svg')}
.ui-icon-edit{mask-image:url('../icons/edit.svg');-webkit-mask-image:url('../icons/edit.svg')}
.ui-icon-filter{mask-image:url('../icons/filter.svg');-webkit-mask-image:url('../icons/filter.svg')}

.btn{gap:10px}
.btn .ui-icon{background-color:var(--icon-on-dark)}
.btn.ghost .ui-icon,.btn.secondary .ui-icon{background-color:var(--icon-on-light)}
.btn.icon-only{
  width:40px;
  min-width:40px;
  height:40px;
  padding:0;
  border-radius:12px;
}
.btn.small.icon-only{width:38px;min-width:38px;height:38px}
.btn.icon-only .ui-icon{width:18px;height:18px}
.btn.icon-only.is-copied{background:var(--success);border-color:var(--success);color:#fff}
.btn.icon-only.is-copied .ui-icon{background-color:#fff}
.btn.on-dark .ui-icon{background-color:#fff}
.action-btn{display:inline-flex;align-items:center;gap:8px}
.action-btn span:last-child{line-height:1}

.card.task-card,
.task-mini-rich{
  position:relative;
  overflow:hidden;
}
.card.task-card::before,
.task-mini-rich::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg,var(--primary) 0%, var(--mint) 100%);
  opacity:.9;
}

.task-grid > div strong,
.task-grid > div .detail-label,
.task-grid > div > strong,
.task-mini-rich .mini-meta strong,
.sources-detail strong{color:var(--primary-strong)}
.task-grid > div p,
.task-grid > div .detail-text,
.task-mini-rich .mini-meta{margin:0}

.source-link-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.source-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 13px;
  border-radius:999px;
  background:var(--panel-soft);
  color:var(--primary-strong);
  font-weight:800;
  border:1px solid var(--line);
  transition:transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}
.source-chip .ui-icon{background-color:var(--icon-on-light)}
.source-chip:hover{transform:translateY(-1px);background:#edf4f7;border-color:var(--line-strong)}
.source-chip.primary{background:var(--primary);color:#fff;border-color:var(--primary)}
.source-chip.primary .ui-icon{background-color:#fff}
.source-chip.source-chip-edit{background:#fff;color:var(--primary-strong)}
.source-chip::before{display:none}

.table-head .btn.icon-only{align-self:flex-start}
.meta-card{position:relative;padding-bottom:56px}
.meta-card .btn.icon-only{position:absolute;right:16px;bottom:16px}
.prompt-box{background:#fff;border-color:var(--line-strong);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.tabs-row .btn{padding-inline:14px}

.score-pill{display:inline-flex;align-items:center;justify-content:center;min-height:34px}
.score-edit-preview{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:-4px}

/* unify source views */
.task-top .page-actions{align-self:flex-start}
.task-card h3,.task-mini-rich h3{color:var(--primary-strong)}
.task-card .table-sub{margin-top:8px}

/* improve charts responsiveness */
.cards-grid.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.chart-row{display:grid;grid-template-columns:minmax(180px,220px) 1fr;gap:18px;align-items:center}
.chart-legend{min-width:0}
.chart-legend-item{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:center}

/* mobile logic */
@media (max-width: 980px){
  .cards-grid.two{grid-template-columns:1fr}
  .chart-row{grid-template-columns:1fr;justify-items:start}
}
@media (max-width: 860px){
  .source-link-row .source-chip{width:100%;justify-content:flex-start}
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .responsive-table.keep-table-mobile thead{display:table-header-group}
  .responsive-table.keep-table-mobile,
  .responsive-table.keep-table-mobile tbody,
  .responsive-table.keep-table-mobile tr,
  .responsive-table.keep-table-mobile td,
  .responsive-table.keep-table-mobile th{display:table-cell;width:auto}
  .responsive-table.keep-table-mobile tr{padding:0;border-bottom:0}
  .responsive-table.keep-table-mobile td{padding:14px 12px;border-bottom:1px solid var(--line)}
  .responsive-table.keep-table-mobile td::before{display:none}
}
@media (max-width: 700px){
  .page-actions{width:100%}
  .page-actions .btn,.page-actions a.btn{width:auto}
  .task-grid > div{padding:14px}
  .meta-card{padding-bottom:60px}
}