/* === ParkingPro Design Tokens ===
   Override these in your theme or Customizer > Additional CSS
   to change the branding across all ParkingPro plugins. */
:root {
    /* Brand */
    --parkingpro-color-primary: #1caf9a;
    --parkingpro-color-primary-hover: #009B86;
    --parkingpro-color-primary-dark: #168f7e;
    --parkingpro-color-primary-light: rgba(28, 175, 154, 0.08);
    --parkingpro-color-secondary: #337ab7;
    --parkingpro-color-secondary-hover: #3497DA;

    /* Neutrals */
    --parkingpro-color-text: #1e1e1e;
    --parkingpro-color-muted: #6b6b6b;
    --parkingpro-color-border: #e0e0e0;
    --parkingpro-color-bg: #f7f6f3;

    /* Feedback */
    --parkingpro-color-success: #16a34a;
    --parkingpro-color-error: #dc2626;
    --parkingpro-color-warning: #ea580c;
    --parkingpro-color-info: #1d4ed8;

    /* Shape */
    --parkingpro-radius: 10px;
    --parkingpro-radius-sm: 8px;
    --parkingpro-radius-lg: 12px;
}

.parkingpro-plugin *,
.parkingpro-shortcode *,
[class^="parkingpro-"],
[class*="parkingpro-"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* LOADING SHIMMER */
.parkingpro-loading-shimmer {
    animation: parkingpro-animation-shimmering 1.5s linear infinite;

    background-color: rgba(55, 23, 23, 0.03);

    background-image: linear-gradient(-90deg, rgba(55, 23, 23, 0) 0%, rgba(55, 23, 23, 0.05) 50%, rgba(55, 23, 23, 0) 100%);

    background-position: -300px 0;
    background-repeat: no-repeat;
    background-size: 300px 100%;
    border-radius: 4px;
    height: 1em;
}
@keyframes parkingpro-animation-shimmering {
    0% {
        background-position: -300px 0;
    }
    100% {
        background-position: 800px 0;
    }
}

/* BUTTON LOADING SPINNER */
.parkingpro-btn-loading-spinner {
    position: relative;
}
.parkingpro-btn-loading-spinner-active {
    pointer-events: none;
    color: transparent;
}
.parkingpro-btn-loading-spinner-active::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border: 3px solid transparent;
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: parkingpro-btn-loading-spinner 0.6s linear infinite;
}
@keyframes parkingpro-btn-loading-spinner {
    to {
        transform: rotate(360deg);
    }
}

/* ALERT */
.parkingpro-alert {
	padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}
.parkingpro-alert-success {
	color: #3c763d;
	background-color: #dff0d8;
	border-color: #d6e9c6;
}
.parkingpro-alert-error {
	color: #a94442;
	background-color: #f2dede;
	border-color: #ebccd1;
}
.parkingpro-alert-error::-moz-placeholder {
    color: #a94442;
    opacity: 1
}

.parkingpro-alert-error:-ms-input-placeholder {
    color: #a94442
}

.parkingpro-alert-error::-webkit-input-placeholder {
    color: #a94442
}
.parkingpro-alert-warning {
	color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}
.parkingpro-alert-info {
	color: #31708f;
	background-color: #d9edf7;
	border-color: #bce8f1;
}

/* TABLES */
.parkingpro-table {
	width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
	border-spacing: 0;
    border-collapse: collapse;
}
.parkingpro-table>tbody>tr>td,
.parkingpro-table>tbody>tr>th,
.parkingpro-table>tfoot>tr>td,
.parkingpro-table>tfoot>tr>th,
.parkingpro-table>thead>tr>td,
.parkingpro-table>thead>tr>th {
    padding: 4px 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
}
.parkingpro-table>thead>tr>th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd;
}
.parkingpro-table>caption+thead>tr:first-child>td,
.parkingpro-table>caption+thead>tr:first-child>th,
.parkingpro-table>colgroup+thead>tr:first-child>td,
.parkingpro-table>colgroup+thead>tr:first-child>th,
.parkingpro-table>thead:first-child>tr:first-child>td,
.parkingpro-table>thead:first-child>tr:first-child>th {
    border-top: 0
}

.parkingpro-table th:first-child,
.parkingpro-table td:first-child {
	padding-left: 0;
}

.parkingpro-table th:last-child,
.parkingpro-table td:last-child {
	padding-right: 0;
}

.parkingpro-table>tbody+tbody {
    border-top: 2px solid #ddd;
}

.parkingpro-table input[type="radio"] {
	margin-top: 8px;
}

.parkingpro-table-borderless {
    border: none;
}
.parkingpro-table-borderless>tbody>tr>td,
.parkingpro-table-borderless>tbody>tr>th,
.parkingpro-table-borderless>tfoot>tr>td,
.parkingpro-table-borderless>tfoot>tr>th,
.parkingpro-table-borderless>thead>tr>td,
.parkingpro-table-borderless>thead>tr>th {
    border: none;
}

@media screen and (max-width: 991px) {
	.parkingpro-table-responsive thead {
		border: none;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}

	.parkingpro-table-responsive tr {
		border-bottom: 3px solid #ddd;
		display: block;
		margin-bottom: .625em;
	}

	.parkingpro-table-responsive td {
		display: block;
		text-align: right;
	}
	.parkingpro-table-responsive > tbody > tr > td {
		padding-left: 0;
		padding-right: 0;
	}

	.parkingpro-table-responsive td::before {
		content: attr(data-label);
		float: left;
		font-weight: bold;
		width: 50%;
		text-align: left;
		text-overflow: ellipsis;
    	white-space: nowrap;
    	overflow: hidden;
	}

	.parkingpro-table-responsive td:last-child {
		border-bottom: 0;
	}

	.parkingpro-table-responsive td .parkingpro-form-control,
	.parkingpro-table-responsive td input[type="radio"] {
		display: inline-block;
		width: 50%;
	}
}