/* === UPDATED TO MATCH DN.ASPX COLORS & FONTS === */

/* Container - keep modern layout */
h2, h3 {
    text-align: left;
}
.bm-container {
    padding: 20px;
    /* Wide enough that the Dashboard pipeline's actions cell (Review in
       DIBBS Navigator + Mark No Bid) fits on one line instead of wrapping -
       shared across every bm/ page since they all use this same container,
       which just gives everything a bit more breathing room, not less. */
    max-width: 1250px;
    margin: 0 0 0 50px;
    font-size: 13px;
    font-family: Roboto, Arial, sans-serif; /* Match master page */
}

/* On a wide monitor there is room to let the container grow, which is what
   keeps the quotes row's six action buttons (through Remove) on one line -
   the wrap was only ever a width problem. Raised in steps above the normal
   1250px, and only at these breakpoints, so every narrower window keeps the
   existing layout and its wrapping untouched. Each cap leaves room for the
   container's own 50px left margin, so nothing runs off the right edge. */
@media (min-width: 1600px) {
    .bm-container {
        max-width: 1500px;
    }
}
@media (min-width: 1900px) {
    .bm-container {
        max-width: 1750px;
    }
}

/* Header - matches DN's own h1 (StyleSheet.css): white background, DN blue,
   Arial, left-aligned instead of DN's sitewide centered default. */
.bm-header {
    background: #fff;
    margin-bottom: 8px;
    text-align: left;
}
.bm-header h1 {
    margin: 0;
    padding: 0;
    background: #fff;
    color: #A81212;
    font-family: Arial;
    font-size: xx-large;
    font-weight: bold;
    text-align: left;
}
.bm-header .sub {
    margin-top: 4px;
    font-size: 13px;
    color: #000;
    text-align: left;
}

/* Puts the h1 and the quick-nav (User Guide / Settings) on one line, title
   left and buttons right - wraps below the title on a narrow screen rather
   than crowding or overlapping it. */
.bm-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}
/* Quick-nav row (User Guide / Settings) - deliberately unstyled
   input[type=button], same as DN's own Get Saved/Get Sent/Get Excluded/Get
   History buttons, for visual consistency with DN. Margin is zeroed when
   it's sharing the title's line via .bm-header-row above. */
.bm-quicknav {
    margin: 4px 0 14px;
    text-align:left;
}
.bm-header-row .bm-quicknav {
    margin: 0;
}
.bm-quicknav input[type=button] {
    margin-right: 8px;
}
.bm-quicknav .bm-iconbtn {
    margin-right: 8px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    line-height: 16px;
}
.bm-quicknav .bm-iconbtn img {
    display: block;
}

/* Navigation bar */
.bm-bar { 
    margin-bottom: 16px; 
    display: flex; 
    flex-wrap: wrap; 
    gap: 8px; 
    align-items: center; 
}

/* Tabs/steps - use DN blue */
.bm-steps { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 2px; 
    border-bottom: 2px solid #dfe4ea; 
    margin-bottom: 18px; 
}
.bm-steps a { 
    padding: 9px 14px; 
    font-size: 13px; 
    color: #0C1114; /* DN link color from master page */
    text-decoration: none; 
    border-bottom: 3px solid transparent; 
    margin-bottom: -2px;
    font-family: Roboto, Arial, sans-serif;
}
.bm-steps a:hover { 
    color: #9D0000; /* DN hover red from master page */
    border-bottom-color: #b9c6d6; 
}
.bm-steps a.on {
    color: #126096; /* DN accent blue */
    font-weight: bold;
    border-bottom-color: #436C96; /* DN primary blue */
}
/* Bid-specific steps (Solicitation/Vendor Quotes/Compare Vendors/Price and
   Submit to DLA) with no bid open yet (dashboard.aspx, vendors.aspx) - same
   position as a real step, but inert, so the menu's shape doesn't shift
   depending on whether a bid happens to be open. */
.bm-step-disabled {
    display: inline-block;
    padding: 9px 14px;
    font-size: 13px;
    color: #aaa;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    font-family: Roboto, Arial, sans-serif;
    cursor: not-allowed;
}

