/* ==========================================================================
   PH CORE Design System — ph-core-utilities.css
   Classes utilitárias com prefixo .ph-
   ========================================================================== */

/* --------------------------------------------------------------------------
   DISPLAY
   -------------------------------------------------------------------------- */
.ph-hidden        { display: none !important; }
.ph-block         { display: block; }
.ph-inline        { display: inline; }
.ph-inline-block  { display: inline-block; }
.ph-flex          { display: flex; }
.ph-inline-flex   { display: inline-flex; }
.ph-grid          { display: grid; }
.ph-inline-grid   { display: inline-grid; }

/* --------------------------------------------------------------------------
   FLEXBOX
   -------------------------------------------------------------------------- */
.ph-flex-col      { flex-direction: column; }
.ph-flex-row      { flex-direction: row; }
.ph-flex-wrap     { flex-wrap: wrap; }
.ph-flex-nowrap   { flex-wrap: nowrap; }
.ph-flex-1        { flex: 1 1 0%; }
.ph-flex-auto     { flex: 1 1 auto; }
.ph-flex-none     { flex: none; }
.ph-flex-shrink-0 { flex-shrink: 0; }
.ph-flex-grow     { flex-grow: 1; }

/* Align items */
.ph-items-start    { align-items: flex-start; }
.ph-items-center   { align-items: center; }
.ph-items-end      { align-items: flex-end; }
.ph-items-baseline { align-items: baseline; }
.ph-items-stretch  { align-items: stretch; }

/* Align self */
.ph-self-start   { align-self: flex-start; }
.ph-self-center  { align-self: center; }
.ph-self-end     { align-self: flex-end; }
.ph-self-stretch { align-self: stretch; }

/* Justify content */
.ph-justify-start    { justify-content: flex-start; }
.ph-justify-center   { justify-content: center; }
.ph-justify-end      { justify-content: flex-end; }
.ph-justify-between  { justify-content: space-between; }
.ph-justify-around   { justify-content: space-around; }
.ph-justify-evenly   { justify-content: space-evenly; }

/* Gap */
.ph-gap-0  { gap: var(--ph-space-0); }
.ph-gap-1  { gap: var(--ph-space-1); }
.ph-gap-2  { gap: var(--ph-space-2); }
.ph-gap-3  { gap: var(--ph-space-3); }
.ph-gap-4  { gap: var(--ph-space-4); }
.ph-gap-5  { gap: var(--ph-space-5); }
.ph-gap-6  { gap: var(--ph-space-6); }
.ph-gap-8  { gap: var(--ph-space-8); }
.ph-gap-10 { gap: var(--ph-space-10); }
.ph-gap-12 { gap: var(--ph-space-12); }

.ph-gap-x-0  { column-gap: var(--ph-space-0); }
.ph-gap-x-1  { column-gap: var(--ph-space-1); }
.ph-gap-x-2  { column-gap: var(--ph-space-2); }
.ph-gap-x-3  { column-gap: var(--ph-space-3); }
.ph-gap-x-4  { column-gap: var(--ph-space-4); }
.ph-gap-x-6  { column-gap: var(--ph-space-6); }
.ph-gap-x-8  { column-gap: var(--ph-space-8); }

.ph-gap-y-0  { row-gap: var(--ph-space-0); }
.ph-gap-y-1  { row-gap: var(--ph-space-1); }
.ph-gap-y-2  { row-gap: var(--ph-space-2); }
.ph-gap-y-3  { row-gap: var(--ph-space-3); }
.ph-gap-y-4  { row-gap: var(--ph-space-4); }
.ph-gap-y-6  { row-gap: var(--ph-space-6); }
.ph-gap-y-8  { row-gap: var(--ph-space-8); }

/* --------------------------------------------------------------------------
   GRID
   -------------------------------------------------------------------------- */
