/**
 * Conister Bank skin — mirrors conisterbank.co.im (Andrew 2026-10-01).
 *
 * Palette lifted from the bank's own stylesheet: purple #522B80 header /
 * footer / headings, lavender #9A78B5 sub-headings + accents, lime #94D500
 * buttons + the corner tab, #f5f5f5 page tint, 5px shadow-boxes.
 * Typeface: the bank uses Geomanist (commercial, not licensable for us);
 * the install's font options are set to Outfit, the closest free match.
 *
 * Scoped to body.th-skin-conister-bank and only enqueued on the public site.
 */

.th-skin-conister-bank {
	--cb-purple: #522B80;
	--cb-purple-dark: #3f2163;
	--cb-lavender: #9A78B5;
	--cb-lime: #94D500;
	--cb-lime-dark: #7fb800;
	--cb-ink: #050709;
	--cb-tint: #f5f5f5;
	--cb-rule: #dfdfdf;
	--cb-row: 62.5rem;
	--cb-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.25);
	color: var(--cb-ink);
}

/* ===== Header: purple band, white logo + nav, lime corner tab ===== */
.th-skin-conister-bank .site-header {
	background: var(--cb-purple);
	border-bottom: 1px solid #a56fa8;
}
.th-skin-conister-bank .header-container {
	max-width: var(--cb-row);
	height: 96px;
	position: relative;
}
/* Logo is uploaded in brand purple (so it reads on white login/email
   backgrounds); knock it out to white on the purple bars, as the bank does. */
.th-skin-conister-bank .header-logo .custom-logo,
.th-skin-conister-bank .footer-logo .custom-logo {
	filter: brightness(0) invert(1);
}
.th-skin-conister-bank .header-logo .custom-logo {
	max-height: 44px;
}
.th-skin-conister-bank .site-title a {
	color: #fff;
}
.th-skin-conister-bank .primary-menu > li > a {
	color: #fff;
	border-bottom: 3px solid transparent;
	padding-left: 6px;
	padding-right: 6px;
}
.th-skin-conister-bank .primary-menu > li > a:hover,
.th-skin-conister-bank .primary-menu > li > a:focus,
.th-skin-conister-bank .primary-menu > li.current-menu-item > a,
.th-skin-conister-bank .primary-menu > li.current_page_item > a {
	color: #fff;
	border-bottom-color: #fff;
}
.th-skin-conister-bank .header-action-link {
	color: #fff;
}
.th-skin-conister-bank .header-action-link:hover,
.th-skin-conister-bank .header-action-link:focus {
	color: #fff;
}
.th-skin-conister-bank .header-action-secondary {
	border-color: rgba(255, 255, 255, 0.6);
	color: #fff;
}
.th-skin-conister-bank .header-action-secondary:hover,
.th-skin-conister-bank .header-action-secondary:focus {
	background: #fff;
	border-color: #fff;
	color: var(--cb-purple);
}
/* Register = the bank's lime "QuickPay" tab hanging off the top edge. */
.th-skin-conister-bank .header-action-primary {
	background: var(--cb-lime);
	border-color: var(--cb-lime);
	border-radius: 0 0 10px 10px;
	align-self: flex-start;
	padding: 10px 22px;
	box-shadow: none;
}
.th-skin-conister-bank .header-action-primary:hover,
.th-skin-conister-bank .header-action-primary:focus {
	background: var(--cb-lime-dark);
	border-color: var(--cb-lime-dark);
}
.th-skin-conister-bank .header-actions {
	align-self: stretch;
	align-items: center;
}
.th-skin-conister-bank .menu-icon-bar {
	background-color: var(--cb-lavender);
	height: 3px;
}

/* ===== Page body ===== */
.th-skin-conister-bank #container {
	background: var(--cb-tint);
}
.th-skin-conister-bank h1,
.th-skin-conister-bank h3 {
	color: var(--cb-purple);
}
.th-skin-conister-bank h2 {
	color: var(--cb-lavender);
}
/* Sizes only on the skinned careers page — the candidate dashboard and
   apply flow keep the standard TalentHub type scale. */
