/* Start:/local/templates/mconcept/components/bitrix/news.list/client_journal/style.css?178533312616605*/
/* ============================================================
   client_journal — style.css
   Премиальный дизайн журнала доработок (сайт/1С)
   ============================================================ */

:root, [data-theme="light"]{
  --color-bg:#f6f4ef; --color-surface:#fbfaf7; --color-surface-2:#ffffff;
  --color-surface-offset:#f0ede6; --color-surface-offset-2:#e8e4dc;
  --color-divider:#e2ddd3; --color-border:#dcd6ca;
  --color-text:#211f19; --color-text-muted:#71695c; --color-text-faint:#b3ab9c; --color-text-inverse:#faf8f4;
  --color-primary:#0b5c56; --color-primary-hover:#094a45; --color-primary-active:#073936; --color-primary-highlight:#dbe7e2;
  --color-warning:#8a4a1f; --color-warning-highlight:#e3d2c1;
  --color-success:#3f6b2b; --color-success-highlight:#dde6d2;
  --color-blue:#2b5a7a; --color-blue-highlight:#d8e3ea;
  --color-gold:#a3781f; --color-gold-highlight:#ecdfc0;
  --radius-sm:.4rem; --radius-md:.6rem; --radius-lg:.9rem; --radius-xl:1.25rem; --radius-full:9999px;
  --shadow-sm:0 1px 2px oklch(0.25 0.02 60 / 0.05), 0 1px 1px oklch(0.25 0.02 60/.04);
  --shadow-md:0 6px 16px oklch(0.25 0.02 60 / 0.07), 0 2px 4px oklch(0.25 0.02 60/.05);
  --shadow-lg:0 20px 44px oklch(0.25 0.02 60 / 0.12), 0 4px 10px oklch(0.25 0.02 60/.06);
  --font-display:'Fraunces', Georgia, serif;
  --font-body:'General Sans','Inter',sans-serif;
}
[data-theme="dark"]{
  --color-bg:#141311; --color-surface:#1a1917; --color-surface-2:#1f1e1b;
  --color-surface-offset:#1c1b18; --color-surface-offset-2:#24221f;
  --color-divider:#2a2825; --color-border:#37342f;
  --color-text:#e9e6df; --color-text-muted:#98938a; --color-text-faint:#615c53; --color-text-inverse:#211f19;
  --color-primary:#5aada3; --color-primary-hover:#78c2b8; --color-primary-active:#3f8a81; --color-primary-highlight:#25332f;
  --color-warning:#c98851; --color-warning-highlight:#3a2e24;
  --color-success:#8bbb6c; --color-success-highlight:#28311f;
  --color-blue:#7ba9c9; --color-blue-highlight:#212b32;
  --color-gold:#d3aa4f; --color-gold-highlight:#332b1a;
  --shadow-sm:0 1px 2px oklch(0 0 0/.35); --shadow-md:0 8px 20px oklch(0 0 0/.45); --shadow-lg:0 24px 48px oklch(0 0 0/.55);
}

.cj-scope *,.cj-scope *::before,.cj-scope *::after{box-sizing:border-box;margin:0;padding:0}
.cj-scope{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);line-height:1.55;-webkit-font-smoothing:antialiased;font-size:15px;letter-spacing:-0.001em}
.cj-scope img,.cj-scope svg{display:block}
.cj-scope button,.cj-scope input,.cj-scope select{font:inherit;color:inherit}
.cj-scope :focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:4px}

.cj-wrap{max-width:1180px;margin:0 auto;padding:0 clamp(1.25rem,3vw,2.5rem)}

/* Header */
.cj-header{position:sticky;top:0;z-index:60;background:color-mix(in oklab, var(--color-bg) 82%, transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--color-divider)}
.cj-header__inner{display:flex;align-items:center;justify-content:space-between;padding:1.15rem 0;gap:1rem}
.cj-brand{display:flex;align-items:center;gap:.7rem;min-width:0}
.cj-brand__mark{width:36px;height:36px;border-radius:var(--radius-md);background:linear-gradient(155deg, var(--color-primary), var(--color-primary-active));display:flex;align-items:center;justify-content:center;color:var(--color-text-inverse);font-family:var(--font-display);font-weight:600;font-size:1.05rem;box-shadow:var(--shadow-sm);flex-shrink:0}
.cj-brand__text{min-width:0}
.cj-brand__name{font-weight:600;font-size:.92rem;letter-spacing:-.005em;white-space:nowrap}
.cj-brand__sub{font-size:.71rem;color:var(--color-text-muted);white-space:nowrap}
.cj-header-actions{display:flex;align-items:center;gap:.6rem;flex-shrink:0}

