@tailwind base;
@tailwind components;
@tailwind utilities;

/*

@layer components {
  .btn-primary {
    @apply py-2 px-4 bg-blue-200;
  }
}

*/

/* TinyMCE fullscreen mode - ensure it's above dashboard header (z-10 = 10) */
.tox.tox-tinymce.tox-fullscreen,
.tox-fullscreen,
.tox.tox-fullscreen {
  z-index: 9999 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
}

/* TinyMCE fullscreen body class - hide scrollbar and ensure fullscreen takes over */
body.tox-fullscreen {
  overflow: hidden !important;
}

/* Hide dashboard header and sidebar when TinyMCE is in fullscreen mode */
body.tox-fullscreen .tox-fullscreen-hide {
  display: none !important;
}

/* Ensure TinyMCE editor header in fullscreen is above everything */
.tox-fullscreen .tox-editor-header,
.tox.tox-fullscreen .tox-editor-header {
  z-index: 10000 !important;
}

/* Ensure TinyMCE dialogs appear above everything */
.tox-tinymce-aux {
  z-index: 10001 !important;
}

/* TinyMCE fullscreen editor container */
.tox-fullscreen .tox-editor-container {
  z-index: 9999 !important;
}

@import 'actiontext.css';
/* Blog content styles */
.prose table {
  @apply border-collapse border border-gray-300;
}

.prose td, .prose th {
  @apply border border-gray-300 p-2;
}

.prose blockquote {
  @apply border-l-4 border-gray-300 pl-4 italic;
}

.prose pre {
  @apply p-4 rounded-lg overflow-x-auto;
}

.prose code {
  @apply bg-gray-100 rounded px-1;
}

.prose img {
  @apply mx-auto;
}

/* TinyMCE specific alignments */
.prose .mce-align-center {
  @apply text-center;
}

.prose .mce-align-right {
  @apply text-right;
}

.prose .mce-align-justify {
  @apply text-justify;
}

/* Additional spacing for lists */
.prose ul, .prose ol {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}

/* Ensure images are responsive */
.prose img {
  max-width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

/* Style blockquotes */
.prose blockquote p:first-of-type::before,
.prose blockquote p:last-of-type::after {
  content: none;
}

/* Ensure tables are responsive */
.prose table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
} 
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 *


 */