/* GENERAL */
.patips-no-results { padding: 20px; text-align: center; font-style: italic; font-size: 0.85em; }


/* SIDEBAR */
.patips-sales-page-sidebar section:not(:last-of-type) { margin-bottom: 40px; }
.patips-pro-ad-period-goals:not(.block-editor-block-list__layout) { display: none; }


/* PATRON POST LIST */

/* Gray out posts */
.patips-gray-out *   { opacity: 0.7; }
.patips-gray-out img { -webkit-filter: grayscale( 100% ); filter: grayscale( 100% ); }

.patips-gray-out-locked-post:not(body) * { opacity: 0.7; }
.patips-gray-out-locked-post:not(body) .wp-post-image   { -webkit-filter: grayscale(1); filter: grayscale(1); }
.patips-gray-out-locked-post:not(body) .entry-content, 
.patips-gray-out-locked-post:not(body) .entry-content * { opacity: 1; }

/* Lock icons */
.patips-locked:after, 
.patips-unlocked:after, 
.patips-locked-post:not(body) .post-title:after, 
.patips-locked-post:not(body) .entry-title:after, 
.patips-locked-post:not(body) .wp-block-post-title:after, 
.patips-locked-post:not(body) .patips-patron-post-list-item-title:after, 
.patips-locked-post:not(body) .wp-block-latest-posts__post-title:after, 
.patips-unlocked-post:not(body) .post-title:after,
.patips-unlocked-post:not(body) .entry-title:after,
.patips-unlocked-post:not(body) .wp-block-post-title:after,
.patips-unlocked-post:not(body) .patips-patron-post-list-item-title:after,
.patips-unlocked-post:not(body) .wp-block-latest-posts__post-title:after {
	font-family: 'patips_icons';
	font-weight: 900;
	font-size: 12px;
	border: 1px solid #9d9d9d;
	color: #9d9d9d;
	padding: 5px;
	margin-left: 10px;
	position: relative;
	top: -2px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.patips-locked:after, 
.patips-locked-post:not(body) .post-title:after,
.patips-locked-post:not(body) .entry-title:after,
.patips-locked-post:not(body) .wp-block-post-title:after,
.patips-locked-post:not(body) .patips-patron-post-list-item-title:after,
.patips-locked-post:not(body) .wp-block-latest-posts__post-title:after { content:'\004f'; }

.patips-unlocked:after, 
.patips-unlocked-post:not(body) .post-title:after,
.patips-unlocked-post:not(body) .entry-title:after,
.patips-unlocked-post:not(body) .wp-block-post-title:after,
.patips-unlocked-post:not(body) .patips-patron-post-list-item-title:after,
.patips-unlocked-post:not(body) .wp-block-latest-posts__post-title:after { content:'\0050'; border-color: #7cc884; color: #7cc884; }

.patips-locked-post:not(body) .wp-block-latest-posts__post-title:after,
.patips-unlocked-post:not(body) .wp-block-latest-posts__post-title:after { display: inline-block; text-decoration: none; }

.patips-patron-post-list-item            { display: flex; align-items: center; gap: 10px; min-height: 75px; box-sizing: content-box; border: 1px solid #d9d9d9; padding: 5px 10px; margin-bottom: 10px; color: #1c1c1c; text-decoration: none; }
.patips-patron-post-list-item:hover      { text-decoration: none; }
.patips-patron-post-list-item[href="#"]  { pointer-events: none; }
.patips-patron-post-list-item-image      { max-width: 150px; line-height: 0; }
.patips-patron-post-list-item-image img  { max-width: 100%; object-fit: scale-down; height: 100%; }
.patips-patron-post-list-item-text       { flex: 1; display: inline-block; vertical-align:middle; }
.patips-patron-post-list-item-title      { line-height: 1.5em; margin: 6px 0; text-transform: uppercase; font-size: large; font-weight: bold; }
.patips-patron-post-list-item-date       { font-size: small; font-style: italic; }
.patips-patron-post-list-item-terms      { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 10px; text-transform: uppercase; font-size: small; }
.patips-patron-post-list-item-terms span { background: #eee; border-radius: 3px; padding: 0 5px; }

.patips-patron-post-list-item.patips-image-only                 { display: block; border: none; padding: 0; text-align: center; }
.patips-image-only .patips-patron-post-list-item-image          { max-width: 100%; }
.patips-image-only > *:not(.patips-patron-post-list-item-image) { display: none; }

@media screen and ( max-width: 640px ) {
	.patips-patron-post-list-item            { flex-direction: column; text-align: center; }
	.patips-patron-post-list-item-image      { width: auto; }
	.patips-patron-post-list-item-image img  { max-height: 100px; }
	.patips-patron-post-list-item-terms      { justify-content: center; }
	
	.patips-patron-post-list-item.patips-image-only img { max-height: none; }
}



/* PATRON AREA */
.patips-tabs                                    { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-bottom: 40px; }
.patips-tabs.is-layout-flow                     { margin-block-end: 40px; }
.patips-tabs > .wp-block-group__inner-container { all: inherit; width: 100%; margin: 0; }

.patips-tab-link                                { position: relative; border-radius: 5px; padding: 10px 15px; font-weight: bold; cursor: pointer; background-color: rgba(0, 0, 0, .03); color: rgba(0, 0, 0, 0.75); transition: .3s; }
.patips-tab-link.patips-tab-active              { background-color: var(--patips-main-color); color: #fff; }
.patips-tab-link:not(.patips-tab-active):hover  { background-color: transparent; }
.patips-tab-link:after                          { content: ''; opacity: 0; transition: opacity .3s; }
.patips-tab-link.patips-tab-active:after        { opacity: 1; position: absolute; bottom: 0; left: 50%; width: 0; height: 0; border: 10px solid transparent; border-top-color: var(--patips-main-color); border-bottom: 0; margin-left: -10px; margin-bottom: -9px; }
.patips-tab-link.is-layout-flow                 { margin-block-start: 0; }
.patips-tab-link p                              { margin: 0; margin-block-end: 0; }

.patips-tab-content                                        { margin-top: 0; visibility: visible; height: auto; opacity: 1; transition: opacity 0.3s; }
.patips-tab-content:not(.wp-block):not(.patips-tab-active) { display: none; }
.patips-tab-content.is-layout-flow                         { margin-block-start: 0; }

.patips-patron-status-list { margin-top: 20px; }

.patips-responsive-table             { width: 100%; border-collapse: collapse; }
.patips-patron-history-list table th { padding: 5px 12px; background-color: rgba( 0, 0, 0, .01 ); }
.patips-patron-history-list table td { padding: 10px 12px; vertical-align: middle; text-align: center; line-height: 1.5em; }
.patips-patron-history-list-column-actions { display: flex; gap: 5px 10px; flex-wrap: wrap; }

@media screen and ( max-width: 768px ) {
	.patips-responsive-table                     { border: none; }
	.patips-responsive-table thead               { display: none }
	.patips-responsive-table tbody tr:first-child td:first-child { border-top: 0 }
	.patips-responsive-table tbody th            { display: none }
	.patips-responsive-table tr                  { display: block; margin: 10px 0; padding: 5px 10px; border: 1px solid #ddd; }
	.patips-responsive-table tr td               { display: grid; grid-template-columns: 1fr 1fr; text-align: end; }
	.patips-responsive-table tr td:before        { content: attr(data-title) ": "; font-weight: 700; text-align: start; }
}


/* PATRON LIST */
.patips-patron-list                     { margin: 10px 0; text-transform: capitalize; }
.patips-patron-list a                   { text-decoration: none; }
.patips-patron-list-period:first-letter { text-transform: uppercase; }

.patips-patron-list-thanks-container fieldset { max-width: 90%; margin: 20px auto; padding: 10px; border: 1px solid #bbb; text-align: center; }
.patips-patron-list-thanks-container legend   { text-align: center; font-size: 0.75em; padding: 0 1em;  }

.patips-patron-list-thanks-ribbon { margin: 20px auto; text-align: center; color: #fff; }
.patips-patron-list-thanks-ribbon {
	--s: 2.5em; /* ribbon size */
	--d: .75em; /* depth */
	--c: 1.5em; /* cutout part */
	--p: .5em;  /* vertical padding */

	padding: var(--p) calc(var(--s) + .5em) calc(var(--d) + var(--p));
	line-height: 1.5;
	background:
		conic-gradient(at left  var(--s) bottom var(--d),
			#0000 25%,#0008 0 37.5%,#0004 0) 0   /50% 100% no-repeat,
		conic-gradient(at right var(--s) bottom var(--d),
			#0004 62.5%,#0008 0 75%,#0000 0) 100%/50% 100% no-repeat;
	clip-path: polygon(0 var(--d), var(--s) var(--d),var(--s) 0,calc(100% - var(--s)) 0,calc(100% - var(--s)) var(--d),100% var(--d),calc(100% - var(--c)) calc(50% + var(--d)/2),100% 100%,calc(100% - var(--s) - var(--d)) 100%,calc(100% - var(--s) - var(--d)) calc(100% - var(--d)),calc(var(--s) + var(--d)) calc(100% - var(--d)),calc(var(--s) + var(--d)) 100%,0 100%,var(--c) calc(50% + var(--d)/2));
	background-color: var(--patips-main-color); /* the main color */
	width: fit-content;
}


/* SUBSCRIPTION FORM */
.patips-subscription-form           { width: 100%; }

.patips-tier-options-container      { width: 100%; display: flex; flex-direction: column; gap: 10px; }
.patips-tier-option-container       { width: 100%; }
.patips-tier-option-container label { display: block; width: 100%; padding: 10px; cursor: pointer; font-weight: normal; box-sizing: border-box; }

.patips-tier-frequency,
.patips-tier-option-container { background-color: rgba( 0,0,0,0.01 ); border: 2px solid rgba( 0,0,0,0.08 ); border-radius: 3px; box-sizing: border-box; }

.patips-tier-option-input,
.patips-tier-frequency-input                   { display: none; }
.patips-tier-option-container.patips-selected,
.patips-tier-frequency.patips-selected         { border: 2px solid #000; } 

.patips-tier-option             { width: 100%; display: flex; align-items: flex-start; gap: 10px; }
.patips-tier-option-icon        { width: 100px; height: 100px; }
.patips-tier-option-icon img    { max-width: 100%; max-height: 100%; object-fit: scale-down; }
.patips-tier-option-text        { width: 100%; display: grid; gap: 5px; grid-template-columns: 1fr auto; }
.patips-tier-option-title       { font-weight: bold; }
.patips-tier-option-price       { font-weight: bold; text-align: right; }
.patips-tier-option-description { grid-column: span 2 / span 2; }

.patips-tier-frequency-container             { width: fit-content; display: flex; gap: 5px 10px; flex-wrap: wrap; margin: 20px auto 0 auto; }
.patips-tier-frequency                       { width: fit-content; }
.patips-tier-frequency-container label       { display: block; width: fit-content; padding: 10px; cursor: pointer; text-transform: capitalize; font-weight: normal; box-sizing: border-box; } 
.patips-tier-frequency-container.patips-selected + label { font-weight: bold; }

.patips-subscription-email-container       { margin-top: 20px; }
.patips-subscription-email-container label { vertical-align: middle; font-weight: bold; margin-right: 10px; }
.patips-log-in-link-container              { display: block; }

.patips-tier-form-submit-container { width: fit-content; margin: 20px auto 0 auto; }
.patips-tier-form-submit           { cursor: pointer; font-size: 1em; padding: 10px; }




/* RESTRICTED POSTS */
.patips-restricted-post-content   { display: grid; grid-template-rows: auto 1fr; gap: 10px 20px; padding: 20px; border: 2px solid var(--patips-main-color); }
.patips-restricted-post-content:has(.patips-restricted-post-image) { grid-template-columns: auto 1fr; }
.patips-restricted-post-image     { grid-row-start: 1; grid-row-end: 3; }
.patips-restricted-post-image img { display: block; max-width: 128px; max-height: 128px; }
.patips-restricted-post-text p,
.patips-restricted-post-actions ul { margin: 0; }