/* =========================================
   BurritoLabs Files - Dark Red / Orange Theme
   ========================================= */

:root {
  --fb-bg1: #0a0202;              /* deepest background */
  --fb-bg2: #1a0b0b;              /* secondary background */
  --fb-surface: #140506;          /* main panel surface */
  --fb-surface-alt: #1f0a0b;      /* table headers / alt surface */

  --fb-accent: #f97316;           /* bright orange accent */
  --fb-accent-alt: #b91c1c;       /* dark red accent */

  --fb-text-main: #f9fafb;        /* main text */
  --fb-text-muted: #9ca3af;       /* muted text */
  --fb-border-subtle: rgba(148, 163, 184, 0.4);
  --fb-border-strong: rgba(15, 23, 42, 0.9);

  --fb-icon-default: #e5e7eb;     /* default icon color */
  --fb-icon-folder: #fb923c;      /* folder icon color (warm orange) */
}

/* Base layout / background */

html,
body {
  height: 100%;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at top left, #7f1d1d 0, transparent 55%),
    radial-gradient(circle at bottom right, #9a3412 0, transparent 60%),
    linear-gradient(135deg, var(--fb-bg1), var(--fb-bg2));
  color: var(--fb-text-main);
}

/* Keep inner app transparent to show the gradient */

#app,
.app,
main,
body > div {
  background: transparent !important;
}

/* Cards / panels */

.card,
.panel,
.v-card,
.fb-card,
.container,
main .content {
  background-color: var(--fb-surface) !important;
  border-radius: 14px;
  border: 1px solid var(--fb-border-subtle);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.7);
}

/* Header / navbar */

header,
.header,
.navbar,
.app-header,
.fb-header,
[class*="header"]:not(body):not(html) {
  background: linear-gradient(90deg, #7f1d1d, #f97316) !important;
  color: #ffffff !important;
  border-bottom: 1px solid var(--fb-border-strong) !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.7) !important;
}

/* Header title text */

header .title,
.header .title,
.navbar-brand,
.logo-text,
[class*="header"] .title {
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase;
  font-size: 0.9rem;
}

/* Links */

a {
  color: var(--fb-accent);
  text-decoration: none;
}

a:hover {
  color: #fed7aa;
  text-decoration: underline;
}

/* Buttons */

button,
.btn,
.v-btn {
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.9);
  font-size: 0.9rem;
  cursor: pointer;
}

button.primary,
.btn-primary,
.v-btn.primary,
button[type="submit"] {
  background: linear-gradient(135deg, var(--fb-accent-alt), var(--fb-accent));
  color: #111827;
  font-weight: 600;
}

button.primary:hover,
.btn-primary:hover,
.v-btn.primary:hover,
button[type="submit"]:hover {
  filter: brightness(1.05);
}

button.secondary,
.btn-secondary,
.v-btn.outlined,
.v-btn.text {
  background: rgba(15, 23, 42, 0.92);
  color: var(--fb-text-main);
  border: 1px solid var(--fb-border-subtle);
}

button.secondary:hover,
.btn-secondary:hover,
.v-btn.outlined:hover {
  background: rgba(30, 41, 59, 1);
}

/* Inputs & search */

input,
textarea,
select {
  font-family: inherit;
  font-size: 0.9rem;
}

input[type="text"],
input[type="search"],
input[type="password"],
input[type="email"],
textarea,
select {
  background: rgba(15, 23, 42, 0.95);
  border-radius: 8px;
  border: 1px solid rgba(148, 163, 184, 0.6);
  color: var(--fb-text-main);
  padding: 0.35rem 0.55rem;
}

input[type="text"]::placeholder,
input[type="search"]::placeholder,
input[type="password"]::placeholder,
textarea::placeholder {
  color: rgba(156, 163, 175, 0.85);
}

input[type="text"]:focus,
input[type="search"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--fb-accent);
  box-shadow: 0 0 0 1px var(--fb-accent);
}

/* Breadcrumb / path bar */

.breadcrumb,
.breadcrumbs,
.breadcrumbs-container {
  background: rgba(15, 23, 42, 0.9) !important;
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  border: 1px solid rgba(148, 163, 184, 0.45);
  color: var(--fb-text-main);
}

.breadcrumb a,
.breadcrumbs a {
  color: #e5e7eb;
}

.breadcrumb a:hover,
.breadcrumbs a:hover {
  color: #fee2e2;
}

/* File table */

table,
.fb-table,
.v-data-table {
  border-collapse: collapse;
  width: 100%;
  font-size: 0.9rem;
}

table thead tr,
.fb-table thead tr,
.v-data-table thead tr {
  background-color: var(--fb-surface-alt);
}

th {
  font-weight: 600;
  color: var(--fb-text-muted);
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid rgba(55, 65, 81, 0.9);
  text-transform: uppercase;
  font-size: 0.75rem;
}

td {
  color: var(--fb-text-main);
  padding: 0.45rem 0.75rem;
  border-bottom: 1px solid rgba(31, 41, 55, 0.95);
}

/* Hover / selected rows */

tbody tr:hover,
tr.item:hover,
tr.fb-row:hover {
  background-color: rgba(24, 17, 17, 0.9) !important;
}

tr.is-selected,
tr.selected {
  background: rgba(248, 113, 113, 0.18) !important;
}

/* Muted text: sizes, dates */

td.size,
td.date,
td.time,
small,
.text-muted {
  color: var(--fb-text-muted);
}

/* Login page */

.login,
.login-container,
#login {
  background: radial-gradient(circle at top, rgba(127, 29, 29, 0.9), transparent 55%),
              radial-gradient(circle at bottom, rgba(30, 64, 175, 0.7), transparent 60%) !important;
}

/* Folder & file icons
   Note: File Browser uses SVG / icon components; these selectors
   try to catch common ones. If folder color doesn't change,
   you can refine selectors via browser DevTools. */

/* Default icon color */
svg,
.v-icon {
  color: var(--fb-icon-default);
  fill: var(--fb-icon-default);
}

/* Folder-ish icons */
.icon-folder,
.folder-icon,
[class*="folder"] .v-icon,
[class*="folder"] svg,
td.name .v-icon,
td.name svg {
  color: var(--fb-icon-folder) !important;
  fill: var(--fb-icon-folder) !important;
}

/* Little pills / tags */

.badge,
.tag,
.label-pill {
  border-radius: 999px;
  padding: 0.15rem 0.5rem;
  border: 1px solid rgba(248, 113, 113, 0.8);
  background: rgba(127, 29, 29, 0.3);
  color: #fee2e2;
  font-size: 0.75rem;
}

/* Scrollbar */

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.98);
}
::-webkit-scrollbar-thumb {
  background: rgba(75, 85, 99, 0.95);
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(107, 114, 128, 1);
}