/* Look identity. Presentation only: original layouts, events and status colors remain. */
#barbershop-form { background:transparent; border:0; padding:0; }
#barbershop-form > .establishment-settings-block { border:1px solid #caa757; border-radius:18px; padding:20px; margin:0 0 18px; background:#fff; box-shadow:0 3px 12px #173d6610; }
#barbershop-form > .establishment-settings-block > h3 { text-align:center; margin:0 0 18px; color:#14549a; }
#barbershop-form > .form-actions[hidden] { display:none!important; }
@media(max-width:480px) { #barbershop-form > .establishment-settings-block { padding:16px; } }
.shop-logo-editor { display:grid; gap:12px; margin:16px 0; }
.shop-logo-editor > .establishment-card-logo { justify-self:center; }
.shop-logo-editor fieldset { border:1px solid #d2ae5c; border-radius:12px; padding:12px; display:grid; gap:10px; }
#barbershop-form .shop-logo-editor fieldset label { display:flex; align-items:center; gap:8px; margin:0; }
#barbershop-form .shop-logo-editor input[type="radio"] { width:18px; height:18px; margin:0; }
#app-shell .owner-agenda-profile.compact-agenda-header { grid-template-columns:44px minmax(0,1fr) 96px; gap:12px; }
#app-shell .compact-agenda-header .look-header-copy { display:none; }
#app-shell .compact-agenda-header .owner-agenda-label { pointer-events:none; }
#app-shell .compact-agenda-header .look-header-mascot { position:absolute; right:8px; top:2px; width:96px; height:96px; }
#app-shell .compact-agenda-header > .agenda-toolbar { grid-column:2; grid-row:1; display:block; width:100%; min-width:0; margin:0; padding:0; border:0; z-index:2; }
#app-shell .compact-agenda-header .professional-selector { width:100%; }
#app-shell .compact-agenda-header .professional-selector-menu { right:0; left:auto; }
@media(max-width:480px) {
  #app-shell .owner-agenda-profile.compact-agenda-header { grid-template-columns:42px minmax(0,1fr) 68px; gap:8px; }
  #app-shell .compact-agenda-header .look-header-mascot { width:68px; }
  #app-shell .compact-agenda-header .professional-selector > button { white-space:normal; }
}
/* Shop navigation now lives in the Estabelecimentos cards. Keep the legacy
   selection controls non-visible for the shared filter synchronization. */
#app-shell .owner-shop-selector { display: none !important; }
.establishment-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; padding:12px 0; }
.establishment-card { border:1px solid #caa757; border-radius:18px; background:#fff; overflow:hidden; box-shadow:0 3px 12px #173d6610; }
.establishment-card-open { display:flex; flex-direction:column; align-items:center; gap:14px; width:100%; border:0; background:transparent; color:#14549a; padding:24px 16px; cursor:pointer; font:inherit; }
.establishment-card-open:hover:not(:disabled) { background:#edf5ff; }
.establishment-card-open strong { font-size:18px; }
.establishment-card-open > span:last-child { font-size:13px; }
.establishment-card-logo { width:80px; height:80px; border:1px solid #caa757; border-radius:20px; display:grid; place-items:center; background:#f5f9ff; font-size:26px; font-weight:700; overflow:hidden; }
.establishment-card-logo img { width:100%; height:100%; object-fit:contain; }
.establishment-card-configure { display:block; width:100%; padding:12px; border:0; border-top:1px solid #e7dac0; background:#fffaf0; color:#14549a; cursor:pointer; font:600 13px "Segoe UI",sans-serif; }
.establishment-card button:focus-visible { outline:2px solid #2375c5; outline-offset:-4px; }
.establishment-card-open:disabled { opacity:.5; cursor:not-allowed; }
:root {
  --look-blue: #2375c5;
  --look-blue-deep: #14549a;
  --look-blue-soft: #e7f2ff;
  --look-text: #344b64;
  --look-muted: #596d82;
  --look-line: #dce6f0;
  --look-gold: #bd8c30;
  --look-gold-edge: linear-gradient(125deg, #b07a25, #e8bd56 28%, #f8e29a 43%, #bb8529 65%, #dfb351);
  --look-card-shadow: 0 3px 12px #173d6610;
  background: #f2f5fa;
}
#app-shell, #barber-shell { background: #fff; }
.team-profile-navigation { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0 0 20px; }
.team-profile-navigation button { min-height: 44px; padding: 9px 5px; border: 1px solid #d2ae5c; border-radius: 12px; background: #fff; color: #14549a; font: 600 13px "Segoe UI", sans-serif; cursor: pointer; }
.team-profile-navigation button:hover { background: #edf5ff; }
.team-profile-navigation button[aria-pressed="true"] { background: #e7f2ff; border-color: #2375c5; box-shadow: inset 0 -2px #2375c5; }
.team-profile-navigation button:focus-visible { outline: 2px solid #2375c5; outline-offset: 2px; }
.team-access-note { color: #596d82; font-size: 14px; line-height: 1.5; background: #f5f8fc; border-radius: 12px; padding: 12px; }
.team-access-overview, .team-agenda-scope { border: 1px solid #d2ae5c; border-radius: 14px; padding: 16px; margin-bottom: 16px; background: #f8fbff; color: #14549a; }
.team-access-overview p, .team-agenda-scope p { margin: 7px 0 14px; color: #596d82; line-height: 1.5; font-size: 14px; }
.team-agenda-scope p { margin-bottom: 0; }
.team-permission-areas { display: grid; gap: 12px; }
.team-permission-area { border: 1px solid #dce6f0; border-radius: 14px; padding: 14px; background: #fff; }
.team-permission-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; color: #14549a; }
.team-permission-actions { display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #e4ecf5; }
#team-permissions-form label { display: inline-flex; align-items: center; gap: 7px; margin: 0; font-size: 13px; color: #344b64; cursor: pointer; }
#team-permissions-form input[type="checkbox"] { width: 18px; height: 18px; margin: 0; accent-color: #2375c5; }
#team-permissions-form label:has(input:disabled) { cursor: default; }
#team-permissions-form label:has(input:disabled:not(:checked)) { opacity: .55; }
.team-permission-area small { display: block; color: #596d82; margin-top: 10px; }
.team-menu-preview { border-radius: 14px; padding: 16px; background: #edf5ff; color: #14549a; margin: 18px 0; }
#team-menu-preview-items { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
#team-menu-preview-items span { border: 1px solid #c0d2e5; border-radius: 8px; padding: 5px 9px; background: #fff; font-size: 13px; }
#team-permissions-form .form-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 20px; }
.team-member-card { display: grid; gap: 8px; border: 1px solid #d2ae5c; border-radius: 14px; padding: 16px; margin-bottom: 12px; }
.team-member-card p { margin: 0; }
.team-member-card small { color: #596d82; }
.team-member-card button { justify-self: start; }
.team-invite-dialog { width: min(480px, calc(100vw - 28px)); max-height: calc(100dvh - 32px); overflow-y:auto; border:1px solid #d2ae5c; border-radius:18px; padding:24px; color:#344b64; }
.team-invite-dialog::backdrop { background:#173d6659; }
.team-invite-dialog h2 {color:#14549a;padding-right:30px}
.team-invite-dialog .dialog-close {position:absolute;right:12px;top:12px;width:32px;height:32px;display:grid;place-items:center;border:1px solid #d2ae5c;border-radius:10px;background:white;cursor:pointer}
.team-invite-dialog fieldset {border:1px solid #dce6f0;border-radius:12px;padding:12px}
.team-invite-dialog fieldset label {display:flex;gap:10px;align-items:center;padding:8px}
.team-invite-dialog input[readonly] {display:block;width:100%;border:1px solid #c0d2e5;border-radius:10px;padding:10px;margin:8px 0;font:inherit}
.team-invite-dialog input[name="invite-code"] {font:700 26px monospace;letter-spacing:6px;color:#14549a}
.team-invite-result {margin-top:18px}
.team-invite-result label {display:block;margin-top:15px}
.team-invite-dialog footer {display:flex;justify-content:space-between;gap:12px;margin-top:20px}
.team-invite-error {color:#b12727}
#team-member-form .form-actions { justify-content: space-between; }
#team-member-form input { min-height: 42px; padding: 10px 12px; box-sizing: border-box; width: 100%; font: inherit; }
#principal-contact-form input { min-height: 42px; padding: 10px 12px; box-sizing: border-box; width: 100%; font: inherit; }
#principal-contact-form .form-actions { justify-content: space-between; }
@media (max-width: 480px) { .team-profile-navigation { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Use the existing header height for the artwork, not empty vertical margins. */
#app-shell .owner-agenda-profile {
  height: 101px;
  box-sizing: border-box;
  padding: 2px 8px;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
}
#app-shell .owner-agenda-profile .look-header-mascot {
  display: block;
  position: absolute;
  right: 8px;
  top: 2px;
  width: 96px;
  height: 96px;
  object-fit: contain;
}
#app-shell .owner-agenda-profile .barbershop-name {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px;
  align-items: center;
  width: 360px;
  max-width: 100%;
  min-width: 0;
  height: 96px;
}
#app-shell .owner-agenda-profile .owner-agenda-label {
  width: 100%;
  grid-template-columns: minmax(0, 1fr);
}
#app-shell .owner-agenda-profile .look-header-copy {
  min-width: 0;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: max-content;
}
#app-shell .owner-agenda-profile .barbershop-name h1 {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip-path: none;
  margin: 0;
  white-space: nowrap;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.8px;
  color: var(--look-blue-deep);
  -webkit-text-stroke: 0.7px #c59a42;
  paint-order: stroke fill;
  text-shadow: 0 1px 0 #ecd59d;
}
#app-shell .owner-agenda-profile .look-header-copy > span {
  display: block;
  margin: 5px 0 0;
  color: var(--look-blue-deep);
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0.15px;
}
#app-shell .owner-agenda-profile .owner-menu-toggle {
  width: 42px;
  height: 42px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: linear-gradient(#fff, #fff) padding-box, var(--look-gold-edge) border-box;
  box-shadow: 0 2px 7px #2375c514;
}
#app-shell .owner-menu-toggle span { background: var(--look-blue-deep); }
#app-shell .owner-menu-toggle:hover {
  background: linear-gradient(#e7f2ff, #e7f2ff) padding-box, var(--look-gold-edge) border-box;
  box-shadow: 0 0 0 2px #2375c51c;
}
@media (max-width: 480px) {
  #app-shell .owner-agenda-profile { grid-template-columns: 44px minmax(0, 1fr); }
  #app-shell .owner-agenda-profile .barbershop-name { grid-template-columns: minmax(0, 1fr) 76px; }
  #app-shell .owner-agenda-profile .look-header-mascot { position: relative; width: 76px; height: 96px; right: auto; top: auto; }
  #app-shell .owner-agenda-profile .look-header-copy { position: relative; left: auto; top: auto; transform: none; width: auto; }
  #app-shell .owner-agenda-profile .barbershop-name h1 { font-size: clamp(15px, 4.7vw, 22px); letter-spacing: -0.6px; }
  #app-shell .owner-agenda-profile .look-header-copy > span { font-size: clamp(10px, 3vw, 13px); line-height: 17px; }
}
#app-shell :is(.category-heading h2, .agenda-section-title) { color: var(--look-blue-deep); }
#app-shell :is(.settings-description, .barber-access-note) { color: var(--look-muted); }
#app-shell :is(.agenda-toolbar, .agenda-section-title) { border-bottom-color: #dfc78e; }

/* White cards with a fine golden frame. Keep the colored agenda/status edge. */
#app-shell :is(.appointment, .service-item, .barber-card, .rule-card, .client-owner-card) {
  border-radius: 14px;
  border-color: #d2ae5c;
  background: #fff;
  box-shadow: var(--look-card-shadow);
}
#app-shell :is(.appointment, .barber-card) { border-left-color: var(--barber-color, var(--look-blue)); }
#settings-screen :is(.add-form, .summary-permissions, .barber-vale-settings, .day-row, .rule-settings, .sound-card) {
  border-color: #d9c28e;
  border-radius: 14px;
  background: #f8faff;
}
#app-shell :is(.client-owner-card h3, .service-item h3, .barber-card h3, .rule-card h3) { color: var(--look-blue-deep); }
#settings-screen :is(.drag-handle, .service-duration-fields legend) { color: #537596; }

/* Fields keep their existing widths and arrangements, including compact steppers. */
#settings-screen input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
#settings-screen select,
#settings-screen textarea,
dialog:not(.barber-dialog):not(.nf-dialog) input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
dialog:not(.barber-dialog):not(.nf-dialog) select,
dialog:not(.barber-dialog):not(.nf-dialog) textarea {
  border: 1px solid #c0d2e5;
  border-radius: 11px;
  background-color: #fff;
  color: #263e58;
  accent-color: var(--look-blue);
}
#settings-screen :is(input, select, textarea):focus-visible,
dialog:not(.barber-dialog):not(.nf-dialog) :is(input, select, textarea):focus-visible {
  outline: 2px solid var(--look-blue);
  outline-offset: 2px;
  border-color: var(--look-blue);
}
#settings-screen :is(input, select, textarea):disabled,
dialog:not(.barber-dialog):not(.nf-dialog) :is(input, select, textarea):disabled { background-color: #f0f3f7; color: #758598; }
#app-shell :is(.duration-stepper, .stock-stepper) { border-color: #c0d2e5; border-radius: 11px; }
#app-shell :is(.duration-stepper, .stock-stepper) button { color: var(--look-blue-deep); background: #edf4fc; }
#settings-screen input[type="range"] { accent-color: var(--look-blue); }

/* Custom selectors already own their chevrons. Only recolor their surfaces. */
#app-shell :is(.owner-shop-selector, .professional-selector, .establishment-selector) > button {
  border-color: #caa757;
  color: var(--look-text);
  background: #fff;
  box-shadow: 0 2px 6px #173d6610;
}
#app-shell :is(.owner-shop-selector-menu, .professional-selector-menu, .establishment-selector-menu, .history-date-menu) {
  border-color: #d1ad5c;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 28px #173d6624;
}
#app-shell :is(.owner-shop-choice, .professional-choice, .establishment-choice) {
  border-color: var(--look-line);
  color: var(--look-text);
  background: #fff;
}
#app-shell :is(.owner-shop-choice.selected, .professional-choice.selected, .establishment-choice.selected) {
  border-color: #96bde4;
  background: var(--look-blue-soft);
  color: var(--look-blue-deep);
}
#app-shell :is(.owner-shop-choice, .professional-choice, .establishment-choice).selected b { color: var(--look-blue-deep); }
#settings-screen .establishment-picker > summary { border-color: #caa757; background: #fff; color: var(--look-text); cursor: pointer; }
#settings-screen .establishment-picker-options { border-color: #d1ad5c; background: #fff; box-shadow: 0 10px 28px #173d6624; }
#settings-screen .establishment-picker-options button { border-color: var(--look-line); color: var(--look-text); background: #fff; }
#settings-screen .establishment-picker-options button[aria-pressed="true"] { border-color: #96bde4; background: var(--look-blue-soft); color: var(--look-blue-deep); }
#settings-screen .establishment-picker-options button:not(:disabled):hover { background: #edf5ff; }

/* Opt-in only: do not replace functional pseudo-elements of toggles or selectors. */
#app-shell :is(.primary-button, .back-button, .tab, .settings-tab, .owner-shop-apply, .professional-apply),
.owner-client-dialog :is(.primary-button, .client-profile-tabs button) {
  --look-button-surface: #fff;
  --look-button-shadow: 0 1px 3px #76501a0a;
  position: relative;
  isolation: isolate;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent !important;
  box-shadow: none;
  color: var(--look-blue-deep);
  transition: color .18s ease;
}
#app-shell :is(.primary-button, .back-button, .owner-shop-apply, .professional-apply),
.owner-client-dialog button.primary-button {
  --look-button-surface: #2375c5;
  color: #fff !important;
}
#app-shell :is(.tab.selected, .settings-tab.selected),
.owner-client-dialog .client-profile-tabs button[aria-selected="true"] {
  --look-button-surface: #e7f2ff;
  --look-button-shadow: inset 0 -2px #2375c5;
  color: var(--look-blue-deep);
}
#app-shell :is(.primary-button, .back-button, .tab, .settings-tab, .owner-shop-apply, .professional-apply)::after,
.owner-client-dialog :is(.primary-button, .client-profile-tabs button)::after {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;
  pointer-events: none;
  box-sizing: border-box;
  border: 1px solid transparent;
  border-radius: inherit;
  background: linear-gradient(var(--look-button-surface), var(--look-button-surface)) padding-box, var(--look-gold-edge) border-box;
  box-shadow: var(--look-button-shadow);
  transition: transform .18s ease, box-shadow .18s ease;
}
#app-shell :is(.tab, .settings-tab):not(:disabled):hover,
.owner-client-dialog .client-profile-tabs button:not(:disabled):hover { --look-button-surface: #edf5ff; --look-button-shadow: 0 3px 10px #2375c51c; }
#app-shell :is(.primary-button, .back-button, .owner-shop-apply, .professional-apply):not(:disabled):hover,
.owner-client-dialog button.primary-button:not(:disabled):hover { --look-button-surface: #1a66b2; --look-button-shadow: 0 3px 10px #2375c533; }
#app-shell :is(.primary-button, .owner-shop-apply, .professional-apply):disabled { --look-button-surface: #d9e2ec; color: #718095 !important; opacity: .65; }

/* Secondary owner actions use the same blue family, while danger links stay red. */
#app-shell .text-button:not(.danger-link),
#app-shell [data-edit-barber],
#app-shell .client-owner-card button {
  color: var(--look-blue-deep);
  border-color: #cfb574;
  border-radius: 10px;
}
#app-shell .text-button:not(.danger-link):hover,
#app-shell [data-edit-barber]:hover,
#app-shell .client-owner-card button:hover { background-color: #edf5ff; }
#app-shell .form-actions > button:not(.primary-button) { color: #4b6480; border-radius: 10px; }

/* Body-mounted owner dialogs are outside the application shell. */
dialog:not(.barber-dialog):not(.nf-dialog) {
  border: 1px solid transparent;
  border-radius: 18px;
  background: linear-gradient(#fff, #fff) padding-box, var(--look-gold-edge) border-box;
  box-shadow: 0 18px 50px #183c6133;
}
dialog:not(.barber-dialog):not(.nf-dialog)::backdrop { background: #10284380; }
dialog:not(.barber-dialog):not(.nf-dialog) h2 { color: var(--look-blue-deep); }
dialog:not(.barber-dialog):not(.nf-dialog) :is(.dialog-close, .iamlook-dialog-close, .client-profile-close-top) {
  background: #eaf2fb;
  color: var(--look-blue-deep);
}
.owner-confirmation {
  border: 1px solid transparent;
  background: linear-gradient(#fff, #fff) padding-box, var(--look-gold-edge) border-box;
  border-radius: 18px;
}
dialog:not(.barber-dialog):not(.nf-dialog) :is(menu > button, footer > button) {
  border: 1px solid #c9a657;
  border-radius: 11px;
}
dialog:not(.barber-dialog):not(.nf-dialog) :is(menu > button, footer > button):not(:disabled):hover {
  box-shadow: 0 0 0 2px #2375c51c;
}
dialog:not(.barber-dialog):not(.nf-dialog) :is(.link-dialog-back, .lifecycle-back, #close-details, #back-cancel-review, #cancel-delete-service, #back-improvement-suggestions) {
  background: #edf5ff;
  color: var(--look-blue-deep);
}
.owner-client-dialog .client-profile-tabs button { border-color: transparent; }
.owner-client-dialog :is(.client-history-entry, .client-observation-readonly, .client-photo-readonly) { border-color: #dfc78e; background: #f8faff; border-radius: 12px; }

/* Feedback is shared; disabled controls never invite a click. */
:is(#app-shell, #barber-shell, dialog, .owner-confirmation) button:not(:disabled):not([aria-disabled="true"]),
:is(#app-shell, #barber-shell, dialog) [role="button"]:not([aria-disabled="true"]) { cursor: pointer; }
:is(#app-shell, #barber-shell, dialog, .owner-confirmation) button:disabled { cursor: not-allowed; }
:is(#app-shell, #barber-shell, dialog, .owner-confirmation) button:focus-visible {
  outline: 2px solid var(--look-blue);
  outline-offset: 3px;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  #app-shell :is(.primary-button, .back-button, .tab, .settings-tab, .owner-shop-apply, .professional-apply):not(:disabled):hover::after,
  .owner-client-dialog :is(.primary-button, .client-profile-tabs button):not(:disabled):hover::after { transform: scale(1.02); }
  #app-shell :is(.primary-button, .back-button, .tab, .settings-tab, .owner-shop-apply, .professional-apply):not(:disabled):active::after,
  .owner-client-dialog :is(.primary-button, .client-profile-tabs button):not(:disabled):active::after { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  #app-shell :is(.primary-button, .back-button, .tab, .settings-tab, .owner-shop-apply, .professional-apply)::after,
  .owner-client-dialog :is(.primary-button, .client-profile-tabs button)::after { transition: none; }
}
.team-permission-details { margin-top: 12px; }
/* Shared configuration blocks: keep record actions and layout behavior intact. */
#settings-screen :is(.service-item, .barber-card, .rule-card, .client-owner-card,
  .add-form, .summary-permissions, .barber-vale-settings, .rule-settings,
  .sound-card, .cancellation-settings, .team-permission-area, .team-access-overview) {
  border: 1px solid #caa757;
  border-radius: 18px;
  background-color: #fff;
  box-shadow: 0 3px 12px #173d6610;
  min-width: 0;
}
#settings-screen :is(.cancellation-settings, .summary-permissions, .barber-vale-settings) { padding: 18px; margin-block: 16px; }
#settings-screen :is(.sound-card, .rule-card, .cancellation-settings) h3 { color: #14549a; }
#new-finance-screen .nf :is(.nf-panel, .nf-card, .nf-cash-box),
#finance-panel :is(.finance-report, .finance-summary article) {
  border-color: #caa757;
  border-radius: 18px;
}
.team-permission-details summary { cursor: pointer; color: #176291; font-weight: 600; padding: 8px 0; }
.team-permission-sections { display: grid; gap: 12px; margin-top: 12px; }
.team-permission-section { min-width: 0; margin: 0; padding: 14px; border: 1px solid #dce7ef; border-radius: 14px; background: #f9fbfd; }
.team-permission-section legend { color: #234a67; padding: 0 6px; font-weight: 700; }
.team-permission-section .team-permission-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 540px) { .team-permission-section .team-permission-actions { grid-template-columns: 1fr; } }

/* Only the individual establishment sections have a card surface. */
#app-shell:has(#settings-screen[data-category="profile"]:not([hidden])) { padding-bottom: 15px; }
#barbershop-form > .establishment-settings-block:last-of-type { margin-bottom: 0; }
#shop-autosave-status:empty { display: none; }
#app-shell #settings-screen #barbershop-form {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  padding: 0;
}