.tlb-wrap {
    font-family: Inter, Arial, sans-serif;
    color: #10131a;
    max-width: 1160px;
    margin: 0 auto;
    padding: 24px 0;
}

.tlb-wrap * {
    box-sizing: border-box;
}

.tlb-wrap h2 {
    font-size: 38px;
    line-height: 1.05;
    letter-spacing: -0.04em;
    margin: 0 0 22px;
}

.tlb-wrap h3 {
    font-size: 20px;
    line-height: 1.15;
    margin: 0 0 12px;
}

.tlb-wrap label {
    display: block;
    font-weight: 800;
    font-size: 14px;
    margin: 0 0 7px;
}

.tlb-wrap input,
.tlb-wrap select {
    width: 100%;
    padding: 14px 15px;
    border: 1px solid #dfe2e8;
    border-radius: 14px;
    background: #fff;
    font-size: 15px;
    margin: 0 0 16px;
}

.tlb-wrap input:focus,
.tlb-wrap select:focus {
    outline: 0;
    border-color: #111;
    box-shadow: 0 0 0 4px rgba(17,17,17,.08);
}

.tlb-wrap button,
.tlb-btn {
    display: inline-block;
    background: #080808;
    color: #fff;
    border: 0;
    border-radius: 999px;
    padding: 13px 21px;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
    transition: .2s;
}

.tlb-wrap button:hover,
.tlb-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(0,0,0,.16);
    color: white;
}

.tlb-wrap .tlb-secondary {
    background: #f1f2f5;
    color: #111;
}

.tlb-wrap .tlb-secondary:hover {
    background: #f1f2f5;
    color: #111;
}

.tlb-muted {
    color: #717784;
}

.tlb-alert {
    padding: 14px 16px;
    border-radius: 16px;
    font-weight: 800;
    margin: 0 0 18px;
}

.tlb-ok {
    background: #dcfce7;
    color: #166534;
}

.tlb-err {
    background: #fee2e2;
    color: #991b1b;
}

.tlb-grid {
    display: grid;
    gap: 18px;
}

