/* posts-editor.css - the post previews and the week editor (W-0226 follow-up). Builds on editor.css tokens.
   Phone first. No side borders (W-0228): nested parts use an indent, a soft background and a thin full border. No animation. */

/* Post preview: platform tabs, frames and counts */
.pp { display:grid; gap:.55rem; max-width:420px; margin:0 auto; }
.pp-tabs { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:.35rem; }
@media (min-width:420px) { .pp-tabs { grid-template-columns:repeat(4, minmax(0, 1fr)); } }
.pp-tab { display:flex; flex-direction:column; align-items:flex-start; gap:.15rem; min-height:44px; padding:.4rem .5rem; border:2px solid var(--line); border-radius:10px; background:#fff;
  font:600 .76rem/1.15 "Inter",sans-serif; color:var(--ink); cursor:pointer; text-align:left; }
.pp-tab small { font-weight:500; color:var(--muted); font-size:.7rem; }
.pp-tab[aria-selected="true"] { border-color:var(--accent); background:var(--accent-tint); }
.pp-tab.over { border-color:var(--stop); }
.pp-tab.over small { color:var(--stop); font-weight:700; }
.pp-tab:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.pp-frame { background:#fff; border:1px solid var(--line); border-radius:12px; padding:.6rem; display:grid; gap:.5rem; min-width:0; }
.pp-head { display:flex; align-items:center; gap:.5rem; font-size:.82rem; }
.pp-head small { display:block; color:var(--muted); font-size:.72rem; }
.pp-av { width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff; display:inline-flex; align-items:center; justify-content:center; font:700 .7rem/1 "Inter",sans-serif; flex:none; }
.pp-text { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; font-size:.86rem; line-height:1.45; }
.pp-tag { color:#1d4f91; }
.pp-frame.li .pp-tag { color:#0a66c2; }
.pp-card { width:100%; overflow:hidden; border-radius:8px; border:1px solid var(--line); }
.pp-card-scale { transform-origin:0 0; width:1080px; }
.pp-frame.tt { background:#fff; }
.pp-tt { position:relative; aspect-ratio:9 / 16; max-height:560px; border-radius:10px; overflow:hidden; background:#111; display:flex; flex-direction:column; justify-content:center; }
.pp-tt-card { border:0; border-radius:0; }
.pp-tt-cap { position:absolute; left:0; right:0; bottom:0; padding:2.2rem .7rem .7rem; color:#fff; background:linear-gradient(to top, rgba(0,0,0,.82), rgba(0,0,0,0)); font-size:.8rem; }
.pp-tt-cap .pp-text { font-size:.8rem; max-height:9.5em; overflow:hidden; }
.pp-tt-cap .pp-tag { color:#fff; font-weight:700; }
.pp-count { display:grid; gap:.3rem; font-size:.76rem; color:var(--muted); }
.pp-meter { display:block; height:6px; border-radius:999px; background:var(--band); overflow:hidden; }
.pp-meter i { display:block; height:100%; background:var(--ok); border-radius:999px; }
.pp-count.over { color:var(--stop); font-weight:700; }
.pp-count.over .pp-meter i { background:var(--stop); }
.pp-version { margin:0; padding:.45rem .6rem; border-radius:8px; background:var(--band); font-size:.8rem; color:var(--muted); }
.pp-version.changed { background:var(--warn-soft); color:var(--warn); font-weight:600; }
.pp-big { display:grid; gap:.3rem; }
.pp-check { margin:0; font-size:.76rem; color:var(--muted); text-align:center; }

/* Week editor */
.wk-theme { margin:0 0 .5rem; font-size:.85rem; }
/* The week needs the full width for its seven days: the grid sits above the controls, not beside them. */
@media (min-width:900px) { .ed.wk .ed-grid { grid-template-columns:minmax(0, 1fr); } .ed.wk .ed-preview { position:static; } }
.wk-week { display:grid; grid-template-columns:minmax(0, 1fr); gap:.35rem; }
@media (min-width:760px) { .wk-week { grid-template-columns:repeat(7, minmax(0, 1fr)); } }
@media (min-width:900px) { .wk-slots { grid-template-columns:repeat(2, minmax(0, 1fr)); align-items:start; } }
.wk-col { display:grid; align-content:start; gap:.3rem; min-width:0; padding:.35rem; border:1px solid var(--line); border-radius:10px; background:var(--band); }
.wk-dname { font:700 .72rem/1 "Inter",sans-serif; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.wk-empty { font-size:.7rem; color:var(--muted); }
@media (max-width:759px) { .wk-col:not(:has(.wk-tile)) { display:none; } }
.wk-tile { display:grid; gap:.2rem; padding:.4rem; border:2px solid var(--line); border-radius:8px; background:#fff; font-size:.72rem; line-height:1.3; cursor:grab; min-width:0; overflow-wrap:anywhere; }
.wk-tile:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.wk-tile.off { opacity:.5; }
.wk-tile.drop, .wk-slot.drop { border-color:var(--accent); background:var(--accent-tint); }
.wk-tile.dragging, .wk-slot.dragging { opacity:.4; }
.wk-t-top { display:flex; justify-content:space-between; gap:.3rem; font-weight:700; }
.wk-fmt { text-transform:capitalize; color:var(--accent-ink); }
.wk-t-idea { font-weight:600; color:var(--ink); }
.wk-t-meta, .wk-t-lock { color:var(--muted); font-size:.68rem; }
.wk-t-lock { font-weight:700; color:var(--accent-ink); }
.ed-issues .okay { background:#e8f5ec; color:var(--ok); font-weight:600; }
.wk .ed-el + .ed-el, .wk .ed-el { margin-bottom:.55rem; }
.wk-chans { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.45rem; }
.wk-slots { list-style:none; margin:0; padding:0; display:grid; gap:.55rem; }
.wk-slot { border:2px solid var(--line); border-radius:12px; padding:.6rem .7rem; background:#fff; min-width:0; }
.wk-slot.locked { border-color:var(--accent); background:var(--accent-tint); }
.wk-slot.clash { border-color:var(--stop); }
.wk-slot.off { background:var(--band); }
.wk-slot.off .wk-sum { opacity:.55; }
.wk-slot-head { display:flex; align-items:center; gap:.5rem; cursor:grab; }
.wk-grip { width:12px; height:18px; flex:none; background:radial-gradient(circle, var(--muted) 1.3px, transparent 1.6px) 0 0 / 6px 6px; opacity:.7; }
.wk-day b { font:700 .95rem/1 "Montserrat",sans-serif; }
.wk-day span { font-size:.8rem; color:var(--muted); }
.wk-sum { font-size:.82rem; min-width:0; }
.wk-slot-acts { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.5rem; }
.wk-slot details { margin-top:.5rem; }
.wk-slot summary { cursor:pointer; font-size:.82rem; font-weight:600; color:var(--accent-ink); min-height:32px; display:flex; align-items:center; }
.wk-slot summary:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.wk-f { margin-top:.45rem; }
.wk-f.locked { border-color:var(--accent); background:var(--accent-tint); }
.wk-time { margin-top:.45rem; font:500 .95rem/1.2 "Inter",sans-serif; border:2px solid var(--line); border-radius:8px; padding:.45rem .55rem; min-height:44px; }
.wk-time[readonly] { background:var(--accent-tint); }
.wk .ed-chips.ideas .chip { max-width:100%; text-align:left; }

@media (prefers-reduced-motion: reduce) {
  .pp *, .wk * { animation:none !important; transition:none !important; }
}