/* Ported from expo-web's +html.tsx globalStyles: fonts (Roboto text +
   MaterialDesignIcons/Feather icon fonts — dynamic loading is disabled in
   src/init/iconFonts.web.ts, so these @font-face rules are the ONLY way icon
   glyphs load) and the base document styles. Referenced as a <link> from
   __root.tsx (an inline <style> in head breaks hydration against RNW's
   client-injected react-native-stylesheet element). */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('/fonts/roboto/roboto-latin-300-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/roboto/roboto-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/roboto/roboto-latin-500-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/roboto/roboto-latin-600-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/roboto/roboto-latin-700-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'MaterialDesignIcons';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/fonts/material-design-icons/MaterialDesignIcons.ttf') format('truetype');
}

@font-face {
  font-family: 'Feather';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/fonts/feather/Feather.ttf') format('truetype');
}

:root {
  /* Advertise both schemes so native UI (scrollbars, form controls, and the UA's
     default canvas) tracks the OS preference — matching unistyles' adaptiveThemes. */
  color-scheme: light dark;
}

html, body {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}

/* Paint the app's base background on the very first frame, keyed off the OS color
   scheme (theme `background` token: light neutral100 #fff / dark neutral15 #26262a).
   The dashboard (`_app`) is ssr:false and mounts lazily, so before its JS hydrates
   #root is empty and the document background shows through — without this, dark-mode
   users get a white flash. unistyles already themes by system preference; this just
   makes the pre-hydration paint agree with it. */
html, body {
  background-color: #ffffff;
}
@media (prefers-color-scheme: dark) {
  html, body {
    background-color: #26262a;
  }
}

html, body {
  -webkit-overflow-scrolling: touch;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}
body {
  /* viewport-fit=cover means content can extend under the notch/home indicator.
     Pad the bottom so content stays above the home indicator safe area. */
  padding-bottom: env(safe-area-inset-bottom, 0px);
  box-sizing: border-box;
  overflow-y: auto;
  overscroll-behavior-y: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -ms-overflow-style: scrollbar;
  font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

html:has([data-testid='table-layout']),
html:has([data-testid='table-layout-body']) {
    overscroll-behavior-x: contain;
}

body:has([data-testid='table-layout']),
body:has([data-testid='table-layout-body']) {
    overscroll-behavior-x: contain;
}

.dashboard-drawer-team-item:hover .dashboard-drawer-menu-trigger {
    display: flex !important;
}

.apps-page-separator[data-separator] {
    position: relative;
    width: 5px;
    border-radius: 2.5px;
    cursor: col-resize;
}

.apps-page-separator[data-separator]:hover,
.apps-page-separator[data-separator='active'] {
    background-color: var(--colors-primary);
}

#root {
  /* -webkit-fill-available = visible viewport on iOS (not the large 100vh).
     100dvh is the modern equivalent. Both avoid the iOS 100vh whitespace bug. */
  min-height: -webkit-fill-available;
  min-height: 100dvh;
  display: flex;
}