.tlb-grid.two {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.tlb-grid.three {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.tlb-card {
    background: #fff;
    border: 1px solid #e8e9ee;
    border-radius: 22px;
    padding: 24px;
    box-shadow: 0 18px 50px rgba(15,17,21,.08);
}

.tlb-auth {
    max-width: 520px;
}

.tlb-debug {
    margin: 16px 0;
    padding: 14px;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    background: #fff;
}

.tlb-debug summary {
    cursor: pointer;
    font-weight: 800;
}

.tlb-debug pre {
    white-space: pre-wrap;
    overflow: auto;
    background: #0b0f14;
    color: #22c55e;
    padding: 14px;
    border-radius: 12px;
}

/* Dashboard */
.tlb-dashboard {
    max-width: 1120px;
}

.tlb-dashboard-hero {
    background: linear-gradient(135deg, #111, #2a2a2a);
    color: #fff;
    border-radius: 28px;
    padding: 34px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 22px;
    box-shadow: 0 24px 70px rgba(0,0,0,.22);
}

.tlb-dashboard-hero h2 {
    margin: 6px 0;
    color: #fff;
    font-size: 34px;
}

.tlb-dashboard-hero p {
    margin: 0;
    color: rgba(255,255,255,.72);
}

.tlb-kicker {
    display: inline-block;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #888;
}

.tlb-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.tlb-stat-card {
    background: #fff;
    border-radius: 24px;
    padding: 22px;
    border: 1px solid #ececec;
    box-shadow: 0 18px 50px rgba(0,0,0,.07);
}

.tlb-stat-card span {
    display: block;
    color: #777;
    font-size: 14px;
    margin-bottom: 8px;
}

.tlb-stat-card strong {
    display: block;
    color: #111;
    font-size: 32px;
    line-height: 1;
}

.tlb-dashboard-main {
    display: grid;
    grid-template-columns: 1.5fr .9fr;
    gap: 16px;
    margin-bottom: 16px;
}

.tlb-dashboard-lower {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.tlb-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 18px;
}

.tlb-card-head h3 {
    margin: 4px 0 0;
}

.tlb-next-class-box {
    display: grid;
    grid-template-columns: 86px 1fr;
    gap: 18px;
    align-items: center;
    background: #f7f7f7;
    border-radius: 22px;
    padding: 18px;
}

.tlb-next-date {
    background: #111;
    color: #fff;
    border-radius: 18px;
    padding: 18px 10px;
    text-align: center;
}

.tlb-next-date strong {
    display: block;
    font-size: 34px;
    line-height: 1;
}

.tlb-next-date span {
    display: block;
    margin-top: 6px;
    text-transform: uppercase;
    font-weight: 800;
    opacity: .75;
}

.tlb-next-info h4 {
    margin: 0 0 8px;
    font-size: 24px;
}

.tlb-next-info p {
    margin: 3px 0;
    color: #666;
}

.tlb-inline-form {
    margin-top: 14px;
}

.tlb-empty-state {
    background: #f7f7f7;
    border-radius: 20px;
    padding: 22px;
}

.tlb-empty-state strong {
    display: block;
    margin-bottom: 5px;
}

.tlb-credit-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.tlb-credit-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f7f7f7;
    border: 1px solid #e9e9e9;
    border-radius: 16px;
    padding: 14px 16px;
}

.tlb-credit-row span {
    color: #555;
    font-weight: 700;
}

.tlb-credit-row strong {
    color: #111;
}

.tlb-clean-list {
    display: flex;
    flex-direction: column;
}

.tlb-clean-item {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px solid #eee;
}

.tlb-clean-item:last-child {
    border-bottom: 0;
}

.tlb-clean-item strong {
    display: block;
    color: #111;
    margin-bottom: 5px;
}

.tlb-clean-item span,
.tlb-clean-item small {
    color: #777;
    font-size: 13px;
}

.tlb-mini-btn {
    padding: 8px 12px !important;
    font-size: 12px !important;
    border-radius: 999px !important;
}

/* Abonnementen */
.tlb-pill {
    display: inline-block;
    background: #eef2ff;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 900;
    margin-bottom: 14px;
}

.tlb-price p {
    min-height: 48px;
    color: #68707d;
}

.tlb-price-amount {
    font-size: 34px;
    font-weight: 950;
    letter-spacing: -0.05em;
    margin: 18px 0;
}

/* Rooster kalender */
.tlb-calendar-wrap {
    max-width: 1180px;
}

.tlb-calendar-nav {
    background: #fff;
    color: #111;
    display: grid;
    grid-template-columns: 90px 1fr 90px;
    gap: 12px;
    align-items: center;
    padding: 10px 14px;
    border-radius: 12px 12px 0 0;
    border: 1px solid #ddd;
}

.tlb-calendar-nav strong {
    text-align: center;
}

.tlb-calendar-nav .tlb-week-btn {
    width: auto;
    min-width: 0;
    padding: 7px 14px;
    font-size: 13px;
    border-radius: 999px;
    line-height: 1.2;
}

.tlb-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: #fff;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.tlb-calendar-day {
    min-height: 520px;
    border-right: 1px solid #ddd;
}

.tlb-calendar-day-head {
    padding: 12px 10px;
    text-align: center;
    font-weight: 700;
    border-bottom: 1px solid #ddd;
    color: #555;
    background: #fafafa;
}

.tlb-calendar-day-body {
    min-height: 470px;
}

.tlb-calendar-event {
    position: relative;
    padding: 12px 10px 12px 13px;
    min-height: 70px;
    border-bottom: 1px solid #e5e5e5;
    color: #111;
    background: #fff;
}

.tlb-calendar-event::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
    background: #111;
}

.tlb-calendar-event strong {
    display: block;
    font-size: 15px;
    line-height: 1.2;
    margin-bottom: 6px;
}

.tlb-calendar-event span {
    display: block;
    font-size: 14px;
    color: #111;
}

.tlb-calendar-event small {
    display: block;
    margin-top: 8px;
    color: #777;
}

.tlb-calendar-event form {
    margin-top: 10px;
}

.tlb-calendar-event button {
    font-size: 12px;
    padding: 8px 14px;
    border-radius: 999px;
}

