.sdb-app { display: flex; flex-direction: column; min-height: 100vh; color: var(--color-text); background: var(--color-background); font-family: var(--font-family); font-size: var(--font-size-body); font-weight: 400; line-height: var(--line-height); }
.sdb-app[dir="rtl"], html[dir="rtl"] .sdb-app { direction: rtl; text-align: right; }
.sdb-app a { color: var(--btn-primary); transition: var(--transition); }
.sdb-surface, .sdb-card { padding: 20px; color: var(--color-text); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }
.sdb-card--interactive { cursor: pointer; transition: var(--transition); }.sdb-card--interactive:hover { box-shadow: var(--shadow-card-hover); transform: translateY(-2px); }
.sdb-filter-bar { display:flex; flex-wrap:wrap; gap:var(--space-2); padding:var(--space-2); background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-md); box-shadow:var(--shadow-card); }.sdb-filter-bar__search { position:relative; min-width:min(100%,260px); flex:1 1 260px; }.sdb-filter-bar__search input { width:100%; min-height:42px; padding-inline:38px 12px; box-sizing:border-box; }.sdb-filter-bar__search::before { position:absolute; z-index:1; top:50%; inset-inline-start:12px; color:var(--color-text-secondary); content:"⌕"; font-size:18px; transform:translateY(-50%); pointer-events:none; }.sdb-filter-bar select { min-height:42px; padding-inline:12px 34px; color:var(--color-text); background:#fff; }
.sdb-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: var(--space-2); padding: 10px var(--space-3); color: #fff; background: var(--btn-primary); border: 0; border-radius: var(--radius-sm); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; transition: var(--transition); }
.sdb-button{transition:background-color var(--transition-fast),transform .1s ease}.sdb-button:hover { color: #fff; background: var(--btn-primary-hover); }.sdb-button:active{transform:scale(.97)}.sdb-button:focus-visible, .sdb-app :is(a,button,input,select,textarea):focus-visible { outline: 0; box-shadow: 0 0 0 3px var(--color-focus); }
.sdb-button--outline { color: var(--btn-primary); background: transparent; border: 1px solid var(--btn-primary); }.sdb-button--outline:hover { color: var(--btn-primary); background: rgba(0,117,255,.08); }.sdb-button--danger { color: #dc2626; background: transparent; border: 1px solid #dc2626; }.sdb-button--danger:hover { color: #dc2626; background: rgba(220,38,38,.08); }.sdb-button--small { min-height:34px; padding:6px 12px; font-size:13px; }.sdb-button:disabled,.sdb-button[aria-disabled="true"] { color:#94a3b8; background:#e2e8f0; border-color:#e2e8f0; cursor:not-allowed; pointer-events:none; }
.sdb-app :is(input,select,textarea) { border: 1px solid var(--color-border); border-radius: var(--radius-sm); }.sdb-app :is(input,select,textarea):focus { border-color: var(--btn-primary); outline: 0; box-shadow: 0 0 0 3px var(--color-focus); }
.sdb-app input[type="checkbox"] { width:20px; height:20px; margin:0; accent-color:var(--btn-primary); border:1.5px solid #cbd5e1; border-radius:4px; transition:transform .1s ease; }.sdb-app input[type="checkbox"]:checked { transform:scale(1.08); }.sdb-dropzone { display:grid; min-height:160px; place-items:center; padding:var(--space-4); color:var(--color-text-secondary); border:2px dashed #cbd5e1; border-radius:var(--radius-md); text-align:center; cursor:pointer; transition:var(--transition); }.sdb-dropzone.is-dragover { color:var(--btn-primary); background:rgba(0,117,255,.05); border-color:var(--btn-primary); }
.sdb-table { width: 100%; border-collapse: collapse; }.sdb-table th{padding:12px;color:#fff;background:#012056;font-size:13px;font-weight:600;text-align:start}.sdb-table tr { transition: var(--transition); }.sdb-table tbody tr:hover { background: #f8fafc; }
.sdb-modal-overlay { position: fixed; z-index: 10000; inset: 0; display: grid; place-items: center; padding: var(--space-3); background: rgba(1, 32, 86, 0.4); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }.sdb-modal { width: min(100%, 680px); padding: 24px; background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-card-hover); }
.sdb-modal--small { max-width:480px; }.sdb-modal--large { max-width:720px; }.sdb-modal-overlay,.sdb-modal { animation:sdb-modal-in .15s ease both; }@keyframes sdb-modal-in{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.sdb-badge { display:inline-flex; padding:3px 10px; border-radius:9999px; font-size:12px; font-weight:500; line-height:1.4; }.sdb-badge--active,.sdb-badge--present{color:#16a34a;background:#dcfce7}.sdb-badge--inactive,.sdb-badge--absent,.sdb-badge--urgent{color:#dc2626;background:#fee2e2}.sdb-badge--normal{color:#475569;background:#f1f5f9}.sdb-badge--important{color:#d97706;background:#fef3c7}
.sdb-skeleton { overflow:hidden; background:#f1f5f9; border-radius:var(--radius-md); animation:sdb-pulse 1.5s ease-in-out infinite; }.sdb-skeleton--line{height:14px}.sdb-skeleton--card{min-height:140px}.sdb-empty-state{display:grid;min-height:136px;place-items:center;align-content:center;gap:var(--space-2);padding:var(--space-4);color:var(--color-text-secondary);background:#fff;border:1px dashed var(--color-border);border-radius:var(--radius-md);text-align:center}.sdb-empty-state__icon{font-size:32px;color:#cbd5e1}@keyframes sdb-pulse{50%{opacity:.55}}
.sdb-toasts { position:fixed; z-index:11000; top:var(--space-3); inset-inline-end:var(--space-3); display:grid; width:min(360px,calc(100vw - 32px)); gap:var(--space-2); }.sdb-toast { display:grid; grid-template-columns:4px 1fr auto; overflow:hidden; background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-md); box-shadow:var(--shadow-card-hover); animation:sdb-toast-in .15s ease both; }.sdb-toast::before{content:"";background:#16a34a}.sdb-toast--error::before{background:#dc2626}.sdb-toast__content{padding:12px}.sdb-toast__close{padding:0 12px;background:transparent;border:0;cursor:pointer}.sdb-toast.is-leaving{animation:sdb-toast-out .15s ease both}@keyframes sdb-toast-in{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}@keyframes sdb-toast-out{to{opacity:0;transform:translateX(16px)}}
.sdb-pagination { display:flex; align-items:center; justify-content:center; gap:var(--space-1); margin-top:var(--space-4); }.sdb-pagination button,.sdb-pagination a { display:grid; min-width:34px; height:34px; place-items:center; color:var(--color-text-secondary); background:transparent; border:0; border-radius:var(--radius-sm); text-decoration:none; }.sdb-pagination .is-current { color:#fff; background:var(--btn-primary); }.sdb-pagination [dir="rtl"] .sdb-pagination__direction { transform:scaleX(-1); }
@media (min-width: 768px) { .sdb-surface, .sdb-card { padding: 24px; } }