/* OrkaStream Theme – UltraAdmin-style shell
 *
 * Layout goals
 * - Fixed left sidebar with brand + profile + vertical menu
 * - Fixed top bar for page actions
 * - Main content to the right; content scrolls, chrome stays put
 * - Click-to-open submenus (no hover-open)
 */

:root{
  --os-accent: #8c6bb1;

  --os-sidebar-w: 280px;
  --os-sidebar-w-collapsed: 72px;
  --os-topbar-h: 56px;

  /* Sidebar shell */
  --os-sidebar-bg: #1f232a;
  --os-sidebar-bg-2: #1f232a;
  /* Brand strip should blend into the sidebar (no purple block behind the logo) */
  --os-brand-bg: var(--os-sidebar-bg);

  --os-topbar-bg: var(--os-accent);
  --os-topbar-border: rgba(0,0,0,.10);

  --os-text: #e9ecef;
  --os-muted: rgba(233,236,239,.72);
  --os-hover: rgba(255,255,255,.07);
  --os-active: rgba(255,255,255,.12);
  --os-divider: rgba(255,255,255,.10);
}

/* Login page: keep admin layout, but apply OrcaPulse branding safely */
/* Login header colour is handled in login.css; keep this as a safe fallback only */
body.login #header{ background: var(--os-sidebar-bg) !important; }
body.login #site-name{ display:flex; align-items:center; justify-content:center; padding: 10px 0; }
body.login #site-name a{ display:inline-flex; align-items:center; }
body.login .os-login-logo{ height: 72px; width:auto; max-width: 90vw; }


/* -------------------------------------------------
   Global shell layout (only when opted-in)
   ------------------------------------------------- */

body.orkastream-has-sidebar{
  margin: 0;
  padding-left: var(--os-sidebar-w);
  padding-top: var(--os-topbar-h);
}

body.orkastream-has-sidebar.os-sidebar-collapsed{
  padding-left: var(--os-sidebar-w-collapsed);
}

/* Login should never be shifted */
body.login.orkastream-has-sidebar{ padding-left: 0; padding-top: 0; }

body.orkastream-has-sidebar #container{ margin: 0; padding: 0; max-width: none; width: 100%; }
body.orkastream-has-sidebar #content{ max-width: none; width: 100%; box-sizing: border-box; padding: 24px 32px; }
body.orkastream-has-sidebar #content-main{ width: 100%; float: none; }
body.orkastream-has-sidebar #content-related{ display: none; }

/* Make Django admin breadcrumbs match accent (purple) */
body.orkastream-has-sidebar div.breadcrumbs{
  background: var(--os-accent) !important;
  color: #fff !important;
}
body.orkastream-has-sidebar div.breadcrumbs a,
body.orkastream-has-sidebar div.breadcrumbs a:link,
body.orkastream-has-sidebar div.breadcrumbs a:visited{
  color: #fff !important;
}


/* If body class is missing on some pages, still force breadcrumbs bar purple when our shell header is present */
#header.os-shell + div.breadcrumbs{
  background: var(--os-accent) !important;
  color: #fff !important;
}
#header.os-shell + div.breadcrumbs a,
#header.os-shell + div.breadcrumbs a:link,
#header.os-shell + div.breadcrumbs a:visited{
  color: #fff !important;
}

/* Also support breadcrumbs rendered as .breadcrumbs (nav/div) */
#header.os-shell + .breadcrumbs{
  background: var(--os-accent) !important;
  color: #fff !important;
}
#header.os-shell + .breadcrumbs a,
#header.os-shell + .breadcrumbs a:link,
#header.os-shell + .breadcrumbs a:visited{
  color: #fff !important;
}

/* The top bar is fixed; content already has padding-top via body */

/* -------------------------------------------------
   Header wrapper
   ------------------------------------------------- */

#header.os-shell{
  position: static;
  height: 0 !important;  /* admin/base.html expects a header height; we use fixed elements instead */
  padding: 0 !important;
  background: transparent !important;
}

/* -------------------------------------------------
   Sidebar
   ------------------------------------------------- */

#header.os-shell .os-sidebar{
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--os-sidebar-w);
  height: 100vh;
  background: var(--os-sidebar-bg);
  color: var(--os-text);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  z-index: 1000;
}

body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-sidebar{
  width: var(--os-sidebar-w-collapsed);
}

