@import "./theme-gitea-light.css";

/* TenantNode theme — light product UI matching the profile mock.
   Dark teal / petrol accent. Not Gitea green, not Control Plane glass,
   not the charcoal-only dark theme. */
gitea-theme-meta-info {
  --theme-display-name: "TenantNode";
}

:root {
  --is-dark-theme: false;
  color-scheme: light;

  --tn-teal: #2d6a72;
  --tn-teal-dark: #24565d;
  --tn-teal-darker: #1c454b;
  --tn-teal-soft: #e7f1f2;
  --tn-page: #f9fafb;
  --tn-card: #ffffff;
  --tn-border: #e5e7eb;
  --tn-ink: #111827;
  --tn-body: #1f2937;
  --tn-muted: #6b7280;
  --tn-muted-2: #4b5563;

  --color-primary: #2d6a72;
  --color-primary-contrast: #ffffff;
  --color-primary-dark-1: #24565d;
  --color-primary-dark-2: #1c454b;
  --color-primary-dark-3: #16383d;
  --color-primary-dark-4: #102b2f;
  --color-primary-dark-5: #0b1f22;
  --color-primary-dark-6: #071416;
  --color-primary-dark-7: #040b0c;
  --color-primary-light-1: #3a7c85;
  --color-primary-light-2: #4b8e97;
  --color-primary-light-3: #6aa3aa;
  --color-primary-light-4: #8fb9be;
  --color-primary-light-5: #b6d1d4;
  --color-primary-light-6: #d5e6e8;
  --color-primary-light-7: #eef5f6;
  --color-primary-alpha-10: #2d6a7219;
  --color-primary-alpha-20: #2d6a7233;
  --color-primary-alpha-30: #2d6a724c;
  --color-primary-alpha-40: #2d6a7266;
  --color-primary-alpha-50: #2d6a727f;
  --color-primary-alpha-60: #2d6a7299;
  --color-primary-alpha-70: #2d6a72b2;
  --color-primary-alpha-80: #2d6a72cc;
  --color-primary-alpha-90: #2d6a72e5;
  --color-primary-hover: var(--color-primary-dark-1);
  --color-primary-active: var(--color-primary-dark-2);
  --color-accent: #2d6a72;
  --color-small-accent: var(--color-primary-light-6);

  --color-secondary: #e5e7eb;
  --color-secondary-dark-1: #dde0e5;
  --color-secondary-dark-2: #d1d5db;
  --color-secondary-dark-3: #b8bec7;
  --color-secondary-dark-4: #9aa3ad;
  --color-secondary-dark-5: #7b858f;
  --color-secondary-dark-6: #646b73;
  --color-secondary-dark-7: #4b5563;
  --color-secondary-dark-8: #374151;
  --color-secondary-dark-9: #1f2937;
  --color-secondary-dark-10: #111827;
  --color-secondary-dark-11: #0f172a;
  --color-secondary-dark-12: #030712;
  --color-secondary-dark-13: #000000;
  --color-secondary-light-1: #eef0f3;
  --color-secondary-light-2: #f3f4f6;
  --color-secondary-light-3: #f9fafb;
  --color-secondary-light-4: #ffffff;
  --color-secondary-alpha-10: #e5e7eb19;
  --color-secondary-alpha-20: #e5e7eb33;
  --color-secondary-alpha-30: #e5e7eb4c;
  --color-secondary-alpha-40: #e5e7eb66;
  --color-secondary-alpha-50: #e5e7eb80;
  --color-secondary-alpha-60: #e5e7eb99;
  --color-secondary-alpha-70: #e5e7ebb3;
  --color-secondary-alpha-80: #e5e7ebcc;
  --color-secondary-alpha-90: #e5e7ebe1;
  --color-secondary-button: var(--color-secondary-dark-4);
  --color-secondary-hover: var(--color-secondary-dark-5);
  --color-secondary-active: var(--color-secondary-dark-6);

  --color-logo: #2d6a72;
  --color-body: #f9fafb;
  --color-box-header: #f9fafb;
  --color-box-body: #ffffff;
  --color-box-body-highlight: #f3f4f6;
  --color-text-dark: #111827;
  --color-text: #1f2937;
  --color-text-light: #374151;
  --color-text-light-1: #4b5563;
  --color-text-light-2: #6b7280;
  --color-text-light-3: #9ca3af;
  --color-footer: #f9fafb;
  --color-timeline: #e5e7eb;
  --color-input-text: #111827;
  --color-input-background: #ffffff;
  --color-input-toggle-background: #f3f4f6;
  --color-input-border: #e5e7eb;
  --color-input-border-hover: #c5c9ce;
  --color-light: #11182708;
  --color-light-border: #e5e7eb;
  --color-hover: #11182708;
  --color-hover-opaque: #f3f4f6;
  --color-active: #2d6a7214;
  --color-menu: #ffffff;
  --color-card: #ffffff;
  --color-button: #ffffff;
  --color-code-bg: #f9fafb;
  --color-shadow: #11182714;
  --color-shadow-opaque: #d1d5db;
  --color-secondary-bg: #f9fafb;
  --color-expand-button: #eef0f2;
  --color-placeholder-text: #9ca3af;
  --color-editor-line-highlight: #f3f4f6;
  --color-project-column-bg: #f9fafb;
  --color-caret: var(--color-text-dark);
  --color-nav-bg: #ffffff;
  --color-nav-hover-bg: #f3f4f6;
  --color-nav-text: #1f2937;
  --color-secondary-nav-bg: #f9fafb;
  --color-header-bar: #ffffff;
  --color-label-text: var(--color-text);
  --color-label-bg: #e5e7eb;
  --color-label-hover-bg: #d1d5db;
  --color-label-active-bg: #c5c9ce;
  --color-markup-table-row: #f9fafb;
  --color-markup-code-block: #f3f4f6;
  --color-markup-code-inline: #f3f4f6;
  --color-reaction-bg: #f3f4f6;
  --color-reaction-hover-bg: #e5e7eb;
  --color-reaction-active-bg: #d1d5db;
  --color-tooltip-text: #ffffff;
  --color-tooltip-bg: #111827f0;
  --color-highlight-fg: #111827;
  --color-highlight-bg: #e7f1f2;
  --color-overlay-backdrop: #11182759;
  --color-git: #2d6a72;

  --border-radius: 6px;
  --border-radius-medium: 8px;

  accent-color: var(--color-accent);
}

