:root {
  --button-size-small: 24px;
  --button-size-medium: 40px;
  --button-size-large: 56px;
}

label.button + input[type=file] {
  display: none;
}

:is(.button).icon:not(.dire-col, .dire-row--rev, .pdg-0) {
  padding: 0 1.5rem 0 1rem;
}
:is(.button).icon.dire-row--rev {
  padding: 0 1rem 0 1.5rem;
}
:is(.button).icon:not(.dire-col, .dire-row--rev, .pdg-0):where(.basic, .filled, .filled-tertiary, .filled-tonal, .outlined, .low):before, :is(.button).icon.dire-row--rev:where(.basic, .filled, .filled-tertiary, .filled-tonal, .outlined, .low):before {
  left: 0;
}
:is(.button).icon:not(.pdg-0).text-hidden-after-visible {
  padding: 0;
}
:is(.button).icon:not(.pdg-0).text-hidden-after-visible span:last-child {
  display: none;
}
:is(.button).toggle-theme span {
  color: var(--color-on-primary);
}
:is(.button).toggle-theme span svg {
  fill: var(--color-on-primary);
}
:is(.button).toggle-theme:where(:hover, :active):before, :is(.button).toggle-theme:where(:hover, :active) .container-svg:before {
  background-color: var(--color-on-primary);
}
:is(.button).toggle-theme:where(:hover, :active) svg {
  stroke: var(--color-on-primary);
  stroke-width: 2%;
  stroke-linecap: round;
}
:is(.button).toggle-theme.invisible-label {
  padding: 0;
}
:is(.button).toggle-theme.invisible-label span:not(.container-svg) {
  display: none;
}
:is(.button).basic:where(:hover, :active, .active):before, :is(.button).basic:where(:hover, :active, .active) .container-svg:before {
  background-color: var(--color-on-background);
}
:is(.button).basic:where(:hover, :active, .active).dire-col .container-svg {
  stroke: var(--color-on-background);
}
:is(.button).floating {
  position: fixed;
  z-index: 5;
  min-height: var(--button-size-large);
  width: var(--button-size-large);
}

:is(.branch-summary).icon {
  padding: 0 1.5rem 0 1rem;
}
:is(.branch-summary).icon + ul.icon {
  padding-left: 28px;
}
:is(.branch-summary).icon:where(.basic, .filled, .filled-tertiary, .filled-tonal, .outlined, .low):before, :is(.branch-summary).icon + ul.icon:where(.basic, .filled, .filled-tertiary, .filled-tonal, .outlined, .low):before {
  left: 0;
}
:is(.branch-summary).basic:where(:hover, :active, .active):before, :is(.branch-summary).basic:where(:hover, :active, .active) .container-svg:before {
  background-color: rgb(var(--color-on-background--rgb)/0.64);
}
:is(.branch-summary).basic:where(:hover, :active, .active).dire-col .container-svg {
  stroke: var(--color-on-background);
}

:where(:is(.button), .branch-summary) {
  position: relative;
  overflow: hidden;
  padding: 0 1.5rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff--body);
  font-weight: var(--typescale-body-small-font-weight);
  font-size: var(--typescale-body-small-font-size);
  letter-spacing: var(--typescale-body-small-letter-spacing);
  line-height: var(--typescale-body-small-line-height);
  text-align: center;
  transition: ease-in-out 0.2s;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
