/* PURPOSE: Contains generic css settings for RAM banner section:
    -   Institution logo
    -   Main Menu
    -   Institution/Client/Trade Name/Account filter
    -   Toolbar
    
 DATE         WHO        DESCRIPTION
 ----------   ---------  ------------------------------------
 24.06.2010   ERobinson  Issue 80938: Created
 21.10.2010   ERobinson  Issue 94567: Fix menu z-index and FF menu highlighting issues.
 14.01.2011   ERobinson  Issue 97495: Tidy up style sheets.
 20.04.2011   ERobinson  Issue 93694: Support custom logo & themes.
 17.08.2011   ERobinson  Issue 109002: Avoid min-width being set on popup windows.
 01.05.2012   ERobnison  Issue 125273: Prevent overflow in enter merchant number & trade name dialogs.
 04.01.2013   ERobinson  Issue 125190: Zoo Digital CSS refresh.
 08.01.2013   PSmigiel   Issue 125190: Zoo Digital CSS refresh.
 06.06.2013   ERobinson  Issue 125190: Uplift Switch User Merchants to be a button and give all banner popups a light
                         grey border.
 12.01.2015   ERobinson  Issue 174956: Fix alignment of elements on the Search Merchant Number and Search Trade Name
                         popups. Enforce minimum height of 16px on buttons with icons.
 25.05.2015   ERobinson  Issue 180990: Add CSS for Two Factor Authentication dialogs.
 10.02.2025   Satheesh   GPP-33431  - Standardize the font in RAM
*/
/* Base CSS ***********************************************************************************************************/


* html div#banner {
    width: expression( document.body.clientWidth < 960 ? "960px" : "auto" ); /* set min-width for IE */
}
#banner {
    min-width: 960px!important;
}
#hdr {
	float:left; margin: 0; padding: 0; width: 100%;
}
#rh-col {
    margin: 0; padding: 2px 0 0 0;
}
/* General */
.clear {
    clear: both;
}

