/* 
 * Redmine Classic Theme - Overhauled to Premium
 * We are using the Classic folder because it's confirmed working.
 */

@import url("/assets/application-af672bda2b9ee58e7c7054d610ef6f8bb06084ee.css");
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --rm-primary: #2563eb;
  --rm-primary-hover: #1d4ed8;
  --rm-bg: #f8fafc;
  --rm-surface: #ffffff;
  --rm-border: #e2e8f0;
  --rm-text: #1e293b;
  --rm-header-bg: #172554;
  --rm-header-accent: #0f766e;
}

body {
  font-family: 'Inter', sans-serif !important;
  background-color: var(--rm-bg) !important;
  color: var(--rm-text) !important;
  margin: 0 !important;
}

#top-menu {
  background: var(--rm-header-bg) !important;
  border-bottom: 3px solid var(--rm-header-accent) !important;
  color: #dbeafe !important;
  min-height: 28px !important;
  padding: 4px 10px !important;
  box-sizing: border-box !important;
  font-size: 13px !important;
  line-height: 20px !important;
}

#top-menu a,
#top-menu a:link,
#top-menu a:visited {
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  margin-right: 10px !important;
}

#top-menu a.home::before,
#top-menu a.my-page::before,
#top-menu a.projects::before,
#top-menu a.administration::before,
#top-menu a.help::before {
  display: inline-block;
  width: 16px;
  margin-right: 4px;
  text-align: center;
  font-size: 13px;
  line-height: 1;
}

#top-menu a.home::before { content: "⌂"; }
#top-menu a.my-page::before { content: "👤"; }
#top-menu a.projects::before { content: "▦"; }
#top-menu a.administration::before { content: "⚙"; }
#top-menu a.help::before { content: "?"; }

#top-menu #account a {
  margin-right: 0 !important;
  margin-left: 10px !important;
}

#top-menu #loggedas {
  color: #dbeafe !important;
  font-size: 13px !important;
  line-height: 20px !important;
}

#header {
  background-color: var(--rm-header-bg) !important;
  padding: 28px 40px 44px 40px !important;
  height: auto !important;
  min-height: 150px !important;
  box-sizing: border-box !important;
}

#header h1 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 26px !important;
  line-height: 1.2 !important;
}

#header h1::before {
  content: "TZ";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: linear-gradient(135deg, #14b8a6, #2563eb);
  box-shadow: 0 8px 18px rgba(20, 184, 166, 0.25);
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0;
}

#main-menu {
  background-color: rgba(255, 255, 255, 0.98) !important;
  position: relative !important;
  margin: 26px 20px 0 20px !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12) !important;
  padding: 7px !important;
  border: 1px solid var(--rm-border) !important;
  width: auto !important;
  box-sizing: border-box !important;
  left: auto !important;
  right: auto !important;
  overflow: visible !important;
}

#main-menu > ul {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 4px !important;
  width: 100% !important;
  overflow: visible !important;
  white-space: nowrap !important;
}

#main-menu > ul > li {
  display: block !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

#main-menu ul li a {
  background-color: transparent !important;
  color: #475569 !important;
  border: none !important;
  font-weight: 600 !important;
  padding: 9px 14px !important;
  border-radius: 8px !important;
  line-height: 18px !important;
  white-space: nowrap !important;
}

#main-menu ul li a:hover {
  background-color: #e0f2fe !important;
  color: var(--rm-primary) !important;
}

#main-menu ul li a.selected {
  background: linear-gradient(135deg, #2563eb, #0891b2) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.24) !important;
}

#main-menu .tabs-buttons {
  display: none !important;
}

#main-menu ul.menu-children {
  display: none !important;
  position: absolute !important;
  width: max-content !important;
  min-width: 150px !important;
  margin: 0 !important;
  padding: 6px !important;
  background: #fff !important;
  border: 1px solid var(--rm-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.14) !important;
  white-space: nowrap !important;
  z-index: 1000 !important;
}

#main-menu li:hover > ul.menu-children,
#main-menu li ul.menu-children.visible {
  display: block !important;
}

#main-menu ul.menu-children li {
  display: block !important;
  margin: 0 !important;
  width: 100% !important;
}

#main-menu ul.menu-children li a {
  display: block !important;
  color: #475569 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 7px 10px !important;
}

#main-menu ul.menu-children li a:hover {
  background: #e0f2fe !important;
  color: var(--rm-primary) !important;
}

