.layout {
  min-height: 100vh;
  max-width: 100vw;
  overflow-x: hidden;
}

.logo {
  color: var(--color-white);
  font-size: var(--font-size-lg);
  font-weight: bold;
}

.site-layout-content {
  background: var(--color-white);
  padding: var(--spacing-lg);
  min-height: 280px;
}

/* Mobile responsive styles */
@media (max-width: 768px) {
  .ant-layout-content {
    padding: 0 var(--spacing-md) !important;
  }

  .site-layout-content {
    padding: var(--spacing-md);
  }
}

@media (max-width: 576px) {
  .ant-layout-content {
    padding: 0 var(--spacing-xs) !important;
  }

  .site-layout-content {
    padding: var(--spacing-sm);
  }
}

/* Prevent horizontal scrolling on mobile */
@media (max-width: 768px) {
  body, html {
    overflow-x: hidden;
    max-width: 100vw;
  }

  .ant-layout {
    min-width: 0;
    max-width: 100vw;
  }

  .ant-card {
    min-width: 0;
  }

  .ant-table {
    min-width: 0;
  }

  /* Ensure buttons don't overflow */
  .ant-btn {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Fix table scrolling on mobile */
  .ant-table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ant-table-tbody > tr > td {
    word-break: break-word;
  }
}

/* Oil-themed color classes */
.btn-blue-oil {
   background-color: var(--color-primary);
}
.bg-blue-oil {
   background-color: var(--color-primary);
}
.text-blue-oil {
   color: var(--color-primary);
}

.bg-orange-oil {
   background-color: var(--color-secondary);
}
.bg-gray-oil {
   background-color: var(--color-gray-700);
}
.text-orange-oil {
   color: var(--color-secondary);
}

/* Delivery status styles */
.waiting-delivery {
  background-color: var(--color-success-light);
}

.out-for-delivery {
  border: 2px solid var(--color-gold);
  box-shadow: var(--shadow-glow-gold);
}
