/* COLORS */
.borderBox, .mFooter, .mHeader {
  box-sizing: border-box;
}

/* FONTS */
.fontFamilyInter, .confirmationButtonRoundGreen, .confirmationButtonRoundRed, input, textarea, select, html, body, .buttonRound, .buttonRoundDarkGreen, .buttonRoundRed, .buttonRoundBlack, .button4, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina, .btnSmall, .btnEmpty, .btnBasic, .btnBasicBlack, .btnBasicRed {
  font-family: Inter;
}

/* FONT SIZES */
.sizeReg, .mHeader, html, body, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall, .popupBody, .inputFieldLabel, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired, .button4, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina, .btnSmall, .btnEmpty, .btnBasic, .btnBasicBlack, .btnBasicRed {
  font-size: 14px;
}

.sizeMed, .headerElementTabelaSideSwipe {
  font-size: 14px;
}

/* FONT WEIGHTS */
.weightReg, .mHeader, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall, .popupBody, .inputFieldLabel, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired, .btnSmall, .btnEmpty, .btnBasic, .btnBasicBlack, .btnBasicRed {
  font-weight: 400;
}

.weightSemi, .confirmationModalContentText, .basketFooter, .headBodyFooterFooter, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .userName, .headerTabelaBig, .headerElementTabelaSideSwipe, .footerTabelaBasic, .headerTabelaBasic, .button4, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina {
  font-weight: 600;
}

/* TEXT ALIGNMENT */
.textAlignLeft, label, .groupsAndItemsBodyElementTextName, .basketHeaderTitle, .basketBodyTitle, .basketFooterTitle, .inputFieldLabel, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired {
  text-align: left;
}

.textAlignCenter, .confirmationModalContent, .delitevRacunaUpperHeaderElementText, .delitevRacunaBottomHeaderElementText, .groupsAndItemsHeaderElementText, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted, .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted, .popupBody {
  text-align: center;
}

.textAlignRight, .groupsAndItemsBodyElementTextPrice, .basketHeaderPrice, .basketBodyPrice, .basketFooterPrice, .basketHeaderPercent, .basketBodyPercent, .basketFooterPercent, .basketHeaderQty, .basketBodyQty, .basketFooterQty, .popupFooter {
  text-align: right;
}

.alignItemsCenter, #confirmationModal, .groupsAndItemsBodyElementText, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .basketBodyElement, .itemsInGroupsBodyItem, .itemsInGroupsBodyGroup, .groupsAndItemsBodyElement, .delitevRacunaUpperBodyElement, .selectorBodyElement, .basketFooter, .headBodyFooterFooter, .mHeaderIcon, .mHeader, .elementTabelaBig {
  align-items: center;
}

.alignContentCenter, #confirmationModal, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted, .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted {
  align-content: center;
}

/* POSITIONS */
.positionAbsolute, .groupsAndItemsHeaderElement::after, .groupsAndItemsHeaderElementHighlighted::after, .xPopupButton {
  position: absolute;
}

.positionRelative, .delitevRacunaUpperHeaderElementText, .delitevRacunaBottomHeaderElementText, .groupsAndItemsHeaderElementText, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted, .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted {
  position: relative;
}

.positionBlock {
  position: block;
}

/* HEIGHTS */
.heightMax, #confirmationModal, #advancedBasketEdit, #mobileContainer, html, body, .bodyTabelaBig {
  height: 100%;
}

.height14, .xPopupButton {
  height: 14px;
}

.height30, .btnSmall {
  height: 30px;
}

.height34, .mHeaderHamburgerMenu, .mHeaderIcon {
  height: 34px;
}

.height38, .confirmationButtonRoundGreen, .confirmationButtonRoundRed, input, textarea, select, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .basketBodyElement, .itemsInGroupsBodyItem, .itemsInGroupsBodyGroup, .groupsAndItemsBodyElement, .delitevRacunaUpperBodyElement, .selectorBodyElement, .basketFooter, .headBodyFooterFooter, .popupInputFieldSmall, .tabelaSideSwipe, .tabelaBasic, .footerTabelaBasic, .elementTabelaBasic, .elementTabelaSideSwipe, .headerTabelaBasic, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired, .buttonRound, .buttonRoundDarkGreen, .buttonRoundRed, .buttonRoundBlack, .button4, .btnEmpty, .btnBasic, .btnBasicBlack, .btnBasicRed {
  height: 38px;
}

