/*
 * 對外自助頁（pwdpages）的訊息呈現。
 *
 * 原本使用 p:growl（右上角浮動提示），改為 p:messages 直接排進表單，理由：
 *   1. growl 6 秒後自動消失，使用者常錯過阻擋操作的錯誤而重複送出
 *   2. 位置遠離操作焦點，寬螢幕下距離表單超過一整個螢幕寬
 *   3. 預設主題的 error 與 info 同色（藍），失敗訊息看起來像一般通知
 *   4. 與 twofactorsetupwithkey 既有的表單內紅字風格不一致
 *
 * 配色沿用 Bootstrap alert 系列，與各頁既有的紅字警語同一視覺語言。
 */

.inline-messages .ui-messages-error,
.inline-messages .ui-messages-fatal {
    background: #f2dede;
    border: 1px solid #ebccd1;
    color: #a94442;
    border-radius: 4px;
    padding: 10px 14px;
    margin: 0 0 15px 0;
    font-size: 11pt;
    line-height: 1.7;
    text-align: justify;
}

.inline-messages .ui-messages-info {
    background: #d9edf7;
    border: 1px solid #bce8f1;
    color: #31708f;
    border-radius: 4px;
    padding: 10px 14px;
    margin: 0 0 15px 0;
    font-size: 11pt;
    line-height: 1.7;
    text-align: justify;
}

.inline-messages .ui-messages-warn {
    background: #fcf8e3;
    border: 1px solid #faebcc;
    color: #8a6d3b;
    border-radius: 4px;
    padding: 10px 14px;
    margin: 0 0 15px 0;
    font-size: 11pt;
    line-height: 1.7;
    text-align: justify;
}

/* 預設主題的 icon 是點陣圖，與此處配色不合，改用 FontAwesome 字符 */
.inline-messages .ui-messages-error-icon,
.inline-messages .ui-messages-fatal-icon,
.inline-messages .ui-messages-warn-icon,
.inline-messages .ui-messages-info-icon {
    display: none;
}

.inline-messages .ui-messages-error-summary:before,
.inline-messages .ui-messages-fatal-summary:before,
.inline-messages .ui-messages-warn-summary:before {
    font-family: FontAwesome;
    content: "\f071";
    margin-right: 8px;
}

.inline-messages .ui-messages-info-summary:before {
    font-family: FontAwesome;
    content: "\f05a";
    margin-right: 8px;
}

.inline-messages ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.inline-messages li + li {
    margin-top: 6px;
}