@import "https://theme-park.dev/css/base/gitea/organizr.css";
@import "./theme-liteyuki-magipoke-base.css";
@import "./theme-liteyuki-magipoke-color.css";
@import "./theme-liteyuki-magipoke-mobile.css";

/* 暗色系主题 */
:root {

    --is-dark-theme: false !important;
    --text: #d8d8d8;

    --white: #ffffff;

    --liteyuki-theme: liteyuki-magipoke;
    /* 主题标识符 */

    /* 圆角区 */
    --border-radius-bar: 5rem;
    /* 长条的圆角 */
    --border-radius-big: 2rem;
    --border-radius-small: 1rem;
    --border-radius-menu: 1rem;
    --border-radius: var(--border-radius-small) !important;
    /* 覆盖原有 */

    /* 边框 */
    --border: 2px solid rgba(255, 255, 255, 0.1);

    /* 毛玻璃区 */
    --backdrop-filter: blur(10px);

    /* 阴影区 */
    --box-shadow: 0 0 1rem rgba(0, 0, 0, 0.5);

    /* 底色 */
    --ui-background-color: rgba(64, 64, 64, 0.4);
    --menu-background-color: rgba(64, 64, 64, 0.6);
    --navbar-background-color: rgba(0, 0, 0, 0.6);
    --code-background-color: rgba(0, 0, 0, 0.6);
    --tab-background-color: rgba(0, 0, 0, 0.4);

    /* 选项卡高度 */
    --code-tab-height: 2.5rem;
    --code-item-margin: 3rem;
    --code-copy-button-size: 3rem;

    /* 所有渐变 */
    --transition-time: all 0.2s;
    transition: var(--transition-time) !important;

    /* 贡献方块颜色 */
    --color-secondary-alpha-60: rgba(0, 0, 0, 0.5);
}

body {
    background: url(../img/bg/2.webp);
    background-size: cover !important;
    background-attachment: fixed !important;
    background-repeat: repeat-y !important;
    background-position: center center !important;
}

body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    pointer-events: none;
    z-index: -1;
}

a.item,
a.item:hover,
a.item:active,
a.item:visited {
    transition: var(--transition-time) !important;
}

.avatar {
    border-radius: 50% !important;
}

/* 足 */
footer {
    display: flex;
    flex-direction: column !important;
    z-index: 1;

    backdrop-filter: var(--backdrop-filter) !important;
    background-color: var(--menu-background-color) !important;
    padding: 0.5rem !important;

    .left-links {
        margin-bottom: 0.5rem !important;
    }
}

#navbar {
    border-bottom: var(--border) !important;
    background: var(--navbar-background-color) !important;
}

#navbar .item {
    /*    border-radius: var(--border-radius-bar) !important;*/
}


.menu .item:hover{
    background: var(--transparency-dark-15) !important;
}

#navbar .item.active {
    background-color: var(--transparency-dark-25) !important;
    color: var(--white) !important;
}

#navbar .dropdown .item {
    /*    border-radius: var(--border-radius-menu) !important;*/
}

/*  */
.ui.label,
.ui.button,
.ui.basic.buttons .button,
.ui.basic.button {
    border-radius: var(--border-radius-bar);
    border: var(--border);
}

/* 菜单，长条半圆 */
.ui.action.input>.dropdown:last-child,
.ui.action.input>.button:last-child,
.ui.action.input>.buttons:last-child>.button {
    border-radius: var(--border-radius-bar) !important;
}

/* 二元菜单 */
#app .ui.item.menu,
.ui.item.menu .item:first-child {
    border-top-left-radius: var(--border-radius-bar) !important;
    border-bottom-left-radius: var(--border-radius-bar) !important;
}

.ui.item.menu .item:last-child {
    border-top-right-radius: var(--border-radius-bar) !important;
    border-bottom-right-radius: var(--border-radius-bar) !important;
}

#app .ui.item.menu,
.ui.item.menu .item.active {
    color: var(--accent-color) !important;
}

