/* ==========================================================
   NOYTRIX V21
   GLOBAL READABILITY + ONE SCREEN
   ========================================================== */


/* ==========================================================
   1. ONE DESKTOP SCREEN
   ========================================================== */

html,
body {
  width: 100%;
  height: 100%;

  margin: 0;

  overflow: hidden !important;
}


body {
  min-height: 100vh;
}


.app-shell {
  width: 100vw;
  height: 100vh;

  min-height: 0 !important;

  overflow: hidden !important;
}


main,
.workspace,
.workspace-main,
.main-content,
.content,
.screen-container {
  min-width: 0;
  min-height: 0;

  height: 100%;

  overflow: hidden;
}


.screen {
  min-width: 0;
  min-height: 0;

  max-height: 100%;

  overflow: hidden !important;
}


/* sidebar stays inside screen */

.sidebar,
.app-sidebar {
  height: 100vh !important;

  min-height: 0;

  overflow: hidden;
}


/* only chat list can scroll */

.session-list,
.recent-checks,
.sidebar-chats,
.chat-history-list {
  min-height: 0;

  overflow-y: auto;

  scrollbar-width: thin;
}


/* ==========================================================
   2. GLOBAL SMALL TEXT
   +2px approximately, heavier
   ========================================================== */

/*
   Do NOT touch h1/h2/large hero text.
*/

small,
label,
time,
select,
input,
textarea,
button {
  font-weight: 650;
}


/* normal small supporting copy */

small {
  font-size: 10px !important;

  font-weight: 650 !important;

  line-height: 1.4;
}


/* ==========================================================
   3. LEFT SIDEBAR
   ========================================================== */

.nav-item,
.workspace-nav .nav-item {
  font-size: 12px !important;

  font-weight: 700 !important;
}


.nav-item b,
.workspace-nav .nav-item b {
  font-size: 12px !important;

  font-weight: 700 !important;

  letter-spacing: -.01em;
}


.nav-label,
#recent-sessions,
.sidebar .nav-label {
  font-size: 10px !important;

  font-weight: 800 !important;

  letter-spacing: .08em;
}


.recent-item strong,
.session-list strong {
  font-size: 10.5px !important;

  font-weight: 700 !important;
}


.recent-item small,
.session-list small {
  font-size: 9px !important;

  font-weight: 650 !important;
}


.account strong {
  font-size: 11px !important;

  font-weight: 750 !important;
}


.account small {
  font-size: 9px !important;

  font-weight: 650 !important;
}


/* ==========================================================
   4. TOP BAR / LANGUAGE / SIGN IN
   ========================================================== */

#headerAccountButton,
.language-current,
.language-menu button,
[data-lang],
.header-actions button {
  font-size: 11px !important;

  font-weight: 750 !important;
}


.language-current span,
.language-current b {
  font-size: 11px !important;

  font-weight: 750 !important;
}


/* ==========================================================
   5. BUTTONS ACROSS SITE
   ========================================================== */

.primary-action,
.secondary-action,
.button-link,
#newCheck {
  font-size: 11px !important;

  font-weight: 750 !important;
}


button {
  letter-spacing: -.005em;
}


/* ==========================================================
   6. INPUTS / SEARCH / SELECTS
   ========================================================== */

input,
textarea,
select {
  font-size: 11px !important;

  font-weight: 650 !important;
}


input::placeholder,
textarea::placeholder {
  font-weight: 600 !important;

  opacity: .82;
}


/* ==========================================================
   7. PAGE EYEBROWS
   ========================================================== */

.eyebrow,
.context-label {
  font-size: 11px !important;

  font-weight: 850 !important;

  letter-spacing: .085em;
}


/* ==========================================================
   8. CHECK / CHAT
   ========================================================== */

.chat-log,
.chat-message,
.chat-message p,
.result-message,
.verdict-message,
.analysis-status {
  font-size: 12px;

  font-weight: 600;
}


.chat-message small,
.verdict-message small,
.analysis-status small {
  font-size: 10px !important;

  font-weight: 650 !important;
}


.analysis-stage,
.analysis-stage span,
.analysis-stage p {
  font-size: 10.5px !important;

  font-weight: 650 !important;
}