#main {
  background-color: var(--rm-bg) !important;
  margin: 30px 40px !important;
}

#content {
  background-color: #fff !important;
  border-radius: 12px !important;
  border: 1px solid var(--rm-border) !important;
  padding: 30px !important;
}

#sidebar {
  background-color: #fff !important;
  border-radius: 12px !important;
  border: 1px solid var(--rm-border) !important;
  padding: 20px !important;
  margin-left: 20px !important;
}

/* Custom Buttons */
input[type="submit"], button[type="submit"] {
  background: var(--rm-primary) !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-weight: 700 !important;
  color: #fff !important;
  border: none !important;
}

#footer {
  background: var(--rm-header-bg) !important;
  border-top: 3px solid var(--rm-header-accent) !important;
  color: #dbeafe !important;
  padding: 14px 20px !important;
  text-align: center !important;
}

#footer a,
#footer a:link,
#footer a:visited {
  color: #fff !important;
  font-weight: 700 !important;
}

/* Issue form cleanup for the Classic theme */
body.controller-issues.action-new #content,
body.controller-issues.action-create #content,
body.controller-issues.action-edit #content,
body.controller-issues.action-update #content {
  max-width: 1180px !important;
  margin: 0 auto !important;
}

#issue-form .box {
  background: #f8fafc !important;
  border: 1px solid var(--rm-border) !important;
  border-radius: 8px !important;
  padding: 24px !important;
}

#issue-form .tabular p {
  padding-left: 140px !important;
  margin: 0 0 14px !important;
  min-height: 34px !important;
  overflow: visible !important;
}

#issue-form .tabular label {
  width: 125px !important;
  margin-left: -140px !important;
  padding-top: 7px !important;
  color: #334155 !important;
  font-weight: 600 !important;
}

#issue-form input[type="text"],
#issue-form input[type="date"],
#issue-form input[type="number"],
#issue-form select,
#issue-form textarea {
  border: 1px solid #cbd5e1 !important;
  border-radius: 6px !important;
  min-height: 32px !important;
  padding: 5px 9px !important;
}

#issue-form input[type="text"]:focus,
#issue-form input[type="date"]:focus,
#issue-form input[type="number"]:focus,
#issue-form select:focus,
#issue-form textarea:focus {
  border-color: var(--rm-primary) !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.14) !important;
  outline: none !important;
}

#issue-form #issue_subject {
  width: min(100%, 820px) !important;
}

#issue-form #issue_project_id,
#issue-form #issue_tracker_id {
  width: min(100%, 430px) !important;
}

#issue-form #attributes.attributes {
  margin-top: 14px !important;
}

#issue-form .splitcontent {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px) !important;
  gap: 24px 36px !important;
  overflow: visible !important;
}

#issue-form .splitcontentleft,
#issue-form .splitcontentright {
  margin: 0 !important;
}

#issue-form .splitcontentright p {
  padding-left: 120px !important;
}

#issue-form .splitcontentright label {
  width: 105px !important;
  margin-left: -120px !important;
}

#issue-form .splitcontentleft select {
  width: min(100%, 520px) !important;
}

#issue-form .splitcontentright input[type="text"],
#issue-form .splitcontentright input[type="date"],
#issue-form .splitcontentright input[type="number"],
#issue-form .splitcontentright select {
  width: min(100%, 190px) !important;
}

#issue-form textarea.wiki-edit {
  width: 100% !important;
  min-height: 170px !important;
  background: #fff !important;
  border-radius: 0 0 6px 6px !important;
}

@media (max-width: 900px) {
  #issue-form .splitcontent {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  #issue-form .tabular p,
  #issue-form .splitcontentright p {
    padding-left: 0 !important;
  }

  #issue-form .tabular label,
  #issue-form .splitcontentright label {
    display: block !important;
    float: none !important;
    width: auto !important;
    margin: 0 0 4px !important;
    text-align: left !important;
  }
}

/* Login and shell polish for the Techozon classic theme */
body.action-login {
  background: #f5f7fb !important;
}

body.action-login #wrapper {
  min-height: 100vh !important;
  background:
    radial-gradient(circle at top left, rgba(20, 184, 166, 0.16), transparent 34rem),
    linear-gradient(180deg, #172554 0, #172554 214px, #f5f7fb 214px, #f5f7fb 100%) !important;
}

