@import url("/assets/application-839c155b.css");
@import url("/assets/themes/plana/plana_test_management-15179566.css");
@import url("/assets/themes/plana/plana_personal_todos-dc1b240b.css");
@import url("/assets/themes/plana/plana_my_page-a6abdd95.css");
@import url("/assets/themes/plana/plana_templates-ea75821f.css");

@font-face {
  font-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  src: url("/assets/themes/plana/inter-latin-400-normal-7c9140a2.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  src: url("/assets/themes/plana/inter-latin-600-normal-943cdcc5.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  src: url("/assets/themes/plana/inter-latin-700-normal-48e5a320.woff2") format("woff2");
}

:root {
  color-scheme: light;
  --bg: #F7FBFA;
  --surface: #FFFFFF;
  --surface-soft: #EAF4F2;
  --surface-glass: rgba(255, 255, 255, 0.78);
  --text: #102027;
  --text-muted: #526A73;
  --text-subtle: #596F78;
  --border: #C8DDD9;
  --border-strong: #9FC2BC;
  --primary: #1E68AE;
  --on-primary: #FFFFFF;
  --primary-hover: #1A5C99;
  --primary-soft: #EBF1F8;
  --accent: var(--primary);
  --accent-hover: var(--primary-hover);
  --on-accent: var(--on-primary);
  --on-accent-hover: var(--on-primary);
  /* Filled actions have their own states; raw accent and link tokens stay semantic. */
  --button-bg: color-mix(in srgb, var(--accent) 25%, var(--surface));
  --button-hover-bg: color-mix(in srgb, var(--accent) 37%, var(--surface));
  --button-selected-bg: color-mix(in srgb, var(--accent) 45%, var(--surface));
  --button-selected-hover-bg: color-mix(in srgb, var(--accent) 53%, var(--surface));
  --button-border: var(--primary);
  --button-hover-border: var(--primary-hover);
  --button-text: var(--text);
  --button-check-text: var(--on-primary);
  --button-hover-shadow: var(--shadow);
  --secondary: #3D761A;
  --secondary-hover: #336B14;
  --secondary-soft: #E3F8D8;
  --focus: #1E68AE;
  --shadow: rgba(13, 17, 23, 0.12);
  --shadow-panel: 0 1px 3px var(--shadow);
  --danger: #B73A48;
  --warning: #A86612;
  --progress-track: #DDE9E6;
  --progress-fill: #55E6A6;
  --progress-fill-strong: #157F83;
  --gradient-brand: linear-gradient(135deg, #7ADF45 0%, #55E6A6 48%, #21C7CA 100%);
  --gradient-glow: radial-gradient(circle, rgba(33, 199, 202, 0.36) 0%, rgba(122, 223, 69, 0.2) 45%, rgba(13, 17, 23, 0) 72%);
  --top-menu-height: 34px;
  --header-height: 116px;
  --sidebar-width: 248px;
  --sidebar-collapsed-width: 56px;
}

html[data-theme="dark"] {
  --button-bg: color-mix(in srgb, var(--accent) 11%, var(--surface));
  --button-hover-bg: color-mix(in srgb, var(--accent) 21%, var(--surface));
  --button-selected-bg: color-mix(in srgb, var(--accent) 32%, var(--surface));
  --button-selected-hover-bg: color-mix(in srgb, var(--accent) 44%, var(--surface));
  color-scheme: dark;
  --bg: #0D1117;
  --surface: #121C24;
  --surface-soft: #172B34;
  --surface-glass: rgba(23, 43, 52, 0.78);
  --text: #EAF7F6;
  --text-muted: #9EB6BE;
  --text-subtle: #8EA5AE;
  --border: #2B4750;
  --border-strong: #3A6670;
  --primary: #559DE2;
  --on-primary: #102027;
  --primary-hover: #6FADE7;
  --primary-soft: #233542;
  --secondary: #7ADF45;
  --secondary-hover: #8EF263;
  --secondary-soft: #1D3518;
  --focus: #559DE2;
  --shadow: rgba(0, 0, 0, 0.38);
  --danger: #FF6B7A;
  --warning: #FFC15A;
  --progress-track: #23363D;
  --progress-fill: #55E6A6;
  --progress-fill-strong: #21C7CA;
}

* {
  box-sizing: border-box;
  scrollbar-color: var(--border-strong) var(--surface-soft);
}

input, select, textarea, progress {
  accent-color: var(--accent);
}

::selection {
  background: var(--primary-soft);
  color: var(--text);
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-corner {
  background: var(--surface-soft);
}

::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border: 3px solid var(--surface-soft);
  border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--accent);
}

.plana-inline-editor .ui-selectmenu-button {
  width: 100%;
  min-width: 0;
  margin: 0;
  background: var(--surface);
  border-color: var(--border-strong);
  color: var(--text);
}

#content .plana-inline-control:focus,
#content .plana-inline-editor .ui-selectmenu-button:focus {
  border-color: var(--focus);
  outline: 2px solid var(--focus);
  outline-offset: 2px;
  box-shadow: none;
}

.ui-datepicker .ui-widget-header,
.ui-datepicker .ui-state-default {
  background: var(--surface-soft);
  border-color: var(--border);
  color: var(--text);
}

.ui-datepicker .ui-state-highlight {
  background: var(--secondary-soft);
  border-color: var(--secondary);
  color: var(--text);
}

.ui-datepicker .ui-state-active,
.ui-datepicker .ui-state-hover,
.ui-selectmenu-menu .ui-state-active {
  background: var(--primary-soft) !important;
  border-color: var(--primary) !important;
  color: var(--primary) !important;
}

.ui-datepicker,
.ui-selectmenu-open {
  z-index: 10010 !important;
}

html,
body {
  background: var(--bg);
  color: var(--text);
}

body {
  font-family: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  min-width: 0;
}

a,
a:link,
a:visited {
  color: var(--primary);
}

a:hover,
a:focus {
  color: var(--primary-hover);
}

input,
select,
textarea,
button {
  font-family: inherit;
}

input[type="text"],
input[type="password"],
input[type="date"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="url"],
input[type="tel"],
select,
textarea,
.drdn-trigger {
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  color: var(--text);
  min-height: 30px;
}

:where(.tabular, #login-form, #quick-search) :is(input[type="text"], input[type="password"], input[type="date"], input[type="email"], input[type="number"], input[type="search"], input[type="url"], input[type="tel"], select, textarea):not(.plana-inline-control) {
  padding: 0.3rem 0.5rem;
}

option,
optgroup {
  background: var(--surface);
  color: var(--text);
}

input:focus,
select:focus,
textarea:focus,
button:focus-visible,
a:focus-visible,
.drdn-trigger:focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}

#wrapper {
  background:
    radial-gradient(circle at 14% 5%, rgba(122, 223, 69, 0.12), transparent 28rem),
    radial-gradient(circle at 94% 8%, rgba(33, 199, 202, 0.16), transparent 30rem),
    var(--bg);
  min-height: 100vh;
  overflow-x: clip;
}

#top-menu {
  align-items: center;
  background: color-mix(in srgb, var(--surface-soft) 86%, transparent);
  border-bottom: 1px solid var(--border);
  color: var(--text-muted);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(20rem, 1fr) minmax(0, 23rem) minmax(20rem, 1fr);
  min-height: var(--top-menu-height);
  padding: 0 16px;
  position: sticky;
  top: 0;
  z-index: 40;
}

#top-menu .general-menu .top-menu__links > ul,
#top-menu .general-menu .top-menu__links > ul > li {
  align-items: center;
  display: flex;
  gap: 0.7rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

#top-menu .general-menu .top-menu__links > ul > li {
  position: relative;
}

#top-menu .general-menu ul.menu-children {
  align-items: stretch;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  box-shadow: 0 18px 38px var(--shadow);
  display: none;
  flex-direction: column;
  gap: 0.15rem;
  inset-block-start: 100%;
  inset-inline-start: 0;
  min-width: 16rem;
  padding: 0.4rem;
  position: absolute;
  z-index: 60;
}

#top-menu .general-menu li:hover > ul.menu-children,
#top-menu .general-menu li:focus-within > ul.menu-children {
  display: flex;
}

#top-menu .general-menu ul.menu-children li {
  display: block;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}

#top-menu .general-menu ul.menu-children a {
  border-radius: 6px;
  display: block;
  padding: 0.45rem 0.6rem;
  white-space: nowrap;
}

#top-menu .general-menu ul.menu-children a:hover,
#top-menu .general-menu ul.menu-children a:focus-visible {
  background: var(--primary-soft);
  color: var(--primary);
}

#top-menu a,
#loggedas {
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
}

#top-menu a:hover {
  color: var(--primary);
}

#loggedas,
#top-menu > ul {
  display: none;
}

#top-menu .general-menu {
  grid-column: 1;
  min-width: 0;
}

#top-menu .profile-menu {
  align-items: center;
  display: flex;
  gap: 0.65rem;
  grid-column: 3;
  justify-self: end;
  min-width: max-content;
}

#account {
  align-items: center;
  display: flex;
  gap: 0.65rem;
  min-width: max-content;
}

#account .dropdown-trigger {
  align-items: center;
  border: 0;
  border-radius: 4px;
  display: inline-flex;
  padding: 0;
}

#account .dropdown-trigger:hover,
#account .dropdown-trigger:focus-visible {
  box-shadow: 0 0 0 1px var(--focus);
}

#account .dropdown-trigger .avatar {
  border: 0;
  border-radius: 4px;
  margin: 0;
}

#account .dropdown-content {
  background: var(--surface);
  border: 1px solid var(--border-strong);
  box-shadow: 0 18px 38px var(--shadow);
  color: var(--text);
  min-width: 13rem;
}

#account .dropdown-content .user-info {
  color: var(--text);
}

#account .dropdown-content .user-login {
  color: var(--text-muted);
}

#account .dropdown-content ul,
#account .dropdown-content li {
  display: block;
  margin: 0;
  padding: 0;
}

#account .dropdown-content a {
  color: var(--text-muted);
  display: block;
}

#account .dropdown-content a:hover,
#account .dropdown-content a:focus-visible {
  background: var(--primary-soft);
  color: var(--primary);
}

#account .plana-account-admin-link {
  color: var(--primary);
}

#plana-theme-toggle {
  align-items: center;
  appearance: none;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  color: var(--primary);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 700;
  gap: 0.35rem;
  min-height: 24px;
  padding: 0.2rem 0.55rem;
}

#plana-theme-toggle:hover {
  background: var(--surface-soft);
  border-color: var(--focus);
  color: var(--primary-hover);
}

.plana-mobile-actions,
#plana-mobile-theme-toggle,
.plana-mobile-backdrop {
  display: none;
}

#header {
  background:
    radial-gradient(circle at 10% 50%, rgba(122, 223, 69, 0.16), transparent 28%),
    radial-gradient(circle at 92% 48%, rgba(33, 199, 202, 0.22), transparent 30%),
    var(--surface-glass);
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow-panel);
  display: grid;
  gap: 0.35rem 1rem;
  grid-template-columns: minmax(14rem, 1fr) minmax(18rem, 42rem);
  min-height: var(--header-height);
  padding: 12px 20px 0;
  position: relative;
  z-index: 20;
}

/* The project menu is in the grid, so core's absolute-menu reserve is unnecessary. */
body.has-main-menu #header {
  padding-block-end: 0;
}

#header h1 {
  align-self: end;
  color: var(--text);
  font-size: 1.55rem;
  font-weight: 700;
  grid-column: 1;
  margin: 0;
  padding: 0 0 0.25rem;
}

#header h1 .breadcrumbs,
#header h1 .separator {
  color: var(--text-muted);
}

#header h1 .current-project {
  display: inline-flex;
  max-width: 100%;
  min-width: 0;
  position: relative;
  vertical-align: baseline;
}

#header h1.plana-header-identity {
  align-items: flex-start;
  display: inline-flex;
  flex-direction: column;
  gap: 0.25rem;
  justify-content: flex-start;
  min-height: 0;
  padding: 0;
}

.plana-logo-lockup {
  display: inline-flex;
  line-height: 1;
}

.plana-logo-image-wrap {
  align-items: center;
  background-image: url("/assets/themes/plana/plana-logo-light-0245b1b0.svg");
  background-position: left center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-flex;
  aspect-ratio: 608 / 124;
  height: auto;
  width: min(15rem, 58vw);
}

html[data-theme="dark"] .plana-logo-image-wrap {
  background-image: url("/assets/themes/plana/plana-logo-dark-65d6c512.svg");
}

.plana-logo-text {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

#quick-search {
  align-items: center;
  display: flex;
  float: none;
  gap: 0.6rem;
  grid-column: 2;
  justify-content: flex-end;
  margin: 0;
}

#quick-search.plana-top-search {
  grid-column: 2;
  justify-content: center;
  justify-self: center;
  max-width: 23rem;
  min-width: 0;
  width: 100%;
}

#quick-search form {
  flex: 1 1 14rem;
  max-width: 24rem;
}

#quick-search.plana-top-search form {
  align-items: center;
  display: flex;
  flex: 1 1 auto;
  gap: 0.5rem;
  margin: 0;
  max-width: none;
  min-width: 0;
  width: 100%;
}

#quick-search label {
  color: var(--text-subtle);
  font-weight: 700;
}

#quick-search.plana-top-search label {
  flex: 0 0 auto;
  white-space: nowrap;
}

#quick-search input#q {
  width: 100%;
}

#quick-search.plana-top-search input#q {
  flex: 1 1 auto;
  min-width: 0;
}

#project-jump.drdn {
  flex: 0 1 17rem;
  margin: 0;
}

#project-jump .drdn-trigger {
  background: var(--surface);
  color: var(--text);
  display: block;
  line-height: 1.6;
  min-height: 32px;
  padding: 0.25rem 2rem 0.25rem 0.6rem;
}

#project-jump .drdn-trigger:hover,
#project-jump .drdn-trigger:focus {
  border-color: var(--focus);
  color: var(--text);
}

.plana-project-jump-source {
  display: none !important;
}

.plana-project-switcher {
  display: inline-flex;
  max-width: 100%;
  min-width: 0;
  vertical-align: baseline;
}

.plana-project-switcher-trigger {
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: 6px 6px 0 0;
  color: var(--text-muted);
  cursor: pointer;
  display: inline-flex;
  font-size: 1.12rem;
  font-weight: 700;
  height: auto !important;
  line-height: 1.2;
  margin: 0 0 0.12rem;
  max-width: 100%;
  min-height: 0;
  overflow-wrap: anywhere;
  padding: 0.25rem 1.55rem 0.35rem 0.35rem;
  position: relative;
  text-align: left;
  white-space: normal;
}

.plana-project-switcher-trigger::before {
  background: transparent;
  border-radius: 999px;
  bottom: 0.12rem;
  content: "";
  height: 3px;
  left: 0.45rem;
  position: absolute;
  right: 0.45rem;
}

