/* AWS Workshop Studio Theme */

:root {
  /* AWS Brand Colors */
  --aws-orange: #FF9900;
  --aws-dark-orange: #EC7211;
  --aws-squid-ink: #232F3E;
  --aws-light-gray: #FAFAFA;
  --aws-border-gray: #E5E5E5;
  --aws-text-gray: #545B64;
  
  /* Override Material theme colors */
  --md-primary-fg-color: #232F3E;
  --md-primary-fg-color--light: #37475A;
  --md-primary-fg-color--dark: #16191F;
  --md-accent-fg-color: #2563EB;
  --md-accent-fg-color--transparent: rgba(37, 99, 235, 0.1);
}

/* Header styling to match AWS Workshop Studio */
.md-header {
  background-color: var(--aws-squid-ink);
  box-shadow: 0 0 0.2rem rgba(0,0,0,.1), 0 0.2rem 0.4rem rgba(0,0,0,.2);
}

.md-header__title {
  font-weight: 500;
  color: white;
}

/* Navigation tabs */
.md-tabs {
  background-color: var(--aws-squid-ink);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.md-tabs__link {
  color: rgba(255, 255, 255, 0.7);
  font-weight: 400;
}

.md-tabs__link--active,
.md-tabs__link:hover {
  color: var(--aws-orange);
}

/* Sidebar navigation */
/* .md-sidebar {
  background-color: var(--aws-light-gray);
} */

/* Hide the logo area in sidebar completely */
.md-sidebar--primary .md-nav__title {
  display: none !important;
}

.md-nav__title {
  background-color: var(--aws-squid-ink);
  color: white;
  font-weight: 500;
}

/* All navigation items - consistent font weight */
.md-nav__link {
  font-weight: 500 !important;
}

/* Section headers */
.md-nav__item--section > .md-nav__link {
  font-weight: 500 !important;
}

/* FIXED INDENTATION - NO DYNAMIC CHANGES ALLOWED */

/* Top level navigation items - all at same level */
.md-nav--primary > .md-nav__list > .md-nav__item > .md-nav__link {
  padding-left: 0.6rem !important;
  padding-right: 0.6rem !important;
}

/* Child items under sections (Overview, Workshop Materials, etc.) */
.md-nav--primary .md-nav__item--section > .md-nav > .md-nav__list > .md-nav__item > .md-nav__link {
  padding-left: 1.8rem !important;
  padding-right: 0.6rem !important;
}

/* Section headers themselves should NOT be indented extra */
.md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav__link {
  padding-left: 0.6rem !important;
  padding-right: 0.6rem !important;
}

/* Override Material's nested list indentation */
.md-nav__list .md-nav__list {
  padding-left: 0 !important;
}

/* Remove ALL margins from navigation items */
.md-nav__item,
.md-nav__item--section,
.md-nav__item--active,
.md-nav__item--nested,
.md-nav__list .md-nav__item {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Force nested navigation to not indent */
.md-nav--primary .md-nav__item--nested > .md-nav,
.md-nav--primary .md-nav__item--active > .md-nav {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* Active navigation items - color only, no weight change */
.md-nav__item--active > .md-nav__link {
  color: var(--aws-orange) !important;
  font-weight: 500 !important;
}

/* Active section headers (when viewing section index) */
.md-nav__item--section.md-nav__item--active > .md-nav__link {
  color: var(--aws-orange) !important;
  font-weight: 500 !important;
}

/* Parent section when child is active */
.md-nav__item--nested > .md-nav__link {
  font-weight: 500 !important;
}

.md-nav__item--nested.md-nav__item--active > .md-nav__link {
  color: var(--aws-orange) !important;
  font-weight: 500 !important;
}

/* Current page in navigation */
.md-nav__link--active {
  color: var(--aws-orange) !important;
  font-weight: 500 !important;
}

.md-nav__link:hover {
  color: var(--aws-orange);
}

/* Content area */
.md-content {
  background-color: white;
}

.md-typeset h1 {
  color: var(--aws-squid-ink);
  font-weight: 500;
  border-bottom: 2px solid var(--aws-orange);
  padding-bottom: 0.5rem;
  margin-bottom: 1.5rem;
}

.md-typeset h2 {
  color: var(--aws-squid-ink);
  font-weight: 500;
  margin-top: 2rem;
  border-left: 4px solid var(--aws-orange);
  padding-left: 1rem;
}

.md-typeset h3 {
  color: var(--aws-text-gray);
  font-weight: 500;
}

/* Code blocks - AWS Workshop style */
.md-typeset code {
  background-color: #F4F4F4;
  color: #000000;
  padding: 0.1em 0.4em;
  border-radius: 3px;
  font-size: 0.9em;
  font-family: 'Courier New', monospace;
  font-weight: 600;
}

.md-typeset pre {
  background-color: #F8F8F8;
  border-radius: 4px;
  border: 1px solid #E5E5E5;
  padding: 1rem;
}

.md-typeset pre code {
  background-color: transparent;
  color: #000000;
  font-family: 'Courier New', monospace;
  font-weight: 600;
  font-size: 0.95em;
  line-height: 1.6;
}

/* Alert/Admonition boxes - AWS Workshop style */
.md-typeset .admonition {
  border-left: 4px solid var(--aws-orange);
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  margin: 1.5em 0;
  font-size: 0.8rem;
}

.md-typeset .admonition-title {
  background-color: rgba(255, 153, 0, 0.1);
  font-weight: 500;
  padding: 0.8rem 1.2rem;
  border-bottom: 1px solid var(--aws-border-gray);
}

.md-typeset .admonition.note {
  border-left-color: #0972D3;
}

.md-typeset .admonition.note .admonition-title {
  background-color: rgba(9, 114, 211, 0.1);
}

.md-typeset .admonition.warning {
  border-left-color: #FF9900;
}

.md-typeset .admonition.tip {
  border-left-color: #1D8102;
}

.md-typeset .admonition.tip .admonition-title {
  background-color: rgba(29, 129, 2, 0.1);
}

/* Images - AWS Workshop style */
.md-typeset img {
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  margin: 1.5em 0;
  max-width: 100%;
  border: 1px solid var(--aws-border-gray);
}

/* Links */
.md-typeset a {
  color: #0972D3;
  text-decoration: none;
}

.md-typeset a:hover {
  color: var(--aws-dark-orange);
  text-decoration: underline;
}

/* Buttons */
.md-button {
  background-color: var(--aws-orange);
  color: white;
  border-radius: 4px;
  padding: 0.5rem 1.5rem;
  font-weight: 500;
  transition: background-color 0.2s;
}

.md-button:hover {
  background-color: var(--aws-dark-orange);
}

.md-button--primary {
  background-color: var(--aws-squid-ink);
}

.md-button--primary:hover {
  background-color: var(--aws-primary-fg-color--light);
}

/* Tables */
.md-typeset table:not([class]) {
  border: 1px solid var(--aws-border-gray);
  border-radius: 4px;
  overflow: hidden;
}

.md-typeset table:not([class]) th {
  background-color: var(--aws-squid-ink);
  color: white;
  font-weight: 500;
  padding: 0.8rem;
}

.md-typeset table:not([class]) td {
  padding: 0.8rem;
  border-top: 1px solid var(--aws-border-gray);
}

.md-typeset table:not([class]) tr:hover {
  background-color: rgba(255, 153, 0, 0.05);
}

/* Search */
.md-search__input {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
}

.md-search__input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

/* Footer */
.md-footer {
  background-color: var(--aws-squid-ink);
}

.md-footer-meta {
  background-color: #16191F;
  padding: 0.5rem 0;
}

.md-footer-meta__inner {
  padding: 0.5rem 0;
}

/* Breadcrumbs */
.md-path {
  color: rgba(255, 255, 255, 0.7);
}

/* Step numbers in content - removed icon */

/* Copy code button styling - make it more obvious */
.md-code__button {
  color: #2563EB !important;
  opacity: 1;
  transition: opacity 0.2s, transform 0.2s;
}

.md-code__button:hover {
  color: #1D4ED8 !important;
  opacity: 1;
  transform: scale(1.1);
}

/* Make copy button more visible on code blocks */
pre .md-code__button {
  background-color: transparent;
  border-radius: 4px;
  padding: 0.3rem;
  box-shadow: none;
}

/* Scrollbar styling */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--aws-light-gray);
}

::-webkit-scrollbar-thumb {
  background: var(--aws-text-gray);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--aws-squid-ink);
}

