/**
 * ClassKira UI Enhancements
 * Modern typography, forms, buttons & layout improvements
 * Enhanced font sizes for better readability
 */

/* === Base typography scale (improved readability) === */
body {
  font-size: 15px !important;
  line-height: 1.6 !important;
}

/* === Page titles === */
.mainSection-title h4,
.page-header .header-title h4,
.eSection-wrap .title h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em;
  color: #1e293b !important;
  line-height: 1.3 !important;
}

.eBreadcrumb-2 a,
.eBreadcrumb-2 li {
  font-size: 15px !important;
  font-weight: 500;
  color: #64748b !important;
}

/* === Main Content Area === */
.home-section,
.home-content {
  background: #f8fafc !important;
}

.mainSection-title {
  margin-bottom: 28px !important;
  padding-bottom: 20px !important;
}

/* Dashboard section wrapper */
.eSection-dashboardItems {
  background: transparent !important;
  padding: 0 !important;
}

/* === Cards & Sections === */
.eSection-wrap {
  background: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
  border: 1px solid #e2e8f0 !important;
  padding: 24px !important;
}

.eSection-wrap .title {
  border-bottom-color: #e2e8f0 !important;
  padding-bottom: 12px !important;
  margin-bottom: 20px !important;
}

.eSection-wrap .title h3 {
  font-size: 17px !important;
  font-weight: 600 !important;
}

/* === Form Controls === */
.form-control,
.eForm-control,
.form-select,
select.form-control {
  font-size: 14px !important;
  font-weight: 500;
  border-radius: 8px !important;
  border: 1px solid #e2e8f0 !important;
  padding: 10px 14px !important;
  min-height: 42px !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

.form-control:focus,
.eForm-control:focus,
.form-select:focus {
  border-color: #8b5cf6 !important;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.12) !important;
  outline: none !important;
}

.form-control::placeholder,
.eForm-control::placeholder {
  color: #94a3b8 !important;
  font-weight: 400 !important;
}

/* === Buttons === */
.btn,
.eBtn {
  font-weight: 600 !important;
  font-size: 14px !important;
  letter-spacing: 0.01em;
  border-radius: 8px !important;
  padding: 10px 18px !important;
  transition: all 0.2s ease !important;
}

.btn-primary,
.export_btn,
.btn-form,
.eBtn.eBtn-primary {
  box-shadow: 0 2px 4px rgba(139, 92, 246, 0.2) !important;
}

.btn-primary:hover,
.export_btn:hover,
.btn-form:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(139, 92, 246, 0.3) !important;
}

.btn-secondary,
.eBtn.eBtn-secondary {
  background: #f1f5f9 !important;
  border-color: #e2e8f0 !important;
  color: #475569 !important;
}

/* === Tables === */
.table {
  font-size: 14px !important;
}

.table thead th {
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #64748b !important;
  border-bottom: 2px solid #e2e8f0 !important;
  padding: 14px 16px !important;
}

.table tbody td {
  padding: 14px 16px !important;
  vertical-align: middle !important;
  color: #334155 !important;
}

.table tbody tr:hover {
  background: #f8fafc !important;
}

/* === Sidebar (improved font sizes) === */
.sidebar .logo-details .logo_name {
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.sidebar .nav-links > li a .link_name {
  font-weight: 500 !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
}

.sidebar .nav-links > li .sub-menu a,
.sidebar .nav-links > li .sub-menu a span {
  font-weight: 500 !important;
  font-size: 14px !important;
  opacity: 0.9 !important;
  line-height: 1.5 !important;
}

.sidebar .nav-links > li .sMenu-title .link_name {
  font-size: 15px !important;
  font-weight: 600 !important;
}

/* === Header / Top Bar === */
.home-header,
.page-header {
  background: #fff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 16px 24px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

/* === Empty State / No Data === */
.text-center p,
.not-created p,
.empty-state-message,
.empty_box.center span,
.empty_box span {
  font-size: 15px !important;
  color: #64748b !important;
  font-weight: 500 !important;
}

.empty_box.center {
  padding: 48px 24px !important;
  min-height: 280px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

/* === eSection-wrap-2 (daily attendance, etc.) === */
.eSection-wrap-2 {
  background: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
  border: 1px solid #e2e8f0 !important;
  padding: 24px !important;
}

.att-filter {
  gap: 12px !important;
  margin-bottom: 24px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

.att-filter-option .form-select,
.att-filter-option .eForm-select,
.eForm-select,
.eChoice-multiple-with-remove {
  font-size: 14px !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  border: 1px solid #e2e8f0 !important;
  min-height: 42px !important;
  padding: 10px 14px !important;
}

.att-filter-btn .eBtn {
  font-weight: 600 !important;
  min-height: 42px !important;
  padding: 10px 20px !important;
}

/* === Select2 Dropdown Override === */
.select2-container--default .select2-selection--single {
  border-radius: 8px !important;
  min-height: 42px !important;
  padding: 6px 12px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  font-weight: 500 !important;
  padding-left: 0 !important;
}

/* === Filter Section === */
.gr-15,
.d-flex.gap-2,
.d-flex.gap-3 {
  gap: 12px !important;
}

/* === Labels === */
.form-label,
.eForm-label,
label {
  font-weight: 600 !important;
  font-size: 13px !important;
  color: #475569 !important;
  margin-bottom: 6px !important;
}

/* === Footer copyright === */
.home-footer,
.copyright-text,
.copyright-text p,
[class*="copyright"] {
  font-size: 14px !important;
  color: #64748b !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

/* === Dashboard specific enhancements === */
.dashboard_ShortListItem {
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
  border: 1px solid #e2e8f0 !important;
  padding: 20px !important;
  min-height: 180px !important;
  transition: box-shadow 0.2s ease, transform 0.2s ease !important;
}

.dashboard_ShortListItem:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}

.dsHeader .title {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #334155 !important;
}

.dsBody .total_no {
  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  color: #1e293b !important;
  letter-spacing: -0.02em !important;
}

.dsBody .total_info {
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: #64748b !important;
  font-weight: 500 !important;
}

/* Chart card */
.dashboard-chart-card,
.card.bg-info.dashboard-chart-card {
  border-radius: 12px !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(34, 197, 94, 0.15) !important;
  overflow: hidden !important;
}

.card.bg-info .chartdiv {
  min-height: 280px !important;
}

.card.bg-info h6,
.dashboard-chart-card h6 {
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}

/* === Header / User profile (improved font sizes) === */
ul > li.user-profile .user-name {
  font-size: 15px !important;
  font-weight: 600 !important;
}

ul > li.user-profile .user-title {
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* Language dropdown & header buttons - fix tiny 10px text */
.adminTable-action .table-action-btn-2 span,
.adminTable-action .dropdown-toggle span {
  font-size: 12px !important;
  font-weight: 500 !important;
}

.btn-outline-primary {
  font-size: 14px !important;
  font-weight: 500 !important;
}
