/*
  Account Book UI (Bootstrap 5)
  - Keeps legacy pages working, but improves layout + mobile responsiveness.
*/

:root{
  --app-sidebar-width: 270px;
}

html, body{ height:100%; }

body{
  background: #f6f7fb;
}

.app-shell{
  min-height: 100vh;
}

.app-brand{
  font-weight: 800;
  letter-spacing: .2px;
}

.app-brand span{
  opacity: .85;
}

.sidebar-avatar{
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 50%;
}

.sidebar-link{
  display:flex;
  align-items:center;
  gap:.6rem;
  padding:.55rem .75rem;
  border-radius: .75rem;
  color: #2c3440;
  text-decoration:none;
}

.sidebar-link:hover{
  background: rgba(13,110,253,.08);
  color: #0d6efd;
}

.sidebar-link.active{
  background: rgba(13,110,253,.14);
  color: #0d6efd;
  font-weight: 600;
}

.sidebar-section-title{
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #6c757d;
  margin: 1rem .25rem .35rem;
}

/* Legacy helpers used in older pages */
.logo2{ font-weight: 700; }
.border{ border: 1px solid rgba(0,0,0,.12); }

/* Dashio/Bootstrap3 legacy compatibility (minimal) */
.img-circle{ border-radius: 50% !important; }
.btn-theme{
  background: #0d6efd;
  border-color: #0d6efd;
  color: #fff;
}
.btn-theme:hover{ background:#0b5ed7; border-color:#0a58ca; color:#fff; }
.btn-block{ width:100%; }
.pull-right{ float:right !important; }
.text-center{ text-align:center !important; }

/* Makes table layouts usable on phones without rewriting every page */
@media (max-width: 767.98px){
  table.form-table, table.form-table tbody, table.form-table tr, table.form-table td{
    display:block;
    width:100% !important;
  }
  table.form-table td{
    padding: .25rem .25rem !important;
    border: none !important;
  }
  table.form-table tr{
    margin-bottom: .75rem;
    padding: .75rem;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 1rem;
    background: #fff;
  }
  table.form-table td:first-child{
    font-weight: 600;
    color: #495057;
  }
}

/* Print-friendly */
@media print{
  .no-print{ display:none !important; }
  body{ background:#fff; }
}