/* FoodBooth: how this app's own markup sits in the brand design layer (fb-uplift.css).
   Loaded last. The page bodies keep their components (site.css, on the design's colour roles);
   this file fits the parts of the shell that are this app's own, and the few class names that
   both stylesheets define (.fb-strip, .fb-lang) where the meanings differ. */

/* ---------- top bar: the company on the start side ---------- */
.fb-topbar-company { display: flex; align-items: center; gap: 10px; min-inline-size: 0; flex: 0 1 auto; }
.fb-topbar-company-name { color: var(--ink); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fb-topbar-switch { font-size: 13px; white-space: nowrap; }
.fb-topbar .fb-logo-sm { inline-size: 28px; block-size: 28px; border-radius: var(--radius); }

/* ---------- language switch: a POST form here, dressed as the design's text link ---------- */
form.fb-lang { margin: 0; padding: 0; background: none; }
.fb-topbar .fb-lang-btn, .fb-bare-head .fb-lang-btn {
  min-block-size: 36px; padding-block: 0; padding-inline: 10px; border: 0; border-radius: var(--radius);
  background: transparent; color: var(--ink); font-size: 13px; font-weight: 500;
}
.fb-topbar .fb-lang-btn:hover, .fb-bare-head .fb-lang-btn:hover { background: var(--ground-2); color: var(--ink); }
.fb-topbar .fb-lang-btn svg, .fb-bare-head .fb-lang-btn svg { display: none; }
html[lang="ar"] .fb-lang-btn { font-family: var(--fb-font-body); }   /* the label is the other language */
html[lang="en"] .fb-lang-btn { font-family: var(--fb-font-arabic); }

/* ---------- user menu ---------- */
.fb-user-btn { border-color: var(--stroke); border-radius: var(--radius); background: transparent; }
.fb-user-btn:hover { background: var(--ground-2); }
.fb-user-btn .fb-avatar { border-radius: var(--radius); }
.fb-menu { --bs-dropdown-bg: var(--surface); --bs-dropdown-color: var(--text); --bs-dropdown-link-color: var(--ink); --bs-dropdown-link-hover-bg: var(--ground-2); --bs-dropdown-link-hover-color: var(--ink); --bs-dropdown-border-color: var(--stroke); --bs-dropdown-divider-bg: var(--stroke); }

/* ---------- sidebar extras ---------- */
.fb-nav a > span:not(.fb-nav-i) { min-inline-size: 0; }
.fb-nav-lock { margin-inline-start: auto; opacity: .7; display: inline-flex; }
.fb-co { cursor: default; }
.fb-drawer-foot { font-size: 12px; color: var(--text-2); }

/* ---------- this app's strips under the top bar (subscription, notices) ----------
   The design's .fb-strip is a dashboard block; these keep a full-width band. */
.fb-strip.fb-banner { min-block-size: 0; margin: 0; padding-block: 10px; padding-inline: var(--fb-pad); flex-wrap: nowrap; border: 0; border-block-end: 1px solid var(--stroke); border-radius: 0; }
.fb-strip.fb-banner.fb-strip-info { background: var(--selected); color: var(--ink); }

/* ---------- owner panel badge ---------- */
.fb-owner-badge { border-radius: var(--radius); background: var(--ground-2); color: var(--ink); }

/* ---------- the bare shell (sign-in) ---------- */
.fb-bare .fb-auth-card { box-shadow: none; }
.fb-bare .fb-auth-foot { margin-block-start: 8px; }

/* ---------- phones: a wide table scrolls inside its card, never the page ---------- */
.fb-card-flush { overflow-x: auto; }
@media (max-width: 767.98px) {
  .fb-card { padding-inline: 16px; }
  .fb-card-flush { padding-inline: 0; }
  .fb-table th, .fb-table td { padding-inline: 12px; }
}