/* Superfícies e estados de assinatura reutilizados nos dois painéis. */
.billing-invoices { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:16px; }
.invoice-card { margin:0; min-width:0; }
.invoice-heading { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:12px; }
.invoice-heading h3 { font-size:18px; overflow-wrap:anywhere; }
.invoice-amount { display:block; color:var(--accent); font-size:30px; margin:18px 0 6px; }
.invoice-card .detail-actions { margin-top:16px; }
.invoice-card .detail-actions .button { flex:1 1 150px; }
.billing-status { white-space:normal; }
.billing-paga,.billing-em_dia,.billing-aprovado { color:var(--green); background:color-mix(in srgb,var(--green) 12%,var(--surface)); }
.billing-atrasada,.billing-rejeitado { color:var(--red); background:color-mix(in srgb,var(--red) 12%,var(--surface)); }
.billing-em_teste,.billing-em_analise,.billing-pendente,.billing-aberta,.billing-em_aberto { color:var(--accent); background:var(--accent-soft); }
.billing-cancelada,.billing-cancelado,.billing-arquivado,.billing-pausado { color:var(--muted); background:var(--panel); }
.receipt-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; border-bottom:1px solid var(--border-soft); }
.receipt-row strong { overflow-wrap:anywhere; }
.receipt-row>div { min-width:0; }
.receipt-row>div:last-child { display:flex; flex-direction:column; align-items:flex-end; gap:12px; flex-shrink:0; }
.info-dialog .billing-pix-qr { display:block; width:min(100%,320px); height:auto; max-height:none; margin:20px auto; background:var(--text); }

