.toast-container{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:9999}.toast{display:flex;gap:12px;padding:14px 16px;border-radius:14px;background:#111;color:#fff;margin-top:10px;box-shadow:0 10px 25px #0006;animation:slideUp .25s ease}.toast-success{background:#15803d}.toast-error{background:#b91c1c}.toast-info{background:#0f172a;border-color:#38bdf8}.toast-warning{background:#2a1f12;border-color:#f59e0b}.toast button{background:none;border:none;color:inherit;font-size:18px}.toast-close{margin-left:auto;background:none;border:none;color:inherit;font-size:16px}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.desktop-only{display:block}.mobile-only{display:none}@media(max-width:768px){.desktop-only{display:none}.mobile-only{display:flex;flex-direction:column;gap:12px}}.product-card-image{aspect-ratio:1 / 1;background-color:#f0f0f0;width:100%;object-fit:cover;display:block}.product-table img{aspect-ratio:1 / 1;width:48px;height:48px;background-color:#f0f0f0}.product-card{background:#fff;border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:10px}.product-card-image{width:100%;height:160px;object-fit:cover;border-radius:12px}.product-card-actions{display:flex;justify-content:space-between}.cms-container{display:flex;flex-direction:column;flex-shrink:1;width:100%;min-height:100vh;background-color:#f3f4f6;font-family:Arial,sans-serif}.cms-title{font-size:1.875rem;font-size:clamp(1rem,1rem + 1vw,1.875rem);font-weight:800;color:#1f2937;margin-top:1.5rem;margin-bottom:1.5rem;display:flex;align-items:center}.title-icon{font-size:clamp(1.5rem,1.5rem + 1vw,2rem);color:#e31b54;margin-right:.75rem;margin-left:.75rem}.content-wrapper{display:flex;gap:2rem}@media(min-width:1024px){.content-wrapper{flex-direction:row}.form-column{width:33.333333%;position:sticky;top:1rem}.list-column{width:66.666667%}}@media(max-width:1023px){.content-wrapper{flex-direction:column}.form-column,.list-column{width:100%}}.form-card{background-color:#fff;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;border-radius:.75rem;padding:1.5rem;border:1px solid #e5e7eb;margin-bottom:1.5rem}.form-header{display:flex;align-items:center;gap:.75rem;padding-bottom:1rem;margin-bottom:1rem;border-bottom:1px solid #e5e7eb}.form-header h2{font-size:1.25rem;font-weight:700;color:#1f2937}.form-header-icon{font-size:1.25rem;color:#f43f5e;line-height:1}.cancel-btn{margin-left:auto;color:#6b7280;transition:color .15s;font-size:1.25rem;background:none;border:none;cursor:pointer}.cancel-btn:hover{color:#1f2937}.status-message{display:flex;align-items:center;padding:.75rem;border-left:4px solid;border-radius:.5rem}.status-message p{font-size:.875rem;font-weight:500}.status-message-icon{font-size:1.25rem;margin-right:.75rem;flex-shrink:0;line-height:1}.status-success{background-color:#d1fae5;border-color:#34d399;color:#065f46}.status-error{background-color:#fee2e2;border-color:#f87171;color:#b91c1c}.form-field-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.form-field{margin-bottom:1rem}.form-field label{display:flex;font-size:.875rem;font-weight:500;color:#374151;margin-bottom:.25rem}.input-style{display:flex;width:95%;padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;transition:all .15s}.input-style:focus{outline:none;border-color:#f43f5e;box-shadow:0 0 0 1px #f43f5e}.submit-btn{width:100%;display:flex;justify-content:center;align-items:center;padding:.75rem 1rem;font-size:1.125rem;font-weight:500;border-radius:.5rem;color:#fff;background-color:#f43f5e;transition:background-color .15s;border:none;cursor:pointer}.submit-btn:hover:not(:disabled){background-color:#e11d48}.submit-btn:focus{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px #f43f5e}.submit-btn:disabled{background-color:#fda4af;cursor:not-allowed}.spinner{animation:spin 1s linear infinite;margin-right:.75rem;height:1.25rem;width:1.25rem;color:#fff}.list-title{font-size:1.25rem;font-weight:700;color:#1f2937;margin-bottom:1rem}.table-wrapper{background-color:#fff;box-shadow:0 20px 25px -5px #0000001a;border-radius:.75rem;overflow:hidden}.product-table{min-width:100%;border-collapse:collapse;width:100%}.product-table thead{background-color:#f9fafb}.product-table th,.product-table td{padding:.75rem 1.5rem;text-align:left;font-size:.75rem;color:#6b7280;border-bottom:1px solid #e5e7eb}.product-table th{font-weight:500;text-transform:uppercase;letter-spacing:.05em}.product-table td{font-size:.875rem;color:#1f2937}.text-gray-500-sm{color:#6b7280}.product-row{transition:background-color .15s}.product-row:hover{background-color:#f9fafb}.product-row.editing{background-color:#fff1f2}.product-row .product-id{font-weight:500}.product-info{display:flex;align-items:center}.product-image{flex-shrink:0;height:2.5rem;width:2.5rem}.product-image img{height:100%;width:100%;border-radius:.5rem;object-fit:cover}.product-title{margin-left:1rem;font-weight:500;color:#1f2937}.actions-cell{text-align:right;font-weight:500;white-space:nowrap}.action-btn{padding:.5rem;border-radius:.5rem;transition:background-color .15s;border:none;cursor:pointer;background:none;font-size:1rem;line-height:1;display:inline-flex;align-items:center;justify-content:center}.edit-btn{color:#4f46e5}.edit-btn:hover{color:#3730a3;background-color:#eef2ff}.delete-btn{color:#dc2626;margin-left:.5rem}.delete-btn:hover{color:#7f1d1d;background-color:#fef2f2}.action-btn:disabled{opacity:.5;cursor:not-allowed}.table-loading-message,.table-empty-message{text-align:center;padding:1rem 0;color:#6b7280;font-size:.875rem}.cms-header-wrapper{display:flex;width:100%;height:clamp(3rem,3rem + 1vw,5rem)}.cms-header{width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 2rem}.cms-right{width:calc(2.7rem * 1.618);height:2.7rem;border-radius:2rem;border:black solid 1px;background-color:var(--color-white-transparent);color:var(--color-white);cursor:pointer;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:transform .25s ease,box-shadow .25s ease;font-size:clamp(.7rem,.7rem + .5vw,.9rem);font-weight:700}.cms-right:hover{transform:translateY(-1px);box-shadow:0 10px 32px #0000002e}.cms-left{min-width:10rem;width:10rem;height:auto;color:#fff;display:flex;flex-direction:row}.cms-left-icon{display:flex;width:100%;height:auto;justify-content:center;align-items:center;margin-right:.5rem}.cms-left-icon span{font-size:clamp(1.2rem,1.2rem + 1vw,1.7vw)}.cms-left-text{width:auto;height:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:clamp(.7rem,.7rem + .5vw,1rem);font-weight:700}.cms-user-name{color:#fff}.cms-user-email{color:gray}html{scroll-behavior:smooth}html,body{min-width:100%;min-height:100vh;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;line-height:1}html,body,#static-app{font-size:15px}@media(min-width:768px){html,body,#static-app{font-size:16px}}@media(min-width:1200px){html,body,#static-app{font-size:17px}}html,body,#static-app{background-color:var(--color-black)}#static-app{width:100%;min-height:100vh}body{background-color:var(--color-black)}header,main,footer{width:100%;min-height:fit-content;background-color:var(--color-black)}#static-app{background-color:var(--color-black)}a,p,span,li,div,input,textarea,select,button,h3,label{color:var(--color-black)}html,#static-app,body{background-color:var(--color-black)}:root{--color-red: rgb(200, 30, 30);--color-red-transparent: rgba(255, 0, 0, .2);--color-white: rgb(253, 253, 253, 1);--color-white-transparent: rgba(253, 253, 253, .2);--color-black: rgb(26, 26, 26, 1);--color-black-transparent: rgba(26, 26, 26, .7)}@keyframes fadeInUp{to{transform:translateY(0);opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes gradientBG{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes shakeText{0%,to{transform:translate(0)}25%{transform:translate(-5px)}50%{transform:translate(5px)}75%{transform:translate(-5px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}
