@import"https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&display=swap";:root{--blue: #007bff;--light-blue: #0056b3;--red: #dc3545;--dark-red: #b22222}body{margin:0;font-family:Open Sans,sans-serif}label,a,p{font-size:15px}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.alert-container{position:fixed;bottom:20px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:10px;z-index:10000;transition:opacity 1s ease-in-out;align-items:center;justify-content:space-between}.alert{display:flex;align-items:center;justify-content:space-between;min-width:350px;max-width:450px;padding:16px 20px;border-radius:8px;color:#fff;font-size:16px;font-weight:700;gap:12px;line-height:1.4}.alert-message{flex:1;display:flex;align-items:center}@keyframes fadeInOpacity{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOutOpacity{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(10px)}}.pre-fade{opacity:0;transform:translateY(10px)}.fade-in{animation:fadeInOpacity .3s ease-out forwards}.fade-out{animation:fadeOutOpacity .15s ease-in forwards;pointer-events:none}.alert.success{background-color:#28a745}.alert.error{background-color:#dc3545}.alert.info{background-color:#17a2b8}.close-btn{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:0;margin:0;display:flex;align-items:center}.alert-content{width:100%;display:flex;text-align:center;align-items:center}.nav{padding:10px;margin-bottom:20px;background:#eee;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;ul{display:flex;list-style:none;padding:0;margin:0;align-items:center}ul li{margin:0 15px}ul li a{text-decoration:none;color:#000;font-weight:700;&:hover{color:#007bff}}ul li{background:none;border:none;cursor:pointer;font-weight:700;color:#000;transition:color .3s ease-in-out;&:hover{color:#007bff}}}.nav-logo{display:flex;align-items:center;text-decoration:none;color:#000;font-weight:700;transition:color .1s ease-in-out;font-size:20px;user-select:none;&:hover{color:#007bff}}.nav-icon{width:75px;height:auto;margin-right:8px;transition:filter .3s ease-in-out}.user-dropdown{display:flex;align-items:center;cursor:pointer}.user-info{display:flex;align-items:center;gap:10px;cursor:pointer}.user-avatar{width:32px;height:32px;border-radius:50%;background-color:#007bff;color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;text-transform:uppercase}.user-name{font-weight:700;user-select:none}.dropdown-menu{position:absolute;top:100%;right:0;background:#fff;box-shadow:0 2px 5px #0003;display:flex;flex-direction:column}.dropdown-menu li{padding:8px 12px;cursor:pointer;text-align:left}.dropdown-menu li a,.dropdown-menu li button{width:100%;text-align:left;background:none;border:none;color:#000;font-size:14px;font-weight:700}.dropdown-menu li a:hover,.dropdown-menu li button:hover{color:#007bff}.breadcrumbs-container{display:flex;align-items:center}.breadcrumbs{display:flex;gap:8px}.breadcrumbs a{text-decoration:none;color:var(--breadcrumb-color);font-weight:700;&:hover{text-decoration:underline}}.breadcrumbs span{color:gray}.home{padding:0 20px}.camera-display{display:flex;@media (max-width: 768px){flex-flow:row wrap}}.camera{display:flex;flex-direction:column;flex-basis:50%;max-width:50%;padding-top:30px;margin-right:20px;.camera-info{display:flex;padding-bottom:20px;align-items:baseline;*{margin-right:1rem}}img{width:100%;height:auto;border-radius:5px}@media (max-width: 768px){flex-basis:100%;max-width:100%;margin-top:40px}}button{margin:0 10px 10px 0}.main{background-color:none;color:#fff;cursor:pointer;background:none;padding:8px 12px;border:none;border-radius:4px}.isStd{background-color:#e9e9ed;color:#000;&:hover{background-color:#8d8d90}}.isPrimary{background-color:#007bff;&:hover{background-color:#0056b3}}.isDanger{background-color:#dc3545;&:hover{background-color:#b22222}}.spinner-container{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:10000}.spinner-sub-over-container{position:relative;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:10000}.spinner{width:50px;height:50px;border:6px solid rgba(0,0,0,.1);border-top:6px solid black;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.layout{padding:0 20px;button{background-color:#007bff;padding:8px 12px;border:none;border-radius:4px;cursor:pointer;margin:10px 10px 0 0;&:hover{background-color:#0056b3}}.delete{background-color:#dc3545;cursor:pointer;&:hover{background-color:#b22222}}}.login-layout{width:40%;input{width:100%;padding:12px;margin:8px 0;display:inline-block;border:1px solid #ccc;box-sizing:border-box}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:9999}.modal{background:#fff;padding:20px;border-radius:8px;width:300px;box-shadow:0 4px 6px #0003}.modal h3{margin-top:0}.modal label{display:block;margin-top:10px;font-weight:700}.modal-actions{margin-top:15px;display:flex;justify-content:space-between}.layout{padding:0 20px 40px}