:root>* {
    --md-primary-fg-color: #4285F4;
    --md-typeset-a-color:  #4285F4;
    --md-accent-fg-color:  #6001D2;
    --md-footer-bg-color: #7E1FFF;
    --md-footer-bg-color--dark: #6001D2;
    --md-footer-fg-color--lighter: #FFFFFF;
    --md-footer-fg-color--light: #FFFFFF;
    --md-hue: unset;
}

/*page status icon*/
:root {
    --md-status--advanced: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><title>fire-alert</title><path d="M15.66 11.2C15.43 10.9 15.15 10.64 14.89 10.38C14.22 9.78 13.46 9.35 12.82 8.72C11.33 7.26 11 4.85 11.95 3C11 3.23 10.17 3.75 9.46 4.32C6.87 6.4 5.85 10.07 7.07 13.22C7.11 13.32 7.15 13.42 7.15 13.55C7.15 13.77 7 13.97 6.8 14.05C6.57 14.15 6.33 14.09 6.14 13.93C6.08 13.88 6.04 13.83 6 13.76C4.87 12.33 4.69 10.28 5.45 8.64C3.78 10 2.87 12.3 3 14.47C3.06 14.97 3.12 15.47 3.29 15.97C3.43 16.57 3.7 17.17 4 17.7C5.08 19.43 6.95 20.67 8.96 20.92C11.1 21.19 13.39 20.8 15.03 19.32C16.86 17.66 17.5 15 16.56 12.72L16.43 12.46C16.22 12 15.66 11.2 15.66 11.2M12.5 17.5C12.22 17.74 11.76 18 11.4 18.1C10.28 18.5 9.16 17.94 8.5 17.28C9.69 17 10.4 16.12 10.61 15.23C10.78 14.43 10.46 13.77 10.33 13C10.21 12.26 10.23 11.63 10.5 10.94C10.69 11.32 10.89 11.7 11.13 12C11.9 13 13.11 13.44 13.37 14.8C13.41 14.94 13.43 15.08 13.43 15.23C13.46 16.05 13.1 16.95 12.5 17.5H12.5M21 13H19V7H21V13M21 17H19V15H21V17Z" /></svg>');
}

body {
    -webkit-font-smoothing: unset;
}

.md-status--advanced::after{
    mask-image: var(--md-status--advanced);
    -webkit-mask-image: var(--md-status--advanced);
}

.md-status--tier::after{
    mask-image: var(--md-status--advanced);
    -webkit-mask-image: var(--md-status--advanced);
}

/* top header */
.md-header{
    background-color: #FFF;
    color: #333;
    box-shadow:none;
}

.md-tabs {
    background-color: #4285F4;
    color: #FFFFFF;
}

.md-tabs__link {
    opacity: unset;
    text-decoration: unset;
}

.md-tabs__link:focus, .md-tabs__link:hover,
.md-tabs__item--active .md-tabs__link {
    color: #FFF;
    text-decoration: underline;
}

.md-nav__item .md-nav__link--active {
    color: var(--md-typeset-color);
    text-decoration: underline;
}

.md-nav__link svg {
    height: 1.1em;
}

.md-nav__link, .md-footer__link,
html .md-footer-meta.md-typeset a {
    text-decoration: unset;
}

.md-footer__link {
    margin-bottom: unset;
    margin-top: unset;
}

.md-footer__direction {
    opacity: unset;
}

.md-search__form {
    background-color: #6001D2;
    color: var(--md-primary-bg-color);
}

.md-search__form:hover {
    background-color: #000;
}

.md-search__options>.md-icon {
    color: var(--md-primary-bg-color);
}

.md-header__button.md-logo img, .md-header__button.md-logo svg {
    height: 1.7rem;
}

/*h1 text color */
.md-typeset h1 {
    color: var(--md-default-fg-color);
}

/* text weight */
.md-typeset h1,
.md-typeset h2, .md-tabs__list {
    font-weight: bold;
}

/* admonition text */
.md-typeset .admonition,
.md-typeset details, .md-nav {
    font-size: .8rem;
}

/* link decoration for underlining links in articles, side menu */
a, .md-nav__link[href]:hover {
    text-decoration: underline;
}

/* dark mode */
[data-md-color-scheme="slate"][data-md-color-primary="indigo"] {
    --md-typeset-a-color: #FFFFFF;
    --md-typeset-a-green: #03dac6;
    --md-typeset-a-blue: #4285F4;
    --md-default-bg-color: #121212;
    --md-alt-bg-color: #333;
}
[data-md-color-scheme="slate"] .md-header {
    background-color: #333;
    color: var(--md-typeset-a-green);
    box-shadow: none;
}

[data-md-color-scheme="slate"] .md-tabs {
    background-color: #4285F4;
    color: var(--md-typeset-a-color);
}

[data-md-color-scheme="slate"] .md-header__button,
[data-md-color-scheme="slate"] .md-typeset a {
    color: var(--md-typeset-a-green);
}

