/* NOTE: This file was generated as an optimized version of "library.source.less" for the Theme Designer. */

/*!
 * ${copyright}
 */
@import "../base/library.less";
@import "../../../../sap/ui/core/themes/sap_hcb/global.less";

/* START "AboutDialog.less" */
.sapUshellAboutDialogHeader {
	color: @sapHCStandardFG
}
/* END "AboutDialog.less" */

/* START "AddBookmarkButton.less" */

/* ============================================= */
/* CSS for control sap.ushell/AddBookmarkButton.control */
/* ============================================= */

.sapMActionSheetPopover.sapMPopover .sapMActionSheet button.sapMActionSheetButton.sapUshellAddBookmarkButton.sapMBtnDisabled{
	color : @sapHCReducedFG;
}

.sapMActionSheetPopover.sapMPopover button.sapUshellAddBookmarkButton.sapMBtnDisabled .sapUiIcon{
	color : @sapHCReducedFG;
}

/* END "AddBookmarkButton.less" */

/* START "AnchorItem.less" */
/* ============================================= */
/* CSS for control sap.ushell/AnchorItem.control */
/* ============================================= */
@sapUshellAnchorItemNotRenderedColor: rgba(255,255,255, 0.5);
@sapUshellAnchorItemSelectedBorderWidth: @sapUshellOnePixel;

/* AnchorItem Dashboard */
//[Tags "Color"]
//[Description "Anchor bar text color"]
@sapUshellAnchorItemTextColor: @sapUiInvertedElement;

.sap-desktop .sapUshellAnchorItem,.sap-tablet .sapUshellAnchorItem {
  border: 0.1rem solid @sapUiTileBorderColor;
}

.sapUshellAnchorItem {
  font-family: @sapUiFontHeaderFamily;
  font-size: @sapMFontHeader6Size;
  font-weight: @sapUiFontHeaderWeight;
}

.sap-desktop,.sap-tablet {
  .sapUshellAnchorNavigationBar .sapUshellAnchorItemSelected {
    background-color: @sapHCHighlightAltBG;

    .sapUshellAnchorItemInner {
      border-bottom: 0.2rem transparent;
    }
  }
}

.sapUshellAnchorItemOverFlow {
  font-family: "SAP-icons";
  font-size: 1rem;
  color: @sapUiTileIconColor;
  background-color: transparent;

  button {
    background-color: transparent;
    border-style: none;
  }

  .sapUiIcon {
    font-family: "SAP-icons";
    font-size: 1rem;
    color: @sapUiTileIconColor;
    background-color: transparent;
  }

  .sapMBtnInner {
    background-color: transparent;
    background: transparent;
  }
}

.sapUshellAnchorItemsPopover {
  .sapUshellGroupLI.sapUshellAnchorPopoverItemSelected,
  .sapUshellGroupLI.sapUshellAnchorPopoverItemHidden {
    background-color: @sapUiLightestBG;
  }
}

.sapUshellAnchorItemNotRendered {
  background: -moz-linear-gradient(left, @sapUshellAnchorItemNotRenderedColor, 0, @sapUiLightestBG, 1);
  background: -webkit-gradient(linear, left top, right top, color-stop(0, @sapUshellAnchorItemNotRenderedColor), color-stop(1, @sapUiLightestBG));
  -moz-background-clip: text;
  -webkit-background-clip: text;
  -moz-text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
  -webkit-animation: slidetounlock 1s infinite;
}

.sapUshellAnchorItem:focus {
  outline: @sapUshellTwoPixels dotted @sapUshellAnchorItemTextColor;
  outline-offset: -0.2625rem;
}

.sap-desktop[data-sap-ui-browser^="ie"] .sapUshellAnchorItem:focus {
  outline: 0;
  border: @sapUshellTwoPixels dotted @sapUshellAnchorItemTextColor;
}
/* END "AnchorItem.less" */

/* START "AnchorNavigationBar.less" */
/* ============================================= */
/* CSS for control sap.ushell/AnchorNavigationBar.control */
/* ============================================= */
@sapUshellOverflowArrowsLowerGradient:              rgba(0, 0, 0, 1);
@sapUshellOverflowArrowsUpperGradient:              rgba(0, 0, 0, 0);
@sapUshellAnchorItemSelectedBorderWidth:            @sapUshellTwoPixels;

#anchorNavigationBar {
  .sapMBtn:hover>.sapMBtnHoverable {
    background-color: transparent;
  }
}

.sapUshellAnchorRightOverFlowButton, .sapUshellAnchorLeftOverFlowButton {
  .sapUiIcon {
    color: @sapUiTileIconColor;
  }
}


/* END "AnchorNavigationBar.less" */

/* START "ApplicationContainer.less" */
/* ============================================= */
/* CSS for control sap.ushell/ApplicationContainer.control theme base */
/* ============================================= */
@media (min-width: 80rem) {
  .sapUiMedia-Std-Desktop .sapUShellApplicationContainer.sapUShellApplicationContainerLimitedWidth {
    box-shadow: 0 0 2.5rem 0.125rem @sapHCShadowTint;
  }
}

.sapUshellDefaultBackground {
  background-color: @sapUiGlobalBackgroundColor;
}

/* END "ApplicationContainer.less" */

/* START "Catalog.less" */
/* SAP_HCB */

/* ============================================= */
/* CSS for control sap.ushell/Catalog */
/* ============================================= */

/* LESS Variables */
/* ============================================= */

/* Menu bar*/
@sapUshellCatalogMenuBarBackground: 					transparent;
@sapUshellCatalogMenuBarBoxShadow: 					none;

/* Search Field */
@sapUshellCatalogMenuBarSearchFieldBorderColor:		@sapUiDarkBorder; /*when not focused*/
@sapUiSelectBorderColorPressed:						@sapUiHighlight;

/* Styles */
/* ============================================= */

