*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f4f7f9;color:#24313a}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:#fff;border-bottom:1px solid #dfe7ec;position:sticky;top:0}
.brand{font-weight:700;font-size:20px}
nav a{margin-left:18px;text-decoration:none;color:#263b4a}
.container{max-width:1180px;margin:0 auto;padding:24px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:20px 0}
.card{background:#fff;border:1px solid #dfe7ec;border-radius:12px;padding:20px;box-shadow:0 2px 8px rgba(0,0,0,.03)}
.metric{font-size:28px;font-weight:700;margin:8px 0}
.login-wrap{min-height:75vh;display:grid;place-items:center}
.login-card{width:min(430px,100%)}
.form,label,input,select,button{width:100%}
label{display:block;margin:14px 0 6px;font-weight:600}
input,select{padding:12px;border:1px solid #cbd8df;border-radius:8px}
button,.button-link{display:inline-block;margin-top:18px;padding:12px 16px;border:0;border-radius:8px;background:#22313b;color:#fff;text-decoration:none;cursor:pointer;text-align:center}
.alert{padding:12px;background:#fff3f3;border:1px solid #efbcbc;border-radius:8px;margin:12px 0}
.page-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.page-head .button-link{width:auto;margin:0}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse}
th,td{padding:12px;border-bottom:1px solid #e4ebef;text-align:left;white-space:nowrap}
@media(max-width:800px){.grid{grid-template-columns:1fr 1fr}.topbar{align-items:flex-start;gap:12px;flex-direction:column}nav a{margin:0 14px 0 0}}
@media(max-width:520px){.grid{grid-template-columns:1fr}.container{padding:14px}.page-head{align-items:stretch;flex-direction:column}.page-head .button-link{width:100%}}

textarea{width:100%;padding:12px;border:1px solid #cbd8df;border-radius:8px;resize:vertical}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.span-2{grid-column:span 2}
.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:20px}
.form-actions button{width:auto;margin:0}
.secondary-link{display:inline-block;padding:12px 16px;text-decoration:none;color:#263b4a}
.searchbar{display:grid;grid-template-columns:1fr auto;gap:10px;margin:16px 0}
.searchbar button{width:auto;margin:0}
.actions a{margin-right:10px}
.patient-grid{grid-template-columns:repeat(2,1fr)}
@media(max-width:650px){
 .form-grid,.patient-grid{grid-template-columns:1fr}
 .span-2{grid-column:span 1}
 .searchbar{grid-template-columns:1fr}
 .searchbar button{width:100%}
}

.agenda-tools{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:16px 0}
.agenda-tools form{display:flex;gap:8px;align-items:center}
.agenda-tools form input,.agenda-tools form select,.agenda-tools form button{width:auto;margin:0}
.view-buttons{display:flex;gap:8px}
.view-buttons a{padding:9px 12px;border:1px solid #cbd8df;border-radius:8px;text-decoration:none;color:#263b4a;background:#fff}
.inline-status{display:flex;gap:6px}
.inline-status select,.inline-status button{width:auto;margin:0;padding:8px}
.status{display:inline-block;padding:5px 8px;border-radius:999px;border:1px solid #cbd8df;text-transform:capitalize;font-size:12px}
@media(max-width:760px){
 .agenda-tools{align-items:stretch;flex-direction:column}
 .agenda-tools form{display:grid;grid-template-columns:1fr}
 .agenda-tools form input,.agenda-tools form select,.agenda-tools form button{width:100%}
 .view-buttons a{flex:1;text-align:center}
}

.check-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.check-grid label{display:flex;align-items:center;gap:8px;margin:0;font-weight:normal}
.check-grid input{width:auto}
.timeline-item{padding:14px 0;border-bottom:1px solid #e4ebef}
.timeline-item:last-child{border-bottom:0}
.head-actions{display:flex;gap:8px}
.head-actions .button-link{margin:0;width:auto}
.attachment-list{margin-top:18px}
@media(max-width:650px){.check-grid{grid-template-columns:1fr}.head-actions{flex-direction:column}}

.arch{display:grid;grid-template-columns:repeat(16,minmax(70px,1fr));gap:6px;margin:12px 0;overflow-x:auto;padding-bottom:8px}
.arch.compact{grid-template-columns:repeat(10,minmax(70px,1fr))}
.tooth{min-width:70px;min-height:105px;border:1px solid #d7e1e6;border-radius:10px;padding:8px;text-align:center;text-decoration:none;color:#263b4a;background:#fff;display:flex;flex-direction:column;gap:5px;justify-content:center}
.tooth:hover,.tooth.selected{border-width:2px}
.tooth.has-record{background:#f1f5f7}
.tooth-icon{font-size:27px;line-height:1}
.tooth small{font-size:10px;line-height:1.2}
.odontogram-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.legend{display:flex;gap:16px;flex-wrap:wrap}
.legend-item{border:1px solid #d7e1e6;border-radius:999px;padding:5px 10px;background:#fff}
@media(max-width:800px){.odontogram-columns{grid-template-columns:1fr}}

.financial-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.financial-summary div{border:1px solid #e0e8ed;border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:6px}
.financial-summary b{font-size:20px}
.treatment-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.danger-btn{background:#5e2a2a;margin-top:6px;padding:8px 10px}
@media(max-width:800px){
 .financial-summary{grid-template-columns:1fr 1fr}
 .treatment-columns{grid-template-columns:1fr}
}
@media(max-width:480px){.financial-summary{grid-template-columns:1fr}}

.financial-summary{margin:16px 0}
@media(max-width:650px){
 .head-actions{width:100%}
 .head-actions .button-link{width:100%}
}

.report-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.report-card{text-decoration:none;color:inherit;transition:transform .12s ease}
.report-card:hover{transform:translateY(-2px)}
.report-card h2{margin-top:0}
@media(max-width:850px){.report-grid{grid-template-columns:1fr 1fr}}
@media(max-width:550px){.report-grid{grid-template-columns:1fr}}
@media print{
 .no-print,.sidebar,.topbar,.head-actions{display:none!important}
 body{background:#fff}
 .content{margin:0!important;padding:0!important}
 .card{box-shadow:none!important;border:0!important}
 table{font-size:11px}
 a{text-decoration:none;color:#000}
}

.brand{display:flex;align-items:center;gap:10px}.brand-logo{max-height:42px;max-width:130px;object-fit:contain}
.clinic-logo-preview{max-width:240px;max-height:120px;object-fit:contain}
.inline-form{display:inline-block;margin-left:6px}.print-clinic-header{display:none}
.flash{padding:12px 14px;margin:0 0 15px;border-radius:8px}.flash.error{border:1px solid currentColor}.flash.success{border:1px solid currentColor}
@media print{
 .print-clinic-header{display:flex!important;align-items:center;gap:18px;border-bottom:1px solid #999;padding-bottom:12px;margin-bottom:18px}
 .print-clinic-header img{max-width:150px;max-height:80px;object-fit:contain}
 .no-print,form,.topbar{display:none!important}
}