body.action-login #top-menu {
  background: rgba(15, 23, 42, 0.42) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
}

body.action-login #header {
  min-height: 132px !important;
  padding: 30px 48px 24px !important;
  background: transparent !important;
}

body.action-login #header h1 {
  font-size: 30px !important;
}

body.action-login #quick-search {
  display: none !important;
}

body.action-login #main {
  display: grid !important;
  place-items: center !important;
  flex-grow: 1 !important;
  min-height: 468px !important;
  margin: 0 !important;
  padding: 36px 24px 52px !important;
  background: transparent !important;
}

body.action-login #content {
  width: min(100%, 430px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.action-login #login-form {
  width: 100% !important;
  margin: 0 !important;
  padding: 28px !important;
  background: #fff !important;
  border: 1px solid #dbe4f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.16) !important;
  box-sizing: border-box !important;
}

.tz-login-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e2e8f0;
}

.tz-login-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 10px;
  background: linear-gradient(135deg, #14b8a6, #2563eb);
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.22);
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0;
}

.tz-login-brand strong {
  display: block;
  color: #0f172a;
  font-size: 16px;
  line-height: 1.25;
}

.tz-login-brand span:last-child {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: 13px;
}

body.action-login #login-form label {
  margin: 0 0 7px !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

body.action-login #login-form input[type="text"],
body.action-login #login-form input[type="password"] {
  height: 42px !important;
  margin-bottom: 17px !important;
  padding: 9px 12px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

body.action-login #login-form input[type="text"]:focus,
body.action-login #login-form input[type="password"]:focus {
  border-color: #2563eb !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14) !important;
  outline: 0 !important;
}

body.action-login #login-form a.lost_password {
  color: #2563eb !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

body.action-login #login-form label[for="autologin"] {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: -2px 0 16px !important;
  color: #475569 !important;
  font-weight: 600 !important;
}

body.action-login #login-form input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

body.action-login #login-submit {
  height: 44px !important;
  margin-top: 2px !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #2563eb, #0891b2) !important;
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.22) !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
}

body.action-login #login-submit:hover {
  background: linear-gradient(135deg, #1d4ed8, #0e7490) !important;
}

body.action-login #footer {
  margin-top: 0 !important;
}

@media (max-width: 700px) {
  body.action-login {
    min-width: 0 !important;
  }

  body.action-login #wrapper {
    background:
      radial-gradient(circle at top left, rgba(20, 184, 166, 0.16), transparent 24rem),
      linear-gradient(180deg, #172554 0, #172554 178px, #f5f7fb 178px, #f5f7fb 100%) !important;
  }

  body.action-login #header {
    min-height: 112px !important;
    padding: 24px 18px 16px !important;
  }

  body.action-login #header h1 {
    font-size: 22px !important;
  }

  body.action-login #main {
    min-height: 430px !important;
    padding: 22px 14px 40px !important;
  }

  body.action-login #login-form {
    padding: 22px !important;
  }
}

/* Register form polish */
body.action-register {
  background: #f5f7fb !important;
}

body.action-register #main {
  display: grid !important;
  place-items: start center !important;
  margin: 0 !important;
  padding: 36px 24px 58px !important;
  background: #f5f7fb !important;
}

body.action-register #content {
  width: min(100%, 980px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.tz-register-panel {
  background: #fff;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.1);
  padding: 28px;
}

.tz-register-heading {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e2e8f0;
}

.tz-register-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 10px;
  background: linear-gradient(135deg, #14b8a6, #2563eb);
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.2);
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0;
}

.tz-register-heading h2 {
  margin: 0 !important;
  padding: 0 !important;
  color: #0f172a !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}

.tz-register-heading p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
}