.height48, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted, .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted, .elementTabelaBig, .tabelaBig, .headerTabelaBig, .headerElementTabelaSideSwipe, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina {
  height: 48px;
}

.height55, .mHeader {
  height: 55px;
}

.height90, .popupInputFieldBig, .inputFieldTextArea {
  height: 90px;
}

/* WIDTHS */
.widthMax, #confirmationModal, label, input, textarea, select, .groupsAndItemsBodyElementText, .delitevRacunaUpperBodyElement, .groupsAndItemsHeaderElement::after, .groupsAndItemsHeaderElementHighlighted::after, .groupsAndItemsHeader, .delitevRacunaUpperHeader, .delitevRacunaBottomHeader, .groupsAndItems, .delitevRacunaUpper, .delitevRacunaBottom, .basket, .mFooter, .mHeader, .popupFooter, .popupInputFieldBig, .popupBody, .tabelaBig, .headerTabelaBig, .tabelaSideSwipe, .tabelaBasic, .footerTabelaBasic, .elementTabelaBasic, .elementTabelaSideSwipe, .headerTabelaBasic, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina {
  width: 100%;
}

.widthHalf, .confirmationModalContent, .button4 {
  width: 50%;
}

.width14, .xPopupButton {
  width: 14px;
}

.width20, .icons {
  width: 20px;
}

.width38, .confirmationButtonRoundGreen, .confirmationButtonRoundRed, .buttonRound, .buttonRoundDarkGreen, .buttonRoundRed, .buttonRoundBlack {
  width: 38px;
}

.width80, .popupInputFieldSmall {
  width: 80px;
}

/* BORDERS */
.borderRadius4, input, textarea, select, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired {
  border-radius: 4px;
}