.yui-skin-sam .yui-panel .container-close {
    background: transparent url("../images/close.png") no-repeat scroll 0 0;
}
a.logout:active {
    color: #000; outline: none; /* hide dotted outline in Firefox */
}
a.logout:active span {
    padding: 4px 5px 7px 25px; /* push text down 1px */
}
#warning {
    color: #ff0000;
}
/* END - Base CSS *****************************************************************************************************/
/* Institution and Logo Banner Base ***********************************************************************************/
/* final rule:
1. #banner-institution.height=#institution-logo.height
                             +#institution-logo.margin-top
                             +(explicit #institution-logo.margin-bottom that is not browser universal
2. #banner-institution.margin-bottom:2px where logo has solid colors
*/
#banner-institution {
    margin-bottom: 0; /*override where logo is not white*/
    /*wrong: padding-top: 10px; in firefox would make it 78*/
    /*wrong: padding: 15px; instead margin-top in institution-log*/
    /*wrong: padding-bottom: 15px; firefox needs explicit width*/
}
#banner-institution.minimized { /*banner-institution(when!)minimized*/
    height: 25px;
}
#institution-logo {
    float: left;
    display: inline-block;
    /*wrong: maring-bottom: 0px; in IE can not be changed*/
    /*remove: width: auto;*/
}
.minimized #institution-logo { /*institution-logo(inside!)minimized(div)*/
    display: none;
}
/* #links-inst-selection {
    float: right; position: relative; height: inherit; z-index: 6000;  / * IMPORTANT: Height is inherited from #banner-institution height set in each institutions logo.css file. * /
} */
#standard-links-outer {
    float: right;
    width: 550px;
}
#standard-links {
    float: right;
    font: 12px OpenSans,sans-serif;
    list-style: none;
    margin-top: 3px;
    margin-bottom: 3px;
}
#standard-links ul {
    list-style: none; margin: 0;
}
#standard-links ul li {
    background: url("../images/banner/links-divider.png") no-repeat right center; color: #898989; float: left; padding: 0 5px 0 5px; 
}
#standard-links ul li.last-link {
    background: none;
}
#standard-links a {
    color: #898989; /*text-decoration: none;*/
}
#institution-detail {
    clear: both; color: #898989; float: right; position: absolute; bottom: 0; width: 100%;
}
#institution-selection {
    float: right; margin-bottom: 3px;
}
/*
#header { position: relative; }
#header-content { position: absolute; bottom: 0; left: 0; }
*/
/* END - Institution and Logo Banner Base *****************************************************************************/
/* Main Menu **********************************************************************************************************/
#menubar {
    border:none; font-size:12px; font-family: OpenSans,sans-serif; /*REMOVEZOO*/
    /* for IE6/7 */ *font-size:11px; /* for IE Quirks Mode */ /**font:x-small;*/
    /*line-height: 20px; REMOVEZOO*/
    line-height: 15px;
}
#menubar .yuimenubar li,
#menubar .yuimenu li{
    border-bottom:2px solid #fff; list-style-type:none;
}
#menubar .yuimenubar ul,
#menubar .yuimenu ul,
#menubar .yuimenubar li,
#menubar .yuimenu li,{
    margin:0px!important;
}
#menubar ul {
    background: url("../images/nav-bg_transparent.png") repeat-x scroll 0 0; margin:0px!important; padding:0;
}
#menubar li{
    list-style-type: none; border-bottom: 2px solid #fff; margin:0px!important; border-right: 2px solid #fff;
}
#menubar .yuimenu ul {
    background: #D3D3D3; border-style: none; padding: 0;
}
#menubar .yuimenubaritemlabel {
    border-left: 0; border-top: 0; border-bottom: 0; color: #FFFFFF; margin: 0; padding: 5px 20px; text-decoration: none;
}
#menubar .yuimenubaritemlabel-selected {
    color: #000!important;
}
#menubar .yuimenubaritem-selected {
    background:#D3D3D3;
    color: #000!important;
}
#menubar .yuimenuitemlabel {
    color: #000000;
    padding: 5px 20px;
    /*remove: text-decoration:none; */
}
#menubar .yuimenuitemlabel-selected {
    color: #FFFFFF;
}
#menubar .yuimenubaritemlabel:hover {
    background:#D3D3D3; color: #FFFFFF;
    /*remove: text-decoration: none;*/
}
#menubar .yui-overlay {
    z-index: 5000;
}
.yui-skin-sam .yuimenuitem-hassubmenu-selected {
    background-image: url("../images/menuitem_submenuindicator.png"); background-position: right center; background-repeat: no-repeat;
}
/* END - Main Menu ****************************************************************************************************/
/* Menus (excluding the main menu) ************************************************************************************/
.yui-skin-sam .yuimenu {
    font: 11px OpenSans,sans-serif;
}
.yui-skin-sam .yuimenuitemlabel-selected {
    color: #FFFFFF;
}
/* END - Menus (excluding the main menu) ******************************************************************************/
/* Institution/Client/Account Filters *********************************************************************************/
#toolbar {
	float:left;
	background:url(../images/filter-options-bg.png) #145976 no-repeat bottom left; width:100%; margin-bottom: 5px; height:40px; margin: 0 auto!important; padding: 0;
}
#toolbar select {
    margin-top:10px; width:130px;
}
#filter-options {
    float: left; padding-left: 30px;
}
#filter-options .yui-button {
    background: none; border: 0; margin: 0 0; _margin:0;
}
#filter-options .yui-button .first-child {
    border:1px solid #ccc; border-style: solid; height: 17px; margin: 10px 2px; _margin: 10px 2px; background:url("../images/pagination-bg.jpg") repeat-x;
    background-position: bottom; margin-right: 1px; padding: 0; text-decoration: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}
#filter-options .yui-button:hover .first-child:hover {
    border: 1px solid #ccc; border-style: solid; height: 17px; margin: 10px 2px; _margin: 10px 2px; background: #fff; background-position: bottom; margin-right: 1px; padding: 0; text-decoration: none;
    -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}
#filter-options .yui-button button,
#filter-options .yui-button a,
#filter-options.yui-button a:visited {
	font-size: 11px; min-height: 16px; line-height: normal;
}
#merchbutton .yui-button-disabled button,
#merchbutton .yui-button-disabled a {
    color:#000; cursor:default;
}
#merchbutton button,
#tradebutton button,
#accountbutton button {
    padding: 0 20px 0 5px;
}
#copy-merch-context-menu {
    font-family: OpenSans,sans-serif; font-size:73%;
}
/* #search-merch-no-dialog, #search-trade-name-dialog border removed*/
#search-merch-no-dialog,
#search-trade-name-dialog {
    /* border: none; */
}
#search-merch-no-dialog .bd,
#search-trade-name-dialog .bd {
    background-color: #FFF; padding: 2px 2px 2px 4px; font-size: 11px; margin: 3px;
}
#search-merch-no-dialog .bd td,
#search-trade-name-dialog .bd td{
    padding-right: 3px;
}
#search-merch-no-dialog .bd input,
#search-trade-name-dialog .bd input,
#search-merch-no-dialog .bd .label,
#search-trade-name-dialog .bd .label{
    height: 20px;
    font-size: 11px;
}
#search-merch-no-dialog .yui-button,
#search-trade-name-dialog .yui-button {
    background: none; border:0; text-align: right;
}
#search-merch-no-dialog .yui-button button,
#search-trade-name-dialog .yui-button button{
    cursor:pointer; font-family:OpenSans,sans-serif; font-size: 11px; text-decoration: none; min-height: 16px; padding: 0 10px 0 20px;
}
#search-merch-no-dialog .yui-button button:hover,
#search-trade-name-dialog .yui-button button:hover {
    border:none;
}
#search-merch-no-dialog .yui-button .first-child,
#search-trade-name-dialog .yui-button .first-child {
    border:1px solid #ccc; border-style: solid; margin:0 0px; _margin:0; background:url("../images/pagination-bg.jpg") repeat-x;
    background-position: bottom; margin-right: 1px; padding: 3px 0 2px 5px; text-decoration: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}