.ph-grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.ph-grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ph-grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ph-grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ph-grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ph-grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.ph-col-span-1 { grid-column: span 1 / span 1; }
.ph-col-span-2 { grid-column: span 2 / span 2; }
.ph-col-span-3 { grid-column: span 3 / span 3; }
.ph-col-span-4 { grid-column: span 4 / span 4; }
.ph-col-span-full { grid-column: 1 / -1; }

/* --------------------------------------------------------------------------
   ESPAÇAMENTO — MARGIN
   -------------------------------------------------------------------------- */
.ph-m-0   { margin: var(--ph-space-0); }
.ph-m-1   { margin: var(--ph-space-1); }
.ph-m-2   { margin: var(--ph-space-2); }
.ph-m-3   { margin: var(--ph-space-3); }
.ph-m-4   { margin: var(--ph-space-4); }
.ph-m-5   { margin: var(--ph-space-5); }
.ph-m-6   { margin: var(--ph-space-6); }
.ph-m-8   { margin: var(--ph-space-8); }
.ph-m-10  { margin: var(--ph-space-10); }
.ph-m-12  { margin: var(--ph-space-12); }
.ph-m-16  { margin: var(--ph-space-16); }
.ph-m-auto { margin: auto; }

.ph-mx-0   { margin-left: var(--ph-space-0);  margin-right: var(--ph-space-0); }
.ph-mx-1   { margin-left: var(--ph-space-1);  margin-right: var(--ph-space-1); }
.ph-mx-2   { margin-left: var(--ph-space-2);  margin-right: var(--ph-space-2); }
.ph-mx-3   { margin-left: var(--ph-space-3);  margin-right: var(--ph-space-3); }
.ph-mx-4   { margin-left: var(--ph-space-4);  margin-right: var(--ph-space-4); }
.ph-mx-6   { margin-left: var(--ph-space-6);  margin-right: var(--ph-space-6); }
.ph-mx-8   { margin-left: var(--ph-space-8);  margin-right: var(--ph-space-8); }
.ph-mx-auto { margin-left: auto; margin-right: auto; }

.ph-my-0   { margin-top: var(--ph-space-0);  margin-bottom: var(--ph-space-0); }
.ph-my-1   { margin-top: var(--ph-space-1);  margin-bottom: var(--ph-space-1); }
.ph-my-2   { margin-top: var(--ph-space-2);  margin-bottom: var(--ph-space-2); }
.ph-my-3   { margin-top: var(--ph-space-3);  margin-bottom: var(--ph-space-3); }
.ph-my-4   { margin-top: var(--ph-space-4);  margin-bottom: var(--ph-space-4); }
.ph-my-6   { margin-top: var(--ph-space-6);  margin-bottom: var(--ph-space-6); }
.ph-my-8   { margin-top: var(--ph-space-8);  margin-bottom: var(--ph-space-8); }

.ph-mt-0   { margin-top: var(--ph-space-0); }
.ph-mt-1   { margin-top: var(--ph-space-1); }
.ph-mt-2   { margin-top: var(--ph-space-2); }
.ph-mt-3   { margin-top: var(--ph-space-3); }
.ph-mt-4   { margin-top: var(--ph-space-4); }
.ph-mt-5   { margin-top: var(--ph-space-5); }
.ph-mt-6   { margin-top: var(--ph-space-6); }
.ph-mt-8   { margin-top: var(--ph-space-8); }
.ph-mt-10  { margin-top: var(--ph-space-10); }
.ph-mt-12  { margin-top: var(--ph-space-12); }
.ph-mt-16  { margin-top: var(--ph-space-16); }
.ph-mt-auto { margin-top: auto; }

.ph-mb-0   { margin-bottom: var(--ph-space-0); }
.ph-mb-1   { margin-bottom: var(--ph-space-1); }
.ph-mb-2   { margin-bottom: var(--ph-space-2); }
.ph-mb-3   { margin-bottom: var(--ph-space-3); }
.ph-mb-4   { margin-bottom: var(--ph-space-4); }
.ph-mb-5   { margin-bottom: var(--ph-space-5); }
.ph-mb-6   { margin-bottom: var(--ph-space-6); }
.ph-mb-8   { margin-bottom: var(--ph-space-8); }
.ph-mb-10  { margin-bottom: var(--ph-space-10); }
.ph-mb-12  { margin-bottom: var(--ph-space-12); }
.ph-mb-auto { margin-bottom: auto; }