.borderTopRadius4, .confirmationModalContent, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .headerTabelaBig, .headerTabelaBasic {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.borderBottomRadius4, .confirmationModalContent, .groupsAndItemsHeaderElement::after, .groupsAndItemsHeaderElementHighlighted::after, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted, .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted, .basketFooter, .headBodyFooterFooter, .footerTabelaBasic {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.borderBottomRadius8, .headerElementTabelaSideSwipe {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.borderRadius25, .button4, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina, .btnSmall, .btnEmpty, .btnBasic, .btnBasicBlack, .btnBasicRed {
  border-radius: 25px;
}

.borderRadius50, .confirmationButtonRoundGreen, .confirmationButtonRoundRed, .buttonRound, .buttonRoundDarkGreen, .buttonRoundRed, .buttonRoundBlack {
  border-radius: 50px;
}

.borderStyleSolid {
  border-style: solid;
}

.borderStyleDotted {
  border-style: dotted;
}

.borderBottomStyleSolid, .inputFieldTextAreaRequired, .inputFieldDropDownRequired, .inputFieldRequired {
  border-bottom-style: solid;
}

.borderBottomStyleDotted {
  border-style: dotted;
}

.borderColorBlack, .btnEmpty {
  border-color: #000000;
}

.borderColorDarkOrange, .inputFieldTextAreaRequired, .inputFieldDropDownRequired, .inputFieldRequired {
  border-color: #FF5C00;
}

.borderSolid, .btnEmpty {
  border: solid;
}

.borderWidth05 {
  border-width: 0.5px;
}

.borderWidth1, .inputFieldDropDownRequired, .inputFieldRequired, .btnEmpty {
  border-width: 1px;
}

.borderWidth2, .inputFieldTextAreaRequired {
  border-width: 2px;
}

/* PADDINGS */
.paddingTop8 {
  padding-top: 8px;
}

.paddingTop10, .headBodyFooterBody, .mFooter, .mHeader, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall, .iskanjePoDavcni, .urejanjeArtikla, .aliStePrepricani, .tabelaBig, .headerTabelaBig, .tabelaSideSwipe, .tabelaBasic, .footerTabelaBasic, .elementTabelaBasic, .elementTabelaSideSwipe, .headerTabelaBasic, .inputFieldLabel, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired {
  padding-top: 10px;
}

.paddingRight4, .popupBody {
  padding-right: 4px;
}

.paddingRight10, input, textarea, select, .headBodyFooterBody, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .basketBodyElement, .itemsInGroupsBodyItem, .itemsInGroupsBodyGroup, .groupsAndItemsBodyElement, .delitevRacunaUpperBodyElement, .selectorBodyElement, .basketFooter, .headBodyFooterFooter, .mFooter, .mHeader, .popupFooter, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall, .iskanjePoDavcni, .urejanjeArtikla, .aliStePrepricani, .elementTabelaBig, .tabelaBig, .headerTabelaBig, .tabelaSideSwipe, .tabelaBasic, .footerTabelaBasic, .elementTabelaBasic, .elementTabelaSideSwipe, .headerTabelaBasic, .inputFieldLabel, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired {
  padding-right: 10px;
}

.paddingRight14, .btnSmall {
  padding-right: 14px;
}

.paddingRight20, .button4, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina, .btnEmpty, .btnBasic, .btnBasicBlack, .btnBasicRed {
  padding-right: 20px;
}

.paddingBottom8, .inputFieldLabel {
  padding-bottom: 8px;
}

.paddingBottom10, .headBodyFooterBody, .mFooter, .mHeader, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall, .iskanjePoDavcni, .urejanjeArtikla, .aliStePrepricani, .tabelaBig, .headerTabelaBig, .tabelaSideSwipe, .tabelaBasic, .footerTabelaBasic, .elementTabelaBasic, .elementTabelaSideSwipe, .headerTabelaBasic, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired {
  padding-bottom: 10px;
}

.paddingLeft4, .popupBody {
  padding-left: 4px;
}

.paddingLeft10, label, input, textarea, select, .headBodyFooterBody, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .basketBodyElement, .itemsInGroupsBodyItem, .itemsInGroupsBodyGroup, .groupsAndItemsBodyElement, .delitevRacunaUpperBodyElement, .selectorBodyElement, .basketFooter, .headBodyFooterFooter, .mFooter, .mHeader, .popupFooter, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall, .iskanjePoDavcni, .urejanjeArtikla, .aliStePrepricani, .elementTabelaBig, .tabelaBig, .headerTabelaBig, .tabelaSideSwipe, .tabelaBasic, .footerTabelaBasic, .elementTabelaBasic, .elementTabelaSideSwipe, .headerTabelaBasic, .inputFieldLabel, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired {
  padding-left: 10px;
}

.paddingLeft14, .btnSmall {
  padding-left: 14px;
}

.paddingLeft20, .button4, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina, .btnEmpty, .btnBasic, .btnBasicBlack, .btnBasicRed {
  padding-left: 20px;
}

/* MARGINS */
.marginTop4 {
  margin-top: 4px;
}

.marginTop8 {
  margin-top: 8px;
}

.marginTop10, .confirmationModalContentActions, .confirmationModalContentText, .basketActions, .itemsInGroupsActions {
  margin-top: 10px;
}

.marginTop14, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted {
  margin-top: 14px;
}

.marginRight4 {
  margin-right: 4px;
}

.marginRight8 {
  margin-right: 8px;
}

.marginRight10, .confirmationModalContentActions, .confirmationModalContentText, .basketActions, .itemsInGroupsActions, .mHeaderIcon, #divMobileBody, #eventModalKrk, #addCalendar {
  margin-right: 10px;
}

.marginRight14 {
  margin-right: 14px;
}

.marginBottom4, label {
  margin-bottom: 4px;
}

.marginBottom8 {
  margin-bottom: 8px;
}

.marginBottom10, .confirmationModalContentActions, .confirmationModalContentText, input, textarea, select, .headBodyFooterFooter, .popupFooter, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall, .popupBody, .headerElementTabelaSideSwipe {
  margin-bottom: 10px;
}

.marginBottom14, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted, .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted {
  margin-bottom: 14px;
}

.marginLeft4 {
  margin-left: 4px;
}

.marginLeft8 {
  margin-left: 8px;
}

.marginLeft10, .confirmationModalContentActions, .confirmationModalContentText, .mHeaderHamburgerMenu, #divMobileBody, #eventModalKrk, #addCalendar {
  margin-left: 10px;
}

.marginLeft14 {
  margin-left: 14px;
}

.darkGreen {
  color: #609000;
}

.darkGreenBG, .buttonRoundDarkGreen, .button3DarkGreen, .Voucher {
  background-color: #609000;
}

.green {
  color: #A8DF3B;
}

.greenBG, .confirmationButtonRoundGreen, .button3Green {
  background-color: #A8DF3B;
}

.darkBlue {
  color: #006699;
}

.darkBlueBG {
  background-color: #006699;
}

.blue {
  color: #3399CC;
}

.blueBG, .button3Blue, .Kartica {
  background-color: #3399CC;
}

.pink {
  color: #CC3399;
}

.pinkBG, .button3Pink, .X {
  background-color: #CC3399;
}

.darkRed {
  color: #BA0021;
}

.darkRedBG {
  background-color: #BA0021;
}

.darkOrange {
  color: #FF5C00;
}

.darkOrangeBG {
  background-color: #FF5C00;
}

.orange {
  color: #FF9900;
}

.orangeBG, .button3Orange, .Gotovina {
  background-color: #FF9900;
}

.yellow {
  color: #FFCC00;
}

.yellowBG, .button3Yellow {
  background-color: #FFCC00;
}

.black, label, input, textarea, select, .delitevRacunaUpperHeaderElementText, .delitevRacunaBottomHeaderElementText, .groupsAndItemsHeaderElementText, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .mHeader, .elementTabelaBig, .headerTabelaBig, .elementTabelaBasic, .elementTabelaSideSwipe, .headerTabelaBasic, .inputFieldLabel, .btnEmpty {
  color: #000000;
}

.blackBG, .basketFooter, .headBodyFooterFooter, .footerTabelaBasic, .buttonRoundBlack, .button4, .btnBasicBlack {
  background-color: #000000;
}

.white, .confirmationButtonRoundGreen, .confirmationButtonRoundRed, .basketFooter, .headBodyFooterFooter, .footerTabelaBasic, .headerTabelaBasic, .buttonRoundDarkGreen, .buttonRoundRed, .buttonRoundBlack, .button4, .button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina, .btnSmall, .btnBasic, .btnBasicBlack, .btnBasicRed {
  color: #FFFFFF;
}

.whiteBG, .confirmationModalContent, input, textarea, select, .basketBodyElement, .itemsInGroupsBodyItem, .itemsInGroupsBodyGroup, .groupsAndItemsBodyElement, .delitevRacunaUpperBodyElement, .selectorBodyElement, .mHeader, .iskanjePoDavcni, .urejanjeArtikla, .aliStePrepricani, .elementTabelaBig, .elementTabelaBasic, .elementTabelaSideSwipe, .inputFieldTextArea, .inputFieldDropDown, .inputField, .inputFieldTextAreaDisabled, .inputFieldTextAreaRequired, .inputFieldDropDownDisabled, .inputFieldDropDownRequired, .inputFieldDisabled, .inputFieldRequired {
  background-color: #FFFFFF;
}

.red {
  color: #E50000;
}

.redBG, .confirmationButtonRoundRed, .buttonRoundRed, .btnBasicRed {
  background-color: #E50000;
}

.redBGImportant {
  background-color: #E50000 !important;
}

.darkGrey {
  color: #747474;
}

.darkGreyBG, .inputFieldTextAreaDisabled, .inputFieldDropDownDisabled, .btnSmall {
  background-color: #747474;
}

.lightGrey, .popupInputField, .popupInputFieldBig, .popupInputFieldSmall {
  color: #D9D9D9;
}

.lightGreyBG {
  background-color: #D9D9D9;
}

.grey {
  color: #BABABA;
}

.greyBG, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted, .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted, .basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .headerTabelaBig, .headerTabelaBasic, .inputFieldDisabled {
  background-color: #BABABA;
}

.darkWhite {
  color: #F6F6F6;
}

.darkWhiteBG {
  background-color: #F6F6F6;
}

.lightOrange {
  color: #FFEBCC;
}

.lightOrangeBG, .basketElementHighlighted, .selectorElementHighlighted, .elementTabelaBigSelected, .elementTabelaBasicSelected {
  background-color: #FFEBCC;
}

.transparent {
  color: transparent;
}

.transparentBG, .paymentButtonSelected, .headBodyFooterFooter {
  background-color: transparent;
}

/* SCROLLABLE */
.scrollableY, #advancedBasketEdit, .groupsAndItemsBody, .delitevRacunaUpperBody, .bodyTabelaBig {
  overflow-y: auto;
}