.tz-register-form.box {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.tz-register-form.tabular p {
  min-height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.tz-register-form.tabular p:nth-child(6),
.tz-register-form.tabular p:has(input[type="checkbox"]) {
  grid-column: 1 / -1 !important;
}

.tz-register-form.tabular label {
  display: block !important;
  float: none !important;
  width: auto !important;
  margin: 0 0 7px !important;
  padding: 0 !important;
  color: #334155 !important;
  text-align: left !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.tz-register-form input[type="text"],
.tz-register-form input[type="password"],
.tz-register-form input[type="email"],
.tz-register-form select {
  width: 100% !important;
  max-width: none !important;
  height: 42px !important;
  padding: 9px 12px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.tz-register-form input[type="text"]:focus,
.tz-register-form input[type="password"]:focus,
.tz-register-form input[type="email"]:focus,
.tz-register-form select:focus {
  border-color: #2563eb !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14) !important;
  outline: 0 !important;
}

.tz-register-form input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  margin: 0 8px 0 0 !important;
  vertical-align: -3px !important;
}

.tz-register-form em.info {
  display: block !important;
  margin: 7px 0 0 !important;
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.tz-register-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #e2e8f0;
}

.tz-register-actions input[type="submit"] {
  min-width: 150px !important;
  height: 44px !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #2563eb, #0891b2) !important;
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.2) !important;
  font-size: 14px !important;
  cursor: pointer !important;
}

.tz-register-actions input[type="submit"]:hover {
  background: linear-gradient(135deg, #1d4ed8, #0e7490) !important;
}

@media (max-width: 760px) {
  body.action-register {
    min-width: 0 !important;
  }

  body.action-register #main {
    padding: 22px 14px 40px !important;
  }

  .tz-register-panel {
    padding: 22px;
  }

  .tz-register-form.box {
    grid-template-columns: 1fr !important;
  }

  .tz-register-heading h2 {
    font-size: 22px !important;
  }

  .tz-register-actions {
    justify-content: stretch;
  }

  .tz-register-actions input[type="submit"] {
    width: 100% !important;
  }
}

/* Gantt page polish: keep Redmine's generated chart geometry intact */
body.controller-gantts.action-show #main {
  background: #f5f7fb !important;
  padding: 28px 36px 54px !important;
}

body.controller-gantts.action-show #content {
  border: 1px solid #dbe4f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
  padding: 30px 36px !important;
  overflow-x: auto !important;
}

body.controller-gantts.action-show #content > h2 {
  color: #0f172a !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  margin-bottom: 20px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

body.controller-gantts.action-show .tz-gantt-hero {
  margin: -4px 0 18px;
  padding: 0 0 18px;
  border-bottom: 3px solid #0b5a8f;
}

body.controller-gantts.action-show .tz-gantt-kicker {
  display: block;
  color: #075985;
  font-size: 34px;
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.controller-gantts.action-show .tz-gantt-hero h2 {
  margin: 4px 0 0 !important;
  padding: 0 !important;
  color: #475569 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}

body.controller-gantts.action-show .tz-gantt-hero .subtitle {
  margin: 6px 0 0;
  color: #64748b;
}

body.controller-gantts.action-show .tz-gantt-hero dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 28px;
  margin: 22px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid #d6dee8;
}

body.controller-gantts.action-show .tz-gantt-hero dl div {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 28px;
  border-bottom: 1px solid #d6dee8;
}

body.controller-gantts.action-show .tz-gantt-hero dt {
  color: #475569;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

body.controller-gantts.action-show .tz-gantt-hero dd {
  margin: 0;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
}

body.controller-gantts.action-show #query_form_with_buttons {
  margin-bottom: 18px !important;
  padding: 16px !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
}

body.controller-gantts.action-show #query_form_content > fieldset {
  border-color: #e2e8f0 !important;
}

body.controller-gantts.action-show #query_form_content legend {
  color: #0f172a !important;
  font-weight: 800 !important;
}

body.controller-gantts.action-show input[type="text"],
body.controller-gantts.action-show input[type="number"],
body.controller-gantts.action-show select {
  min-height: 32px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #0f172a !important;
  box-sizing: border-box !important;
}

body.controller-gantts.action-show #query_form_with_buttons a {
  color: #075985 !important;
  font-weight: 700 !important;
}

body.controller-gantts.action-show #query_form_with_buttons a:hover {
  color: #0369a1 !important;
}

body.controller-gantts.action-show #query_form_with_buttons a.tz-gantt-download-pdf {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 34px !important;
  padding: 0 14px !important;
  border: 1px solid #0b5a8f !important;
  border-radius: 7px !important;
  background: #0b5a8f !important;
  color: #fff !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

body.controller-gantts.action-show #query_form_with_buttons a.tz-gantt-download-pdf:hover {
  border-color: #084a78 !important;
  background: #084a78 !important;
  color: #fff !important;
}