#search-merch-no-dialog .yui-button:hover .first-child:hover,
#search-trade-name-dialog .yui-button:hover .first-child:hover {
    border: 1px solid #ccc; border-style: solid; margin:0 0px; _margin:0; background: #fff; background-position: bottom; margin-right: 1px; padding: 3px 0 2px 5px; text-decoration: none;
    -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
}
#search-merch-no-dialog .yui-button button,
#search-merch-no-dialog .yui-button a,
#search-merch-no-dialog .yui-button a:visited,
#search-trade-name-dialog .yui-button button,
#search-trade-name-dialog .yui-button a,
#search-trade-name-dialog .yui-button a:visited{
	font-size: 11px; *min-height: auto; line-height: normal;
}
#search-merch-no-dialog .icon-only button {
    height: 16px; padding: 0 10px 0 5px;
}
/*TODO:ER:include image here and update ram1.jsp as per .panelWait in commonStyle.css*/
.banner-wait {
    text-align:center;
}
#trade-name-list {
    background-color: #FFF; display: none; padding: 5px; height: 250px; margin: 1px 0; border: solid 1px #808080; overflow: auto; text-align: center; z-index: 4401;
}
#trade-name-list a {
    color: #000; text-decoration: none; text-align:left;
}
#trade-name-list-table {
    border-collapse: collapse; font: 99% OpenSans,sans-serif;
}
#trade-name-list-table tr {
    font-size: 11px; padding: 2px 0;
}
#trade-name-list-table td {
    font-size: 11px; font-family: OpenSans,sans-serif;
}
#trade-name-list-table tr.normal {
    font-size: 11px;
}
#trade-name-list-table tr:hover, tr.highlight {
    background: none repeat scroll 0 0 #E3E3E5; color: #000; cursor: pointer;
}
.yui-skin-sam .yui-button-disabled {
    background-position: 0 0;
}
/* END - Institution/Client/Account Filters ***************************************************************************/
/* Toolbar ************************************************************************************************************/
#toolbar-links-left {
    float: right; background: url(../images/toolbar/toolbar-bg-left.png) no-repeat; width: 33px; height: 40px;
}
#toolbar-links {
    float: right; background: url(../images/toolbar/toolbar-bg.png) repeat; text-align: right; height: 40px;
}
#toolbar-links-right {
    float: right; background: url(../images/toolbar/toolbar-bg-right.png) no-repeat; width: 31px; height: 40px;
}
/*background of all icons*/
a.toolbar-link {
    background: url(../images/toolbar/button-bg.png) no-repeat; margin-right: 0; display: inline-block; margin-top: 8px;
}
a.toolbar-link:hover {
    background: url(../images/toolbar/button-bg-hover.png) no-repeat;
}
/*specific icons*/ /*TODO:ER: Add toggle banner, browse history & add adjustment buttons!*/
a.faves-link {
    background: url(../images/toolbar/toolbar-faves.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.faves-link:hover {
    background: url(../images/toolbar/toolbar-faves-hover.png) no-repeat;
}
#toolbar-links .history-link  {
    background: url(../images/toolbar/history.png) no-repeat; margin-right: 1px; height:23px; width:24px;
}
a.history-link:hover {
    background: url(../images/toolbar/history-hover.png) no-repeat;
}
a.help-link {
    background: url(../images/toolbar/help.png) no-repeat; margin-right: 1px; height: 23px; width:24px;
}
a.help-link:hover {
    background: url(../images/toolbar/help-hover.png) no-repeat;
}
a.inst-link {
    background: url(../images/toolbar/institution.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.inst-link:hover {
    background: url(../images/toolbar/institution-hover.png) no-repeat;
}
a.legal-link {
    background: url(../images/toolbar/legal.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.legal-link:hover {
    background: url(../images/toolbar/legal-hover.png) no-repeat;
}
a.logout-link {
    background: url(../images/toolbar/logout.png) no-repeat; margin-right: 1px; height:23px; width:69px;
}
a.logout-link:hover {
    background: url(../images/toolbar/logout-hover.png) no-repeat;
}
a.profile-link {
    background: url(../images/toolbar/profile.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.profile-link:hover {
    background: url(../images/toolbar/profile-hover.png) no-repeat;
}
a.two-factor {
    background: url(../images/toolbar/key.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.two-factor:hover {
    background: url(../images/toolbar/key-hover.png) no-repeat;
}
a.quick-links {
    background: url(../images/toolbar/search.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.quick-links:hover {
    background: url(../images/toolbar/search-hover.png) no-repeat;
}
a.toggle-hide-link {
    background: url(../images/toolbar/toolbar-min.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.toggle-hide-link:hover {
    background: url(../images/toolbar/toolbar-min-hover.png) no-repeat;
}
a.toggle-show-link {
    background: url(../images/toolbar/toolbar-max.png) no-repeat;  margin-right: 1px; height: 23px; width: 24px;
}
a.toggle-show-link:hover {
    background: url(../images/toolbar/toolbar-max-hover.png) no-repeat;
}
a.view-link {
    background: url(../images/toolbar/view.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.view-link:hover {
    background: url(../images/toolbar/view-hover.png) no-repeat;
}
a.view-adjust {
    background: url(../images/toolbar/toolbar-adjust.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.view-adjust:hover {
    background: url(../images/toolbar/toolbar-adjust-hover.png) no-repeat;
}
a.view-ccm {
    background: url(../images/toolbar/toolbar-ccm.png) no-repeat; margin-right: 1px; height: 23px; width: 24px;
}
a.view-ccm:hover {
    background: url(../images/toolbar/toolbar-ccm-hover.png) no-repeat;
}

/* END - Toolbar ******************************************************************************************************/
/* Two Factor Authentication ******************************************************************************************/
#twofactor-req-pin-dialog,
#twofactor-verify-dialog,
#twofactor-verified-dialog {
    border: 1px solid #808080;
}
#twofactor-req-pin-dialog .hd,
#twofactor-verify-dialog .hd,
#twofactor-verified-dialog .hd {
    border-color: #FFFFFF #FFFFFF #808080; color: #000; font-family: OpenSans,sans-serif; font-size: 12px;
}
#twofactor-req-pin-dialog .bd,
#twofactor-verify-dialog .bd,
#twofactor-verified-dialog .bd {
     padding: 0 5px 5px 5px; background-color: #FFF; font:12px/1.231% OpenSans,sans-serif;
}
#twofactor-req-pin-dialog .ft,
#twofactor-verify-dialog .ft,
#twofactor-verified-dialog .ft {
    background-color: #FFF; margin-left: auto; margin-right: auto; padding: 0 5px 5px; text-align: center;
}
#twofactor-req-pin-dialog .yui-button button,
#twofactor-verify-dialog .yui-button button,
#twofactor-verified-dialog .yui-button button {
    font: 99% OpenSans,sans-serif;
    border-radius: 5px;
    min-height: 0;
    padding: 0 5px;
}
#twofactor-req-pin-dialog .button-group button:hover,
#twofactor-verify-dialog .button-group button:hover,
#twofactor-verified-dialog .button-group button:hover {
    color: #000; text-decoration: none; background: #E3E3E5 0 0; border: none;
}
#twofactor-req-pin-dialog .yui-button .first-child,
#twofactor-verify-dialog .yui-button .first-child,
#twofactor-verified-dialog .yui-button .first-child {
    padding: 3px 0 2px 0;
}
#twofactor-verify-dialog table {
    padding: 3px;
}
#twofactor-verify-dialog table.center {
    margin-left: auto;
    margin-right: auto;
}
#twofactor-verify-dialog td {
    margin: 3px;
    width: 120px;
    padding: 1px;
}
#twofactor-verify-dialog input,
#twofactor-verify-dialog font.label {
    font-size: 12px;
}
#twofactor-req-pin-dialog fieldset,
#twofactor-verify-dialog fieldset,
#twofactor-verified-dialog fieldset {
    _position : relative;  /* The underscore means only IE will see it */
    _padding : 15px;  /*  IE Hack */
    _margin: 5px;
    _display : block;
    background: none;
    padding:15px;
    border: 1px solid #ccc;
    font-family: OpenSans,sans-serif;
    font-size: 12px;
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin-top: 5px;
    text-align: center;
}
#twofactor-verify-dialog .panelMsg span,
#twofactor-req-pin-dialog .panelMsg span {
    font: 1em OpenSans,sans-serif;
}
/* END - Two Factor Authentication ************************************************************************************/
/* Quick Links ********************************************************************************************************/
#quicklinks-dialog {
    border: 1px solid #808080;
}
#quicklinks-dialog .hd {
    border-color: #FFFFFF #FFFFFF #808080; color: #000; font-family: OpenSans,sans-serif; font-size: 12px;
}
#quicklinks-dialog .bd,
#quicklinks-dialog .ft {
    background-color: #FFFFFF; padding: 2px;
}
#quicklinks-dialog .bd {
    width: 257px; height: 300px;
    overflow: hidden !important;
}
#quicklinks-gotopage {
    float: right; margin: 2px;
}
#quicklinks-dialog .button-group {
    text-align: center;
}
#quicklinks-autocomplete {
    width: 247px; padding-bottom: 300px;
}
#quicklinks-input {
    margin: 2px; width: 247px;
}
.yui-skin-sam .yui-ac-content {
    height: 267px; overflow:auto; top: 5px;
}
#quicklinks-container li.yui-ac-highlight {
    background-color: #E3E3E5; color: #000;
}
.yui-skin-sam .yui-ac {
    font: 11px OpenSans,sans-serif;
}
/* END - Quick Links **************************************************************************************************/
/* Browse History *****************************************************************************************************/

