/* Header & Footer */
body {
	font-family: "Segoe UI", sans-serif;
}

.uc-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
	padding-top: 5px;
}

.uc-logo img {
	height: auto;
	max-height: 50px;
	width: auto;
}

.uc-user {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #ec7c1f;
	font-weight: bold;
}

.header-bar {
	background-color: #ec7c1f;
	color: white;
	font-weight: bold;
	padding: 0.75rem 1.25rem;
	border-top-left-radius: 0.2rem;
	border-top-right-radius: 0.2rem;
}

/* === Header === */
@media (max-width: 576px) {
	.uc-logo img {
		max-height: 30px;
	}

	.uc-user span {
		font-size: 12px;
	}

	.uc-user-icon {
		width: 26px;
		height: 26px;
	}
}
#footer-area {
	width: 100%;
	background: linear-gradient(to right, #ff9800, #ec7c1f);
	color: white !important;
}

#footer-area a {
	color: white !important;
}

#footer-area h6 {
	letter-spacing: 0.5px;
}

#footer-area a:hover {
	color: #ffc107 !important;
}

#footer-area img {
	max-width: 250px;
}

.container {
	flex: 1;
}


/*/<!-- =========================/*/
/*/*	 Home Page*/
/*/========================= -->/*/

.carousel-control-prev,
.carousel-control-next {
  width: auto; 
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  border-radius: 50%;
  padding: 5px;
}

.carousel-control-prev {
  left: -30px; 
}

.carousel-control-next {
  right: -30px; 
}

.Home-page .category-box { 
	width: 100%;
	height: 100px;
	background-color: #fff;
	padding: 8px;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	transition: transform 0.2s;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}


.Home-page .category-box img {
	width: 50px;
	height: 50px;
	object-fit: contain;
	margin-bottom: 6px;
}

.Home-page .category-box div {
	font-size: 11px;
	text-align: center;
	line-height: 1.2;
	height: 28px; /* tinggi tetap */
	overflow: hidden;
}

.Home-page .category-box:hover {
	transform: translateY(-3px);
}

.Home-page .business-cards {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding: 1rem;
  -webkit-overflow-scrolling: touch;
  justify-content: flex-start; /* mulai dari kiri */
  flex-wrap: nowrap;
  scrollbar-width: none;
  -ms-overflow-style: none;
}


.Home-page .business-cards .card {
  flex: 0 0 auto; /* card tidak mengecil */
  width: 220px;   /* sesuaikan */
}

@media (max-width: 575px) {
  .Home-page .business-cards .card {
    width: 150px;           
    aspect-ratio: 1 / 1;    
    display: flex;
    align-items: center;   
  }

  .Home-page .business-cards .card img {
    width: 50%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 10px;
  }

  .Home-page .business-cards .card h6 {
    font-size: 0.8rem;
    text-align: center;
  }

  .Home-page .business-cards .card a {
    font-size: 0.5rem;
    padding: 3px 0;
  }
}

/* Desktop ≥1200px: 5 kolom */
@media (min-width: 1200px) {
	.Home-page .business-cards .card {
    width: 250px;           
    aspect-ratio: 1 / 1;    
    display: flex;
    align-items: center;   
  }

  .Home-page .business-cards .card img {
    width: 60%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 10px;
  }
}


/* Gaya default recommendation card */
.Home-page .recommendation-page .recommendation-card {
	border-radius: 10px;
	overflow: hidden;
}

.Home-page .recommendation-page .recommendation-img {
	width: 60%;
	aspect-ratio: 1/1;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	border-radius: 10px 10px 0 0;
}

/* Mobile ≤576px: card lebih kecil */
@media (max-width: 576px) {
	.Home-page .recommendation-page .recommendation-col {
		flex: 0 0 50%; /* 2 kolom per baris */
		max-width: 50%;
	}
	.Home-page .recommendation-page .recommendation-img {
		max-width: 50%
	}
	.Home-page .recommendation-page .card-body h6 {
		font-size: 0.75rem;
	}
	.Home-page .recommendation-page .card-body p {
		font-size: 0.7rem;
	}
	.Home-page .recommendation-page .btn-checkout{
		font-size: 0.5rem;
	}
}

