/* DEFAULTS
----------------------------------------------------------*/
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

/*body {
    margin-bottom: 60px;
}
*/
body   
{
    background: #b6b7bc;
    font-size: .80em;
    font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    margin: 0px;
    padding: 0px;
    color: #696969;
}

a:link, a:visited
{
    color: #034af3;
}

a:hover
{
    color: #1d60ff;
    text-decoration: none;
}

a:active
{
    color: #034af3;
}

/* A submit button rendered inline as a link (e.g. the Delete draft action in grids). */
button.linkAction
{
    background: none;
    border: none;
    padding: 0;
    margin: 0 0 0 8px;
    font: inherit;
    color: #034af3;
    text-decoration: underline;
    cursor: pointer;
}

button.linkAction:hover
{
    color: #1d60ff;
    text-decoration: none;
}

/* Step breadcrumb links: same look as linkAction but no left margin so they sit flush
   against the " · " separators. */
button.linkAction.stepLink
{
    margin: 0;
    white-space: nowrap;
}

/* Confirmation popup title: solid black and bold (overrides the lighter heading style). */
#confirmModal .modal-title
{
    color: #000000;
    font-weight: bold;
}

/* Confirmation popup message text: solid black. */
#confirmModal .modal-body
{
    color: #000000;
}

p
{
    margin-bottom: 10px;
    line-height: 1.6em;
}


/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6
{
    font-size: 1.5em;
    color: #666666;
    font-variant: small-caps;
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}

