/*
 * 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.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

a {
  text-decoration: underline;
  text-decoration-style: dotted;
}

a:focus {
  outline: 1px solid #37333E !important; /* Bright yellow outline */
  background-color: #FFFFB8 !important; /* Light background color for contrast */
  color: #000 !important; /* Dark text color for readability */
  text-decoration: underline !important; /* Underline text to signify it's a link */
  /*padding: 1px !important; !* Add some padding around the link *!*/
}

/*a:focus {*/
/*  outline: 3px solid orange;*/
/*  background-color: yellow;*/
/*}*/

a:active {
  text-decoration: none;
}

.no-decoration a {
  text-decoration: none !important;
}

.light-foreground-hover:hover {
  color: #fff !important;
}

.cropper-container {
  margin: 20px auto;
  max-width: 800px;
}

.cropper-image {
  display: block;
  max-width: 100%;
}

.header-image-preview {
  width: 320px;
}

.post-show-image {
  filter: blur(16px);
  -webkit-filter: blur(16px);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.toHide {
  opacity: 0;
  transition: opacity 1s ease-out;
  height: 0;
  overflow: hidden;
}

.toHide.show {
  opacity: 1;
  transition: opacity 1s ease-out;
  height: auto;
}

.social-icon {
  opacity: 0.5;
  transition: opacity 0.2s ease;
}

.social-icon:hover {
  opacity: 0.8;
}