[data-md-color-scheme="slate"] .md-tabs__item--active .md-tabs__link {
    color: var(--md-typeset-a-color);
    text-decoration: underline;
}

[data-md-color-scheme="slate"] .md-nav__link[href]:hover,
[data-md-color-scheme="slate"] .md-nav__item .md-nav__link--active {
    color: var(--md-typeset-a-green);
    text-decoration: underline;
}

[data-md-color-scheme="slate"] .md-typeset a:hover {
    color: var(--md-typeset-a-blue);
}

/* mobile */
@media screen and (max-width: 76.2344em) {
    .md-nav--primary .md-nav__title[for="__drawer"] {
        background-color: #f9f9f9;
        color: #333;
    }
    .md-header__button:not(.focus-visible) {
        order: 1;
    }
    .md-header__button.md-logo {
        display: block;
        order: 2;
    }
    .md-header__title {
        order: 4;
    }
    .md-header__option {
        order: 5;
    }
    .md-header__button.md-icon.search {
        order: 6;
    }

}

/* logo changing */
#logo_light_mode {
    display: var(--md-logo-default);
}

#logo_dark_mode {
    display: var(--md-logo-slate);
}

[data-md-color-scheme="default"] {
    --md-logo-slate:         none;
    --md-logo-default:         block;
}

[data-md-color-scheme="slate"] {
    --md-logo-slate:         block;
    --md-logo-default:         none;
}

/* smilie */

.smile {
    color: #FFCC4D;
    background: #000;
    border-radius: 55%;
}

.thumb {
    color: #FFCC4D;
}

.sad {
    color: #4285F4;
}

.rocket {
    color: #6001D2;
}

.dollar {
    color: #85bb65;
}

.one {
    fill: #00A964;
}

/* nav smilie */
.md-nav--primary .md-nav__link[href*="../outgoingmail/"] svg {
    fill: #00A964;
}

/*font picker*/
.font-picker {
    position: relative;
    display: flex;
    align-items: center;
}

.font-picker-menu {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 6px;
    width: 220px;
    max-height: 300px;
    overflow-y: auto;
    background: var(--md-default-bg-color);
    border: 1px solid var(--md-default-fg-color--light);
    border-radius: 6px;
    padding: 6px;
    z-index: 1000;
    box-shadow: 0 6px 18px rgba(0,0,0,.2);
}

.font-option {
    position: relative;
    padding: 8px 36px 8px 12px; /* room for checkmark */
    font-size: 16px;
    line-height: 1.4;
    cursor: pointer;
    border-radius: 6px;
    transition: background-color 120ms ease, color 120ms ease;
}

.font-option:hover {
    background: var(--md-default-fg-color--lightest);
}

/* Light mode active */
.font-option.active {
    background-color: var(--md-accent-fg-color--transparent);
    color: var(--md-accent-fg-color);
    font-weight: 600;
}
.font-option.active::after {
    content: "✓";
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: 700;
    color: currentColor;
}


/* Dark mode active */
[data-md-color-scheme="slate"] .font-option.active {
    background-color: rgba(255,255,255,0.14);
    color: #ffffff;
    font-weight: 600;
}

[data-md-color-scheme="slate"] .font-option:hover {
    background-color: rgba(255,255,255,0.08);
}
.font-option:focus {
    outline: none;
}

[data-md-color-scheme="slate"] .font-option:focus {
    box-shadow: inset 0 0 0 2px var(--md-accent-fg-color);
}

/* icon using SVG mask */
.font-picker-icon {
    width: 22px;
    height: 22px;
    display: block;
    background: currentColor;
    mask: url("../images/settings_heart.svg") no-repeat center / contain;
    -webkit-mask: url("../images/settings_heart.svg") no-repeat center / contain;
}
.font-picker-menu {
    transform-origin: top right;
    animation: fontMenuIn 140ms cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes fontMenuIn {
    from {
        opacity: 0;
        transform: scale(0.98) translateY(-4px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}
.font-option:hover {
    background: var(--md-default-fg-color--lightest);
}

[data-md-color-scheme="slate"] .font-option:hover {
    background: rgba(255,255,255,0.08);
}
.font-option:focus {
    outline: none;
}

.font-option:focus-visible {
    box-shadow: inset 0 0 0 2px var(--md-accent-fg-color);
}

/* img border */
.md-content img {
    border-width: 1px;
    border-style: solid;
    border-color: var(--md-accent-fg-color);
    outline-width: 3px;
    outline-style: solid;
    outline-color: grey;
}

/* toc */
/* Make only h2 items bold */
.md-sidebar--secondary .md-nav__item > .md-nav__link {
    font-weight: bold;
}

/* Make nested (e.g., h3) items normal weight */
.md-sidebar--secondary .md-nav__item .md-nav__item > .md-nav__link {
    font-weight: normal;
}

/* hide legal menu from top nav */
.md-tabs__item:nth-child(6) {
    display: none;
}