html,
body {
  background: #f9fafb !important;
  color: #1f2937 !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: -0.011em;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.ui.header,
.flex-item-title,
.flex-item-title a.name {
  color: #111827 !important;
}

.full.height,
.page-content,
.page-header,
.footer,
.page-footer {
  background: transparent !important;
  box-shadow: none !important;
}

.page-content {
  padding-top: 20px;
}

/* Navbar */
#navbar,
.ui.secondary.menu.main-navbar,
header.page-header,
.following.bar {
  background: #ffffff !important;
  border-bottom: 1px solid #e5e7eb !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

#navbar {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 56px;
  padding: 0 16px;
}

#navbar .navbar-left,
#navbar .navbar-right {
  background: transparent !important;
}

#navbar .item,
#navbar a.item,
#navbar button.item {
  border-radius: 6px !important;
  color: #374151 !important;
  font-weight: 500;
  background: transparent !important;
  box-shadow: none !important;
}

#navbar a.item:hover,
#navbar button.item:hover {
  background: #f3f4f6 !important;
  color: #111827 !important;
}

#navbar .item.active,
#navbar a.item.active {
  background: transparent !important;
  color: #111827 !important;
  font-weight: 600;
}

#navbar-logo {
  gap: 8px;
  padding-left: 4px !important;
  padding-right: 12px !important;
}

#navbar-logo img {
  width: 22px !important;
  height: 22px !important;
  filter: none !important;
}

