/*For dev to avoid non standard fonts of pydata*/
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

:root {
  /* Use softer blue from bootstrap's default info color */
  --pst-color-info: 23, 162, 184;
}

table {
  width: auto; /* Override fit-content which breaks Styler user guide ipynb */
}

/* Main index page overview cards */

.intro-card {
  padding: 30px 10px 20px 10px;
}

.intro-card .sd-card-img-top {
  margin: 10px;
  height: 52px;
  background: none !important;
}

.intro-card .sd-card-title {
  color: var(--pst-color-primary);
  font-size: var(--pst-font-size-h5);
  padding: 1rem 0rem 0.5rem 0rem;
}

.intro-card .sd-card-footer {
  border: none !important;
}

.intro-card .sd-card-footer p.sd-card-text {
  max-width: 220px;
  margin-left: auto;
  margin-right: auto;
}

/* Replace the purple default (secondary color) for the buttons in the cards */
/*.intro-card .sd-btn-secondary {*/
/*  background-color: #6c757d !important;*/
/*  border-color: #6c757d !important;*/
/*}*/

.intro-card .sd-btn-secondary:hover {
  background-color: #5a6268 !important;
  border-color: #545b62 !important;
}

.card, .card img {
  background-color: var(--pst-color-background);
}

.fa-square-x-twitter::before {
  content: "\u1D54F";
}

/* ================================================================
   Carousel
   ================================================================ */

/* Caption text — inherit from theme */
.carousel h5,
.carousel p {
    color: inherit;
}

.carousel h5 {
    font-weight: bold;
}

/* Spacing */
.rst-content section > .carousel {
    margin-bottom: 24px;
}

/* Controls anchored to the top of the slide */
.scc-top-control {
    align-items: flex-start;
    top: 0.5rem;
    bottom: auto;
}

/* Indicators at the top */
.scc-top-indicator {
    bottom: unset;
    top: 0.5rem;
}

/* Caption rendered below the image as a normal flow block */
.scc-below-control {
    position: relative;
    left: 0;
    top: 0;
    text-align: left;
    padding: 0.75rem 0;
    font-family: var(--bs-font-sans-serif);
    color: var(--pst-color-text-base);
    background: transparent !important;  /* Override bg-dark from carousel HTML */
}

/* ----------------------------------------------------------------
   Carousel nav shadows
   Glow uses the OPPOSITE of the control colour so arrows/dots
   remain visible on any image.
   light theme: controls are dark → glow is light (--bs-light)
   dark theme:  controls are light → glow is dark (--bs-dark)
   ---------------------------------------------------------------- */

/* Light theme — light glow behind dark controls */
html[data-theme="light"] .scc-shadow-control,
:not([data-theme="dark"]) .scc-shadow-control {
    filter:
        drop-shadow(0 0 0.4rem var(--bs-light))
        drop-shadow(0 0 0.4rem var(--bs-light));
}

html[data-theme="light"] .scc-shadow-indicator,
:not([data-theme="dark"]) .scc-shadow-indicator {
    filter:
        drop-shadow(-0.6rem 0 0.4rem var(--bs-light))
        drop-shadow( 0.6rem 0 0.4rem var(--bs-light));
}

/* Dark theme — dark glow behind light controls */
html[data-theme="dark"] .scc-shadow-control {
    filter:
        drop-shadow(0 0 0.4rem var(--bs-dark))
        drop-shadow(0 0 0.4rem var(--bs-dark));
}

html[data-theme="dark"] .scc-shadow-indicator {
    filter:
        drop-shadow(-0.6rem 0 0.4rem var(--bs-dark))
        drop-shadow( 0.6rem 0 0.4rem var(--bs-dark));
}