.cb-careers h1 {
	font-size: 52px;
	line-height: 1.15;
	margin: 0 0 13px;
}
.cb-careers h2 {
	font-size: 28px;
	margin: 0 0 20px;
}
.cb-careers h3 {
	font-size: 24px;
	font-weight: 400;
	line-height: 1.25;
	margin: 0 0 5px;
}
.th-skin-conister-bank a {
	color: var(--cb-purple);
}
.th-skin-conister-bank .btn-primary,
.th-skin-conister-bank .button-primary,
.th-skin-conister-bank button[type="submit"],
.th-skin-conister-bank input[type="submit"] {
	background-color: var(--cb-lime);
	border-color: var(--cb-lime);
	color: #fff;
	border-radius: 3px;
}
.th-skin-conister-bank .btn-primary:hover,
.th-skin-conister-bank .btn-primary:focus,
.th-skin-conister-bank button[type="submit"]:hover,
.th-skin-conister-bank input[type="submit"]:hover {
	background-color: var(--cb-lime-dark);
	border-color: var(--cb-lime-dark);
	color: #fff;
}

/* ===== Careers homepage (skins/conister-bank/front-page.php) ===== */
.cb-row {
	max-width: var(--cb-row);
	margin: 0 auto;
	padding: 0 15px;
}
.cb-breadcrumb {
	padding: 20px 0;
}
.cb-breadcrumbs {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	font-size: 12px;
}
.cb-breadcrumbs li,
.cb-breadcrumbs a {
	color: var(--cb-ink);
	text-decoration: none;
}
.cb-breadcrumbs li + li::before {
	content: "/";
	margin: 0 8px;
	color: #aaa;
}
.cb-breadcrumbs a:hover {
	text-decoration: underline;
}
.cb-content {
	padding-bottom: 50px;
}
.cb-cols {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 30px;
	align-items: start;
}
.cb-shadowbox {
	background: #fff;
	border-radius: 5px;
	box-shadow: var(--cb-shadow);
	overflow: hidden;
	margin-bottom: 30px;
}
.cb-head {
	background: var(--cb-purple);
	color: #fff;
	font-size: 22px;
	padding: 15px 20px;
}
.cb-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.cb-nav li + li a {
	border-top: 1px solid var(--cb-tint);
}
.cb-nav a {
	display: block;
	padding: 20px;
	color: var(--cb-purple);
	font-size: 16px;
	text-decoration: none;
	background: #fff;
}
.cb-nav a:hover,
.cb-nav a:focus,
.cb-nav a.current {
	background: var(--cb-purple);
	color: #fff;
}
.cb-callus {
	padding: 15px 20px;
}
.cb-callus p {
	color: var(--cb-purple);
	font-size: 16px;
	margin: 0 0 10px;
}
.cb-callus p a {
	display: block;
	color: var(--cb-lavender);
	font-size: 36px;
	line-height: 1.2;
	text-decoration: none;
}
.cb-schedule {
	font-size: 14px;
}
.cb-join p {
	padding: 15px 20px 0;
	margin: 0;
	font-size: 15px;
}
.cb-btn {
	display: inline-block;
	margin: 15px 20px 20px;
	padding: 10px 15px;
	background: var(--cb-lime);
	color: #fff !important;
	font-size: 16px;
	font-weight: 500;
	border-radius: 3px;
	text-decoration: none;
}
.cb-btn:hover,
.cb-btn:focus {
	background: var(--cb-lime-dark);
}
.cb-intro {
	margin-bottom: 30px;
}
.cb-intro p,
.cb-intro li {
	font-size: 16px;
	line-height: 1.6;
}
.cb-intro hr {
	border: 0;
	border-top: 1px solid var(--cb-rule);
	margin: 20px 0;
}
.cb-intro h3 {
	margin-top: 25px;
}
.cb-vacancies-title {
	color: var(--cb-purple);
	margin-top: 10px;
}
.cb-job-body {
	padding: 20px 20px 5px;
}
.cb-job-body h3 a {
	color: var(--cb-purple);
	text-decoration: none;
}
.cb-job-body h3 a:hover {
	text-decoration: underline;
}
.cb-job-meta {
	color: var(--cb-lavender);
	font-size: 14px;
	margin: 0 0 12px;
}
.cb-job-footer {
	position: relative;
	display: block;
	margin: 0;
	padding: 20px 20px 20px 60px;
	border-top: 1px solid var(--cb-rule);
	background: #fff;
	color: var(--cb-purple);
	font-size: 16px;
	text-decoration: none;
	cursor: pointer;
	list-style: none;
}
.cb-job-footer::-webkit-details-marker {
	display: none;
}
/* The bank's circled "+" marker; rotates to "×" when expanded. */
.cb-job-footer::before {
	content: "+";
	position: absolute;
	left: 20px;
	top: 50%;
	width: 22px;
	height: 22px;
	margin-top: -11px;
	border-radius: 50%;
	background: #e2d0e3;
	color: var(--cb-purple);
	font-size: 18px;
	line-height: 22px;
	text-align: center;
	transition: transform 0.2s ease;
}
.cb-job-details[open] > .cb-job-footer::before {
	transform: rotate(45deg);
}
.cb-job-apply::before {
	content: "›";
	background: var(--cb-lime);
	color: #fff;
}
.cb-job-footer:hover,
.cb-job-footer:focus {
	background: #faf7fc;
}
.cb-job-full {
	border-top: 1px solid var(--cb-rule);
	padding-bottom: 15px;
}
.cb-job-full h3 {
	font-size: 20px;
	margin-top: 15px;
}