/* 输入框 */
.ui.form input,
.ui.form input:not([type]),
.ui.form input[type=date],
.ui.form input[type=datetime-local],
.ui.form input[type=email],
.ui.form input[type=file],
.ui.form input[type=number],
.ui.form input[type=password],
.ui.form input[type=search],
.ui.form input[type=tel],
.ui.form input[type=text],
.ui.form input[type=time],
.ui.form input[type=url],
.ui.input>input {
    border-radius: var(--border-radius-bar) !important;
    /* margin-right: 1rem !important; */
}

/* 主要按钮选中及悬停状态，圆角宽按钮 */
.ui.secondary.menu .active.item,
.ui.secondary.menu .active.item:hover,
.dashboard.feeds .filter.menu .item,
.dashboard.issues .filter.menu .item,
.repository .clone-panel>button:first-of-type,
.ui.buttons .button:first-child,
.ui.buttons .button:last-child {
    border-radius: var(--border-radius-bar) !important;
    /* margin-right: 1rem !important; */
}

/* 贡献曲线图 */
.main-graph {
    border-radius: var(--border-radius-small) !important;
}

.ui.container {
    background-color: var(--ui-background-color) !important;
    backdrop-filter: var(--backdrop-filter) !important;
    border-radius: var(--border-radius-big) !important;
    box-shadow: var(--box-shadow) !important;
    padding: 1rem !important;
    margin-bottom: 1rem !important;
}

.ui.header {
    border-top-left-radius: var(--border-radius-small) !important;
    border-top-right-radius: var(--border-radius-small) !important;
}

.ui.segment {
    border: none !important;
}

/* UI段 */
.ui.segment:not(.sub-menu.repository-menu):not(.language-stats):not(.tw-py-8):not(.text):not(.item):not(.main-graph):not(.issue-content-right):nth-last-of-type(1),
.ui.segment.segment-end:not(.text):not(.item):not(.main-graph):not(.issue-content-right) {
    border-bottom-left-radius: var(--border-radius-small) !important;
    border-bottom-right-radius: var(--border-radius-small) !important;
}

/* 右上角两个下拉菜单颜色 */
.ui.dropdown .menu {
    border-radius: var(--border-radius-menu) !important;
    background-color: var(--menu-background-color) !important;
    backdrop-filter: var(--backdrop-filter) !important;
}

/* 右上角两个下拉菜单选中文本颜色 */
.ui.dropdown .menu .active.item {
    color: var(--white) !important;
}

.ui.dropdown .menu .item {
    /*    border-radius: var(--border-radius-menu) !important;*/
    /*    background-color: var(--menu-background-color) !important;*/
}

/* 设置页面左边垂直菜单 */
.ui.vertical.menu {
    border-radius: var(--border-radius-menu) !important;
}

.issue-content-right {
    border-radius: var(--border-radius-small) !important;
}

/* 左垂菜单第一个 */
.ui.vertical.menu>.item.header:first-child {
    border-top-left-radius: var(--border-radius-menu) !important;
    border-top-right-radius: var(--border-radius-menu) !important;
}

/* 顶栏带下边框的按钮，例如仓库，用户，组织 */
.ui.secondary.pointing.menu .active.item,
.ui.secondary.pointing.menu .active.item:hover {
    border: none;
    background-color: rgba(var(--accent-color)) !important;
    color: var(--white) !important;
}

.ui.horizontal.segments>.segment,
.ui.horizontal.segments>.segment {
    background: none !important;
    border: none !important;
}

/* 多行文本输入框 */
textarea {
    border-radius: var(--border-radius-small) !important;
}

/* 下拉菜单按钮 */
.ui.action.input>.dropdown:not(:first-child),
.ui.action.input>.button:not(:first-child),
.ui.action.input>.buttons:not(:first-child)>.button,
.ui.selection.dropdown,
.ui.active.selection.dropdown {
    border-radius: var(--border-radius-bar) !important;
}

