/* T1 Space shell condivisa (S1-SHELL)
   Alias incrementale: T1S + Project Space + target Gallery/Scaffale */

:root {
  --t1s-shell-accent: var(--ps-world-accent, var(--t1-clinical-dossier, #3dcc9a));
  --t1s-shell-glow: color-mix(in srgb, var(--t1s-shell-accent) 22%, rgba(18, 42, 34, 0.14));
}

body[data-t1-space='project'] {
  --t1s-shell-accent: var(--ps-world-accent, var(--t1-clinical-dossier, #3dcc9a));
}

body[data-t1-space='gallery'] {
  --t1s-shell-accent: var(--gs-world-accent, var(--t1-clinical-dossier, #3dcc9a));
  --t1s-shell-glow: color-mix(in srgb, var(--t1s-shell-accent) 22%, rgba(24, 20, 18, 0.18));
}

body[data-t1-space='clinical'] {
  --t1s-shell-accent: color-mix(in srgb, var(--t1-clinical-mirini, #5c9cf0) 14%, var(--t1-clinical-dossier, #3dcc9a));
  --cs-world-accent: var(--t1s-shell-accent);
}

body[data-t1-space='guide'] {
  --t1s-shell-accent: color-mix(in srgb, var(--t1-pearl, #e8f0fa) 42%, var(--t1-cyan, #00e5ff));
}

/* Fullscreen lock condiviso: niente scroll pagina, solo pannelli interni */
html:has(body.t1s-root--archivio),
html:has(body.ps-root--archivio),
html:has(body.cs-root--archivio),
html:has(body.gs-root.t1s-root--archivio),
html:has(body.guide-root.t1s-root--archivio) {
  height: 100%;
  overflow-x: clip;
  overflow-y: hidden;
}

.t1s-root.t1s-root--archivio,
.ps-root.ps-root--archivio,
.cs-root.cs-root--archivio,
body.gs-root.t1s-root--archivio,
body.guide-root.t1s-root--archivio {
  box-sizing: border-box;
  width: 100%;
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  margin: 0;
  display: flex;
  flex-direction: column;
  overflow-x: clip;
  overflow-y: hidden;
  font-family: var(--t1-font-ui, 'Inter', system-ui, sans-serif);
  color: rgba(248, 250, 255, 0.94);
}

/* Topbar */
.t1s-topbar,
.ps-topbar,
.gs-topbar,
.cs-topbar {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  flex-shrink: 0;
  display: grid;
  grid-template-columns: minmax(0, max-content) minmax(0, 1fr) minmax(0, max-content);
  align-items: center;
  gap: 0.5rem 0.75rem;
  padding: 0.65rem clamp(0.65rem, 2vw, 1.1rem);
  border-bottom: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 12%, var(--gw-glass-border));
  backdrop-filter: var(--gw-glass-surface-blur);
  -webkit-backdrop-filter: var(--gw-glass-surface-blur);
  background: color-mix(in srgb, var(--gw-glass-surface-bg) 92%, transparent);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.32);
  overflow-x: clip;
}

.t1s-brand,
.ps-brand,
.cs-brand,
.gs-brand {
  font-size: 0.76rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: color-mix(in srgb, var(--t1s-shell-accent) 72%, rgba(248, 252, 255, 0.9));
  white-space: nowrap;
  max-width: min(28vw, 11rem);
  overflow: hidden;
  text-overflow: ellipsis;
}

.t1s-topbar__search,
.ps-topbar__search,
.cs-topbar__search,
.gs-topbar__search {
  min-width: 0;
  width: 100%;
  max-width: min(42vw, 480px);
  overflow: hidden;
}

.t1s-search,
.ps-search,
.gs-search {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  font-size: 0.82rem;
  padding: 0.5rem 0.85rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 10%, transparent);
  background: color-mix(in srgb, rgba(0, 0, 0, 0.35) 100%, transparent);
  color: rgba(248, 252, 255, 0.5);
}

.t1s-search:focus,
.ps-search:focus,
.gs-search:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--t1s-shell-accent) 35%, transparent);
  color: rgba(248, 252, 255, 0.92);
}

.t1s-search.is-active,
.ps-search.is-active,
.gs-search.is-active {
  border-color: color-mix(in srgb, var(--t1s-shell-accent) 28%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--t1s-shell-accent) 18%, transparent);
  color: rgba(248, 252, 255, 0.94);
}

.t1s-topbar__actions,
.ps-topbar__actions,
.cs-topbar__actions,
.gs-topbar__actions,
.guide-topbar__actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.t1s-topbar__actions .ps-btn--primary,
.ps-topbar__actions .ps-btn--primary,
.ps-topbar__actions .ps-btn--secondary {
  white-space: nowrap;
  flex-shrink: 0;
  padding: 0.42rem 0.75rem;
  font-size: 0.72rem;
}

.ps-workspace-bar__create .ps-btn--primary,
.ps-workspace-bar__create .ps-btn--secondary {
  white-space: nowrap;
  flex-shrink: 0;
  padding: 0.42rem 0.75rem;
  font-size: 0.72rem;
}

.t1s-link--nav,
.ps-link--nav,
.gs-link,
.gs-link--nav {
  white-space: nowrap;
  flex-shrink: 0;
  padding: 0.34rem 0.55rem;
  font-size: 0.72rem;
  font-weight: 500;
  text-decoration: none;
  color: color-mix(in srgb, var(--t1s-shell-accent) 70%, rgba(248, 252, 255, 0.9));
  border-radius: 9px;
  border: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 12%, rgba(255, 255, 255, 0.07));
  background: color-mix(in srgb, rgba(0, 0, 0, 0.32) 100%, transparent);
  transition:
    color 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.t1s-link--nav:hover,
.t1s-link--nav:focus-visible,
.ps-link--nav:hover,
.ps-link--nav:focus-visible,
.gs-link:hover,
.gs-link:focus-visible,
.gs-link--nav:hover,
.gs-link--nav:focus-visible {
  color: rgba(248, 252, 255, 0.98);
  background: color-mix(in srgb, var(--t1s-shell-accent) 18%, rgba(255, 255, 255, 0.05));
  border-color: color-mix(in srgb, var(--t1s-shell-accent) 44%, transparent);
  box-shadow:
    0 0 22px var(--t1s-shell-glow),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
  outline: none;
}

.t1s-link--nav:active,
.ps-link--nav:active,
.gs-link:active,
.gs-link--nav:active {
  background: color-mix(in srgb, var(--t1s-shell-accent) 24%, rgba(255, 255, 255, 0.04));
  border-color: color-mix(in srgb, var(--t1s-shell-accent) 52%, transparent);
}

/* Fullscreen browser — Space shell (Galleria · Scaffale · Guida) */
.t1s-fullscreen-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  padding: 0;
  margin-left: 0.15rem;
  border-radius: 9px;
  cursor: pointer;
  box-sizing: border-box;
  color: color-mix(in srgb, var(--t1s-shell-accent) 55%, rgba(248, 252, 255, 0.9));
  background: color-mix(in srgb, var(--gw-glass-surface-bg) 75%, transparent);
  border: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 14%, transparent);
  transition: color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.t1s-fullscreen-toggle:hover,
.t1s-fullscreen-toggle.is-active {
  color: color-mix(in srgb, var(--t1s-shell-accent) 90%, #fff);
  border-color: color-mix(in srgb, var(--t1s-shell-accent) 30%, transparent);
  box-shadow: 0 0 16px var(--t1s-shell-glow);
}

.t1s-fullscreen-toggle:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--t1s-shell-accent) 50%, #fff);
  outline-offset: 2px;
}

/* TABLET-S1c — fullscreen browser solo desktop coach (≥1280 + mouse) */
@media not ((min-width: 1280px) and (hover: hover) and (pointer: fine)) {
  [data-t1-space-fullscreen],
  .t1s-fullscreen-toggle,
  .ps-fullscreen-toggle {
    display: none !important;
  }
}

/* Facet + panel shell */
.t1s-panel,
.ps-panel,
.gs-panel,
.cs-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-right: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 8%, rgba(255, 255, 255, 0.04));
  background: color-mix(in srgb, var(--gw-glass-surface-bg) 55%, transparent);
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
}

