.reminder-app{--purple:#7d3fb2}.reminder-section{margin-top:14px;padding:16px 13px;border-radius:28px;background:rgba(255,255,255,.94);box-shadow:0 8px 18px rgba(112,54,0,.17)}.reminder-section header{padding:0 5px 10px}.reminder-section h2{margin:0;font-size:1.2rem}.reminder-section header p{margin:4px 0 0;color:#8b7770;font-size:.82rem}.due-section h2{color:#d72b2b}.upcoming-section h2{color:#7136a7}.reminder-list{display:grid;gap:11px}.reminder-card{position:relative;padding:15px;border:2px solid #efd1d1;border-radius:19px;background:#fffafa}.upcoming-section .reminder-card{border-color:#dfd0eb;background:#fdfaff}.reminder-card h3{margin:0 0 5px;color:#cc2929;font-size:1.15rem}.upcoming-section .reminder-card h3{color:#69309c}.reminder-when{position:absolute;right:14px;top:15px;color:#d22c2c;font-weight:900}.upcoming-section .reminder-when{color:#67309a}.reminder-card p{margin:6px 0;color:#5e515c;font-size:.86rem}.reminder-card .full-time{font-weight:800}.reminder-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.reminder-actions button{border:2px solid #e5b9b9;border-radius:10px;padding:8px 13px;background:#fff;color:#c22828;font:800 .85rem inherit}.reminder-actions .complete{border-color:#c81d1d;background:#e52f2f;color:#fff}.reminder-actions .snooze,.reminder-actions .edit{border-color:#dabbe9;color:#7435a7}.empty-reminders{padding:28px 10px;text-align:center;color:#8d7c72}.all-reminders{display:block;width:100%;margin:14px 0 0;border:0;border-radius:20px;padding:15px;background:#fff;color:#7136a7;font:900 1.05rem inherit;box-shadow:0 6px 14px rgba(92,47,111,.16)}.all-reminders span{font-size:1.5rem}.time-fields{padding:22px}.time-fields label{display:block;margin-bottom:14px;color:#5d4968;font-weight:900}.time-fields input{display:block;width:100%;margin-top:6px;border:2px solid #d1b6df;border-radius:13px;padding:12px;background:#fff;font:900 1.1rem inherit;color:#472453}.time-fields p{color:#b52b27;font-weight:800}.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dialog-actions button{border:0;border-radius:13px;padding:13px;background:#eee9f0;color:#574f5b;font-weight:900}.dialog-actions .confirm-time{background:#7b3ab2;color:#fff}@media(max-width:410px){.reminder-when{position:static;display:block;margin-bottom:7px}.reminder-card h3{padding-right:0}}