.unScrollableY {
  overflow-y: hidden;
}

.scrollableX, .groupsAndItemsHeader, .delitevRacunaUpperHeader, .delitevRacunaBottomHeader {
  overflow-x: auto;
}

.unScrollableX {
  overflow-x: hidden;
}

/* ---------------------------------------------------- S C R E E N S ---------------------------------------------------- */
/* -------------------------------------------- S C R E E N   E L E M E N T S -------------------------------------------- */
/* ----------------------------------------------------- M O D E L S ----------------------------------------------------- */
/* BUTTONS */
.btnBasic, .btnBasicBlack, .btnBasicRed {
  border: none;
}

.btnSmall {
  border: none;
  line-height: 1;
}

.button3, .paymentButton, .button3DarkGreen, .Voucher, .button3Yellow, .button3Pink, .X, .button3Green, .button3Blue, .Kartica, .button3Orange, .Gotovina {
  border: none;
}

.button4 {
  border: none;
}

.buttonRoundBlack {
  border: none;
}

.buttonRoundRed {
  border: none;
}

.buttonRoundDarkGreen {
  border: none;
}

/* INPUT FIELDS */
/* ----------------------------------------------------- T A B L E S ----------------------------------------------------- */
.elementTabelaBasic, .elementTabelaSideSwipe {
  border-top: 1px solid #BABABA;
  border-bottom: 1px solid #BABABA;
}