body.controller-gantts.action-show p.warning {
  border: 1px solid #fde68a !important;
  border-radius: 8px !important;
  background: #fffbeb !important;
  color: #92400e !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 10px 14px !important;
}

body.controller-gantts.action-show table.gantt-table {
  width: 100% !important;
  table-layout: auto !important;
  border: 1px solid #dbe4f0 !important;
  border-radius: 10px !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
}

body.controller-gantts.action-show .tz-gantt-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  border: 2px solid #2d6f83;
  border-radius: 4px;
  background: #fff;
}

body.controller-gantts.action-show td.gantt_selected_column {
  display: none !important;
}

body.controller-gantts.action-show .gantt_subjects_column {
  width: 430px !important;
  min-width: 430px !important;
}

body.controller-gantts.action-show .gantt_subjects_column + td,
body.controller-gantts.action-show table.gantt-table tr > td:last-child {
  width: auto !important;
}

body.controller-gantts.action-show #gantt_area {
  display: block !important;
  width: calc(100vw - 610px) !important;
  min-width: 760px !important;
  max-width: 100% !important;
  background: #fff !important;
  border-left: 1px solid #dbe4f0 !important;
}

body.controller-gantts.action-show .gantt_subjects_container,
body.controller-gantts.action-show .gantt_subjects_container .gantt_hdr {
  width: 430px !important;
}

body.controller-gantts.action-show .gantt_subjects div {
  font-size: 12px !important;
  line-height: 20px !important;
  color: #0f172a !important;
}

body.controller-gantts.action-show .gantt_hdr {
  background-color: #f1f5f9 !important;
  border-color: #dbe4f0 !important;
  color: #334155 !important;
  font-weight: 800 !important;
}

body.controller-gantts.action-show .gantt_subjects_container > .gantt_hdr:first-child {
  background: #444 !important;
  border-color: #444 !important;
}

body.controller-gantts.action-show .gantt_subjects_container > .gantt_hdr:nth-child(2) {
  background: #f8fbff !important;
  border-color: #d1d5db !important;
}

body.controller-gantts.action-show .gantt_subjects_container > .gantt_hdr:first-child::after {
  content: "PROJECT / TASK";
  display: block;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  line-height: 18px;
  text-align: left;
  padding-left: 12px;
}

body.controller-gantts.action-show #gantt_area > .gantt_hdr:first-child,
body.controller-gantts.action-show #gantt_area .gantt_hdr {
  border-color: #d1d5db !important;
}

body.controller-gantts.action-show #gantt_area > .gantt_hdr:first-child {
  background: #444 !important;
}

body.controller-gantts.action-show .gantt_hdr.nwday {
  background-color: #eef2f7 !important;
  color: #94a3b8 !important;
}

body.controller-gantts.action-show .gantt_subjects div.issue-subject:hover {
  background-color: #eff6ff !important;
}

body.controller-gantts.action-show .gantt_subjects a,
body.controller-gantts.action-show .gantt_selected_column_content a {
  color: #0369a1 !important;
  font-weight: 600 !important;
}

body.controller-gantts.action-show .gantt_subjects {
  background: #fff !important;
}

body.controller-gantts.action-show .gantt_subjects div span,
body.controller-gantts.action-show .gantt_subjects div a {
  color: #075985 !important;
}

body.controller-gantts.action-show .gantt_subjects .tz-gantt-meta {
  display: inline-block;
  margin-left: 8px;
  color: #64748b !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  white-space: nowrap;
}

body.controller-gantts.action-show .gantt_subjects .tz-gantt-meta.is-late {
  color: #b91c1c !important;
}

body.controller-gantts.action-show .gantt_subjects .tz-gantt-meta.is-done {
  color: #15803d !important;
}

body.controller-gantts.action-show .gantt_subjects .tz-gantt-meta.is-open {
  color: #b91c1c !important;
}

body.controller-gantts.action-show .gantt_subjects div span.icon-projects a,
body.controller-gantts.action-show .gantt_subjects div span.icon-package a {
  color: #0f5f89 !important;
  font-weight: 900 !important;
}

body.controller-gantts.action-show .gantt_subjects div.issue-overdue a,
body.controller-gantts.action-show .gantt_subjects div.version-overdue a,
body.controller-gantts.action-show .gantt_subjects div.project-overdue a {
  color: #b91c1c !important;
}

