﻿/*所有規則都限定在#inlineKeypad底下——keypad.css是共用檔案，EmuTemp.aspx也有載入，
但它的小鍵盤用的是彈出式的#Ans(不是#inlineKeypad)，限定範圍才不會把這裡的排版
套用到EmuTemp.aspx的彈出鍵盤上；Default.aspx/SpeechUTT.aspx/RealeaseAENO.aspx
都是用#inlineKeypad這個id，不受影響*/
#inlineKeypad {
    text-align: center;
}

#inlineKeypad .keypad-inline {
    background: none;
    border: none;
    /*夾一個上限，避免.signin(col-lg-6)在中等寬度用視窗百分比撐版時，
    按鈕跟著無止盡放大、拖曳視窗時大小忽大忽小；上限以下靠grid的1fr
    繼續流動縮放，不會斷行*/
    width: 100%;
    max-width: 540px;
    margin: 0 auto;
}

/*兩排都是6欄，用grid的1fr比例欄位平分寬度，登入/取消跟數字鍵同寬，
連續比例縮放，不會有「剛好卡在兩個斷點中間、某一顆被擠到下一行」的縫隙*/
#inlineKeypad .keypad-row {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    width: 100%;
    margin-bottom: 8px;
}

#inlineKeypad .keypad-row:last-child {
    margin-bottom: 0;
}

#inlineKeypad .keypad-key {
    background-color: #f8f8f8;
    color: #333333;
    border: 2px solid #999;
    border-radius: 6px;
    font-weight: bold;
    box-shadow: none;
    width: auto;
    height: 48px;
    margin: 0;
    padding: 0;
    font-size: 1.2rem;
    line-height: 44px;
    box-sizing: border-box;
}

#inlineKeypad .keypad-special {
    border: 2px solid #999;
    font-family: 微軟正黑體;
    font-weight: bold;
    box-shadow: none;
    color: aliceblue;
    border-radius: 6px;
    width: auto;
    height: 48px;
    margin: 0;
    padding: 0;
    font-size: 1.2rem;
    line-height: 44px;
    box-sizing: border-box;
    white-space: nowrap;
}

#inlineKeypad .keypad-cls {
    border: 2px solid #666 !important;
    background-color: #888 !important;
}

#inlineKeypad .keypad-close {
   /* background-color: #337AB7;*/
    border: 2px solid #4a7a5e !important;
    /*color:aliceblue;*/
    border-color: #4a7a5e !important;
    background-color: #5D8D70 !important;
}