/* Cards - keep modern but subtle borders like DN */
.bm-card { 
    background: #fff; 
    border: 1px solid #C0C0C0; /* DN border color */
    border-radius: 8px; 
    margin-bottom: 18px; 
}
.bm-card h2 {
    margin: 0;
    padding: 12px 16px;
    font-size: 15px;
    color: #126096; /* DN heading color */
    border-bottom: 1px solid #C0C0C0;
    background: #f9f9f9;
    border-radius: 8px 8px 0 0;
    font-family: Roboto, Arial, sans-serif;
    font-weight: bold;
    text-align: left;
}
.bm-card .body { 
    padding: 16px; 
}

/* Stats cards - use DN blue */
.bm-stats { 
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); 
    gap: 12px; 
    margin-bottom: 18px; 
}
.bm-stat { 
    background: #fff; 
    border: 1px solid #C0C0C0; 
    padding: 14px; 
    border-radius: 8px; 
    text-align: center; 
}
.bm-stat .n { 
    font-size: 22px; 
    font-weight: bold; 
    color: #436C96; /* DN primary blue */
    font-family: Roboto, Arial, sans-serif;
}
.bm-stat .l {
    font-size: 12px;
    color: #000;
    margin-top: 4px;
    text-transform: uppercase; 
}
.bm-stat.hi { 
    background: #436C96; /* DN primary blue */
    border-color: #436C96; 
}
.bm-stat.hi .n, .bm-stat.hi .l { 
    color: #fff; 
}

/* Grid/table - use DN blue headers. display:block + overflow-x:auto lets a
   wide table (8-9 columns on the dashboard pipeline, compare, and vendor
   quotes tables) scroll horizontally within itself on a narrow screen,
   instead of overflowing the whole page or squishing illegibly - a no-op on
   desktop widths where nothing needs to scroll. */
.bm-grid {
    display: block;
    overflow-x: auto;
    width: 100%;
    border-collapse: collapse;
    text-align:left;
    font-size: 12px;
    font-family: Roboto, Arial, sans-serif;
}
.bm-grid th { 
    background: #436C96; /* DN primary blue */
    color: #fff; 
    text-align: left; 
    padding: 7px 8px; 
    font-weight: 500; 
}
.bm-grid td {
    padding: 6px 8px;
    border-bottom: 1px solid #D0D0D0; /* DN border color */
    vertical-align: middle;
}
/* Sortable pipeline column headers (dashboard.aspx) - read as plain header
   text, not a typical blue underlined link, since every header is
   clickable rather than just one. */
/* StyleSheet.css sets a:link/a:visited/a:hover globally with plain
   (non-!important) rules, but they still win over a bare class selector in
   some browsers depending on stylesheet order - the site's own GV-link
   class works around the identical problem the identical way. */
.bm-sortlink, .bm-sortlink:link, .bm-sortlink:visited, .bm-sortlink:active {
    color: #fff !important;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    font-family: Roboto, Arial, sans-serif;
    font-size: inherit;
}
.bm-sortlink:hover {
    color: #fff !important;
    text-decoration: underline;
}
.bm-grid tr:nth-child(even) td { 
    background: #f9f9f9; 
}
.bm-grid tr.sel td { 
    background: #eaf1f8; 
}
.bm-grid .num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Center numeric cells that specifically represent quote counts */
.quote-count {
    text-align: center !important;
}

/* Action cells with several buttons (quotes.aspx's vendor row: Open, Draft
   RFQ email, Copy RFQ text, Edit vendor, Remove) - wraps cleanly with
   consistent spacing instead of an uneven mid-button line break, and the
   buttons run smaller here so more fit on one line before wrapping is
   needed at all. Scoped to this cell only - .bm-btn2/.bm-btnx elsewhere
   (the page-top action bars, form buttons) keep their normal size. */
.bm-grid td.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
.bm-grid td.actions .bm-btn2,
.bm-grid td.actions .bm-btnx {
    padding: 5px 9px !important;
    font-size: 12px !important;
    white-space: nowrap;
}

/* Forms */
.bm-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 14px;
}
/* StyleSheet.css sets body { text-align: center; }, which text-align's
   normal inheritance carries all the way down into a field unless
   something resets it - inputs/selects/textareas set their own alignment
   below, but anything else dropped directly into a field (a button, a
   plain link) would otherwise silently inherit center. Same class of bug
   as the sitewide a:link/a:visited overrides fixed elsewhere in this file. */
.bm-field {
    text-align: left;
}
.bm-field label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    color: #000;
    margin-bottom: 3px;
    font-family: Roboto, Arial, sans-serif;
    text-align: left;
}
.bm-field .hint {
    font-size: 11px;
    color: #000;
    margin-top: 3px;
    text-align: left;
}
/* A field whose input is followed by a small button on the same line (the
   Website field's "Open" button). The input still gets width:100% from the
   rule below; flex:1 with min-width:0 lets it shrink so the button always
   fits beside it instead of wrapping under. */
