/* =============================================================================
 * AMAC Suite — Workspace Tabs v1  (paired CSS for amac-workspace-v1.js)
 * -----------------------------------------------------------------------------
 * A browser-style tab strip fixed to the top of Suite Home + a full-viewport
 * iframe host below it. DESKTOP ONLY: everything here is gated to >=1025px, so
 * on phones the workspace chrome never appears and Suite Home is unchanged.
 *
 * Layering: loaded after suite-home-v2_0.css; only adds NEW selectors
 * (.amac-ws-*) plus a top offset on .page-shell when tabs are open, so it can't
 * regress the existing tile grid. Navy bar (white text) reads correctly in both
 * light and dark themes, matching the suite header + theme-color (#022544).
 * ============================================================================= */

/* The bar + frame host exist in the DOM at all sizes but are hidden below the
   desktop breakpoint (mobile keeps single-app full-page navigation). */
.amac-ws-bar,
.amac-ws-frames { display: none; }

@media (min-width: 1025px) {

  /* ---- Tab strip (fixed browser chrome across the top) ------------------- */
  .amac-ws-bar {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 40px;
    z-index: 1200;                       /* above app content + the tile grid */
    display: none;                        /* shown only when >=1 tab is open (below) */
    align-items: stretch;
    gap: 2px;
    padding: 0 6px;
    background: #022544;                  /* suite navy; theme-color */
    box-shadow: 0 1px 0 rgba(0,0,0,0.25), 0 2px 8px rgba(0,0,0,0.18);
    font-family: inherit;
  }
  body.amac-ws-has-tabs .amac-ws-bar { display: flex; }

  /* Home / New-tab buttons */
  .amac-ws-home,
  .amac-ws-new {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,0.82);
    cursor: pointer;
    padding: 0 10px;
    font-size: 12.5px;
    font-weight: 600;
    border-radius: 8px;
    margin: 5px 0;
  }
  .amac-ws-home:hover,
  .amac-ws-new:hover { background: rgba(255,255,255,0.12); color: #fff; }
  .amac-ws-home.is-active { background: rgba(255,255,255,0.18); color: #fff; }
  .amac-ws-home svg,
  .amac-ws-new svg { display: block; }
  .amac-ws-new { padding: 0 8px; }

  /* Tabs container (scrolls horizontally when many tabs are open) */
  .amac-ws-tabs {
    display: flex;
    align-items: stretch;
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
  }
  .amac-ws-tabs::-webkit-scrollbar { height: 4px; }
  .amac-ws-tabs::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.25); border-radius: 4px; }

  /* Individual tab */
  .amac-ws-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 220px;
    min-width: 96px;
    padding: 0 6px 0 12px;
    margin: 5px 0;
    border-radius: 8px 8px 8px 8px;
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.85);
    cursor: pointer;
    white-space: nowrap;
    font-size: 12.5px;
    user-select: none;
  }
  .amac-ws-tab:hover { background: rgba(255,255,255,0.16); color: #fff; }
  .amac-ws-tab.is-active {
    background: #f5f7fa;
    color: #022544;
    font-weight: 600;
  }
  .amac-ws-tab-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .amac-ws-tab-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px; height: 20px;
    flex: 0 0 auto;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: inherit;
    opacity: 0.7;
    cursor: pointer;
    padding: 0;
  }
  .amac-ws-tab-close:hover { opacity: 1; background: rgba(0,0,0,0.12); }
  .amac-ws-tab.is-active .amac-ws-tab-close:hover { background: rgba(2,37,68,0.14); }

  /* Cap message ("close a tab to open another") */
  .amac-ws-capmsg {
    position: absolute;
    top: 44px; right: 10px;
    background: #022544;
    color: #fff;
    font-size: 12px;
    padding: 7px 12px;
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.28);
  }

  /* ---- Iframe host (fills the viewport under the bar) -------------------- */
  .amac-ws-frames {
    position: fixed;
    inset: 40px 0 0 0;                    /* below the 40px bar */
    z-index: 1100;
    display: none;
    background: var(--amac-bg, #eef1f5);
  }
  body.amac-ws-app-active .amac-ws-frames { display: block; }
  .amac-ws-frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: none;                        /* JS shows only the active app's frame */
  }

  /* ---- Home (tile grid) view offset when the bar is present ------------- */
  /* When >=1 tab is open, the fixed bar overlaps the top of the page; push the
     tile grid down so nothing hides under it. Only applies while tabs exist. */
  body.suite-shell.suite-home-v2.amac-ws-has-tabs main.page-shell {
    padding-top: 52px !important;
  }
  /* When an app tab is active, the tile grid is hidden behind the iframe host. */
  body.amac-ws-app-active main.page-shell { display: none !important; }

  /* v1.2.0: Suite Home's OWN floating corner launchers (Feedback / Ask AI /
     notification bell) are appended to <body>, not main.page-shell, so they
     kept floating OVER the active app's iframe — duplicating the pills the
     framed app already shows in its universal header. Hide them (and their
     corner-anchored panels) while an app tab is active. The bug/feature
     MODALS are untouched: a report mid-composition must never vanish on a
     tab switch. Apps that lack a header Feedback pill keep their own FAB
     INSIDE the iframe, so feedback never becomes unreachable. */
  body.amac-ws-app-active .amac-bugreport-btn,
  body.amac-ws-app-active .amac-aichat-btn,
  body.amac-ws-app-active .amac-notif-bell,
  body.amac-ws-app-active .amac-feedback-menu,
  body.amac-ws-app-active .amac-aichat-panel,
  body.amac-ws-app-active .amac-notif-panel { display: none !important; }
}