/* Shared insets keep headers, bodies and empty states on the same edge. */
:root{--record-inset:24px}
.record-panel{margin:24px 0;padding:var(--record-inset)}
.record-section{margin:24px 0}
.record-panel h2,.record-section h2{margin:0;font-size:19px;line-height:1.4;letter-spacing:-.25px}
.record-panel h3,.record-section h3{margin:4px 0 8px;font-size:17px;line-height:1.4;overflow-wrap:anywhere}
.record-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}
.record-section-head>div{min-width:0}
.record-section-head p{margin:5px 0 0;font-size:13px;line-height:1.6;color:var(--secondary)}
.record-section-head>button{flex-shrink:0}
.record-empty{padding:var(--record-inset);color:var(--secondary);font-size:14px;line-height:1.65}
.record-panel>.record-empty{padding:18px 20px;background:var(--soft);border-radius:10px}
.record-empty>.secondary{margin:12px 0 0;display:flex}

/* Dates, their explanation and the edit action form one compact card. */
.family-dates.record-dates-block{display:block;margin:0 0 16px;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}
.record-dates{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;padding:0}
.record-dates>span{display:flex;flex-direction:column;justify-content:space-between;gap:8px;padding:16px 18px;font-size:12px;line-height:1.5;color:var(--secondary);min-width:0;border-right:1px solid var(--line)}
.record-dates>span:last-child{border-right:0}
.record-dates b{margin:0;font-size:14px;font-weight:600;color:var(--ink);white-space:normal;font-variant-numeric:tabular-nums}
.record-dates b.is-missing{font-weight:400;color:var(--muted)}
.record-dates-footer{display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;padding:4px 18px;border-top:1px solid var(--line);background:#fcfcfa}
.record-dates-footer>.text-btn{margin-left:auto;font-size:12px;padding:8px 0;min-height:36px}
.record-migration-note{font-size:12px;color:var(--secondary);margin:0;line-height:1.6}
.record-sort{display:flex;gap:12px;align-items:center;justify-content:flex-end;font-size:12px;color:var(--secondary);margin:-4px 0 16px}
.record-sort select{width:auto;max-width:260px;min-height:38px}
.family-pdr{white-space:nowrap;font-size:13px}
.record-social{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:20px}
.record-social>div{display:flex;flex-direction:column;gap:6px}
.record-social span,.record-social small{font-size:12px;color:var(--secondary)}

.record-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.record-person{display:grid;grid-template-columns:40px minmax(0,1fr);align-content:start;gap:8px 12px;padding:20px;border:1px solid var(--line);border-radius:12px;min-width:0}
.record-person .grow{min-width:0}
.record-person h3{margin:4px 0 6px;font-size:16px;line-height:1.5}
.record-person .small{font-size:13px;line-height:1.65;margin-top:8px;overflow-wrap:anywhere}
.record-person .small b{font-weight:550}
.record-person-icon{width:40px;height:40px;border-radius:10px;background:var(--green-soft);display:grid;place-items:center;color:var(--green)}
.record-eyebrow{font-size:12px;line-height:1.5;color:var(--secondary)}
.record-latin{font-size:12px;color:var(--secondary);line-height:1.5;overflow-wrap:anywhere}
.record-tools{display:flex;gap:4px;flex-wrap:wrap;align-items:center;flex-shrink:0}
.record-tools button{font-size:12px;padding:8px 10px}
.record-person .record-tools{grid-column:2;justify-content:flex-start;margin-left:-10px}
.record-archive{margin-top:20px}
.record-archive>.record-person{margin-top:12px}
.record-archive>summary,.record-section>details>summary{font-size:13px;color:var(--secondary);padding:10px 0}
.record-custom{margin:20px 0 0}
.record-custom>div{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,2fr) auto;gap:16px;padding:16px 0;border-top:1px solid var(--line);align-items:start}
.record-custom dt{font-size:13px;color:var(--secondary);overflow-wrap:anywhere}
.record-custom dt small{display:block;margin-top:5px;line-height:1.5}
.record-custom dd{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.6}