/* Tablet ≥768px: card sedang */
@media (min-width: 768px) {
	.Home-page .recommendation-page .recommendation-col {
		flex: 0 0 25%; /* 3 kolom */
		max-width: 25%;
	}
	.Home-page .recommendation-page .recommendation-img {
		max-width: 100%;
	}
	.Home-page .recommendation-page .card-body h6 {
		font-size: 0.85rem;
	}
	.Home-page .recommendation-page .card-body p {
		font-size: 0.8rem;
	}
}

/* Desktop ≥1200px: 5 kolom */
@media (min-width: 1200px) {
	.Home-page .recommendation-page .recommendation-col {
		flex: 0 0 20%; /* 5 kolom */
		max-width: 20%;
	}
	.Home-page .recommendation-page .recommendation-img {
		max-width: 100%;
	}
	.Home-page .recommendation-page .card-body h6 {
		font-size: 0.9rem;
	}
	.Home-page .recommendation-page .card-body p {
		font-size: 0.85rem;
	}
}
.Home-page .recommendation-page .card {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10); /* lebih tebal */
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.Home-page .recommendation-page .card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25); /* lebih glow pas hover */
}


/*/<!-- =========================/
    Alumni Detail Page Only
/========================= -->/*/
.view-detail-alumni .recommendation-page .card {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10); /* lebih tebal */
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.view-detail-alumni .recommendation-page .card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25); /* lebih glow pas hover */
}

.view-detail-alumni .table {
	font-size: 14px;
}

.view-detail-alumni .table td,
.view-detail-alumni .table th {
	vertical-align: middle;
	padding: 10px 12px;
}

.view-detail-alumni .table-bordered {
	border: 1px solid #ddd;
	border-radius: 8px;
	overflow: hidden;
}

.view-detail-alumni .table-bordered tbody tr:nth-child(odd) {
	background-color: #fff8f0; /* warna striping */
}

.view-detail-alumni .table img {
	max-height: 100px;
	border-radius: 8px;
	border: 1px solid #ddd;
	object-fit: cover;
}


/* Company Image (kiri) */
.view-detail-alumni .company-img {
	width: 60%;
	aspect-ratio: 1/1;
	object-fit: cover;
	border-radius: 10px;
	display: block;
	margin: 0 auto;
}


.view-detail-alumni .breadcrumb-container {
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
	margin-bottom: 15px;
}

/* =========================
   Alumni Products Styling
========================= */

.alumni-page .alumni-card {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	background: #fff;
}

.alumni-page .alumni-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.alumni-page .alumni-img {
	width: 60%;
	aspect-ratio: 1/1;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	border-radius: 10px 10px 0 0;
}

