:root {
    --cassiopeia-color-primary: #721f6e;
    --cassiopeia-color-link: #224faa;
    --link-color: #224faa;
    --link-color-rgb: 34, 79, 170;
    --cassiopeia-color-hover: #424077;
    --link-hover-color: #424077;
    --link-hover-color-rgb: 66, 64, 119;
}

input#acypagination {
    line-height: normal;
    border-color: #ddd;
    padding: 1px 0px;
    border-width: 1px;
    border-style: inherit;
    text-align: center;
}

.container-header .navbar-brand a {
    color: #fff;
}
.container-header {
    box-shadow: 0px 5px 8px #000000;
}
a.brand-logo {
    text-decoration: none;
}
.container-banner .banner-overlay .overlay .text-thin {
    font-weight: normal;
}

#acy_content fieldset {
    border: 0px solid #CCCCCC !important;
}
#acy_content .acyheader {
    font-size: 1.8rem !important;
    padding-left: unset !important;
    margin-left: unset !important;
}
#acy_newsletter_listing_menu .acyheader H1, #acy_newsletter_form_menu .acyheader H1 {
    font-size: 1.8rem;
}

.footer .grid-child {
    justify-content: space-between;
    align-items: center;
    padding: 2.5rem .5em;
    display: block;
}

.footer .grid-child .acym_module table.acym_form {
display: flex;
    align-content: center;
    align-items: stretch;
    justify-content: center;
    margin-bottom: 20px;
}
.footer .grid-child .acym_module table.acym_form .btn, .footer .grid-child .acym_module table.acym_form .btn.btn-primary {
    background-color: #da5ece;
    --btn-padding-x: .8rem;
    --btn-padding-y: .2rem;
}
/* 1. 移除全寬背景的偽元素遮罩 (通常是這個在暗) */
.banner-overlay::before {
    display: none !important;
    background: none !important;
}

/* 2. 移除內容區域的背景顏色 */
.banner-overlay .overlay, 
#mod-custom123 .overlay {
    background-color: transparent !important;
    background: none !important;
}

/* 3. 如果字體變太白看不清楚，可以幫文字加一點陰影保護 */
.banner-overlay h1, 
.banner-overlay .lead {
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8) !important;
}

/* 從這裡開始，是秘書處要我弄的NTHU Today英文訂閱內容的自訂CSS-Joomla後台->內容->文章->NTHU Newsletter Subscription */
/* ===== NTHU Today Newsletter Subscription Page ===== */
/* ===== 1. 整體版面與卡片 (緊湊、柔和陰影、現代感) ===== */
.nthu-newsletter-page {
    max-width: 540px;          /* 縮小整體寬度，讓畫面更精緻集中 */
    margin: 50px auto 80px auto;
    padding: 0 20px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.nthu-newsletter-card {
    background: #ffffff;
    border: 1px solid #f0e6f5; /* 極淡的紫灰色邊框 */
    border-radius: 24px;       /* 更圓滑的邊角 */
    box-shadow: 0 10px 40px rgba(107, 44, 145, 0.08); /* 帶有一點清大紫的柔和陰影 */
    padding: 48px 40px;
}

/* ===== 2. 標題區塊 (層次分明) ===== */
.nthu-newsletter-header {
    text-align: center;
    margin-bottom: 32px;
}

.nthu-newsletter-badge {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 50px;
    background: #f4eef9;       /* 淡紫色底 */
    color: #7c2ea0;            /* 清大紫字體 */
    font-size: 16px;           /* 作為分類標籤，精緻小巧 */
    font-weight: 700;
    /*text-transform: uppercase; /* 轉大寫，增添俐落與國際感 */
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.nthu-newsletter-header h1 {
    margin: 0 0 16px 0;
    font-size: 32px;           /* 標題大小適中 */
    line-height: 1.2;
    color: #2d2d2d;
    font-weight: 800;
}

.nthu-newsletter-header p {
    margin: 0 auto;
    color: #666;
    font-size: 16px;
    line-height: 1.6;
}

/* ===== 3. 表單輸入區塊 (乾淨、對齊) ===== */
.nthu-newsletter-form-wrap {
    width: 100%;
    margin: 0 auto;
}

/* 統一輸入框樣式 */
.nthu-newsletter-form-wrap input[type="text"],
.nthu-newsletter-form-wrap input[type="email"],
.nthu-newsletter-form-wrap input[type="password"] {
    width: 100% !important;
    box-sizing: border-box;
    padding: 14px 18px;
    border: 2px solid #eaeaea;
    border-radius: 12px;
    font-size: 16px;
    color: #333;
    transition: all 0.3s ease;
    margin-bottom: 16px;
    background: #fafafa;
}

.nthu-newsletter-form-wrap input:focus {
    border-color: #7c2ea0;
    background: #fff;
    outline: none;
    box-shadow: 0 0 0 4px rgba(124, 46, 160, 0.1); /* 點擊時的紫色發光外圈 */
}

.nthu-newsletter-form-wrap img {
    border-radius: 6px;
    vertical-align: middle;
    margin-right: 8px;
}

/* ===== 4. 按鈕區塊 (滿版垂直排列，主從分明) ===== */
.nthu-newsletter-form-wrap input[type="submit"],
.nthu-newsletter-form-wrap button,
.nthu-newsletter-form-wrap a[href*="optout"] {
    width: 100% !important;        /* 按鈕改為滿版，現代 SaaS 標準風格 */
    display: block !important;
    padding: 15px 0 !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    margin: 0 0 12px 0 !important; /* 垂直排列的間距 */
    border: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

/* 主按鈕 (Subscribe)：高調清大紫 */
.nthu-newsletter-form-wrap input[type="submit"],
.nthu-newsletter-form-wrap button[name="Submit"] {
    background: #7c2ea0 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(124, 46, 160, 0.25) !important;
}

.nthu-newsletter-form-wrap input[type="submit"]:hover,
.nthu-newsletter-form-wrap button[name="Submit"]:hover {
    background: #6a2390 !important;
    transform: translateY(-2px);
}

/* 次按鈕 (Unsubscribe)：低調淡紫灰，不搶主角風采 */
.nthu-newsletter-form-wrap input[value*="Unsubscribe"],
.nthu-newsletter-form-wrap input[value*="unsubscribe"],
.nthu-newsletter-form-wrap button[value="optout"],
.nthu-newsletter-form-wrap a[href*="optout"] {
    background: #f5f1f8 !important; 
    color: #7c2ea0 !important;      
    box-shadow: none !important;
}

.nthu-newsletter-form-wrap input[value*="Unsubscribe"]:hover,
.nthu-newsletter-form-wrap button[value="optout"]:hover,
.nthu-newsletter-form-wrap a[href*="optout"]:hover {
    background: #e8dff1 !important;
}

/* ===== 5. 提示區塊 (移至底部，弱化視覺) ===== */
.nthu-newsletter-note {
    margin: 20px auto 0 auto;
    text-align: center;
    color: #888;
    font-size: 13px;
    border-top: 1px solid #f0f0f0;
    padding-top: 20px;
}

/* RWD 手機版微調 */
@media (max-width: 600px) {
    .nthu-newsletter-card {
        padding: 36px 24px;
    }
    .nthu-newsletter-header h1 {
        font-size: 28px;
    }
}
/* 從這裡往上，是秘書處要我弄的NTHU Today英文訂閱內容的自訂CSS-Joomla後台->內容->文章->NTHU Newsletter Subscription */