.tlb-event-ladies::before {
    background: #c026ff;
}

.tlb-event-jeugd::before {
    background: #f5a000;
}

.tlb-event-men::before {
    background: #ff3b13;
}

.tlb-event-wedstrijd::before {
    background: #111;
}

.tlb-event-spar::before {
    background: #d7ff00;
}

.tlb-event-conditie::before {
    background: #74ff00;
}

.tlb-event-default::before {
    background: #777;
}

.tlb-calendar-event.is-past {
    opacity: .45;
}

/* Oudere classes fallback */
.tlb-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 18px;
}

.tlb-top form {
    margin: 0;
}

.tlb-credit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}

.tlb-credit {
    border: 1px solid #e1e4ea;
    border-radius: 16px;
    padding: 16px;
    background: #fafafa;
}

.tlb-credit strong {
    display: block;
    font-size: 13px;
    text-transform: lowercase;
    color: #6b7280;
}

.tlb-credit span {
    display: block;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: -0.04em;
    margin-top: 8px;
}

.tlb-credit small {
    color: #6b7280;
}

.tlb-list-item {
    display: flex;
    flex-direction: column;
    padding: 14px 0;
    border-bottom: 1px solid #eef0f4;
}

.tlb-list-item:last-child {
    border-bottom: 0;
}

@media (max-width: 900px) {
    .tlb-calendar-grid {
        display: block;
    }

    .tlb-calendar-day,
    .tlb-calendar-day-body {
        min-height: auto;
    }
}