/* Mobile ≤576px */
@media (max-width: 576px) {
	.alumni-page .alumni-col {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.alumni-page .alumni-img {
		max-width: 50%;
	}

	.alumni-page .card-title {
		font-size: 0.75rem;
	}

	.alumni-page .price {
		font-size: 0.7rem;
	}

	.alumni-page .btn {
		font-size: 0.6rem;
	}
}

/* Tablet ≥768px */
@media (min-width: 768px) {
	.alumni-page .alumni-col {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.alumni-page .alumni-img {
		max-width: 100%;
	}

	.alumni-page .card-title {
		font-size: 0.85rem;
	}

	.alumni-page .price {
		font-size: 0.8rem;
	}
}

/* Desktop ≥1200px */
@media (min-width: 1200px) {
	.alumni-page .alumni-col {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.alumni-page .alumni-img {
		max-width: 100%;
	}

	.alumni-page .card-title {
		font-size: 0.9rem;
	}

	.alumni-page .price {
		font-size: 0.85rem;
	}
}


/*/<!-- =========================/*/
/*/*	 Request Produk Page*/
/*/========================= -->/*/
/* ============================
   Request Produk Page Scoped CSS
============================ */
.request-produk-page .custom-container {
	max-width: 100%;
	margin: 0 auto;
	padding-left: 12px;
	padding-right: 12px;
}

.request-produk-page .card.shadow {
	width: 100%;
	margin: 0 auto;
	border-radius: 0.5rem;
	box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1);
}

@media (min-width: 768px) {
	.request-produk-page .card.shadow {
		max-width: 100%;
	}
}

.request-produk-page .action-buttons {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
}

.request-produk-page .table-responsive thead th {
	position: sticky;
	top: 0;
	z-index: 10;
	padding: 0.75rem;
	font-size: 1rem;
	background-color: #ec7c1f;
	color: white;
}

.request-produk-page .table-responsive thead th,
.request-produk-page .table-responsive tbody td {
	padding: 0.75rem;
	font-size: 1rem;
}

/* =========================
   MOBILE MODE
========================= */
@media (max-width: 767.98px) {
	.request-produk-page .custom-container {
		padding-left: 0;
		padding-right: 0;
	}

	.request-produk-page .card.shadow {
		width: 100%;
		margin: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.request-produk-page .equal-width {
		flex: 1 1 100%;
	}

	.request-produk-page .table-responsive {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.request-produk-page .header-bar {
		font-size: 1rem;
		padding: 0.5rem 0.8rem;
	}

	.request-produk-page .table-responsive thead th {
		padding: 0.4rem;
		font-size: 0.85rem;
		white-space: nowrap;
	}

	.request-produk-page .table-responsive thead th,
	.request-produk-page .table-responsive tbody td {
		padding: 0.4rem;
		font-size: 0.85rem;
		white-space: nowrap;
	}
}

/*/<!-- =========================/
	 Edit Product Page
/========================= -->/*/
/* === Edit Product Page === */
.edit-product-page .card-header {
	background-color: #ff6c00;
	color: #fff;
	font-weight: 600;
	font-size: 1.1rem;
}

/* Grid gambar lama */
.edit-product-page .image-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	gap: 10px;
}

.edit-product-page .image-wrapper {
	position: relative;
}

.edit-product-page .product-thumb {
	width: 100%;
	height: 100px;
	object-fit: cover;
	border-radius: 6px;
}

.edit-product-page .delete-btn {
	position: absolute;
	top: 2px;
	right: 2px;
	padding: 2px 6px;
	font-size: 0.8rem;
}

/* Grid preview gambar baru */
.edit-product-page .preview-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	gap: 10px;
	margin-top: 10px;
}

.edit-product-page .preview-list img {
	width: 100%;
	height: 100px;
	object-fit: cover;
	border-radius: 6px;
}

/* Tombol */
.edit-product-page .action-buttons .btn {
	min-width: 120px;
}

/* RESPONSIVE */
@media (max-width: 767.98px) {
	.edit-product-page .card-header {
		font-size: 1rem;
		text-align: center;
		padding: 0.6rem;
	}

	.edit-product-page .action-buttons {
		flex-direction: column;
		align-items: stretch;
	}

	.edit-product-page .action-buttons .btn {
		width: 100%;
	}
}

.edit-product-page .image-wrapper {
	position: relative; /* supaya tombol bisa diposisikan absolut di dalam wrapper */
	display: inline-block;
}

.edit-product-page .image-wrapper .btn-delete {
	position: absolute;
	top: 5px;       /* jarak dari atas */
	right: 5px;     /* jarak dari kanan */
	border: none;
	background-color: rgba(255, 0, 0, 0.8);
	color: #fff;
	font-weight: bold;
	font-size: 14px;
	width: 24px;
	height: 24px;
	line-height: 20px;
	text-align: center;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.edit-product-page .image-wrapper .btn-delete:hover {
	background-color: rgba(255, 0, 0, 1);
}


/*/<!-- =========================/
	 Product detail Page
/========================= -->/*/
/* 🌐 Wrapper utama */
.product-detail-page .card {
  border-radius: 1rem;
}

.product-detail-page .form-control,
.product-detail-page textarea {
  font-size: 0.9rem;
}

/* Wrapper pakai flex */
.product-detail-img-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-start; /* biar rata kiri */
}

/* Default (Desktop besar) → max 5 */
.product-detail-img {
  width: 140px;
  height: 140px;
  object-fit: cover;
  border-radius: 8px;
  flex: 0 0 auto; /* jangan melebar */
}

/* Tablet (3–4 sejajar) */
@media (max-width: 992px) {
  .product-detail-img {
	width: 120px;
	height: 120px;
  }
}

/* Mobile (2–3 sejajar) */
@media (max-width: 768px) {
  .product-detail-img {
	width: 100px;
	height: 100px;
  }
}


.text-orange {
	color: #ff6c00
}

/* Biar konsisten di mobile */
@media (max-width: 768px) {
  .product-detail-page .form-label {
	font-size: 0.85rem;
  }
}

/*/<!-- =========================/
 Product detail Page
/========================= -->/*/

/*Masih belum saya tambahkan nnty sj blm ada pikiran apa*/



/*/<!-- =========================/
	 Wishlist
/========================= -->/*/
.wishlist-page .breadcrumb{
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
}

.wishlist-page .wishlist-card {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	background: #fff;
}



.wishlist-page .wishlist-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.10);
}