/* Brand bar (purple) */
#header.os-shell .os-brand{
  background: var(--os-sidebar-bg);
padding: 10px 12px;
}

#header.os-shell .os-brand-link{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  color: #fff !important;
  text-decoration: none;
}

#header.os-shell .os-logo{
  display: block;
  height: 56px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}


#header.os-shell .os-logo-mark{ display: none; }
#header.os-shell .os-brand-text{
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
}

body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-brand-text{
  display: none;
}

/* Profile block */
#header.os-shell .os-profile-link{
  display: block;
  color: inherit;
  text-decoration: none;
}

#header.os-shell .os-profile-link:hover .os-profile{
  background: rgba(255,255,255,.06);
}

#header.os-shell .os-profile{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: var(--os-sidebar-bg-2);
  border-bottom: 1px solid var(--os-divider);
}

#header.os-shell .os-avatar{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
  font-size: 18px;
  flex: 0 0 auto;
}

#header.os-shell .os-profile-meta{ min-width: 0; }
#header.os-shell .os-name{ color: #fff; font-weight: 700; line-height: 1.1; }
#header.os-shell .os-role{ color: var(--os-muted); font-size: 12px; margin-top: 2px; }

body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-profile-meta{
  display: none;
}

/* Welcome + logout */
#header.os-shell .os-user-actions{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--os-divider);
  color: var(--os-muted);
  font-size: 12px;
}

#header.os-shell .os-welcome{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

#header.os-shell .os-logout-link{
  color: #fff !important;
  text-decoration: none;
  font-weight: 700;
  font-size: 12px;
}

#header.os-shell .os-logout-link:hover{ text-decoration: underline; }

body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-user-actions{
  /* In collapsed mode we don't show welcome/log out; keep the sidebar compact */
  display: none;
}
body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-welcome{ display: none; }

/* Nav scroll area */
#header.os-shell .os-nav{
  flex: 1;
  overflow: auto;
  padding: 10px 0;
}

/* -------------------------------------------------
   Top bar
   ------------------------------------------------- */

#header.os-shell .os-topbar{
  position: fixed;
  top: 0;
  left: var(--os-sidebar-w);
  right: 0;
  height: var(--os-topbar-h);
  background: var(--os-topbar-bg);
  border-bottom: 1px solid var(--os-topbar-border);
  display: flex;
  align-items: center;
  padding: 0 14px;
  z-index: 900;
}

body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-topbar{
  left: var(--os-sidebar-w-collapsed);
}

#header.os-shell .os-topbar-btn{
  color: #fff;
  appearance: none;
  border: 0;
  background: transparent;
  padding: 8px 10px;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  border-radius: 10px;
}

#header.os-shell .os-topbar-btn:hover{ background: rgba(255,255,255,.12); }

#header.os-shell .os-topbar-spacer{ flex: 1; }

#header.os-shell .os-topbar-user{ display: flex; align-items: center; gap: 10px; color: #fff; }
#header.os-shell .os-topbar-username{ font-weight: 600; }

/* -------------------------------------------------
   Orkaflow menu – UltraAdmin-like
   ------------------------------------------------- */

/* Reset legacy horizontal nav styles from orkaflow-nav.css */
#orkaflow-nav{ position: static !important; top: auto !important; background: transparent !important; padding: 0; margin: 0; }
#orkaflow-nav ul{ list-style: none; margin: 0; padding: 0; }
#orkaflow-nav ul li{ display: block !important; }

/* Link base */
#header.os-shell #orkaflow-nav a,
#header.os-shell #orkaflow-nav a:link,
#header.os-shell #orkaflow-nav a:visited,
#header.os-shell #orkaflow-nav form button{
  color: var(--os-text) !important;
  text-decoration: none;
}

/* Ensure the icon pseudo-elements in orkaflow-icons.css align like a sidebar icon column */
#header.os-shell #orkaflow-nav a:before,
#header.os-shell #orkaflow-nav form button:before{
  display: inline-block;
  width: 22px;
  text-align: center;
  margin-right: 10px;
  opacity: .9;
}

/* Top-level items */
#orkaflow-nav > ul{ display: flex !important; flex-direction: column !important; gap: 2px; }

#orkaflow-nav > ul > li > a{
  display: flex;
  align-items: center;
  padding: 12px 16px;
  margin: 0 10px;
  border-radius: 10px;
  color: var(--os-text) !important;
}