.t1s-panel__head,
.ps-panel__head,
.gs-panel__head {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 6%, transparent);
}

.t1s-panel__title,
.ps-panel__title,
.gs-panel__title {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--t1s-shell-accent) 58%, var(--gw-text-hint-cold));
}

.t1s-panel__badge,
.ps-panel__badge,
.gs-panel__badge {
  font-size: 0.58rem;
  letter-spacing: 0.04em;
  color: var(--gw-text-hint-cold);
  opacity: 0.65;
}

.t1s-panel__body,
.ps-panel__body,
.gs-panel__body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 0.5rem 0.65rem 0.75rem;
}

.t1s-panel__body--scroll,
.ps-panel__body--scroll {
  overflow-y: auto;
  overflow-x: hidden;
}

.t1s-facet,
.ps-facet,
.gs-facet {
  display: flex;
  flex-direction: column;
  padding: 0.65rem 0.45rem;
  border-right: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 8%, rgba(255, 255, 255, 0.04));
  background: color-mix(in srgb, rgba(0, 0, 0, 0.25) 100%, transparent);
}

.t1s-facet__label,
.ps-facet__label {
  margin: 0 0 0.5rem;
  padding: 0 0.35rem;
  font-size: 0.58rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gw-text-hint-cold);
}

.t1s-facet__nav,
.ps-facet__nav {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.t1s-facet__item,
.ps-facet__btn {
  font: inherit;
  font-size: 0.68rem;
  font-weight: 500;
  text-align: left;
  padding: 0.45rem 0.5rem;
  border-radius: 8px;
  border: 1px solid transparent;
  background: transparent;
  color: color-mix(in srgb, var(--t1s-shell-accent) 55%, var(--gw-text-hint-cold));
  cursor: pointer;
  transition: color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.t1s-facet__item:hover,
.ps-facet__btn:hover {
  color: color-mix(in srgb, var(--t1s-shell-accent) 75%, #fff);
  background: color-mix(in srgb, var(--t1s-shell-accent) 5%, transparent);
}

.t1s-facet__item.is-active,
.ps-facet__btn.is-active {
  color: color-mix(in srgb, var(--t1s-shell-accent) 88%, #fff);
  background: color-mix(in srgb, var(--t1s-shell-accent) 8%, transparent);
  box-shadow: inset 0 0 16px color-mix(in srgb, var(--t1s-shell-accent) 12%, transparent);
}

.t1s-facet__item:disabled,
.ps-facet__btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (max-width: 1023px) and not ((hover: hover) and (pointer: fine)) {
  .t1s-topbar,
  .ps-topbar,
  .gs-topbar,
  .cs-topbar {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    grid-template-areas:
      'brand actions'
      'search search';
  }

  .t1s-brand,
  .ps-brand,
  .gs-brand {
    grid-area: brand;
    max-width: 100%;
  }

  .t1s-topbar__search,
  .ps-topbar__search,
  .gs-topbar__search {
    grid-area: search;
  }

  .t1s-topbar__actions,
  .ps-topbar__actions,
  .cs-topbar__actions,
  .gs-topbar__actions,
  .guide-topbar__actions {
    grid-area: actions;
    justify-content: flex-end;
  }

  .t1s-facet,
  .ps-facet,
  .gs-facet {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    border-right: none;
    border-bottom: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 8%, transparent);
  }

  .t1s-facet__nav,
  .ps-facet__nav {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.t1-space-sort {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}

.t1-space-sort__label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  font-size: 0.58rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  color: var(--gw-text-hint-cold);
  white-space: nowrap;
}

.t1-space-sort__select {
  min-width: 7.5rem;
  max-width: 10.5rem;
  padding: 0.2rem 0.35rem;
  font-size: 0.62rem;
  font-family: inherit;
  color: var(--gw-text-primary);
  background: color-mix(in srgb, var(--gw-glass-surface-bg) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--t1s-shell-accent) 10%, rgba(255, 255, 255, 0.08));
  border-radius: 4px;
}

.t1-space-sort__select:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--t1s-shell-accent) 45%, transparent);
  outline-offset: 1px;
}

.ps-panel__head,
.cs-panel__head {
  flex-wrap: wrap;
}
