
* { margin:0; padding:0; box-sizing:border-box; }
.hidden { display: none !important; }
body { font-family:'Inter',sans-serif; background:#fff; color:#1e1e1e; line-height:1.5; }
h1,h2,h3,h4 { font-family:'Lora',serif; font-weight:500; letter-spacing:-0.02em; }
.container { max-width:1400px; margin:0 auto; padding:0 2rem; }
.accent-red { color:#ff0000; }
.bg-red { background:#ff0000; }
.btn-red { background:#ff0000; color:white; border:none; padding:0.5rem 1.5rem; font-weight:500; border-radius:2px; cursor:pointer; }
.btn-red:hover { background:#cc0000; }
.btn-outline-red { background:transparent; border:1px solid #ff0000; color:#ff0000; padding:0.5rem 1.5rem; border-radius:2px; cursor:pointer; }
.btn-outline-red:hover { background:#ff0000; color:white; }
.navbar { display:flex; justify-content:space-between; align-items:center; padding:1.5rem 0; border-bottom:1px solid #eaeaea; }
.logo img { height:60px; width:auto; }
.nav-links { display:flex; gap:2.5rem; align-items:center; }
.nav-links a { text-decoration:none; color:#2d2d2d; font-weight:500; }
.nav-links a:hover { color:#ff0000; }
.lang-cart { display:flex; align-items:center; gap:1.5rem; }
.lang-switch { display:flex; gap:0.4rem; font-weight:500; }
.lang-switch a { text-decoration:none; color:#5a5a5a; padding:0.2rem 0.4rem; cursor:pointer; }
.lang-switch a.active { color:#ff0000; background:#f0f0f0; border-radius:3px; }
.cart-icon { position:relative; font-size:1.3rem; cursor:pointer; }
.cart-badge { position:absolute; top:-8px; right:-8px; background:#ff0000; color:white; font-size:0.7rem; padding:0.1rem 0.4rem; border-radius:20px; }
.admin-toggle { display:flex; align-items:center; gap:0.5rem; margin-left:1rem; font-size:0.85rem; }
.switch { position:relative; display:inline-block; width:44px; height:22px; background:#ccc; border-radius:30px; cursor:pointer; }
.switch:after { content:''; position:absolute; width:18px; height:18px; background:white; border-radius:50%; top:2px; left:2px; transition:0.2s; }
.switch.active { background:#ff0000; }
.switch.active:after { left:24px; }
.hero { margin:2.5rem 0 3rem; background:linear-gradient(97deg,#f0f0f0 0%,#dbd7d2 100%); min-height:380px; border-radius:20px; display:flex; align-items:center; position:relative; overflow:hidden; }
.hero-image { position:absolute; right:0; top:0; width:55%; height:100%; background-image:url('zhijian/Image_20260323151540_7_5.jpg'); background-size:cover; mix-blend-mode:multiply; }
.hero-content { position:relative; z-index:2; width:55%; padding:3rem; }
.hero-content h1 { font-size:3.2rem; line-height:1.1; padding-right:18%; margin-bottom:1rem; }
.hero-content p { font-size:1.2rem; color:#3a3a3a; max-width:500px; padding-right: 10%; margin-bottom:2rem; }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; margin:2.5rem 0 1.5rem; }
.section-heading h2 { font-size:2rem; font-weight:400; border-left:6px solid #ff0000; padding-left:1rem; }
.view-link { color:#ff0000; text-decoration:none; font-weight:500; }
.book-grid { display: grid; gap: 2rem; }
    @media (max-width: 599px) { .book-grid { grid-template-columns: repeat(1, 1fr); } }
    @media (min-width: 600px) and (max-width: 799px) { .book-grid { grid-template-columns: repeat(2, 1fr); } }
    @media (min-width: 800px) and (max-width: 999px) { .book-grid { grid-template-columns: repeat(3, 1fr); } }
    @media (min-width: 1000px) and (max-width: 1199px) { .book-grid { grid-template-columns: repeat(4, 1fr); } }
    @media (min-width: 1200px) and (max-width: 1399px) {  .book-grid { grid-template-columns: repeat(5, 1fr); } }
    @media (min-width: 1400px) { .book-grid { grid-template-columns: repeat(6, 1fr); } }
.book-card { background:white; border-radius:8px; overflow:hidden; display:flex; flex-direction:column; cursor:pointer; transition:transform 0.15s,box-shadow 0.2s; }
.book-card:hover { transform:translateY(-4px); box-shadow:0 10px 25px -8px rgba(0,0,0,0.15); }
.book-cover { aspect-ratio:2/3; background:#2d2d2d; border-radius:6px 6px 2px 2px; display:flex; flex-direction:column; justify-content:flex-end; padding:1rem; color:white; text-shadow:0 2px 6px rgba(0,0,0,0.5); font-family:'Lora',serif; font-weight:600; font-size:1rem; box-shadow:inset 0 -30px 40px rgba(0,0,0,0.3); border:1px solid #ddd; background-size:cover; background-position:center; background-repeat: repeat;}
.book-meta { padding:0.75rem 0 0.2rem; }
.book-title { font-weight:600; font-size:1rem; font-family:'Lora',serif; }
.book-author { font-size:0.85rem; color:#5a5a5a; }
.admin-controls { display:flex; gap:0.3rem; margin-top:0.3rem; }
.admin-controls button { background:transparent; border:none; color:#9e9e9e; cursor:pointer; }
.admin-controls button:hover { color:#ff0000; }
.about-panel { background:#f5f5f5; border-radius:24px; padding:2.5rem; margin:3rem 0; display:flex; gap:3rem; align-items:center; flex-wrap:wrap; }
.about-text { flex:2; min-width:280px; }
.about-text h3 { font-size:1.8rem; margin-bottom:1rem; }
.about-text p { color:#3a3a3a; max-width:720px; margin-bottom:2rem; }
.about-photo { flex:1; background:#c0bcb5; border-radius:18px; height:200px; background-image:url('zhijian/Image_20260309105327_94_399.jpg'); background-position: 50% 50%; background-size:cover; border:3px solid white; }
.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; margin:2rem 0; }
.news-item { border-bottom:2px solid #e0e0e0; padding-bottom:1.2rem; }
.news-image { width:100%; height:140px; background:#ddd; background-size:cover; background-position:center; border-radius:8px 8px 0 0; margin-bottom:0.8rem; }
.news-date { font-size:0.85rem; color:#ff0000; font-weight:500; }
.news-title { font-weight:600; font-size:1.2rem; margin:0.3rem 0 0.5rem; }
.news-summary { color:#5a5a5a; font-size:0.9rem; }
.news-footer { display:flex; justify-content:flex-end; margin-top:0.5rem; }
.toolbox { background:#1e1e1e; color:#efefef; border-radius:30px; padding:2rem; margin:3rem 0 1rem; transition:all 0.2s; }
.toolbox.hidden { display:none; }
.toolbox h3 { color:white; margin:1.5rem 0 1rem; }
.toolbox .form-row { display:flex; flex-wrap:wrap; gap:1rem; align-items:flex-end; margin-bottom:1rem; }
.toolbox input, .toolbox select, .toolbox .file-label { padding:0.6rem 1rem; border-radius:40px; border:none; background:#3f3f3f; color:white; flex:1 1 150px; }
.toolbox .file-label { display:inline-flex; align-items:center; gap:0.5rem; cursor:pointer; }
.toolbox input[type="file"] { display:none; }
.toolbox button { background:#ff0000; border:none; color:white; padding:0.6rem 2rem; border-radius:40px; cursor:pointer; }
.toolbox .file-name { color:#ccc; font-size:0.85rem; margin-left:0.5rem; }
.hr-light { border:0.5px solid #3f3f3f; margin:2rem 0; }
footer { margin-top:4rem; padding:2rem 0; border-top:1px solid #eaeaea; display:flex; justify-content:space-between; align-items:center; color:#5a5a5a; }
.footer-links a { color:#2d2d2d; text-decoration:none; margin-left:2rem; }
.footer-links a:hover { color:#ff0000; }

/* Modal styles */
.modal-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); align-items:center; justify-content:center; z-index:1000; }
.modal-overlay.active { display:flex; }
.modal-content { background:white; max-width:1000px; width:95%; max-height:85vh; overflow-y:auto; border-radius:24px; padding:2rem; position:relative; box-shadow:0 20px 40px rgba(0,0,0,0.3); display:flex; gap:2rem; flex-wrap:wrap; }
.modal-close { position:absolute; top:1rem; right:1rem; font-size:1.5rem; cursor:pointer; color:#5a5a5a; }
.modal-close:hover { color:#ff0000; }
.modal-left { flex:1 1 250px; }
.modal-cover { width:100%; aspect-ratio:2/3; background:#2d2d2d; border-radius:12px; background-size:cover; background-position:center; box-shadow:0 8px 20px rgba(0,0,0,0.2); }
.modal-right { flex:2 1 450px; }
.modal-title { font-size:1.8rem; font-family:'Lora',serif; font-weight:600; margin-bottom:0.5rem; }
.modal-author { font-size:1rem; color:#5a5a5a; margin-bottom:1rem; }
.modal-price { font-size:1.8rem; font-weight:600; margin-bottom:0.5rem; }
.modal-availability { font-size:0.9rem; color:#5a5a5a; background:#f5f5f5; padding:0.5rem 1rem; border-radius:40px; margin-bottom:1.5rem; display:inline-block; }
.modal-actions { display:flex; gap:1rem; margin-bottom:2rem; flex-wrap:wrap; }
.btn-primary { background:#ff0000; color:white; border:none; padding:0.7rem 2rem; font-weight:600; border-radius:40px; cursor:pointer; display:inline-flex; align-items:center; gap:0.5rem; }
.btn-primary:hover { background:#cc0000; }
.btn-secondary { background:transparent; border:1px solid #ff0000; color:#ff0000; padding:0.7rem 2rem; font-weight:600; border-radius:40px; cursor:pointer; display:inline-flex; align-items:center; gap:0.5rem; }
.btn-secondary:hover { background:#ff0000; color:white; }
.modal-tabs { display:flex; border-bottom:1px solid #eaeaea; margin-bottom:1rem; gap:0.2rem; flex-wrap:wrap; }
.modal-tab { font-size:0.85rem; padding:0.5rem 0.6rem; white-space:nowrap;font-weight: 500; color:#5a5a5a; cursor:pointer; border-bottom:3px solid transparent; transition: color 0.2s, border-color 0.2s; }
.modal-tab:hover { color:#1e1e1e; }
.modal-tab.active { color:#ff0000; border-bottom-color:#ff0000; }
.modal-tab-content { min-height:200px; }
.tab-pane { display:none; }
.tab-pane.active { display:block; }
.categories-section { margin-bottom:1.5rem; }
.category-list { display:flex; flex-wrap:wrap; gap:0.5rem; }
.category-tag { background:#f0f0f0; padding:0.3rem 1rem; border-radius:30px; font-size:0.85rem; }
.product-details { border-top:1px solid #eaeaea; padding-top:1.5rem; }
.detail-row { display:flex; margin-bottom:0.5rem; font-size:0.95rem; }
.detail-label { font-weight:600; width:120px; }
.detail-value { color:#5a5a5a; }

/* Review section */
.no-reviews { color: #5a5a5a; font-style: italic; padding: 1rem; text-align: center; background: #f9f9f9; border-radius: 8px;}
.review-list { margin-top:1.5rem; }
.review-item { border-bottom:1px solid #eaeaea; padding:1rem 0; }
.review-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:0.5rem; }
.review-user { font-weight:600; color:#1e1e1e; }
.review-date { font-size:0.8rem; color:#5a5a5a; }
.review-text { color:#3a3a3a; margin-bottom:0.75rem; line-height:1.5; }
.review-actions { display:flex; gap:1.5rem; align-items:center; }
.like-btn, .comment-btn, .share-btn { background:none; border:none; color:#5a5a5a; cursor:pointer; font-size:0.9rem; display:flex; align-items:center; gap:0.3rem; }
.like-btn:hover, .comment-btn:hover, .share-btn:hover { color:#ff0000; }
.like-count { font-size:0.85rem; }
.comment-section { margin-top:1rem; margin-left:1.5rem; }
.comment-item { background:#f9f9f9; padding:0.5rem; border-radius:8px; margin-bottom:0.5rem; font-size:0.9rem; }
.comment-user { font-weight:600; margin-right:0.5rem; }
.comment-text { color:#2d2d2d; }
.comment-form { display:flex; gap:0.5rem; margin-top:0.5rem; }
.comment-input { flex:1; padding:0.3rem 0.5rem; border:1px solid #ddd; border-radius:20px; font-size:0.9rem; }
.comment-submit { background:#ff0000; color:white; border:none; padding:0.3rem 1rem; border-radius:20px; cursor:pointer; font-size:0.8rem; }
.review-form { margin:1rem 0; display:flex; gap:0.5rem; flex-direction:column; }
.review-textarea { width:100%; padding:0.5rem; border:1px solid #ddd; border-radius:8px; resize:vertical; min-height:80px; }
.review-submit { align-self:flex-end; background:#ff0000; color:white; border:none; padding:0.5rem 2rem; border-radius:40px; cursor:pointer; }

/* Login modal */
.login-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); align-items:center; justify-content:center; z-index:1100; }
.login-overlay.active { display:flex; }
.login-modal { background:white; max-width:400px; width:90%; border-radius:24px; padding:2rem; position:relative; }
.login-close { position:absolute; top:1rem; right:1rem; font-size:1.2rem; cursor:pointer; color:#5a5a5a; }
.login-title { font-size:1.8rem; font-family:'Lora',serif; margin-bottom:1.5rem; }
.login-input { width:100%; padding:0.8rem; margin-bottom:1rem; border:1px solid #ddd; border-radius:40px; font-size:1rem; }
.login-btn { width:100%; background:#ff0000; color:white; border:none; padding:0.8rem; border-radius:40px; font-weight:600; cursor:pointer; }
.login-btn:hover { background:#cc0000; }
.login-error { color:#ff0000; font-size:0.9rem; margin-top:0.5rem; text-align:center; }
.user-info { display:flex; align-items:center; gap:1rem; }
.user-name { font-weight:500; color:#2d2d2d; }
.logout-btn { background:transparent; border:1px solid #ff0000; color:#ff0000; padding:0.3rem 1rem; border-radius:40px; cursor:pointer; font-size:0.85rem; }
.logout-btn:hover { background:#ff0000; color:white; }

/* Cart Modal */
.cart-modal-content { max-width: 600px; padding: 2rem; }
.cart-title { font-size: 1.8rem; font-family: 'Lora', serif; color:#ff0000; margin-bottom: 1.5rem; }
.cart-items-container { max-height: 300px; overflow-y: auto; margin-bottom: 1.5rem; border-bottom: 1px solid #eaeaea; }
.cart-item { display: flex; align-items: center; gap: 1rem; padding: 0.8rem 0; border-bottom: 1px solid #f0f0f0; }
.cart-item-cover { width: 50px; height: 70px; background-size: cover; background-position: center; border-radius: 4px; background-color: #2d2d2d; }
.cart-item-details { flex: 1; }
.cart-item-title { font-weight: 600; font-size: 1rem; }
.cart-item-author { font-size: 0.85rem;color: #5a5a5a;}
.cart-item-price { font-weight: 600; color: #ff0000; }
.cart-item-quantity { display: flex; align-items: center; gap: 0.5rem;}
.cart-item-quantity input { width: 50px; padding: 0.3rem; border: 1px solid #ddd; border-radius: 4px; text-align: center; }
.cart-item-remove { background: none; border: none; color: #999; cursor: pointer; font-size: 1rem; }
.cart-item-remove:hover { color: #ff0000;}
.cart-summary { background: #f9f9f9; padding: 1.5rem; border-radius: 12px; margin-bottom: 1.5rem; }
.summary-row { display: flex; justify-content: space-between; margin-bottom: 0.8rem; font-size: 1rem; }
.total-row { font-weight: 700; font-size: 1.2rem; border-top: 1px solid #ddd; padding-top: 0.8rem; margin-top: 0.5rem; }
.cart-actions { display: flex; gap: 1rem; justify-content: flex-end; }
#continueShoppingBtn { padding: 0.7rem 2rem; }

/* Checkout Modal */
.checkout-modal-content { max-width: 600px; padding: 2rem; }
.checkout-title { font-size: 1.8rem; font-family: 'Lora', serif; margin-bottom: 1.5rem; }
.form-group { margin-bottom: 1.2rem; }
.form-group label { display: block; font-weight: 500; margin-bottom: 0.3rem; font-size: 0.9rem; }
.checkout-input { width: 100%; padding: 0.8rem; border: 1px solid #ddd; border-radius: 8px; font-size: 1rem; }
.form-row { display: flex; gap: 1rem; }
.form-group.half { flex: 1; }
#payNowBtn { width: 100%; margin-top: 1rem; }
.payment-error { color: #ff0000; font-size: 0.9rem; margin-top: 0.5rem; text-align: center; }

/* Confirmation Modal */
.confirmation-modal-content { max-width: 500px; padding: 2rem; text-align: center; }
.confirmation-title { font-size: 2rem; font-family: 'Lora', serif; color: #ff0000; margin-bottom: 1.5rem; }
.order-summary { background: #f9f9f9; padding: 1.5rem; border-radius: 12px; margin-bottom: 2rem; text-align: left; }
.order-summary p { margin-bottom: 0.5rem; }
#continueShoppingConfirmBtn { padding: 0.8rem 2.5rem;}

/* Responsive adjustments */
@media (max-width: 600px) { 
    .cart-modal-content {width: 95%; padding: 1rem; }
    .cart-item { flex-wrap: wrap; }
    .cart-item-cover { width: 40px; height: 55px;}
    .cart-item-quantity input { width: 40px; }
    .cart-actions { flex-direction: column; }
    .cart-actions button { width: 100%; }
    .btn-primary span, .btn-outline-red span { white-space: normal; word-break: break-word;}
    .checkout-modal-content .form-group label { font-size: 0.85rem;}
    .checkout-input { font-size: 0.9rem; padding: 0.6rem; }
    .order-summary p { word-break: break-word;}
}

@media (max-width: 850px) {
    .navbar { flex-direction: column; align-items: stretch; padding: 1rem;}
    .logo img { height: 50px; margin-bottom: 0.5rem;}
    .nav-links { flex-wrap: wrap; gap: 0.8rem; justify-content: center; margin-top: 0.5rem; }
    .lang-cart { margin-left: 0; justify-content: center; }
    .admin-toggle { margin-left: 0; justify-content: center; }
    .hero-content { width: 100%; padding: 2rem 1.5rem;}
    .hero-content h1 { font-size: 2.2rem;}
    .hero-content p { font-size: 1rem; }
    .hero-image { width: 100%; opacity: 0.15;}
    .book-grid { gap: 1rem; }
    .book-card { margin-bottom: 0.5rem;}
    .book-cover { font-size: 0.9rem; padding: 0.8rem;}
    .book-title { font-size: 0.95rem;}
    .book-author { font-size: 0.8rem; }
    .about-panel { display: grid; grid-template-areas: "stack"; background: transparent; padding: 0; margin: 3rem 0; border-radius: 24px; overflow: hidden; }
    .about-photo { grid-area: stack; width: 100%; height: 100%; opacity: 0.6; border: none; z-index: 1; background-size: cover; background-position: 25% 75%; }
    .about-text { grid-area: stack; z-index: 2; background: rgba(255, 255, 255, 0.6); padding: 2rem 1.5rem; border-radius: 18px; align-self: center; justify-self: center; max-width: 100%; color: #1e1e1e; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
    .about-text h3 { font-size: 1.5rem; margin-bottom: 1rem; }
    .about-text p { margin-bottom: 1.5rem;}
    .about-text button { background-color: white; border: 1px solid #ff0000; color: #ff0000; }
    .about-text button:hover { background-color: #ff0000; color: white; }
}

    @media (max-width: 687px) {
    .news-grid {  grid-template-columns: 1fr; gap: 1.5rem; }
    .news-title { font-size: 1.1rem;}
    .news-summary { font-size: 0.9rem; }
    .footer { flex-direction: column; gap: 1rem; text-align: center; padding: 1.5rem 0;}
    .footer-links a { margin: 0 1rem; }
    .toolbox .form-row { flex-direction: column; align-items: stretch; }
    .toolbox input, .toolbox select, .toolbox .file-label { width: 100%; }
    .toolbox button { width: 100%; }
}

.hamburger { display: none; flex-direction: column; justify-content: space-between; width: 30px; height: 21px; cursor: pointer; margin-right: 1rem;}
.hamburger span { display: block; height: 3px; width: 100%; background-color: #2d2d2d; border-radius: 3px; transition: all 0.3s;}
.hamburger.active span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { transform: translateY(-9px) rotate(-45deg);}

@media (max-width: 768px) {
    .navbar { flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center;}
    .hamburger { display: flex;}
    .nav-links { display: none; flex-direction: column; width: 100%; background: white; padding: 1rem 0; border-top: 1px solid #eaeaea; margin-top: 1rem;}
    .nav-links.show { display: flex; }
    .nav-links a { padding: 0.8rem 0; text-align: center; }
    .lang-switch { width: 100%; justify-content: center; margin-bottom: 0.5rem; flex-direction: column; gap: 0.5rem;}
    .lang-switch a { padding: 0.5rem 1rem; font-size: 1.1rem; }
    .cart-icon { font-size: 1.5rem; margin-top: 0.3rem; }
    .admin-toggle { justify-content: center; margin-left: 0; }
}

/* Book detail page*/
.page-header { display: flex; justify-content: space-between; align-items: center; margin: 2rem 0; }
.page-header h2 { font-size: 2rem; font-family: 'Lora', serif; }
.book-detail-page { min-height: 100vh; background: #fff; padding: 2rem; }
.detail-container { max-width: 1200px; margin: 0 auto;}
.detail-back-btn { background: none; border: none; color: #ff0000; font-size: 1rem; cursor: pointer; margin-bottom: 2rem; display: inline-flex; align-items: center; gap: 0.5rem;}
.detail-back-btn:hover { text-decoration: underline;}
.detail-content { display: flex; gap: 3rem; flex-wrap: wrap;}
.detail-left { flex: 1 1 300px;}
.detail-cover { width: 100%; aspect-ratio: 2/3; background-size: cover; background-position: center; border-radius: 12px; box-shadow: 0 8px 20px rgba(0,0,0,0.2);}
.detail-right { flex: 2 1 500px; }
.detail-title { font-size: 2.5rem; font-family: 'Lora', serif; margin-bottom: 0.5rem;}
.detail-author { font-size: 1.2rem; color: #5a5a5a; margin-bottom: 1rem; }
.detail-price { font-size: 2rem; font-weight: 600; margin-bottom: 1rem; }
.detail-availability { background: #f5f5f5; padding: 0.5rem 1rem; border-radius: 40px; display: inline-block; margin-bottom: 1.5rem; font-size: 0.9rem; }
.detail-actions { display: flex; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap; }
.detail-tabs { display: flex; border-bottom: 1px solid #eaeaea; margin-bottom: 1rem; gap: 0.2rem; flex-wrap: wrap; }
.detail-tab { font-size: 0.9rem; padding: 0.5rem 1rem; font-weight: 500; color: #5a5a5a; cursor: pointer; border-bottom: 3px solid transparent; }
.detail-tab.active { color: #ff0000; border-bottom-color: #ff0000;}
.detail-tab-content {min-height: 200px;}

/* News detail page */
.news-detail-content { max-width: 800px; margin: 0 auto; padding: 2rem 0; }
.news-detail-title { font-size: 2.5rem; font-family: 'Lora', serif; margin-bottom: 0.5rem; }
.news-detail-date { color: #ff0000; font-weight: 500; margin-bottom: 1.5rem; }
.news-detail-image { width: 100%; max-height: 400px; background-size: cover; background-position: center; border-radius: 12px; margin-bottom: 2rem; aspect-ratio: 16/9; background-color: #f0f0f0; }
.news-detail-summary { font-size: 1.2rem; line-height: 1.6; color: #2d2d2d; }

/* Admin books list */
.admin-books-list { background: #fff; border-radius: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); overflow-x: auto; }
.admin-book-row { display: grid; grid-template-columns: minmax(150px,2fr) minmax(120px,1fr) 80px 120px 200px; gap: 1rem; align-items: center; padding: 1rem; border-bottom: 1px solid #eaeaea; }
.admin-book-row:last-child { border-bottom: none; }
.admin-book-row .actions { display: flex; gap: 0.5rem; }
.admin-book-row button { background: none; border: none; color: #5a5a5a; cursor: pointer; font-size: 0.9rem; }
.admin-book-row button:hover { color: #ff0000; }
.admin-controls { display: flex; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap; align-items: center; }
.admin-controls input,
.admin-controls select { padding: 0.5rem 1rem; border: 1px solid #ddd; border-radius: 40px; font-size: 0.95rem; flex: 1 1 200px; }
.admin-controls button { white-space: nowrap; }

/* Form modal adjustments */
.form-modal-content { max-width: 800px; width: 95%; padding: 2rem; }
.form-row { display: flex; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.form-group { margin-bottom: 1.5rem; }
.form-group label { font-weight: 600; display: block; margin-bottom: 0.3rem; }
.form-row input, .form-row select { flex: 1 1 200px; min-width: 0; width: 100%; max-width: 100%; padding: 0.6rem 1rem; border: 1px solid #ddd; border-radius: 40px; box-sizing: border-box;}
.image-preview { max-width: 150px; max-height: 200px; margin-top: 0.5rem; border-radius: 8px; background-size: cover; background-position: center; border: 1px solid #ddd; }
.image-preview-grid { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; }
.image-preview-grid .thumb { width: 80px; height: 100px; background-size: cover; background-position: center; border-radius: 4px; border: 1px solid #ddd; }
.form-actions { display: flex; gap: 1rem; justify-content: flex-end; margin-top: 2rem; }
#cancelFormBtn { padding: 0.7rem 2rem; }
#addNewBookBtn { transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease; }
#addNewBookBtn:hover { background-color: #ff0000; color: white; padding: 0.7rem 2rem; font-weight: 600; border-radius: 40px; cursor: pointer; transition: background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease; }

/* Admin news list */
.admin-news-list { background: #fff; border-radius: 16px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); overflow-x: auto; }
.admin-news-row { display: grid; grid-template-columns: 120px 2fr 2fr 150px; gap: 1rem; align-items: center; padding: 1rem; border-bottom: 1px solid #eaeaea; }
.admin-news-row:last-child { border-bottom: none; }
.admin-news-row .actions { display: flex; gap: 0.5rem; }
.admin-news-row button { background: none; border: none; color: #5a5a5a; cursor: pointer; font-size: 0.9rem; }
.admin-news-row button:hover { color: #ff0000; }

/* Contact modal */
.contact-modal-content { max-width: 600px; padding: 2rem; }
.contact-modal-content form { width: 100%; }
.contact-modal-content .contact-title { margin-bottom: 0rem;}
.contact-modal-content .required-note {font-size: 0.85rem; color: #ff0000; margin-bottom: 0rem; }
.contact-modal-content .form-row {display: flex; gap: 1rem; margin-bottom: 0; width: 100% }
.contact-modal-content .form-group.half .contact-input { width: 100%; box-sizing: border-box;}
.contact-modal-content .form-group { width: 100%; margin-bottom: 1rem; }
.contact-title { font-size: 1.8rem; font-family: 'Lora', serif; margin-bottom: 1.5rem; color: #ff0000}
.contact-input, .contact-textarea { width: 100%; padding: 0.8rem; border: 1px solid #ddd; border-radius: 8px; margin-bottom: 1rem; }
.contact-textarea { resize: vertical; }
.contact-error { color: #ff0000; font-size: 0.9rem; margin-top: 0.5rem; text-align: center; }