/* splineops/docs/_static/css/custom.css */

/* Existing custom styles */
.sphinx-codeautolink-a {
  border-bottom-color: rgb(0, 0, 0);
  border-bottom-style: dotted;
  border-bottom-width: 1px;
}
.sphinx-codeautolink-a:hover {
  color: rgb(139, 179, 255);  /* Lighter blue for hover effect */
}

.supportbutton a {
  color: var(--pst-color-link);
}

.navbar-brand {
  display: inline-block !important;
}

/* -------------------- THEME OVERRIDES -------------------- */

html[data-theme="light"] {
  --pst-color-primary:  rgb(56, 99, 235); /* Cool blue */
  --pst-color-secondary: rgb(71, 188, 245); /* Lighter blue */
  --pst-color-plot-background: rgb(255, 255, 255);
}

html[data-theme="dark"] {
  --pst-color-primary: rgb(56, 99, 235); /* Cool blue */
  --pst-color-secondary: rgb(71, 188, 245); /* Lighter blue */
  --pst-color-plot-background: rgb(220, 221, 225); /* Lighter grey */
}

.bd-content {
  flex-grow: 1;
  max-width: 100%;  /* Override 60em default */
}

/* Override for example gallery - remove border around card */
.bd-content div.sd-card.example-gallery {
  border: none;
}

/* Background image
.bd-container {
  background-image: url("../background.svg");
}*/

/* Titles */
h1 {
  background: linear-gradient(to right, var(--pst-color-primary), rgb(71, 188, 245));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: bold;
}
h2 {
  background: linear-gradient(to right, var(--pst-color-primary), rgb(71, 188, 245));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
h2 code {
  -webkit-background-clip: initial;
  -webkit-text-fill-color: initial;
  color: var(--pst-color-primary);
}

.navbar-icon-links img.icon-link-image {
  border-radius: 0rem;
  height: 2em;
}

/* -------------------- HOMEPAGE -------------------- */

/* Hero */
#hero {
  display: flex;
  flex-direction: row;
}
#hero-left {
  max-width: 476px;
  width: 40%;
  margin: auto 10px;
  display: inline-block;
  vertical-align: middle;
  text-align: justify;
}
#hero-right {
  min-width: 476px;
  width: 60%;
  margin: auto 10px;
  display: inline-block;
  vertical-align: middle;
  text-align: justify;
}

.homepage-button-container {
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
}
.homepage-button-container-row {
  display: flex;
  flex-wrap: wrap;
}

.homepage-button-container a {
  transition: 0.1s;
}
.homepage-button {
  min-width: 142px;
  padding: 0.5em 2em;
  border: 1px solid var(--pst-color-primary);
  border-radius: 4px;
  margin: 1em 0.5em 0.5em 0;
}
.primary-button {
  background-color: var(--pst-color-primary);
  color: var(--pst-color-background);
}
.secondary-button {
  background-color: var(--pst-color-background);
  color: var(--pst-color-primary);
}
.homepage-button:hover {
  text-decoration: none;
  background-color: var(--pst-color-secondary);
  color: var(--pst-color-background);
  border: 1px solid var(--pst-color-secondary);
}
.homepage-button-link {
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
  #hero {
    display: block;
  }
  #hero-left,
  #hero-right {
    width: 100%;
    min-width: 0px;
  }
}

/* -------------------- EXAMPLE PLOTS - DOWNLOAD PYTHON SOURCE CODE -------------------- */

.example-plot-download {
  border: 0.05rem solid rgb(222, 222, 222);
  border-radius: 0.2rem;
  /* Center button */
  width: fit-content;
  margin: 0 auto;
  box-shadow: 0 0.2rem 0.5rem rgb(0 0 0 / 5%), 0 0 0.0625rem rgb(0 0 0 / 10%);
}
.example-plot-download p a {
  padding: 0.4rem 2rem;
}
.example-plot-download p { /* Override margin defaults for p */
  margin: 0;
}
.example-plot-download code.literal { /* Override defaults for code.literal */
  border: 0px;
  background-color: transparent;
}
.example-plot-download a.download:hover { /* Override defaults for hover */
  color: var(--pst-color-primary);
}

/* -------------------- TOCTREE OVERRIDES -------------------- */

.toctree-wrapper a {
  color: var(--pst-color-text-muted);
}

.toctree-wrapper a:hover {
  text-decoration: none;  /* No underline */
  color: var(--pst-color-primary);
}

/* -------------------- JUSTIFY TEXT -------------------- */

p {
  text-align: justify;
}