.sapUshellPanel {
  & > .sapUshellCatalogHeader {

    .sapUshellCatalogHeaderBar {
      background: @sapUshellCatalogMenuBarBackground;
      box-shadow: @sapUshellCatalogMenuBarBoxShadow;
      border-bottom: none;
      }
    #catalogHeader-BarLeft {

      #catalogSearch {
        .sapMSF {
          border-color: @sapUshellCatalogMenuBarSearchFieldBorderColor;
          border-style: solid;
          }
        .sapMSFB {
          border-left-color: @sapUshellCatalogMenuBarSearchFieldBorderColor;
          border-left-style: solid;
          }

        .sapMSFF {
          border-color: @sapUshellCatalogMenuBarSearchFieldBorderColor;
          border-style: solid;
          }
        }

      #catalogSearch:focus, #catalogSearch:hover {
        .sapMSFB {
          border-left-color: @sapUiSelectBorderColorPressed;
          border-left-style: solid;
          }

        .sapMSFF {
          border-color: @sapUiSelectBorderColorPressed;
          border-style: solid;
          }
        }
      }

    }

  &.sapMPanel {
    border: 0;
  }
  }

.sapUshellCatalogNewGroupBackButton{
	background-color: transparent;
}

.sapUshellAppBox {
  border: @sapUshellOnePixel solid @sapUiTileBorderColor;
}

.sapUshellAppBox {
  background: @sapUiTileBackground;
  color: @sapUiTileTextColor;
  box-shadow: 0 0 0 @sapUshellOnePixel @sapUiTileBackground;
  &:hover {
    box-shadow: 0 0 0 @sapUshellTwoPixels @sapUiTileBackground;
  }
}

/* END "Catalog.less" */

/* START "ContactSupport.less" */
/* ================================================================*/
/* CSS for control sap.ushell/ContactSupportButton.control  sap_hcb theme */
/* =============================================================== */

.sapUshellTechnicalInfoBox{
	border: @sapUshellOnePixel solid @sapHCStandardFG;
}

.sapUshellContactSupportHeaderInfoText{
	color: @sapUiLightText;
	font-size: 0.895rem;
	font-family: Arial,Helvetica,sans-serif;
	font-weight: bold;
}

/* For #technicalInfoBox */
.sapUshellContactSupportFixWidth{
 @media screen and (orientation:portrait) {
      max-width:13.82rem;
 }
}

/* END "ContactSupport.less" */

/* START "DynamicTile.less" */
/* ============================================================= */
/* CSS for control sap.ushell/DynamicTile.control sap_hcb theme */
/* ============================================================= */


.sapUshellDynamicTile {
    /* Colors for displaying dynamic tile contents (esp. large numbers, arrows, text)
    note: these values are different than the ones specified in TileBase */
    .sapUshellDynamicTileData {
        &.sapUshellDynamicTileDataNegative {
             color: @sapHCNegative;
        .sapUshellDynamicTileDataUp {border-bottom-color: @sapHCNegative; }
        .sapUshellDynamicTileDataDown {border-top-color: @sapHCNegative; }
        }

        &.sapUshellDynamicTileDataNeutral {
             color: @sapHCNeutral;
        .sapUshellDynamicTileDataUp {border-bottom-color: @sapHCNeutral; }
        .sapUshellDynamicTileDataDown {border-top-color: @sapHCNeutral; }
        }

        &.sapUshellDynamicTileDataPositive {
             color: @sapHCPositive;
        .sapUshellDynamicTileDataUp { border-bottom-color: @sapHCPositive; }
        .sapUshellDynamicTileDataDown { border-top-color: @sapHCPositive; }
        }

        &.sapUshellDynamicTileDataCritical {
             color: @sapHCCritical;
        .sapUshellDynamicTileDataUp { border-bottom-color: @sapHCCritical; }
        .sapUshellDynamicTileDataDown { border-top-color: @sapHCCritical; }
        }
    }
}

.sapUiMedia-Std-Desktop, .sapUiMedia-Std-Tablet {
  .sapUshellDynamicTile{

    /* the number */
    .sapUshellDynamicTileNumber {
      font-size: @sapUshellDynamicTileNumberFontSizeDesktop;
      font-weight: normal;
    }
    /* the scaling factor for the number */
    .sapUshellDynamicTileNumberFactor {
      font-weight: normal;
      font-size: @sapUshellDynamicTileNumberFactorFontSizeDesktop;
    }
  }

  .sapUshellDynamicTileStateArrow {
    /* Desktop */
    &.sapUshellDynamicTileDataUp, &.sapUshellDynamicTileDataDown {
      font-size: @sapUshellDynamicTileNumberFontSizeDesktop;
    }
  }
}

.sapUiMedia-Std-Phone {
  .sapUshellDynamicTile {
    /* Phone */
    /* the number */
    .sapUshellDynamicTileNumber {
      font-size:   @sapUshellDynamicTileNumberFontSizePhone;
      font-weight: normal;
    }
    /* the scaling factor for the number */
    .sapUshellDynamicTileNumberFactor {
      font-weight: normal;
      font-size:   @sapUshellDynamicTileNumberFactorFontSizePhone;
    }
  }
}
/* END "DynamicTile.less" */

/* START "EndUserFeedback.less" */
/* ================================================================*/
/* CSS for control sap.ushell/EndUserFeedback.control  sap_hcb theme */
/* =============================================================== */

.sapUshellEndUserFeedbackDialog {
  #PopoverTitle{
    font-size:1rem;
    }

  #ratingSelectionText {
    font-size: 1rem;
    }

  #ratingLabel{
    font-size: 1rem;
    }

  #technicalDataLink{
    font-size: 0.875rem;
    }
  }
/* END "EndUserFeedback.less" */

/* START "flower-standalone.less" */

