:root {
    --site-scale-trigger: 0;
    --site-scale-animate: .3s;
    --site-head-height: calc(6.35rem - 2.9rem * var(--site-scale-trigger));
    --site-menu-height: calc(3.4rem - .75rem * var(--site-scale-trigger));
    --main-content-margin-top: 1.2rem;
    --site-head-color: linear-gradient(135deg, rgba(25, 135, 84, .6) 0%, var(--bs-info) 30%, var(--bs-info) 70%, rgba(13, 110, 253, .6) 100%);
    --site-menu-color: linear-gradient(135deg, rgba(25, 135, 84, .4) 0%, rgba(13, 110, 253, .4) 100%);
    --scrollbar-display: none;
}

@media (max-width: 767px) {
    :root {
        --site-head-height: calc(3.5rem - .75rem * var(--site-scale-trigger));
    }
}

body {
    background-image: linear-gradient(90deg, var(--bs-light) 0%, var(--bs-info-bg-subtle) 100%);
}

/* 頭巾 */

#site_head {
    z-index: 9;
    height: var(--site-head-height);
    background-image: var(--site-head-color);
    transition-duration: var(--site-scale-animate);
}

    #site_head .container {
        background-image: url("uch_icons/color-384.png");
        background-repeat: no-repeat;
        background-position: .5% 50%;
        background-size: contain;
    }

    #site_head.sticky {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
    }

    #site_head .uch_logo {
        transform: scale(calc(1 - .25 * var(--site-scale-trigger)));
        transform-origin: center left;
        transition-duration: var(--site-scale-animate);
        cursor: pointer;
        font-size: 3.3rem;
        width: 3.3rem;
    }

    #site_head .org-name {
        transform: scale(calc(1 - .25 * var(--site-scale-trigger)));
        transform-origin: center left;
        transition-duration: calc(var(--site-scale-animate) * 2);
        margin-left: -0.3rem;
        cursor: pointer;
    }

    #site_head .ask-me {
        transform: scale(calc(1 - .15 * var(--site-scale-trigger)));
        transition-duration: var(--site-scale-animate);
        cursor: pointer;
    }

        #site_head .ask-me:hover {
            transform: scale(calc(1.2 - 0.2 * var(--site-scale-trigger)));
        }

        #site_head .uch_logo:hover, #site_head .org-name:hover {
            transform: scale(calc(1.1 - 0.2 * var(--site-scale-trigger)));
        }


@media (max-width: 1200px) {
    #site_head {
        font-weight: 100;
    }
}

/*菜單*/

#site_menu {
    opacity: .83;
    z-index: 9;
    transition-duration: var(--site-scale-animate);
}

    #site_menu.sticky {
        position: fixed;
        top: var(--site-head-height);
        left: 0;
        right: 0;
    }

    #site_menu .site_menu_project {
        transition-duration: var(--site-scale-animate);
        /*transform: scale(calc(1 - 1 * var(--site-scale-trigger)));*/
        font-size: calc(1rem - 1rem * var(--site-scale-trigger));
    }

    #site_menu nav {
        transition-duration: var(--site-scale-animate);
        padding-top: calc(var(--bs-navbar-padding-y) - .5rem * var(--site-scale-trigger));
        padding-bottom: calc(var(--bs-navbar-padding-y) - .5rem * var(--site-scale-trigger));
        background-image: var(--site-menu-color);
        min-height: .5rem;
    }
    #site_menu .navbar-brand {
        transition-duration: var(--site-scale-animate);
        font-size: calc(var(--bs-navbar-brand-font-size) -.1em - .25em * var(--site-scale-trigger));
    }
    #site_menu .navbar-toggler {
        transform: scale(calc(1 - 0.35 * var(--site-scale-trigger)));
        transform-origin: center right;
        transition-duration: var(--site-scale-animate);
    }


@media (max-width: 1200px) {
    #site_menu {
        font-weight: 100;
    }
}



/*升降梯*/

#back-to-top-icon {
    position: fixed;
    bottom: 3em;
    right: 1em;
    opacity: .9;
    line-height: 0.9rem;
    z-index: 3000;
    transform: scaleY(calc(0 + 1 * var(--site-scale-trigger)));
}

/* 內文 */

main.container {
    padding-top: var(--main-content-margin-top);
    padding-bottom: calc(var(--main-content-margin-top) * 2);
    transition-duration: var(--site-scale-animate);
}

    main.container.sticky {
        margin-top: calc(var(--site-head-height) + var(--site-menu-height));
        padding-bottom: calc(var(--main-content-margin-top) + 250px);
    }

/* Table */
.table:not(.table-bordered) tr:first-child > th:first-child {
    border-top-left-radius: calc(.3em - .3em * var(--site-scale-trigger));
}

.table:not(.table-bordered) tr:first-child > th:last-child {
    border-top-right-radius: calc(.3em - .3em * var(--site-scale-trigger));
}

/* Sticky Table */
.table.sticky tr:first-child > th {
    position: sticky;
    top: 0;
    z-index: 2;
    transition-duration: var(--site-scale-animate);
    opacity: calc(1 - .15 * var(--site-scale-trigger));
}

    .table.sticky tr:first-child > th:first-child {
        border-bottom-left-radius: calc(.3em * var(--site-scale-trigger));
    }

    .table.sticky tr:first-child > th:last-child {
        border-bottom-right-radius: calc(.3em * var(--site-scale-trigger));
    }

main.container.sticky table.sticky tr:first-child > th {
    top: calc(var(--site-head-height) + var(--site-menu-height));
}

.show-hover-edit-hint:hover::after {
    color: var(--bs-info);
    content: " ✏️";
}


/* 客製化主題覆寫 */

html {
    scroll-behavior: smooth;
    height: -webkit-fill-available;
}

body {
    min-height: 100vh;
    min-height: -webkit-fill-available;
}

    body::-webkit-scrollbar {
        display: none;
    }

/*.table td {
    vertical-align: middle;
}*/

.btn-info {
    color: var(--bs-white);
}

a {
    color: var(--bs-info);
    text-decoration: none;
}

    a:focus, a:hover {
        color: #3dd5f3;
    }

.form-control:focus {
    color: var(--bs-dark);
    border-color: var(--bs-info);
    box-shadow: 0 0 0 .25rem rgba(13, 202, 240,.25);
}


/*toast*/

.toast-container > .toast.fade {
    transition: opacity .5s ease-in-out,transform .5s ease-in-out;
}

.toast-container > .fade:not(.show) {
    opacity: 0;
    transform: translate(0, -2rem);
}

.card.card-body .table tr:last-child td {
    border-bottom: none;
}