/* ===== Footer: purple info band, light legal strip ===== */
.th-skin-conister-bank .site-footer {
	background: var(--cb-tint);
	border-top: 0;
}
.th-skin-conister-bank .footer-main {
	background: var(--cb-purple);
	padding: 40px 0;
}
.th-skin-conister-bank .site-footer .container {
	max-width: var(--cb-row);
}
.th-skin-conister-bank .footer-main,
.th-skin-conister-bank .footer-main p,
.th-skin-conister-bank .footer-main li,
.th-skin-conister-bank .footer-main a,
.th-skin-conister-bank .footer-heading {
	color: #fff;
}
.th-skin-conister-bank .footer-main a:hover {
	color: var(--cb-lime);
}
.th-skin-conister-bank .footer-tagline {
	color: #fff;
	opacity: 1;
}
.th-skin-conister-bank .footer-logo .custom-logo {
	width: 220px;
	max-width: 100%;
	height: auto;
}
.th-skin-conister-bank .social-link {
	color: #fff;
	border-color: rgba(255, 255, 255, 0.5);
}
.th-skin-conister-bank .footer-copyright {
	background: var(--cb-tint);
	border-top: 0;
}
.th-skin-conister-bank .copyright-text,
.th-skin-conister-bank .footer-legal-links a {
	color: var(--cb-ink);
	font-size: 12px;
}

/* ===== Mobile ===== */
@media (max-width: 1024px) {
	.cb-careers h1 { font-size: 42px; }
}
@media (max-width: 767px) {
	.th-skin-conister-bank .header-container { height: 72px; }
	.th-skin-conister-bank .header-logo .custom-logo { max-height: 34px; }
	.cb-careers h1 { font-size: 34px; }
	.cb-careers h2 { font-size: 22px; }
	.cb-cols { grid-template-columns: 1fr; }
	/* Vacancies first on a phone; the side menu drops below. */
	.cb-leftcol { order: 2; }
	.cb-head { font-size: 20px; }
	.cb-callus p a { font-size: 30px; }
}
