:root{--primary:#0071e3;--secondary:#86868b;--bg:#f5f5f7;--card:#fff;--text:#1d1d1f;--secondary-text:#6e6e73;--success:#34c759;--warning:#fc0;--error:#ff3b30;--input-bg:#fbfbfd;--input-border:#d2d2d7;--th-bg:#beeaff;--th-bg-e:#ffbebe;--secondary-btn-bg:#e8e8ed;--secondary-btn-text:#1d1d1f;--border-color:#d2d2d7;--photo-card-bg:#fff;--grid-column:#b7b7be}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--primary:#2997ff;--bg:#1c1c1e;--card:#2c2c2e;--text:#f5f5f7;--secondary-text:#a1a1a6;--success:#30d158;--warning:#ffd60a;--error:#ff453a;--input-bg:#3a3a3c;--input-border:#48484a;--th-bg:#124760;--th-bg-e:#601212;--secondary-btn-bg:#3a3a3c;--secondary-btn-text:#f5f5f7;--border-color:#48484a;--photo-card-bg:#000;--grid-column:#424246}}[data-theme=dark]{--primary:#2997ff;--bg:#1c1c1e;--card:#2c2c2e;--text:#f5f5f7;--secondary-text:#a1a1a6;--success:#30d158;--warning:#ffd60a;--error:#ff453a;--input-bg:#3a3a3c;--input-border:#48484a;--th-bg:#3a3a3c;--secondary-btn-bg:#3a3a3c;--secondary-btn-text:#f5f5f7;--border-color:#48484a;--photo-card-bg:#000}body{background-color:var(--bg);color:var(--text);margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}.h-stack{flex-direction:row;display:flex}.v-stack{flex-direction:column;display:flex}.container{max-width:1200px;margin:0 auto;padding:20px}thead th{z-index:1;position:sticky;top:0}#loginSection{background:var(--card);border-radius:20px;max-width:400px;margin:100px auto 0;padding:2rem;box-shadow:0 10px 40px #0000001a}h1{margin-bottom:.5rem;font-size:24px;font-weight:700}.subtitle{color:var(--secondary-text);margin-bottom:2rem;font-size:14px}.form-group{margin-bottom:1.5rem}.form-group label{color:var(--secondary-text);text-transform:uppercase;margin-bottom:8px;font-size:12px;font-weight:600;display:block}#days-dropdown{z-index:100;background:var(--card);border:1px solid #d2d2d7;border-radius:8px;min-width:120px;margin-bottom:8px;padding:10px;display:none;position:absolute;bottom:100%;left:0;box-shadow:0 -4px 6px #0000001a}input,select{border:1px solid var(--input-border);box-sizing:border-box;background:var(--input-bg);width:100%;color:var(--text);border-radius:10px;padding:12px;font-size:16px}button{cursor:pointer;border:none;border-radius:10px;width:100%;margin-top:10px;padding:14px;font-size:16px;font-weight:600;transition:all .2s}#days-dropdown label{white-space:nowrap;justify-content:flex-start;align-items:center;gap:6px;display:flex}#days-dropdown input[type=checkbox]{flex-shrink:0;width:auto;margin:0}[data-theme=dark] .secondary-btn{color:#424141;background-color:#e8e8ed}[data-theme=dark] .photo-card-info{border-top:1px solid #4a4a4c}[data-theme=dark] .small-border{border-top:1px solid #000}[data-theme=dark] .list-dl-btn{color:#01579b;background:#38a1d2;border:2px solid #248bdb}.primary-btn{background-color:var(--primary);color:#fff}.primary-btn:hover{background-color:#0077ed}.secondary-btn{color:#000;background-color:#e8e8ed}.secondary-btn:hover{background-color:#d2d2d7}.delete-btn{color:var(--error);cursor:pointer;background:0 0;border:none;width:auto;margin:0;padding:5px;font-size:13px}.text-btn{color:var(--primary);cursor:pointer;background:0 0;border:none;width:auto;margin:0;padding:0;font-size:14px}button:disabled{cursor:not-allowed;background-color:#d2d2d7}.list-dl-btn{color:#01579b;background:#e1f5fe;border:2px solid #248bdb;flex:1.5;min-width:150px;margin:0;padding:10px;font-size:13px}.photo-search-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));align-items:flex-start;gap:30px;margin-bottom:2rem;display:grid}.dashboard{padding-top:2rem}.user-info{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.tabs{border-bottom:1px solid var(--border-color);gap:1.5rem;margin-bottom:2rem;display:flex}.tab{cursor:pointer;color:var(--secondary-text);border-bottom:2px solid #0000;padding:10px 5px;font-weight:500;transition:all .2s}.tab.active{color:var(--primary);border-bottom-color:var(--primary)}.tab-content{display:none}.tab-content.active{display:block}.small-border{border-top:1px solid var(--border-color);padding-top:15px}#occupancy-info{color:#01579b;background:#e1f5fe;border:none;margin-bottom:15px}.admin-cards{flex-direction:column;gap:2rem;display:flex}.icon-btn{background:var(--input-border);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:20px;transition:background-color .2s;display:flex}.material-symbols-outlined{-webkit-user-select:none;user-select:none;font-size:16px}.subtotal-row{background:var(--card);border-top:2px solid var(--border-color)}.info-box{background:var(--bg);border:1px solid var(--border-color);border-radius:10px;margin-bottom:1.5rem;padding:1rem}.config-card{background:var(--card);border:1px solid var(--border-color);border-radius:15px;margin-bottom:2rem;padding:1.5rem}.config-card h3{margin-top:0;margin-bottom:1rem;font-size:18px}.table-container{border:1px solid var(--border-color);border-radius:10px;margin-top:1rem;overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%;min-width:600px;font-size:14px;overflow-x:scroll}th{background:var(--th-bg);border-bottom:1px solid var(--border-color);padding:12px;font-weight:600}td{border-bottom:1px solid var(--border-color);vertical-align:middle;padding:12px}.table-input{border-radius:6px;margin:0;padding:6px 10px;font-size:13px}.badge{border-radius:6px;padding:4px 8px;font-size:11px;font-weight:600;display:inline-block}.badge-admin{color:#01579b;background:#e1f5fe}.badge-user{background:var(--bg);color:var(--secondary-text)}.status-msg{min-height:1.2em;margin-top:10px;font-size:13px}.status-msg.success{color:var(--success)}.status-msg.error{color:var(--error)}.preview-container{background:var(--bg);white-space:pre;border:1px solid var(--border-color);border-radius:8px;margin-top:10px;padding:10px;font-family:monospace;font-size:11px}#class-img{background:var(--th-bg)}#class-img-e{background:var(--th-bg-e)}.photo-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:15px;margin-top:20px;display:grid}.photo-card{background:var(--card);border:1px solid var(--border-color);border-radius:12px;transition:all .2s;position:relative;overflow:hidden}.photo-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0000001a}.photo-card-img{background:var(--bg);cursor:pointer;justify-content:center;align-items:center;width:100%;height:160px;display:flex;overflow:hidden}.photo-card-img img{object-fit:cover;width:100%;height:100%}.photo-card-info{border-top:1px solid var(--border-color);padding:10px}.photo-card-name{margin-bottom:2px;font-size:13px;font-weight:600}.photo-card-uid{color:var(--secondary-text);font-family:monospace;font-size:10px}.photo-card-actions{opacity:0;z-index:10;gap:5px;transition:opacity .2s;display:flex;position:absolute;top:5px;right:5px}.photo-card:hover .photo-card-actions{opacity:1}.photo-action-btn{background:var(--card);cursor:pointer;width:24px;height:24px;color:var(--text);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:12px;display:flex;box-shadow:0 2px 5px #0000001a}.photo-action-btn.delete{color:var(--error)}.spinner{border:3px solid var(--bg);border-top:3px solid var(--primary);border-radius:50%;width:30px;height:30px;margin:10px auto;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#settingsModal{z-index:1000;background:#00000080;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.modal-content{background:var(--card);width:90%;max-width:400px;color:var(--text);border-radius:20px;padding:2rem;box-shadow:0 10px 40px #0003}.settings-icon{cursor:pointer;color:var(--text);border-radius:50%;padding:5px;transition:background .2s}.settings-icon:hover{background:var(--bg)}.approve-btn{background-color:var(--success);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:5px 12px;font-size:12px;font-weight:500;transition:background-color .2s}.decline-btn{background-color:var(--error);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:5px 12px;font-size:12px;font-weight:500;transition:background-color .2s}.approve-btn:hover{background-color:#2da44e}.decline-btn:hover{background-color:#a42d2d}#pending-dot{animation:2s infinite pulse-red}@keyframes pulse-red{0%{transform:scale(.95);box-shadow:0 0 #ff3b30b3}70%{transform:scale(1);box-shadow:0 0 0 6px #ff3b3000}to{transform:scale(.95);box-shadow:0 0 #ff3b3000}}
