/* Desktop layout improvements */
/* Limit content width on large screens for better readability */

@media (min-width: 769px) {
  /* Limit main content containers */
  section {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
  }
  
  /* Specific container limits for better readability */
  section > div[class*="max-w"] {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  
  /* Text content should be even narrower for readability */
  section p,
  section h1,
  section h2,
  section h3,
  section h4,
  section h5,
  section h6 {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
  }
  
  /* Grid layouts should respect max width */
  [class*="grid"] {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
  }
  
  /* Cards and content blocks */
  /* Exclude grid children to prevent layout issues */
  section > [class*="bg-white"]:not([class*="grid"] > *),
  section > [class*="bg-[#"]:not([class*="grid"] > *),
  section > div > [class*="bg-white"]:not([class*="grid"] > *),
  section > div > [class*="bg-[#"]:not([class*="grid"] > *) {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  
  /* Grid children should not have max-width constraints */
  [class*="grid"] > * {
    max-width: none !important;
  }
}

@media (min-width: 1600px) {
  /* Even larger screens - more conservative limits */
  section {
    max-width: 1600px;
  }
  
  section > div[class*="max-w"] {
    max-width: 1400px;
  }
  
  section p,
  section h1,
  section h2,
  section h3 {
    max-width: 1000px;
  }
}

/* PCでもモーダルのバツボタンを右上に表示 */
.fixed.inset-0 button,
button.absolute.top-4.right-4,
button[class*="absolute"][class*="top-"][class*="right-"] {
  z-index: 9999 !important;
  position: fixed !important;
  top: 10px !important;
  right: 10px !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: white !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
  cursor: pointer !important;
}