.ph-ml-0   { margin-left: var(--ph-space-0); }
.ph-ml-1   { margin-left: var(--ph-space-1); }
.ph-ml-2   { margin-left: var(--ph-space-2); }
.ph-ml-3   { margin-left: var(--ph-space-3); }
.ph-ml-4   { margin-left: var(--ph-space-4); }
.ph-ml-6   { margin-left: var(--ph-space-6); }
.ph-ml-auto { margin-left: auto; }

.ph-mr-0   { margin-right: var(--ph-space-0); }
.ph-mr-1   { margin-right: var(--ph-space-1); }
.ph-mr-2   { margin-right: var(--ph-space-2); }
.ph-mr-3   { margin-right: var(--ph-space-3); }
.ph-mr-4   { margin-right: var(--ph-space-4); }
.ph-mr-6   { margin-right: var(--ph-space-6); }
.ph-mr-auto { margin-right: auto; }

/* --------------------------------------------------------------------------
   ESPAÇAMENTO — PADDING
   -------------------------------------------------------------------------- */
.ph-p-0   { padding: var(--ph-space-0); }
.ph-p-1   { padding: var(--ph-space-1); }
.ph-p-2   { padding: var(--ph-space-2); }
.ph-p-3   { padding: var(--ph-space-3); }
.ph-p-4   { padding: var(--ph-space-4); }
.ph-p-5   { padding: var(--ph-space-5); }
.ph-p-6   { padding: var(--ph-space-6); }
.ph-p-8   { padding: var(--ph-space-8); }
.ph-p-10  { padding: var(--ph-space-10); }
.ph-p-12  { padding: var(--ph-space-12); }

.ph-px-0  { padding-left: var(--ph-space-0);  padding-right: var(--ph-space-0); }
.ph-px-1  { padding-left: var(--ph-space-1);  padding-right: var(--ph-space-1); }
.ph-px-2  { padding-left: var(--ph-space-2);  padding-right: var(--ph-space-2); }
.ph-px-3  { padding-left: var(--ph-space-3);  padding-right: var(--ph-space-3); }
.ph-px-4  { padding-left: var(--ph-space-4);  padding-right: var(--ph-space-4); }
.ph-px-5  { padding-left: var(--ph-space-5);  padding-right: var(--ph-space-5); }
.ph-px-6  { padding-left: var(--ph-space-6);  padding-right: var(--ph-space-6); }
.ph-px-8  { padding-left: var(--ph-space-8);  padding-right: var(--ph-space-8); }

.ph-py-0  { padding-top: var(--ph-space-0);  padding-bottom: var(--ph-space-0); }
.ph-py-1  { padding-top: var(--ph-space-1);  padding-bottom: var(--ph-space-1); }
.ph-py-2  { padding-top: var(--ph-space-2);  padding-bottom: var(--ph-space-2); }
.ph-py-3  { padding-top: var(--ph-space-3);  padding-bottom: var(--ph-space-3); }
.ph-py-4  { padding-top: var(--ph-space-4);  padding-bottom: var(--ph-space-4); }
.ph-py-5  { padding-top: var(--ph-space-5);  padding-bottom: var(--ph-space-5); }
.ph-py-6  { padding-top: var(--ph-space-6);  padding-bottom: var(--ph-space-6); }
.ph-py-8  { padding-top: var(--ph-space-8);  padding-bottom: var(--ph-space-8); }

.ph-pt-0  { padding-top: var(--ph-space-0); }
.ph-pt-2  { padding-top: var(--ph-space-2); }
.ph-pt-4  { padding-top: var(--ph-space-4); }
.ph-pt-6  { padding-top: var(--ph-space-6); }
.ph-pt-8  { padding-top: var(--ph-space-8); }

