/* Piramesse — interactive control states.
   Pseudo-class styling that inline styles can't express (hover, focus,
   :checked, placeholder). Ships to consumers via styles.css. */

/* Focus ring — consistent across all interactive controls */
.pir-btn:focus-visible,.pir-iconbtn:focus-visible,.pir-input:focus-visible,
.pir-textarea:focus-visible,.pir-select:focus-visible,.pir-checkbox:focus-visible,
.pir-radio:focus-visible,.pir-switch:focus-visible{
  outline:var(--border-thick) solid var(--focus-ring);
  outline-offset:2px;
}

/* Button hover / active */
.pir-btn[data-variant="primary"]:hover{background:var(--flame-600);border-color:var(--flame-600)}
.pir-btn[data-variant="secondary"]:hover{background:var(--ink-950);color:var(--paper)}
.pir-btn[data-variant="ghost"]:hover{background:var(--ink-100)}
.pir-btn[data-variant="inverse"]:hover{background:var(--ink-100)}
.pir-btn:active{transform:translateY(1px)}

.pir-iconbtn[data-variant="primary"]:hover{background:var(--flame-600);border-color:var(--flame-600)}
.pir-iconbtn[data-variant="secondary"]:hover{background:var(--ink-950);color:var(--paper)}
.pir-iconbtn[data-variant="ghost"]:hover{background:var(--ink-100)}
.pir-iconbtn:active{transform:translateY(1px)}

/* Text fields */
.pir-input:focus,.pir-textarea:focus,.pir-select:focus{border-color:var(--flame-500)}
.pir-input::placeholder,.pir-textarea::placeholder{color:var(--text-faint)}

/* Checkbox */
.pir-checkbox:checked{
  background:var(--flame-500);border-color:var(--flame-500);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size:14px;background-position:center;background-repeat:no-repeat;
}
/* Radio */
.pir-radio:checked{background:var(--flame-500);border-color:var(--flame-500);box-shadow:inset 0 0 0 3px var(--white)}

/* Slider — flame fill via inline background; brand thumb + focus */
.pir-slider{appearance:none;-webkit-appearance:none;height:6px;border-radius:var(--radius-pill);cursor:pointer}
.pir-slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--white);border:var(--border-thick) solid var(--flame-500);box-shadow:var(--shadow-xs);cursor:pointer;margin-top:-1px}
.pir-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--white);border:var(--border-thick) solid var(--flame-500);box-shadow:var(--shadow-xs);cursor:pointer}
.pir-slider:focus-visible{outline:var(--border-thick) solid var(--focus-ring);outline-offset:4px}

/* Search — hide native clear/decoration; use our button */
.pir-search::-webkit-search-cancel-button,.pir-search::-webkit-search-decoration{-webkit-appearance:none;appearance:none}

/* Card hover lift */
.pir-card--hover{cursor:pointer}
.pir-card--hover:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.pir-card--hover[data-variant="block"]:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink-950)}