.bm-inputrow {
    display: flex;
    align-items: center;
    gap: 6px;
}
.bm-inputrow input[type=text],
.bm-inputrow select {
    flex: 1 1 auto;
    min-width: 0;
}
.bm-openbtn {
    flex: 0 0 auto;
    padding: 3px 8px !important;
    font-size: 11px !important;
    white-space: nowrap;
    text-decoration: none;
}

/* Notes field: the textarea and the form's Clear/Save buttons share one row,
   so the buttons sit beside the notes rather than in a separate action bar
   under the form. Bottom-aligned so they line up with the box's last line. */
.bm-noterow {
    display: flex;
    align-items: flex-end;
    gap: 10px;
}
.bm-noterow textarea {
    flex: 1 1 auto;
    min-width: 0;
}
.bm-noteactions {
    flex: 0 0 auto;
    display: flex;
    gap: 8px;
}

.bm-weblink, .bm-weblink:link, .bm-weblink:visited, .bm-weblink:active {
    display: inline-block;
    font-size: 11px;
    color: #436C96 !important;
    text-decoration: none;
    margin-top: 3px;
}
.bm-weblink:hover { text-decoration: underline; }
.bm-reflink, .bm-reflink:link, .bm-reflink:visited {
    font-size: 9px;
    color: #126096; /* DN accent blue */
    text-decoration: underline;
    white-space: nowrap;
}
.bm-reflink:hover { color: #9D0000; /* DN red hover */ }
.bm-reflink-sm, .bm-reflink-sm:link, .bm-reflink-sm:visited {
    font-size: 12px !important;
    text-decoration: none !important;
    color: #126096; /* keep accent blue */
}
.bm-reflink-sm:hover { color: #9D0000; /* hover color, no underline */ }
.bm-field input[type=text], .bm-field input[type=date], .bm-field input[type=email], .bm-field select, .bm-field textarea {
    width: 100%;
    padding: 6px 8px;
    border: 1px solid #C0C0C0; /* DN border */
    border-radius: 4px;
    font-size: 13px;
    box-sizing: border-box;
    font-family: Roboto, Arial, sans-serif;
    text-align: center;
}
/* Multi-line fields (delivery destination, packaging/internal notes) hold
   paragraph or address text, not a short discrete value, so they stay
   left-aligned rather than following the general center rule above. */
.bm-field textarea {
    text-align: left;
}
/* Dropdowns whose options are variable-length names (e.g. the vendor picker
   on quotes.aspx) read better left-aligned than centered. */
.bm-field .bm-w-left {
    text-align: left;
}
.bm-field input[type=text]:focus, .bm-field select:focus, .bm-field textarea:focus {
    border-color: #436C96; /* DN blue */
    outline: none;
}

/* Most solicitation.aspx fields hold short, fairly fixed-length values (a
   solicitation number, an NSN, a date, a dropdown code) and don't need to
   stretch to the full grid column width like Nomenclature and Delivery
   destination do. */
.bm-field .bm-w-narrow {
    width: auto;
    max-width: 160px;
}
/* Quantity tops out at 999,999 - narrower still than the general bm-w-narrow
   fields. (Delivery days ARO used to be here too, back when it only ever
   held a number - it can now also read "See Schedule", so it's sized with
   the wider bm-w-narrow fields instead.) */
.bm-field .bm-w-xs {
    width: auto;
    max-width: 80px;
}
.bm-field .bm-w-xxs {
    width: auto;
    max-width: 55px;
}

/* Fields DIBBS supplies (solicitation.aspx, once Manage has actually
   imported data) - visually flagged as locked rather than just behaving
   like it with no visual cue. */
.bm-field input[readonly], .bm-field textarea[readonly], .bm-field select:disabled {
    background: #f2f2f2;
    color: #000;
    cursor: not-allowed;
}

.bm-check {
    font-size: 13px;
    margin-right: 18px;
}

/* Landed cost fields beyond the four most-used ones (quotes.aspx) - hidden
   until "Show more costs" is clicked, or auto-revealed on load if any of
   them already hold data so nothing existing gets hidden unexpectedly. */
.bm-cost-extra {
    display: none;
}

/* Save quote (quotes.aspx) - pulses once a field in the quote editor has
   been changed, as a visual nudge not to navigate away before saving. */
@keyframes bm-flash-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(216, 67, 21, 0.55); }
    50% { box-shadow: 0 0 0 7px rgba(216, 67, 21, 0); }
}
.bm-btn-flash {
    animation: bm-flash-pulse 1.2s ease-in-out infinite;
}