.plana-project-switcher-trigger::after {
  border-color: currentColor transparent transparent;
  border-style: solid;
  border-width: 0.3rem 0.24rem 0;
  content: "";
  position: absolute;
  right: 0.28rem;
  top: 50%;
  transform: translateY(-35%);
}

.plana-project-switcher-trigger:hover,
.plana-project-switcher-trigger:focus-visible,
.plana-project-switcher-trigger[aria-expanded="true"] {
  background: color-mix(in srgb, var(--primary-soft) 72%, transparent);
  color: var(--primary);
}

.plana-project-switcher-trigger:hover::before,
.plana-project-switcher-trigger:focus-visible::before,
.plana-project-switcher-trigger[aria-expanded="true"]::before {
  background: var(--accent);
}

.plana-project-switcher-panel {
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  box-shadow: 0 18px 38px var(--shadow);
  color: var(--text);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-height: min(64vh, 30rem);
  overflow: hidden;
  padding: 0.45rem;
  position: fixed;
  z-index: 1000;
}

.plana-project-switcher-panel[hidden] {
  display: none;
}

.plana-project-switcher-search {
  background: var(--bg);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  color: var(--text);
  font-size: 0.92rem;
  min-height: 2.3rem;
  padding: 0.35rem 0.55rem;
  width: 100%;
}

.plana-project-switcher-list {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  max-height: min(48vh, 23rem);
  overflow: auto;
}

.plana-project-switcher-option,
.plana-project-switcher-empty {
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--text) !important;
  display: block;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.25;
  min-height: 2.2rem;
  overflow-wrap: anywhere;
  padding: 0.45rem 0.6rem;
  text-decoration: none;
}

.plana-project-switcher-option {
  padding-left: calc(0.6rem + var(--plana-project-indent, 0rem));
}

.plana-project-switcher-child {
  font-weight: 650;
}

.plana-project-switcher-option:hover,
.plana-project-switcher-option:focus,
.plana-project-switcher-option.selected {
  background: var(--primary-soft);
  border-color: var(--border-strong);
  color: var(--primary) !important;
  outline: none;
}

.plana-project-switcher-option.selected::before {
  content: "\2713";
  margin-right: 0.45rem;
}

.plana-project-switcher-empty {
  color: var(--text-subtle) !important;
}

#main-menu {
  align-self: end;
  background: transparent;
  bottom: auto;
  grid-column: 1 / -1;
  left: auto;
  margin: 0;
  overflow: visible;
  padding: 0;
  position: static;
  width: auto;
}

#main-menu ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin: 0;
  padding: 0;
}

#main-menu li,
#main-menu li a {
  float: none;
}

#main-menu li a {
  align-items: center;
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  color: var(--text-muted);
  display: inline-flex;
  font-size: 0.9rem;
  font-weight: 700;
  gap: 0.4rem;
  line-height: 1.1;
  padding: 0.62rem 0.72rem;
  text-decoration: none;
}

#main-menu .plana-menu-icon,
.plana-mobile-nav-link .plana-menu-icon {
  color: inherit;
  flex: 0 0 18px;
  height: 18px;
  width: 18px;
}

.plana-mobile-nav-link {
  gap: 0.5rem;
}

#main-menu li a:hover {
  background: var(--surface-soft);
  color: var(--text);
}

#main-menu li a.selected,
#main-menu li a.selected:hover,
#main-menu li a.selected:focus,
#main-menu li a.selected:focus-visible,
#main-menu li a.selected:active,
#main-menu li:hover > a.selected {
  background: color-mix(in srgb, var(--primary-soft) 72%, transparent);
  border-bottom-color: var(--primary);
  color: var(--primary);
}

#main-menu li a.new-object {
  background: var(--button-bg);
  border-radius: 6px;
  color: var(--button-text);
}

#main-menu li a.new-object:hover,
#main-menu li a.new-object:focus,
#main-menu li a.new-object:focus-visible,
#main-menu li a.new-object:active {
  background: var(--button-hover-bg);
  border-bottom-color: transparent;
  color: var(--button-text);
  box-shadow: 0 2px 4px var(--button-hover-shadow);
}

#main-menu .menu-children {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  box-shadow: 0 12px 30px var(--shadow);
  min-width: 9rem;
  padding: 0.3rem 0;
}

#main-menu .menu-children li {
  display: block;
}

#main-menu .menu-children li a {
  background: transparent;
  border: 0;
  color: var(--text);
  display: flex;
  font-weight: 600;
  line-height: 1.25;
  padding: 0.55rem 0.75rem;
  white-space: nowrap;
}

#main-menu .menu-children li a:hover,
#main-menu .menu-children li a:focus,
#main-menu .menu-children li a:focus-visible,
#main-menu .menu-children li a:active {
  background: color-mix(in srgb, var(--primary-soft) 70%, var(--surface));
  border: 0;
  color: var(--primary);
}

.plana-plugin-nav {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0 0 1rem;
}

.plana-plugin-nav a {
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-muted);
  display: inline-flex;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.15;
  min-height: 32px;
  padding: 0.42rem 0.7rem;
  text-decoration: none;
}

.plana-plugin-nav a:hover {
  background: var(--surface-soft);
  border-color: var(--border-strong);
  color: var(--text);
}

.plana-plugin-nav a.selected {
  background: var(--primary-soft);
  border-color: var(--focus);
  color: var(--primary);
}

#main {
  align-items: stretch;
  background: transparent;
  display: grid;
  gap: 0;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  margin: 0;
  min-height: calc(100vh - var(--top-menu-height) - var(--header-height));
  padding: 0;
  transition: grid-template-columns 0.18s ease;
}

#main.nosidebar {
  display: block;
  min-height: calc(100vh - var(--top-menu-height) - var(--header-height));
}

#main.nosidebar #sidebar {
  display: none;
}

#main.nosidebar #content {
  min-height: inherit;
  width: 100%;
}

body.plana-sidebar-collapsed #main {
  grid-template-columns: var(--sidebar-collapsed-width) minmax(0, 1fr);
}

#sidebar {
  background: var(--surface-soft);
  border-right: 1px solid var(--border);
  color: var(--text-muted);
  float: none;
  margin: 0;
  min-height: 100%;
  overflow: hidden;
  padding: 0;
  width: auto;
}

#sidebar-switch-panel {
  display: none;
}

#plana-sidebar-toggle {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border);
  color: var(--text-muted);
  cursor: pointer;
  display: flex;
  font-weight: 700;
  gap: 0.5rem;
  justify-content: flex-end;
  min-height: 40px;
  padding: 0 14px;
  width: 100%;
}

#plana-sidebar-toggle:hover {
  color: var(--primary);
}

#sidebar-wrapper {
  padding: 14px 16px;
}

#sidebar h3 {
  color: var(--text-subtle);
  font-size: 0.75rem;
  letter-spacing: 0.03em;
  margin: 0.95rem 0 0.45rem;
  text-transform: uppercase;
}

#sidebar ul {
  list-style: none;
  margin: 0 0 0.75rem;
  padding: 0;
}

#sidebar li {
  margin: 0.1rem 0;
}

#sidebar a,
#sidebar .query,
#sidebar .dashboard {
  border-radius: 6px;
  color: var(--text-muted);
  display: block;
  font-weight: 700;
  padding: 0.34rem 0.45rem;
  text-decoration: none;
}

#sidebar a:hover {
  background: var(--surface);
  color: var(--text);
}

#sidebar a.selected,
#sidebar .dashboard.selected {
  background: var(--primary-soft);
  color: var(--primary);
}

body.plana-sidebar-collapsed #sidebar-wrapper {
  display: none;
}

body.plana-sidebar-collapsed #plana-sidebar-toggle {
  justify-content: center;
  padding: 0;
}

body.plana-sidebar-collapsed #plana-sidebar-toggle .plana-sidebar-label {
  display: none;
}

#content {
  background: var(--bg);
  border: 0;
  float: none;
  margin: 0;
  min-height: 100%;
  min-width: 0;
  padding: 18px 20px 30px;
  width: auto;
}

/* Native and plugin section titles must follow the active palette, like page titles. */
#content :is(h1, h2, h3, h4, h5, h6, legend) {
  color: var(--text);
}

#content h2 {
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0 0 0.9rem;
}

#content > h2 {
  font-size: 1.35rem;
  font-weight: 700;
}

.box,
.mypage-box,
.issue,
.news-article,
.wiki-page,
.tab-content,
fieldset {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: var(--shadow-panel);
  color: var(--text);
}

div.issue,
#content div.issue,
#content div.journal,
#content div.version,
#content div.wiki,
#content .wiki,
#content .wiki-page,
#content .tab-content,
#content .splitcontentleft,
#content .splitcontentright {
  background: var(--surface) !important;
  color: var(--text) !important;
}

div.issue {
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  box-shadow: var(--shadow-panel);
  padding: 0.75rem;
}

div.issue h3,
div.issue h4,
div.issue p,
div.issue .subject,
div.issue .description,
div.issue .attributes,
div.issue .attribute,
div.issue .value,
div.issue .label,
div.journal,
div.journal p,
.wiki,
.wiki-page {
  color: var(--text) !important;
}

div.issue .label,
div.issue .attribute .label,
div.journal .contextual,
#content .meta {
  color: var(--text-muted) !important;
}

div.issue hr,
div.journal {
  border-color: var(--border) !important;
}

/* Issue journals share the subtask table's surfaces and compact borders. */
#content #history .tab-content {
  border: 0;
  box-shadow: none;
  padding: 0;
}

#content #history .journal {
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: none;
  margin: 0.7rem 0;
  padding: 0;
}

#content #history .journal-header {
  background: color-mix(in srgb, var(--surface-soft) 80%, var(--surface));
  border-bottom: 1px solid var(--border);
  border-radius: 7px 7px 0 0;
  color: var(--text);
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0;
  padding: 0.48rem 0.55rem;
}

#content #history .journal-info {
  flex: 1 1 18rem;
  min-width: 0;
  overflow-wrap: anywhere;
}

#content #history .journal-meta,
#content #history .journal-actions {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

#content #history .journal-meta {
  margin-inline-start: auto;
}

#content #history .journal-header .journal-link,
#content #history .journal-header .update-info,
#content #history .journal-details {
  color: var(--text-muted);
}

#content #history .journal-content {
  margin: 0;
  padding: 0.65rem 0.75rem;
  overflow-wrap: anywhere;
}

#content #history .journal-content .wiki {
  margin-inline-start: 0;
}

#content #history .journal-details {
  margin: 0 0 0.65rem;
  padding-inline-start: 1.25rem;
}

#content #history .private-notes {
  border-inline-start: 2px solid var(--danger);
}

#content #history :target > .journal-header,
#content #history .journal:target .journal-header {
  background: var(--primary-soft);
}

#content #history .tabs ul {
  border-bottom-color: var(--border);
}

#content #history .tabs ul li a {
  background: var(--surface-soft);
  border-color: var(--border);
  color: var(--text-muted);
}

#content #history .tabs ul li a:hover,
#content #history .tabs ul li a.selected {
  background: var(--surface);
  border-color: var(--border);
  color: var(--primary);
  box-shadow: none;
}

#content #history .tabs ul li a.selected {
  border-bottom-color: var(--surface);
}

#content #history .tabs-buttons {
  background: var(--surface);
  border-color: var(--border);
}

div#activity h3 {
  background: var(--surface-soft) !important;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text);
  margin: 1.2rem 0 0.65rem;
  padding: 0.55rem 0.75rem;
}

div#activity dl {
  margin-left: 2em;
}

div#activity dt {
  background: color-mix(in srgb, var(--surface-soft) 76%, transparent);
  border: 1px solid transparent;
  border-radius: 6px;
  box-sizing: border-box;
  color: var(--text);
  margin: 0.25rem 0 0;
  padding: 0.55rem 0.75rem;
  width: 100%;
}

div#activity dl dt:first-child {
  border-top: 1px solid transparent;
}

div#activity dt:hover,
div#activity dt:focus-within {
  background: color-mix(in srgb, var(--primary-soft) 40%, var(--surface-soft));
  border-color: var(--border);
}

div#activity dt .time {
  color: var(--text-muted);
}

div#activity dt.me .time {
  border-bottom-color: var(--border-strong);
}

div#activity dd,
div#activity dd span.description {
  color: var(--text-muted);
}

.box,
.mypage-box,
.tab-content,
fieldset {
  margin: 0.55rem 0;
  padding: 0.7rem;
}

.block-receiver {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 8px;
  min-height: 0;
}

.dragging .block-receiver {
  background: color-mix(in srgb, var(--primary-soft) 32%, transparent) !important;
  border-color: var(--border-strong) !important;
  border-style: solid !important;
}

.contextual {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  float: right;
  gap: 0.4rem;
  margin: 0 0 0.6rem 0.8rem;
}

.contextual a,
.contextual .icon,
a.icon,
a.icon-only {
  color: var(--primary);
}

.icon-svg {
  color: currentColor;
  max-height: 1.1em;
  max-width: 1.1em;
}

#content .flash {
  border: 0;
  border-left: 5px solid var(--primary);
  border-radius: 7px;
  box-shadow: none;
  color: var(--text);
  margin: 0.6rem 0;
  padding: 0.65rem 0.8rem 0.65rem 2.25rem;
}

#content .flash.notice {
  background: var(--secondary-soft);
  border-left-color: var(--secondary);
}

#content .flash.error {
  background: color-mix(in srgb, var(--danger) 16%, var(--surface));
  border-left-color: var(--danger);
}

#content .flash.warning,
p.warning {
  background: color-mix(in srgb, var(--warning) 12%, var(--surface));
  border-color: var(--warning);
  color: var(--text);
}

.nodata {
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-muted);
}

#errorExplanation {
  background: color-mix(in srgb, var(--danger) 10%, var(--surface));
  border: 1px solid var(--danger);
  border-radius: 6px;
  color: var(--text);
}

.field_with_errors :is(input, select, textarea),
:is(input, select, textarea)[aria-invalid="true"] {
  border-color: var(--danger);
}

#login-form,
#login-form table,
#login-form label {
  background: var(--surface) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

#login-form {
  border-radius: 8px;
  box-shadow: var(--shadow-panel);
}

#query_form_with_buttons {
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 0.85rem;
  padding: 0.35rem 0.6rem;
}

#query_form fieldset {
  background: transparent;
  border: 0;
  box-shadow: none;
  margin: 0;
  padding: 0.35rem 0;
}

#query_form legend {
  color: var(--text-muted);
  font-weight: 700;
}

#filters-table {
  font-size: 0.9rem;
}

div.buttons,
form .buttons,
p.buttons {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin: 0.7rem 0;
}

