/* ============================================================
 * ENPM702 - Custom Furo Theme Enhancements
 * ============================================================
 * Organized Structure:
 * 1. Imports
 * 2. Typography
 * 3. Color Variables (Light/Auto/Dark)
 * 4. Sphinx Design Overrides
 * 5. Custom Admonitions
 * 6. Tables
 * 7. Utility Classes
 * ============================================================ */

/* ============================================================
 * 1. IMPORTS
 * ============================================================ */
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css");

/* ============================================================
 * 2. TYPOGRAPHY
 * ============================================================ */

/* Base font size */
html {
  font-size: 16px;
}

/* Body text */
body {
  font-size: 1rem;
  line-height: 1.6;
}

/* Heading hierarchy */
h1 { font-size: 1.8rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.1rem; }
h5, h6 { font-size: 1rem; }

/* Code blocks */
pre, code {
  font-size: 1.2rem;
}

pre {
  border-radius: 0.25rem;
  padding: 0.75em;
  font-size: 0.95em;
}

/* ============================================================
 * 3. COLOR VARIABLES
 * ============================================================ */

/* ------------------------------------------------------------
 * LIGHT MODE (Default)
 * ------------------------------------------------------------ */
:root,
[data-theme="light"] {
  /* Sphinx Design Colors */
  --sd-color-primary: #2962ff;
  --sd-color-secondary: #6c757d;
  --sd-color-info: #17a2b8;
  --sd-color-success: #28a745;
  --sd-color-warning: #ff9800;
  --sd-color-danger: #dc3545;
  
  /* Icon Colors */
  --icon-uml-color: #2962ff;
  
  /* Admonition: Pseudocode */
  --admonition-pseudocode-bg: #f4f7f9;
  --admonition-pseudocode-title-bg: #dbe4ee;
  --admonition-pseudocode-border: #3a6ea5;
  --admonition-pseudocode-icon: #3a6ea5;
  
  /* Admonition: Changelog */
  --admonition-changelog-bg: #f4f7ff;
  --admonition-changelog-title-bg: #dbe4ff;
  --admonition-changelog-border: #3a6ea5;
  --admonition-changelog-icon: #3055a6;
  
  /* Admonition: Resources */
  --admonition-resources-bg: #f6fff8;
  --admonition-resources-title-bg: #e2f7e4;
  --admonition-resources-border: #4caf50;
  --admonition-resources-icon: #2e7d32;
  
  /* Admonition: Todo */
  --admonition-mytodo-bg: #fffbea;
  --admonition-mytodo-title-bg: #fff3c4;
  --admonition-mytodo-border: #e6b800;
  --admonition-mytodo-icon: #c49a00;
  
  /* Tables: Deductions */
  --table-deductions-bg: #fff4f4;
  --table-deductions-border: #b32424;
  --table-deductions-header-bg: #ffe0e0;
  --table-deductions-text: #3a0000;
  
  /* Tables: Regular */
  --table-rubric-border: #000000;
  --table-rubric-header-bg: #000000;
  --table-rubric-header-text: #ffffff;
}

/* ------------------------------------------------------------
 * AUTO MODE (System Preference - Light by default)
 * ------------------------------------------------------------ */
[data-theme="auto"] {
  /* Sphinx Design Colors */
  --sd-color-primary: #2962ff;
  --sd-color-secondary: #6c757d;
  --sd-color-info: #17a2b8;
  --sd-color-success: #28a745;
  --sd-color-warning: #ff9800;
  --sd-color-danger: #dc3545;
  
  /* Icon Colors */
  --icon-uml-color: #2962ff;
  
  /* Admonition: Pseudocode */
  --admonition-pseudocode-bg: #f4f7f9;
  --admonition-pseudocode-title-bg: #dbe4ee;
  --admonition-pseudocode-border: #3a6ea5;
  --admonition-pseudocode-icon: #3a6ea5;
  
  /* Admonition: Changelog */
  --admonition-changelog-bg: #f4f7ff;
  --admonition-changelog-title-bg: #dbe4ff;
  --admonition-changelog-border: #3a6ea5;
  --admonition-changelog-icon: #3055a6;
  
  /* Admonition: Resources */
  --admonition-resources-bg: #f6fff8;
  --admonition-resources-title-bg: #e2f7e4;
  --admonition-resources-border: #4caf50;
  --admonition-resources-icon: #2e7d32;
  
  /* Admonition: Todo */
  --admonition-mytodo-bg: #fffbea;
  --admonition-mytodo-title-bg: #fff3c4;
  --admonition-mytodo-border: #e6b800;
  --admonition-mytodo-icon: #c49a00;
  
  /* Tables: Deductions */
  --table-deductions-bg: #fff4f4;
  --table-deductions-border: #b32424;
  --table-deductions-header-bg: #ffe0e0;
  --table-deductions-text: #3a0000;
  
  /* Tables: Regular */
  --table-rubric-border: #000000;
  --table-rubric-header-bg: #000000;
  --table-rubric-header-text: #ffffff;
}

