/**
 * Copyright since 2025 Mifos Initiative
 *
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
 */

@use 'assets/styles/helper';
@use 'assets/styles/colours' as *;

// ===== Compact Mode (Login) =====
.footer-compact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  width: 100%;
  font-size: 0.75rem;
  color: var(--md-sys-color-on-surface-variant, #44474e);

  .footer-info {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    line-height: 1.4;
  }

  .info-item {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
  }

  .info-label {
    font-weight: 500;
    opacity: 0.8;
  }

  .info-value {
    font-weight: 400;
    opacity: 0.9;
  }

  .info-separator {
    opacity: 0.4;
    font-size: 0.875rem;
  }

  .footer-copyright {
    font-size: 0.875rem;
    opacity: 0.7;
    margin-top: 0.25rem;
  }
}

// Dark theme support for compact mode
.dark-theme .footer-compact {
  color: var(--md-sys-color-on-surface-variant, #c4c6d0);
}

// ===== Default Mode (Shell) =====
#footer {
  align-items: center;
  min-width: 400px;

  .content-wrapper {
    max-width: 100%;
    min-width: 90%;
    padding-left: 5%;
    padding-right: 5%;

    .versions {
      width: 100%;
      color: $status-inactive;
    }

    .footer-content {
      margin: 0;
    }
  }

  .divider {
    margin: 2.5rem 1rem 0.5rem;
    width: 4rem;
  }

  .business-date {
    color: $status-approved;
  }

  table {
    border: none;

    tr:nth-child(even) {
      background-color: transparent;
    }
  }
}

.main-page {
  max-width: 70%;
  min-width: 50%;
  padding-left: 30%;
}

.copy-label {
  min-width: 100%;
  text-align: center;
  font-size: medium;
  margin-bottom: 10px;
}

// ===== Responsive for Compact Mode =====
@media (width <=480px) {
  .footer-compact {
    font-size: 0.7rem;

    .footer-info {
      gap: 0.375rem;
    }

    .footer-copyright {
      font-size: 0.8rem;
    }
  }
}

// ===== Responsive for Default Mode (Shell) =====
@media (width <=599px) {
  #footer {
    min-width: 100%;
  }

  .main-page {
    max-width: 100%;
    min-width: 100%;
    padding-left: 2%;
  }
}