input[type="submit"],
button,
.button,
a.button,
#login-submit {
  background: var(--button-bg);
  border: 1px solid var(--button-border);
  border-radius: 6px;
  color: var(--button-text);
  cursor: pointer;
  font-weight: 700;
  min-height: 30px;
  padding: 0.35rem 0.75rem;
}

input[type="submit"]:hover:enabled,
button:hover:enabled,
.button:hover,
a.button:hover {
  background: var(--button-hover-bg);
  border-color: var(--button-hover-border);
  color: var(--button-text);
  box-shadow: 0 2px 4px var(--button-hover-shadow);
}

input[type="button"],
input[type="reset"] {
  background: var(--surface-soft);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  min-height: 30px;
  padding: 0.35rem 0.75rem;
}

input[type="button"]:hover:enabled,
input[type="reset"]:hover:enabled {
  background: var(--primary-soft);
  border-color: var(--primary);
}

:is(button, input, select, textarea):disabled {
  cursor: not-allowed;
}

/* Keep disabled fields readable without fading their text with opacity. */
:is(input, select, textarea):disabled {
  background: var(--surface-soft);
  border-color: var(--border);
  color: var(--text-muted);
}

button:disabled,
input[type="submit"]:disabled,
input[type="button"]:disabled,
input[type="reset"]:disabled {
  opacity: 0.6;
}

.controller-issues.action-index .plana-query-launcher {
  align-items: center;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-bottom: 0.85rem;
  padding: 0.55rem 0.65rem;
}

.controller-issues.action-index .plana-query-launcher-open {
  align-items: center;
  display: inline-flex;
  gap: 0.45rem;
  min-height: 32px;
}

.controller-issues.action-index .plana-query-parent-sort-toggle {
  align-items: center;
  background: var(--button-bg);
  border-color: var(--button-border);
  color: var(--button-text);
  display: inline-flex;
  gap: 0.4rem;
  min-height: 32px;
}

.controller-issues.action-index .plana-query-parent-sort-toggle:hover,
.controller-issues.action-index .plana-query-parent-sort-toggle:focus-visible {
  background: var(--button-hover-bg);
  border-color: var(--button-hover-border);
  color: var(--button-text);
  box-shadow: 0 2px 4px var(--button-hover-shadow);
}

.controller-issues.action-index .plana-query-parent-sort-toggle.is-active {
  background: var(--button-selected-bg);
  border-color: var(--button-border);
  color: var(--button-text);
  box-shadow: inset 0 0 0 1px var(--button-border);
}

.controller-issues.action-index .plana-query-parent-sort-toggle.is-active:hover,
.controller-issues.action-index .plana-query-parent-sort-toggle.is-active:focus-visible {
  background: var(--button-selected-hover-bg);
  border-color: var(--button-hover-border);
  color: var(--button-text);
  box-shadow: inset 0 0 0 1px var(--button-hover-border), 0 2px 4px var(--button-hover-shadow);
}

.controller-issues.action-index .plana-query-launcher-reset {
  align-items: center;
  background: var(--surface);
  border-color: var(--border);
  color: var(--primary);
  display: inline-flex;
  gap: 0.4rem;
  min-height: 32px;
}

.controller-issues.action-index .plana-query-launcher-reset:hover,
.controller-issues.action-index .plana-query-launcher-reset:focus-visible {
  background: var(--primary-soft);
  border-color: var(--border-strong);
  color: var(--primary-hover);
}

.controller-issues.action-index .plana-query-launcher-icon {
  display: inline-flex;
}

.controller-issues.action-index .plana-query-select-wrap {
  align-items: center;
  display: inline-flex;
  gap: 0.4rem;
}

.controller-issues.action-index .plana-query-select-label {
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 600;
}

.controller-issues.action-index .plana-query-select {
  min-width: 12rem;
}

.plana-query-modal {
  align-items: center;
  background: rgba(13, 17, 23, 0.5);
  bottom: 0;
  display: flex;
  font-family: Inter, "Segoe UI", "Noto Sans JP", Helvetica, Arial, sans-serif;
  font-size: 13px;
  justify-content: center;
  left: 0;
  line-height: 1.5;
  padding: 16px;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 2400;
}

.plana-query-modal[hidden] {
  display: none;
}

.plana-query-modal__dialog {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 18px 48px var(--shadow);
  box-sizing: border-box;
  color: var(--text);
  display: flex;
  flex-direction: column;
  height: min(90vh, 780px);
  max-width: 98vw;
  min-width: min(800px, 98vw);
  overflow: hidden;
  width: 1200px;
}

.plana-query-modal__header {
  align-items: center;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  display: flex;
  flex: 0 0 auto;
  gap: 12px;
  justify-content: space-between;
  padding: 2px 12px;
}

.plana-query-modal__title {
  font-size: 14px;
  font-weight: 700;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plana-query-modal__actions {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
}

.plana-query-modal__icon-button,
.plana-query-modal__icon-button:hover,
.plana-query-modal__icon-button:focus-visible {
  align-items: center;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 9999px;
  color: var(--text-muted);
  cursor: pointer;
  display: inline-flex;
  height: 24px;
  justify-content: center;
  min-height: 24px;
  padding: 0;
  width: 24px;
}

.plana-query-modal__icon-button:hover,
.plana-query-modal__icon-button:focus-visible {
  background: var(--primary-soft);
  color: var(--primary);
}

.plana-query-modal__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 0.85rem;
}

.plana-query-modal-open {
  overflow: hidden;
}

.plana-query-modal #query_form {
  margin: 0;
}

.plana-query-modal #query_form_with_buttons {
  background: transparent;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
}

.plana-query-modal #query_form_content {
  display: block;
}

.plana-query-modal #query_form fieldset {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: none;
  margin: 0 0 0.75rem;
  padding: 0.75rem;
}

.plana-query-modal #query_form legend {
  color: var(--text-muted);
  cursor: default;
  font-size: 0.86rem;
  font-weight: 700;
  padding: 0 0.25rem;
}

.plana-query-modal #query_form legend .icon-svg {
  display: none;
}

.plana-query-modal #plana-query-columns > .plana-query-section-body > div > .field:first-child {
  display: none;
}

.plana-query-modal .plana-query-section-body,
.plana-query-modal #query_form fieldset > div {
  margin-top: 0.25rem;
}

.plana-query-modal .plana-query-sort-row {
  align-items: center;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: 2rem minmax(12rem, 20rem) minmax(8rem, 13rem);
  margin: 0.35rem 0;
}

.plana-query-modal .plana-query-sort-count {
  color: var(--text-muted);
  font-weight: 600;
}

.plana-query-modal .query-columns {
  display: inline-flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-right: 0.9rem;
  vertical-align: top;
}

.plana-query-modal .query-columns select {
  min-width: 15rem;
}

.plana-query-modal #query_form p.buttons {
  background: var(--surface);
  border-top: 1px solid var(--border);
  bottom: -0.85rem;
  margin: 0.8rem -0.85rem -0.85rem;
  padding: 0.55rem 0.85rem;
  position: sticky;
}

.autoscroll {
  border-radius: 8px;
  margin: 0.7rem 0;
  overflow: auto;
}

table.list {
  background: var(--surface);
  border: 1px solid var(--border);
  border-collapse: separate;
  border-radius: 8px;
  border-spacing: 0;
  box-shadow: var(--shadow-panel);
  color: var(--text);
  overflow: hidden;
  width: 100%;
}

#content table,
#content table.list,
#content table.attributes {
  color: var(--text);
}

table.list th {
  background: color-mix(in srgb, var(--surface-soft) 80%, var(--surface));
  border: 0;
  border-bottom: 1px solid var(--border);
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 0.48rem 0.55rem;
  text-align: left;
  white-space: nowrap;
}

table.list th a,
table.list th a:link,
table.list th a:visited {
  color: inherit;
}

table.list th a:hover {
  color: var(--primary-hover);
}

table.list td {
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  color: var(--text);
  padding: 0.42rem 0.55rem;
  vertical-align: middle;
}

table.list tr:last-child td {
  border-bottom: 0;
}

table.list tbody tr:hover {
  background: color-mix(in srgb, var(--primary-soft) 48%, transparent);
}

table.list tbody tr {
  background-color: var(--surface) !important;
}

table.list tbody tr:nth-child(even) {
  background-color: color-mix(in srgb, var(--surface-soft) 28%, var(--surface)) !important;
}

table.list tbody tr:hover td {
  background: color-mix(in srgb, var(--primary-soft) 48%, transparent) !important;
}

table.list tbody tr:hover table.progress td.closed,
table.list tbody tr:hover table.progress td.done {
  background: linear-gradient(90deg, var(--progress-fill), var(--progress-fill-strong)) !important;
}

table.list tbody tr:hover table.progress td.todo {
  background: transparent !important;
}

table.list tr.odd,
table.list tr.even {
  background: var(--surface);
}

table.list tr.odd,
table.list tr.odd td {
  background-color: var(--surface) !important;
}

table.list tr.even,
table.list tr.even td {
  background-color: color-mix(in srgb, var(--surface-soft) 28%, var(--surface)) !important;
}

table.list tr.odd td,
table.list tr.even td,
table.list tbody tr td,
#content table.attributes th,
#content table.attributes td,
#content table.list td {
  background-color: transparent !important;
  color: var(--text) !important;
}

table.list caption,
table.list.related-issues td.subject,
table.list.related-issues td.assigned_to {
  color: var(--text) !important;
}

table.list.related-issues a.issue,
table.list.related-issues a.issue:link,
table.list.related-issues a.issue:visited {
  background: color-mix(in srgb, var(--primary-soft) 78%, var(--surface)) !important;
  border-radius: 5px;
  box-shadow: none !important;
  color: var(--primary) !important;
  font-weight: 700;
  padding: 0.05rem 0.22rem;
  text-shadow: none !important;
}

table.list.related-issues {
  table-layout: fixed;
}

table.list.related-issues td.checkbox {
  text-align: center;
  width: 34px;
}

.controller-versions div#roadmap table.list.related-issues td.assigned_to {
  inline-size: 28px;
  min-inline-size: 28px;
  padding-left: 0.3rem;
  padding-right: 0.15rem;
  text-align: center;
  width: 28px;
}

table.list.related-issues td.subject {
  overflow-wrap: anywhere;
  width: auto;
}

table.list.related-issues td.buttons {
  border-left: 0 !important;
  display: table-cell;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  text-align: center;
  white-space: nowrap;
  width: 42px;
}

table.list.related-issues td.buttons a.icon-only {
  align-items: center;
  display: inline-flex;
  height: 28px;
  justify-content: center;
  width: 28px;
}

table.list.related-issues td.buttons .icon-label {
  display: none;
}

.controller-versions table.list.related-issues td.tags.plana-roadmap-tags-cell {
  max-width: 20rem;
  min-width: 17.5rem;
  overflow: hidden;
  padding-left: 0.35rem;
  vertical-align: middle;
  white-space: normal !important;
  width: 20rem;
}

.controller-versions table.list.related-issues td.subject {
  padding-right: 0.35rem;
}

.controller-versions div#roadmap table.list.related-issues td.assigned_to .avatar {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--border-strong) 72%, transparent);
  margin: 0;
  padding: 0;
}

.controller-versions table.list.related-issues td.tags .plana-roadmap-tags {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.16rem 0.25rem;
  line-height: 1.25;
  max-height: 2.75em;
  overflow: hidden;
  white-space: normal !important;
}

.controller-versions table.list.related-issues td.tags .plana-roadmap-tags a,
.controller-versions table.list.related-issues td.tags .plana-roadmap-tags span {
  flex: 0 0 auto;
  max-width: 100%;
  white-space: nowrap !important;
}

.controller-versions table.list.related-issues td.tags .plana-roadmap-tags .plana-tag {
  margin: 0 !important;
}

.controller-versions table.list.related-issues td.tags .plana-roadmap-tags .tag-label {
  background: color-mix(in srgb, var(--surface-soft) 82%, var(--surface));
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text);
  display: inline-flex;
  padding: 0.05rem 0.35rem;
}

.plana-roadmap-controls {
  align-items: center;
  display: flex;
  gap: 0.4rem;
  margin-bottom: 1rem;
}

.plana-roadmap-controls label {
  cursor: pointer;
}

.controller-versions #roadmap .version-article {
  padding-block-start: 0;
  margin-block: 0 1.5rem;
}

.controller-versions #roadmap .plana-roadmap-version-header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding-block: 0;
  margin-bottom: 0.45rem;
}

.controller-versions #roadmap .plana-roadmap-version-header .contextual {
  float: none;
  margin: 0;
  padding: 0;
}

.controller-versions #roadmap .plana-roadmap-version-header .icon-edit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
}

.controller-versions #roadmap .version-overview > p:empty {
  display: none;
}

.controller-versions #roadmap .version-overview .progress-info {
  margin-block: 0.25rem 0.65rem;
}

.controller-versions #roadmap .version-overview table.progress {
  margin-block: 0;
  max-inline-size: calc(100% - 3.5rem);
}

.controller-versions #roadmap table.related-issues .plana-roadmap-issue-number a.issue,
.controller-versions #roadmap table.related-issues a.plana-roadmap-issue-subject {
  background: transparent !important;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none !important;
}

.controller-versions #roadmap table.related-issues .plana-roadmap-issue-number {
  font-size: 0.9rem;
  font-weight: 400;
  color: var(--text-muted);
}

.controller-versions #roadmap table.related-issues .plana-roadmap-issue-number a.issue {
  color: var(--text-muted) !important;
  font-weight: 400;
}

.controller-versions #roadmap table.related-issues td.subject a.plana-roadmap-issue-subject {
  color: var(--primary) !important;
  font-size: 1rem;
  font-weight: 500;
}

.controller-versions #roadmap form[data-cm-url] {
  display: block;
  overflow-x: auto;
}

.controller-versions #roadmap table.related-issues {
  min-width: 44rem;
}

.controller-versions #roadmap table.related-issues:has(td.plana-git-roadmap-cell) {
  min-width: 60rem;
}

.controller-versions #roadmap table.related-issues td.plana-git-roadmap-cell {
  width: 34%;
  text-align: left;
  vertical-align: middle;
  white-space: normal;
}

.controller-versions #roadmap table.related-issues:has(td.plana-git-roadmap-cell) td.tags.plana-roadmap-tags-cell {
  width: 20%;
  min-width: 0;
}

.controller-versions .plana-roadmap-controls:has(input:not(:checked)) ~ #roadmap tr[data-plana-context],
.controller-versions .plana-roadmap-controls:has(input:not(:checked)) ~ #roadmap tr[data-plana-subissue="true"],
.controller-versions #roadmap tr[data-plana-context][hidden],
.controller-versions #roadmap tr[data-plana-subissue][hidden],
.controller-versions #roadmap .plana-roadmap-hidden-message[hidden] {
  display: none !important;
}

.controller-versions #roadmap .plana-roadmap-hidden-message {
  color: var(--text-muted);
}