.tn-brand-name {
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -0.02em;
  color: #111827;
  line-height: 1;
}

#navbar .navbar-left > a.item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px !important;
}

#navbar .navbar-left > a.item svg,
#navbar .navbar-left > a.item .svg {
  color: #2d6a72 !important;
  fill: currentColor !important;
  width: 16px;
  height: 16px;
}

#navbar a.item[href*="/explore"] {
  background: transparent !important;
  color: #374151 !important;
  font-weight: 500 !important;
}

/* Centered-ish search with / hint */
.tn-nav-search {
  display: flex;
  align-items: center;
  flex: 1 1 280px;
  max-width: 420px;
  margin: 0 12px 0 auto;
  position: relative;
}

.tn-nav-search input {
  width: 100%;
  height: 34px;
  padding: 0 36px 0 34px !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  color: #111827 !important;
  box-shadow: none !important;
}

.tn-nav-search input:focus {
  border-color: #2d6a72 !important;
  box-shadow: 0 0 0 3px #2d6a721f !important;
}

.tn-nav-search .tn-search-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
  pointer-events: none;
  display: flex;
}

.tn-nav-search kbd {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  color: #6b7280;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 1px 6px;
  line-height: 16px;
}

#navbar .notification_count,
#navbar .ui.red.label.notification_count,
a[href*="/notifications"] .notification_count {
  background: #2d6a72 !important;
  color: #ffffff !important;
  border: 0 !important;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  font-size: 10px;
  font-weight: 700;
}

#navbar .navbar-right .svg,
#navbar .navbar-right svg {
  color: #374151;
}

/* Cards / chrome */
.ui.segment,
.ui.attached.segment,
.ui.table,
.ui.card,
.ui.cards > .card,
.comment-list .comment,
.timeline-item .comment,
.repository.file.list #repo-files-table,
.flex-list {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

.ui.attached.header,
.ui.top.attached.header {
  background: #f9fafb !important;
  border-color: #e5e7eb !important;
  color: #111827 !important;
  box-shadow: none !important;
}

.ui.menu,
.ui.tabular.menu,
.ui.secondary.menu {
  box-shadow: none !important;
  border-color: #e5e7eb !important;
}

.ui.button,
.ui.mini.button,
.ui.small.button {
  border-radius: 6px !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-weight: 500 !important;
}

.ui.primary.button,
.ui.green.button,
.ui.positive.button,
.ui.teal.button {
  background: #2d6a72 !important;
  color: #ffffff !important;
  border: 1px solid #24565d !important;
}

.ui.primary.button:hover,
.ui.green.button:hover,
.ui.positive.button:hover,
.ui.teal.button:hover {
  background: #24565d !important;
  color: #ffffff !important;
}

.ui.basic.button,
.ui.button:not(.primary):not(.green):not(.positive):not(.teal):not(.red):not(.orange):not(.blue) {
  background: #ffffff !important;
  color: #1f2937 !important;
  border: 1px solid #e5e7eb !important;
}

.ui.basic.button:hover,
.ui.button:not(.primary):not(.green):not(.positive):not(.teal):not(.red):not(.orange):not(.blue):hover {
  background: #f3f4f6 !important;
  color: #111827 !important;
  border-color: #d1d5db !important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
textarea,
select,
.ui.form input:not([type]),
.ui.form input[type="text"],
.ui.form input[type="email"],
.ui.form input[type="password"],
.ui.form input[type="search"],
.ui.form textarea,
.ui.selection.dropdown,
.ui.search > .ui.input > input {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  color: #111827 !important;
  box-shadow: none !important;
}

input:focus,
textarea:focus,
select:focus,
.ui.form input:focus {
  border-color: #2d6a72 !important;
  box-shadow: 0 0 0 3px #2d6a721f !important;
}

a {
  color: #2d6a72;
}

a:hover {
  color: #1c454b;
}

a.muted,
.muted,
.muted-links,
.text.grey,
.ui.text.grey {
  color: #6b7280 !important;
}

/* Profile card */
.user.profile .page-content,
.page-content.user.profile {
  background: transparent !important;
}

#profile-avatar-card.ui.card,
.user.profile .ui.card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  overflow: hidden;
}

#profile-avatar-card #profile-avatar {
  padding: 16px 16px 8px !important;
}