.headerTabelaSideSwipe {
  overflow-x: auto;
}

.headerElementTabelaSideSwipe {
  width: 25%;
}

.headerTabelaBig {
  box-sizing: border-box;
}

.bodyTabelaBig {
  box-sizing: border-box;
}

.elementTabelaBig {
  box-sizing: border-box;
  border-top: 1px solid #BABABA;
  border-bottom: 1px solid #BABABA;
}

/* ----------------------------------------------------- P O P U P S ----------------------------------------------------- */
.xPopupButton {
  top: 0px;
  right: 0px;
}

.popupHeader {
  box-sizing: border-box;
}

.popupBody {
  box-sizing: border-box;
}

.popupFooter {
  box-sizing: border-box;
}

/* ---------------------------------------------------- L A Y O U T S ---------------------------------------------------- */
html, body {
  user-select: none !important; /* Standard syntax */
  -webkit-user-select: none !important; /* For older versions of Safari and Chrome */
  -moz-user-select: none !important; /* For older versions of Firefox */
  -ms-user-select: none !important; /* For older versions of Internet Explorer/Edge */
}

::selection {
  background-color: #3399FF; /* The color for the selected background */
  color: #ffffff; /* The color for the selected text */
}

input::selection {
  background-color: #3399FF; /* Customize for inputs if necessary */
  color: #ffffff;
}

#mobileContainer {
  display: flex; /* Activate flexbox layout */
  flex-direction: column; /* Arrange children in a vertical stack */
}

#divMobileHeader {
  flex-shrink: 0; /* Prevent header from shrinking */
}

#divMobileBody, #eventModalKrk, #addCalendar {
  flex-grow: 1; /* Allow body to grow and take up remaining space */
  scrollbar-width: none; /* Firefox */
}

