/* css/calviews.css — вьюхи календаря (чипы кита v14): «сегодня» — дневной
   таймлайн, «неделя» — дни-карточки, «месяц» — сетка с точками + список,
   «год» — 12 месяцев. Разметку строит js/calviews.js; карандашные подложки —
   sk-tabbar mount (absolute SVG первым ребёнком), тут геометрия и типографика.
   Анимаций нет; цвета — токены tokens.css. */

.cv-host{max-width:980px; margin:0 auto; padding:14px 20px 60px;}
.cv-host[hidden]{display:none;}

/* карточка-контейнер вьюхи; контент выше absolute-подложки mount'а */
.cv-card{position:relative; padding:16px 14px;}
.cv-card > *{position:relative;}

/* задача во вьюхе (контур+hatch цветом владельца — js) */
.cv-ev{display:flex; gap:9px; align-items:center; min-height:34px;
  padding:5px 10px; cursor:pointer;}
.cv-ev > *{position:relative;}
.cv-ev time{font-size:.82rem; color:var(--pencil); white-space:nowrap;}
.cv-ev .cv-et{font-size:.97rem; line-height:1.2; min-width:0; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap;}
.cv-ev .cv-ava{margin-left:auto; flex:0 0 auto; display:flex;}
.cv-ev .cv-ava .ava{width:22px; height:22px; font-size:.72rem;}
.cv-ev.cv-dn{opacity:.62;}
.cv-ev.cv-dn .cv-et{text-decoration:line-through; color:var(--pencil);}
.cv-evs{margin:2px 0;} /* чип в потоке (весь день / день недели / список месяца) */

.cv-free{color:var(--pencil); font-size:.88rem; font-style:italic;}

/* ── «сегодня»: вертикальный таймлайн 08:00–22:00 ── */
.cv-allday{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:0 2px 10px;}
.cv-adl{font-size:.78rem; letter-spacing:2.5px; text-transform:uppercase; color:var(--pencil);}
.cv-allday .cv-evs{display:inline-flex; max-width:100%; min-width:0; min-height:32px; padding:4px 10px;}
.cv-tl{position:relative;}
.cv-hl{position:absolute; left:56px; right:0; border-top:1.8px dashed var(--pencil-faint);}
.cv-hlab{position:absolute; left:0; width:46px; text-align:right; font-size:.82rem;
  color:var(--pencil); transform:translateY(-55%);}
.cv-hlab.cv-nowh{color:var(--graphite);}
.cv-tl .cv-ev{position:absolute; left:64px; right:6px; z-index:2;}
@media (min-width:880px){ .cv-tl .cv-ev.cv-solo{max-width:380px;} }
.cv-nowline{position:absolute; left:50px; right:0; border-top:2.2px solid var(--red); z-index:5;}
.cv-nowline i{position:absolute; left:0; top:-5px; width:9px; height:9px;
  background:var(--red); border-radius:50%;}
.cv-nowline b{position:absolute; right:2px; top:-20px; color:var(--red);
  font-size:.78rem; font-weight:400; letter-spacing:1px;}

/* ── «неделя» ── */
.cv-wk{display:grid; gap:10px;}
@media (min-width:880px){ .cv-wk{grid-template-columns:repeat(7,1fr);} }
.cv-dy{position:relative; padding:10px 10px 12px; min-height:64px; min-width:0;}
.cv-dy > *{position:relative;}
.cv-dh{display:flex; align-items:center; gap:8px; margin-bottom:6px;}
.cv-dh b{font-family:'Caveat',cursive; font-weight:700; font-size:1.3rem; line-height:1;}
.cv-dh span{color:var(--pencil); font-size:.84rem;}
.cv-dy.cv-tod .cv-dh b{background:var(--marker); border-radius:9px 12px 8px 11px; padding:0 7px;}
.cv-dy .cv-ev{padding:4px 8px; min-height:30px;}
.cv-dy .cv-ev time{font-size:.76rem;}

