/* =============================================================
   Resource Center – resource-center.css
   Font: Roboto
   ============================================================= */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap');

/* ── CSS Variables ── */
:root {
    --rc-teal:          #008080;
    --rc-teal-dark:     #155f53;
    --rc-teal-bg:       #e6f4f1;
    --rc-white:         #ffffff;
    --rc-off-white:     #f9fafb;
    --rc-bg:            #f3f4f6;
    --rc-border:        #e5e7eb;
    --rc-border-dark:   #d1d5db;
    --rc-text:          #111827;
    --rc-text-muted:    #6b7280;
    --rc-text-light:    #9ca3af;

    /* Badge colours */
    --rc-quick-bg:      #fef3c7;
    --rc-quick-text:    #92400e;
    --rc-core-bg:       #dbeafe;
    --rc-core-text:     #1e40af;
    --rc-routine-bg:    #d1fae5;
    --rc-routine-text:  #065f46;

    /* Level colours */
    --rc-down-bg:       #eff6ff;
    --rc-down-bd:       #bfdbfe;
    --rc-down-tx:       #1e40af;
    --rc-up-bg:         #f0fdf4;
    --rc-up-bd:         #bbf7d0;
    --rc-up-tx:         #166534;
    --rc-hard-bg:       #fff7ed;
    --rc-hard-bd:       #fed7aa;
    --rc-hard-tx:       #9a3412;

    --rc-radius:        12px;
    --rc-radius-sm:     8px;
    --rc-radius-xs:     6px;
}

/* ════════════════════════════════════════════
   WRAPPER
════════════════════════════════════════════ */
.rc-wrapper {
    font-family: 'Roboto', sans-serif;
    max-width: 1440px;
    /* margin: 0 auto; */
    /* padding: 0 16px 40px; */
    /* background: #F5F5F5; */
}

/* ════════════════════════════════════════════
   TABS
════════════════════════════════════════════ */
.rc-tabs {
    display: flex;
    gap: 4px;
    background-color: white;
    max-width: fit-content;
    border-bottom: 1px solid #E6EAEE;
    margin-bottom: 20px;
    border-radius: 8px;
    padding: 12px;
    overflow-x: auto;
    scrollbar-width: none;
}
/* ── Theme Card ── */
.tc-card {
    background: #fff;
    border: 1px solid #E8EAF0;
    border-radius: 12px;
    padding: 0px !important;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: box-shadow .2s;
}

.rc-tabs::-webkit-scrollbar { display: none; }

.rc-tab {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--rc-text-muted);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    padding: 8px 12px;
    white-space: nowrap;
    transition: color 0.15s, border-color 0.15s;
    margin-bottom: -1px;
}

.rc-tab:hover:not(:disabled) {
    color: var(--rc-teal);
}

.rc-tab--active {
    color: #ffffff !important;
    background: #008080;
    border-radius: 12px;
    font-weight: 600;
}

.rc-tab--disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

/* ════════════════════════════════════════════
   FILTER BAR
════════════════════════════════════════════ */
.rc-filter-bar {
    margin-bottom: 20px;
}

.rc-filter-bar__top {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.rc-filter-icon-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: var(--rc-text-muted);
    background: var(--rc-white);
    border: unset;
    border-radius: var(--rc-radius-xs);
    padding: 7px 12px;
    cursor: pointer;
    flex-shrink: 0;
    transition: color 0.15s, border-color 0.15s;
}

.rc-filter-icon-btn:hover,
.rc-filter-icon-btn.active {
    color: var(--rc-teal) !important;
    border-color: var(--rc-teal) !important;
}

.rc-filter-icon-btn:hover, .rc-pill:hover, .rc-card__toggle:hover{
   background-color: unset !important;
    color: var(--rc-teal) !important;
}
.rc-tab:hover{
    background-color: var(--rc-teal) !important;
     color:  #ffffff !important;
     border-radius: 12px;
}
.rc-tab:focus{
     background-color:var(--rc-teal)  !important;
      color: #ffffff !important;
}
.rc-card__toggle:focus {
     background-color: unset !important;
      color: var(--rc-teal) !important;
}
.rc-filter-icon-btn:focus{
     background-color: unset !important;
     color: var(--rc-teal) !important;
}
.rc-pill:focus{
    /* background-color: unset !important; */
     color: unser !important;
}
/* Category pills row */
.rc-filter-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    flex: 1;
}

