/**** pannello my subscription***/

.osm-my-subscriptions {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.subscription-card {
	border: 1px solid #ddd;
	padding: 1.5rem;
	border-radius: 8px;
	background-color: #ffffff;
}

.subscription-row {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}

.subscription-row .label {
	width: 180px;
	font-weight: bold;
	color: #333;
}

.subscription-row .value {
	flex: 1;
}

.osm-btn-cancel-subscription,
.osm-btn-update-card {
	display: inline-block;
	margin-top: 0.5rem;
	padding: 0.4rem 0.8rem;
	background-color: #c62828;
	color: #fff;
	border-radius: 4px;
	text-decoration: none;
}

.osm-btn-update-card {
	background-color: #007bff;
}

.osm-btn-cancel-subscription:hover,
.osm-btn-update-card:hover {
	opacity: 0.85;
}



/******* pannello history ***********/

.osm-subscription-history {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.subscription-card {
	border: 1px solid #ddd;
	padding: 1.5rem;
	border-radius: 8px;
	background-color: #fafafa;
}

.subscription-row {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}

.subscription-row .label {
	width: 180px;
	font-weight: bold;
	color: #444;
}

.subscription-row .value {
	flex: 1;
}

.make-payment-button {
	display: inline-block;
	margin-top: 0.5rem;
	padding: 0.4rem 0.8rem;
	background-color: #007bff;
	color: #fff;
	text-decoration: none;
	border-radius: 4px;
}

.make-payment-button:hover {
	background-color: #0056b3;
}