#history-dialog .hd {
    border-color: #FFFFFF #FFFFFF #808080; color: #000; font-family: OpenSans,sans-serif; font-size: 12px;
}
#history-dialog .bd {
    padding: 5px; background-color: #FFF;
}
#history-dialog .ft {
    padding: 0 5px 5px; background-color: #FFF;
}
#history-dialog .ygtvln, .ygtvtn {
    background: none; height: 0; width: 0;
}
#history-frame {
    border: solid 1px #808080; height: 150px; overflow: auto; width: 220px;
}
#history-treeview {
    font: 11px OpenSans,sans-serif;
}
#history-treeview ul {
    list-style-type: none; margin: 3px; padding: 0;
}
#history-treeview li {
    list-style-type: none; margin: 1px 0; white-space: nowrap;
}
#history-treeview li:hover {
    background-color: #E3E3E5; color: #000; cursor: pointer; list-style-type: none; margin: 1px 0;
}
#history-treeview td {
    padding:3px 0;
}
#history-treeview a {
    color: #000; text-decoration:none;
}
#history-treeview a:hover {
    background-color: #E3E3E5; color: #000; text-decoration:none;
}
/* END - Browse History ***********************************************************************************************/
/* Favourites *********************************************************************************************************/
#favourites-dialog {
    border: 1px solid #808080;
}
#favourites-dialog .hd {
    border-color: #FFFFFF #FFFFFF #808080; color: #000; font-family: OpenSans,sans-serif; font-size: 12px;
}
#favourites-dialog .bd {
    padding: 5px; background-color: #FFF; font:12px OpenSans,sans-serif;
    width: 340px !important;
    word-break: break-word !important; /* Allows long words to break */
    padding-bottom: 0 !important;
}
#favourites-dialog .ft {
    background-color: #FFF; 
    margin-left: auto; 
    margin-right: auto;
    text-align: center; 
    width: 200px;
    padding-top: 2px !important;
    padding-right: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
}
#favourites-dialog .yui-button button {
    font: 83% OpenSans,sans-serif; min-height: 0; padding: 0 5px;
}
#favourites-dialog .button-group button:hover {
    color: #000; text-decoration: none; background: #E3E3E5 0 0; border: none;
}
#favourites-frame {
    border: solid 1px #808080;
    height: 150px;
    overflow: auto;
    width: 338px !important;
}
#favourites-dialog .ygtvln, .ygtvtn {
    background: none; height: 0; width: 0;
}
#favourites-dialog .ygtvlabel:hover {    
    background-color: #E3E3E5; color: #000; text-decoration: none;
}
.yui-skin-sam .yui-tt .bd {
    background-color: #FFFAE5; border-color: #000;
}
#favourites-treeview td {
    font: 11px  OpenSans,sans-serif; white-space: nowrap;
}
#favourites-treeview a {
    color: #000;
}
#contextmenu .yuimenuitemlabel {
    font: 83%/16px OpenSans,sans-serif;
}
/* END - Favourites ***************************************************************************************************/
/* Add/Edit Favourites Popup ******************************************************************************************/
#update-favourite-dialog {
    border: 1px solid #808080;
}
#update-favourite-dialog .hd {
    border-color: #FFFFFF #FFFFFF #808080; color: #000; font-family: OpenSans,sans-serif; font-size: 12px;
}
#update-favourite-dialog .bd,
#update-favourite-dialog .ft {
    width:237px; background-color: #FFFFFF; padding: 2px; text-align: center;
}
#update-favourite-dialog .yui-button button {
    font: 83% OpenSans,sans-serif; min-height: 0; padding: 0 5px;
}
#update-favourite-dialog .button-group {
    text-align: center;
}
#update-favourite-dialog .button-group button:hover {
    color: #000; text-decoration: none; background: #E3E3E5 0 0; border: none;
}
#pagename {
    font:12px/1.231  OpenSans,sans-serif;
}
#pagealias {
    font:12px/1.231  OpenSans,sans-serif;
}
#pagealiaslabel,
#pagenamelabel {
    font-weight: bold;
}
/* END - Add/Edit Favourites Popup ************************************************************************************/
/* Error Popup ********************************************************************************************************/
#error-dialog {
    font:13px/1.231  OpenSans,sans-serif;
}
/* Favourites List Items */
.favourite-list-item {
    list-style-type: none !important;
    padding: 0px !important;
    font-size: 12px !important;
    white-space: normal !important; /* Allows wrapping if needed */
    max-width: 90% !important;
    overflow-wrap: anywhere !important;
}
.delete-favourite-btn {
    margin-left: 8px !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    vertical-align: middle !important;
}
.delete-favourite-btn img {
    width: 10px !important;
    height: 12px !important;
    cursor: pointer !important;
}

