/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body{max-width:100%;overflow-x:hidden}html{font-size:62.5%;box-sizing:border-box;height:100%}body{min-height:100%;display:flex;flex-direction:column;background-color:#1a1b15;color:#fff;font-family:"Montserrat",sans-serif;font-size:1.6rem}*,*:before,*:after{box-sizing:inherit}.container{width:95%;max-width:1200px;margin:0 auto}a{text-decoration:none}img{max-width:100%}svg{width:4rem;height:4rem;transition:opacity .2s ease-out}svg:hover{opacity:70%}li,ul{list-style:none;padding:0;margin:0}h1,h2,h3{font-family:"Montserrat",sans-serif;margin:0 0 2.5rem 0;font-weight:700;color:#fff;text-align:center;text-transform:uppercase;overflow-wrap:break-word}h1{font-size:4rem}h2{font-size:3.6rem}h3{font-size:3rem;text-align:center}p{color:#fff;font-size:2.4rem}.page__name{text-align:center;margin:5rem 0;font-weight:700}.page__description{text-align:center;margin-bottom:5rem}.place-right{display:flex;justify-content:flex-end}.place-center{display:flex;justify-content:center}.text-center{text-align:center}.no-cursor-events{pointer-events:none}.hover-scale{transition:scale .3s ease-out}.hover-scale:hover{scale:1.07;cursor:pointer}.clickable{cursor:pointer}.display-none{display:none}.display-block{display:block}*{scrollbar-width:auto;scrollbar-color:#282920 #1a1b15}*::-webkit-scrollbar{width:16px}*::-webkit-scrollbar-track{background:#1a1b15}*::-webkit-scrollbar-thumb{background-color:#282920;border-radius:10px;border:3px solid #36382b}.keen-slider__slide{min-width:100% !important;max-width:100% !important}@media(min-width: 1024px){.container-app{display:grid;grid-template-columns:45% 55%;min-height:100vh}}.webp .image{background-image:url("../img/barbercuttinghair.webp")}.no-webp .image{background-image:url("../img/barbercuttinghair.jpg")}.image{background-size:cover;background-repeat:no-repeat;background-position:center center;height:25rem}@media(min-width: 1024px){.image{height:100vh;width:45vw;position:fixed;left:0;top:0}}.image__title{margin:0}.app{width:95%;padding-inline:1rem;padding-bottom:3rem;margin:0 auto}@media(min-width: 1024px){.app{padding-inline:2rem;grid-column:2}}.section{padding:5rem 0;display:none}.section .text-center{font-size:2.6rem}.section h2{margin-bottom:5rem}.subsection{margin-bottom:8rem}.subsection:nth-last-child(1 of .subsection){margin-bottom:0}.show{display:block}.hide{display:none}.date-info .field{margin-bottom:3.2rem}.summary .form,.summary h2{margin-bottom:5rem}.service-container{display:flex;gap:2rem;justify-content:space-between;align-items:center;margin-bottom:1rem;border:3px solid #36382b;padding:0 1.25rem;border-radius:1.5rem;background-color:#282920;overflow-x:auto}.service-container .service__name,.service-container .service__price{font-weight:bold;font-size:2rem}.service-container .service__name{color:#fff}.service-container .service__price{color:#329f00}.total-price-container{display:flex;justify-content:center}@media(min-width: 768px){.total-price-container{justify-content:flex-end}}.total-price{text-align:center;font-weight:700}.total-price span{color:#329f00}.form{width:100%;color-scheme:dark}.form div.place-right{margin-top:5rem}.field{display:flex;flex-direction:column;gap:.8rem;margin-bottom:2rem;justify-content:center}.field label{font-size:1.6rem}.field input,.field select{border:3px solid #36382b;padding:1.25rem;border-radius:1.5rem;background-color:#282920;width:100%}.field input:disabled,.field select:disabled{cursor:not-allowed;color:#a6a6a6}.field select{cursor:pointer}.available-times{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0;gap:1rem}@media(min-width: 480px){.available-times{gap:1.6rem}}.available-times .available-time{background-color:#282920;border:3px solid #36382b;padding:1rem;border-radius:1.5rem;color:#fff;width:10.5rem;text-align:center;cursor:pointer;transition:background-color .3s ease-out;user-select:none}.available-times .available-time.selected,.available-times .available-time:hover{background-color:#076493;border:3px solid #076493}.button{background-color:#076493;padding:1.6rem 3.2rem;color:#fff;margin-top:2rem;font-size:2rem;font-weight:400;display:inline-block;font-weight:700;border:none;transition-property:background-color;transition-duration:.3s;text-align:center;display:block;width:100%;margin:2rem 0;border-radius:1.5rem}@media(min-width: 768px){.button{width:auto}}.button:hover{background-color:#054362;cursor:pointer}.arrow{display:flex;justify-content:center;align-items:center;width:4rem;height:4rem;border-radius:50%;border:none;background:rgba(0,0,0,0);cursor:pointer}.actions{margin-top:5rem}@media(min-width: 768px){.actions{display:flex;justify-content:space-between;gap:2rem}}.actions a{color:#bbb;transition:color .2s ease-out;display:block;text-align:center;margin-bottom:2.5rem}.actions a:hover{color:#888}.alert{padding:1.25rem;color:#fff;width:100%;display:block;margin-bottom:2rem;border-radius:1.5rem;font-size:1.6rem;font-weight:700;text-align:center;text-transform:uppercase}.alert.error{background-color:#cb0000}.alert.success{background-color:#226c00}.swal2-popup{width:38em;border-radius:1.5rem}.swal2-popup #swal2-title{font-size:2.4rem}.swal2-popup #swal2-html-container{font-size:2rem}.swal2-popup button{font-size:1.6rem;background-color:#076493;border-radius:.5em}.swal2-popup .swal2-footer{font-size:1.4rem}@media(min-width: 768px){.tabs{display:flex}}.tabs button{background-color:#076493;border:none;color:#fff;padding:1.4rem;width:100%;margin-bottom:2rem;text-transform:uppercase;font-weight:700;transition:all .2s ease-out;border-radius:1.5rem}@media(min-width: 768px){.tabs button{border-radius:0;margin-bottom:0}}.tabs button:hover{cursor:pointer;background-color:#06537a}.tabs button.current{background-color:#fff;color:#076493}@media(min-width: 768px){.tabs button:first-of-type{border-radius:1.5rem 0 0 1.5rem}}@media(min-width: 768px){.tabs button:last-of-type{border-radius:0 1.5rem 1.5rem 0}}.pagination{display:flex;justify-content:space-between;gap:2rem}.pagination button{margin:0 0 2rem 0;width:100%}@media(min-width: 480px){.pagination button{margin:0;max-width:20rem}}.pagination .show{display:block}.pagination .hide{display:none}@media(min-width: 480px){.pagination .show,.pagination .hide{display:block}.pagination .show{visibility:visible}.pagination .hide{visibility:hidden}}.flatpickr-calendar{background-color:#282920}.flatpickr-calendar .flatpickr-months .flatpickr-month{background-color:#282920}.flatpickr-calendar .flatpickr-months .flatpickr-month .flatpickr-current-month .flatpickr-monthDropdown-months{background-color:#282920}.flatpickr-calendar .flatpickr-months .flatpickr-month .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:#282920}.flatpickr-calendar .flatpickr-rContainer{background-color:#282920}.flatpickr-calendar .flatpickr-rContainer .flatpickr-weekdays{padding:1rem;margin-top:1rem}.flatpickr-calendar .flatpickr-rContainer .flatpickr-weekdays .flatpickr-weekday{background-color:#282920}.flatpickr-calendar .flatpickr-rContainer .dayContainer{padding:1rem}.flatpickr-calendar .flatpickr-rContainer .dayContainer .flatpickr-day:hover,.flatpickr-calendar .flatpickr-rContainer .dayContainer .flatpickr-day.selected{background-color:#076493;border-color:#076493}.flatpickr-calendar .flatpickr-rContainer .dayContainer .flatpickr-day.flatpickr-disabled:hover{background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0)}.employees-container{display:flex;gap:1.6rem;align-items:center;justify-content:center}.employees-container svg{flex-shrink:0}.employees-list{display:grid;overflow:hidden;grid-auto-flow:column;grid-auto-columns:100%;margin:0;padding:0}@media(min-width: 768px){.employees-list{grid-auto-columns:calc(50% - 10px)}}@media(min-width: 1400px){.employees-list{grid-auto-columns:calc(50% - 10px)}}.employees-list.dragging{user-select:none;cursor:grabbing;scroll-behavior:auto}.employees-list.dragging .employee{cursor:grabbing}.employee{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#282920;padding-block:2rem;border-radius:1.5rem;border:3px solid #36382b;padding:2rem 1.2rem;width:100%;cursor:pointer;list-style:none;transition:background-color .3s ease-out}@media(min-width: 768px){.employee{width:30rem}}.employee:hover,.employee.selected{background-color:#076493;border:3px solid #076493}.employee__image{border-radius:20rem;width:8.5rem;height:8.5rem;margin:0 0 2rem 0;object-fit:cover}.employee__name,.employee__role{margin:0;text-align:center}.employee__name{margin-bottom:1rem;font-weight:700}.employee__role{font-size:2rem}.services-list{display:grid;gap:2rem}@media(min-width: 768px){.services-list{grid-template-columns:1fr 1fr}}.services-list .service{background-color:#282920;border:3px solid #36382b;border-radius:1.5rem;padding:3rem;display:flex;flex-direction:column;justify-content:space-between;transition:all .3s ease-out}@media(min-width: 1400px){.services-list .service{height:17rem}}.services-list .service p{margin:0;text-align:center}.services-list .service .service__name{margin-bottom:2rem;font-weight:700}.services-list .service .service__price{margin:0 auto;width:fit-content;font-size:2rem;font-weight:700;color:#329f00;border-radius:1.5rem;padding:.8rem 1.2rem;transition:background-color .3s ease-out}.services-list .service.selected,.services-list .service:hover{background-color:#076493;border:3px solid #076493}.services-list .service.selected .service__price,.services-list .service:hover .service__price{background-color:#fff}.bar{display:flex;justify-content:space-between;align-items:center;margin-block:5rem}.navigation{margin-bottom:10rem}@media(min-width: 1024px){.navigation{display:flex;justify-content:center}}.navigation .button{border-radius:1.5rem}@media(min-width: 1024px){.navigation .button{border-radius:0}.navigation .button:first-of-type{border-radius:1.5rem 0 0 1.5rem}.navigation .button:last-of-type{border-radius:0 1.5rem 1.5rem 0}}.navigation .button.current{background-color:#fff;color:#076493}.user{display:flex;align-items:center;gap:1.2rem}.user p{font-size:2rem}.crud-actions{display:flex;gap:2rem;margin-bottom:5rem}@media(min-width: 768px){.crud-action{width:fit-content}}.table-container{width:100%;max-width:80rem;margin:2rem auto;overflow:hidden;overflow-x:auto;border-radius:1.5rem;box-shadow:0 0 2rem rgba(0,0,0,.1);background-color:#fff}table{width:100%;border-collapse:collapse}th,td{padding:1.6rem;text-align:left}th{background-color:#076493;color:#fff;text-transform:uppercase;font-weight:bold}tr:nth-child(even){background-color:#f7f7f7}tr:hover{background-color:#e6e6e6;transition:background-color .3s ease}tr td{color:#1a1b15;font-weight:500;cursor:pointer}.menu-popup{display:none;position:absolute;background-color:#fff;border:1px solid #fafafa;box-shadow:0px .8rem 1.6rem rgba(0,0,0,.2);padding:1.2rem;border-radius:2.7rem;z-index:10}.menu-popup button{display:block;width:100%;padding-inline:.8rem;background:none;border:none;border-radius:1.5rem;text-align:left;cursor:pointer;display:flex;align-items:center;gap:1.2rem}.menu-popup button svg{width:2.4rem;height:2.4rem}.menu-popup button p{color:#1a1b15;font-weight:500;font-size:1.6rem}.menu-popup button:hover{background-color:#e6e6e6}.table-roles{max-width:60rem}.search-container{position:relative}.search-bar{position:relative}.search-bar svg{position:absolute;top:1.25rem;right:2rem;width:2.4rem;height:2.4rem}.search-bar input{border-radius:1.5rem}.search-bar.active input{border-radius:1.5rem 1.5rem 0 0;border-bottom:none}.search-results-container{background-color:#282920;border-radius:0 0 1.5rem 1.5rem;border:3px solid #36382b;display:none;position:absolute;width:100%;height:fit-content;max-height:22rem;overflow-y:auto;z-index:1}.search-results-container p{transition:color .2s ease-out;padding-block:1.2rem;font-size:1.6rem;margin:0 0 0 1.2rem;cursor:pointer}.search-results-container p:hover{color:#a1a1a1}.search-results-container.show{display:block}.appointments h3{margin-block:8rem}.booked-appointments{display:flex;flex-direction:column;gap:6rem}.booked-appointments h4{font-size:2.4rem;margin:0 0 3rem 0;text-align:center}@media(min-width: 768px){.booked-appointments h4{text-align:left}}.appointment{background-color:#282920;border:3px solid #36382b;border-radius:1.5rem;padding:3.2rem;width:90%;max-width:55rem;margin:0 auto}.appointment svg{pointer-events:none}.appointment__info{display:flex;gap:4rem;margin-bottom:6rem;flex-direction:column}.appointment__info .appointment__day{display:flex;gap:2rem;flex-direction:column;padding-bottom:2rem;border-bottom:2px solid #36382b}@media(min-width: 768px){.appointment__info .appointment__day{flex-direction:row}}.appointment__info .appointment__date,.appointment__info .appointment__time,.appointment__info .appointment__customer{display:flex;align-items:center;gap:.8rem;flex-direction:column}@media(min-width: 768px){.appointment__info .appointment__date,.appointment__info .appointment__time,.appointment__info .appointment__customer{flex-direction:row}}.appointment__info .appointment__date p,.appointment__info .appointment__time p,.appointment__info .appointment__customer p{margin:0}.appointment__info .appointment__date svg,.appointment__info .appointment__time svg,.appointment__info .appointment__customer svg{width:3.6rem;height:3.6rem}.appointment__info .appointment__date p,.appointment__info .appointment__time p{font-size:1.6rem;text-align:center}@media(min-width: 768px){.appointment__info .appointment__date svg,.appointment__info .appointment__time svg{width:2.8rem;height:2.8rem}}@media(min-width: 768px){.appointment__info .appointment__customer svg{width:2.4rem;height:2.4rem}}.appointment__info .appointment__customer p{font-weight:700;text-align:center}.appointment__services{display:flex;flex-direction:column;gap:2rem;margin-bottom:10rem}.appointment__services .appointment__service{display:flex;flex-direction:column;align-items:center;text-align:center;padding-bottom:2rem;border-bottom:2px solid #36382b}@media(min-width: 768px){.appointment__services .appointment__service{flex-direction:row;text-align:left;justify-content:space-between;gap:5rem}}.appointment__services .appointment__service__name,.appointment__services .appointment__service__price{margin:0}.appointment__services .appointment__service__name{font-size:2rem;max-width:25rem;margin-bottom:2rem}@media(min-width: 768px){.appointment__services .appointment__service__name{margin-bottom:0}}.appointment__services .appointment__service__price{font-weight:700;color:#2a8600;font-size:2rem}.appointment__services .appointment__service:last-child{border-bottom:none;padding-bottom:0}.appointment__total-price{display:flex;justify-content:center}@media(min-width: 768px){.appointment__total-price{justify-content:flex-start}}.appointment__total-price .total-price span{font-size:2.6rem}.appointment__actions{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:2rem;margin-top:6rem}@media(min-width: 350px){.appointment__actions{justify-content:flex-end;flex-direction:row}}.appointment__actions button{padding:1.2rem 1.6rem;border-radius:1.2rem;border:none;width:100%;display:flex;align-items:center;justify-content:center;gap:1rem;transition:opacity .3s ease-out;height:6.5rem}@media(min-width: 768px){.appointment__actions button{width:7.2rem}}.appointment__actions button p{font-size:2rem;margin:0;font-weight:700}.appointment__actions button svg{width:3.4rem;height:3.4rem}.appointment__actions button svg.whatsapp{width:4rem;height:4rem}.appointment__actions button:hover{opacity:70%}.appointment__actions #message-customer,.appointment__actions #call-customer{background-color:#226c00}.appointment__actions #delete-appointment{background-color:#cb0000}/*# sourceMappingURL=app.css.map */
