/***********************************************
  DOS Retro Blue Monochrome Theme (No Glows, Dark Grey Text,
  Modern Font, Slightly Lighter Blues)
  Four-Color Palette with Transparent Backgrounds
***********************************************/

/* 1) Define the DOS Blue Color Palette with Lighter Shades */
:root {
  /* Dark grey for standard text */
  --color-text: #333333;           

  /* Adjusted blues: */
  --color-accent:    #0077cc;  /* Primary accent for links, buttons */
  --color-alt:       #005fa3;  /* Secondary accent for borders and hovers */
  --color-highlight: #0099ff;  /* Optional highlight color */

  /* Map these to common color variables */
  --primary: var(--color-accent);
  --secondary: var(--color-alt);
  --success: var(--color-accent);
  --info: var(--color-accent);
  --warning: var(--color-alt);
  --danger: var(--color-highlight);
  --light: transparent;
  --dark: var(--color-text);

  /* Ensure all backgrounds are transparent */
  --body-bg: transparent;
  --heading-color: var(--color-text);
  --link-color: var(--color-accent);
  --link-hover-color: var(--color-alt);
}

/* 2) Body: Transparent background, dark grey text, modern font */
body {
  background: none !important;
  color: var(--color-text) !important;
  margin: 0;
  padding: 0;
  font-family: 'Roboto', sans-serif;
  text-shadow: none !important;
}

/* 3) Remove backgrounds and glows from common elements */
h1, h2, h3, h4, h5, h6,
.container-header,
.container-top-a,
.container-top-b,
.container-component,
.container-sidebar-left,
.container-sidebar-right,
.container-bottom-a,
.container-bottom-b,
.card,
.table,
.navbar,
.dropdown-menu,
.footer,
.modal,
.alert,
.badge,
.progress,
.list-group,
.offcanvas,
.offcanvas-backdrop,
.toast,
.accordion,
.popover,
.tooltip {
  background: none !important;
  box-shadow: none !important;
  border: none !important;
  color: var(--color-text) !important;
}

/* 4) Links – Use the accent color without any glow or underline */
a {
  color: var(--color-accent) !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}
a:hover,
a:focus {
  color: var(--color-alt) !important;
  text-decoration: none !important;
}

/* 5) Buttons – Transparent background with blue borders and text; no glows */
.btn {
  color: var(--color-accent) !important;
  border: 2px solid var(--color-accent) !important;
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
  text-shadow: none !important;
  box-shadow: none !important;
  transition: color 0.2s, border-color 0.2s;
}
.btn:hover,
.btn:focus {
  color: var(--color-alt) !important;
  border-color: var(--color-alt) !important;
  box-shadow: none !important;
  outline: none;
}

/* 6) Form Controls – Transparent with blue borders */
.form-control {
  background: transparent !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-alt) !important;
  box-shadow: none !important;
}
.form-control:focus {
  border-color: var(--color-accent) !important;
  outline: none;
  box-shadow: none !important;
}

/* 7) Tables – Transparent with blue borders */
.table td,
.table th {
  background: transparent !important;
  border: 1px solid var(--color-alt) !important;
  color: var(--color-text) !important;
}
.table tr:hover {
  background: none !important;
}

/* 8) Miscellaneous elements – Remove backgrounds from badges, alerts, pagination */
.badge,
.alert,
.pagination .page-link {
  color: var(--color-text) !important;
  border: 1px solid var(--color-alt) !important;
}

/* 9) Optional: Highlight elements using the highlight color (no background) */
.highlight {
  color: var(--color-highlight) !important;
  background: none !important;
}

/* 10) Force all elements with background classes to be transparent */
[class*="bg-"] {
  background: none !important;
}