.controller-versions #roadmap tr[data-plana-parent="true"] td.subject {
  font-weight: 700;
}

.controller-versions #roadmap tr[data-plana-group-start="true"]:not(:first-child) > td {
  border-top: 0.45rem solid var(--surface) !important;
}

.controller-versions #roadmap table.related-issues tr.plana-roadmap-context td.subject,
.controller-versions #roadmap table.related-issues tr.plana-roadmap-context a {
  color: var(--text-muted) !important;
  font-weight: 400;
}

.controller-versions #roadmap table.related-issues tr.plana-roadmap-context a.issue {
  background: transparent !important;
}

.plana-roadmap-context-note {
  font-size: 0.85em;
  margin-left: 0.65rem;
}

.controller-versions #roadmap tr[data-plana-context]:not([data-plana-depth="0"]) td.subject,
.controller-versions #roadmap tr[data-plana-subissue="true"] td.subject,
table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.plana-issue-context.idnt td.subject,
table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child td.subject {
  --plana-issue-subject-depth: 0.9rem;
  --plana-issue-subject-chevron-color: var(--text-muted);
  --plana-issue-subject-chevron-gap: 0.55rem;
  --plana-issue-subject-chevron-size: 1.1rem;
  padding-left: calc(0.55rem + var(--plana-issue-subject-depth) + var(--plana-issue-subject-chevron-size) + var(--plana-issue-subject-chevron-gap)) !important;
  position: relative;
}

