:root{
  --bg: #f4f6fb;
  --card: #ffffff;
  --text: #111827;
  --muted: #6b7280;
  --border: rgba(17,24,39,.10);
  --shadow: 0 10px 30px rgba(17,24,39,.10);
}

body{
  background: var(--bg);
  color: var(--text);
}

a{color: inherit;}

.card{border:0;border-radius:18px;background:var(--card); box-shadow: var(--shadow);}
.table-responsive{border-radius:16px; overflow:hidden;}

.form-control,.form-select{border-radius:12px;}
.btn{border-radius:12px;}

.navbar{box-shadow: 0 10px 30px rgba(17,24,39,.08);}
.navbar .nav-link.active{font-weight:700;}

.bell{font-size:20px;}
.badge-dot{
  position:absolute; top:-6px; right:-10px;
  min-width:20px; height:20px;
  border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:800;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
}

/* Public topbar */
.public-topbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px;
  padding:10px 0 18px 0;
}
.brand{
  display:flex; align-items:center; gap:10px;
}
.brand img{width:34px;height:34px;border-radius:12px;background:#fff;object-fit:contain;border:1px solid var(--border);}
.brand .title{font-weight:900; font-size:18px;}
.brand .subtitle{color: var(--muted); font-size:12px;}

/* Tiles */
.tile-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 160px));
  gap:14px;
  justify-content:center;
}

@media (max-width: 420px){
  .tile-grid{
    grid-template-columns: repeat(auto-fill, minmax(150px, 150px));
    justify-content:center;
  }
}

.tile{
  text-align:center;

  position:relative;
  background: var(--card);
  border:1px solid var(--border);
  border-radius:18px;
  padding:14px;
  text-decoration:none;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  min-height:128px;
  overflow:hidden;
  box-shadow: 0 10px 22px rgba(17,24,39,.06);
}
.tile:hover{
  transform: translateY(-2px);
  border-color: rgba(17,24,39,.16);
  box-shadow: 0 14px 30px rgba(17,24,39,.12);
}

.tile .logo{
  margin: 0 auto;

  width:56px; height:56px;
  border-radius:16px;
  background: #fff;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  border:1px solid var(--border);
}
.tile .logo img{width:100%; height:100%; object-fit:contain;}

.tile .name{
  margin-top:10px;
  font-weight:800;
  font-size:14px;
  line-height:1.15;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient: vertical;
  overflow:hidden;
  color: var(--text);
  text-align:center;
}


.tile .desc{
  margin-top:6px;
  display:flex;
  justify-content:center;
  align-items:center;
}


/* Admin soft cards */
.card.soft{
  background: var(--card);
  color: var(--text);
  box-shadow: var(--shadow);
}
.card.soft .text-muted{color: var(--muted)!important;}

.chip{
  display:inline-block;
  font-size:11px;
  padding:2px 10px;
  border-radius:999px;
  background: rgba(245,158,11,.18);
  color: #92400e;
  border:1px solid rgba(245,158,11,.30);
  font-weight:700;
  white-space:nowrap;
}