/*
    Document   : override
    Created on : <date>
    Author     : <author>
    Description:
        This is where any of your application specific styles should be included
*/

.send-off-screen {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.demo-oracle-icon {
  width: 240px;
  height: 40px;
  content: url("images/eoin_logo.svg");
  /* Updated logo - wider for full text */
}

html:not([dir="rtl"]) .demo-oracle-icon {
  padding-right:4px
}

html[dir="rtl"] .demo-oracle-icon {
  padding-left:4px
}

.demo-oracle-icon:before {
  display:inline
}

.demo-appheader-avatar {
  width:24px;
  height:24px
}

.demo-appheader-avatar:before {
  content:url("images/avatar_24px.png")
}
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .demo-appheader-avatar:before {
      content:url("images/avatar_24px_2x.png");
      -webkit-transform:translate(-25%, -25%) scale(0.5);
      transform:translate(-25%, -25%) scale(0.5)
  }
}

/* Navigation access control */
.nav-item-hidden {
  display: none !important;
}

/* Hide application name text since our logo SVG contains the text */
.oj-web-applayout-header-title {
  display: none !important;
}

/* Adjust header height since we removed the text */
.oj-web-applayout-header {
  min-height: 36px !important;
  padding: 2px 0 !important;
}

/* Ensure logo is vertically centered in the smaller header */
.oj-web-applayout-header .oj-flex-bar-middle {
  align-items: center !important;
}

/* Icon visibility fix - target the combined classes from navTemplate */
.oj-navigationlist-item-icon {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin-right: 8px !important;
  font-size: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
}

/* Also target Oracle JET icon classes specifically */
[class*="oj-ux-ico"] {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Force proper font family for icons */
[class*="oj-ux-ico"] {
  font-family: 'ojuxIconFont' !important;
  font-style: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  line-height: 1 !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* Specific fix for first navigation item icon on desktop */
@media (min-width: 769px) {
  #navTabBar a:first-child [class*="oj-ux-ico"] {
    margin-left: 4px !important;
    position: relative !important;
    z-index: 10 !important;
  }
}

/* Fix navigation bar container to prevent item overflow */
#navTabBar {
  overflow-x: auto !important;
  overflow-y: visible !important;
  width: 100% !important;
  white-space: nowrap !important;
}

/* Ensure navigation wrapper has proper spacing and scrolling */
.oj-web-applayout-navbar {
  padding-left: 8px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  position: relative !important;
}

/* Mobile-specific padding to prevent clipping */
@media (max-width: 768px) {
  .oj-web-applayout-navbar {
    padding-left: 16px !important;
  }

  /* Fix iPhone Safari navigation clipping */
  #navTabBar {
    min-width: max-content !important;
    width: max-content !important;
  }
}

/* Desktop narrow window fix */
@media (min-width: 769px) and (max-width: 1200px) {
  .oj-web-applayout-navbar {
    padding-left: 4px !important;
  }

  #navTabBar {
    overflow-x: auto !important;
    scrollbar-width: thin !important;
    justify-content: flex-start !important;
  }

  #navTabBar::-webkit-scrollbar {
    height: 4px !important;
  }

  #navTabBar::-webkit-scrollbar-track {
    background: transparent !important;
  }

  #navTabBar::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.2) !important;
    border-radius: 2px !important;
  }
}

/* Override Oracle JET flex justification that pushes content off-screen */
@media (min-width: 769px) {
  #navTabBar.oj-md-justify-content-flex-end {
    justify-content: flex-start !important;
  }

  .oj-web-applayout-navbar .oj-web-applayout-max-width {
    max-width: none !important;
    overflow-x: auto !important;
  }

  /* Force tab bar container to not clip content */
  #navTabBar .oj-tabbar-list {
    overflow: visible !important;
    transform: none !important;
    left: 0 !important;
    position: relative !important;
  }

  /* Ensure tab bar wrapper doesn't clip */
  #navTabBar .oj-tabbar-container {
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  /* Force navigation to start from left edge */
  .oj-web-applayout-navbar {
    text-align: left !important;
  }

  #navTabBar {
    text-align: left !important;
    transform: none !important;
  }
}