.ph-pb-0  { padding-bottom: var(--ph-space-0); }
.ph-pb-2  { padding-bottom: var(--ph-space-2); }
.ph-pb-4  { padding-bottom: var(--ph-space-4); }
.ph-pb-6  { padding-bottom: var(--ph-space-6); }
.ph-pb-8  { padding-bottom: var(--ph-space-8); }

.ph-pl-0  { padding-left: var(--ph-space-0); }
.ph-pl-2  { padding-left: var(--ph-space-2); }
.ph-pl-4  { padding-left: var(--ph-space-4); }
.ph-pl-6  { padding-left: var(--ph-space-6); }

.ph-pr-0  { padding-right: var(--ph-space-0); }
.ph-pr-2  { padding-right: var(--ph-space-2); }
.ph-pr-4  { padding-right: var(--ph-space-4); }
.ph-pr-6  { padding-right: var(--ph-space-6); }

/* --------------------------------------------------------------------------
   TIPOGRAFIA — TAMANHOS
   -------------------------------------------------------------------------- */
.ph-text-xs   { font-size: var(--ph-text-xs); }
.ph-text-sm   { font-size: var(--ph-text-sm); }
.ph-text-base { font-size: var(--ph-text-base); }
.ph-text-lg   { font-size: var(--ph-text-lg); }
.ph-text-xl   { font-size: var(--ph-text-xl); }
.ph-text-2xl  { font-size: var(--ph-text-2xl); }
.ph-text-3xl  { font-size: var(--ph-text-3xl); }
.ph-text-4xl  { font-size: var(--ph-text-4xl); }

/* Pesos */
.ph-font-light    { font-weight: var(--ph-font-light); }
.ph-font-normal   { font-weight: var(--ph-font-normal); }
.ph-font-medium   { font-weight: var(--ph-font-medium); }
.ph-font-semibold { font-weight: var(--ph-font-semibold); }
.ph-font-bold     { font-weight: var(--ph-font-bold); }

/* Alinhamento */
.ph-text-left   { text-align: left; }
.ph-text-center { text-align: center; }
.ph-text-right  { text-align: right; }

/* Transform */
.ph-uppercase   { text-transform: uppercase; }
.ph-lowercase   { text-transform: lowercase; }
.ph-capitalize  { text-transform: capitalize; }

/* Overflow */
.ph-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Leading */
.ph-leading-tight   { line-height: var(--ph-leading-tight); }
.ph-leading-snug    { line-height: var(--ph-leading-snug); }
.ph-leading-normal  { line-height: var(--ph-leading-normal); }
.ph-leading-relaxed { line-height: var(--ph-leading-relaxed); }

/* Tracking */
.ph-tracking-tight   { letter-spacing: var(--ph-tracking-tight); }
.ph-tracking-wide    { letter-spacing: var(--ph-tracking-wide); }
.ph-tracking-wider   { letter-spacing: var(--ph-tracking-wider); }
.ph-tracking-widest  { letter-spacing: var(--ph-tracking-widest); }

/* Cores de texto */
.ph-text-primary   { color: var(--ph-primary-600); }
.ph-text-muted     { color: var(--ph-text-muted); }
.ph-text-subtle    { color: var(--ph-text-subtle); }
.ph-text-invert    { color: var(--ph-text-invert); }
.ph-text-success   { color: var(--ph-success-600); }
.ph-text-warning   { color: var(--ph-warning-600); }
.ph-text-danger    { color: var(--ph-danger-600); }
.ph-text-info      { color: var(--ph-info-600); }
.ph-text-gray      { color: var(--ph-gray-500); }

/* --------------------------------------------------------------------------
   CORES DE FUNDO
   -------------------------------------------------------------------------- */