:where(:is(.button), .branch-summary).button-size--small {
  min-width: var(--button-size-small);
  min-height: var(--button-size-small);
  max-height: var(--button-size-small);
  font-size: 14px;
}
:where(:is(.button), .branch-summary).button-size--medium {
  min-width: var(--button-size-medium);
  min-height: var(--button-size-medium);
  max-height: var(--button-size-medium);
}
:where(:is(.button), .branch-summary).button-size--large {
  min-width: var(--button-size-large);
  min-height: var(--button-size-large);
  max-height: var(--button-size-large);
}
:where(:is(.button), .branch-summary).basic {
  color: var(--color-on-background);
  fill: var(--color-on-background);
}
:where(:is(.button), .branch-summary).filled {
  fill: var(--color-on-primary);
  color: var(--color-on-primary);
  background-color: var(--color-primary);
}
:where(:is(.button), .branch-summary).filled:where(:hover, :active, .active):before, :where(:is(.button), .branch-summary).filled:where(:hover, :active, .active) .container-svg:before {
  background: var(--color-on-primary);
}
:where(:is(.button), .branch-summary).filled:where(:hover, :active, .active).dire-col .container-svg {
  stroke: var(--color-on-primary);
}
:where(:is(.button), .branch-summary).filled-tertiary {
  fill: var(--color-on-tertiary);
  color: var(--color-on-tertiary);
  background-color: var(--color-tertiary);
}
:where(:is(.button), .branch-summary).filled-tertiary:where(:hover, :active, .active):before, :where(:is(.button), .branch-summary).filled-tertiary:where(:hover, :active, .active) .container-svg:before {
  background: var(--color-on-tertiary);
}
:where(:is(.button), .branch-summary).filled-tertiary:where(:hover, :active, .active).dire-col .container-svg {
  stroke: var(--color-on-tertiary);
}
:where(:is(.button), .branch-summary).filled-tonal {
  background-color: var(--color-secondary-container);
  color: var(--color-on-secondary-container);
  fill: var(--color-on-secondary-container);
}
:where(:is(.button), .branch-summary).filled-tonal:where(:hover, :active, .active):before, :where(:is(.button), .branch-summary).filled-tonal:where(:hover, :active, .active) .container-svg:before {
  background: var(--color-on-secondary-container);
}
:where(:is(.button), .branch-summary).filled-tonal:where(:hover, :active, .active).dire-col .container-svg {
  stroke: var(--color-on-secondary-container);
}
:where(:is(.button), .branch-summary).outlined {
  background-color: transparent;
  border: 1px solid rgb(var(--color-on-surface--rgb)/0.7);
  fill: var(--color-primary);
  color: var(--color-primary);
}
:where(:is(.button), .branch-summary).link {
  min-height: auto;
  padding: 0;
  display: flex;
  width: max-content;
  font-weight: 500;
}
:where(:is(.button), .branch-summary).link:hover {
  text-decoration: underline;
  text-underline-color: var(--color-primary);
}
:where(:is(.button), .branch-summary).status-recebido {
  fill: var(--color-on-status-recebido);
  color: var(--color-on-status-recebido);
  background-color: var(--color-status-recebido);
}
:where(:is(.button), .branch-summary).status-recebido:where(:hover, :active):before, :where(:is(.button), .branch-summary).status-recebido:where(:hover, :active) .container-svg:before {
  background: var(--color-on-status-recebido);
}
:where(:is(.button), .branch-summary).status-recebido:where(:hover, :active).dire-col .container-svg {
  stroke: var(--color-on-status-recebido);
}
:where(:is(.button), .branch-summary).status-em-atraso {
  fill: var(--color-on-status-em-atraso);
  color: var(--color-on-status-em-atraso);
  background-color: var(--color-status-em-atraso);
}
:where(:is(.button), .branch-summary).status-em-atraso:where(:hover, :active):before, :where(:is(.button), .branch-summary).status-em-atraso:where(:hover, :active) .container-svg:before {
  background: var(--color-on-status-em-atraso);
}
:where(:is(.button), .branch-summary).status-em-atraso:where(:hover, :active).dire-col .container-svg {
  stroke: var(--color-on-status-em-atraso);
}
:where(:is(.button), .branch-summary).status-a-vencer {
  fill: var(--color-on-status-a-vencer);
  color: var(--color-on-status-a-vencer);
  background-color: var(--color-status-a-vencer);
}
:where(:is(.button), .branch-summary).status-a-vencer:where(:hover, :active):before, :where(:is(.button), .branch-summary).status-a-vencer:where(:hover, :active) .container-svg:before {
  background: var(--color-on-status-a-vencer);
}
:where(:is(.button), .branch-summary).status-a-vencer:where(:hover, :active).dire-col .container-svg {
  stroke: var(--color-on-status-a-vencer);
}
:where(:is(.button), .branch-summary).status-active-recebido {
  fill: #ffffff;
  color: #ffffff;
  background-color: var(--color-status-active-recebido);
}
:where(:is(.button), .branch-summary).status-active-recebido:where(:hover, :active):before, :where(:is(.button), .branch-summary).status-active-recebido:where(:hover, :active) .container-svg:before {
  background: #ffffff;
}
:where(:is(.button), .branch-summary).status-active-recebido:where(:hover, :active).dire-col .container-svg {
  stroke: #ffffff;
}
:where(:is(.button), .branch-summary).status-active-em-atraso {
  fill: #FFFFFF;
  color: #FFFFFF;
  background-color: var(--color-status-active-em-atraso);
}
:where(:is(.button), .branch-summary).status-active-em-atraso:where(:hover, :active):before, :where(:is(.button), .branch-summary).status-active-em-atraso:where(:hover, :active) .container-svg:before {
  background: #FFFFFF;
}
:where(:is(.button), .branch-summary).status-active-em-atraso:where(:hover, :active).dire-col .container-svg {
  stroke: #FFFFFF;
}
:where(:is(.button), .branch-summary).status-active-a-vencer {
  fill: #FFFFFF;
  color: #FFFFFF;
  background-color: var(--color-status-active-a-vencer);
}
:where(:is(.button), .branch-summary).status-active-a-vencer:where(:hover, :active):before, :where(:is(.button), .branch-summary).status-active-a-vencer:where(:hover, :active) .container-svg:before {
  background: #FFFFFF;
}
:where(:is(.button), .branch-summary).status-active-a-vencer:where(:hover, :active).dire-col .container-svg {
  stroke: #FFFFFF;
}
:where(:is(.button), .branch-summary):where(.low, .link) {
  fill: var(--color-primary);
  color: var(--color-primary);
}
:where(:is(.button), .branch-summary):hover:before, :where(:is(.button), .branch-summary):hover .container-svg:before {
  opacity: 8%;
}
:where(:is(.button), .branch-summary):where(:active, .active):before, :where(:is(.button), .branch-summary):where(:active, .active) .container-svg:before {
  opacity: 12%;
}
:where(:is(.button), .branch-summary):where(.outlined, .low):where(:hover, :active, .active):before {
  background: var(--color-primary);
}
:where(:is(.button), .branch-summary):where(.outlined, .low):where(:hover, :active, .active) .container-svg:before {
  background: var(--color-primary);
}