body.controller-gantts.action-show .gantt_subjects span.issue-overdue a,
body.controller-gantts.action-show .gantt_subjects span.version-overdue a,
body.controller-gantts.action-show .gantt_subjects span.project-overdue a {
  color: #b91c1c !important;
}

body.controller-gantts.action-show .gantt_subjects svg {
  color: #334155 !important;
  opacity: 0.88 !important;
}

body.controller-gantts.action-show .task {
  border-radius: 0 !important;
  min-height: 12px !important;
  min-width: 8px !important;
  color: #fff !important;
  text-align: center !important;
  font-weight: 900 !important;
}

body.controller-gantts.action-show .task.label {
  color: #0f172a !important;
  background: transparent !important;
  border: 0 !important;
  min-width: 140px !important;
  text-align: left !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

body.controller-gantts.action-show .task.label.late-label {
  color: #b91c1c !important;
}

body.controller-gantts.action-show .task_todo {
  background-color: #075b9a !important;
  border-color: #075b9a !important;
}

body.controller-gantts.action-show .task_done {
  background-color: #0b5f95 !important;
  border-color: #0b5f95 !important;
}

body.controller-gantts.action-show .task_open {
  background-color: #dc2626 !important;
  border-color: #dc2626 !important;
}

body.controller-gantts.action-show .task_late {
  background-color: #ef1717 !important;
  border-color: #ef1717 !important;
}

body.controller-gantts.action-show .version.task_todo,
body.controller-gantts.action-show .project.task_todo {
  background-color: #0b5f95 !important;
  border-color: #0b5f95 !important;
}

body.controller-gantts.action-show .version.task_done,
body.controller-gantts.action-show .project.task_done {
  background-color: #15803d !important;
  border-color: #15803d !important;
}

body.controller-gantts.action-show .version.task_open,
body.controller-gantts.action-show .project.task_open {
  background-color: #dc2626 !important;
  border-color: #dc2626 !important;
}

@media (max-width: 1000px) {
  body.controller-gantts.action-show .tz-gantt-hero dl {
    grid-template-columns: 1fr;
  }

  body.controller-gantts.action-show .tz-gantt-kicker {
    font-size: 26px;
  }
}

body.controller-calendars.action-show #main {
  display: block !important;
  margin: 0 !important;
  padding: 24px 28px 42px !important;
  background: #f8fafc !important;
}

body.controller-calendars.action-show #sidebar {
  display: none !important;
}

body.controller-calendars.action-show #content {
  width: 100% !important;
  max-width: none !important;
  min-height: calc(100vh - 190px) !important;
  margin: 0 !important;
  padding: 22px 28px 28px !important;
  border: 1px solid #dbe4f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.07) !important;
  box-sizing: border-box !important;
  overflow-x: auto !important;
}

body.controller-calendars.action-show #content > h2 {
  display: none !important;
}

body.controller-calendars.action-show .tz-calendar-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 24px;
  margin: -2px 0 18px;
  padding-bottom: 16px;
  border-bottom: 3px solid #0b5a8f;
}

body.controller-calendars.action-show .tz-calendar-kicker {
  display: block;
  color: #075985;
  font-size: 32px;
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.controller-calendars.action-show .tz-calendar-hero h2 {
  margin: 4px 0 0 !important;
  padding: 0 !important;
  color: #475569 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}

body.controller-calendars.action-show .tz-calendar-hero .subtitle {
  margin: 6px 0 0;
  color: #64748b;
}

body.controller-calendars.action-show .tz-calendar-hero dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(96px, auto));
  gap: 10px;
  margin: 0;
}

body.controller-calendars.action-show .tz-calendar-hero dl div {
  padding: 10px 12px;
  border: 1px solid #dbe4f0;
  border-radius: 8px;
  background: #f8fbff;
}

body.controller-calendars.action-show .tz-calendar-hero dt {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

body.controller-calendars.action-show .tz-calendar-hero dd {
  margin: 4px 0 0;
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
}

body.controller-calendars.action-show #query_form_with_buttons {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px 18px;
  margin: 0 0 18px !important;
  padding: 14px 16px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
}

body.controller-calendars.action-show #query_form_content {
  grid-column: 1 / -1;
}

body.controller-calendars.action-show #query_form_content > fieldset {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.controller-calendars.action-show #query_form_content legend {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #0f172a !important;
  font-weight: 800 !important;
}

