
/* V188 relationship header spacing.
   Based on V187 compact relationship controls.
   Organizer controls only: card state machine and company interactions remain unchanged. */
.lovix-rel-panel-head{padding:22px 24px 17px;position:sticky;top:8px;z-index:24;background:rgba(255,255,255,.97);border-radius:28px 28px 18px 18px;box-shadow:0 10px 24px rgba(18,18,18,.035);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.lovix-rel-head{
  display:grid;
  grid-template-columns:minmax(280px,1fr) auto;
  grid-template-areas:"copy production" "copy modes";
  align-items:start;
  column-gap:26px;
  row-gap:9px;
}
.lovix-rel-head-copy{grid-area:copy;min-width:0;padding-top:2px}
.lovix-rel-title{display:inline-flex;align-items:center;color:#181818;font-size:18px;font-weight:660;line-height:1.1;text-decoration:none;border-radius:8px}
.lovix-rel-title:hover{opacity:.72}
.lovix-rel-head-copy p{margin:10px 0 0;color:#77756d;font-size:12px;line-height:1.45}
.lovix-rel-head-copy small{display:block;margin-top:5px;color:#aaa79e;font-size:11px;line-height:1.35}
.lovix-rel-production{grid-area:production;justify-self:end;display:inline-flex;align-items:center;gap:8px;color:#aaa79e;font-size:11px;white-space:nowrap;padding:3px 4px 0 0}
.lovix-rel-production span{width:8px;height:8px;border-radius:999px}

.lovix-rel-mode-tabs{
  grid-area:modes;
  justify-self:end;
  display:grid;
  grid-template-columns:repeat(4,auto);
  gap:3px;
  padding:3px;
  border:1px solid #e7e5de;
  background:#fafaf7;
  border-radius:15px;
  box-shadow:0 3px 10px rgba(18,18,18,.025);
}
.lovix-rel-mode-button{
  min-width:102px;height:38px;padding:0 13px;border:0;border-radius:11px;background:transparent;color:#77756d;
  display:flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;
  transition:background-color .16s ease,color .16s ease,box-shadow .16s ease;
}
.lovix-rel-mode-button strong{font-size:12px;font-weight:660;line-height:1}
.lovix-rel-mode-button span{font-size:9px;color:#aaa79e;white-space:nowrap;line-height:1}
.lovix-rel-mode-button:hover{background:#fff;color:#181818}
.lovix-rel-mode-button.is-active{background:#181818;color:#fff;box-shadow:0 3px 9px rgba(18,18,18,.12)}
.lovix-rel-mode-button.is-active span{color:rgba(255,255,255,.66)}
.lovix-rel-mode-button:focus-visible,.lovix-rel-stat-button:focus-visible,.lovix-rel-channel-trigger:focus-visible,.lovix-rel-channel-option:focus-visible,.lovix-rel-group-main:focus-visible,.lovix-rel-collapse:focus-visible{outline:2px solid #d7f24a;outline-offset:2px}

.lovix-rel-toolbar{
  margin-top:24px;padding:10px 12px;display:grid;grid-template-columns:repeat(var(--lovix-rel-toolbar-columns,6),minmax(0,1fr));align-items:start;gap:8px;
  border:1px solid #e8e6df;border-radius:16px;background:#fafaf7;min-width:0;
}
.lovix-rel-channel-picker{position:relative;width:100%;min-width:0;z-index:22}
.lovix-rel-channel-trigger{
  width:100%;height:40px;min-width:0;padding:0 12px;border:1px solid #e8e6df;border-radius:12px;background:#fff;color:#77756d;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;cursor:pointer;white-space:nowrap;transition:.16s ease;
}
.lovix-rel-channel-trigger.is-distribution{grid-template-columns:minmax(0,1fr) auto}
.lovix-rel-channel-trigger.is-distribution strong{text-align:left}
.lovix-rel-channel-trigger:hover,.lovix-rel-channel-trigger.is-open{border-color:#dfe7ad;background:#f8faea;color:#59651d}
.lovix-rel-channel-trigger-label{font-size:9px;letter-spacing:.10em;color:#aaa79e;font-weight:650}
.lovix-rel-channel-trigger strong{font-size:10.5px;font-weight:400;color:#77756d}
.lovix-rel-channel-trigger.is-open strong{color:#59651d}
.lovix-rel-channel-caret{font-size:0;width:7px;height:7px;border-right:1.4px solid #9b9b96;border-bottom:1.4px solid #9b9b96;transform:rotate(45deg) translateY(-1px);transform-origin:center;transition:transform .16s ease,border-color .16s ease}
.lovix-rel-channel-trigger.is-open .lovix-rel-channel-caret{transform:rotate(225deg) translate(-1px,-1px);border-color:#7f8950}
.lovix-rel-channel-menu{
  position:absolute;left:0;top:calc(100% + 7px);width:150px;padding:7px;border:1px solid #e8e6df;border-radius:14px;background:#fff;
  box-shadow:0 18px 40px rgba(18,18,18,.10),0 2px 8px rgba(18,18,18,.035);z-index:60;
}
.lovix-rel-channel-option{
  height:36px;padding:0 10px;border-radius:10px;color:#77756d;text-decoration:none;font-size:11px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;transition:.14s ease;
}
.lovix-rel-channel-option:hover{background:#fafaf7;color:#181818}
.lovix-rel-channel-option.is-active{background:#f4f8d9;color:#59651d;font-weight:650}
.lovix-rel-channel-option b{font-size:11px;font-weight:700}

.lovix-rel-stat-grid{
  display:contents;
}
.lovix-rel-stat-button{
  height:40px;min-width:0;padding:0 11px;border:1px solid #e8e6df;border-radius:12px;background:#fff;color:#77756d;
  display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;white-space:nowrap;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease;
}
.lovix-rel-stat-button:hover{border-color:var(--rel-border);background:#fff}
.lovix-rel-stat-button.is-active{background:var(--rel-soft);border-color:var(--rel-border);color:var(--rel-text);box-shadow:0 3px 10px color-mix(in srgb,var(--rel-border) 36%,transparent)}
.lovix-rel-stat-name{display:flex;align-items:center;gap:7px;min-width:0;font-size:10.5px}
.lovix-rel-stat-name i{display:block;width:8px;height:8px;border-radius:999px;background:var(--rel-dot);flex:none}
.lovix-rel-stat-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lovix-rel-stat-button strong{font-size:13px;font-weight:680;flex:none}

.lovix-rel-country-summary{
  flex:1 1 auto;min-width:0;display:flex;flex-wrap:nowrap;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none;
}
.lovix-rel-country-summary::-webkit-scrollbar{display:none}
.lovix-rel-country-summary>div{height:40px;min-width:132px;flex:1 1 0;padding:0 12px;border:1px solid #e8e6df;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px;white-space:nowrap}
.lovix-rel-country-summary span{font-size:11px;color:#77756d}.lovix-rel-country-summary strong{font-size:13px;color:#181818}

.lovix-rel-group{margin-top:14px;padding:12px 13px 14px;border:1px solid var(--rel-border);border-radius:18px;background:var(--rel-surface);box-shadow:0 7px 22px rgba(18,18,18,.016);transition:.16s ease}
.lovix-rel-group-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:0}
.lovix-rel-group-main{min-width:0;min-height:46px;padding:7px 9px;border:0;border-radius:12px;background:transparent;display:grid;grid-template-columns:auto minmax(145px,210px) minmax(0,1fr);align-items:center;gap:11px;text-align:left;cursor:pointer;color:#181818;transition:.16s ease}
.lovix-rel-group-main:hover{background:rgba(255,255,255,.62)}
.lovix-rel-group-main>i{width:9px;height:9px;border-radius:999px;background:var(--rel-dot)}
.lovix-rel-group-title{min-width:0;display:flex;align-items:baseline;gap:8px}
.lovix-rel-group-title strong{font-size:14px;font-weight:680;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lovix-rel-group-title small{font-size:10px;color:#aaa79e;white-space:nowrap}
.lovix-rel-group-description{min-width:0;padding-left:11px;border-left:1px solid color-mix(in srgb,var(--rel-border) 68%,transparent);font-size:11px;color:#77756d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lovix-rel-collapse{height:34px;padding:0 12px;border:1px solid var(--rel-border);border-radius:11px;background:rgba(255,255,255,.80);color:var(--rel-text);display:inline-flex;align-items:center;gap:6px;font-size:11px;cursor:pointer;white-space:nowrap;transition:.16s ease}
.lovix-rel-collapse:hover{background:#fff}.lovix-rel-collapse svg{transition:.16s ease}
.lovix-rel-group-body{margin-top:9px;display:flex;flex-direction:column;gap:11px}

@media(max-width:1180px){
  .lovix-rel-head{grid-template-columns:minmax(230px,1fr) auto;column-gap:18px}
  .lovix-rel-mode-button{min-width:90px;padding:0 10px}
  .lovix-rel-stat-button{min-width:106px}
}
@media(max-width:850px){
  .lovix-rel-panel-head{padding:20px 18px 16px}
  .lovix-rel-head{grid-template-columns:1fr;grid-template-areas:"copy" "production" "modes";gap:11px}
  .lovix-rel-production{justify-self:start;padding:0}
  .lovix-rel-mode-tabs{justify-self:start;max-width:100%;overflow-x:auto}
  .lovix-rel-toolbar{margin-top:14px;overflow:visible;grid-template-columns:repeat(2,minmax(118px,1fr))}
  .lovix-rel-channel-trigger{min-width:104px}
  .lovix-rel-panel-head{top:6px}
  .lovix-rel-country-summary{overflow-x:auto}
  .lovix-rel-country-summary>div{flex:0 0 150px}
  .lovix-rel-group-main{grid-template-columns:auto minmax(0,1fr)}
  .lovix-rel-group-description{display:none}
}