.wishlist-page .wishlist-img {
	width: 60%;
	aspect-ratio: 1/1;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	border-radius: 5px 5px 0 0;
}

/* Mobile ≤576px */
@media (max-width: 576px) {
	.wishlist-page .wishlist-col {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.wishlist-page .wishlist-img {
		max-width: 50%;
	}

	.wishlist-page .card-title {
		font-size: 0.75rem;
	}

	.wishlist-page .price {
		font-size: 0.7rem;
	}

	.wishlist-page .btn {
		font-size: 0.6rem;
	}
}

/* Tablet ≥768px */
@media (min-width: 768px) {
	.wishlist-page .wishlist-col {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.wishlist-page .wishlist-img {
		max-width: 100%;
	}

	.wishlist-page .card-title {
		font-size: 0.85rem;
	}

	.wishlist-page .price {
		font-size: 0.8rem;
	}
}

/* Desktop ≥1200px */
@media (min-width: 1200px) {
	.wishlist-page .wishlist-col {
		flex: 0 0 20%;
		max-width: 15%;
	}

	.wishlist-page .wishlist-img {
		max-width: 100%;
	}

	.wishlist-page .card-title {
	white-space: nowrap;       /* Jangan turun ke baris baru */
	overflow: hidden;          /* Sembunyikan teks kelebihan */
	text-overflow: ellipsis;   /* Tambahkan “…” di ujung */
	display: block;            /* Wajib biar properti di atas berfungsi */
	max-width: 100%;           /* Sesuaikan dengan lebar card */
}


	.wishlist-page .price {
		font-size: 0.85rem;
	}
}



/*/<!-- =========================/
	 Category page
/========================= -->/*/
/* Gambar card default (desktop) */
.category_page .product-card img {
	width: 100%;
	aspect-ratio: 1/1;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	border-radius: 10px 10px 0 0;
}

/* Tablet ≥768px */
@media (min-width: 768px) {
	.category_page .product-card img {
		width: 150px;
		height: 150px;
	}
}

/* Desktop besar ≥1200px */
@media (min-width: 1200px) {
	.category_page .product-card img {
		width: 180px;
		height: 180px;
	}
}

/* Mobile ≤576px */
@media (max-width: 576px) {
	.category_page .product-card img {
		width: 80%;       /* lebih kecil di layar kecil */
		height: auto;     /* tinggi menyesuaikan lebar */
	}
	.category_page .product-card .card-body h6 {
		font-size: 0.8rem;
	}
	.category_page .product-card .card-body p {
		font-size: 0.75rem;
	}
}

.category_page .breadcrumb-container {
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
	margin-bottom: 15px;
}




/*/<!-- =========================/
	 Search
/========================= -->/*/
.search-page .breadcrumb {
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
}

/* =========================
   Search Page Card Styling
========================= */

.search-page .wishlist-card {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	background: #fff;
}

.search-page .wishlist-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.search-page .wishlist-img {
	width: 60%;
	aspect-ratio: 1/1;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	border-radius: 10px 10px 0 0;
}

/* Mobile ≤576px */
@media (max-width: 576px) {
	.search-page .wishlist-col {
		flex: 0 0 50%;
		max-width: 50%;
	}

	.search-page .wishlist-img {
		max-width: 50%;
	}

	.search-page .card-title {
		font-size: 0.75rem;
	}

	.search-page .price {
		font-size: 0.7rem;
	}

	.search-page .btn {
		font-size: 0.6rem;
	}
}

/* Tablet ≥768px */
@media (min-width: 768px) {
	.search-page .wishlist-col {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.search-page .wishlist-img {
		max-width: 100%;
	}

	.search-page .card-title {
		font-size: 0.85rem;
	}

	.search-page .price {
		font-size: 0.8rem;
	}
}

/* Desktop ≥1200px */
@media (min-width: 1200px) {
	.search-page .wishlist-col {
		flex: 0 0 20%;
		max-width: 15%;
	}

	.search-page .wishlist-img {
		max-width: 100%;
	}

	.search-page .card-title {
		font-size: 0.9rem;
	}

	.search-page .price {
		font-size: 0.85rem;
	}
}

/*/<!-- =========================/
	 Cek Out
/========================= -->/*/
.cek-out .breadcrumb-container {
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
	margin-bottom: 15px;
}


@media (max-width: 570px) {
	.cek-out .col-md-6.d-flex {
		display: flex;
		flex-direction: column;
	}
	.cek-out .product-description {
		order: 1;
		margin-bottom: 0.5rem;
	}
	.cek-out .product-buttons {
		order: 2;
	}
	#searchDropdown {
      min-width: 200px; 
	  max-width: 100%;
    }
}


.cek-out .wishlist-btn {
	background-color: #f8f9fa; /* default abu muda, seperti btn-light */
	color: #212529;
	transition: background-color 0.2s, color 0.2s;
}

.cek-out .wishlist-btn i {
	color: #dc3545; /* default heart merah */
}

.cek-out .wishlist-btn.active {
	background-color: #dc3545; /* tombol merah saat aktif */
	color: #fff;
}

.cek-out .wishlist-btn.active i {
	color: #fff; /* ikon jadi putih */
}

.cek-out .wishlist-btn:hover {
	background-color: #e2e6ea;
	color: #212529;
}

.cek-out .wishlist-btn.active:hover {
	background-color: #c82333; /* merah gelap saat hover */
	color: #fff;
}


/* ============================
   Verification CAD Scoped CSS
============================ */
.Verification-CAD .custom-container {
  max-width: 100%;
  margin: 0 auto;
  padding-left: 12px;
  padding-right: 12px;
}

.Verification-CAD .card.shadow {
  width: 100%;
  margin: 0 auto;
  border-radius: 0.5rem;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1);
}

@media (min-width: 768px) {
  .Verification-CAD .card.shadow {
	max-width: 100%;
  }
}

/* Header bar */
.Verification-CAD .header-bar {
  background-color: #ec7c1f;
  color: white;
  font-weight: 600;
  padding: 0.75rem 1rem;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  font-size: 1.1rem; /* ukuran pas untuk desktop */
}

/* Filter row */
.Verification-CAD .filter-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
}