.bm-actions { 
    margin-top: 16px; 
    padding-top: 14px; 
    border-top: 1px solid #C0C0C0; 
    text-align: right; 
}

/* Buttons - use DN blue and red */
/* All three button classes get their text color forced with !important and
   :link/:visited/:active/:hover coverage - not just a plain "color:", which
   loses to StyleSheet.css's sitewide a:link/a:visited/a:hover (also plain,
   non-!important, but the browser applies whichever pseudo-class rule
   matches regardless of it being a class vs a bare "a" selector) whenever
   one of these classes lands on an <a> (asp:HyperLink renders as one; some
   are plain <a> tags too) instead of a <button>/<input>. Same problem, same
   fix, as .bm-sortlink above - .GV-link elsewhere in the site works around
   the identical issue the identical way. */
.bm-btn, .bm-btn:link, .bm-btn:visited, .bm-btn:active {
    background: #436C96; /* DN primary blue */
    color: #fff !important;
    border: none;
    padding: 7px 15px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    font-family: Roboto, Arial, sans-serif;
}
.bm-btn:hover {
    background: #365680; /* Darker DN blue */
    color: #fff !important;
}

.bm-btn2, .bm-btn2:link, .bm-btn2:visited, .bm-btn2:active {
    background: #fff;
    color: #436C96 !important;
    border: 1px solid #C0C0C0;
    padding: 7px 15px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
    font-family: Roboto, Arial, sans-serif;
}
.bm-btn2:hover {
    background: #f2f5f9;
    color: #436C96 !important;
}

/* A disabled LinkButton renders as a plain <span>, not an <a> - so this
   isn't a :disabled/[disabled] selector, just a class the code-behind
   swaps in when the control's Enabled is set to False. Used on solicitation.aspx's
   "Add to vendors" button once a source is already added for consideration. */
.bm-btn2-disabled {
    color: #aaa !important;
    background: #f5f5f5;
    border-color: #ddd;
    cursor: default;
}

.bm-btnx, .bm-btnx:link, .bm-btnx:visited, .bm-btnx:active {
    background: #fff;
    color: #A81212 !important; /* DN red (from master page .rounded-button) */
    border: 1px solid #e6b8b2;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
    font-family: Roboto, Arial, sans-serif;
}
.bm-btnx:hover {
    background: #fdf2f1;
    color: #A81212 !important;
}

/* Bid documentation drop zone (quotes.aspx quote editor) - the FileUpload's
   rendered <input type="file"> is absolutely positioned to cover the whole
   zone at opacity 0, so it is both the click target and the native drop
   target; the JS only adds the drag-over highlight and swaps the label to
   the chosen file's name. */
.bm-dropzone {
    position: relative;
    border: 2px dashed #C0C0C0;
    border-radius: 6px;
    padding: 20px;
    text-align: center;
    background: #fafafa;
    cursor: pointer;
}
.bm-dropzone.bm-drop-active {
    border-color: #436C96;
    background: #eaf1f8;
}
.bm-dropzone-text {
    font-size: 13px;
    color: #000;
    pointer-events: none;
}
.bm-dropzone-input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.bm-attach-list {
    margin-top: 6px;
    max-height: 175px;
    overflow-y: auto;
    border: 1px solid #C0C0C0;
    border-radius: 4px;
    padding: 0 10px;
}
.bm-attach-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    border-bottom: 1px solid #eee;
}
.bm-attach-meta {
    font-size: 11px;
    color: #000;
}
.bm-attach-status {
    font-size: 12px;
    margin-top: 6px;
    color: #436C96;
    text-align: left;
}
.bm-attach-status-err {
    color: #a4271c;
}
.bm-progress {
    display: none;
    height: 6px;
    background: #eee;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 6px;
}
.bm-progress.active {
    display: block;
}
.bm-progress-bar {
    height: 100%;
    width: 0%;
    background: #436C96;
    transition: width 0.15s ease;
}