#orkaflow-nav > ul > li > a:hover{ background: var(--os-hover); }

/* Needed so the caret hitbox can be absolutely positioned */
#orkaflow-nav li.os-click-toggle > a{ position: relative; }

#orkaflow-nav .menu-label{ flex: 1; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav > ul > li > a .menu-label{ display: none; }
body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell #orkaflow-nav a:before{ margin-right: 0; }
body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav > ul > li > a{ justify-content: center; margin: 0 6px; }

/* Caret */
#orkaflow-nav li.has-sub > a::after,
#orkaflow-nav li.os-click-toggle > a::after{
  content: '';
  margin-left: auto;
  width: 7px;
  height: 7px;
  border-right: 2px solid rgba(233,236,239,.6);
  border-bottom: 2px solid rgba(233,236,239,.6);
  transform: rotate(-45deg);
  flex: 0 0 auto;
}

body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav li.has-sub > a::after,
body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav li.os-click-toggle > a::after{ display: none; }

/* Clickable caret hitbox (expanded sidebar) */
#orkaflow-nav .os-caret-hitbox{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 56px;
  cursor: pointer;
  display: block;
  z-index: 10;
}

body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav .os-caret-hitbox{ display: none; }

#orkaflow-nav li.os-click-toggle > a::after{ pointer-events: none; }

#orkaflow-nav li.open > a::after{
  transform: rotate(45deg);
  border-right-color: rgba(233,236,239,.95);
  border-bottom-color: rgba(233,236,239,.95);
}

/* Disable hover-to-open from legacy CSS, without flicker */
body.orkastream-has-sidebar #orkaflow-nav ul li:hover > ul{ display: none !important; }
body.orkastream-has-sidebar #orkaflow-nav ul li.open:hover > ul{ display: block !important; }

/* Submenus */
#orkaflow-nav li > ul{
  display: none;
  margin: 0 10px 8px;
  padding: 4px 0 6px;
}

body.orkastream-has-sidebar:not(.os-sidebar-collapsed) #orkaflow-nav li.open > ul{ display: block !important; position: static !important; background: transparent !important; }

#orkaflow-nav li > ul > li > a,
#orkaflow-nav li > ul > li > form button{
  display: flex;
  align-items: center;
  padding: 9px 16px;
  margin: 1px 10px 1px 18px;
  border-radius: 10px;
  background: transparent;
  border: 0;
  cursor: pointer;
  width: calc(100% - 28px);
  text-align: left;
  font-size: 13px;
  color: rgba(233,236,239,.92) !important;
}

#orkaflow-nav li > ul > li > a:hover,
#orkaflow-nav li > ul > li > form button:hover{ background: var(--os-accent); color: #fff !important; }

/* Active item styling (set by JS) */
#header.os-shell #orkaflow-nav a.os-active,
#header.os-shell #orkaflow-nav form button.os-active{
  background: var(--os-active);
  font-weight: 800;
}

#header.os-shell #orkaflow-nav li.os-active-branch > a{
  font-weight: 800;
}

/* Keep existing selected styling as a fallback */
#orkaflow-nav li.selected > a,
#orkaflow-nav a.selected{ background: var(--os-active); }

/* -------------------------------------------------
   Mobile fallback
   ------------------------------------------------- */

@media (max-width: 900px){
  body.orkastream-has-sidebar{ padding-left: 0; padding-top: 0; }
  #header.os-shell .os-topbar{ position: static; left: 0; right: 0; }
  #header.os-shell .os-sidebar{ position: static; width: auto; height: auto; }
}


/* Ultra-admin tweaks: logo strip + active/hover purple */
.os-brand{background:var(--os-brand-bg) !important;}
.os-brand{padding:0 !important;}
.os-brand-link{display:flex;align-items:center;justify-content:center;height:132px;padding:0;}
.os-brand-text{display:none !important;}
/* Force the logo to scale UP (max-height alone won't enlarge small intrinsic images)
   NOTE: Do not set `display` on `.os-logo` here, because both the full logo and
   the mark share the `.os-logo` base class. Setting `display:block` would
   override `.os-logo-mark{display:none}` earlier in this file and cause the
   dolphin mark to show in expanded mode.
*/
#header.os-shell .os-brand-link .os-logo{height:120px;width:auto;max-width:96%;object-fit:contain;}
#header.os-shell .os-brand-link .os-logo-mark{display:none;}

