/* @preserve
 * Copyright (C) 2006 - 2018, John L Lawler and Incode Systems, Inc.
 * Copyright (C) 2018 - 2022, SUPPLY CHAIN SERVICES INTERNATIONAL, INC.
 *   (unless otherwise noted)
 *   All rights reserved.
 * VERSION 2.2.20221209
 */
/******************************************************************************
 *
 * CHANGELOG
 *
 * 2006
 * 05-19 First creation of common style sheet for all web systems.
 * 12-11 Added tab class for tab frames
 * 2007
 * 01-02 Added GridBackground class
 * 05-02 Added GridColumnHeader class
 * 05-09 Added NavBar class
 * 10-04 Added StatusBar class
 * 2011  Added Invisible class, version bump to 4
 * 08-02
 * 2018  Split definition of .delete & .error to put !important on delete
 * 0718
 *****************************************************************************/

/* 2013-08-01 jll; CSS Reset, as suggested by Yahoo YUI 2, which serves to
 *   neutralize weird things a lot of the browser do by default and just get
 *   you back to a netural status so you can avoid having to manually override
 *   this in more places.
 *   I originally came across this when trying to solve that issue where all
 *   the browsers seemed to put a small space (1-4px or so) below the
 *   AppTitleDiv and before the Criteria Container div & table elements; this
 *   did *not* seem to initially solve the issue that I thought might've been
 *   caused by <form> having some top padding, e.g.
 *      http://developer.yahoo.com/yui/reset/#code
 */
/* 20190418 jll; rather than doing this "reset" kind of approach, it seems like
 *   a normalize one [more conservative, not changing as many things] may be
 *   preferred.  I had an annoyance which made me find this related to <p>s
 *   having no marging/padding in popup help windows causing them to be all
 *   run together as if they just had <br>s between <p>s
 *   https://github.com/necolas/normalize.css/blob/master/normalize.css
 *   For now, I'm going to just pull the 'p' from the below clearing of margin
 *   & padding.
 * 20190805 jll; removing 'ul,ol' from below list
 */
body,div,dl,dt,dd,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
  /* 2013-08-01 jll; This one seems to make IE9's tables look nicer */
  border-collapse:collapse;
	border-spacing:0;
}
/* 20230831 jll; removing fieldset from this, initially for sshipline_scan
 *   and the options section where I definitely want to see that border
fieldset,img {
 */
img {
	border:0;
}
/* 20190717 jll; also now removing this, so th actually is bold!
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
*/
/* 20190417 jll; why do I have this in place?  It makes it so that by default
    LIs get no leading number or disc or whatever
list-style: none;
 * 20190805 jll; now also removing the rest of this default styling to ol,ul
 *   since it forces uls to be numbered, which again makes no sense
ol,ul {
  list-style-type: decimal;
  list-style-position: outside;
}
*/
caption,th {
	text-align:left;
}
/* 20190717 jll; removing this override now too, I'm thinking more and more
 *   that this whole reset concept was not wise and should be removed
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
*/
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

/********************************** classes ***********************************/

.ControlsContainer {
  width: 80px;
  padding-top: 5px;
  text-align: center;
}

.Hidden {
  /* 2012-07-11 jll; Added the "! important" after realizing that some of the
   *   anchors I'd been hiding with this class were being overriden and
   *   displaying even when belonging to this class because of the cascade in
   *   CSS, I guess; it's probably because the anchor specification I recently
   *   added (simply to show that nice icon that indicates the target is
   *   _blank and will pop a new tab) is an element level CSS declaration and
   *   this one is only a class level one (element must override);
   *   Anyway, in Chrome, FF and IE9, using this "! important" successfully
   *   overrides the display to none, which works on charge_mgmt at least. */
  display: none ! important;
}

/* 2012-07-12 jll; Only added this one after adding the above "! important"
 *   when I then saw another conflict on the same (charge_mgmt) module I'd
 *   added the above for.  The problem was if you used class="Hidden" just so
 *   that the element didn't display (even briefly, in a flash) while the page
 *   loads, and then you never explicitly remove the Hidden class name, it
 *   would of course never display.  So I'm adding this class to not behave as
 *   Hidden *used* to, which is to do display none but only "soft" and not
 *   force it to always be that way. */