/* Client selector (только для менеджера/админа) */
.cj-client-select{position:relative}
.cj-client-select__trigger{display:flex;align-items:center;gap:.55rem;padding:.4rem .8rem .4rem .4rem;border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-surface);cursor:pointer;transition:.2s;box-shadow:var(--shadow-sm)}
.cj-client-select__trigger:hover{border-color:var(--color-primary)}
.cj-client-select__avatar{width:26px;height:26px;border-radius:50%;background:var(--color-primary-highlight);color:var(--color-primary);display:flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:700;flex-shrink:0}
.cj-client-select__label{font-size:.8rem;font-weight:500;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cj-client-select__chevron{width:13px;height:13px;color:var(--color-text-faint);transition:transform .2s}
.cj-client-select.open .cj-client-select__chevron{transform:rotate(180deg)}
.cj-client-select__menu{position:absolute;top:calc(100% + 8px);right:0;width:280px;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:.5rem;display:none;z-index:70;max-height:340px;overflow-y:auto}
.cj-client-select.open .cj-client-select__menu{display:block}
.cj-client-select__search{padding:.3rem .3rem .55rem;border-bottom:1px solid var(--color-divider);margin-bottom:.35rem}
.cj-client-select__search input{width:100%;padding:.5rem .7rem;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface-offset);font-size:.82rem}
.cj-client-select__search input:focus{outline:none;border-color:var(--color-primary)}
.cj-client-item{display:flex;align-items:center;gap:.6rem;padding:.55rem .6rem;border-radius:var(--radius-sm);cursor:pointer;transition:.15s;text-decoration:none;color:inherit}
.cj-client-item:hover{background:var(--color-surface-offset)}
.cj-client-item.active{background:var(--color-primary-highlight)}
.cj-client-item__avatar{width:30px;height:30px;border-radius:50%;background:var(--color-surface-offset-2);color:var(--color-text-muted);display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;flex-shrink:0}
.cj-client-item.active .cj-client-item__avatar{background:var(--color-primary);color:var(--color-text-inverse)}
.cj-client-item__info{min-width:0;flex:1}
.cj-client-item__name{font-size:.83rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cj-client-item__meta{font-size:.71rem;color:var(--color-text-faint)}
.cj-client-item__check{width:15px;height:15px;color:var(--color-primary);flex-shrink:0}

.cj-theme-toggle{width:38px;height:38px;border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-surface);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s;box-shadow:var(--shadow-sm);flex-shrink:0}
.cj-theme-toggle:hover{background:var(--color-surface-offset)}
.cj-theme-toggle svg{width:16px;height:16px;color:var(--color-text-muted)}

/* Hero */
.cj-hero{padding:clamp(2.75rem,6vw,4.5rem) 0 clamp(1.75rem,3vw,2.25rem)}
.cj-hero__eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:var(--color-primary);font-weight:600;margin-bottom:1.1rem}
.cj-hero__eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--color-primary)}
.cj-hero__title{font-family:var(--font-display);font-weight:600;font-size:clamp(1.9rem,3.6vw,2.7rem);letter-spacing:-.015em;max-width:22ch;margin-bottom:.85rem;line-height:1.12}
.cj-hero__desc{font-size:.98rem;color:var(--color-text-muted);max-width:54ch}

