/**
 * Dashboard additions on top of the CityBook dashboard styles in
 * listing.min.css (flash notices, review listing link, lister upgrade box).
 */

.dashboard-content-col > .gt-flash {
	margin-bottom: 30px;
}

.dashboard-content-col > .gt-flash p {
	padding-right: 30px;
}

.gt-review-listing {
	display: inline-block;
	margin-left: 15px;
	font-weight: 600;
}

.gt-upgrade-box {
	margin-bottom: 30px;
}

.gt-upgrade-box .custom-form p {
	text-align: left;
	padding-bottom: 20px;
}

/* CityBook makes the status badge static on phones but leaves the row as a
   single flex line, so the badge stretches into a column. Let it wrap. */
@media only screen and (max-width: 670px) {
	.dashboard-list-inner {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.dashboard-list-inner > .new-dashboard-item {
		-ms-flex-item-align: start;
		align-self: flex-start;
	}
}

/* Bookings tab: renter / lister switch in the box header. */
.gt-view-switch {
	float: right;
	margin-top: -2px;
}

.gt-view-switch a {
	display: inline-block;
	margin-left: 18px;
	font-weight: 600;
	color: #98AAB8;
}

.gt-view-switch a.active {
	color: #50596E;
	border-bottom: 2px solid currentColor;
}

.dashboard-header h3 {
	display: inline-block;
}

.booking-btns .btn + .btn {
	margin-left: 6px;
}

/* Checkout and payment result. */
.gt-checkout-secure,
.gt-checkout-due,
.gt-checkout-unavailable {
	text-align: left;
	font-size: 12px;
	color: #878C9F;
	padding-top: 15px;
}

.gt-checkout-result {
	text-align: center;
	padding: 40px 30px;
}

.gt-checkout-result .list-single-main-item-title h3 {
	float: none;
	text-align: center;
}

.gt-checkout-result-icon i {
	font-size: 54px;
	margin-bottom: 20px;
}

.gt-checkout-paid .gt-checkout-result-icon i {
	color: #5ECFB1;
}

.gt-checkout-failed .gt-checkout-result-icon i,
.gt-checkout-invalid .gt-checkout-result-icon i {
	color: #EA4D37;
}

.gt-receipt {
	text-align: left;
	margin-top: 20px;
}

.gt-checkout-result-actions {
	margin-top: 30px;
}

.gt-checkout-result-actions .btn {
	margin: 0 6px;
}

#citybook-checkout-form .lcheckout_btn .i-for-loading,
#citybook-checkout-form .lcheckout_btn.loading .i-for-default {
	display: none;
}

#citybook-checkout-form .lcheckout_btn.loading .i-for-loading {
	display: inline-block;
}

/* Invoice view. */
.gt-invoice-meta {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	text-align: left;
	margin-bottom: 25px;
}

.gt-invoice-meta p {
	padding-bottom: 10px;
}

.gt-invoice-view .cth-table {
	width: 100%;
}

.gt-invoice-note,
.gt-invoice-actions {
	text-align: left;
	margin-top: 20px;
}

@media print {
	header.main-header,
	footer.main-footer,
	.dashboard-content-col ~ *,
	.col-md-3,
	.profile-edit-page-header,
	.gt-invoice-actions,
	#wpadminbar {
		display: none !important;
	}

	.dashboard-content-col {
		width: 100% !important;
	}
}

/* CityBook gives booking labels min-width:200px, which leaves almost no room
   for the value on phones. Let label and value share the row instead. */
@media (max-width: 640px) {
	.booking-details .booking-title { min-width: 0; flex: 0 0 38%; }
	.booking-details .booking-text { flex: 1 1 auto; min-width: 0; margin-left: 10px; overflow-wrap: anywhere; }
}

/* Tables on phones: one block per row, each cell "Label ... value"
   (labels come from the column headings, see main.js). */
@media only screen and (max-width: 600px) {
	.gt-stack-table,
	.gt-stack-table tbody,
	.gt-stack-table tr,
	.gt-stack-table td {
		display: block;
		width: 100%;
	}
	.gt-stack-table thead {
		clip: rect(0 0 0 0);
		height: 1px;
		overflow: hidden;
		position: absolute;
		width: 1px;
	}
	.gt-stack-table tr {
		border-bottom: 1px solid #eee;
		padding: 8px 0;
	}
	/* Beats CityBook's "table.table-invoice tbody td:first-child" padding. */
	.gt-stack-table.cth-table tbody td,
	.gt-stack-table.cth-table tbody td:first-child,
	.gt-stack-table.cth-table tbody td:last-child {
		border-bottom: 0;
		padding: 7px 20px;
		text-align: right;
	}
	.gt-stack-table td[data-label] {
		align-items: baseline;
		display: flex;
		gap: 12px;
		justify-content: space-between;
	}
	.gt-stack-table td[data-label]::before {
		color: #50596e;
		content: attr(data-label);
		flex-shrink: 0;
		font-weight: 600;
		text-align: left;
	}
	.gt-stack-table.cth-table tbody td:not([data-label]) {
		text-align: left;
	}
}

/* Recent activities: the dismiss button stays top right on phones (CityBook
   puts every .new-dashboard-item in the flow below 670px). */
@media only screen and (max-width: 670px) {
	.dashboard-list-box.activities .dashboard-list {
		position: relative;
	}
	.dashboard-list-box.activities .new-dashboard-item {
		margin: 0;
		position: absolute;
		right: 15px;
		top: 15px;
	}
	.dashboard-list-box.activities .dashboard-message-text {
		padding-right: 40px;
	}
}

/* Message buttons: spaced like the other dashboard button rows. */
.message-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.message-btns .btn {
	margin: 0;
}

/* Profile socials: network and URL side by side, filling the row, styled
   like the other inputs, with the delete button at the end. */
.profile-edit-container .repeater-fields .entry {
	align-items: center;
	flex-wrap: nowrap;
	gap: 10px;
}
.profile-edit-container .repeater-fields .entry-fields {
	flex: 1 1 auto;
	flex-wrap: nowrap;
	gap: 10px;
	min-width: 0;
	width: auto;
}
.profile-edit-container .repeater-fields .entry-fields.two-cols > select {
	flex: 0 0 38%;
	width: auto;
}
.profile-edit-container .repeater-fields .entry-fields.two-cols > input {
	flex: 1 1 auto;
	min-width: 0;
	width: auto;
}
.profile-edit-container .repeater-fields .entry-fields select,
.profile-edit-container .repeater-fields .entry-fields input {
	background: #fff; /* CityBook's repeater inputs are white */
	border: 1px solid #eee;
	border-radius: 6px;
	color: #666;
	font-family: inherit;
	font-size: 13px;
	height: 44px !important;
	line-height: normal !important;
	margin: 0;
	padding: 0 15px;
}
.profile-edit-container .repeater-fields .rmfield {
	flex: 0 0 44px;
	height: 44px;
}

/* Text areas in the site font (browsers default them to monospace). */
.profile-edit-container textarea {
	font-family: inherit;
}