@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400..900&family=JetBrains+Mono:wght@400..700&display=swap');

/* ===== 鎖定淺色、殺 dark ===== */
html.dark, body[theme-mode="dark"] { color-scheme: light !important; }

html body,
html body[theme-mode="dark"],
html body.dark,
html.dark body,
:root {
    --semi-color-bg-0: 250, 250, 247 !important;
    --semi-color-bg-1: 245, 245, 240 !important;
    --semi-color-bg-2: 240, 240, 235 !important;
    --semi-color-bg-3: 235, 235, 230 !important;
    --semi-color-bg-4: 230, 230, 225 !important;
    --semi-color-fill-0: 245, 245, 240 !important;
    --semi-color-fill-1: 240, 240, 235 !important;
    --semi-color-fill-2: 235, 235, 230 !important;
    --semi-color-text-0: 10, 10, 10 !important;
    --semi-color-text-1: 30, 30, 30 !important;
    --semi-color-text-2: 60, 60, 60 !important;
    --semi-color-text-3: 100, 100, 100 !important;
    --semi-color-border: 10, 10, 10 !important;
    --semi-color-primary: 10, 10, 10 !important;
    --semi-color-primary-hover: 40, 40, 40 !important;
    --semi-color-primary-active: 0, 0, 0 !important;
    --semi-color-primary-light-default: 10, 10, 10 !important;
    --semi-color-success: 22, 163, 74 !important;
    --semi-color-danger: 220, 38, 38 !important;
    --semi-color-warning: 234, 88, 12 !important;
    --semi-color-info: 10, 10, 10 !important;
    --semi-color-link: 10, 10, 10 !important;
}

/* ===== 全站字型 ===== */
html body,
html body * {
    font-family: Archivo, Inter, "Noto Sans TC", system-ui, sans-serif !important;
}
html body code,
html body pre,
html body .semi-input-textarea,
html body [class*="monospace"],
html body [class*="code"] {
    font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace !important;
}

/* ===== 全 Semi UI + Tailwind 元件砍圓角 =====
   Tailwind 的 !rounded-* 會 compile 成 .\!rounded-* + !important
   必須用 attribute selector 通配 + 提高 specificity (html body) 才壓得下 */
html body [class*="rounded"],
html body [class*="semi-"],
html body button,
html body input,
html body select,
html body textarea,
html body .semi-button,
html body .semi-input-wrapper,
html body .semi-card,
html body .semi-modal-content,
html body .semi-popover-content,
html body .semi-dropdown-menu,
html body .semi-tag,
html body .semi-avatar {
    border-radius: 0 !important;
}

/* ===== 按鈕野獸陰影 + 邊 ===== */
html body .semi-button {
    border: 2px solid #0a0a0a !important;
    box-shadow: 4px 4px 0 rgba(10,10,10,.88) !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    transition: transform .08s, box-shadow .08s !important;
}
html body .semi-button:hover {
    transform: translate(-2px, -2px) !important;
    box-shadow: 6px 6px 0 rgba(10,10,10,.88) !important;
}
html body .semi-button:active {
    transform: translate(2px, 2px) !important;
    box-shadow: 1px 1px 0 rgba(10,10,10,.88) !important;
}
html body .semi-button-primary {
    background: #0a0a0a !important;
    color: #fafaf7 !important;
}
html body .semi-button-primary:hover {
    background: #000 !important;
    color: #fafaf7 !important;
}

/* ===== Card / Panel ===== */
html body .semi-card,
html body .semi-modal-content,
html body .semi-popover-content,
html body .semi-dropdown-menu {
    border: 2px solid #0a0a0a !important;
    box-shadow: 6px 6px 0 rgba(10,10,10,.88) !important;
    background: #fafaf7 !important;
}

/* ===== Input ===== */
html body .semi-input-wrapper,
html body .semi-input,
html body .semi-select,
html body .semi-input-number {
    border: 2px solid #0a0a0a !important;
    background: #fafaf7 !important;
}
html body .semi-input-wrapper:focus-within,
html body .semi-select:focus-within {
    box-shadow: 3px 3px 0 #0a0a0a !important;
}

/* ===== Table ===== */
html body .semi-table {
    border: 2px solid #0a0a0a !important;
}
html body .semi-table-thead > .semi-table-row > .semi-table-row-head {
    background: #0a0a0a !important;
    color: #fafaf7 !important;
    border-bottom: 2px solid #0a0a0a !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    font-weight: 700 !important;
}
html body .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell {
    background: rgba(10,10,10,.05) !important;
}

/* ===== 隱藏主題切換鈕（多語系） ===== */
html body [aria-label*="theme" i],
html body [aria-label*="主题"],
html body [aria-label*="主題"],
html body [aria-label*="Theme"] {
    display: none !important;
}

/* ===== 背景格線（全頁強制，包括 hero 漸層） ===== */
html body,
html body > #root,
html body > #root > div:first-child {
    background-color: #fafaf7 !important;
    background-image:
        linear-gradient(rgba(10,10,10,.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(10,10,10,.04) 1px, transparent 1px) !important;
    background-size: 32px 32px !important;
}

/* 壓 new-api 首頁 Hero 藍色漸層 */
html body [class*="hero"],
html body [class*="Hero"],
html body [class*="gradient"],
html body [class*="Gradient"],
html body [style*="gradient"] {
    background: transparent !important;
    background-image: none !important;
}

/* 首頁 H1 字型 */
html body h1,
html body h2,
html body h3 {
    font-family: Archivo, Inter, "Noto Sans TC", system-ui, sans-serif !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    color: #0a0a0a !important;
}
html body h1 {
    text-transform: uppercase !important;
}

/* Navigation/Header */
html body .semi-navigation,
html body header,
html body [class*="header" i] {
    border-bottom: 2px solid #0a0a0a !important;
    background: #fafaf7 !important;
}

/* Tag / Badge */
html body .semi-tag {
    border: 2px solid #0a0a0a !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
}

/* 連結 */
html body a {
    color: #0a0a0a !important;
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 3px !important;
}
html body a.semi-button,
html body a[class*="button"] {
    text-decoration: none !important;
}