/* Workshop-specific alert styling */
.md-typeset .admonition.alert {
  border-left-color: #FF9900;
  background-color: rgba(255, 153, 0, 0.05);
}

.md-typeset .admonition.alert .admonition-title {
  background-color: rgba(255, 153, 0, 0.15);
  color: var(--aws-squid-ink);
}

/* Module cards */
.md-typeset .grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1rem;
  margin: 2rem 0;
}

.md-typeset .card {
  border: 1px solid var(--aws-border-gray);
  border-radius: 4px;
  padding: 1.5rem;
  transition: box-shadow 0.2s, transform 0.2s;
}

.md-typeset .card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transform: translateY(-2px);
  border-color: var(--aws-orange);
}

/* Responsive adjustments */
@media screen and (max-width: 76.1875em) {
  .md-nav--primary .md-nav__title {
    display: none !important;
  }
}


/* Hide permalink anchors on headings */
.md-typeset .headerlink,
.md-typeset a.headerlink {
  display: none !important;
  visibility: hidden !important;
}

/* Keep header title fixed - don't change on scroll */
.md-header__topic:first-child {
  display: block !important;
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.md-header__topic:last-child {
  display: none !important;
}

/* Hide page table of contents (h2, h3 headings) from sidebar navigation */
/* Keep section pages but hide the heading-based navigation within pages */
.md-nav--primary .md-nav__item--active > .md-nav .md-nav__item .md-nav__item {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Alternative: hide all nested navigation beyond 2 levels */
.md-nav__list .md-nav__list .md-nav__list {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Collapse the container that holds hidden items */
.md-nav__item--active > .md-nav > .md-nav__list {
  margin: 0 !important;
  padding: 0 !important;
}

/* Remove extra spacing when sections are expanded */
.md-nav__item--nested > .md-nav {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.md-nav__item--section {
  margin-bottom: 0 !important;
}