/* 
 * 北斗數位科技 - 尺寸調整樣式
 * 保持原有顏色方案，優化大小和佈局
 */

/* 高對比度支援 */
@media (prefers-contrast: high) {
    .card {
        border: 2px solid #fff;
    }
}

/* 減動畫偏好支援 */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* 中文字型優化 */
@font-face {
    font-family: 'system-ui';
    src: local('Microsoft JhengHei'), local('微軟正黑體'), local('PingFang TC'), local('Apple LiGothic Medium'), local('Roboto'), local('Segoe UI');
    font-display: swap;
}

/* 整體字體大小調整 */
body {
    font-size: 1.2rem !important; /* 首頁內文再調大 */
    background-color: #1a1a1a !important; /* 深色背景 */
    color: #ffffff !important; /* 白色文字 */
}

/* 首頁特殊內文大小調整 */
.hero-section .lead {
    font-size: 1.15rem !important;
    line-height: 1.6 !important;
}

/* 首頁服務描述文字 */
.service-card .card-text {
    font-size: 1.25rem !important; /* 首頁卡片文字更大 */
    line-height: 1.6 !important;
}

/* 首頁特殊區塊文字 */
.hero-section p {
    font-size: 1.2rem !important;
}

/* 首頁服務概覽區塊 */
.py-5 .lead {
    font-size: 1.15rem !important;
}

/* 首頁內容段落 */
main section p {
    font-size: 1.2rem !important;
}

/* 首頁統計數字區塊 */
.hero-section .h4 {
    font-size: 1.3rem !important;
}

.hero-section small {
    font-size: 0.95rem !important;
}

/* 確保頁面正確載入 */
html {
    scroll-behavior: smooth !important;
}

/* 修復可能的版型問題 */
* {
    box-sizing: border-box;
}

*::before,
*::after {
    box-sizing: border-box;
}

/* 導航列優化 - 只改背景為深色，保持其他原本設計 */
.navbar,
.navbar.navbar-expand-lg,
nav.navbar {
    padding: 0.75rem 0 !important; /* 調整導航列高度 */
    background-color: #212529 !important; /* 深黑色背景 - 只改這個 */
    background: #212529 !important; /* 確保背景生效 */
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important; /* 更深的陰影 */
    border-bottom: 1px solid #343a40 !important;
}

.navbar-brand {
    font-size: 1.25rem; /* 調整品牌字體大小 */
    font-weight: 700;
    color: #ffffff !important; /* 白色文字 */
}

.navbar-brand:hover {
    color: #ffc107 !important; /* 懸停時金黃色 */
}

.navbar-brand img {
    height: 32px !important; /* 調整 Logo 大小 */
    width: auto;
    margin-right: 8px;
}

.navbar-nav .nav-link {
    font-size: 1rem; /* 調大導航連結字體 */
    padding: 0.5rem 0.75rem;
    font-weight: 500;
    /* 移除統一白色，讓圖標保持原本的多種顏色 */
    transition: all 0.3s ease;
}

/* 導航列多彩圖標設計 */
.navbar-nav .nav-link {
    color: #ffffff !important; /* 文字白色 */
}

.navbar-nav .nav-link:hover {
    color: #ffffff !important; /* 懸停時文字保持白色 */
}

/* 導航列圖標多種顏色 */
.navbar-nav .nav-link i.text-primary {
    color: #4dabf7 !important; /* 亮藍色 */
}

.navbar-nav .nav-link i.text-success {
    color: #51cf66 !important; /* 亮綠色 */
}

.navbar-nav .nav-link i.text-warning {
    color: #ffd43b !important; /* 亮金黃色 */
}

.navbar-nav .nav-link i.text-info {
    color: #22d3ee !important; /* 亮青色 */
}

.navbar-nav .nav-link i.text-danger {
    color: #ff6b6b !important; /* 亮紅色 */
}

/* 懸停時圖標發光效果 */
.navbar-nav .nav-link:hover i {
    filter: brightness(1.3) drop-shadow(0 0 5px currentColor);
    transform: scale(1.1);
    transition: all 0.3s ease;
}

