/* HUB 1.0 / Block 2: opt-in component layer. Semantic values come from ui-foundation.css */
.hub-design-guide{margin:38px 0 20px;display:grid;gap:20px;max-width:100%}
.hub-design-guide__head,.hub-design-guide__section{min-width:0;border:1px solid var(--hub-ui-color-border);border-radius:var(--hub-ui-radius-lg);background:var(--hub-ui-color-surface);padding:24px}
.hub-design-guide__head{background:var(--hub-ui-color-raised)}
.hub-design-guide__head h2,.hub-design-guide__section h3{margin:6px 0 12px;color:var(--hub-ui-color-text)}
.hub-design-guide__head p,.hub-design-guide__section p{color:var(--hub-ui-color-muted);margin:8px 0 18px}
.hub-ui-toolbar{display:flex;flex-wrap:wrap;gap:var(--hub-ui-space-2);align-items:center;margin:10px 0}
.hub-ui-button{min-height:var(--hub-ui-touch-minimum);border-radius:var(--hub-ui-radius-md);padding:9px 15px;border:1px solid var(--hub-ui-color-border);color:var(--hub-ui-color-text);background:var(--hub-ui-color-subtle);font-weight:650;font-size:var(--hub-ui-font-body);cursor:pointer;transition:filter .15s ease}
.hub-ui-button:hover:not(:disabled){filter:brightness(1.08);transform:none}
.hub-ui-button:focus-visible,.hub-ui-sort:focus-visible{outline:var(--hub-ui-focus-ring) solid var(--hub-ui-color-accent);outline-offset:2px}
.hub-ui-button:disabled{opacity:.5;cursor:not-allowed}
.hub-ui-button--primary{background:var(--hub-accent);color:var(--hub-accent-text);border-color:var(--hub-ui-color-accent)}
.hub-ui-button--secondary{background:var(--hub-ui-color-raised)}
.hub-ui-button--ghost{background:transparent}
.hub-ui-button--danger{background:var(--hub-ui-color-danger);color:#07100e}
.hub-ui-status-row{display:flex;flex-wrap:wrap;gap:var(--hub-ui-space-2);margin:12px 0}
.hub-ui-notice{border:1px solid var(--hub-ui-color-border);border-left-width:4px;border-radius:var(--hub-ui-radius-md);padding:12px 14px;color:var(--hub-ui-color-text);background:var(--hub-ui-color-subtle)}
.hub-ui-notice--info{border-left-color:var(--hub-ui-color-info)}
.hub-ui-notice--success{border-left-color:var(--hub-ui-color-success)}
.hub-ui-notice--warning{border-left-color:var(--hub-ui-color-warning)}
.hub-ui-notice--danger{border-left-color:var(--hub-ui-color-danger)}
.hub-ui-form-grid{max-width:none;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--hub-ui-space-4)}
.hub-ui-form-grid .hub-field{margin:0;align-content:start}
.hub-ui-form-grid .hub-field__control{width:100%;min-width:0}
.hub-ui-filters{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin:12px 0}
.hub-ui-filters label{flex:1 1 210px;display:grid;gap:7px;min-width:0;color:var(--hub-ui-color-text)}
.hub-ui-table-wrap{border:1px solid var(--hub-ui-color-border);border-radius:var(--hub-ui-radius-lg);overflow-x:auto;background:var(--hub-ui-color-surface);max-width:100%}
.hub-ui-table{width:100%;min-width:500px;border-collapse:collapse}
.hub-ui-table th,.hub-ui-table td{border-bottom:1px solid var(--hub-ui-color-border);padding:12px 14px;text-align:left;vertical-align:middle}
.hub-ui-table tr:last-child td{border-bottom:0}
.hub-ui-table tr[hidden]{display:none}
.hub-ui-table th{font-weight:700;font-size:var(--hub-ui-font-caption);background:var(--hub-ui-color-raised)}
.hub-ui-sort{font:inherit;font-weight:inherit;cursor:pointer;text-align:left;width:100%;min-height:34px;justify-content:flex-start;gap:6px;display:inline-flex;background:transparent;color:var(--hub-ui-color-text);padding:4px;border:0}
.hub-ui-table th[aria-sort="ascending"] .hub-ui-sort,.hub-ui-table th[aria-sort="descending"] .hub-ui-sort{color:var(--hub-ui-color-accent)}
.hub-ui-dialog{border:1px solid var(--hub-ui-color-border);border-radius:var(--hub-ui-radius-lg);background:var(--hub-ui-color-surface);color:var(--hub-ui-color-text);padding:24px;max-width:min(480px,calc(100vw - 32px));box-shadow:0 18px 48px rgba(0,0,0,.28)}
.hub-ui-dialog::backdrop{background:rgba(0,0,0,.58)}
.hub-ui-dialog h3{margin-top:0}
.hub-ui-dialog p{color:var(--hub-ui-color-muted)}
@media(max-width:760px){
  .hub-design-guide__head,.hub-design-guide__section{padding:16px}
  .hub-ui-toolbar{align-items:stretch}
  .hub-ui-table{min-width:440px}
  .hub-ui-form-grid{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){.hub-ui-button{transition:none}}

/* Reusable navigation, page hierarchy, empty states and paged table controls */
.hub-ui-breadcrumbs{font-size:var(--hub-ui-font-caption);color:var(--hub-ui-color-muted);margin:8px 0}
.hub-ui-breadcrumbs ol{display:flex;list-style:none;gap:8px;align-items:center;flex-wrap:wrap;margin:0;padding:0}
.hub-ui-breadcrumbs li:not(:last-child)::after{content:"›";margin-left:8px;color:var(--hub-ui-color-muted)}
.hub-ui-breadcrumbs a{color:var(--hub-ui-color-accent);text-decoration:underline;text-underline-offset:3px}
.hub-ui-page-head{margin:12px 0}
.hub-ui-page-head h2{margin:0 0 8px;font-size:var(--hub-ui-font-title);font-weight:750}
.hub-ui-page-head p{margin:0;color:var(--hub-ui-color-muted)}
.hub-ui-empty{margin:12px 0;padding:24px;border:1px dashed var(--hub-ui-color-border);border-radius:var(--hub-ui-radius-lg);text-align:center}
.hub-ui-empty strong{font-size:var(--hub-ui-font-body)}
.hub-ui-empty p{color:var(--hub-ui-color-muted);margin:8px 0 0}
.hub-ui-pagination{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px;margin-top:12px}
.hub-ui-page-state{font-size:var(--hub-ui-font-caption);font-variant-numeric:tabular-nums;color:var(--hub-ui-color-muted)}
.hub-ui-toggle-column{display:flex!important;align-items:center;gap:8px;flex:1 1 200px;min-height:44px}
.hub-ui-toggle-column input[type=checkbox]{width:20px;height:20px;flex-shrink:0;accent-color:var(--hub-ui-color-accent)}
.hub-ui-table [hidden]{display:none!important}

.hub-ui-button{gap:8px}
.hub-ui-icon{display:inline-flex;min-width:16px;align-items:center;justify-content:center;font-size:1.05em;line-height:1;font-weight:800}