/* Quick Links List Items */
.quicklink-row {
    padding: 2px !important;
    cursor: pointer !important;
    font-size: 12px !important;
}



/* Close Link */
.container-close {
    position: absolute !important;
    right: 8px !important;
    z-index: 10 !important;
}
.container-close img {
    top: 5px !important;
    right: 4px !important;
    cursor: pointer !important;
}

/* Quicklinks Container */
#quicklinks-container {
    max-height: 250px !important;
    overflow-y: auto !important;
}

/* Dialog Buttonset Centering */
.ui-dialog .ui-dialog-buttonset {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
}

/* YUI Button Border */
.yui-skin-sam .yui-button {
    border-width: 1px !important;
}-dialog {
    border: 1px solid #808080;
}
#update-favourite-dialog .bd,
#update-favourite-dialog .ft {
    width:237px; background-color: #FFFFFF; padding: 2px; text-align: center;
}
#update-favourite-dialog .yui-button button {
    font: 83% OpenSans,sans-serif; min-height: 0; padding: 0 5px;
}
#update-favourite-dialog .button-group {
    text-align: center;
}
#update-favourite-dialog .button-group button:hover {
    color: #000; text-decoration: none; background: #E3E3E5 0 0; border: none;
}
#pagename {
    font:12px/1.231  OpenSans,sans-serif;
}
#pagealias {
    font:12px/1.231  OpenSans,sans-serif;
}
#pagealiaslabel,
#pagenamelabel {
    font-weight: bold;
}
/* END - Add/Edit Favourites Popup ************************************************************************************/
/* Error Popup ********************************************************************************************************/
#error-dialog {
    font:13px/1.231  OpenSans,sans-serif;
}
#error-dialog .hd {
    /* background: url("../images/banner/sprite.png") repeat-x scroll 0 -200px transparent; background image turned off, IE used it instead of theme colour */
    border-color: #FFFFFF #FFFFFF #808080;
    color: #000; font-family:  OpenSans,sans-serif; font-size: 12px;
}
/* END - Error Popup **************************************************************************************************/
/* User Merchants Popup ***********************************************************************************************/
div.hmenuBar {
    background-color: white;
}
div.hmenuBar a.hmenuButtonActive,
div.hmenuBar a.hmenuButtonActive:hover {
    background-color: #aaa9a6;
}
/* END - User Merchants Popup *****************************************************************************************/

