/* styles.css */

.reveal table {
  border-collapse: collapse;
  border: 1px solid black; /* adds border around entire table */
}

.reveal th,
.reveal td {
  border: 1px solid black;
  padding: 6px;
  text-align: center;
}

.reveal thead tr th {
  border-bottom: 2px solid black; /* stronger bottom border on header */
}

.reveal tbody tr:last-child td {
  border-bottom: 1px solid black; /* ensure bottom border on last row */
}s

/* 1. Container for each code block: This wrapper will hold the <pre>, button, and feedback.
      It's crucial for positioning the button/feedback relative to the code block. */
.code-block-container {
  position: relative; /* Establishes a positioning context for absolute children */
  margin-bottom: 1em; /* Space between code blocks */
  background-color: #f8f8f8; /* Light background for the code block area */
  border: 1px solid #ddd; /* Subtle border */
  border-radius: 5px; /* Rounded corners */
  overflow: hidden; /* Ensures content doesn't spill out, good for rounded corners */
}


/* 3. Style for the feedback message (e.g., "Copied!") */
.feedback-message {
  position: absolute; /* Positioned relative to .code-block-container */
  top: 0.5em;    /* Align with button */
  right: 5.5em;  /* Position to the left of the button (adjust as needed) */
  background-color: rgba(0, 0, 0, 0.7); /* Semi-transparent black background */
  color: white;
  padding: 0.3em 0.6em;
  border-radius: 4px;
  font-size: 0.8em;
  opacity: 0;   /* Initially hidden */
  transition: opacity 0.4s ease-in-out; /* Smooth fade in/out */
  pointer-events: none; /* Allows clicks to pass through to elements behind it */
  z-index: 9;         /* Below the button */
  white-space: nowrap; /* Prevent feedback message from wrapping */
}

/* 4. Style for the <pre> (preformatted text) element itself */
/* Targeting pre inside .sourceCode, which Quarto often wraps code blocks in */
.sourceCode pre {
  white-space: pre-wrap !important; /* CRITICAL: Auto text wrap */
  word-wrap: break-word !important; /* Breaks long words if necessary */
  overflow-x: auto; /* Adds horizontal scrollbar if content cannot wrap */
  padding: 1.5em; /* General padding for content */
  padding-top: 2.5em; /* Extra padding at the top to make space for button/feedback */
  box-sizing: border-box; /* Include padding in the element's total width/height */
  margin: 0; /* Remove default margin from <pre> */
  height: auto !important; /* Ensure height adjusts to content */
  min-height: 0 !important; /* Ensure no minimum height is forcing it */
}

/* Ensure the code content itself also wraps */
.sourceCode code {
    white-space: pre-wrap !important;
    word-wrap: break-word !important;
    display: block; /* Treat <code> as a block to help with wrapping */
}


.reveal .slides section.scrollable {
  touch-action: pan-y pan-x !important;
  overscroll-behavior: contain; /* optional, to avoid page scroll conflicts */
}


/* Menu */

/* Change menu background color */
.reveal .slide-menu {
  background-color: #222;  /* Dark background */
  color: #fff;             /* Default text color */
}

/* Change menu item hover color */
.reveal .slide-menu li a:hover {
  background-color: #444;  /* Hover background */
  color: #ffd700;          /* Hover text color */
}

/* Active (current) menu item */
.reveal .slide-menu li.active a {
  background-color: #666;
  color: #ffffff;
}

/* 1. General span color */
span {
  color: #ff;
}

/* 1.a Override for inline math equations */
span.math.inline {
  color: #0000cc;  !important;  /* distinct math color */
  background: none;  /* reset background if needed */
}

/* 2. Full background color for menu panel */
.slide-menu-wrapper .slide-menu {
  background-image: linear-gradient(#004080, #0080ff); !important;  !important;  /* full menu background */
  color: red; !important;             /* menu text color */
}

/* Optional: Style menu links and hover */
.slide-menu-wrapper .slide-menu a {
  color: #ddd !important;
  text-decoration: none;
}
.slide-menu-wrapper .slide-menu a:hover {
  background-color: #444 !important;
  color: #ffd700 !important;
}

.footer-default {
  background-color: transparent;
  color: white; /* This will style the paragraph text */
  padding: 10px 0;
}

.footer-default p {
  color: black; /* This will style the link text */
  text-decoration: none;
}

.footer.footer-default a {
  color: black;
  text-decoration: underline;
}