details[open] > .branch-summary span svg {
  transform: rotate(180deg);
}
details > .branch-summary:where(.basic, .low, .outlined) svg {
  fill: var(--color-on-background);
}
details > .branch-summary.filled svg {
  fill: var(--color-on-primary);
}
details > .branch-summary.filled-tertiary svg {
  fill: var(--color-on-tertiary);
}
details > .branch-summary.filled-tonal svg {
  fill: var(--color-on-secondary-container);
}
:where(details .filled, details .filled-tonal):hover {
  box-shadow: none !important;
}
details ul {
  padding-left: 1rem;
}
details ul button {
  color: var(--color-on-background);
}

:where(:is(.button), .branch-summary):not([disabled], .button.point-events--none, .dire-col):where(.basic, .filled, .filled-tertiary, .filled-tonal, .outlined, .low, .status-recebido, .status-em-atraso, .status-a-vencer, .status-active-recebido, .status-active-em-atraso, .status-active-a-vencer):before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  right: 0;
}
:where(:is(.button), .branch-summary):not([disabled], .button.point-events--none, .dire-col):where(.filled, .filled-tertiary, .filled-tonal):hover {
  box-shadow: var(--elevation-1);
}

:is(.button):not(.wh-40px).dire-col {
  min-height: 56px;
  max-height: fit-content;
  gap: 4px;
}
:is(.button):not(.wh-40px).dire-col .container-svg {
  align-items: end;
  display: flex;
}
:is(.button):not(.wh-40px).dire-col .container-svg::before {
  content: "";
  width: 48px;
  height: 29px;
  position: absolute;
  transform: translate(-24%, 10%);
}
:is(.button):not(.wh-40px).dire-col .container-svg.shape-rounded-corners-small::before {
  border-radius: var(--shape-corner-small-default-size);
}
:is(.button):not(.wh-40px).dire-col .container-svg.shape-rounded-corners-medium::before {
  border-radius: var(--shape-corner-medium-default-size);
}
:is(.button):not(.wh-40px).dire-col .container-svg.shape-rounded-corners-large::before {
  border-radius: var(--shape-corner-large-default-size);
}
:is(.button):not(.wh-40px).dire-col .container-svg.shape-rounded-corners-extra-large::before {
  border-radius: var(--shape-corner-extra-large-default-size);
}
:is(.button):not(.wh-40px).dire-col span:not(.container-svg) {
  font-size: 12px;
  text-align: center;
  line-height: 1rem;
  align-items: center;
}
:is(.button):not(.wh-40px).dire-col:not(:hover, :active, .active) span {
  opacity: 90%;
}
:is(.button):not(.wh-40px).dire-col:where(:hover, :active, .active) .container-svg {
  stroke-width: 2%;
  stroke-linecap: round;
}
:is(.button):not(.wh-40px).dire-col:where(.outlined, .low):hover svg {
  stroke: var(--color-primary);
}

