/* Global responsive hardening for admin + client pages */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

img,
canvas,
svg,
video {
  max-width: 100%;
  height: auto;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

.table-wrap,
.table-responsive,
.admin-table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 1024px) {
  .admin-layout {
    display: block !important;
  }

  .admin-sidebar {
    width: 100% !important;
    height: auto !important;
    position: static !important;
    top: auto !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    overflow-x: auto !important;
    white-space: nowrap;
    padding: 0.5rem 0 !important;
  }

  .admin-sidebar .sidebar-item {
    display: inline-flex !important;
    width: auto !important;
    border-left: none !important;
    border-bottom: 3px solid transparent;
    padding: 0.7rem 0.9rem !important;
  }

  .admin-main {
    padding: 1rem !important;
  }

  .stats-grid,
  .analytics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .lp-events-slider-wrap {
    padding: 0 0.25rem;
  }
}

@media (max-width: 768px) {
  body {
    background-attachment: scroll !important;
  }

  .container,
  .page-wrapper,
  .content-section,
  .admin-main,
  .lp-hero-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0.9rem !important;
    padding-right: 0.9rem !important;
  }

  .header,
  .lp-nav,
  .admin-header {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }

  .header,
  .lp-nav {
    min-height: 62px !important;
    height: auto !important;
  }

  .logo-section,
  .lp-nav-brand {
    min-width: 0 !important;
    flex: 1 1 auto;
  }

  .logo-text,
  .lp-nav-brand-text {
    min-width: 0 !important;
  }

  .logo-text-main,
  .logo-text-sub,
  .lp-nav-brand-name,
  .lp-nav-brand-sub,
  .home-welcome,
  .home-hero-sub,
  .dc-hero-title,
  .dc-hero-sub,
  .lp-hero-badge,
  .lp-hero-title,
  .lp-hero-desc {
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    max-width: 100%;
  }

  .lp-hero-badge,
  .home-hero-sub,
  .dc-hero-sub {
    line-height: 1.4 !important;
  }

  .lp-hero {
    padding-left: 0.9rem !important;
    padding-right: 0.9rem !important;
  }

  .main-content,
  .service-card,
  .info-card,
  .admin-card,
  .modal-content,
  .login-box,
  .fp-box {
    min-width: 0 !important;
  }

  .stats-grid,
  .analytics-grid,
  .contact-cards,
  .contact-icons,
  .dc-stats,
  .lp-services-grid,
  .lp-about-inner {
    grid-template-columns: 1fr !important;
    display: grid !important;
  }

  .form-row,
  .form-actions,
  .action-row,
  .cp-actions,
  .ep-modal-footer,
  .fp-btn-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.7rem !important;
  }

  .btn,
  .btn-primary,
  .btn-secondary,
  .login-btn,
  .download-btn,
  .close-btn,
  .form-submit,
  .action-button,
  .action-btn {
    width: 100% !important;
  }

  .login-card,
  .login-container,
  .success-content,
  .fp-modal,
  .cp-modal,
  .ep-modal,
  .form-card,
  .admin-card {
    width: 100% !important;
    max-width: 100% !important;
  }

  .dropdown-menu,
  .user-dropdown .dropdown-menu,
  .account-dropdown {
    right: 0 !important;
    left: auto !important;
    min-width: 220px !important;
    max-width: calc(100vw - 1rem) !important;
  }

  .lp-hero-title {
    font-size: clamp(2rem, 10vw, 3rem) !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    max-width: 100%;
  }

  .lp-nav-brand-text {
    min-width: 0;
    max-width: calc(100vw - 120px);
  }

  .lp-nav-brand-name,
  .lp-nav-brand-sub {
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .lp-hero-desc,
  .card-sub,
  .page-subtitle {
    font-size: 0.95rem !important;
  }

  .home-welcome {
    font-size: clamp(1.2rem, 7.5vw, 1.6rem) !important;
    letter-spacing: 1.8px !important;
  }

  .dc-hero-title {
    font-size: clamp(1.05rem, 6.5vw, 1.45rem) !important;
    letter-spacing: 1.4px !important;
  }

  .dc-hero-sub,
  .home-hero-sub {
    font-size: 0.65rem !important;
    letter-spacing: 1px !important;
  }

  .modal-content,
  .ann-modal-box,
  .success-content,
  .fp-modal,
  .cp-modal,
  .ep-modal {
    max-height: 88vh !important;
    overflow-y: auto !important;
  }
}

@media (max-width: 480px) {
  .lp-nav-brand-name,
  .logo-text-main,
  .brand-title {
    font-size: 0.76rem !important;
    letter-spacing: 1px !important;
  }

  .lp-nav-brand-sub,
  .logo-text-sub,
  .brand-sub {
    font-size: 0.62rem !important;
  }

  .lp-nav-brand-sub {
    display: none !important;
  }

  .lp-hero-cta {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.6rem !important;
  }

  .lp-hero-btn-primary,
  .lp-hero-btn-secondary {
    width: 100% !important;
    text-align: center !important;
  }

  .page-title,
  .card-title,
  .section-title {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
  }

  .lp-hero {
    padding-left: 0.7rem !important;
    padding-right: 0.7rem !important;
  }

  .lp-hero-badge {
    font-size: 0.52rem !important;
    letter-spacing: 1.2px !important;
    padding: 0.42rem 0.6rem !important;
  }

  .lp-hero-title {
    font-size: clamp(1.7rem, 10.5vw, 2.2rem) !important;
    letter-spacing: 1.2px !important;
  }

  .lp-hero-desc {
    font-size: 0.9rem !important;
    line-height: 1.55 !important;
  }

  .home-welcome {
    letter-spacing: 1.2px !important;
  }

  .dc-hero-title {
    letter-spacing: 1px !important;
  }

  #userName {
    display: none !important;
  }

  table th,
  table td {
    white-space: nowrap;
  }
}