.Verification-CAD .filter-row .form-select,
.Verification-CAD .filter-row .form-control {
  min-width: 140px;
  font-size: 0.9rem; /* lebih kecil biar balance */
  padding: 4px 6px;
}

/* Table */
.Verification-CAD .table-responsive thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  padding: 0.6rem;
  font-size: 0.95rem;
  background-color: #ec7c1f;
  color: white;
  white-space: nowrap;
}

.Verification-CAD .table-responsive thead th,
.Verification-CAD .table-responsive tbody td {
  padding: 0.6rem;
  font-size: 0.9rem;
}

/* Action buttons */
.Verification-CAD .action-buttons {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
}

.Verification-CAD .action-buttons .btn {
  font-size: 0.8rem;
  padding: 4px 8px; /* kecilin tombol */
}

/* Pagination */
.Verification-CAD .pagination .page-link {
  font-size: 0.8	rem;
  padding: 4px 8px;
}

/* =========================
   MOBILE MODE
========================= */
@media (max-width: 767.98px) {
  .Verification-CAD .custom-container {
	padding-left: 0;
	padding-right: 0;
  }

  .Verification-CAD .card.shadow {
	width: 100%;
	margin: 0;
	border-radius: 0;
	box-shadow: none;
  }

  .Verification-CAD .equal-width {
	flex: 1 1 100%;
  }

  .Verification-CAD .table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
  }

  .Verification-CAD .header-bar {
	font-size: 0.95rem;
	padding: 0.5rem 0.8rem;
  }

  .Verification-CAD .table-responsive thead th {
	padding: 0.4rem;
	font-size: 0.8rem;
  }

  .Verification-CAD .table-responsive thead th,
  .Verification-CAD .table-responsive tbody td {
	padding: 0.4rem;
	font-size: 0.8rem;
	white-space: nowrap;
  }

  .Verification-CAD .action-buttons .btn {
	font-size: 0.7rem;
	padding: 2px 6px; /* lebih kecil di HP */
  }
}

