/* ═══════════════════════════════════════════════════════════════════════════
   owner-space.css — Overlay « Espace propriétaire » (owner-space.js)
   Calqué sur conversations.css. L'iframe charge owner/ (bundle React).
   ═══════════════════════════════════════════════════════════════════════════ */

.owner-space-overlay {
  position: fixed;
  inset: 0;
  z-index: 1500;
  background: var(--color-bg, #f5f6f8);
  display: flex;
  flex-direction: column;
  animation: ownerSpaceFadeIn .25s ease;
}
@keyframes ownerSpaceFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.owner-space-overlay.closing { animation: ownerSpaceFadeOut .25s ease forwards; }
@keyframes ownerSpaceFadeOut {
  to { opacity: 0; transform: translateY(8px); }
}

.owner-space-overlay iframe {
  width: 100%;
  height: 100%;
  flex: 1;
  border: 0;
  display: block;
}

/* Bandeau de contexte : le Chef regarde l'écran d'un tiers, en lecture seule.
   Il occupe le haut de l'overlay (safe area comprise) ; l'iframe prend le reste
   via flex:1, donc rien n'est recouvert. */
.owner-space-banner {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: max(env(safe-area-inset-top, 0px), 0px) 58px 0 14px;
  min-height: 38px;
  box-sizing: content-box;
  background: #1f2937;
  color: #f9fafb;
}
.owner-space-banner-text {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 38px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.owner-space-close-btn {
  position: fixed;
  top: max(env(safe-area-inset-top, 12px), 12px);
  right: 14px;
  z-index: 1600;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(17, 24, 39, .75);
  color: #fff;
  display: grid;
  place-items: center;
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background .15s, transform .1s;
}
.owner-space-close-btn:hover { background: rgba(0, 0, 0, .85); }
.owner-space-close-btn:active { transform: scale(.94); }
.owner-space-close-btn svg { width: 18px; height: 18px; }

@media (prefers-color-scheme: dark) {
  .owner-space-overlay { background: #0b0d12; }
  .owner-space-banner { background: #111827; color: #e5e7eb; }
  .owner-space-close-btn { background: rgba(243, 244, 246, .14); color: #f3f4f6; }
  .owner-space-close-btn:hover { background: rgba(243, 244, 246, .25); }
}

/* Bouton d'ouverture dans l'en-tête de la fiche Chef — même gabarit que les
   autres icônes d'en-tête (voir conversations.css). */
.btn-tasks.btn-owner-space-header {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  color: #1f2937;
}
.btn-tasks.btn-owner-space-header:hover {
  background: rgba(31, 41, 55, .08);
  color: #0b1220;
}
.btn-tasks.btn-owner-space-header svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  stroke-width: 2;
}