/* Controle do Lucro - Custom CSS overrides */
[type='text']:focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
}


/* Accessibility and responsive data tables */
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .75rem 1rem; border-radius: .75rem; background: #18181b; color: #fff; transition: top .2s ease; }
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 3px solid rgba(228,61,135,.35); outline-offset: 2px; }
button[aria-busy="true"] { cursor: wait; opacity: .75; }

@media (max-width: 700px) {
    .responsive-table { min-width: 0 !important; }
    .responsive-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .responsive-table, .responsive-table tbody, .responsive-table tr, .responsive-table td { display: block; width: 100%; }
    .responsive-table tbody { padding: .5rem; }
    .responsive-table tbody tr { margin: .75rem 0; border: 1px solid #e2e8f0; border-radius: 1rem; overflow: hidden; background: #fff; }
    .responsive-table tbody td { display: flex; justify-content: space-between; gap: 1rem; text-align: right !important; padding: .75rem 1rem !important; border: 0; border-bottom: 1px solid #f1f5f9; }
    .responsive-table tbody td:last-child { border-bottom: 0; }
    .responsive-table tbody td::before { content: attr(data-label); flex: 0 0 42%; text-align: left; font-size: .75rem; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: .03em; }
    .responsive-table tbody td[colspan]::before { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}


/* UX utilities checkpoint 10 */
.toast-stack { position: fixed; top: 5rem; right: 1rem; z-index: 80; width: min(24rem, calc(100vw - 2rem)); display: grid; gap: .75rem; pointer-events: none; }
.toast-stack > * { pointer-events: auto; }
.field-invalid { border-color: #dc2626 !important; box-shadow: 0 0 0 3px rgba(220,38,38,.08); }
.skeleton { position: relative; overflow: hidden; background: #f1f5f9; color: transparent !important; border-radius: .75rem; }
.skeleton::after { content: ''; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255,255,255,.75), transparent); animation: crm-skeleton 1.25s infinite; }
@keyframes crm-skeleton { to { transform: translateX(100%); } }
[data-tooltip] { position: relative; }
[data-tooltip]:hover::after, [data-tooltip]:focus-visible::after { content: attr(data-tooltip); position: absolute; right: 0; top: calc(100% + .5rem); padding: .4rem .6rem; border-radius: .5rem; background: #18181b; color: white; font-size: .72rem; white-space: nowrap; z-index: 100; }
.mobile-fab-menu { transition: opacity .18s ease, transform .18s ease; transform-origin: bottom right; }

/* Universal form controls --------------------------------------------------
   Tailwind CDN injects its generated/preflight styles dynamically. The
   previous :where(...) selectors had zero specificity and could be overridden
   by Tailwind's later reset, leaving controls with border-width: 0 until focus.
   These selectors intentionally have normal specificity and force only the
   border width/style so utility classes can still control colors/backgrounds.
*/
input:not([type]),
input[type='text'],
input[type='email'],
input[type='url'],
input[type='password'],
input[type='number'],
input[type='date'],
input[type='datetime-local'],
input[type='month'],
input[type='search'],
input[type='tel'],
input[type='time'],
input[type='week'],
select,
textarea {
    width: 100%;
    min-height: 2.75rem;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: #cbd5e1;
    border-radius: .75rem;
    background-color: #fff;
    color: #0f172a;
    padding: .625rem .75rem;
    line-height: 1.5;
    box-sizing: border-box;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

textarea {
    min-height: 6.5rem;
    resize: vertical;
}

input:not([type]):focus,
input[type='text']:focus,
input[type='email']:focus,
input[type='url']:focus,
input[type='password']:focus,
input[type='number']:focus,
input[type='date']:focus,
input[type='datetime-local']:focus,
input[type='month']:focus,
input[type='search']:focus,
input[type='tel']:focus,
input[type='time']:focus,
input[type='week']:focus,
select:focus,
textarea:focus {
    border-color: #ec4899 !important;
    box-shadow: 0 0 0 3px rgba(236,72,153,.12);
}

input:disabled,
select:disabled,
textarea:disabled {
    background-color: #f8fafc;
    color: #94a3b8;
    cursor: not-allowed;
}

input::placeholder,
textarea::placeholder {
    color: #94a3b8;
    opacity: 1;
}


/* Controls with absolute icons ------------------------------------------------
   app.css is loaded after Tailwind's runtime stylesheet. The base form rule
   intentionally supplies padding for ordinary fields, but icon inputs need
   their Tailwind left/right spacing restored explicitly to avoid text/icon
   overlap on login, register, password recovery and global search.
*/
.relative > input.pl-10 { padding-left: 2.5rem !important; }
.relative > input.pl-9  { padding-left: 2.25rem !important; }
.relative > input.pr-10 { padding-right: 2.5rem !important; }
.relative > input.pr-3  { padding-right: .75rem !important; }