body.controller-calendars.action-show #query_form_with_buttons .pagination {
  float: none !important;
  grid-column: 2;
  grid-row: 2;
  margin: 0 !important;
}

body.controller-calendars.action-show #query_form_with_buttons p.buttons {
  grid-column: 1;
  grid-row: 2;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.controller-calendars.action-show #query_form_with_buttons select {
  min-height: 34px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #0f172a !important;
}

body.controller-calendars.action-show #query_form_with_buttons a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 32px !important;
  padding: 0 10px !important;
  border-radius: 7px !important;
  color: #075985 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

body.controller-calendars.action-show #query_form_with_buttons a:hover {
  background: #e0f2fe !important;
  color: #0369a1 !important;
}

body.controller-calendars.action-show .tz-calendar-shell {
  overflow: auto;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

body.controller-calendars.action-show ul.cal {
  display: grid !important;
  grid-template-columns: 44px repeat(7, minmax(150px, 1fr)) !important;
  grid-auto-rows: minmax(132px, auto) !important;
  width: 100% !important;
  min-width: 1120px !important;
  height: auto !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #fff !important;
}

body.controller-calendars.action-show .cal .calhead,
body.controller-calendars.action-show .cal .week-number {
  position: sticky;
  top: 0;
  z-index: 5;
  min-height: 42px;
  padding: 11px 8px !important;
  border-bottom: 1px solid #dbe4f0;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  text-align: center !important;
  box-sizing: border-box;
}

body.controller-calendars.action-show .cal .week-number {
  color: #94a3b8 !important;
  font-size: 11px !important;
}

body.controller-calendars.action-show .cal .calbody {
  position: relative;
  min-height: 132px !important;
  padding: 32px 6px 7px !important;
  border: 0 !important;
  border-right: 1px solid #e2e8f0 !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

body.controller-calendars.action-show .cal .week-number:not(.calhead) {
  position: static;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 36px !important;
  border-right: 1px solid #e2e8f0;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc !important;
}

body.controller-calendars.action-show .cal .calbody:hover {
  background: #f8fbff !important;
}

body.controller-calendars.action-show .cal .calbody.odd {
  background: #f8fafc !important;
}

body.controller-calendars.action-show .cal .calbody.nwday:not(.odd) {
  background: #fbfdff !important;
}

body.controller-calendars.action-show .cal .calbody.today {
  background: #eff6ff !important;
  box-shadow: inset 0 0 0 2px #0ea5e9;
}

body.controller-calendars.action-show .cal .calbody p.day-num {
  position: absolute;
  top: 7px;
  right: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin: 0 !important;
  border-radius: 50%;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

body.controller-calendars.action-show .cal .calbody.today p.day-num {
  background: #0b5a8f !important;
  color: #fff !important;
}

body.controller-calendars.action-show .cal .calbody.odd p.day-num {
  color: #94a3b8 !important;
}

body.controller-calendars.action-show .cal .calbody .tooltip,
body.controller-calendars.action-show .cal .calbody .icon-package {
  display: block;
  min-height: 24px;
  margin: 0 0 4px !important;
  padding: 4px 7px !important;
  border: 1px solid #bfdbfe !important;
  border-left: 4px solid #0b5a8f !important;
  border-radius: 6px !important;
  background: #eff6ff !important;
  color: #0f172a !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  box-sizing: border-box;
}

body.controller-calendars.action-show .cal .calbody .tooltip > svg,
body.controller-calendars.action-show .cal .calbody .tooltip > span:not(.tip),
body.controller-calendars.action-show .cal .calbody .icon-package > svg {
  flex: 0 0 auto;
}

body.controller-calendars.action-show .cal .calbody .tooltip:nth-of-type(3n),
body.controller-calendars.action-show .cal .calbody .icon-package:nth-of-type(3n) {
  border-color: #bbf7d0 !important;
  border-left-color: #15803d !important;
  background: #f0fdf4 !important;
}

body.controller-calendars.action-show .cal .calbody .tooltip:nth-of-type(3n + 1),
body.controller-calendars.action-show .cal .calbody .icon-package:nth-of-type(3n + 1) {
  border-color: #fed7aa !important;
  border-left-color: #c2410c !important;
  background: #fff7ed !important;
}

body.controller-calendars.action-show .cal .calbody a {
  color: #075985 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

body.controller-calendars.action-show .cal .calbody .tooltip a,
body.controller-calendars.action-show .cal .calbody .icon-package a {
  display: inline !important;
}

body.controller-calendars.action-show .cal .calbody a:hover {
  text-decoration: underline !important;
}

body.controller-calendars.action-show .cal .calbody svg {
  width: 13px;
  height: 13px;
  color: #475569;
}

body.controller-calendars.action-show p.cal.legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 14px 0 0 !important;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

@media (max-width: 1000px) {
  body.controller-calendars.action-show #main {
    padding: 14px !important;
  }

  body.controller-calendars.action-show #content {
    padding: 18px !important;
  }

  body.controller-calendars.action-show .tz-calendar-hero {
    grid-template-columns: 1fr;
  }

  body.controller-calendars.action-show .tz-calendar-hero dl {
    grid-template-columns: 1fr;
  }

  body.controller-calendars.action-show #query_form_with_buttons {
    grid-template-columns: 1fr;
  }

  body.controller-calendars.action-show #query_form_with_buttons .pagination,
  body.controller-calendars.action-show #query_form_with_buttons p.buttons {
    grid-column: 1;
    grid-row: auto;
  }
}