/* Badge style */
.Verification-CAD .badge-warning-custom {
  display: inline-block;
  background-color: #fff3cd;
  color: #856404;
  border-radius: 0.25rem;
  font-size: 0.7rem;
  padding: 3px 8px;
}

/* Style untuk filter select di Verification-CAD */
.Verification-CAD #statusFilter {
  font-size: 0.9rem;    /* kecilkan font */
  padding: 4px 8px;      /* rapikan padding */
  height: auto;          /* biar gak terlalu tinggi */
  min-width: 160px;      /* kasih lebar minimal */
}

/* Style untuk filter select di Verification-CAD */
.Verification-CAD #locationFilter {
  font-size: 0.9rem;    /* kecilkan font */
  padding: 4px 8px;      /* rapikan padding */
  height: auto;          /* biar gak terlalu tinggi */
  min-width: 160px;      /* kasih lebar minimal */
}

/* Responsif: HP lebih kecil lagi */
@media (max-width: 576px) {
  .Verification-CAD #statusFilter {
	font-size: 0.9rem;
	padding: 3px 6px;
	min-width: 120px;    /* lebih ramping di HP */
  }
}

/* Style khusus untuk tombol Add List Banner */
.Verification-CAD .btn-add-banner {
  font-size: 0.8rem;    /* perkecil ukuran font */
  padding: 4px 10px;    /* perkecil padding */
  border-radius: 4px;   /* sudut tetap rapi */
}

/* Mobile: lebih kecil lagi */
@media (max-width: 576px) {
  .Verification-CAD .btn-add-banner {
	font-size: 0.75rem;
	padding: 3px 8px;
  }
}

/* Style untuk pagination select (Show entries) */
.Verification-CAD #perPageSelect {
  font-size: 0.8rem;       /* perkecil font */
}

