/**
 * My Account subscription detail — Element Plus–inspired (full page only).
 * Overlay modal uses theme styles; see my-subscriptions.css (.cbran-subscription-overlay__content).
 */

.cbransubs-view-subscription .cbran-subs-myaccount-detail {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1.5rem;
	background: #fff;
	border: 1px solid var(--cbran-el-border-light, #e4e7ed);
	border-radius: var(--cbran-el-radius-lg, 8px);
	overflow: hidden;
	font-size: 0.875rem;
	color: var(--cbran-el-text-regular, #606266);
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail tr {
	border-bottom: 1px solid var(--cbran-el-border-light, #e4e7ed);
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail tr:last-child {
	border-bottom: none;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail td {
	padding: 0.75rem 1rem;
	vertical-align: middle;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail td:nth-child(2) {
	width: 1rem;
	padding-left: 0;
	padding-right: 0;
	color: var(--cbran-el-text-secondary, #909399);
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail .button,
.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button,
.cbransubs-view-subscription .cbran-subs-myaccount-detail a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 32px;
	margin: 0.125rem 0.375rem 0.125rem 0;
	padding: 0.5rem 0.9375rem;
	border: 1px solid var(--cbran-el-border, #dcdfe6);
	border-radius: var(--cbran-el-radius, 4px);
	background: #fff;
	color: var(--cbran-el-text-regular, #606266);
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail .button:hover,
.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button:hover,
.cbransubs-view-subscription .cbran-subs-myaccount-detail a.button:hover {
	color: var(--cbran-el-color-primary, #409eff);
	border-color: #c6e2ff;
	background: #ecf5ff;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button.subscription-action[data-action="pause-submit"],
.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button.subscription-action[data-action="cancel-submit"],
.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button.subscription-action[data-action="resume"],
.cbransubs-view-subscription .cbran-subs-myaccount-detail button.subscription-action,
.cbransubs-view-subscription .cbran-subs-myaccount-detail a.button.pay,
.cbransubs-view-subscription .cbran-subs-myaccount-detail a.CbranSubs-change-payment,
.cbransubs-view-subscription .cbran-subs-myaccount-detail a.CbranSubs-add-payment,
.cbransubs-view-subscription .cbran-subs-payment-method-panel a.CbranSubs-change-payment {
	border-color: var(--cbran-el-color-primary, #409eff);
	background: var(--cbran-el-color-primary, #409eff);
	color: #fff;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button.subscription-action[data-action="pause-submit"]:hover,
.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button.subscription-action[data-action="cancel-submit"]:hover,
.cbransubs-view-subscription .cbran-subs-myaccount-detail input.button.subscription-action[data-action="resume"]:hover,
.cbransubs-view-subscription .cbran-subs-myaccount-detail button.subscription-action:hover,
.cbransubs-view-subscription .cbran-subs-myaccount-detail a.button.pay:hover {
	border-color: var(--cbran-el-color-primary-dark, #337ecc);
	background: var(--cbran-el-color-primary-dark, #337ecc);
	color: #fff;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail .cbran-subs-date-input,
.cbransubs-view-subscription .cbran-subs-myaccount-detail #subscription-cancel-selector {
	min-height: 32px;
	margin: 0.25rem 0.5rem 0.25rem 0;
	padding: 0.25rem 0.6875rem;
	border: 1px solid var(--cbran-el-border, #dcdfe6);
	border-radius: var(--cbran-el-radius, 4px);
	font-size: 0.875rem;
	max-width: 12rem;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail .cbran-el-select select,
.cbransubs-view-subscription .cbran-subs-myaccount-detail #subscription-cancel-selector {
	width: 100%;
	max-width: 16rem;
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail #subscription_qty {
	min-height: 32px;
	width: 5rem;
	margin-right: 0.5rem;
	padding: 0.25rem 0.5rem;
	border: 1px solid var(--cbran-el-border, #dcdfe6);
	border-radius: var(--cbran-el-radius, 4px);
}

.cbransubs-view-subscription .cbran-subs-myaccount-detail .cbran-subs-date-input:focus,
.cbransubs-view-subscription .cbran-subs-myaccount-detail #subscription-cancel-selector:focus,
.cbransubs-view-subscription .cbran-subs-myaccount-detail #subscription_qty:focus {
	outline: none;
	border-color: var(--cbran-el-color-primary, #409eff);
	box-shadow: 0 0 0 1px rgba(64, 158, 255, 0.15);
}

.cbransubs-view-subscription .subscription_activity_logs .cbransubs_alert_box,
.cbransubs-view-subscription .subscription_activity_logs .cbransubs_alert_box {
	margin: 0.75rem 0;
	padding: 0.625rem 1rem;
	border: 1px solid var(--cbran-el-border-light, #e4e7ed);
	border-radius: var(--cbran-el-radius, 4px);
	background: var(--cbran-el-fill-light, #f5f7fa);
	font-size: 0.875rem;
	color: var(--cbran-el-text-regular, #606266);
}

.cbransubs-view-subscription .subscription_activity_logs .cbransubs_alert_box span,
.cbransubs-view-subscription .subscription_activity_logs .cbransubs_alert_box span {
	font-weight: 600;
	color: var(--cbran-el-text-primary, #303133);
}

.cbransubs-view-subscription #prevent-more-subscription-notes {
	display: inline-block;
	margin-top: 0.5rem;
	color: var(--cbran-el-color-primary, #409eff);
	font-size: 0.875rem;
	font-weight: 500;
	text-decoration: none;
	cursor: pointer;
}

.cbransubs-view-subscription #prevent-more-subscription-notes:hover {
	color: var(--cbran-el-color-primary-dark, #337ecc);
}