/**
 * Lab test price list (view=labtests). Builds on prices.css (.prices-note, .prices-table, .prices-no-results)
 * and the .md-input / .md-button-group components from doctors-list.css.
 * @package     com_doctors
 * @license     GNU General Public License version 2 or later
 */

.labtests-page {
    max-width: 960px;
    margin: 0 auto;
    padding: var(--md-spacing-2) 0 var(--md-spacing-4);
    color: var(--md-text-primary);
}

.labtests-page [hidden] {
    display: none;
}

.labtests-page .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Search form: input, lab switch, submit (the submit is only needed without JS) */
.labtests-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--md-spacing-2);
    margin-bottom: var(--md-spacing-2);
}

.labtests-search-wrapper {
    flex: 1 1 320px;
    width: auto;
    min-width: 0;
}

.labtests-labs {
    flex: 0 0 auto;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}

/* Radios styled as the button group: the label is the button, the input stays focusable but invisible */
.labtests-labs input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
}

.labtests-labs .md-button-group-btn:has(input:checked) {
    background: var(--md-primary);
    color: white;
}

.labtests-labs .md-button-group-btn:has(input:focus-visible) {
    outline: 2px solid var(--md-primary);
    outline-offset: -2px;
}

.labtests-submit,
.labtests-more {
    min-height: 44px;
    padding: 8px 20px;
    border: 0;
    border-radius: var(--md-chip-border-radius);
    background: var(--md-primary);
    color: white;
    font: inherit;
    font-weight: 500;
    cursor: pointer;
}

.labtests-submit:hover,
.labtests-more:hover {
    background: var(--md-primary-dark);
}

.labtests-page.is-enhanced .labtests-submit {
    display: none;
}

.labtests-more {
    display: block;
    margin: var(--md-spacing-3) auto 0;
}

/* Shortcut queries */
.labtests-popular {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--md-spacing-1);
    margin-bottom: var(--md-spacing-2);
}

.labtests-popular-label {
    font-size: 0.85rem;
    color: var(--md-text-secondary);
}

.labtests-page .labtests-popular a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 4px 14px;
    border-radius: var(--md-chip-border-radius);
    background: var(--md-chip-bg);
    color: var(--md-chip-text);
    font-size: 0.85rem;
    text-decoration: none;
    transition: background var(--md-transition-duration-short) var(--md-transition-easing-standard),
                color var(--md-transition-duration-short) var(--md-transition-easing-standard);
}

.labtests-page .labtests-popular a:hover,
.labtests-page .labtests-popular a:focus-visible {
    background: var(--md-primary-alpha);
    color: var(--md-primary);
}

.labtests-summary {
    margin: 0 0 var(--md-spacing-2);
    font-size: 0.9rem;
    color: var(--md-text-secondary);
}

.labtests-table .labtests-price-col {
    text-align: right;
}

@media (max-width: 575px) {
    .labtests-labs {
        flex: 1 1 100%;
        display: flex;
    }

    .labtests-labs .md-button-group-btn {
        flex: 1 1 0;
        justify-content: center;
        padding: 12px 8px;
        text-align: center;
    }
}

/* Narrow screens: prices.css prefixes each price with its column label; one price column needs none */
@media (max-width: 599px) {
    .labtests-table td::before {
        content: none;
    }

    .labtests-table td {
        margin-left: auto;
    }
}