.rc-filter-pills--sm .rc-pill {
    font-size: 12px;
    padding: 4px 11px;
}

/* Filter bar right: count + search */
.rc-filter-bar__right {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
    flex-shrink: 0;
}

.rc-count {
    font-size: 13px;
    color: var(--rc-text-muted);
    white-space: nowrap;
}

.rc-search-wrap {
    display: flex;
    align-items: center;
    background: var(--rc-white);
    border: 1px solid #E6EAEE;
    border-radius: 999px;
    padding: 1px 12px;
}

.rc-search-wrap svg { color: var(--rc-text-light); flex-shrink: 0; }

.rc-search {
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    border: unset !important;
    color: var(--rc-text);
    border: none;
    outline: none;
    background: transparent;
    width: 170px;
}

.rc-search::placeholder { color: var(--rc-text-light); }

/* ── Pill ── */
.rc-pill {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: var(--rc-text-muted);
    background: #DAE9E9;
    border: 1px solid var(--rc-border);
    border-radius: 20px;
    padding: 5px 14px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    white-space: nowrap;
}

.rc-pill:hover {
    border-color: var(--rc-teal);
    color: var(--rc-teal);
}

.rc-pill--active {
    background: var(--rc-teal) !important;
    border-color: var(--rc-teal) !important;
    color: var(--rc-white) !important;
}

/* ── Advanced filter panel ── */
.rc-filter-advanced {
    margin-top: 14px;
    padding: 16px;
    background: var(--rc-white);
    border: 1px solid var(--rc-border);
    border-radius: var(--rc-radius-sm);
    display: flex;
    flex-direction: column;
    gap: 14px;
    animation: rc-fade 0.2s ease;
}

.rc-filter-advanced[hidden] { display: none !important; }

.rc-filter-group {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.rc-filter-group__label {
    font-size: 12px;
    font-weight: 600;
    color: var(--rc-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    min-width: 55px;
    flex-shrink: 0;
}

@keyframes rc-fade {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ════════════════════════════════════════════
   ACTIVITY GRID  (2 columns)
════════════════════════════════════════════ */
.rc-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: start;
}

/* ════════════════════════════════════════════
   ACTIVITY CARD
════════════════════════════════════════════ */
.rc-card {
    background: var(--rc-white);
    border: 1.5px solid var(--rc-border);
    border-radius: var(--rc-radius);
    overflow: hidden;
    transition: box-shadow 0.2s;
}

.rc-card:hover {
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.09);
}

.rc-card[data-hidden="true"] { display: none; }

/* ── Card Header ── */
.rc-card__header {
    padding: 16px 18px 0;
}

.rc-card__header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.rc-card__title {
    font-size: 18px;
    font-weight: 600;
    color: #262D39;
    margin: 0 0 10px;
    line-height: 1.35;
}

/* Domain tags */
.rc-card__domains {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.rc-domain-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 20px;
    padding: 3px 10px;
    line-height: 1.4;
}

/* Age badges */
.rc-card__ages {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}

.rc-age-badge {
    font-size: 12px;
    color: var(--rc-text-muted);
    background: var(--rc-off-white);
    border: 1px solid var(--rc-border);
    border-radius: 999px;
    padding: 2px 8px;
}

/* Duration */
.rc-duration {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--rc-text-muted);
}

/* ── Category Badge ── */
.rc-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.07em;
    border-radius: 999px;
    padding: 3px 8px;
    text-transform: uppercase;
}

.rc-badge--quick   { background: #FEF3C6;   color: var(--rc-quick-text); }
.rc-badge--core    { background: var(--rc-core-bg);    color: var(--rc-core-text); }
.rc-badge--routine { background: var(--rc-routine-bg); color: var(--rc-routine-text); }

/* ── Toggle Button ── */
.rc-card__toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    background: none;
    border: none;
    border-top: 1px solid var(--rc-border);
    cursor: pointer;
    font-family: 'Roboto', sans-serif;
    font-size: 13px;
    font-weight: 600;
    color: var(--rc-teal);
    padding: 11px 0 13px;
    margin-top: 8px;
    text-align: left;
    transition: color 0.15s;
}

