/* src/sitestyle/src/_vars.css */
:root {
  --body-fg-color: black;
  --body-bg-color: white;
  --code-bg-color: #e2e2e2;
  --success-border-color: #0a5a0a;
  --success-bg-color: #d4f7d4;
  --danger-bg-color: #f7dcdc;
  --danger-border-color: #7f0505;
  --info-bg-color: #eafcfb;
  --body-fg-color-deemphasize-text: lightslategray;
  --body-fg-color-deemphasize-nontext: lightgray;
  --font-sans: "Adobe Source Sans Pro", sans-serif;
  --font-serif: "Adobe Source Serif Pro", serif;
  --font-mono: "Adobe Source Code Pro", monospace;
}

/* src/sitestyle/src/_elements.css */
html {
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-serif);
  color: var(--body-fg-color);
  background-color: var(--body-bg-color);
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 1.5em;
  margin-bottom: .5em;
  font-variant-caps: small-caps;
}

main {
  flex-grow: 1;
  padding: 1em 2em 4em;
}

summary {
  cursor: pointer;
}

details {
  border: 1px dotted var(--body-fg-color);
  border-radius: 5px;
  padding: .5em;
}

button, a.button {
  font-family: var(--font-serif);
  border: 1px dotted var(--body-fg-color);
  color: var(--body-fg-color);
  background: var(--body-bg-color);
  cursor: pointer;
  border-radius: 5px;
  margin: 1em 0;
  padding: .5em;
  font-variant-caps: all-small-caps;
  font-weight: bold;
}

a.button {
  display: inline-block;
  text-decoration: none;
  text-align: center;
  margin: 0;
  padding: 0;
}

button[disabled], a.button.disabled-button {
  color: var(--body-fg-color-deemphasize-text);
  border-color: var(--body-fg-color-deemphasize-text);
  cursor: not-allowed;
}

p button {
  margin: 0;
}

pre, code {
  font-family: var(--font-mono);
  background-color: var(--code-bg-color);
  border-radius: 5px;
  font-size: 12px;
}

pre {
  overflow-x: auto;
  padding: .5em;
}

code {
  padding: 0 .5em;
}

footer {
  color: var(--body-fg-color-deemphasize-text);
  border-top: 2px double var(--body-fg-color-deemphasize-nontext);
  margin: 2em;
  font-size: .8em;
}

a, a:visited {
  color: inherit;
}

/* src/sitestyle/src/adminPages.css */
.admin-container {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

.admin-login-container {
  text-align: center;
  max-width: 400px;
  margin: 0 auto;
}

.admin-header {
  border-bottom: 2px solid var(--body-fg-color-deemphasize-nontext);
  margin-bottom: 2em;
  padding-bottom: 1em;
}

.admin-email {
  color: var(--body-fg-color-deemphasize-text);
}

/* src/sitestyle/src/asideError.css */
aside.error-message {
  background-color: var(--danger-bg-color);
  margin: 1em;
  padding: .25em 1em;
}

aside.error-message h3 {
  margin-top: .5em;
}

/* src/sitestyle/src/dashboardDownload.css */
button.download-button {
  width: 20em;
  height: 3em;
  margin-left: 2em;
  font-size: 18px;
}

.download-statements-table {
  border-collapse: collapse;
  width: 100%;
}

.download-statements-table td {
  border-bottom: 1px solid var(--body-fg-color-deemphasize-nontext);
  padding: .5em 1em;
}

.download-statements-table th {
  border-bottom: 1px solid var(--body-fg-color-deemphasize-nontext);
  padding: .5em 1em;
}

.download-statements-table th {
  text-align: left;
}

.download-statements-table .col-account-name {
  width: auto;
  font-weight: bold;
}

.download-statements-table .col-account-year {
  width: 15em;
}

/* src/sitestyle/src/dashboardManagement.css */
button.unlink-item {
  background-color: var(--danger-bg-color);
}

#stripe-checkout-result {
  background-color: var(--info-bg-color);
  border-radius: 5px;
  margin: 1em 0;
  padding: .5em;
}