@media (max-width: 850px) {
    .tlb-dashboard-hero,
    .tlb-dashboard-main,
    .tlb-dashboard-lower,
    .tlb-dashboard-stats {
        grid-template-columns: 1fr;
    }

    .tlb-dashboard-hero {
        display: block;
    }

    .tlb-dashboard-hero form {
        margin-top: 18px;
    }

    .tlb-next-class-box {
        grid-template-columns: 1fr;
    }

    .tlb-clean-item {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 700px) {
    .tlb-wrap {
        padding: 16px 0;
    }

    .tlb-wrap h2 {
        font-size: 30px;
    }

    .tlb-card {
        padding: 19px;
        border-radius: 18px;
    }

    .tlb-top {
        align-items: flex-start;
        flex-direction: column;
    }
}

.tlb-header-btn {
    display: inline-block;
    background: red;
    color: #fff;
    padding: 5px 22px;
    border-radius: 0;
    font-weight: 900;
    text-decoration: none;
    text-transform: uppercase;
}

.tlb-header-btn:hover {
    color: #fff;
    background: #d93612;
}

.tlb-login-page {
    max-width: 980px;
}

.tlb-login-card {
    background: #fff;
    border-radius: 30px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    box-shadow: 0 24px 70px rgba(0,0,0,.18);
}

.tlb-login-left {
    padding: 42px;
}

.tlb-login-left h2 {
    margin: 8px 0 10px;
}

.tlb-login-left p {
    color: #666;
    margin-bottom: 24px;
}

.tlb-login-form input {
    background: #f7f7f7;
}

.tlb-login-form button {
    width: 100%;
    margin-top: 4px;
}

.tlb-login-note {
    margin-top: 18px;
    font-size: 14px;
}

.tlb-login-note a {
    font-weight: 900;
    color: #f0441d;
    text-decoration: none;
}

.tlb-login-right {
    background: linear-gradient(135deg, #111, #252525);
    display: flex;
    align-items: flex-end;
    padding: 34px;
}

.tlb-login-badge {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 22px;
    padding: 24px;
    color: #fff;
}

.tlb-login-badge strong {
    display: block;
    font-size: 24px;
    margin-bottom: 8px;
}

.tlb-login-badge span {
    color: rgba(255,255,255,.72);
}

@media (max-width: 800px) {
    .tlb-login-card {
        grid-template-columns: 1fr;
    }

    .tlb-login-right {
        display: none;
    }

    .tlb-login-left {
        padding: 28px;
    }
}

.tlb-claim-page {
    max-width: 1050px;
}

.tlb-claim-hero {
    max-width: 680px;
    margin-bottom: 24px;
}

.tlb-claim-hero h2 {
    margin: 8px 0 10px;
}

.tlb-claim-hero p {
    color: #747b88;
    font-size: 16px;
    margin: 0;
}

.tlb-claim-steps {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.tlb-claim-card {
    background: #fff;
    border: 1px solid #e8e9ee;
    border-radius: 28px;
    padding: 34px;
    box-shadow: 0 22px 60px rgba(0,0,0,.12);
    position: relative;
    overflow: hidden;
}

.tlb-claim-card h3 {
    font-size: 26px;
    margin: 16px 0 8px;
}

.tlb-claim-card p {
    color: #6f7682;
    margin: 0 0 24px;
}

.tlb-step-badge {
    width: 44px;
    height: 44px;
    background: #111;
    color: #fff;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
}

.tlb-claim-card-dark {
    background: linear-gradient(135deg, #111, #292929);
    color: #fff;
    border-color: rgba(255,255,255,.12);
}

.tlb-claim-card-dark h3,
.tlb-claim-card-dark label {
    color: #fff;
}

.tlb-claim-card-dark p {
    color: rgba(255,255,255,.68);
}

.tlb-claim-card-dark input {
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.16);
    color: #fff;
}

.tlb-claim-card-dark input::placeholder {
    color: rgba(255,255,255,.45);
}

.tlb-claim-card-dark .tlb-step-badge {
    background: #fff;
    color: #111;
}

.tlb-claim-card-dark button {
    background: #fff;
    color: #111;
}

@media (max-width: 850px) {
    .tlb-claim-steps {
        grid-template-columns: 1fr;
    }

    .tlb-claim-card {
        padding: 26px;
    }
}

.tlb-memberships-page {
    max-width: 1180px;
}

.tlb-memberships-hero {
    max-width: 720px;
    margin-bottom: 28px;
}

.tlb-memberships-hero h2 {
    margin: 8px 0 10px;
}

.tlb-memberships-hero p {
    color: #7b8290;
    font-size: 16px;
    margin: 0;
}

.tlb-pricing-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}

.tlb-pricing-card {
    background: #fff;
    color: #111;
    border: 1px solid #e8e9ee;
    border-radius: 28px;
    padding: 26px;
    min-height: 390px;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
    box-shadow: 0 22px 60px rgba(0,0,0,.10);
    transition: .2s ease;
}

.tlb-pricing-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 28px 80px rgba(0,0,0,.16);
}

.tlb-pricing-card.is-featured {
    border-color: #111;
}

.tlb-pricing-card.is-featured::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0,0,0,.04), transparent 42%);
    pointer-events: none;
}