/* ── «месяц» ── */
.cv-mtitle{font-family:'Caveat',cursive; font-weight:700; font-size:1.55rem;
  line-height:1; margin-bottom:8px;}
.cv-mgrid{display:grid; grid-template-columns:repeat(7,1fr); gap:4px;}
.cv-mwd{font-size:.7rem; letter-spacing:2px; text-transform:uppercase; color:var(--pencil);
  text-align:center; padding-bottom:4px;}
.cv-mcell{min-height:50px; text-align:center; padding:3px 0;}
.cv-mnum{font-family:'Caveat',cursive; font-weight:700; font-size:1.2rem; width:30px;
  height:30px; line-height:30px; margin:0 auto; border-radius:10px 13px 9px 12px;}
.cv-mcell.cv-tod .cv-mnum{background:var(--marker);}
.cv-mcell.cv-out{opacity:.32;}
/* выбранный день (тап/протяжка) — контур вокруг числа; поверх today-маркера */
.cv-mcell.cv-msel .cv-mnum{box-shadow:0 0 0 2px var(--graphite);}
/* выделение тапом/протяжкой не должно скроллить страницу под пальцем (touch) */
.cv-mgrid .cv-mcell:not(.cv-out){touch-action:none;}

/* ── режим «назначить на день/время» (swipe-рельса 📅 / меню, js/task-rail.js):
   карточка-«переносимый элемент» над сеткой — пунктир + дрожание (iOS edit-mode),
   ширина = колонка вьюх (.cv-host, 980 c её паддингами); тащится драгом (ghost
   за пальцем, .af-ghost), цели подсвечиваются .af-over. Дрожание — transform-only
   (§1), гаснет под prefers-reduced-motion и body.light-fx. ── */
