/*
 * cbtt-pricing — self-contained grid/utility/button stylesheet.
 *
 * This plugin's own markup (inc/shortcode.php, inc/advisor.php,
 * inc/stripe-checkout.php, inc/widerruf.php, inc/geo-price-preview.php) uses
 * a handful of Bootstrap 5 grid/utility/button classes. Historically those
 * only had rules behind them because the CBTT-Turbo theme ships a
 * bootstrap-slim.css extract, or (inside the Suite's wp-admin) because the
 * 'cbtt-credits' screen explicitly pulls that same theme file in — see
 * cbtt_admin_enqueue() in the stundenplan-verwaltung repo. Either dependency
 * missing (e.g. a different theme, or a plugin context this file's enqueue
 * function hasn't been wired into) left the markup unstyled.
 *
 * This file makes the plugin self-sufficient: exactly the classes the
 * markup above actually emits, nothing kept "on stock" for hypothetical
 * future use. Registered/enqueued by cbtt_pricing_enqueue_ui() in
 * inc/ui-assets.php, called from every shortcode/template renderer that
 * outputs one of these classes.
 *
 * Grid/utility values are Bootstrap 5.3's own defaults (MIT License,
 * https://getbootstrap.com) so nothing shifts by a pixel whether this file,
 * the theme's bootstrap-slim.css, or both happen to load on the same page —
 * see CBTT-Turbo/assets/css/bootstrap-slim.css for the source this mirrors.
 * Button colors/radius go through cbtt design tokens (var(--cbtt-…,
 * literal-fallback), no bare hex, no gradient), matching the fallback
 * literals already used for the same tokens in the Suite's own
 * core/assets/css/cbtt-ui.css and wishlist.css.
 */

/* --- Container --- */
.container {
	width: 100%;
	padding-right: 1rem;
	padding-left: 1rem;
	margin-right: auto;
	margin-left: auto;
}
@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

/* --- Row / Col --- */
/* -0.75rem row margin cancels the 0.75rem column padding between adjacent
   columns' content, i.e. a 1.5rem (24px) total gutter — matches Bootstrap's
   own default and the theme's bootstrap-slim.css extract exactly. */
.row {
	display: flex;
	flex-wrap: wrap;
	margin-right: -0.75rem;
	margin-left: -0.75rem;
}
.row > * {
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: 0.75rem;
	padding-left: 0.75rem;
}
.col-12 { flex: 0 0 auto; width: 100%; }
@media (min-width: 768px) {
	.col-md-4 { flex: 0 0 auto; width: 33.3333%; }
	.col-md-6 { flex: 0 0 auto; width: 50%; }
}
@media (min-width: 992px) {
	.col-lg-3 { flex: 0 0 auto; width: 25%; }
	.col-lg-4 { flex: 0 0 auto; width: 33.3333%; }
}

/* --- Flex utilities --- */
.d-flex { display: flex !important; }
.align-items-end { align-items: flex-end !important; }
.justify-content-center { justify-content: center !important; }
.gap-2 { gap: 0.5rem !important; }

/* --- Text utilities --- */
.text-center { text-align: center !important; }

/* --- Spacing utilities --- */
.mt-4 { margin-top: 1.5rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }

/* --- Misc --- */
.w-100 { width: 100% !important; }

/* --- Buttons ---
   Base metrics/typography match Bootstrap 5's .btn (bootstrap-slim.css);
   colors/radius are cbtt design tokens matching the theme's actual current
   button look (var(--cbtt-primary, #003f86) is the theme's own --cbtt-primary
   value; the on-primary/radius fallbacks match the Suite's cbtt-ui.css). */
.btn {
	display: inline-block;
	font-weight: 600;
	line-height: 1.5;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	cursor: pointer;
	user-select: none;
	background-color: transparent;
	border: 2px solid transparent;
	padding: 0.625rem 1.5rem;
	font-size: 1rem;
	border-radius: var(--cbtt-radius-md, 11px);
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}
.btn:disabled {
	cursor: not-allowed;
	opacity: .5;
}
.btn:disabled:hover {
	background: transparent;
	color: var(--cbtt-primary, #003f86);
	filter: none;
}
.btn-primary {
	background: var(--cbtt-primary, #003f86);
	color: var(--cbtt-on-primary, #fff);
	border-color: var(--cbtt-primary, #003f86);
}
.btn-primary:hover,
.btn-primary:focus {
	color: var(--cbtt-on-primary, #fff);
	filter: brightness(0.9);
}
.btn-outline {
	background: transparent;
	color: var(--cbtt-primary, #003f86);
	border-color: currentColor;
}
.btn-outline:hover,
.btn-outline:focus {
	background: var(--cbtt-primary, #003f86);
	color: var(--cbtt-on-primary, #fff);
}