/* Keep long project tab rows inside the white menu shell at every width. */
html,
body,
#wrapper {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

#top-menu {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px 8px !important;
  overflow: hidden !important;
  max-width: 100% !important;
}

#top-menu > *,
#top-menu a {
  flex: 0 1 auto !important;
}

#main-menu.tabs,
#header #main-menu.tabs,
body #main-menu {
  display: flex !important;
  align-items: center !important;
  max-width: calc(100% - 40px) !important;
  overflow: hidden !important;
  padding-right: 62px !important;
  position: relative !important;
}

#main-menu.tabs > ul,
#header #main-menu.tabs > ul,
body #main-menu > ul {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

#main-menu.tabs > ul > li,
#header #main-menu.tabs > ul > li,
body #main-menu > ul > li {
  flex: 0 0 auto !important;
  min-width: 0 !important;
}

#main-menu.tabs .tabs-buttons,
#header #main-menu.tabs .tabs-buttons {
  position: absolute !important;
  right: 8px !important;
  bottom: auto !important;
  top: 50% !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: #ffffff !important;
  transform: translateY(-50%) !important;
  z-index: 5 !important;
}

#main-menu.tabs .tabs-buttons[style*="display: none"],
#header #main-menu.tabs .tabs-buttons[style*="display:none"] {
  display: none !important;
}

#main-menu.tabs button.tab-left,
#main-menu.tabs button.tab-right,
#header #main-menu.tabs button.tab-left,
#header #main-menu.tabs button.tab-right {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 7px !important;
  background: #f8fafc !important;
  background-image: none !important;
  color: transparent !important;
  cursor: pointer !important;
  font-size: 0 !important;
  opacity: 1 !important;
}

#main-menu.tabs button.tab-left::before,
#header #main-menu.tabs button.tab-left::before {
  content: "\2039" !important;
  color: #0f172a !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

#main-menu.tabs button.tab-right::before,
#header #main-menu.tabs button.tab-right::before {
  content: "\203A" !important;
  color: #0f172a !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

#main-menu.tabs button.tab-left.disabled,
#main-menu.tabs button.tab-right.disabled,
#header #main-menu.tabs button.tab-left.disabled,
#header #main-menu.tabs button.tab-right.disabled {
  cursor: default !important;
  opacity: .35 !important;
}

#main-menu.tabs a,
#header #main-menu.tabs a,
body #main-menu a {
  display: block !important;
  max-width: 100% !important;
  padding: 8px 11px !important;
  font-size: clamp(9px, 1.05vw, 12px) !important;
  line-height: 17px !important;
  white-space: nowrap !important;
}

@media (max-width: 720px) {
  #header {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  #main-menu.tabs,
  #header #main-menu.tabs,
  body #main-menu {
    margin-left: 8px !important;
    margin-right: 8px !important;
    max-width: calc(100% - 16px) !important;
    padding: 6px !important;
    padding-right: 58px !important;
  }

  #main-menu.tabs > ul,
  #header #main-menu.tabs > ul,
  body #main-menu > ul {
    gap: 4px !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: max-content !important;
  }

  #main-menu.tabs a,
  #header #main-menu.tabs a,
  body #main-menu a {
    padding: 7px 9px !important;
    font-size: 10px !important;
  }
}
