/* === PIETILA GROUP MOBILE OPTIMIZATION === */

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; padding: 0; overflow-x: hidden; -webkit-text-size-adjust: 100%; }
#root { overflow-x: hidden; width: 100%; max-width: 100vw; }

/* Prevent iOS input zoom - must be 16px+ */
@media (max-width: 768px) {
  input, select, textarea { font-size: 16px !important; }
  
  /* Force all fixed overlays to fit */
  div[style*="position: fixed"], div[style*="position:fixed"] {
    padding: 10px !important;
  }

  /* Modal cards - force fit screen */
  div[style*="max-width: 520px"], div[style*="maxWidth: 520px"],
  div[style*="max-width: 480px"], div[style*="maxWidth: 480px"],
  div[style*="max-width: 450px"], div[style*="maxWidth: 450px"],
  div[style*="max-width: 550px"], div[style*="maxWidth: 550px"],
  div[style*="max-width: 600px"], div[style*="maxWidth: 600px"],
  div[style*="max-width: 650px"], div[style*="maxWidth: 650px"],
  div[style*="max-width: 720px"], div[style*="maxWidth: 720px"],
  div[style*="max-width: 800px"], div[style*="maxWidth: 800px"],
  div[style*="max-width: 850px"], div[style*="maxWidth: 850px"] {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 4px !important;
  }

  /* Side panels (job card, equipment detail) */
  div[style*="width: 480px"], div[style*="width:480px"],
  div[style*="width: 520px"], div[style*="width:520px"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Fixed position modals with transform */
  div[style*="translate(-50%"] {
    transform: none !important;
    position: fixed !important;
    top: 10px !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100vh - 20px) !important;
  }

  /* 3-column grids → 1 column */
  div[style*="grid-template-columns: 1fr 1fr 1fr"],
  div[style*="gridTemplateColumns: 1fr 1fr 1fr"],
  div[style*="gridTemplateColumns:'1fr 1fr 1fr'"] {
    grid-template-columns: 1fr !important;
  }

  /* 2-column grids → 1 column */
  div[style*="grid-template-columns: 1fr 1fr;"],
  div[style*="gridTemplateColumns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* 5-column KPI grids → 2 columns */
  div[style*="repeat(5, 1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* 4-column money row → 2 columns */
  div[style*="1fr 1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* 6-column quick nav → 3 columns */
  div[style*="repeat(6, 1fr)"] {
    grid-template-columns: 1fr 1fr 1fr !important;
  }

  /* Week calendar grid - horizontal scroll */
  div[style*="repeat(7,1fr)"],
  div[style*="repeat(7, 1fr)"] {
    grid-template-columns: repeat(7, minmax(100px, 1fr)) !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Month calendar cells - smaller */
  div[style*="min-height: 100px"],
  div[style*="minHeight: 100px"],
  div[style*="minHeight:'100px'"] {
    min-height: 60px !important;
    padding: 4px !important;
  }

  /* Flex rows that overflow - allow wrap */
  div[style*="display: flex"][style*="gap: 8px"],
  div[style*="display:'flex'"][style*="gap:'8px'"],
  div[style*="display: flex"][style*="gap: 16px"] {
    flex-wrap: wrap !important;
  }

  /* Bid line rows - stack on mobile */
  div[style*="flex: 3"], div[style*="flex:3"] {
    flex: 1 1 100% !important;
  }

  /* Rates grid → 2 columns */
  div[style*="repeat(5, 1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* Add-on grid → 2 columns */
  div[style*="repeat(3,1fr)"],
  div[style*="repeat(3, 1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* Payroll grid → stack */
  div[style*="2fr 1fr 1fr 1fr 1fr"] {
    grid-template-columns: 2fr 1fr 1fr !important;
  }

  /* Team row actions - wrap */
  div[style*="flex-shrink: 0"][style*="display: flex"][style*="gap: 8px"] {
    flex-wrap: wrap !important;
  }

  /* Totals bar wrap */
  div[style*="gap: 16px"][style*="padding: 20px"][style*="flex-wrap: wrap"] {
    gap: 12px !important;
    padding: 14px !important;
  }

  /* Page titles smaller */
  div[style*="font-size: 28px"],
  div[style*="fontSize: 28px"],
  div[style*="fontSize:'28px'"] {
    font-size: 22px !important;
  }

  /* Exclusion rows stack */
  div[style*="border-left: 3px"] {
    flex-wrap: wrap !important;
  }

  /* Bottom nav safe area */
  nav[style*="position: fixed"][style*="bottom: 0"] {
    padding-bottom: max(env(safe-area-inset-bottom), 8px) !important;
  }
}

/* Extra small phones */
@media (max-width: 375px) {
  div[style*="repeat(7, minmax(100px"] {
    grid-template-columns: repeat(7, minmax(80px, 1fr)) !important;
  }

  div[style*="1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
}