:root {
  --primary-color: #02394A; /* Midnight Green */
  --secondary-color: #8980F5; /* Tropical Indigo */
  --tertiary-color: #0AD3FF; /* Vivid Sky Blue */
  --quaternary-color: #FFFFFF; /* White */
  --alert-color: #FF0000; /* Red */
  --border-color: #8E8E8E; /* Gray */
}

h1, h2, h3, .navbar-brand {
  font-family: "Rammetto One", sans-serif;
}

h2 {
  color: var(--tertiary-color);
  margin: 10px;
  padding: 15px 0;
  font-size: 1.2rem;
}

p, li, button, #paste-area {
  font-family: "Signika", sans-serif;
}

body {
  background-color: var(--quaternary-color);
}

.btn-primary {
  background-color: var(--secondary-color);
  border: 0.5px solid var(--border-color);
  color: var(--quaternary-color);
  border-radius: 50vh;
  font-size: 0.8em;
  margin: 0px;
}

.card {
  margin: 5px 10px;
  padding: 0px;
  
  & p {
    color: var(--primary-color);
    margin: 0px;
    padding: 0px;
  } 

  & .card-body {
    padding: 10px;
  }

  & .ghost {
    position: absolute;
    top: 0;
    right: 0;
    margin: 5px;
    color: darkred;
  }
  
  & .dropdown {
    position: absolute;
    top: 0;
    right: 0;
    margin: 5px;
    margin-right: 10px;

  }

  & .dropdown-menu {
    background-color: var(--primary-color);
    border: 0.5px solid var(--border-color);

    & a {
      color: var(--quaternary-color);
    }

    & a:hover {
      background-color: var(--secondary-color);
    }

    & i {
      color: var(--alert-color);
      margin-right: 5px;
    }
  }

}

.list-group {
  background-color: var(--primary-color);
  min-height: 800px;
  margin: 10px;
  padding: 0px;
}


#paste-area .inner {
  background-color: white;
  margin-bottom: 5px;
  border-radius: 10px;
  width: 100%; 
  display: flex;
  align-items: center;

  .paste-text {
    text-align: center;
    width: 100%;
  }
}

.upload-card .inner {
  background-color: red;
  border-radius: 10px;
  background-color: var(--secondary-color);
  color: white;
  p {
    width: 100%;
  }
}

/* #paste-area { */
/*   color: var(--border-color); */
/*   background-color: white; */
/*   height: 100%; */
/*   margin: 5px; */
/* } */

#card-upload {
  background: none;
  & p {
    color: white;
  }
  color: var(--border-color);
  border: 2px var(--secondary-color) dashed;
  & .btn {
    height: 100%;
    width: 100%;
    font-size: 0.7em;
    color: white;
  }

  & .inner {
    border: 1px var(--border-color) solid;
    text-align: center;
    height: 2.5em;
  }

  & .card-title {
    margin-bottom: 1em;
  }

  & .col {
    padding: 0 5px;
  }

  #file-input {
    display: none;
  }

  & .fa-upload {
    color: var(--secondary-color);
  }

  & .upload-icon {
  }

}

#caspr-nav {
  background-color: var(--primary-color) !important;
  color: var(--quaternary-color);
  padding: 10px;
  margin-bottom: 20px;
}

#summary-modal-body {
  padding: 20px;
  line-height: 1.6;
}

#summary-modal-body h1 {
  font-size: 1.2em;
}

#summary-modal-body h1,
#summary-modal-body h2,
#summary-modal-body h3 {
  margin-top: 1.5em;
  margin-bottom: 0.75em;
  font-weight: 600;
}

#summary-modal-body ul,
#summary-modal-body ol {
  padding-left: 2em;
  margin-bottom: 1em;
}

#summary-modal-body li {
  margin-bottom: 0.5em;
}

/* Job Source Modal Styles */
#jobSourceModal .job-source-btn {
  border-color: var(--secondary-color);
  color: var(--secondary-color);
  transition: all 0.2s ease;
}

#jobSourceModal .job-source-btn:hover {
  background-color: var(--secondary-color);
  color: white;
  border-color: var(--secondary-color);
}

#jobSourceModal .job-source-btn.active {
  background-color: var(--secondary-color);
  color: white;
  border-color: var(--secondary-color);
}

#sourceSearchResults .list-group-item:hover {
  background-color: var(--secondary-color);
  color: white;
}

#sourceSearchResults .list-group-item {
  cursor: pointer;
}

#summary-modal-body p {
  margin-bottom: 1em;
}

#summary-modal-body strong {
  font-weight: 600;
}

#summary-modal-body em {
  font-style: italic;
}

#summary-modal-body code {
  background-color: #f5f5f5;
  padding: 0.2em 0.4em;
  border-radius: 3px;
  font-family: monospace;
}

#summary-modal-body blockquote {
  border-left: 4px solid #ddd;
  padding-left: 1em;
  margin-left: 0;
  color: #666;
}

.card-icon a {
  text-decoration: none;
}

/* Notes Editor Styling */
.notes-editor {
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  padding: 0.75rem;
  background-color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.5;
  outline: none;
}

.notes-editor:focus {
  border-color: #86b7fe;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.notes-editor:empty:before {
  content: "Start typing your notes here... Use the toolbar above or keyboard shortcuts (Ctrl+B, Ctrl+I, etc.) to format text.";
  color: #6c757d;
  font-style: italic;
}

/* Rich text formatting support */
.notes-editor p {
  margin: 0 0 1rem 0;
}

.notes-editor ul, .notes-editor ol {
  margin: 0 0 1rem 1.5rem;
}

.notes-editor li {
  margin-bottom: 0.25rem;
}

.notes-editor h1, .notes-editor h2, .notes-editor h3 {
  margin: 1rem 0 0.5rem 0;
  font-weight: bold;
}

.notes-editor h1 {
  font-size: 1.5rem;
}

.notes-editor h2 {
  font-size: 1.25rem;
}

.notes-editor h3 {
  font-size: 1.1rem;
}

.notes-editor blockquote {
  border-left: 4px solid #ddd;
  padding-left: 1rem;
  margin: 1rem 0;
  color: #666;
  font-style: italic;
}

.notes-editor code {
  background-color: #f8f9fa;
  padding: 0.125rem 0.25rem;
  border-radius: 0.25rem;
  font-family: monospace;
  font-size: 0.875em;
}

/* Character count styling */
.form-text {
  font-size: 0.875rem;
}

/* Spacing between icons */
.card-icon.me-2 {
  margin-right: 0.5rem !important;
}