/* Remove cloud upsell banner */
.CloudTrialBanner,
.cloud-trial-banner,
.banner,
.top-banner {
  display: none !important;
}

/* ===== Hide feedback + help icons ===== */ 
.TopBar {
  display: none !important;
}

a[href*="feedback-focalboard"],
a[href*="guide/user"] {
  display: none !important;
}

.HelpIcon {
  display: none !important;
}

/* ===== Hide "What's new" / version blue bar ===== */
.VersionMessage {
  display: none !important;
}

.VersionMessage .banner,
.VersionMessage button,
.VersionMessage .CompassIcon {
  display: none !important;
}

/* ===== Hide CloudMessage banner ===== */ 
.CloudMessage {
  display: none !important;
}
/* ===============================
   Use Template button – center + brand color
================================ */

.TemplateSelector,
.TemplateSelector__button,
.UseTemplateButton {
  display: flex !important;
  justify-content: center !important;
  margin: 20px auto !important;
}

.TemplateSelector button,
.UseTemplateButton button {
  background-color: #7B61FF !important;
  border-color: #7B61FF !important;
  color: #ffffff !important;
  font-weight: 600;
  border-radius: 8px;
  padding: 8px 16px;
}

.TemplateSelector button:hover,
.UseTemplateButton button:hover {
  background-color: #6a52e5 !important;
  border-color: #6a52e5 !important;
}
/* ===============================
   Use this template button – center + brand color
================================ */

.Button.filled.size--medium {
  background-color: #5048e5 !important; /* Brand purple */
  border-color: #7B61FF !important;
  color: #ffffff !important;
  font-weight: 600;
  border-radius: 8px;
  padding: 10px 20px;

  display: block !important;
  margin: 0px auto !important;
}

.Button.filled.size--medium:hover {
  background-color: #6a52e5 !important;
  border-color: #6a52e5 !important;
}

/* ===============================
   Hide Focalboard logo, name & version (left sidebar)
================================ */

.logo-title svg {
  display: none !important;
}

.logo-title span {
  display: none !important;
}

.logo-title .versionFrame {
  display: none !important;
}


/* ===============================
  display: none !important;
}*/

/* ===============================
   Change comment button text
   Send -> Comment
================================ */

.CommentBox button.Button.filled span {
  display: none !important;
}

.CommentBox button.Button.filled::after {
  content: "Comment";
  color: #ffffff;
  font-weight: 600;
}

/* ===============================
   Change comment button text
   Send -> Comment
================================ */

.CommentsList__new button.Button.filled span {
  display: none !important;
}

.CommentsList__new button.Button.filled::after {
  content: "Comment";
  color: #ffffff;
  font-weight: 600;
}

/* ===============================
   HIDE SHARE SEARCH INPUT
   "Search for people and channels"
================================ */

.ShareDialog .share-input,
.ShareDialog .userSearchInput {
  display: none !important;
}

.ShareDialog .share-input__container {
  display: none !important;
}

/* Remove empty space after hiding */
.share-input {
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}


.dialog .share-input__container {
  display: none !important;
}
/* =====================================================
   SIDEBAR – BOARD LIST STYLING (CLEAN FINAL)
===================================================== */

/* -------------------------------
   BOARD TITLE STYLE
-------------------------------- */

.SidebarBoardItem.subitem .octo-sidebar-title {
  font-weight: 600 !important;
  position: relative;
  padding-left: 26px;
}

/* Space between boards */
.SidebarBoardItem.subitem {
  margin-bottom: 8px !important;
  padding: 6px 8px !important;
  border-radius: 6px;
}

/* -------------------------------
   DEFAULT STATE → ▶
-------------------------------- */

.SidebarBoardItem.subitem .octo-sidebar-title::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 50%;
  width: 12px;
  height: 12px;
  transform: translateY(-50%);
  background-repeat: no-repeat;
  background-size: contain;
  opacity: 0.7;

  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235048e5'>\
<path d='M9 6l6 6-6 6'/></svg>");

}

/* -------------------------------
   OPEN / ACTIVE / VIEW-ACTIVE → ▼
-------------------------------- */

.SidebarBoardItem.subitem.active .octo-sidebar-title::before,
.SidebarBoardItem.subitem.expanded .octo-sidebar-title::before,
.SidebarBoardItem.subitem.has-active-view .octo-sidebar-title::before {
  opacity: 1 !important;
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%235048e5'>\
<path d='M6 9l6 6 6-6'/></svg>") !important;
}

/* Active board background */
.SidebarBoardItem.subitem.active {
  background-color: rgba(0, 0, 0, 0.06) !important;
}

/* -------------------------------
   VIEWS → NO ARROWS
-------------------------------- */

.SidebarBoardItem.sidebar-view-item .octo-sidebar-title {
  font-weight: 500 !important;
  padding-left: 0 !important;
}

.SidebarBoardItem.sidebar-view-item .octo-sidebar-title::before {
  display: none !important;
}

/* -------------------------------
   SIDEBAR HEADER
-------------------------------- */

.octo-sidebar-title.category-title {
  font-weight: 700 !important;
  letter-spacing: 0.2px;
}



.Sidebar {
  background-color:#F0F4F8 !important;
}
/* ===============================
   Hide Import & Export archive
   (Settings menu)
================================ */

/* Hide Import option */
.MenuOption#import {
  display: none !important;
}

/* Hide Export archive option */
.MenuOption[aria-label="Export archive"] {
  display: none !important;
}
/* ===============================
   Sidebar toggle (collapse) icon
   Brand purple
================================ */

.sidebarSwitcher .HideSidebarIcon,
.sidebarSwitcher .HideSidebarIcon polyline {
  stroke: #5048e5 !important;
  fill: none !important;
}
/* ===============================
   Top-left sidebar icons
   Brand purple
================================ */

/* Hamburger icon (☰) */
.hamburger-icon .HamburgerIcon,
.hamburger-icon .HamburgerIcon polyline {
  stroke: #5048e5 !important;
  fill: none !important;
}

/* Show sidebar icon (⟩⟩) */
.show-icon .ShowSidebarIcon,
.show-icon .ShowSidebarIcon polyline {
  stroke: #5048e5 !important;
  fill: none !important;
}
/* ===============================
   Status label styling (table)
================================ */

.octo-table-cell .Label {
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  display: inline-flex !important;
  align-items: center !important;

  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}


/* Closed label specifically (optional highlight) */
.Label.propColorGreen {
  background-color: #d1fae5 !important; /* soft green */
  color: #065f46 !important;
}
/* ===============================
   Always show calculation row
================================ */

.CalculationRow {
  opacity: 1 !important;
  visibility: visible !important;
}

.CalculationRow .Calculation {
  opacity: 1 !important;
}
/* =====================================================
   MOVE + ADD BOARD & SETTINGS TO TOP OF SIDEBAR
===================================================== */
.Sidebar .octo-sidebar-list {
    flex: 0 0 auto !important;}

.focalboard-body .octo-spacer {
    flex: 0 !important;
}