/* ------------------------------------------------------------
 * DARK MODE
 * ------------------------------------------------------------ */
[data-theme="dark"] {
  /* Sphinx Design Colors */
  --sd-color-primary: #5b9aff;
  --sd-color-secondary: #9ca0a5;
  --sd-color-info: #4fc3f7;
  --sd-color-success: #66bb6a;
  --sd-color-warning: #ffa726;
  --sd-color-danger: #ff6b6b;
  
  /* Icon Colors */
  --icon-uml-color: #5b9aff;
  
  /* Admonition: Pseudocode */
  --admonition-pseudocode-bg: #2a323d;
  --admonition-pseudocode-title-bg: #384250;
  --admonition-pseudocode-border: #89a7ff;
  --admonition-pseudocode-icon: #89a7ff;
  
  /* Admonition: Changelog */
  --admonition-changelog-bg: #2a3240;
  --admonition-changelog-title-bg: #39455a;
  --admonition-changelog-border: #89a7ff;
  --admonition-changelog-icon: #a0bfff;
  
  /* Admonition: Resources */
  --admonition-resources-bg: #1e2a1f;
  --admonition-resources-title-bg: #2b3c2c;
  --admonition-resources-border: #7be47b;
  --admonition-resources-icon: #9cff9c;
  
  /* Admonition: Todo */
  --admonition-mytodo-bg: #3a3200;
  --admonition-mytodo-title-bg: #4d4200;
  --admonition-mytodo-border: #ffdf70;
  --admonition-mytodo-icon: #ffe48f;
  
  /* Tables: Deductions */
  --table-deductions-bg: #3a1e1e;
  --table-deductions-border: #ff8080;
  --table-deductions-header-bg: #502727;
  --table-deductions-text: #ffeaea;
  
  /* Tables: Regular */
  --table-rubric-border: #d0d0d0;
  --table-rubric-header-bg: #2a2a2a;
  --table-rubric-header-text: #ffffff;
}

/* ------------------------------------------------------------
 * AUTO MODE: Dark System Preference Override
 * ------------------------------------------------------------ */
@media (prefers-color-scheme: dark) {
  [data-theme="auto"] {
    /* Sphinx Design Colors */
    --sd-color-primary: #5b9aff;
    --sd-color-secondary: #9ca0a5;
    --sd-color-info: #4fc3f7;
    --sd-color-success: #66bb6a;
    --sd-color-warning: #ffa726;
    --sd-color-danger: #ff6b6b;
    
    /* Icon Colors */
    --icon-uml-color: #5b9aff;
    
    /* Admonition: Pseudocode */
    --admonition-pseudocode-bg: #2a323d;
    --admonition-pseudocode-title-bg: #384250;
    --admonition-pseudocode-border: #89a7ff;
    --admonition-pseudocode-icon: #89a7ff;
    
    /* Admonition: Changelog */
    --admonition-changelog-bg: #2a3240;
    --admonition-changelog-title-bg: #39455a;
    --admonition-changelog-border: #89a7ff;
    --admonition-changelog-icon: #a0bfff;
    
    /* Admonition: Resources */
    --admonition-resources-bg: #1e2a1f;
    --admonition-resources-title-bg: #2b3c2c;
    --admonition-resources-border: #7be47b;
    --admonition-resources-icon: #9cff9c;
    
    /* Admonition: Todo */
    --admonition-mytodo-bg: #3a3200;
    --admonition-mytodo-title-bg: #4d4200;
    --admonition-mytodo-border: #ffdf70;
    --admonition-mytodo-icon: #ffe48f;
    
    /* Tables: Deductions */
    --table-deductions-bg: #3a1e1e;
    --table-deductions-border: #ff8080;
    --table-deductions-header-bg: #502727;
    --table-deductions-text: #ffeaea;
    
    /* Tables: Regular */
    --table-rubric-border: #d0d0d0;
    --table-rubric-header-bg: #2a2a2a;
    --table-rubric-header-text: #ffffff;
  }
}