//[Tags "Color"]
// [Description "Background color for the loading animation"]
@sapUshellLoadingFlowerLeafBackgroundColor:			@sapUiLightestBG;
@sapUshellBaseColorOfLeavesForSandbox:			        @sapUiLightestBG;

#fiori2-startup-flower.demo .fiori2-leaf {
  /* base color of leaves, for demo adapter: red */

  background-color: @sapUshellLoadingFlowerLeafBackgroundColor;
}
#fiori2-startup-flower.abap .fiori2-leaf {
  /* base color of leaves, for real launchpad : blue*/

  background-color: @sapUshellLoadingFlowerLeafBackgroundColor;
}
#fiori2-startup-flower.sandbox .fiori2-leaf {
  /* base color of leaves, for sandbox: pink */

  background-color: @sapUshellBaseColorOfLeavesForSandbox;
}
.fiori2-leaf {
  background-color: @sapUshellLoadingFlowerLeafBackgroundColor;
}

#fiori2-loader {

    -moz-opacity: 0.9;
    -khtml-opacity: 0.9;
    -webkit-opacity: 0.9;
    opacity: 0.9;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
    filter: alpha(opacity=90);
}
/* END "flower-standalone.less" */

/* START "GroupList.less" */
/* ============================================= */
/* CSS for controller sap.ushell/GroupList.controller */
/* ============================================= */
/* LESS Variables */
/* ============================================= */

    //[Tags "Color"]
    // [Description "Background color on hover for item in left panel"]
    @sapUshellListItemHoverBackgroundColor: @sapHCHighlightBG;
    //[Tags "Color"]
    // [Description "Background color on selected item in left panel"]
    @sapUshellListItemSelectedBackgroundColor: @sapHCHighlightAltBG;
	//[Tags "Color"]
	// [Description "Background color for item in left panel"]
	@sapUshellGroupListItemBackgroundColor: @sapHCStandardBG;
/* List Item*/
	@sapUshellListItemBackgroundColor: @sapHCStandardBG;
	@sapUshellListItemBorderBottom: @sapUshellOnePixel solid @sapHCReducedAltFG;

/* Group list*/
	@sapUshellGroupListBackgroundColor: @sapHCStandardBG;
	@sapUshellGroupListFontFamily: @sapHCStandardFG;

    @sapMFontHeader6Size: 0.875em;  //TODO: remove when constant parameter will be available
    @sapUiFontHeaderWeight: normal; //TODO: remove when constant parameter will be available

	@sapUshellGroupListFontSize: @sapMFontHeader6Size;
	@sapUshellGroupListFontWeight: @sapUiFontHeaderWeight;
	@sapUshellGroupListColor: @sapHCStandardFG;

/* Styles */
/* ============================================= */


.sapUshellGroupList{
	background-color: @sapUshellGroupListBackgroundColor;
}
.sapUshellGroupItemList{
	background-color: @sapUiExtraLightBG;
}

.sapUshellGroupListItem.sapMLIB {
	background-color: @sapUshellListItemBackgroundColor;
	border-bottom: @sapUshellListItemBorderBottom;
}
.sapUshellGroupListItem .sapMSLITitleOnly {
	color: @sapUshellGroupListColor;
	font-size: @sapUshellGroupListFontSize;
	font-family: @sapUshellGroupListFontFamily;
	font-weight: @sapUshellGroupListFontWeight;
}
.sapUshellDefaultGroupItem.sapMLIB {
	background-color: @sapUshellGroupListItemBackgroundColor;
}
.sapUshellDefaultGroupItem .sapMSLITitleOnly {
	color: @sapUshellGroupListColor;
	font-size: @sapUshellGroupListFontSize;
	font-family: @sapUshellGroupListFontFamily;
	font-weight: @sapUshellGroupListFontWeight;
}
.sapUshellGroupListItem.sapUshellOver {
    background-color: @sapUshellListItemHoverBackgroundColor;
}
.sapUshellGroupListItem.sapUshellSelected {
    background-color: @sapUshellListItemSelectedBackgroundColor;
}
.sapUshellDefaultGroupItem.sapUshellOver {
  background-color: @sapUshellListItemHoverBackgroundColor;
}
.sapUshellDefaultGroupItem.sapUshellSelected {
  background-color: @sapUshellListItemSelectedBackgroundColor;
}
.sapUshellDefaultGroupItem:active,
.sapUshellGroupListItem:active {
    @media @query-desktop { background-color: @sapUshellListItemHoverBackgroundColor; }
}

.sap-desktop .sapUshellDefaultGroupItem:hover,
.sap-desktop .sapUshellGroupListItem:hover {
    background-color: @sapUshellListItemHoverBackgroundColor;
}

/* END "GroupList.less" */

/* START "HistoryScreen.less" */
/* ${copyright} */


#searchHistoryScreen, #searchContainerHistoryScreen, .sapMHistoryScreen {
    .sapUshellHistoryScreenRecentSearches {
        .sapMListUl {
            border-bottom: @sapUshellOnePixel solid @sapHCStandardFG;
            border-top: none;
            .sapMSLITitleOnly {
                color: @sapHCStandardFG;
            }
        }
    }
}

/* END "HistoryScreen.less" */

/* START "LoadingDialog.less" */
/* ================================================================*/
/* CSS for control sap.ushell/LoadingDialog.control  sap_hcb theme */
/* =============================================================== */

.sapUshellLoadingDialogControl {


.sapUiIcon {
    font-size: 2.5rem;
    color: @sapUiLightText;
}

.sapUshellLoadingDialogLabel {

    font-size: 1.5em;
    font-weight: bold;
}
}

/* Phone */
@media @query-phone {
    .sapUshellLoadingDialog {
    .sapUiIcon {
        font-size: 1.88rem !important;
    }

    .sapUshellLoadingDialogLabel {
        font-size: 1.3em;
    }
}
}

/* END "LoadingDialog.less" */

