/**
 * ============================================================================
 * MAIN STYLESHEET
 * Reset, Layout Dasar, Header Aplikasi & Media Print
 * ============================================================================
 */

@import url('./variables.css');
@import url('./components.css');

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

body {
  margin: 0;
  font-family: var(--font-family);
  background-color: var(--color-bg);
  color: var(--color-text-main);
  padding-bottom: 88px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* App Containers */
.app-container {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 12px;
}

/* Sticky App Header */
.app-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary-hover) 100%);
  color: #ffffff;
  padding: 12px 16px;
  box-shadow: 0 4px 12px rgba(6, 78, 59, 0.18);
}

/* Print Media Optimization */
@media print {
  .no-print,
  .bottom-nav,
  .app-header,
  #toastBox,
  #appModal {
    display: none !important;
  }

  body {
    padding-bottom: 0;
    background: #ffffff;
    color: #000000;
  }

  .card-box {
    box-shadow: none;
    border: 1px solid #cccccc;
    break-inside: avoid;
  }

  table.sheet-table th {
    background: #eeeeee !important;
    color: #000000 !important;
  }
}