.hmenuBar {
    display: none;
    width: 650px;
    height: 210px;
    border-style: solid;
    border-width: 1px;
    border-color: black;
    position: absolute;
    top: 80px;
    left: 200px;
    float: left;
}

.hmenuBar .header {
    width: 100%;
    height: 30px;
}

.hmenuBar .header table {
    width: 100%;
}

.hmenuBar .header .close-btn {
    text-align: right;
}

.hmenuBar .content {
    overflow: auto;
    width: 100%;
    height: 170px;
    border-style: none;
}
#favourites-dialog .ram-treeview {
    font-family: OpenSans, sans-serif;
    font-size: 13px;
    line-height: 1.5;
}
#favourites-dialog .ram-treeview li {
    display: list-item;
    margin-bottom: 4px;
}

#search-merch-no-dialog ~ .ui-dialog .ui-dialog-titlebar,
#search-trade-name-dialog ~ .ui-dialog .ui-dialog-titlebar,
.ui-dialog[aria-describedby="search-merch-no-dialog"] .ui-dialog-titlebar,
.ui-dialog[aria-describedby="search-trade-name-dialog"] .ui-dialog-titlebar {
    display: none !important;
}


.delete-favourite-btn {
    margin-left: 8px;
    background: none;
    border: none;
    padding: 0;
    vertical-align: middle;
}
.delete-favourite-btn img {
    width: 10px;
    height: 12px;
    cursor: pointer;
}