/* START "MeArea.less" */
@sapUshellImageBorder:                                    fade(@sapUiShellTextColor, 15);
@sapUshellRecentActivitiesLine:				fade(@sapUiButtonTextColor, 40);

#overflowActions-overflowButton .sapMBtnHoverable {
  background-color: transparent;
  border-color: transparent;
}

#overflowActions-overflowButton .sapMToggleBtnPressed .sapMBtnIcon {
  background-color: @sapUiShellActiveBackground;
}
/* END "MeArea.less" */

/* START "PictureTile.less" */
@sapUiBtnBGTransparentDown: @sapUiHighlight;

.sapCaUiPTDeleteButton .sapUiIcon:before {
	background-color: @sapUiWhiteBG;
	color: @sapUiText;
}

.sapMBtn.sapCaUiPTDeleteButton.sapMBtnActive {
	background-color: transparent;
}

.sapCaUiPTDeleteButton.sapMBtnActive .sapUiIcon:before {
	color: @sapUiBtnBGTransparentDown;	

}
	


/* END "PictureTile.less" */

/* START "PlusTile.less" */
/* ============================================= */
/* CSS for control sap.ushell/PlusTile.control sap_hcb theme*/
/* ============================================= */

/* General Plus Tile */
@sapUshellPlusTileBoxColorBackground:          fade(@sapShell_Background,0);
@sapUshellPlusTileBoxBorderColor:              @sapUiMediumBorder;

@sapUshellPlusTileIconColor:                    fade(@sapHCStandardFG,100);
@sapUshellPlusTileIconColorHover:              fade(@sapHCStandardFG,100);

.sapUshellTile.sapUshellPlusTile {

    background-color:   @sapUshellPlusTileBoxColorBackground;
    border-color:       @sapUiTileBorderColor;

    &:hover {
      box-shadow:   0 0 0 @sapUshellOnePixel  @sapUiTileBorderColor;
    }

    &:hover .sapUiIcon {
        color: @sapUiTileIconColor;
    }

    &:focus {
        outline: 0.2rem dotted @sapUiHcStandardForeground;
        outline-offset: 0.125rem;
    }

    .sapUiIcon {
        color:                @sapUiTileIconColor;
        font-size:            @sapUshellPlusTileIconFontSize;
    }
}
/* END "PlusTile.less" */

/* START "SearchFacet.less" */


/* END "SearchFacet.less" */

/* START "SearchFieldGroup.less" */
/******** search button in head end area ********/

#sf {
    width: 2.5rem
}

#sf:before {
    border-right: @sapUshellOnePixel solid transparent;
}

#sf span {
    margin-left: 0;
    margin-right: 0
}


/******** suggestion ********/

#searchFieldInShell-input-popup {
    i {
        color: @sapUiAccent7; //sapUiContentMarkerTextColor not known
    }
}
/* END "SearchFieldGroup.less" */

/* START "SearchPieChart.less" */
/*****************/


/*** Pie Chart ***/


/*****************/

.sapUshellSearchFacetPieChart {
	height: 160px;
	width: 278px;
}

g.sap-piechart {
	shape-rendering: crispEdges;
	color: #000000;
	font-family: Arial, sans-serif;
	font-size: 14px;
}

g.sap-piechart text.label {
	fill: white;
	font-size: 100%;
	/*not larger, otherwise the labels would be higher than the bars */
	text-align: left;
}

g.sap-piechart text.labelshadow {
	stroke: white;
	stroke-width: 0;
	stroke-linejoin: round;
	font-size: 100%;
	opacity: 0.1;
	/* FIXME: does not work   filter: url("#feGaussianBlur2"); */
}

.sap-workareaitem-centered .sap-piechart {
	/* bigger font for centralized chart*/
	color: #000000;
	font-family: Arial, sans-serif;
	font-size: 14px;
}

svg.sap-piechart path:hover {
	cursor: pointer;
	opacity: 1;
	/*     stroke: #dadada;
    stroke-width: 5; */
}

svg.sap-piechart path {
	opacity: 0.5;
	/*     stroke: white;
    stroke-width: 1; */
}

.sap-workareaitem-centered .sap-piechart path {
	opacity: 0.5;
	/*     stroke: white;
    stroke-width: 1; */
}

.sap-workareaitem-centered .sap-piechart path:hover {
	opacity: 1;
	/*     stroke: #dadada;
    stroke-width: 12; */
}

div.sap-piechart-background {
	display: inline-block;
	overflow: hidden;
}

line.left {
	stroke: red;
}

line.right {
	stroke: green;
}

line.perimeterLeft {
	stroke: red;
	stroke-width: 2;
	stroke-dasharray: 5, 3;
}

line.perimeterRight {
	stroke: green;
	stroke-width: 2;
	stroke-dasharray: 5, 3;
}

line.helper {
	stroke: #000000;
}

line.helper2 {
	opacity: 0.3;
}

rect.labelPadding {
	fill: blue;
	opacity: 0.3;
}
/* END "SearchPieChart.less" */

/* START "SearchTileContainer.less" */

/* END "SearchTileContainer.less" */

/* START "ShellFloatingAction.less" */
/* ============================================= */
/* CSS for control sap.ushell/ui/Shell/ShellFloatingAction sap_hcb theme*/
/* ============================================= */
.sapUshellShellFloatingAction div {
  border: @sapUshellTwoPixels solid @sapHCStandardFG;

  .sapUiIcon {
    margin: -@sapUshellOnePixel -@sapUshellOnePixel 0 -@sapUshellOnePixel;
  }
}

.sapUshellShellFloatingAction.sapUshellActive {
  .sapMBtnInner {
    background-color: @sapHCHighlightAltBG;
  }

  .sapMBtnInner:hover {
    background-color: @sapUiHighlight;
  }
}

.sapUshellShellFloatingAction .sapMBtnInner:focus {
  border: @sapUshellTwoPixels dotted @sapHCStandardFG;
}