#profile-avatar-card #profile-avatar img,
#profile-avatar-card #profile-avatar .avatar {
  border-radius: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
}

.user.profile .profile-avatar-name .header {
  color: #111827 !important;
  font-weight: 700 !important;
  font-size: 1.25rem !important;
  margin-top: 4px !important;
}

.user.profile .profile-avatar-name .username {
  color: #2d6a72 !important;
  font-weight: 600 !important;
  display: block;
  margin-top: 2px;
}

.user.profile .profile-avatar-name .muted,
.user.profile .profile-avatar-name a.muted {
  color: #6b7280 !important;
  font-weight: 500;
}

.user.profile .ui.card .extra.content > ul > li {
  color: #6b7280;
  padding: 10px 14px !important;
}

.user.profile .ui.card .extra.content > ul > li svg,
.user.profile .ui.card .extra.content > ul > li .svg {
  color: #9ca3af !important;
}

.tn-edit-profile {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: calc(100% - 24px);
  margin: 8px 12px 14px !important;
  background: #f3f4f6 !important;
  color: #111827 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
}

.tn-edit-profile:hover {
  background: #e5e7eb !important;
  color: #111827 !important;
}

.tn-quick-links.ui.card {
  margin-top: 12px !important;
  padding: 0 !important;
  overflow: hidden;
}

.tn-quick-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  color: #111827 !important;
  font-weight: 500;
  border-bottom: 1px solid #e5e7eb;
}

.tn-quick-link:last-child {
  border-bottom: 0;
}

.tn-quick-link:hover {
  background: #f9fafb;
  color: #111827 !important;
}

.tn-quick-link .svg:first-child,
.tn-quick-link svg:first-child {
  color: #2d6a72 !important;
}

.tn-quick-link .tn-chevron {
  margin-left: auto;
  color: #9ca3af !important;
}

/* Profile tabs: thick teal underline on active */
.user.profile overflow-menu.ui.menu,
.user.profile .ui.secondary.pointing.menu,
.user.profile .ui.pointing.tabular.menu,
.user.profile .ui.secondary.stackable.pointing.menu {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #e5e7eb !important;
  margin-bottom: 16px !important;
  padding: 0 !important;
}

.user.profile overflow-menu .item,
.user.profile .ui.secondary.pointing.menu .item,
.user.profile .ui.pointing.tabular.menu .item {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  color: #6b7280 !important;
  font-weight: 500 !important;
  padding: 10px 14px !important;
  box-shadow: none !important;
  margin: 0 4px 0 0 !important;
}

.user.profile overflow-menu .item .svg,
.user.profile overflow-menu .item svg {
  color: #9ca3af !important;
}

.user.profile overflow-menu .item.active,
.user.profile .ui.secondary.pointing.menu .item.active,
.user.profile .ui.pointing.tabular.menu .item.active {
  background: transparent !important;
  color: #2d6a72 !important;
  font-weight: 600 !important;
  border-bottom: 3px solid #2d6a72 !important;
  box-shadow: none !important;
}

.user.profile overflow-menu .item.active .svg,
.user.profile overflow-menu .item.active svg {
  color: #2d6a72 !important;
}

.user.profile .ui.small.filter.menu {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  gap: 8px;
}

.user.profile .ui.small.filter.menu .divider {
  display: none;
}

/* Empty repo results */
.tn-empty-state,
.flex-list > div:only-child {
  text-align: center;
  padding: 48px 24px !important;
  color: #111827;
}

.tn-empty-state {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}

.tn-empty-illu {
  width: 72px;
  height: 72px;
  margin: 0 auto 16px;
  color: #d1d5db;
}