/* KPI row */
.cj-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:2.25rem 0 2.75rem}
.cj-kpi{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.35rem 1.45rem;box-shadow:var(--shadow-sm);min-width:0;overflow:hidden;transition:box-shadow .25s,transform .25s}
.cj-kpi:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}
.cj-kpi__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem}
.cj-kpi__icon{width:32px;height:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cj-kpi__icon svg{width:16px;height:16px}
.cj-kpi__icon--teal{background:var(--color-primary-highlight);color:var(--color-primary)}
.cj-kpi__icon--gold{background:var(--color-gold-highlight);color:var(--color-gold)}
.cj-kpi__icon--green{background:var(--color-success-highlight);color:var(--color-success)}
.cj-kpi__icon--blue{background:var(--color-blue-highlight);color:var(--color-blue)}
.cj-kpi__value{font-family:var(--font-display);font-size:1.85rem;font-weight:600;line-height:1;letter-spacing:-.01em}
.cj-kpi__label{font-size:.78rem;color:var(--color-text-muted);margin-top:.45rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cj-kpi__delta{display:inline-flex;align-items:center;gap:.25rem;font-size:.71rem;font-weight:600;margin-top:.65rem;padding:.18rem .55rem;border-radius:var(--radius-full)}
.cj-kpi__delta.up{background:var(--color-success-highlight);color:var(--color-success)}
.cj-kpi__delta.flat{background:var(--color-surface-offset);color:var(--color-text-muted)}

/* Filters */
.cj-filters{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:1.4rem 1.5rem;box-shadow:var(--shadow-sm);margin-bottom:2rem}
.cj-filters__top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.15rem;flex-wrap:wrap}
.cj-search{position:relative;flex:1;min-width:220px}
.cj-search input{width:100%;padding:.68rem .9rem .68rem 2.55rem;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface-offset);font-size:.86rem;transition:border-color .2s,box-shadow .2s,background .2s}
.cj-search input:focus{outline:none;border-color:var(--color-primary);background:var(--color-surface-2);box-shadow:0 0 0 3px var(--color-primary-highlight)}
.cj-search svg{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--color-text-faint)}

.cj-filters__row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) auto;gap:.85rem;align-items:end}
.cj-field{min-width:0}
.cj-field label{display:block;font-size:.71rem;color:var(--color-text-muted);margin-bottom:.4rem;font-weight:500}
.cj-field select,.cj-field input[type=date]{width:100%;padding:.58rem .7rem;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface-offset);font-size:.83rem;cursor:pointer;transition:border-color .2s,background .2s;min-width:0}
.cj-field select:focus,.cj-field input:focus{outline:none;border-color:var(--color-primary);background:var(--color-surface-2)}
.cj-filters__reset{padding:.58rem 1.1rem;border-radius:var(--radius-md);border:1px solid var(--color-border);background:transparent;color:var(--color-text-muted);font-size:.81rem;cursor:pointer;white-space:nowrap;transition:.2s;flex-shrink:0;text-decoration:none;display:inline-flex;align-items:center}
.cj-filters__reset:hover{background:var(--color-surface-offset);color:var(--color-text)}

.cj-chips{display:flex;gap:.5rem;margin-top:1rem;flex-wrap:wrap}
.cj-chip{display:inline-flex;align-items:center;gap:.4rem;padding:.32rem .7rem;border-radius:var(--radius-full);background:var(--color-primary-highlight);color:var(--color-primary);font-size:.75rem;font-weight:500;max-width:220px;text-decoration:none}
.cj-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cj-chip b{background:none;border:none;color:inherit;cursor:pointer;display:flex;font-size:.9rem;line-height:1;flex-shrink:0;font-weight:400}

/* Section heading */
.cj-section-heading{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:1.2rem;gap:1rem}
.cj-section-heading h2{font-family:var(--font-display);font-size:1.28rem;font-weight:600;letter-spacing:-.01em}
.cj-section-heading span{font-size:.79rem;color:var(--color-text-muted);white-space:nowrap}

