/**
 * Partner Pricing Gate — base styles.
 * Intentionally light; partner pages are themed in Cornerstone on top of this.
 */

.partner-gate {
    max-width: 640px;
    margin: 0 auto;
}

.partner-gate__intro {
    margin-bottom: 1.25rem;
}

.partner-gate__field {
    margin-bottom: 1.25rem;
}

.partner-gate__label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.partner-gate__input {
    width: 100%;
    padding: 0.75rem;
    font-size: 1rem;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
}

.partner-gate__error {
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    border-radius: 6px;
    background: #fdecea;
    color: #c62828;
}

.partner-gate__button {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    background: #0f76a3;
    border: 0;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s ease;
}

.partner-gate__button:hover {
    background: #0c6189;
}

.partner-gate__button[disabled] {
    opacity: 0.7;
    cursor: default;
}

.partner-gate__selected {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.partner-gate__selected-text {
    margin: 0;
}

.partner-gate__change {
    background: none;
    border: 0;
    padding: 0;
    color: #0f76a3;
    text-decoration: underline;
    cursor: pointer;
    font-size: 0.95rem;
}

.partner-gate--error {
    padding: 0.75rem 1rem;
    border: 1px dashed #c62828;
    color: #c62828;
    border-radius: 6px;
}

/* -------------------------------------------------------------------------
 * Gated content — put `partner-gated` on ANY element to hide it until its gate
 * is satisfied (or immediately if the page has no gate). The engine toggles the
 * `partner-gated--revealed` companion class, so the element keeps its own
 * display (grid/flex/block) when shown — no display hacks.
 * ---------------------------------------------------------------------- */
.partner-gated:not(.partner-gated--revealed) {
    display: none !important;
}

/* -------------------------------------------------------------------------
 * De-coupled "Selected / Change" status control ([partner_gate_status])
 * ---------------------------------------------------------------------- */
.partner-gate-status {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.partner-gate-status__change {
    background: none;
    border: 0;
    padding: 0;
    color: #0f76a3;
    text-decoration: underline;
    cursor: pointer;
    font-size: 0.95rem;
}

/* -------------------------------------------------------------------------
 * De-coupled live-change input ([partner_gate_input])
 * ---------------------------------------------------------------------- */
.partner-gate-input {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.partner-gate-input__label {
    font-weight: 600;
}

.partner-gate-input .partner-gate__input {
    width: auto;
    min-width: 14rem;
    margin: 0;
}

/* -------------------------------------------------------------------------
 * Partner switcher (container swapper) — formats: tabs / buttons / pills / select / checkbox.
 * Active color approximated from the Figma; swap for the exact brand hex if needed.
 * ---------------------------------------------------------------------- */
.partner-switch {
    margin: 0 0 1.5rem;
}

.partner-switch--tabs {
    display: flex;
    gap: 0.5rem;
    border-bottom: 1px solid #e2e6ea;
}

.partner-switch__tab {
    appearance: none;
    -webkit-appearance: none;
    display: inline-block;
    cursor: pointer;
    font: inherit;
    font-weight: 600;
    text-decoration: none;
    padding: 0.65rem 1.5rem;
    border: 1px solid transparent;
    border-radius: 8px 8px 0 0;
    background: #fff;
    color: #11212a;
    margin-bottom: -1px;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.partner-switch__tab:hover {
    text-decoration: none;
}

/* hover on an inactive tab — hint toward the active colour */
.partner-switch__tab:not(.is-active):hover {
    background: #e7f3f8;
    border-color: #0f76a3;
    color: #0f76a3;
}

/* hover on the active tab — slightly darker */
.partner-switch__tab.is-active:hover {
    background: #0c6189;
    border-color: #0c6189;
}

.partner-switch__tab:not(.is-active) {
    border-color: #e2e6ea;
}

.partner-switch__tab.is-active {
    background: #0f76a3;
    color: #fff;
    border-color: #0f76a3;
}

/* buttons / pills — same tabs markup, rounded standalone chips */
.partner-switch--buttons,
.partner-switch--pills {
    display: flex;
    gap: 0.5rem;
}

.partner-switch--buttons .partner-switch__tab,
.partner-switch--pills .partner-switch__tab {
    border: 1px solid #e2e6ea;
    border-radius: 999px;
    margin-bottom: 0;
}

.partner-switch--buttons .partner-switch__tab.is-active,
.partner-switch--pills .partner-switch__tab.is-active {
    border-color: #0f76a3;
}

/* select */
.partner-switch__select {
    font: inherit;
    padding: 0.6rem 0.75rem;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: #fff;
    min-width: 12rem;
}

/* checkbox / toggle */
.partner-switch--checkbox {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.partner-switch__checkbox-label {
    font-weight: 600;
    color: #11212a;
}