:root{--background: hsla(0, 0%, 100%, 1);--foreground: hsla(215, 25%, 27%, 1);--card: hsla(0, 0%, 100%, 1);--card-foreground: hsla(215, 25%, 27%, 1);--popover: hsla(0, 0%, 100%, 1);--popover-foreground: hsla(215, 25%, 27%, 1);--primary: hsla(217, 91%, 60%, 1);--primary-foreground: hsla(0, 0%, 100%, 1);--primary-hover: hsla(217, 91%, 55%, 1);--primary-glow: hsla(217, 91%, 70%, 1);--secondary: hsla(215, 20%, 65%, 1);--secondary-foreground: hsla(0, 0%, 100%, 1);--muted: hsla(215, 25%, 97%, 1);--muted-foreground: hsla(215, 15%, 58%, 1);--accent: hsla(215, 25%, 95%, 1);--accent-foreground: hsla(215, 25%, 27%, 1);--destructive: hsla(0, 84%, 60%, 1);--destructive-foreground: hsla(0, 0%, 100%, 1);--success: hsla(142, 71%, 45%, 1);--success-foreground: hsla(0, 0%, 100%, 1);--warning: hsla(43, 96%, 56%, 1);--warning-foreground: hsla(0, 0%, 0%, 1);--border: hsla(215, 25%, 92%, 1);--input: hsla(215, 25%, 94%, 1);--input-border: #E0E0E0;--ring: hsla(217, 91%, 60%, 1);--radius: .75rem;--sidebar-background: hsla(215, 25%, 27%, 1);--sidebar-foreground: hsla(215, 15%, 85%, 1);--sidebar-primary: hsla(217, 91%, 60%, 1);--sidebar-primary-foreground: hsla(0, 0%, 100%, 1);--sidebar-accent: hsla(215, 25%, 32%, 1);--sidebar-accent-foreground: hsla(215, 15%, 90%, 1);--sidebar-border: hsla(215, 25%, 35%, 1);--sidebar-ring: hsla(217, 91%, 70%, 1);--gradient-primary: linear-gradient(135deg, hsla(217, 91%, 60%, 1), hsla(217, 91%, 70%, 1));--gradient-card: linear-gradient(135deg, hsla(0, 0%, 100%, 1), hsla(215, 25%, 98%, 1));--gradient-sidebar: linear-gradient(180deg, hsla(215, 25%, 27%, 1), hsla(215, 25%, 22%, 1));--shadow-elegant: 0 4px 6px -1px hsla(217, 91%, 60%, .1), 0 2px 4px -1px hsla(217, 91%, 60%, .06);--shadow-card: 0 1px 3px 0 hsla(215, 25%, 27%, .1), 0 1px 2px 0 hsla(215, 25%, 27%, .06);--shadow-sidebar: inset 1px 0 0 hsla(215, 25%, 35%, 1);--transition-smooth: all .3s cubic-bezier(.4, 0, .2, 1);--transition-fast: all .15s ease-out;--form-wrapper-back-color: #000c;--alert-success-color: hsla(166, 64%, 94%, 1);--alert-success-border-color: hsla(168, 74%, 38%, 1);--alert-error-color: hsla(8, 80%, 94%, 1);--alert-error-border-color: hsla(8, 66%, 47%, 1);--alert-warning-color: hsla(42, 77%, 96%, 1);--alert-info-border-color: hsla(47, 96%, 65%, 1)}body,html{width:100%;height:100%;margin:0;padding:0;overflow-x:hidden}body{display:flex;background-color:transparent}app-root{width:100%;height:100%}*{box-sizing:border-box;font-family:Raleway,sans-serif}h1,h2,h3,h4,h5,h6,p{margin:0}h1{font-weight:700}h1>span{color:var(--primary)}button{display:flex;justify-content:center;align-items:center;background-color:var(--primary);color:var(--primary-foreground);border:none;width:250px;height:40px;border-radius:7px;font-size:1.25rem;cursor:pointer}button.disabled{opacity:.5}input,select{border:1px solid #E0E0E0;height:40px;border-radius:7px;padding:5px}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input:focus{outline:solid var(--primary)}div.loader{width:30px;padding:3px;aspect-ratio:1;border-radius:50%;background:var(--primary-foreground);--_m: conic-gradient(#0000 10%,#000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}@keyframes l3{to{transform:rotate(1turn)}}form{width:500px;display:flex;flex-direction:column;gap:15px;border:1px solid #E0E0E0;padding:25px;border-radius:10px;box-shadow:0 0 10px #0000001a;position:relative}form button{width:100%;font-weight:500}form .form-group{display:flex;flex-direction:column;gap:2px}button.transparent{width:50px;height:50px;background-color:transparent;color:hsl(var(--accent-foreground));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}button.transparent:hover{background-color:var(--accent)}button.transparent svg{width:20px;height:20px}button.transparent.scrolled{width:40px;height:40px;background:#fff9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 2px 6px #0000001a}button.opaque{display:flex;justify-content:center;align-items:center;gap:10px;width:fit-content;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;font-size:.85rem;font-weight:550;padding:0 10px;background-color:var(--background);border:1px solid var(--input);color:var(--foreground)}button.opaque svg{width:15px;height:15px}button.opaque:hover{color:var(--accent-foreground);background-color:var(--accent)}@media (width <= 500px){form{width:100%}}.table-wrapper{display:flex;flex-direction:column;width:100%;min-height:500px;height:fit-content;padding:25px;gap:25px;border-radius:15px;overflow-y:scroll;background:var(--gradient-card);border:1px solid var(--border)}.table-wrapper .header{width:100%;display:flex;align-items:center;border-bottom:0px!important}.table-wrapper .header .description{display:flex;flex-direction:column;gap:5px}.table-wrapper .header .description h2{color:var(--foreground);font-size:1.5rem}.table-wrapper .header .description h3{color:var(--muted-foreground);font-size:.95rem;font-weight:600}.table-wrapper .header .action{margin-left:auto}.table-wrapper .header .action input{width:200px}table{width:100%;height:100%}table thead{width:100%}table thead tr{height:50px;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}table thead tr:hover{background-color:color-mix(in srgb,var(--muted) 50%,transparent)}table thead th{text-align:start;color:var(--muted-foreground);vertical-align:middle;border-bottom:1px solid var(--border);font-weight:550}table tbody{width:100%}table tbody tr:not(tr:last-of-type) td{border-bottom:1px solid var(--border)}table tbody tr{text-align:start;gap:15px;width:100%;height:80px}table tbody tr td{font-weight:500}table tbody tr td:last-of-type{position:relative}table tbody tr td:last-of-type .actions{display:flex;flex-direction:column;gap:5px;padding:10px 5px;position:absolute;width:150px;height:fit-content;border-radius:15px;transform:translate(-85%);top:calc(50% + 15px);background-color:var(--background);border:1px solid var(--border);box-shadow:0 0 10px #0000001a;z-index:1000}table tbody tr td:last-of-type .actions .action.delete{color:var(--destructive)}table tbody tr td:last-of-type .actions .action{display:flex;justify-content:start;align-items:center;gap:10px;padding:5px;border-radius:10px;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer}table tbody tr td:last-of-type .actions .action:hover{background-color:var(--muted)}table tbody tr td:last-of-type .actions .action svg{width:15px;height:15px}table tbody tr td:last-of-type .actions .action span{font-size:.9rem}table tbody tr td .status{display:flex;justify-content:center;align-items:center;width:85px;border-radius:7px;padding:5px;font-size:.75rem;font-weight:700}table tbody tr td .status.sync{color:var(--success);background-color:color-mix(in srgb,var(--success) 20%,transparent);border:1px solid color-mix(in srgb,var(--success) 60%,transparent)}table tbody tr td .status.pending{color:var(--warning);background-color:color-mix(in srgb,var(--warning) 20%,transparent);border:1px solid color-mix(in srgb,var(--warning) 60%,transparent)}table tbody tr td .status.unsync{color:var(--destructive);background-color:color-mix(in srgb,var(--destructive) 20%,transparent);border:1px solid color-mix(in srgb,var(--destructive) 60%,transparent)}table tbody tr .product-description .wrapper,table tbody tr .order-description .wrapper,table tbody tr .customer-description{display:flex;align-items:center;flex-direction:row;width:550px;height:100%;gap:10px}table tbody tr .product-description .wrapper .wrapper,table tbody tr .order-description .wrapper .wrapper,table tbody tr .customer-description .wrapper{display:flex;flex-direction:row;gap:10px;align-items:center}table tbody tr .product-description .wrapper .description,table tbody tr .order-description .wrapper .description,table tbody tr .customer-description .description{display:flex;flex-direction:column;gap:5px}table tbody tr .product-description .wrapper .description h1,table tbody tr .order-description .wrapper .description h1,table tbody tr .customer-description .description h1{color:var(--foreground);font-size:1rem;font-weight:600}table tbody tr .product-description .wrapper .description h2,table tbody tr .order-description .wrapper .description h2,table tbody tr .customer-description .description h2{color:var(--muted-foreground);font-size:.8rem;font-weight:550;opacity:.75}@media (width <= 900px){table tbody tr .product-description .wrapper .description h1,table tbody tr .order-description .wrapper .description h1,table tbody tr .customer-description .description h1{font-size:.85rem}table tbody tr .product-description .wrapper .description h2,table tbody tr .order-description .wrapper .description h2,table tbody tr .customer-description .description h2{font-size:.75rem}}table tbody tr .product-description .wrapper .product-img,table tbody tr .product-description .wrapper .order-img,table tbody tr .product-description .wrapper .customer-img,table tbody tr .order-description .wrapper .product-img,table tbody tr .order-description .wrapper .order-img,table tbody tr .order-description .wrapper .customer-img,table tbody tr .customer-description .product-img,table tbody tr .customer-description .order-img,table tbody tr .customer-description .customer-img{width:50px;height:50px;display:flex;position:relative;justify-content:center;align-items:center;background-image:var(--gradient-primary);border-radius:var(--radius);border:1px solid var(--border)}table tbody tr .product-description .wrapper .product-img svg,table tbody tr .product-description .wrapper .product-img span,table tbody tr .product-description .wrapper .order-img svg,table tbody tr .product-description .wrapper .order-img span,table tbody tr .product-description .wrapper .customer-img svg,table tbody tr .product-description .wrapper .customer-img span,table tbody tr .order-description .wrapper .product-img svg,table tbody tr .order-description .wrapper .product-img span,table tbody tr .order-description .wrapper .order-img svg,table tbody tr .order-description .wrapper .order-img span,table tbody tr .order-description .wrapper .customer-img svg,table tbody tr .order-description .wrapper .customer-img span,table tbody tr .customer-description .product-img svg,table tbody tr .customer-description .product-img span,table tbody tr .customer-description .order-img svg,table tbody tr .customer-description .order-img span,table tbody tr .customer-description .customer-img svg,table tbody tr .customer-description .customer-img span{color:#fff}table tbody tr .product-description .wrapper .product-img span,table tbody tr .product-description .wrapper .order-img span,table tbody tr .product-description .wrapper .customer-img span,table tbody tr .order-description .wrapper .product-img span,table tbody tr .order-description .wrapper .order-img span,table tbody tr .order-description .wrapper .customer-img span,table tbody tr .customer-description .product-img span,table tbody tr .customer-description .order-img span,table tbody tr .customer-description .customer-img span{font-size:1.25rem}table tbody tr .product-description .wrapper .product-img img,table tbody tr .product-description .wrapper .order-img img,table tbody tr .product-description .wrapper .customer-img img,table tbody tr .order-description .wrapper .product-img img,table tbody tr .order-description .wrapper .order-img img,table tbody tr .order-description .wrapper .customer-img img,table tbody tr .customer-description .product-img img,table tbody tr .customer-description .order-img img,table tbody tr .customer-description .customer-img img{position:absolute;width:100%;height:100%;object-fit:cover;border-radius:10px}table tbody tr .product-information,table tbody tr .order-information,table tbody tr .customer-information{display:flex;flex-direction:row;align-items:center;gap:10px;margin-left:auto}table tbody tr .product-information .price-stock h3,table tbody tr .order-information .price-stock h3,table tbody tr .customer-information .price-stock h3{color:var(--foreground);font-size:1.25rem;font-weight:700}table tbody tr .product-information .price-stock span,table tbody tr .order-information .price-stock span,table tbody tr .customer-information .price-stock span{font-size:.85rem;font-weight:550;opacity:.5}table tbody tr .product-information .status,table tbody tr .order-information .status,table tbody tr .customer-information .status{display:flex;justify-content:center;align-items:center;width:85px;border-radius:7px;padding:5px;font-size:.75rem;font-weight:700}table tbody tr .product-information .status.sync,table tbody tr .order-information .status.sync,table tbody tr .customer-information .status.sync{color:var(--success);background-color:color-mix(in srgb,var(--success) 20%,transparent);border:1px solid color-mix(in srgb,var(--success) 60%,transparent)}table tbody tr .product-information td .status.pending,table tbody tr .order-information td .status.pending,table tbody tr .customer-information td .status.pending{color:var(--warning);background-color:color-mix(in srgb,var(--warning) 20%,transparent);border:1px solid color-mix(in srgb,var(--warning) 60%,transparent)}table tbody tr .product-information .status.unsync,table tbody tr .order-information .status.unsync,table tbody tr .customer-information .status.unsync{color:var(--destructive);background-color:color-mix(in srgb,var(--destructive) 20%,transparent);border:1px solid color-mix(in srgb,var(--destructive) 60%,transparent)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}@media (width >= 1500px){.cards{grid-template-columns:repeat(4,1fr)}}@media (width <= 1150px){.cards{grid-template-columns:repeat(2,1fr)}}@media (width <= 855px){.cards{grid-template-columns:repeat(1,1fr)}}.create-form-wrapper{width:100%;min-height:100%;background-color:var(--form-wrapper-back-color);position:absolute;z-index:1000;top:0;left:0}.create-form-wrapper form{width:500px;height:fit-content;background-color:var(--background);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@media (width <= 545px){.create-form-wrapper form{width:290px}}.create-form-wrapper .form-header{width:100%;display:flex;align-items:start;flex-direction:row}.create-form-wrapper .form-header .description{display:flex;flex-direction:column;gap:4px}.create-form-wrapper .form-header .description h2{font-size:1.15rem;color:var(--foreground)}.create-form-wrapper .form-header .description span{font-size:.85rem;opacity:.7}.create-form-wrapper .form-header .svg-wrapper{width:15px;height:15px;margin-left:auto;cursor:pointer}.create-form-wrapper .form-header .svg-wrapper svg{width:15px;height:15px}.create-form-wrapper .errors{width:100%;display:flex;flex-direction:column;gap:15px}.create-form-wrapper .errors span{color:var(--destructive);font-size:.75rem}.create-form-wrapper .form-fields{display:flex;flex-direction:column;gap:15px;margin-top:20px}.create-form-wrapper .form-fields .form-pair{display:flex;flex-direction:column;gap:5px}.create-form-wrapper .form-fields .form-pair span{font-weight:600;color:var(--foreground);font-size:.95rem}.create-form-wrapper .submit{width:100%;display:flex;margin-top:25px}.create-form-wrapper .submit .wrapper{display:flex;gap:15px;margin-left:auto}.create-form-wrapper .submit .wrapper button{width:100px;font-size:.95rem}.create-form-wrapper .submit .wrapper button:first-of-type{background-color:var(--background);border:1px solid var(--input-border);color:var(--foreground)}.create-form-wrapper .submit .wrapper button:first-of-type:hover{background-color:var(--input-border)}button.cancel{background-color:var(--background);border:1px solid var(--input-border);color:var(--foreground)}button.cancel:hover{background-color:var(--input-border)}.custom-file-upload{padding:10px;width:fit-content;border:1px solid var(--input-border);background-color:var(--primary);color:var(--background);font-weight:600;border-radius:7px;font-size:.9rem}.custom-file-upload input{display:none}