.sapUshellShellFloatingAction:focus>.sapMBtnInner.sapMFocusable {
  border-radius: 1.25rem;
  border: @sapUshellTwoPixels dotted @sapHCStandardFG;
}

.sapUshellShellFloatingAction:focus>.sapMBtnInner.sapMFocusable:not(.sapMBtnActive){
  border-radius: 1.25rem;
  border: @sapUshellTwoPixels dotted @sapHCStandardFG;
}
/* END "ShellFloatingAction.less" */

/* START "ShellHeader.less" */
/* ================================================== */
/* CSS for sap.ui.unfied.ShellHeader.control (hcb)    */
/* ================================================== */

//[Tags "Color"]
//[Description "Color of title in header"]
@sapUshellShellHeaderTitleColor: @sapUiShellBorderColor;

.sapUiMedia-Std-Desktop .sapUshellShellHeadItm:hover > span {
	background-color: @sapHCHighlightBG;
}

.sapUshellShellHeadItm {
	margin-right: 0.25rem;
  > span {
    border: 1px solid @sapUiShellBorderColor;
    border-radius: 0.25rem;
    font-weight: normal;
    font-size: @sapUshellShellHeaderBarHeight / 2;
    color: @sapUiTileIconColor;
    height: 2.25rem;
    line-height: 2.125rem;
    margin-right: 0.5rem;
    margin-top: 0.125rem;
    padding: 1px;
    width: 2.25rem;
    -webkit-font-smoothing: antialiased;
  }
}

.sapUshellShellHeadAction {
    color: @sapUiBaseText;
  }

.sapUshellShellHeadItm:active > span,
.sapUshellShellHeadItm:active:hover > span,
.sapUiMedia-Std-Desktop .sapUshellShellHeadItm:active:hover > span,
.sapUiMedia-Std-Desktop .sapUshellShellHeadItm:hover > span,
.sapUiMedia-Std-Desktop .sapUshellShellHeadAction:hover > *,
.sapUiMedia-Std-Desktop .sapUshellShellHeadAction:hover:active > *,
.sapUshellShellHeadAction:active > *,
.sapUshellShellHeadItm.sapUshellShellHeadItmSel > span,
.sapUshellShellHeadItm.sapUshellShellHeadItmSel:active > span,
.sapUshellShellHeadItm.sapUshellShellHeadItmSel:active:hover > span {
  background-color: @sapUiButtonHoverBackground;
  }

.sapUshellShellHeadItm.sapUshellShellHeadItmSel:hover > span {
  background-color: darken(@sapUiHighlight, 5%);
  }

.sapUshellShellHeadActionImg {
	border: 1px solid @sapHCStandardFG;
	height: 2.25rem;
	line-height: 2.125rem;
	margin-top: 0;
	padding-top: 1px;
}

.sapUshellShellHeadActionImg {
  font-weight: normal;
  font-size: @sapUshellShellHeaderBarHeight / 2;
  }

.sapUiMedia-Std-Phone .sapUshellShellHeadAction:focus .sapUshellShellHeadActionImg {
	border-right: 2px dotted @sapHCStandardFG;
	padding-right: 0.5rem;
}

.sapUshellShellHeadItm:focus > span{
	border: 2px dotted @sapHCStandardFG;
	border-radius: 0;
	padding: 0;
}

.sapUshellHeadTitle {
  color: @sapUshellShellHeaderTitleColor;
}


/** --------------------------------------- **/
/** Styles for Shell Title's Navigation Menu**/
/** --------------------------------------- **/

#sapUshellAppTitlePopover .sapMBar {
  border-bottom: 0 !important;
}

.sapUshellAppTitle {
  color: @sapUiShellTextColor;
}
.sapUshellAppTitleClickable:hover {
  background-color: @sapUiButtonHoverBackground;
  border-radius: 0.2rem;
}
.sapUshellAppTitleClickable:active {
  background-color: @sapUiButtonActiveBackground;
  color: @sapUiLinkActive !important;
  text-shadow: 0 0 0 0 !important;
  border-radius: 0.2rem;
}
.sapUshellAppTitle:focus {
  outline: @sapUshellTwoPixels dotted @sapUiFieldFocusBorderColor;
  margin-top: @sapUshellOnePixel;
}

/** Hierarchy Items - (List Items) Icon Styles **/
.sapUshellNavigationMenuListItems {
  color: @sapUiListBackground;
}
.sapUshellNavigationMenuListItems:not(:last-child) .sapMLIBContent:after {
  background: @sapHCStandardFG;
}
.sapUshellNavigationMenuListItems:not(:first-child) .sapMLIBContent:before {
  background: @sapHCStandardFG;
}

.sapUshellNavigationMenuListItems .sapMSLIImgIcon,
.sapUshellNavigationMenuTitleItem .sapMSLIImgIcon{
  color: @sapUiContentLabelColor;
}

/** Hierarchy Items - (List Items) - Text **/
.sapUshellNavigationMenuListItems .sapMSLITitleOnly {
  color: @sapUiHighlightTextColor;
}
.sapUshellNavigationMenuListItems .sapMSLITitle {
  color: @sapUiHighlightTextColor;
}
.sapUshellNavigationMenuListItems .sapMSLIDescription {
  color: @sapUiHighlightTextColor;
}

/** Shell Application Title control **/

/** Shell Navigation Menu - ResponsivePopover**/
#sapUshellAppTitlePopover {
  background-color: @sapUiListBackground;
}

/** Shell Navigation Menu - related Apps grid (within a flexbox) - override the text-tab-bar content area height **/
#sapUshellAppTitlePopover .sapMITBContent {
  background-color: @sapUiButtonBackground;
}

/** Shell Navigation Menu - Popover Header color override **/
#sapUshellAppTitlePopover .sapMIBar.sapMHeader-CTX {
  background-color: @sapUiListBackground;
}

