/* Project writing, tasks and planning. Loaded after the existing Island theme. */
.pw-editor-card,
.pw-task-panel,
.pw-overview,
.pw-module-bar,
.pw-resource-row,
.pw-clipboard-row {
    --pw-accent-rgb: var(--proj-rgb, var(--acc-rgb, 255, 215, 0));
    --pw-accent: rgb(var(--pw-accent-rgb));
    --pw-text: #f1f1f3;
    --pw-muted: #aaaab4;
    --pw-line: rgba(255, 255, 255, .11);
    --pw-surface: rgba(255, 255, 255, .035);
    min-width: 0;
    color: var(--pw-text);
}

.pw-editor-card { gap: 16px; }
.pw-editor-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.pw-kicker { display: block; color: var(--pw-accent); font-size: 10px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 7px; }
.pw-editor-head h2 { font-family: 'Space Grotesk', sans-serif; font-size: clamp(20px, 2.4vw, 28px); font-weight: 600; letter-spacing: -.6px; margin: 0; line-height: 1.3; }
.pw-editor-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }

.pw-button,
.pw-task-tabs button,
.pw-task-filters button,
.pw-task-cancel,
.pw-task-icon,
.pw-module-bar button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid var(--pw-line, rgba(255, 255, 255, .11));
    border-radius: 11px;
    background: rgba(255, 255, 255, .045);
    color: #d7d7df;
    padding: 10px 13px;
    font: 600 12px/1.35 'Plus Jakarta Sans', sans-serif;
    text-align: center;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.pw-button:hover,