.assign-float{
  position:sticky; top:8px; z-index:60;
  width:min(940px, calc(100% - 32px)); margin:0 auto 12px;
  display:flex; align-items:center; gap:10px; padding:10px 14px;
  border-radius:16px; background:var(--card,#FFFDF6);
  border:2.5px dashed var(--amber); box-shadow:0 6px 22px rgba(44,42,38,.18);
  cursor:grab; touch-action:none; user-select:none; -webkit-user-select:none;
  animation:af-wobble .38s ease-in-out infinite;
}
@keyframes af-wobble{
  0%,100%{transform:rotate(-.5deg) translateX(-1px);}
  50%{transform:rotate(.55deg) translateX(1px);}
}
body.light-fx .assign-float{animation:none;}
@media (prefers-reduced-motion: reduce){ .assign-float{animation:none;} }
.assign-float.af-drag{opacity:.45; animation:none; cursor:grabbing;}
.assign-float .af-ttl{font-weight:600; color:var(--graphite);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:45%;}
.assign-float .af-hint{color:var(--pencil); font-size:.82rem; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.assign-float .af-ok, .assign-float .af-undo{flex:none; border:0; cursor:pointer;
  font:inherit; font-size:.86rem; padding:7px 12px; border-radius:12px;}
.assign-float .af-ok{margin-left:auto; background:var(--green); color:#fff;}
.assign-float .af-undo{background:none; color:var(--pencil);}
@media (max-width:560px){ .assign-float .af-hint{display:none;} }
/* ghost драга — за пальцем, transform-only; pointer-events:none, чтобы
   elementFromPoint видел цель под ним */
.af-ghost{position:fixed; left:0; top:0; z-index:400; pointer-events:none;
  padding:8px 14px; border-radius:14px; background:var(--card,#FFFDF6);
  border:2.5px dashed var(--amber); box-shadow:0 10px 26px rgba(44,42,38,.28);
  font-size:.92rem; color:var(--graphite); white-space:nowrap;
  transform:translate3d(-500px,-500px,0); will-change:transform;}
/* месяц: день-цель */
body.assign-mode .cv-mcell:not(.cv-out){cursor:pointer;}
.cv-mcell.assign-target .cv-mnum{box-shadow:0 0 0 2px var(--amber);}
.cv-mcell.assign-target:hover .cv-mnum,
.cv-mcell.assign-target.af-over .cv-mnum{background:var(--amber); color:#fff;}
/* неделя: колонка дня — цель */
.cv-dy.assign-target{cursor:pointer;}
.cv-dy.assign-target:hover, .cv-dy.assign-target.af-over{
  outline:2.5px dashed var(--amber); outline-offset:-4px; border-radius:14px;
  background:rgba(221,154,43,.13);}
/* сегодня: слои-цели по часам поверх таймлайна */
.cv-hslot{position:absolute; left:56px; right:0; z-index:3; cursor:pointer; border-radius:10px;}
.cv-hslot .cv-hslot-l{position:absolute; right:8px; top:4px; font-size:.74rem;
  font-weight:600; color:var(--amber); opacity:0;}
.cv-hslot:hover, .cv-hslot.af-over{background:rgba(221,154,43,.15);
  outline:2.5px dashed var(--amber); outline-offset:-2px;}
.cv-hslot:hover .cv-hslot-l, .cv-hslot.af-over .cv-hslot-l{opacity:1;}
.cv-mdots{display:flex; gap:3px; justify-content:center; margin-top:2px; min-height:8px;}
.cv-mdots i{width:7px; height:7px; border-radius:50%;}
/* ── «месяц»: сгруппированный список — отдельная карточка (своя обводка) ── */
.cv-mlistcard{margin-top:14px;}
.cv-mlist{display:flex; flex-direction:column; gap:14px;}
.cv-mgroup > *{position:relative;}
/* заголовок группы: число дня + количество задач */
.cv-gh{display:flex; align-items:baseline; gap:8px; padding:0 2px 4px;}
.cv-gnum{font-family:'Caveat',cursive; font-weight:700; font-size:1.5rem; line-height:1;}
.cv-gcnt{color:var(--pencil); font-size:.84rem;}
/* строка задачи: плоская, слева цветная полоса исполнителя («на ком задача»),
   справа аватар; соседние строки разделяет тонкая черта */
.cv-grow{position:relative; display:flex; gap:9px; align-items:center;
  min-height:38px; padding:7px 10px 7px 18px; cursor:pointer;}
.cv-grow > *{position:relative;}
.cv-bar{position:absolute; left:4px; top:8px; bottom:8px; width:4px;
  border-radius:3px; background:var(--pencil-faint);}
.cv-grow + .cv-grow{border-top:1px dashed var(--pencil-faint);}
.cv-grow time{font-size:.82rem; color:var(--pencil); white-space:nowrap;}
.cv-grow .cv-et{font-size:.97rem; line-height:1.2; min-width:0; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap;}
.cv-grow .cv-ava{margin-left:auto; flex:0 0 auto; display:flex;}
.cv-grow .cv-ava .ava{width:22px; height:22px; font-size:.72rem;}
.cv-grow.cv-dn{opacity:.62;}
.cv-grow.cv-dn .cv-et{text-decoration:line-through; color:var(--pencil);}

/* ── «год» ── */
.cv-yr{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px;}
.cv-ymon{position:relative; padding:12px 14px; text-align:left; color:var(--graphite);
  background:none; border:0; font:inherit; cursor:pointer;}
.cv-ymon > *{position:relative;}
.cv-ymon b{font-family:'Caveat',cursive; font-weight:700; font-size:1.45rem;
  line-height:1; display:block;}
.cv-ymon.cv-cur b{background:var(--marker); display:inline-block; padding:0 7px;
  border-radius:9px 12px 8px 11px;}
.cv-ycnt{color:var(--pencil); font-size:.88rem; margin-top:3px;}

@media (max-width:639px){
  .cv-host{padding:12px 16px 40px;}
}
