/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Sir Tabs-a-Lot float animation */
@keyframes tk-float {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}

/* Proclamation banner sheen sweep */
@keyframes tk-sheen {
  0%          { transform: translateX(-120%); }
  60%,100%    { transform: translateX(320%); }
}

/* Wax seal glow pulse */
@keyframes tk-sealpulse {
  0%,100% { box-shadow: inset 0 0 0 2px rgba(255,255,255,.14), inset 0 -3px 6px rgba(0,0,0,.4), 0 0 0 0 rgba(202,164,65,.5); }
  50%     { box-shadow: inset 0 0 0 2px rgba(255,255,255,.14), inset 0 -3px 6px rgba(0,0,0,.4), 0 0 0 7px rgba(202,164,65,0); }
}

/* Search clear button: hidden when input is empty, shown when it has content */
[data-tab-search-target="clearBtn"],
[data-search-field-target="clearBtn"] { display: none; }
input:not(:placeholder-shown) + [data-tab-search-target="clearBtn"],
input:not(:placeholder-shown) + [data-search-field-target="clearBtn"] { display: flex; }

/* Rank ceremony entrance animation */
.ceremony-enter {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
.ceremony-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Mastery filter pills */
.mastery-pill {
  font: 500 13px/1 'EB Garamond', serif;
  color: #4a3c26;
  background: #efe2c0;
  border: 1.5px solid #c4ab73;
  border-radius: 20px;
  padding: 8px 15px;
  cursor: pointer;
  white-space: nowrap;
}
.mastery-pill.active {
  font: 600 13px/1 'Cinzel', serif;
  color: #fff;
  background: #3a5a3c;
  border-color: #233c25;
}

/* Petition urgency toggle */
.urgency-btn {
  flex: 1;
  display: block;
  text-align: center;
  font: 500 13px/1 'EB Garamond', serif;
  color: #6b5d44;
  background: #f1e6c8;
  border: 1.5px solid #c4ab73;
  border-radius: 2px;
  padding: 11px 4px;
  cursor: pointer;
}
.urgency-btn:has(input:checked) {
  font-weight: 600;
  color: #fff;
  background: #3a5a3c;
  border-color: #233c25;
}
.urgency-btn input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
}

/* Petition field inputs */
.petition-input {
  width: 100%;
  background: #fffdf6;
  border: 1.5px solid #4a3c26;
  border-radius: 2px;
  padding: 11px 13px;
  font: 500 16px/1.2 'EB Garamond', serif;
  color: #241f17;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.06);
  outline: none;
}
.petition-input::placeholder { color: #b0a080; font-style: italic; }
.petition-label {
  display: block;
  font: 600 11px/1 'Libre Franklin', sans-serif;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #9a7d2e;
  margin-bottom: 8px;
}