/* Messages */
.bm-msg { 
    padding: 9px 12px; 
    border-radius: 4px; 
    margin-bottom: 14px; 
    font-size: 15px;
    text-align:left;
}
.bm-ok { 
    background: #eaf7ee; 
    color: #1e6b34; 
    border: 1px solid #bfe3ca; 
}
.bm-warn { 
    background: #FFFFCC; /* DN yellow background */
    color: #8a5a00; 
    border: 1px solid #C0C0C0; /* DN border */
}
.bm-err { 
    background: #fdecea; 
    color: #a4271c; 
    border: 1px solid #f2c2bc; 
}

.bm-empty { 
    padding: 30px; 
    text-align: center; 
    color: #000;
    border: 1px dashed #C0C0C0; 
    border-radius: 6px; 
}

.bm-note {
    font-size: 14px;
    color: #000;
    text-align:left;
    margin: 0 0 12px 0; 
}

/* Price display - use DN blue */
.bm-price { 
    background: #436C96; /* DN primary blue instead of dark teal */
    color: #fff; 
    padding: 16px 18px; 
    border-radius: 8px; 
    margin-top: 16px; 
}
.bm-price .l { 
    font-size: 11px; 
    text-transform: uppercase; 
    opacity: .8; 
}
.bm-price .v { 
    font-size: 30px; 
    font-weight: bold; 
    margin: 4px 0; 
    font-variant-numeric: tabular-nums;
    font-family: Roboto, Arial, sans-serif;
}
.bm-price .s { 
    font-size: 12px; 
    opacity: .85; 
}

/* Links - match DN link colors */
a.bm-link { 
    color: #126096 !important; /* DN accent blue */
    text-decoration: none;
    font-family: Roboto, Arial, sans-serif;
    text-align:left;
    white-space: nowrap;
}
a.bm-link:hover {
    color: #9D0000; /* DN red hover */
    text-decoration: underline;
}

/* Slightly smaller solicitation number in the dashboard so short arrows
   appended to the link don't force a line break */
.bm-sol-no {
    font-size: 12px;
    line-height: 1;
    vertical-align: middle;
    color: inherit !important;
    font-weight:bold;
}

/* Reduce right padding in the first grid column so the appended triangle
   is less likely to wrap on narrow layouts */
.bm-grid td:first-child {
    padding-right: 4px;
}

/* Page-top "back" navigation - always its own left-aligned line,
   regardless of what else is on the page. */
a.bm-backlink {
    display: block;
    text-align: left;
    margin-bottom: 8px;
}

/* Vendor Reputation modal (VendorReputationPanel.ascx) - embedded on every
   page that lists vendors. Full-postback show/hide (no UpdatePanel), so
   this is just plain fixed-position overlay + box, same shape as the
   Submit-to-DLA modal on pricing.aspx. */
.bm-vr-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.5);
    z-index: 9998;
}
.bm-vr-box {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.3);
    width: 600px;
    max-width: calc(100vw - 40px);
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    box-sizing: border-box;
    z-index: 9999;
    padding: 0;
}
.bm-vr-box .body {
    padding: 16px 20px 20px;
}
.bm-vr-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #436C96 !important;
    color: #fff !important;
    padding: 12px 16px;
    border-radius: 6px 6px 0 0;
}
.bm-vr-header h3 {
    margin: 0;
    background: transparent !important;
    color: #fff !important;
    font-size: 15px;
    text-align: left;
}
.bm-vr-close, .bm-vr-close:link, .bm-vr-close:visited {
    color: #fff !important;
    text-decoration: none;
    font-size: 16px;
    padding: 2px 6px;
}
.bm-vr-close:hover { color: #ffd1d1 !important; }
.bm-vr-summary { margin-bottom: 8px; }
.bm-vr-box h4 {
    text-align: left;
    margin: 16px 0 8px;
    font-size: 13px;
    color: #0C1114;
}
.bm-vr-entry {
    border-bottom: 1px solid #E0E0E0;
    padding: 8px 0;
    font-size: 12px;
    text-align: left;
}
.bm-vr-entry:last-child { border-bottom: none; }
.bm-vr-entry-head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 3px;
}
.bm-vr-entry-date { font-weight: bold; color: #0C1114; }
.bm-vr-entry-meta { color: #666; font-size: 11px; }
.bm-vr-entry-head .bm-btnx { margin-left: auto; padding: 3px 8px !important; font-size: 11px !important; }
.bm-vr-entry-ratings { color: #436C96; margin-bottom: 3px; }
.bm-vr-entry-notes { color: #0C1114; }