.tlb-pricing-label {
    position: absolute;
    top: 18px;
    right: 18px;
    background: #111;
    color: #fff;
    border-radius: 999px;
    padding: 7px 11px;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.tlb-pricing-label.is-free {
    background: #f0441d;
}

.tlb-pricing-top {
    min-height: 135px;
}

.tlb-pricing-top h3 {
    margin: 12px 0 10px;
    font-size: 21px;
    line-height: 1.15;
}

.tlb-pricing-top p {
    color: #68707d;
    font-size: 14px;
    line-height: 1.65;
    margin: 0;
}

.tlb-pricing-price {
    font-size: 42px;
    line-height: 1;
    font-weight: 950;
    letter-spacing: -0.06em;
    margin: 18px 0;
}

.tlb-pricing-price span {
    font-size: 24px;
    margin-right: 3px;
}

.tlb-pricing-divider {
    height: 1px;
    background: #eceef3;
    margin: 0 0 18px;
}

.tlb-pricing-features {
    list-style: none;
    padding: 0;
    margin: 0 0 22px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.tlb-pricing-features li {
    position: relative;
    padding-left: 22px;
    color: #555d6b;
    font-size: 14px;
}

.tlb-pricing-features li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: #111;
    font-weight: 900;
}

.tlb-pricing-action {
    margin-top: auto;
}

.tlb-pricing-action form {
    margin: 0;
}

.tlb-pricing-action button,
.tlb-pricing-action .tlb-btn {
    width: 100%;
    text-align: center;
}

.tlb-active-badge {
    width: 100%;
    background: #dcfce7;
    color: #166534;
    border-radius: 999px;
    padding: 13px 18px;
    font-weight: 900;
    text-align: center;
}

@media (max-width: 1100px) {
    .tlb-pricing-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 650px) {
    .tlb-pricing-grid {
        grid-template-columns: 1fr;
    }

    .tlb-pricing-card {
        min-height: auto;
    }
}

.tlb-memberships-hero h2 {
    color: white;
}

.tlb-register-page {
    max-width: 1050px;
}

.tlb-register-card {
    background: #fff;
    border-radius: 30px;
    overflow: hidden;
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    box-shadow: 0 24px 70px rgba(0,0,0,.18);
}

.tlb-register-left {
    background: linear-gradient(135deg, #111, #292929);
    color: #fff;
    padding: 42px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.tlb-register-left h2 {
    color: #fff;
    margin: 8px 0 12px;
}

.tlb-register-left p {
    color: rgba(255,255,255,.72);
    font-size: 16px;
    margin: 0 0 28px;
}

.tlb-register-benefits {
    display: grid;
    gap: 12px;
}

.tlb-register-benefits div {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    padding: 14px 16px;
    font-weight: 800;
}

.tlb-register-right {
    padding: 42px;
}

.tlb-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.tlb-register-form input,
.tlb-register-form select {
    background: #f7f7f7;
}

.tlb-register-form button {
    width: 100%;
    margin-top: 4px;
}

.tlb-register-note {
    margin: 18px 0 0;
    color: #68707d;
    font-size: 14px;
}

.tlb-register-note a {
    color: #f0441d;
    font-weight: 900;
    text-decoration: none;
}

@media (max-width: 850px) {
    .tlb-register-card {
        grid-template-columns: 1fr;
    }

    .tlb-register-left,
    .tlb-register-right {
        padding: 28px;
    }

    .tlb-form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

.tlb-dashboard-schedule-btn {
    margin-top: 12px;
}

.tlb-card-head .tlb-mini-btn {
    text-decoration: none;
    white-space: nowrap;
}

.tlb-forgot-page {
    max-width: 980px;
}

.tlb-forgot-card {
    background: #fff;
    border-radius: 30px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    box-shadow: 0 24px 70px rgba(0,0,0,.18);
}

.tlb-forgot-left {
    padding: 42px;
}

.tlb-forgot-left h2 {
    margin: 8px 0 10px;
}

.tlb-forgot-left p {
    color: #666;
    margin-bottom: 24px;
}

.tlb-forgot-form input {
    background: #f7f7f7;
}

.tlb-forgot-form button {
    width: 100%;
    margin-top: 4px;
}

.tlb-forgot-right {
    background: linear-gradient(135deg, #111, #252525);
    display: flex;
    align-items: flex-end;
    padding: 34px;
}

@media (max-width: 800px) {
    .tlb-forgot-card {
        grid-template-columns: 1fr;
    }

    .tlb-forgot-right {
        display: none;
    }

    .tlb-forgot-left {
        padding: 28px;
    }
}

.tlb-reset-page {
    max-width: 980px;
}

.tlb-reset-card {
    background: #fff;
    border-radius: 30px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    box-shadow: 0 24px 70px rgba(0,0,0,.18);
}

.tlb-reset-left {
    padding: 42px;
}

.tlb-reset-left h2 {
    margin: 8px 0 10px;
}

.tlb-reset-left p {
    color: #666;
    margin-bottom: 24px;
}

.tlb-reset-form input {
    background: #f7f7f7;
}

.tlb-reset-form button {
    width: 100%;
    margin-top: 4px;
}

.tlb-reset-right {
    background: linear-gradient(135deg, #111, #252525);
    display: flex;
    align-items: flex-end;
    padding: 34px;
}

@media (max-width: 800px) {
    .tlb-reset-card {
        grid-template-columns: 1fr;
    }

    .tlb-reset-right {
        display: none;
    }

    .tlb-reset-left {
        padding: 28px;
    }
}