.Verification-CAD label[for="perPageSelect"],
.Verification-CAD span {
  font-size: 0.9rem;      /* teks lebih kecil */
  margin: 0 2px;           /* rapatkan jarak */
}

/* =========================
   Add banner
========================= */
.Add-banner .breadcrumb-container {
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
	margin-bottom: 15px;
}

/* =========================
   View Detaik CAD
========================= */
.view-detail-CAD .breadcrumb-container {
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
	margin-bottom: 15px;
}

/* =========================
   Request Product detail
========================= */
.gray-bg{
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
}

/* =========================
   Cek Out
========================= */
/* Fix ukuran gambar utama supaya stabil */
.cek-out .product-image {
	width: 100%;
	max-width: 400px;
	height: 400px;
	object-fit: contain;
	border-radius: 8px;
	border: 1px solid #ddd;
}

/* =========================
   list banner
========================= */
/* Table */
.listbanner .table-responsive thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  padding: 0.6rem;
  font-size: 0.90rem;
  background-color: #ec7c1f;
  color: white;
  white-space: nowrap;
}

  @media (max-width: 576px) {
    .listbanner .d-flex.flex-column.flex-md-row {
      flex-direction: column !important;
      align-items: stretch !important;
	  font-size: 0.75rem;
    }

    .listbanner .d-flex.flex-wrap.gap-2 {
      justify-content: flex-start;
      flex-wrap: wrap;
      gap: 0.5rem;
    }

    .listbanner .form-select.w-auto {
      width: auto !important;
    }

    /* Hapus efek full width di mobile */
    .listbanner .btn,
    .listbanner .form-select {
      width: auto !important;
      display: inline-block;
	  font-size: 0.75rem;
    }
	
	.listbanner .table{
		font-size: 0.75rem;
	}
  }

  .listbanner .badge-warning-custom {
  display: inline-block;
  background-color: #fff3cd;
  color: #856404;
  border-radius: 0.25rem;
  font-size: 0.7rem;
  padding: 3px 8px;
}

/* =========================
   List Business & View Business list
========================= */

/* Badge style */
.list_Business .badge-warning-custom {
  display: inline-block;
  background-color: #fff3cd;
  color: #856404;
  border-radius: 0.25rem;
  font-size: 0.7rem;
  padding: 3px 8px;
}

.list_Business .table-responsive thead th {
  position: sticky;
  top: 0;
  z-index: 10;
  padding: 0.6rem;
  font-size: 0.95rem;
  background-color: #ec7c1f;
  color: white;
  white-space: nowrap;
}

.View_Business_List .breadcrumb-container {
	background: #f8f9fa;
	padding: 8px 15px;
	border-radius: 5px;
	font-size: 14px;
	margin-bottom: 15px;
}

.View_Business_List label.form-label {
    font-weight: bold;
}



/* =========================
   End
========================= */

/* Detail Business */



@media (max-width: 768px) {
	.mobile-order-first {
		order: 1 !important;
	}

	.mobile-order-last {
		order: 2 !important;
	}
}

.small-filter-group select,
.small-filter-group input {
	font-size: 0.75rem;
	padding: 0.25rem 0.5rem;
	height: auto;
}

#statusFilter {
	width: 140px; /* ubah sesuai kebutuhan */
}

#searchInput {
	width: 200px; /* ubah sesuai kebutuhan */
}


.product-card {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	border-radius: 12px;
}

.product-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.product-card:hover .btn-love {
	display: flex !important; /* Show only on hover */
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	font-size: 18px;
	border: none;
}

.btn-orange {
	background-color: #ff6600;
	color: #fff;
}

.btn-outline-danger {
	border-radius: 8px;
	padding: 6px 12px;
	font-size: 18px;
	line-height: 1;
}

/* Add Product */

