:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.app{max-width:1200px;margin:0 auto;padding:2rem;text-align:center}h1{font-size:2.5em;line-height:1.1;color:#646cff;margin-bottom:2rem}h2{font-size:1.8em;margin-bottom:1rem;color:#535bf2}.error{background-color:#fee;border:1px solid #f00;border-radius:8px;padding:1rem;margin-bottom:1rem;color:#c00}.container{display:grid;grid-template-columns:1fr 2fr;gap:2rem;margin-top:2rem}@media(max-width:768px){.container{grid-template-columns:1fr}}.add-product-section{background:#f9f9f9;padding:2rem;border-radius:8px;box-shadow:0 2px 8px #0000001a}form{display:flex;flex-direction:column;gap:1rem}.form-group{display:flex;flex-direction:column}input{padding:.8rem;border:1px solid #ddd;border-radius:4px;font-size:1rem}input:focus{outline:none;border-color:#646cff}button{border-radius:8px;border:1px solid transparent;padding:.8em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#646cff;color:#fff;cursor:pointer;transition:all .25s}button:hover{background-color:#535bf2;border-color:#535bf2}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.products-section{text-align:left}.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}.product-card{background:#fff;border:1px solid #ddd;border-radius:8px;padding:1.5rem;box-shadow:0 2px 4px #0000001a;transition:transform .2s}.product-card:hover{transform:translateY(-4px);box-shadow:0 4px 8px #00000026}.product-card h3{margin-top:0;color:#333;font-size:1.3em}.product-card .description{color:#666;margin:.5rem 0}.product-card .price{font-size:1.2em;font-weight:700;color:#28a745;margin:.5rem 0}.product-card .stock{color:#888;margin:.5rem 0}.delete-btn{background-color:#dc3545;margin-top:1rem;width:100%}.delete-btn:hover{background-color:#c82333}.connection-test-section{background:linear-gradient(135deg,#667eea,#764ba2);padding:2rem;border-radius:12px;margin-bottom:2rem;box-shadow:0 4px 12px #00000026}.test-connection-btn{background-color:#fff;color:#667eea;font-size:1.1em;padding:1em 2em;font-weight:600;border:2px solid #fff;box-shadow:0 2px 8px #0003}.test-connection-btn:hover:not(:disabled){background-color:#f0f0f0;transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.test-connection-btn:disabled{opacity:.7;cursor:not-allowed}.connection-status{background:#fff;border-radius:8px;padding:1.5rem;margin-top:1.5rem;text-align:left;box-shadow:0 2px 8px #0000001a}.connection-status.success{border-left:5px solid #28a745}.connection-status.failure{border-left:5px solid #dc3545}.status-header{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.status-icon{font-size:1.5em}.status-text{font-size:1.3em;font-weight:700;color:#333}.status-message{color:#555;font-size:1em;margin:.5rem 0;padding:.5rem;background:#f8f9fa;border-radius:4px}.connection-details{background:#f8f9fa;padding:1rem;border-radius:6px;margin:1rem 0}.connection-details p{margin:.5rem 0;color:#333;font-size:.95em}.connection-details strong{color:#667eea;margin-right:.5rem}.tested-at{font-size:.85em;color:#888;margin-top:1rem;font-style:italic}