.controller-versions #roadmap tr[data-plana-context]:not([data-plana-depth="0"]) td.subject,
.controller-versions #roadmap tr[data-plana-subissue="true"] td.subject {
  --plana-issue-subject-depth: calc(min(var(--plana-roadmap-depth), 9) * 0.9rem);
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-1 td.subject {
  --plana-issue-subject-depth: 0.9rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-2 td.subject {
  --plana-issue-subject-depth: 1.8rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-3 td.subject {
  --plana-issue-subject-depth: 2.7rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-4 td.subject {
  --plana-issue-subject-depth: 3.6rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-5 td.subject {
  --plana-issue-subject-depth: 4.5rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-6 td.subject {
  --plana-issue-subject-depth: 5.4rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-7 td.subject {
  --plana-issue-subject-depth: 6.3rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-8 td.subject {
  --plana-issue-subject-depth: 7.2rem;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child.idnt-9 td.subject {
  --plana-issue-subject-depth: 8.1rem;
}

.controller-versions #roadmap tr[data-plana-context]:not([data-plana-depth="0"]) td.subject::before,
.controller-versions #roadmap tr[data-plana-subissue="true"] td.subject::before,
table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.plana-issue-context.idnt td.subject::before,
table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child td.subject::before {
  border: 0;
  background-color: var(--plana-issue-subject-chevron-color);
  mask: url("/assets/themes/plana/subtask-arrow-17e6b2da.svg") center / contain no-repeat;
  content: "";
  display: block;
  height: var(--plana-issue-subject-chevron-size);
  left: calc(0.55rem + var(--plana-issue-subject-depth));
  margin: 0;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: var(--plana-issue-subject-chevron-size);
}

table.list.issues:not(.plana-subtasks-table) tr.issue.parent td.subject a.issue,
table.list.issues:not(.plana-subtasks-table) tr.issue.parent td.subject a {
  font-weight: 700;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.plana-issue-context.idnt td.subject,
table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.issue.child td.subject {
  background: transparent !important;
}

.controller-issues.action-index table.list.issues tr.plana-issue-context > td,
.controller-issues.action-index table.list.issues tr.plana-issue-context a {
  color: var(--text-muted) !important;
  font-weight: 400;
}

table.list.issues.plana-parent-tree-table:not(.plana-subtasks-table) tr.plana-issue-context.idnt td.subject {
  --plana-issue-subject-depth: calc(min(var(--plana-context-depth), 9) * 0.9rem);
}

.controller-issues.action-index table.list.issues.plana-parent-tree-table tr[data-plana-group-start="true"]:not(:first-child) > td {
  border-top: 0.45rem solid var(--surface) !important;
}

.plana-context-label {
  font-size: 0.8em;
  margin-right: 0.5rem;
}

.plana-subtasks-section {
  margin-top: 0.5rem;
  width: 100%;
}

.plana-subtasks-heading {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0.65rem;
}

.plana-subtasks-message {
  color: var(--text-muted);
  font-size: 0.84rem;
  font-weight: 700;
  min-height: 0;
}

.plana-subtasks-message.error {
  color: var(--danger);
}

.plana-subtasks-message.success {
  color: var(--secondary);
}

table.plana-subtasks-table[hidden],
table.plana-subtasks-table .plana-subtask-create-row[hidden] {
  display: none;
}

table.plana-subtasks-table {
  box-shadow: none;
  min-width: 0;
  table-layout: fixed;
  width: 100% !important;
}

table.plana-subtasks-table input,
table.plana-subtasks-table select {
  max-width: 100%;
  width: 100%;
}

table.plana-subtasks-table td {
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
  word-break: normal;
}

table.plana-subtasks-table td.buttons {
  white-space: nowrap;
}

.plana-subtasks-empty {
  margin: 0.7rem 0;
}

tr.plana-subtask-row .buttons button {
  margin-right: 0.25rem;
}

tr.plana-subtask-row .buttons .icon {
  min-height: 28px;
}

table.plana-subtasks-table td.done_ratio .plana-subtask-display {
  align-items: center;
  display: flex;
  gap: 0.35rem;
  min-width: 0;
}

table.plana-subtasks-table td.done_ratio table.progress {
  flex: 1 1 5.5rem;
  margin: 0;
  max-width: 5.5rem;
  min-width: 3.5rem;
  width: auto;
}

table.plana-subtasks-table td.done_ratio p.percent {
  flex: 0 0 auto;
  margin: 0;
}

.plana-subtasks-row-actions {
  align-items: center;
  display: inline-flex;
  gap: 0.2rem;
  justify-content: flex-end;
  max-width: 100%;
  min-width: 0;
}

tr.plana-subtask-row.is-editing .plana-subtasks-row-actions {
  align-items: stretch;
  flex-direction: column;
  gap: 0.25rem;
}

tr.plana-subtask-row.is-editing .buttons button {
  justify-content: center;
  margin-right: 0;
  width: 100%;
}

tr.plana-subtask-row td.subject {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

tr.plana-subtask-row td.subject .plana-subtask-display {
  align-items: center;
  display: flex;
  gap: 0.35rem;
  min-width: 0;
  padding-left: calc(var(--plana-subtask-level, 0) * 1rem);
}

.plana-subtask-depth {
  border-left: 2px solid color-mix(in srgb, var(--secondary) 52%, transparent);
  display: inline-block;
  flex: 0 0 auto;
  height: 1.2rem;
  opacity: 0.7;
  width: 0;
}

tr.plana-subtask-row .plana-subtask-value {
  display: inline-block;
  max-width: 100%;
  min-width: 0;
  vertical-align: middle;
}

tr.plana-subtask-row td.subject .plana-subtask-value {
  flex: 1 1 auto;
}

tr.plana-subtask-row td.subject a.plana-subtask-subject-link {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plana-subtasks-col-subject {
  width: 29%;
}

.plana-subtasks-col-status {
  width: 8%;
}

.plana-subtasks-col-assignee {
  width: 12%;
}

.plana-subtasks-col-date {
  width: 9%;
}

.plana-subtasks-col-progress {
  width: 10%;
}

.plana-subtasks-col-priority {
  width: 6%;
}

.plana-subtasks-col-version {
  width: 7%;
}

.plana-subtasks-col-buttons {
  width: 10%;
}

table.plana-subtasks-table td.buttons {
  background: transparent !important;
  overflow: hidden;
  text-align: right;
}

table.plana-subtasks-table td.buttons a,
table.plana-subtasks-table td.buttons button,
table.plana-subtasks-table td.buttons span {
  vertical-align: middle;
}

table.plana-subtasks-table td.buttons .icon-label {
  display: none;
}

tr.plana-subtask-create-row td {
  background: color-mix(in srgb, var(--surface-soft) 58%, var(--surface)) !important;
  border-top: 1px solid var(--border-strong);
}

.plana-subtasks-create-subject {
  align-items: center;
  display: grid;
  gap: 0.45rem;
  grid-template-columns: minmax(5.5rem, 0.34fr) minmax(8rem, 1fr);
  min-width: 0;
}

tr.plana-subtask-create-row input,
tr.plana-subtask-create-row select {
  min-width: 0;
}

.plana-subtasks-create-muted {
  color: var(--text-muted);
  font-weight: 700;
}

tr.plana-subtask-create-row .plana-subtasks-message {
  display: block;
  margin-top: 0.2rem;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .plana-subtasks-create-subject {
    grid-template-columns: 1fr;
  }
}


/* Phone issue details and subtasks use the available width instead of tiny scroll areas. */
@media screen and (max-width: 640px) {
  body .rcg-global-issue-modal {
    padding: 0;
  }

  body .rcg-global-issue-modal__dialog {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    height: 100dvh;
    border-radius: 0;
  }

  body .rcg-global-issue-modal__icon-button {
    width: 36px;
    height: 36px;
  }

  div.issue .attributes .splitcontent {
    display: block;
  }

  div.issue .attributes .splitcontentleft,
  div.issue .attributes .splitcontentright {
    float: none;
    width: 100%;
  }

  div.issue .attributes .attribute {
    padding: 0;
    margin: 0 0 0.9rem;
    min-width: 0;
  }

  div.issue .attributes .attribute > .label {
    display: block;
    float: none;
    width: auto;
    margin: 0 0 0.2rem;
    overflow: visible;
  }

  div.issue .attributes .attribute > .value,
  div.issue .attributes #tags-data {
    width: 100%;
    overflow: visible;
    overflow-wrap: anywhere;
  }

  table.plana-subtasks-table:not([hidden]),
  table.plana-subtasks-table > tbody {
    display: block;
  }

  table.plana-subtasks-table > colgroup {
    display: none;
  }

  table.plana-subtasks-table > thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }

  table.plana-subtasks-table > tbody > tr:not([hidden]) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
  }

  table.plana-subtasks-table > tbody > tr > td {
    display: block;
    width: auto;
    min-width: 0;
    padding: 0 !important;
    border: 0;
    text-align: start;
    overflow: visible;
    white-space: normal;
  }

  table.plana-subtasks-table > tbody > tr > td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 0.35rem;
    color: var(--text-muted);
    font-size: var(--plana-control-font-size);
    font-weight: 500;
  }

  table.plana-subtasks-table > tbody > tr > td.subject,
  table.plana-subtasks-table > tbody > tr > td.buttons {
    grid-column: 1 / -1;
  }

  table.plana-subtasks-table td.subject .plana-subtask-display {
    padding-left: min(calc(var(--plana-subtask-level, 0) * 0.75rem), 3rem);
  }

  table.plana-subtasks-table .plana-subtask-subject-link,
  table.plana-subtasks-table .plana-subtasks-message {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  table.plana-subtasks-table .plana-subtasks-row-actions {
    display: flex;
  }
}

@media screen and (max-width: 380px) {
  table.plana-subtasks-table > tbody > tr:not([hidden]) {
    grid-template-columns: minmax(0, 1fr);
  }
}

table.list tr.group td {
  background:
    linear-gradient(90deg,
      color-mix(in srgb, var(--primary-soft) 72%, var(--surface)),
      color-mix(in srgb, var(--surface-soft) 82%, var(--surface))) !important;
  border-bottom: 1px solid var(--border-strong) !important;
  border-top: 0.7rem solid var(--bg) !important;
  box-shadow: inset 4px 0 0 var(--primary);
  color: var(--text) !important;
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 0.72rem 0.85rem;
}

table.list tr.group:first-child td {
  border-top-width: 0 !important;
}

table.list tr.group span.count {
  background: color-mix(in srgb, var(--primary) 18%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--primary) 34%, transparent);
  border-radius: 999px;
  color: var(--text);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1;
  margin-left: 0.32rem;
  min-width: 1.45rem;
  padding: 0.16rem 0.42rem;
  text-align: center;
}

table.list tr.group.open + tr td,
table.list tr.group.closed + tr td {
  border-top-color: color-mix(in srgb, var(--border) 52%, transparent);
}

table.list.issues {
  font-size: 0.86rem;
  min-width: 1120px;
  table-layout: fixed;
}

table.list.issues th,
table.list.issues td {
  line-height: 1.25;
  overflow-wrap: anywhere;
  white-space: normal;
}

table.list.issues th.checkbox,
table.list.issues td.checkbox {
  text-align: center;
  width: 34px;
}

table.list.issues th.id,
table.list.issues td.id {
  text-align: right;
  width: 4.5rem;
}

table.list.issues th.status,
table.list.issues td.status,
table.list.issues th.priority,
table.list.issues td.priority {
  width: 92px;
}

table.list.issues th.fixed_version,
table.list.issues td.fixed_version {
  width: 110px;
}

table.list.issues th.project,
table.list.issues td.project {
  width: 116px;
}

table.list.issues th.tags,
table.list.issues td.tags {
  width: 118px;
}

table.list.issues th.tracker,
table.list.issues td.tracker {
  width: 78px;
}

table.list.issues th.assigned_to,
table.list.issues td.assigned_to,
table.list.issues th.author,
table.list.issues td.author {
  width: 118px;
}

table.list.issues th.updated_on,
table.list.issues td.updated_on,
table.list.issues th.due_date,
table.list.issues td.due_date,
table.list.issues th.start_date,
table.list.issues td.start_date {
  white-space: nowrap;
  width: 106px;
}

table.list.issues th.done_ratio,
table.list.issues td.done_ratio {
  width: 96px;
}

table.list.issues td.done_ratio {
  text-align: center;
  white-space: nowrap;
}

table.list.issues td.done_ratio table.progress {
  box-sizing: border-box;
  display: table;
  float: none;
  margin: 1px auto 4px;
  max-width: 100%;
  width: 80px;
}

table.list.issues td.done_ratio p.percent {
  clear: both;
  line-height: 1.15;
  margin: 0;
  text-align: center;
  white-space: nowrap;
}

table.list.issues th.subject,
table.list.issues td.subject {
  min-width: 20rem;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 24%;
}

table.list.issues td.subject a {
  display: inline-block;
  font-weight: 700;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

table.list.issues th.parent-subject,
table.list.issues td.parent-subject {
  overflow-wrap: break-word;
  width: 150px;
  word-break: normal;
}

table.list.issues th.buttons,
table.list.issues td.buttons {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  text-align: center;
  white-space: nowrap;
  width: 42px;
}

table.list.issues td.buttons {
  display: table-cell;
}

table.list.issues th.buttons {
  display: table-cell;
}

table.list.issues td.buttons a.icon-only {
  align-items: center;
  display: inline-flex;
  height: 28px;
  justify-content: center;
  width: 28px;
}

table.list.issues td.buttons .icon-label {
  display: none;
}

.controller-issues.action-index table.list.issues {
  --plana-issue-grid-border: var(--border);
  --plana-issue-grid-header-bg: var(--primary-soft);
  --plana-issue-grid-row-bg: var(--surface);
  --plana-issue-grid-hover-bg: color-mix(in srgb, var(--surface-soft) 78%, var(--surface));
  --plana-issue-grid-selected-bg: var(--primary-soft);
  --plana-issue-list-min-width: 94rem;
  border-collapse: separate !important;
  border-color: var(--plana-issue-grid-border) !important;
  border-spacing: 0 !important;
  margin-right: 0 !important;
  min-width: var(--plana-issue-list-min-width) !important;
  table-layout: fixed !important;
  width: 100% !important;
}

.controller-issues.action-index .autoscroll {
  max-width: 100%;
  overflow-x: auto;
}

.controller-issues.action-index table.list.issues th,
.controller-issues.action-index table.list.issues td {
  min-width: 0 !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > thead > tr > th {
  background: var(--plana-issue-grid-header-bg) !important;
  border-bottom: 1px solid var(--plana-issue-grid-border) !important;
  border-right: 1px solid var(--plana-issue-grid-border) !important;
  color: var(--text-muted) !important;
  font-weight: 700;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > thead > tr > th:last-child {
  border-right: 0 !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.issue,
.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.odd,
.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.even {
  background-color: var(--plana-issue-grid-row-bg) !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr:not(.group) > td {
  background-color: var(--plana-issue-grid-row-bg) !important;
  border-bottom: 1px solid var(--plana-issue-grid-border) !important;
  border-right: 1px solid var(--plana-issue-grid-border) !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr:not(.group) > td:last-child {
  border-right: 0 !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr:last-child > td {
  border-bottom: 0 !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.issue:hover,
.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.issue:hover > td {
  background-color: var(--plana-issue-grid-hover-bg) !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.context-menu-selection,
.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.context-menu-selection > td {
  background: var(--plana-issue-grid-selected-bg) !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.issue:hover table.progress td.closed,
.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.issue:hover table.progress td.done {
  background: linear-gradient(90deg, var(--progress-fill), var(--progress-fill-strong)) !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) > tbody > tr.issue:hover table.progress td.todo {
  background: transparent !important;
}

.controller-issues.action-index table.list.issues th.checkbox,
.controller-issues.action-index table.list.issues td.checkbox {
  max-width: 2.25rem !important;
  min-width: 2.25rem !important;
  width: 2.25rem !important;
}

.controller-issues.action-index table.list.issues th.id,
.controller-issues.action-index table.list.issues td.id {
  max-width: 4.5rem !important;
  min-width: 4.5rem !important;
  padding-left: 0.25rem !important;
  padding-right: 0.35rem !important;
  width: 4.5rem !important;
}

.controller-issues.action-index table.list.issues th.subject,
.controller-issues.action-index table.list.issues td.subject {
  max-width: none !important;
  min-width: 18rem !important;
  overflow: hidden !important;
  text-overflow: ellipsis;
  white-space: normal !important;
  width: 18rem !important;
}

.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) td.subject a,
.controller-issues.action-index table.list.issues:not(.plana-subtasks-table) tr.parent td.subject a {
  font-weight: 500;
}

.controller-issues.action-index table.list.issues td.subject a,
.controller-issues.action-index table.list.issues td.subject .plana-inline-display {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box !important;
  line-height: 1.25;
  max-width: 100% !important;
  max-height: 2.5em;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis;
  white-space: normal !important;
}

.controller-issues.action-index table.list.issues td.subject .plana-inline-shell {
  line-height: 1.25;
  max-width: 100%;
  vertical-align: middle;
}

.controller-issues.action-index table.list.issues th.project,
.controller-issues.action-index table.list.issues td.project {
  max-width: 7rem !important;
  min-width: 7rem !important;
  width: 7rem !important;
}

.controller-issues.action-index table.list.issues th.tags,
.controller-issues.action-index table.list.issues td.tags {
  max-width: 14rem !important;
  min-width: 14rem !important;
  vertical-align: middle;
  white-space: normal !important;
  width: 14rem !important;
}

.controller-issues.action-index table.list.issues td.project,
.controller-issues.action-index table.list.issues td.tags {
  overflow: hidden !important;
  overflow-wrap: normal !important;
  text-overflow: ellipsis;
  word-break: normal !important;
}

.controller-issues.action-index table.list.issues td.project a {
  max-width: 100% !important;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap !important;
}

.controller-issues.action-index table.list.issues td.tags .plana-issue-tags-flow {
  align-items: center;
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.16rem 0.25rem;
  line-height: 1.25;
  max-height: calc(2 * var(--plana-tag-height, 1.5rem) + .16rem);
  overflow: hidden;
  white-space: normal !important;
}

.controller-issues.action-index table.list.issues td.tags .plana-issue-tags-flow a,
.controller-issues.action-index table.list.issues td.tags .plana-issue-tags-flow span {
  flex: 0 0 auto;
  max-width: 100%;
  white-space: nowrap !important;
}

.controller-issues.action-index table.list.issues td.tags .plana-tag {
  margin: 0 !important;
}

.controller-issues.action-index table.list.issues th.assigned_to,
.controller-issues.action-index table.list.issues td.assigned_to,
.controller-issues.action-index table.list.issues th.author,
.controller-issues.action-index table.list.issues td.author {
  max-width: 9rem !important;
  min-width: 9rem !important;
  width: 9rem !important;
}

.controller-issues.action-index table.list.issues th.fixed_version,
.controller-issues.action-index table.list.issues td.fixed_version {
  max-width: 8.5rem !important;
  min-width: 8.5rem !important;
  width: 8.5rem !important;
}

.controller-issues.action-index table.list.issues th.priority,
.controller-issues.action-index table.list.issues td.priority {
  max-width: 5.5rem !important;
  min-width: 5.5rem !important;
  width: 5.5rem !important;
}

.controller-issues.action-index table.list.issues th.done_ratio,
.controller-issues.action-index table.list.issues td.done_ratio,
.controller-issues.action-index table.list.issues th.status,
.controller-issues.action-index table.list.issues td.status {
  max-width: 6.5rem !important;
  min-width: 6.5rem !important;
  width: 6.5rem !important;
}

.controller-issues.action-index table.list.issues th.due_date,
.controller-issues.action-index table.list.issues td.due_date,
.controller-issues.action-index table.list.issues th.start_date,
.controller-issues.action-index table.list.issues td.start_date,
.controller-issues.action-index table.list.issues th.updated_on,
.controller-issues.action-index table.list.issues td.updated_on {
  max-width: 7.25rem !important;
  min-width: 7.25rem !important;
  width: 7.25rem !important;
}

.controller-issues.action-index #content table.list.issues:not(.plana-subtasks-table) > tbody > tr > td.due_date {
  color: var(--text-muted) !important;
  font-size: 0.9rem;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}

.controller-issues.action-index table.list.issues th.tracker,
.controller-issues.action-index table.list.issues td.tracker {
  max-width: 5.5rem !important;
  min-width: 5.5rem !important;
  width: 5.5rem !important;
}

.controller-issues.action-index table.list.issues th[class^="cf_"],
.controller-issues.action-index table.list.issues th[class*=" cf_"],
.controller-issues.action-index table.list.issues td[class^="cf_"],
.controller-issues.action-index table.list.issues td[class*=" cf_"] {
  max-width: 8rem !important;
  min-width: 8rem !important;
  width: 8rem !important;
}

.controller-issues.action-index table.list.issues th.parent-subject,
.controller-issues.action-index table.list.issues td.parent-subject {
  max-width: 10rem !important;
  min-width: 10rem !important;
  overflow: hidden !important;
  overflow-wrap: normal !important;
  padding-left: 0.55rem;
  padding-right: 0.55rem;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap !important;
  width: 10rem !important;
  word-break: normal !important;
}

.controller-issues.action-index table.list.issues td.parent-subject a,
.controller-issues.action-index table.list.issues td.parent-subject span {
  max-width: 100% !important;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap !important;
}

.controller-issues.action-index table.list.issues th.buttons,
.controller-issues.action-index table.list.issues td.buttons {
  max-width: 2.75rem !important;
  min-width: 2.75rem !important;
  width: 2.75rem !important;
}

td.status,
td.priority,
.badge,
.tag-label-color,
.tag-label {
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 600;
}

td.priority {
  color: var(--warning);
}

td.status {
  color: var(--text-muted);
}

table.list td.status,
table.list td.priority {
  border-radius: 0;
  font-size: inherit;
}

.progress {
  background: var(--progress-track) !important;
  border: 1px solid color-mix(in srgb, var(--border-strong) 72%, transparent);
  border-radius: 999px;
  box-shadow: inset 0 1px 2px color-mix(in srgb, var(--shadow) 52%, transparent);
  height: 10px;
  overflow: hidden;
}

.progress .closed,
.progress .done {
  background: linear-gradient(90deg, var(--progress-fill), var(--progress-fill-strong)) !important;
  min-height: 100%;
}

table.progress {
  background: var(--progress-track) !important;
  border: 1px solid color-mix(in srgb, var(--border-strong) 72%, transparent);
  border-collapse: separate;
  border-radius: 999px;
  border-spacing: 0;
  box-shadow: inset 0 1px 2px color-mix(in srgb, var(--shadow) 52%, transparent);
  height: 10px;
  overflow: hidden;
}

table.progress td {
  border: 0 !important;
  height: 10px;
  padding: 0 !important;
}

table.progress td.closed,
table.progress td.done {
  background: linear-gradient(90deg, var(--progress-fill), var(--progress-fill-strong)) !important;
}

table.progress td.todo {
  background: transparent !important;
}

div.issue .attribute.progress,
#content div.issue .attribute.progress {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  height: auto;
  overflow: visible;
}

div.issue .attribute.progress .value {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.38rem;
  min-height: 1.35rem;
}

div.issue .attribute.progress table.progress {
  flex: 0 0 86px;
  margin: 0;
  max-width: 86px;
  width: 86px !important;
}

div.issue .attribute.progress table.progress,
div.issue .attribute.progress table.progress td {
  height: 9px;
}

div.issue .attribute.progress p.percent {
  color: var(--text-muted) !important;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  margin: 0;
  white-space: nowrap;
}

.pagination {
  color: var(--text-muted);
  margin: 0.9rem 0;
}

.pagination a,
.pagination span {
  border-radius: 6px;
  margin: 0 0.08rem;
  padding: 0.24rem 0.48rem;
}

.pagination .current {
  background: var(--accent);
  color: var(--on-accent);
}

.drdn-content,
#context-menu {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 12px 30px var(--shadow);
  color: var(--text);
}

.drdn-content .quick-search {
  align-items: center;
  background: color-mix(in srgb, var(--surface-soft) 48%, var(--surface));
  border-bottom: 1px solid var(--border);
  color: var(--text-muted);
  display: flex;
  gap: 0.35rem;
  padding: 0.45rem;
}

.drdn-content input[type="text"],
.drdn-content input.autocomplete {
  background: var(--bg);
  border-color: var(--border-strong);
  color: var(--text);
}

.drdn-content input[type="text"]::placeholder,
.drdn-trigger {
  color: var(--text-muted);
}

.drdn-items,
.drdn-items.projects,
.drdn-items.all-projects {
  background: var(--surface);
  color: var(--text);
}

.drdn-items a,
#context-menu a {
  color: var(--text);
  display: block;
  padding: 0.35rem 0.6rem;
}

.drdn-items a:hover,
.drdn-items a.selected,
.drdn-items a:focus,
#context-menu a:hover {
  background: var(--primary-soft);
  color: var(--primary);
}

.drdn-items .autocomplete,
.drdn-items .recently-used,
.drdn-items .label,
.drdn-items span,
.drdn-content h3,
.drdn-content label {
  color: var(--text-muted);
}

#context-menu {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  box-shadow: 0 12px 30px var(--shadow) !important;
  color: var(--text) !important;
  isolation: isolate;
  overflow: visible;
  pointer-events: auto;
  z-index: 10000 !important;
}

#context-menu ul,
#context-menu li {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--text) !important;
}

#context-menu ul {
  pointer-events: auto;
}

#context-menu li.folder {
  position: relative;
}

#context-menu li.folder:hover,
#context-menu li.folder:focus-within {
  z-index: 10001 !important;
}

#context-menu li.folder::after {
  bottom: -4px;
  content: "";
  display: none;
  left: 100%;
  position: absolute;
  top: -4px;
  width: 3px;
}

#context-menu li.folder:hover::after,
#context-menu li.folder:focus-within::after {
  display: block;
}

#context-menu.reverse-x li.folder::after {
  left: auto;
  right: 100%;
}

#context-menu a,
#context-menu a:link,
#context-menu a:visited,
#context-menu span,
#context-menu .icon,
#context-menu .icon-label {
  color: var(--text) !important;
  text-shadow: none !important;
}

#context-menu a.disabled,
#context-menu a.disabled:hover,
#context-menu li.disabled,
#context-menu li.disabled a {
  color: var(--text-muted) !important;
  opacity: 0.72;
}

#context-menu li:hover,
#context-menu li:focus-within {
  background: var(--primary-soft) !important;
  border-color: var(--border) !important;
  border-radius: 6px;
}

#context-menu li:hover > a,
#context-menu li:focus-within > a,
#context-menu li:hover > span,
#context-menu li:focus-within > span {
  color: var(--primary) !important;
}

#context-menu li.folder ul {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px;
  box-shadow: 0 12px 30px var(--shadow) !important;
  z-index: 10002 !important;
}

#context-menu li.folder > ul {
  left: calc(100% - 2px) !important;
}

#context-menu.reverse-x li.folder > ul {
  left: auto !important;
  right: calc(100% - 2px) !important;
}

.ui-widget-content,
.ui-autocomplete,
.ui-menu,
.select2-dropdown,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  background: var(--surface) !important;
  border-color: var(--border-strong) !important;
  color: var(--text) !important;
}

.ui-widget-content a,
.ui-autocomplete a,
.ui-menu a,
.ui-menu .ui-menu-item-wrapper,
.ui-autocomplete .ui-menu-item > div,
.ui-menu .ui-menu-item > div,
.select2-results__option,
.select2-results__option[aria-selected],
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default .select2-selection--multiple .select2-selection__rendered,
.select2-container--default .select2-search--inline .select2-search__field {
  color: var(--text) !important;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-menu .ui-menu-item-wrapper.ui-state-active,
.ui-menu .ui-menu-item-wrapper.ui-state-focus,
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-results__option--highlighted {
  background: var(--primary-soft) !important;
  border-color: var(--border) !important;
  color: var(--primary) !important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container--default .select2-selection--multiple .select2-selection__placeholder,
.select2-results__message {
  color: var(--text-muted) !important;
}

.select2-search--dropdown {
  background: var(--surface-soft) !important;
  border-bottom: 1px solid var(--border);
}

.select2-search--dropdown .select2-search__field,
.select2-container--default .select2-search--inline .select2-search__field {
  background: var(--bg) !important;
  border-color: var(--border-strong) !important;
  color: var(--text) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--primary-soft) !important;
  border-color: var(--border) !important;
  color: var(--primary) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--text-muted) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: var(--danger) !important;
}

