body,html{margin:0;padding:0;font-family:Nunito,sans-serif}.app{display:flex;flex-direction:column;min-height:100vh}.app .content{padding:10px;flex:1}.app .content .welcome-container,.app .content .login-container{margin-top:10vh;display:flex;flex-direction:column;align-items:center;text-align:center}.app .content .celebrations-container{display:flex;flex-direction:column;max-width:800px;margin:auto}.app .content .celebrations-container .notification{width:100%;margin-top:5px;padding:10px}.app .content .celebrations-container .celebrations-header{display:flex;justify-content:space-between;width:100%;padding:10px;border-bottom:1px solid #ccc}.app .content .celebrations-container .create-container{display:flex;flex-direction:column;margin-top:20px;width:100%}.app .content .celebrations-container .create-container .grid,.app .content .celebrations-container .create-container .grid .cell{width:100%}.app .content .celebrations-container .create-container .field{text-align:start}.app .content .celebrations-container .create-container .pre-made-name-buttons{display:flex;gap:5px;margin-top:5px}.app .content .celebrations-container .create-container .pre-made-name-buttons .button{height:-moz-fit-content;height:fit-content}.app .content .celebrations-container .create-container .participants-list .box{padding:10px 15px;position:relative}.app .content .celebrations-container .create-container .participants-list .box .remove-btn{color:#b30000;cursor:pointer;transition:color .3s ease-in-out;position:absolute;top:5px;right:5px}.app .content .celebrations-container .create-container .participants-list .box .remove-btn:hover{color:red}.app .content .celebrations-container .create-container .participants-list .box .tags-input{margin-top:.25rem!important;background:transparent;padding:0 2px;border-color:hsl(var(--bulma-input-h),var(--bulma-input-s),calc(var(--bulma-input-border-l) + var(--bulma-input-border-l-delta)))}.app .content .celebrations-container .create-container .participants-list .box .tags-input .dropdown-content{background:#404040;color:#fff}.app .content .celebrations-container .create-container .participants-list .box .tags-input .dropdown-content .dropdown-item{color:#fff}.app .content .celebrations-container .create-container .participants-list .box .tags-input .dropdown-content .dropdown-item:hover{background:#333}.app .content .celebrations-container .create-container .create-celebration-button{margin-top:10px}@media only screen and (max-width: 700px){.app .content .celebrations-container .create-container .grid{display:flex;flex-direction:column;gap:50px}}.app .content .celebrations-container .list-container{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;width:100%;padding-top:10px}.app .content .celebrations-container .list-container .celebration{display:flex;justify-content:space-between;gap:10px;width:100%;background:#ffffff1a;padding:8px;border-radius:5px}.app .content .celebrations-container .list-container .celebration.owner{border:1px solid #002fff}.app .content .celebrations-container .list-container .celebration .celebration-info{gap:10px;text-align:start}.app .content .celebrations-container .list-container .celebration .participants-list{display:flex;gap:10px;flex-wrap:wrap;justify-content:start;width:100%;flex-direction:column;max-width:300px}.app .content .celebrations-container .list-container .celebration .participants-list .participant{display:flex;flex-direction:column;gap:5px;background:#ffffff1a;padding:5px;border-radius:5px;text-align:start;color:#fff}.app .content .celebrations-container .list-container .celebration .participants-list .participant .name{font-weight:700;font-size:1.2rem}.app .content .celebrations-container .list-container .celebration .participants-list .participant .email{font-size:1rem}.app .content .celebrations-container .list-container .celebration .participants-list .participant .has-drawn{font-size:1rem;color:#ff7f00}.app .content .celebrations-container .list-container .celebration .celebration-actions{display:flex;flex-direction:column;gap:10px}.app .content .celebrations-container .list-container .celebration .celebration-actions .button{height:-moz-fit-content;height:fit-content}@media only screen and (max-width: 700px){.app .content .celebrations-container .list-container .celebration{flex-direction:column;gap:10px}.app .content .celebrations-container .list-container .celebration .participants-list{flex-direction:column;gap:10px;max-width:100%;margin-top:20px;margin-bottom:20px}}.app .content .celebrations-container .view-container .grid{width:100%}.app .content .celebrations-container .view-container .drawn-participant-container{margin-top:20px}.app .content .celebrations-container .view-container .drawn-participant-container .drawn-participant{background:#ffffff1a;padding:5px 15px;border-radius:5px;font-size:2.8rem;color:#fff;border:1px solid #ffffff}.app .content .celebrations-container .view-container .drawn-participant-container .draw-participant{display:flex;flex-direction:column;gap:10px}.app .content .celebrations-container .view-container .drawn-participant-container .draw-participant .draw-box{background:#ffffff1a;padding:10px;border-radius:5px;display:flex;gap:10px;align-items:center;justify-content:space-between;color:orange;border:1px solid orange}.app .content .celebrations-container .view-container .drawn-participant-container .participant-wishlist{display:flex;flex-direction:column;gap:10px;margin-top:20px}.app .content .celebrations-container .view-container .drawn-participant-container .participant-wishlist .wishlist-item{background:#ffffff1a;padding:10px;border-radius:5px;display:flex;gap:10px;align-items:center;justify-content:space-between;color:orange;border:1px solid orange}.app .content .celebrations-container .view-container .wishlist h4{margin-bottom:5px}.app .content .celebrations-container .view-container .wishlist .budget-text{color:#fff;margin-bottom:10px;font-size:1rem}@media only screen and (max-width: 700px){.app .content .celebrations-container .view-container .grid{display:flex;flex-direction:column}.app .content .celebrations-container .view-container .wishlist{margin-top:50px}}