/* Totals and the arrival payment can be scanned without a tall banner. */
.record-finance-header{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));gap:12px;margin:0 0 24px;max-width:100%}
.record-finance-summary{display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px;min-width:0;padding:18px 22px;background:#eef5ef;border:1px solid #d4e4d8;border-radius:12px;text-align:left;color:#1d4436}
.record-finance-summary:hover{border-color:#9fbea8;background:#eaf2ec}
.record-finance-total,.record-finance-due{display:grid;gap:6px;flex:1 1 240px;min-width:0}
.record-finance-title{font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.record-finance-summary strong{display:block;font-size:26px;font-weight:650;line-height:1.3;letter-spacing:-.6px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.record-finance-summary small{display:block;font-size:12px;line-height:1.6;color:#486255;overflow-wrap:anywhere}
.record-finance-summary b{font-size:14px;font-weight:600;overflow-wrap:anywhere}
.record-finance-summary.is-empty{gap:4px;align-items:flex-start;flex-direction:column;background:var(--surface);border-style:dashed}
.record-finance-summary.is-empty>span{font-size:12px;color:var(--secondary)}
.record-finance-summary.is-empty strong{font-size:17px;letter-spacing:0}
.record-contract{padding:var(--record-inset);margin-bottom:20px}
.record-contract>.record-section-head:first-child{margin-bottom:0;align-items:center}
.record-money-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:20px 0}
.record-money-grid>div{padding:16px;background:#f6f7f3;border-radius:10px}
.record-money-grid span{font-size:12px;color:var(--secondary);display:block;margin-bottom:8px;line-height:1.5}
.record-money-grid strong{font-size:20px;line-height:1.35;letter-spacing:-.4px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.record-money-grid .record-arrival-payment{background:#edf5ee;color:#23553e}
.record-contract h4{font-size:14px;line-height:1.5;margin:24px 0 12px}
.record-contract>.record-section-head:not(:first-child){align-items:center;margin:24px 0 4px}
.record-contract>.record-section-head h4{margin:0}
.record-schedule>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,.5fr) 172px;align-items:center;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}
.record-schedule>div>span{min-width:0;overflow-wrap:anywhere}
.record-schedule>div>span:nth-child(2){text-align:right;font-variant-numeric:tabular-nums}
.record-schedule button{font-size:13px;padding:10px 12px}
.record-payments>div{display:flex;align-items:center;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}
.record-payments>div>span:first-child{flex:1;min-width:0;overflow-wrap:anywhere}
.record-schedule small,.record-payments small{display:block;color:var(--secondary);font-size:12px;margin-top:5px;line-height:1.6}
.record-payments p{font-size:13px;line-height:1.6;margin-top:6px;white-space:pre-wrap;overflow-wrap:anywhere}
.record-payments .is-void{opacity:.65}
.record-payments .is-void b{text-decoration:line-through}
.record-prose{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7}
.record-visit{padding:var(--record-inset);margin-bottom:16px}
.record-visit .between{gap:8px 16px;flex-wrap:wrap}
.record-visit h3{margin:12px 0 16px}
.record-visit .record-prose{margin-bottom:20px;font-size:14px;max-width:85ch}
.record-visit>.secondary{margin:0 8px 10px 0;white-space:normal;text-align:left;max-width:100%;overflow-wrap:anywhere}
.record-visit>.meta{padding-top:16px;border-top:1px solid var(--line);line-height:1.6}

.record-birthday-inputs{border:1px solid var(--line);border-radius:12px;margin:0 0 20px;padding:16px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.record-birthday-inputs legend{font-size:12px;padding:0 6px;color:var(--secondary)}
.record-schedule-edit{padding:16px;background:#f6f7f3;border:1px solid var(--line);border-radius:12px;margin-bottom:12px}
.record-schedule-edit>.fields{margin-bottom:10px}
.record-schedule-edit .text-btn{font-size:12px}
.record-archive-control{margin-top:20px}
.record-history article{padding:18px 0;border-bottom:1px solid var(--line)}
.record-history h3{font-size:16px}
.record-field-row{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:18px 0;border-top:1px solid var(--line)}
.record-field-row>div:first-child{min-width:0;overflow-wrap:anywhere}
.record-lead-details{margin-top:24px}
.record-birthday-detail h3{font-size:24px;line-height:1.35;margin:8px 0 12px;overflow-wrap:anywhere}
.record-birthday-detail p{margin-top:8px;line-height:1.6}
.record-panel select[multiple]{height:auto;min-height:120px}
.record-contract:target{outline:2px solid var(--green);outline-offset:3px}

/* The birthday card uses the same inset in every state, including failures. */
.record-birthdays .work-panel-head{align-items:flex-start}
.record-birthday-state{padding:4px var(--work-inset,22px) 24px}
.record-birthday-state h3{font-size:14px;line-height:1.5;font-weight:550;color:var(--ink);margin:0 0 8px}
.record-birthday-state p{font-size:13px;line-height:1.7;color:var(--secondary);margin:0;overflow-wrap:anywhere}
.record-birthday-state .secondary{margin-top:16px;font-size:13px}
.record-birthday{display:grid;grid-template-columns:44px minmax(0,1fr) 15px;align-items:center;gap:14px;width:100%;background:transparent;border:0;border-top:1px solid #edf0e9;padding:16px var(--work-inset,22px);text-align:left;color:var(--ink)}
.record-birthday:hover{background:#f6f9f4}
.record-birthday:focus-visible{outline-offset:-3px}
.record-birthday-date{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-height:52px;border:1px solid #e2e9de;border-radius:10px;background:#f5f8f1;color:#45624c;font-variant-numeric:tabular-nums}
.record-birthday-date strong{font-size:20px;line-height:1.2;font-weight:600}
.record-birthday-date span{font-size:11px;line-height:1.5}
.record-birthday-copy{min-width:0}
.record-birthday-copy>b{display:block;font-size:14px;line-height:1.5;font-weight:550;overflow-wrap:anywhere}
.record-birthday-copy>small{display:block;font-size:12px;line-height:1.5;color:var(--secondary);margin-top:4px;overflow-wrap:anywhere}
.record-birthday>svg{color:#8a9787;flex-shrink:0}
.record-birthday.is-today .record-birthday-date{background:var(--green-soft);border-color:#b8d1be;color:var(--green)}
.record-birthday-badges{display:flex;flex-wrap:wrap;gap:4px 8px;margin-top:6px}
.record-birthday-badges>span{display:inline-flex;align-items:center;gap:4px;font-size:11px;line-height:1.5;color:var(--green)}
.record-birthday-badges .is-greeted{color:var(--secondary)}

@media(max-width:1100px){
 .record-money-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .record-people{grid-template-columns:1fr}
 .record-dates{grid-template-columns:repeat(3,minmax(0,1fr))}
 .record-dates>span:nth-child(3){border-right:0}
 .record-dates>span:nth-child(-n+3){border-bottom:1px solid var(--line)}
 .record-schedule>div{grid-template-columns:minmax(0,1fr) minmax(100px,.5fr);gap:10px 16px}
 .record-schedule>div>button{grid-column:1/-1;justify-self:start}
}
@media(max-width:650px){
 :root{--record-inset:18px}
 .record-panel,.record-section{margin:18px 0}
 .record-section-head{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:16px}
 .record-section-head>.primary,.record-section-head>.secondary{width:100%;justify-content:center}
 .record-panel>.between{align-items:flex-start;gap:8px;flex-wrap:wrap}
 .record-dates{grid-template-columns:repeat(2,minmax(0,1fr))}
 .record-dates>span{padding:12px 14px;gap:6px}
 .record-dates>span:nth-child(3){border-right:1px solid var(--line)}
 .record-dates>span:nth-child(2n){border-right:0}
 .record-dates>span:nth-child(-n+4){border-bottom:1px solid var(--line)}
 .record-dates-footer{padding:8px 14px;gap:4px}
 .record-dates-footer>.text-btn{margin-left:0}
 .record-finance-summary{padding:16px;gap:14px}
 .record-finance-summary strong{font-size:24px}
 .record-finance-due{padding-top:12px;border-top:1px solid #d4e4d8}
 .record-money-grid{gap:8px;padding:16px 0}
 .record-money-grid strong{font-size:18px}
 .record-money-grid>div{padding:12px}
 .record-person{padding:16px;grid-template-columns:32px minmax(0,1fr);gap:8px 10px}
 .record-person-icon{width:32px;height:32px;border-radius:8px}
 .record-person .record-tools{grid-column:1/-1;border-top:1px solid var(--line);margin:4px 0 -4px;padding-top:6px}
 .record-person .record-tools button{flex:1;justify-content:center;min-height:40px}
 .record-schedule>div{grid-template-columns:minmax(0,1fr) minmax(80px,.6fr);gap:12px}
 .record-schedule>div>button{width:100%;justify-content:center}
 .record-payments>div{flex-wrap:wrap;gap:8px}
 .record-payments>div>span:first-child{flex-basis:100%}
 .record-payments>div>button{padding:8px 0;font-size:12px}
 .record-contract>.record-section-head:first-child{align-items:flex-start}
 .record-contract>.record-section-head:not(:first-child){align-items:flex-start;gap:8px}
 .record-contract>.record-section-head:not(:first-child)>.text-btn{padding:6px 0;font-size:13px}
 .record-custom>div{grid-template-columns:1fr auto;gap:8px}
 .record-custom dd{grid-column:1;grid-row:2}
 .record-custom button{grid-column:2;grid-row:1/3}
 .record-sort{justify-content:space-between;gap:8px}
 .record-sort select{max-width:210px;min-width:0}
 .record-schedule-edit .fields{grid-template-columns:1fr}
 .record-birthday-inputs{padding:12px;gap:8px}
 .record-birthday-inputs .field{min-width:0}
 .record-birthday-inputs input{padding:9px}
 .record-field-row{align-items:flex-start;flex-wrap:wrap;gap:8px}
 .record-field-row .record-tools{margin-left:-10px}
 .family-pdr{font-size:12px}
 .record-social{gap:12px}
}

/* Native checkboxes make multiple selection explicit on mouse, touch and keyboard. */
.record-choices{min-width:0;margin:0 0 20px;padding:0;border:1px solid var(--line);border-radius:10px}
.record-choices legend{max-width:100%;padding:0 6px;margin-left:10px;font-size:14px;line-height:1.5}
.record-choice-list{max-height:220px;overflow-y:auto;padding:6px;overscroll-behavior:contain}
.record-choice-list label{display:flex;align-items:flex-start;gap:10px;min-height:42px;padding:10px;border-radius:6px;font-size:13px;line-height:1.5;cursor:pointer}
.record-choice-list label:hover,.record-choice-list label:has(:checked){background:var(--green-soft)}
.record-choice-list label:focus-within{outline:2px solid #428d70;outline-offset:-2px}
.record-choice-list input{width:17px;height:17px;min-height:17px;flex:0 0 17px;padding:0;margin:1px 0 0;accent-color:var(--green)}
.record-choice-list span{min-width:0;overflow-wrap:anywhere}
.record-choices>.meta{padding:12px 16px;font-size:13px;line-height:1.6}
#record-schedule-rows{margin-top:12px}
@media(max-width:640px){
 /* Family details remain accessible from the chat header without covering messages. */
 .mobile-chat .record-dates-block,.mobile-chat .record-finance-header{display:none}
}