/** Shell Navigation Menu - override background color*/
#sapUshellNavMenuTabBar {
  background-color: @sapUiListBackground;
}
/** Shell Navigation Menu - override to style of the text-tab-bar head area background color**/
#sapUshellNavMenuTabBar .sapMITH {
  background-color: @sapUiListBackground;
}

#sapUshellNavMenuTabBar .sapMITBContainerContent {
  border: 0;
  border-top: 0.125rem solid @sapHCStandardFG;
}

/** Shell Navigation Menu - Mini Tiles (of relatedApps)**/
    .sapUshellNavMiniTile {
  background-color: @sapUiListBackground;
  box-shadow: 0 0 0 @sapUshellOnePixel @sapHCStandardFG;
}

.sapUshellNavMiniTile:hover {
  box-shadow: 0 0 0 @sapUshellTwoPixels @sapHCStandardFG;
  background-color: @sapUiButtonHoverBackground;
}
.sapUshellNavMiniTile:active {
  box-shadow: 0 0 0 @sapUshellTwoPixels @sapHCStandardFG;
  background-color: @sapUiButtonHoverBackground;
}
.sapUshellNavMiniTile:focus {
  box-shadow: 0 0 0 @sapUshellTwoPixels @sapHCStandardFG;
  background-color: @sapUiButtonHoverBackground;
}

/** Shell Navigation Menu - Mini Tiles - Title **/
.sapUshellNavMiniTileTitle{
  color: @sapUiHighlightTextColor;
}
/** Shell Navigation Menu - Mini Tiles - Subtitle **/
.sapUshellNavMiniTileSubtitle{
  color: @sapUiHighlightTextColor;
}

/** Shell Navigation Menu - Mini Tiles - Icon **/
.sapUshellNavMiniTileIcon{
  color: @sapUiBrand;
}

.sapUshellShellHeadItmCounter:after{
  background: @sapUiContentBadgeBackground;
}
/* END "ShellHeader.less" */

/* START "ShellLayout.less" */
/* ==================================================== */
/* CSS for sap.ui.unfied.ShellLayout.control (hcb)      */
/* ==================================================== */


/* END "ShellLayout.less" */

/* START "SplitContainer.less" */
.sapUshellSpltContPane {
	background-color: @sapHCStandardBG;
}

/* END "SplitContainer.less" */

/* START "Tile.less" */
/* ============================================= */
/* CSS for control sap.ushell/Tile.control */
/* ============================================= */

/* LESS Variables */
/* ============================================= */

/* General Tile Colors */
//[Tags "Color"]
// [Description "Background color for tiles"]
@sapUshellTileBackgroundColor:					@sapUiLightestBG;
@sapUshellTileTextColor:							@sapUiHeaderText;

@sapUiFontHeaderFamily: @sapUiFontFamily;
@sapUiHeaderText: @sapUiDarkText;

/* Tile Border */
@sapUshellTileBorderColor: 						@sapUiMediumBorder;

/* Tile Shadow */
@sapUshellTileShadowDimensions:					0 0 @sapUshellTileShadowWidth;
@sapUshellTileShadowColor:							fade(@sapUiShadowTint,10);

/* Tile Footer (plus button in tile catalog) */
@sapUshellTileFooterBorder:						@sapUiDarkBorder;
@sapUshellTileFooterFontSize:						1rem;
@sapUshellTileFooterIconColor:						@sapUiLightText;
@sapUshellTileBorderThicknessHcb:                  @sapUshellOnePixel;
@sapUshellTileBorderColor: 						@sapUiMediumBorder;

/* Styles */
/* ============================================= */

.sapUshellTile:focus::after {
  border: 0.125rem dotted @sapUiContentFocusColor;
}

.sapUshellTile:hover {
    box-shadow: 0 0 0 @sapUshellOnePixel @sapUiTileBorderColor;
    border-radius: 0.375rem;
}

.sapUshellTile {
    background: @sapUiTileBackground;
    -moz-box-shadow: @sapUshellTileShadowDimensions @sapUshellTileShadowColor;
    -webkit-box-shadow: @sapUshellTileShadowDimensions @sapUshellTileShadowColor;
    box-shadow: @sapUshellTileShadowDimensions @sapUshellTileShadowColor;
    border: @sapUshellTileBorderThicknessHcb solid @sapUiTileBorderColor;
    color: @sapUiTileBorderColor;
    -moz-box-sizing:    border-box;
    -webkit-box-sizing: border-box;
    box-sizing:         border-box;
    border-radius: 0.375rem;
    padding: 0 2px 2px 0;
    &:focus{
      outline: 0.2rem dotted @sapUiHcStandardForeground;
      outline-offset: 0.125rem;

      .sapMGT {
        border-color: @sapUiLightestBorder;
        background-color: transparent;
      }
    }
	footer {

		text-align: @sapUshellTileFooterTextAlignment;


		& > * {
			background: @sapUshellTileFooterBorder;

			.sapUiIcon {
				line-height: @sapUshellTileFooterLineHeight;
				font-size: @sapUshellTileFooterFontSize;
				color: @sapUshellTileFooterIconColor;
				position: @sapUshellTileFooterPosition;
				top: @sapUshellTileFooterPositionTop;
			}

			.sapMBtnInner{
				height: 2rem;
                -moz-box-shadow: inset 0 @sapUshellTwoPixels 0.19rem 0 rgba(0,0,0, 0.1);
				-webkit-box-shadow: inset 0 @sapUshellTwoPixels 0.19rem 0 rgba(0,0,0, 0.1);
				box-shadow: inset 0 @sapUshellTwoPixels 0.19rem 0 rgba(0,0,0, 0.1);
			}

			&:first-child {
				border-bottom-left-radius: @sapUshellTileFooterLineHeight;
			}
			&:last-child {
				border-bottom-right-radius: @sapUshellTileFooterLineHeight;
			}

            &.sapMBtn:focus>.sapMBtnInner.sapMFocusable {
              border: none;
              top: 0.125rem;
              outline: @sapUshellTwoPixels dotted @sapUiLightestBorder;
            }
		}
	}
}

