:root { --green1: #193630; --green2: #294640; --green3: #395650; --green4: #496660; --green5: #597670; --gold1: #D3BB8A; --gold2: #E3CB9A; --gold3: #F3DBAA; --cyan: #60AEC5; } .dark-theme { background-color: var(--green3); color: var(--gold2); } nav { background-color: var(--green2); } nav form input { background-color: var(--green1); padding-left: 16px; border: none; border-radius: 8px; width: 40%; transition: width 0.4s ease-in-out; } nav form input:focus { padding-left: 13px; border: 3px solid var(--green1); width: 100%; } .navbar-brand { font-family: 'Lobster', cursive; font-size: 3rem; text-shadow: 2px 2px var(--green1); color: var(--gold1); position: absolute; left: 50%; transform: translateX(-50%); } .navbar-link { color: var(--gold1); text-decoration: none; } .navbar-brand:hover, .navbar-link:hover { color: var(--gold3); } footer { font-weight: bold; background-color: var(--green2); padding: 0; margin-top: 0; font-size: 12px; font-family: 'Inter', sans-serif; color: var(--gold1); left: 0; bottom: 0; width: 100%; } .card { background: linear-gradient(145deg, #08352c 0%, #062a23 100%); border: 1px solid #1c4d42; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); } .card a { color: var(--text-gold); text-decoration: none; } .btn-gothic { background-color: #1c4d42; color: var(--text-gold); border: 1px solid #2a6b5e; } .btn-gothic:hover { background-color: #2a6b5e; color: #fff; } .auth-container { max-width: 500px; margin: 2rem auto; padding: 2rem; border: 2px solid var(--green5); border-radius: 8px; background-color: var(--green2); } h1 { font-weight: bold; font-family: 'Lobster', cursive; } h2 { font-family: 'Lobster', cursive; text-align: center; font-size: 2.5rem; margin-bottom: 2rem; } h3, h4 { font-family: 'Lobster', cursive; } img { border: 2px solid var(--green1); } .auth-container button, #book-details button { background-color: var(--green3); border: 2px solid var(--green1); color: var(--gold3); } .auth-container button:hover, #book-details button:hover { background-color: var(--green1); border-color: var(--gold2); color: var(--gold1); } .auth-container a { color: var(--cyan); } .auth-container a:hover { text-decoration: underline; } #books-container { justify-content: center !important; } .book-card { width: 100%; /* Wykorzystaj całą dostępną szerokość */ height: 100%; background: var(--green1); border: 2px solid var(--green1); transition: transform 0.3s ease; } .cover-container { width: 100%; aspect-ratio: 5/8; /* Nowoczesne podejście do proporcji */ overflow: hidden; position: relative; } .book-cover { width: 100%; object-fit: cover; object-position: center top; transition: transform 0.3s ease; transform: scale(1.05); } #profile { background: var(--green1); border: 1px solid var(--gold1); border-radius: 8px; color: var(--gold2); } .order { background: var(--green2); border: 1px solid var(--gold1); } .card { color: var(--gold2); } .card-header { border: 0; color: var(--gold2); } .card-title { color: var(--gold2); } .book-cover:hover { transform: scale(1.1); } .book-title { font-size: 1rem; line-height: 1.3; height: 3.2em; /* Na 2 linie tekstu */ margin: 0.5rem 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-align: center; padding: 0 0.25rem; color: var(--gold1); text-decoration: none; } .book-title a:visited { text-decoration: none; } .book-info { color: var(--text-gold); text-align: center; padding: 1rem; } footer a { color: var(--gold1); text-decoration: none; } footer a:hover { color: var(--gold3); } .text-accent { color: var(--accent-blue) !important; } #book-description { line-height: 1.8; font-size: 1.1rem; } .card-body { background: var(--green1); border: 1px solid var(--gold2); border-radius: 4px; } #searchInput { height: 50px; font-size: 1.2rem; } /* W pliku styles.css */ .navbar-nav { gap: 1.5rem !important; /* Odstępy między linkami */ } footer a { padding: 0.5rem 1rem; /* Większy obszar klikalny */ display: inline-block; /* Lepsze wyrównanie */ } .card-img-top { height: 350px; object-fit: cover; object-position: center top; } #searchInput::placeholder { color: #93B8B1; opacity: 0.7; } .remove-from-cart { transition: all 0.3s ease; } .remove-from-cart:hover { transform: scale(1.05); box-shadow: 0 0 8px rgba(220, 53, 69, 0.6); } .user-links, .anonymous-links { gap: 1rem; align-items: center; } /* Responsywność */ @media (max-width: 768px) { #books-container { grid-template-columns: 1fr; } .navbar-nav { flex-direction: column; gap: 0.5rem !important; } } .btn-outline-gothic:hover { background-color: #0ff; color: #000; box-shadow: 0 0 15px #0ff; } .order-item { background-color: #2a2a2a; border-radius: 5px; padding: 10px; margin-bottom: 10px; } .order-item:last-child { margin-bottom: 0; } .hidden { display: none !important; } /* Pokazywanie elementów */ .visible { display: flex !important; } .auth-links { display: flex; gap: 1rem; } .anonymous-links, .user-links { display: none; } .anonymous-links.visible, .user-links.visible { display: flex !important; gap: 1rem; } @media (max-width: 991px) { .navbar-brand { position: static; transform: none; order: 0 !important; margin: 0.5rem 0; } .navbar-toggler { order: 1; } #searchForm { order: 2; width: 100%; margin-top: 1rem; } .auth-links { order: 3; width: 100%; justify-content: center; margin-top: 1rem; } } /* Responsywność formularza wyszukiwania */ @media (min-width: 992px) { #searchForm { max-width: 400px; } .navbar-brand { position: absolute; } } a { text-decoration: none; } /* Koszyk - nowe style */ .cart-item-details { display: flex; flex-direction: column; } .cart-item .card-body { padding: 1.5rem; } .cart-item-title { font-size: 1.4rem; font-weight: bold; margin-bottom: 0.5rem; } .cart-item-author { color: #aaa; font-style: italic; margin-bottom: 1.5rem; } .cart-item-info { display: flex; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.5rem; background-color: #222; padding: 1.2rem; border-radius: 8px; border: 1px solid #333; } .cart-item-info > div { flex: 1; min-width: 120px; } .cart-item-price, .cart-item-quantity, .cart-item-total { display: block; margin-bottom: 0.5rem; font-size: 0.95rem; color: #ddd; } .cart-remove-btn, .decrease-quantity { padding: 0.7rem 1rem; font-size: 0.95rem; transition: all 0.3s ease; } .cart-remove-btn:hover, .decrease-quantity:hover { transform: translateY(-3px); box-shadow: 0 4px 12px rgba(0,0,0,0.3); } /* Suma całkowita - większy nacisk */ .total-cart-value { font-size: 2rem; font-weight: bold; color: #ffcc00; text-shadow: 0 0 8px rgba(255, 204, 0, 0.4); }