/* src/sitestyle/src/loginRegisterForm.css */
form.login-register-form section {
  display: flex;
  align-items:  center;
  margin-bottom: .5em;
}

form.login-register-form section label {
  width: 8em;
  margin-right: 1em;
}

form.login-register-form[data-mode="register"] .switch-mode-to-register {
  display: none;
}

form.login-register-form[data-mode="register"] button.login-button {
  display: none;
}

form.login-register-form[data-mode="register"] button.forgot-password-button {
  display: none;
}

form.login-register-form[data-mode="login"] .switch-mode-to-login {
  display: none;
}

form.login-register-form[data-mode="login"] button.register-button {
  display: none;
}

form.login-register-form[data-mode="login"] section.input-confirm-password {
  visibility: hidden;
}

form.login-register-form .switch-mode-to-login button {
  text-decoration: underline;
  color: var(--body-fg-color-deemphasize-text);
  border: none;
  padding: 0;
}

form.login-register-form .switch-mode-to-register button {
  text-decoration: underline;
  color: var(--body-fg-color-deemphasize-text);
  border: none;
  padding: 0;
}

form.login-register-form button.login-button {
  background-color: var(--info-bg-color);
}

form.login-register-form button.register-button {
  background-color: var(--info-bg-color);
}

/* src/sitestyle/src/spinner.css */
.spinner {
  border: 2px solid var(--body-fg-color-deemphasize-nontext);
  border-top: 2px solid var(--body-fg-color);
  animation: spin 1s linear infinite;
  display: inline-block;
  vertical-align: top;
  border-radius: 50%;
  width: .9em;
  height: .9em;
}

@keyframes spin {
  0% {
    transform: rotate(0);
  }

  100% {
    transform: rotate(360deg);
  }
}

/* src/sitestyle/src/subscriptionPriceList.css */
ol.subscription-price-list {
  display: grid;
  list-style: none;
  gap: 1rem;
  max-width: 1200px;
  padding: 0;
}

ol.subscription-price-list button {
  display: block;
  text-align: left;
  background-color: var(--info-bg-color);
  border: none;
  width: 100%;
}

ol.subscription-price-list li {
  border: 1px solid var(--body-fg-color-deemphasize-nontext);
  list-style-type: none;
  border-radius: 8px;
  padding: 1rem;
  box-shadow: 0 4px 8px #0000001a;
}

@media (min-width: 900px) {
  ol.subscription-price-list {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 600px) and (max-width: 899px) {
  ol.subscription-price-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 599px) {
  ol.subscription-price-list {
    grid-template-columns: 1fr;
  }
}

/* src/sitestyle/src/svgsprite.css */
svg.sprite {
  display: inline-block;
  vertical-align: -.125em;
  width: 1em;
  height: 1em;
}

/* src/sitestyle/src/unlinkAllSessionsForm.css */
form.unlink-all-sessions-form {
  border: 1px dotted var(--danger-border-color);
  background-color: var(--danger-bg-color);
  border-radius: 5px;
  margin: 1em 0;
  padding: .25em 1em;
}

/* src/sitestyle/src/userAccountDetails.css */
details.user-account summary {
  display: flex;
  justify-content: space-between;
  align-items:  center;
  width: 100%;
}

details.user-account summary span {
  display: inline-block;
  margin-right: auto;
}

details.user-account summary form {
  display: inline-block;
  margin-left: auto;
}

details.user-account summary form button {
  margin: 0;
}

/* src/sitestyle/src/utility.css */
.display-none {
  display: none;
}

.tabnum {
  font-variant-numeric: tabular-nums lining-nums slashed-zero;
}

/* src/sitestyle/src/visual.css */
.demo-wrapper {
  border: 1px solid var(--body-fg-color-deemphasize-nontext);
  border-radius: 5px;
  padding: 20px;
}

/* src/sitestyle/src/index.css */