.sapUshellTileFooterInfoNegative {
  color: @sapUiNegativeElement;
}

.sapUshellTileFooterInfoNeutral {
  color: @sapUiNeutralElement
}

.sapUshellTileFooterInfoPositive {
  color: @sapUiPositiveElement
}

.sapUshellTileFooterInfoCritical {
  color: @sapUiCriticalElement;
}
/* END "Tile.less" */

/* START "TileBase.less" */
/* ============================================= */
/* CSS for control sap.ushell/TileBase.control theme sap_hcb*/
/* ============================================= */
.sapUiMedia-Std-Desktop .sapUshellTileBase:hover {
  .sapMBtnInner {
    box-shadow: inset 0 @sapUshellTwoPixels 0 0 @sapUiLightShadowTint;
  }
}

.sapUshellTileBase {
  &:hover, &:active {
    box-shadow: 0 0 0 @sapUshellTwoPixels @sapUiContentShadowColor;
  }
  box-shadow: none;
  color: @sapHCStandardFG;

  .sapUshellTileBaseNeutral {color: @sapHCNeutral;}
  .sapUshellTileBasePositive {color: @sapHCPositive;}

  .sapUshellTileBaseTitle {
    font-weight: @sapUshellTileBaseTitleFontWeight;
    font-family: @sapUshellTileBaseTitleFontFamily;
    font-size:          @sapUshellTileBaseTitleFontSizeDesktop;

    b {
      font-weight: inherit;
    }
  }

  .sapUshellTileBaseSubtitle {
    font-weight: @sapUshellTileBaseSubtitleFontWeight;
    font-family: @sapUshellTileBaseSubtitleFontFamily;
    font-size: @sapUshellTileBaseSubtitleFontSizeDesktop;

    b {
      font-weight: inherit;
    }
  }

  .sapUshellTileBaseIcon {
    font-size: @sapUshellTileBaseIconFontSizeDesktop;
  }

  .sapUshellTileBaseInfo {

    font-weight: @sapUshellTileBaseBottomlineFontWeight;
    font-family: @sapUshellTileBaseBottomlineFontFamily;
    font-size:   @sapUshellTileBaseBottomlineFontSizeDesktop;

    &.sapUshellTileBaseNeutral {color: @sapHCNeutral;}
    &.sapUshellTileBasePositive {color: @sapHCPositive;}

    b {
      font-weight: inherit;
    }
  }
  &:focus{
    outline: 0.2rem dotted @sapUiHcStandardForeground;
    outline-offset: 0.125rem;
  }
}

.sapUiMedia-Std-Phone .sapUshellTileBase {
  /* Phone */

  .sapUshellTileBaseTitle {
    font-size: @sapUshellTileBaseTitleFontSizePhone;
  }

  .sapUshellTileBaseSubtitle {
    font-size: @sapUshellTileBaseSubtitleFontSizePhone;
  }

  .sapUshellTileBaseIcon {
    font-size: @sapUshellTileBaseIconFontSizePhone;
  }

  .sapUshellTileBaseInfo {
    font-size: @sapUshellTileBaseBottomlineFontSizePhone;
  }
}


/* END "TileBase.less" */

/* START "TileContainer.less" */
/* ============================================= */
/* CSS for control sap.ushell/TileContainer.control */
/* ============================================= */

/* LESS Variables */
/* ============================================= */

/* TileContainer Dashboard */
  //[Tags "Color"]
  //[Description "Group header title text color"]
    @sapUshellGroupHeaderTitleColor:                                            @sapUiGroupTitleTextColor; //Since @sapUiTextInverted parameter is not stable yet, we use white color here.
	@sapUshellTileContainerDashboardGroupTitleFontFamily:						@sapUiFontHeaderFamily;
	@sapUshellTileContainerDashboardGroupTitleFontWeight:						@sapUiFontHeaderWeight;
	@sapUshellTileContainerCloneColor:                                         @sapHCHighlightAltBG;
    @sapUshellTileContainerPlaceholderColor:                                   @sapHCStandardFG;
    
    @sapUshellTileContainerBorder:                                             0.0625rem;
    @sapUshellTileContainerOffsetForBorder:                                    2 * @sapUshellTileContainerBorder;
	
	/* Desktop */
	@sapUshellTileContainerDashboardGroupTitleFontSizeDesktop:                 @sapMFontHeader2Size;

	/* Phone */
	@sapUshellTileContainerDashboardGroupTitleFontSizePhone:                   @sapMFontHeader4Size;

			
    /* TileContainer Catalog */
	@sapUshellTileContainerCatalogGroupTitleFontFamily:						@sapUiFontFamily;
	@sapUshellTileContainerCatalogGroupTitleFontWeight:						normal;

/* Styles */
/* ============================================= */

.sapUshellTileContainerLocked h2:after{
	color: @sapHCStandardFG;
}

/* Only TileContainers located on the dashboard */
.sapUshellDashboardGroupsContainer,#cloneArea {
    .sapUshellContainerTitle{
        font-family: @sapUshellTileContainerDashboardGroupTitleFontFamily;
        font-weight: @sapUshellTileContainerDashboardGroupTitleFontWeight;
    }
}

.sapUiMedia-Std-Desktop, .sapUiMedia-Std-Tablet {
  .sapUshellContainerTitle {
    color: @sapUshellGroupHeaderTitleColor;
    font-size: @sapUshellTileContainerDashboardGroupTitleFontSizeDesktop;
  }
  .sapUshellTileContainerTitleInput {
    ::-webkit-input-placeholder {
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizeDesktop;
    }
    :-moz-placeholder {
      /* older Firefox*/
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizeDesktop;
    }
    ::-moz-placeholder {
      /* Firefox 19+ */
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizeDesktop;
    }
    :-ms-input-placeholder {
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizeDesktop;
    }
    label {
      /* ie */
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizeDesktop;
      margin-top: 0.125rem;
    }
  }
  .sapUshellTileContainerTitleInput input{
    font-size: @sapUshellTileContainerDashboardGroupTitleFontSizeDesktop;
  }
}