.hiddenOnLoad {
  display: none;
}

/* 2011-08-02 jll; Added new Inivisible class to handle new approach to doing
 *   hide / unhide functions in general.js, *for now*.  Still have not
 *   decided which is the best to use in general -- turning visibility on or
 *   off seems to preserve the elements position in the layout (other elements
 *   just appear around it and don't shuffle back and forth), which is good in
 *   some situations, but maybe not in others.
 *   For now, I've added hide_vis/unhide_vis, intended to be used with this
 *   static class, and hide/unhide should still be used with Hidden above */
.Invisible {
  visibility: hidden;
}

.menuItem {

  cursor: default;
  height: 18px;

  padding-top: 1px;
  padding-left: 8px;
  padding-right: 8px;

}

.menuItemRoot {

  background-color: #eceded; /* light gray */

}

.menuItemNonRoot {

  background-color: white;

}

.menuItemSelected {

  background-color: #0080ff; /* blue */
  color: white;

}

/* 2016-01-26 jll; new with switch to anchors vs pure divs, to style anchors
 *   without normal anchor highlight, underline behavior */
.menuAnchor  {
  text-decoration: none;
  /* inherit seemed to work fine for FF & Chr, but not IE 11, so punting to
   *   explicit black which is fine for now */
  color: black; /*inherit;*/
}

.rowPosting {

  /* 2017-02-24 jll; added !important today after seeing an sshipment_search
   *   situation where an earlier 'warning' class was preventing the green
   *   of this from being seen */
  background-color: #86d76f !important;/* light green */

}

.rowPostingError {

  /* 2017-02-24 jll; see above note, I think this makes sense, but it's not
   *   well tested at all */
  background-color: #ff9f9f !important; /* light red */

}

/* 2006-08-16 jll;  Most of this taken from examples here:
 *   http://www.wingo.com/dialogbox/index.html */
.modalBackground {

  position: absolute;
  top: 0px;
  left: 0px;
  background-color: #6a74cb;

}

.NavBar {
  border-bottom: 1px black solid;
  background-color: #eceded;
  height: 18px;
  width: 100%;
}

.StatusBar {
  text-align: left;
  background-color: #dfdfdf;
  padding: 5px;
  border-top: 1px darkgray solid;
}

/********************************** elements **********************************/

body {
  /* background-color: #3a63a5; /* classic Windows blue desktop color */
  background-color: #ff9f9f; /* light red */
  font-family: tahoma, sans-serif;
  font-size: 12px;
  /* font-family: verdana, arial, sans-serif;
  font-size: 13px; */
  margin: 0;
}

/* 2013-08-01 jll; To override "cursor: move" on buttons on window handles */
input[type="image"] {
  cursor: default;
}

input[type="image"][title="Help"] {
  cursor: help;
}

/* ALPHABETIZED ABOVE ********************/

/* 2007-10-02 jll; Added after making the NavBar flush with the edges of the
 *   viewport */
.AppForm {
  margin-left: 8px;
}

.AppForm, .defaultBackground {
  background-color: #eceded; /* very light gray */
}

.AppFormBorder {
  border: 2px blue solid;
}

.AppFormTitle {
  background-color: blue;
  color: white;
  padding: 2px;
  padding-left: 5px;
  font-size: 13px;
  text-align: left;
  font-weight: bold;
  height: 20px;
}

