/* aksa-radzen-input-3d.v2.css
   If the previous file didn't apply, it's almost always one of:
   1) The CSS file is not loaded (wrong path / not last / cached).
   2) Radzen/Metronic theme overrides win due to specificity.
   This v2 increases selector coverage + uses !important ONLY for radius/shadow
   (still "inputs only" — no cards/buttons/layout overrides).

   Use:
   - Put in: wwwroot/css/aksa-radzen-input-3d.v2.css
   - Load LAST (after Metronic + Radzen):
     <link href="css/aksa-radzen-input-3d.v2.css?v=1" rel="stylesheet" />
*/

:root {
  --rzx-radius: .65rem;
  --rzx-shadow-rest: 0 0 0 rgba(0,0,0,0);
  --rzx-shadow-hover: 0 1px 2px rgba(0,0,0,.10), 0 0 0 1px rgba(0,0,0,.05);
  --rzx-shadow-focus: 0 8px 22px rgba(0,0,0,.12), 0 0 0 1px rgba(0,0,0,.07);
  --rzx-transition: 140ms cubic-bezier(.2, .8, .2, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root { --rzx-transition: 1ms linear; }
}

@media print {
  .rz-inputtext,
  .rz-textbox,
  .rz-textarea,
  .rz-spinner,
  .rz-numeric,
  .rz-dropdown,
  .rz-multiselect,
  .rz-autocomplete,
  .rz-datepicker,
  .rz-timepicker,
  .rz-password,
  .rz-inputgroup,
  .rz-popup,
  .rz-dropdown-panel,
  .rz-multiselect-panel,
  .rz-autocomplete-panel,
  .rz-datepicker-panel {
    box-shadow: none !important;
  }
}

/* -------------------------
   Broad coverage: wrappers
   ------------------------- */
.rz-textbox,
.rz-textarea,
.rz-spinner,
.rz-numeric,
.rz-dropdown,
.rz-multiselect,
.rz-autocomplete,
.rz-datepicker,
.rz-timepicker,
.rz-password,
.rz-inputgroup {
  border-radius: var(--rzx-radius) !important;
  box-shadow: var(--rzx-shadow-rest) !important;
  transition: box-shadow var(--rzx-transition), border-radius var(--rzx-transition) !important;
  max-width: 100%;
}

/* -------------------------
   Broad coverage: inner inputs
   ------------------------- */
input.rz-inputtext,
textarea.rz-inputtext,
.rz-textbox input,
.rz-textarea textarea,
.rz-spinner input,
.rz-numeric input,
.rz-password input,
.rz-autocomplete input,
.rz-datepicker input,
.rz-timepicker input {
  border-radius: var(--rzx-radius) !important;
  box-shadow: var(--rzx-shadow-rest) !important;
  transition: box-shadow var(--rzx-transition), border-radius var(--rzx-transition) !important;
  max-width: 100%;
}

/* Hover (subtle lift by elevation only; no transform) */
.rz-textbox:hover,
.rz-textarea:hover,
.rz-spinner:hover,
.rz-numeric:hover,
.rz-dropdown:hover,
.rz-multiselect:hover,
.rz-autocomplete:hover,
.rz-datepicker:hover,
.rz-timepicker:hover,
.rz-password:hover,
input.rz-inputtext:hover,
textarea.rz-inputtext:hover {
  box-shadow: var(--rzx-shadow-hover) !important;
}

/* Focus for composite controls */
.rz-textbox:focus-within,
.rz-textarea:focus-within,
.rz-spinner:focus-within,
.rz-numeric:focus-within,
.rz-dropdown:focus-within,
.rz-multiselect:focus-within,
.rz-autocomplete:focus-within,
.rz-datepicker:focus-within,
.rz-timepicker:focus-within,
.rz-password:focus-within,
.rz-inputgroup:focus-within {
  box-shadow: var(--rzx-shadow-focus) !important;
}

/* Focus for raw inputs */
input.rz-inputtext:focus,
textarea.rz-inputtext:focus,
.rz-textbox input:focus,
.rz-textarea textarea:focus,
.rz-spinner input:focus,
.rz-numeric input:focus,
.rz-password input:focus,
.rz-autocomplete input:focus,
.rz-datepicker input:focus,
.rz-timepicker input:focus {
  box-shadow: var(--rzx-shadow-focus) !important;
}

/* Disabled: flat */
.rz-state-disabled,
.rz-state-disabled:hover,
.rz-state-disabled:focus,
.rz-state-disabled:focus-within,
.rz-state-disabled input,
.rz-state-disabled textarea {
  box-shadow: var(--rzx-shadow-rest) !important;
}

/* Keep Radzen validation/error colors intact (do not override borders/colors) */
/* .rz-state-error { } */

/* Panels related to inputs (dropdown/multiselect/autocomplete/datepicker) */
.rz-popup,
.rz-dropdown-panel,
.rz-multiselect-panel,
.rz-autocomplete-panel,
.rz-datepicker-panel {
  border-radius: calc(var(--rzx-radius) + .15rem) !important;
  box-shadow: var(--rzx-shadow-focus) !important;
}