.sapUiMedia-Std-Phone {
  .sapUshellContainerTitle {
    color: @sapUshellGroupHeaderTitleColor;
    font-size: @sapUshellTileContainerDashboardGroupTitleFontSizePhone;
  }
  .sapUshellTileContainerTitleInput {
    ::-webkit-input-placeholder {
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizePhone;
    }
    :-moz-placeholder {
      /* older Firefox*/
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizePhone;
    }
    ::-moz-placeholder {
      /* Firefox 19+ */
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizePhone;
    }
    :-ms-input-placeholder {
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizePhone;
    }
    label {
      font-size: @sapUshellTileContainerDashboardGroupTitleFontSizePhone;
    }
  }

  .sapUshellTileContainerTitleInput input{
    font-size: @sapUshellTileContainerDashboardGroupTitleFontSizePhone;
  }
}

  /* Only TileContainers located on the catalog */
  .sapUshellCatalog {
    .sapUshellTileContainerContent{
      h3 {
        font-family: @sapUshellTileContainerCatalogGroupTitleFontFamily;
        font-weight: @sapUshellTileContainerCatalogGroupTitleFontWeight;
        margin-top : 0;
        margin-bottom: 0rem;
        padding-bottom: 1rem;
      }
    }
  }

  .sapUshellTileContainerContent {
    .sapUshellNoFilteredItems{
      font-size: 1rem !important;
    }

    .sapUshellInner:after {
      font-size: 0;
    }
  }

  .sapUshellTilesContainerSeparator {
    border-bottom: @sapUshellOnePixel solid #fff;
    margin-right: 0.5rem;
    margin-top: 0.5rem;
  }

  .sapUshellLinkTile:focus {
     outline-color: #ffffff;
  }
  .sapUshellTileContainerHeader:focus {
    outline: 0.125rem dotted @sapUiContentFocusColor;
  }

  .sapUshellDashboardGroupsContainer .sapUshellTileContainerContent {
    &:focus {
      border-color: @sapHCStandardFG;
    }
  }

  #dashboardGroups .sapUshellDashboardGroupsContainerItem-placeholder {
    border: 0.125rem dashed @sapUshellTileContainerPlaceholderColor;
    background-color: transparent;
    border-radius: 0.375rem;

    .sapUshellTileContainerEditMode {
      background: transparent;
    }
  }
  .sapUshellDashboardGroupsContainerItem.sapUshellDashboardGroupsContainerItem-clone {

    .sapUshellContainerTitle {
      background-color: @sapUshellTileContainerCloneColor;
      font-weight: inherit;
    }
  }

  .sapUshellTileContainerEditMode {
    border : @sapUshellTileContainerBorder solid;
    border-color: @sapUiShellBorderColor;
    border-radius: 0.375rem;
  }

  .sapUshellContainerIcon {
    font-size: 1rem;
  }

  .sapUshellTileContainer {
    .sapUshellTileContainerBeforeContent, .sapUshellTileContainerAfterContent {

      .sapUshellAddGroupButton {
        .sapMBtnIcon {
          font-size: 1.0rem;
        }
        div {
          font-size:   1.25rem;
        }
      }
    }
  }

.sapUshellGroupBackgroundContainer {display: none;}

.sapUshellTileContainer .sapFCard:focus::after {
  border: @sapUshellTwoPixels dotted @sapUiContentFocusColor;
}
/* END "TileContainer.less" */

/* START "TileState.less" */

/* ============================================= */
/* CSS for control sap.ushell.ui.launchpad/TileState.control */
/* ============================================= */

.sapUshellGT {
    &:hover, &:active {
      box-shadow: 0 0 0 @sapUshellTwoPixels @sapUiContentShadowColor;
    }
    box-shadow: none;
    background: @sapHCStandardFG;
    position: relative;
}

.sapUshellOverlay {
    background-color: @sapUiBaseBG;
}

.sapUshellTileStateFtrFldTxt {
    font-weight: normal;
    font-family: @sapUiFontFamily;
    font-size: @sapMFontMediumSize;
    color:@sapHCStandardFG;
}

/* END "TileState.less" */

/* START "UserPreferencesButton.less" */
/* ============================================= */
/* CSS for control sap.ushell/UserPreferencesButton.control sap_hcb theme*/
/* ============================================= */
.sapUshellUserPrefUserIdentifier {
    border-bottom: @sapUshellOnePixel solid @sapHCReducedAltFG;
    background-color: @sapHCStandardBG;
}
/* END "UserPreferencesButton.less" */

/* START "ActionMode.less" */
/* SAP_HCB */

.sapUshellTileDeleteIconOuterClass {
  color: @sapUiLightestBorder;
  background: @sapHCStandardBG;
}

.sapUshellTileDeleteIconInnerClass {
  color: @sapUiLightestBorder;
}

.sapUshellTileDeleteIconInnerClass:focus {
  border: 1px dotted @sapHCStandardFG;
}

.sapUshellTileDeleteClickArea:hover {
  .sapUshellTileDeleteIconOuterClass {
    background: @sapHCHighlightBG;
  }
}

.sapUshellTileDeleteIconOuterClass:hover {
  background: @sapHCHighlightBG;
}

// actopms
.sapUshellTileActionIconDivBottom {
  background: @sapUiTileBackground;
}

.sapUshellTile:hover .sapUshellTileActionIconDivBottom {
  color: @sapUiBrand;
}
/* END "ActionMode.less" */