/* ============================================================
 * 4. SPHINX DESIGN OVERRIDES
 * ============================================================ */

/* Border colors */
.sd-border-primary { border-color: var(--sd-color-primary) !important; }
.sd-border-secondary { border-color: var(--sd-color-secondary) !important; }
.sd-border-info { border-color: var(--sd-color-info) !important; }
.sd-border-success { border-color: var(--sd-color-success) !important; }
.sd-border-warning { border-color: var(--sd-color-warning) !important; }
.sd-border-danger { border-color: var(--sd-color-danger) !important; }

/* Card title colors match borders */
.sd-card.sd-border-primary .sd-card-title {
  color: var(--sd-color-primary);
}

.sd-card.sd-border-info .sd-card-title {
  color: var(--sd-color-info);
}

.sd-card.sd-border-success .sd-card-title {
  color: var(--sd-color-success);
}

.sd-card.sd-border-warning .sd-card-title {
  color: var(--sd-color-warning);
}

.sd-card.sd-border-danger .sd-card-title {
  color: var(--sd-color-danger);
}

/* UML icon styling */
.sd-card.icon-uml .sd-card-title::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f542"; /* fa-diagram-project */
  margin-right: 0.5em;
  color: var(--icon-uml-color);
}

.sd-card.icon-uml .sd-card-title {
  color: var(--icon-uml-color);
}

/* ============================================================
 * 5. CUSTOM ADMONITIONS
 * ============================================================ */

/* ------------------------------------------------------------
 * Admonition: Pseudocode
 * Usage: .. admonition:: Pseudocode
 *           :class: pseudocode
 * ------------------------------------------------------------ */