.default { background-color: #eceded; /* very light gray */ }
.defaultBorder { border: 2px blue solid; }
.defaultTitle {
  background-color: blue;
  color: white;
}

/* 2012-07-18 jll; Changed these today so that error is red and warning is
 *   yellow */
/* 2012-08-20 jll; Added 'delete' for use by jllGrid since it was using
 *   'warning', which is now yellow and not a good indicator for deletion */
/* 20180718 jll; splitting delete off separately to get an !important after
 *   having MB being confused by lack of a WSL turning red when delete was
 *   clicked because it already had a 'notice' or other class on it; */
.delete { background-color: #ff9f9f !important; /* light red */ }
.error { background-color: #ff9f9f; /* light red */ }
.errorBorder { border: 2px #ff6464 solid; } /* slightly darker red */
.errorTitle {
  background-color: #ff6464;
  color: white;
}

.hover { background-color: #ffffcc; /* light yellow */ }

.warning, .notice { background-color: #ffffcc; /* light yellow */ }
.warningBorder { border: 2px #ffff33 solid; } /* slightly darker yellow */
.warningTitle {
  background-color: #ffff33;
  color: black;
}

.info { background-color: #86d76f; /* light green */ }
.infoBorder { border: 2px green solid; }
.infoTitle {
  background-color: green;
  color: white;
}

.unknown { background-color: #ff80ff; /* light purple */ }

.active { background-color: lightgray; }
.chosen { background-color: #86d76f !important; }

.HelpButton {
  float: right;
  font-weight: bold;
  border: 1px white solid;
  background-color: green;
  cursor: help;
}

.groupBox {
  border: 1px solid gray;
  overflow: auto;
  height: 80px;
  margin-left: -3px;
  margin-top: -1px;
  padding: 5px;
}

.tab {
  border: 1px solid gray;
  padding: 10px;
  height: 100%;
}

.menuBackground {
  background-color: white;
}

td {
  /* 2009-02-03 jll; Removed padding on tds to conserve on space in tables
   *   for headers, especially on WShipmentMgmt.  Reverse or tweak if there're
   *   problems;
   *   ... and immediately put it back once I noticed that jllGrid was probably
   *   the primary use for this.  I might make a new class just for grid cells
   *   to handle this problem. */
  padding: 2px;
  padding-left: 3px;
  padding-right: 3px;
}

/* 2006-12-12 jll;  Nice, I stumbled upon this syntax somewhere that allows one
 *   to (e.g.) set the class on the table, and have all of the TDs (and only
 *   the TDs) pickup the CSS in this class.  Saves on redundant CSS on the TDs.
 */
/* 20221208 jll; attempting a change from nowrap to pre after deciding that I
 *   cannot any longer replace spaces in data with &nbsp; because now Firefox
 *   (only recently, I suspect) has begun to put an actual nbsp character
 *   (\xA0, Alt+255) in the cell when a user selects it to copy out.  This has
 *   been reported by multiple users to be causing problems in the past couple
 *   of weeks.  Still does not seem to happen in Chrome, but I need a fix;
 *   dropping the &nbsp; replacement in jllGrid and changing this from 'nowrap'
 *   to 'pre' may achieve what I was trying to do with those &nbsp; injections:
 *   I think it was just to preserve multiple spaces in a row and not collapse
 *   them to a single one.
 */
.criteriaTable td, .headerTable {
  white-space: nowrap;
}
.jg td {
  white-space: pre;
}

.fieldDisplay {
  border: 1px darkgray solid;
  padding: 1px;
  overflow: hidden;
  white-space: nowrap;
}

/* 2006-10-26 jll;  The reason for these simple classes is that IE & FF
 *   apparently use different notation in JavaScript for setting float
 *   styles.  This approach may be simpler for now.
 */
.FloatLeft {
  float: left;
}

.FloatRight {
  float: right;
}

.GridBackground {
  background-color: silver;
}

.GridColumnHeader {
  /* 20181113 jll; pretty sure this should be nowrap; that still seems to allow
   *   explicit brs to force a break, and I think that's what I want; this was
   *   'normal' before */
  white-space: nowrap;
  text-align: center;
  vertical-align: bottom;
  /* 2007-06-22 jll; Added these to support the LockedHeaderRow feature in
   *   jllGrid */
  /* 20181113 jll; and now changing this to have small left/right padding;
   *   these values used to be 0 */
  padding-left: 0.5em;
  padding-right: 0.5em;
}

.ControlHighlightGreen {
  background-color: #cdffa8;
}

.ControlHighlightYellow {
  background-color: #ffffcc;
}

.ControlHighlightRed {
  background-color: #ff9f9f;
}

div.Grid {
  border: 1px gray solid;
  background-color: white;
  overflow: auto;
}

div.GridContainer {
  margin: 5px;
  margin-top: 0;
}

div.GridSmall {
  border: 1px gray solid;
  background-color: white;
  width: 100%;
  margin-top: -1px;
  overflow: auto;
}

div.MsgPopup {
  position: absolute;
  left: 100px;
  top: 100px;
  width: 300px;
  padding: 5px;
  /* 2011-04-25 jll; Should keep this window above all others with "auto"
   *   z-index */
  z-index: 10;
}

.center {
  text-align: center;
}

.GridTitle {
  font-weight: bold;
}

.functionA {
  background-color: #b7ffb7; /* very light green */
}

.functionB {
  background-color: #ffbbbb; /* very light green */
}

/* 2012-05-22 jll; New idea to make it easier at a glance for users to see
 *   whether a link will automatically pop a new window
 * 2012-07-12 jll; Realized this would cause problems since it uses display:
 *   inline-block; that contradicts my Hidden class (which sometimes is set
 *   on anchors) by forcing the display to inline-block since apparently this
 *   element level CSS overrides the class level Hidden CSS; the result is an
 *   anchor is displayed even though it has class Hidden! ... and I can kind
 *   of get this to work in Chrome/FF, but not in IE9 (at least in compat.
 *   mode as I have it forced) ... so, I'm going to bail for now and just
 *   try to make sure I don't leave a Hidden class on elements I actually
 *   want to be visible (and try to achieve that by manually overriding the
 *   CSS w/ direct CSS); ftr, I had it as "a[target="_blank"][class=""]" which
 *   worked in FF, Chrome, but not IE.
 *   Alternatives like "a[target="_blank"]:not(Hidden)" also might work in
 *   FF/Chrome, but not IE (compat IE7 mode)
 */
/* 20190708 jll; after recent user feedback to font-weight bold, dropping any
 *   special styling altogether for target _blank; may even consider generally
 *   dropping the use of such targets anyway on the theory that users that want
 *   that behavior can just hold down their shift key while clicking (or equiv)
 */
/*
a[target="_blank"] { */
  /* 20190617 jll; decided as a trial run to drop this previous work I'd done as
   *   to obtrusive especially when having dozens of links in a somewhat small
   *   area (as I may start having in report_cf in Call Off mode since there'll
   *   be one link per XOL created from a Qty column */
  /*display:inline-block;
  line-height:16px;
  background:url(../../images/0/emblem-symbolic-link.png)  center right no-repeat;
  padding-right:20px; */
  /* tried text-decoration, but none of those seem to be well supported in IE or
   *   even Edge, oddly, so may just stick with the simpler bold */
  /*font-weight: bold;*/
/*}*/

/* 2012-06-28 jll; */
.nobr  { white-space: nowrap; }

/* 2012-06-28 jll; Added this to get a Firefox-esque decoration added for IE & Chrome
 *   which don't do this natively; it works perfectly and the blue color sets it off
 *   a bit differently, which is nice */
acronym, .dottedUnderline {
  border-bottom: 1px blue dotted;
}

.loading {
  color: gray !important;
  background-color: lightgray !important;
}

a.disabled {
  opacity: 0.3;
}

/* 20180110 jll; for some reason, w/ a font-awesome icon in a grid, it looks too high in the grid (maybe it's top aligned and needs to be centered, but in the meantime this is faster), also we do need to remove the text-decoration */
a.fa {
  text-decoration: none;
  color: black;
  margin-top: 0.25em;
}

/* 20180830 jll; for further migration of jllGrid icons to FA: wasn't quite
 *   satisfied with fa-lg or fa-2x, wanted something in between
 *   Didn't want to fight with fa on why this was ignored until I put the
 *   important in; I'm sure there's a more correct way, but don't have time
 *   now. */
.fa-1pt5x {
  font-size: 1.5em ! important;
}

.fg-red {
  color: red;
}

.fg-green {
  color: green;
}

.fg-yellow {
  color: yellow;
}

.fg-orange {
  color: orange;
}

.fg-blue {
  color: blue;
}

.locked, .bg-lightgreen, .verified {
  background-color: #86d76f;/* light green */
}