/*
Theme Name: Artists Gallery of Ellicott City
Author: Karen Wallace
*/

footer a {
    color: var(--wp--preset--color--primary) !important;
}

/* White text on the Instagram button in the footer. The plugin doesn't add an !important, so Wordpress steamrolls it. */
.instagram-gallery__button {
	color: white !important;
}

/* Override the built-in stylesheet forcing links in captions to be black */
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption a {
    color: var(--wp--preset--color--primary);
}

a.wp-block-latest-posts__post-title {
	font-weight: 500 !important;
}

/* Override the built-in stylesheet add a text shadow to captions, I mean what the what would why you do that */
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
    text-shadow: 0 0 0 !important;
}

/* Force WooCommerce Product Collection block thumbnails to be the correct aspect ratio within a square, not cropped */
li.wc-block-product img {
	object-fit: contain !important
}

/* Override the built-in stylesheet demanding to give submenus white backgrounds despite no color being set */
/*.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
    background-color: unset !important;
}*/

/* Add a red dot */
span.agec_sold::after {
	/* Non-breaking space followed by a solid circle */
	content: '\00A0\25CF';
	color: red;
	font-size: 22px;
}

/* Shink the logo on mobile */
@media (max-width: 767px) {
	header .wp-block-site-logo img {
		height: 60px !important;
		width: auto !important;
	}
}

/* Override the built-in 100% table width */
.wp-block-table table {
	width: auto !important;
}

/* Remove bottom padding of the top-level page block so the black footer block doesn't have white space after it */
body > div.wp-site-blocks {
	padding-bottom: 0 !important;
}

/* Tighten up the spacing the footer hours table */
.footer-hours-table td {
	padding-left: 0 !important;
	padding-bottom: 3px !important;
	padding-top: 3px !important;
	padding-right: 1em;
	line-height: normal !important;
}

/* 
Move gallery image captions to below the image instead of on top of it 
https://wordpress.org/support/topic/gallery-captions-below-images-not-inside-with-gutenberg/#post-16441626
*/
figure.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
    background: none;
    position: relative;
    color: #000;
    line-height: 1.2em;
    margin-top: 0.2em;
}

/* One column in the gallery on phones in portrait mode, thank you */
@media (max-width: 767px) {
	figure.wp-block-gallery figure.wp-block-image {
		width: 100% !important;
	}
}

/* Two columns in the gallery on tablets in portrait mode and phones in landscape, thank you */
@media (min-width: 768px) and (max-width: 1000px) {
	figure.wp-block-gallery figure.wp-block-image {
		width: 48% !important;
	}
}

/* Documentation suggests that this should be the default definition of .alignfull from Gutenberg, but it's not, so we're adding it here. https://copyprogramming.com/howto/wordpress-gutenberg-alignwide-and-alignfull-problem */
.alignfull {
	margin-left: calc(-50vw + 50%) !important;
	margin-right: calc(-50vw + 50%) !important;
	padding-left: calc(50vw - 50%) !important;
	padding-right: calc(50vw - 50%) !important;
}

.mailing-list-signup-form input[type=text], .mailing-list-signup-form input[type=email] {
	padding: 10px !important;
	border-radius: 2px !important;
	border-width: 0;
}

main .mailing-list-signup-form input[type=text], main .mailing-list-signup-form input[type=email] {
	border-width: 1px !important;
	border-style: solid;
}

.entry-content a {
	text-decoration: none;
}

@media (min-width: 767px) {
	.headerBannerPercentageWidth {
		max-width: 400px;
	}
}

.agec_allCaps input {
	text-transform: uppercase;
}

table.agecWithBorders {
	border-collapse: collapse;
}

table.agecWithBorders td, table.agecWithBorders th {
	border: 1px solid gray; 
	padding: 0.5em;
}

table.agecWithBorders th {
	background:rgb(217,217,217);
}

table.agecTableWithBottomBorders {
  border-spacing: 0;
}

.agecTableWithBottomBorders th {
	border-bottom: 1px solid black;
}

.agecTableWithBottomBorders td {
	border-bottom: 1px solid lightgray;
}

.agecTableWithBottomBorders th, .agecTableWithBottomBorders td {
	padding: 0.25em;
	padding-right: 2em;
}

.stickyTableHeader th {
	position: sticky;
	top: 0;
	padding-top: 2em !important;
	background-color: white;
}

.agec_tooltipBox {
  position: relative;
  display: inline-block;
}
.agec_tooltipBox .agec_tooltipText {
  visibility: hidden;
  width: 200px;
  background-color: white;
  text-align: center;
  padding: 6px 0;
  position: absolute;
  z-index: 1;
}
.agec_tooltipBox:hover .agec_tooltipText {
  visibility: visible;
}

@media print {
  header,
  footer {
    display: none !important;
  }
  a {
  	color: black !important;
  }
}