/*
Theme Name: atb
Theme URI: 
Author: DOT&PIXEL
Author URI: 
Description: A custom theme for After the Butcher
Requires at least: 7.1
Tested up to: 7.1
Requires PHP: 5.7
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: spectra-one
Text Domain: atb
Tags: 
*/

/**
 * core and theme blocks
 * -----------------------------------------------------------------------------
 */

/* table style simple */
.wp-block-table.is-style-simple {
  width: max-content; 
  max-width: 100%; 
  border-collapse: collapse; 
}

.is-layout-constrained > .wp-block-table.is-style-simple:where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.wp-block-table.is-style-simple td,
.wp-block-table.is-style-simple th {
  border: none;
  padding: 0 1em 0 0 !important;
}

@media screen and (max-width: 594px) {

  .wp-block-table.is-style-simple td,
  .wp-block-table.is-style-simple th {
    display: block;
  }
}

.wp-block-table.is-style-simple td:first-child,
.wp-block-table.is-style-simple th:first-child {
  width: auto;
  font-weight: 600;
}

/* block sponsors */
.wp-block-group.atb-sponsors figure img {
  height: 60px !important;
  width: auto !important;
}

/* image in columns */
.atb-single-post-images {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 20px;
  width: fit-content;
  max-width: 100%;
  padding: 0;
}

.is-layout-constrained > .atb-single-post-images:where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.atb-single-post-images > .wp-block-image {
  flex: 0 0 auto;
  margin: 0;
}

.atb-single-post-images img {
  display: block;
  height: 400px;
  width: auto;
  max-width: none;
}

@media (max-width: 1366px) {
    .atb-single-post-images {
        width: 100%;
        max-width: 100%;
        gap: 12px;
    }

    .atb-single-post-images > .wp-block-image {
        flex: 1 1 0;
        min-width: 0;
    }

    .atb-single-post-images img {
        width: 100%;
        height: auto;
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .atb-single-post-images {
        flex-direction: column;
    }
}

/* if only one image exists */
.atb-single-post-images:has(> .wp-block-image:only-child) {
  width: 100%;
}

.atb-single-post-images:has(> .wp-block-image:only-child):where(:not(.alignleft):not(.alignright):not(.alignfull)) > .wp-block-image {
  width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.atb-single-post-images:has(> .wp-block-image:only-child) img {
  width: 100%;
  height: auto;
  max-width: 100%;
}

/**
 * Archives
 * -----------------------------------------------------------------------------
 */

/* custom posts archive */

@media screen and (min-width: 594px) {
	.atb-archive {
		column-count: 2;
		column-gap: 20px;
	}
}
@media screen and (min-width: 1008px) {
	.atb-archive {
		column-count: 3;
	}
}

.atb-archive article:first-child .archive-year {
  margin-top: 0;
}

.atb-archive article {
  break-inside: avoid;
}

.atb-archive .entry-title {
	margin-top: 0;
  margin-bottom: var(--wp--preset--spacing--small);
  font-size: var(--wp--preset--font-size--small);
}

.atb-archive .entry-title a {
  color: var(--wp--preset--color--heading);
}

.atb-archive .entry-title a:hover {
  color: var(--wp--preset--color--primary);
}

.atb-archive .archive-post-thumbnail {
	aspect-ratio: 16/9;
}

.atb-archive .archive-post-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* artist list */
.atb-artist-list {
  display: block;
  text-align: justify;
  list-style: none;
  margin: 0;
  padding: 0;
}

.atb-artist-list li {
  display: inline;
  white-space: nowrap;
  margin-bottom: 0 !important;
  line-height: 1em;
  word-break: break-all;
}

.atb-artist-list li a::after {
  content: " |";
  color: var(--wp--preset--color--heading);
}

.atb-artist-list li:last-child a::after {
  display: none;
}

/**
 * Single post
 * -----------------------------------------------------------------------------
 */

body.single-post .entry-content .wp-block-post-terms > a {
  color: var(--wp--preset--color--primary);
}

body.single-post .entry-content .wp-block-post-terms > a:hover {
  color: var(--wp--preset--color--heading);
}