/**
 * Styles for the account notifications page
 *
 * body_class: account notifications bg-light
 *
 * @author      Jim Mock
 * @copyright   2019, ON1
 */

/*------------------------------------------------------------------------------
 * Content
 -----------------------------------------------------------------------------*/
body.account.notifications #site-main #notifications li {
	border-radius: 3px;
	margin-bottom: 2rem;
}

body.account.notifications #site-main #notifications li:last-of-type { margin-bottom: 0; }
body.account.notifications #site-main #notifications li:nth-of-type(odd) { background-color: #f6f6f7; }
body.account.notifications #site-main #notifications li .read-status { cursor: pointer; }

body.account.notifications #site-main #notifications li .indicator {
	background-color: #0a7efa;
	border-radius: 100%;
	display: inline-block;
	height: 12px;
	width: 12px;
}

body.account.notifications #site-main #notifications li .indicator.mark-read { visibility: hidden; }

body.account.notifications #site-main #notifications li .msg h2 {
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.5;
	margin-bottom: 0;
}

body.account.notifications #site-main #notifications li .msg h3 {
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.8;
	margin-bottom: 0;
	margin-top: 1rem;
}

body.account.notifications #site-main #notifications li .msg-date { font-size: 0.875rem; }

body.account.notifications #site-main #notifications li .del-msg { cursor: pointer; }

body.account.notifications.preferences #site-main #account-notifications form label {
	color: #7c7c7d;
	display: block;
	font-size: 0.875rem;
	margin-bottom: 0;
}

body.account.notifications.preferences #site-main #account-notifications form .form-control:focus { border-color: #0a7efa; }
body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group { margin-bottom: 1rem; }
body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .form-check { margin-left: 1rem; }

body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .form-check label {
	font-size: 1rem;
	padding-left: 0.5rem;
}

body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .abc-checkbox input[type="checkbox"], body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .abc-checkbox input[type="radio"] { display: none; }
body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .abc-checkbox label::before { top: 4px; }
body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .abc-checkbox label::after { top: 3px; }
body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .form-check-input { margin-top: 0; }

body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .abc-checkbox.abc-checkbox-lg label::before {
	height: 20px;
	width: 20px;
}

body.account.notifications.preferences #site-main #account-notifications form .form-group.checkbox-group .abc-checkbox.abc-checkbox-lg label::after{
	font-size: 12px;
	height: 20px;
	top: 5px;
	width: 20px;
}