#divMobileBody::-webkit-scrollbar {
  display: none; /* Webkit-based browsers */
}

#eventModalKrk::-webkit-scrollbar {
  display: none; /* Webkit-based browsers */
}

#addCalendar::-webkit-scrollbar {
  display: none; /* Webkit-based browsers */
}

#divMobileFooter {
  flex-shrink: 0; /* Prevent footer from shrinking */
}

.mHeader {
  display: flex; /* Make the container a flexbox */
  justify-content: space-between; /* Distribute space between the items */
}

.mHeaderName {
  display: flex;
  flex-direction: column; /* Aligns the spans in a vertical direction */
  align-items: left;
  flex-grow: 1;
}

.mHeaderIcon {
  display: flex;
}

.mHeaderHamburgerMenu {
  flex-shrink: 0;
}

.footerButtons {
  display: flex;
  justify-content: space-between;
}

/* ----------------------------------------------- B O D Y   L A Y O U T S ----------------------------------------------- */
/* ----------------------------------------------------- B A S K E T ----------------------------------------------------- */
.basketHeader, .itemsInGroupsHeader, .headBodyFooterHead, .popupHeader, .basketBodyElement, .itemsInGroupsBodyItem, .itemsInGroupsBodyGroup, .groupsAndItemsBodyElement, .delitevRacunaUpperBodyElement, .selectorBodyElement, .basketFooter, .headBodyFooterFooter {
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
  flex-shrink: 0;
}

.basketBody, .itemsInGroupsBody, .headBodyFooterBody {
  overflow-y: auto;
  scrollbar-width: none; /* Firefox */
}

.basketBody::-webkit-scrollbar, .itemsInGroupsBody::-webkit-scrollbar, .headBodyFooterBody::-webkit-scrollbar {
  display: none; /* Webkit-based browsers */
}

.basketBodyElement, .itemsInGroupsBodyItem, .itemsInGroupsBodyGroup, .groupsAndItemsBodyElement, .delitevRacunaUpperBodyElement, .selectorBodyElement {
  border-bottom: 0.5px solid #D9D9D9;
}

.basketHeaderTitle, .basketBodyTitle, .basketFooterTitle {
  flex: 0 0 50%;
}

.basketHeaderQty, .basketBodyQty, .basketFooterQty {
  flex: 0 0 15%;
}

.basketHeaderPercent, .basketBodyPercent, .basketFooterPercent {
  flex: 0 0 10%;
}

.basketHeaderPrice, .basketBodyPrice, .basketFooterPrice {
  flex: 0 0 25%;
}

.basketActions, .itemsInGroupsActions {
  display: flex;
  justify-content: right;
  gap: 10px;
}