.post-scan-actions button {
  font-size: 10px !important;

  font-weight: 750 !important;
}


/* ==========================================================
   9. TRACKING
   ========================================================== */

.tracking-v14,
.tracking-v14 button,
.tracking-v14 select,
.tracking-v14 input {
  font-weight: 650;
}


.tracking-v14 small,
.tracking-v14 .tracking-small,
.tracking-v14 .tracking-meta {
  font-size: 10px !important;

  font-weight: 650 !important;
}


.tracking-v14 td,
.tracking-v14 th {
  font-size: 10.5px !important;

  font-weight: 650 !important;
}


/* ==========================================================
   10. SIGNALS V19
   ========================================================== */

.signals-eyebrow-v19 {
  font-size: 11px !important;

  font-weight: 850 !important;
}


.signals-title-v19 p {
  font-size: 13px !important;

  font-weight: 600 !important;
}


.signals-notify-v19 {
  font-size: 11px !important;

  font-weight: 750 !important;
}


.signals-tabs-v19 button {
  font-size: 12px !important;

  font-weight: 700 !important;
}


.signals-tabs-v19 b {
  font-size: 10px !important;

  font-weight: 800 !important;
}


.signals-search-v19 input,
.signals-toolbar-v19 select {
  font-size: 11px !important;

  font-weight: 650 !important;
}


.signals-new-v19 {
  font-size: 11px !important;

  font-weight: 650 !important;
}


.signals-updated-v19 {
  font-size: 10px !important;

  font-weight: 650 !important;
}


.signals-column-v19 h3 {
  font-size: 13px !important;

  font-weight: 750 !important;
}


.signals-column-v19 > header small {
  font-size: 10px !important;

  font-weight: 650 !important;
}


.signal-item-title-v19 > strong {
  font-size: 12px !important;

  font-weight: 720 !important;
}


.signal-item-title-v19 > p {
  font-size: 10.5px !important;

  font-weight: 600 !important;
}


.signal-badge-v19 {
  font-size: 9.5px !important;

  font-weight: 750 !important;
}


.signal-tags-v19 span {
  font-size: 9px !important;

  font-weight: 650 !important;
}


.signal-source-v19,
.market-source-v19 {
  font-size: 9px !important;

  font-weight: 600 !important;
}


.signal-item-v19 footer time {
  font-size: 9px !important;

  font-weight: 650 !important;
}


.signal-check-v19 {
  font-size: 10px !important;

  font-weight: 750 !important;
}


.community-count-v19 {
  font-size: 9px !important;

  font-weight: 750 !important;
}


.market-date-v19 {
  font-size: 10px !important;

  font-weight: 650 !important;
}


.signals-column-footer-v19 {
  font-size: 10px !important;

  font-weight: 750 !important;
}


.signals-footer-copy-v19 p {
  font-size: 10.5px !important;

  font-weight: 650 !important;
}


.signals-source-pills-v19 span {
  font-size: 10px !important;

  font-weight: 700 !important;
}


.signals-how-v19 {
  font-size: 10px !important;

  font-weight: 750 !important;
}


/* ==========================================================
   11. MY ACTIVITY V20
   ========================================================== */

.activity-eyebrow-v20 {
  font-size: 11px !important;

  font-weight: 850 !important;
}


.activity-head-v20 p {
  font-size: 13px !important;

  font-weight: 600 !important;
}


.activity-period-v20 select {
  font-size: 11px !important;

  font-weight: 700 !important;
}


.activity-export-v20 {
  font-size: 11px !important;

  font-weight: 750 !important;
}


/* KPI */

.activity-kpi-v20 small {
  font-size: 11px !important;

  font-weight: 650 !important;
}


.activity-kpi-v20 em {
  font-size: 10px !important;

  font-weight: 700 !important;

  line-height: 1.3;
}


/* cards */

.activity-card-v20 h3 {
  font-size: 13px !important;

  font-weight: 750 !important;
}


.activity-chart-period-v20 button {
  font-size: 9.5px !important;

  font-weight: 750 !important;
}


.activity-chart-legend-v20 {
  font-size: 10px !important;

  font-weight: 650 !important;
}


/* chart labels */

.chart-y-label,
.chart-x-label {
  font-size: 9.5px !important;

  font-weight: 650 !important;
}


