/* v47: program reading order, clear administrative actions and responsive forms. */
:root { --v47-ink:#193b51; --v47-muted:#506b7c; --v47-line:#d6e3eb; }
.program-detail-v47 {padding-top:24px;}
.program-detail-kicker {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px;}
.program-detail-layout {display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:clamp(24px,4vw,64px);align-items:start;}
.program-fields {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;min-width:0;}
.program-field {min-width:0;overflow-wrap:anywhere;}
.program-field--title,.program-field--intro,.program-field--image,.program-field--icon,.program-field--wide,.program-field--description {grid-column:1/-1;}
.program-field--title h1 {font-size:clamp(2rem,3.7vw,3.6rem);line-height:1.12;letter-spacing:-.035em;margin:0 0 4px;text-wrap:balance;}
.program-field--intro p {font-size:clamp(1.05rem,1.5vw,1.23rem);line-height:1.75;color:var(--v47-muted);margin:0 0 6px;max-width:66ch;}
.program-field--icon {font-size:2.15rem;line-height:1.2;}
.program-field--image {margin:4px 0 8px;}
.program-field--image img {display:block;width:100%;height:auto;max-height:480px;aspect-ratio:16/9;object-fit:cover;border-radius:22px;}
.program-field--fact {padding:24px;border:1px solid var(--v47-line);border-radius:16px;background:#fff;}
.program-field--fact h2 {font-size:.85rem;text-transform:none;letter-spacing:.02em;color:var(--v47-muted);margin:0 0 12px;line-height:1.5;font-weight:700;}
.program-field--fact p,.program-field--fact .program-rich-text {font-size:1rem;line-height:1.75;color:var(--v47-ink);}
.program-field--fact p {margin:0;}
.program-field--fact p + p {margin-top:12px;}
.program-field--fact .field-help {font-size:.8rem;line-height:1.65;color:var(--v47-muted);margin-top:18px;}
.program-field--fact .program-rich-text > :first-child {margin-top:0;}
.program-field--fact .program-rich-text > :last-child {margin-bottom:0;}
.program-field--description {padding-block:20px;}
.program-field--description h2 {font-size:1.7rem;line-height:1.3;margin:0 0 24px;}
.program-field--description .html-content {max-width:74ch;}
.program-field--source-link a {display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:4px;}
.program-booking-card {position:sticky;top:110px;padding:30px;border:1px solid #c6dce6;border-radius:20px;background:linear-gradient(145deg,#edf6fb,#f8fbfd);}
.program-booking-card h2 {font-size:1.55rem;line-height:1.3;margin:14px 0;}
.program-booking-card p {font-size:.94rem;line-height:1.75;color:var(--v47-muted);}
.program-booking-card .button {width:100%;white-space:normal;text-align:center;margin:10px 0;}
.program-booking-card .field-help {font-size:.78rem;margin-bottom:0;}
.program-teacher-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:18px;}
.program-teacher-person {display:flex;align-items:center;gap:12px;min-width:0;}
.program-teacher-person img {flex:0 0 48px;width:48px;height:48px;object-fit:cover;border-radius:50%;}
.program-teacher-person strong,.program-teacher-person small {display:block;line-height:1.5;overflow-wrap:anywhere;}
.program-teacher-person small {font-size:.78rem;color:var(--v47-muted);margin-top:3px;}
.program-branch-links {display:flex;gap:10px;flex-wrap:wrap;}
.program-branch-links a {display:inline-flex;align-items:center;min-height:44px;padding:9px 14px;border-radius:10px;background:#edf5f9;line-height:1.5;}
/* Match the actual DOM order, never CSS-only reordering for assistive technology. */
.program-card--ordered {display:flex;flex-direction:column;gap:0;overflow:hidden;}
.program-card--ordered .program-card-body {display:block;flex:0 0 auto!important;padding:16px 24px 0;}
.program-card--ordered .program-card-body h3 {margin:0;font-size:1.2rem;line-height:1.45;}
.program-card--ordered .program-card-summary {margin:12px 24px 18px;font-size:.9rem;line-height:1.65;color:var(--v47-muted);}
.program-card--ordered .program-image {margin:16px 0 0;height:auto;aspect-ratio:16/10;min-height:0;}
.program-card--ordered .program-image:first-child {margin-top:0;}
.program-card--ordered .program-image img {height:100%;width:100%;object-fit:cover;}
.program-card--ordered .program-card-symbol {display:block;margin:20px 24px 0;font-size:1.7rem;line-height:1.2;}
.program-card--ordered > .card-link {padding:20px 24px 24px;margin-top:auto;}
.portal-body .settings-feature-links {display:flex;gap:10px;flex-wrap:wrap;margin:0 0 24px;}
.portal-body .program-order-workspace {display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,320px);gap:24px;align-items:start;}
.portal-body .program-order-workspace > .panel {min-width:0;}
.portal-body .program-order-guide {position:sticky;top:28px;}
.portal-body .program-order-list {padding:0;margin:24px 0;display:grid;gap:10px;list-style:none;}
.portal-body .program-order-item {display:grid;grid-template-columns:66px minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 16px;background:#f7fafc;border:1px solid var(--v47-line);border-radius:12px;}
.portal-body .program-order-item label {margin:0;}
.portal-body .program-order-item input {min-width:0;width:100%;padding:10px 8px;text-align:center;font-variant-numeric:tabular-nums;}
.portal-body .program-order-item strong {line-height:1.5;font-size:.92rem;}
.portal-body .order-buttons {display:flex;gap:6px;}
.portal-body .order-buttons .button {width:44px;min-width:44px;height:44px;padding:0;justify-content:center;font-size:1.1rem;}
.portal-body .teacher-choice-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:360px;overflow-y:auto;padding:4px;}
.portal-body .teacher-choice {display:flex;flex-direction:row;align-items:center;gap:12px;min-height:70px;padding:14px;margin:0;border:1px solid var(--v47-line);border-radius:10px;background:#fff;cursor:pointer;}
.portal-body .teacher-choice:has(input:checked) {background:#edf7fc;border-color:#76a7c1;}
.portal-body .teacher-choice input {flex:0 0 20px;width:20px;height:20px;margin:0;accent-color:var(--brand);}
.portal-body .teacher-choice span {min-width:0;}
.portal-body .teacher-choice strong,.portal-body .teacher-choice small {display:block;overflow-wrap:anywhere;line-height:1.6;}
.portal-body .teacher-choice small {font-weight:400;font-size:.76rem;color:var(--v47-muted);}
.portal-body .program-teacher-picker {padding:20px;border:1px solid var(--v47-line);border-radius:14px;margin:0;}
.portal-body .program-teacher-picker legend {padding:0 8px;font-weight:700;}
.portal-body .teacher-account-panel {margin-top:28px;}
.portal-body .teacher-account-panel .check {display:flex;flex-direction:row;align-items:flex-start;gap:12px;line-height:1.6;}
.portal-body .teacher-account-panel .check input {flex:0 0 20px;width:20px;height:20px;margin:3px 0 0;}
.portal-body .contact-cards {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.portal-body .notification-contact-card {display:flex;flex-direction:column;justify-content:space-between;gap:20px;padding:22px;border:1px solid var(--v47-line);border-radius:14px;background:#fbfdff;min-width:0;}
.portal-body .notification-contact-card h3 {font-size:1.1rem;line-height:1.45;margin:8px 0;}
.portal-body .contact-address {overflow-wrap:anywhere;font-size:.93rem;line-height:1.6;}
.portal-body .notification-contact-card .crm-actions {gap:8px;}
.portal-body .notification-contact-card .button {min-height:44px;}
.portal-body .crm-task {gap:12px;flex-wrap:wrap;}
.portal-body .crm-task > div {flex:1 1 230px;min-width:0;overflow-wrap:anywhere;}
.portal-body .crm-task form {margin:0;}
.portal-body .crm-timeline article form {margin-top:12px;}
.portal-body .empty-state {padding:28px;border:1px dashed #adc4d2;border-radius:14px;grid-column:1/-1;}
.portal-body .empty-state h3 {margin-top:0;}
.portal-body :is(.program-order-item,.teacher-choice,.notification-contact-card) :is(button,input):focus-visible {outline:3px solid #2877a2;outline-offset:3px;}
/* Avoid table-sized fieldsets and unwrappable action rows on small screens. */
.portal-body fieldset {min-width:0;}
.portal-body :is(.crm-actions,.sticky-actions) {flex-wrap:wrap;}
.portal-body :is(.button,.portal-page-head a) {overflow-wrap:anywhere;}
@media (max-width:1100px) {
 .program-detail-layout {grid-template-columns:minmax(0,1fr);gap:28px;}
 .program-booking-card {position:static;max-width:100%;}
 .portal-body .program-order-workspace {grid-template-columns:minmax(0,1fr);}
 .portal-body .program-order-guide {position:static;}
}
@media (max-width:700px) {
 .program-detail-kicker {align-items:flex-start;flex-direction:column;gap:12px;}
 .program-fields {grid-template-columns:minmax(0,1fr);gap:14px;}
 .program-field--fact {padding:20px;}
 .program-field--image img {border-radius:14px;}
 .program-teacher-list {grid-template-columns:minmax(0,1fr);}
 .program-booking-card {padding:24px;}
 .portal-body .teacher-choice-grid,.portal-body .contact-cards {grid-template-columns:minmax(0,1fr);}
 .portal-body .program-order-item {grid-template-columns:52px minmax(0,1fr);padding:12px;gap:10px;}
 .portal-body .program-order-item .order-buttons {grid-column:2;justify-content:flex-start;}
 .portal-body .program-order-item strong {font-size:.9rem;}
 .portal-body .notification-contact-card {padding:18px;}
 .portal-body .program-teacher-picker {padding:12px;}
 .portal-body .settings-feature-links .button {flex:1 1 180px;white-space:normal;text-align:center;}
 .portal-body .crm-task > div {flex-basis:100%;}
 .portal-body .crm-task .button {min-height:44px;}
}
@media (prefers-reduced-motion:reduce) {
 .program-card--ordered,.teacher-choice {transition:none!important;scroll-behavior:auto;}
}

/* Keep the save action in document flow: a floating footer must not cover a field. */
.portal-body .program-order-workspace .sticky-actions {position:static;bottom:auto;box-shadow:none;background:transparent;padding:18px 0 0;border:0;}
.program-field[data-program-field="price_text"] {background:#f4f9fc;}
.program-field[data-program-field="price_text"] > p {font-weight:600;}