:is(.button[disabled]) {
  cursor: not-allowed;
}
:is(.button[disabled]).dire-col .container-svg svg {
  stroke: none;
}
:is(.button[disabled]).dire-col .container-svg:before {
  display: none;
}

:is(.button:where([disabled], .point-events--none)):where(.status-recebido, .status-em-atraso, .status-a-vencer, .filled, .filled-tertiary, .filled-tonal, .status-active-recebido, .status-active-em-atraso, .status-active-a-vencer) {
  background-color: var(--color-outline);
  color: var(--color-surface);
}
:is(.button:where([disabled], .point-events--none)):where(.status-recebido, .status-em-atraso, .status-a-vencer, .filled, .filled-tertiary, .filled-tonal, .status-active-recebido, .status-active-em-atraso, .status-active-a-vencer) svg {
  fill: var(--color-surface);
}
:is(.button:where([disabled], .point-events--none)).outlined {
  border-color: var(--color-outline-variant);
}
:is(.button:where([disabled], .point-events--none)):where(.basic, .outlined, .low) span {
  color: var(--color-outline-variant);
}
:is(.button:where([disabled], .point-events--none)):where(.basic, .outlined, .low) svg {
  fill: var(--color-outline-variant);
}

.pdg-0 {
  padding: 0;
}

.input-file-preview {
  width: 180px;
  height: 180px;
  background-size: 152px;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: 50%;
  border: 1px solid var(--color-outline);
  overflow: hidden !important;
}

.header-main--container .button.outlined {
  border-color: var(--color-on-primary);
}

@keyframes mymove {
  100% {
    transform: rotate(180deg);
  }
}
@media screen and (min-width: 639px) {
  :root {
    --btn-floating-size:50px ;
  }
  :is(.button).icon:not(.pdg-0).text-hidden-after-visible {
    padding: 0 1.5rem 0 1rem;
  }
  :is(.button).icon:not(.pdg-0).text-hidden-after-visible span:last-child {
    display: flex;
  }
}
@media screen and (min-width: 1600px) {
  :is(.button).toggle-theme span {
    font-size: 16px;
  }
}

/*# sourceMappingURL=button.css.map */