.pw-task-tabs button:hover,
.pw-task-filters button:hover,
.pw-task-cancel:hover,
.pw-task-icon:hover,
.pw-module-bar button:hover { background: rgba(255, 255, 255, .09); border-color: rgba(var(--pw-accent-rgb, var(--acc-rgb, 255, 215, 0)), .4); color: #fff; }
.pw-button.primary,
.pw-button.pw-button-primary,
.pw-button[data-primary="true"] {
    background: rgb(var(--pw-accent-rgb, var(--acc-rgb, 255, 215, 0)));
    border-color: transparent;
    color: #10100e;
    font-weight: 800;
}
.pw-button.primary:hover,
.pw-button.pw-button-primary:hover { filter: brightness(1.08); }
.pw-button:disabled,
.pw-task-icon:disabled { opacity: .42; cursor: default; }
.pw-button:focus-visible,
.pw-module-bar button:focus-visible,
.pw-stat:focus-visible,
.pw-task-app button:focus-visible,
.pw-task-app input:focus-visible,
.pw-task-app select:focus-visible,
.pw-editor-card textarea:focus-visible {
    outline: 2px solid rgb(var(--pw-accent-rgb, var(--acc-rgb, 255, 215, 0)));
    outline-offset: 3px;
}
.pw-button i,
.pw-module-bar button i { flex-shrink: 0; }
.pw-selection-hint { color: var(--pw-muted); font-size: 11px; line-height: 1.6; }

.pw-editor-card #ws-notes,
#wsm-panel-notes.pw-editor-card #wsm-notes {
    min-width: 0;
    width: 100%;
    min-height: 300px;
    height: clamp(300px, 40vh, 620px);
    flex: 1 1 300px;
    margin: 0;
    padding: 18px 20px;
    line-height: 1.9;
    font-size: 15px;
    color: #ededf2;
    border: 1px solid var(--pw-line);
    border-radius: 13px;
    background: rgba(0, 0, 0, .18);
    background-image: none;
    resize: vertical;
    transition: border-color .18s ease;
}
.pw-editor-card #ws-notes:focus,
#wsm-panel-notes.pw-editor-card #wsm-notes:focus { border-color: rgba(var(--pw-accent-rgb), .6); background-color: rgba(0, 0, 0, .24); box-shadow: 0 0 0 3px rgba(var(--pw-accent-rgb), .06); }
.pw-editor-card textarea::placeholder { color: #8e8e9a; opacity: 1; }
.pw-editor-status { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; font-size: 11px; line-height: 1.6; color: var(--pw-muted); }
.pw-editor-status i { color: var(--pw-accent); margin-right: 5px; }
.pw-notice { padding: 10px 12px; border: 1px solid rgba(var(--pw-accent-rgb, var(--acc-rgb, 255, 215, 0)), .22); border-radius: 10px; background: rgba(var(--pw-accent-rgb, var(--acc-rgb, 255, 215, 0)), .06); color: #dedee5; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.pw-notice:empty { display: none; }
.pw-save-error { color: #ffaaaa !important; }

.pw-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 18px; }
.pw-stat { min-height: 84px; border: 1px solid var(--pw-line); border-radius: 13px; background: var(--pw-surface); color: var(--pw-text); padding: 15px; text-align: left; cursor: pointer; transition: background .18s ease, border-color .18s ease; }
.pw-stat:hover { border-color: rgba(var(--pw-accent-rgb), .4); background: rgba(var(--pw-accent-rgb), .055); }
.pw-stat strong { display: block; font-family: 'Space Grotesk', sans-serif; font-size: 28px; line-height: 1.1; font-weight: 600; margin-bottom: 7px; color: var(--pw-accent); }
.pw-stat span { display: block; font-size: 11px; color: var(--pw-muted); line-height: 1.4; }
.pw-next-task { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; border: 1px solid var(--pw-line); border-radius: 13px; background: linear-gradient(110deg, rgba(var(--pw-accent-rgb), .07), rgba(255, 255, 255, .018)); padding: 12px 15px; color: var(--pw-text); text-align: left; cursor: pointer; font: 500 12px/1.6 'Plus Jakarta Sans', sans-serif; overflow-wrap: anywhere; }
.pw-next-task strong { color: #f1f1f3; }
.pw-next-task span { color: var(--pw-muted); }
.pw-next-task i { color: var(--pw-accent); }
.pw-next-task .pw-button { margin-left: auto; }
.pw-module-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 4px; padding-top: 16px; border-top: 1px solid var(--pw-line); }
.pw-module-bar button { flex: 1 1 auto; }
.pw-module-bar button i { color: var(--pw-accent); }
.pw-module-bar button.is-active,
.pw-module-bar button[aria-pressed="true"] { background: rgba(var(--pw-accent-rgb), .11); border-color: rgba(var(--pw-accent-rgb), .34); color: var(--pw-accent); }

/* One task panel is reused by the workspace and by Module Island popovers. */
#ws-panel-todo.pw-task-panel { height: auto; max-width: 100%; min-width: 0; }
.pw-task-app { min-width: 0; }
.pw-task-heading { margin-bottom: 18px; }
.pw-task-heading h2 { margin: 0 0 6px; font-family: 'Space Grotesk', sans-serif; font-size: 23px; line-height: 1.3; letter-spacing: -.5px; font-weight: 600; }
.pw-task-subtitle { font-size: 12px; color: var(--pw-muted); line-height: 1.6; }
.pw-task-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-bottom: 16px; }
.pw-task-stat { border-radius: 10px; padding: 12px 10px; border: 1px solid var(--pw-line); background: var(--pw-surface); min-width: 0; }
.pw-task-stat strong { display: block; color: var(--pw-accent); font-size: 22px; line-height: 1.2; margin-bottom: 4px; font-weight: 700; }
.pw-task-stat span { font-size: 10px; line-height: 1.4; color: var(--pw-muted); overflow-wrap: anywhere; }
.pw-task-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px; margin-bottom: 16px; background: rgba(0, 0, 0, .2); border: 1px solid rgba(255, 255, 255, .06); border-radius: 13px; }
.pw-task-tabs button { flex: 1 1 auto; border-color: transparent; background: transparent; }
.pw-task-tabs button.is-active,
.pw-task-filters button.is-active { background: rgba(var(--pw-accent-rgb), .12); border-color: rgba(var(--pw-accent-rgb), .28); color: var(--pw-accent); }
.pw-task-composer { min-width: 0; padding: 15px; border: 1px solid rgba(var(--pw-accent-rgb), .2); border-radius: 14px; background: rgba(var(--pw-accent-rgb), .035); margin-bottom: 18px; }
.pw-task-composer-title { display: block; font-size: 12px; font-weight: 700; margin-bottom: 9px; color: #e8e8ef; }
.pw-task-app input:not([type="checkbox"]),
.pw-task-app select {
    color-scheme: dark;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    border: 1px solid var(--pw-line);
    border-radius: 10px;
    background: #141417;
    color: #e7e7ee;
    font: 400 13px/1.5 'Plus Jakarta Sans', sans-serif;
    padding: 10px 11px;
    margin: 0;
    outline: none;
    transition: border-color .18s ease;
}
.pw-task-app input:not([type="checkbox"]):focus,
.pw-task-app select:focus { border-color: rgba(var(--pw-accent-rgb), .55); }
.pw-task-app input::placeholder { color: #9696a2; opacity: 1; }
.pw-task-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 132px), 1fr)); gap: 10px; margin-top: 12px; }
.pw-task-fields label { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pw-task-fields label > span { color: var(--pw-muted); font-size: 10px; font-weight: 600; }
.pw-task-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.pw-task-actions .pw-button { flex: 1 1 auto; }
.pw-task-cancel { background: transparent; }
.pw-task-feedback { margin-top: 9px; font-size: 11px; line-height: 1.55; color: var(--pw-accent); overflow-wrap: anywhere; }
.pw-task-feedback:empty { display: none; }
.pw-task-feedback.is-error { color: #ffaaaa; }
.pw-task-plan-add { margin-bottom: 12px; }
.pw-task-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.pw-task-toolbar .pw-task-search { flex: 1 1 150px; }
.pw-task-toolbar .pw-task-sort { flex: 1 1 110px; width: auto; }
.pw-task-filters { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 16px; }
.pw-task-filters button { padding: 9px 10px; font-size: 10px; }
.pw-task-progress { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 12px; margin-bottom: 16px; color: var(--pw-muted); font-size: 11px; }
.pw-task-progress-track { flex: 1 1 100px; height: 5px; background: rgba(255, 255, 255, .08); overflow: hidden; border-radius: 5px; }
.pw-task-progress-track > div { height: 100%; background: var(--pw-accent); border-radius: 5px; transition: width .2s ease; }
.pw-task-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
#ws-panel-todo.pw-task-panel #todo-list { max-height: 440px; overflow-y: auto; overflow-x: hidden; padding: 3px; margin: -3px; }
#ws-panel-todo.pw-task-panel .pw-task-item {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 4px;
    row-gap: 6px;
    align-items: start;
    margin: 0;
    padding: 8px 10px 8px 3px;
    border: 1px solid var(--pw-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .025);
    animation: none;
}
#ws-panel-todo.pw-task-panel .pw-task-item:hover { background: rgba(255, 255, 255, .045); transform: none; }
.pw-task-check { min-height: 44px; width: 44px; display: grid; place-items: center; cursor: pointer; }
.pw-task-check input { width: 18px; height: 18px; margin: 0; accent-color: var(--pw-accent); cursor: pointer; }
.pw-task-content { min-width: 0; padding: 9px 0 2px; }
.pw-task-title { color: #ececf2; font-size: 12px; font-weight: 600; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; word-break: normal; }
.pw-task-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 7px; }
.pw-task-meta > span { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; border-radius: 6px; padding: 4px 6px; background: rgba(255, 255, 255, .06); font-size: 9px; line-height: 1.45; color: #bcbcc7; overflow-wrap: anywhere; }
.pw-task-meta .pw-task-priority[data-priority="high"] { background: rgba(255, 107, 107, .12); color: #ff9b9b; }
.pw-task-meta .pw-task-priority[data-priority="medium"],
.pw-task-meta .pw-task-priority[data-priority="mid"] { background: rgba(255, 188, 76, .12); color: #f6c97b; }
.pw-task-meta .pw-task-priority[data-priority="low"] { background: rgba(99, 186, 242, .12); color: #8dc9f1; }
.pw-task-meta .pw-task-assignee { color: #c7b7f3; background: rgba(160, 132, 229, .10); }
.pw-task-item-actions { grid-column: 2; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 3px; }
.pw-task-icon { width: 44px; padding: 0; border-color: transparent; background: transparent; color: #a6a6b3; }
.pw-task-icon[data-action="delete"]:hover { color: #ff9b9b; background: rgba(255, 107, 107, .10); border-color: rgba(255, 107, 107, .2); }
#ws-panel-todo.pw-task-panel .pw-task-item.is-overdue { border-left: 2px solid #ff918e; }
.pw-task-item.is-overdue .pw-task-date { color: #ffaaaa; background: rgba(255, 107, 107, .12); }
.pw-task-item.is-done .pw-task-title { text-decoration: line-through; color: #92929d; }
.pw-task-item.is-done .pw-task-meta { opacity: .65; }
.pw-task-empty { padding: 25px 15px; border: 1px dashed var(--pw-line); border-radius: 12px; text-align: center; color: var(--pw-muted); font-size: 12px; line-height: 1.7; }
.pw-task-empty i { display: block; margin-bottom: 10px; color: var(--pw-accent); font-size: 20px; }
.pw-task-agenda { display: flex; flex-direction: column; gap: 20px; }
.pw-agenda-day { min-width: 0; }
.pw-agenda-day h3 { color: #bebecb; font-size: 11px; font-weight: 700; line-height: 1.5; margin: 0 0 9px; padding-left: 10px; border-left: 2px solid rgba(255, 255, 255, .2); }
.pw-agenda-day.is-today h3,
.pw-agenda-day h3.is-today { color: var(--pw-accent); border-left-color: var(--pw-accent); }
.pw-task-app [hidden] { display: none !important; }

/* Popovers can be much narrower than the desktop writing card. */
html #mi-float-layer #ws-panel-todo.pw-task-panel.mi-pop { padding: 20px 16px !important; }
#ws-panel-todo.pw-task-panel.mi-pop .pw-task-heading { padding-right: 88px; min-height: 40px; }
#ws-panel-todo.pw-task-panel.mi-pop .pw-task-heading h2 { font-size: 19px; }
#ws-panel-todo.pw-task-panel.mi-pop .pw-task-subtitle { font-size: 11px; }
#ws-panel-todo.pw-task-panel.mi-pop > .mi-pop-x,
#ws-panel-todo.pw-task-panel.mi-pop > .mi-pop-fold { width: 44px; height: 44px; top: 8px; }
#ws-panel-todo.pw-task-panel.mi-pop > .mi-pop-x { right: 8px; }
#ws-panel-todo.pw-task-panel.mi-pop > .mi-pop-fold { right: 53px; }
#ws-panel-todo.pw-task-panel.mi-pop .pw-task-composer { padding: 12px; }
html #mi-float-layer #ws-panel-todo.pw-task-panel.mi-pop.is-collapsed { padding: 12px 16px !important; }
#ws-panel-todo.pw-task-panel.mi-pop.is-collapsed .pw-task-heading h2 { font-size: 17px; }

/* Scheduled project tasks in the existing Module Island calendar. */
.pw-cal-tasks { border-top: 1px solid rgba(255, 255, 255, .11); margin-top: 16px; padding-top: 14px; min-width: 0; }
.pw-cal-tasks-heading { color: rgb(var(--mi-rgb, var(--acc-rgb, 255, 215, 0))); font-size: 10px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; margin-bottom: 10px; }
.pw-cal-task { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 54px; padding: 10px; margin-bottom: 6px; background: rgba(255, 255, 255, .035); border: 1px solid rgba(255, 255, 255, .08); border-radius: 10px; color: #ededf3; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.pw-cal-task:hover { border-color: rgba(var(--mi-rgb, var(--acc-rgb, 255, 215, 0)), .35); background: rgba(255, 255, 255, .06); }
.pw-cal-task:focus-visible { outline: 2px solid rgb(var(--mi-rgb, var(--acc-rgb, 255, 215, 0))); outline-offset: 2px; }
.pw-cal-task-icon { flex: 0 0 30px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; background: rgba(var(--mi-rgb, var(--acc-rgb, 255, 215, 0)), .1); color: rgb(var(--mi-rgb, var(--acc-rgb, 255, 215, 0))); }
.pw-cal-task-copy { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.pw-cal-task-title { font-size: 11px; font-weight: 600; line-height: 1.5; overflow-wrap: anywhere; }
.pw-cal-task-meta { font-size: 9px; line-height: 1.5; color: #a6a6b2; overflow-wrap: anywhere; }
.pw-cal-task-date { flex: 0 0 auto; font-size: 9px; color: #bebec9; font-weight: 600; }
.pw-cal-task.is-overdue { border-left: 2px solid #ff918e; }
.pw-cal-task.is-overdue .pw-cal-task-date { color: #ffaaaa; }

/* Links, files and clipboard entries can be inserted into project notes. */
#ws-panel-links .pw-resource-row,
#ws-panel-files .pw-resource-row,
.pw-clipboard-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
    width: 100%;
    min-width: 0;
    padding: 12px;
    margin: 0 0 8px;
    list-style: none;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 11px;
    background: rgba(255, 255, 255, .025);
}
.pw-resource-link { display: block; color: rgb(var(--pw-accent-rgb, var(--acc-rgb, 255, 215, 0))); font-size: 12px; font-weight: 600; line-height: 1.65; text-decoration: none; white-space: normal; overflow-wrap: anywhere; min-width: 0; }
.pw-resource-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.pw-resource-link:focus-visible { outline: 2px solid rgb(var(--pw-accent-rgb, var(--acc-rgb, 255, 215, 0))); outline-offset: 3px; border-radius: 4px; }
.pw-resource-link i { margin-right: 7px; }
.pw-resource-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; min-width: 0; }
.pw-resource-actions .pw-button { min-height: 44px; padding: 8px 10px; font-size: 10px; }
.pw-resource-actions .pw-resource-delete { color: #ffaaaa; border-color: rgba(255, 107, 107, .18); }
.pw-resource-actions .pw-resource-delete:hover { background: rgba(255, 107, 107, .1); border-color: rgba(255, 107, 107, .38); }
.pw-resource-empty { color: #aaaab4; font-size: 11px; line-height: 1.7; padding: 10px 0; }
.pw-clipboard-copy { min-width: 0; }
.pw-clipboard-copy .mi-ablage-text { white-space: pre-wrap; overflow-wrap: anywhere; word-break: normal; color: #dfdfe8; font-size: 11px; line-height: 1.65; }
.pw-clipboard-copy .mi-ablage-orig { color: #a0a0af; margin-top: 5px; white-space: normal; overflow-wrap: anywhere; font-size: 9px; line-height: 1.5; }

@media (min-width: 1100px) {
    #ws-panel-todo.pw-task-panel:not(.mi-pop) .pw-task-item { grid-template-columns: 44px minmax(0, 1fr) auto; }
    #ws-panel-todo.pw-task-panel:not(.mi-pop) .pw-task-item-actions { grid-column: 3; align-self: center; }
}

@media (max-width: 768px) {
    #wsm-panel-notes.pw-editor-card { display: flex !important; flex-direction: column; gap: 14px; padding: 16px; }
    .pw-editor-head h2 { font-size: 23px; }
    .pw-editor-tools { gap: 7px; }
    .pw-editor-tools .pw-button { flex: 1 1 125px; }
    #wsm-panel-notes.pw-editor-card #wsm-notes { min-height: 300px; height: max(300px, 42svh); flex: 0 0 auto; padding: 14px; font-size: 16px; }
    .pw-overview { gap: 7px; margin-bottom: 14px; }
    .pw-stat { padding: 12px 10px; min-height: 80px; border-radius: 11px; }
    .pw-stat strong { font-size: 25px; }
    .pw-stat span { font-size: 10px; }
    .pw-next-task { padding: 11px 12px; }
    .pw-module-bar { gap: 7px; }
    .pw-module-bar button { flex: 1 1 100px; }
    .pw-task-app input:not([type="checkbox"]),
    .pw-task-app select { font-size: 16px; }
    .pw-task-toolbar .pw-task-sort { flex-basis: 100%; }
}

@media (max-width: 420px) {
    .pw-task-stats { gap: 5px; }
    .pw-task-stat { padding: 10px 8px; }
    .pw-task-stat strong { font-size: 20px; }
    .pw-task-fields { grid-template-columns: 1fr; }
    .pw-task-filters button { flex: 1 1 80px; }
    .pw-task-actions { align-items: stretch; }
    .pw-next-task .pw-button { width: 100%; margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .pw-editor-card *,
    .pw-task-panel *,
    .pw-overview *,
    .pw-module-bar *,
    .pw-cal-tasks *,
    .pw-resource-row *,
    .pw-clipboard-row * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
