@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@page {
    size: a4 portrait;
    margin: 25mm 10mm 25mm 10mm;
    counter-increment: page;
    white-space: pre;
    color: grey;
    font-family: "Inter", cursive !important;


    @top-left {
        content: url("./assets/cover_logo.svg");
    }

    @top-right {
        font-size: 8pt !important;
        color: #a2a2a2 !important;
        content: string(chapter);
    }

    @bottom-right {
        font-size: 8pt !important;
        color: #a2a2a2 !important;
        content: '' counter(page) '/' counter(pages) '' !important;
    }

    @bottom-center {
        content: '' !important;
    }

    @bottom-left {
        font-size: 8pt !important;
        color: #a2a2a2 !important;
        content: string(copyright);
    }
}


/*// Cover page*/
/*// !!! :note: do not working with named @page ???*/
@page :first {
    margin: 0;

    @top-left {
        content: none !important;
    }
    @top-right {
        content: none !important;
    }

    @bottom-right {
        content: none !important;
    }

    @bottom-center {
        content: none !important;
    }

    @bottom-left {
        content: none !important;
    }
}


:root > * {
    --md-primary-color: #748C04 !important;
    --green-color: rgba(146, 183, 0, 1) !important;
}


body {
    font-size: 16px !important;
    line-height: 1.5;
    margin: 0;
    padding: 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.md-header {
    background: var(--green-color) !important;
}
@media screen and (width < 1024px) {
    .md-nav--primary .md-nav__title[for=__drawer] {
        background: var(--green-color) !important;
    }
}
.md-grid {
    width: 100% !important;
    max-width: 1500px !important;
    padding-inline: 16px !important;
}

@media screen and (width > 1024px) {
    .md-sidebar--primary {
        width: 20% !important;
    }
}

.md-content a {
    color: var(--md-primary-color) !important;
}

code {
    font-family: 'Roboto Mono', 'Helvetica', Helvetica, Arial, sans-serif !important;
    background-color: #f5f5f5 !important;
    border-radius: .1rem !important;
    padding: 0.1em .2941176471em !important;
}

article h1,
article h2,
article h3 {
    color: black !important;
    border-color: var(--md-primary-color) !important;
}

a:hover {
    color: var(--md-primary-color) !important;
}

.md-nav__link--active,
.md-nav__link:focus,
.md-nav__link:hover,
.md-nav__item--active > .md-nav__link {
    color: rgb(116, 140, 4) !important;
}

.md-sidebar__scrollwrap:hover, .md-sidebar__scrollwrap:focus-within {
    scrollbar-color: var(--md-primary-color) white;
}

.md-typeset > ul {
    margin-left: 0 !important;
}

.md-typeset ul li,
.md-typeset ol li {
    margin-left: 1.5rem !important;
}

.md-nav__item a:hover, .md-nav__item a:focus, .md-nav__item a:active {
    color: var(--md-primary-color) !important;
}

.md-content {
    text-align: left;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.md-copyright {
    display: none;
}

@media print {
    * {
        font-family: "Inter", cursive !important;
        background-color: #fff;
        color: black !important;
    }

    a {
        color: var(--md-primary-color) !important;
    }


    .cover1 {
        display: grid;
        grid-template-rows: 1fr 1fr;
        height: 294mm;
    }

    .cover1__image {
        background: url(./assets/cover_1.jpg) no-repeat center center;
        background-size: cover;
    }

    .cover1__wrapper {
        display: flex;
        flex-direction: column;
        margin-top: 24px;
    }

    .logo__octopus {
        width: auto;
        height: 36px;
        background: url(./assets/octopus.svg) no-repeat center center;
        background-size: contain;
    }

    .cover1__title {
        flex-grow: 1;
        margin-top: 70px;
        border: none;
        font-size: 30px;
        font-weight: normal;
        text-align: center;
        letter-spacing: 1px;
    }

    .logo_corner {
        margin: auto 10mm 10mm;
        align-self: start;
        width: 101px;
        height: 24px;
        background: url(./assets/cover_logo.svg) no-repeat center center;
        background-size: contain;
    }

    /*    COVER 2 PAGE    */
    .cover2 {
        display: grid;
        grid-template-rows: 1fr 402px;
        height: 240mm;
    }

    .cover2__wrapper {
        display: flex;
        flex-direction: column;
        margin-bottom: 150px;
    }

    .logo__octopus_cover2 {
        background-position: left center;
    }

    .cover2__content {
        flex-grow: 1;
        justify-content: center;
        display: flex;
        flex-direction: column;
    }

    .cover2__contentItem {
        margin-bottom: 16px;
    }

    .cover2__image {
        background: url(./assets/cover_2.jpg) no-repeat center center;
        background-size: cover;
    }
}


/*//TOC page ПРИСУТСТВУЕТ ТОЛЬКО В ПДФ*/
article#doc-toc {

    ul {
        page-break-inside: auto !important;
    }

    ul {
        margin-bottom: 30px !important;
    }

    li > a {
        font-size: 12pt !important;
        color: black !important;
        text-decoration: none !important;
        border: none !important;
    }
}