.ph-bg-white      { background-color: var(--ph-surface); }
.ph-bg-base       { background-color: var(--ph-bg); }
.ph-bg-primary    { background-color: var(--ph-primary-600); }
.ph-bg-primary-50 { background-color: var(--ph-primary-50); }
.ph-bg-success    { background-color: var(--ph-success-500); }
.ph-bg-warning    { background-color: var(--ph-warning-500); }
.ph-bg-danger     { background-color: var(--ph-danger-500); }
.ph-bg-gray-50    { background-color: var(--ph-gray-50); }
.ph-bg-gray-100   { background-color: var(--ph-gray-100); }

/* --------------------------------------------------------------------------
   WIDTH / HEIGHT
   -------------------------------------------------------------------------- */
.ph-w-full  { width: 100%; }
.ph-w-auto  { width: auto; }
.ph-w-screen { width: 100vw; }

.ph-h-full   { height: 100%; }
.ph-h-screen { height: 100vh; }
.ph-h-auto   { height: auto; }

.ph-min-h-screen { min-height: 100vh; }

/* --------------------------------------------------------------------------
   BORDER RADIUS
   -------------------------------------------------------------------------- */
.ph-rounded-none { border-radius: var(--ph-radius-none); }
.ph-rounded-sm   { border-radius: var(--ph-radius-sm); }
.ph-rounded      { border-radius: var(--ph-radius-md); }
.ph-rounded-md   { border-radius: var(--ph-radius-md); }
.ph-rounded-lg   { border-radius: var(--ph-radius-lg); }
.ph-rounded-xl   { border-radius: var(--ph-radius-xl); }
.ph-rounded-2xl  { border-radius: var(--ph-radius-2xl); }
.ph-rounded-full { border-radius: var(--ph-radius-full); }

/* --------------------------------------------------------------------------
   BORDAS
   -------------------------------------------------------------------------- */
.ph-border          { border: 1px solid var(--ph-border); }
.ph-border-top      { border-top: 1px solid var(--ph-border); }
.ph-border-bottom   { border-bottom: 1px solid var(--ph-border); }
.ph-border-left     { border-left: 1px solid var(--ph-border); }
.ph-border-right    { border-right: 1px solid var(--ph-border); }
.ph-border-none     { border: none; }

.ph-border-primary  { border-color: var(--ph-primary-600); }
.ph-border-success  { border-color: var(--ph-success-500); }
.ph-border-danger   { border-color: var(--ph-danger-500); }

/* --------------------------------------------------------------------------
   SOMBRAS
   -------------------------------------------------------------------------- */
.ph-shadow-none { box-shadow: var(--ph-shadow-none); }
.ph-shadow-xs   { box-shadow: var(--ph-shadow-xs); }
.ph-shadow-sm   { box-shadow: var(--ph-shadow-sm); }
.ph-shadow      { box-shadow: var(--ph-shadow-md); }
.ph-shadow-md   { box-shadow: var(--ph-shadow-md); }
.ph-shadow-lg   { box-shadow: var(--ph-shadow-lg); }
.ph-shadow-xl   { box-shadow: var(--ph-shadow-xl); }

/* --------------------------------------------------------------------------
   POSITION
   -------------------------------------------------------------------------- */
.ph-relative { position: relative; }
.ph-absolute { position: absolute; }
.ph-fixed    { position: fixed; }
.ph-sticky   { position: sticky; }

.ph-inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.ph-top-0   { top: 0; }
.ph-bottom-0 { bottom: 0; }
.ph-left-0  { left: 0; }
.ph-right-0 { right: 0; }

/* --------------------------------------------------------------------------
   OVERFLOW
   -------------------------------------------------------------------------- */
.ph-overflow-hidden   { overflow: hidden; }
.ph-overflow-auto     { overflow: auto; }
.ph-overflow-scroll   { overflow: scroll; }
.ph-overflow-x-auto   { overflow-x: auto; }
.ph-overflow-y-auto   { overflow-y: auto; }

/* --------------------------------------------------------------------------
   OPACIDADE / TRANSIÇÕES
   -------------------------------------------------------------------------- */
.ph-opacity-0   { opacity: 0; }
.ph-opacity-50  { opacity: 0.5; }
.ph-opacity-75  { opacity: 0.75; }
.ph-opacity-100 { opacity: 1; }

