.ccs-products-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 24px;
	margin: 24px 0;
}
.ccs-product-card {
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	padding: 16px;
	text-align: center;
}
.ccs-product-card h3 { margin: 8px 0; }
.ccs-product-price { font-size: 1.2em; font-weight: 600; margin: 12px 0; }
.ccs-add-to-cart-btn,
.ccs-checkout-btn,
#ccs-update-card-btn,
.ccs-cancel-btn,
.ccs-resume-btn {
	background: #1a1a1a;
	color: #fff;
	border: none;
	padding: 10px 20px;
	border-radius: 6px;
	cursor: pointer;
	font-size: 0.95em;
}
.ccs-add-to-cart-btn:hover,
.ccs-checkout-btn:hover { opacity: 0.85; }
.ccs-add-to-cart-btn:disabled { opacity: 0.6; cursor: default; }

.ccs-cart-table { width: 100%; border-collapse: collapse; margin: 20px 0; }
.ccs-cart-table th, .ccs-cart-table td {
	padding: 10px;
	border-bottom: 1px solid #eee;
	text-align: left;
}
.ccs-qty-input { width: 60px; }
.ccs-remove-item {
	background: none;
	border: none;
	font-size: 1.2em;
	cursor: pointer;
	color: #999;
}
.ccs-cart-total { font-size: 1.3em; font-weight: 700; margin: 16px 0; }
.ccs-cart-warning { color: #b00020; font-weight: 600; }

.ccs-subscription-card {
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 16px;
}
.ccs-sub-status { font-weight: 700; text-transform: capitalize; margin-bottom: 8px; }
.ccs-status-active { color: #067d0f; }
.ccs-status-past_due { color: #b00020; }
.ccs-status-canceled { color: #777; }
.ccs-cancel-notice { font-weight: 400; color: #b00020; }
.ccs-sub-items { margin: 8px 0; padding-left: 20px; }
.ccs-sub-renews { font-size: 0.9em; color: #555; margin-bottom: 10px; }

#ccs-card-element {
	border: 1px solid #ccc;
	border-radius: 6px;
	padding: 12px;
	margin: 12px 0;
	max-width: 400px;
	background: #fff;
}
#ccs-card-message, #ccs-checkout-message { margin-top: 10px; color: #b00020; }

/* Dashboard tabs */
.ccs-dashboard { margin: 20px 0; }
.ccs-tabs {
	display: flex;
	gap: 4px;
	border-bottom: 2px solid #eee;
	margin-bottom: 24px;
	flex-wrap: wrap;
}
.ccs-tab {
	background: none;
	border: none;
	padding: 12px 18px;
	font-size: 0.95em;
	cursor: pointer;
	color: #666;
	border-bottom: 2px solid transparent;
	margin-bottom: -2px;
}
.ccs-tab.active {
	color: #1a1a1a;
	font-weight: 700;
	border-bottom-color: #1a1a1a;
}
.ccs-summary-cards { display: flex; gap: 16px; flex-wrap: wrap; }
.ccs-summary-card {
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	padding: 20px 28px;
	text-align: center;
	min-width: 120px;
}
.ccs-summary-number { display: block; font-size: 1.8em; font-weight: 700; }
.ccs-summary-label { display: block; color: #666; font-size: 0.9em; margin-top: 4px; }

.ccs-order-card, .ccs-invoice-row {
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	padding: 14px 16px;
	margin-bottom: 12px;
}
.ccs-order-date { font-size: 0.85em; color: #666; margin-bottom: 6px; }
.ccs-order-items { margin: 6px 0; padding-left: 18px; }
.ccs-order-total { font-weight: 700; }
.ccs-invoice-row { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.ccs-invoice-row a { text-decoration: underline; }

.ccs-buy-btn {
	display: inline-block;
	background: #1a1a1a;
	color: #fff;
	padding: 10px 20px;
	border-radius: 6px;
	text-decoration: none;
	font-size: 0.95em;
}
.ccs-buy-btn:hover { opacity: 0.85; color: #fff; }