﻿/* --- 優化版：大地色系毛玻璃風格 (完美融合您的後台) --- */

/* 1. Modal 本體：微調背景色，讓它不要那麼死白 */
.glass-modal {
    /* 使用帶一點點暖灰的白，而非純白 rgba(255,255,255) */
    background: rgb(255 255 255 / 0%);
    /* 模糊濾鏡維持 */
    /*backdrop-filter: blur(12px) saturate(180%);*/
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    /* 邊框與陰影 */
    /*border: 1px solid rgba(255, 255, 255, 0.5);*/
    box-shadow: 0 25px 60px -12px rgba(0, 0, 0, 0.35);
    border-radius: 20px;
    color: #5a5a5a; /* 字體改為深灰 */
    box-shadow: 0 30px 80px rgba(0,0,0,.45);
    transform: translateY(-4px);
}

    /* 2. 按鈕大改造：古銅咖啡色漸層 */
    .glass-modal .glass-btn {
        border: none;
        color: #ffffff;
        font-weight: 600;
        letter-spacing: 1px;
        /* 陰影改成咖啡色系，不要用原本的紫色陰影 */
        box-shadow: 0 4px 12px rgba(104, 88, 72, 0.3);
        transition: all 0.25s ease;
    }

        /* 按鈕懸停效果 */
        .glass-modal .glass-btn:hover {
            transform: translateY(-2px);
            /* 變亮一點 */
            /*background: linear-gradient(135deg, #9e8e7e 0%, #7a6a5a 100%);*/
            box-shadow: 0 8px 20px rgba(104, 88, 72, 0.45);
            color: white;
        }

        .glass-modal .glass-btn:active {
            transform: translateY(0);
        }

    .glass-modal .glass-btn-primary {
        /* 這是配合您截圖中原本 '登入' 按鈕的色系 */
        background: linear-gradient(135deg, #8E7F70 0%, #685848 100%);
    }

    /* 3. Loading 動畫顏色 (如果有用 Bootstrap spinner) */
    .glass-modal .spinner-border {
        color: #685848 !important; /* 讓轉圈圈也是咖啡色 */
    }

.glass-content {
    width: 100%;
    padding: 32px 48px;
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-mask-image: radial-gradient( ellipse at center, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100% );
}
