/*----------------------------------------------------------------------
          Order Details & Order Summary in WAX/WA/Wallet
-----------------------------------------------------------------------*/
.dataTable {border-collapse: collapse;}
.dataTable TD {font-size: 11px; font-family: Arial, Verdana; border: 1px solid #aaa; padding: 5px 10px 5px 10px; background-color: #fff;}
.dataTable TD.moneyColumn {text-align: right;}
.dataTable TD INPUT {font-size: 9px; font-family: Arial, Verdana;}
.dataTable TD.header {font-family: Arial, Verdana; font-weight: 700; background-color: #cde;}
.dataTable TD.headerMoneyColumn {font-family: Arial, Verdana; font-weight: 700; background-color: #cde; text-align: right;}
.dataTable TR.summary TD {background-color: #efefef; border-color: #efefef; text-align: right; padding-right: 0px;}
.dataTable TR.summary TD.button {background-color: #efefef; border-color: #efefef; text-align: left; padding-left: 0px;}
.dataTable TR.summary TD.moneyColumn {text-align: right; padding-right: 10px; white-space: nowrap;}
.dataTable TR.summary TD.moneyColumnEmphasis {font-family: Arial, Verdana; font-weight: bold; text-align: right; padding-right: 10px; white-space: nowrap}
.dataTable TD.spacer {border: 1px solid #fff; padding: 0px;}
.dataTable TD.spacerGrey {border: 1px solid #aaa; padding: 0px;}

.dataTable TD.noGrid {border-style: none; padding: 5px 10px 5px 0px;}
.dataTable TD.noGridSummary {border-top: 2px solid #aaa; border-right: none; border-bottom: none; border-left: none; padding: 5px 10px 5px 0px;}
/* to control margins around OrderDetails Table */
#orderDetailsArea {margin: 5px 0px 10px 0px;}

/* to handle the subscription note area in OrderDetails component */
#orderDetailsArea .note {margin: 10px 0 0 0;}