/* ----- A N I M A T I O N S ----- */
.btn-loading {
  background: linear-gradient(to right, transparent 0%, transparent 50%, #FF9900 50%, #FF9900 100%);
  background-size: 200% 100%;
  animation: loading-animation 500ms linear forwards;
}

@keyframes loading-animation {
  0% {
    background-position: 0% 0;
  }
  100% {
    background-position: -100% 0;
  }
}
/* -------- S T R I P E S -------- */
.striped-red {
  background: white;
  border: 1px solid #ccc;
  margin: 3%;
}
.striped-red > h2 {
  padding: 1rem;
  margin: 0 0 0.5rem 0;
}
.striped-red > p {
  padding: 0 1rem;
}

.stripe-red2 {
  color: black;
  background: repeating-linear-gradient(45deg, transparent, transparent 10px, #ccc 10px, #ccc 20px), linear-gradient(to bottom, #eee, #999);
}

/* ------------------------------------------------ G R O U P   I T E M S ------------------------------------------------ */
/*HEADER*/
.groupsAndItemsHeader, .delitevRacunaUpperHeader, .delitevRacunaBottomHeader {
  display: flex;
  scrollbar-width: none; /* Firefox */
}

.groupsAndItemsHeader::-webkit-scrollbar {
  display: none; /* Webkit-based browsers */
}

.delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted {
  min-width: 100px;
}

.delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted {
  min-width: 100px;
}

@media (max-width: 768px) {
  .groupsAndItemsHeaderElement, .groupsAndItemsHeaderElementHighlighted, .delitevRacunaUpperHeaderElement, .delitevRacunaUpperHeaderElementHighlighted, .delitevRacunaBottomHeaderElement, .delitevRacunaBottomHeaderElementHighlighted {
    min-width: 30px;
    flex: 0 0 25%;
  }
}
.groupsAndItemsHeaderElementHighlighted {
  height: 56px;
  margin-bottom: 6px;
}

.delitevRacunaUpperHeaderElementHighlighted {
  height: 56px;
  margin-top: 6px;
}

.delitevRacunaBottomHeaderElementHighlighted {
  height: 56px;
  margin-bottom: 6px;
}

.groupsAndItemsHeaderElement::after, .groupsAndItemsHeaderElementHighlighted::after {
  content: "";
  bottom: 0;
  left: 0;
  height: 9px; /* Stripe height */
  background-color: currentColor; /* Use the stripe color from the text color */
}

/* Prevent visual effects on focus, active, or selected states */
.groupsAndItemsHeaderElement:focus, .groupsAndItemsHeaderElementHighlighted:focus, .delitevRacunaUpperHeaderElement:focus, .delitevRacunaUpperHeaderElementHighlighted:focus, .delitevRacunaBottomHeaderElement:focus, .delitevRacunaBottomHeaderElementHighlighted:focus,
.groupsAndItemsHeaderElement:active,
.groupsAndItemsHeaderElementHighlighted:active, .delitevRacunaUpperHeaderElement:active, .delitevRacunaUpperHeaderElementHighlighted:active, .delitevRacunaBottomHeaderElement:active, .delitevRacunaBottomHeaderElementHighlighted:active,
.groupsAndItemsHeaderElement.selected,
.selected.groupsAndItemsHeaderElementHighlighted, .delitevRacunaUpperHeaderElement.selected, .selected.delitevRacunaUpperHeaderElementHighlighted, .delitevRacunaBottomHeaderElement.selected, .selected.delitevRacunaBottomHeaderElementHighlighted {
  outline: none; /* Remove outline on focus */
  background-color: inherit; /* Prevent background color change */
  color: inherit; /* Prevent text color change */
}

.groupsAndItemsHeaderElementText {
  bottom: 4px;
}

/*BODY*/
.groupsAndItemsBody, .delitevRacunaUpperBody {
  flex: 1;
  display: flex;
  flex-direction: column-reverse;
}

/* Style for the text container inside body elements */
.groupsAndItemsBodyElementText, .delitevRacunaUpperBodyElement {
  display: flex;
  justify-content: space-between;
}

/* Style for the name span inside body elements */
.groupsAndItemsBodyElementTextName {
  width: 80%;
}

/* Style for the price span inside body elements */
.groupsAndItemsBodyElementTextPrice {
  width: 20%;
}

/* -------------------------------------------------- HEAD BODY FOOTER -------------------------------------------------- */
/* INPUTS */
input, textarea, select {
  box-sizing: border-box; /* Include padding and border in width and height */
  border: none;
}

input {
  outline: none; /* Removes default focus outline */
}

input:focus {
  outline: none; /* Ensures no outline on focus */
  box-shadow: none; /* Removes shadow if added */
}

/* Style for labels */
label {
  display: block; /* Block level to take full width */
  box-sizing: border-box;
}

/* PAYMENT BUTTONS */
/* Grid styling for the container */
#paymentSection {
  display: grid;
  grid-template-columns: 1fr 1fr;
  direction: rtl;
  gap: 10px;
}

#confirmationModal {
  display: none; /* Hidden by default */
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5); /* Overlay effect */
  z-index: 9999;
  justify-content: center;
}

.confirmationModalContentActions {
  justify-content: space-around;
  display: flex;
}

.confirmationButtonRoundRed {
  border: none;
}

.confirmationButtonRoundGreen {
  border: none;
}

.label-break {
  line-break: anywhere;
}

.basketBodyTitle, .groupsAndItemsBodyElementTextName, .nameItem {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/*# sourceMappingURL=main.css.map */