/*
 * KYBDF Soft UI Refresh — main website, admin panel and member panel.
 * Presentation-only overrides: no database/schema or application-flow changes.
 */
@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@400;500;600;700&family=Noto+Sans+Bengali:wght@400;500;600;700;800&display=swap');
:root {
  --kybdf-red: #b5122b;
  --kybdf-red-dark: #8f1025;
  --kybdf-green: #075c3b;
  --kybdf-ink: #18212b;
  --kybdf-muted: #667085;
  --kybdf-bg: #fbf9f8;
  --kybdf-surface: #fff;
  --kybdf-soft: #fff4f5;
  --kybdf-line: #eee4e5;
  --kybdf-radius: 12px;
  --kybdf-shadow: none;
}
html { scroll-behavior: smooth; }
body {
  font-family: 'Hind Siliguri','Noto Sans Bengali',sans-serif !important;
  color: var(--kybdf-ink);
  background: var(--kybdf-bg) !important;
  font-size: 15px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4,h5,h6, .page-title, .section-title {
  font-family: 'Hind Siliguri','Noto Sans Bengali',sans-serif !important;
  letter-spacing: -.25px;
  line-height: 1.35;
  font-weight: 600;
}
a { transition: color .16s ease, background-color .16s ease, border-color .16s ease; }
button,.btn,input,select,textarea { font-family: inherit; }
button,.btn,.hb-primary,.hb-outline,a[class*="btn"] {
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  transition: background-color .16s ease,color .16s ease,border-color .16s ease !important;
}
button:hover,.btn:hover,.hb-primary:hover,.hb-outline:hover,a[class*="btn"]:hover {
  box-shadow: none !important; transform: none !important; filter: none !important;
}
.card,.feature-item,.service-card,.stat-card,.info-card,.news-card,.member-card,
.committee-card,.contact-card,.founder-card,.gallery-item,.donation-card,.hero-box,
.panel,.content-card,.dashboard-card,.stat-box,.widget,.modal-content,.form-panel,
.search-box,.table-container,.table-responsive {
  box-shadow: none !important;
  border: 1px solid var(--kybdf-line) !important;
  border-radius: var(--kybdf-radius) !important;
}
.card:hover,.feature-item:hover,.service-card:hover,.stat-card:hover,.info-card:hover,
.news-card:hover,.member-card:hover,.committee-card:hover,.contact-card:hover,
.founder-card:hover,.gallery-item:hover,.donation-card:hover {
  transform: none !important; box-shadow: none !important; border-color: #e3c8cd !important;
}
*:focus-visible { outline: 2px solid #d87988; outline-offset: 2px; }
input,select,textarea,.form-control {
  border: 1px solid #e3e1e2 !important;
  border-radius: 9px !important;
  background-color: #fff !important;
  box-shadow: none !important;
  color: var(--kybdf-ink);
}
input:focus,select:focus,textarea:focus,.form-control:focus {
  border-color: #c76a79 !important; box-shadow: 0 0 0 3px #b5122b0d !important;
}
table,.data-table { border-color: var(--kybdf-line) !important; }
th { font-weight: 600 !important; }
td,th { border-color: var(--kybdf-line) !important; }
.badge,.status-badge { box-shadow: none !important; }
img { max-width: 100%; }

/* Public site */
.site-header,.main-header,.navbar,.nav-wrap,.header-container,.header-main {
  box-shadow: none !important;
}
.site-header,.main-header,.navbar,.nav-wrap {
  border-bottom: 1px solid var(--kybdf-line);
}
.hero,.hero-section,.page-hero,.banner-section,.welcome-section {
  box-shadow: none !important;
}
.hero h1,.hero-section h1 { letter-spacing: -.7px; }
.section,.content-section { scroll-margin-top: 90px; }
.site-footer { box-shadow: none !important; }

/* Admin: quiet, table-forward workspace */
.admin-wrapper,.admin-main,.admin-content,.main-content,.content-wrapper,
.dashboard-content,.admin-page,.page-content {
  background: var(--kybdf-bg) !important;
}
.admin-sidebar,.sidebar,.sb-sidebar {
  box-shadow: none !important;
}
.admin-sidebar { border-right: 1px solid var(--kybdf-line); }
.sb-brand-box { box-shadow: none !important; }
.sb-link,.sb-subitem {
  border-radius: 8px !important;
  transition: background-color .15s ease,color .15s ease !important;
}
.sb-link:hover,.sb-subitem:hover { box-shadow: none !important; transform: none !important; }
.sb-link.active,.sb-subitem.active { box-shadow: none !important; }
.admin-topbar,.topbar,.admin-header,.top-header,.user-header {
  box-shadow: none !important;
  border-bottom: 1px solid var(--kybdf-line);
}
.admin-footer { background: transparent !important; border-top: 1px solid var(--kybdf-line); }
.page-header,.content-header,.page-heading {
  background: transparent !important; box-shadow: none !important;
}
.stat-card,.stat-box,.dashboard-stat,.summary-card,.metric-card {
  background: #fff !important;
}
table thead th,.data-table thead th {
  background: #f8f4f4 !important;
  color: #45404a !important;
}
.table-responsive { overflow-x: auto; }
.btn-primary,.btn-danger,.btn-success,.btn-warning,.btn-info,.btn-secondary,
button[type=submit],input[type=submit] {
  border-radius: 8px !important;
  font-weight: 600;
}
.alert,.notice,.toast { box-shadow: none !important; }
.modal,.modal-backdrop { backdrop-filter: none !important; }
@media(max-width:768px) {
  body { font-size: 14px; }
  .admin-content,.main-content,.content-wrapper,.dashboard-content { padding: 14px !important; }
  .card,.feature-item,.service-card,.stat-card,.info-card,.member-card { border-radius: 10px !important; }
  table { min-width: 620px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* Replace decorative gradients with calm, solid surfaces in the main site and panels. */
.hero,.hero-section,.hero-banner,.page-hero,.banner-section,.welcome-section,.hero-box,
.about-art,.hero-visual,.stat-card,.stat-box,.dashboard-stat,.summary-card,.metric-card {
  background-image: none !important;
}
.hero,.hero-section,.hero-banner,.page-hero,.banner-section,.welcome-section {
  background-color: #f5faf6 !important;
}
.admin-sidebar,.sidebar,.sb-sidebar {
  background-image: none !important;
}


/* Last-update typography, navigation and dashboard polish */
body { font-size: 16.5px !important; line-height: 1.72 !important; }
p, li, td, label, .form-text, .help-text { font-size: 1.02rem; }
h1 { font-size: clamp(1.8rem, 2.7vw, 2.35rem) !important; }
h2 { font-size: clamp(1.45rem, 2.2vw, 1.85rem) !important; }
h3 { font-size: clamp(1.2rem, 1.8vw, 1.45rem) !important; }
.kybdf-logo-img { width: auto; max-height: 58px; }
.kybdf-nav > li > a { font-size: 1.04rem !important; font-weight: 500 !important; }
.kybdf-nav > li > a i, .kybdf-dropdown > li > a i { display:none !important; }
.kybdf-nav > li > a { gap: 0 !important; }
/* Dashboard cards use subtle RGB accents, avoiding heavy gradients and shadows. */
.stats-grid .stat-card, .stats-grid > a, .dashboard-stats .stat-card,
.dashboard-stat, .summary-card, .metric-card {
  position:relative; overflow:hidden; border:1px solid #e9e5eb !important;
  border-radius:13px !important; background:#fff !important;
}
.stats-grid .stat-card::before, .dashboard-stats .stat-card::before,
.dashboard-stat::before, .summary-card::before, .metric-card::before {
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:rgb(181,18,43);
}
.stats-grid .stat-card:nth-child(4n+2)::before { background:rgb(18,153,111); }
.stats-grid .stat-card:nth-child(4n+3)::before { background:rgb(75,105,220); }
.stats-grid .stat-card:nth-child(4n)::before { background:rgb(225,135,28); }
.stats-grid .stat-card:nth-child(4n+1) .stat-icon { background:rgba(181,18,43,.09) !important; color:rgb(181,18,43) !important; }
.stats-grid .stat-card:nth-child(4n+2) .stat-icon { background:rgba(18,153,111,.10) !important; color:rgb(18,153,111) !important; }
.stats-grid .stat-card:nth-child(4n+3) .stat-icon { background:rgba(75,105,220,.10) !important; color:rgb(75,105,220) !important; }
.stats-grid .stat-card:nth-child(4n) .stat-icon { background:rgba(225,135,28,.12) !important; color:rgb(190,105,15) !important; }
.card-grid-2 > .card, .dashboard-card, .admin-content .card { border-radius:14px !important; }
.card-header { border-bottom:1px solid #eee4e5 !important; }
.admin-sidebar, .sidebar, .sb-sidebar { font-size:1rem !important; }
.admin-sidebar a, .sidebar a, .sb-sidebar a, .sb-link, .sb-subitem { font-size:1rem !important; font-weight:500 !important; }
.admin-sidebar .fa, .sidebar .fa, .sb-sidebar .fa { opacity:.88; }
@media(max-width:768px) { body { font-size:16px !important; } .kybdf-nav > li > a { font-size:1rem !important; } }

/* KYBDF MOBILE-FIRST RESPONSIVE HARDENING — 2026-10-17
   Shared by public, member and admin areas. No business logic or database changes. */
*, *::before, *::after { box-sizing: border-box; }
html { max-width: 100%; overflow-x: clip; -webkit-text-size-adjust: 100%; }
body { width: 100%; min-width: 0; overflow-x: clip; }
img, picture, video, canvas, iframe, embed, object { max-width: 100%; }
img, video { height: auto; }
svg { max-width: 100%; }
pre, code { max-width: 100%; overflow-x: auto; }
input, select, textarea, button { max-width: 100%; }
input, select, textarea { min-width: 0; }
form { max-width: 100%; }
[class*="container"], [class*="wrapper"], [class*="content"], [class*="inner"] { min-width: 0; }
/* Make common multi-column layouts shrink naturally rather than overflow. */
.stats-grid, .dashboard-stats, .stats-container, .card-grid, .card-grid-2,
.members-grid, .member-grid, .donor-grid, .donors-grid, .gallery-grid,
.team-grid, .committee-grid, .services-grid, .features-grid, .news-grid,
.cards-grid, .grid-container, .dashboard-grid, .quick-actions,
.form-grid, .filter-grid, .search-filters, .filters-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}
/* Long tables remain usable on phones via horizontal scrolling instead of breaking layout. */
.table-responsive, .table-container, .table-wrap, .table-wrapper,
.dataTables_wrapper, .table-scroll, .overflow-auto, .responsive-table {
  max-width: 100%; overflow-x: auto !important; -webkit-overflow-scrolling: touch;
}
table { max-width: 100%; }
.table-responsive table, .table-container table, .table-wrap table,
.table-wrapper table, .dataTables_wrapper table, .table-scroll table,
.responsive-table table { width: 100%; }
/* Avoid tiny tap targets and stop long labels/URLs from pushing the viewport wider. */
a, button, .btn, input[type="submit"], input[type="button"] { overflow-wrap: anywhere; }
button, .btn, input[type="submit"], input[type="button"] { min-height: 38px; }
th, td { overflow-wrap: anywhere; }
.modal-dialog, .modal-content, .dropdown-menu, .popover { max-width: calc(100vw - 24px); }
@media (max-width: 1024px) {
  .container, .container-fluid, .np-wrap { max-width: 100%; }
  .admin-content, .main-content, .content-wrapper, .dashboard-content { min-width: 0; }
  .sidebar, .admin-sidebar { max-width: 86vw; }
}
@media (max-width: 768px) {
  body { font-size: 15px !important; line-height: 1.6 !important; }
  .container, .container-fluid { padding-left: 12px !important; padding-right: 12px !important; }
  .admin-content, .main-content, .content-wrapper, .dashboard-content,
  .admin-page, .page-content { padding: 12px !important; }
  .row { margin-left: -6px; margin-right: -6px; }
  .row > [class*="col-"] { padding-left: 6px; padding-right: 6px; }
  .page-header, .content-header, .page-heading, .section-heading {
    gap: 8px; flex-wrap: wrap; align-items: flex-start;
  }
  .page-header h1, .content-header h1, .page-heading h1 { font-size: 1.35rem !important; }
  .page-header h2, .content-header h2, .page-heading h2 { font-size: 1.2rem !important; }
  .btn, button, input[type="submit"], input[type="button"] { white-space: normal; }
  .form-actions, .action-buttons, .toolbar, .page-actions { flex-wrap: wrap; gap: 8px; }
  .form-control, input, select, textarea { font-size: 16px !important; }
  .modal-dialog { margin: 10px auto; }
  .stats-grid, .dashboard-stats, .stats-container, .card-grid, .card-grid-2,
  .members-grid, .member-grid, .donor-grid, .donors-grid, .gallery-grid,
  .team-grid, .committee-grid, .services-grid, .features-grid, .news-grid,
  .cards-grid, .grid-container, .dashboard-grid, .quick-actions,
  .form-grid, .filter-grid, .search-filters, .filters-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .table-responsive table, .table-container table, .table-wrap table,
  .table-wrapper table, .dataTables_wrapper table, .table-scroll table,
  .responsive-table table { min-width: 620px; }
  .navbar .container, .navbar .container-fluid { align-items: flex-start; }
  .navbar-nav { max-width: 100%; }
}
@media (max-width: 480px) {
  .container, .container-fluid { padding-left: 10px !important; padding-right: 10px !important; }
  .admin-content, .main-content, .content-wrapper, .dashboard-content,
  .admin-page, .page-content { padding: 9px !important; }
  .stats-grid, .dashboard-stats, .stats-container, .card-grid, .card-grid-2,
  .members-grid, .member-grid, .donor-grid, .donors-grid, .gallery-grid,
  .team-grid, .committee-grid, .services-grid, .features-grid, .news-grid,
  .cards-grid, .grid-container, .dashboard-grid, .quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .form-grid, .filter-grid, .search-filters, .filters-grid { grid-template-columns: 1fr !important; }
  .card, .feature-item, .service-card, .stat-card, .info-card, .member-card,
  .committee-card, .contact-card, .founder-card, .gallery-item, .donation-card,
  .panel, .content-card, .dashboard-card, .stat-box, .widget, .form-panel {
    padding: 10px !important; border-radius: 8px !important;
  }
  .btn, .btn-sm { padding: 7px 10px !important; font-size: 13px !important; }
  h1 { font-size: 1.45rem !important; }
  h2 { font-size: 1.25rem !important; }
  h3 { font-size: 1.08rem !important; }
  .pagination { flex-wrap: wrap; gap: 4px; }
}
@media (max-width: 360px) {
  .stats-grid, .dashboard-stats, .stats-container, .card-grid, .card-grid-2,
  .members-grid, .member-grid, .donor-grid, .donors-grid, .gallery-grid,
  .team-grid, .committee-grid, .services-grid, .features-grid, .news-grid,
  .cards-grid, .grid-container, .dashboard-grid, .quick-actions {
    grid-template-columns: 1fr !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}