/* Top-right actions (logout + theme toggle) */
#header.os-shell .os-topbar-actions{
  display: flex;
  align-items: center;
  gap: 10px;
}

#header.os-shell .os-topbar-actions .theme-toggle{
  margin: 0;
  padding: 0;
}

#header.os-shell .os-topbar-logout{ margin: 0; }
#header.os-shell .os-topbar-logout-btn{
  appearance: none;
  border: 0;
  background: rgba(255,255,255,.12);
  color: #fff;
  font-weight: 700;
  padding: 8px 12px;
  border-radius: 10px;
  cursor: pointer;
}
#header.os-shell .os-topbar-logout-btn:hover{ background: rgba(255,255,255,.18); }

/* Menu hover + active */
.os-nav a:hover,
.os-nav a:focus{background:var(--os-accent) !important;color:#fff !important;}
.os-nav a.os-active{background:var(--os-accent) !important;color:#fff !important;font-weight:700;}
.os-nav li.os-active-branch > a{font-weight:700;}

/* -------------------------------------------------
   Sidebar icons (SVG) – shown prominently when collapsed
   ------------------------------------------------- */

/* Base icon slot (overrides the legacy orkaflow icon CSS, which is mostly empty) */
#header.os-shell #orkaflow-nav a:before,
#header.os-shell #orkaflow-nav form button:before{
  content: '' !important;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  opacity: .95;
}

/* Helper: default icon if a menu item has no ico-* class */
#header.os-shell #orkaflow-nav a:not([class*="ico-"]):before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='5' fill='%23ffffff'/%3E%3C/svg%3E");
}

/* Top-level menu icons */
#header.os-shell #orkaflow-nav a.ico-home:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M12 3 3 10v11h6v-7h6v7h6V10z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-incoming:before,
#header.os-shell #orkaflow-nav a.ico-in:before,
#header.os-shell #orkaflow-nav a.ico-docsin:before,
#header.os-shell #orkaflow-nav a.ico-fromchannel:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M12 3v12l4-4 1.4 1.4L12 18.8 6.6 12.4 8 11l4 4V3z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-outgoing:before,
#header.os-shell #orkaflow-nav a.ico-out:before,
#header.os-shell #orkaflow-nav a.ico-plugout:before,
#header.os-shell #orkaflow-nav a.ico-tochannel:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M12 21V9l-4 4-1.4-1.4L12 5.2l5.4 6.4L16 13l-4-4v12z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-reports:before,
#header.os-shell #orkaflow-nav a.ico-logs:before,
#header.os-shell #orkaflow-nav a.ico-log:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M6 4h12v2H6zm0 5h12v2H6zm0 5h12v2H6zm0 5h8v2H6z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-config:before,
#header.os-shell #orkaflow-nav a.ico-admin:before,
#header.os-shell #orkaflow-nav a.ico-channel:before,
#header.os-shell #orkaflow-nav a.ico-routes:before,
#header.os-shell #orkaflow-nav a.ico-translate:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M19.4 13a7.9 7.9 0 0 0 .1-1l2-1.5-2-3.5-2.4 1a8.3 8.3 0 0 0-1.7-1L15 4h-4l-.4 2.5a8.3 8.3 0 0 0-1.7 1L6.5 6 4.5 9.5l2 1.5a7.9 7.9 0 0 0 0 2l-2 1.5 2 3.5 2.4-1a8.3 8.3 0 0 0 1.7 1L11 20h4l.4-2.5a8.3 8.3 0 0 0 1.7-1l2.4 1 2-3.5zM13 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-run:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M8 5v14l12-7z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-shortcut:before,
#header.os-shell #orkaflow-nav a.ico-star:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M12 17.3 5.8 21l1.7-7.2L2 8.9l7.3-.6L12 1.5l2.7 6.8 7.3.6-5.5 4.9 1.7 7.2z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-partner:before,
#header.os-shell #orkaflow-nav a.ico-partnergroep:before,
#header.os-shell #orkaflow-nav a.ico-user:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-4.4 0-8 2.2-8 5v2h16v-2c0-2.8-3.6-5-8-5z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav a.ico-logout:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M10 17v-2h4v-6h-4V7l-5 5zM4 3h9v2H6v14h7v2H4z'/%3E%3C/svg%3E");
}
#header.os-shell #orkaflow-nav button.ico-logout:before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M10 17v-2h4v-6h-4V7l-5 5zM4 3h9v2H6v14h7v2H4z'/%3E%3C/svg%3E");
}