.img-preview-wrapper {
	position: relative;
	display: inline-block;
}
.remove-img {
	position: absolute;
	top: 5px;
	right: 5px;
	background: rgba(0, 0, 0, 0.6);
	color: white;
	border: none;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 18px;
	font-size: 14px;
	cursor: pointer;
}

/* Profile Business */

.profile-photo {
  width: 100%;
  max-width: 250px;     
  aspect-ratio: 3 / 4;  
  object-fit: cover;
  border-radius: 8px; 
  object-position: top;
}


.form-label {
	font-weight: 500;
}



/* Thumbnail */
.product-thumbnails img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	cursor: pointer;
	border-radius: 4px;
	border: 2px solid transparent;
	transition: border-color 0.3s;
}

.product-thumbnails img.active {
	border-color: #ff6c00;
}

.btn-wishlist {
	border: 1px solid #dc3545;
	color: #dc3545;
}

.btn-wishlist:hover {
	background-color: #dc3545;
	color: white;
}

.product-buttons .btn {
	width: 100%;
}
.product-card {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.product-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}
.product-card:hover .btn-love {
	opacity: 1;
}
.btn-love.active {
	background-color: red !important;
	color: white !important;
}

.btn-back {
	background-color: #f8f9fa;
	color: #ff6600;
	border: 1px solid #ff6600;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 6px 15px;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.btn-back:hover {
	background-color: #ff6600;
	color: #fff;
}

.btn-submit-blue {
	background-color: #007bff; /* biru */
	color: #fff;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 6px 15px;
	border: none;
	border-radius: 6px;
	transition: background-color 0.3s ease;
}

.btn-submit-blue:hover {
	background-color: #0069d9;
}

/* Category_Product */
.sidebar {
	background-color: #f8f9fa;
	padding: 15px;
	border-radius: 8px;
}

.product-card img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	border-radius: 8px;
}

.wishlist-btn {
	background: none;
	border: none;
	color: #dc3545;
	font-size: 18px;
	cursor: pointer;
}
.btn-love.active {
	background-color: red !important;
	color: white !important;
}

/* Cek Out */
.btn-wishlist.active {
	background-color: red !important;
	color: white !important;
}

/* Edit Product Request */
.card-header {
	background-color: #ff6c00;
	color: #fff;
	font-weight: bold;
}

#image-preview img {
	width: 100px;
	height: 100px;
	object-fit: cover;
	border-radius: 5px;
}

/* Other Information */
.col-md-4 {
	position: relative;
	/* penting untuk acuan posisi absolute input */
}

.other-input {
	display: none;
	/* default hidden */
	position: absolute;
	top: 100%;
	/* langsung di bawah dropdown */
	left: 0;
	width: 100%;
	/* selebar container (.col-md-4) */
	margin-top: 0.25rem;
	box-sizing: border-box;
	background: white;
	border: 1px solid #ced4da;
	padding: 0.375rem 0.75rem;
	border-radius: 0.25rem;
	z-index: 10;
}

/* ================================
   Alumnee Card Stylesheet - alumni_business_information
   ================================ */

/* .alumnee-card-container .alumnee-card,
.alumnee-card-container .alumnee-card-front {
  width: 90%;              
  max-width: 320px;        
  aspect-ratio: 310/437;
  margin: 0 auto;
  border: 1px solid #ccc;
  border-radius: 8px;
  overflow: hidden;
} */

/* .alumnee-card-container .alumnee-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
} */

/* .alumnee-card-container .card-bg {
  width: 100%;
  height: auto;
  border: 1px solid #ccc;
  display: block;
} */
/* 
@media (min-width: 576px) and (max-width: 991px) {
  .alumnee-card-container .alumnee-card,
  .alumnee-card-container .alumnee-card-front {
    width: 60%;           
    max-width: 400px;
  }
}

@media (min-width: 992px) {
  .alumnee-card-container .alumnee-card,
  .alumnee-card-container .alumnee-card-front {
    width: 350px;        
  }
} */