/* Close Link */
.container-close {
    position: absolute;
    right: 8px;
    z-index: 10;
}
.container-close img {
    top: 5px;
    right: 4px;
    cursor: pointer;
}

/* Quicklinks Container */
#quicklinks-container {
    max-height: 250px;
    overflow-y: auto;
}

/* Dialog Buttonset Centering */
.ui-dialog .ui-dialog-buttonset {
    display: flex;
    justify-content: center;
    width: 100%;
}

/* YUI Button Border */
.yui-skin-sam .yui-button {
    border-width: 1px !important;
}


/* Hide the title bar only for toolbar dialogs */
#favourites-dialog + .ui-dialog .ui-dialog-titlebar.ui-corner-all.ui-widget-header.ui-helper-clearfix,
#update-favourite-dialog + .ui-dialog .ui-dialog-titlebar.ui-corner-all.ui-widget-header.ui-helper-clearfix,
#history-dialog + .ui-dialog .ui-dialog-titlebar.ui-corner-all.ui-widget-header.ui-helper-clearfix,
#twofactor-req-pin-dialog + .ui-dialog .ui-dialog-titlebar.ui-corner-all.ui-widget-header.ui-helper-clearfix,
#twofactor-verify-dialog + .ui-dialog .ui-dialog-titlebar.ui-corner-all.ui-widget-header.ui-helper-clearfix,
#twofactor-verified-dialog + .ui-dialog .ui-dialog-titlebar.ui-corner-all.ui-widget-header.ui-helper-clearfix {
    display: none !important;
}

/* Remove padding and set background for all your dialogs */
.ui-dialog[aria-describedby="favourites-dialog"] .ui-dialog-content,
.ui-dialog[aria-describedby="history-dialog"] .ui-dialog-content,
.ui-dialog[aria-describedby="update-favourite-dialog"] .ui-dialog-content,
.ui-dialog[aria-describedby="quicklinks-dialog"] .ui-dialog-content,
.ui-dialog[aria-describedby="twofactor-req-pin-dialog"] .ui-dialog-content,
.ui-dialog[aria-describedby="twofactor-verify-dialog"] .ui-dialog-content,
.ui-dialog[aria-describedby="twofactor-verified-dialog"] .ui-dialog-content {
    padding: 0 !important;
    background: #fff !important;
}




/* Ensure jQuery UI dialog container has fixed width */
.ui-dialog[aria-describedby="favourites-dialog"],
.ui-dialog[aria-describedby="update-favourite-dialog"],
.ui-dialog[aria-describedby="history-dialog"],
.ui-dialog[aria-describedby="twofactor-req-pin-dialog"],
.ui-dialog[aria-describedby="twofactor-verify-dialog"],
.ui-dialog[aria-describedby="twofactor-verified-dialog"]{
    width: 350px !important;
    min-width: 350px !important;
    max-width: 600px !important;
}


#favourites-dialog {
    border: 1px solid #808080 !important;
    box-sizing: border-box !important;
    width: 352 !important;
}

#favourites-dialog .bd,
#favourites-dialog .ft {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
}

#favourites-treeview ul {
    margin: 2 !important;
    padding-left: 0 !important;
}

#favourites-treeview .favourite-list-item {
    padding: 0 !important;
    margin: 2 !important;
}

#twofactor-req-pin-dialog {
    height: 120px !important;
    min-height: 120px !important;
    max-height: 120px !important;
}

#req-pin-btn,#cancel-req-pin-btn,#verify-pin-btn,#cancel-verify-pin-btn,#update-priv-btn,#cancel-verified-btn {
    background-color: buttonface !important;
    border: 1px solid #ccc !important;
    border-width: 1px !important;
    font: 99% OpenSans,sans-serif;
    border-radius: 5px;
    min-height: 0;
    padding: 0 5px;
}
.ui-dialog[aria-describedby="favourites-dialog"] .ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix,
.ui-dialog[aria-describedby="update-favourite-dialog"] .ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix,
.ui-dialog[aria-describedby="history-dialog"] .ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix,
.ui-dialog[aria-describedby="twofactor-req-pin-dialog"] .ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix,
.ui-dialog[aria-describedby="twofactor-verify-dialog"] .ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix,
.ui-dialog[aria-describedby="twofactor-verified-dialog"] .ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix,
.ui-dialog[aria-describedby="quicklinks-dialog"] .ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix {
    display: flex !important;
    align-items: flex-start !important;
    background: transparent !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
}

