/* ============================================
   Footer Styles
   ============================================ */

/* Main Footer Container */
.site-footer {
  background: var(--text-primary);
  color: var(--background-primary);
  margin-top: var(--spacing-xxl);
}

/* Footer Widgets */
.footer-widgets {
  padding: var(--spacing-xxl) 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);

  .container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--spacing-lg);
  }

  .footer-widgets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--spacing-xl);

    .footer-widget-column {
      .widget {
        margin-bottom: var(--spacing-lg);

        &:last-child {
          margin-bottom: 0;
        }

        .widget-title {
          color: var(--background-primary);
          font-size: var(--font-size-lg);
          font-weight: var(--font-weight-bold);
          margin-bottom: var(--spacing-md);
          padding-bottom: var(--spacing-xs);
          border-bottom: 2px solid var(--primary-color);
        }

        a {
          color: var(--background-primary);
          text-decoration: none;
          transition: color var(--transition-base);

          &:hover {
            color: var(--primary-light);
            text-decoration: underline;
          }
        }

        ul {
          list-style: none;
          padding: 0;

          li {
            padding: var(--spacing-xs) 0;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);

            &:last-child {
              border-bottom: none;
            }
          }
        }
      }
    }
  }
}

/* Newsletter Section */
.footer-newsletter {
  background: var(--primary-color);
  padding: var(--spacing-xl) 0;

  .container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--spacing-lg);
  }

  .newsletter-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-xl);

    .newsletter-text {
      flex: 1;

      h3 {
        color: var(--background-primary);
        font-size: var(--font-size-xl);
        font-weight: var(--font-weight-bold);
        margin: 0 0 var(--spacing-sm) 0;
      }

      p {
        color: var(--background-primary);
        margin: 0;
        opacity: 0.9;
      }
    }

    .newsletter-form {
      flex-shrink: 0;

      .newsletter-signup {
        .form-group {
          display: flex;
          gap: var(--spacing-sm);

          input[type="email"] {
            padding: var(--spacing-sm) var(--spacing-md);
            border: none;
            border-radius: var(--radius-sm);
            font-size: var(--font-size-sm);
            min-width: 250px;

            &:focus {
              outline: 2px solid var(--primary-light);
            }
          }

          .newsletter-submit {
            background: var(--primary-dark);
            color: var(--background-primary);
            border: none;
            border-radius: var(--radius-sm);
            padding: var(--spacing-sm) var(--spacing-lg);
            font-weight: var(--font-weight-medium);
            cursor: pointer;
            transition: background var(--transition-base);

            &:hover {
              background: var(--primary-light);
            }

            i {
              margin-left: var(--spacing-xs);
            }
          }
        }
      }
    }
  }
}

/* Footer Main Section */
.footer-main {
  padding: var(--spacing-xl) 0;

  .container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--spacing-lg);
  }

  .footer-main-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-lg);

    .footer-navigation {
      .footer-nav-menu {
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0;
        gap: var(--spacing-lg);

        a {
          color: var(--background-primary);
          text-decoration: none;
          font-weight: var(--font-weight-medium);
          transition: color var(--transition-base);

          &:hover {
            color: var(--primary-light);
          }
        }
      }
    }

    .footer-social-navigation {
      display: flex;
      gap: var(--spacing-md);

      .footer-social-link {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: rgba(255, 255, 255, 0.1);
        border-radius: 50%;
        color: var(--background-primary);
        text-decoration: none;
        transition: all var(--transition-base);

        &:hover {
          background: var(--primary-color);
          transform: translateY(-2px);
        }
      }
    }

    .back-to-top {
      background: var(--primary-color);
      color: var(--background-primary);
      border: none;
      border-radius: 50%;
      width: 50px;
      height: 50px;
      cursor: pointer;
      transition: all var(--transition-base);
      opacity: 0;
      visibility: hidden;
      position: fixed;
      bottom: var(--spacing-lg);
      right: var(--spacing-lg);
      z-index: 1000;

      &.is-visible {
        opacity: 1;
        visibility: visible;
      }

      &:hover {
        background: var(--primary-light);
        transform: translateY(-2px);
      }
    }
  }
}

/* Copyright Section */
.footer-copyright {
  background: rgba(0, 0, 0, 0.3);
  padding: var(--spacing-lg) 0;
  font-size: var(--font-size-sm);

  .container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 var(--spacing-lg);
  }

  .copyright-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--spacing-lg);

    .copyright-text {
      p {
        margin: 0;
        opacity: 0.8;
      }

      .legal-links {
        margin-top: var(--spacing-xs);

        a {
          color: var(--background-primary);
          text-decoration: none;
          margin-right: var(--spacing-md);
          opacity: 0.7;

          &:hover {
            opacity: 1;
            text-decoration: underline;
          }
        }
      }
    }

    .developer-credit,
    .performance-info {
      text-align: right;

      p, small {
        margin: 0;
        opacity: 0.6;
      }

      a {
        color: var(--primary-light);
        text-decoration: none;

        &:hover {
          text-decoration: underline;
        }
      }

      i {
        color: #e74c3c;
      }
    }
  }
}

/* Cookie Notice */
.cookie-notice {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--text-primary);
  color: var(--background-primary);
  padding: var(--spacing-lg);
  box-shadow: var(--shadow-heavy);
  z-index: 9999;

  .cookie-notice-container {
    max-width: var(--container-max-width);
    margin: 0 auto;

    .cookie-notice-content {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--spacing-lg);

      p {
        margin: 0;
        flex: 1;

        .cookie-policy-link {
          color: var(--primary-light);
          text-decoration: underline;

          &:hover {
            color: var(--background-primary);
          }
        }
      }

      .cookie-notice-actions {
        display: flex;
        gap: var(--spacing-sm);

        button {
          padding: var(--spacing-xs) var(--spacing-md);
          border: 1px solid var(--background-primary);
          border-radius: var(--radius-sm);
          font-size: var(--font-size-sm);
          font-weight: var(--font-weight-medium);
          cursor: pointer;
          transition: all var(--transition-base);

          &.cookie-accept-btn {
            background: var(--primary-color);
            color: var(--background-primary);
            border-color: var(--primary-color);

            &:hover {
              background: var(--primary-light);
              border-color: var(--primary-light);
            }
          }

          &.cookie-decline-btn {
            background: transparent;
            color: var(--background-primary);

            &:hover {
              background: var(--background-primary);
              color: var(--text-primary);
            }
          }
        }
      }
    }
  }
}

/* Scroll Progress Indicator */
.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: rgba(0, 0, 0, 0.1);
  z-index: 9998;

  .scroll-progress-bar {
    height: 100%;
    background: var(--primary-color);
    width: 0%;
    transition: width 0.1s ease;
  }
}

/* Footer Mobile Responsive */
@media (max-width: 768px) {
  .footer-newsletter {
    .newsletter-content {
      flex-direction: column;
      text-align: center;

      .newsletter-form {
        .newsletter-signup .form-group {
          flex-direction: column;

          input[type="email"] {
            min-width: auto;
            width: 100%;
          }
        }
      }
    }
  }

  .footer-main {
    .footer-main-content {
      flex-direction: column;
      text-align: center;

      .footer-navigation .footer-nav-menu {
        flex-direction: column;
        gap: var(--spacing-sm);
      }
    }
  }

  .footer-copyright {
    .copyright-content {
      flex-direction: column;
      text-align: center;
      gap: var(--spacing-sm);
    }
  }

  .cookie-notice {
    .cookie-notice-content {
      flex-direction: column;
      text-align: center;
    }
  }
}