.select2-container--default .select2-results__option[aria-selected="true"] {
  background: color-mix(in srgb, var(--primary-soft) 68%, var(--surface)) !important;
  color: var(--primary) !important;
}

.select2-container--default .select2-results__group {
  color: var(--text-muted) !important;
}

html[data-theme="dark"] #context-menu,
html[data-theme="dark"] #context-menu ul,
html[data-theme="dark"] #context-menu li,
html[data-theme="dark"] .ui-widget,
html[data-theme="dark"] .ui-widget-content,
html[data-theme="dark"] .ui-autocomplete,
html[data-theme="dark"] .ui-menu,
html[data-theme="dark"] .select2-dropdown,
html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple {
  background: var(--surface) !important;
  border-color: var(--border-strong) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] #context-menu *,
html[data-theme="dark"] .ui-widget *,
html[data-theme="dark"] .ui-widget-content *,
html[data-theme="dark"] .ui-autocomplete *,
html[data-theme="dark"] .ui-menu *,
html[data-theme="dark"] .select2-dropdown *,
html[data-theme="dark"] .select2-container--default .select2-selection--single *,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple * {
  color: var(--text) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] #context-menu .disabled,
html[data-theme="dark"] #context-menu .disabled *,
html[data-theme="dark"] #context-menu a.disabled,
html[data-theme="dark"] .select2-results__option[aria-disabled="true"] {
  color: var(--text-muted) !important;
  opacity: 0.78;
}

html[data-theme="dark"] #context-menu li:hover,
html[data-theme="dark"] #context-menu li:focus-within,
html[data-theme="dark"] .ui-state-active,
html[data-theme="dark"] .ui-widget-content .ui-state-active,
html[data-theme="dark"] .ui-state-focus,
html[data-theme="dark"] .ui-widget-content .ui-state-focus,
html[data-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected],
html[data-theme="dark"] .select2-results__option--highlighted {
  background: var(--primary-soft) !important;
  border-color: var(--primary) !important;
}

html[data-theme="dark"] #context-menu li:hover *,
html[data-theme="dark"] #context-menu li:focus-within *,
html[data-theme="dark"] .ui-state-active *,
html[data-theme="dark"] .ui-state-focus *,
html[data-theme="dark"] .select2-results__option--highlighted * {
  color: var(--primary) !important;
}

ul.tagit,
.tagit,
.tagit input,
.tagit-new input,
.tagit-choice,
.tagit-choice-editable,
.tagit-label,
.tagit-close {
  background: var(--surface) !important;
  border-color: var(--border-strong) !important;
  color: var(--text) !important;
}

.tagit-choice,
.tagit-choice-editable,
.tagit-label {
  background: var(--primary-soft) !important;
  border-color: var(--border) !important;
  color: var(--primary) !important;
}

html[data-theme="dark"] ul.tagit,
html[data-theme="dark"] .tagit,
html[data-theme="dark"] .tagit input,
html[data-theme="dark"] .tagit-new input {
  background: var(--surface) !important;
  border-color: var(--border-strong) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .tagit-choice,
html[data-theme="dark"] .tagit-choice-editable,
html[data-theme="dark"] .tagit-label,
html[data-theme="dark"] .tagit-close {
  background: #163f45 !important;
  border-color: #1fb7bb !important;
  color: #3ee0dd !important;
}

.tabs ul {
  border-bottom: 1px solid var(--border);
}

.tabs ul li a {
  border-radius: 6px 6px 0 0;
  color: var(--text-muted);
}

.tabs ul li a.selected {
  background: var(--surface);
  border-color: var(--border);
  color: var(--primary);
}

.controller-canvas_gantts #content,
.controller-issues_bulk_create #content {
  padding: 14px;
}

.controller-issues_bulk_create .bulk-create-table { container-type: inline-size; }
.controller-issues_bulk_create #field_parent_issue { width: 8rem; margin-bottom: 0.75rem; }
.controller-issues_bulk_create #inputtbl {
  width: 100%;
  min-width: 60rem;
  table-layout: fixed;
}
.controller-issues_bulk_create #inputtbl th,
.controller-issues_bulk_create #inputtbl td {
  padding: 0.3rem 0.25rem;
  text-align: left;
  vertical-align: top;
  box-sizing: border-box;
}
.controller-issues_bulk_create #inputtbl th { font-size: 0.86rem; font-weight: 600; }
.controller-issues_bulk_create #inputtbl input:not([type="hidden"]),
.controller-issues_bulk_create #inputtbl select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  font-size: 0.9rem;
  padding-inline: 0.35rem;
}
.controller-issues_bulk_create #inputtbl .bulk-tracker { width: 5.5rem; }
.controller-issues_bulk_create #inputtbl .bulk-assignee,
.controller-issues_bulk_create #inputtbl .fixed-version { width: 7.5rem; }
.controller-issues_bulk_create #inputtbl .bulk-description { width: 10rem; }
.controller-issues_bulk_create #inputtbl .bulk-start,
.controller-issues_bulk_create #inputtbl .bulk-due { width: 8.3rem; }
.controller-issues_bulk_create #inputtbl .bulk-actions { width: 4.8rem; white-space: nowrap; }
.controller-issues_bulk_create #inputtbl .bulk-actions button { min-width: 1.85rem; padding-inline: 0.25rem; }
.controller-issues_bulk_create #inputtbl .bulk-details-toggle { display: none; }
.controller-issues_bulk_create #inputtbl .bulk-subject-field { display: flex; align-items: center; gap: 0.2rem; }
.controller-issues_bulk_create #inputtbl .bulk-depth { flex: 0 0 auto; color: var(--text-muted); font-size: 0.8rem; }
.controller-issues_bulk_create #inputtbl .bulk-details-toggle.has-details { box-shadow: inset 0 -3px var(--primary); }

/* Keep the primary fields aligned as a table; optional fields expand beneath their row. */
@container (max-width: 60rem) {
  .controller-issues_bulk_create #inputtbl,
  .controller-issues_bulk_create #inputtbl tbody { display: block; min-width: 0; }
  .controller-issues_bulk_create #inputtbl tr {
    display: grid;
    grid-template-columns: 5rem minmax(10rem, 1fr) 8rem 8rem 6.5rem;
    min-width: 37.5rem;
    border-bottom: 1px solid var(--border);
  }
  .controller-issues_bulk_create #inputtbl tr > [class] { width: auto; min-width: 0; }
  .controller-issues_bulk_create #inputtbl .bulk-secondary { display: none; }
  .controller-issues_bulk_create #inputtbl .bulk-actions { grid-column: 5; grid-row: 1; }
  .controller-issues_bulk_create #inputtbl .bulk-details-toggle { display: inline-block; }
  .controller-issues_bulk_create #inputtbl .bulk-details-open .bulk-secondary { display: block; padding-block: 0.35rem 0.65rem; }
  .controller-issues_bulk_create #inputtbl .bulk-details-open .bulk-description { grid-column: 1 / 3; grid-row: 2; }
  .controller-issues_bulk_create #inputtbl .bulk-details-open .bulk-start { grid-column: 3 / 4; grid-row: 2; }
  .controller-issues_bulk_create #inputtbl .bulk-details-open .bulk-due { grid-column: 4 / 6; grid-row: 2; }
  .controller-issues_bulk_create #inputtbl .bulk-secondary::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 0.25rem;
    color: var(--text-muted);
    font-size: 0.86rem;
  }
}

#redmine-canvas-gantt-root,
.swagger-ui {
  border-radius: 8px;
  overflow: hidden;
}

#footer {
  display: none;
}

.controller-calendars ul.cal {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
  border-color: var(--border);
  box-shadow: 0 10px 24px var(--shadow);
  overflow: hidden;
}

.controller-calendars .cal .calhead,
.controller-calendars .cal .week-number {
  background: var(--surface-soft) !important;
  background-color: var(--surface-soft) !important;
  border-color: var(--border);
  color: var(--text-muted);
}

.controller-calendars .cal .calbody {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
  border-color: var(--border);
  box-shadow: none;
  color: var(--text);
}

.controller-calendars .cal .calbody.this-month {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
}

.controller-calendars .cal .calbody.other-month {
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--surface-soft) 72%, var(--surface)) !important;
}

.controller-calendars .cal .calbody.other-month p.day-num {
  color: var(--text-subtle);
}

.controller-calendars .cal .calbody.nwday:not(.other-month) {
  background: color-mix(in srgb, var(--surface-soft) 84%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--surface-soft) 84%, var(--surface)) !important;
}

.controller-calendars .cal .calbody.today {
  background: color-mix(in srgb, var(--primary-soft) 66%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--primary-soft) 66%, var(--surface)) !important;
  box-shadow: inset 3px 0 0 var(--primary);
}

.controller-calendars .cal .calbody p.day-num {
  color: var(--text-muted);
}

.controller-calendars .cal .calbody a,
.controller-calendars .cal .calbody a:link,
.controller-calendars .cal .calbody a:visited {
  color: var(--primary);
}

.controller-calendars .cal .calbody > .issue,
.controller-calendars .cal .calbody > .version,
.controller-calendars .cal .calbody > .news,
.controller-calendars .cal .calbody > .icon-package {
  background: color-mix(in srgb, var(--surface-soft) 88%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--surface-soft) 88%, var(--surface)) !important;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text);
  display: block;
  margin: 0.25rem 0;
  padding: 0.35rem 0.45rem;
}

html[data-theme="dark"] .controller-calendars .cal .calbody > .issue,
html[data-theme="dark"] .controller-calendars .cal .calbody > .version,
html[data-theme="dark"] .controller-calendars .cal .calbody > .news,
html[data-theme="dark"] .controller-calendars .cal .calbody > .icon-package {
  background: color-mix(in srgb, var(--surface) 78%, var(--surface-soft)) !important;
  background-color: color-mix(in srgb, var(--surface) 78%, var(--surface-soft)) !important;
}

html[data-theme="dark"] .controller-calendars .tooltip:hover {
  color: var(--text);
}

html[data-theme="dark"] .controller-calendars div.tooltip:hover span.tip {
  background: var(--surface);
  border-color: var(--border-strong);
  color: var(--text);
}

.controller-my .mypage-box table.list > :is(thead, tbody, tfoot) > tr > :is(th, td) {
  padding-inline: 0.55rem;
  text-align: left;
}

.controller-my .mypage-box table.list > :is(thead, tbody, tfoot) > tr > :is(th, td):is(.id, .estimated_hours, .total_estimated_hours, .estimated_remaining_hours, .spent_hours, .total_spent_hours, .hours, .buttons),
.controller-my .mypage-box table.time-entries > thead > tr > th:nth-child(4) {
  text-align: right;
}

.controller-my .mypage-box table.list > :is(thead, tbody, tfoot) > tr > :is(th, td).checkbox {
  text-align: center;
}

.controller-my .mypage-box table.issues > :is(thead, tbody) > tr > :is(th, td).id {
  inline-size: 4.5rem;
}

.controller-my .mypage-box ul.cal {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
  border-color: var(--border);
  box-shadow: none;
  overflow: hidden;
}

.controller-my .mypage-box .cal .calhead,
.controller-my .mypage-box .cal .week-number {
  background: var(--surface-soft) !important;
  background-color: var(--surface-soft) !important;
  border-color: var(--border);
  color: var(--text-muted) !important;
}

.controller-my .mypage-box .cal .calbody {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
  border-color: var(--border);
  box-shadow: none;
  color: var(--text);
}

.controller-my .mypage-box .cal .calbody.this-month {
  background: var(--surface) !important;
  background-color: var(--surface) !important;
}

.controller-my .mypage-box .cal .calbody.other-month {
  background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--surface-soft) 72%, var(--surface)) !important;
}

.controller-my .mypage-box .cal .calbody.other-month p.day-num {
  color: var(--text-subtle) !important;
}

.controller-my .mypage-box .cal .calbody.nwday:not(.other-month) {
  background: color-mix(in srgb, var(--surface-soft) 84%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--surface-soft) 84%, var(--surface)) !important;
}

.controller-my .mypage-box .cal .calbody.today {
  background: color-mix(in srgb, var(--primary-soft) 66%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--primary-soft) 66%, var(--surface)) !important;
  box-shadow: inset 3px 0 0 var(--primary);
}

.controller-my .mypage-box .cal .calbody p.day-num {
  color: var(--text-muted) !important;
}

.controller-my .mypage-box .cal .calbody a,
.controller-my .mypage-box .cal .calbody a:link,
.controller-my .mypage-box .cal .calbody a:visited {
  color: var(--primary);
}

.controller-my .mypage-box .cal .calbody > .issue,
.controller-my .mypage-box .cal .calbody > .version,
.controller-my .mypage-box .cal .calbody > .news,
.controller-my .mypage-box .cal .calbody > .icon-package {
  background: color-mix(in srgb, var(--surface-soft) 88%, var(--surface)) !important;
  background-color: color-mix(in srgb, var(--surface-soft) 88%, var(--surface)) !important;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text);
  display: block;
  margin: 0.25rem 0;
  padding: 0.35rem 0.45rem;
}

html[data-theme="dark"] .controller-my .mypage-box .cal .calbody > .issue,
html[data-theme="dark"] .controller-my .mypage-box .cal .calbody > .version,
html[data-theme="dark"] .controller-my .mypage-box .cal .calbody > .news,
html[data-theme="dark"] .controller-my .mypage-box .cal .calbody > .icon-package {
  background: color-mix(in srgb, var(--surface) 78%, var(--surface-soft)) !important;
  background-color: color-mix(in srgb, var(--surface) 78%, var(--surface-soft)) !important;
}

.controller-my .mypage-box .tooltip:hover {
  color: var(--text);
}

.controller-my .mypage-box div.tooltip:hover span.tip {
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  box-shadow: 0 12px 28px var(--shadow);
  color: var(--text);
}

.controller-my .mypage-box div.tooltip:hover span.tip a,
.controller-my .mypage-box div.tooltip:hover span.tip a:link,
.controller-my .mypage-box div.tooltip:hover span.tip a:visited {
  color: var(--primary);
}