/* donut */

.activity-donut-v20 span {
  font-size: 10px !important;

  font-weight: 650 !important;
}


.activity-risk-legend-v20 > div {
  font-size: 10.5px !important;

  font-weight: 650 !important;
}


.activity-risk-legend-v20 strong {
  font-size: 11px !important;

  font-weight: 750 !important;
}


.activity-risk-summary-v20 {
  font-size: 9.5px !important;

  font-weight: 650 !important;
}


/* What you check */

.activity-type-row-v20 strong {
  font-size: 10px !important;

  font-weight: 700 !important;
}


.activity-type-count-v20 {
  font-size: 10px !important;

  font-weight: 750 !important;
}


.activity-type-row-v20 small {
  font-size: 9.5px !important;

  font-weight: 700 !important;
}


/* Recent activity */

.activity-action-copy-v20 strong {
  font-size: 10px !important;

  font-weight: 720 !important;
}


.activity-action-copy-v20 small {
  font-size: 9px !important;

  font-weight: 650 !important;
}


.activity-action-row-v20 time {
  font-size: 9px !important;

  font-weight: 650 !important;
}


.activity-secondary-v20 {
  font-size: 9.5px !important;

  font-weight: 750 !important;
}


/* Recommendation */

.activity-recommend-body-v20 p {
  font-size: 10.5px !important;

  font-weight: 650 !important;

  line-height: 1.5;
}


.activity-recommend-action-v20 {
  font-size: 10.5px !important;

  font-weight: 800 !important;
}


.activity-dismiss-v20 {
  font-size: 9.5px !important;

  font-weight: 700 !important;
}


/* Activity footer */

.activity-footer-v20 strong {
  font-size: 10.5px !important;

  font-weight: 750 !important;
}


.activity-footer-v20 small {
  font-size: 9.5px !important;

  font-weight: 650 !important;
}


.activity-footer-v20 > button {
  font-size: 10px !important;

  font-weight: 750 !important;
}


/* ==========================================================
   12. BILLING / PRODUCTS / DEVELOPERS / SETTINGS
   ========================================================== */

.billing-v2,
.settings-v2,
.product-access,
.api-layout,
.pro-layout {
  font-weight: 600;
}


.billing-v2 p,
.settings-v2 p,
.product-access p,
.api-layout p,
.pro-layout p {
  font-size: 12px;

  font-weight: 600;
}


.billing-v2 small,
.settings-v2 small,
.product-access small,
.api-layout small,
.pro-layout small {
  font-size: 10px !important;

  font-weight: 650 !important;
}


.settings-control-label,
.settings-v2 label {
  font-size: 11px !important;

  font-weight: 700 !important;
}


.settings-hint {
  font-size: 10px !important;

  font-weight: 600 !important;
}


/* ==========================================================
   13. KEEP EVERYTHING INSIDE 100VH
   ========================================================== */

#screen-tracking.active,
#screen-intelligence.active,
#screen-analytics.active,
#screen-check.active,
#screen-api.active,
#screen-billing.active,
#screen-settings.active {
  max-height: 100%;

  overflow: hidden !important;
}


/* internal lists can scroll, page itself cannot */

.signals-feed-v19,
.activity-history-list-v20,
.watch-list,
.feed-list {
  overscroll-behavior: contain;
}


/* ==========================================================
   14. LAPTOP HEIGHT
   keep text larger without breaking one-screen layout
   ========================================================== */

@media (
  min-width: 761px
) and (
  max-height: 820px
) {

  .activity-head-v20 {
    min-height: 65px !important;
  }


  .activity-kpi-v20 {
    min-height: 66px !important;
  }


  .activity-v20 {
    gap: 6px !important;
  }


  .signals-head-v19 {
    min-height: 84px !important;
  }

}


/* ==========================================================
   15. MOBILE — allow natural scrolling
   ========================================================== */

@media(max-width:760px) {

  html,
  body {
    height: auto;

    overflow-x: hidden !important;
    overflow-y: auto !important;
  }


  .app-shell {
    width: 100%;

    height: auto;

    min-height: 100vh;

    overflow: visible !important;
  }


  .screen.active {
    height: auto;

    max-height: none;

    overflow: visible !important;
  }

}