.admonition.pseudocode {
  background-color: var(--admonition-pseudocode-bg);
  border-left: 0.25rem solid var(--admonition-pseudocode-border);
  border-radius: 0.25rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.admonition.pseudocode > .admonition-title {
  background-color: var(--admonition-pseudocode-title-bg);
  font-weight: 600;
}

.admonition.pseudocode > .admonition-title::before {
  mask: none !important;
  -webkit-mask: none !important;
  background: none !important;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f121"; /* fa-code */
  color: var(--admonition-pseudocode-icon);
  display: inline-block;
  width: 1rem;
  line-height: 1.1rem;
  text-align: center;
  margin-right: 0.7rem;
  margin-left: -2.0rem;
  position: relative;
  top: 0.15rem;
}

.admonition.pseudocode p {
  margin-bottom: 0.4em;
}

/* ------------------------------------------------------------
 * Admonition: Changelog
 * Usage: .. admonition:: Changelog
 *           :class: changelog
 * ------------------------------------------------------------ */
.admonition.changelog {
  background-color: var(--admonition-changelog-bg);
  border-left: 0.3rem solid var(--admonition-changelog-border);
  border-radius: 0.35rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.admonition.changelog > .admonition-title {
  background-color: var(--admonition-changelog-title-bg);
  font-weight: 600;
  font-size: 1.05em;
  border-bottom: 1px solid var(--admonition-changelog-border);
}

.admonition.changelog > .admonition-title::before {
  mask: none !important;
  -webkit-mask: none !important;
  background: none !important;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f1da"; /* fa-rotate */
  color: var(--admonition-changelog-icon);
  display: inline-block;
  width: 1rem;
  text-align: center;
  margin-right: 0.7rem;
  margin-left: -1.8rem;
  position: relative;
  top: 0.1rem;
}

/* ------------------------------------------------------------
 * Admonition: Resources
 * Usage: .. admonition:: Resources
 *           :class: resources
 * ------------------------------------------------------------ */
.admonition.resources {
  background-color: var(--admonition-resources-bg);
  border-left: 0.3rem solid var(--admonition-resources-border);
  border-radius: 0.35rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.admonition.resources > .admonition-title {
  background-color: var(--admonition-resources-title-bg);
  font-weight: 600;
  font-size: 1.05em;
  border-bottom: 1px solid var(--admonition-resources-border);
}

.admonition.resources > .admonition-title::before {
  mask: none !important;
  -webkit-mask: none !important;
  background: none !important;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f0c1"; /* fa-link */
  color: var(--admonition-resources-icon);
  display: inline-block;
  width: 1rem;
  text-align: center;
  margin-right: 0.7rem;
  margin-left: -1.8rem;
  position: relative;
  top: 0.1rem;
}

/* ------------------------------------------------------------
 * Admonition: Todo
 * Usage: .. admonition:: Todo
 *           :class: mytodo
 * ------------------------------------------------------------ */
.admonition.mytodo {
  background-color: var(--admonition-mytodo-bg);
  border-left: 0.3rem solid var(--admonition-mytodo-border);
  border-radius: 0.35rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.admonition.mytodo > .admonition-title {
  background-color: var(--admonition-mytodo-title-bg);
  font-weight: 600;
  font-size: 1.05em;
  border-bottom: 1px solid var(--admonition-mytodo-border);
}

.admonition.mytodo > .admonition-title::before {
  mask: none !important;
  -webkit-mask: none !important;
  background: none !important;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f46c"; /* fa-list-check */
  color: var(--admonition-mytodo-icon);
  display: inline-block;
  width: 1rem;
  text-align: center;
  margin-right: 0.7rem;
  margin-left: -1.8rem;
  position: relative;
  top: 0.1rem;
}

/* ------------------------------------------------------------
 * Admonition: Left Line (Minimal)
 * Usage: .. admonition:: Title
 *           :class: leftline
 * ------------------------------------------------------------ */
.admonition.leftline {
  border: none;
  border-left: 3px solid var(--color-foreground-border);
  background: none;
  box-shadow: none;
  padding: 0.4em 1em;
  margin: 1em 0;
}

.admonition.leftline > .admonition-title {
  padding-left: 0 !important;
  background: none;
  border: none;
  font-weight: 600;
  margin-bottom: 0.3em;
}

.admonition.leftline > .admonition-title::before {
  content: none !important;
  display: none !important;
}

/* ------------------------------------------------------------
 * Admonition: Todo (Furo style override)
 * ------------------------------------------------------------ */
.admonition-todo {
  border-left: 3px solid var(--color-brand-primary);
  background: none;
}

/* ============================================================
 * 6. TABLES
 * ============================================================ */

/* ------------------------------------------------------------
 * Deductions Table (Themed)
 * Usage: .. list-table::
 *           :class: deductions-table
 * ------------------------------------------------------------ */
table.deductions-table {
  border: 2px solid var(--table-deductions-border);
  border-collapse: collapse;
  background-color: var(--table-deductions-bg);
  color: var(--table-deductions-text);
  width: 100%;
  border-radius: 0.25rem;
}

table.deductions-table th,
table.deductions-table td {
  border: 1px solid var(--table-deductions-border);
  padding: 0.5rem 0.75rem;
}

table.deductions-table th {
  background-color: var(--table-deductions-header-bg);
  font-weight: 600;
  text-align: left;
}

table.deductions-table tr:hover td {
  background-color: rgba(255, 0, 0, 0.05);
}

/* ------------------------------------------------------------
 * Regular Tables (Docutils)
 * ------------------------------------------------------------ */
table.docutils:not(.deductions-table) {
  border: 1.5px solid var(--table-rubric-border);
  border-collapse: collapse;
  width: 100%;
}

table.docutils:not(.deductions-table) th,
table.docutils:not(.deductions-table) td {
  border: 1px solid var(--table-rubric-border);
  padding: 0.5rem 0.75rem;
}

table.docutils:not(.deductions-table) th {
  background-color: var(--table-rubric-header-bg);
  color: var(--table-rubric-header-text);
  font-weight: 600;
  text-align: left;
}

table.docutils:not(.deductions-table) tr:hover td {
  background-color: rgba(0, 0, 0, 0.03);
}

/* ------------------------------------------------------------
 * Compact Table Variant
 * Usage: .. list-table::
 *           :class: compact-table
 * ------------------------------------------------------------ */
table.docutils.compact-table {
  border-collapse: collapse;
  font-size: 0.95em;
}

table.docutils.compact-table th,
table.docutils.compact-table td {
  padding-top: 0.15rem !important;
  padding-bottom: 0.15rem !important;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 1.15;
}

table.docutils.compact-table td > p,
table.docutils.compact-table th > p {
  margin: 0 !important;
}

/* ============================================================
 * 7. UTILITY CLASSES
 * ============================================================ */

/* Copy image button */
.copy-image-btn {
  background-color: var(--color-foreground-secondary, #444);
  color: white;
  border: none;
  border-radius: 4px;
  padding: 2px 8px;
  font-size: 0.8rem;
  cursor: pointer;
  margin-bottom: 4px;
  opacity: 0.7;
  transition: opacity 0.2s;
}

.copy-image-btn:hover {
  opacity: 1.0;
}

/* ============================================================
 * UML DIAGRAM ICONS - UNICODE DIAMONDS
 * ============================================================ */

/* Aggregation - Hollow Diamond */
.sd-card.icon-aggregation .sd-card-title::before {
  content: "◇ ";  /* U+25C7 White Diamond */
  margin-right: 0.3em;
  color: var(--sd-color-info);
  font-size: 1.3em;
  line-height: 1;
  vertical-align: middle;
}

/* Composition - Filled Diamond */
.sd-card.icon-composition .sd-card-title::before {
  content: "◆ ";  /* U+25C6 Black Diamond */
  margin-right: 0.3em;
  color: var(--sd-color-warning);
  font-size: 1.3em;
  line-height: 1;
  vertical-align: middle;
}

/* Dark theme */
[data-theme="dark"] .sd-card.icon-aggregation .sd-card-title::before {
  color: var(--sd-color-info);
}

[data-theme="dark"] .sd-card.icon-composition .sd-card-title::before {
  color: var(--sd-color-warning);
}



.code-frame-info {
  border-left: 3px solid var(--sd-color-info) !important;
}

/* ============================================================
 * DROPDOWN BORDER COLORS (ALWAYS VISIBLE)
 * ============================================================ */

/* Apply border to the dropdown container itself */
.sd-summary-title.sd-border-primary,
details.sd-dropdown.sd-border-primary,
details.sd-dropdown.sd-border-primary > summary {
  border-left: 3px solid var(--sd-color-primary) !important;
}

.sd-summary-title.sd-border-secondary,
details.sd-dropdown.sd-border-secondary,
details.sd-dropdown.sd-border-secondary > summary {
  border-left: 3px solid var(--sd-color-secondary) !important;
}

.sd-summary-title.sd-border-info,
details.sd-dropdown.sd-border-info,
details.sd-dropdown.sd-border-info > summary {
  border-left: 3px solid var(--sd-color-info) !important;
}

.sd-summary-title.sd-border-success,
details.sd-dropdown.sd-border-success,
details.sd-dropdown.sd-border-success > summary {
  border-left: 3px solid var(--sd-color-success) !important;
}

.sd-summary-title.sd-border-warning,
details.sd-dropdown.sd-border-warning,
details.sd-dropdown.sd-border-warning > summary {
  border-left: 3px solid var(--sd-color-warning) !important;
}

.sd-summary-title.sd-border-danger,
details.sd-dropdown.sd-border-danger,
details.sd-dropdown.sd-border-danger > summary {
  border-left: 3px solid var(--sd-color-danger) !important;
}

/* Optional: Add full border instead of just left border */
details.sd-dropdown.sd-border-full-primary {
  border: 2px solid var(--sd-color-primary) !important;
  border-radius: 0.25rem;
}

details.sd-dropdown.sd-border-full-success {
  border: 2px solid var(--sd-color-success) !important;
  border-radius: 0.25rem;
}

details.sd-dropdown.sd-border-full-danger {
  border: 2px solid var(--sd-color-danger) !important;
  border-radius: 0.25rem;
}

details.sd-dropdown.sd-border-full-warning {
  border: 2px solid var(--sd-color-warning) !important;
  border-radius: 0.25rem;
}

details.sd-dropdown.sd-border-full-info {
  border: 2px solid var(--sd-color-info) !important;
  border-radius: 0.25rem;
}
/* ============================================================
 * END OF CUSTOM STYLES
 * ============================================================ */