/* SCN Billing — app styling on top of Materialize v2.3.3
   Navbar notes: v2.3.3 styles the bar via .navbar + .nav-wrapper (flex);
   it ships NO .sidenav-trigger styling and floats are ignored in the flex bar,
   so trigger visibility and ul alignment are handled here. */

.scn-blue {
  background-color: #16324f;
  /* Materialize v2 theme vars: paint the bar and its children */
  --md-sys-color-surface: #16324f;
  --md-sys-color-on-surface: #ffffff;
}

.brand-logo { font-weight: 600; }

/* button variant matching the brand bar (was referenced but never defined) */
.scn-blue-bg {
  background-color: #16324f;
  color: #ffffff;
}

/* muted text utility (v1 class, absent from v2 — provide it ourselves, theme-aware) */
.grey-text { color: var(--md-sys-color-on-surface-variant, #9e9e9e); }
.grey-text.text-darken-2 { color: var(--md-sys-color-on-surface-variant, #616161); }

/* v1 color utilities used by the views (Materialize v2 dropped the palette).
   Base = solid fill/white text; .lighten-N = pale fill/dark text for panels. */
.red { background-color: #f44336; color: #ffffff; }
.red.lighten-4 { background-color: #ffcdd2; color: #b71c1c; }
.green { background-color: #4caf50; color: #ffffff; }
.teal { background-color: #009688; color: #ffffff; }
.teal.lighten-4 { background-color: #b2dfdb; color: #004d40; }
.teal.lighten-5 { background-color: #e0f2f1; color: #004d40; }
.blue { background-color: #2196f3; color: #ffffff; }
.blue.lighten-4 { background-color: #bbdefb; color: #0d47a1; }
.orange { background-color: #ff9800; color: #ffffff; }
.amber { background-color: #ffc107; color: #4e342e; }
.amber.lighten-4 { background-color: #ffecb3; color: #4e342e; }
.grey { background-color: #9e9e9e; color: #ffffff; }
.grey.lighten-3 { background-color: #eeeeee; color: #424242; }
.white-text { color: #ffffff !important; }

/* Form fields use the dist's own fieldset.form-field component (56px notched
   boxes, width:100% controls, theme-aware idle/hover/focus) — no patches needed. */
.field-note { font-size: 0.78rem; margin: 4px 0 10px 0; color: var(--md-sys-color-on-surface-variant, #9e9e9e); }
.field-note .chip.tiny { margin-right: 6px; vertical-align: middle; }

/* Footer: slim brand bar pinned to the viewport bottom on short pages.
   (v1's .page-footer/.footer-copyright became a dashed content section with
   transparent bg in v2 — replaced wholesale rather than patched.) */
html, body { min-height: 100vh; }
body { display: flex; flex-direction: column; }
.app-footer { margin-top: auto; padding: 14px 0; font-size: 0.85rem; }
.app-footer .container { color: rgba(255, 255, 255, 0.85); }

/* push the desktop link list to the right edge of the flex bar */
.navbar ul.right { margin-left: auto; }

/* hamburger: hidden on desktop, shown where hide-on-med-and-down hides the ul */
.sidenav-trigger { display: none; }
@media only screen and (max-width: 992.99px) {
  .sidenav-trigger { display: inline-flex; align-items: center; cursor: pointer; }
}

table code { background: var(--md-sys-color-surface-variant, #f2f2f2); color: var(--md-sys-color-on-surface, inherit); padding: 2px 6px; border-radius: 3px; font-size: 0.85em; }

.badge { min-width: 0; }
.new.badge { font-weight: 500; }

#login-status { min-height: 1.4em; }

/* compact chips inside tables */
.chip.tiny { height: 20px; line-height: 20px; font-size: 0.7em; padding: 0 8px; }