/* Dialog Buttonpane Buttons: Only for your dialogs */
.ui-dialog[aria-describedby="favourites-dialog"] .ui-dialog-buttonpane button,
.ui-dialog[aria-describedby="update-favourite-dialog"] .ui-dialog-buttonpane button,
.ui-dialog[aria-describedby="history-dialog"] .ui-dialog-buttonpane button,
.ui-dialog[aria-describedby="twofactor-req-pin-dialog"] .ui-dialog-buttonpane button,
.ui-dialog[aria-describedby="twofactor-verify-dialog"] .ui-dialog-buttonpane button,
.ui-dialog[aria-describedby="twofactor-verified-dialog"] .ui-dialog-buttonpane button,
.ui-dialog[aria-describedby="quicklinks-dialog"] .ui-dialog-buttonpane button {
    margin: 0 !important;
}

/* Dialog Title: Only for your dialogs */
.ui-dialog[aria-describedby="favourites-dialog"] .ui-dialog-title,
.ui-dialog[aria-describedby="update-favourite-dialog"] .ui-dialog-title,
.ui-dialog[aria-describedby="history-dialog"] .ui-dialog-title,
.ui-dialog[aria-describedby="twofactor-req-pin-dialog"] .ui-dialog-title,
.ui-dialog[aria-describedby="twofactor-verify-dialog"] .ui-dialog-title,
.ui-dialog[aria-describedby="twofactor-verified-dialog"] .ui-dialog-title,
.ui-dialog[aria-describedby="quicklinks-dialog"] .ui-dialog-title {
    width: auto !important;
}


#add-current-page-btn {
    border: 1px solid #888 !important;
    border-radius: 3px;
    background: #fff; /* optional for contrast */
}

/* Remove or override for dialog rows */
#history-dialog .history-link {
    background: none !important;
    padding-left: 0 !important;
}


.ui-dialog[aria-describedby="history-dialog"] {
    border: 1px solid #888 !important;
    background: #fff !important;
    box-shadow: none !important;
}

/* Add left, top, and bottom padding to all .hd tags in toolbar dialogs */
#favourites-dialog .hd,
#update-favourite-dialog .hd,
#history-dialog .hd,
#twofactor-req-pin-dialog .hd,
#twofactor-verify-dialog .hd,
#twofactor-verified-dialog .hd,
#quicklinks-dialog .hd {
    padding-left: 8px;
    padding-top: 8px;
    padding-bottom: 8px;
}

/* Remove extra whitespace around #history-frame in the history dialog */
#history-dialog .bd {
    padding: 0 !important;
    margin: 0 !important;
}

#history-frame {
    margin: 0 !important;
    padding: 0 8px !important; /* 8px left/right padding for balance, adjust as needed */
    box-sizing: border-box;
    width: 100%;
}

/* Only apply top padding to close button in toolbar dialogs */
#favourites-dialog .container-close,
#update-favourite-dialog .container-close,
#history-dialog .container-close,
#twofactor-req-pin-dialog .container-close,
#twofactor-verify-dialog .container-close,
#twofactor-verified-dialog .container-close,
#quicklinks-dialog .container-close {
    padding-top: 4px !important;
}

/* Only apply border and whitespace to the history dialog */
.ui-dialog[aria-describedby="history-dialog"] {
    padding: 4px !important; /* whitespace between borders */
    background-clip: padding-box !important;
}

#favourites-dialog,
#favourites-dialog .ft {
    background: #fff !important; /* or your preferred color */
}
#favourites-dialog + .ui-dialog .ui-dialog-content {
    background: #fff !important;
}

/* Remove padding from your dialogs */
#favourites-dialog + .ui-dialog .ui-dialog-content,
#history-dialog + .ui-dialog .ui-dialog-content,
#update-favourite-dialog + .ui-dialog .ui-dialog-content,
#quicklinks-dialog + .ui-dialog .ui-dialog-content
 {
    padding: 0 !important;
}


/* Pin dialogs: always centered in the viewport */
#twofactor-req-pin-dialog.yui-panel-container.yui-dialog,
#twofactor-verify-dialog.yui-panel-container.yui-dialog,
#twofactor-verified-dialog.yui-panel-container.yui-dialog {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    margin: 0 !important;
    z-index: 9999 !important;
    max-width: 350px !important;
    max-height: 300px !important;
}