/* Journal entries */
.cj-journal{display:flex;flex-direction:column;gap:.85rem;margin-bottom:2.5rem}
.cj-entry{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.4rem 1.5rem;box-shadow:var(--shadow-sm);transition:box-shadow .25s,transform .25s,border-color .25s;overflow:hidden}
.cj-entry:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:color-mix(in oklab, var(--color-primary) 30%, var(--color-border))}
.cj-entry__top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.75rem;flex-wrap:wrap}
.cj-entry__meta{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;min-width:0}
.cj-tag{font-size:.71rem;font-weight:600;padding:.24rem .62rem;border-radius:var(--radius-full);white-space:nowrap}
.cj-tag--site{background:var(--color-blue-highlight);color:var(--color-blue)}
.cj-tag--1c{background:var(--color-gold-highlight);color:var(--color-gold)}
.cj-tag--exchange{background:var(--color-primary-highlight);color:var(--color-primary)}
.cj-tag--crm{background:var(--color-warning-highlight);color:var(--color-warning)}
.cj-status{display:inline-flex;align-items:center;gap:.35rem;font-size:.71rem;font-weight:600;padding:.24rem .68rem;border-radius:var(--radius-full);white-space:nowrap}
.cj-status::before{content:'';width:6px;height:6px;border-radius:50%;flex-shrink:0}
.cj-status--done{background:var(--color-success-highlight);color:var(--color-success)}
.cj-status--done::before{background:var(--color-success)}
.cj-status--progress{background:var(--color-gold-highlight);color:var(--color-gold)}
.cj-status--progress::before{background:var(--color-gold)}
.cj-status--planned{background:var(--color-surface-offset);color:var(--color-text-muted)}
.cj-status--planned::before{background:var(--color-text-faint)}
.cj-status--review{background:var(--color-blue-highlight);color:var(--color-blue)}
.cj-status--review::before{background:var(--color-blue)}
.cj-entry__date{font-size:.77rem;color:var(--color-text-faint);white-space:nowrap;flex-shrink:0}
.cj-entry__title{font-size:.97rem;font-weight:600;margin-bottom:.45rem;letter-spacing:-.005em;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cj-entry__desc{font-size:.86rem;color:var(--color-text-muted);max-width:70ch;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cj-entry__footer{display:flex;align-items:center;gap:1.15rem;margin-top:1rem;padding-top:.85rem;border-top:1px solid var(--color-divider);font-size:.77rem;color:var(--color-text-faint);flex-wrap:wrap}
.cj-entry__footer span{display:flex;align-items:center;gap:.35rem;white-space:nowrap}
.cj-entry__footer svg{width:14px;height:14px;flex-shrink:0}

/* pagination — используются нативные классы Bitrix .bx-pagination внутри .cj-pagination */
.cj-pagination{display:flex;justify-content:center;margin-bottom:4rem}
.cj-pagination nav{display:flex;gap:.4rem}
.cj-pagination a, .cj-pagination span{display:flex;align-items:center;justify-content:center;min-width:36px;height:36px;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-muted);cursor:pointer;font-size:.83rem;transition:.2s;text-decoration:none;padding:0 .5rem}
.cj-pagination .bx-active, .cj-pagination a.bx-active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}
.cj-pagination a:hover{background:var(--color-surface-offset)}

/* footer */
.cj-footer{border-top:1px solid var(--color-divider);padding:2.2rem 0;text-align:center;color:var(--color-text-faint);font-size:.79rem}

/* empty */
.cj-empty{text-align:center;padding:3.5rem 1rem;color:var(--color-text-muted)}
.cj-empty svg{width:38px;height:38px;margin:0 auto 1rem;color:var(--color-text-faint)}
.cj-empty p{font-size:.88rem}

@media (max-width:960px){
  .cj-kpis{grid-template-columns:repeat(2,1fr)}
  .cj-filters__row{grid-template-columns:1fr 1fr}
  .cj-filters__row .cj-field:nth-child(5){display:none}
  .cj-client-select__label{max-width:90px}
}
@media (max-width:560px){
  .cj-kpis{grid-template-columns:1fr 1fr;gap:.7rem}
  .cj-kpi{padding:1.05rem 1.1rem}
  .cj-filters__row{grid-template-columns:1fr}
  .cj-filters__reset{width:100%;justify-content:center}
  .cj-entry__top{flex-direction:column;align-items:flex-start}
  .cj-entry{padding:1.15rem 1.2rem}
  .cj-brand__sub{display:none}
  .cj-client-select__menu{width:250px;right:-40px}
}

/* End */
/* /local/templates/mconcept/components/bitrix/news.list/client_journal/style.css?178533312616605 */