.ui.selection.dropdown .menu>.item {
    border: none !important;
}

/* 仓库页面移动端扩展菜单 */
.tippy-box[data-theme=menu] {
    background-color: var(--menu-background-color) !important;
    border-radius: var(--border-radius-small) !important;
    box-shadow: var(--box-shadow) !important;
    backdrop-filter: var(--backdrop-filter) !important;
}

/* 用户贡献方块背景 */
#user-heatmap {
    background-color: var(--ui-background-color) !important;
    backdrop-filter: var(--backdrop-filter) !important;
    border-radius: var(--border-radius-small) !important;
    box-shadow: var(--box-shadow) !important;
    padding: 1rem !important;
    margin-bottom: 1rem !important;
}

/* .ui.action.input .ui.ui.button {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
} */

/* 首页右边的仓库列表，展示actions状态那个 */
/* .feeds .list ul li:first-child {
    border-top-left-radius: var(--border-radius-small) !important;
    border-top-right-radius: var(--border-radius-small) !important;
} */

/* 首页右边仓库的头部，包含搜索框 */
.ui.attached:not(.message)+.ui.attached.segment.repos-search:not(.top) {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* 首页右边仓库列表翻页按钮们 */
.ui.pagination.menu.narrow .item {
    padding: auto !important;
}


/* 首页底部翻页按钮 */
.ui.menu {
    border-radius: var(--border-radius-bar) !important;
}

/* 文件框头部二层复写 */
.ui.table>thead>tr>th:first-child {
    border-top-left-radius: var(--border-radius-small) !important;
}

.ui.table>thead>tr>th:last-child {
    border-top-right-radius: var(--border-radius-small) !important;
}


/* 文件框总体 */
table#repo-files-table {
    border-radius: var(--border-radius-small) !important;
}

/* markdown中代码块总体 */
.markup .code-block,
.markup .mermaid-block {
    /* box-shadow: var(--box-shadow) !important; */
    box-shadow: 4px 0 6px rgba(0, 0, 0, 0.3), -4px 0 6px rgba(0, 0, 0, 0.3) !important;
    background-color: var(--code-background-color) !important;
}

/* tab-dot代码块前插入的选项卡 */
pre.code-block {
    position: relative;
    /* 使绝对定位基于此元素 */
    padding-top: var(--code-item-margin);
    /* 为选项卡预留空间，避免内容被覆盖 */
}

.code-copy.ui.button {
    position: absolute;
    /* 绝对定位 */
    top: var(--code-item-margin);
    /* 顶部对齐 */
    right: 0.5rem;
    /* 高度 */
    z-index: 10;
    /* 确保复制按钮在最上层 */
}

.code-copy.code-shot.ui.button {
    /* 顶部对齐 */
    right: 4rem;
    /* 右侧对齐 */
    z-index: 10;
    /* 确保截图按钮在最上层 */
}

/* 选项卡 */
.code-tab {
    position: absolute;
    /* 绝对定位 */
    top: 0;
    /* 顶部对齐 */
    left: 0;
    /* 左侧对齐 */
    width: 100%;
    /* 宽度铺满父元素 */
    /* 或者根据需要设置具体宽度 */
    display: flex;
    justify-content: flex-start;
    padding: 0.75rem;
    /* 内边距 */
    background-color: var(--tab-background-color) !important;
    border-top-left-radius: var(--border-radius-small);
    border-top-right-radius: var(--border-radius-small);
    z-index: 10;
    /* 确保选项卡在最上层 */
}

.code-tab-item {
    display: flex;
    justify-content: flex-start;
}

.code-tab-dot {
    height: 0.8rem;
    width: 0.8rem;
    border-radius: var(--border-radius-bar) !important;
    margin-right: 0.65rem;
    cursor: pointer;
    /* 添加鼠标指针 */
}

/* 代码预览页面代码单行样式 */
.chroma,
.markdown:not(code) .highlight pre,
.markdown:not(code) pre {
    background-color: rgba(0, 0, 0, 0) !important;
}

