@import url("soft-controls.css");

.pending-page dialog select{width:100%;border:1px solid #dedbe7;border-radius:9px;padding:11px 12px;color:var(--ink);background:#fff;font:400 14px inherit}.pending-page dialog form>button[type="submit"]{background:#46a995}.pending-page fieldset{margin:0;padding:0;border:0}.pending-page legend{margin-bottom:8px;color:#666;font-size:12px;font-weight:600}.star-picker{display:flex;gap:8px}.star-picker input{position:absolute;opacity:0;pointer-events:none}.star-picker label{padding:8px 10px;border:1px solid #f0dfac;border-radius:8px;background:#fff9e6;color:#d6a733;font-size:15px;letter-spacing:1px;cursor:pointer}.star-picker input:checked+label{background:#fff0bc;border-color:#e6bd4e}.pending-task{position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;row-gap:8px;min-height:82px}.pending-task b{grid-column:1;font-size:14px}.pending-category{grid-column:2;grid-row:1;padding:4px 7px;border-radius:99px;background:#eaf7f3;color:#449d89;font-size:10px!important;font-weight:700}.priority-stars{grid-column:1;grid-row:2;color:#dda931;font-size:14px;letter-spacing:1px}.priority-stars i{font-style:normal;color:#e8e5dc}.pending-page .complete-task{grid-column:2;grid-row:2;justify-self:end;display:grid;place-items:center;width:32px;height:32px;margin:0;padding:0;appearance:none;border:1px solid #b9e0d6;border-radius:9px;background:#e8f7f3;color:transparent;font:700 22px/1 "DM Sans",sans-serif;cursor:pointer}.pending-page .complete-task:hover{background:#d9f0e9}.pending-page .completed-task{isolation:isolate;background:#e8e7ea!important;color:#8d8b93!important;overflow:hidden}.pending-page .completed-task:after{content:"";position:absolute;z-index:0;inset:0;background:linear-gradient(to bottom right,transparent calc(50% - 2px),rgba(78,76,84,.42) calc(50% - 1px),rgba(78,76,84,.42) calc(50% + 1px),transparent calc(50% + 2px));pointer-events:none}.pending-page .completed-task>*{position:relative;z-index:1}.pending-page .completed-task .complete-task{border-color:#7fc9b7;background:#7fc9b7;color:#fff}.pending-page .completed-task b,.pending-page .completed-task small{color:#77747c!important}@media(max-width:650px){.pending-task{min-height:78px}}

/* Soft, rounded controls across the pending form. */
#pending-dialog input,#pending-dialog select{border-color:#e7efed!important;border-radius:13px!important;background:#fcfefd!important;box-shadow:inset 0 1px 2px rgba(42,93,80,.035)}#pending-dialog input:focus,#pending-dialog select:focus{outline:2px solid #dcefe9;border-color:#bfe1d6!important}.pending-page .star-picker label{border-color:#f3e8c9;border-radius:13px;background:#fffcf3;color:#d6a733}.pending-page .star-picker input:checked+label{background:#fff4cf;border-color:#ecd182}

@keyframes pending-ripple{0%{transform:translateY(9px) scale(.985);box-shadow:0 0 0 0 rgba(70,169,149,.18);opacity:0}58%{transform:translateY(-2px) scale(1);box-shadow:0 0 0 13px rgba(70,169,149,0);opacity:1}100%{transform:translateY(0);box-shadow:0 8px 20px rgba(40,94,80,.045)}}@keyframes pending-drift{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}.pending-page .feature-grid>article{animation:pending-ripple .7s cubic-bezier(.2,.8,.2,1) both,pending-drift 4.8s ease-in-out .75s infinite}.pending-page .feature-grid>article:nth-child(2){animation-delay:.13s,.95s}.pending-page .feature-grid>article:hover{animation-play-state:paused;transform:translateY(-3px);box-shadow:0 12px 25px rgba(40,94,80,.08)}
.pending-page .feature-grid>article:nth-child(2){animation-delay:0s,.75s}
@keyframes pending-title-ripple{0%{opacity:0;transform:translateY(12px);letter-spacing:4px;text-shadow:0 0 0 rgba(70,169,149,.4)}65%{opacity:1;transform:translateY(-1px);letter-spacing:-1.2px;text-shadow:0 0 18px rgba(70,169,149,0)}100%{opacity:1;transform:none;letter-spacing:-2px}}.pending-page>h1{animation:pending-title-ripple .8s cubic-bezier(.2,.8,.2,1) both}
body{background:#f2fbf7}
.pending-page #pending-tasks .completed-task{border-radius:13px;margin:5px 0;padding:14px 12px}

/* Preserve the original row width and spacing when a pending task is complete. */
.pending-page #pending-tasks .pending-task.completed-task{box-sizing:border-box;margin:0!important;padding:16px 0!important;min-height:82px;border-radius:13px}
.pending-page #pending-tasks .pending-task.completed-task{background:transparent!important;overflow:visible}.pending-page #pending-tasks .pending-task.completed-task:before{content:"";position:absolute;z-index:0;inset:3px 0;border-radius:13px;background:#e8e7ea}.pending-page #pending-tasks .pending-task.completed-task:after{inset:3px 0;border-radius:13px}
@media(max-width:650px){.pending-page #pending-tasks .pending-task.completed-task{min-height:78px}}
.pending-page .feature-grid>article,.pending-page .feature-grid>article:nth-child(2){animation-delay:0s!important}
.pending-page .completed-task .complete-task{border-color:#a8ddcd;background:#a8ddcd}
.pending-page #pending-tasks .complete-task{border-color:#b9e0d6;background:#e8f7f3;color:transparent}.pending-page #pending-tasks .complete-task:hover{background:#d9f0e9}.pending-page #pending-tasks .completed-task .complete-task{border-color:#a8ddcd;background:#a8ddcd;color:#fff}
.pending-calendar-link{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;margin-top:24px;padding:12px 13px;border:1px solid #cfe9df;border-radius:13px;background:#f3fbf7;color:#397c68;text-decoration:none;transition:.2s}.pending-calendar-link:hover{transform:translateY(-2px);background:#eaf7f1;box-shadow:0 8px 18px rgba(55,132,107,.09)}.pending-calendar-link>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#dff3eb;color:#398770;font-size:18px}.pending-calendar-link b,.pending-calendar-link small{display:block}.pending-calendar-link b{font-size:13px}.pending-calendar-link small{margin-top:3px;color:#78a393;font-size:10px}.pending-calendar-link em{font-style:normal;color:#60a58d;font-size:17px}

@media(prefers-reduced-motion:reduce){.feature-page .feature-grid>article,.workout-page .feature-grid>article,.pending-page .feature-grid>article{animation:none}}
.pending-page .priority-stars i{display:none}