@media (max-width: 1180px) {
  :root {
    --sidebar-width: 218px;
  }

  #header {
    grid-template-columns: 1fr;
  }

  #top-menu {
    gap: 0.5rem;
    grid-template-columns: minmax(18.5rem, 1fr) minmax(0, 23rem) minmax(18.5rem, 1fr);
    padding-inline: 10px;
  }

  #top-menu .profile-menu,
  #account {
    gap: 0.4rem;
  }

  #quick-search.plana-top-search label {
    display: none;
  }

  #quick-search {
    grid-column: 1;
    justify-content: flex-start;
  }

  #quick-search.plana-top-search {
    grid-column: 2;
    justify-content: center;
  }
}

@media (max-width: 899px) {
  body {
    padding-top: 0 !important;
  }

  #top-menu {
    display: none;
  }

  #header {
    align-items: start;
    background:
      radial-gradient(circle at 8% 12%, rgba(122, 223, 69, 0.18), transparent 11rem),
      radial-gradient(circle at 92% 18%, rgba(33, 199, 202, 0.14), transparent 12rem),
      linear-gradient(180deg, color-mix(in srgb, var(--surface) 86%, var(--primary-soft) 14%), var(--surface-soft)) !important;
    display: grid !important;
    gap: 0.55rem 0.75rem;
    grid-template-columns: minmax(0, 1fr) auto;
    height: auto !important;
    min-height: 0 !important;
    padding: 12px 14px 14px !important;
    position: relative !important;
    width: auto !important;
    z-index: 20 !important;
  }

  html[data-theme="dark"] #header {
    background:
      radial-gradient(circle at 8% 12%, rgba(122, 223, 69, 0.13), transparent 11rem),
      radial-gradient(circle at 92% 18%, rgba(33, 199, 202, 0.16), transparent 12rem),
      linear-gradient(180deg, color-mix(in srgb, var(--surface) 78%, var(--secondary-soft) 22%), var(--bg)) !important;
  }

  #header h1 {
    align-self: start;
    display: block !important;
    font-size: 1.25rem;
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  #header h1.plana-header-identity {
    display: inline-flex !important;
    gap: 0.35rem;
    min-height: 0;
    padding: 0;
  }

  .plana-logo-image-wrap {
    width: min(11rem, 48vw);
  }

  .plana-project-switcher-trigger {
    font-size: 1.08rem;
    max-width: min(15rem, 62vw);
  }

  .plana-mobile-actions {
    align-items: center;
    display: flex;
    gap: 0.45rem;
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  #plana-mobile-theme-toggle,
  #header a.mobile-toggle-button {
    align-items: center;
    appearance: none;
    background: var(--surface);
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--shadow) 54%, transparent);
    color: var(--primary);
    cursor: pointer;
    display: inline-flex !important;
    font-size: 0.78rem;
    font-weight: 700;
    height: 42px;
    justify-content: center;
    line-height: 1;
    margin: 0;
    min-width: 42px;
    padding: 0 0.62rem;
    position: static !important;
    text-decoration: none;
    width: auto;
  }

  #header .plana-mobile-actions > a.mobile-toggle-button {
    color: var(--primary);
    padding: 0;
    width: 42px;
  }

  #header a.mobile-toggle-button::after {
    color: var(--primary);
    content: "\2630";
    display: block;
    font-family: inherit;
    font-size: 1.4rem;
    line-height: 1;
    margin: 0;
  }

  html.flyout-is-active #header a.mobile-toggle-button::after {
    content: "\00d7";
    font-size: 1.65rem;
  }

  #plana-mobile-theme-toggle:hover,
  #plana-mobile-theme-toggle:focus-visible,
  #header a.mobile-toggle-button:hover,
  #header a.mobile-toggle-button:focus-visible {
    background: var(--surface-soft);
    border-color: var(--focus);
    color: var(--primary-hover);
  }

  #main-menu,
  #header #main-menu,
  #header #quick-search,
  #quick-search {
    display: none !important;
  }

  .flyout-menu.plana-mobile-drawer {
    background:
      radial-gradient(circle at 15% 0%, rgba(122, 223, 69, 0.12), transparent 16rem),
      radial-gradient(circle at 100% 10%, rgba(33, 199, 202, 0.16), transparent 16rem),
      var(--surface);
    border-left: 1px solid var(--border);
    box-shadow: -18px 0 36px var(--shadow);
    color: var(--text);
    display: block;
    height: 100dvh;
    left: auto;
    margin: 0;
    max-width: 24rem;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    position: fixed;
    right: 0;
    top: 0;
    transform: translateX(100%);
    transition: transform 0.18s ease;
    width: min(88vw, 24rem);
    z-index: 1000;
  }

  html.flyout-is-active .flyout-menu.plana-mobile-drawer {
    transform: translateX(0);
  }

  .flyout-menu.plana-mobile-drawer > :not(.plana-mobile-drawer-content) {
    display: none !important;
  }

  html.flyout-is-active #wrapper,
  html.flyout-is-active #header {
    right: 0 !important;
  }

  /* Visitors keep Redmine's native drawer, which slides the page aside. */
  html.flyout-is-active:not([data-plana-shell]) #wrapper {
    right: auto !important;
    inset-inline-end: 250px !important;
  }

  .plana-mobile-backdrop {
    appearance: none;
    background: rgba(13, 17, 23, 0.38);
    border: 0;
    bottom: 0;
    display: none;
    left: 0;
    margin: 0;
    padding: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 900;
  }

  html.flyout-is-active .plana-mobile-backdrop {
    display: block;
  }

  .plana-mobile-drawer-content {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    min-height: 100%;
    padding: 1rem;
  }

  .plana-mobile-drawer-header {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
  }

  .plana-mobile-drawer-header .plana-logo-image-wrap {
    width: 10.5rem;
  }

  .plana-mobile-drawer-close {
    appearance: none;
    background: var(--surface-soft);
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 700;
    min-height: 34px;
    padding: 0 0.65rem;
  }

  .plana-mobile-search {
    background: var(--surface-soft);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0.7rem;
  }

  .plana-mobile-search form {
    align-items: center;
    display: flex;
    gap: 0.55rem;
    margin: 0;
  }

  .plana-mobile-search label {
    color: var(--text-subtle);
    flex: 0 0 auto;
    font-weight: 700;
  }

  .plana-mobile-search input[type="text"],
  .plana-mobile-search input[type="search"] {
    flex: 1 1 auto;
    font-size: 1rem;
    min-width: 0;
    width: 100%;
  }

  .plana-mobile-section {
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
  }

  .flyout-menu.plana-mobile-drawer .plana-mobile-section h3 {
    background:
      linear-gradient(90deg,
        color-mix(in srgb, var(--surface-soft) 82%, var(--primary-soft) 18%),
        color-mix(in srgb, var(--surface) 86%, var(--secondary-soft) 14%)) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--border) !important;
    color: var(--text-muted) !important;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    height: auto;
    line-height: 1;
    margin: 0;
    padding: 0.75rem 0.9rem;
    text-transform: uppercase;
  }

  html[data-theme="dark"] .flyout-menu.plana-mobile-drawer .plana-mobile-section h3 {
    background:
      linear-gradient(90deg,
        color-mix(in srgb, var(--surface-soft) 82%, var(--primary-soft) 18%),
        color-mix(in srgb, var(--surface) 78%, var(--secondary-soft) 22%)) !important;
    color: var(--text-muted) !important;
  }

  .plana-mobile-section ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .plana-mobile-section li + li {
    border-top: 1px solid var(--border);
  }

  .plana-mobile-nav-link,
  .plana-mobile-nav-link:link,
  .plana-mobile-nav-link:visited {
    align-items: center;
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    color: var(--text);
    display: flex;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
    min-height: 46px;
    padding: 0.8rem 0.9rem;
    text-decoration: none;
  }

  .plana-mobile-nav-link:hover,
  .plana-mobile-nav-link:focus-visible {
    background: var(--surface-soft);
    color: var(--text);
  }

  .plana-mobile-nav-link.selected {
    background: var(--primary-soft);
    color: var(--primary);
  }

  .plana-project-switcher-panel {
    border-radius: 8px;
    max-height: calc(100dvh - 1.5rem);
    width: calc(100vw - 1.5rem) !important;
    z-index: 1100;
  }

  .plana-project-switcher-list {
    max-height: calc(100dvh - 8rem);
  }

  #main {
    background: var(--bg);
    display: block;
    min-height: 0;
    padding: 0 !important;
  }

  #main.nosidebar {
    display: block;
    min-height: 0;
    padding: 0 !important;
  }

  #sidebar {
    border-bottom: 1px solid var(--border);
    border-right: 0;
  }

  body.plana-sidebar-collapsed #sidebar {
    display: none;
  }

  #content {
    padding: 12px;
    width: 100%;
  }
}

@media (max-width: 560px) {
  body {
    font-size: 13px;
  }

  #main-menu ul {
    flex-wrap: nowrap;
    min-width: max-content;
  }

  #content h2 {
    font-size: 1rem;
  }

  #content > h2 {
    font-size: 1.15rem;
  }

  .contextual {
    float: none;
    justify-content: flex-start;
    margin: 0 0 0.6rem;
  }

  table.list.issues {
    min-width: 760px;
  }
}

/* Tag attributes use native rows and shared editor controls. */
.plana-issue-show #tags-data { display: inline-block; min-width: 0; max-width: 100%; }
.plana-issue-show #tags-data .plana-inline-display { white-space: normal !important; overflow: visible; }

/* AI Helper follows the ordinary issue-section layout inside popups. */
#plana-issue-ai-panel {
  background: transparent;
  border: 0;
  color: var(--text);
  font: inherit;
  margin: 1rem 0;
  padding: 0;
  min-width: 0;
}

#plana-issue-ai-panel > .plana-ai-tool {
  padding: 0.5rem 0;
  min-width: 0;
}

#plana-issue-ai-panel #plana-issue-ai-heading {
  font-size: 1em;
  font-weight: 600;
  margin: 0;
}

#plana-issue-ai-panel :is(h1, h2, h3, h4, h5, h6) {
  font-family: inherit;
}

#plana-issue-ai-panel #ai-helper-summary-fields {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin: 0;
  padding: 0;
  min-width: 0;
}

#plana-issue-ai-panel .plana-ai-tool-title {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: none;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  padding: 0;
  min-height: 32px;
  max-width: 100%;
  white-space: normal;
  text-decoration: none;
  list-style: none;
}

#plana-issue-ai-panel .plana-ai-disclosure-icon,
#plana-issue-ai-panel .plana-ai-tool-title::-webkit-details-marker {
  display: none;
}

#plana-issue-ai-panel .plana-ai-tool-title > .icon-svg:not(.plana-ai-disclosure-icon),
#plana-issue-ai-panel .plana-ai-tool-title > .icon-svg:not(.plana-ai-disclosure-icon) > use {
  color: var(--accent);
  stroke: var(--accent);
}

#plana-issue-ai-panel #ai-helper-subissuer-generator-menu {
  display: block;
  margin: 0;
}

#plana-issue-ai-panel #ai-helper-similar-issues-section {
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

#plana-issue-ai-panel a {
  color: var(--primary-hover);
  font-family: inherit;
}

#content .plana-inline-notes__submit,
#content .plana-inline-description-save,
#plana-issue-ai-panel :is(#ai-helper-summary-button, #ai-helper-similar-issues-button, input[type="submit"]) {
  display: inline-block;
  box-sizing: border-box;
  border: 1px solid var(--button-border);
  border-radius: 6px;
  min-height: 30px;
  padding: 0.35rem 0.75rem;
  background: var(--button-bg);
  border-color: var(--button-border);
  color: var(--button-text);
  font-family: inherit;
  font-size: inherit;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

#content .plana-inline-notes__submit:hover,
#content .plana-inline-description-save:hover,
#plana-issue-ai-panel :is(#ai-helper-summary-button, #ai-helper-similar-issues-button, input[type="submit"]):hover {
  background: var(--button-hover-bg);
  border-color: var(--button-hover-border);
  color: var(--button-text);
  text-decoration: none;
  box-shadow: 0 2px 4px var(--button-hover-shadow);
}

#plana-issue-ai-panel :is(legend, summary, .ai-helper-subissuer-generator-button):hover {
  color: var(--primary-hover);
}

#plana-issue-ai-panel a:hover {
  text-decoration: underline;
}

#plana-issue-ai-panel :is(a, legend, summary, input, textarea, button):focus-visible {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
  border-radius: 3px;
}

#plana-issue-ai-panel #ai-helper-similar-issues-scope {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin: 0.5rem 0;
  color: var(--text-muted);
  font: inherit;
}

#plana-issue-ai-panel #ai-helper-similar-issues-scope label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin: 0;
}

#plana-issue-ai-panel input[type="radio"] {
  accent-color: var(--accent);
  margin: 0;
}

#plana-issue-ai-panel :is(#ai-helper-summary-area, #ai-helper-generated-subissues, #ai-helper-similar-issues-area) {
  max-width: 100%;
  overflow-x: auto;
  overflow-wrap: anywhere;
}

#plana-issue-ai-panel .ai-helper-summary-header {
  color: var(--text-muted);
  margin-bottom: 0.5rem;
}

#plana-issue-ai-panel :is(input, textarea, select, button) {
  font-family: inherit;
  max-width: 100%;
}

#plana-issue-ai-panel :is(textarea, pre, code) {
  background: var(--surface);
  border-color: var(--border);
  color: var(--text);
}

#plana-issue-ai-panel :is(pre, blockquote) {
  border-color: var(--border-strong);
  margin-inline: 0;
}

#plana-issue-ai-panel pre {
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.65rem;
}

#plana-issue-ai-panel :is(table, th, td) {
  border-color: var(--border);
}

#plana-issue-ai-panel .ai-helper-loader {
  border-color: var(--border-strong);
  border-top-color: var(--primary);
}

#plana-issue-ai-panel .error {
  background: var(--surface);
  border-color: var(--danger);
  color: var(--danger);
}

/* Redmine AI Helper 3.6.2 integration. Keep these selectors scoped to the
 * plugin so AI controls inherit Plana tokens without changing issue layout. */
#aihelper-sidebar {
  color: var(--text);
  min-width: 0;
}

#aihelper-sidebar .aihelper-header {
  padding-bottom: 0.45rem;
}

#aihelper-sidebar .aihelper-hamburger {
  background: var(--surface);
  border-color: var(--border-strong);
}

#aihelper-sidebar .aihelper-hamburger span {
  background: var(--text-muted);
}

#aihelper-sidebar .aihelper-dropdown-menu {
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  box-shadow: 0 14px 30px var(--shadow);
  color: var(--text);
  max-width: 100%;
  z-index: 65;
}

#aihelper-sidebar li.aihelper-history-item:hover {
  background: var(--primary-soft);
}

#aihelper-sidebar .aihelper-arrow {
  border-color: var(--text-muted);
}