/* Collapsed state: show icons only, use flyout overlays for submenus */
body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav li > ul{
  display: none;
  position: fixed;
  /*
   * The collapsed top-level links have horizontal margins, which means their
   * visible/hoverable area ends a few pixels before the sidebar edge.
   * If the flyout starts exactly at the sidebar width, there's a tiny "dead"
   * gap that makes the menu close while moving the mouse into the flyout.
   *
   * JS will fine-tune this per item, but this gives a good no-JS default.
   */
  /* Fallback first for older browsers that don't support CSS variables */
  left: 66px;
  left: calc(var(--os-sidebar-w-collapsed) - 6px);
  top: 120px; /* JS will adjust per item */
  min-width: 240px;
  max-width: 320px;
  background: #2c2f33;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 8px 0;
  z-index: 9999;
  box-shadow: 0 10px 24px rgba(0,0,0,.35);
}
body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav li.open > ul{
  display: block;
  position: fixed !important;
  background: #2c2f33 !important;
  margin: 0 !important;
}
/* Make logout compact when collapsed */
body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-logout-link{
  font-size: 0;
}
body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-logout-link:before{
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffffff' d='M10 17v-2h4v-6h-4V7l-5 5zM4 3h9v2H6v14h7v2H4z'/%3E%3C/svg%3E");
}



/* Logout buttons (forms) */
#header.os-shell .os-user-actions .os-logout-form-top{ margin: 0; }
#header.os-shell .os-user-actions .os-logout-form-top button.os-logout-link{
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font: inherit;
  color: #fff;
}
#header.os-shell #orkaflow-nav .os-logout-form{ margin: 0; }
#header.os-shell #orkaflow-nav .os-logout-btn{
  width: 100%;
  text-align: left;
}


/* Inline logout form in header */
.os-logout-form-inline{ display:inline; margin:0; padding:0; }
.os-logout-form-inline button.os-logout-link{
  background:none; border:0; padding:0; margin:0;
  font: inherit; color: inherit; cursor:pointer;
}

/* Breadcrumbs bar (admin 'Home' strip) should match the accent while logged in */
body.orkastream-has-sidebar .breadcrumbs{
  background: var(--os-accent) !important;
  color: #fff !important;
}
body.orkastream-has-sidebar .breadcrumbs a,
body.orkastream-has-sidebar .breadcrumbs a:link,
body.orkastream-has-sidebar .breadcrumbs a:visited{
  color: #fff !important;
}

/* Safety: keep the login logo contained */
.login .os-login-logo{
  max-height: 90px;
  width: auto;
  max-width: 92vw;
}


/* Collapsed logo: show mark only */
body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-logo-full{ display:none !important; }
body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-logo-mark{ display:block !important; height:44px; width:auto; margin:0 auto; }



/* Flyout submenu labels when sidebar is collapsed */
body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav li > ul .menu-label{ 
  display: inline; 
}
body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav li > ul > li > a{
  margin: 0;
  border-radius: 0;
  padding: 10px 14px;
  justify-content: flex-start;
}
body.orkastream-has-sidebar.os-sidebar-collapsed #orkaflow-nav li > ul > li > a:hover{
  background: rgba(126,87,194,.22);
}

body.orkastream-has-sidebar.os-sidebar-collapsed #header.os-shell .os-brand{ padding: 10px 0; }

/* Simple content helpers (used by /orkaflow/account) */
.os-page{ max-width: 980px; }
.os-card{
  background: var(--os-surface, #fff);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  padding: 18px;
}
.os-card h2{ margin: 0 0 12px 0; }
.os-dl{ margin: 0 0 14px 0; }
.os-dl > div{ display: grid; grid-template-columns: 140px 1fr; gap: 8px; padding: 6px 0; }
.os-dl dt{ font-weight: 700; }
.os-dl dd{ margin: 0; }
.os-actions{ display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.os-btn{
  display: inline-block;
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--os-accent);
  color: #fff !important;
  text-decoration: none;
  font-weight: 700;
}
.os-btn:hover{ filter: brightness(1.05); }
.os-btn.os-btn-secondary{
  background: transparent;
  border: 1px solid rgba(0,0,0,.18);
  color: inherit !important;
}
.os-muted{ color: var(--os-muted); margin-top: 12px; }