/*
 * ponkotsu-md-editor のコンポーネント固有スタイル調整
 * グローバルな CSS 変数は application.css で定義されています
 */

/* Editor text colors - white for normal text, gray for placeholder */
#editor_content {
  color: #ffffff !important;
  background-color: #363636 !important;
}

#editor_content_placeholder {
  color: #888888 !important;
  opacity: 0.6;
  font-style: italic;
}

/* Make sure placeholder is truly gray and subtle */
.ponkotsu-md-editor-form-control::placeholder {
  color: #888888 !important;
  opacity: 0.6;
}

/* Editor textarea */
.ponkotsu-md-editor-markdown-textarea {
  color: #ffffff !important;
  background-color: #363636 !important;
}

/* Form controls */
.ponkotsu-md-editor-form-control {
  color: #ffffff !important;
  background-color: #363636 !important;
  border-color: #404040 !important;
}

.ponkotsu-md-editor-form-control:focus {
  border-color: #ff6b9d !important;
  box-shadow: 0 0 0 0.2rem rgba(255, 107, 157, 0.25) !important;
}

/* Preview area */
.markdown-preview,
.ponkotsu-md-editor-markdown-preview {
  background-color: #363636 !important;
  border-color: #404040 !important;
  color: #ffffff !important;
}

/* Toolbar buttons */
.ponkotsu-md-editor-btn {
  color: #f8f9fa !important;
  background-color: #2d2d2d !important;
  border-color: #404040 !important;
}

.ponkotsu-md-editor-btn:hover,
.ponkotsu-md-editor-btn:focus {
  background-color: #363636 !important;
  border-color: #ff6b9d !important;
  color: #ff6b9d !important;
}

.ponkotsu-md-editor-btn-outline-primary {
  background-color: #2d2d2d !important;
  color: #ff6b9d !important;
  border-color: #ff6b9d !important;
}

.ponkotsu-md-editor-btn-outline-primary:hover,
.ponkotsu-md-editor-btn-outline-primary:focus {
  background-color: #ff6b9d !important;
  color: #ffffff !important;
}

/* Modal/Popover */
.ponkotsu-md-editor-popover-modal {
  background: #2d2d2d !important;
  color: #ffffff !important;
  border-color: #404040 !important;
}

.ponkotsu-md-editor-popover-header {
  border-bottom-color: #404040 !important;
}

.ponkotsu-md-editor-popover-title {
  color: #ffffff !important;
}

.ponkotsu-md-editor-btn-close {
  color: #ffffff !important;
}

/* Tabs */
.ponkotsu-md-editor-nav {
  border-bottom-color: #404040 !important;
}

.ponkotsu-md-editor-nav-tabs .ponkotsu-md-editor-nav-link {
  color: #f8f9fa !important;
}

.ponkotsu-md-editor-nav-link.active {
  background: #363636 !important;
  color: #ff6b9d !important;
}

/* Table */
.ponkotsu-md-editor-table {
  color: #ffffff !important;
  background: #2d2d2d !important;
}

.ponkotsu-md-editor-table th,
.ponkotsu-md-editor-table td {
  border-color: #404040 !important;
}

.ponkotsu-md-editor-table-striped tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.03) !important;
}

/* Alert */
.ponkotsu-md-editor-alert-info {
  background: rgba(168, 85, 247, 0.1) !important;
  color: #ffffff !important;
  border-color: #a855f7 !important;
}

/* Code blocks */
code {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #ff6b9d !important;
}

pre {
  background: #2d2d2d !important;
  color: #ffffff !important;
}

blockquote {
  border-left-color: #ff6b9d !important;
  color: #f8f9fa !important;
}

/* High contrast text */
.ponkotsu-md-editor-high-contrast-text {
  color: #ffffff !important;
}

/* Form text / Help text */
.ponkotsu-md-editor-form-text {
  color: #cbd5e1 !important;
}

.ponkotsu-md-editor-medium-contrast-text {
  color: #f8f9fa !important;
}