.ui.label {
    border: var(--border) !important;
}

/* 小圆角集合，release页面框框 */
#release-list .release-entry .detail {
    border-radius: var(--border-radius-small) !important;
}

pre,
code,
kbd,
samp {
    /* font-family: var(--font-family-code) !important; */
}

/* 代码块高亮色 */

/* 修改label-list行距 #3 */
.label-list .ui.label {
    margin-bottom: 0.5em; /* 根据需要调整数值 */
}

/* relative-time 加上背景色 #3 */
.tippy-content {
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 0.5rem;
    padding: 0.25rem 0.5rem;
}

/* 所有图像 */
img {
    border-radius: var(--border-radius-small) !important;
}

/* table的thead要上圆角，tbody最后一个下圆角 */
table>thead>tr>th:first-child {
    border-top-left-radius: var(--border-radius-small) !important;
}

table>thead>tr>th:last-child {
    border-top-right-radius: var(--border-radius-small) !important;
}

table>tbody>tr:last-child>td:first-child {
    border-bottom-left-radius: var(--border-radius-small) !important;
}

table>tbody>tr:last-child>td:last-child {
    border-bottom-right-radius: var(--border-radius-small) !important;
}

table>thead>tr{
    border-top-left-radius: var(--border-radius-small) !important;
    border-top-right-radius: var(--border-radius-small) !important;
}

/* 移除thead顶部的线 */
table>thead>tr {
    border-top: none !important;
}

/* 添加边界 */
table{
    border-radius: var(--border-radius-small) !important;
    box-shadow: var(--box-shadow) !important;
    border: var(--border) !important;
}

/* 给表格加阴影 */
/* table {
    box-shadow: var(--box-shadow) !important;
} */

/* 自定义滚动条样式 */
*{
    scrollbar-color: initial !important;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background: var(--ui-background-color);
    border-radius: 5px;
    transition: all 0.2s;
}

::-webkit-scrollbar:hover{
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-thumb {
    background: var(--navbar-background-color);
    border-radius: 5px;
    transition: all 0.2s;
}

::-webkit-scrollbar-thumb:hover{
}


.flex-item {
    padding: 12px 12px 2px;
    border-radius: 11px;
    /* border: 1px solid #ffffff38; */
    margin: 12px 0;
    /* box-shadow: #b5c7fb57 0px 4px 5px 0px; */
    background-color: #ffe7e711;
    position: relative;
    transition: 0.3s all;
}


#set-bg-container {
    text-align: center;
}
#url-input {
    position: fixed;
    top: 0;
    display: none;
    margin-top: 10px;
}
#url-input input{
    min-width: 200px;
}
#set-bg-btn, #save-url-btn {
    padding: 3px 10px;
    margin: 5px;
    color: #3e6c81;
    background-color: #b5edfdbd;
    cursor: pointer;
}

.flex-item:hover{
    box-shadow: #dfe7ff57 3px 3px 5px 0px;
}

.label-list .ui.label {
    margin-bottom: 0;
}

.flex-item-header {
    padding-bottom: 3px;
    border-bottom: 1px solid #fff2;
}

.ui.basic.label {
    font-size: 11px;
    background-color: rgb(216 235 243 / 82%);
    color: #3a69c2;
    border: 1px solid #b0c4f3 !important;
    padding: 3px 8px;
}

.divider+.flex-list>.flex-item:first-child {
    padding-top: 12px;
}

.flex-item-body relative-time{
    color: #36c370;
    font-size: 11px;
    margin-left: 10px;
}

.flex-item-main .flex-item-body:last-of-type{
    color: #a3a3a3;
    font-size: 11px;
    margin-top: 10px;
}

#tippy-1{
    background-image: linear-gradient(199deg, var(--transparency-dark-25), #000000 100%);
    backdrop-filter: blur(16px);
    border-radius: 16px 16px 16px 6px;
    left: -10px;
}