.navbar-toggler {
    border-color: #ffffff !important;
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.8%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='m4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* 下拉選單深色主題 */
.navbar-nav .dropdown-menu {
    background-color: #343a40 !important; /* 深灰色下拉選單 */
    border: 1px solid #495057 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25) !important;
    border-radius: 8px !important;
}

.dropdown-item {
    color: #ffffff !important; /* 白色文字 */
    transition: all 0.3s ease !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: #495057 !important; /* 懸停背景 */
    color: #ffc107 !important; /* 懸停時金黃色 */
}

.dropdown-item i {
    color: inherit !important;
}

/* 導航列英文備註樣式優化 */
.dropdown-item {
    white-space: nowrap !important; /* 防止文字換行 */
    padding: 0.6rem 1.2rem !important; /* 增加內邊距 */
    font-size: 0.9rem !important;
    line-height: 1.4 !important; /* 改善行高 */
    font-weight: 500 !important; /* 稍微加粗 */
}

/* 英文備註部分樣式 */
.dropdown-item:after {
    font-size: 0.8rem !important;
    opacity: 0.8 !important;
}

/* 為較長的選單項目調整寬度 */
.dropdown-menu {
    min-width: 380px !important; /* 增加下拉選單寬度以容納更長的英文備註 */
}

/* 下拉選單圖標懸停效果 */
.dropdown-item:hover i {
    filter: brightness(1.2);
    transform: scale(1.05);
    transition: all 0.3s ease;
}

/* 舊的下拉選單樣式已移除，使用上面的深色主題版本 */

/* Hero 區塊優化 */
.hero-section {
    padding: 3.5rem 0; /* 調整垂直間距 */
    min-height: 500px; /* 確保最小高度 */
    display: flex;
    align-items: center;
}

.hero-section h1 {
    font-size: 2.25rem; /* 調整主標題大小 */
    line-height: 1.2;
    margin-bottom: 1rem;
}

.hero-section .lead {
    font-size: 1rem; /* 調整副標題大小 */
    line-height: 1.5;
    margin-bottom: 2rem;
}

.hero-section .btn {
    padding: 0.75rem 1.5rem;
    font-size: 0.95rem;
    font-weight: 600;
}

.hero-section .btn-warning {
    color: #000000 !important; /* Hero 區塊黃色按鈕黑色文字 */
}

.hero-section .btn-outline-light {
    color: #ffffff !important;
    border-color: #ffffff !important;
}

.hero-section .btn-outline-light:hover {
    background-color: #ffffff !important;
    color: #0d6efd !important;
}

/* 確保 Hero 區塊保持原本的藍色漸變設計 */
.hero-section {
    background: linear-gradient(135deg, #0d6efd 0%, #0056b3 100%) !important;
    color: white !important;
}

/* 服務卡片優化 */
.service-card {
    margin-bottom: 1.5rem; /* 統一卡片間距 */
}

.service-card .card-header {
    padding: 1.25rem; /* 從 1.5rem 調整為 1.25rem */
}

.service-card .card-header i {
    font-size: 1.75rem; /* 從 2rem 調整為 1.75rem */
    margin-bottom: 0.5rem;
}

.service-card .card-header h4 {
    font-size: 1.1rem; /* 調整卡片標題大小 */
    margin-bottom: 0.25rem;
}

.service-card .card-body {
    padding: 1.25rem; /* 從 1.5rem 調整為 1.25rem */
}

.service-card .card-footer {
    padding: 0.875rem 1.25rem; /* 調整底部區域 */
}

/* 內容區域優化 */
main {
    min-height: calc(100vh - 180px); /* 從 200px 調整為 180px */
}

/* 按鈕優化 */
.btn {
    padding: 0.5rem 1rem; /* 調整按鈕大小 */
    font-size: 0.9rem;
}

.btn-lg {
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
}

/* 容器寬度優化 */
@media (min-width: 1200px) {
    .container {
        max-width: 1200px; /* 從 1140px 調整為 1200px，更寬一些 */
    }
    
    /* 桌面版字體再大一點 */
    body {
        font-size: 1.5rem !important; /* 首頁內文再調大 */
    }
    
    .hero-section h1 {
        font-size: 3.5rem; /* 主標題更大 */
    }
    
    .hero-section .lead {
        font-size: 1.5rem; /* Hero 描述文字更大 */
    }
    
    .card-text {
        font-size: 1.5rem; /* 卡片內文更大 */
    }
    
    /* 首頁特殊內容在桌面版更大 */
    .service-card .card-text {
        font-size: 1.6rem !important; /* 首頁服務卡片文字特別大 */
    }
    
    .hero-section p {
        font-size: 1.4rem !important;
    }
    
    main section p {
        font-size: 1.45rem !important; /* 首頁段落文字更大 */
    }
    
    .navbar-nav .nav-link {
        font-size: 1.15rem;
    }
    
    .btn {
        font-size: 1.1rem;
        padding: 0.8rem 1.5rem;
    }
    
    .card-title {
        font-size: 1.5rem; /* 卡片標題更大 */
    }
    
    h2, h3, h4 {
        font-size: 1.6rem; /* 內容標題更大 */
    }
    
    h5 {
        font-size: 1.4rem;
    }
    
    p, li {
        font-size: 1.4rem; /* 段落和列表文字更大 */
    }
    
    /* Footer 在桌面版適中大小 */
    footer {
        font-size: 1.05rem !important;
    }
    
    footer h5 {
        font-size: 1.15rem !important;
    }
    
    footer p,
    footer li {
        font-size: 1rem !important;
    }
    
    footer small {
        font-size: 0.9rem !important;
    }
}

/* 響應式調整 */
@media (max-width: 768px) {
    .hero-section {
        padding: 2rem 0; /* 手機版保持較小的間距 */
    }
    
    .hero-section h1 {
        font-size: 2rem; /* 手機版標題大小 */
    }
    
    .hero-section .lead {
        font-size: 1rem;
    }
    
    .service-card .card-header {
        padding: 1rem;
    }
    
    .service-card .card-body {
        padding: 1rem;
    }
    
    .service-card .card-header i {
        font-size: 1.5rem;
    }
}

@media (min-width: 768px) and (max-width: 992px) {
    .hero-section {
        padding: 2.5rem 0; /* 平板版間距 */
    }
    
    .hero-section h1 {
        font-size: 2.25rem;
    }
    
    /* 平板版字體調整 */
    body {
        font-size: 1.08rem !important;
    }
    
    .card-text {
        font-size: 0.98rem;
    }
}

/* 改善可讀性 */
p, li {
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 1.3;
    margin-bottom: 0.75rem;
}

/* 表格優化 */
.table {
    font-size: 0.9rem;
}

/* 表單優化 */
.form-control {
    font-size: 0.95rem;
    padding: 0.5rem 0.75rem;
}

.form-label {
    font-size: 0.9rem;
    font-weight: 600;
}

/* Footer 優化 - 調整字體大小 */
footer {
    font-size: 1rem !important;
}

footer h5 {
    font-size: 1.1rem !important;
}

footer p,
footer li {
    font-size: 0.95rem !important;
}

footer small {
    font-size: 0.85rem !important;
}

footer .social-icon {
    font-size: 0.9rem !important;
}

/* 卡片內容優化 */
.card-title {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
}

.card-text {
    font-size: 0.95rem;
    line-height: 1.5;
}

/* 列表優化 */
.list-group-item {
    font-size: 0.95rem;
    padding: 0.75rem 1rem;
}

/* 導航下拉選單優化 */
.dropdown-menu {
    font-size: 0.9rem;
}

.dropdown-item {
    padding: 0.5rem 1rem;
}

/* 深色主題首頁背景 */
main {
    background-color: #1a1a1a !important; /* 深色主背景 */
}

/* 服務概覽區塊深色主題 */
section.py-5 {
    background: linear-gradient(135deg, #2c2c2c 0%, #1a1a1a 100%) !important;
}

/* 卡片在深色背景中的樣式 */
.card {
    background-color: #2d2d2d !important;
    border: 1px solid #404040 !important;
    color: #ffffff !important;
}

.card-body {
    background-color: #2d2d2d !important;
}

.card-text {
    color: #e0e0e0 !important;
}

.card-title {
    color: #ffffff !important;
}

/* 其他內容區塊深色主題 */
section {
    background-color: #1a1a1a !important;
}

/* 特殊背景區塊深色主題調整 */
.bg-light {
    background: linear-gradient(135deg, #2c2c2c 0%, #1f1f1f 100%) !important;
}

/* 背景色塊的透明度調整 */
.bg-primary.bg-opacity-10 {
    background-color: rgba(77, 171, 247, 0.2) !important; /* 更明顯的藍色透明背景 */
}

.bg-success.bg-opacity-10 {
    background-color: rgba(81, 207, 102, 0.2) !important; /* 更明顯的綠色透明背景 */
}

.bg-info.bg-opacity-10 {
    background-color: rgba(34, 211, 238, 0.2) !important; /* 更明顯的青色透明背景 */
}

.bg-warning.bg-opacity-10 {
    background-color: rgba(255, 212, 59, 0.2) !important; /* 更明顯的金黃色透明背景 */
}

.bg-danger.bg-opacity-10 {
    background-color: rgba(255, 107, 107, 0.2) !important; /* 更明顯的紅色透明背景 */
}

/* 白色背景元素在深色主題下的調整 */
.bg-white {
    background-color: #2d2d2d !important;
    color: #ffffff !important;
}

/* 確保白色文字在深色背景上清晰可見 */
.lead {
    color: #f0f0f0 !important;
}

.display-4, .display-5 {
    color: #ffffff !important;
}

/* 列表項目顏色 */
ul li, ol li {
    color: #e0e0e0 !important;
}

/* 表格深色主題 */
.table {
    color: #e0e0e0 !important;
    background-color: #2d2d2d !important;
}

.table th {
    color: #ffffff !important;
    background-color: #404040 !important;
}

.table td {
    color: #e0e0e0 !important;
    background-color: #2d2d2d !important;
}

/* 深色表格樣式 */
.table-dark {
    background-color: #2d2d2d !important;
    color: #ffffff !important;
}

.table-dark td {
    color: #ffffff !important;
    border-color: #404040 !important;
}

.table-dark th {
    color: #ffffff !important;
    border-color: #404040 !important;
}

/* 表格條紋效果在深色主題下 */
.table-striped > tbody > tr:nth-of-type(odd) > td {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

.table-hover > tbody > tr:hover > td {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* 確保價格文字顏色正確 */
.table .text-danger {
    color: #ff6b6b !important;
}

.table .text-warning {
    color: #ffd43b !important;
}

.table .text-success {
    color: #51cf66 !important;
}

.table .text-info {
    color: #22d3ee !important;
}

.table .text-primary {
    color: #4dabf7 !important;
}

.table .text-secondary {
    color: #22d3ee !important;
}

/* 確保所有圓形圖標都是完美圓形 */
.rounded-circle {
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important; /* 確保寬高比 1:1 */
}

.rounded-circle.d-inline-flex {
    flex-shrink: 0 !important; /* 防止圓形被壓縮 */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 統一圓形圖標尺寸 */
.icon-circle-sm {
    width: 40px !important;
    height: 40px !important;
}

.icon-circle-md {
    width: 60px !important;
    height: 60px !important;
}

.icon-circle-lg {
    width: 80px !important;
    height: 80px !important;
}

/* 修復所有可能看不見的文字 */
.card-body p {
    color: #e0e0e0 !important;
}

.card-body h5 {
    color: #ffffff !important;
}

/* 特殊內容區塊文字顏色 */
.feature-list li {
    color: #e0e0e0 !important;
}

.breadcrumb-item a {
    color: #c0c0c0 !important;
}

.breadcrumb-item.active {
    color: #ffffff !important;
}

/* 統計數字和小標籤 */
small {
    color: #c0c0c0 !important;
}

.h4, .h5, .h6 {
    color: #ffffff !important;
}

/* 重要通知和注意事項文字 */
.alert-info,
.alert-warning,
.alert-danger,
.alert-success {
    background-color: #2d2d2d !important;
    border-left: 4px solid;
    color: #ffffff !important;
}

.alert-info {
    border-left-color: #22d3ee !important;
}

.alert-warning {
    border-left-color: #ffd43b !important;
}

.alert-danger {
    border-left-color: #ff6b6b !important;
}

.alert-success {
    border-left-color: #51cf66 !important;
}

/* 禁止使用項目和注意事項文字 */
.text-danger,
.text-warning,
strong,
b {
    color: #ff6b6b !important; /* 重要警告用紅色 */
}

/* 特殊圖標顏色 */
.fa-exclamation-triangle {
    color: #ffd43b !important; /* 警告圖標金黃色 */
}

.fa-ban,
.fa-times-circle {
    color: #ff6b6b !important; /* 禁止圖標紅色 */
}

.fa-info-circle {
    color: #22d3ee !important; /* 資訊圖標青色 */
}

.fa-check-circle {
    color: #51cf66 !important; /* 確認圖標綠色 */
}

/* 列表項目符號和縮排 */
ul li::marker {
    color: #ffd43b !important; /* 金黃色項目符號 */
}

ol li::marker {
    color: #4dabf7 !important; /* 藍色數字符號 */
}

/* 特殊符號顏色 */
.text-center strong,
.fw-bold {
    color: #ffffff !important;
}

/* 價格和數字強調 */
.h1, .h2, .h3 {
    color: #ffffff !important;
}

/* 段落中的重點文字 */
p strong,
li strong {
    color: #ffd43b !important; /* 段落中的重點用金黃色 */
}

/* 免費贈送等特殊標籤 */
.badge {
    background-color: #51cf66 !important;
    color: #000000 !important;
    font-weight: 600 !important;
}

.badge-warning {
    background-color: #ffd43b !important;
    color: #000000 !important;
    font-weight: 600 !important;
}

.badge-danger {
    background-color: #ff6b6b !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.badge-success {
    background-color: #51cf66 !important;
    color: #000000 !important;
    font-weight: 600 !important;
}

.badge-info {
    background-color: #22d3ee !important;
    color: #000000 !important;
    font-weight: 600 !important;
}

.badge-primary {
    background-color: #4dabf7 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.badge-secondary {
    background-color: #adb5bd !important;
    color: #000000 !important;
    font-weight: 600 !important;
}

/* 按鈕內的文字確保可見 */
.btn {
    color: inherit !important;
}

.btn-primary {
    color: #ffffff !important;
}

.btn-outline-primary {
    color: #4dabf7 !important;
    border-color: #4dabf7 !important;
}

.btn-outline-primary:hover {
    background-color: #4dabf7 !important;
    color: #000000 !important;
}

/* 警告框和提示框 */
.alert {
    background-color: #2d2d2d !important;
    border: 1px solid #404040 !important;
    color: #e0e0e0 !important;
}

/* 表單元素 */
.form-control {
    background-color: #2d2d2d !important;
    border: 1px solid #404040 !important;
    color: #ffffff !important;
}

.form-control:focus {
    background-color: #2d2d2d !important;
    border-color: #ffd43b !important;
    color: #ffffff !important;
}

.form-label {
    color: #ffffff !important;
}

/* 特殊內容區塊樣式 */
.bg-light p,
.bg-light li,
.bg-light span {
    color: #e0e0e0 !important;
}

.bg-light h1,
.bg-light h2,
.bg-light h3,
.bg-light h4,
.bg-light h5,
.bg-light h6 {
    color: #ffffff !important;
}

/* 注意事項和免責聲明 */
.disclaimer,
.terms,
.notice {
    background-color: #2d2d2d !important;
    border: 1px solid #404040 !important;
    padding: 1rem !important;
    border-radius: 8px !important;
    margin: 1rem 0 !important;
}

.disclaimer p,
.terms p,
.notice p {
    color: #e0e0e0 !important;
    margin-bottom: 0.5rem !important;
}

/* 特殊符號和前綴 */
.symbol,
.prefix {
    color: #ffd43b !important; /* 金黃色符號 */
}

/* 確保所有段落文字在深色背景下可見 */
section p,
div p,
main p {
    color: #e0e0e0 !important;
}

/* 確保所有列表項目可見 */
section li,
div li,
main li {
    color: #e0e0e0 !important;
}

/* 確保所有標題可見 */
section h1, section h2, section h3, section h4, section h5, section h6,
div h1, div h2, div h3, div h4, div h5, div h6,
main h1, main h2, main h3, main h4, main h5, main h6 {
    color: #ffffff !important;
}

/* 特殊強調文字 */
.highlight {
    color: #ffd43b !important;
    font-weight: bold !important;
}

/* 價格標籤 */
.price {
    color: #51cf66 !important;
    font-weight: bold !important;
}

/* 警告標籤 */
.warning-text {
    color: #ff6b6b !important;
    font-weight: 600 !important;
}

/* 特殊格式文字處理 */
/* 處理 "免費贈送" 等特殊標籤 */
.free-gift,
.bonus {
    color: #51cf66 !important; /* 綠色表示免費/贈送 */
    font-weight: bold !important;
}

/* 處理 "注意事項" 等警告文字 */
.notice-title,
.warning-title {
    color: #ffd43b !important; /* 金黃色警告標題 */
    font-weight: bold !important;
}

/* 處理 "禁止使用" 等限制文字 */
.restriction,
.forbidden {
    color: #ff6b6b !important; /* 紅色表示禁止 */
    font-weight: 600 !important;
}

/* 處理符號 ◎ ● ○ 等 */
.bullet-point {
    color: #ffd43b !important; /* 金黃色符號 */
}

/* 技術術語和專有名詞 */
.tech-term {
    color: #22d3ee !important; /* 青色表示技術 */
    font-weight: 500 !important;
}

/* 處理包含特殊符號的段落 */
p:contains("◎"),
li:contains("◎") {
    color: #e0e0e0 !important;
}

/* 確保所有內容在深色背景下可讀 */
.content-text {
    color: #e0e0e0 !important;
    line-height: 1.7 !important;
}

/* 分隔線在深色主題下的樣式 */
hr {
    border-color: #404040 !important;
    opacity: 0.5 !important;
}

/* 表格邊框 */
.table-bordered {
    border-color: #404040 !important;
}

.table-bordered th,
.table-bordered td {
    border-color: #404040 !important;
}

/* 確保主要內容區域正確顯示 */
main {
    display: block;
    width: 100%;
}

/* 服務卡片保持原本設計 */
.service-card {
    border: 1px solid rgba(0,0,0,0.125);
    border-radius: 0.5rem;
    overflow: hidden;
    transition: all 0.3s ease;
}

.service-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

/* 服務卡片多彩設計 */
.service-card .card-header {
    color: white !important;
    border: none !important;
}

/* 第一個服務卡片 - 藍色（主機服務） */
.service-card:nth-child(1) .card-header {
    background: linear-gradient(135deg, #0d6efd, #0056b3) !important;
}

/* 第二個服務卡片 - 綠色（機房服務） */
.service-card:nth-child(2) .card-header {
    background: linear-gradient(135deg, #198754, #146c43) !important;
}

/* 第三個服務卡片 - 橙色（網路服務） */
.service-card:nth-child(3) .card-header {
    background: linear-gradient(135deg, #fd7e14, #e55a00) !important;
}

/* 服務卡片圖標顏色 */
.service-card .card-header i {
    color: #ffc107 !important; /* 統一金黃色圖標 */
    font-size: 2rem !important;
}

/* 深色主題文字顏色配置 */
h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important; /* 標題白色 */
    font-family: inherit;
}

p, li, span, div {
    color: #e0e0e0 !important; /* 內容文字淺灰色 */
}

/* 深色主題特殊文字顏色 */
.text-muted {
    color: #ffffff !important; /* 改為白色以提高可見性 */
}

.text-primary {
    color: #4dabf7 !important; /* 主要強調色 */
}

.text-success {
    color: #51cf66 !important; /* 成功色 */
}

.text-warning {
    color: #ffd43b !important; /* 警告色 */
}

.text-danger {
    color: #ff6b6b !important; /* 危險色 */
}

.text-info {
    color: #22d3ee !important; /* 資訊色 */
}

.text-secondary {
    color: #22d3ee !important; /* 次要色 - 更新為info色系，提高可見性 */
}

/* 確保所有深色背景下的文字清晰可見 */
.text-dark {
    color: #ffffff !important; /* 深色文字在深色背景下改為白色 */
}

/* 合作夥伴區塊特殊處理 - 淺色背景下的深色文字 */
section .text-dark,
.py-5 .text-dark {
    color: #212529 !important; /* 在淺色區塊中顯示深色文字 */
}

/* 確保主要內容區塊的文字顏色正確 */
main section:not(.hero-section) .text-dark {
    color: #212529 !important;
}

/* 服務卡片英文字樣式 */
.service-card .text-muted {
    color: #ffffff !important; /* 改為白色以提高可見性 */
}

.card-body .text-muted {
    color: #ffffff !important;
}

.text-black-50 {
    color: #c0c0c0 !important; /* 半透明黑色改為淺灰 */
}

/* 連結顏色 */
a {
    color: #4dabf7 !important;
}

a:hover {
    color: #ffd43b !important;
}

/* 按鈕文字顏色優化 */
.btn-warning {
    background-color: #ffc107 !important;
    border-color: #ffc107 !important;
    color: #000000 !important; /* 黃色按鈕用黑色文字 */
    font-weight: 600 !important;
}

.btn-warning:hover {
    background-color: #e0a800 !important;
    border-color: #d39e00 !important;
    color: #000000 !important; /* 懸停時保持黑色文字 */
}

.btn-warning:focus,
.btn-warning:active {
    background-color: #d39e00 !important;
    border-color: #c69500 !important;
    color: #000000 !important;
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5) !important;
}

/* 其他按鈕確保對比度 */
.btn-primary {
    color: #ffffff !important; /* 藍色按鈕白色文字 */
}

.btn-success {
    color: #ffffff !important; /* 綠色按鈕白色文字 */
}

.btn-danger {
    color: #ffffff !important; /* 紅色按鈕白色文字 */
}

.btn-info {
    color: #000000 !important; /* 青色按鈕黑色文字 */
}

.btn-secondary {
    color: #ffffff !important; /* 灰色按鈕白色文字 */
}

/* 外框按鈕樣式 */
.btn-outline-warning {
    color: #ffc107 !important;
    border-color: #ffc107 !important;
}

.btn-outline-warning:hover {
    background-color: #ffc107 !important;
    color: #000000 !important; /* 懸停時黃色背景黑色文字 */
}

.btn-outline-primary {
    color: #4dabf7 !important;
    border-color: #4dabf7 !important;
}

.btn-outline-primary:hover {
    background-color: #4dabf7 !important;
    color: #ffffff !important;
}

.btn-outline-success {
    color: #51cf66 !important;
    border-color: #51cf66 !important;
}

.btn-outline-success:hover {
    background-color: #51cf66 !important;
    color: #ffffff !important;
}

.btn-outline-secondary {
    color: #adb5bd !important;
    border-color: #adb5bd !important;
}

.btn-outline-secondary:hover {
    background-color: #adb5bd !important;
    color: #000000 !important;
}

/* 統一聯絡按鈕樣式 - 僅針對CTA區塊，不影響導航欄 */
/* 首頁底部CTA區塊的立即聯絡按鈕 */
section:has(h3:contains("準備開始使用我們的服務了嗎？")) .btn.btn-light {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

section:has(h3:contains("準備開始使用我們的服務了嗎？")) .btn.btn-light:hover {
    background-color: #0b5ed7 !important;
    border-color: #0a58ca !important;
    color: #ffffff !important;
}

/* 首頁底部CTA區塊的LINE諮詢按鈕 */
section:has(h3:contains("準備開始使用我們的服務了嗎？")) .btn.btn-success {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

section:has(h3:contains("準備開始使用我們的服務了嗎？")) .btn.btn-success:hover {
    background-color: #157347 !important;
    border-color: #146c43 !important;
    color: #ffffff !important;
}

/* 手機版導航選單過渡效果 */
@media (max-width: 991.98px) {
    .navbar-collapse {
        transition: all 0.3s ease-in-out !important;
        overflow: hidden !important;
    }
    
    .navbar-collapse:not(.show) {
        height: 0 !important;
        opacity: 0 !important;
    }
    
    .navbar-collapse.show {
        height: auto !important;
        opacity: 1 !important;
    }
}

/* 統一全站按鈕顏色 - 強制覆蓋所有Bootstrap樣式 */

/* 1. LINE按鈕優先處理（最高優先級） */
a[href*="line.me"].btn,
.btn[href*="line.me"],
.btn-success[href*="line.me"] {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

a[href*="line.me"].btn:hover,
.btn[href*="line.me"]:hover,
.btn-success[href*="line.me"]:hover {
    background-color: #157347 !important;
    border-color: #146c43 !important;
    color: #ffffff !important;
}

/* 2. 所有其他按鈕都改為深藍色（包括原本的白色、黃色等） */
.btn-light,
.btn-warning:not([href*="line.me"]),
.btn-info,
.btn-secondary,
.btn-success:not([href*="line.me"]) {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.btn-light:hover,
.btn-warning:not([href*="line.me"]):hover,
.btn-info:hover,
.btn-secondary:hover,
.btn-success:not([href*="line.me"]):hover {
    background-color: #0b5ed7 !important;
    border-color: #0a58ca !important;
    color: #ffffff !important;
}

/* 3. 針對CTA區塊的雙重保障 */
section .btn-light,
section .btn-warning:not([href*="line.me"]),
section .btn-info,
section .btn-secondary,
section .btn-success:not([href*="line.me"]) {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
    color: #ffffff !important;
}

section a[href*="line.me"].btn,
section .btn[href*="line.me"] {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: #ffffff !important;
}

/* 4. 最強制的樣式覆蓋 - 使用更高的選擇器優先級 */
.btn.btn-light,
.btn.btn-warning:not([href*="line.me"]),
.btn.btn-info,
.btn.btn-secondary,
.btn.btn-success:not([href*="line.me"]) {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

.btn.btn-light:hover,
.btn.btn-warning:not([href*="line.me"]):hover,
.btn.btn-info:hover,
.btn.btn-secondary:hover,
.btn.btn-success:not([href*="line.me"]):hover {
    background-color: #0b5ed7 !important;
    border-color: #0a58ca !important;
    color: #ffffff !important;
}

a.btn[href*="line.me"],
.btn.btn-warning[href*="line.me"],
.btn.btn-success[href*="line.me"] {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

a.btn[href*="line.me"]:hover,
.btn.btn-warning[href*="line.me"]:hover,
.btn.btn-success[href*="line.me"]:hover {
    background-color: #157347 !important;
    border-color: #146c43 !important;
    color: #ffffff !important;
}

/* 確保CTA區塊不是白色背景（但保持原本的顏色系統） */
section.bg-light {
    background: linear-gradient(135deg, #2c2c2c 0%, #1a1a1a 100%) !important;
    color: #ffffff !important;
}

/* Footer 保持原本設計，只稍微調整 */
footer {
    background-color: #212529 !important; /* 深灰色背景，不是純黑 */
    color: #ffffff !important;
}

/* 恢復原本的社交媒體圖標樣式 */
.social-icon {
    /* 移除強制深色主題，使用原本設計 */
}

/* 響應式圖片 */
img {
    max-width: 100%;
    height: auto;
}

/* 確保容器正確顯示 */
.container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

/* 恢復原本的頁面標題區塊顏色 */
.bg-primary {
    background: linear-gradient(135deg, #0d6efd 0%, #0056b3 100%) !important;
}

.bg-secondary {
    background: linear-gradient(135deg, #6c757d 0%, #5a6268 100%) !important;
}

.bg-danger {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
}

/* 深色卡片樣式 */
.card.border-0 {
    background-color: #ffffff;
    border: 1px solid rgba(0,0,0,0.125) !important;
}

/* 深色表單元素 */
.form-control:focus {
    border-color: #ffc107;
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25);
}

/* 跳過連結無障礙功能 - 確保正確隱藏 */
.skip-link {
    position: absolute !important;
    top: -40px !important;
    left: 6px !important;
    background: #0d6efd !important;
    color: white !important;
    padding: 8px 12px !important;
    text-decoration: none !important;
    z-index: 1001 !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    transition: top 0.2s ease !important;
}

.skip-link:focus {
    top: 6px !important;
    outline: 2px solid #fff !important;
    outline-offset: 2px !important;
}

.skip-link:hover {
    background: #0056b3 !important;
    color: white !important;
}