h1
{
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2
{
    font-size: 1.5em;
    font-weight: 600;
}

h3
{
    font-size: 1.2em;
}

h4
{
    font-size: 1.1em;
}

h5, h6
{
    font-size: 1em;
}

/* this rule styles <h1> and <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
    margin-top: 0px;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

.page
{
    width: 960px;
    background-color: #fff;
    margin: 20px auto 0px auto;
    border: 1px solid #496077;
}

/* Manager area needs more room for the wide application list; stays centered and never
   exceeds the viewport on smaller screens. */
.page.pageWide
{
    width: 1320px;
    max-width: 96vw;
}

.header
{
    position: relative;
    margin: 0px;
    padding: 0px;
    background: #4b6c9e;
    width: 100%;
    height:100px;
}

.header h1
{
    font-weight: 700;
    margin: 0px;
    padding: 0px 0px 0px 20px;
    color: #f9f9f9;
    border: none;
    line-height: 2em;
    font-size: 2em;
}

.main
{
    padding: 0px 12px 24px 12px;
    margin: 12px 8px 8px 8px;
    min-height: 420px;
}

.leftCol
{
    padding: 6px 0px;
    margin: 12px 8px 8px 8px;
    width: 200px;
    min-height: 200px;
}

.footer
{
    color: #4e5766;
    padding: 8px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
}


/* TAB MENU   
----------------------------------------------------------*/

div.hideSkiplink
{
    background-color:#3a4f63;
    width:100%;
    padding:2px;
   
}

div.menu
{
    padding: 4px 0px 4px 8px;
}

div.menu ul
{
    list-style: none;
    margin: 0px;
    padding: 0px;
    width: auto;
}

div.menu ul li a, div.menu ul li a:visited
{
    background-color: #465c71;
    border: 1px #4e667d solid;
    color: #dde4ec;
    display: block;
    line-height: 1.35em;
    padding: 4px 20px;
    text-decoration: none;
    white-space: nowrap;
}

div.menu ul li a:hover
{
    background-color: #bfcbd6;
    color: #465c71;
    text-decoration: none;
}

div.menu ul li a:active
{
    background-color: #465c71;
    color: #cfdbe6;
    text-decoration: none;
}

/* FORM ELEMENTS   
----------------------------------------------------------*/

fieldset
{
    margin: 1em 0px;
    padding: 1em;
    border: 1px solid #ccc;
}

fieldset p 
{
    margin: 2px 12px 10px 50px;
}

fieldset.login label, fieldset.register label, fieldset.changePassword label
{
    display: block;
}

fieldset label.inline 
{
    display: inline;
}

legend 
{
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 8px 4px;
}

input.textEntry, select.textEntry
{
    width: 320px;
    border: 1px solid #ccc;
}

/* Application form rows: give every label the same width so the inputs line up,
   regardless of how long the individual label text is. */
.fieldGrid label
{
    display: inline-block;
    min-width: 240px;
    padding-right: 8px;
    text-align: right;
    vertical-align: middle;
}

.fieldGrid .textEntry
{
    vertical-align: middle;
}

input.passwordEntry 
{
    width: 320px;
    border: 1px solid #ccc;
}

div.accountInfo
{
    width: 42%;
}

/* MISC  
----------------------------------------------------------*/

.clear
{
    clear: both;
}

#NavigationMenu
{
    color:#FFFFFF;
}

.title
{
    display: block;
    float: left;
    text-align: left;
    width: auto;
   
}
.loginDisplay
{
    font-size: 1.1em;
    display: block;
    text-align: right;
    padding: 10px;
    color: White;
}

.loginDisplay a:link
{
    color: white;
}

.loginDisplay a:visited
{
    color: white;
}

.loginDisplay a:hover
{
    color: white;
}

.failureNotification
{
    font-size: 1.2em;
    color: Red;
}

.successNotification
{
    font-size: 1.1em;
    color: #2f5743;
    font-weight: bold;
}

.bold
{
    font-weight: bold;
}

.wideSelect
{
    width: auto !important;
    max-width: 100%;
}

/* Inline show/hide eye toggle on password fields */
.pwdWrap
{
    position: relative;
    display: inline-block;
}
.pwdWrapBlock
{
    display: block;
}
.pwdWrap > input
{
    padding-right: 34px;
}
.pwdToggle
{
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    color: #777;
    display: flex;
    align-items: center;
}
.pwdToggle:hover
{
    color: #333;
}

.submitButton
{
    text-align: right;
    padding-right: 10px;
}

.displayinline
{
    display:inline;
   
}

.indent
{
    padding-left:50px;
    padding-top:6px;
    padding-bottom:12px;
}
.gvAlt
{
    background: #FFE5BF;
}
.gvRow
{
	background: #fff;
	
}
.gvHead th
{
	background: #D7DEE6;
	color: #443b1c;
}
.gridview
{
	width:100%;
	margin:8px 0 0 0;
	clear:both;
	border:1px solid #9fb0c3;
	border-collapse:collapse;
}
.gridview th, .gridview td
{
	padding:7px 12px;
	border:1px solid #d3dbe4;
	text-align:left;
}
.uploadForm
{
	margin:16px 0 8px 0;
}
.sectionSubhead
{
	margin:22px 0 6px 0;
	font-weight:bold;
}
.wizardNav
{
	margin-top:28px;
	overflow:hidden; /* contain the floated nav buttons */
}
.navBack { float:left; }
.navNext { float:right; }
.stepHeading
{
	font-weight:bold;
	color:#2f5277;
	background:#eaf0f6;
	border-left:5px solid #4b6c9e;
	padding:6px 10px;
	margin:12px 0 14px 0;
}

/* Admin / Manager portal — distinct color so it's obvious you're in the admin area */
body.admin .header
{
	background:#3a6b53;
}
body.admin .page
{
	border-color:#2f5743;
}
.adminBadge
{
	display:inline-block;
	margin:2px 0 0 20px;
	padding:3px 12px;
	color:#ffffff;
	background:rgba(0,0,0,0.22);
	border-radius:4px;
	font-weight:bold;
	letter-spacing:1px;
}

/* COPE-AKI logo on the right side of the header, below the Welcome / Log off row. */
.copeHeaderLogo
{
	position:absolute;
	right:20px;
	bottom:6px;
	height:54px;
	width:auto;
	background:#ffffff;
	border-radius:8px;
	padding:3px;
}

/* Non-production warning, centered on the lower (second) row of the header. */
.siteTypeBanner
{
	position:absolute;
	left:50%;
	bottom:10px;
	transform:translateX(-50%);
	color:#ff4d4d;
	font-weight:bold;
	font-size:2em;
	white-space:nowrap;
}

/* The manager area's badge ("...Management Portal") is wider, so shift the warning right
   to center it in the open space between that badge and the logo (avoids overlap). */
body.admin .siteTypeBanner
{
	left:60%;
}

/* Manager/Administration navigation tabs */
.adminTabs
{
	margin:14px 0 0 0;
	border-bottom:2px solid #2f5743;
}
.adminTabs a
{
	display:inline-block;
	padding:8px 22px;
	margin-right:3px;
	background:#cfe0d6;
	color:#2f5743;
	text-decoration:none;
	font-weight:bold;
	border-radius:6px 6px 0 0;
}
.adminTabs a:hover
{
	background:#bcd4c6;
}
.adminTabs a.active
{
	background:#3a6b53;
	color:#ffffff;
}

/* Administration landing buttons */
.adminActions
{
	display:flex;
	gap:18px;
	margin-top:20px;
	flex-wrap:wrap;
}
.adminActionButton
{
	display:inline-block;
	padding:16px 28px;
	background:#dcebe2;
	color:#2f5743 !important;
	text-decoration:none;
	border:1px solid #3a6b53;
	border-radius:6px;
	font-weight:bold;
	font-size:1.05em;
}
.adminActionButton:hover
{
	background:#c4ddd0;
	color:#23402f !important;
}

/* Manager main menu buttons */
.menuButtons
{
	display:flex;
	gap:80px;
	margin-top:40px;
	flex-wrap:wrap;
	justify-content:center;
}
.menuButton
{
	display:inline-block;
	text-align:center;
	padding:8px 18px;
	background:#3a6b53;
	color:#ffffff !important;
	text-decoration:none;
	border-radius:4px;
	font-weight:bold;
}
.menuButton:hover
{
	background:#2f5743;
	color:#ffffff !important;
}
.menuButtonAlert
{
	background:#c0392b;
}
.menuButtonAlert:hover
{
	background:#a52f23;
}

/* Search Applications filters */
.searchFilters
{
	display:flex;
	flex-direction:column;
	gap:14px;
	margin:14px 0 18px 0;
	padding:14px 16px;
	background:#eef3ee;
	border:1px solid #ccd9cf;
	border-radius:6px;
}
.filterRow
{
	display:grid;
	grid-template-columns:repeat(5, minmax(0, 1fr));
	gap:18px;
	align-items:end;
}
@media (max-width:900px)
{
	.filterRow { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
.filterField
{
	display:flex;
	flex-direction:column;
}
.filterField label
{
	font-weight:bold;
	margin-bottom:4px;
	font-size:0.9em;
}
.filterInput
{
	padding:5px 7px;
	border:1px solid #b7c2b9;
	border-radius:4px;
	width:100%;
	min-width:0;
	box-sizing:border-box;
}
.filterButtons
{
	display:flex;
	align-items:center;
	gap:12px;
}
.clearLink
{
	font-size:0.95em;
}
/* Sortable column headers */
.gvHead th a
{
	color:inherit;
	text-decoration:none;
}
.gvHead th a:hover
{
	text-decoration:underline;
}

/* User Management list */
.breadcrumb
{
	margin:0 0 10px 0;
	padding:0;
	background:none;
	font-size:0.95em;
}
.usersTitle
{
	text-align:center;
	color:#2f4b7c;
	margin:10px 0 18px 0;
}
.usersTable
{
	width:100%;
	border-collapse:collapse;
	border:1px solid #b9a06a;
}
.usersTable th
{
	background:#d6e0ef;
	color:#1f3354;
	border:1px solid #b9a06a;
	padding:8px 10px;
	text-align:left;
	white-space:nowrap;
}
.usersTable td
{
	border:1px solid #d8c79a;
	padding:7px 10px;
}
.usersTable tbody tr:nth-child(odd)
{
	background:#ffffff;
}
.usersTable tbody tr:nth-child(even)
{
	background:#f5e6c3;
}
.usersTable .centerCell
{
	text-align:center;
}

.btn-edit, .btn-deactivate, .btn-reactivate
{
	border:none;
	border-radius:4px;
	padding:5px 12px;
	font-weight:bold;
	cursor:pointer;
	color:#ffffff;
}
.btn-edit
{
	background:#2f6fb0;
}
.btn-edit:hover
{
	background:#255a90;
}
.btn-deactivate
{
	background:#e0a800;
}
.btn-deactivate:hover
{
	background:#c69500;
}
.btn-deactivate:disabled
{
	background:#d9c98f;
	cursor:not-allowed;
}
.btn-reactivate
{
	background:#3a6b53;
}
.btn-reactivate:hover
{
	background:#2f5743;
}
.modalSectionHeading
{
	color:#2f4b7c;
	font-weight:bold;
	font-size:1.25em;
	margin-bottom:12px;
}
.fieldHint
{
	font-weight:normal;
	font-size:0.85em;
	color:#777;
}
.returnedBanner
{
	margin:12px 0;
	padding:12px 16px;
	background:#fff7d6;
	border:1px solid #e6d28a;
	border-radius:6px;
	color:#664d00;
}
.returnedBanner .returnedMessage
{
	margin:6px 0;
	white-space:pre-wrap;
	font-weight:bold;
}
.reviewComment
{
	width:100%;
	max-width:700px;
	display:block;
	margin-top:4px;
	min-height:7.5em;      /* ~5 lines by default (line-height 1.4) instead of a cramped 2 rows */
	resize:vertical;        /* always allow growing taller, even where the drag handle is hidden */
	line-height:1.4;
	font-family:inherit;
}
.infoBox
{
	margin:12px 0 18px 0;
	padding:12px 16px;
	background:#eaf2fb;
	border:1px solid #b9d2ee;
	border-radius:6px;
	color:#1f3354;
}
.sectionComment
{
	margin-top:8px;
	padding:8px 12px;
	background:#fff7d6;
	border:1px solid #e6d28a;
	border-radius:6px;
	color:#664d00;
	white-space:pre-wrap;
}
.interviewFor
{
	margin-bottom:14px;
	color:#444;
}
.interviewTitle
{
	font-size:1.35em;
	font-weight:bold;
	color:#2f5743;
}
.interviewInfo
{
	margin-bottom:16px;
	padding:12px 14px;
	background:#eef3ee;
	border:1px solid #ccd9cf;
	border-radius:6px;
	line-height:1.7;
}
.interviewInfo .iiLabel
{
	display:inline-block;
	min-width:120px;
	color:#555;
	font-weight:bold;
}
.ivSentNote
{
	color:#2f5743;
	font-weight:bold;
}
.sectionBox
{
	border:1px solid #d9dee3;
	background:#f7f9fb;
	border-radius:8px;
	padding:14px 16px;
	margin:14px 0;
}
.interviewBox
{
	border:1px solid #bcd4c6;
	background:#f1f7f3;
	border-radius:8px;
	padding:14px 16px;
	margin:14px 0 4px 0;
}
.sectionBox .modalSectionHeading,
.interviewBox .modalSectionHeading
{
	margin-top:0;
}
.acceptHint
{
	color:#8a6d00;
	background:#fff7d6;
	border:1px solid #e6d28a;
	border-radius:6px;
	padding:8px 10px;
	font-size:0.92em;
}
.contactLog
{
	max-height:150px;
	overflow-y:auto;
	border:1px solid #ccd9cf;
	border-radius:6px;
	padding:8px 10px;
	background:#fafdfb;
}
.contactLog .logEntry
{
	padding:6px 0;
	border-bottom:1px solid #e6efe9;
}
.contactLog .logEntry:last-child
{
	border-bottom:none;
}
.contactLog .logMeta
{
	font-size:0.85em;
	color:#666;
	margin-bottom:2px;
}
.contactLog .logNote
{
	white-space:pre-wrap;
}
.interviewTime
{
	font-size:0.9em;
	color:#444;
}
.interviewLocation
{
	font-size:0.9em;
	color:#444;
}
.interviewMode
{
	font-size:0.9em;
	color:#2f4b7c;
	font-style:italic;
}

/* Portal landing page choices */
.portalChoices
{
	display:flex;
	gap:24px;
	margin-top:20px;
	flex-wrap:wrap;
}
.portalCard
{
	border:1px solid #c7d0da;
	border-radius:6px;
	padding:18px 24px;
	width:300px;
	background:#f6f9fb;
}
.portalCard h3 { margin-top:0; }
.portalButton
{
	display:inline-block;
	margin-top:12px;
	padding:8px 18px;
	background:#4b6c9e;
	border-radius:4px;
	text-decoration:none;
	font-weight:bold;
}
.portalButton:link, .portalButton:visited { color:#ffffff; }
.portalButton:hover { background:#3a5680; color:#ffffff; text-decoration:none; }
table#loginBox,table#ctl00_MainContent_loginBox,
table#changePassWordBox,table#ctl00_MainContent_changePassWordBox,
table#PWRecoveryBox, table#ctl00_MainContent_PWRecoveryBox,
table#ctl00_MainContent_RegisterUser

{
	margin: 2em auto 6em auto;
	/*background: #D7DEE6;
	border: solid 1px #887638;	*/
    text-align:center;
   /* padding-top:0.3em;*/
   padding:10px;
}

table#loginBox td.loginTitle, table#ctl00_MainContent_loginBox td.loginTitle,
table#ctl00_MainContent_changePassWordBox td.loginTitle,
table#PWRecoveryBox td.loginTitle, table#ctl00_MainContent_PWRecoveryBox td.loginTitle,
table#ctl00_MainContent_RegisterUser td.loginTitle,.loginTitle

{
    background:#395B84 !important;    
    color:#fff;
    padding:5px !important;
    font-weight:bold !important;
}
table#loginBox td.loginLabel,table#ctl00_MainContent_loginBox td.loginLabel,
table#ctl00_MainContent_changePassWordBox td.loginLabel,
table#PWRecoveryBox td.loginLabel, table#ctl00_MainContent_PWRecoveryBox td.loginLabel, 
table#ctl00_MainContent_RegisterUser td.loginLabel, .loginLabel
{
    color:#395B84;
    font-weight:bold;
    padding-right:5px;
    
}

.loginCheckBox
{
    color:#395B84;
    padding-right:5px;
    font-size:x-small !important;
    
}

table#loginBox input.loginTextBox, table#ctl00_MainContent_loginBox input.loginTextBox,
table#ctl00_MainContent_changePassWordBox input.loginTextBox,
table#PWRecoveryBox input.loginTextBox, table#ctl00_MainContent_PWRecoveryBox input.loginTextBox,
table#ctl00_MainContent_RegisterUser input.loginTextBox, .loginTextBox
{
    width: 10em;
       
}

table#loginBox input.loginButton, table#MainContnet_loginBox input.loginButton,
table#ctl00_MainContent_changePassWordBox input.loginButton,
table#PWRecoveryBox input.loginButton, table#ctl00_MainContent_PWRecoveryBox input.loginButton,
table#ctl00_MainContent_RegisterUser input.loginButton, .loginButton
{
	background: #2f6fb0;
	color: #ffffff;
	border: 1px solid #2f6fb0;
	border-radius: 4px;
	font-weight: bold;
	padding: 0.4em 1.1em;
	margin: 10px;
	cursor: pointer;
	text-decoration: none;
	display: inline-block;
}
.loginButton:link, .loginButton:visited { color:#ffffff; }
.loginButton:hover
{
	background:#255a90;
	border-color:#255a90;
	color:#ffffff;
	text-decoration:none;
}

/* Muted variant of .loginButton for secondary actions such as an inline Cancel. */
.loginButton.cancelButton
{
	background:#6c757d;
	border-color:#6c757d;
}
.loginButton.cancelButton:hover
{
	background:#5a6268;
	border-color:#5a6268;
}

/* SDRC reviewer questions (Investigative Team / Approach / Environment rubric categories). */
.reviewerCategoryTitle { margin:12px 0 4px; }
.reviewerQuestion { margin-bottom:14px; }
.reviewerQuestionPrompt { margin:0 0 4px; }
.reviewerSubLabel { display:block; margin:6px 0 2px; font-style:italic; }
/* Highlight SDRC reviewer-entered data (comments, answers, scores) so it stands out. */
.reviewerAnswers { margin:4px 0 8px; padding:8px 10px 8px 28px; background:#eef6ff; border:1px solid #d5e6fb; border-radius:4px; }
.reviewerAnswers li { margin-bottom:4px; }
.reviewerAnswersBlock { margin-top:10px; }
.scoreGrid .reviewerRow td { background:#eef6ff; }
.requiredMark { display:inline-block; margin-left:8px; color:#b00020; font-weight:bold; font-size:0.85em; }