:root{
  --rl-font:'Ubuntu',sans-serif;
  --rl-text:#212529;
  --rl-bg:#fdfdfd;
  --rl-brand:#0d6efd;
  --rl-muted:#6c757d;
  --rl-border:var(--bs-border-color,#dee2e6);
  --rl-radius-sm:.375rem;
  --rl-radius-md:.5rem;
  --rl-radius-lg:.75rem;
  --rl-shadow-sm:0 2px 8px rgba(0,0,0,.04);
}

html,body{height:100%}
body{
  font-family:var(--rl-font);
  font-size:1.15rem;
  background:var(--rl-bg);
  color:var(--rl-text);
  line-height:1.6;
}
.wrapper{display:flex;flex-direction:column;min-height:100vh}
main{flex-grow:1}

a{color:var(--rl-brand);text-decoration:none}
a:hover,a:focus{text-decoration:underline}
a:focus,button:focus,input:focus,select:focus,textarea:focus{
  outline:3px solid var(--rl-brand);outline-offset:2px
}

.base__logo{font-size:1.5rem;color:#fff;text-decoration:none}

.btn,.form-control,.form-select{font-size:1.1rem}
form .form-label{font-weight:600}
.card input.form-control{font-size:1rem}
.text-danger{font-size:.875rem}
.form-text{font-size:.875rem;color:var(--rl-muted)}

.footer p{margin-bottom:0;font-size:1rem}

.card-profile{max-width:660px;margin:auto}
@media (max-width:576px){.card-profile{padding:1rem}}

.avatar-editable{cursor:pointer;border:3px solid transparent;transition:.3s}
.avatar-editable:hover{transform:scale(1.03);box-shadow:0 0 15px rgba(13,110,253,.3)}

.avatar-menu{
  position:absolute;top:calc(100% + .5rem);left:0;min-width:200px;
  background:#fff;border:1px solid #ccc;border-radius:var(--rl-radius-md);
  box-shadow:0 4px 20px rgba(0,0,0,.15);font-size:1rem;padding:.25rem 0;
  opacity:0;visibility:hidden;pointer-events:none;transition:.2s;z-index:1000
}
.avatar-menu.show{opacity:1;visibility:visible;pointer-events:auto}
.avatar-menu .dropdown-item{
  width:100%;text-align:left;background:none;border:0;padding:.5rem 1rem;
  font-size:.95rem;display:flex;align-items:center;gap:.5rem
}
.avatar-menu .dropdown-item:hover{background:#f8f9fa}
.avatar-menu .dropdown-item.text-danger:hover{color:#dc3545}

@media (max-width:768px){
  .card-profile .row.g-3 .col-6{flex:0 0 100%;max-width:100%}
  .card-profile .position-relative{padding-top:2rem}
}

#dropzone,#drop-zone{cursor:pointer;transition:background .2s}
#dropzone.dragover,#drop-zone.dragover{background:#e3f2fd}
.file-card{
  background:#f8f9fa;border:1px dashed #ccc;border-radius:var(--rl-radius-md);
  padding:.5rem;margin-bottom:.5rem
}

.patient-search-form input.form-control{
  flex:1;min-width:250px;max-width:400px;border-radius:var(--rl-radius-md)
}
.patient-search-form button.btn{white-space:nowrap;font-weight:600;padding:.5rem 1rem}
.patient-list .list-group-item{border-radius:var(--rl-radius-md);transition:box-shadow .2s}
.patient-list .list-group-item:hover{box-shadow:0 2px 12px rgba(0,0,0,.08)}
.patient-list .list-group-item span{font-size:1.1rem;font-weight:500;color:#2d3436}
.patient-list .btn-outline-primary{font-weight:500;transition:.2s}
.patient-list .btn-outline-primary:hover{background:var(--rl-brand);color:#fff}

.pagination{margin-top:1rem}
.pagination .page-link{border-radius:.4rem}
.pagination .page-item.active .page-link{font-weight:600}

.blog-card{
  display:flex;gap:1rem;border-radius:var(--rl-radius-md);
  transition:transform .2s;overflow:hidden;min-height:160px
}
.blog-card:hover{transform:translateY(-2px)}
.blog-card .blog-card-img{
  flex-shrink:0;width:160px;aspect-ratio:4/3;object-fit:cover;
  border-radius:var(--rl-radius-md) 0 0 var(--rl-radius-md)
}
.blog-card .card-body{
  padding:1rem 1.25rem;display:flex;flex-direction:column;
  justify-content:space-between;flex:1
}
.blog-card .card-title{font-size:1.25rem;margin-bottom:.5rem}
.blog-card .card-text{font-size:.9rem;color:#555}
.blog-card .badge{font-size:.75rem;margin-right:6px}
.blog-card .stretched-link{position:relative;z-index:1}
@media (max-width:576px){
  .blog-card{flex-direction:column;align-items:center}
  .blog-card .blog-card-img{width:100%;aspect-ratio:16/9;border-radius:var(--rl-radius-md) var(--rl-radius-md) 0 0}
  .blog-card .card-body{padding:1rem}
}

.article-container{max-width:800px;padding:2rem 1rem}
.article-title{font-size:2.2rem;margin-bottom:1.5rem}
.article-intro{font-size:1.2rem;color:#444}

.comment{padding:1rem;background:#f8f9fa;border-radius:.25rem}

.nav-link .badge{font-size:.65rem;line-height:1;transform:translate(50%,-50%)}
.dropdown-item.bg-light{background:#f8f9fa!important}

.feed-container{max-width:820px;margin-inline:auto}

.post-card{
  border:1px solid var(--rl-border);
  border-radius:14px;
  box-shadow:var(--rl-shadow-sm);
}

.post-header > img.avatar{
  width:40px !important;
  height:40px !important;
  object-fit:cover;
  flex:0 0 40px !important;
  display:inline-block;
  border-radius:50%;
}
@media (max-width:576px){
  .post-header > img.avatar{width:36px !important;height:36px !important;flex-basis:36px !important}
}
.post-meta{color:var(--rl-muted);font-size:.875rem}

.post-img-single{
  display:block;
  margin:0 auto;
  max-width:100%;
  height:auto;
  max-height:520px;
  object-fit:contain;
  border-radius:.75rem;
}
.post-gallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.5rem;
}
@media (min-width:768px){
  .post-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.post-thumb{aspect-ratio:1/1;overflow:hidden;border-radius:.5rem}
.post-thumb img{width:100%;height:100%;object-fit:cover;display:block}

.post-actions{border-top:1px solid var(--rl-border);padding-top:.5rem}

.post-actions-menu .btn{padding:.25rem .5rem}
.post-actions-menu .dropdown-menu{min-width:220px}
.post-actions-menu .dropdown-item .bi{opacity:.9;vertical-align:-0.1em}

.btn-icon{
  width:2.25rem;height:2.25rem;display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;padding:0;line-height:1;
}
.btn-icon .bi{font-size:1rem}

.article-main-image{
  background:#f8f9fa;
  border-radius:.75rem;
  overflow:hidden;
  display:block;
  width:100%;
  aspect-ratio:16/9;
}
@media (max-width:576px){
  .article-main-image{aspect-ratio:4/3}
}
.article-main-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.article-body img,
.richtext img{
  max-width:100%;
  width:100%;
  height:auto;
  margin:1rem 0;
  border-radius:.5rem;
  display:block;
}
.richtext .richtext-image.left,
.richtext .richtext-image.right{max-width:min(50%,420px)}
@media (max-width:768px){
  .richtext .richtext-image.left,
  .richtext .richtext-image.right{
    float:none!important;
    margin:1rem 0;
    max-width:100%;
  }
}

.blog-thumb{
  width:320px;
  aspect-ratio:16/10;
  display:block;
  background:#f8f9fa;
  border-radius:.5rem 0 0 .5rem;
  overflow:hidden;
}
.blog-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
@media (max-width:576px){
  .blog-thumb{
    width:100%;
    aspect-ratio:16/9;
    border-radius:.5rem .5rem 0 0;
  }
}

.btn-like .bi{transition:transform .15s ease}
.btn-like.active .bi{transform:scale(1.15);color:#dc3545}

.author-avatar,.comment-avatar{object-fit:cover}
.card-thumb{
  width:160px;
  aspect-ratio:4/3;
  border-radius:var(--rl-radius-md) 0 0 var(--rl-radius-md);
  overflow:hidden;
  background:#f8f9fa;
  display:block;
}
.card-thumb > img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.card-thumb--empty{
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--rl-muted);
  font-size:.9rem;
}
@media (max-width:576px){
  .card-thumb{
    width:100%;
    aspect-ratio:16/9;
    border-radius:var(--rl-radius-md) var(--rl-radius-md) 0 0;
  }
}
