body {
	font-family: 'Roboto', sans-serif;
	background-color: #f5f5f5;
	color: #333;
}

.top-bar {
	background-color: #333;
	padding: 0.5rem 0;
	font-size: 0.85rem;
}

.top-bar a {
	color: #ccc;
	text-decoration: none;
	margin-right: 15px;
}

.top-bar a:hover {
	color: #fff;
}

.top-bar .social-icons a {
	margin-left: 10px;
	margin-right: 0;
}

.header-main {
	background-color: #222;
	padding: 1rem 0;
}

.navbar-brand img {
	max-height: 50px;
}

.main-nav .nav-link {
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	padding: 0.5rem 1rem;
	margin: 0 0.25rem;
}

.main-nav .nav-link.active,
.main-nav .nav-link:hover {
	background-color: #ec008c;
	color: #fff;
}

.hero-section img {
	width: 100%;
	height: auto;
	max-height: 450px;
	object-fit: cover;
}

.section-title {
	text-align: center;
	margin-bottom: 2.5rem;
	font-weight: 900;
	color: #181818;
	text-transform: uppercase;
}

.product-card {
	background-color: #fff;
	border: 1px solid #eee;
	margin-bottom: 1.5rem;
	text-align: center;
	padding: 1.5rem;
	position: relative;
}

.product-card img {
	max-width: 100%;
	height: 150px;
	object-fit: contain;
	margin-bottom: 1rem;
}

.product-card .sale-badge {
	position: absolute;
	top: 15px;
	right: 15px;
	background-color: #ec008c;
	color: #fff;
	padding: 0.25rem 0.75rem;
	font-size: 0.8rem;
	font-weight: 700;
}

.product-card h3 {
	font-size: 1rem;
	font-weight: 700;
	margin-bottom: 0.5rem;
	color: #191919;
	min-height: 40px;
}

.product-card .price {
	font-size: 1.25rem;
	font-weight: 700;
	color: #ec008c;
	margin-bottom: 0.5rem;
}

.product-card .price .original-price {
	text-decoration: line-through;
	color: #999;
	font-size: 0.9rem;
	margin-right: 0.5rem;
}

.product-card .description {
	font-size: 0.85rem;
	color: #666;
	min-height: 50px;
	margin-bottom: 1rem;
}

.product-card .btn-add-to-cart {
	background-color: #ec008c;
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	border: none;
	padding: 0.6rem 1.2rem;
}

.product-card .btn-add-to-cart:hover {
	background-color: #d6007a;
	color: #fff;
}

.blog-section {
	background-color: #181818;
	color: #fff;
	padding: 3rem 0;
}

.blog-section .section-title {
	color: #fff;
}

.blog-section p.lead {
	color: #ccc;
	text-align: center;
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 2.5rem;
}

.blog-post-card {
	text-align: center;
	margin-bottom: 1.5rem;
}

.blog-post-card img {
	width: 150px;
	height: 150px;
	border-radius: 50%;
	object-fit: cover;
	margin-bottom: 1rem;
	border: 3px solid #ec008c;
}

.blog-post-card h5 {
	font-size: 1rem;
	font-weight: 700;
	color: #fff;
}

.footer {
	padding: 2rem 0;
	background-color: #e9e9e9;
	text-align: center;
}

.footer-nav .nav-link {
	color: #181818;
	font-weight: 700;
	text-transform: uppercase;
	padding: 0.25rem 0.75rem;
}

.footer-nav .nav-link:hover {
	color: #ec008c;
}

.footer-copyright {
	margin-top: 1rem;
	font-size: 0.85rem;
	color: #555;
}

.footer-copyright a {
	color: #ec008c;
	text-decoration: none;
}

.footer-copyright a:hover {
	text-decoration: underline;
}

.hero-section .carousel-item img {
    max-height: 450px; /* Orijinal resim yüksekliğine yakın */
    object-fit: cover; /* Resmin orantısını koruyarak alanı kaplamasını sağlar */
    width: 100%;
}

/* İsteğe bağlı: Carousel indicator ve control renklerini ana temayla uyumlu hale getirmek için */
.hero-section .carousel-indicators [data-bs-target] {
    background-color: #ec008c; /* Pembe */
}

.hero-section .carousel-control-prev-icon,
.hero-section .carousel-control-next-icon {
    background-color: rgba(236, 0, 140, 0.7); /* Yarı şeffaf pembe */
    border-radius: 50%; /* Daha yuvarlak bir görünüm için */
    padding: 15px;
}
.hero-section .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}
.hero-section .carousel-control-next-icon {
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.hero-section .carousel-item img {
    max-height: 450px; /* Veya istediğiniz yükseklik */
    object-fit: cover;
    width: 100%;
}

.hero-section .carousel-caption {
    background-color: rgba(0, 0, 0, 0.5); /* Yazıların okunabilirliği için yarı şeffaf arka plan */
    border-radius: .25rem;
    padding: 1rem;
    bottom: 1.25rem; /* Caption'ın alttan mesafesi */
}

.hero-section .carousel-caption h5 {
    font-size: 1.5rem; /* Başlık boyutu */
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.5rem;
}

.hero-section .carousel-caption p {
    font-size: 1rem; /* Açıklama metni boyutu */
    color: #f0f0f0;
}


/* Carousel indicator ve control renkleri (önceki kodda vardı, güncelleyebilirsiniz) */
.hero-section .carousel-indicators [data-bs-target] {
    background-color: #ec008c;
}

.hero-section .carousel-control-prev-icon,
.hero-section .carousel-control-next-icon {
    background-color: rgba(236, 0, 140, 0.7);
    border-radius: 50%;
    padding: 15px; /* İkonun etrafındaki padding'i artırarak butonu büyütebilirsiniz */
    width: 2.5rem; /* İkon genişliği */
    height: 2.5rem; /* İkon yüksekliği */
}
.hero-section .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}
.hero-section .carousel-control-next-icon {
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.main-nav .nav-item.dropdown .dropdown-menu {
    background-color: #222;
    border: 1px solid #333;
    margin-top: 0;
    border-radius: 0 0 0.25rem 0.25rem;
}

.main-nav .dropdown-item {
    color: #ccc;
    padding: 0.5rem 1rem;
}

.main-nav .dropdown-item:hover,
.main-nav .dropdown-item:focus {
    background-color: #ec008c;
    color: #fff;
}

.main-nav .dropdown-divider {
    border-top-color: #444;
}

.product-full-description {
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: pre-wrap;
}