:root {
  --f7-font-size:           16px !important;
  font-size:                16px !important;
  --osm-color-main:         #514244;

  --osm-color-primary:      #514244;
  --osm-color-primary_2 :   #E0DAC9;

  --osm-color-secondary :   #A76d35;
  --osm-color-secondary_2 : #e0d0b4;

  --osm-color-orange :      #F37021;
  --osm-color-orange_2 :    #FEE6D3;

  --osm-color-green :       #00AE4D;
  --osm-color-green_2 :     #E5F1D4;

  --osm-color-blue :        #0072BC;
  --osm-color-blue_2 :      #DCE6F5;

  --osm-color-red :         #BC0014;
  --osm-color-red_2 :       #F5DFDC;

  --osm-color-yellow :      #BCA800;
  --osm-color-yellow_2 :    #F3F5DC;
  --f7-appbar-offset:       0px;

  --dt-row-selected:        244, 244, 244, 50 !important;
  --dt-row-selected-text:   0, 0, 0 !important;



  --vh:                     100%;
  --vh-safe:                calc(var(--f7-safe-area-top) + var(--f7-safe-area-bottom));
  --vh-oc-conv:             calc(94vh - 3em - var(--f7-navbar-height) - var(--f7-safe-area-top) - var(--f7-toolbar-height) - var(--f7-safe-area-bottom));
  --vh-oc-media-review:     calc(100vh - 3em - var(--f7-navbar-height) - var(--f7-safe-area-top) - var(--f7-toolbar-height) - var(--f7-safe-area-bottom));

  /*
  --vh:                     100%;
  --vh-safe:                calc(var(--f7-safe-area-top));
  --vh-oc-conv:             calc(94vh - 3em - var(--f7-navbar-height) - var(--f7-safe-area-top) - var(--f7-toolbar-height) - var(--f7-safe-area-bottom) - var(--f7-safe-area-bottom));
  --vh-oc-media-review:     calc(100vh - 3em - var(--f7-navbar-height) - var(--f7-safe-area-top) - var(--f7-toolbar-height) - var(--f7-safe-area-bottom) - var(--f7-safe-area-bottom));
  */
}

:host {
  --f7-font-size: 16px !important;
  font-size: 16px !important;

}

.page {
  /* height: calc(100% - var(--f7-safe-area-bottom)) !important; */
  height: 100% !important;
  overflow-y: hidden;
}


body {
  color: #514343;
  font-weight: 300;
  font-size: 0.8em;
  overflow-y: hidden;
  scrollbar-width: 1px;
}

.block-header.tabLinks {
  margin: 5px ;
}

.navbar .title {
  text-align: center;
  width: 100%;
  color: black !important;
}

.toolbar-bottom {
  box-shadow: 1px 0px 15px 2px rgba(0,0,0,0.2);
}

.navbar .navbar-bg {
  background-color: #FCFCFB !important;
}

.page-content {
  background-color: #FCFCFB !important;
}

.toolbar-inner .tab-link  {
  padding-top: 5px !important;
}

.toolbar-bottom .toolbar-inner .tab-link i  {
  font-size: 1.7em !important;
}

.tabbar-labels .tab-link {
  justify-content: normal;
}

.toolbar-bottom .tabbar-label {
  padding-top: 0.3em;
  font-size: 0.6rem !important;
}

.toolbar-bottom .tab-link {
  padding: 3px !important;
  border-top: 3px solid #FFFFFF !important;
}

.color-osim-0 {
  background-color: #E0DAC9;
}

.color-osim-1 {
  background-color: #514343;
}

.color-osim-2 {
  background-color: #F37021;
}

.color-osim-3 {
  background-color: #00AE4D;
}

.color-osim-4 {
  background-color: #0072BC;
}

.color-osim-5 {
  background-color: #000000;
}

.color-0 {
  color: #E0DAC9;
}

.color-1 {
  color: #514343;
}

.color-2 {
  color: #F37021;
}

.color-3 {
  color: #00AE4D;
}

.color-4 {
  color: #0072BC;
}

.color-blue {
  color: #0072BC !important;
}

.toolbar-bottom {
  color: #514343 !important;
}

.toolbar-bottom .tab-link {
  color: #51434320 ;
}

.toolbar-bottom .tab-link-active {
  color: #514343 !important;
  border-top: 2px solid #514343 !important;
}

.tabbar-label {
  font-size: 0.6rem !important;
}

.toolbar-bottom .tab-link i.icon {
  font-size: 1.5em !important;
}

.light .swiper-slide {
  background-color: #FCFCFB;
}

.block-header {
  margin-top: 15px;
}

#reader {
  max-height: 350px !important;
}

.ios .toggle input[type=checkbox]:checked+.toggle-icon {
  background: #514343 !important;;
}

.sheet-modal {
  transition-duration: 0.3s !important;
}

.tabs-animated-wrap, .tabs {
  transition-duration: 0.3s !important;
}

.dialog-buttons {
  background-color: #514343;
}

.list {
  margin: 10px 0;
}

.list ul:before {
  height: 0px;
}

.list input[type=text] {
  color: #F37021 !important;
}

#tool_DEMOSN,
#tool_CRM_CHATS,
#tool_MKT_GAMES,
#tool_CRM_VOUCHER,
#tool_CRM_TASK,
#tool_OPS_BOPIS,
#tool_OPS_DOCS,
#module_profile-CP_password,
#module_profile-HR_disable_staffpass {
  height: auto !important;
}

.leaflet-marker-osim {
  border: 1px solid #51434350;
  border-radius: 0.5em;
}

#my_list_coupon .list .item-title,
#noti_list_today .list .item-title {
  font-size: 0.8em;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}

#my_list_coupon .list .item-footer,
#noti_list_today .list .item-footer {
  margin: 0.5em;
  text-align: right;
  color: #F37021 !important;
  font-style: italic;
}

#my_list_coupon .list .item-header,
#noti_list_today .list .item-header {
  font-weight: bold;
  font-size: 1em;
  margin-bottom: 0.3em;
}

.disabled {
  opacity: .30 !important;
}

.color-inv-osim-1 {
  background-color: transparent;
  color: var(--osm-color-primary);
}

.color-inv-osim-2 {
  background-color: transparent;
  color: var(--osm-color-orange);
}

.color-inv-osim-3 {
  background-color: transparent;
  color: var(--osm-color-green);
}

.color-inv-osim-4 {
  background-color: transparent;
  color: var(--osm-color-blue);
}

.scan-effect {

}


#my_list_coupon {
  overflow-y: scroll;
}

#module_profile-cp_account_acc,
#module_profile-HR_staff_id {
  border: none !important;
}