.tn-empty-state h3,
.tn-empty-state .tn-empty-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #111827 !important;
  margin: 0 0 6px;
}

.tn-empty-sub {
  color: #6b7280;
  font-size: 0.9rem;
  margin: 0 0 18px;
  font-weight: 400;
}

.tn-empty-state .ui.primary.button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* Homepage */
.page-content.home {
  max-width: 860px;
  margin: 0 auto;
  padding: 56px 24px 72px !important;
}

.page-content.home .logo {
  width: 40px !important;
  height: 40px !important;
  max-width: 40px !important;
  filter: none !important;
}

.page-content.home .hero h1,
.page-content.home .hero h1.ui.icon.header.title,
.page-content.home .hero h1.ui.header {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  color: #111827 !important;
  margin: 12px 0 6px !important;
  line-height: 1.25 !important;
}

.page-content.home .hero h2 {
  font-size: 1.05rem !important;
  font-weight: 400 !important;
  color: #4b5563 !important;
  margin: 0 auto 8px !important;
  line-height: 1.45 !important;
  max-width: 36rem;
}

.page-content.home .hero .svg {
  color: #2d6a72 !important;
  height: 16px !important;
  width: 16px !important;
}

.page-content.home h1.hero.ui.icon.header,
.page-content.home .hero.header {
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: #111827 !important;
}

.page-content.home p.large {
  font-size: 0.9rem !important;
  color: #4b5563 !important;
  line-height: 1.55 !important;
}

.page-content.home .ui.stackable.page.grid {
  border-top: 1px solid #e5e7eb;
  max-width: 720px;
  margin-left: auto !important;
  margin-right: auto !important;
}

.page-content.home a {
  color: #2d6a72 !important;
  text-decoration: none;
}

.page-content.home .eight.wide.center.column {
  text-align: left !important;
  padding: 16px 20px !important;
}

/* Sign-in CTA */
.oauth-login-link,
a.oauth-login-link,
#oauth2-login-navigator a.button,
#oauth2-login-navigator .ui.button {
  background: #2d6a72 !important;
  color: #ffffff !important;
  border: 1px solid #24565d !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.oauth-login-link:hover,
a.oauth-login-link:hover {
  background: #24565d !important;
  color: #ffffff !important;
}

body.user.signin:has(#oauth2-login-navigator) form.ui.form,
body.user.signin:has(#oauth2-login-navigator) .divider.divider-text {
  display: none !important;
}

#navbar a[href*="/user/sign_up"],
#navbar a[href$="/user/sign_up"] {
  display: none !important;
}

/* Footer */
.page-footer {
  border-top: 1px solid #e5e7eb !important;
  color: #6b7280 !important;
  background: #f9fafb !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 14px 20px !important;
}

.page-footer a {
  color: #4b5563 !important;
}

.page-footer .left-links,
.page-footer .right-links {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.page-footer .left-links > * + *:before,
.page-footer .right-links > a + a:before,
.page-footer .right-links > .ui.dropdown + a:before {
  content: "";
}

.tn-footer-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #111827 !important;
  font-weight: 600;
}

.tn-footer-brand img {
  width: 16px;
  height: 16px;
}

.tn-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  color: #4b5563 !important;
}

.tn-theme-toggle:hover {
  background: #f3f4f6;
  color: #111827 !important;
}

.js-global-error[data-global-error-msg-compact*="ROOTURLinappini"],
.js-global-error[data-global-error-msg-compact*="accessingbyHTTP"] {
  display: none !important;
}

@media (max-width: 767.98px) {
  .tn-nav-search {
    display: none;
  }
  .page-content.home .hero h1,
  .page-content.home .hero h1.ui.icon.header.title {
    font-size: 1.55rem !important;
  }
}

@media (min-width: 768px) {
  .page-content.home .hero h1,
  .page-content.home .hero h1.ui.icon.header.title {
    font-size: 1.85rem !important;
  }
}