#aihelper-sidebar .aihelper-arrow:hover,
#aihelper-sidebar .aihelper-arrow:focus-visible {
  border-color: var(--primary);
}

#aihelper-sidebar #aihelper-chat-conversation {
  max-width: 100%;
  overflow-x: auto;
}

#aihelper-sidebar #aihelper-chat-conversation div.aihelper-message,
#aihelper-sidebar #aihelper-chat-conversation div.aihelper-message pre:has(code.syntaxhl) {
  border-color: var(--border);
}

#aihelper-sidebar #aihelper-chat-form-area textarea,
#aihelper-sidebar #aihelper-chat-form-area input,
#aihelper-sidebar #aihelper-chat-form-area select {
  background: var(--surface);
  color: var(--text);
  max-width: 100%;
  width: 100%;
}

html[data-theme] .ai-helper-stuff-todo-modal,
html[data-theme] .ai-helper-no-suggestions,
html[data-theme] .ai-helper-typo-error,
html[data-theme] .ai-helper-typo-control-panel {
  background: var(--surface);
  border-color: var(--border-strong);
  color: var(--text);
}

html[data-theme] .ai-helper-stuff-todo-modal {
  box-shadow: 0 20px 48px var(--shadow);
  z-index: 9999;
}

html[data-theme] .ai-helper-stuff-todo-overlay {
  z-index: 9998;
}

html[data-theme] .ai-helper-stuff-todo-header,
html[data-theme] .ai-helper-stuff-todo-body .ai-helper-streaming-content h2,
html[data-theme] .ai-helper-stuff-todo-body .ai-helper-final-content h2 {
  border-color: var(--border);
}

html[data-theme] .ai-helper-project-health-content,
html[data-theme] .ai-helper-scrollable-overlay {
  border-color: var(--border);
  scrollbar-color: var(--text-subtle) var(--surface-soft);
}

html[data-theme] .ai-helper-streaming-content code,
html[data-theme] .ai-helper-final-content code {
  background: var(--surface-soft);
  color: var(--text);
}

html[data-theme] .ai-helper-streaming-content pre,
html[data-theme] .ai-helper-final-content pre {
  background: var(--surface-soft);
  border-color: var(--border);
  color: var(--text);
}

@media screen and (max-width: 899px) {
  #aihelper-sidebar #aihelper-chat-conversation {
    max-height: min(42vh, 32rem);
  }

  #aihelper-sidebar #aihelper-history,
  #aihelper-sidebar #aihelper-history .icon-label,
  #aihelper-sidebar #aihelper-chat-clear .icon-label {
    color: var(--text);
  }
}

@media print {
  #top-menu,
  #header,
  #sidebar,
  #plana-theme-toggle,
  #plana-sidebar-toggle {
    display: none !important;
  }

  #main,
  #content {
    display: block;
    padding: 0;
  }
}

/* The issue title is already available in the page or modal header. */
.controller-issues.action-show #sticky-issue-header {
  display: none !important;
}

.controller-issues.action-show .description > .contextual {
  display: none !important;
}

.plana-inline-description-heading {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

#plana-inline-description-edit {
  position: static;
  transform: none;
  flex: 0 0 auto;
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
}

.controller-issues.action-show #issue_description_wiki,
.controller-issues.action-show #issue_description_wiki:not(.is-editing) > .plana-inline-shell,
.controller-issues.action-show #issue_description_wiki:not(.is-editing) > .plana-inline-shell > .plana-inline-display {
  display: block !important;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  white-space: normal !important;
  overflow-wrap: anywhere;
}

.controller-issues.action-show #issue_description_wiki pre {
  max-width: 100%;
  overflow-x: auto;
}

.plana-inline-editor.plana-inline-description-editor {
  flex-direction: column;
  align-items: stretch;
}

.plana-inline-editor[hidden],
.plana-inline-upload-list[hidden],
.plana-inline-upload-list button[hidden] {
  display: none !important;
}

.plana-inline-text-input {
  position: relative;
  width: 100%;
  min-width: 0;
  background: var(--surface);
  color: var(--text);
}

.plana-inline-text-input textarea {
  display: block;
  width: 100%;
  min-height: 6rem;
  resize: vertical;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.plana-inline-text-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin: 0.4rem 0;
}

.plana-inline-text-toolbar .plana-inline-text-action,
.plana-inline-text-toolbar .plana-inline-description-cancel,
.plana-inline-upload-list button {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text);
  font: inherit;
  line-height: 1.2;
  min-height: 30px;
  padding: 0.3rem 0.55rem;
  margin: 0;
  box-shadow: none;
}

.plana-inline-text-toolbar button:disabled,
.plana-inline-upload-list button:disabled {
  opacity: 0.6;
  cursor: default;
}

.plana-inline-description-actions {
  display: inline-flex;
  gap: 0.4rem;
  margin-inline-start: auto;
}

.plana-inline-upload-list {
  list-style: none;
  padding: 0;
  margin: 0.4rem 0;
}

.plana-inline-upload-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid var(--border);
  overflow-wrap: anywhere;
}

.plana-inline-upload-list li > span:first-child {
  flex: 1 1 12rem;
  min-width: 0;
}

.plana-inline-upload-list li > span:nth-child(2) {
  color: var(--text-muted);
  font-size: 0.85em;
}

.plana-inline-upload-list li.is-error > span:nth-child(2) {
  color: var(--danger);
}

.plana-inline-text-input .ai-helper-typo-control-panel {
  display: none;
}

.plana-inline-text-input .ai-helper-typo-control-panel.ai-helper-control-panel-positioned {
  position: static !important;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.3rem;
}

.plana-inline-text-input .ai-helper-text-black {
  color: var(--text) !important;
}

.plana-inline-text-input .ai-helper-typo-original {
  color: var(--danger) !important;
  background: color-mix(in srgb, var(--danger) 12%, var(--surface)) !important;
}

.plana-inline-text-input .ai-helper-typo-correction {
  color: var(--primary) !important;
  background: var(--primary-soft) !important;
}

/* Group priorities remain outside My Page's personal widget layout. */
#team-priorities,
#team-priorities-admin {
  clear: both;
  min-width: 0;
  margin-bottom: 1.5rem;
  color: var(--text);
}
#team-priorities [hidden] { display: none !important; }
#team-priorities .team-priorities-board {
  padding: 1rem;
  border: 1px solid var(--border);
  background: var(--surface);
}
#team-priorities .team-priorities-selector,
#team-priorities .team-priorities-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin-bottom: .75rem;
}
#team-priorities-list { padding-left: 1.75rem; }
#team-priorities-list > li { padding: .75rem .25rem; border-bottom: 1px solid var(--border); }
#team-priorities .team-priorities-title,
#team-priorities .team-priorities-description,
#team-priorities .team-priorities-links { overflow-wrap: anywhere; }
#team-priorities .team-priorities-title {
  display: block;
  margin-bottom: .4rem;
  color: var(--primary);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
}
#team-priorities-list > li::marker { color: var(--primary); font-weight: 700; }
#team-priorities .team-priorities-actions button {
  padding: .25rem .6rem;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-muted);
  box-shadow: none;
  font-size: .85rem;
  font-weight: 400;
}
#team-priorities .team-priorities-actions button:hover:not(:disabled),
#team-priorities .team-priorities-actions button:focus-visible {
  border-color: var(--border);
  background: var(--surface-soft);
  color: var(--text);
}
#team-priorities .team-priorities-actions button:disabled { opacity: .45; cursor: default; }
#team-priorities .team-priorities-description { white-space: pre-wrap; }
#team-priorities .team-priorities-meta { color: var(--text-muted); font-size: .9em; }
#team-priorities .team-priorities-drag { cursor: grab; padding: .5rem; }
#team-priorities button { min-height: 36px; }
#team-priorities input,
#team-priorities textarea { width: 100%; max-width: 100%; }
#team-priorities select { max-width: 100%; }
#team-priorities label { display: block; margin-bottom: .25rem; }
#team-priorities-error { color: var(--danger); white-space: pre-wrap; overflow-wrap: anywhere; }
#team-priorities :focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
#team-priorities .ui-sortable-placeholder { border: 1px dashed var(--primary); visibility: visible !important; }

/* Expert Helpdesk owns mail behavior; Plana owns its presentation. */
body .plana-helpdesk-editor { margin-block: 1.5rem; }
body #hd-reply-section,
body .hd-footer-preview,
body .helpdesk-sla-box,
body .hd-stats-filter,
body .hd-stats-tile {
  background: var(--surface-soft); border-color: var(--border); color: var(--text);
  border-radius: 0.5rem;
}
body .hd-fields-table { width: 100%; table-layout: fixed; }
body .hd-fields-table th { width: 6.5rem; white-space: normal; }
body .hd-att-label { white-space: normal; overflow-wrap: anywhere; }
body .hd-fields-table th,
body .hd-footer-label,
body .hd-att-size,
body .hd-stats-lbl { color: var(--text-muted); }
body .hd-stats-num { color: var(--text); }
body .hd-addr-field { width: 100%; box-sizing: border-box; }
body .hd-ac-wrap { display: block; max-width: 100%; }
body .hd-send-label { flex-wrap: wrap; }
body .hd-ac-dropdown,
body .hd-orig-dropdown { background: var(--surface); color: var(--text); border-color: var(--border); }
body .hd-ac-dropdown li:hover,
body .hd-ac-dropdown li.hd-ac-active,
body .hd-orig-dropdown label:hover { background: var(--primary-soft); }
body #helpdesk-mailbox-box { min-width: 0; }
body #helpdesk-mailbox-box input,
body #helpdesk-mailbox-box textarea,
body #helpdesk-mailbox-box select { max-width: 100%; box-sizing: border-box; }
body .helpdesk-issue-header,
body .hd-tb-menu { background: var(--surface-soft); color: var(--text); border-color: var(--border); }
body .helpdesk-issue-header a,
body a.hd-reply-btn { color: var(--primary) !important; }
body .hd-journal-meta,
body .hd-stats-muted,
body .hd-stats-empty,
body .hd-stats-lbl em { color: var(--text-muted); }
body .plana-helpdesk-editor,
body .plana-helpdesk-editor legend,
body #tab-content-expert_helpdesk legend,
body #helpdesk-mailbox-box legend { color: var(--text); }
body .plana-helpdesk-editor .jstElements { display: flex; flex-wrap: wrap; gap: 2px; }
body .plana-helpdesk-editor .jstElements button { overflow: hidden; font-size: 0; }
body .hd-tb-item { color: var(--text); }
body .hd-tb-item:hover,
body .hd-tb-item:focus { background: var(--primary-soft); }
body .plana-helpdesk-editor h3 { color: var(--text); }

/* Keep the native action beside the recipient, or below the note editor. */
body .hd-fields-table .plana-helpdesk-recipient-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem;
}
body .plana-helpdesk-recipient-row > .hd-ac-wrap { flex: 1 1 16rem; min-width: 0; }
body .plana-helpdesk-recipient-row > input[type="submit"] { flex: 0 0 auto; }
body .plana-helpdesk-note-action { margin-block: .75rem; }
body .plana-helpdesk-time-log { margin-bottom: .75rem; }
body .plana-helpdesk-time-log > summary { cursor: pointer; padding: .5rem 0; font-weight: 600; }
body .plana-helpdesk-time-log fieldset > legend { display: none; }

body .plana-helpdesk-note-action { grid-template-columns: minmax(0, 1fr) auto; }
body .plana-helpdesk-note-action > #plana-helpdesk-submit { grid-column: 2; justify-self: end; }
body .plana-helpdesk-note-action .plana-inline-notes__toggles { gap: .35rem; }
body .plana-helpdesk-note-action .plana-inline-notes__toggles label { margin: 0; }
body .plana-helpdesk-editor #new-attachments .add_attachment { display: none !important; }
body .plana-helpdesk-editor #new-attachments { display: block !important; }
body .plana-helpdesk-text-toolbar a { text-decoration: none; }

/* Suggested Helpdesk solutions share the issue view's layout and theme. */
#plana-helpdesk-solutions {
  margin: 18px 0;
  padding: 14px 0;
  border-block: 1px solid var(--border);
}
.plana-solutions-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
#plana-helpdesk-solutions h3 { margin: 0 0 4px; }
#plana-helpdesk-solutions h3, #plana-helpdesk-solutions h4 { color: var(--text); }
.plana-solutions-source { color: var(--text-muted); font-size: 0.85em; }
#plana-solutions-status { margin: 10px 0 0; }
#plana-solutions-status:empty { display: none; }
#plana-solutions-status.is-error { color: var(--text); font-weight: 600; }
.plana-solution { margin-top: 12px; padding: 12px; background: var(--surface-soft); border-radius: 6px; overflow-wrap: anywhere; }
.plana-solution-preview { margin: 8px 0; }
.plana-solution summary { cursor: pointer; color: var(--link); }
.plana-solution h4 { margin: 12px 0 4px; }
.plana-solution-problem, .plana-solution-text { white-space: pre-wrap; }

/* Popup hierarchy stays separate from the subject's inline editor. */
.plana-inline-popup-issue .plana-parent-subject p { display: none; }
.plana-inline-popup-issue .plana-parent-subject div { margin-left: 0; padding-left: 0; border-left: 0; }
#plana-issue-parent { border: 0; }
#plana-issue-parent > .value { overflow: visible; min-width: 0; }
.plana-parent-summary { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; overflow-wrap: anywhere; margin-bottom: 0.45rem; }
.plana-parent-summary:empty { display: none; }
.plana-parent-label { font-weight: 700; }
.plana-parent-editor { position: relative; }
.plana-parent-editor .ui-autocomplete { max-width: 100%; max-height: 15rem; overflow: auto; z-index: 100; }

/* Plana Tags: stable group colors, with readable foregrounds in each theme. */
.plana-tag.plana-tag-colored { background: hsl(var(--plana-tag-hue) 48% 90%); color: #18212b; border-color: hsl(var(--plana-tag-hue) 25% 65%); }
html[data-theme="dark"] .plana-tag.plana-tag-colored { background: hsl(var(--plana-tag-hue) 25% 24%); color: #f5f7fa; border-color: hsl(var(--plana-tag-hue) 20% 45%); }
.plana-tag.plana-tag-colored.plana-tag-scoped,
html[data-theme="dark"] .plana-tag.plana-tag-colored.plana-tag-scoped { background: var(--surface, #fff); color: var(--text, #222); }
.plana-tag.plana-tag-colored.plana-tag-scoped .plana-tag-group { background: hsl(var(--plana-tag-hue) 48% 90%); color: #18212b; border-color: hsl(var(--plana-tag-hue) 25% 65%); }
html[data-theme="dark"] .plana-tag.plana-tag-colored.plana-tag-scoped .plana-tag-group { background: hsl(var(--plana-tag-hue) 25% 24%); color: #f5f7fa; border-color: hsl(var(--plana-tag-hue) 20% 45%); }
