@import "mixins";

.ck-editor {


	.ck-style-dropdown {
		.ck-button {
			.list-brackets {
				font-size: 0;
				&:before {
					content: "[1] abcd \A [2] efgh";
					font-size: 13px;
					white-space: pre;
				}
			}
		}
	}

	.ck-content {
		font-family: 'Adobe Garamond Pro', 'Arial';
		&.ck-editor__editable[dir] {
			text-align: justify;
		}

	  img {
	    max-width: 100%;
	    height: auto;
	  }
	  iframe {
	    max-width: 100%;
	  }

	  h1, h2, h3, h4, h5, h6 {
	    font-weight: normal;
	    line-height: 1;
	  }
	  h1, h2, h3 {
	    font-family: 'Bodoni TM Condensed', 'Arial';
	  }
	  h1 {
	    font-size: 3.6em;
	    margin-top: 1.5rem;
	    margin-bottom: 1.5rem;
	  }
	  h2 {
	    font-size: 2.8em;
	  }
	  h3 {
	    font-size: 2.2em;
	  }
	  h4 {
	    font-size: 1.8em;
	  }
	  h5 {
	    font-size: 1.5em;
	  }
	  h6 {
	    font-size: 1em;
	  }
	  a, a:visited {
	    color: $brown;
	    text-decoration: underline;
	    &:hover {
	      color: $gray;
	      text-decoration: underline;
	    }
	  }
	  .space-lg {
	    letter-spacing: 4px;
	  }
	  .upper {
	    text-transform: uppercase;
	  }
	  p {
	    margin: 1.5em 0;
	    &.middle {
	      text-align: center;
	    }
	  }

	  input[type="checkbox"],
	  input[type="radio"] {
	    margin-right: 0.5rem;
	  }

	  input[type="text"],
	  input[type="email"],
	  input[type="number"],
	  input[type="password"],
	  input[type="tel"],
	  input[type="date"],
	  input[type="time"],
	  textarea {
	    width: 100%;
	  }

		table {
		  margin-bottom: 1.5em;
		  border: 1px solid $border !important;
			border-bottom: 0 !important;
		  border-collapse: separate !important;
		  tr {
		    th {
		      background: #eee;
		      text-transform: uppercase;
		    }
		    th,
		    td {
		      padding: 1rem 2rem;
		      border: none;
		      border-left: 1px solid $border;
		      border-bottom: 1px solid $border;
		      &:first-child {
		        border-left: 0;
		      }
		    }
		  }
		  tbody {
		    tr {
		      background-color: #fff;
		      &:nth-child(odd) {
		        background-color: $light-gray;
		      }
		    }
		  }
		}

	  ol {
	    &[type*="1"] {
	      list-style-type: decimal;
	    }
	    &.lower-roman {
	      list-style-type: lower-roman;
	    }
	    &.upper-roman {
	      list-style-type: upper-roman;
	    }
	    &.lower-latin {
	      list-style-type: lower-latin;
	    }
	    &.upper-latin {
	      list-style-type: upper-latin;
	    }
			&.list-type-brackets {
				padding-left: 0;
				li {
	        padding-left: 0;
	        list-style: brackets;
					list-style-position: inside;
	        > div, p, span {
	          display: inline;
	        }
	        & + li {
	          padding-top: 1em;
	        }
				}
			}
	  }

	  ul {
	    &[type="disc"] {
	      list-style-type: disc;
	    }
	    &[type="circle"] {
	      list-style-type: circle;
	    }
	    &[type="square"] {
	      list-style-type: square;
	    }
	  }


		a.colorbox,
		.media--type-document a {
			pointer-events: none;
		}

		.ck-widget {
			&.drupal-entity {
				//clear: left;
			}
			&[data-display] {
				clear: left;
				.embedded-entity,
				figure {
		      width: 100%;
					float: none;
		      box-sizing: border-box;
		    }
			}
	    &[data-display*="full_width"] {
	      width: 100%;
	    }
	    &[data-display*="half_width"] {
	      width: 50%;
	    }
	    &[data-display*="onethird_width"] {
	      width: 33.33%;
	    }
	    &[data-display*="quarter_width"] {
	      width: 25%;
	    }
	    &[data-align="left"] {
	      float: left;
	      clear: none;
	    }
	    &[data-align="right"] {
	      float: right;
	      clear: none;
	    }
	    &[data-align="center"] {
	      display: table;
	      margin: auto;
	      float: none;
	    }
	  }

		.media--type-gallery {
			img {
				width: auto;
			}
		  &[class*="media--view-mode-slideshow"] {
				padding: 2rem;
		    background: #222;
		    border: 1px solid $border;
				.slick__slider {
					> div {
						display: none;
						&:first-child {
							display: block;
						}
					}
					.slide__caption {
						color: #fff;
						text-align: center;
					}
				}
				.slick__arrow {
					display: none;
				}
			}
			&[class*="media--view-mode-grid"] {
				.field--name-field-media-gallery-items {
					@include flexbox();
					flex-wrap: wrap;
					> .field__items {
						@include flexbox();
						flex-wrap: wrap;
						> .field__item {
							width: calc(25% - 3rem);
						  padding: 1rem;
						  margin: 0.5rem;
							@include flexbox();
							align-items: center;
						  justify-content: center;
						  background: $light-gray;
						  box-shadow: inset 0 0 1px;
		          .field--name-name {
		            word-break: break-all;
		            line-height: 1;
		          }
						}
					}
					> .field__item {
						width: calc(25% - 3rem);
						padding: 1rem;
						margin: 0.5rem;
						@include flexbox();
						align-items: center;
						justify-content: center;
						background: $light-gray;
						box-shadow: inset 0 0 1px;
						.field--name-name {
							word-break: break-all;
							line-height: 1;
						}
					}
				}
			}
		}
	}

}