:root{--primary:#ff5c40;--bg:#f9f9f9;--card-bg:#fff;--text:#333}.dashboard-container{background:var(--bg);min-height:100vh;padding:20px}.dashboard-title{margin-bottom:20px}.stats-grid{flex-wrap:wrap;justify-content:center;gap:20px;margin-bottom:30px;display:flex}.stat-card{background:var(--card-bg);text-align:center;border:1px solid #eee;border-radius:10px;padding:20px;transition:all .2s}.stat-card:hover{transform:translateY(-4px);box-shadow:0 5px 15px #0000001a}.stat-number{color:var(--primary);font-size:28px;font-weight:700}.stat-label{color:#666;font-size:14px}.stat-danger{color:red}.activity-section{background:#fff;border:1px solid #eee;border-radius:10px;padding:20px}.activity-title{margin-bottom:15px}.activity-list{flex-direction:column;gap:10px;display:flex}.activity-item{background:#fafafa;border:1px solid #eee;border-radius:6px;justify-content:space-between;padding:12px;display:flex}.activity-info{flex-direction:column;display:flex}.activity-member{font-weight:700}.activity-book{color:#666;font-size:13px}.activity-meta{text-align:right;font-size:12px}.status.borrowed{color:var(--primary);background:#ffefea}.status.returned{color:green;background:#e6f7ee}.status.overdue{color:red;background:#ffeaea}.books-container{padding:20px}.book-form{background:#fff;border:1px solid #eee;border-radius:10px;flex-wrap:wrap;gap:20px;margin-bottom:25px;padding:20px;display:flex}.book-form-image{flex-direction:column;align-items:center;display:flex}.image-preview{object-fit:cover;background:#ddd;border-radius:8px;width:120px;height:160px;margin-bottom:10px}.image-placeholder{color:#888;background:#eee;border-radius:8px;justify-content:center;align-items:center;width:120px;height:160px;margin-bottom:10px;font-size:12px;display:flex}.file-input{font-size:12px}.book-form-fields{flex-direction:column;gap:10px;display:flex}.book-form-fields input{border:1px solid #ddd;border-radius:6px;padding:10px}.book-form-fields button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;margin-top:10px;padding:10px}.members-container{background:#f9f9f9;min-height:100vh;padding:20px}.member-form{flex-wrap:wrap;gap:10px;margin-bottom:20px;display:flex}.member-form input{border:1px solid #ddd;border-radius:6px;padding:10px}.member-form button{color:#fff;cursor:pointer;background:#ff5c40;border:none;border-radius:6px;padding:10px 15px}.members-list{flex-direction:column;gap:12px;display:flex}.member-card{background:#fff;border:1px solid #eee;border-radius:8px;justify-content:space-between;align-items:center;padding:15px;transition:all .2s;display:flex}.member-card:hover{box-shadow:0 4px 12px #00000014}.member-info{flex-direction:column;display:flex}.member-name{font-weight:700}.member-phone{color:#666;font-size:13px}.member-actions{gap:8px;display:flex}.member-actions button{cursor:pointer;border:none;border-radius:5px;padding:6px 10px}.edit-btn{background:#eee}.delete-btn{color:#fff;background:#ff4d4f}.borrow-container{background:#f9f9f9;min-height:100vh;padding:20px}.borrow-title{margin-bottom:20px}.borrow-form{background:#fff;border:1px solid #eee;border-radius:10px;flex-wrap:wrap;gap:10px;margin-bottom:25px;padding:20px;display:flex}.borrow-form select,.borrow-form input{border:1px solid #ddd;border-radius:6px;padding:10px}.borrow-form button{color:#fff;cursor:pointer;background:#ff5c40;border:none;border-radius:6px;padding:10px 15px}.borrow-list{flex-direction:column;gap:12px;display:flex}.borrow-card{background:#fff;border:1px solid #eee;border-radius:8px;justify-content:space-between;align-items:center;padding:15px;transition:all .2s;display:flex}.borrow-card:hover{box-shadow:0 4px 12px #00000014}.borrow-info{flex-direction:column;display:flex}.borrow-member{font-weight:700}.borrow-book{color:#666;font-size:13px}.borrow-meta{text-align:right;font-size:12px}.status{border-radius:5px;margin-top:5px;padding:4px 8px;font-size:11px;display:inline-block}.borrowed{color:#ff5c40;background:#ffefea}.returned{color:green;background:#e6f7ee}.overdue{color:red;background:#ffeaea}.return-btn{color:#fff;cursor:pointer;background:#333;border:none;border-radius:5px;margin-top:8px;padding:6px 10px}.navbar-container{z-index:1000;background:var(--var-bodyBg);border-bottom:1px solid #eee;align-items:center;height:60px;padding:0 20px;display:flex;position:sticky;top:0}.navbar{justify-content:space-between;align-items:center;width:100%;max-width:1200px;height:100%;margin:0 auto;display:flex}.navbar-logo{color:#ff5c40;font-size:1.5rem;font-weight:700;text-decoration:none}.nav-links{align-items:center;gap:20px;display:flex}.nav-links a{color:#333;font-size:14px;text-decoration:none;transition:all .2s}.nav-links a:hover{color:#ff5c40}.nav-links a.active{color:#ff5c40;font-weight:700}.menu-toggle{cursor:pointer;font-size:24px;display:none}@media (width<=768px){.menu-toggle{display:block}.nav-links{background:var(--var-bodyBg);border-bottom:1px solid #eee;flex-direction:column;gap:0;padding:10px 0;display:none;position:absolute;top:60px;left:0;right:0;box-shadow:0 10px 20px #0000000d}.nav-links.open{display:flex}.nav-links a{width:100%;padding:12px 20px}.nav-links a:hover{background:#ff5c4014}}:root{--primary:#ff5c40;--bg:#f9f9f9;--text:#333;--card-bg:#fff}.library-container{background:var(--bg);min-height:100vh;padding:20px}.library-title{color:var(--text);margin-bottom:15px}.search-container{justify-content:center;display:flex}.search-input{border:1px solid #ddd;border-radius:6px;width:300px;margin-bottom:20px;padding:10px}.book-grid{justify-content:center;gap:20px;display:flex}.book-card{background:var(--card-bg);cursor:pointer;border:1px solid #eee;border-radius:10px;width:180px;transition:all .2s;overflow:hidden}.book-card:hover{transform:translateY(-5px);box-shadow:0 4px 15px #0000001a}.book-card.disabled{opacity:.5;pointer-events:none}.book-image{object-fit:cover;background:#ddd;width:100%;height:220px}.book-info{padding:10px}.book-title{margin-bottom:5px;font-size:14px;font-weight:700}.book-author{color:#666;margin-bottom:8px;font-size:12px}.book-badge{background:var(--primary);color:#fff;border-radius:5px;padding:4px 8px;font-size:11px;display:inline-block}.book-badge.out{background:#999}.emptyMessage{text-align:center}.auth-container{justify-content:center;align-items:center;height:100vh;display:flex}.auth-card{background:#fff;border-radius:10px;width:350px;padding:30px;box-shadow:0 10px 25px #0000000d}.auth-card h2{color:var(--text-primary);margin-bottom:20px}.auth-card input{border:1px solid #eee;border-radius:6px;width:100%;margin-bottom:15px;padding:12px}.auth-card button{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;width:100%;padding:12px}.auth-card button:hover{opacity:.9}.auth-link{color:var(--text-secondary);margin-top:10px;font-size:14px}.auth-link a{color:var(--primary);text-decoration:none}:root{--var-bodyBg:#f6f7f5;--text-primary:#1f2937;--text-secondary:#6b7280;--text-muted:#9ca3af;--text-inverse:#fff;--primary:#ff5c40}*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}body{-webkit-font-smoothing:antialiased;background-color:var(--var-bodyBg);color:var(--text-primary);font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;line-height:1.5}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}button{cursor:pointer;background:0 0;border:none}a{color:inherit;text-decoration:none}ul,ol{list-style:none}table{border-collapse:collapse;border-spacing:0}.container{width:100%;max-width:1200px;margin:0 auto;padding:clamp(12px,2vw,20px)}.container-sm{max-width:800px;margin:0 auto;padding:20px}.container-lg{max-width:1400px;margin:0 auto;padding:20px}.centered{justify-content:center;align-items:center;width:100%;min-height:100vh;display:flex}.page-title{color:var(--text-primary);text-align:center;padding:20px;font-weight:600}.section-title{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.section{margin-bottom:30px}@media (width<=1024px){.container{max-width:900px}.page-title{padding:18px;font-size:1.6rem}}@media (width<=768px){.container{max-width:100%;padding:15px}.container-sm{padding:15px}.page-title{padding:15px;font-size:1.4rem}.section-title{font-size:.95rem}.section{margin-bottom:20px}.centered{align-items:flex-start;padding-top:40px}input,select,textarea{font-size:16px}button{min-height:44px}}@media (width<=480px){.container,.container-sm,.container-lg{padding:12px}.page-title{padding:12px;font-size:1.2rem}.section-title{font-size:.9rem}.section{margin-bottom:15px}body{line-height:1.4}}
