/* colors.css */

/* Base Theme Variables */
:root {
  /* Core Theme Colors */
  --primary-color: #b22222;
  --primary-faded-color: #bb5757 ;
  --secondary-color: #ffd700;
  --secondary-color: #ffd700;
  --trinary-color: #8b0000;
  --info-panel-color: #4b0082;
  --reports-color: #0077b6;

  /* Text Colors */
  --text-color: #000000;
  --text-color-hover: var(--trinary-color);

  /* Header Colors */
  --header-background-color: var(--primary-color);
  --header-text-color: #ffffff;

  /* Navbar Colors */
  --navbar-background-color: var(--primary-color);
  --navbar-text-color: #ffffff;
  --navbar-hover-color: var(--primary-faded-color);
  --navbar-menu-color: var(--primary-faded-color);
  --navbar-selected-color: var(--trinary-color);

  /* Footer Colors */
  --footer-background-color: var(--primary-color);
  --footer-text-color: #ffffff;
  --footer-hover-color: var(--secondary-color);


  /* Button Colors */
  --button-background-color: var(--secondary-color);
  --button-text-color: #000000;
  --button-primary-bg: var(--primary-color);
  --button-primary-color: #ffffff;
  --button-primary-hover-bg: var(--trinary-color);
  --button-primary-hover-color: #ffffff;
  --button-disabled-bg: #d3d3d3;
  --button-disabled-color: #a9a9a9;

  /* Background Colors */
  --background-color-light: #fff8dc;
  --section-background: #ffffff;
  --subsection-background: #fff5f0;

  /* Section Colors */
  --section-title-background: var(--secondary-color);
  --section-title-text-color: var(--trinary-color);
  --subsection-title-background: #ffecb3;
  --subsection-title-text-color: var(--primary-color);

  /* Table Colors */
  --table-heading: var(--secondary-color);
  --table-sub-heading: var(--primary-color);

  /* Border and Container Colors */
  --border-color-light: var(--secondary-color);
  --container-background: #ffffff;
  --container-shadow: rgba(0, 0, 0, 0.1);
  --input-container-bg: #ffdab9;

  /* Sidebar Colors */
  --sidebar-background: #ffffff;
  --sidebar-text-color: #000000;
  --sidebar-hover-color: var(--secondary-color);
  --sidebar-active-color: #da8f8f;

  /* State Colors */
  --focus-color: #0000ff;
  --selected-color: #ff4500;

  /* Button Colors */
  --button-background-color: var(--secondary-color);
  --button-text-color: var(--text-color);
  --button-border-color: var(--secondary-color);
  --button-hover-bg: var(--text-color-hover);
  --button-hover-text-color: var(--button-text-color);
  --button-hover-border: var(--text-color-hover);
  --button-active-bg: var(--button-primary-hover-bg);
  --button-active-text-color: var(--button-primary-hover-color);
  --button-disabled-bg: #d3d3d3;
  --button-disabled-text-color: #a9a9a9;
  --button-small-border-color: var(--border-color-light);
  --button-pencil-bg: var(--background-color-light);
  --button-pencil-border: var(--border-color-light);
  --button-pencil-hover-bg: #e2e6ea;

  /* Icon Colors */
  --icon-red-color: red;
  --icon-green-color: green;

  /* Spinner and Error Message Colors */
  --spinner-color: #333333;
  --spinner-background-color: #FFF3CD;
  --error-text-color: var(--icon-red-color);
  --error-background-color: #ffe5e5;
  --error-border-color: var(--icon-red-color);

  /* Message Box Colors */
  --message-background-light: #f8f9fa;
  --message-border-light: #e9ecef;
}

/* Theme-Specific Overrides */

/* Primary Theme */
.theme-primary {
  --primary-color: #b22222;
  --secondary-color: #ffd700;
  --trinary-color: #8b0000;
  --background-color-light: #fff8dc;
  --header-background-color: #b22222;
  --header-text-color: #ffffff;
}

/* Secondary Theme */
.theme-secondary {
  --primary-color: #004d40;
  --secondary-color: #ffc107;
  --trinary-color: #00796b;
  --background-color-light: #e0f7fa;
  --header-background-color: #004d40;
  --header-text-color: #ffffff;
}

/* Trinary Theme */
.theme-trinary {
  --primary-color: #6a0dad;
  --secondary-color: #ff7f50;
  --trinary-color: #9400d3;
  --background-color-light: #f3e5f5;
  --header-background-color: #6a0dad;
  --header-text-color: #ffffff;
}

/* Info-Panel Theme */
.theme-info-panel {
  --primary-color: #4b0082;
  --secondary-color: #ff69b4;
  --trinary-color: #dda0dd;
  --background-color-light: #e6e6fa;
  --header-background-color: #4b0082;
  --header-text-color: #ffffff;
}

/* Reports Theme */
.theme-reports {
  --primary-color: #0077b6;
  --secondary-color: #0096c7;
  --trinary-color: #48cae4;
  --background-color-light: #caf0f8;
  --header-background-color: #0077b6;
  --header-text-color: #ffffff;
}

/* Shared Components */

/* Header */
header {
  background-color: var(--header-background-color);
  color: var(--header-text-color);
}

/* Footer */
footer {
  background-color: var(--footer-background-color);
  color: var(--footer-text-color);
}

footer a:hover {
  color: var(--footer-hover-color);
}

/* Buttons */
button {
  background-color: var(--button-background-color);
  color: var(--button-text-color);
}

button.primary {
  background-color: var(--button-primary-bg);
  color: var(--button-primary-color);
}

button.primary:hover {
  background-color: var(--button-primary-hover-bg);
  color: var(--button-primary-hover-color);
}

button:disabled {
  background-color: var(--button-disabled-bg);
  color: var(--button-disabled-color);
  cursor: not-allowed;
}

/* Sidebar */
.sidebar {
  background-color: var(--sidebar-background);
  color: var(--sidebar-text-color);
}

.sidebar a:hover {
  color: var(--sidebar-hover-color);
}

.sidebar .active {
  color: var(--sidebar-active-color);
}

/* Sections */
.section-title {
  background-color: var(--section-title-background);
  color: var(--section-title-text-color);
}

.subsection-title {
  background-color: var(--subsection-title-background);
  color: var(--subsection-title-text-color);
}

/* Tables */
table thead th {
  background-color: var(--table-heading);
  color: var(--text-color);
}

table tbody tr:nth-child(even) {
  background-color: var(--background-color-light);
}

/* Containers */
.container {
  background-color: var(--container-background);
  box-shadow: 0 4px 6px var(--container-shadow);
}