.contract-values { width:100%; table-layout:fixed; border-collapse:collapse; margin:12px 0; }
.contract-values th,.contract-values td { padding:9px 10px; text-align:left; vertical-align:middle; border-bottom:1px solid var(--border-soft); white-space:normal; overflow-wrap:anywhere; }
.contract-values thead th { font-size:var(--fonte-12); color:var(--muted); font-weight:500; background:var(--panel); }
.contract-values thead th:first-child { width:56%; }
.contract-values tbody th { font-size:var(--fonte-13); font-weight:500; }
.contract-values td { font-size:var(--fonte-14); font-weight:600; }
.contract-values small { display:block; margin-top:3px; font-size:var(--fonte-11); font-weight:400; color:var(--muted); line-height:1.4; }
.contract-edit-table thead th:first-child { width:44%; }
.contract-edit-value { display:flex; align-items:center; gap:12px; }
.contract-edit-table .check-row { flex:none; margin:0; font-size:var(--fonte-12); font-weight:400; align-items:center; gap:7px; }
.contract-edit-table .field { flex:1; min-width:0; margin:0; }
.contract-edit-table input[type=text] { height:38px; min-height:38px; padding:7px 9px; font-size:var(--fonte-13); }
.contract-edit-table input:disabled { color:var(--muted); }
.contract-charge-editor>.subtle { font-size:var(--fonte-12); line-height:1.4; margin:8px 0; }
.contract-terms h3 { font-size:var(--fonte-16); margin:0 0 10px; }
.contract-terms>.subtle { margin:8px 0; font-size:var(--fonte-11); line-height:1.45; }
.contract-inclusions,.contract-extra { margin-top:12px; }
.contract-inclusions summary,.contract-extra summary { font-size:var(--fonte-12); cursor:pointer; color:var(--accent); margin-bottom:8px; }
.contract-inclusions p { margin:0; overflow-wrap:anywhere; }
.contract-editor { margin:16px 0; }
.contract-editor summary { cursor:pointer; color:var(--accent); margin-bottom:10px; font-weight:600; }
/* Assinatura: faixa de suporte, resumo do plano e duas colunas de conteúdo. */
#view-subscription { display:grid; grid-template-columns:minmax(0,1.68fr) minmax(300px,1fr); grid-template-rows:auto auto auto; gap:16px; align-items:start; }
#view-subscription[hidden] { display:none; }
#subscription-summary,.subscription-overview { display:contents; }
.subscription-support { position:relative; grid-column:1/-1; display:grid; grid-template-columns:36px auto minmax(0,1fr); align-items:center; gap:20px; min-width:0; padding:18px 24px; background:var(--studio-card); border:1px solid var(--studio-line); border-radius:16px; }
.subscription-support-icon { display:grid; place-items:center; flex:none; width:36px; height:36px; color:var(--accent); }
.subscription-support-icon .ui-icon { width:28px; height:28px; }
.subscription-support-copy { border-left:2px solid var(--accent); padding-left:20px; }
.subscription-support h3 { margin:0 0 3px; font-size:19px; }
.subscription-support .detail-actions { margin:0; display:flex; justify-content:center; flex-wrap:wrap; gap:18px; }
.subscription-support .button { min-height:44px; padding:10px 22px; min-width:180px; color:var(--accent); border-color:var(--accent); background:none; border-radius:28px; }
.subscription-plan { grid-column:1; min-width:0; padding:18px; border:1px solid var(--studio-line); border-radius:16px; background:var(--studio-card); }
.subscription-plan-heading { display:flex; align-items:center; flex-wrap:wrap; gap:14px; margin-bottom:14px; }
.subscription-plan-heading h3 { display:flex; align-items:center; gap:12px; font-size:21px; line-height:1.3; margin:0; }
.subscription-plan-heading h3>.ui-icon { color:var(--accent); width:26px; height:26px; }
#subscription-status .badge { border-radius:14px; }
.subscription-schedule { display:grid; grid-template-columns:1.2fr 1fr 1.06fr; gap:14px; }
.subscription-schedule>section { display:flex; flex-direction:column; gap:8px; min-width:0; padding:14px 18px; background:var(--studio-card); border:1px solid var(--studio-line); border-radius:13px;  }
.subscription-schedule>section>span:first-child,.subscription-schedule>section>p:first-child { display:flex; align-items:center; gap:10px; margin:0; font-size:12px; color:var(--text); }
.subscription-schedule .ui-icon { width:22px; height:22px; color:var(--accent); flex:none; }
.subscription-schedule>.subscription-next { border-color:var(--accent); background:linear-gradient(135deg,var(--accent-soft),var(--studio-black)); box-shadow:inset 0 0 12px color-mix(in srgb,var(--accent) 15%,transparent); }
#subscription-next-due { font-size:29px; line-height:1.2; color:var(--accent); white-space:nowrap; }
.subscription-next>span,.subscription-trial small { font-size:12px; color:var(--muted); }
.subscription-price strong { font-size:25px; line-height:1.3; color:var(--text); margin-top:4px; overflow-wrap:anywhere; }
.subscription-trial strong { font-size:19px; line-height:1.3; color:var(--text); }
#subscription-next-note { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#subscription-contract { grid-column:1; min-width:0; padding:18px; background:var(--studio-card); border:1px solid var(--studio-line); border-radius:16px; }
#view-subscription .contract-terms h3 { font-size:20px; margin:0 0 16px; }
#view-subscription .contract-values { border-collapse:separate; border-spacing:0; border:1px solid var(--studio-line); border-radius:12px; overflow:hidden; margin:0 0 14px; }
#view-subscription .contract-values thead th { background:linear-gradient(#272a2b,#202324); }
#view-subscription .contract-values th,#view-subscription .contract-values td { padding:7px 12px; font-size:12px; }
#view-subscription .contract-values thead th:first-child { width:54%; }
#view-subscription .contract-values tbody tr:last-child>* { border-bottom:0; }
#view-subscription .contract-terms>.subtle { padding-left:26px; position:relative; font-size:14px; line-height:1.6; }
#view-subscription .contract-terms>.subtle::before { content:"i"; position:absolute; left:5px; top:0; width:15px; height:15px; border:1px solid var(--accent); color:var(--accent); border-radius:50%; display:grid; place-items:center; font-size:11px; }
#view-subscription .contract-inclusions { margin-top:16px; }
#view-subscription .contract-inclusions summary { padding:10px 16px; margin:0; border:1px solid var(--accent); border-radius:12px; background:linear-gradient(100deg,var(--accent-soft),transparent); font-size:14px; font-weight:600; }
#view-subscription .contract-inclusions[open] summary { margin-bottom:10px; }
.subscription-records { grid-column:2; grid-row:2/4; display:grid; gap:16px; min-width:0; }
#view-subscription .subscription-records>.admin-panel { margin:0; padding:22px 26px; background:var(--studio-card); border:1px solid var(--studio-line); border-radius:16px; }
#view-subscription .subscription-records .panel-heading { margin-bottom:12px; border-bottom:1px solid var(--studio-line); padding-bottom:12px; }
#view-subscription .panel-heading h3 { display:flex; align-items:center; gap:12px; font-size:20px; }
#view-subscription .panel-heading h3>.ui-icon { color:var(--accent); width:23px; height:23px; }
#view-subscription .subscription-records .panel-heading h3::before { content:none; }
#view-subscription .empty { padding:0; margin:0; text-align:left; font-size:12px; line-height:1.65; }
#view-subscription .billing-invoices { grid-template-columns:minmax(0,1fr); }
#view-subscription .invoice-card { padding:14px; margin:0; }
#view-subscription .invoice-card h3 { font-size:15px; }
#view-subscription .invoice-card p { margin:8px 0; }
#view-subscription .invoice-amount { font-size:26px; margin:12px 0 6px; }
#view-subscription .invoice-card .detail-actions { margin-top:12px; }
.admin-body:has(#view-subscription:not([hidden])) .admin-header { position:relative; overflow:hidden; background:linear-gradient(155deg,#080909 55%,#282000 85%,#080909); min-height:84px; padding-top:14px; padding-bottom:14px; }
.admin-body:has(#view-subscription:not([hidden])) .admin-header::before { content:""; position:absolute; left:20%; top:-80px; width:34%; height:130px; border-bottom:2px solid var(--accent); transform:rotate(-18deg); background:linear-gradient(transparent,color-mix(in srgb,var(--accent) 18%,transparent)); pointer-events:none; }
.admin-body:has(#view-subscription:not([hidden])) .admin-header>div { position:relative; }
#admin-main:has(>#view-subscription:not([hidden])) { padding-top:18px; padding-bottom:18px; }
@media(max-width:1350px){
 .subscription-schedule { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .subscription-schedule>.subscription-trial { grid-column:1/-1; flex-direction:row; align-items:center; flex-wrap:wrap; }

}
@media(max-width:1000px){
 #view-subscription { grid-template-columns:minmax(0,1fr); }
 .subscription-records { grid-column:1; grid-row:auto; }
 .subscription-support .detail-actions { margin-left:0; }
 .subscription-schedule { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .subscription-schedule>.subscription-trial { grid-column:auto; flex-direction:column; align-items:flex-start; }
}
@media(max-width:650px){
 .subscription-schedule { grid-template-columns:minmax(0,1fr); }
 .subscription-schedule>.subscription-trial { grid-column:auto; }
 .subscription-support-copy { padding-left:14px; }
 .subscription-support-icon { width:28px; height:28px; }
 .subscription-support .detail-actions { width:100%; gap:10px; }
 .subscription-support .button { flex:1 1 135px; min-width:0; padding:8px 10px; font-size:12px; gap:6px; }
 #view-subscription .subscription-records>.admin-panel { padding:18px; }
 .contract-edit-value { flex-wrap:wrap; gap:6px; }
 .contract-edit-table .field { flex-basis:100%; }
}

.contract-label-short { display:none; }
.contract-terms h3 { display:flex; align-items:center; gap:12px; }
.contract-terms h3>.ui-icon { flex:none; width:26px; height:26px; color:var(--accent); }
@media(max-width:600px){.contract-label-long{display:none}.contract-label-short{display:inline;white-space:nowrap}}

@media(max-width:1100px){.subscription-support{grid-template-columns:32px auto;gap:14px}.subscription-support .detail-actions{grid-column:1/-1}}

@media(min-width:1351px){
 .subscription-support { min-height:88px; padding-right:340px; }
 .subscription-support .detail-actions { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); flex-wrap:nowrap; width:max-content; }
}
@media(min-width:1101px) and (max-width:1350px){
 .subscription-support { grid-template-columns:36px minmax(0,1fr); }
 .subscription-support .detail-actions { grid-column:1/-1; justify-self:center; }
}