.rc-card__toggle:hover { color: var(--rc-teal-dark); }

.rc-chevron {
    margin-left: auto;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}

.rc-card__toggle[aria-expanded="true"] .rc-chevron {
    transform: rotate(180deg);
}

/* ── Card Body (accordion) ── */
.rc-card__body {
    padding: 16px 18px 18px;
    border-top: 1px solid var(--rc-border);
    animation: rc-fade 0.2s ease;
}

.parent-filter-bar{
    background: white;
    padding: 20px 16px;
    border-radius: 16px;
}

.rc-card__body[hidden] { display: none !important; }

/* ── Sections ── */
.rc-section {
    margin-bottom: 14px;
}

.rc-section:last-child { margin-bottom: 0; }

.rc-section__label {
    font-size: 14px;
    font-weight: 500;
    color: #838799;
    margin: 0 0 7px;
}

/* Materials pills */
.rc-mat-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 20px 0 20px;
}

.rc-mat-pill {
    font-size: 12px;
    color: var(--rc-text-muted);
    background: var(--rc-off-white);
    border: 1px solid var(--rc-border);
    border-radius: 999px;
    padding: 3px 10px;
}
.rc-mat-pill-red {
    color: #BB4D00 !important;
}

/* Steps */
.rc-steps {
    margin: 0;
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.rc-steps li {
    font-size: 14px;
    color: #838799;
    line-height: 1.55;
}

/* What to say */
.rc-say-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.rc-say-list li {
    font-size: 14px;
    color: #838799;
    line-height: 1.55;
}

/* ── Level boxes ── */
.rc-levels {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-top: 12px;
}

/* If only 2 levels, they expand */
.rc-levels:has(> :nth-child(2):last-child) {
    grid-template-columns: 1fr 1fr;
}

.rc-level {
    border-radius: var(--rc-radius-sm);
    padding: 12px 14px;
}

.rc-level--down { background: var(--rc-down-bg); border: 1px solid var(--rc-down-bd); }
.rc-level--up   { background: var(--rc-up-bg);   border: 1px solid var(--rc-up-bd); }
.rc-level--hard { background: var(--rc-hard-bg); border: 1px solid var(--rc-hard-bd); }

.rc-level__title {
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 5px;
}

.rc-level--down .rc-level__title { color: #0084D1; }
.rc-level--up   .rc-level__title { color: #00786F; }
.rc-level--hard .rc-level__title { color: #BB4D00; }

.rc-level__text {
    font-size: 12px;
    color: var(--rc-text-muted);
    line-height: 1.55;
    margin: 0;
}

/* No results */
.rc-no-results {
    font-family: 'Roboto', sans-serif;
    color: var(--rc-text-muted);
    font-size: 15px;
    padding: 24px 0;
    grid-column: 1 / -1;
}

/* ════ PARENT HANDOUTS ════ */
.ph-header { margin-bottom:24px; }
.ph-badge { display:inline-flex; align-items:center; gap:6px; background:#D1FAE5; color:#065f46; font-family:"Roboto",sans-serif; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:4px 10px; border-radius:999px; margin-bottom:10px; }
.ph-heading { color:#1D293D; font-family:"Roboto",sans-serif; font-size:24px; font-weight:700; margin:0 0 8px; line-height:1.3; }
.ph-subheading { color:#838799; font-family:"Nunito",sans-serif; font-size:14px; line-height:20px; margin:0; }

.ph-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:32px; }
@media(max-width:1025px){ .ph-grid{grid-template-columns:repeat(2,1fr);} }
@media(max-width:767px){ .ph-grid{grid-template-columns:1fr;} }

.ph-card { background:#fff; border:1px solid #E6EAEE; border-radius:12px; display:flex; flex-direction:column; gap:10px; }
.ph-card__badge { display:inline-block; width:fit-content; font-family:"Roboto",sans-serif; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:3px 10px; border-radius:999px; }
.ph-card__badge--free   { background:#D1FAE5; color:#065f46; }
.ph-card__badge--member { background:#FEF3C7; color:#92400e; }
.ph-card__title { color:#1D293D; font-family:"Roboto",sans-serif; font-size:15px; font-weight:700; margin:0; line-height:1.3; }
.ph-card__desc  { color:#838799; padding: 16px; font-family:"Nunito",sans-serif; font-size:14px; line-height:20px; margin:0; }
.ph-card__includes-label { color:#838799; padding: 0 16px; font-family:"Roboto",sans-serif; font-size:14px; line-height: 15px; font-weight:500; margin:4px 0 0; }
.ph-card__list  { list-style:none; padding: 0 16px; padding:0; margin:0; display:flex; flex-direction:column; gap:5px; flex:1; }
.ph-card__list li { color:#838799; padding: 0 16px; font-family:"Roboto",sans-serif; font-size:14px; line-height:20px; position:relative; }
.ph-card__list li::before { content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background-image: url("https://t2.sandpulse.co/wp-content/uploads/2026/05/Frame-29.svg");
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 10px;
    padding: 0 16px;
    vertical-align: middle;; }
.ph-card__btn { display:flex; align-items:center;  justify-content:center; gap:6px; width:100%; padding:9px 14px; border-radius:8px; font-family:"Roboto",sans-serif; font-size:13px; font-weight:600; cursor:pointer; margin-top:auto; transition:background .15s,border-color .15s; }
.ph-card__btn--outline { border:1px solid #008080;  border-radius: 12px; padding: 10px 16px; color:#008080; max-width: 273px; margin: 0 auto 16px auto; }

.ph-card__btn--locked  { border:1px solid #BF1E24;  border-radius: 12px; padding: 10px 16px; color:#BF1E24; max-width: 273px; margin: 0 auto 16px auto; }


.ph-how { background:#FFFFFF; border-radius:12px; border: 1px solid #FFFFFF; padding:20px; margin-bottom:28px; }
.ph-how__title { color:#1D293D; font-family:"Inter",sans-serif; font-size:18px; line-height: 20px; font-weight:600; margin:0 0 20px; }
.ph-how__steps { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media(max-width:768px){ .ph-how__steps{grid-template-columns:1fr;} }
.ph-how__step  { display:flex; flex-direction:column; gap:8px; background: #F9F9F9; border-radius: 14px !important; border: 1px solid #E6EAEE; padding: 16px; }
.ph-how__num   { color:#C0C0C0; font-family:"Roboto",sans-serif; font-size:24px; font-weight:600; line-height:20px; }
.ph-how__text  { color:#62748E; font-family:"Roboto",sans-serif; font-size:14px; line-height:20px; margin:0; }
.ph-how__text strong { color:#262D39; font-size:16px; line-height:20px; font-family:"Roboto",sans-serif; }

.ph-unlock-banner { background:#EBC64C; border-radius:12px; padding:40px 24px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:10px; }
.ph-unlock__heading { color:#262626; font-family:"Roboto",sans-serif; font-size:32px; font-weight:600; margin:0; }
.ph-unlock__sub { color:#262626; font-family:"Roboto",sans-serif; font-size:16px; line-height:24px; max-width:646px; margin:0; }
.ph-unlock__btn { display:inline-flex; align-items:center; gap:6px; background:#BF1E24; color:#fff; border:none; border-radius:12px; padding:8px 16px; font-family:"Nunito",sans-serif; font-size:14px; line-height: 20px; font-weight:600; cursor:pointer; margin-top:6px; }


/* ════════════════════════════════════════════
   RESPONSIVE — Tablet
════════════════════════════════════════════ */
@media ( max-width: 768px ) {
    .rc-grid {
        grid-template-columns: 1fr;
    }

    .rc-filter-bar__top {
        flex-wrap: wrap;
        gap: 8px;
    }

    .rc-filter-bar__right {
        width: 100%;
        margin-left: 0;
        justify-content: space-between;
    }

    .rc-search-wrap {
        flex: 1;
    }

    .rc-search {
        width: 100%;
    }

    .rc-filter-pills {
        order: 3;
        width: 100%;
    }

    .rc-levels {
        grid-template-columns: 1fr 1fr;
    }
}

/* ════════════════════════════════════════════
   RESPONSIVE — Mobile
════════════════════════════════════════════ */
@media ( max-width: 480px ) {
    .rc-wrapper {
        padding: 0 16px 30px;
    }

    .rc-tabs {
        gap: 0;
    }

    .rc-tab {
        font-size: 13px;
        padding: 9px 28px 10px;
        gap: 5px;
    }

    /*.rc-tab svg { display: none; }*/

    .rc-card__header { padding: 14px 14px 0; }
    .rc-card__body   { padding: 14px; }
    .rc-card__title  { font-size: 15px; }

    .rc-levels {
        grid-template-columns: 1fr;
    }

    .rc-filter-icon-btn {
        padding: 6px 10px;
        font-size: 12px;
    }

    .rc-search-wrap {
        padding: 6px 10px;
    }

    .rc-count { display: none; }
}

/* ── Tab switching ── */
.rc-tab[data-tab] { cursor: pointer; }

/* ── Theme Cards Header ── */
.tc-header { margin-bottom: 20px; }
.tc-heading {
    color: #1D293D;
    font-family: "Roboto", sans-serif;
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 12px;
    line-height: 1.3;
}
.tc-subheading {
    color: #838799;
    font-family: "Nunito", sans-serif;
    font-size: 14px;
    line-height: 16px;
    font-weight: 400;
    margin: 0 0 12px;
}
.tc-access-note {
    color: #BF1E24;
    font-family: "Nunito", sans-serif;
    font-size: 14px;
    line-height: 16px;
    margin: 0;
    font-weight: 600;
}

/* ── How Theme Cards Work box ── */
.tc-how-box {
    background: #fff;
    border: 1px solid #FFFFFF;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
}
.tc-how-title {
    color: #1D293D;
    font-family: "Inter", sans-serif;
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 14px;
}
.tc-how-grid {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.tc-how-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 18px;
    border-radius: 8px;
    min-width: 100px;
    flex: 1;
}
.tc-how-item--yellow { background: #FFFBEB; border: 1px solid #FEE685; }
.tc-how-item--teal   { background: #F0FDFA; border: 1px solid #96F7E4; }
.tc-how-item--purple { background: #F5F3FF; border: 1px solid #DDD6FE; }
.tc-how-item--gray   { background: #FFF8F9; border: 1px solid #FFC2C4; }
.tc-how-item--blue   { background: #F0F9FF; border: 1px solid #0084D1; }
.tc-how-num {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    line-height: 20px;
    font-weight: 700;
    color: #1D293D;
    line-height: 1;
}
.tc-how-label {
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #838799;
    line-height: 16px;
}

/* ── Age Pills ── */
.tc-age-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}
.tc-age-pill { font-size: 13px; }

/* ── Theme Cards Grid ── */
.tc-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
@media (max-width: 767px) { .tc-grid { grid-template-columns: 1fr; } }

/* ── Theme Card ── */
.tc-card {
    background: #fff;
    border: 1px solid #E8EAF0;
    border-radius: 12px;
    padding: 0px !important;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: box-shadow .2s;
}
.tc-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.07); }

.tc-card__header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px;
    background: #F9F9F9;
    border-radius: 12px 12px 0px 0;
    border-bottom: 1px solid #E6EAEE;
}
.tc-card__num {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    background: #008080;
    color: #fff;
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    line-height: 20px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.tc-card__title {
    color: #262D39;
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
    margin: 0;
    flex: 1;
}
.tc-card__skills {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}
.tc-skills-badge {
    font-family: "Roboto", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: #838799;
    background: #F6F6F6;
    border-radius: 100%;
    padding: 2px 8px;
}

.tc-card__section { display: flex; flex-direction: column; gap: 6px; }
.tc-card__label {
    color: #838799;
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 15px;
    margin: 0;
    padding: 0 20px 0 20px;
}
.tc-card__book {
    color: #838799;
    font-family: "ROboto", sans-serif;
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    padding: 0 20px 0 20px;
    font-weight: 400;
}

.tc-card__footer {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding: 0 20px 20px 20px;
}
.tc-card__act-count {
    color: #00786F;
    font-family: "Inter", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
}

/* ════════════════════════════════════════
   PARENT HANDOUTS TAB
════════════════════════════════════════ */
/* Header */
.ph-header { margin-bottom: 24px; }
.ph-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #D1FAE5;
    color: #065f46;
    font-family: "Roboto", sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 10px;
}
.ph-heading {
    color: #1D293D;
    font-family: "Roboto", sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 8px;
    line-height: 1.3;
}
.ph-subheading {
    color: #838799;
    font-family: "Nunito", sans-serif;
    font-size: 14px;
    line-height: 20px;
    margin: 0;
}