.ph-transition      { transition: var(--ph-transition-base); }
.ph-transition-fast { transition: var(--ph-transition-fast); }
.ph-transition-slow { transition: var(--ph-transition-slow); }
.ph-transition-colors { transition: var(--ph-transition-colors); }

/* --------------------------------------------------------------------------
   CURSOR
   -------------------------------------------------------------------------- */
.ph-cursor-pointer  { cursor: pointer; }
.ph-cursor-default  { cursor: default; }
.ph-cursor-not-allowed { cursor: not-allowed; }

/* --------------------------------------------------------------------------
   POINTER EVENTS
   -------------------------------------------------------------------------- */
.ph-pointer-events-none { pointer-events: none; }
.ph-pointer-events-auto { pointer-events: auto; }

/* --------------------------------------------------------------------------
   USER SELECT
   -------------------------------------------------------------------------- */
.ph-select-none { user-select: none; }
.ph-select-text { user-select: text; }
.ph-select-all  { user-select: all; }

/* --------------------------------------------------------------------------
   RESPONSIVO — Mobile First
   Breakpoints: 640px (sm), 768px (md), 1024px (lg), 1280px (xl)
   -------------------------------------------------------------------------- */

/* sm: ≥ 640px */
@media (min-width: 640px) {
  .sm\:ph-hidden       { display: none !important; }
  .sm\:ph-block        { display: block; }
  .sm\:ph-flex         { display: flex; }
  .sm\:ph-grid         { display: grid; }
  .sm\:ph-grid-cols-2  { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sm\:ph-grid-cols-3  { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sm\:ph-flex-row     { flex-direction: row; }
  .sm\:ph-flex-col     { flex-direction: column; }
  .sm\:ph-text-base    { font-size: var(--ph-text-base); }
  .sm\:ph-text-lg      { font-size: var(--ph-text-lg); }
  .sm\:ph-text-xl      { font-size: var(--ph-text-xl); }
  .sm\:ph-text-2xl     { font-size: var(--ph-text-2xl); }
  .sm\:ph-p-6          { padding: var(--ph-space-6); }
  .sm\:ph-px-6         { padding-left: var(--ph-space-6); padding-right: var(--ph-space-6); }
}

/* md: ≥ 768px */
@media (min-width: 768px) {
  .md\:ph-hidden       { display: none !important; }
  .md\:ph-block        { display: block; }
  .md\:ph-flex         { display: flex; }
  .md\:ph-grid         { display: grid; }
  .md\:ph-grid-cols-2  { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:ph-grid-cols-3  { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:ph-grid-cols-4  { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .md\:ph-flex-row     { flex-direction: row; }
  .md\:ph-flex-col     { flex-direction: column; }
  .md\:ph-text-2xl     { font-size: var(--ph-text-2xl); }
  .md\:ph-text-3xl     { font-size: var(--ph-text-3xl); }
  .md\:ph-text-4xl     { font-size: var(--ph-text-4xl); }
  .md\:ph-p-8          { padding: var(--ph-space-8); }
  .md\:ph-px-8         { padding-left: var(--ph-space-8); padding-right: var(--ph-space-8); }
}

/* lg: ≥ 1024px */
@media (min-width: 1024px) {
  .lg\:ph-hidden       { display: none !important; }
  .lg\:ph-block        { display: block; }
  .lg\:ph-flex         { display: flex; }
  .lg\:ph-grid         { display: grid; }
  .lg\:ph-grid-cols-3  { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:ph-grid-cols-4  { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lg\:ph-flex-row     { flex-direction: row; }
  .lg\:ph-text-4xl     { font-size: var(--ph-text-4xl); }
}

/* xl: ≥ 1280px */
@media (min-width: 1280px) {
  .xl\:ph-grid-cols-4  { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .xl\:ph-grid-cols-5  { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .xl\:ph-p-10         { padding: var(--ph-space-10); }
}