/* Shared read placeholders. All selectors stay inside the loading vocabulary. */
.bcos-loading,
.bcos-skeleton {
  --bcos-loading-navy: var(--bcos-navy, #081d3a);
  --bcos-loading-silver: var(--bcos-silver, #c7d2e1);
  --bcos-loading-radius: var(--bcos-panel-radius, 14px);
  --bcos-loading-padding: var(--bcos-card-padding, 16px);
  --bcos-loading-gap: var(--bcos-compact-gap, 12px);
  min-width: 0;
  max-width: 100%;
}
.bcos-loading__region,
.bcos-loading__feedback { min-width: 0; overflow-wrap: anywhere; }
.bcos-loading__status { position: static; font-size: .8125rem; line-height: 1.5; color: inherit; }
.bcos-loading__status:not(:empty) { margin-top: 4px; }
:root {
  --bcos-loading-slot: #f3f6fa;
  --bcos-loading-outline: #cbd5e1;
  --bcos-loading-shape: #d4dfeb;
  --bcos-loading-shine: rgba(255, 255, 255, .7);
}
:root[data-bcos-theme="dark"] {
  --bcos-loading-slot: #20364d;
  --bcos-loading-outline: #526b83;
  --bcos-loading-shape: #506b87;
  --bcos-loading-shine: rgba(225, 239, 255, .2);
}
.bcos-loading__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.bcos-skeleton {
  display: grid;
  gap: var(--bcos-loading-gap);
  color: var(--bcos-loading-silver);
  pointer-events: none;
}
.bcos-skeleton__slot {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-start;
  gap: var(--bcos-loading-gap);
  box-sizing: border-box;
  min-width: 0;
  padding: var(--bcos-loading-padding);
  border: 1px solid var(--bcos-loading-outline);
  border-radius: var(--bcos-loading-radius);
  background: var(--bcos-loading-slot);
}
.bcos-skeleton__slot::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 20%, var(--bcos-loading-shine), transparent 80%);
  transform: translateX(-100%);
  animation: bcos-skeleton-shimmer 2.2s ease-in-out infinite;
  pointer-events: none;
}
.bcos-skeleton__body { display: grid; gap: var(--bcos-loading-gap); flex: 1; min-width: 0; }
.bcos-skeleton__shape {
  display: block;
  flex-shrink: 0;
  height: 12px;
  max-width: 100%;
  border-radius: var(--bcos-compact-radius, 8px);
  background: var(--bcos-loading-shape);
  animation: none;
}
.bcos-skeleton__title { width: 62%; height: 18px; }
.bcos-skeleton__line { width: 92%; }
.bcos-skeleton__short { width: 42%; }
.bcos-skeleton__avatar { width: 44px; height: 44px; border-radius: 50%; }
.bcos-skeleton__date { width: 44px; height: 52px; }
.bcos-skeleton__cell { width: 18%; height: 16px; }
/* Opt-in surfaces share the same decorative skeleton and shimmer. */
.bcos-loading--surface {
  --bcos-loading-slot: var(--bcos-color-surface-raised, #f7fbfe);
  --bcos-loading-outline: var(--bcos-color-border, #cdddea);
  --bcos-loading-shape: #d5e2ef;
  --bcos-loading-shine: rgba(255, 255, 255, .8);
}
:root[data-bcos-theme="dark"] .bcos-loading--surface {
  --bcos-loading-shape: #355577;
  --bcos-loading-shine: rgba(255, 255, 255, .24);
}
:is(.bcos-loading--light, .bcos-loading--surface) .bcos-skeleton__slot {
  border-color: var(--bcos-loading-outline, #cdddea);
  background: var(--bcos-loading-slot, #f7fbfe);
}
:is(.bcos-loading--light, .bcos-loading--surface) .bcos-skeleton__shape {
  position: relative;
  overflow: hidden;
  background: var(--bcos-loading-shape, #e7ecf1);
  animation: none;
}
:is(.bcos-loading--light, .bcos-loading--surface) .bcos-skeleton__shape::after { content: none; }
@keyframes bcos-skeleton-shimmer { to { transform: translateX(100%); } }
.bcos-skeleton--timeline .bcos-skeleton__slot,
.bcos-skeleton--card .bcos-skeleton__slot { min-height: 124px; }
.bcos-skeleton--profile .bcos-skeleton__slot,
.bcos-skeleton--detail .bcos-skeleton__slot { min-height: 156px; }
.bcos-skeleton--table .bcos-skeleton__slot,
.bcos-skeleton--roster .bcos-skeleton__slot { align-items: center; min-height: 80px; border-radius: var(--bcos-compact-radius, 8px); }
.bcos-skeleton--table .bcos-skeleton__short,
.bcos-skeleton--roster .bcos-skeleton__short { display: none; }
.bcos-skeleton--calendar { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.bcos-skeleton--calendar .bcos-skeleton__slot { min-height: 100px; padding: 8px; border-radius: var(--bcos-compact-radius, 8px); }
.bcos-skeleton--calendar .bcos-skeleton__title { width: 30%; }
.bcos-skeleton--agenda .bcos-skeleton__slot { min-height: 100px; }
.bcos-skeleton--message-list .bcos-skeleton__slot { min-height: 96px; border-radius: var(--bcos-compact-radius, 8px); }
@media (max-width: 420px) {
  .bcos-skeleton--table .bcos-skeleton__cell,
  .bcos-skeleton--roster .bcos-skeleton__cell { width: 12%; }
}
@media (prefers-reduced-motion: reduce) {
  .bcos-skeleton__slot::after { animation: none; display: none; }
  .bcos-skeleton__shape { animation: none; }
  :is(.bcos-loading--light, .bcos-loading--surface) .bcos-skeleton__shape::after { animation: none; display: none; }
}