/* Filebrowser branding/custom.css */
/* Your palette */
:root,
:root.dark {
  --background: #051e40;
  --surfacePrimary: #051e40;
  --surfaceSecondary: rgba(255, 255, 255, 0.06);
  --divider: rgba(255, 255, 255, 0.12);
  --dividerPrimary: rgba(255, 255, 255, 0.18);
  --dividerSecondary: rgba(255, 255, 255, 0.30);
  --borderPrimary: rgba(255, 255, 255, 0.20);
  --borderSecondary: rgba(255, 255, 255, 0.35);
  --hover: rgba(255, 255, 255, 0.07);
  --textPrimary: #ffffff;
  --textSecondary: rgba(255, 255, 255, 0.92);
  /* Primary */
  --blue: #aa1313;
  --dark-blue: #8f0f0f;
  /* Reds used by some built-ins */
  --red: #aa1313;
  --dark-red: #8f0f0f;
  /* Secondary accents (use sparsely via existing UI hooks) */
  --icon-blue: #1d5693;
  --icon-red: #db1d1d;
  --icon-orange: #f94141;
  --icon-green: #1c7cd3;
  --icon-yellow: #f94141;
  --action: #ffffff;;
  --iconPrimary: var(--blue);
  --iconSecondary: #ffffff;
  --iconTertiary: rgba(255, 255, 255, 0.55);
}
body,
#app {
  background: var(--background) !important;
  color: var(--textPrimary) !important;
}
/* Progress strip (top) */
.progress div {
  background-color: var(--blue) !important;
}
/* Minimal, branded buttons */
.button {
  background: var(--blue) !important;
  border-radius: 0.35em !important;
  box-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  font-weight: 600 !important;
}
.button:hover {
  background: var(--dark-blue) !important;
}
.button--flat {
  color: var(--textPrimary) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-transform: none !important;
}
.button--flat:hover {
  background: var(--surfaceSecondary) !important;
}
/* Inputs look sharper/minimal */
.input {
  background: rgba(255, 255, 255, 0.03) !important;
  color: var(--textPrimary) !important;
  border-color: var(--borderPrimary) !important;
  border-radius: 0.35em !important;
}
.input:hover,
.input:focus {
  border-color: var(--borderSecondary) !important;
}
/* Minimal dialogs/cards */
.card,
.context-menu,
.shell,
.shell__content,
.card.floating {
  background: rgba(255, 255, 255, 0.02) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: none !important;
  border-radius: 0.6em !important;
}
.context-menu {
  box-shadow: none !important;
}
/* LOGIN: remove branding/name */
#login {
  background: var(--background) !important;
}
#login img,
#login h1 {
  display: none !important;
}
#login form {
  background: rgba(255, 255, 255, 0.02) !important;
  padding: 1.5em 1.25em !important;
  border-radius: 0.75em !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  box-shadow: none !important;
}
/* Disk usage bar:
   - hidden for non-admin
   - visible for admin
   (uses modern :has() support) */
@supports selector(:has(*)) {
  nav > div.credits {
    display: none !important;
  }
  /* Admins have the "Settings" button in the sidebar only when user.perm.admin is true */
  nav:has(button.action[title="Settings"]) > div.credits {
    display: block !important;
  }
}