body { font-family: Arial, sans-serif; background-color: #f4f7f6; margin: 0; padding: 0; display: flex; height: 100vh; }
.sidebar { width: 300px; background-color: #2c3e50; color: white; padding: 20px; overflow-y: auto; box-shadow: 2px 0 5px rgba(0,0,0,0.1); }
.sidebar h2 { margin-top: 0; color: #1abc9c; border-bottom: 1px solid #34495e; padding-bottom: 10px; font-size: 18px; }
.history-item { background: #34495e; margin-bottom: 10px; padding: 10px; border-radius: 5px; cursor: pointer; text-decoration: none; display: block; color: #ecf0f1; font-size: 14px; }
.history-item:hover { background: #1abc9c; color: white; }
.history-date { font-size: 11px; color: #bdc3c7; display: block; margin-top: 5px; }

.main-content { flex-grow: 1; padding: 40px; overflow-y: auto; }
.container { max-width: 900px; margin: 0 auto; background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); }
h1 { color: #333; text-align: center; }

.upload-box { border: 2px dashed #007bff; padding: 20px; margin-bottom: 20px; border-radius: 5px; background: #f9fbfd; }
.upload-box h3 { margin-top: 0; color: #007bff; }
button { background-color: #28a745; color: white; padding: 15px 20px; border: none; border-radius: 5px; font-size: 18px; cursor: pointer; width: 100%; font-weight: bold; }
button:hover { background-color: #218838; }

.ai-rezultat { margin-top: 30px; padding: 20px; background-color: #ffffff; border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
table { width: 100%; border-collapse: collapse; margin-top: 15px; }
th { padding: 12px; text-align: left; color: #555; background-color: #f4f7f6; }
td { padding: 15px; border-bottom: 1px solid #eee; }
.kategorija-red { background-color: #e9ecef; font-weight: bold; color: #495057; text-transform: uppercase; font-size: 14px; }
.ikona-da { color: #28a745; font-weight: bold; font-size: 18px; }
.ikona-ne { color: #dc3545; font-weight: bold; font-size: 18px; }
.detalj { color: #666; font-size: 14px; font-style: italic; display: block; margin-top: 5px; }