/* ===== Client Sources (separate layout, no market-* classes) ===== */

.cs-layout{
  display:flex;
  gap:30px;
  align-items:flex-start;
}

.cs-sidebar{
  
  min-width:280px;
}

.cs-main{
  flex:1;
  min-width:0;
}

@media (max-width:768px){
  .cs-layout{ flex-direction:column; }
  .cs-sidebar{ width:100%; min-width:0; }
}

/* ===== Panels ===== */

.cs-panels{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:20px;
}

@media (max-width:768px){
  .cs-panels{ grid-template-columns: 1fr; }
}

.cs-panel{
 
}

.cs-title{
  margin:0 0 8px;
  font-size:14pt;
  font-weight:600;
}

.cs-desc{
  margin:0 0 12px;
  font-size:10.5pt;
  line-height:1.4;
  color:#777;
}

/* ===== Guest box ===== */

.cs-guest{
  font-size:10.5pt;
  line-height:1.4;
  margin: 20px 0px;
}

.cs-guest-actions{
  margin-top:12px;
}

/* ===== Tabs ===== */

.cs-tabs{
  display:flex;
  gap:10px;
  margin: 10px 0 12px;
}

.cs-tab{
  border:1px solid rgba(0,0,0,.12);
  background: rgba(0,0,0,.03);
  border-radius:10px;
  padding:8px 12px;
  cursor:pointer;
  font-size:10.5pt;
  line-height:1;
  user-select:none;
}

.cs-tab.is-active{
  background: rgba(0,0,0,.06);
  border-color: rgba(0,0,0,.18);
}

.cs-tabpanels{
  margin-top:6px;
}

.cs-tabpanel{
  display:none;
}

.cs-tabpanel.is-active{
  display:block;
}

/* placeholder */
.cs-empty{
  padding:12px 0 0;
  color:#888;
  font-size:10.5pt;
}

/* Родитель каждого поля формы */
.cck_form .field-d.js_cck_form_param{
  position: relative;
}

/* подсказка */
.cck_form_param_text {
	position: absolute;
	top: 50%;
	left: calc(100% + 12px);
	transform: translateY(-50%);

	min-width: 220px;
	max-width: 280px;

	background: #fff;
	border: 1px solid #d3d3d3;
	border-radius: 6px;
	padding: 10px 12px;

	font-size: 10.5pt;
	line-height: 1.4;
	color: #555;

	box-shadow: 0 6px 15px rgba(0,0,0,0.08);

	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease;

	z-index: 10;
}

/* показываем при наведении */
.field-d:hover .cck_form_param_text {
	opacity: 1;
	visibility: visible;
}
/* === MOBILE FIX === */
@media (max-width: 768px) {
	.cck_form_param_text {
		display: none !important;
	}
}

/* чтобы тултип мог выходить за границы блоков */
.market-layout,
.market-sidebar,
.market-content,
.jobborder{
  overflow: visible !important;
}

/* тултип справа, чуть залезает на форму */
.field-d{ position: relative; }

.cck_form_param_text{
  left: calc(100% = 12px);   /* было +12px, стало -10px (заход на форму) */
  right: auto;
  z-index: 9999;
}

/* показываем при наведении (если вдруг потерялось) */
.field-d:hover .cck_form_param_text{
  opacity: 1;
  visibility: visible;
}
.market-meta{
	margin-top:30px;
    font-size: 10pt;
}

.market-title{
  position: relative;
  padding-left: 12px;
}

.market-title::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.15em;
  bottom: 0.15em;
  width: 3px;
  border-radius: 2px;
  background: var(--brand-blue, #3a8ac9);
}

.cs-bars{ display:flex; flex-direction:column; gap:14px; margin-top:14px; }

.cs-bar-head{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:12px;
	margin-bottom:6px;
}

.cs-bar-label{
	font-size:11pt;
	color:#222;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	max-width:70%;
}

.cs-bar-val{
	font-size:10.5pt;
	color:#444;
	white-space:nowrap;
}
.cs-bar-n{ color:#888; }

.cs-bar-track{
	height:10px;
	border-radius:999px;
	background:rgba(0,0,0,.08);
	overflow:hidden;
}

.cs-bar-fill{
	height:100%;
	border-radius:999px;
	background: var(--brand-blue, #3a8ac9);
}

@media (max-width:768px){
	.cs-bar-label{ max-width:62%; }
}
