@charset "UTF-8";
.ion-ios-add:before {
  content: "\f102";
}

.ion-ios-add-circle:before {
  content: "\f101";
}

.ion-ios-add-circle-outline:before {
  content: "\f100";
}

.ion-ios-add-outline:before {
  content: "\f102";
}

.ion-ios-alarm:before {
  content: "\f3c8";
}

.ion-ios-alarm-outline:before {
  content: "\f3c7";
}

.ion-ios-albums:before {
  content: "\f3ca";
}

.ion-ios-albums-outline:before {
  content: "\f3c9";
}

.ion-ios-alert:before {
  content: "\f104";
}

.ion-ios-alert-outline:before {
  content: "\f103";
}

.ion-ios-american-football:before {
  content: "\f106";
}

.ion-ios-american-football-outline:before {
  content: "\f105";
}

.ion-ios-analytics:before {
  content: "\f3ce";
}

.ion-ios-analytics-outline:before {
  content: "\f3cd";
}

.ion-ios-aperture:before {
  content: "\f108";
}

.ion-ios-aperture-outline:before {
  content: "\f107";
}

.ion-ios-apps:before {
  content: "\f10a";
}

.ion-ios-apps-outline:before {
  content: "\f109";
}

.ion-ios-appstore:before {
  content: "\f10c";
}

.ion-ios-appstore-outline:before {
  content: "\f10b";
}

.ion-ios-archive:before {
  content: "\f10e";
}

.ion-ios-archive-outline:before {
  content: "\f10d";
}

.ion-ios-arrow-back:before {
  content: "\f3cf";
}

.ion-ios-arrow-back-outline:before {
  content: "\f3cf";
}

.ion-ios-arrow-down:before {
  content: "\f3d0";
}

.ion-ios-arrow-down-outline:before {
  content: "\f3d0";
}

.ion-ios-arrow-dropdown:before {
  content: "\f110";
}

.ion-ios-arrow-dropdown-circle:before {
  content: "\f10f";
}

.ion-ios-arrow-dropdown-circle-outline:before {
  content: "\f10f";
}

.ion-ios-arrow-dropdown-outline:before {
  content: "\f110";
}

.ion-ios-arrow-dropleft:before {
  content: "\f112";
}

.ion-ios-arrow-dropleft-circle:before {
  content: "\f111";
}

.ion-ios-arrow-dropleft-circle-outline:before {
  content: "\f111";
}

.ion-ios-arrow-dropleft-outline:before {
  content: "\f112";
}

.ion-ios-arrow-dropright:before {
  content: "\f114";
}

.ion-ios-arrow-dropright-circle:before {
  content: "\f113";
}

.ion-ios-arrow-dropright-circle-outline:before {
  content: "\f113";
}

.ion-ios-arrow-dropright-outline:before {
  content: "\f114";
}

.ion-ios-arrow-dropup:before {
  content: "\f116";
}

.ion-ios-arrow-dropup-circle:before {
  content: "\f115";
}

.ion-ios-arrow-dropup-circle-outline:before {
  content: "\f115";
}

.ion-ios-arrow-dropup-outline:before {
  content: "\f116";
}

.ion-ios-arrow-forward:before {
  content: "\f3d1";
}

.ion-ios-arrow-forward-outline:before {
  content: "\f3d1";
}

.ion-ios-arrow-round-back:before {
  content: "\f117";
}

.ion-ios-arrow-round-back-outline:before {
  content: "\f117";
}

.ion-ios-arrow-round-down:before {
  content: "\f118";
}

.ion-ios-arrow-round-down-outline:before {
  content: "\f118";
}

.ion-ios-arrow-round-forward:before {
  content: "\f119";
}

.ion-ios-arrow-round-forward-outline:before {
  content: "\f119";
}

.ion-ios-arrow-round-up:before {
  content: "\f11a";
}

.ion-ios-arrow-round-up-outline:before {
  content: "\f11a";
}

.ion-ios-arrow-up:before {
  content: "\f3d8";
}

.ion-ios-arrow-up-outline:before {
  content: "\f3d8";
}

.ion-ios-at:before {
  content: "\f3da";
}

.ion-ios-at-outline:before {
  content: "\f3d9";
}

.ion-ios-attach:before {
  content: "\f11b";
}

.ion-ios-attach-outline:before {
  content: "\f11b";
}

.ion-ios-backspace:before {
  content: "\f11d";
}

.ion-ios-backspace-outline:before {
  content: "\f11c";
}

.ion-ios-barcode:before {
  content: "\f3dc";
}

.ion-ios-barcode-outline:before {
  content: "\f3db";
}

.ion-ios-baseball:before {
  content: "\f3de";
}

.ion-ios-baseball-outline:before {
  content: "\f3dd";
}

.ion-ios-basket:before {
  content: "\f11f";
}

.ion-ios-basket-outline:before {
  content: "\f11e";
}

.ion-ios-basketball:before {
  content: "\f3e0";
}

.ion-ios-basketball-outline:before {
  content: "\f3df";
}

.ion-ios-battery-charging:before {
  content: "\f120";
}

.ion-ios-battery-charging-outline:before {
  content: "\f120";
}

.ion-ios-battery-dead:before {
  content: "\f121";
}

.ion-ios-battery-dead-outline:before {
  content: "\f121";
}

.ion-ios-battery-full:before {
  content: "\f122";
}

.ion-ios-battery-full-outline:before {
  content: "\f122";
}

.ion-ios-beaker:before {
  content: "\f124";
}

.ion-ios-beaker-outline:before {
  content: "\f123";
}

.ion-ios-beer:before {
  content: "\f126";
}

.ion-ios-beer-outline:before {
  content: "\f125";
}

.ion-ios-bicycle:before {
  content: "\f127";
}

.ion-ios-bicycle-outline:before {
  content: "\f127";
}

.ion-ios-bluetooth:before {
  content: "\f128";
}

.ion-ios-bluetooth-outline:before {
  content: "\f128";
}

.ion-ios-boat:before {
  content: "\f12a";
}

.ion-ios-boat-outline:before {
  content: "\f129";
}

.ion-ios-body:before {
  content: "\f3e4";
}

.ion-ios-body-outline:before {
  content: "\f3e3";
}

.ion-ios-bonfire:before {
  content: "\f12c";
}

.ion-ios-bonfire-outline:before {
  content: "\f12b";
}

.ion-ios-book:before {
  content: "\f3e8";
}

.ion-ios-book-outline:before {
  content: "\f3e7";
}

.ion-ios-bookmark:before {
  content: "\f12e";
}

.ion-ios-bookmark-outline:before {
  content: "\f12d";
}

.ion-ios-bookmarks:before {
  content: "\f3ea";
}

.ion-ios-bookmarks-outline:before {
  content: "\f3e9";
}

.ion-ios-bowtie:before {
  content: "\f130";
}

.ion-ios-bowtie-outline:before {
  content: "\f12f";
}

.ion-ios-briefcase:before {
  content: "\f3ee";
}

.ion-ios-briefcase-outline:before {
  content: "\f3ed";
}

.ion-ios-browsers:before {
  content: "\f3f0";
}

.ion-ios-browsers-outline:before {
  content: "\f3ef";
}

.ion-ios-brush:before {
  content: "\f132";
}

.ion-ios-brush-outline:before {
  content: "\f131";
}

.ion-ios-bug:before {
  content: "\f134";
}

.ion-ios-bug-outline:before {
  content: "\f133";
}

.ion-ios-build:before {
  content: "\f136";
}

.ion-ios-build-outline:before {
  content: "\f135";
}

.ion-ios-bulb:before {
  content: "\f138";
}

.ion-ios-bulb-outline:before {
  content: "\f137";
}

.ion-ios-bus:before {
  content: "\f13a";
}

.ion-ios-bus-outline:before {
  content: "\f139";
}

.ion-ios-cafe:before {
  content: "\f13c";
}

.ion-ios-cafe-outline:before {
  content: "\f13b";
}

.ion-ios-calculator:before {
  content: "\f3f2";
}

.ion-ios-calculator-outline:before {
  content: "\f3f1";
}

.ion-ios-calendar:before {
  content: "\f3f4";
}

.ion-ios-calendar-outline:before {
  content: "\f3f3";
}

.ion-ios-call:before {
  content: "\f13e";
}

.ion-ios-call-outline:before {
  content: "\f13d";
}

.ion-ios-camera:before {
  content: "\f3f6";
}

.ion-ios-camera-outline:before {
  content: "\f3f5";
}

.ion-ios-car:before {
  content: "\f140";
}

.ion-ios-car-outline:before {
  content: "\f13f";
}

.ion-ios-card:before {
  content: "\f142";
}

.ion-ios-card-outline:before {
  content: "\f141";
}

.ion-ios-cart:before {
  content: "\f3f8";
}

.ion-ios-cart-outline:before {
  content: "\f3f7";
}

.ion-ios-cash:before {
  content: "\f144";
}

.ion-ios-cash-outline:before {
  content: "\f143";
}

.ion-ios-chatboxes:before {
  content: "\f3fa";
}

.ion-ios-chatboxes-outline:before {
  content: "\f3f9";
}

.ion-ios-chatbubbles:before {
  content: "\f146";
}

.ion-ios-chatbubbles-outline:before {
  content: "\f145";
}

.ion-ios-checkbox:before {
  content: "\f148";
}

.ion-ios-checkbox-outline:before {
  content: "\f147";
}

.ion-ios-checkmark:before {
  content: "\f3ff";
}

.ion-ios-checkmark-circle:before {
  content: "\f14a";
}

.ion-ios-checkmark-circle-outline:before {
  content: "\f149";
}

.ion-ios-checkmark-outline:before {
  content: "\f3ff";
}

.ion-ios-clipboard:before {
  content: "\f14c";
}

.ion-ios-clipboard-outline:before {
  content: "\f14b";
}

.ion-ios-clock:before {
  content: "\f403";
}

.ion-ios-clock-outline:before {
  content: "\f402";
}

.ion-ios-close:before {
  content: "\f406";
}

.ion-ios-close-circle:before {
  content: "\f14e";
}

.ion-ios-close-circle-outline:before {
  content: "\f14d";
}

.ion-ios-close-outline:before {
  content: "\f406";
}

.ion-ios-closed-captioning:before {
  content: "\f150";
}

.ion-ios-closed-captioning-outline:before {
  content: "\f14f";
}

.ion-ios-cloud:before {
  content: "\f40c";
}

.ion-ios-cloud-circle:before {
  content: "\f152";
}

.ion-ios-cloud-circle-outline:before {
  content: "\f151";
}

.ion-ios-cloud-done:before {
  content: "\f154";
}

.ion-ios-cloud-done-outline:before {
  content: "\f153";
}

.ion-ios-cloud-download:before {
  content: "\f408";
}

.ion-ios-cloud-download-outline:before {
  content: "\f407";
}

.ion-ios-cloud-outline:before {
  content: "\f409";
}

.ion-ios-cloud-upload:before {
  content: "\f40b";
}

.ion-ios-cloud-upload-outline:before {
  content: "\f40a";
}

.ion-ios-cloudy:before {
  content: "\f410";
}

.ion-ios-cloudy-night:before {
  content: "\f40e";
}

.ion-ios-cloudy-night-outline:before {
  content: "\f40d";
}

.ion-ios-cloudy-outline:before {
  content: "\f40f";
}

.ion-ios-code:before {
  content: "\f157";
}

.ion-ios-code-download:before {
  content: "\f155";
}

.ion-ios-code-download-outline:before {
  content: "\f155";
}

.ion-ios-code-outline:before {
  content: "\f157";
}

.ion-ios-code-working:before {
  content: "\f156";
}

.ion-ios-code-working-outline:before {
  content: "\f156";
}

.ion-ios-cog:before {
  content: "\f412";
}

.ion-ios-cog-outline:before {
  content: "\f411";
}

.ion-ios-color-fill:before {
  content: "\f159";
}

.ion-ios-color-fill-outline:before {
  content: "\f158";
}

.ion-ios-color-filter:before {
  content: "\f414";
}

.ion-ios-color-filter-outline:before {
  content: "\f413";
}

.ion-ios-color-palette:before {
  content: "\f15b";
}

.ion-ios-color-palette-outline:before {
  content: "\f15a";
}

.ion-ios-color-wand:before {
  content: "\f416";
}

.ion-ios-color-wand-outline:before {
  content: "\f415";
}

.ion-ios-compass:before {
  content: "\f15d";
}

.ion-ios-compass-outline:before {
  content: "\f15c";
}

.ion-ios-construct:before {
  content: "\f15f";
}

.ion-ios-construct-outline:before {
  content: "\f15e";
}

.ion-ios-contact:before {
  content: "\f41a";
}

.ion-ios-contact-outline:before {
  content: "\f419";
}

.ion-ios-contacts:before {
  content: "\f161";
}

.ion-ios-contacts-outline:before {
  content: "\f160";
}

.ion-ios-contract:before {
  content: "\f162";
}

.ion-ios-contract-outline:before {
  content: "\f162";
}

.ion-ios-contrast:before {
  content: "\f163";
}

.ion-ios-contrast-outline:before {
  content: "\f163";
}

.ion-ios-copy:before {
  content: "\f41c";
}

.ion-ios-copy-outline:before {
  content: "\f41b";
}

.ion-ios-create:before {
  content: "\f165";
}

.ion-ios-create-outline:before {
  content: "\f164";
}

.ion-ios-crop:before {
  content: "\f41e";
}

.ion-ios-crop-outline:before {
  content: "\f166";
}

.ion-ios-cube:before {
  content: "\f168";
}

.ion-ios-cube-outline:before {
  content: "\f167";
}

.ion-ios-cut:before {
  content: "\f16a";
}

.ion-ios-cut-outline:before {
  content: "\f169";
}

.ion-ios-desktop:before {
  content: "\f16c";
}

.ion-ios-desktop-outline:before {
  content: "\f16b";
}

.ion-ios-disc:before {
  content: "\f16e";
}

.ion-ios-disc-outline:before {
  content: "\f16d";
}

.ion-ios-document:before {
  content: "\f170";
}

.ion-ios-document-outline:before {
  content: "\f16f";
}

.ion-ios-done-all:before {
  content: "\f171";
}

.ion-ios-done-all-outline:before {
  content: "\f171";
}

.ion-ios-download:before {
  content: "\f420";
}

.ion-ios-download-outline:before {
  content: "\f41f";
}

.ion-ios-easel:before {
  content: "\f173";
}

.ion-ios-easel-outline:before {
  content: "\f172";
}

.ion-ios-egg:before {
  content: "\f175";
}

.ion-ios-egg-outline:before {
  content: "\f174";
}

.ion-ios-exit:before {
  content: "\f177";
}

.ion-ios-exit-outline:before {
  content: "\f176";
}

.ion-ios-expand:before {
  content: "\f178";
}

.ion-ios-expand-outline:before {
  content: "\f178";
}

.ion-ios-eye:before {
  content: "\f425";
}

.ion-ios-eye-off:before {
  content: "\f17a";
}

.ion-ios-eye-off-outline:before {
  content: "\f179";
}

.ion-ios-eye-outline:before {
  content: "\f424";
}

.ion-ios-fastforward:before {
  content: "\f427";
}

.ion-ios-fastforward-outline:before {
  content: "\f426";
}

.ion-ios-female:before {
  content: "\f17b";
}

.ion-ios-female-outline:before {
  content: "\f17b";
}

.ion-ios-filing:before {
  content: "\f429";
}

.ion-ios-filing-outline:before {
  content: "\f428";
}

.ion-ios-film:before {
  content: "\f42b";
}

.ion-ios-film-outline:before {
  content: "\f42a";
}

.ion-ios-finger-print:before {
  content: "\f17c";
}

.ion-ios-finger-print-outline:before {
  content: "\f17c";
}

.ion-ios-flag:before {
  content: "\f42d";
}

.ion-ios-flag-outline:before {
  content: "\f42c";
}

.ion-ios-flame:before {
  content: "\f42f";
}

.ion-ios-flame-outline:before {
  content: "\f42e";
}

.ion-ios-flash:before {
  content: "\f17e";
}

.ion-ios-flash-outline:before {
  content: "\f17d";
}

.ion-ios-flask:before {
  content: "\f431";
}

.ion-ios-flask-outline:before {
  content: "\f430";
}

.ion-ios-flower:before {
  content: "\f433";
}

.ion-ios-flower-outline:before {
  content: "\f432";
}

.ion-ios-folder:before {
  content: "\f435";
}

.ion-ios-folder-open:before {
  content: "\f180";
}

.ion-ios-folder-open-outline:before {
  content: "\f17f";
}

.ion-ios-folder-outline:before {
  content: "\f434";
}

.ion-ios-football:before {
  content: "\f437";
}

.ion-ios-football-outline:before {
  content: "\f436";
}

.ion-ios-funnel:before {
  content: "\f182";
}

.ion-ios-funnel-outline:before {
  content: "\f181";
}

.ion-ios-game-controller-a:before {
  content: "\f439";
}

.ion-ios-game-controller-a-outline:before {
  content: "\f438";
}

.ion-ios-game-controller-b:before {
  content: "\f43b";
}

.ion-ios-game-controller-b-outline:before {
  content: "\f43a";
}

.ion-ios-git-branch:before {
  content: "\f183";
}

.ion-ios-git-branch-outline:before {
  content: "\f183";
}

.ion-ios-git-commit:before {
  content: "\f184";
}

.ion-ios-git-commit-outline:before {
  content: "\f184";
}

.ion-ios-git-compare:before {
  content: "\f185";
}

.ion-ios-git-compare-outline:before {
  content: "\f185";
}

.ion-ios-git-merge:before {
  content: "\f186";
}

.ion-ios-git-merge-outline:before {
  content: "\f186";
}

.ion-ios-git-network:before {
  content: "\f187";
}

.ion-ios-git-network-outline:before {
  content: "\f187";
}

.ion-ios-git-pull-request:before {
  content: "\f188";
}

.ion-ios-git-pull-request-outline:before {
  content: "\f188";
}

.ion-ios-glasses:before {
  content: "\f43f";
}

.ion-ios-glasses-outline:before {
  content: "\f43e";
}

.ion-ios-globe:before {
  content: "\f18a";
}

.ion-ios-globe-outline:before {
  content: "\f189";
}

.ion-ios-grid:before {
  content: "\f18c";
}

.ion-ios-grid-outline:before {
  content: "\f18b";
}

.ion-ios-hammer:before {
  content: "\f18e";
}

.ion-ios-hammer-outline:before {
  content: "\f18d";
}

.ion-ios-hand:before {
  content: "\f190";
}

.ion-ios-hand-outline:before {
  content: "\f18f";
}

.ion-ios-happy:before {
  content: "\f192";
}

.ion-ios-happy-outline:before {
  content: "\f191";
}

.ion-ios-headset:before {
  content: "\f194";
}

.ion-ios-headset-outline:before {
  content: "\f193";
}

.ion-ios-heart:before {
  content: "\f443";
}

.ion-ios-heart-outline:before {
  content: "\f442";
}

.ion-ios-help:before {
  content: "\f446";
}

.ion-ios-help-buoy:before {
  content: "\f196";
}

.ion-ios-help-buoy-outline:before {
  content: "\f195";
}

.ion-ios-help-circle:before {
  content: "\f198";
}

.ion-ios-help-circle-outline:before {
  content: "\f197";
}

.ion-ios-help-outline:before {
  content: "\f446";
}

.ion-ios-home:before {
  content: "\f448";
}

.ion-ios-home-outline:before {
  content: "\f447";
}

.ion-ios-ice-cream:before {
  content: "\f19a";
}

.ion-ios-ice-cream-outline:before {
  content: "\f199";
}

.ion-ios-image:before {
  content: "\f19c";
}

.ion-ios-image-outline:before {
  content: "\f19b";
}

.ion-ios-images:before {
  content: "\f19e";
}

.ion-ios-images-outline:before {
  content: "\f19d";
}

.ion-ios-infinite:before {
  content: "\f44a";
}

.ion-ios-infinite-outline:before {
  content: "\f449";
}

.ion-ios-information:before {
  content: "\f44d";
}

.ion-ios-information-circle:before {
  content: "\f1a0";
}

.ion-ios-information-circle-outline:before {
  content: "\f19f";
}

.ion-ios-information-outline:before {
  content: "\f44d";
}

.ion-ios-ionic:before {
  content: "\f1a1";
}

.ion-ios-ionic-outline:before {
  content: "\f44e";
}

.ion-ios-ionitron:before {
  content: "\f1a3";
}

.ion-ios-ionitron-outline:before {
  content: "\f1a2";
}

.ion-ios-jet:before {
  content: "\f1a5";
}

.ion-ios-jet-outline:before {
  content: "\f1a4";
}

.ion-ios-key:before {
  content: "\f1a7";
}

.ion-ios-key-outline:before {
  content: "\f1a6";
}

.ion-ios-keypad:before {
  content: "\f450";
}

.ion-ios-keypad-outline:before {
  content: "\f44f";
}

.ion-ios-laptop:before {
  content: "\f1a8";
}

.ion-ios-laptop-outline:before {
  content: "\f1a8";
}

.ion-ios-leaf:before {
  content: "\f1aa";
}

.ion-ios-leaf-outline:before {
  content: "\f1a9";
}

.ion-ios-link:before {
  content: "\f22a";
}

.ion-ios-link-outline:before {
  content: "\f1ca";
}

.ion-ios-list:before {
  content: "\f454";
}

.ion-ios-list-box:before {
  content: "\f1ac";
}

.ion-ios-list-box-outline:before {
  content: "\f1ab";
}

.ion-ios-list-outline:before {
  content: "\f454";
}

.ion-ios-locate:before {
  content: "\f1ae";
}

.ion-ios-locate-outline:before {
  content: "\f1ad";
}

.ion-ios-lock:before {
  content: "\f1b0";
}

.ion-ios-lock-outline:before {
  content: "\f1af";
}

.ion-ios-log-in:before {
  content: "\f1b1";
}

.ion-ios-log-in-outline:before {
  content: "\f1b1";
}

.ion-ios-log-out:before {
  content: "\f1b2";
}

.ion-ios-log-out-outline:before {
  content: "\f1b2";
}

.ion-ios-magnet:before {
  content: "\f1b4";
}

.ion-ios-magnet-outline:before {
  content: "\f1b3";
}

.ion-ios-mail:before {
  content: "\f1b8";
}

.ion-ios-mail-open:before {
  content: "\f1b6";
}

.ion-ios-mail-open-outline:before {
  content: "\f1b5";
}

.ion-ios-mail-outline:before {
  content: "\f1b7";
}

.ion-ios-male:before {
  content: "\f1b9";
}

.ion-ios-male-outline:before {
  content: "\f1b9";
}

.ion-ios-man:before {
  content: "\f1bb";
}

.ion-ios-man-outline:before {
  content: "\f1ba";
}

.ion-ios-map:before {
  content: "\f1bd";
}

.ion-ios-map-outline:before {
  content: "\f1bc";
}

.ion-ios-medal:before {
  content: "\f1bf";
}

.ion-ios-medal-outline:before {
  content: "\f1be";
}

.ion-ios-medical:before {
  content: "\f45c";
}

.ion-ios-medical-outline:before {
  content: "\f45b";
}

.ion-ios-medkit:before {
  content: "\f45e";
}

.ion-ios-medkit-outline:before {
  content: "\f45d";
}

.ion-ios-megaphone:before {
  content: "\f1c1";
}

.ion-ios-megaphone-outline:before {
  content: "\f1c0";
}

.ion-ios-menu:before {
  content: "\f1c3";
}

.ion-ios-menu-outline:before {
  content: "\f1c2";
}

.ion-ios-mic:before {
  content: "\f461";
}

.ion-ios-mic-off:before {
  content: "\f45f";
}

.ion-ios-mic-off-outline:before {
  content: "\f1c4";
}

.ion-ios-mic-outline:before {
  content: "\f460";
}

.ion-ios-microphone:before {
  content: "\f1c6";
}

.ion-ios-microphone-outline:before {
  content: "\f1c5";
}

.ion-ios-moon:before {
  content: "\f468";
}

.ion-ios-moon-outline:before {
  content: "\f467";
}

.ion-ios-more:before {
  content: "\f1c8";
}

.ion-ios-more-outline:before {
  content: "\f1c7";
}

.ion-ios-move:before {
  content: "\f1cb";
}

.ion-ios-move-outline:before {
  content: "\f1cb";
}

.ion-ios-musical-note:before {
  content: "\f46b";
}

.ion-ios-musical-note-outline:before {
  content: "\f1cc";
}

.ion-ios-musical-notes:before {
  content: "\f46c";
}

.ion-ios-musical-notes-outline:before {
  content: "\f1cd";
}

.ion-ios-navigate:before {
  content: "\f46e";
}

.ion-ios-navigate-outline:before {
  content: "\f46d";
}

.ion-ios-no-smoking:before {
  content: "\f1cf";
}

.ion-ios-no-smoking-outline:before {
  content: "\f1ce";
}

.ion-ios-notifications:before {
  content: "\f1d3";
}

.ion-ios-notifications-off:before {
  content: "\f1d1";
}

.ion-ios-notifications-off-outline:before {
  content: "\f1d0";
}

.ion-ios-notifications-outline:before {
  content: "\f1d2";
}

.ion-ios-nuclear:before {
  content: "\f1d5";
}

.ion-ios-nuclear-outline:before {
  content: "\f1d4";
}

.ion-ios-nutrition:before {
  content: "\f470";
}

.ion-ios-nutrition-outline:before {
  content: "\f46f";
}

.ion-ios-open:before {
  content: "\f1d7";
}

.ion-ios-open-outline:before {
  content: "\f1d6";
}

.ion-ios-options:before {
  content: "\f1d9";
}

.ion-ios-options-outline:before {
  content: "\f1d8";
}

.ion-ios-outlet:before {
  content: "\f1db";
}

.ion-ios-outlet-outline:before {
  content: "\f1da";
}

.ion-ios-paper:before {
  content: "\f472";
}

.ion-ios-paper-outline:before {
  content: "\f471";
}

.ion-ios-paper-plane:before {
  content: "\f1dd";
}

.ion-ios-paper-plane-outline:before {
  content: "\f1dc";
}

.ion-ios-partly-sunny:before {
  content: "\f1df";
}

.ion-ios-partly-sunny-outline:before {
  content: "\f1de";
}

.ion-ios-pause:before {
  content: "\f478";
}

.ion-ios-pause-outline:before {
  content: "\f477";
}

.ion-ios-paw:before {
  content: "\f47a";
}

.ion-ios-paw-outline:before {
  content: "\f479";
}

.ion-ios-people:before {
  content: "\f47c";
}

.ion-ios-people-outline:before {
  content: "\f47b";
}

.ion-ios-person:before {
  content: "\f47e";
}

.ion-ios-person-add:before {
  content: "\f1e1";
}

.ion-ios-person-add-outline:before {
  content: "\f1e0";
}

.ion-ios-person-outline:before {
  content: "\f47d";
}

.ion-ios-phone-landscape:before {
  content: "\f1e2";
}

.ion-ios-phone-landscape-outline:before {
  content: "\f1e2";
}

.ion-ios-phone-portrait:before {
  content: "\f1e3";
}

.ion-ios-phone-portrait-outline:before {
  content: "\f1e3";
}

.ion-ios-photos:before {
  content: "\f482";
}

.ion-ios-photos-outline:before {
  content: "\f481";
}

.ion-ios-pie:before {
  content: "\f484";
}

.ion-ios-pie-outline:before {
  content: "\f483";
}

.ion-ios-pin:before {
  content: "\f1e5";
}

.ion-ios-pin-outline:before {
  content: "\f1e4";
}

.ion-ios-pint:before {
  content: "\f486";
}

.ion-ios-pint-outline:before {
  content: "\f485";
}

.ion-ios-pizza:before {
  content: "\f1e7";
}

.ion-ios-pizza-outline:before {
  content: "\f1e6";
}

.ion-ios-plane:before {
  content: "\f1e9";
}

.ion-ios-plane-outline:before {
  content: "\f1e8";
}

.ion-ios-planet:before {
  content: "\f1eb";
}

.ion-ios-planet-outline:before {
  content: "\f1ea";
}

.ion-ios-play:before {
  content: "\f488";
}

.ion-ios-play-outline:before {
  content: "\f487";
}

.ion-ios-podium:before {
  content: "\f1ed";
}

.ion-ios-podium-outline:before {
  content: "\f1ec";
}

.ion-ios-power:before {
  content: "\f1ef";
}

.ion-ios-power-outline:before {
  content: "\f1ee";
}

.ion-ios-pricetag:before {
  content: "\f48d";
}

.ion-ios-pricetag-outline:before {
  content: "\f48c";
}

.ion-ios-pricetags:before {
  content: "\f48f";
}

.ion-ios-pricetags-outline:before {
  content: "\f48e";
}

.ion-ios-print:before {
  content: "\f1f1";
}

.ion-ios-print-outline:before {
  content: "\f1f0";
}

.ion-ios-pulse:before {
  content: "\f493";
}

.ion-ios-pulse-outline:before {
  content: "\f1f2";
}

.ion-ios-qr-scanner:before {
  content: "\f1f3";
}

.ion-ios-qr-scanner-outline:before {
  content: "\f1f3";
}

.ion-ios-quote:before {
  content: "\f1f5";
}

.ion-ios-quote-outline:before {
  content: "\f1f4";
}

.ion-ios-radio:before {
  content: "\f1f9";
}

.ion-ios-radio-button-off:before {
  content: "\f1f6";
}

.ion-ios-radio-button-off-outline:before {
  content: "\f1f6";
}

.ion-ios-radio-button-on:before {
  content: "\f1f7";
}

.ion-ios-radio-button-on-outline:before {
  content: "\f1f7";
}

.ion-ios-radio-outline:before {
  content: "\f1f8";
}

.ion-ios-rainy:before {
  content: "\f495";
}

.ion-ios-rainy-outline:before {
  content: "\f494";
}

.ion-ios-recording:before {
  content: "\f497";
}

.ion-ios-recording-outline:before {
  content: "\f496";
}

.ion-ios-redo:before {
  content: "\f499";
}

.ion-ios-redo-outline:before {
  content: "\f498";
}

.ion-ios-refresh:before {
  content: "\f49c";
}

.ion-ios-refresh-circle:before {
  content: "\f226";
}

.ion-ios-refresh-circle-outline:before {
  content: "\f224";
}

.ion-ios-refresh-outline:before {
  content: "\f49c";
}

.ion-ios-remove:before {
  content: "\f1fc";
}

.ion-ios-remove-circle:before {
  content: "\f1fb";
}

.ion-ios-remove-circle-outline:before {
  content: "\f1fa";
}

.ion-ios-remove-outline:before {
  content: "\f1fc";
}

.ion-ios-reorder:before {
  content: "\f1fd";
}

.ion-ios-reorder-outline:before {
  content: "\f1fd";
}

.ion-ios-repeat:before {
  content: "\f1fe";
}

.ion-ios-repeat-outline:before {
  content: "\f1fe";
}

.ion-ios-resize:before {
  content: "\f1ff";
}

.ion-ios-resize-outline:before {
  content: "\f1ff";
}

.ion-ios-restaurant:before {
  content: "\f201";
}

.ion-ios-restaurant-outline:before {
  content: "\f200";
}

.ion-ios-return-left:before {
  content: "\f202";
}

.ion-ios-return-left-outline:before {
  content: "\f202";
}

.ion-ios-return-right:before {
  content: "\f203";
}

.ion-ios-return-right-outline:before {
  content: "\f203";
}

.ion-ios-reverse-camera:before {
  content: "\f49f";
}

.ion-ios-reverse-camera-outline:before {
  content: "\f49e";
}

.ion-ios-rewind:before {
  content: "\f4a1";
}

.ion-ios-rewind-outline:before {
  content: "\f4a0";
}

.ion-ios-ribbon:before {
  content: "\f205";
}

.ion-ios-ribbon-outline:before {
  content: "\f204";
}

.ion-ios-rose:before {
  content: "\f4a3";
}

.ion-ios-rose-outline:before {
  content: "\f4a2";
}

.ion-ios-sad:before {
  content: "\f207";
}

.ion-ios-sad-outline:before {
  content: "\f206";
}

.ion-ios-school:before {
  content: "\f209";
}

.ion-ios-school-outline:before {
  content: "\f208";
}

.ion-ios-search:before {
  content: "\f4a5";
}

.ion-ios-search-outline:before {
  content: "\f20a";
}

.ion-ios-send:before {
  content: "\f20c";
}

.ion-ios-send-outline:before {
  content: "\f20b";
}

.ion-ios-settings:before {
  content: "\f4a7";
}

.ion-ios-settings-outline:before {
  content: "\f20d";
}

.ion-ios-share:before {
  content: "\f211";
}

.ion-ios-share-alt:before {
  content: "\f20f";
}

.ion-ios-share-alt-outline:before {
  content: "\f20e";
}

.ion-ios-share-outline:before {
  content: "\f210";
}

.ion-ios-shirt:before {
  content: "\f213";
}

.ion-ios-shirt-outline:before {
  content: "\f212";
}

.ion-ios-shuffle:before {
  content: "\f4a9";
}

.ion-ios-shuffle-outline:before {
  content: "\f4a9";
}

.ion-ios-skip-backward:before {
  content: "\f215";
}

.ion-ios-skip-backward-outline:before {
  content: "\f214";
}

.ion-ios-skip-forward:before {
  content: "\f217";
}

.ion-ios-skip-forward-outline:before {
  content: "\f216";
}

.ion-ios-snow:before {
  content: "\f218";
}

.ion-ios-snow-outline:before {
  content: "\f22c";
}

.ion-ios-speedometer:before {
  content: "\f4b0";
}

.ion-ios-speedometer-outline:before {
  content: "\f4af";
}

.ion-ios-square:before {
  content: "\f21a";
}

.ion-ios-square-outline:before {
  content: "\f219";
}

.ion-ios-star:before {
  content: "\f4b3";
}

.ion-ios-star-half:before {
  content: "\f4b1";
}

.ion-ios-star-half-outline:before {
  content: "\f4b1";
}

.ion-ios-star-outline:before {
  content: "\f4b2";
}

.ion-ios-stats:before {
  content: "\f21c";
}

.ion-ios-stats-outline:before {
  content: "\f21b";
}

.ion-ios-stopwatch:before {
  content: "\f4b5";
}

.ion-ios-stopwatch-outline:before {
  content: "\f4b4";
}

.ion-ios-subway:before {
  content: "\f21e";
}

.ion-ios-subway-outline:before {
  content: "\f21d";
}

.ion-ios-sunny:before {
  content: "\f4b7";
}

.ion-ios-sunny-outline:before {
  content: "\f4b6";
}

.ion-ios-swap:before {
  content: "\f21f";
}

.ion-ios-swap-outline:before {
  content: "\f21f";
}

.ion-ios-switch:before {
  content: "\f221";
}

.ion-ios-switch-outline:before {
  content: "\f220";
}

.ion-ios-sync:before {
  content: "\f222";
}

.ion-ios-sync-outline:before {
  content: "\f222";
}

.ion-ios-tablet-landscape:before {
  content: "\f223";
}

.ion-ios-tablet-landscape-outline:before {
  content: "\f223";
}

.ion-ios-tablet-portrait:before {
  content: "\f24e";
}

.ion-ios-tablet-portrait-outline:before {
  content: "\f24e";
}

.ion-ios-tennisball:before {
  content: "\f4bb";
}

.ion-ios-tennisball-outline:before {
  content: "\f4ba";
}

.ion-ios-text:before {
  content: "\f250";
}

.ion-ios-text-outline:before {
  content: "\f24f";
}

.ion-ios-thermometer:before {
  content: "\f252";
}

.ion-ios-thermometer-outline:before {
  content: "\f251";
}

.ion-ios-thumbs-down:before {
  content: "\f254";
}

.ion-ios-thumbs-down-outline:before {
  content: "\f253";
}

.ion-ios-thumbs-up:before {
  content: "\f256";
}

.ion-ios-thumbs-up-outline:before {
  content: "\f255";
}

.ion-ios-thunderstorm:before {
  content: "\f4bd";
}

.ion-ios-thunderstorm-outline:before {
  content: "\f4bc";
}

.ion-ios-time:before {
  content: "\f4bf";
}

.ion-ios-time-outline:before {
  content: "\f4be";
}

.ion-ios-timer:before {
  content: "\f4c1";
}

.ion-ios-timer-outline:before {
  content: "\f4c0";
}

.ion-ios-train:before {
  content: "\f258";
}

.ion-ios-train-outline:before {
  content: "\f257";
}

.ion-ios-transgender:before {
  content: "\f259";
}

.ion-ios-transgender-outline:before {
  content: "\f259";
}

.ion-ios-trash:before {
  content: "\f4c5";
}

.ion-ios-trash-outline:before {
  content: "\f4c4";
}

.ion-ios-trending-down:before {
  content: "\f25a";
}

.ion-ios-trending-down-outline:before {
  content: "\f25a";
}

.ion-ios-trending-up:before {
  content: "\f25b";
}

.ion-ios-trending-up-outline:before {
  content: "\f25b";
}

.ion-ios-trophy:before {
  content: "\f25d";
}

.ion-ios-trophy-outline:before {
  content: "\f25c";
}

.ion-ios-umbrella:before {
  content: "\f25f";
}

.ion-ios-umbrella-outline:before {
  content: "\f25e";
}

.ion-ios-undo:before {
  content: "\f4c7";
}

.ion-ios-undo-outline:before {
  content: "\f4c6";
}

.ion-ios-unlock:before {
  content: "\f261";
}

.ion-ios-unlock-outline:before {
  content: "\f260";
}

.ion-ios-videocam:before {
  content: "\f4cd";
}

.ion-ios-videocam-outline:before {
  content: "\f4cc";
}

.ion-ios-volume-down:before {
  content: "\f262";
}

.ion-ios-volume-down-outline:before {
  content: "\f262";
}

.ion-ios-volume-mute:before {
  content: "\f263";
}

.ion-ios-volume-mute-outline:before {
  content: "\f263";
}

.ion-ios-volume-off:before {
  content: "\f264";
}

.ion-ios-volume-off-outline:before {
  content: "\f264";
}

.ion-ios-volume-up:before {
  content: "\f265";
}

.ion-ios-volume-up-outline:before {
  content: "\f265";
}

.ion-ios-walk:before {
  content: "\f266";
}

.ion-ios-walk-outline:before {
  content: "\f266";
}

.ion-ios-warning:before {
  content: "\f268";
}

.ion-ios-warning-outline:before {
  content: "\f267";
}

.ion-ios-watch:before {
  content: "\f269";
}

.ion-ios-watch-outline:before {
  content: "\f269";
}

.ion-ios-water:before {
  content: "\f26b";
}

.ion-ios-water-outline:before {
  content: "\f26a";
}

.ion-ios-wifi:before {
  content: "\f26d";
}

.ion-ios-wifi-outline:before {
  content: "\f26c";
}

.ion-ios-wine:before {
  content: "\f26f";
}

.ion-ios-wine-outline:before {
  content: "\f26e";
}

.ion-ios-woman:before {
  content: "\f271";
}

.ion-ios-woman-outline:before {
  content: "\f270";
}

.ion-logo-android:before {
  content: "\f225";
}

.ion-logo-angular:before {
  content: "\f227";
}

.ion-logo-apple:before {
  content: "\f229";
}

.ion-logo-bitcoin:before {
  content: "\f22b";
}

.ion-logo-buffer:before {
  content: "\f22d";
}

.ion-logo-chrome:before {
  content: "\f22f";
}

.ion-logo-codepen:before {
  content: "\f230";
}

.ion-logo-css3:before {
  content: "\f231";
}

.ion-logo-designernews:before {
  content: "\f232";
}

.ion-logo-dribbble:before {
  content: "\f233";
}

.ion-logo-dropbox:before {
  content: "\f234";
}

.ion-logo-euro:before {
  content: "\f235";
}

.ion-logo-facebook:before {
  content: "\f236";
}

.ion-logo-foursquare:before {
  content: "\f237";
}

.ion-logo-freebsd-devil:before {
  content: "\f238";
}

.ion-logo-github:before {
  content: "\f239";
}

.ion-logo-google:before {
  content: "\f23a";
}

.ion-logo-googleplus:before {
  content: "\f23b";
}

.ion-logo-hackernews:before {
  content: "\f23c";
}

.ion-logo-html5:before {
  content: "\f23d";
}

.ion-logo-instagram:before {
  content: "\f23e";
}

.ion-logo-javascript:before {
  content: "\f23f";
}

.ion-logo-linkedin:before {
  content: "\f240";
}

.ion-logo-markdown:before {
  content: "\f241";
}

.ion-logo-nodejs:before {
  content: "\f242";
}

.ion-logo-octocat:before {
  content: "\f243";
}

.ion-logo-pinterest:before {
  content: "\f244";
}

.ion-logo-playstation:before {
  content: "\f245";
}

.ion-logo-python:before {
  content: "\f246";
}

.ion-logo-reddit:before {
  content: "\f247";
}

.ion-logo-rss:before {
  content: "\f248";
}

.ion-logo-sass:before {
  content: "\f249";
}

.ion-logo-skype:before {
  content: "\f24a";
}

.ion-logo-snapchat:before {
  content: "\f24b";
}

.ion-logo-steam:before {
  content: "\f24c";
}

.ion-logo-tumblr:before {
  content: "\f24d";
}

.ion-logo-tux:before {
  content: "\f2ae";
}

.ion-logo-twitch:before {
  content: "\f2af";
}

.ion-logo-twitter:before {
  content: "\f2b0";
}

.ion-logo-usd:before {
  content: "\f2b1";
}

.ion-logo-vimeo:before {
  content: "\f2c4";
}

.ion-logo-whatsapp:before {
  content: "\f2c5";
}

.ion-logo-windows:before {
  content: "\f32f";
}

.ion-logo-wordpress:before {
  content: "\f330";
}

.ion-logo-xbox:before {
  content: "\f34c";
}

.ion-logo-yahoo:before {
  content: "\f34d";
}

.ion-logo-yen:before {
  content: "\f34e";
}

.ion-logo-youtube:before {
  content: "\f34f";
}

.ion-md-add:before {
  content: "\f273";
}

.ion-md-add-circle:before {
  content: "\f272";
}

.ion-md-alarm:before {
  content: "\f274";
}

.ion-md-albums:before {
  content: "\f275";
}

.ion-md-alert:before {
  content: "\f276";
}

.ion-md-american-football:before {
  content: "\f277";
}

.ion-md-analytics:before {
  content: "\f278";
}

.ion-md-aperture:before {
  content: "\f279";
}

.ion-md-apps:before {
  content: "\f27a";
}

.ion-md-appstore:before {
  content: "\f27b";
}

.ion-md-archive:before {
  content: "\f27c";
}

.ion-md-arrow-back:before {
  content: "\f27d";
}

.ion-md-arrow-down:before {
  content: "\f27e";
}

.ion-md-arrow-dropdown:before {
  content: "\f280";
}

.ion-md-arrow-dropdown-circle:before {
  content: "\f27f";
}

.ion-md-arrow-dropleft:before {
  content: "\f282";
}

.ion-md-arrow-dropleft-circle:before {
  content: "\f281";
}

.ion-md-arrow-dropright:before {
  content: "\f284";
}

.ion-md-arrow-dropright-circle:before {
  content: "\f283";
}

.ion-md-arrow-dropup:before {
  content: "\f286";
}

.ion-md-arrow-dropup-circle:before {
  content: "\f285";
}

.ion-md-arrow-forward:before {
  content: "\f287";
}

.ion-md-arrow-round-back:before {
  content: "\f288";
}

.ion-md-arrow-round-down:before {
  content: "\f289";
}

.ion-md-arrow-round-forward:before {
  content: "\f28a";
}

.ion-md-arrow-round-up:before {
  content: "\f28b";
}

.ion-md-arrow-up:before {
  content: "\f28c";
}

.ion-md-at:before {
  content: "\f28d";
}

.ion-md-attach:before {
  content: "\f28e";
}

.ion-md-backspace:before {
  content: "\f28f";
}

.ion-md-barcode:before {
  content: "\f290";
}

.ion-md-baseball:before {
  content: "\f291";
}

.ion-md-basket:before {
  content: "\f292";
}

.ion-md-basketball:before {
  content: "\f293";
}

.ion-md-battery-charging:before {
  content: "\f294";
}

.ion-md-battery-dead:before {
  content: "\f295";
}

.ion-md-battery-full:before {
  content: "\f296";
}

.ion-md-beaker:before {
  content: "\f297";
}

.ion-md-beer:before {
  content: "\f298";
}

.ion-md-bicycle:before {
  content: "\f299";
}

.ion-md-bluetooth:before {
  content: "\f29a";
}

.ion-md-boat:before {
  content: "\f29b";
}

.ion-md-body:before {
  content: "\f29c";
}

.ion-md-bonfire:before {
  content: "\f29d";
}

.ion-md-book:before {
  content: "\f29e";
}

.ion-md-bookmark:before {
  content: "\f29f";
}

.ion-md-bookmarks:before {
  content: "\f2a0";
}

.ion-md-bowtie:before {
  content: "\f2a1";
}

.ion-md-briefcase:before {
  content: "\f2a2";
}

.ion-md-browsers:before {
  content: "\f2a3";
}

.ion-md-brush:before {
  content: "\f2a4";
}

.ion-md-bug:before {
  content: "\f2a5";
}

.ion-md-build:before {
  content: "\f2a6";
}

.ion-md-bulb:before {
  content: "\f2a7";
}

.ion-md-bus:before {
  content: "\f2a8";
}

.ion-md-cafe:before {
  content: "\f2a9";
}

.ion-md-calculator:before {
  content: "\f2aa";
}

.ion-md-calendar:before {
  content: "\f2ab";
}

.ion-md-call:before {
  content: "\f2ac";
}

.ion-md-camera:before {
  content: "\f2ad";
}

.ion-md-car:before {
  content: "\f2b2";
}

.ion-md-card:before {
  content: "\f2b3";
}

.ion-md-cart:before {
  content: "\f2b4";
}

.ion-md-cash:before {
  content: "\f2b5";
}

.ion-md-chatboxes:before {
  content: "\f2b6";
}

.ion-md-chatbubbles:before {
  content: "\f2b7";
}

.ion-md-checkbox:before {
  content: "\f2b9";
}

.ion-md-checkbox-outline:before {
  content: "\f2b8";
}

.ion-md-checkmark:before {
  content: "\f2bc";
}

.ion-md-checkmark-circle:before {
  content: "\f2bb";
}

.ion-md-checkmark-circle-outline:before {
  content: "\f2ba";
}

.ion-md-clipboard:before {
  content: "\f2bd";
}

.ion-md-clock:before {
  content: "\f2be";
}

.ion-md-close:before {
  content: "\f2c0";
}

.ion-md-close-circle:before {
  content: "\f2bf";
}

.ion-md-closed-captioning:before {
  content: "\f2c1";
}

.ion-md-cloud:before {
  content: "\f2c9";
}

.ion-md-cloud-circle:before {
  content: "\f2c2";
}

.ion-md-cloud-done:before {
  content: "\f2c3";
}

.ion-md-cloud-download:before {
  content: "\f2c6";
}

.ion-md-cloud-outline:before {
  content: "\f2c7";
}

.ion-md-cloud-upload:before {
  content: "\f2c8";
}

.ion-md-cloudy:before {
  content: "\f2cb";
}

.ion-md-cloudy-night:before {
  content: "\f2ca";
}

.ion-md-code:before {
  content: "\f2ce";
}

.ion-md-code-download:before {
  content: "\f2cc";
}

.ion-md-code-working:before {
  content: "\f2cd";
}

.ion-md-cog:before {
  content: "\f2cf";
}

.ion-md-color-fill:before {
  content: "\f2d0";
}

.ion-md-color-filter:before {
  content: "\f2d1";
}

.ion-md-color-palette:before {
  content: "\f2d2";
}

.ion-md-color-wand:before {
  content: "\f2d3";
}

.ion-md-compass:before {
  content: "\f2d4";
}

.ion-md-construct:before {
  content: "\f2d5";
}

.ion-md-contact:before {
  content: "\f2d6";
}

.ion-md-contacts:before {
  content: "\f2d7";
}

.ion-md-contract:before {
  content: "\f2d8";
}

.ion-md-contrast:before {
  content: "\f2d9";
}

.ion-md-copy:before {
  content: "\f2da";
}

.ion-md-create:before {
  content: "\f2db";
}

.ion-md-crop:before {
  content: "\f2dc";
}

.ion-md-cube:before {
  content: "\f2dd";
}

.ion-md-cut:before {
  content: "\f2de";
}

.ion-md-desktop:before {
  content: "\f2df";
}

.ion-md-disc:before {
  content: "\f2e0";
}

.ion-md-document:before {
  content: "\f2e1";
}

.ion-md-done-all:before {
  content: "\f2e2";
}

.ion-md-download:before {
  content: "\f2e3";
}

.ion-md-easel:before {
  content: "\f2e4";
}

.ion-md-egg:before {
  content: "\f2e5";
}

.ion-md-exit:before {
  content: "\f2e6";
}

.ion-md-expand:before {
  content: "\f2e7";
}

.ion-md-eye:before {
  content: "\f2e9";
}

.ion-md-eye-off:before {
  content: "\f2e8";
}

.ion-md-fastforward:before {
  content: "\f2ea";
}

.ion-md-female:before {
  content: "\f2eb";
}

.ion-md-filing:before {
  content: "\f2ec";
}

.ion-md-film:before {
  content: "\f2ed";
}

.ion-md-finger-print:before {
  content: "\f2ee";
}

.ion-md-flag:before {
  content: "\f2ef";
}

.ion-md-flame:before {
  content: "\f2f0";
}

.ion-md-flash:before {
  content: "\f2f1";
}

.ion-md-flask:before {
  content: "\f2f2";
}

.ion-md-flower:before {
  content: "\f2f3";
}

.ion-md-folder:before {
  content: "\f2f5";
}

.ion-md-folder-open:before {
  content: "\f2f4";
}

.ion-md-football:before {
  content: "\f2f6";
}

.ion-md-funnel:before {
  content: "\f2f7";
}

.ion-md-game-controller-a:before {
  content: "\f2f8";
}

.ion-md-game-controller-b:before {
  content: "\f2f9";
}

.ion-md-git-branch:before {
  content: "\f2fa";
}

.ion-md-git-commit:before {
  content: "\f2fb";
}

.ion-md-git-compare:before {
  content: "\f2fc";
}

.ion-md-git-merge:before {
  content: "\f2fd";
}

.ion-md-git-network:before {
  content: "\f2fe";
}

.ion-md-git-pull-request:before {
  content: "\f2ff";
}

.ion-md-glasses:before {
  content: "\f300";
}

.ion-md-globe:before {
  content: "\f301";
}

.ion-md-grid:before {
  content: "\f302";
}

.ion-md-hammer:before {
  content: "\f303";
}

.ion-md-hand:before {
  content: "\f304";
}

.ion-md-happy:before {
  content: "\f305";
}

.ion-md-headset:before {
  content: "\f306";
}

.ion-md-heart:before {
  content: "\f308";
}

.ion-md-heart-outline:before {
  content: "\f307";
}

.ion-md-help:before {
  content: "\f30b";
}

.ion-md-help-buoy:before {
  content: "\f309";
}

.ion-md-help-circle:before {
  content: "\f30a";
}

.ion-md-home:before {
  content: "\f30c";
}

.ion-md-ice-cream:before {
  content: "\f30d";
}

.ion-md-image:before {
  content: "\f30e";
}

.ion-md-images:before {
  content: "\f30f";
}

.ion-md-infinite:before {
  content: "\f310";
}

.ion-md-information:before {
  content: "\f312";
}

.ion-md-information-circle:before {
  content: "\f311";
}

.ion-md-ionic:before {
  content: "\f313";
}

.ion-md-ionitron:before {
  content: "\f314";
}

.ion-md-jet:before {
  content: "\f315";
}

.ion-md-key:before {
  content: "\f316";
}

.ion-md-keypad:before {
  content: "\f317";
}

.ion-md-laptop:before {
  content: "\f318";
}

.ion-md-leaf:before {
  content: "\f319";
}

.ion-md-link:before {
  content: "\f22e";
}

.ion-md-list:before {
  content: "\f31b";
}

.ion-md-list-box:before {
  content: "\f31a";
}

.ion-md-locate:before {
  content: "\f31c";
}

.ion-md-lock:before {
  content: "\f31d";
}

.ion-md-log-in:before {
  content: "\f31e";
}

.ion-md-log-out:before {
  content: "\f31f";
}

.ion-md-magnet:before {
  content: "\f320";
}

.ion-md-mail:before {
  content: "\f322";
}

.ion-md-mail-open:before {
  content: "\f321";
}

.ion-md-male:before {
  content: "\f323";
}

.ion-md-man:before {
  content: "\f324";
}

.ion-md-map:before {
  content: "\f325";
}

.ion-md-medal:before {
  content: "\f326";
}

.ion-md-medical:before {
  content: "\f327";
}

.ion-md-medkit:before {
  content: "\f328";
}

.ion-md-megaphone:before {
  content: "\f329";
}

.ion-md-menu:before {
  content: "\f32a";
}

.ion-md-mic:before {
  content: "\f32c";
}

.ion-md-mic-off:before {
  content: "\f32b";
}

.ion-md-microphone:before {
  content: "\f32d";
}

.ion-md-moon:before {
  content: "\f32e";
}

.ion-md-more:before {
  content: "\f1c9";
}

.ion-md-move:before {
  content: "\f331";
}

.ion-md-musical-note:before {
  content: "\f332";
}

.ion-md-musical-notes:before {
  content: "\f333";
}

.ion-md-navigate:before {
  content: "\f334";
}

.ion-md-no-smoking:before {
  content: "\f335";
}

.ion-md-notifications:before {
  content: "\f338";
}

.ion-md-notifications-off:before {
  content: "\f336";
}

.ion-md-notifications-outline:before {
  content: "\f337";
}

.ion-md-nuclear:before {
  content: "\f339";
}

.ion-md-nutrition:before {
  content: "\f33a";
}

.ion-md-open:before {
  content: "\f33b";
}

.ion-md-options:before {
  content: "\f33c";
}

.ion-md-outlet:before {
  content: "\f33d";
}

.ion-md-paper:before {
  content: "\f33f";
}

.ion-md-paper-plane:before {
  content: "\f33e";
}

.ion-md-partly-sunny:before {
  content: "\f340";
}

.ion-md-pause:before {
  content: "\f341";
}

.ion-md-paw:before {
  content: "\f342";
}

.ion-md-people:before {
  content: "\f343";
}

.ion-md-person:before {
  content: "\f345";
}

.ion-md-person-add:before {
  content: "\f344";
}

.ion-md-phone-landscape:before {
  content: "\f346";
}

.ion-md-phone-portrait:before {
  content: "\f347";
}

.ion-md-photos:before {
  content: "\f348";
}

.ion-md-pie:before {
  content: "\f349";
}

.ion-md-pin:before {
  content: "\f34a";
}

.ion-md-pint:before {
  content: "\f34b";
}

.ion-md-pizza:before {
  content: "\f354";
}

.ion-md-plane:before {
  content: "\f355";
}

.ion-md-planet:before {
  content: "\f356";
}

.ion-md-play:before {
  content: "\f357";
}

.ion-md-podium:before {
  content: "\f358";
}

.ion-md-power:before {
  content: "\f359";
}

.ion-md-pricetag:before {
  content: "\f35a";
}

.ion-md-pricetags:before {
  content: "\f35b";
}

.ion-md-print:before {
  content: "\f35c";
}

.ion-md-pulse:before {
  content: "\f35d";
}

.ion-md-qr-scanner:before {
  content: "\f35e";
}

.ion-md-quote:before {
  content: "\f35f";
}

.ion-md-radio:before {
  content: "\f362";
}

.ion-md-radio-button-off:before {
  content: "\f360";
}

.ion-md-radio-button-on:before {
  content: "\f361";
}

.ion-md-rainy:before {
  content: "\f363";
}

.ion-md-recording:before {
  content: "\f364";
}

.ion-md-redo:before {
  content: "\f365";
}

.ion-md-refresh:before {
  content: "\f366";
}

.ion-md-refresh-circle:before {
  content: "\f228";
}

.ion-md-remove:before {
  content: "\f368";
}

.ion-md-remove-circle:before {
  content: "\f367";
}

.ion-md-reorder:before {
  content: "\f369";
}

.ion-md-repeat:before {
  content: "\f36a";
}

.ion-md-resize:before {
  content: "\f36b";
}

.ion-md-restaurant:before {
  content: "\f36c";
}

.ion-md-return-left:before {
  content: "\f36d";
}

.ion-md-return-right:before {
  content: "\f36e";
}

.ion-md-reverse-camera:before {
  content: "\f36f";
}

.ion-md-rewind:before {
  content: "\f370";
}

.ion-md-ribbon:before {
  content: "\f371";
}

.ion-md-rose:before {
  content: "\f372";
}

.ion-md-sad:before {
  content: "\f373";
}

.ion-md-school:before {
  content: "\f374";
}

.ion-md-search:before {
  content: "\f375";
}

.ion-md-send:before {
  content: "\f376";
}

.ion-md-settings:before {
  content: "\f377";
}

.ion-md-share:before {
  content: "\f379";
}

.ion-md-share-alt:before {
  content: "\f378";
}

.ion-md-shirt:before {
  content: "\f37a";
}

.ion-md-shuffle:before {
  content: "\f37b";
}

.ion-md-skip-backward:before {
  content: "\f37c";
}

.ion-md-skip-forward:before {
  content: "\f37d";
}

.ion-md-snow:before {
  content: "\f37e";
}

.ion-md-speedometer:before {
  content: "\f37f";
}

.ion-md-square:before {
  content: "\f381";
}

.ion-md-square-outline:before {
  content: "\f380";
}

.ion-md-star:before {
  content: "\f384";
}

.ion-md-star-half:before {
  content: "\f382";
}

.ion-md-star-outline:before {
  content: "\f383";
}

.ion-md-stats:before {
  content: "\f385";
}

.ion-md-stopwatch:before {
  content: "\f386";
}

.ion-md-subway:before {
  content: "\f387";
}

.ion-md-sunny:before {
  content: "\f388";
}

.ion-md-swap:before {
  content: "\f389";
}

.ion-md-switch:before {
  content: "\f38a";
}

.ion-md-sync:before {
  content: "\f38b";
}

.ion-md-tablet-landscape:before {
  content: "\f38c";
}

.ion-md-tablet-portrait:before {
  content: "\f38d";
}

.ion-md-tennisball:before {
  content: "\f38e";
}

.ion-md-text:before {
  content: "\f38f";
}

.ion-md-thermometer:before {
  content: "\f390";
}

.ion-md-thumbs-down:before {
  content: "\f391";
}

.ion-md-thumbs-up:before {
  content: "\f392";
}

.ion-md-thunderstorm:before {
  content: "\f393";
}

.ion-md-time:before {
  content: "\f394";
}

.ion-md-timer:before {
  content: "\f395";
}

.ion-md-train:before {
  content: "\f396";
}

.ion-md-transgender:before {
  content: "\f397";
}

.ion-md-trash:before {
  content: "\f398";
}

.ion-md-trending-down:before {
  content: "\f399";
}

.ion-md-trending-up:before {
  content: "\f39a";
}

.ion-md-trophy:before {
  content: "\f39b";
}

.ion-md-umbrella:before {
  content: "\f39c";
}

.ion-md-undo:before {
  content: "\f39d";
}

.ion-md-unlock:before {
  content: "\f39e";
}

.ion-md-videocam:before {
  content: "\f39f";
}

.ion-md-volume-down:before {
  content: "\f3a0";
}

.ion-md-volume-mute:before {
  content: "\f3a1";
}

.ion-md-volume-off:before {
  content: "\f3a2";
}

.ion-md-volume-up:before {
  content: "\f3a3";
}

.ion-md-walk:before {
  content: "\f3a4";
}

.ion-md-warning:before {
  content: "\f3a5";
}

.ion-md-watch:before {
  content: "\f3a6";
}

.ion-md-water:before {
  content: "\f3a7";
}

.ion-md-wifi:before {
  content: "\f3a8";
}

.ion-md-wine:before {
  content: "\f3a9";
}

.ion-md-woman:before {
  content: "\f3aa";
}

@font-face {
  font-family: "Ionicons";
  src: url("../assets/fonts/ionicons.woff2?v=3.0.0-alpha.3") format("woff2"), url("../assets/fonts/ionicons.woff?v=3.0.0-alpha.3") format("woff"), url("../assets/fonts/ionicons.ttf?v=3.0.0-alpha.3") format("truetype");
  font-weight: normal;
  font-style: normal;
}

ion-icon {
  display: inline-block;
  font-family: "Ionicons";
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  line-height: 1;
  text-rendering: auto;
  text-transform: none;
  speak: none;
}

ion-icon::before {
  display: inline-block;
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  src: local("Roboto Light"), local("Roboto-Light"), url("../assets/fonts/roboto-light.woff2") format("woff2"), url("../assets/fonts/roboto-light.woff") format("woff"), url("../assets/fonts/roboto-light.ttf") format("truetype");
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: local("Roboto"), local("Roboto-Regular"), url("../assets/fonts/roboto-regular.woff2") format("woff2"), url("../assets/fonts/roboto-regular.woff") format("woff"), url("../assets/fonts/roboto-regular.ttf") format("truetype");
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  src: local("Roboto Medium"), local("Roboto-Medium"), url("../assets/fonts/roboto-medium.woff2") format("woff2"), url("../assets/fonts/roboto-medium.woff") format("woff"), url("../assets/fonts/roboto-medium.ttf") format("truetype");
}

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: local("Roboto Bold"), local("Roboto-Bold"), url("../assets/fonts/roboto-bold.woff2") format("woff2"), url("../assets/fonts/roboto-bold.woff") format("woff"), url("../assets/fonts/roboto-bold.ttf") format("truetype");
}

@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 300;
  src: local("Noto Sans"), local("Noto-Sans-Regular"), url("../assets/fonts/noto-sans-regular.woff") format("woff"), url("../assets/fonts/noto-sans-regular.ttf") format("truetype");
}

@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 400;
  src: local("Noto Sans"), local("Noto-Sans-Regular"), url("../assets/fonts/noto-sans-regular.woff") format("woff"), url("../assets/fonts/noto-sans-regular.ttf") format("truetype");
}

@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 500;
  src: local("Noto Sans Bold"), local("Noto-Sans-Bold"), url("../assets/fonts/noto-sans-bold.woff") format("woff"), url("../assets/fonts/noto-sans-bold.ttf") format("truetype");
}

@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: 700;
  src: local("Noto Sans Bold"), local("Noto-Sans-Bold"), url("../assets/fonts/noto-sans-bold.woff") format("woff"), url("../assets/fonts/noto-sans-bold.ttf") format("truetype");
}

.label-md {
  margin: 0px 8px 0px 0 !important;
}

.ng2-dropdown-menu {
  padding: 1.3em 1.5rem;
  width: 44% !important;
  font-size: 1.5em !important;
  font-weight: 650 !important;
  font-size: large !important;
}

.swal2-popup {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 1.5em !important;
}

ion-item {
  background-color: transparent !important;
  color: white !important;
}

ion-item-sliding {
  display: initial !important;
}

ion-input {
  border-radius: 8px;
}

.button-md {
  border-radius: 12px;
  max-width: 170px;
}

input {
  background-color: transparent !important;
}

.fixed-content {
  bottom: 50px;
}

ion-list-header {
  background-color: transparent !important;
}

button {
  border-radius: 12px !important;
}

.input-wrapper {
  color: 1px solid #dedede !important;
}

.select-popover ion-list {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0c0d0d), color-stop(#1f2c30), color-stop(#344b58), color-stop(#556985), to(#8686af));
  background-image: linear-gradient(to right top, #0c0d0d, #1f2c30, #344b58, #556985, #8686af);
}

.toolbar-background-md {
  border-color: transparent !important;
}

ion-toolbar .toolbar-background-md {
  background: transparent !important;
}

ion-toolbar .toolbar-background {
  background: transparent !important;
}

.toolbar-background {
  background: transparent !important;
}

ion-toolbar {
  background: transparent !important;
}

.item-md h2 {
  color: 1px solid #2c2a2a !important;
}

h2 {
  color: 1px solid #2c2a2a !important;
}

h3 {
  color: 1px solid #2c2a2a !important;
}

h1 {
  color: 1px solid #2c2a2a !important;
}

.item-md {
  color: 1px solid #2c2a2a !important;
}

.item-md h2 {
  color: 1px solid #2c2a2a !important;
}

.input-wrapper {
  color: #fffefe !important;
}

.item-md {
  background-color: transparent !important;
}

ion-list {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0c0d0d), color-stop(#1f2c30), color-stop(#344b58), color-stop(#556985), to(#8686af));
  background-image: linear-gradient(to right top, #0c0d0d, #1f2c30, #344b58, #556985, #8686af);
}

@media screen and (max-width: 768px) {
  .toolbar-title-md {
    font-size: 11.5px;
  }
  .toolbar-title {
    font-size: 11.5px;
  }
}

ion-action-sheet {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 1000;
  display: block;
  width: 100%;
  height: 100%;
}

.action-sheet-wrapper {
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-transform: translate3d(0,  100%,  0);
  transform: translate3d(0,  100%,  0);
  position: absolute;
  z-index: 10;
  display: block;
  width: 100%;
  max-width: 500px;
}

.action-sheet-button {
  width: 100%;
}

.action-sheet-ios {
  text-align: center;
}

.action-sheet-ios .action-sheet-wrapper {
  margin: auto auto constant(safe-area-inset-bottom);
}

.action-sheet-ios .action-sheet-container {
  padding: 0 10px;
}

.action-sheet-ios .action-sheet-group {
  border-radius: 13px;
  margin-bottom: 8px;
  overflow: hidden;
  background: #f9f9f9;
}

.action-sheet-ios .action-sheet-group:last-child {
  margin-bottom: 10px;
}

.action-sheet-ios .action-sheet-title {
  padding: 1.5rem;
  text-align: center;
  border-radius: 0;
  border-bottom: 0.55px solid #d6d6da;
  font-size: 1.3rem;
  font-weight: 400;
  color: #8f8f8f;
}

.action-sheet-ios .action-sheet-button {
  margin: 0;
  padding: 18px;
  min-height: 5.6rem;
  border-bottom: 0.55px solid #d6d6da;
  font-size: 2rem;
  color: #007aff;
  background: transparent;
}

.action-sheet-ios .action-sheet-button:last-child {
  border-bottom-color: transparent;
}

.action-sheet-ios .action-sheet-button.activated {
  margin-top: -0.55px;
  border-top: 0.55px solid #ebebeb;
  border-bottom-color: #ebebeb;
  background: #ebebeb;
}

.action-sheet-ios .action-sheet-selected {
  font-weight: bold;
  background: #fff;
}

.action-sheet-ios .action-sheet-destructive {
  color: #f53d3d;
}

.action-sheet-ios .action-sheet-cancel {
  font-weight: 600;
  background: #fff;
}

.action-sheet-md .action-sheet-container {
  padding: 0.8rem 0;
  background: #fafafa;
}

.action-sheet-md .action-sheet-title {
  text-align: left;
  text-align: start;
  font-size: 1.6rem;
  color: #757575;
  padding: 11px 16px 17px;
}

.action-sheet-md .action-sheet-button {
  text-align: left;
  text-align: start;
  position: relative;
  overflow: hidden;
  min-height: 4.8rem;
  font-size: 1.6rem;
  color: #222;
  background: transparent;
  padding: 0 16px;
}

.action-sheet-md .action-sheet-button.activated {
  background: #f1f1f1;
}

.action-sheet-md .action-sheet-icon {
  padding: 0;
  text-align: center;
  width: 2.3rem;
  font-size: 2.4rem;
  vertical-align: middle;
  margin: 0 32px 0 0;
}

.action-sheet-md .action-sheet-group {
  overflow: hidden;
}

.action-sheet-md .action-sheet-group .button-inner {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.action-sheet-md .action-sheet-selected {
  font-weight: bold;
}

.action-sheet-wp .action-sheet-wrapper {
  -webkit-box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}

.action-sheet-wp .action-sheet-title {
  text-align: left;
  text-align: start;
  font-size: 2rem;
  color: #4d4d4d;
  padding: 11px 16px 17px;
}

.action-sheet-wp .action-sheet-button {
  text-align: left;
  text-align: start;
  min-height: 4.8rem;
  font-size: 1.5rem;
  color: #4d4d4d;
  background: transparent;
  padding: 0 16px;
}

.action-sheet-wp .action-sheet-button.activated {
  background: #aaa;
}

.action-sheet-wp .action-sheet-icon {
  padding: 0;
  text-align: center;
  width: 2.3rem;
  font-size: 2.4rem;
  vertical-align: middle;
  margin: 0 20px 0 0;
}

.action-sheet-wp .action-sheet-container {
  padding: 0.8rem 0;
  background: #fff;
}

.action-sheet-wp .action-sheet-group .button-inner {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.action-sheet-wp .action-sheet-selected {
  font-weight: bold;
}

.action-sheet-wp .action-sheet-cancel {
  background: transparent;
}

ion-alert {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1000;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  contain: strict;
}

ion-alert.alert-top {
  padding-top: 50px;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

ion-alert input {
  width: 100%;
}

.alert-wrapper {
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 250px;
  max-height: 90%;
  opacity: 0;
  contain: content;
}

.alert-title {
  margin: 0;
  padding: 0;
}

.alert-sub-title {
  margin: 5px 0 0;
  padding: 0;
  font-weight: normal;
}

.alert-message {
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}

.alert-input {
  padding: 10px 0;
  border: 0;
  background: inherit;
}

.alert-input::-moz-placeholder {
  color: #999;
}

.alert-input:-ms-input-placeholder {
  color: #999;
}

.alert-input::-webkit-input-placeholder {
  text-indent: 0;
  color: #999;
}

.alert-button-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

.alert-button-group-vertical {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.alert-button {
  margin: 0;
  z-index: 0;
  display: block;
  font-size: 14px;
  line-height: 20px;
}

.alert-tappable {
  text-align: left;
  text-align: start;
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
  width: 100%;
  font-size: inherit;
  line-height: initial;
  background: transparent;
}

.alert-ios .alert-wrapper {
  border-radius: 13px;
  overflow: hidden;
  max-width: 270px;
  background-color: #f8f8f8;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.alert-ios .alert-head {
  text-align: center;
  padding: 12px 16px 7px;
}

.alert-ios .alert-title {
  margin-top: 8px;
  font-size: 17px;
  font-weight: 600;
}

.alert-ios .alert-sub-title {
  font-size: 14px;
  color: #666;
}

.alert-ios .alert-message,
.alert-ios .alert-input-group {
  text-align: center;
  font-size: 13px;
  color: inherit;
  padding: 0 16px 21px;
}

.alert-ios .alert-message {
  max-height: 240px;
}

.alert-ios .alert-message:empty {
  padding: 0 0 12px;
}

.alert-ios .alert-input {
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  margin-top: 10px;
  border-radius: 4px;
  border: 0.55px solid #ccc;
  background-color: #fff;
  padding: 6px;
}

.alert-ios .alert-radio-group,
.alert-ios .alert-checkbox-group {
  overflow: scroll;
  max-height: 240px;
  border-top: 0.55px solid #dbdbdf;
  -webkit-overflow-scrolling: touch;
}

.alert-ios .alert-tappable {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 44px;
}

.alert-ios .alert-radio-label {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-ordinal-group: 1;
  -webkit-order: 0;
  -ms-flex-order: 0;
  order: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: initial;
  padding: 13px;
}

.alert-ios [aria-checked=true] .alert-radio-label {
  color: #0c031d;
}

.alert-ios .alert-radio-icon {
  position: relative;
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
  min-width: 30px;
}

.alert-ios [aria-checked=true] .alert-radio-inner {
  left: 7px;
  top: -7px;
  position: absolute;
  width: 6px;
  height: 12px;
  border-width: 2px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #0c031d;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.alert-ios .alert-checkbox-label {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: initial;
  padding: 13px;
}

.alert-ios [aria-checked=true] .alert-checkbox-label {
  color: initial;
}

.alert-ios .alert-checkbox-icon {
  border-radius: 50%;
  position: relative;
  width: 21px;
  height: 21px;
  border-width: 0.55px;
  border-style: solid;
  border-color: #c8c7cc;
  background-color: #fff;
  margin: 10px 6px 10px 16px;
}

.alert-ios [aria-checked=true] .alert-checkbox-icon {
  border-color: #0c031d;
  background-color: #0c031d;
}

.alert-ios [aria-checked=true] .alert-checkbox-inner {
  left: 7px;
  top: 4px;
  position: absolute;
  width: 4px;
  height: 9px;
  border-width: 0.55px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.alert-ios .alert-button-group {
  margin-right: -0.55px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.alert-ios .alert-button {
  margin: 0;
  border-radius: 0;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  min-width: 50%;
  height: 44px;
  border-top: 0.55px solid #dbdbdf;
  border-right: 0.55px solid #dbdbdf;
  font-size: 17px;
  color: #0c031d;
  background-color: transparent;
}

.alert-ios .alert-button:last-child {
  border-right: 0;
  font-weight: bold;
}

.alert-ios .alert-button.activated {
  background-color: #e9e9e9;
}

.alert-md .alert-wrapper {
  border-radius: 2px;
  max-width: 280px;
  background-color: #fafafa;
  -webkit-box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
  box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
}

.alert-md .alert-head {
  text-align: left;
  text-align: start;
  padding: 24px 24px 20px;
}

.alert-md .alert-title {
  font-size: 22px;
}

.alert-md .alert-sub-title {
  font-size: 16px;
}

.alert-md .alert-message,
.alert-md .alert-input-group {
  color: rgba(0, 0, 0, 0.5);
  padding: 0 24px 24px;
}

.alert-md .alert-message {
  max-height: 240px;
  font-size: 15px;
}

.alert-md .alert-message:empty {
  padding: 0;
}

.alert-md .alert-input {
  margin: 5px 0;
  border-bottom: 1px solid #dedede;
  color: #000;
}

.alert-md .alert-input:focus {
  margin-bottom: 4px;
  border-bottom: 2px solid #0c031d;
}

.alert-md .alert-radio-group,
.alert-md .alert-checkbox-group {
  position: relative;
  overflow: auto;
  max-height: 240px;
  border-top: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
}

.alert-md .alert-tappable {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  min-height: 4.4rem;
}

.alert-md .alert-radio-label {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: initial;
  padding: 13px 26px;
}

.alert-md .alert-radio-icon {
  left: 13px;
  top: 0;
  border-radius: 50%;
  position: relative;
  display: block;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: #787878;
}

.alert-md .alert-radio-inner {
  left: 2px;
  top: 2px;
  border-radius: 50%;
  position: absolute;
  width: 8px;
  height: 8px;
  background-color: #0c031d;
  -webkit-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.alert-md [aria-checked=true] .alert-radio-label {
  color: #0c031d;
}

.alert-md [aria-checked=true] .alert-radio-icon {
  border-color: #0c031d;
}

.alert-md [aria-checked=true] .alert-radio-inner {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}

.alert-md .alert-checkbox-label {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: initial;
  padding: 13px 26px;
}

.alert-md [aria-checked=true] .alert-checkbox-label {
  color: initial;
}

.alert-md .alert-checkbox-icon {
  left: 13px;
  top: 0;
  border-radius: 2px;
  position: relative;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: #787878;
}

.alert-md [aria-checked=true] .alert-checkbox-icon {
  border-color: #0c031d;
  background-color: #0c031d;
}

.alert-md [aria-checked=true] .alert-checkbox-inner {
  left: 3px;
  top: 0;
  position: absolute;
  width: 6px;
  height: 10px;
  border-width: 2px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.alert-md .alert-button-group {
  -webkit-flex-wrap: wrap-reverse;
  -ms-flex-wrap: wrap-reverse;
  flex-wrap: wrap-reverse;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  padding: 8px 8px 8px 24px;
}

.alert-md .alert-button {
  text-align: right;
  text-align: end;
  border-radius: 2px;
  position: relative;
  overflow: hidden;
  font-weight: 500;
  text-transform: uppercase;
  color: #0c031d;
  background-color: transparent;
  margin: 0 8px 0 0;
  padding: 10px;
}

.alert-md .alert-button.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.alert-md .alert-button .button-inner {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.alert-wp ion-backdrop {
  background: #fff;
}

.alert-wp .alert-wrapper {
  border-radius: 0;
  width: 100%;
  max-width: 520px;
  border: 1px solid #0c031d;
  background: #e6e6e6;
}

.alert-wp .alert-head {
  text-align: left;
  text-align: start;
  padding: 20px 22px 5px;
}

.alert-wp .alert-title {
  font-size: 20px;
  font-weight: 400;
}

.alert-wp .alert-sub-title {
  font-size: 16px;
}

.alert-wp .alert-message,
.alert-wp .alert-input-group {
  color: #000;
  padding: 0 22px 8px;
}

.alert-wp .alert-message {
  max-height: 240px;
  font-size: 13px;
}

.alert-wp .alert-message:empty {
  padding: 0;
}

.alert-wp .alert-input {
  border: 2px solid rgba(0, 0, 0, 0.5);
  line-height: 3rem;
  color: #000;
  margin: 5px 0;
  padding: 0 8px;
}

.alert-wp .alert-input:focus {
  border-color: #0c031d;
}

.alert-wp .alert-radio-group,
.alert-wp .alert-checkbox-group {
  position: relative;
  overflow: auto;
  max-height: 240px;
}

.alert-wp .alert-tappable {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  min-height: 4.4rem;
}

.alert-wp .alert-radio-label {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: initial;
  padding: 13px 26px;
}

.alert-wp .alert-radio-icon {
  left: 13px;
  top: 0;
  margin: 0;
  border-radius: 50%;
  position: relative;
  display: block;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.5);
}

.alert-wp .alert-radio-inner {
  left: 2px;
  top: 2px;
  border-radius: 50%;
  position: absolute;
  display: none;
  width: 8px;
  height: 8px;
  background: #0c031d;
}

.alert-wp [aria-checked=true] .alert-radio-label {
  color: #000;
}

.alert-wp [aria-checked=true] .alert-radio-icon {
  border-color: rgba(0, 0, 0, 0.5);
}

.alert-wp [aria-checked=true] .alert-radio-inner {
  display: block;
}

.alert-wp .alert-checkbox-label {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: initial;
  padding: 13px 26px;
}

.alert-wp [aria-checked=true] .alert-checkbox-label {
  color: initial;
}

.alert-wp .alert-checkbox-icon {
  left: 13px;
  top: 0;
  border-radius: 0;
  position: relative;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.5);
  background: transparent;
}

.alert-wp [aria-checked=true] .alert-checkbox-icon {
  border-color: #0c031d;
  background: #0c031d;
}

.alert-wp [aria-checked=true] .alert-checkbox-inner {
  left: 3px;
  top: -2px;
  position: absolute;
  width: 6px;
  height: 12px;
  border-width: 1px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.alert-wp .alert-button-group {
  -webkit-flex-wrap: wrap-reverse;
  -ms-flex-wrap: wrap-reverse;
  flex-wrap: wrap-reverse;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  padding: 20px 22px;
}

.alert-wp .alert-button-group-vertical .alert-button {
  margin-top: 5px;
  width: 100%;
}

.alert-wp .alert-button-group-vertical .alert-button:first-child:not(:only-child) {
  margin-right: 0;
  margin-top: 0;
}

.alert-wp .alert-button {
  border-radius: 0;
  width: 49.5%;
  font-weight: 400;
  color: #000;
  background: #b8b8b8;
  padding: 5px;
}

.alert-wp .alert-button:first-child:not(:only-child) {
  margin-right: 1%;
}

.alert-wp .alert-button.activated {
  background: darkgray;
}

audio,
canvas,
progress,
video {
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

b,
strong {
  font-weight: bold;
}

img {
  max-width: 100%;
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 1em 40px;
}

hr {
  height: 1px;
  border-width: 0;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

pre {
  overflow: auto;
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

label,
input,
select,
textarea {
  font-family: inherit;
  line-height: normal;
}

textarea {
  overflow: auto;
  height: auto;
  font: inherit;
  color: inherit;
}

textarea::-webkit-input-placeholder {
  padding-left: 2px;
}

textarea::-moz-placeholder {
  padding-left: 2px;
}

textarea::-ms-input-placeholder {
  padding-left: 2px;
}

textarea::placeholder {
  padding-left: 2px;
}

form,
input,
optgroup,
select {
  margin: 0;
  font: inherit;
  color: inherit;
}

html input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
}

a,
a div,
a span,
a ion-icon,
a ion-label,
button,
button div,
button span,
button ion-icon,
button ion-label,
[tappable],
[tappable] div,
[tappable] span,
[tappable] ion-icon,
[tappable] ion-label,
input,
textarea {
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

a ion-label,
button ion-label {
  pointer-events: none;
}

button {
  border: 0;
  font-family: inherit;
  font-style: inherit;
  font-variant: inherit;
  line-height: 1;
  text-transform: none;
  cursor: pointer;
  -webkit-appearance: button;
}

[tappable] {
  cursor: pointer;
}

a[disabled],
button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}

input[type="checkbox"],
input[type="radio"] {
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

.hide,
[hidden],
template {
  display: none !important;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

:focus,
:active {
  outline: none;
}

.focus-outline :focus {
  outline: thin dotted;
  outline-offset: -1px;
}

.focus-outline button:focus,
.focus-outline [ion-button]:focus {
  border-color: #51a7e8;
  outline: 2px solid #51a7e8;
  -webkit-box-shadow: 0 0 8px 1px #51a7e8;
  box-shadow: 0 0 8px 1px #51a7e8;
}

ion-input :focus {
  outline: none;
}

.click-block {
  display: none;
}

.click-block-enabled {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  -webkit-transform: translate3d(0,  -100%,  0) translateY(1px);
  transform: translate3d(0,  -100%,  0) translateY(1px);
  position: absolute;
  z-index: 99999;
  display: block;
  opacity: 0;
  contain: strict;
}

.click-block-active {
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

html {
  width: 100%;
  height: 100%;
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  padding: 0;
  position: fixed;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -webkit-user-drag: none;
  -ms-content-zooming: none;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  word-wrap: break-word;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
  text-size-adjust: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

a {
  background-color: transparent;
}

.enable-hover a:hover {
  opacity: .7;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 1.6rem;
  margin-bottom: 1rem;
  font-weight: 500;
  line-height: 1.2;
}

[padding] h1:first-child,
[padding] h2:first-child,
[padding] h3:first-child,
[padding] h4:first-child,
[padding] h5:first-child,
[padding] h6:first-child {
  margin-top: -0.3rem;
}

h1 + h2,
h1 + h3,
h2 + h3 {
  margin-top: -0.3rem;
}

h1 {
  margin-top: 2rem;
  font-size: 2.6rem;
}

h2 {
  margin-top: 1.8rem;
  font-size: 2.4rem;
}

h3 {
  font-size: 2.2rem;
}

h4 {
  font-size: 2rem;
}

h5 {
  font-size: 1.8rem;
}

h6 {
  font-size: 1.6rem;
}

small {
  font-size: 75%;
}

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sup {
  top: -.5em;
}

sub {
  bottom: -.25em;
}

ion-app,
ion-nav,
ion-tab,
ion-tabs,
.app-root {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
}

ion-nav,
ion-tab,
ion-tabs {
  overflow: hidden;
}

ion-tab {
  display: none;
}

ion-tab.show-tab {
  display: block;
}

ion-app,
ion-nav,
ion-tab,
ion-tabs,
.app-root,
.ion-page {
  contain: strict;
}

.ion-page {
  left: 0;
  top: 0;
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
}

.ion-page.show-page {
  opacity: 1;
}

ion-header {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 10;
  display: block;
  width: 100%;
}

ion-footer {
  left: 0;
  bottom: 0;
  position: absolute;
  z-index: 10;
  display: block;
  width: 100%;
}

[app-viewport],
[overlay-portal],
[nav-viewport],
[tab-portal],
.nav-decor {
  display: none;
}

[text-center] {
  text-align: center !important;
}

[text-justify] {
  text-align: justify !important;
}

[text-start] {
  text-align: left;
  text-align: start !important;
}

[text-end] {
  text-align: right;
  text-align: end !important;
}

[text-left] {
  text-align: left !important;
}

[text-right] {
  text-align: right !important;
}

[text-nowrap] {
  white-space: nowrap !important;
}

[text-wrap] {
  white-space: normal !important;
}

@media (min-width: 576px) {
  [text-sm-center] {
    text-align: center !important;
  }
  [text-sm-justify] {
    text-align: justify !important;
  }
  [text-sm-start] {
    text-align: left;
    text-align: start !important;
  }
  [text-sm-end] {
    text-align: right;
    text-align: end !important;
  }
  [text-sm-left] {
    text-align: left !important;
  }
  [text-sm-right] {
    text-align: right !important;
  }
  [text-sm-nowrap] {
    white-space: nowrap !important;
  }
  [text-sm-wrap] {
    white-space: normal !important;
  }
}

@media (min-width: 768px) {
  [text-md-center] {
    text-align: center !important;
  }
  [text-md-justify] {
    text-align: justify !important;
  }
  [text-md-start] {
    text-align: left;
    text-align: start !important;
  }
  [text-md-end] {
    text-align: right;
    text-align: end !important;
  }
  [text-md-left] {
    text-align: left !important;
  }
  [text-md-right] {
    text-align: right !important;
  }
  [text-md-nowrap] {
    white-space: nowrap !important;
  }
  [text-md-wrap] {
    white-space: normal !important;
  }
}

@media (min-width: 992px) {
  [text-lg-center] {
    text-align: center !important;
  }
  [text-lg-justify] {
    text-align: justify !important;
  }
  [text-lg-start] {
    text-align: left;
    text-align: start !important;
  }
  [text-lg-end] {
    text-align: right;
    text-align: end !important;
  }
  [text-lg-left] {
    text-align: left !important;
  }
  [text-lg-right] {
    text-align: right !important;
  }
  [text-lg-nowrap] {
    white-space: nowrap !important;
  }
  [text-lg-wrap] {
    white-space: normal !important;
  }
}

@media (min-width: 1200px) {
  [text-xl-center] {
    text-align: center !important;
  }
  [text-xl-justify] {
    text-align: justify !important;
  }
  [text-xl-start] {
    text-align: left;
    text-align: start !important;
  }
  [text-xl-end] {
    text-align: right;
    text-align: end !important;
  }
  [text-xl-left] {
    text-align: left !important;
  }
  [text-xl-right] {
    text-align: right !important;
  }
  [text-xl-nowrap] {
    white-space: nowrap !important;
  }
  [text-xl-wrap] {
    white-space: normal !important;
  }
}

[text-uppercase] {
  text-transform: uppercase !important;
}

[text-lowercase] {
  text-transform: lowercase !important;
}

[text-capitalize] {
  text-transform: capitalize !important;
}

@media (min-width: 576px) {
  [text-sm-uppercase] {
    text-transform: uppercase !important;
  }
  [text-sm-lowercase] {
    text-transform: lowercase !important;
  }
  [text-sm-capitalize] {
    text-transform: capitalize !important;
  }
}

@media (min-width: 768px) {
  [text-md-uppercase] {
    text-transform: uppercase !important;
  }
  [text-md-lowercase] {
    text-transform: lowercase !important;
  }
  [text-md-capitalize] {
    text-transform: capitalize !important;
  }
}

@media (min-width: 992px) {
  [text-lg-uppercase] {
    text-transform: uppercase !important;
  }
  [text-lg-lowercase] {
    text-transform: lowercase !important;
  }
  [text-lg-capitalize] {
    text-transform: capitalize !important;
  }
}

@media (min-width: 1200px) {
  [text-xl-uppercase] {
    text-transform: uppercase !important;
  }
  [text-xl-lowercase] {
    text-transform: lowercase !important;
  }
  [text-xl-capitalize] {
    text-transform: capitalize !important;
  }
}

[float-left] {
  float: left !important;
}

[float-right] {
  float: right !important;
}

[float-start] {
  float: left !important;
}

[float-end] {
  float: right !important;
}

@media (min-width: 576px) {
  [float-sm-left] {
    float: left !important;
  }
  [float-sm-right] {
    float: right !important;
  }
  [float-sm-start] {
    float: left !important;
  }
  [float-sm-end] {
    float: right !important;
  }
}

@media (min-width: 768px) {
  [float-md-left] {
    float: left !important;
  }
  [float-md-right] {
    float: right !important;
  }
  [float-md-start] {
    float: left !important;
  }
  [float-md-end] {
    float: right !important;
  }
}

@media (min-width: 992px) {
  [float-lg-left] {
    float: left !important;
  }
  [float-lg-right] {
    float: right !important;
  }
  [float-lg-start] {
    float: left !important;
  }
  [float-lg-end] {
    float: right !important;
  }
}

@media (min-width: 1200px) {
  [float-xl-left] {
    float: left !important;
  }
  [float-xl-right] {
    float: right !important;
  }
  [float-xl-start] {
    float: left !important;
  }
  [float-xl-end] {
    float: right !important;
  }
}

ion-app.ios {
  font-family: -apple-system, "Helvetica Neue", "Roboto", sans-serif;
  font-size: 1.4rem;
  background-color: #fff;
}

ion-app.md {
  font-family: "Roboto", "Helvetica Neue", sans-serif;
  font-size: 1.4rem;
  background-color: #fff;
}

ion-app.wp {
  font-family: "Segoe UI", "Noto Sans", sans-serif;
  font-size: 1.4rem;
  background-color: #fff;
}

ion-backdrop {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: .01;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

ion-backdrop.backdrop-no-tappable {
  cursor: auto;
}

ion-badge {
  padding: 3px 8px;
  text-align: center;
  display: inline-block;
  min-width: 10px;
  font-size: 1.3rem;
  font-weight: bold;
  line-height: 1;
  white-space: nowrap;
  vertical-align: baseline;
}

ion-badge:empty {
  display: none;
}

.badge-ios {
  border-radius: 10px;
  color: #fff;
  background-color: #0c031d;
}

.badge-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.badge-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.badge-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.badge-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.badge-ios-dark {
  color: #fff;
  background-color: #000000;
}

.badge-ios-menuinicial {
  color: #000;
  background-color: white;
}

.badge-md {
  border-radius: 4px;
  color: #fff;
  background-color: #0c031d;
}

.badge-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.badge-md-secondary {
  color: #fff;
  background-color: #969696;
}

.badge-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.badge-md-light {
  color: #000;
  background-color: #f4f4f4;
}

.badge-md-dark {
  color: #fff;
  background-color: #000000;
}

.badge-md-menuinicial {
  color: #000;
  background-color: white;
}

.badge-wp {
  border-radius: 0;
  color: #fff;
  background-color: #0c031d;
}

.badge-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.badge-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.badge-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.badge-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.badge-wp-dark {
  color: #fff;
  background-color: #000000;
}

.badge-wp-menuinicial {
  color: #000;
  background-color: white;
}

.button {
  text-align: center;
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  z-index: 0;
  display: inline-block;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  vertical-align: top;
  vertical-align: -webkit-baseline-middle;
  -webkit-transition: background-color, opacity 100ms linear;
  transition: background-color, opacity 100ms linear;
  -webkit-font-kerning: none;
  font-kerning: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  contain: content;
}

.button-inner {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-flow: row nowrap;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

[ion-button] {
  text-decoration: none;
}

a[disabled],
button[disabled],
[ion-button][disabled] {
  cursor: default;
  opacity: .4;
  pointer-events: none;
}

.button-block {
  display: block;
  clear: both;
  width: 100%;
  contain: strict;
}

.button-block::after {
  clear: both;
}

.button-full {
  display: block;
  width: 100%;
  contain: strict;
}

.button-full.button-outline {
  border-radius: 0;
  border-right-width: 0;
  border-left-width: 0;
}

[icon-left] ion-icon,
[icon-start] ion-icon {
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
  padding-right: 0.3em;
}

[icon-right] ion-icon,
[icon-end] ion-icon {
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
  padding-left: 0.4em;
}

.button[icon-only] {
  padding: 0;
  min-width: .9em;
}

[icon-only] ion-icon {
  padding: 0 0.5em;
  font-size: 1.8em;
  line-height: .67;
  pointer-events: none;
}

.button-ios {
  border-radius: 4px;
  height: 2.8em;
  font-size: 1.6rem;
  color: #fff;
  background-color: #0c031d;
  margin: 0.4rem 0.2rem;
  padding: 0 1em;
}

.button-ios.activated {
  background-color: #1f172f;
  opacity: 1;
}

.button-ios:hover:not(.disable-hover) {
  opacity: 0.8;
}

.button-large-ios {
  height: 2.8em;
  font-size: 2rem;
  padding: 0 1em;
}

.button-small-ios {
  height: 2.1em;
  font-size: 1.3rem;
  padding: 0 0.9em;
}

.button-small-ios[icon-only] ion-icon {
  font-size: 1.3em;
}

.button-block-ios {
  margin-left: 0;
  margin-right: 0;
}

.button-full-ios {
  margin-left: 0;
  margin-right: 0;
  border-radius: 0;
  border-right-width: 0;
  border-left-width: 0;
}

.button-outline-ios {
  border-radius: 4px;
  border-width: 1px;
  border-style: solid;
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.button-outline-ios.activated {
  color: #fff;
  background-color: #0c031d;
  opacity: 1;
}

.button-clear-ios {
  border-color: transparent;
  color: #0c031d;
  background-color: transparent;
}

.button-clear-ios.activated {
  background-color: transparent;
  opacity: 0.4;
}

.button-clear-ios:hover:not(.disable-hover) {
  color: #0c031d;
  opacity: 0.6;
}

.button-round-ios {
  border-radius: 64px;
  padding: 0 2.6rem;
}

.button-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.button-ios-primary.activated {
  background-color: #1f172f;
}

.button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.button-clear-ios-primary {
  border-color: transparent;
  color: #0c031d;
  background-color: transparent;
}

.button-clear-ios-primary.activated {
  opacity: 0.4;
}

.button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.button-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.button-ios-secondary.activated {
  background-color: #8a8a8a;
}

.button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.button-clear-ios-secondary {
  border-color: transparent;
  color: #969696;
  background-color: transparent;
}

.button-clear-ios-secondary.activated {
  opacity: 0.4;
}

.button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.button-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.button-ios-danger.activated {
  background-color: #882424;
}

.button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.button-clear-ios-danger {
  border-color: transparent;
  color: #7e1111;
  background-color: transparent;
}

.button-clear-ios-danger.activated {
  opacity: 0.4;
}

.button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.button-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.button-ios-light.activated {
  background-color: #e0e0e0;
}

.button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.button-clear-ios-light {
  border-color: transparent;
  color: #f4f4f4;
  background-color: transparent;
}

.button-clear-ios-light.activated {
  opacity: 0.4;
}

.button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.button-ios-dark {
  color: #fff;
  background-color: #000000;
}

.button-ios-dark.activated {
  background-color: #141414;
}

.button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.button-clear-ios-dark {
  border-color: transparent;
  color: #000000;
  background-color: transparent;
}

.button-clear-ios-dark.activated {
  opacity: 0.4;
}

.button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.button-ios-menuinicial {
  color: #000;
  background-color: white;
}

.button-ios-menuinicial.activated {
  background-color: #ebebeb;
}

.button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.button-clear-ios-menuinicial {
  border-color: transparent;
  color: white;
  background-color: transparent;
}

.button-clear-ios-menuinicial.activated {
  opacity: 0.4;
}

.button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.button-strong-ios {
  font-weight: 600;
}

.button-md {
  border-radius: 2px;
  overflow: hidden;
  height: 3.6rem;
  font-size: 1.4rem;
  font-weight: 500;
  text-transform: uppercase;
  color: #fff;
  background-color: #0c031d;
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  -webkit-transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  margin: 0.4rem 0.2rem;
  padding: 0 1.1em;
}

.button-md:hover:not(.disable-hover) {
  background-color: #0c031d;
}

.button-md.activated {
  background-color: #1f172f;
  -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.14), 0 3px 5px rgba(0, 0, 0, 0.21), 0 0 0 0 transparent;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.14), 0 3px 5px rgba(0, 0, 0, 0.21), 0 0 0 0 transparent;
}

.button-md .button-effect {
  background-color: #fff;
}

.button-large-md {
  height: 2.8em;
  font-size: 2rem;
  padding: 0 1em;
}

.button-small-md {
  height: 2.1em;
  font-size: 1.3rem;
  padding: 0 0.9em;
}

.button-small-md[icon-only] ion-icon {
  font-size: 1.4em;
}

.button-block-md {
  margin-left: 0;
  margin-right: 0;
}

.button-full-md {
  margin-left: 0;
  margin-right: 0;
  border-radius: 0;
  border-right-width: 0;
  border-left-width: 0;
}

.button-outline-md {
  border-width: 1px;
  border-style: solid;
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-outline-md:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-md.activated {
  background-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
  opacity: 1;
}

.button-outline-md .button-effect {
  background-color: #0c031d;
}

.button-clear-md {
  border-color: transparent;
  color: #0c031d;
  background-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
  opacity: 1;
}

.button-clear-md.activated {
  background-color: rgba(158, 158, 158, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-clear-md:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-clear-md .button-effect {
  background-color: #999;
}

.button-round-md {
  border-radius: 64px;
  padding: 0 2.6rem;
}

.button-md [icon-only] {
  padding: 0;
}

.button-effect {
  border-radius: 50%;
  -webkit-transform-origin: center center;
  transform-origin: center center;
  position: absolute;
  z-index: 0;
  display: none;
  background-color: #555;
  opacity: .2;
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  pointer-events: none;
  top: 0;
  left: 0;
}

.md button .button-effect {
  display: block;
}

.button-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.button-md-primary:hover:not(.disable-hover) {
  background-color: #0c031d;
}

.button-md-primary.activated {
  background-color: #1f172f;
  opacity: 1;
}

.button-md-primary .button-effect {
  background-color: #fff;
}

.button-outline-md-primary {
  border-color: #181028;
  color: #181028;
  background-color: transparent;
}

.button-outline-md-primary:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-md-primary.activated {
  background-color: transparent;
}

.button-outline-md-primary .button-effect {
  background-color: #181028;
}

.button-clear-md-primary {
  border-color: transparent;
  color: #0c031d;
  background-color: transparent;
}

.button-clear-md-primary.activated {
  background-color: rgba(158, 158, 158, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-clear-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.button-md-secondary {
  color: #fff;
  background-color: #969696;
}

.button-md-secondary:hover:not(.disable-hover) {
  background-color: #969696;
}

.button-md-secondary.activated {
  background-color: #8a8a8a;
  opacity: 1;
}

.button-md-secondary .button-effect {
  background-color: #fff;
}

.button-outline-md-secondary {
  border-color: #8f8f8f;
  color: #8f8f8f;
  background-color: transparent;
}

.button-outline-md-secondary:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-md-secondary.activated {
  background-color: transparent;
}

.button-outline-md-secondary .button-effect {
  background-color: #8f8f8f;
}

.button-clear-md-secondary {
  border-color: transparent;
  color: #969696;
  background-color: transparent;
}

.button-clear-md-secondary.activated {
  background-color: rgba(158, 158, 158, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-clear-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.button-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.button-md-danger:hover:not(.disable-hover) {
  background-color: #7e1111;
}

.button-md-danger.activated {
  background-color: #882424;
  opacity: 1;
}

.button-md-danger .button-effect {
  background-color: #fff;
}

.button-outline-md-danger {
  border-color: #841d1d;
  color: #841d1d;
  background-color: transparent;
}

.button-outline-md-danger:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-md-danger.activated {
  background-color: transparent;
}

.button-outline-md-danger .button-effect {
  background-color: #841d1d;
}

.button-clear-md-danger {
  border-color: transparent;
  color: #7e1111;
  background-color: transparent;
}

.button-clear-md-danger.activated {
  background-color: rgba(158, 158, 158, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-clear-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.button-md-light {
  color: #000;
  background-color: #f4f4f4;
}

.button-md-light:hover:not(.disable-hover) {
  background-color: #f4f4f4;
}

.button-md-light.activated {
  background-color: #e0e0e0;
  opacity: 1;
}

.button-md-light .button-effect {
  background-color: #000;
}

.button-outline-md-light {
  border-color: #e8e8e8;
  color: #e8e8e8;
  background-color: transparent;
}

.button-outline-md-light:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-md-light.activated {
  background-color: transparent;
}

.button-outline-md-light .button-effect {
  background-color: #e8e8e8;
}

.button-clear-md-light {
  border-color: transparent;
  color: #f4f4f4;
  background-color: transparent;
}

.button-clear-md-light.activated {
  background-color: rgba(158, 158, 158, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-clear-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.button-md-dark {
  color: #fff;
  background-color: #000000;
}

.button-md-dark:hover:not(.disable-hover) {
  background-color: #000000;
}

.button-md-dark.activated {
  background-color: #141414;
  opacity: 1;
}

.button-md-dark .button-effect {
  background-color: #fff;
}

.button-outline-md-dark {
  border-color: #0d0d0d;
  color: #0d0d0d;
  background-color: transparent;
}

.button-outline-md-dark:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-md-dark.activated {
  background-color: transparent;
}

.button-outline-md-dark .button-effect {
  background-color: #0d0d0d;
}

.button-clear-md-dark {
  border-color: transparent;
  color: #000000;
  background-color: transparent;
}

.button-clear-md-dark.activated {
  background-color: rgba(158, 158, 158, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-clear-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.button-md-menuinicial {
  color: #000;
  background-color: white;
}

.button-md-menuinicial:hover:not(.disable-hover) {
  background-color: white;
}

.button-md-menuinicial.activated {
  background-color: #ebebeb;
  opacity: 1;
}

.button-md-menuinicial .button-effect {
  background-color: #000;
}

.button-outline-md-menuinicial {
  border-color: #f2f2f2;
  color: #f2f2f2;
  background-color: transparent;
}

.button-outline-md-menuinicial:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.button-outline-md-menuinicial .button-effect {
  background-color: #f2f2f2;
}

.button-clear-md-menuinicial {
  border-color: transparent;
  color: white;
  background-color: transparent;
}

.button-clear-md-menuinicial.activated {
  background-color: rgba(158, 158, 158, 0.2);
  -webkit-box-shadow: none;
  box-shadow: none;
}

.button-clear-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.button-strong-md {
  font-weight: bold;
}

.button-wp {
  border-radius: 0;
  height: 3.6rem;
  border: 3px solid transparent;
  font-size: 1.4rem;
  color: #fff;
  background-color: #0c031d;
  margin: 0.4rem 0.2rem;
  padding: 0 1.1em;
}

.button-wp:hover:not(.disable-hover) {
  border-color: #1f172f;
  background-color: #0c031d;
}

.button-wp.activated {
  background-color: #1f172f;
}

.button-large-wp {
  height: 2.8em;
  font-size: 2rem;
  padding: 0 1em;
}

.button-small-wp {
  height: 2.1em;
  font-size: 1.3rem;
  padding: 0 0.9em;
}

.button-small-wp[icon-only] ion-icon {
  font-size: 1.4em;
}

.button-block-wp {
  margin-left: 0;
  margin-right: 0;
}

.button-full-wp {
  margin-left: 0;
  margin-right: 0;
  border-radius: 0;
  border-right-width: 0;
  border-left-width: 0;
}

.button-outline-wp {
  border-width: 1px;
  border-style: solid;
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.button-outline-wp:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-wp.activated {
  background-color: rgba(12, 3, 29, 0.16);
}

.button-clear-wp {
  color: #0c031d;
  background-color: transparent;
}

.button-clear-wp.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.button-clear-wp:hover:not(.disable-hover) {
  background-color: rgba(158, 158, 158, 0.1);
}

.button-round-wp {
  border-radius: 64px;
  padding: 0 2.6rem;
}

.button-wp [icon-only] {
  padding: 0;
}

.button-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.button-wp-primary:hover:not(.disable-hover) {
  border-color: #1f172f;
  background-color: #0c031d;
}

.button-wp-primary.activated {
  background-color: #1f172f;
}

.button-outline-wp-primary {
  border-color: #181028;
  color: #181028;
  background-color: transparent;
}

.button-outline-wp-primary:hover:not(.disable-hover) {
  border-color: #181028;
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-wp-primary.activated {
  background-color: rgba(24, 16, 40, 0.16);
}

.button-clear-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.button-clear-wp-primary.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.button-clear-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.button-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.button-wp-secondary:hover:not(.disable-hover) {
  border-color: #8a8a8a;
  background-color: #969696;
}

.button-wp-secondary.activated {
  background-color: #8a8a8a;
}

.button-outline-wp-secondary {
  border-color: #8f8f8f;
  color: #8f8f8f;
  background-color: transparent;
}

.button-outline-wp-secondary:hover:not(.disable-hover) {
  border-color: #8f8f8f;
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-wp-secondary.activated {
  background-color: rgba(143, 143, 143, 0.16);
}

.button-clear-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.button-clear-wp-secondary.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.button-clear-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.button-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.button-wp-danger:hover:not(.disable-hover) {
  border-color: #882424;
  background-color: #7e1111;
}

.button-wp-danger.activated {
  background-color: #882424;
}

.button-outline-wp-danger {
  border-color: #841d1d;
  color: #841d1d;
  background-color: transparent;
}

.button-outline-wp-danger:hover:not(.disable-hover) {
  border-color: #841d1d;
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-wp-danger.activated {
  background-color: rgba(132, 29, 29, 0.16);
}

.button-clear-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.button-clear-wp-danger.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.button-clear-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.button-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.button-wp-light:hover:not(.disable-hover) {
  border-color: #e0e0e0;
  background-color: #f4f4f4;
}

.button-wp-light.activated {
  background-color: #e0e0e0;
}

.button-outline-wp-light {
  border-color: #e8e8e8;
  color: #e8e8e8;
  background-color: transparent;
}

.button-outline-wp-light:hover:not(.disable-hover) {
  border-color: #e8e8e8;
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-wp-light.activated {
  background-color: rgba(232, 232, 232, 0.16);
}

.button-clear-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.button-clear-wp-light.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.button-clear-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.button-wp-dark {
  color: #fff;
  background-color: #000000;
}

.button-wp-dark:hover:not(.disable-hover) {
  border-color: #141414;
  background-color: #000000;
}

.button-wp-dark.activated {
  background-color: #141414;
}

.button-outline-wp-dark {
  border-color: #0d0d0d;
  color: #0d0d0d;
  background-color: transparent;
}

.button-outline-wp-dark:hover:not(.disable-hover) {
  border-color: #0d0d0d;
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-wp-dark.activated {
  background-color: rgba(13, 13, 13, 0.16);
}

.button-clear-wp-dark {
  color: #000000;
  background-color: transparent;
}

.button-clear-wp-dark.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.button-clear-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.button-wp-menuinicial {
  color: #000;
  background-color: white;
}

.button-wp-menuinicial:hover:not(.disable-hover) {
  border-color: #ebebeb;
  background-color: white;
}

.button-wp-menuinicial.activated {
  background-color: #ebebeb;
}

.button-outline-wp-menuinicial {
  border-color: #f2f2f2;
  color: #f2f2f2;
  background-color: transparent;
}

.button-outline-wp-menuinicial:hover:not(.disable-hover) {
  border-color: #f2f2f2;
  background-color: rgba(158, 158, 158, 0.1);
}

.button-outline-wp-menuinicial.activated {
  background-color: rgba(242, 242, 242, 0.16);
}

.button-clear-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.button-clear-wp-menuinicial.activated {
  background-color: rgba(158, 158, 158, 0.2);
}

.button-clear-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.button-strong-wp {
  font-weight: bold;
}

ion-card {
  display: block;
  overflow: hidden;
}

ion-card img {
  display: block;
  width: 100%;
}

ion-card-header {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

ion-card-content {
  display: block;
}

.card-ios {
  margin: 12px;
  border-radius: 2px;
  width: calc(100% - 24px);
  font-size: 1.4rem;
  background: #fff;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.card-ios ion-list {
  margin-bottom: 0;
}

.card-ios > .item:last-child,
.card-ios > .item:last-child .item-inner,
.card-ios > .item-wrapper:last-child .item {
  border-bottom: 0;
}

.card-ios .item-ios.item-block .item-inner {
  border: 0;
}

.card-content-ios {
  padding: 13px 16px 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

.card-header-ios {
  font-size: 1.6rem;
  font-weight: 500;
  color: #333;
  padding: 16px;
}

.card-header-ios + .card-content-ios,
.card-ios .item + .card-content-ios {
  padding-top: 0;
}

.card .note-ios {
  font-size: 1.3rem;
}

.card-title-ios {
  display: block;
  font-size: 1.8rem;
  line-height: 1.2;
  color: #222;
  margin: 2px 0;
  padding: 8px 0;
}

.card-ios h1 {
  margin: 0 0 2px;
  font-size: 2.4rem;
  font-weight: normal;
}

.card-ios h2 {
  margin: 2px 0;
  font-size: 1.6rem;
  font-weight: normal;
}

.card-ios h3,
.card-ios h4,
.card-ios h5,
.card-ios h6 {
  margin: 2px 0;
  font-size: 1.4rem;
  font-weight: normal;
}

.card-ios p {
  margin: 0 0 2px;
  font-size: 1.4rem;
  color: #666;
}

.card-ios + ion-card {
  margin-top: 0;
}

.card-ios .text-ios-primary {
  color: #0c031d;
}

.card-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.card-ios-primary .card-header-ios,
.card-ios-primary .card-title-ios,
.card-ios-primary .card-content-ios,
.card-ios-primary p {
  color: #fff;
}

.card-ios-primary .text-ios-primary,
.card-ios-primary .card-header-ios-primary,
.card-ios-primary .card-title-ios-primary,
.card-ios-primary .card-content-ios-primary {
  color: #0c031d;
}

.card-ios-primary .text-ios-secondary,
.card-ios-primary .card-header-ios-secondary,
.card-ios-primary .card-title-ios-secondary,
.card-ios-primary .card-content-ios-secondary {
  color: #969696;
}

.card-ios-primary .text-ios-danger,
.card-ios-primary .card-header-ios-danger,
.card-ios-primary .card-title-ios-danger,
.card-ios-primary .card-content-ios-danger {
  color: #7e1111;
}

.card-ios-primary .text-ios-light,
.card-ios-primary .card-header-ios-light,
.card-ios-primary .card-title-ios-light,
.card-ios-primary .card-content-ios-light {
  color: #f4f4f4;
}

.card-ios-primary .text-ios-dark,
.card-ios-primary .card-header-ios-dark,
.card-ios-primary .card-title-ios-dark,
.card-ios-primary .card-content-ios-dark {
  color: #000000;
}

.card-ios-primary .text-ios-menuinicial,
.card-ios-primary .card-header-ios-menuinicial,
.card-ios-primary .card-title-ios-menuinicial,
.card-ios-primary .card-content-ios-menuinicial {
  color: white;
}

.card-header-ios-primary,
.card-title-ios-primary,
.card-content-ios-primary {
  color: #0c031d;
}

.card-ios .text-ios-secondary {
  color: #969696;
}

.card-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.card-ios-secondary .card-header-ios,
.card-ios-secondary .card-title-ios,
.card-ios-secondary .card-content-ios,
.card-ios-secondary p {
  color: #fff;
}

.card-ios-secondary .text-ios-primary,
.card-ios-secondary .card-header-ios-primary,
.card-ios-secondary .card-title-ios-primary,
.card-ios-secondary .card-content-ios-primary {
  color: #0c031d;
}

.card-ios-secondary .text-ios-secondary,
.card-ios-secondary .card-header-ios-secondary,
.card-ios-secondary .card-title-ios-secondary,
.card-ios-secondary .card-content-ios-secondary {
  color: #969696;
}

.card-ios-secondary .text-ios-danger,
.card-ios-secondary .card-header-ios-danger,
.card-ios-secondary .card-title-ios-danger,
.card-ios-secondary .card-content-ios-danger {
  color: #7e1111;
}

.card-ios-secondary .text-ios-light,
.card-ios-secondary .card-header-ios-light,
.card-ios-secondary .card-title-ios-light,
.card-ios-secondary .card-content-ios-light {
  color: #f4f4f4;
}

.card-ios-secondary .text-ios-dark,
.card-ios-secondary .card-header-ios-dark,
.card-ios-secondary .card-title-ios-dark,
.card-ios-secondary .card-content-ios-dark {
  color: #000000;
}

.card-ios-secondary .text-ios-menuinicial,
.card-ios-secondary .card-header-ios-menuinicial,
.card-ios-secondary .card-title-ios-menuinicial,
.card-ios-secondary .card-content-ios-menuinicial {
  color: white;
}

.card-header-ios-secondary,
.card-title-ios-secondary,
.card-content-ios-secondary {
  color: #969696;
}

.card-ios .text-ios-danger {
  color: #7e1111;
}

.card-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.card-ios-danger .card-header-ios,
.card-ios-danger .card-title-ios,
.card-ios-danger .card-content-ios,
.card-ios-danger p {
  color: #fff;
}

.card-ios-danger .text-ios-primary,
.card-ios-danger .card-header-ios-primary,
.card-ios-danger .card-title-ios-primary,
.card-ios-danger .card-content-ios-primary {
  color: #0c031d;
}

.card-ios-danger .text-ios-secondary,
.card-ios-danger .card-header-ios-secondary,
.card-ios-danger .card-title-ios-secondary,
.card-ios-danger .card-content-ios-secondary {
  color: #969696;
}

.card-ios-danger .text-ios-danger,
.card-ios-danger .card-header-ios-danger,
.card-ios-danger .card-title-ios-danger,
.card-ios-danger .card-content-ios-danger {
  color: #7e1111;
}

.card-ios-danger .text-ios-light,
.card-ios-danger .card-header-ios-light,
.card-ios-danger .card-title-ios-light,
.card-ios-danger .card-content-ios-light {
  color: #f4f4f4;
}

.card-ios-danger .text-ios-dark,
.card-ios-danger .card-header-ios-dark,
.card-ios-danger .card-title-ios-dark,
.card-ios-danger .card-content-ios-dark {
  color: #000000;
}

.card-ios-danger .text-ios-menuinicial,
.card-ios-danger .card-header-ios-menuinicial,
.card-ios-danger .card-title-ios-menuinicial,
.card-ios-danger .card-content-ios-menuinicial {
  color: white;
}

.card-header-ios-danger,
.card-title-ios-danger,
.card-content-ios-danger {
  color: #7e1111;
}

.card-ios .text-ios-light {
  color: #f4f4f4;
}

.card-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.card-ios-light .card-header-ios,
.card-ios-light .card-title-ios,
.card-ios-light .card-content-ios,
.card-ios-light p {
  color: #000;
}

.card-ios-light .text-ios-primary,
.card-ios-light .card-header-ios-primary,
.card-ios-light .card-title-ios-primary,
.card-ios-light .card-content-ios-primary {
  color: #0c031d;
}

.card-ios-light .text-ios-secondary,
.card-ios-light .card-header-ios-secondary,
.card-ios-light .card-title-ios-secondary,
.card-ios-light .card-content-ios-secondary {
  color: #969696;
}

.card-ios-light .text-ios-danger,
.card-ios-light .card-header-ios-danger,
.card-ios-light .card-title-ios-danger,
.card-ios-light .card-content-ios-danger {
  color: #7e1111;
}

.card-ios-light .text-ios-light,
.card-ios-light .card-header-ios-light,
.card-ios-light .card-title-ios-light,
.card-ios-light .card-content-ios-light {
  color: #f4f4f4;
}

.card-ios-light .text-ios-dark,
.card-ios-light .card-header-ios-dark,
.card-ios-light .card-title-ios-dark,
.card-ios-light .card-content-ios-dark {
  color: #000000;
}

.card-ios-light .text-ios-menuinicial,
.card-ios-light .card-header-ios-menuinicial,
.card-ios-light .card-title-ios-menuinicial,
.card-ios-light .card-content-ios-menuinicial {
  color: white;
}

.card-header-ios-light,
.card-title-ios-light,
.card-content-ios-light {
  color: #f4f4f4;
}

.card-ios .text-ios-dark {
  color: #000000;
}

.card-ios-dark {
  color: #fff;
  background-color: #000000;
}

.card-ios-dark .card-header-ios,
.card-ios-dark .card-title-ios,
.card-ios-dark .card-content-ios,
.card-ios-dark p {
  color: #fff;
}

.card-ios-dark .text-ios-primary,
.card-ios-dark .card-header-ios-primary,
.card-ios-dark .card-title-ios-primary,
.card-ios-dark .card-content-ios-primary {
  color: #0c031d;
}

.card-ios-dark .text-ios-secondary,
.card-ios-dark .card-header-ios-secondary,
.card-ios-dark .card-title-ios-secondary,
.card-ios-dark .card-content-ios-secondary {
  color: #969696;
}

.card-ios-dark .text-ios-danger,
.card-ios-dark .card-header-ios-danger,
.card-ios-dark .card-title-ios-danger,
.card-ios-dark .card-content-ios-danger {
  color: #7e1111;
}

.card-ios-dark .text-ios-light,
.card-ios-dark .card-header-ios-light,
.card-ios-dark .card-title-ios-light,
.card-ios-dark .card-content-ios-light {
  color: #f4f4f4;
}

.card-ios-dark .text-ios-dark,
.card-ios-dark .card-header-ios-dark,
.card-ios-dark .card-title-ios-dark,
.card-ios-dark .card-content-ios-dark {
  color: #000000;
}

.card-ios-dark .text-ios-menuinicial,
.card-ios-dark .card-header-ios-menuinicial,
.card-ios-dark .card-title-ios-menuinicial,
.card-ios-dark .card-content-ios-menuinicial {
  color: white;
}

.card-header-ios-dark,
.card-title-ios-dark,
.card-content-ios-dark {
  color: #000000;
}

.card-ios .text-ios-menuinicial {
  color: white;
}

.card-ios-menuinicial {
  color: #000;
  background-color: white;
}

.card-ios-menuinicial .card-header-ios,
.card-ios-menuinicial .card-title-ios,
.card-ios-menuinicial .card-content-ios,
.card-ios-menuinicial p {
  color: #000;
}

.card-ios-menuinicial .text-ios-primary,
.card-ios-menuinicial .card-header-ios-primary,
.card-ios-menuinicial .card-title-ios-primary,
.card-ios-menuinicial .card-content-ios-primary {
  color: #0c031d;
}

.card-ios-menuinicial .text-ios-secondary,
.card-ios-menuinicial .card-header-ios-secondary,
.card-ios-menuinicial .card-title-ios-secondary,
.card-ios-menuinicial .card-content-ios-secondary {
  color: #969696;
}

.card-ios-menuinicial .text-ios-danger,
.card-ios-menuinicial .card-header-ios-danger,
.card-ios-menuinicial .card-title-ios-danger,
.card-ios-menuinicial .card-content-ios-danger {
  color: #7e1111;
}

.card-ios-menuinicial .text-ios-light,
.card-ios-menuinicial .card-header-ios-light,
.card-ios-menuinicial .card-title-ios-light,
.card-ios-menuinicial .card-content-ios-light {
  color: #f4f4f4;
}

.card-ios-menuinicial .text-ios-dark,
.card-ios-menuinicial .card-header-ios-dark,
.card-ios-menuinicial .card-title-ios-dark,
.card-ios-menuinicial .card-content-ios-dark {
  color: #000000;
}

.card-ios-menuinicial .text-ios-menuinicial,
.card-ios-menuinicial .card-header-ios-menuinicial,
.card-ios-menuinicial .card-title-ios-menuinicial,
.card-ios-menuinicial .card-content-ios-menuinicial {
  color: white;
}

.card-header-ios-menuinicial,
.card-title-ios-menuinicial,
.card-content-ios-menuinicial {
  color: white;
}

.card-md {
  margin: 10px;
  border-radius: 2px;
  width: calc(100% - 20px);
  font-size: 1.4rem;
  background: #fff;
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.card-md ion-list {
  margin-bottom: 0;
}

.card-md > .item:last-child,
.card-md > .item:last-child .item-inner,
.card-md > .item-wrapper:last-child .item {
  border-bottom: 0;
}

.card-md .item-md.item-block .item-inner {
  border: 0;
}

.card-content-md {
  padding: 13px 16px;
  font-size: 1.4rem;
  line-height: 1.5;
}

.card-header-md {
  font-size: 1.6rem;
  color: #222;
  padding: 16px;
}

.card-header-md + .card-content-md,
.card-md .item + .card-content-md {
  padding-top: 0;
}

.card .note-md {
  font-size: 1.3rem;
}

.card-title-md {
  display: block;
  font-size: 2.4rem;
  line-height: 1.2;
  color: #222;
  margin: 2px 0;
  padding: 8px 0;
}

.card-md h1 {
  margin: 0 0 2px;
  font-size: 2.4rem;
  font-weight: normal;
  color: #222;
}

.card-md h2 {
  margin: 2px 0;
  font-size: 1.6rem;
  font-weight: normal;
  color: #222;
}

.card-md h3,
.card-md h4,
.card-md h5,
.card-md h6 {
  margin: 2px 0;
  font-size: 1.4rem;
  font-weight: normal;
  color: #222;
}

.card-md p {
  margin: 0 0 2px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1.5;
  color: #222;
}

.card-md + ion-card {
  margin-top: 0;
}

.card-md .text-md-primary {
  color: #0c031d;
}

.card-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.card-md-primary .card-header-md,
.card-md-primary .card-title-md,
.card-md-primary .card-content-md,
.card-md-primary h1,
.card-md-primary h2,
.card-md-primary h3,
.card-md-primary h4,
.card-md-primary h5,
.card-md-primary h6,
.card-md-primary p {
  color: #fff;
}

.card-md-primary .text-md-primary,
.card-md-primary .card-header-md-primary,
.card-md-primary .card-title-md-primary,
.card-md-primary .card-content-md-primary {
  color: #0c031d;
}

.card-md-primary .text-md-secondary,
.card-md-primary .card-header-md-secondary,
.card-md-primary .card-title-md-secondary,
.card-md-primary .card-content-md-secondary {
  color: #969696;
}

.card-md-primary .text-md-danger,
.card-md-primary .card-header-md-danger,
.card-md-primary .card-title-md-danger,
.card-md-primary .card-content-md-danger {
  color: #7e1111;
}

.card-md-primary .text-md-light,
.card-md-primary .card-header-md-light,
.card-md-primary .card-title-md-light,
.card-md-primary .card-content-md-light {
  color: #f4f4f4;
}

.card-md-primary .text-md-dark,
.card-md-primary .card-header-md-dark,
.card-md-primary .card-title-md-dark,
.card-md-primary .card-content-md-dark {
  color: #000000;
}

.card-md-primary .text-md-menuinicial,
.card-md-primary .card-header-md-menuinicial,
.card-md-primary .card-title-md-menuinicial,
.card-md-primary .card-content-md-menuinicial {
  color: white;
}

.card-header-md-primary,
.card-title-md-primary,
.card-content-md-primary {
  color: #0c031d;
}

.card-md .text-md-secondary {
  color: #969696;
}

.card-md-secondary {
  color: #fff;
  background-color: #969696;
}

.card-md-secondary .card-header-md,
.card-md-secondary .card-title-md,
.card-md-secondary .card-content-md,
.card-md-secondary h1,
.card-md-secondary h2,
.card-md-secondary h3,
.card-md-secondary h4,
.card-md-secondary h5,
.card-md-secondary h6,
.card-md-secondary p {
  color: #fff;
}

.card-md-secondary .text-md-primary,
.card-md-secondary .card-header-md-primary,
.card-md-secondary .card-title-md-primary,
.card-md-secondary .card-content-md-primary {
  color: #0c031d;
}

.card-md-secondary .text-md-secondary,
.card-md-secondary .card-header-md-secondary,
.card-md-secondary .card-title-md-secondary,
.card-md-secondary .card-content-md-secondary {
  color: #969696;
}

.card-md-secondary .text-md-danger,
.card-md-secondary .card-header-md-danger,
.card-md-secondary .card-title-md-danger,
.card-md-secondary .card-content-md-danger {
  color: #7e1111;
}

.card-md-secondary .text-md-light,
.card-md-secondary .card-header-md-light,
.card-md-secondary .card-title-md-light,
.card-md-secondary .card-content-md-light {
  color: #f4f4f4;
}

.card-md-secondary .text-md-dark,
.card-md-secondary .card-header-md-dark,
.card-md-secondary .card-title-md-dark,
.card-md-secondary .card-content-md-dark {
  color: #000000;
}

.card-md-secondary .text-md-menuinicial,
.card-md-secondary .card-header-md-menuinicial,
.card-md-secondary .card-title-md-menuinicial,
.card-md-secondary .card-content-md-menuinicial {
  color: white;
}

.card-header-md-secondary,
.card-title-md-secondary,
.card-content-md-secondary {
  color: #969696;
}

.card-md .text-md-danger {
  color: #7e1111;
}

.card-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.card-md-danger .card-header-md,
.card-md-danger .card-title-md,
.card-md-danger .card-content-md,
.card-md-danger h1,
.card-md-danger h2,
.card-md-danger h3,
.card-md-danger h4,
.card-md-danger h5,
.card-md-danger h6,
.card-md-danger p {
  color: #fff;
}

.card-md-danger .text-md-primary,
.card-md-danger .card-header-md-primary,
.card-md-danger .card-title-md-primary,
.card-md-danger .card-content-md-primary {
  color: #0c031d;
}

.card-md-danger .text-md-secondary,
.card-md-danger .card-header-md-secondary,
.card-md-danger .card-title-md-secondary,
.card-md-danger .card-content-md-secondary {
  color: #969696;
}

.card-md-danger .text-md-danger,
.card-md-danger .card-header-md-danger,
.card-md-danger .card-title-md-danger,
.card-md-danger .card-content-md-danger {
  color: #7e1111;
}

.card-md-danger .text-md-light,
.card-md-danger .card-header-md-light,
.card-md-danger .card-title-md-light,
.card-md-danger .card-content-md-light {
  color: #f4f4f4;
}

.card-md-danger .text-md-dark,
.card-md-danger .card-header-md-dark,
.card-md-danger .card-title-md-dark,
.card-md-danger .card-content-md-dark {
  color: #000000;
}

.card-md-danger .text-md-menuinicial,
.card-md-danger .card-header-md-menuinicial,
.card-md-danger .card-title-md-menuinicial,
.card-md-danger .card-content-md-menuinicial {
  color: white;
}

.card-header-md-danger,
.card-title-md-danger,
.card-content-md-danger {
  color: #7e1111;
}

.card-md .text-md-light {
  color: #f4f4f4;
}

.card-md-light {
  color: #000;
  background-color: #f4f4f4;
}

.card-md-light .card-header-md,
.card-md-light .card-title-md,
.card-md-light .card-content-md,
.card-md-light h1,
.card-md-light h2,
.card-md-light h3,
.card-md-light h4,
.card-md-light h5,
.card-md-light h6,
.card-md-light p {
  color: #000;
}

.card-md-light .text-md-primary,
.card-md-light .card-header-md-primary,
.card-md-light .card-title-md-primary,
.card-md-light .card-content-md-primary {
  color: #0c031d;
}

.card-md-light .text-md-secondary,
.card-md-light .card-header-md-secondary,
.card-md-light .card-title-md-secondary,
.card-md-light .card-content-md-secondary {
  color: #969696;
}

.card-md-light .text-md-danger,
.card-md-light .card-header-md-danger,
.card-md-light .card-title-md-danger,
.card-md-light .card-content-md-danger {
  color: #7e1111;
}

.card-md-light .text-md-light,
.card-md-light .card-header-md-light,
.card-md-light .card-title-md-light,
.card-md-light .card-content-md-light {
  color: #f4f4f4;
}

.card-md-light .text-md-dark,
.card-md-light .card-header-md-dark,
.card-md-light .card-title-md-dark,
.card-md-light .card-content-md-dark {
  color: #000000;
}

.card-md-light .text-md-menuinicial,
.card-md-light .card-header-md-menuinicial,
.card-md-light .card-title-md-menuinicial,
.card-md-light .card-content-md-menuinicial {
  color: white;
}

.card-header-md-light,
.card-title-md-light,
.card-content-md-light {
  color: #f4f4f4;
}

.card-md .text-md-dark {
  color: #000000;
}

.card-md-dark {
  color: #fff;
  background-color: #000000;
}

.card-md-dark .card-header-md,
.card-md-dark .card-title-md,
.card-md-dark .card-content-md,
.card-md-dark h1,
.card-md-dark h2,
.card-md-dark h3,
.card-md-dark h4,
.card-md-dark h5,
.card-md-dark h6,
.card-md-dark p {
  color: #fff;
}

.card-md-dark .text-md-primary,
.card-md-dark .card-header-md-primary,
.card-md-dark .card-title-md-primary,
.card-md-dark .card-content-md-primary {
  color: #0c031d;
}

.card-md-dark .text-md-secondary,
.card-md-dark .card-header-md-secondary,
.card-md-dark .card-title-md-secondary,
.card-md-dark .card-content-md-secondary {
  color: #969696;
}

.card-md-dark .text-md-danger,
.card-md-dark .card-header-md-danger,
.card-md-dark .card-title-md-danger,
.card-md-dark .card-content-md-danger {
  color: #7e1111;
}

.card-md-dark .text-md-light,
.card-md-dark .card-header-md-light,
.card-md-dark .card-title-md-light,
.card-md-dark .card-content-md-light {
  color: #f4f4f4;
}

.card-md-dark .text-md-dark,
.card-md-dark .card-header-md-dark,
.card-md-dark .card-title-md-dark,
.card-md-dark .card-content-md-dark {
  color: #000000;
}

.card-md-dark .text-md-menuinicial,
.card-md-dark .card-header-md-menuinicial,
.card-md-dark .card-title-md-menuinicial,
.card-md-dark .card-content-md-menuinicial {
  color: white;
}

.card-header-md-dark,
.card-title-md-dark,
.card-content-md-dark {
  color: #000000;
}

.card-md .text-md-menuinicial {
  color: white;
}

.card-md-menuinicial {
  color: #000;
  background-color: white;
}

.card-md-menuinicial .card-header-md,
.card-md-menuinicial .card-title-md,
.card-md-menuinicial .card-content-md,
.card-md-menuinicial h1,
.card-md-menuinicial h2,
.card-md-menuinicial h3,
.card-md-menuinicial h4,
.card-md-menuinicial h5,
.card-md-menuinicial h6,
.card-md-menuinicial p {
  color: #000;
}

.card-md-menuinicial .text-md-primary,
.card-md-menuinicial .card-header-md-primary,
.card-md-menuinicial .card-title-md-primary,
.card-md-menuinicial .card-content-md-primary {
  color: #0c031d;
}

.card-md-menuinicial .text-md-secondary,
.card-md-menuinicial .card-header-md-secondary,
.card-md-menuinicial .card-title-md-secondary,
.card-md-menuinicial .card-content-md-secondary {
  color: #969696;
}

.card-md-menuinicial .text-md-danger,
.card-md-menuinicial .card-header-md-danger,
.card-md-menuinicial .card-title-md-danger,
.card-md-menuinicial .card-content-md-danger {
  color: #7e1111;
}

.card-md-menuinicial .text-md-light,
.card-md-menuinicial .card-header-md-light,
.card-md-menuinicial .card-title-md-light,
.card-md-menuinicial .card-content-md-light {
  color: #f4f4f4;
}

.card-md-menuinicial .text-md-dark,
.card-md-menuinicial .card-header-md-dark,
.card-md-menuinicial .card-title-md-dark,
.card-md-menuinicial .card-content-md-dark {
  color: #000000;
}

.card-md-menuinicial .text-md-menuinicial,
.card-md-menuinicial .card-header-md-menuinicial,
.card-md-menuinicial .card-title-md-menuinicial,
.card-md-menuinicial .card-content-md-menuinicial {
  color: white;
}

.card-header-md-menuinicial,
.card-title-md-menuinicial,
.card-content-md-menuinicial {
  color: white;
}

.card-wp {
  margin: 8px;
  border-radius: 1px;
  width: calc(100% - 16px);
  font-size: 1.4rem;
  background: #fff;
  -webkit-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.2);
}

.card-wp ion-list {
  margin-bottom: 0;
}

.card-wp > .item:last-child,
.card-wp > .item:last-child .item-inner,
.card-wp > .item-wrapper:last-child .item {
  border-bottom: 0;
}

.card-wp .item-wp.item-block .item-inner {
  border: 0;
}

.card-content-wp {
  padding: 13px 16px;
  font-size: 1.4rem;
  line-height: 1.5;
}

.card-header-wp {
  font-size: 1.6rem;
  color: #222;
  padding: 16px;
}

.card-header-wp + .card-content-wp,
.card-wp .item + .card-content-wp {
  padding-top: 0;
}

.card .note-wp {
  font-size: 1.3rem;
}

.card-title-wp {
  display: block;
  font-size: 2.4rem;
  line-height: 1.2;
  color: #222;
  margin: 2px 0;
  padding: 8px 0;
}

.card-wp h1 {
  margin: 0 0 2px;
  font-size: 2.4rem;
  font-weight: normal;
  color: #222;
}

.card-wp h2 {
  margin: 2px 0;
  font-size: 1.6rem;
  font-weight: normal;
  color: #222;
}

.card-wp h3,
.card-wp h4,
.card-wp h5,
.card-wp h6 {
  margin: 2px 0;
  font-size: 1.4rem;
  font-weight: normal;
  color: #222;
}

.card-wp p {
  margin: 0 0 2px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1.5;
  color: #222;
}

.card-wp + ion-card {
  margin-top: 0;
}

.card-wp .text-wp-primary {
  color: #0c031d;
}

.card-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.card-wp-primary .card-header-wp,
.card-wp-primary .card-title-wp,
.card-wp-primary .card-content-wp,
.card-wp-primary h1,
.card-wp-primary h2,
.card-wp-primary h3,
.card-wp-primary h4,
.card-wp-primary h5,
.card-wp-primary h6,
.card-wp-primary p {
  color: #fff;
}

.card-wp-primary .text-wp-primary,
.card-wp-primary .card-header-wp-primary,
.card-wp-primary .card-title-wp-primary,
.card-wp-primary .card-content-wp-primary {
  color: #0c031d;
}

.card-wp-primary .text-wp-secondary,
.card-wp-primary .card-header-wp-secondary,
.card-wp-primary .card-title-wp-secondary,
.card-wp-primary .card-content-wp-secondary {
  color: #969696;
}

.card-wp-primary .text-wp-danger,
.card-wp-primary .card-header-wp-danger,
.card-wp-primary .card-title-wp-danger,
.card-wp-primary .card-content-wp-danger {
  color: #7e1111;
}

.card-wp-primary .text-wp-light,
.card-wp-primary .card-header-wp-light,
.card-wp-primary .card-title-wp-light,
.card-wp-primary .card-content-wp-light {
  color: #f4f4f4;
}

.card-wp-primary .text-wp-dark,
.card-wp-primary .card-header-wp-dark,
.card-wp-primary .card-title-wp-dark,
.card-wp-primary .card-content-wp-dark {
  color: #000000;
}

.card-wp-primary .text-wp-menuinicial,
.card-wp-primary .card-header-wp-menuinicial,
.card-wp-primary .card-title-wp-menuinicial,
.card-wp-primary .card-content-wp-menuinicial {
  color: white;
}

.card-header-wp-primary,
.card-title-wp-primary,
.card-content-wp-primary {
  color: #0c031d;
}

.card-wp .text-wp-secondary {
  color: #969696;
}

.card-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.card-wp-secondary .card-header-wp,
.card-wp-secondary .card-title-wp,
.card-wp-secondary .card-content-wp,
.card-wp-secondary h1,
.card-wp-secondary h2,
.card-wp-secondary h3,
.card-wp-secondary h4,
.card-wp-secondary h5,
.card-wp-secondary h6,
.card-wp-secondary p {
  color: #fff;
}

.card-wp-secondary .text-wp-primary,
.card-wp-secondary .card-header-wp-primary,
.card-wp-secondary .card-title-wp-primary,
.card-wp-secondary .card-content-wp-primary {
  color: #0c031d;
}

.card-wp-secondary .text-wp-secondary,
.card-wp-secondary .card-header-wp-secondary,
.card-wp-secondary .card-title-wp-secondary,
.card-wp-secondary .card-content-wp-secondary {
  color: #969696;
}

.card-wp-secondary .text-wp-danger,
.card-wp-secondary .card-header-wp-danger,
.card-wp-secondary .card-title-wp-danger,
.card-wp-secondary .card-content-wp-danger {
  color: #7e1111;
}

.card-wp-secondary .text-wp-light,
.card-wp-secondary .card-header-wp-light,
.card-wp-secondary .card-title-wp-light,
.card-wp-secondary .card-content-wp-light {
  color: #f4f4f4;
}

.card-wp-secondary .text-wp-dark,
.card-wp-secondary .card-header-wp-dark,
.card-wp-secondary .card-title-wp-dark,
.card-wp-secondary .card-content-wp-dark {
  color: #000000;
}

.card-wp-secondary .text-wp-menuinicial,
.card-wp-secondary .card-header-wp-menuinicial,
.card-wp-secondary .card-title-wp-menuinicial,
.card-wp-secondary .card-content-wp-menuinicial {
  color: white;
}

.card-header-wp-secondary,
.card-title-wp-secondary,
.card-content-wp-secondary {
  color: #969696;
}

.card-wp .text-wp-danger {
  color: #7e1111;
}

.card-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.card-wp-danger .card-header-wp,
.card-wp-danger .card-title-wp,
.card-wp-danger .card-content-wp,
.card-wp-danger h1,
.card-wp-danger h2,
.card-wp-danger h3,
.card-wp-danger h4,
.card-wp-danger h5,
.card-wp-danger h6,
.card-wp-danger p {
  color: #fff;
}

.card-wp-danger .text-wp-primary,
.card-wp-danger .card-header-wp-primary,
.card-wp-danger .card-title-wp-primary,
.card-wp-danger .card-content-wp-primary {
  color: #0c031d;
}

.card-wp-danger .text-wp-secondary,
.card-wp-danger .card-header-wp-secondary,
.card-wp-danger .card-title-wp-secondary,
.card-wp-danger .card-content-wp-secondary {
  color: #969696;
}

.card-wp-danger .text-wp-danger,
.card-wp-danger .card-header-wp-danger,
.card-wp-danger .card-title-wp-danger,
.card-wp-danger .card-content-wp-danger {
  color: #7e1111;
}

.card-wp-danger .text-wp-light,
.card-wp-danger .card-header-wp-light,
.card-wp-danger .card-title-wp-light,
.card-wp-danger .card-content-wp-light {
  color: #f4f4f4;
}

.card-wp-danger .text-wp-dark,
.card-wp-danger .card-header-wp-dark,
.card-wp-danger .card-title-wp-dark,
.card-wp-danger .card-content-wp-dark {
  color: #000000;
}

.card-wp-danger .text-wp-menuinicial,
.card-wp-danger .card-header-wp-menuinicial,
.card-wp-danger .card-title-wp-menuinicial,
.card-wp-danger .card-content-wp-menuinicial {
  color: white;
}

.card-header-wp-danger,
.card-title-wp-danger,
.card-content-wp-danger {
  color: #7e1111;
}

.card-wp .text-wp-light {
  color: #f4f4f4;
}

.card-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.card-wp-light .card-header-wp,
.card-wp-light .card-title-wp,
.card-wp-light .card-content-wp,
.card-wp-light h1,
.card-wp-light h2,
.card-wp-light h3,
.card-wp-light h4,
.card-wp-light h5,
.card-wp-light h6,
.card-wp-light p {
  color: #000;
}

.card-wp-light .text-wp-primary,
.card-wp-light .card-header-wp-primary,
.card-wp-light .card-title-wp-primary,
.card-wp-light .card-content-wp-primary {
  color: #0c031d;
}

.card-wp-light .text-wp-secondary,
.card-wp-light .card-header-wp-secondary,
.card-wp-light .card-title-wp-secondary,
.card-wp-light .card-content-wp-secondary {
  color: #969696;
}

.card-wp-light .text-wp-danger,
.card-wp-light .card-header-wp-danger,
.card-wp-light .card-title-wp-danger,
.card-wp-light .card-content-wp-danger {
  color: #7e1111;
}

.card-wp-light .text-wp-light,
.card-wp-light .card-header-wp-light,
.card-wp-light .card-title-wp-light,
.card-wp-light .card-content-wp-light {
  color: #f4f4f4;
}

.card-wp-light .text-wp-dark,
.card-wp-light .card-header-wp-dark,
.card-wp-light .card-title-wp-dark,
.card-wp-light .card-content-wp-dark {
  color: #000000;
}

.card-wp-light .text-wp-menuinicial,
.card-wp-light .card-header-wp-menuinicial,
.card-wp-light .card-title-wp-menuinicial,
.card-wp-light .card-content-wp-menuinicial {
  color: white;
}

.card-header-wp-light,
.card-title-wp-light,
.card-content-wp-light {
  color: #f4f4f4;
}

.card-wp .text-wp-dark {
  color: #000000;
}

.card-wp-dark {
  color: #fff;
  background-color: #000000;
}

.card-wp-dark .card-header-wp,
.card-wp-dark .card-title-wp,
.card-wp-dark .card-content-wp,
.card-wp-dark h1,
.card-wp-dark h2,
.card-wp-dark h3,
.card-wp-dark h4,
.card-wp-dark h5,
.card-wp-dark h6,
.card-wp-dark p {
  color: #fff;
}

.card-wp-dark .text-wp-primary,
.card-wp-dark .card-header-wp-primary,
.card-wp-dark .card-title-wp-primary,
.card-wp-dark .card-content-wp-primary {
  color: #0c031d;
}

.card-wp-dark .text-wp-secondary,
.card-wp-dark .card-header-wp-secondary,
.card-wp-dark .card-title-wp-secondary,
.card-wp-dark .card-content-wp-secondary {
  color: #969696;
}

.card-wp-dark .text-wp-danger,
.card-wp-dark .card-header-wp-danger,
.card-wp-dark .card-title-wp-danger,
.card-wp-dark .card-content-wp-danger {
  color: #7e1111;
}

.card-wp-dark .text-wp-light,
.card-wp-dark .card-header-wp-light,
.card-wp-dark .card-title-wp-light,
.card-wp-dark .card-content-wp-light {
  color: #f4f4f4;
}

.card-wp-dark .text-wp-dark,
.card-wp-dark .card-header-wp-dark,
.card-wp-dark .card-title-wp-dark,
.card-wp-dark .card-content-wp-dark {
  color: #000000;
}

.card-wp-dark .text-wp-menuinicial,
.card-wp-dark .card-header-wp-menuinicial,
.card-wp-dark .card-title-wp-menuinicial,
.card-wp-dark .card-content-wp-menuinicial {
  color: white;
}

.card-header-wp-dark,
.card-title-wp-dark,
.card-content-wp-dark {
  color: #000000;
}

.card-wp .text-wp-menuinicial {
  color: white;
}

.card-wp-menuinicial {
  color: #000;
  background-color: white;
}

.card-wp-menuinicial .card-header-wp,
.card-wp-menuinicial .card-title-wp,
.card-wp-menuinicial .card-content-wp,
.card-wp-menuinicial h1,
.card-wp-menuinicial h2,
.card-wp-menuinicial h3,
.card-wp-menuinicial h4,
.card-wp-menuinicial h5,
.card-wp-menuinicial h6,
.card-wp-menuinicial p {
  color: #000;
}

.card-wp-menuinicial .text-wp-primary,
.card-wp-menuinicial .card-header-wp-primary,
.card-wp-menuinicial .card-title-wp-primary,
.card-wp-menuinicial .card-content-wp-primary {
  color: #0c031d;
}

.card-wp-menuinicial .text-wp-secondary,
.card-wp-menuinicial .card-header-wp-secondary,
.card-wp-menuinicial .card-title-wp-secondary,
.card-wp-menuinicial .card-content-wp-secondary {
  color: #969696;
}

.card-wp-menuinicial .text-wp-danger,
.card-wp-menuinicial .card-header-wp-danger,
.card-wp-menuinicial .card-title-wp-danger,
.card-wp-menuinicial .card-content-wp-danger {
  color: #7e1111;
}

.card-wp-menuinicial .text-wp-light,
.card-wp-menuinicial .card-header-wp-light,
.card-wp-menuinicial .card-title-wp-light,
.card-wp-menuinicial .card-content-wp-light {
  color: #f4f4f4;
}

.card-wp-menuinicial .text-wp-dark,
.card-wp-menuinicial .card-header-wp-dark,
.card-wp-menuinicial .card-title-wp-dark,
.card-wp-menuinicial .card-content-wp-dark {
  color: #000000;
}

.card-wp-menuinicial .text-wp-menuinicial,
.card-wp-menuinicial .card-header-wp-menuinicial,
.card-wp-menuinicial .card-title-wp-menuinicial,
.card-wp-menuinicial .card-content-wp-menuinicial {
  color: white;
}

.card-header-wp-menuinicial,
.card-title-wp-menuinicial,
.card-content-wp-menuinicial {
  color: white;
}

.checkbox-ios {
  position: relative;
  display: inline-block;
}

.checkbox-ios .checkbox-icon {
  border-radius: 50%;
  position: relative;
  width: 21px;
  height: 21px;
  border-width: 1px;
  border-style: solid;
  border-color: #c8c7cc;
  background-color: #fff;
}

.checkbox-ios .checkbox-checked {
  border-color: #0c031d;
  background-color: #0c031d;
}

.checkbox-ios .checkbox-checked .checkbox-inner {
  left: 7px;
  top: 4px;
  position: absolute;
  width: 4px;
  height: 9px;
  border-width: 1px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.checkbox-ios.checkbox-disabled,
.item-ios.item-checkbox-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.item.item-ios .checkbox-ios {
  position: static;
  display: block;
  margin: 8px 16px 8px 2px;
}

.item.item-ios .checkbox-ios[item-right],
.item.item-ios .checkbox-ios[item-end] {
  margin: 10px 8px 9px 0;
}

.checkbox-ios-primary .checkbox-checked {
  border-color: #0c031d;
  background-color: #0c031d;
}

.checkbox-ios-primary .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-ios-secondary .checkbox-checked {
  border-color: #969696;
  background-color: #969696;
}

.checkbox-ios-secondary .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-ios-danger .checkbox-checked {
  border-color: #7e1111;
  background-color: #7e1111;
}

.checkbox-ios-danger .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-ios-light .checkbox-checked {
  border-color: #f4f4f4;
  background-color: #f4f4f4;
}

.checkbox-ios-light .checkbox-checked .checkbox-inner {
  border-color: #000;
}

.checkbox-ios-dark .checkbox-checked {
  border-color: #000000;
  background-color: #000000;
}

.checkbox-ios-dark .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-ios-menuinicial .checkbox-checked {
  border-color: white;
  background-color: white;
}

.checkbox-ios-menuinicial .checkbox-checked .checkbox-inner {
  border-color: #000;
}

.checkbox-md {
  position: relative;
  display: inline-block;
}

.checkbox-md .checkbox-icon {
  border-radius: 2px;
  position: relative;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: #787878;
  background-color: #fff;
  -webkit-transition-duration: 280ms;
  transition-duration: 280ms;
  -webkit-transition-property: background;
  transition-property: background;
  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.checkbox-md .checkbox-checked {
  border-color: #0c031d;
  background-color: #0c031d;
}

.checkbox-md .checkbox-checked .checkbox-inner {
  left: 4px;
  top: 0;
  position: absolute;
  width: 5px;
  height: 10px;
  border-width: 2px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.checkbox-md.checkbox-disabled,
.item-md.item-checkbox-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.item.item-md .checkbox-md {
  position: static;
  display: block;
  margin: 9px 36px 9px 4px;
}

.item.item-md .checkbox-md[item-right],
.item.item-md .checkbox-md[item-end] {
  margin: 11px 10px 10px 0;
}

.checkbox-md + .item-inner ion-label {
  margin-left: 0;
}

.checkbox-md-primary .checkbox-checked {
  border-color: #0c031d;
  background-color: #0c031d;
}

.checkbox-md-primary .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-md-secondary .checkbox-checked {
  border-color: #969696;
  background-color: #969696;
}

.checkbox-md-secondary .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-md-danger .checkbox-checked {
  border-color: #7e1111;
  background-color: #7e1111;
}

.checkbox-md-danger .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-md-light .checkbox-checked {
  border-color: #f4f4f4;
  background-color: #f4f4f4;
}

.checkbox-md-light .checkbox-checked .checkbox-inner {
  border-color: #000;
}

.checkbox-md-dark .checkbox-checked {
  border-color: #000000;
  background-color: #000000;
}

.checkbox-md-dark .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-md-menuinicial .checkbox-checked {
  border-color: white;
  background-color: white;
}

.checkbox-md-menuinicial .checkbox-checked .checkbox-inner {
  border-color: #000;
}

.checkbox-wp {
  position: relative;
  display: inline-block;
}

.checkbox-wp .checkbox-icon {
  border-radius: 0;
  position: relative;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: #333;
  background-color: #fff;
}

.checkbox-wp .checkbox-checked {
  border-color: #0c031d;
  background-color: #0c031d;
}

.checkbox-wp .checkbox-checked .checkbox-inner {
  left: 3px;
  top: -2px;
  position: absolute;
  width: 6px;
  height: 12px;
  border-width: 1px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.checkbox-wp.checkbox-disabled,
.item-wp.item-checkbox-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.item.item-wp .checkbox-wp {
  position: static;
  display: block;
  margin: 9px 16px 9px 4px;
}

.item.item-wp .checkbox-wp[item-right],
.item.item-wp .checkbox-wp[item-end] {
  margin: 11px 10px 10px 0;
}

.checkbox-wp + .item-inner ion-label {
  margin-left: 0;
}

.checkbox-wp-primary .checkbox-checked {
  border-color: #0c031d;
  background-color: #0c031d;
}

.checkbox-wp-primary .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-wp-secondary .checkbox-checked {
  border-color: #969696;
  background-color: #969696;
}

.checkbox-wp-secondary .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-wp-danger .checkbox-checked {
  border-color: #7e1111;
  background-color: #7e1111;
}

.checkbox-wp-danger .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-wp-light .checkbox-checked {
  border-color: #f4f4f4;
  background-color: #f4f4f4;
}

.checkbox-wp-light .checkbox-checked .checkbox-inner {
  border-color: #000;
}

.checkbox-wp-dark .checkbox-checked {
  border-color: #000000;
  background-color: #000000;
}

.checkbox-wp-dark .checkbox-checked .checkbox-inner {
  border-color: #fff;
}

.checkbox-wp-menuinicial .checkbox-checked {
  border-color: white;
  background-color: white;
}

.checkbox-wp-menuinicial .checkbox-checked .checkbox-inner {
  border-color: #000;
}

ion-chip {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  font-weight: normal;
  vertical-align: middle;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

ion-chip .button {
  border-radius: 50%;
  width: 32px;
  height: 32px;
  margin: 0;
}

ion-chip ion-icon {
  text-align: center;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  font-size: 18px;
  line-height: 32px;
}

ion-chip ion-avatar {
  border-radius: 50%;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
}

ion-chip ion-avatar img {
  border-radius: 50%;
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
}

.chip-ios {
  border-radius: 16px;
  height: 32px;
  font-size: 13px;
  line-height: 32px;
  color: rgba(0, 0, 0, 0.87);
  background: rgba(0, 0, 0, 0.12);
  margin: 2px 0;
}

.chip-ios > ion-label {
  margin: 0 10px;
}

.chip-ios > ion-icon {
  color: #fff;
  background-color: #0c031d;
}

.chip-ios-primary,
.chip-ios .icon-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.chip-ios-secondary,
.chip-ios .icon-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.chip-ios-danger,
.chip-ios .icon-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.chip-ios-light,
.chip-ios .icon-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.chip-ios-dark,
.chip-ios .icon-ios-dark {
  color: #fff;
  background-color: #000000;
}

.chip-ios-menuinicial,
.chip-ios .icon-ios-menuinicial {
  color: #000;
  background-color: white;
}

.chip-md {
  border-radius: 16px;
  height: 32px;
  font-size: 13px;
  line-height: 32px;
  color: rgba(0, 0, 0, 0.87);
  background: rgba(0, 0, 0, 0.12);
  margin: 2px 0;
}

.chip-md > ion-label {
  margin: 0 10px;
}

.chip-md > ion-icon {
  color: #fff;
  background-color: #0c031d;
}

.chip-md-primary,
.chip-md .icon-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.chip-md-secondary,
.chip-md .icon-md-secondary {
  color: #fff;
  background-color: #969696;
}

.chip-md-danger,
.chip-md .icon-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.chip-md-light,
.chip-md .icon-md-light {
  color: #000;
  background-color: #f4f4f4;
}

.chip-md-dark,
.chip-md .icon-md-dark {
  color: #fff;
  background-color: #000000;
}

.chip-md-menuinicial,
.chip-md .icon-md-menuinicial {
  color: #000;
  background-color: white;
}

.chip-wp {
  border-radius: 16px;
  height: 32px;
  font-size: 13px;
  line-height: 32px;
  color: rgba(0, 0, 0, 0.87);
  background: rgba(0, 0, 0, 0.12);
  margin: 2px 0;
}

.chip-wp > ion-label {
  margin: 0 10px;
}

.chip-wp > ion-icon {
  color: #fff;
  background-color: #0c031d;
}

.chip-wp .button {
  border: 0;
}

.chip-wp-primary,
.chip-wp .icon-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.chip-wp-secondary,
.chip-wp .icon-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.chip-wp-danger,
.chip-wp .icon-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.chip-wp-light,
.chip-wp .icon-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.chip-wp-dark,
.chip-wp .icon-wp-dark {
  color: #fff;
  background-color: #000000;
}

.chip-wp-menuinicial,
.chip-wp .icon-wp-menuinicial {
  color: #000;
  background-color: white;
}

ion-content {
  left: 0;
  top: 0;
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  contain: layout size style;
}

.ion-page > ion-content {
  position: absolute;
}

a {
  color: #0c031d;
}

.scroll-content {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
  display: block;
  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  will-change: scroll-position;
  contain: size style layout;
}

ion-content.js-scroll > .scroll-content {
  position: relative;
  min-height: 100%;
  overflow-x: initial;
  overflow-y: initial;
  -webkit-overflow-scrolling: auto;
  will-change: initial;
}

.disable-scroll .ion-page {
  pointer-events: none;
  -ms-touch-action: none;
  touch-action: none;
}

ion-content.has-refresher > .scroll-content {
  background-color: inherit;
}

.fixed-content {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  display: block;
}

[ion-fixed] {
  position: absolute;
  z-index: 999;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

ion-app [no-padding],
ion-app [no-padding] .scroll-content {
  padding: 0;
}

ion-app [no-margin],
ion-app [no-margin] .scroll-content {
  margin: 0;
}

.content-ios {
  color: #000;
  background-color: #fff;
}

.content-ios.outer-content {
  background: #efeff4;
}

.content-ios hr {
  height: 0.55px;
  background-color: rgba(0, 0, 0, 0.12);
}

.ios .ion-page.show-page ~ .nav-decor {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: #000;
  pointer-events: none;
}

ion-app.ios [padding] {
  padding: 16px;
}

ion-app.ios [padding-top] {
  padding-top: 16px;
}

ion-app.ios [padding-left] {
  padding-left: 16px;
}

ion-app.ios [padding-right] {
  padding-right: 16px;
}

ion-app.ios [padding-bottom] {
  padding-bottom: 16px;
}

ion-app.ios [padding-vertical] {
  padding-top: 16px;
  padding-bottom: 16px;
}

ion-app.ios [padding-horizontal] {
  padding-left: 16px;
  padding-right: 16px;
}

ion-app.ios [padding] .scroll-content {
  padding: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.ios [padding] .scroll-content {
    padding: 16px 16px 16px calc(constant(safe-area-inset-left) + 16px);
  }
}

@media screen and (orientation: landscape) {
  ion-app.ios .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
  }
}

ion-app.ios [padding-top] .scroll-content {
  padding-top: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.ios [padding-top] .scroll-content {
    padding-top: 16px;
  }
}

ion-app.ios [padding-left] .scroll-content {
  padding-left: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.ios [padding-left] .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
  }
}

ion-app.ios [padding-right] .scroll-content {
  padding-right: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.ios [padding-right] .scroll-content {
    padding-right: calc(constant(safe-area-inset-right) + 16px);
  }
}

ion-app.ios [padding-bottom] .scroll-content {
  padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.ios [padding-bottom] .scroll-content {
    padding-bottom: 16px;
  }
}

ion-app.ios [padding-vertical] .scroll-content {
  padding-top: 16px;
  padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.ios [padding-vertical] .scroll-content {
    padding-top: 16px;
    padding-bottom: 16px;
  }
}

ion-app.ios [padding-horizontal] .scroll-content {
  padding-left: 16px;
  padding-right: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.ios [padding-horizontal] .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
    padding-right: calc(constant(safe-area-inset-right) + 16px);
  }
}

ion-app.ios [margin],
ion-app.ios [margin] .scroll-content {
  margin: 16px;
}

ion-app.ios [margin-top],
ion-app.ios [margin-top] .scroll-content {
  margin-top: 16px;
}

ion-app.ios [margin-left],
ion-app.ios [margin-left] .scroll-content {
  margin-left: 16px;
}

ion-app.ios [margin-start],
ion-app.ios [margin-start] .scroll-content {
  margin-left: 16px;
}

ion-app.ios [margin-right],
ion-app.ios [margin-right] .scroll-content {
  margin-right: 16px;
}

ion-app.ios [margin-end],
ion-app.ios [margin-end] .scroll-content {
  margin-right: 16px;
}

ion-app.ios [margin-bottom],
ion-app.ios [margin-bottom] .scroll-content {
  margin-bottom: 16px;
}

ion-app.ios [margin-vertical],
ion-app.ios [margin-vertical] .scroll-content {
  margin-top: 16px;
  margin-bottom: 16px;
}

ion-app.ios [margin-horizontal],
ion-app.ios [margin-horizontal] .scroll-content {
  margin-left: 16px;
  margin-right: 16px;
}

.content-ios:not([no-bounce]) > .scroll-content::before,
.content-ios:not([no-bounce]) > .scroll-content::after {
  position: absolute;
  width: 1px;
  height: 1px;
  content: "";
}

.content-ios:not([no-bounce]) > .scroll-content::before {
  bottom: -1px;
}

.content-ios:not([no-bounce]) > .scroll-content::after {
  top: -1px;
}

.platform-core .content-ios .scroll-content::after,
.platform-core .content-ios .scroll-content::before {
  position: initial;
  top: initial;
  bottom: initial;
  width: initial;
  height: initial;
}

.content-md {
  color: #000;
  background-color: #fff;
}

.content-md hr {
  background-color: rgba(0, 0, 0, 0.08);
}

ion-app.md [padding] {
  padding: 16px;
}

ion-app.md [padding-top] {
  padding-top: 16px;
}

ion-app.md [padding-left] {
  padding-left: 16px;
}

ion-app.md [padding-right] {
  padding-right: 16px;
}

ion-app.md [padding-bottom] {
  padding-bottom: 16px;
}

ion-app.md [padding-vertical] {
  padding-top: 16px;
  padding-bottom: 16px;
}

ion-app.md [padding-horizontal] {
  padding-left: 16px;
  padding-right: 16px;
}

ion-app.md [padding] .scroll-content {
  padding: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.md [padding] .scroll-content {
    padding: 16px 16px 16px calc(constant(safe-area-inset-left) + 16px);
  }
}

@media screen and (orientation: landscape) {
  ion-app.md .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
  }
}

ion-app.md [padding-top] .scroll-content {
  padding-top: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.md [padding-top] .scroll-content {
    padding-top: 16px;
  }
}

ion-app.md [padding-left] .scroll-content {
  padding-left: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.md [padding-left] .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
  }
}

ion-app.md [padding-right] .scroll-content {
  padding-right: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.md [padding-right] .scroll-content {
    padding-right: calc(constant(safe-area-inset-right) + 16px);
  }
}

ion-app.md [padding-bottom] .scroll-content {
  padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.md [padding-bottom] .scroll-content {
    padding-bottom: 16px;
  }
}

ion-app.md [padding-vertical] .scroll-content {
  padding-top: 16px;
  padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.md [padding-vertical] .scroll-content {
    padding-top: 16px;
    padding-bottom: 16px;
  }
}

ion-app.md [padding-horizontal] .scroll-content {
  padding-left: 16px;
  padding-right: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.md [padding-horizontal] .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
    padding-right: calc(constant(safe-area-inset-right) + 16px);
  }
}

ion-app.md [margin],
ion-app.md [margin] .scroll-content {
  margin: 16px;
}

ion-app.md [margin-top],
ion-app.md [margin-top] .scroll-content {
  margin-top: 16px;
}

ion-app.md [margin-left],
ion-app.md [margin-left] .scroll-content {
  margin-left: 16px;
}

ion-app.md [margin-start],
ion-app.md [margin-start] .scroll-content {
  margin-left: 16px;
}

ion-app.md [margin-right],
ion-app.md [margin-right] .scroll-content {
  margin-right: 16px;
}

ion-app.md [margin-end],
ion-app.md [margin-end] .scroll-content {
  margin-right: 16px;
}

ion-app.md [margin-bottom],
ion-app.md [margin-bottom] .scroll-content {
  margin-bottom: 16px;
}

ion-app.md [margin-vertical],
ion-app.md [margin-vertical] .scroll-content {
  margin-top: 16px;
  margin-bottom: 16px;
}

ion-app.md [margin-horizontal],
ion-app.md [margin-horizontal] .scroll-content {
  margin-left: 16px;
  margin-right: 16px;
}

.content-wp {
  color: #000;
  background-color: #fff;
}

.content-wp hr {
  background-color: rgba(0, 0, 0, 0.08);
}

ion-app.wp [padding] {
  padding: 16px;
}

ion-app.wp [padding-top] {
  padding-top: 16px;
}

ion-app.wp [padding-left] {
  padding-left: 16px;
}

ion-app.wp [padding-right] {
  padding-right: 16px;
}

ion-app.wp [padding-bottom] {
  padding-bottom: 16px;
}

ion-app.wp [padding-vertical] {
  padding-top: 16px;
  padding-bottom: 16px;
}

ion-app.wp [padding-horizontal] {
  padding-left: 16px;
  padding-right: 16px;
}

ion-app.wp [padding] .scroll-content {
  padding: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.wp [padding] .scroll-content {
    padding: 16px 16px 16px calc(constant(safe-area-inset-left) + 16px);
  }
}

@media screen and (orientation: landscape) {
  ion-app.wp .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
  }
}

ion-app.wp [padding-top] .scroll-content {
  padding-top: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.wp [padding-top] .scroll-content {
    padding-top: 16px;
  }
}

ion-app.wp [padding-left] .scroll-content {
  padding-left: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.wp [padding-left] .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
  }
}

ion-app.wp [padding-right] .scroll-content {
  padding-right: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.wp [padding-right] .scroll-content {
    padding-right: calc(constant(safe-area-inset-right) + 16px);
  }
}

ion-app.wp [padding-bottom] .scroll-content {
  padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.wp [padding-bottom] .scroll-content {
    padding-bottom: 16px;
  }
}

ion-app.wp [padding-vertical] .scroll-content {
  padding-top: 16px;
  padding-bottom: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.wp [padding-vertical] .scroll-content {
    padding-top: 16px;
    padding-bottom: 16px;
  }
}

ion-app.wp [padding-horizontal] .scroll-content {
  padding-left: 16px;
  padding-right: 16px;
}

@media screen and (orientation: landscape) {
  ion-app.wp [padding-horizontal] .scroll-content {
    padding-left: calc(constant(safe-area-inset-left) + 16px);
    padding-right: calc(constant(safe-area-inset-right) + 16px);
  }
}

ion-app.wp [margin],
ion-app.wp [margin] .scroll-content {
  margin: 16px;
}

ion-app.wp [margin-top],
ion-app.wp [margin-top] .scroll-content {
  margin-top: 16px;
}

ion-app.wp [margin-left],
ion-app.wp [margin-left] .scroll-content {
  margin-left: 16px;
}

ion-app.wp [margin-start],
ion-app.wp [margin-start] .scroll-content {
  margin-left: 16px;
}

ion-app.wp [margin-right],
ion-app.wp [margin-right] .scroll-content {
  margin-right: 16px;
}

ion-app.wp [margin-end],
ion-app.wp [margin-end] .scroll-content {
  margin-right: 16px;
}

ion-app.wp [margin-bottom],
ion-app.wp [margin-bottom] .scroll-content {
  margin-bottom: 16px;
}

ion-app.wp [margin-vertical],
ion-app.wp [margin-vertical] .scroll-content {
  margin-top: 16px;
  margin-bottom: 16px;
}

ion-app.wp [margin-horizontal],
ion-app.wp [margin-horizontal] .scroll-content {
  margin-left: 16px;
  margin-right: 16px;
}

ion-datetime {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

.datetime-text {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 16px;
  min-height: 1.2em;
  font-size: inherit;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.datetime-disabled,
.item-datetime-disabled ion-label {
  opacity: .4;
  pointer-events: none;
}

.item-label-stacked ion-datetime,
.item-label-floating ion-datetime {
  padding-left: 0;
  width: 100%;
}

.datetime-ios {
  padding: 11px 8px 11px 16px;
}

.datetime-ios .datetime-placeholder {
  color: #999;
}

.datetime-md {
  padding: 13px 8px 13px 16px;
}

.datetime-md .datetime-placeholder {
  color: #999;
}

.datetime-wp {
  padding: 13px 8px 13px 16px;
  min-width: 45%;
}

.datetime-wp .datetime-text {
  padding: 0 8px;
  min-height: 3.4rem;
  border: 2px solid rgba(0, 0, 0, 0.5);
  line-height: 3rem;
}

.item-datetime .datetime-wp ion-label[floating] {
  -webkit-transform: translate3d(8px,  41px,  0);
  transform: translate3d(8px,  41px,  0);
}

.datetime-wp .datetime-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.fab {
  text-align: center;
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 50%;
  position: relative;
  z-index: 0;
  display: block;
  overflow: hidden;
  width: 56px;
  height: 56px;
  font-size: 14px;
  line-height: 56px;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  -webkit-transition: background-color, opacity 100ms linear;
  transition: background-color, opacity 100ms linear;
  background-clip: padding-box;
  -webkit-font-kerning: none;
  font-kerning: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  contain: strict;
}

.fab ion-icon {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-size: 2.4rem;
}

.fab[mini] {
  margin: 8px;
  width: 40px;
  height: 40px;
  line-height: 40px;
}

.fab[mini] .fab-close-icon {
  line-height: 40px;
}

ion-fab {
  position: absolute;
  z-index: 999;
}

ion-fab[center] {
  left: 50%;
  margin-left: -28px;
}

ion-fab[middle] {
  margin-top: -28px;
  top: 50%;
}

ion-fab[top] {
  top: 10px;
}

ion-fab[right] {
  right: 10px;
}

ion-fab[end] {
  right: 10px;
}

ion-fab[bottom] {
  bottom: 10px;
}

ion-fab[left] {
  left: 10px;
}

ion-fab[start] {
  left: 10px;
}

ion-fab[top][edge] {
  top: -28px;
}

ion-fab[bottom][edge] {
  bottom: -28px;
}

ion-fab-list {
  margin: 66px 0;
  position: absolute;
  top: 0;
  display: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 56px;
  min-height: 56px;
}

.fab-in-list {
  margin: 8px 0;
  width: 40px;
  height: 40px;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: scale(0);
  transform: scale(0);
}

.fab-in-list.show {
  opacity: 1;
  visibility: visible;
  -webkit-transform: scale(1);
  transform: scale(1);
}

ion-fab-list[side=left] .fab-in-list,
ion-fab-list[side=right] .fab-in-list {
  margin: 0 8px;
}

ion-fab-list[side=top] {
  top: auto;
  bottom: 0;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
}

ion-fab-list[side=left] {
  margin: 0 66px;
  right: 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

ion-fab-list[side=right] {
  margin: 0 66px;
  left: 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

.fab-list-active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.fab-close-icon {
  left: 0;
  right: 0;
  top: 0;
  position: absolute;
  line-height: 56px;
  opacity: 0;
  -webkit-transform: scale(0.4) rotateZ(-45deg);
  transform: scale(0.4) rotateZ(-45deg);
  -webkit-transition: all ease-in-out 300ms;
  transition: all ease-in-out 300ms;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: transform, opacity;
  transition-property: transform, opacity, -webkit-transform;
}

.fab .button-inner {
  -webkit-transition: all ease-in-out 300ms;
  transition: all ease-in-out 300ms;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: transform, opacity;
  transition-property: transform, opacity, -webkit-transform;
}

.fab-close-active .fab-close-icon {
  opacity: 1;
  -webkit-transform: scale(1) rotateZ(0deg);
  transform: scale(1) rotateZ(0deg);
}

.fab-close-active .button-inner {
  opacity: 0;
  -webkit-transform: scale(0.4) rotateZ(45deg);
  transform: scale(0.4) rotateZ(45deg);
}

.fab-ios {
  color: #fff;
  background-color: #0c031d;
}

.fab-ios.activated {
  background-color: #1f172f;
}

.fab-ios-in-list {
  color: #000;
  background-color: #f4f4f4;
  -webkit-transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
  transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
  transition: transform 200ms ease 10ms, opacity 200ms ease 10ms;
  transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
}

.fab-ios-in-list.activated {
  background-color: #e0e0e0;
}

.fab-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.fab-ios-primary.activated {
  background-color: #1f172f;
}

.fab-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.fab-ios-secondary.activated {
  background-color: #8a8a8a;
}

.fab-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.fab-ios-danger.activated {
  background-color: #882424;
}

.fab-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.fab-ios-light.activated {
  background-color: #e0e0e0;
}

.fab-ios-dark {
  color: #fff;
  background-color: #000000;
}

.fab-ios-dark.activated {
  background-color: #141414;
}

.fab-ios-menuinicial {
  color: #000;
  background-color: white;
}

.fab-ios-menuinicial.activated {
  background-color: #ebebeb;
}

.fab-md {
  color: #fff;
  background-color: #0c031d;
  -webkit-box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.14), 0 4px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.14), 0 4px 5px rgba(0, 0, 0, 0.1);
  -webkit-transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.fab-md.activated {
  background-color: #1f172f;
  -webkit-box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.4), 0 4px 7px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.4), 0 4px 7px 0 rgba(0, 0, 0, 0.1);
}

.fab-md-in-list {
  color: #000;
  background-color: #f4f4f4;
  -webkit-transition: opacity 200ms ease 10ms, background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms ease 10ms, -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: opacity 200ms ease 10ms, background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms ease 10ms, -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms ease 10ms, -webkit-box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.fab-md-in-list.activated {
  background-color: #e0e0e0;
}

.fab-md .button-effect {
  background-color: #fff;
}

.fab-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.fab-md-primary.activated {
  background-color: #1f172f;
}

.fab-md-primary .button-effect {
  background-color: #fff;
}

.fab-md-secondary {
  color: #fff;
  background-color: #969696;
}

.fab-md-secondary.activated {
  background-color: #8a8a8a;
}

.fab-md-secondary .button-effect {
  background-color: #fff;
}

.fab-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.fab-md-danger.activated {
  background-color: #882424;
}

.fab-md-danger .button-effect {
  background-color: #fff;
}

.fab-md-light {
  color: #000;
  background-color: #f4f4f4;
}

.fab-md-light.activated {
  background-color: #e0e0e0;
}

.fab-md-light .button-effect {
  background-color: #000;
}

.fab-md-dark {
  color: #fff;
  background-color: #000000;
}

.fab-md-dark.activated {
  background-color: #141414;
}

.fab-md-dark .button-effect {
  background-color: #fff;
}

.fab-md-menuinicial {
  color: #000;
  background-color: white;
}

.fab-md-menuinicial.activated {
  background-color: #ebebeb;
}

.fab-md-menuinicial .button-effect {
  background-color: #000;
}

.fab-wp {
  color: #fff;
  background-color: #0c031d;
}

.fab-wp.activated {
  background-color: #1f172f;
}

.fab-wp-in-list {
  color: #000;
  background-color: #f4f4f4;
  -webkit-transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
  transition: opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
  transition: transform 200ms ease 10ms, opacity 200ms ease 10ms;
  transition: transform 200ms ease 10ms, opacity 200ms ease 10ms, -webkit-transform 200ms ease 10ms;
}

.fab-wp-in-list.activated {
  background-color: #e0e0e0;
}

.fab-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.fab-wp-primary.activated {
  background-color: #1f172f;
}

.fab-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.fab-wp-secondary.activated {
  background-color: #8a8a8a;
}

.fab-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.fab-wp-danger.activated {
  background-color: #882424;
}

.fab-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.fab-wp-light.activated {
  background-color: #e0e0e0;
}

.fab-wp-dark {
  color: #fff;
  background-color: #000000;
}

.fab-wp-dark.activated {
  background-color: #141414;
}

.fab-wp-menuinicial {
  color: #000;
  background-color: white;
}

.fab-wp-menuinicial.activated {
  background-color: #ebebeb;
}

.grid {
  padding: 5px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.grid[no-padding] {
  padding: 0;
}

.grid[no-padding] > .row > .col {
  padding: 0;
}

@media (min-width: 576px) {
  .grid[fixed] {
    width: 540px;
    max-width: 100%;
  }
}

@media (min-width: 768px) {
  .grid[fixed] {
    width: 720px;
    max-width: 100%;
  }
}

@media (min-width: 992px) {
  .grid[fixed] {
    width: 960px;
    max-width: 100%;
  }
}

@media (min-width: 1200px) {
  .grid[fixed] {
    width: 1140px;
    max-width: 100%;
  }
}

.row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.row[nowrap] {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.row[wrap-reverse] {
  -webkit-flex-wrap: wrap-reverse;
  -ms-flex-wrap: wrap-reverse;
  flex-wrap: wrap-reverse;
}

.row[align-items-start] {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.row[align-items-center] {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.row[align-items-end] {
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.row[align-items-stretch] {
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.row[align-items-baseline] {
  -webkit-box-align: baseline;
  -webkit-align-items: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
}

.row[justify-content-start] {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.row[justify-content-center] {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.row[justify-content-end] {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.row[justify-content-around] {
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.row[justify-content-between] {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.col {
  padding: 5px;
  position: relative;
  width: 100%;
  margin: 0;
  min-height: 1px;
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
}

.col[align-self-start] {
  -webkit-align-self: flex-start;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.col[align-self-end] {
  -webkit-align-self: flex-end;
  -ms-flex-item-align: end;
  align-self: flex-end;
}

.col[align-self-center] {
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.col[align-self-stretch] {
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
}

.col[align-self-baseline] {
  -webkit-align-self: baseline;
  -ms-flex-item-align: baseline;
  align-self: baseline;
}

[col-1] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-1] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-1] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-1] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-1] {
    padding: 5px;
  }
}

[col-2] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-2] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-2] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-2] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-2] {
    padding: 5px;
  }
}

[col-3] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-3] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-3] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-3] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-3] {
    padding: 5px;
  }
}

[col-4] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-4] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-4] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-4] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-4] {
    padding: 5px;
  }
}

[col-5] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-5] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-5] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-5] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-5] {
    padding: 5px;
  }
}

[col-6] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-6] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-6] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-6] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-6] {
    padding: 5px;
  }
}

[col-7] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-7] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-7] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-7] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-7] {
    padding: 5px;
  }
}

[col-8] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-8] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-8] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-8] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-8] {
    padding: 5px;
  }
}

[col-9] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-9] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-9] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-9] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-9] {
    padding: 5px;
  }
}

[col-10] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-10] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-10] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-10] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-10] {
    padding: 5px;
  }
}

[col-11] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-11] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-11] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-11] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-11] {
    padding: 5px;
  }
}

[col-12] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-12] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-12] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-12] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-12] {
    padding: 5px;
  }
}

[col] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col] {
    padding: 5px;
  }
}

[col] {
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
}

[col-auto] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
}

[col-1] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 8.33333%;
  -ms-flex: 0 0 8.33333%;
  flex: 0 0 8.33333%;
  width: 8.33333%;
  max-width: 8.33333%;
}

[col-2] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 16.66667%;
  -ms-flex: 0 0 16.66667%;
  flex: 0 0 16.66667%;
  width: 16.66667%;
  max-width: 16.66667%;
}

[col-3] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 25%;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  width: 25%;
  max-width: 25%;
}

[col-4] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 33.33333%;
  -ms-flex: 0 0 33.33333%;
  flex: 0 0 33.33333%;
  width: 33.33333%;
  max-width: 33.33333%;
}

[col-5] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 41.66667%;
  -ms-flex: 0 0 41.66667%;
  flex: 0 0 41.66667%;
  width: 41.66667%;
  max-width: 41.66667%;
}

[col-6] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 50%;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  width: 50%;
  max-width: 50%;
}

[col-7] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 58.33333%;
  -ms-flex: 0 0 58.33333%;
  flex: 0 0 58.33333%;
  width: 58.33333%;
  max-width: 58.33333%;
}

[col-8] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 66.66667%;
  -ms-flex: 0 0 66.66667%;
  flex: 0 0 66.66667%;
  width: 66.66667%;
  max-width: 66.66667%;
}

[col-9] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 75%;
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  width: 75%;
  max-width: 75%;
}

[col-10] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 83.33333%;
  -ms-flex: 0 0 83.33333%;
  flex: 0 0 83.33333%;
  width: 83.33333%;
  max-width: 83.33333%;
}

[col-11] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 91.66667%;
  -ms-flex: 0 0 91.66667%;
  flex: 0 0 91.66667%;
  width: 91.66667%;
  max-width: 91.66667%;
}

[col-12] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
}

[pull-0] {
  right: auto;
}

[pull-1] {
  right: 8.33333%;
}

[pull-2] {
  right: 16.66667%;
}

[pull-3] {
  right: 25%;
}

[pull-4] {
  right: 33.33333%;
}

[pull-5] {
  right: 41.66667%;
}

[pull-6] {
  right: 50%;
}

[pull-7] {
  right: 58.33333%;
}

[pull-8] {
  right: 66.66667%;
}

[pull-9] {
  right: 75%;
}

[pull-10] {
  right: 83.33333%;
}

[pull-11] {
  right: 91.66667%;
}

[pull-12] {
  right: 100%;
}

[push-0] {
  left: auto;
}

[push-1] {
  left: 8.33333%;
}

[push-2] {
  left: 16.66667%;
}

[push-3] {
  left: 25%;
}

[push-4] {
  left: 33.33333%;
}

[push-5] {
  left: 41.66667%;
}

[push-6] {
  left: 50%;
}

[push-7] {
  left: 58.33333%;
}

[push-8] {
  left: 66.66667%;
}

[push-9] {
  left: 75%;
}

[push-10] {
  left: 83.33333%;
}

[push-11] {
  left: 91.66667%;
}

[push-12] {
  left: 100%;
}

[offset-1] {
  margin-left: 8.33333%;
}

[offset-2] {
  margin-left: 16.66667%;
}

[offset-3] {
  margin-left: 25%;
}

[offset-4] {
  margin-left: 33.33333%;
}

[offset-5] {
  margin-left: 41.66667%;
}

[offset-6] {
  margin-left: 50%;
}

[offset-7] {
  margin-left: 58.33333%;
}

[offset-8] {
  margin-left: 66.66667%;
}

[offset-9] {
  margin-left: 75%;
}

[offset-10] {
  margin-left: 83.33333%;
}

[offset-11] {
  margin-left: 91.66667%;
}

[col-sm-1] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-1] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-1] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-1] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-1] {
    padding: 5px;
  }
}

[col-sm-2] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-2] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-2] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-2] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-2] {
    padding: 5px;
  }
}

[col-sm-3] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-3] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-3] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-3] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-3] {
    padding: 5px;
  }
}

[col-sm-4] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-4] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-4] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-4] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-4] {
    padding: 5px;
  }
}

[col-sm-5] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-5] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-5] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-5] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-5] {
    padding: 5px;
  }
}

[col-sm-6] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-6] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-6] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-6] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-6] {
    padding: 5px;
  }
}

[col-sm-7] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-7] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-7] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-7] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-7] {
    padding: 5px;
  }
}

[col-sm-8] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-8] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-8] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-8] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-8] {
    padding: 5px;
  }
}

[col-sm-9] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-9] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-9] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-9] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-9] {
    padding: 5px;
  }
}

[col-sm-10] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-10] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-10] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-10] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-10] {
    padding: 5px;
  }
}

[col-sm-11] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-11] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-11] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-11] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-11] {
    padding: 5px;
  }
}

[col-sm-12] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm-12] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm-12] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm-12] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm-12] {
    padding: 5px;
  }
}

[col-sm] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-sm] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-sm] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-sm] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-sm] {
    padding: 5px;
  }
}

@media (min-width: 576px) {
  [col-sm] {
    -webkit-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  [col-sm-auto] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
  }
  [col-sm-1] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    width: 8.33333%;
    max-width: 8.33333%;
  }
  [col-sm-2] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    width: 16.66667%;
    max-width: 16.66667%;
  }
  [col-sm-3] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    width: 25%;
    max-width: 25%;
  }
  [col-sm-4] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    width: 33.33333%;
    max-width: 33.33333%;
  }
  [col-sm-5] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    width: 41.66667%;
    max-width: 41.66667%;
  }
  [col-sm-6] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    width: 50%;
    max-width: 50%;
  }
  [col-sm-7] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    width: 58.33333%;
    max-width: 58.33333%;
  }
  [col-sm-8] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    width: 66.66667%;
    max-width: 66.66667%;
  }
  [col-sm-9] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    width: 75%;
    max-width: 75%;
  }
  [col-sm-10] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    width: 83.33333%;
    max-width: 83.33333%;
  }
  [col-sm-11] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    width: 91.66667%;
    max-width: 91.66667%;
  }
  [col-sm-12] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
  }
  [pull-sm-0] {
    right: auto;
  }
  [pull-sm-1] {
    right: 8.33333%;
  }
  [pull-sm-2] {
    right: 16.66667%;
  }
  [pull-sm-3] {
    right: 25%;
  }
  [pull-sm-4] {
    right: 33.33333%;
  }
  [pull-sm-5] {
    right: 41.66667%;
  }
  [pull-sm-6] {
    right: 50%;
  }
  [pull-sm-7] {
    right: 58.33333%;
  }
  [pull-sm-8] {
    right: 66.66667%;
  }
  [pull-sm-9] {
    right: 75%;
  }
  [pull-sm-10] {
    right: 83.33333%;
  }
  [pull-sm-11] {
    right: 91.66667%;
  }
  [pull-sm-12] {
    right: 100%;
  }
  [push-sm-0] {
    left: auto;
  }
  [push-sm-1] {
    left: 8.33333%;
  }
  [push-sm-2] {
    left: 16.66667%;
  }
  [push-sm-3] {
    left: 25%;
  }
  [push-sm-4] {
    left: 33.33333%;
  }
  [push-sm-5] {
    left: 41.66667%;
  }
  [push-sm-6] {
    left: 50%;
  }
  [push-sm-7] {
    left: 58.33333%;
  }
  [push-sm-8] {
    left: 66.66667%;
  }
  [push-sm-9] {
    left: 75%;
  }
  [push-sm-10] {
    left: 83.33333%;
  }
  [push-sm-11] {
    left: 91.66667%;
  }
  [push-sm-12] {
    left: 100%;
  }
  [offset-sm-0] {
    margin-left: 0%;
  }
  [offset-sm-1] {
    margin-left: 8.33333%;
  }
  [offset-sm-2] {
    margin-left: 16.66667%;
  }
  [offset-sm-3] {
    margin-left: 25%;
  }
  [offset-sm-4] {
    margin-left: 33.33333%;
  }
  [offset-sm-5] {
    margin-left: 41.66667%;
  }
  [offset-sm-6] {
    margin-left: 50%;
  }
  [offset-sm-7] {
    margin-left: 58.33333%;
  }
  [offset-sm-8] {
    margin-left: 66.66667%;
  }
  [offset-sm-9] {
    margin-left: 75%;
  }
  [offset-sm-10] {
    margin-left: 83.33333%;
  }
  [offset-sm-11] {
    margin-left: 91.66667%;
  }
}

[col-md-1] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-1] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-1] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-1] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-1] {
    padding: 5px;
  }
}

[col-md-2] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-2] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-2] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-2] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-2] {
    padding: 5px;
  }
}

[col-md-3] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-3] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-3] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-3] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-3] {
    padding: 5px;
  }
}

[col-md-4] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-4] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-4] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-4] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-4] {
    padding: 5px;
  }
}

[col-md-5] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-5] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-5] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-5] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-5] {
    padding: 5px;
  }
}

[col-md-6] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-6] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-6] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-6] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-6] {
    padding: 5px;
  }
}

[col-md-7] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-7] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-7] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-7] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-7] {
    padding: 5px;
  }
}

[col-md-8] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-8] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-8] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-8] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-8] {
    padding: 5px;
  }
}

[col-md-9] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-9] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-9] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-9] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-9] {
    padding: 5px;
  }
}

[col-md-10] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-10] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-10] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-10] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-10] {
    padding: 5px;
  }
}

[col-md-11] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-11] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-11] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-11] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-11] {
    padding: 5px;
  }
}

[col-md-12] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md-12] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md-12] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md-12] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md-12] {
    padding: 5px;
  }
}

[col-md] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-md] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-md] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-md] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-md] {
    -webkit-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  [col-md-auto] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
  }
  [col-md-1] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    width: 8.33333%;
    max-width: 8.33333%;
  }
  [col-md-2] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    width: 16.66667%;
    max-width: 16.66667%;
  }
  [col-md-3] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    width: 25%;
    max-width: 25%;
  }
  [col-md-4] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    width: 33.33333%;
    max-width: 33.33333%;
  }
  [col-md-5] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    width: 41.66667%;
    max-width: 41.66667%;
  }
  [col-md-6] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    width: 50%;
    max-width: 50%;
  }
  [col-md-7] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    width: 58.33333%;
    max-width: 58.33333%;
  }
  [col-md-8] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    width: 66.66667%;
    max-width: 66.66667%;
  }
  [col-md-9] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    width: 75%;
    max-width: 75%;
  }
  [col-md-10] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    width: 83.33333%;
    max-width: 83.33333%;
  }
  [col-md-11] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    width: 91.66667%;
    max-width: 91.66667%;
  }
  [col-md-12] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
  }
  [pull-md-0] {
    right: auto;
  }
  [pull-md-1] {
    right: 8.33333%;
  }
  [pull-md-2] {
    right: 16.66667%;
  }
  [pull-md-3] {
    right: 25%;
  }
  [pull-md-4] {
    right: 33.33333%;
  }
  [pull-md-5] {
    right: 41.66667%;
  }
  [pull-md-6] {
    right: 50%;
  }
  [pull-md-7] {
    right: 58.33333%;
  }
  [pull-md-8] {
    right: 66.66667%;
  }
  [pull-md-9] {
    right: 75%;
  }
  [pull-md-10] {
    right: 83.33333%;
  }
  [pull-md-11] {
    right: 91.66667%;
  }
  [pull-md-12] {
    right: 100%;
  }
  [push-md-0] {
    left: auto;
  }
  [push-md-1] {
    left: 8.33333%;
  }
  [push-md-2] {
    left: 16.66667%;
  }
  [push-md-3] {
    left: 25%;
  }
  [push-md-4] {
    left: 33.33333%;
  }
  [push-md-5] {
    left: 41.66667%;
  }
  [push-md-6] {
    left: 50%;
  }
  [push-md-7] {
    left: 58.33333%;
  }
  [push-md-8] {
    left: 66.66667%;
  }
  [push-md-9] {
    left: 75%;
  }
  [push-md-10] {
    left: 83.33333%;
  }
  [push-md-11] {
    left: 91.66667%;
  }
  [push-md-12] {
    left: 100%;
  }
  [offset-md-0] {
    margin-left: 0%;
  }
  [offset-md-1] {
    margin-left: 8.33333%;
  }
  [offset-md-2] {
    margin-left: 16.66667%;
  }
  [offset-md-3] {
    margin-left: 25%;
  }
  [offset-md-4] {
    margin-left: 33.33333%;
  }
  [offset-md-5] {
    margin-left: 41.66667%;
  }
  [offset-md-6] {
    margin-left: 50%;
  }
  [offset-md-7] {
    margin-left: 58.33333%;
  }
  [offset-md-8] {
    margin-left: 66.66667%;
  }
  [offset-md-9] {
    margin-left: 75%;
  }
  [offset-md-10] {
    margin-left: 83.33333%;
  }
  [offset-md-11] {
    margin-left: 91.66667%;
  }
}

[col-lg-1] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-1] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-1] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-1] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-1] {
    padding: 5px;
  }
}

[col-lg-2] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-2] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-2] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-2] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-2] {
    padding: 5px;
  }
}

[col-lg-3] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-3] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-3] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-3] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-3] {
    padding: 5px;
  }
}

[col-lg-4] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-4] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-4] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-4] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-4] {
    padding: 5px;
  }
}

[col-lg-5] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-5] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-5] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-5] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-5] {
    padding: 5px;
  }
}

[col-lg-6] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-6] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-6] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-6] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-6] {
    padding: 5px;
  }
}

[col-lg-7] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-7] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-7] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-7] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-7] {
    padding: 5px;
  }
}

[col-lg-8] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-8] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-8] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-8] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-8] {
    padding: 5px;
  }
}

[col-lg-9] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-9] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-9] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-9] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-9] {
    padding: 5px;
  }
}

[col-lg-10] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-10] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-10] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-10] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-10] {
    padding: 5px;
  }
}

[col-lg-11] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-11] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-11] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-11] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-11] {
    padding: 5px;
  }
}

[col-lg-12] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg-12] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg-12] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg-12] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg-12] {
    padding: 5px;
  }
}

[col-lg] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-lg] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-lg] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-lg] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-lg] {
    -webkit-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  [col-lg-auto] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
  }
  [col-lg-1] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    width: 8.33333%;
    max-width: 8.33333%;
  }
  [col-lg-2] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    width: 16.66667%;
    max-width: 16.66667%;
  }
  [col-lg-3] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    width: 25%;
    max-width: 25%;
  }
  [col-lg-4] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    width: 33.33333%;
    max-width: 33.33333%;
  }
  [col-lg-5] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    width: 41.66667%;
    max-width: 41.66667%;
  }
  [col-lg-6] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    width: 50%;
    max-width: 50%;
  }
  [col-lg-7] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    width: 58.33333%;
    max-width: 58.33333%;
  }
  [col-lg-8] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    width: 66.66667%;
    max-width: 66.66667%;
  }
  [col-lg-9] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    width: 75%;
    max-width: 75%;
  }
  [col-lg-10] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    width: 83.33333%;
    max-width: 83.33333%;
  }
  [col-lg-11] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    width: 91.66667%;
    max-width: 91.66667%;
  }
  [col-lg-12] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
  }
  [pull-lg-0] {
    right: auto;
  }
  [pull-lg-1] {
    right: 8.33333%;
  }
  [pull-lg-2] {
    right: 16.66667%;
  }
  [pull-lg-3] {
    right: 25%;
  }
  [pull-lg-4] {
    right: 33.33333%;
  }
  [pull-lg-5] {
    right: 41.66667%;
  }
  [pull-lg-6] {
    right: 50%;
  }
  [pull-lg-7] {
    right: 58.33333%;
  }
  [pull-lg-8] {
    right: 66.66667%;
  }
  [pull-lg-9] {
    right: 75%;
  }
  [pull-lg-10] {
    right: 83.33333%;
  }
  [pull-lg-11] {
    right: 91.66667%;
  }
  [pull-lg-12] {
    right: 100%;
  }
  [push-lg-0] {
    left: auto;
  }
  [push-lg-1] {
    left: 8.33333%;
  }
  [push-lg-2] {
    left: 16.66667%;
  }
  [push-lg-3] {
    left: 25%;
  }
  [push-lg-4] {
    left: 33.33333%;
  }
  [push-lg-5] {
    left: 41.66667%;
  }
  [push-lg-6] {
    left: 50%;
  }
  [push-lg-7] {
    left: 58.33333%;
  }
  [push-lg-8] {
    left: 66.66667%;
  }
  [push-lg-9] {
    left: 75%;
  }
  [push-lg-10] {
    left: 83.33333%;
  }
  [push-lg-11] {
    left: 91.66667%;
  }
  [push-lg-12] {
    left: 100%;
  }
  [offset-lg-0] {
    margin-left: 0%;
  }
  [offset-lg-1] {
    margin-left: 8.33333%;
  }
  [offset-lg-2] {
    margin-left: 16.66667%;
  }
  [offset-lg-3] {
    margin-left: 25%;
  }
  [offset-lg-4] {
    margin-left: 33.33333%;
  }
  [offset-lg-5] {
    margin-left: 41.66667%;
  }
  [offset-lg-6] {
    margin-left: 50%;
  }
  [offset-lg-7] {
    margin-left: 58.33333%;
  }
  [offset-lg-8] {
    margin-left: 66.66667%;
  }
  [offset-lg-9] {
    margin-left: 75%;
  }
  [offset-lg-10] {
    margin-left: 83.33333%;
  }
  [offset-lg-11] {
    margin-left: 91.66667%;
  }
}

[col-xl-1] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-1] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-1] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-1] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-1] {
    padding: 5px;
  }
}

[col-xl-2] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-2] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-2] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-2] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-2] {
    padding: 5px;
  }
}

[col-xl-3] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-3] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-3] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-3] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-3] {
    padding: 5px;
  }
}

[col-xl-4] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-4] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-4] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-4] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-4] {
    padding: 5px;
  }
}

[col-xl-5] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-5] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-5] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-5] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-5] {
    padding: 5px;
  }
}

[col-xl-6] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-6] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-6] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-6] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-6] {
    padding: 5px;
  }
}

[col-xl-7] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-7] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-7] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-7] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-7] {
    padding: 5px;
  }
}

[col-xl-8] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-8] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-8] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-8] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-8] {
    padding: 5px;
  }
}

[col-xl-9] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-9] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-9] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-9] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-9] {
    padding: 5px;
  }
}

[col-xl-10] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-10] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-10] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-10] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-10] {
    padding: 5px;
  }
}

[col-xl-11] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-11] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-11] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-11] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-11] {
    padding: 5px;
  }
}

[col-xl-12] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl-12] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl-12] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl-12] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl-12] {
    padding: 5px;
  }
}

[col-xl] {
  padding: 5px;
}

@media (min-width: 576px) {
  [col-xl] {
    padding: 5px;
  }
}

@media (min-width: 768px) {
  [col-xl] {
    padding: 5px;
  }
}

@media (min-width: 992px) {
  [col-xl] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl] {
    padding: 5px;
  }
}

@media (min-width: 1200px) {
  [col-xl] {
    -webkit-flex-basis: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  [col-xl-auto] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
  }
  [col-xl-1] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    width: 8.33333%;
    max-width: 8.33333%;
  }
  [col-xl-2] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    width: 16.66667%;
    max-width: 16.66667%;
  }
  [col-xl-3] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    width: 25%;
    max-width: 25%;
  }
  [col-xl-4] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    width: 33.33333%;
    max-width: 33.33333%;
  }
  [col-xl-5] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
    -ms-flex: 0 0 41.66667%;
    flex: 0 0 41.66667%;
    width: 41.66667%;
    max-width: 41.66667%;
  }
  [col-xl-6] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    width: 50%;
    max-width: 50%;
  }
  [col-xl-7] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
    -ms-flex: 0 0 58.33333%;
    flex: 0 0 58.33333%;
    width: 58.33333%;
    max-width: 58.33333%;
  }
  [col-xl-8] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
    -ms-flex: 0 0 66.66667%;
    flex: 0 0 66.66667%;
    width: 66.66667%;
    max-width: 66.66667%;
  }
  [col-xl-9] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    width: 75%;
    max-width: 75%;
  }
  [col-xl-10] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
    -ms-flex: 0 0 83.33333%;
    flex: 0 0 83.33333%;
    width: 83.33333%;
    max-width: 83.33333%;
  }
  [col-xl-11] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
    -ms-flex: 0 0 91.66667%;
    flex: 0 0 91.66667%;
    width: 91.66667%;
    max-width: 91.66667%;
  }
  [col-xl-12] {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
  }
  [pull-xl-0] {
    right: auto;
  }
  [pull-xl-1] {
    right: 8.33333%;
  }
  [pull-xl-2] {
    right: 16.66667%;
  }
  [pull-xl-3] {
    right: 25%;
  }
  [pull-xl-4] {
    right: 33.33333%;
  }
  [pull-xl-5] {
    right: 41.66667%;
  }
  [pull-xl-6] {
    right: 50%;
  }
  [pull-xl-7] {
    right: 58.33333%;
  }
  [pull-xl-8] {
    right: 66.66667%;
  }
  [pull-xl-9] {
    right: 75%;
  }
  [pull-xl-10] {
    right: 83.33333%;
  }
  [pull-xl-11] {
    right: 91.66667%;
  }
  [pull-xl-12] {
    right: 100%;
  }
  [push-xl-0] {
    left: auto;
  }
  [push-xl-1] {
    left: 8.33333%;
  }
  [push-xl-2] {
    left: 16.66667%;
  }
  [push-xl-3] {
    left: 25%;
  }
  [push-xl-4] {
    left: 33.33333%;
  }
  [push-xl-5] {
    left: 41.66667%;
  }
  [push-xl-6] {
    left: 50%;
  }
  [push-xl-7] {
    left: 58.33333%;
  }
  [push-xl-8] {
    left: 66.66667%;
  }
  [push-xl-9] {
    left: 75%;
  }
  [push-xl-10] {
    left: 83.33333%;
  }
  [push-xl-11] {
    left: 91.66667%;
  }
  [push-xl-12] {
    left: 100%;
  }
  [offset-xl-0] {
    margin-left: 0%;
  }
  [offset-xl-1] {
    margin-left: 8.33333%;
  }
  [offset-xl-2] {
    margin-left: 16.66667%;
  }
  [offset-xl-3] {
    margin-left: 25%;
  }
  [offset-xl-4] {
    margin-left: 33.33333%;
  }
  [offset-xl-5] {
    margin-left: 41.66667%;
  }
  [offset-xl-6] {
    margin-left: 50%;
  }
  [offset-xl-7] {
    margin-left: 58.33333%;
  }
  [offset-xl-8] {
    margin-left: 66.66667%;
  }
  [offset-xl-9] {
    margin-left: 75%;
  }
  [offset-xl-10] {
    margin-left: 83.33333%;
  }
  [offset-xl-11] {
    margin-left: 91.66667%;
  }
}

ion-icon {
  display: inline-block;
  font-size: 1.2em;
}

ion-icon[small] {
  min-height: 1.1em;
  font-size: 1.1em;
}

.icon-ios-primary {
  color: #0c031d;
}

.icon-ios-secondary {
  color: #969696;
}

.icon-ios-danger {
  color: #7e1111;
}

.icon-ios-light {
  color: #f4f4f4;
}

.icon-ios-dark {
  color: #000000;
}

.icon-ios-menuinicial {
  color: white;
}

.icon-md-primary {
  color: #0c031d;
}

.icon-md-secondary {
  color: #969696;
}

.icon-md-danger {
  color: #7e1111;
}

.icon-md-light {
  color: #f4f4f4;
}

.icon-md-dark {
  color: #000000;
}

.icon-md-menuinicial {
  color: white;
}

.icon-wp-primary {
  color: #0c031d;
}

.icon-wp-secondary {
  color: #969696;
}

.icon-wp-danger {
  color: #7e1111;
}

.icon-wp-light {
  color: #f4f4f4;
}

.icon-wp-dark {
  color: #000000;
}

.icon-wp-menuinicial {
  color: white;
}

ion-img {
  display: inline-block;
  min-width: 20px;
  min-height: 20px;
  background: #eee;
  contain: strict;
}

ion-img img {
  -o-object-fit: cover;
  object-fit: cover;
}

ion-img.img-unloaded img {
  display: none;
}

ion-img.img-loaded img {
  display: block;
}

ion-infinite-scroll {
  display: block;
  width: 100%;
}

ion-infinite-scroll-content {
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 100%;
  min-height: 84px;
}

.infinite-loading {
  display: none;
  width: 100%;
  margin: 0 0 32px;
}

.infinite-loading-text {
  color: #666;
  margin: 4px 32px 0;
}

.infinite-loading-spinner .spinner-ios line,
.infinite-loading-spinner .spinner-ios-small line,
.infinite-loading-spinner .spinner-crescent circle {
  stroke: #666;
}

.infinite-loading-spinner .spinner-bubbles circle,
.infinite-loading-spinner .spinner-circles circle,
.infinite-loading-spinner .spinner-dots circle {
  fill: #666;
}

ion-infinite-scroll-content[state=loading] .infinite-loading {
  display: block;
}

ion-infinite-scroll-content[state=disabled] {
  display: none;
}

ion-input,
ion-textarea {
  position: relative;
  display: block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 100%;
}

.item-input ion-input,
.item-input ion-textarea {
  position: static;
}

.item.item-textarea {
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.text-input {
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  display: inline-block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 92%;
  width: calc(100% - 10px);
  border: 0;
  background: transparent;
}

.text-input::-moz-placeholder {
  color: #999;
}

.text-input:-ms-input-placeholder {
  color: #999;
}

.text-input::-webkit-input-placeholder {
  text-indent: 0;
  color: #999;
}

textarea.text-input {
  display: block;
}

.text-input[disabled] {
  opacity: .4;
}

input.text-input:-webkit-autofill {
  background-color: transparent;
}

.platform-mobile textarea.text-input {
  resize: none;
}

.input-cover {
  left: 0;
  top: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

.input[disabled] .input-cover {
  pointer-events: none;
}

.item-input-has-focus .input-cover,
.input-has-focus .input-cover {
  display: none;
}

.item-input-has-focus,
.input-has-focus {
  pointer-events: none;
}

.item-input-has-focus input,
.input-has-focus input,
.item-input-has-focus textarea,
.input-has-focus textarea,
.item-input-has-focus a,
.input-has-focus a,
.item-input-has-focus button,
.input-has-focus button {
  pointer-events: auto;
}

.text-input-clear-icon {
  margin: 0;
  padding: 0;
  background-position: center;
  position: absolute;
  top: 0;
  display: none;
  height: 100%;
  background-repeat: no-repeat;
}

.item-input-has-focus.item-input-has-value .text-input-clear-icon,
.input-has-focus.input-has-value .text-input-clear-icon {
  display: block;
}

.text-input-ios {
  margin: 11px 8px 11px 0;
  padding: 0;
  width: calc(100% - 8px);
}

.input-ios .inset-input {
  padding: 5.5px 8px;
  margin: 5.5px 16px 5.5px 0;
}

.item-ios.item-label-stacked .text-input,
.item-ios.item-label-floating .text-input {
  margin-left: 0;
  margin-top: 8px;
  margin-bottom: 8px;
  width: calc(100% - 8px);
}

.item-ios.item-label-stacked .label-ios + .input + .cloned-input,
.item-ios.item-label-floating .label-ios + .input + .cloned-input {
  margin-left: 0;
}

.item-label-stacked .select-ios,
.item-label-floating .select-ios {
  padding-left: 0;
  padding-top: 8px;
  padding-bottom: 8px;
}

.input-ios[clearInput] {
  position: relative;
}

.input-ios[clearInput] .text-input {
  padding-right: 30px;
}

.input-ios .text-input-clear-icon {
  right: 8px;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
  width: 30px;
  background-size: 18px;
}

.text-input-md {
  margin: 13px 8px;
  padding: 0;
  width: calc(100% - 8px - 8px);
}

.input-md .inset-input {
  padding: 6.5px 8px;
  margin: 6.5px 16px;
}

.item-md.item-input.item-input-has-focus .item-inner,
.item-md.item-input.input-has-focus .item-inner {
  border-bottom-color: #0c031d;
  -webkit-box-shadow: inset 0 -1px 0 0 #0c031d;
  box-shadow: inset 0 -1px 0 0 #0c031d;
}

.list-md .item-input.item-input-has-focus:last-child,
.list-md .item-input.input-has-focus:last-child {
  border-bottom-color: #0c031d;
  -webkit-box-shadow: inset 0 -1px 0 0 #0c031d;
  box-shadow: inset 0 -1px 0 0 #0c031d;
}

.list-md .item-input.item-input-has-focus:last-child .item-inner,
.list-md .item-input.input-has-focus:last-child .item-inner {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.item-md.item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus) .item-inner,
.item-md.item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
  border-bottom-color: #32db64;
  -webkit-box-shadow: inset 0 -1px 0 0 #32db64;
  box-shadow: inset 0 -1px 0 0 #32db64;
}

.list-md .item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child,
.list-md .item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child {
  border-bottom-color: #32db64;
  -webkit-box-shadow: inset 0 -1px 0 0 #32db64;
  box-shadow: inset 0 -1px 0 0 #32db64;
}

.list-md .item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child .item-inner,
.list-md .item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child .item-inner {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.item-md.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .item-inner {
  border-bottom-color: #f53d3d;
  -webkit-box-shadow: inset 0 -1px 0 0 #f53d3d;
  box-shadow: inset 0 -1px 0 0 #f53d3d;
}

.list-md .item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus):last-child {
  border-bottom-color: #f53d3d;
  -webkit-box-shadow: inset 0 -1px 0 0 #f53d3d;
  box-shadow: inset 0 -1px 0 0 #f53d3d;
}

.list-md .item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus):last-child .item-inner {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.item-label-stacked .text-input-md,
.item-label-floating .text-input-md {
  margin-left: 0;
  margin-top: 8px;
  margin-bottom: 8px;
  width: calc(100% - 8px);
}

.item-label-stacked .select-md,
.item-label-floating .select-md {
  padding-left: 0;
  padding-top: 8px;
  padding-bottom: 8px;
}

.input-md[clearInput] {
  position: relative;
}

.input-md[clearInput] .text-input {
  padding-right: 30px;
}

.input-md .text-input-clear-icon {
  right: 8px;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='%235b5b5b'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
  width: 30px;
  background-size: 22px;
}

.text-input-wp {
  margin: 13px 8px;
  padding: 0 8px;
  width: calc(100% - 8px - 8px);
  border: 2px solid rgba(0, 0, 0, 0.5);
  line-height: 3rem;
}

.item-wp .inset-input {
  padding: 6.5px 8px;
  margin: 6.5px 16px;
}

.item-wp.item-input.item-input-has-focus .text-input,
.item-wp.item-input.input-has-focus .text-input {
  border-color: #0c031d;
}

.item-wp.item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus) .text-input,
.item-wp.item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus) .text-input {
  border-color: #32db64;
}

.item-wp.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .text-input {
  border-color: #f53d3d;
}

.item-label-stacked .text-input-wp,
.item-label-floating .text-input-wp,
.item-label-stacked .select-wp,
.item-label-floating .select-wp {
  margin-left: 0;
  margin-top: 8px;
  margin-bottom: 8px;
  width: calc(100% - 8px);
}

.item-wp.item-label-stacked [item-right],
.item-wp.item-label-floating [item-right],
.item-wp.item-label-stacked [item-end],
.item-wp.item-label-floating [item-end] {
  -webkit-align-self: flex-end;
  -ms-flex-item-align: end;
  align-self: flex-end;
}

.input-wp[clearInput] {
  position: relative;
}

.input-wp[clearInput] .text-input {
  padding-right: 30px;
}

.input-wp .text-input-clear-icon {
  right: 8px;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='rgba(0,%200,%200,%200.5)'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
  width: 30px;
  background-size: 22px;
}

.item {
  contain: content;
}

.item-block {
  margin: 0;
  padding: 0;
  text-align: initial;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  min-height: 4.4rem;
  border: 0;
  font-weight: normal;
  line-height: normal;
  text-decoration: none;
  color: inherit;
}

.item-inner {
  margin: 0;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: inherit;
  -webkit-box-direction: inherit;
  -webkit-flex-direction: inherit;
  -ms-flex-direction: inherit;
  flex-direction: inherit;
  -webkit-box-align: inherit;
  -webkit-align-items: inherit;
  -ms-flex-align: inherit;
  align-items: inherit;
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  min-height: inherit;
  border: 0;
}

.input-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: inherit;
  -webkit-box-direction: inherit;
  -webkit-flex-direction: inherit;
  -ms-flex-direction: inherit;
  flex-direction: inherit;
  -webkit-box-align: inherit;
  -webkit-align-items: inherit;
  -ms-flex-align: inherit;
  align-items: inherit;
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  text-overflow: ellipsis;
}

.item[no-lines],
.item.item[no-lines] .item-inner {
  border: 0;
}

ion-item-group {
  display: block;
}

ion-item-divider {
  margin: 0;
  padding: 0;
  z-index: 100;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  min-height: 30px;
}

ion-item-divider[sticky] {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

[vertical-align-top],
ion-input.item {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.item > ion-icon[small]:first-child,
.item-inner > ion-icon[small]:first-child {
  min-width: 18px;
}

.item > ion-icon:first-child,
.item-inner > ion-icon:first-child {
  text-align: center;
  min-width: 24px;
}

.item > ion-icon,
.item-inner > ion-icon {
  min-height: 2.8rem;
  font-size: 2.8rem;
  line-height: 1;
}

.item > ion-icon[large],
.item-inner > ion-icon[large] {
  min-height: 3.2rem;
  font-size: 3.2rem;
}

.item > ion-icon[small],
.item-inner > ion-icon[small] {
  min-height: 1.8rem;
  font-size: 1.8rem;
}

ion-avatar,
ion-thumbnail {
  display: block;
  line-height: 1;
}

ion-avatar img,
ion-thumbnail img {
  display: block;
}

.item-cover {
  left: 0;
  top: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  background: transparent;
  cursor: pointer;
}

ion-reorder {
  -webkit-transform: translate3d(160%,  0,  0);
  transform: translate3d(160%,  0,  0);
  display: none;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  max-width: 40px;
  height: 100%;
  font-size: 1.7em;
  opacity: .25;
  -webkit-transition: -webkit-transform 140ms ease-in;
  transition: -webkit-transform 140ms ease-in;
  transition: transform 140ms ease-in;
  transition: transform 140ms ease-in, -webkit-transform 140ms ease-in;
  pointer-events: all;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

.reorder-side-start ion-reorder {
  -webkit-transform: translate3d(-160%,  0,  0);
  transform: translate3d(-160%,  0,  0);
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
}

ion-reorder ion-icon {
  pointer-events: none;
}

.reorder-enabled ion-reorder {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.reorder-visible ion-reorder {
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
}

.reorder-list-active .item,
.reorder-list-active .item-wrapper {
  -webkit-transition: -webkit-transform 300ms;
  transition: -webkit-transform 300ms;
  transition: transform 300ms;
  transition: transform 300ms, -webkit-transform 300ms;
  will-change: transform;
}

.reorder-list-active .item-inner {
  pointer-events: none;
}

.item-wrapper.reorder-active,
.item.reorder-active,
.reorder-active {
  z-index: 4;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
  opacity: .8;
  -webkit-transition: none;
  transition: none;
  pointer-events: none;
}

ion-item-sliding {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
}

ion-item-sliding .item {
  position: static;
}

ion-item-options {
  position: absolute;
  z-index: 1;
  display: none;
  height: 100%;
  font-size: 14px;
  visibility: hidden;
  top: 0;
  right: 0;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

ion-item-options[side=left] {
  right: auto;
  left: 0;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

ion-item-options .button {
  margin: 0;
  padding: 0 0.7em;
  border-radius: 0;
  height: 100%;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

ion-item-options:not([icon-left]) .button:not([icon-only]) .button-inner,
ion-item-options:not([icon-start]) .button:not([icon-only]) .button-inner {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

ion-item-options:not([icon-left]) .button:not([icon-only]) ion-icon,
ion-item-options:not([icon-start]) .button:not([icon-only]) ion-icon {
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0.3em;
}

ion-item-sliding.active-slide .item,
ion-item-sliding.active-slide .item.activated {
  position: relative;
  z-index: 2;
  opacity: 1;
  -webkit-transition: -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
  transition: -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
  transition: transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
  transition: transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1), -webkit-transform 500ms cubic-bezier(0.36, 0.66, 0.04, 1);
  pointer-events: none;
  will-change: transform;
}

ion-item-sliding.active-slide ion-item-options {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

ion-item-sliding.active-slide.active-options-left ion-item-options[side=left],
ion-item-sliding.active-slide.active-options-right ion-item-options:not([side=left]) {
  width: 100%;
  visibility: visible;
}

button[expandable] {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-transition-duration: 0;
  transition-duration: 0;
  -webkit-transition-property: none;
  transition-property: none;
  -webkit-transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);
  transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);
}

ion-item-sliding.active-swipe-right button[expandable] {
  -webkit-transition-duration: .6s;
  transition-duration: .6s;
  -webkit-transition-property: padding-left;
  transition-property: padding-left;
  padding-left: 90%;
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}

ion-item-sliding.active-swipe-left button[expandable] {
  -webkit-transition-duration: .6s;
  transition-duration: .6s;
  -webkit-transition-property: padding-right;
  transition-property: padding-right;
  padding-right: 90%;
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
}

.item-ios {
  padding-left: 16px;
  border-radius: 0;
  position: relative;
  font-size: 1.7rem;
  color: #000;
  background-color: #fff;
  -webkit-transition: background-color 200ms linear;
  transition: background-color 200ms linear;
}

.item-ios.activated {
  background-color: #d9d9d9;
  -webkit-transition-duration: 0ms;
  transition-duration: 0ms;
}

.item-ios h1 {
  margin: 0 0 2px;
  font-size: 2.4rem;
  font-weight: normal;
}

.item-ios h2 {
  margin: 0 0 2px;
  font-size: 1.7rem;
  font-weight: normal;
}

.item-ios h3,
.item-ios h4,
.item-ios h5,
.item-ios h6 {
  margin: 0 0 3px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: normal;
}

.item-ios p {
  overflow: inherit;
  font-size: 1.4rem;
  line-height: normal;
  text-overflow: inherit;
  color: #8e9093;
  margin: 0 0 2px;
}

.item-ios h2:last-child,
.item-ios h3:last-child,
.item-ios h4:last-child,
.item-ios h5:last-child,
.item-ios h6:last-child,
.item-ios p:last-child {
  margin-bottom: 0;
}

.item-ios.item-block .item-inner {
  padding-right: 8px;
  border-bottom: 0.55px solid #c8c7cc;
}

.item-ios [item-left],
.item-ios [item-start] {
  margin: 8px 16px 8px 0;
}

.item-ios [item-right],
.item-ios [item-end] {
  margin: 8px;
}

.item-ios ion-icon[item-left],
.item-ios ion-icon[item-right],
.item-ios ion-icon[item-start],
.item-ios ion-icon[item-end] {
  margin-left: 0;
  margin-top: 9px;
  margin-bottom: 8px;
}

.item-ios .item-button {
  padding: 0 0.5em;
  height: 24px;
  font-size: 1.3rem;
}

.item-ios .item-button[icon-only] ion-icon,
.item-ios .item-button[icon-only] {
  padding: 0 1px;
}

.item-ios ion-avatar[item-left],
.item-ios ion-thumbnail[item-left],
.item-ios ion-avatar[item-start],
.item-ios ion-thumbnail[item-start] {
  margin: 8px 16px 8px 0;
}

.item-ios ion-avatar[item-right],
.item-ios ion-thumbnail[item-right],
.item-ios ion-avatar[item-end],
.item-ios ion-thumbnail[item-end] {
  margin: 8px;
}

.item-ios ion-avatar {
  min-width: 36px;
  min-height: 36px;
}

.item-ios ion-avatar ion-img,
.item-ios ion-avatar img {
  border-radius: 50%;
  overflow: hidden;
  width: 36px;
  height: 36px;
}

.item-ios ion-thumbnail {
  min-width: 56px;
  min-height: 56px;
}

.item-ios ion-thumbnail ion-img,
.item-ios ion-thumbnail img {
  width: 56px;
  height: 56px;
}

.item-ios[detail-push] .item-inner,
button.item-ios:not([detail-none]) .item-inner,
a.item-ios:not([detail-none]) .item-inner {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2020'><path%20d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z'%20fill='%23c8c7cc'/></svg>");
  padding-right: 32px;
  background-position: right 14px center;
  background-repeat: no-repeat;
  background-size: 14px 14px;
}

ion-item-group .item-ios:first-child .item-inner {
  border-top-width: 0;
}

ion-item-group .item-ios:last-child .item-inner,
ion-item-group .item-wrapper:last-child .item-ios .item-inner {
  border: 0;
}

.item-divider-ios {
  padding-left: 16px;
  color: #222;
  background-color: #f7f7f7;
}

.item-ios .text-ios-primary {
  color: #0c031d;
}

.item-ios-primary,
.item-divider-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.item-ios-primary p,
.item-divider-ios-primary p {
  color: #fff;
}

.item-ios-primary.activated,
.item-divider-ios-primary.activated {
  background-color: #1f172f;
}

.item-ios .text-ios-secondary {
  color: #969696;
}

.item-ios-secondary,
.item-divider-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.item-ios-secondary p,
.item-divider-ios-secondary p {
  color: #fff;
}

.item-ios-secondary.activated,
.item-divider-ios-secondary.activated {
  background-color: #8a8a8a;
}

.item-ios .text-ios-danger {
  color: #7e1111;
}

.item-ios-danger,
.item-divider-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.item-ios-danger p,
.item-divider-ios-danger p {
  color: #fff;
}

.item-ios-danger.activated,
.item-divider-ios-danger.activated {
  background-color: #882424;
}

.item-ios .text-ios-light {
  color: #f4f4f4;
}

.item-ios-light,
.item-divider-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.item-ios-light p,
.item-divider-ios-light p {
  color: #000;
}

.item-ios-light.activated,
.item-divider-ios-light.activated {
  background-color: #e0e0e0;
}

.item-ios .text-ios-dark {
  color: #000000;
}

.item-ios-dark,
.item-divider-ios-dark {
  color: #fff;
  background-color: #000000;
}

.item-ios-dark p,
.item-divider-ios-dark p {
  color: #fff;
}

.item-ios-dark.activated,
.item-divider-ios-dark.activated {
  background-color: #141414;
}

.item-ios .text-ios-menuinicial {
  color: white;
}

.item-ios-menuinicial,
.item-divider-ios-menuinicial {
  color: #000;
  background-color: white;
}

.item-ios-menuinicial p,
.item-divider-ios-menuinicial p {
  color: #000;
}

.item-ios-menuinicial.activated,
.item-divider-ios-menuinicial.activated {
  background-color: #ebebeb;
}

.list-ios ion-item-sliding {
  background-color: #fff;
}

.item-md {
  padding-left: 16px;
  padding-right: 0;
  position: relative;
  font-size: 1.6rem;
  font-weight: normal;
  text-transform: none;
  color: #000;
  background-color: #fff;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.item-md.activated {
  background-color: #f1f1f1;
}

.item-md[no-lines] {
  border-width: 0;
}

.item-md h1 {
  margin: 0 0 2px;
  font-size: 2.4rem;
  font-weight: normal;
}

.item-md h2 {
  margin: 2px 0;
  font-size: 1.6rem;
  font-weight: normal;
}

.item-md h3,
.item-md h4,
.item-md h5,
.item-md h6 {
  margin: 2px 0;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: normal;
}

.item-md p {
  margin: 0 0 2px;
  overflow: inherit;
  font-size: 1.4rem;
  line-height: normal;
  text-overflow: inherit;
  color: #666;
}

.item-md.item-block .item-inner {
  padding-right: 8px;
  border-bottom: 1px solid #dedede;
}

.item-md [item-left],
.item-md [item-right],
.item-md [item-start],
.item-md [item-end] {
  margin: 9px 8px 9px 0;
}

.item-md ion-icon[item-left],
.item-md ion-icon[item-right],
.item-md ion-icon[item-start],
.item-md ion-icon[item-end] {
  margin-left: 0;
  margin-top: 11px;
  margin-bottom: 10px;
}

.item-md .item-button {
  padding: 0 0.6em;
  height: 25px;
  font-size: 1.2rem;
}

.item-md .item-button[icon-only] ion-icon,
.item-md .item-button[icon-only] {
  padding: 0 1px;
}

.item-md ion-icon[item-left] + .item-inner,
.item-md ion-icon[item-left] + .item-input,
.item-md ion-icon[item-start] + .item-inner,
.item-md ion-icon[item-start] + .item-input {
  margin-left: 24px;
}

.item-md ion-avatar[item-left],
.item-md ion-thumbnail[item-left],
.item-md ion-avatar[item-start],
.item-md ion-thumbnail[item-start] {
  margin: 8px 16px 8px 0;
}

.item-md ion-avatar[item-right],
.item-md ion-thumbnail[item-right],
.item-md ion-avatar[item-end],
.item-md ion-thumbnail[item-end] {
  margin: 8px;
}

.item-md ion-avatar {
  min-width: 40px;
  min-height: 40px;
}

.item-md ion-avatar ion-img,
.item-md ion-avatar img {
  border-radius: 50%;
  overflow: hidden;
  width: 40px;
  height: 40px;
}

.item-md ion-thumbnail {
  min-width: 80px;
  min-height: 80px;
}

.item-md ion-thumbnail ion-img,
.item-md ion-thumbnail img {
  width: 80px;
  height: 80px;
}

ion-item-group .item-md:first-child .item-inner {
  border-top-width: 0;
}

ion-item-group .item-md:last-child .item-inner,
ion-item-group .item-md .item-wrapper:last-child .item-inner {
  border: 0;
}

.item-divider-md {
  padding-left: 16px;
  border-bottom: 1px solid #dedede;
  font-size: 1.4rem;
  color: #858585;
  background-color: #fff;
}

.item-md .text-md-primary {
  color: #0c031d;
}

.item-md-primary,
.item-divider-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.item-md-primary p,
.item-divider-md-primary p {
  color: #fff;
}

.item-md-primary.activated,
.item-divider-md-primary.activated {
  background-color: #1f172f;
}

.item-md .text-md-secondary {
  color: #969696;
}

.item-md-secondary,
.item-divider-md-secondary {
  color: #fff;
  background-color: #969696;
}

.item-md-secondary p,
.item-divider-md-secondary p {
  color: #fff;
}

.item-md-secondary.activated,
.item-divider-md-secondary.activated {
  background-color: #8a8a8a;
}

.item-md .text-md-danger {
  color: #7e1111;
}

.item-md-danger,
.item-divider-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.item-md-danger p,
.item-divider-md-danger p {
  color: #fff;
}

.item-md-danger.activated,
.item-divider-md-danger.activated {
  background-color: #882424;
}

.item-md .text-md-light {
  color: #f4f4f4;
}

.item-md-light,
.item-divider-md-light {
  color: #000;
  background-color: #f4f4f4;
}

.item-md-light p,
.item-divider-md-light p {
  color: #000;
}

.item-md-light.activated,
.item-divider-md-light.activated {
  background-color: #e0e0e0;
}

.item-md .text-md-dark {
  color: #000000;
}

.item-md-dark,
.item-divider-md-dark {
  color: #fff;
  background-color: #000000;
}

.item-md-dark p,
.item-divider-md-dark p {
  color: #fff;
}

.item-md-dark.activated,
.item-divider-md-dark.activated {
  background-color: #141414;
}

.item-md .text-md-menuinicial {
  color: white;
}

.item-md-menuinicial,
.item-divider-md-menuinicial {
  color: #000;
  background-color: white;
}

.item-md-menuinicial p,
.item-divider-md-menuinicial p {
  color: #000;
}

.item-md-menuinicial.activated,
.item-divider-md-menuinicial.activated {
  background-color: #ebebeb;
}

.list-md ion-item-sliding {
  background-color: #fff;
}

.item-md ion-reorder {
  font-size: 1.5em;
  opacity: .3;
}

.item-wp {
  padding-left: 16px;
  padding-right: 0;
  position: relative;
  font-size: 1.6rem;
  font-weight: normal;
  text-transform: none;
  color: #000;
  background-color: #fff;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.item-wp.activated {
  background-color: #aaa;
}

.item-wp[no-lines] {
  border-width: 0;
}

.item-wp h1 {
  margin: 0 0 2px;
  font-size: 2.4rem;
  font-weight: normal;
}

.item-wp h2 {
  margin: 2px 0;
  font-size: 1.6rem;
  font-weight: normal;
}

.item-wp h3,
.item-wp h4,
.item-wp h5,
.item-wp h6 {
  margin: 2px 0;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: normal;
}

.item-wp p {
  margin: 0 0 2px;
  overflow: inherit;
  font-size: 1.4rem;
  line-height: normal;
  text-overflow: inherit;
  color: #666;
}

.item-wp.item-block .item-inner {
  padding-right: 8px;
  border-bottom: 1px solid transparent;
}

.item-wp [item-left],
.item-wp [item-right],
.item-wp [item-start],
.item-wp [item-end] {
  margin: 9px 8px 9px 0;
}

.item-wp ion-icon[item-left],
.item-wp ion-icon[item-right],
.item-wp ion-icon[item-start],
.item-wp ion-icon[item-end] {
  margin-left: 0;
  margin-top: 11px;
  margin-bottom: 10px;
}

.item-wp .item-button {
  padding: 0 0.6em;
  height: 25px;
  font-size: 1.2rem;
}

.item-wp .item-button[icon-only] ion-icon,
.item-wp .item-button[icon-only] {
  padding: 0 1px;
}

.item-wp[text-wrap] ion-label {
  font-size: 1.4rem;
  line-height: 1.5;
}

.item-wp ion-icon[item-left] + .item-inner,
.item-wp ion-icon[item-left] + .item-input,
.item-wp ion-icon[item-start] + .item-inner,
.item-wp ion-icon[item-start] + .item-input {
  margin-left: 8px;
}

.item-wp ion-avatar[item-left],
.item-wp ion-thumbnail[item-left],
.item-wp ion-avatar[item-start],
.item-wp ion-thumbnail[item-start] {
  margin: 8px 16px 8px 0;
}

.item-wp ion-avatar[item-right],
.item-wp ion-thumbnail[item-right],
.item-wp ion-avatar[item-end],
.item-wp ion-thumbnail[item-end] {
  margin: 8px;
}

.item-wp ion-avatar {
  min-width: 40px;
  min-height: 40px;
}

.item-wp ion-avatar ion-img,
.item-wp ion-avatar img {
  border-radius: 50%;
  overflow: hidden;
  width: 40px;
  height: 40px;
}

.item-wp ion-thumbnail {
  min-width: 80px;
  min-height: 80px;
}

.item-wp ion-thumbnail ion-img,
.item-wp ion-thumbnail img {
  width: 80px;
  height: 80px;
}

.item-divider-wp {
  padding-left: 16px;
  border-bottom: 1px solid transparent;
  font-size: 2rem;
  color: #000;
  background-color: #fff;
}

.item-wp .text-wp-primary {
  color: #0c031d;
}

.item-wp-primary,
.item-divider-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.item-wp-primary p,
.item-divider-wp-primary p {
  color: #fff;
}

.item-wp-primary.activated,
.item-divider-wp-primary.activated {
  background-color: #1f172f;
}

.item-wp .text-wp-secondary {
  color: #969696;
}

.item-wp-secondary,
.item-divider-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.item-wp-secondary p,
.item-divider-wp-secondary p {
  color: #fff;
}

.item-wp-secondary.activated,
.item-divider-wp-secondary.activated {
  background-color: #8a8a8a;
}

.item-wp .text-wp-danger {
  color: #7e1111;
}

.item-wp-danger,
.item-divider-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.item-wp-danger p,
.item-divider-wp-danger p {
  color: #fff;
}

.item-wp-danger.activated,
.item-divider-wp-danger.activated {
  background-color: #882424;
}

.item-wp .text-wp-light {
  color: #f4f4f4;
}

.item-wp-light,
.item-divider-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.item-wp-light p,
.item-divider-wp-light p {
  color: #000;
}

.item-wp-light.activated,
.item-divider-wp-light.activated {
  background-color: #e0e0e0;
}

.item-wp .text-wp-dark {
  color: #000000;
}

.item-wp-dark,
.item-divider-wp-dark {
  color: #fff;
  background-color: #000000;
}

.item-wp-dark p,
.item-divider-wp-dark p {
  color: #fff;
}

.item-wp-dark.activated,
.item-divider-wp-dark.activated {
  background-color: #141414;
}

.item-wp .text-wp-menuinicial {
  color: white;
}

.item-wp-menuinicial,
.item-divider-wp-menuinicial {
  color: #000;
  background-color: white;
}

.item-wp-menuinicial p,
.item-divider-wp-menuinicial p {
  color: #000;
}

.item-wp-menuinicial.activated,
.item-divider-wp-menuinicial.activated {
  background-color: #ebebeb;
}

.list-wp ion-item-sliding {
  background-color: #fff;
}

ion-label {
  margin: 0;
  display: block;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-size: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.item-input ion-label {
  -webkit-box-flex: initial;
  -webkit-flex: initial;
  -ms-flex: initial;
  flex: initial;
  max-width: 200px;
  pointer-events: none;
}

[text-wrap] ion-label {
  white-space: normal;
}

ion-label[fixed] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100px;
  -ms-flex: 0 0 100px;
  flex: 0 0 100px;
  width: 100px;
  min-width: 100px;
  max-width: 200px;
}

.item-label-stacked ion-label,
.item-label-floating ion-label {
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  width: auto;
  max-width: 100%;
}

ion-label[stacked],
ion-label[floating] {
  margin-bottom: 0;
}

.item-label-stacked .input-wrapper,
.item-label-floating .input-wrapper {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.item-label-stacked ion-select,
.item-label-floating ion-select {
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  max-width: 100%;
}

.label-ios {
  margin: 11px 8px 11px 0;
}

.label-ios + ion-input .text-input,
.label-ios + ion-textarea .text-input,
.label-ios + .input + .cloned-input {
  margin-left: 16px;
  width: calc(100% - (16px / 2) - 16px);
}

.label-ios[stacked] {
  margin-bottom: 4px;
  font-size: 1.2rem;
}

.label-ios[floating] {
  margin-bottom: 0;
  -webkit-transform: translate3d(0,  27px,  0);
  transform: translate3d(0,  27px,  0);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 150ms ease-in-out;
  transition: -webkit-transform 150ms ease-in-out;
  transition: transform 150ms ease-in-out;
  transition: transform 150ms ease-in-out, -webkit-transform 150ms ease-in-out;
}

.item-input-has-focus .label-ios[floating],
.input-has-focus .label-ios[floating],
.item-input-has-value .label-ios[floating],
.input-has-value .label-ios[floating] {
  -webkit-transform: translate3d(0,  0,  0) scale(0.8);
  transform: translate3d(0,  0,  0) scale(0.8);
}

.item-ios.item-label-stacked [item-right],
.item-ios.item-label-floating [item-right],
.item-ios.item-label-stacked [item-end],
.item-ios.item-label-floating [item-end] {
  margin-top: 6px;
  margin-bottom: 6px;
}

.label-ios-primary,
.item-input .label-ios-primary,
.item-select .label-ios-primary,
.item-datetime .label-ios-primary {
  color: #0c031d;
}

.label-ios-secondary,
.item-input .label-ios-secondary,
.item-select .label-ios-secondary,
.item-datetime .label-ios-secondary {
  color: #969696;
}

.label-ios-danger,
.item-input .label-ios-danger,
.item-select .label-ios-danger,
.item-datetime .label-ios-danger {
  color: #7e1111;
}

.label-ios-light,
.item-input .label-ios-light,
.item-select .label-ios-light,
.item-datetime .label-ios-light {
  color: #f4f4f4;
}

.label-ios-dark,
.item-input .label-ios-dark,
.item-select .label-ios-dark,
.item-datetime .label-ios-dark {
  color: #000000;
}

.label-ios-menuinicial,
.item-input .label-ios-menuinicial,
.item-select .label-ios-menuinicial,
.item-datetime .label-ios-menuinicial {
  color: white;
}

.label-md {
  margin: 13px 8px 13px 0;
}

[text-wrap] .label-md {
  font-size: 1.4rem;
  line-height: 1.5;
}

.item-input .label-md,
.item-select .label-md,
.item-datetime .label-md {
  color: #999;
}

.label-md[stacked] {
  font-size: 1.2rem;
}

.label-md[floating] {
  -webkit-transform: translate3d(0,  27px,  0);
  transform: translate3d(0,  27px,  0);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 150ms ease-in-out;
  transition: -webkit-transform 150ms ease-in-out;
  transition: transform 150ms ease-in-out;
  transition: transform 150ms ease-in-out, -webkit-transform 150ms ease-in-out;
}

.label-md[stacked],
.label-md[floating] {
  margin-left: 0;
  margin-bottom: 0;
}

.item-input-has-focus .label-md[stacked],
.input-has-focus .label-md[stacked],
.item-input-has-focus .label-md[floating],
.input-has-focus .label-md[floating] {
  color: #0c031d;
}

.item-input-has-focus .label-md[floating],
.input-has-focus .label-md[floating],
.item-input-has-value .label-md[floating],
.input-has-value .label-md[floating] {
  -webkit-transform: translate3d(0,  0,  0) scale(0.8);
  transform: translate3d(0,  0,  0) scale(0.8);
}

.item-md.item-label-stacked [item-right],
.item-md.item-label-floating [item-right],
.item-md.item-label-stacked [item-end],
.item-md.item-label-floating [item-end] {
  margin-top: 7px;
  margin-bottom: 7px;
}

.label-md-primary,
.item-input .label-md-primary,
.item-select .label-md-primary,
.item-datetime .label-md-primary {
  color: #0c031d;
}

.label-md-secondary,
.item-input .label-md-secondary,
.item-select .label-md-secondary,
.item-datetime .label-md-secondary {
  color: #969696;
}

.label-md-danger,
.item-input .label-md-danger,
.item-select .label-md-danger,
.item-datetime .label-md-danger {
  color: #7e1111;
}

.label-md-light,
.item-input .label-md-light,
.item-select .label-md-light,
.item-datetime .label-md-light {
  color: #f4f4f4;
}

.label-md-dark,
.item-input .label-md-dark,
.item-select .label-md-dark,
.item-datetime .label-md-dark {
  color: #000000;
}

.label-md-menuinicial,
.item-input .label-md-menuinicial,
.item-select .label-md-menuinicial,
.item-datetime .label-md-menuinicial {
  color: white;
}

.label-wp {
  margin: 13px 8px 13px 0;
}

.item-input .label-wp,
.item-select .label-wp,
.item-datetime .label-wp {
  color: #999;
}

.label-wp[stacked] {
  font-size: 1.2rem;
}

.label-wp[floating] {
  -webkit-transform: translate3d(8px,  34px,  0);
  transform: translate3d(8px,  34px,  0);
  -webkit-transform-origin: left top;
  transform-origin: left top;
}

.label-wp[stacked],
.label-wp[floating] {
  margin-left: 0;
  margin-bottom: 0;
}

.item-input-has-focus .label-wp[stacked],
.input-has-focus .label-wp[stacked],
.item-input-has-focus .label-wp[floating],
.input-has-focus .label-wp[floating] {
  color: #0c031d;
}

.item-input-has-focus .label-wp[floating],
.input-has-focus .label-wp[floating],
.item-input-has-value .label-wp[floating],
.input-has-value .label-wp[floating] {
  -webkit-transform: translate3d(0,  0,  0) scale(0.8);
  transform: translate3d(0,  0,  0) scale(0.8);
}

.item-wp.item-label-stacked [item-right],
.item-wp.item-label-floating [item-right],
.item-wp.item-label-stacked [item-end],
.item-wp.item-label-floating [item-end] {
  margin-top: 13px;
  margin-bottom: 13px;
}

.label-wp-primary,
.item-input .label-wp-primary,
.item-select .label-wp-primary,
.item-datetime .label-wp-primary {
  color: #0c031d;
}

.label-wp-secondary,
.item-input .label-wp-secondary,
.item-select .label-wp-secondary,
.item-datetime .label-wp-secondary {
  color: #969696;
}

.label-wp-danger,
.item-input .label-wp-danger,
.item-select .label-wp-danger,
.item-datetime .label-wp-danger {
  color: #7e1111;
}

.label-wp-light,
.item-input .label-wp-light,
.item-select .label-wp-light,
.item-datetime .label-wp-light {
  color: #f4f4f4;
}

.label-wp-dark,
.item-input .label-wp-dark,
.item-select .label-wp-dark,
.item-datetime .label-wp-dark {
  color: #000000;
}

.label-wp-menuinicial,
.item-input .label-wp-menuinicial,
.item-select .label-wp-menuinicial,
.item-datetime .label-wp-menuinicial {
  color: white;
}

ion-list-header {
  margin: 0;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  min-height: 4rem;
}

ion-list {
  margin: 0;
  padding: 0;
  display: block;
  list-style-type: none;
}

ion-list[inset] {
  overflow: hidden;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.list-ios {
  margin: -1px 0 32px;
}

.list-ios > .item-block:first-child {
  border-top: 0.55px solid #c8c7cc;
}

.list-ios > .item-block:last-child,
.list-ios > .item-wrapper:last-child .item-block {
  border-bottom: 0.55px solid #c8c7cc;
}

.list-ios > .item-block:last-child .item-inner,
.list-ios > .item-wrapper:last-child .item-block .item-inner {
  border-bottom: 0;
}

.list-ios .item-block .item-inner {
  border-bottom: 0.55px solid #c8c7cc;
}

.list-ios .item[no-lines],
.list-ios .item[no-lines] .item-inner {
  border-width: 0;
}

.list-ios ion-item-options {
  border-bottom: 0.55px solid #c8c7cc;
}

.list-ios ion-item-options .button {
  margin: 0;
  border-radius: 0;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  min-height: 100%;
  border: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.list-ios ion-item-options .button::before {
  margin: 0 auto;
}

.list-ios:not([inset]) + .list-ios:not([inset]) ion-list-header {
  margin-top: -10px;
  padding-top: 0;
}

.list-ios[inset] {
  margin: 16px;
  border-radius: 4px;
}

.list-ios[inset] ion-list-header {
  background-color: #fff;
}

.list-ios[inset] .item {
  border-bottom: 1px solid #c8c7cc;
}

.list-ios[inset] .item-inner {
  border-bottom: 0;
}

.list-ios[inset] > .item:first-child,
.list-ios[inset] > .item-wrapper:first-child .item {
  border-top: 0;
}

.list-ios[inset] > .item:last-child,
.list-ios[inset] > .item-wrapper:last-child .item {
  border-bottom: 0;
}

.list-ios[inset] + ion-list[inset] {
  margin-top: 0;
}

.list-ios[no-lines] ion-list-header,
.list-ios[no-lines] ion-item-options,
.list-ios[no-lines] .item,
.list-ios[no-lines] .item .item-inner {
  border-width: 0;
}

.list-header-ios {
  padding-left: 16px;
  position: relative;
  border-bottom: 0.55px solid #c8c7cc;
  font-size: 1.2rem;
  font-weight: 500;
  letter-spacing: 0.1rem;
  text-transform: uppercase;
  color: #333;
  background: transparent;
}

.list-header-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.list-header-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.list-header-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.list-header-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.list-header-ios-dark {
  color: #fff;
  background-color: #000000;
}

.list-header-ios-menuinicial {
  color: #000;
  background-color: white;
}

.list-md {
  margin: -1px 0 16px;
}

.list-md .item-block .item-inner {
  border-bottom: 1px solid #dedede;
}

.list-md > .item-block:last-child ion-label,
.list-md > .item-block:last-child .item-inner,
.list-md > .item-wrapper:last-child ion-label,
.list-md > .item-wrapper:last-child .item-inner {
  border-bottom: 0;
}

.list-md > ion-input:last-child::after {
  left: 0;
}

.list-md ion-item-options {
  border-bottom: 1px solid #dedede;
}

.list-md ion-item-options .button {
  margin: 0;
  border-radius: 0;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.list-md ion-item-options .button::before {
  margin: 0 auto;
}

.list-md .item[no-lines],
.list-md .item[no-lines] .item-inner {
  border-width: 0;
}

.list-md + ion-list ion-list-header {
  margin-top: -16px;
}

.list-md[inset] {
  margin: 16px;
  border-radius: 2px;
}

.list-md[inset] .item:first-child {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  border-top-width: 0;
}

.list-md[inset] .item:last-child {
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
  border-bottom-width: 0;
}

.list-md[inset] .item-input {
  padding-left: 0;
  padding-right: 0;
}

.list-md[inset] + ion-list[inset] {
  margin-top: 0;
}

.list-md[inset] ion-list-header {
  background-color: #fff;
}

.list-md[no-lines] .item-block,
.list-md[no-lines] ion-item-options,
.list-md[no-lines] .item .item-inner {
  border-width: 0;
}

.list-header-md {
  padding-left: 16px;
  margin-bottom: 13px;
  min-height: 4.5rem;
  border-top: 1px solid #dedede;
  font-size: 1.4rem;
  color: #757575;
}

.list-header-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.list-header-md-secondary {
  color: #fff;
  background-color: #969696;
}

.list-header-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.list-header-md-light {
  color: #000;
  background-color: #f4f4f4;
}

.list-header-md-dark {
  color: #fff;
  background-color: #000000;
}

.list-header-md-menuinicial {
  color: #000;
  background-color: white;
}

.list-md .item-input:last-child {
  border-bottom: 1px solid #dedede;
}

.list-wp {
  margin: 0 0 16px;
}

.list-wp .item-block .item-inner {
  border-bottom: 1px solid transparent;
}

.list-wp > .item-block:first-child,
.list-wp > .item-wrapper:first-child .item-block {
  border-top: 1px solid transparent;
}

.list-wp > .item-block:last-child,
.list-wp > .item-wrapper:last-child .item-block {
  border-bottom: 1px solid transparent;
}

.list-wp > .item-block:last-child ion-label,
.list-wp > .item-block:last-child .item-inner,
.list-wp > .item-wrapper:last-child ion-label,
.list-wp > .item-wrapper:last-child .item-inner {
  border-bottom: 0;
}

.list-wp > ion-input:last-child::after {
  left: 0;
}

.list-wp ion-item-options .button {
  margin: 1px 0;
  border-radius: 0;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: calc(100% - 2px);
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.list-wp ion-item-options .button::before {
  margin: 0 auto;
}

.list-wp .item[no-lines],
.list-wp .item[no-lines] .item-inner {
  border-width: 0;
}

.list-wp + ion-list ion-list-header {
  margin-top: -16px;
  padding-top: 0;
}

.list-wp[inset] {
  margin: 16px;
  border-radius: 2px;
}

.list-wp[inset] .item:first-child {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  border-top-width: 0;
}

.list-wp[inset] .item:last-child {
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
  border-bottom-width: 0;
}

.list-wp[inset] .item-input {
  padding-left: 0;
  padding-right: 0;
}

.list-wp[inset] + ion-list[inset] {
  margin-top: 0;
}

.list-wp[inset] ion-list-header {
  background-color: #fff;
}

.list-wp[no-lines] .item,
.list-wp[no-lines] .item .item-inner {
  border-width: 0;
}

.list-header-wp {
  padding-left: 16px;
  border-bottom: 1px solid transparent;
  font-size: 2rem;
  color: #000;
}

.list-header-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.list-header-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.list-header-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.list-header-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.list-header-wp-dark {
  color: #fff;
  background-color: #000000;
}

.list-header-wp-menuinicial {
  color: #000;
  background-color: white;
}

ion-loading {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1000;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  contain: strict;
}

.loading-wrapper {
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  opacity: 0;
}

.loading-ios .loading-wrapper {
  border-radius: 8px;
  max-width: 270px;
  max-height: 90%;
  color: #000;
  background: #f8f8f8;
  padding: 24px 34px;
}

.loading-ios .loading-content {
  font-weight: bold;
}

.loading-ios .loading-spinner + .loading-content {
  margin-left: 16px;
}

.loading-ios .spinner-ios line,
.loading-ios .spinner-ios-small line {
  stroke: #69717d;
}

.loading-ios .spinner-bubbles circle {
  fill: #69717d;
}

.loading-ios .spinner-circles circle {
  fill: #69717d;
}

.loading-ios .spinner-crescent circle {
  stroke: #69717d;
}

.loading-ios .spinner-dots circle {
  fill: #69717d;
}

.loading-md .loading-wrapper {
  border-radius: 2px;
  max-width: 280px;
  max-height: 90%;
  color: rgba(0, 0, 0, 0.5);
  background: #fafafa;
  -webkit-box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
  box-shadow: 0 16px 20px rgba(0, 0, 0, 0.4);
  padding: 24px;
}

.loading-md .loading-spinner + .loading-content {
  margin-left: 16px;
}

.loading-md .spinner-ios line,
.loading-md .spinner-ios-small line {
  stroke: #0c031d;
}

.loading-md .spinner-bubbles circle {
  fill: #0c031d;
}

.loading-md .spinner-circles circle {
  fill: #0c031d;
}

.loading-md .spinner-crescent circle {
  stroke: #0c031d;
}

.loading-md .spinner-dots circle {
  fill: #0c031d;
}

.loading-wp .loading-wrapper {
  border-radius: 2px;
  max-width: 280px;
  max-height: 90%;
  color: #fff;
  background: #000;
  padding: 20px;
}

.loading-wp .loading-spinner + .loading-content {
  margin-left: 16px;
}

.loading-wp .spinner-ios line,
.loading-wp .spinner-ios-small line {
  stroke: #fff;
}

.loading-wp .spinner-bubbles circle {
  fill: #fff;
}

.loading-wp .spinner-circles circle {
  fill: #fff;
}

.loading-wp .spinner-crescent circle {
  stroke: #fff;
}

.loading-wp .spinner-dots circle {
  fill: #fff;
}

ion-menu {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  display: none;
  contain: strict;
}

ion-menu.show-menu {
  display: block;
}

.menu-inner {
  left: 0;
  right: auto;
  top: 0;
  bottom: 0;
  -webkit-transform: translate3d(-9999px,  0,  0);
  transform: translate3d(-9999px,  0,  0);
  position: absolute;
  display: block;
  width: 304px;
  height: 100%;
  contain: strict;
}

.menu-inner > ion-header,
.menu-inner > ion-content,
.menu-inner > ion-footer {
  position: absolute;
}

ion-menu[side=left] > .menu-inner {
  right: auto;
  left: 0;
}

ion-menu[side=right] > .menu-inner {
  right: 0;
  left: auto;
}

ion-menu[side=end] > .menu-inner {
  left: auto;
  right: 0;
}

ion-menu ion-backdrop {
  z-index: -1;
  display: none;
  opacity: .01;
}

.menu-content {
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
}

.menu-content-open {
  cursor: pointer;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

.menu-content-open ion-pane,
.menu-content-open ion-content,
.menu-content-open .toolbar {
  pointer-events: none;
}

@media (max-width: 340px) {
  .menu-inner {
    width: 264px;
  }
}

ion-menu[type=reveal] {
  z-index: 0;
}

ion-menu[type=reveal].show-menu .menu-inner {
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
}

ion-menu[type=overlay] {
  z-index: 80;
}

ion-menu[type=overlay] .show-backdrop {
  display: block;
}

.ios .menu-inner {
  background: #fff;
}

.ios .menu-content-reveal {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.ios .menu-content-push {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.ios ion-menu[type=overlay] .menu-inner {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.md .menu-inner {
  background: #fff;
}

.md .menu-content-reveal {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.md .menu-content-push {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.md ion-menu[type=overlay] .menu-inner {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}

.wp .menu-inner {
  background: #f2f2f2;
}

ion-modal {
  left: 0;
  top: 0;
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  contain: strict;
}

@media not all and (min-width: 768px) and (min-height: 600px) {
  ion-modal ion-backdrop {
    visibility: hidden;
  }
}

.modal-wrapper {
  z-index: 10;
  height: 100%;
  contain: strict;
}

@media only screen and (min-width: 768px) and (min-height: 600px) {
  .modal-wrapper {
    left: calc(50% - (600px/2));
    top: calc(50% - (500px/2));
    position: absolute;
    width: 600px;
    height: 500px;
  }
}

@media only screen and (min-width: 768px) and (min-height: 768px) {
  .modal-wrapper {
    left: calc(50% - (600px/2));
    top: calc(50% - (600px/2));
    position: absolute;
    width: 600px;
    height: 600px;
  }
}

.ios .modal-wrapper {
  -webkit-transform: translate3d(0,  100%,  0);
  transform: translate3d(0,  100%,  0);
}

@media only screen and (min-width: 768px) and (min-height: 600px) {
  .ios .modal-wrapper {
    border-radius: 10px;
    overflow: hidden;
  }
}

.md .modal-wrapper {
  -webkit-transform: translate3d(0,  40px,  0);
  transform: translate3d(0,  40px,  0);
  opacity: .01;
}

@media only screen and (min-width: 768px) and (min-height: 600px) {
  .md .modal-wrapper {
    border-radius: 2px;
    overflow: hidden;
    -webkit-box-shadow: 0 28px 48px rgba(0, 0, 0, 0.4);
    box-shadow: 0 28px 48px rgba(0, 0, 0, 0.4);
  }
}

.wp .modal-wrapper {
  -webkit-transform: translate3d(0,  40px,  0);
  transform: translate3d(0,  40px,  0);
  opacity: .01;
}

.note-ios {
  color: #aeacb4;
}

.note-ios-primary {
  color: #0c031d;
}

.note-ios-secondary {
  color: #969696;
}

.note-ios-danger {
  color: #7e1111;
}

.note-ios-light {
  color: #f4f4f4;
}

.note-ios-dark {
  color: #000000;
}

.note-ios-menuinicial {
  color: white;
}

.note-md {
  color: #c5c5c5;
}

.note-md-primary {
  color: #0c031d;
}

.note-md-secondary {
  color: #969696;
}

.note-md-danger {
  color: #7e1111;
}

.note-md-light {
  color: #f4f4f4;
}

.note-md-dark {
  color: #000000;
}

.note-md-menuinicial {
  color: white;
}

.note-wp {
  color: rgba(0, 0, 0, 0.5);
}

.note-wp-primary {
  color: #0c031d;
}

.note-wp-secondary {
  color: #969696;
}

.note-wp-danger {
  color: #7e1111;
}

.note-wp-light {
  color: #f4f4f4;
}

.note-wp-dark {
  color: #000000;
}

.note-wp-menuinicial {
  color: white;
}

ion-picker-cmp {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 1000;
  display: block;
  width: 100%;
  height: 100%;
  contain: strict;
}

.picker-toolbar {
  z-index: 1;
  width: 100%;
  contain: strict;
}

.picker-wrapper {
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-transform: translate3d(0,  100%,  0);
  transform: translate3d(0,  100%,  0);
  position: absolute;
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  max-width: 500px;
  contain: strict;
}

.picker-columns {
  margin-bottom: constant(safe-area-inset-bottom);
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  contain: strict;
}

.picker-col {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 100%;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  contain: content;
}

.picker-opts {
  position: relative;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  max-width: 100%;
}

.picker-prefix {
  text-align: right;
  text-align: end;
  position: relative;
  -webkit-box-flex: 2;
  -webkit-flex: 2;
  -ms-flex: 2;
  flex: 2;
  min-width: 45%;
  max-width: 50%;
  white-space: nowrap;
}

.picker-suffix {
  text-align: left;
  text-align: start;
  position: relative;
  -webkit-box-flex: 2;
  -webkit-flex: 2;
  -ms-flex: 2;
  flex: 2;
  min-width: 45%;
  max-width: 50%;
  white-space: nowrap;
}

.picker-opt {
  left: 0;
  top: 0;
  text-align: center;
  position: absolute;
  display: block;
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  will-change: transform;
  contain: strict;
}

.picker-opt.picker-opt-disabled {
  pointer-events: none;
}

.picker-opt-disabled {
  opacity: 0;
}

.picker-opts-left {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.picker-opts-right {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.picker-above-highlight,
.picker-below-highlight {
  display: none;
  pointer-events: none;
}

.picker-ios .picker-wrapper {
  height: 260px;
  border-top: 1px solid #c8c7cc;
  background: #fff;
}

.picker-ios .picker-toolbar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 44px;
  border-bottom: 0.55px solid #c8c7cc;
  background: #fff;
}

.picker-ios .picker-toolbar-button {
  text-align: right;
  text-align: end;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.picker-ios .picker-toolbar-button:last-child .picker-button {
  font-weight: 600;
}

.picker-ios .picker-toolbar-cancel {
  text-align: left;
  text-align: start;
  font-weight: normal;
}

.picker-ios .picker-button,
.picker-ios .picker-button.activated {
  margin: 0;
  height: 44px;
  color: #0c031d;
  background: transparent;
}

.picker-columns {
  height: 215px;
  -webkit-perspective: 1000px;
  perspective: 1000px;
}

.picker-ios .picker-col {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  padding: 0 4px;
}

.picker-ios .picker-prefix,
.picker-ios .picker-suffix,
.picker-ios .picker-opts {
  top: 77px;
  font-size: 20px;
  line-height: 42px;
  color: #000;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  pointer-events: none;
}

.picker-ios .picker-opt {
  margin: 0;
  -webkit-transform-origin: center center;
  transform-origin: center center;
  height: 4.6rem;
  font-size: 20px;
  line-height: 42px;
  color: #000;
  background: transparent;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  pointer-events: auto;
  padding: 0;
}

.picker-ios .picker-above-highlight {
  left: 0;
  top: 0;
  -webkit-transform: translate3d(0,  0,  90px);
  transform: translate3d(0,  0,  90px);
  position: absolute;
  z-index: 10;
  display: block;
  width: 100%;
  height: 81px;
  border-bottom: 1px solid #c8c7cc;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, white), to(rgba(255, 255, 255, 0.7)));
  background: linear-gradient(to bottom, white 20%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-ios .picker-below-highlight {
  left: 0;
  top: 115px;
  -webkit-transform: translate3d(0,  0,  90px);
  transform: translate3d(0,  0,  90px);
  position: absolute;
  z-index: 11;
  display: block;
  width: 100%;
  height: 119px;
  border-top: 1px solid #c8c7cc;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, white), to(rgba(255, 255, 255, 0.7)));
  background: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-md .picker-wrapper {
  height: 260px;
  border-top: 0.55px solid #dedede;
  background: #fff;
}

.picker-md .picker-toolbar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  height: 44px;
  background: #fff;
}

.picker-md .picker-button,
.picker-md .picker-button.activated {
  margin: 0;
  height: 44px;
  color: #0c031d;
  background: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.picker-md .picker-columns {
  height: 216px;
  -webkit-perspective: 1800px;
  perspective: 1800px;
}

.picker-md .picker-col {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  padding: 0 8px;
}

.picker-md .picker-prefix,
.picker-md .picker-suffix,
.picker-md .picker-opts {
  top: 77px;
  font-size: 22px;
  line-height: 42px;
  color: #000;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  pointer-events: none;
}

.picker-md .picker-opt {
  margin: 0;
  height: 4.3rem;
  font-size: 22px;
  line-height: 42px;
  color: #000;
  background: transparent;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  pointer-events: auto;
  padding: 0;
}

.picker-md .picker-prefix,
.picker-md .picker-suffix,
.picker-md .picker-opt.picker-opt-selected {
  color: #0c031d;
}

.picker-md .picker-above-highlight {
  left: 0;
  top: 0;
  -webkit-transform: translate3d(0,  0,  90px);
  transform: translate3d(0,  0,  90px);
  position: absolute;
  z-index: 10;
  width: 100%;
  height: 81px;
  border-bottom: 1px solid #dedede;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, white), to(rgba(255, 255, 255, 0.7)));
  background: linear-gradient(to bottom, white 20%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-md .picker-below-highlight {
  left: 0;
  top: 115px;
  -webkit-transform: translate3d(0,  0,  90px);
  transform: translate3d(0,  0,  90px);
  position: absolute;
  z-index: 11;
  width: 100%;
  height: 119px;
  border-top: 1px solid #dedede;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, white), to(rgba(255, 255, 255, 0.7)));
  background: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-wp .picker-wrapper {
  height: 260px;
  border-top: 0.55px solid transparent;
  background: #fff;
}

.picker-wp .picker-toolbar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  height: 44px;
  border-width: 0.55px;
  background: #fff;
}

.picker-wp .picker-toolbar-button {
  text-align: right;
  text-align: end;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.picker-wp .picker-toolbar-cancel {
  text-align: left;
  text-align: start;
  font-weight: normal;
}

.picker-wp .picker-button,
.picker-wp .picker-button.activated {
  margin: 0;
  height: 44px;
  color: #0c031d;
  background: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.picker-wp .picker-columns {
  height: 216px;
  -webkit-perspective: 1800px;
  perspective: 1800px;
}

.picker-wp .picker-col {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  padding: 0 4px;
}

.picker-wp .picker-prefix,
.picker-wp .picker-suffix,
.picker-wp .picker-opts {
  top: 77px;
  font-size: 22px;
  line-height: 42px;
  color: #000;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  pointer-events: none;
}

.picker-wp .picker-opt {
  margin: 0;
  height: 4.2rem;
  font-size: 22px;
  line-height: 42px;
  color: #000;
  background: transparent;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  pointer-events: auto;
  padding: 0;
}

.picker-wp .picker-prefix,
.picker-wp .picker-suffix,
.picker-wp .picker-opt-selected {
  color: #0c031d;
}

.picker-wp .picker-above-highlight {
  left: 0;
  top: 0;
  -webkit-transform: translate3d(0,  0,  90px);
  transform: translate3d(0,  0,  90px);
  position: absolute;
  z-index: 10;
  width: 100%;
  height: 81px;
  border-bottom: 1px solid transparent;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, white), to(rgba(255, 255, 255, 0.7)));
  background: linear-gradient(to bottom, white 20%, rgba(255, 255, 255, 0.7) 100%);
}

.picker-wp .picker-below-highlight {
  left: 0;
  top: 115px;
  -webkit-transform: translate3d(0,  0,  90px);
  transform: translate3d(0,  0,  90px);
  position: absolute;
  z-index: 11;
  width: 100%;
  height: 119px;
  border-top: 1px solid transparent;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, white), to(rgba(255, 255, 255, 0.7)));
  background: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0.7) 100%);
}

ion-popover {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1000;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.popover-wrapper {
  z-index: 10;
  opacity: 0;
}

.popover-content {
  position: absolute;
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: auto;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.popover-content ion-content,
.popover-content .scroll-content {
  contain: none;
}

.popover-content .scroll-content {
  position: relative;
}

.popover-ios .popover-content {
  border-radius: 10px;
  width: 200px;
  min-width: 0;
  min-height: 0;
  max-height: 90%;
  color: #000;
  background: #fff;
}

.popover-ios .popover-arrow {
  position: absolute;
  display: block;
  overflow: hidden;
  width: 20px;
  height: 10px;
}

.popover-ios .popover-arrow::after {
  left: 3px;
  top: 3px;
  border-radius: 3px;
  position: absolute;
  z-index: 10;
  width: 14px;
  height: 14px;
  background-color: #fff;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.popover-ios.popover-bottom .popover-arrow {
  top: auto;
  bottom: -10px;
}

.popover-ios.popover-bottom .popover-arrow::after {
  top: -6px;
}

.popover-md .popover-content {
  border-radius: 2px;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  width: 250px;
  min-width: 0;
  min-height: 0;
  max-height: 90%;
  color: #000;
  background: #fff;
  -webkit-box-shadow: 0 3px 12px 2px rgba(0, 0, 0, 0.3);
  box-shadow: 0 3px 12px 2px rgba(0, 0, 0, 0.3);
}

.popover-md .popover-viewport {
  opacity: 0;
  -webkit-transition-delay: 100ms;
  transition-delay: 100ms;
}

.popover-wp .popover-content {
  border-radius: 0;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  width: 200px;
  min-width: 0;
  min-height: 0;
  max-height: 90%;
  border: 2px solid #ccc;
  color: #000;
  background: #fff;
}

.popover-wp .popover-viewport {
  opacity: 0;
  -webkit-transition-delay: 100ms;
  transition-delay: 100ms;
}

.radio-ios {
  position: relative;
  display: inline-block;
}

.radio-ios .radio-icon {
  position: relative;
  display: block;
  width: 16px;
  height: 21px;
}

.radio-ios .radio-checked .radio-inner {
  left: 7px;
  top: 4px;
  position: absolute;
  width: 5px;
  height: 12px;
  border-width: 2px;
  border-top-width: 0;
  border-left-width: 0;
  border-style: solid;
  border-color: #0c031d;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.radio-ios.radio-disabled,
.item-ios.item-radio-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.item-ios .radio-ios {
  position: static;
  display: block;
  margin: 8px 11px 8px 8px;
}

.item-ios .radio-ios[item-left], .item-ios .radio-ios[item-start] {
  margin: 8px 21px 8px 3px;
}

.item-radio.item-ios ion-label {
  margin-left: 0;
}

.item-radio-checked.item-ios ion-label {
  color: #0c031d;
}

.item-radio-ios-primary.item-radio-checked ion-label {
  color: #0c031d;
}

.radio-ios-primary .radio-checked {
  color: #0c031d;
}

.radio-ios-primary .radio-checked .radio-inner {
  border-color: #0c031d;
}

.item-radio-ios-secondary.item-radio-checked ion-label {
  color: #969696;
}

.radio-ios-secondary .radio-checked {
  color: #969696;
}

.radio-ios-secondary .radio-checked .radio-inner {
  border-color: #969696;
}

.item-radio-ios-danger.item-radio-checked ion-label {
  color: #7e1111;
}

.radio-ios-danger .radio-checked {
  color: #7e1111;
}

.radio-ios-danger .radio-checked .radio-inner {
  border-color: #7e1111;
}

.item-radio-ios-light.item-radio-checked ion-label {
  color: #f4f4f4;
}

.radio-ios-light .radio-checked {
  color: #f4f4f4;
}

.radio-ios-light .radio-checked .radio-inner {
  border-color: #f4f4f4;
}

.item-radio-ios-dark.item-radio-checked ion-label {
  color: #000000;
}

.radio-ios-dark .radio-checked {
  color: #000000;
}

.radio-ios-dark .radio-checked .radio-inner {
  border-color: #000000;
}

.item-radio-ios-menuinicial.item-radio-checked ion-label {
  color: white;
}

.radio-ios-menuinicial .radio-checked {
  color: white;
}

.radio-ios-menuinicial .radio-checked .radio-inner {
  border-color: white;
}

.radio-md {
  position: relative;
  display: inline-block;
}

.radio-md .radio-icon {
  left: 0;
  top: 0;
  margin: 0;
  border-radius: 50%;
  position: relative;
  display: block;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: #787878;
}

.radio-md .radio-inner {
  left: 2px;
  top: 2px;
  border-radius: 50%;
  position: absolute;
  width: 8px;
  height: 8px;
  background-color: #0c031d;
  -webkit-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
  -webkit-transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
  transition: transform 280ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 280ms cubic-bezier(0.4, 0, 0.2, 1);
}

.radio-md .radio-checked {
  border-color: #0c031d;
}

.radio-md .radio-checked .radio-inner {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}

.radio-md.radio-disabled,
.item-md.item-radio-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.item-md .radio-md {
  position: static;
  display: block;
  margin: 9px 10px 9px 0;
}

.item-md .radio-md[item-left], .item-md .radio-md[item-start] {
  margin: 11px 36px 10px 4px;
}

.item-radio.item-md ion-label {
  margin-left: 0;
}

.item-radio-checked.item-md ion-label {
  color: #0c031d;
}

.item-radio-md-primary.item-radio-checked ion-label {
  color: #0c031d;
}

.radio-md-primary .radio-checked {
  border-color: #0c031d;
}

.radio-md-primary .radio-inner {
  background-color: #0c031d;
}

.item-radio-md-secondary.item-radio-checked ion-label {
  color: #969696;
}

.radio-md-secondary .radio-checked {
  border-color: #969696;
}

.radio-md-secondary .radio-inner {
  background-color: #969696;
}

.item-radio-md-danger.item-radio-checked ion-label {
  color: #7e1111;
}

.radio-md-danger .radio-checked {
  border-color: #7e1111;
}

.radio-md-danger .radio-inner {
  background-color: #7e1111;
}

.item-radio-md-light.item-radio-checked ion-label {
  color: #f4f4f4;
}

.radio-md-light .radio-checked {
  border-color: #f4f4f4;
}

.radio-md-light .radio-inner {
  background-color: #f4f4f4;
}

.item-radio-md-dark.item-radio-checked ion-label {
  color: #000000;
}

.radio-md-dark .radio-checked {
  border-color: #000000;
}

.radio-md-dark .radio-inner {
  background-color: #000000;
}

.item-radio-md-menuinicial.item-radio-checked ion-label {
  color: white;
}

.radio-md-menuinicial .radio-checked {
  border-color: white;
}

.radio-md-menuinicial .radio-inner {
  background-color: white;
}

.radio-wp {
  position: relative;
  display: inline-block;
}

.radio-wp .radio-icon {
  left: 0;
  top: 0;
  margin: 0;
  border-radius: 50%;
  position: relative;
  display: block;
  width: 16px;
  height: 16px;
  border-width: 2px;
  border-style: solid;
  border-color: #333;
}

.radio-wp .radio-inner {
  left: 2px;
  top: 2px;
  border-radius: 50%;
  position: absolute;
  display: none;
  width: 8px;
  height: 8px;
  background-color: #333;
}

.radio-wp .radio-checked {
  border-color: #0c031d;
}

.radio-wp .radio-checked .radio-inner {
  display: block;
}

.radio-wp.radio-disabled,
.item-wp.item-radio-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.item-wp .radio-wp {
  position: static;
  display: block;
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
  margin: 9px 20px 9px 4px;
}

.item-wp .radio-wp[item-right], .item-wp .radio-wp[item-end] {
  -webkit-box-ordinal-group: 1;
  -webkit-order: 0;
  -ms-flex-order: 0;
  order: 0;
  margin: 11px 10px 10px 0;
}

.item-radio.item-wp ion-label {
  margin-left: 0;
}

.radio-wp-primary .radio-checked {
  border-color: #0c031d;
}

.radio-wp-secondary .radio-checked {
  border-color: #969696;
}

.radio-wp-danger .radio-checked {
  border-color: #7e1111;
}

.radio-wp-light .radio-checked {
  border-color: #f4f4f4;
}

.radio-wp-dark .radio-checked {
  border-color: #000000;
}

.radio-wp-menuinicial .radio-checked {
  border-color: white;
}

.item-range .item-inner {
  overflow: visible;
  width: 100%;
}

.item-range .input-wrapper {
  overflow: visible;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
}

.item-range ion-range {
  width: 100%;
}

.item-range ion-range ion-label {
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

ion-range {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

ion-range ion-label {
  -webkit-box-flex: initial;
  -webkit-flex: initial;
  -ms-flex: initial;
  flex: initial;
}

ion-range ion-icon {
  min-height: 2.4rem;
  font-size: 2.4rem;
  line-height: 1;
}

.range-slider {
  position: relative;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  cursor: pointer;
}

.range-ios {
  padding: 8px 16px;
}

.range-ios [range-left] {
  margin: 0 20px 0 0;
}

.range-ios [range-right] {
  margin: 0 0 0 20px;
}

.range-ios.range-has-pin {
  padding-top: 20px;
}

.range-ios .range-slider {
  height: 42px;
}

.range-ios .range-bar {
  left: 0;
  top: 21px;
  border-radius: 1px;
  position: absolute;
  width: 100%;
  height: 1px;
  background: #bdbdbd;
  pointer-events: none;
}

.range-ios.range-pressed .range-bar-active {
  will-change: left, right;
}

.range-ios.range-pressed .range-knob-handle {
  will-change: left;
}

.range-ios .range-bar-active {
  bottom: 0;
  width: auto;
  background: #0c031d;
}

.range-ios .range-knob-handle {
  left: 0;
  top: 21px;
  margin-left: -21px;
  margin-top: -21px;
  text-align: center;
  position: absolute;
  width: 42px;
  height: 42px;
}

.range-ios .range-knob {
  left: 7px;
  top: 7px;
  border-radius: 50%;
  position: absolute;
  width: 28px;
  height: 28px;
  background: #fff;
  -webkit-box-shadow: 0 3px 1px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.02);
  box-shadow: 0 3px 1px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.02);
  pointer-events: none;
}

.range-ios .range-tick {
  margin-left: -0.5px;
  border-radius: 0;
  position: absolute;
  top: 17.5px;
  width: 1px;
  height: 8px;
  background: #bdbdbd;
  pointer-events: none;
}

.range-ios .range-tick-active {
  background: #0c031d;
}

.range-ios .range-pin {
  text-align: center;
  border-radius: 50px;
  -webkit-transform: translate3d(0,  28px,  0) scale(0.01);
  transform: translate3d(0,  28px,  0) scale(0.01);
  position: relative;
  top: -20px;
  display: inline-block;
  min-width: 28px;
  font-size: 12px;
  color: #000;
  background: transparent;
  -webkit-transition: -webkit-transform 120ms ease;
  transition: -webkit-transform 120ms ease;
  transition: transform 120ms ease;
  transition: transform 120ms ease, -webkit-transform 120ms ease;
  padding: 8px;
}

.range-ios .range-knob-pressed .range-pin {
  -webkit-transform: translate3d(0,  0,  0) scale(1);
  transform: translate3d(0,  0,  0) scale(1);
}

.range-ios.range-disabled {
  opacity: .5;
}

.range-ios-primary .range-bar-active,
.range-ios-primary .range-tick-active {
  background: #0c031d;
}

.range-ios-secondary .range-bar-active,
.range-ios-secondary .range-tick-active {
  background: #969696;
}

.range-ios-danger .range-bar-active,
.range-ios-danger .range-tick-active {
  background: #7e1111;
}

.range-ios-light .range-bar-active,
.range-ios-light .range-tick-active {
  background: #f4f4f4;
}

.range-ios-dark .range-bar-active,
.range-ios-dark .range-tick-active {
  background: #000000;
}

.range-ios-menuinicial .range-bar-active,
.range-ios-menuinicial .range-tick-active {
  background: white;
}

.range-md {
  padding: 8px;
}

.range-md [range-left] {
  margin: 0 12px 0 0;
}

.range-md [range-right] {
  margin: 0 0 0 12px;
}

.range-md.range-has-pin {
  padding-top: 28px;
}

.range-md .range-slider {
  height: 42px;
}

.range-md .range-bar {
  left: 0;
  top: 21px;
  position: absolute;
  width: 100%;
  height: 2px;
  background: #bdbdbd;
  pointer-events: none;
}

.range-md.range-pressed .range-bar-active {
  will-change: left, right;
}

.range-md.range-pressed .range-knob-handle {
  will-change: left;
}

.range-md .range-bar-active {
  bottom: 0;
  width: auto;
  background: #0c031d;
}

.range-md .range-knob-handle {
  left: 0;
  top: 21px;
  margin-left: -21px;
  margin-top: -21px;
  text-align: center;
  position: absolute;
  width: 42px;
  height: 42px;
}

.range-md .range-knob {
  left: 12px;
  top: 13px;
  border-radius: 50%;
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  background: #0c031d;
  -webkit-transform: scale(0.67);
  transform: scale(0.67);
  -webkit-transition-duration: 120ms;
  transition-duration: 120ms;
  -webkit-transition-property: background-color, border, -webkit-transform;
  transition-property: background-color, border, -webkit-transform;
  transition-property: transform, background-color, border;
  transition-property: transform, background-color, border, -webkit-transform;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
  pointer-events: none;
}

.range-md .range-tick {
  margin-left: -1px;
  border-radius: 50%;
  position: absolute;
  top: 21px;
  z-index: 1;
  width: 2px;
  height: 2px;
  background: #000;
  pointer-events: none;
}

.range-md .range-tick-active {
  background: #000;
}

.range-md .range-pin {
  padding: 8px 0;
  text-align: center;
  border-radius: 50%;
  -webkit-transform: translate3d(0,  28px,  0) scale(0.01);
  transform: translate3d(0,  28px,  0) scale(0.01);
  position: relative;
  top: -20px;
  display: inline-block;
  min-width: 28px;
  height: 28px;
  font-size: 12px;
  color: #fff;
  background: #0c031d;
  -webkit-transition: background-color 120ms ease, -webkit-transform 120ms ease;
  transition: background-color 120ms ease, -webkit-transform 120ms ease;
  transition: transform 120ms ease, background-color 120ms ease;
  transition: transform 120ms ease, background-color 120ms ease, -webkit-transform 120ms ease;
}

.range-md .range-pin::before {
  left: 50%;
  top: 3px;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  border-bottom-left-radius: 0;
  margin-left: -13px;
  position: absolute;
  z-index: -1;
  width: 26px;
  height: 26px;
  background: #0c031d;
  content: "";
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: background-color 120ms ease;
  transition: background-color 120ms ease;
}

.range-md .range-knob-pressed .range-pin {
  -webkit-transform: translate3d(0,  0,  0) scale(1);
  transform: translate3d(0,  0,  0) scale(1);
}

.range-md:not(.range-has-pin) .range-knob-pressed .range-knob {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.range-md .range-knob-min.range-knob-min .range-knob {
  border: 2px solid #bdbdbd;
  background: #fff;
}

.range-md .range-knob-min.range-knob-min .range-pin,
.range-md .range-knob-min.range-knob-min .range-pin::before {
  color: #fff;
  background: #bdbdbd;
}

.range-md.range-disabled .range-bar-active {
  background-color: #bdbdbd;
}

.range-md.range-disabled .range-knob {
  outline: 5px solid #fff;
  background-color: #bdbdbd;
  -webkit-transform: scale(0.55);
  transform: scale(0.55);
}

.range-md-primary .range-md .range-knob-min.range-knob-min .range-knob {
  border: 2px solid #bdbdbd;
  background: #fff;
}

.range-md-primary .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-primary .range-md .range-knob-min.range-knob-min .range-pin::before {
  color: #fff;
  background: #bdbdbd;
}

.range-md-primary .range-bar-active,
.range-md-primary .range-knob,
.range-md-primary .range-pin,
.range-md-primary .range-pin::before {
  background: #0c031d;
}

.range-md-secondary .range-md .range-knob-min.range-knob-min .range-knob {
  border: 2px solid #bdbdbd;
  background: #fff;
}

.range-md-secondary .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-secondary .range-md .range-knob-min.range-knob-min .range-pin::before {
  color: #fff;
  background: #bdbdbd;
}

.range-md-secondary .range-bar-active,
.range-md-secondary .range-knob,
.range-md-secondary .range-pin,
.range-md-secondary .range-pin::before {
  background: #969696;
}

.range-md-danger .range-md .range-knob-min.range-knob-min .range-knob {
  border: 2px solid #bdbdbd;
  background: #fff;
}

.range-md-danger .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-danger .range-md .range-knob-min.range-knob-min .range-pin::before {
  color: #fff;
  background: #bdbdbd;
}

.range-md-danger .range-bar-active,
.range-md-danger .range-knob,
.range-md-danger .range-pin,
.range-md-danger .range-pin::before {
  background: #7e1111;
}

.range-md-light .range-md .range-knob-min.range-knob-min .range-knob {
  border: 2px solid #bdbdbd;
  background: #fff;
}

.range-md-light .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-light .range-md .range-knob-min.range-knob-min .range-pin::before {
  color: #fff;
  background: #bdbdbd;
}

.range-md-light .range-bar-active,
.range-md-light .range-knob,
.range-md-light .range-pin,
.range-md-light .range-pin::before {
  background: #f4f4f4;
}

.range-md-dark .range-md .range-knob-min.range-knob-min .range-knob {
  border: 2px solid #bdbdbd;
  background: #fff;
}

.range-md-dark .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-dark .range-md .range-knob-min.range-knob-min .range-pin::before {
  color: #fff;
  background: #bdbdbd;
}

.range-md-dark .range-bar-active,
.range-md-dark .range-knob,
.range-md-dark .range-pin,
.range-md-dark .range-pin::before {
  background: #000000;
}

.range-md-menuinicial .range-md .range-knob-min.range-knob-min .range-knob {
  border: 2px solid #bdbdbd;
  background: #fff;
}

.range-md-menuinicial .range-md .range-knob-min.range-knob-min .range-pin,
.range-md-menuinicial .range-md .range-knob-min.range-knob-min .range-pin::before {
  color: #fff;
  background: #bdbdbd;
}

.range-md-menuinicial .range-bar-active,
.range-md-menuinicial .range-knob,
.range-md-menuinicial .range-pin,
.range-md-menuinicial .range-pin::before {
  background: white;
}

.range-wp {
  padding: 8px;
}

.range-wp [range-left] {
  margin: 0 12px 0 0;
}

.range-wp [range-right] {
  margin: 0 0 0 12px;
}

.range-wp.range-has-pin {
  padding-top: 28px;
}

.range-wp .range-slider {
  height: 42px;
}

.range-wp .range-bar {
  left: 0;
  top: 21px;
  position: absolute;
  width: 100%;
  height: 2px;
  background: #bdbdbd;
  pointer-events: none;
}

.range-wp.range-pressed .range-bar-active {
  will-change: left, right;
}

.range-wp.range-pressed .range-knob-handle {
  will-change: left;
}

.range-wp .range-bar-active {
  bottom: 0;
  width: auto;
  background: #0c031d;
}

.range-wp .range-knob-handle {
  left: 0;
  top: 21px;
  margin-left: -21px;
  margin-top: -21px;
  text-align: center;
  position: absolute;
  width: 42px;
  height: 42px;
}

.range-wp .range-knob {
  left: 17px;
  top: 10px;
  border-radius: 4px;
  position: absolute;
  width: 8px;
  height: 24px;
  background: #0c031d;
  pointer-events: none;
}

.range-wp .range-tick {
  margin-left: -1px;
  border-radius: 4px;
  position: absolute;
  top: 19px;
  width: 2px;
  height: 6px;
  background: #bdbdbd;
  pointer-events: none;
}

.range-wp .range-tick-active {
  background: #0c031d;
}

.range-wp .range-pin {
  text-align: center;
  border-radius: 50px;
  -webkit-transform: translate3d(0,  28px,  0) scale(0.01);
  transform: translate3d(0,  28px,  0) scale(0.01);
  position: relative;
  top: -24px;
  display: inline-block;
  min-width: 28px;
  font-size: 12px;
  color: #fff;
  background: #0c031d;
  -webkit-transition: -webkit-transform 120ms ease;
  transition: -webkit-transform 120ms ease;
  transition: transform 120ms ease;
  transition: transform 120ms ease, -webkit-transform 120ms ease;
  padding: 8px;
}

.range-wp .range-knob-pressed .range-pin {
  -webkit-transform: translate3d(0,  0,  0) scale(1);
  transform: translate3d(0,  0,  0) scale(1);
}

.range-wp.range-disabled {
  opacity: .5;
}

.range-wp-primary .range-bar-active,
.range-wp-primary .range-tick-active,
.range-wp-primary .range-knob,
.range-wp-primary .range-pin {
  background: #0c031d;
}

.range-wp-secondary .range-bar-active,
.range-wp-secondary .range-tick-active,
.range-wp-secondary .range-knob,
.range-wp-secondary .range-pin {
  background: #969696;
}

.range-wp-danger .range-bar-active,
.range-wp-danger .range-tick-active,
.range-wp-danger .range-knob,
.range-wp-danger .range-pin {
  background: #7e1111;
}

.range-wp-light .range-bar-active,
.range-wp-light .range-tick-active,
.range-wp-light .range-knob,
.range-wp-light .range-pin {
  background: #f4f4f4;
}

.range-wp-dark .range-bar-active,
.range-wp-dark .range-tick-active,
.range-wp-dark .range-knob,
.range-wp-dark .range-pin {
  background: #000000;
}

.range-wp-menuinicial .range-bar-active,
.range-wp-menuinicial .range-tick-active,
.range-wp-menuinicial .range-knob,
.range-wp-menuinicial .range-pin {
  background: white;
}

ion-refresher {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 0;
  display: none;
  width: 100%;
  height: 60px;
}

ion-refresher.refresher-active {
  display: block;
}

.has-refresher > .scroll-content {
  margin-top: -1px;
  border-top: 1px solid #ddd;
  -webkit-transition: -webkit-transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
  transition: -webkit-transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
  transition: transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
  transition: transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1), -webkit-transform 320ms cubic-bezier(0.36, 0.66, 0.04, 1);
}

ion-refresher-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 100%;
}

.refresher-pulling,
.refresher-refreshing {
  display: none;
  width: 100%;
}

.refresher-pulling-icon,
.refresher-refreshing-icon {
  text-align: center;
  -webkit-transform-origin: center;
  transform-origin: center;
  font-size: 30px;
  color: #000;
  -webkit-transition: 200ms;
  transition: 200ms;
}

.refresher-pulling-text,
.refresher-refreshing-text {
  text-align: center;
  font-size: 16px;
  color: #000;
}

.refresher-refreshing .spinner-ios line,
.refresher-refreshing .spinner-ios-small line,
.refresher-refreshing .spinner-crescent circle {
  stroke: #000;
}

.refresher-refreshing .spinner-bubbles circle,
.refresher-refreshing .spinner-circles circle,
.refresher-refreshing .spinner-dots circle {
  fill: #000;
}

ion-refresher-content[state=pulling] .refresher-pulling {
  display: block;
}

ion-refresher-content[state=ready] .refresher-pulling {
  display: block;
}

ion-refresher-content[state=ready] .refresher-pulling-icon {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

ion-refresher-content[state=refreshing] .refresher-refreshing {
  display: block;
}

ion-refresher-content[state=cancelling] .refresher-pulling {
  display: block;
}

ion-refresher-content[state=cancelling] .refresher-pulling-icon {
  -webkit-transform: scale(0);
  transform: scale(0);
}

ion-refresher-content[state=completing] .refresher-refreshing {
  display: block;
}

ion-refresher-content[state=completing] .refresher-refreshing-icon {
  -webkit-transform: scale(0);
  transform: scale(0);
}

ion-scroll {
  position: relative;
  display: block;
}

ion-scroll.scroll-x .scroll-content {
  overflow-x: auto;
}

ion-scroll.scroll-y .scroll-content {
  overflow-y: auto;
}

ion-scroll[center] .scroll-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

ion-scroll .scroll-content {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  overflow-y: hidden;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  will-change: scroll-position;
}

ion-searchbar {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}

.searchbar-icon {
  pointer-events: none;
}

.searchbar-input-container {
  position: relative;
  display: block;
  -webkit-flex-shrink: 1;
  -ms-flex-negative: 1;
  flex-shrink: 1;
  width: 100%;
}

.searchbar-input {
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  border: 0;
  font-family: inherit;
}

.searchbar-clear-icon {
  margin: 0;
  padding: 0;
  display: none;
  min-height: 0;
}

.searchbar-has-value.searchbar-has-focus .searchbar-clear-icon {
  display: block;
}

.searchbar-ios {
  padding: 0 8px;
  min-height: 44px;
  border-top: 0.55px solid transparent;
  border-bottom: 0.55px solid rgba(0, 0, 0, 0.05);
  background: rgba(0, 0, 0, 0.2);
}

.searchbar-ios .searchbar-search-icon {
  left: 9px;
  top: 9px;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(0,%200,%200,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
  margin-left: calc(50% - 60px);
  position: absolute;
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  background-size: 13px;
}

.searchbar-ios .searchbar-input {
  padding: 0 28px;
  border-radius: 5px;
  height: 3rem;
  font-size: 1.4rem;
  font-weight: 400;
  color: #000;
  background-color: #fff;
}

.searchbar-ios .searchbar-input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.searchbar-ios .searchbar-input:-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.searchbar-ios .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: rgba(0, 0, 0, 0.5);
}

.searchbar-ios .searchbar-clear-icon {
  right: 0;
  top: 0;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
  background-position: center;
  position: absolute;
  width: 30px;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 18px;
}

.searchbar-ios .searchbar-ios-cancel {
  padding: 0 0 0 8px;
  margin-left: 0;
  display: none;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  height: 30px;
  cursor: pointer;
}

.searchbar-ios.searchbar-left-aligned .searchbar-search-icon {
  margin-left: 0;
}

.searchbar-ios.searchbar-left-aligned .searchbar-input {
  padding-left: 30px;
}

.searchbar-ios.searchbar-show-cancel.searchbar-has-focus .searchbar-ios-cancel {
  display: block;
}

.toolbar .searchbar-ios {
  border-bottom-width: 0;
  background: transparent;
}

.toolbar .searchbar-ios .searchbar-input {
  background: rgba(0, 0, 0, 0.08);
}

.toolbar .searchbar-ios .searchbar-ios-cancel {
  padding: 0;
}

.toolbar .searchbar-ios.searchbar-has-focus .searchbar-ios-cancel {
  padding-left: 8px;
}

.searchbar-ios .searchbar-md-cancel {
  display: none;
}

.searchbar-ios-primary .searchbar-ios-cancel {
  color: #0c031d;
}

.searchbar-ios-primary .searchbar-ios-cancel:hover:not(.disable-hover) {
  color: #1f172f;
}

.toolbar-ios-primary .searchbar-ios .searchbar-search-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-primary .searchbar-ios .searchbar-input {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}

.toolbar-ios-primary .searchbar-ios .searchbar-input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-primary .searchbar-ios .searchbar-input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-primary .searchbar-ios .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-primary .searchbar-ios .searchbar-clear-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-primary .searchbar-ios .searchbar-ios-cancel {
  color: #fff;
}

.searchbar-ios-secondary .searchbar-ios-cancel {
  color: #969696;
}

.searchbar-ios-secondary .searchbar-ios-cancel:hover:not(.disable-hover) {
  color: #8a8a8a;
}

.toolbar-ios-secondary .searchbar-ios .searchbar-search-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-secondary .searchbar-ios .searchbar-input {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}

.toolbar-ios-secondary .searchbar-ios .searchbar-input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-secondary .searchbar-ios .searchbar-input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-secondary .searchbar-ios .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-secondary .searchbar-ios .searchbar-clear-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-secondary .searchbar-ios .searchbar-ios-cancel {
  color: #fff;
}

.searchbar-ios-danger .searchbar-ios-cancel {
  color: #7e1111;
}

.searchbar-ios-danger .searchbar-ios-cancel:hover:not(.disable-hover) {
  color: #882424;
}

.toolbar-ios-danger .searchbar-ios .searchbar-search-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-danger .searchbar-ios .searchbar-input {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}

.toolbar-ios-danger .searchbar-ios .searchbar-input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-danger .searchbar-ios .searchbar-input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-danger .searchbar-ios .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-danger .searchbar-ios .searchbar-clear-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-danger .searchbar-ios .searchbar-ios-cancel {
  color: #fff;
}

.searchbar-ios-light .searchbar-ios-cancel {
  color: #f4f4f4;
}

.searchbar-ios-light .searchbar-ios-cancel:hover:not(.disable-hover) {
  color: #e0e0e0;
}

.toolbar-ios-light .searchbar-ios .searchbar-search-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(0,%200,%200,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-light .searchbar-ios .searchbar-input {
  color: #000;
  background: rgba(0, 0, 0, 0.08);
}

.toolbar-ios-light .searchbar-ios .searchbar-input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.toolbar-ios-light .searchbar-ios .searchbar-input:-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.toolbar-ios-light .searchbar-ios .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: rgba(0, 0, 0, 0.5);
}

.toolbar-ios-light .searchbar-ios .searchbar-clear-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-light .searchbar-ios .searchbar-ios-cancel {
  color: #0c031d;
}

.searchbar-ios-dark .searchbar-ios-cancel {
  color: #000000;
}

.searchbar-ios-dark .searchbar-ios-cancel:hover:not(.disable-hover) {
  color: #141414;
}

.toolbar-ios-dark .searchbar-ios .searchbar-search-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(255,%20255,%20255,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-dark .searchbar-ios .searchbar-input {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}

.toolbar-ios-dark .searchbar-ios .searchbar-input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-dark .searchbar-ios .searchbar-input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-dark .searchbar-ios .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: rgba(255, 255, 255, 0.5);
}

.toolbar-ios-dark .searchbar-ios .searchbar-clear-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(255,%20255,%20255,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-dark .searchbar-ios .searchbar-ios-cancel {
  color: #fff;
}

.searchbar-ios-menuinicial .searchbar-ios-cancel {
  color: white;
}

.searchbar-ios-menuinicial .searchbar-ios-cancel:hover:not(.disable-hover) {
  color: #ebebeb;
}

.toolbar-ios-menuinicial .searchbar-ios .searchbar-search-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2013%2013'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M5,1c2.2,0,4,1.8,4,4S7.2,9,5,9S1,7.2,1,5S2.8,1,5,1%20M5,0C2.2,0,0,2.2,0,5s2.2,5,5,5s5-2.2,5-5S7.8,0,5,0%20L5,0z'/><line%20stroke='rgba(0,%200,%200,%200.5)'%20stroke-miterlimit='10'%20x1='12.6'%20y1='12.6'%20x2='8.2'%20y2='8.2'/></svg>");
}

.toolbar-ios-menuinicial .searchbar-ios .searchbar-input {
  color: #000;
  background: rgba(0, 0, 0, 0.08);
}

.toolbar-ios-menuinicial .searchbar-ios .searchbar-input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.toolbar-ios-menuinicial .searchbar-ios .searchbar-input:-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.toolbar-ios-menuinicial .searchbar-ios .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: rgba(0, 0, 0, 0.5);
}

.toolbar-ios-menuinicial .searchbar-ios .searchbar-clear-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='rgba(0,%200,%200,%200.5)'%20d='M403.1,108.9c-81.2-81.2-212.9-81.2-294.2,0s-81.2,212.9,0,294.2c81.2,81.2,212.9,81.2,294.2,0S484.3,190.1,403.1,108.9z%20M352,340.2L340.2,352l-84.4-84.2l-84,83.8L160,339.8l84-83.8l-84-83.8l11.8-11.8l84,83.8l84.4-84.2l11.8,11.8L267.6,256L352,340.2z'/></svg>");
}

.toolbar-ios-menuinicial .searchbar-ios .searchbar-ios-cancel {
  color: #0c031d;
}

.searchbar-ios.searchbar-animated.searchbar-show-cancel .searchbar-ios-cancel {
  display: block;
}

.searchbar-ios.searchbar-animated .searchbar-search-icon,
.searchbar-ios.searchbar-animated .searchbar-input {
  -webkit-transition: all 300ms ease;
  transition: all 300ms ease;
}

.searchbar-animated.searchbar-has-focus .searchbar-ios-cancel {
  opacity: 1;
  pointer-events: auto;
}

.searchbar-animated .searchbar-ios-cancel {
  margin-right: -100%;
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
  opacity: 0;
  -webkit-transition: all 300ms ease;
  transition: all 300ms ease;
  pointer-events: none;
}

.searchbar-md {
  background: inherit;
  padding: 8px;
}

.searchbar-md .searchbar-search-icon {
  left: 16px;
  top: 11px;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='%235b5b5b'%20d='M337.509,305.372h-17.501l-6.571-5.486c20.791-25.232,33.922-57.054,33.922-93.257C347.358,127.632,283.896,64,205.135,64C127.452,64,64,127.632,64,206.629s63.452,142.628,142.225,142.628c35.011,0,67.831-13.167,92.991-34.008l6.561,5.487v17.551L415.18,448L448,415.086L337.509,305.372z%20M206.225,305.372c-54.702,0-98.463-43.887-98.463-98.743c0-54.858,43.761-98.742,98.463-98.742c54.7,0,98.462,43.884,98.462,98.742C304.687,261.485,260.925,305.372,206.225,305.372z'/></svg>");
  width: 21px;
  height: 21px;
}

.searchbar-md .searchbar-md-cancel {
  left: 10px;
  top: 0;
  margin: 0;
  display: none;
  width: 21px;
  height: 100%;
}

.searchbar-md .searchbar-search-icon,
.searchbar-md .searchbar-md-cancel {
  position: absolute;
  background-repeat: no-repeat;
  background-size: 20px;
}

.searchbar-md .searchbar-search-icon.activated,
.searchbar-md .searchbar-md-cancel.activated {
  background-color: transparent;
}

.searchbar-md .searchbar-input {
  padding: 6px 55px;
  border-radius: 2px;
  background-position: left 8px center;
  height: auto;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 3rem;
  color: #141414;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.searchbar-md .searchbar-input::-moz-placeholder {
  color: #aeaeae;
}

.searchbar-md .searchbar-input:-ms-input-placeholder {
  color: #aeaeae;
}

.searchbar-md .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: #aeaeae;
}

.searchbar-md .searchbar-clear-icon {
  right: 13px;
  top: 0;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='%235b5b5b'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
  padding: 0;
  background-position: center;
  position: absolute;
  width: 22px;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 22px;
}

.searchbar-md .searchbar-clear-icon.activated {
  background-color: transparent;
}

.searchbar-md.searchbar-has-focus.searchbar-show-cancel .searchbar-search-icon {
  display: none;
}

.searchbar-md.searchbar-has-focus.searchbar-show-cancel .searchbar-md-cancel {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.toolbar .searchbar-md {
  padding: 3px;
}

.toolbar .searchbar-md .searchbar-md-cancel {
  left: 14px;
}

.searchbar-md .searchbar-ios-cancel {
  display: none;
}

.searchbar-wp {
  background: transparent;
  padding: 8px;
}

.searchbar-wp .searchbar-input-container {
  border: 2px solid rgba(0, 0, 0, 0.5);
}

.searchbar-wp .searchbar-search-icon {
  right: 8px;
  top: 5px;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><path%20fill='%23858585'%20d='M337.509,305.372h-17.501l-6.571-5.486c20.791-25.232,33.922-57.054,33.922-93.257C347.358,127.632,283.896,64,205.135,64C127.452,64,64,127.632,64,206.629s63.452,142.628,142.225,142.628c35.011,0,67.831-13.167,92.991-34.008l6.561,5.487v17.551L415.18,448L448,415.086L337.509,305.372z%20M206.225,305.372c-54.702,0-98.463-43.887-98.463-98.743c0-54.858,43.761-98.742,98.463-98.742c54.7,0,98.462,43.884,98.462,98.742C304.687,261.485,260.925,305.372,206.225,305.372z'/></svg>");
  position: absolute;
  width: 21px;
  height: 21px;
  background-repeat: no-repeat;
  background-size: 20px;
}

.searchbar-wp .searchbar-search-icon.activated {
  background-color: transparent;
}

.searchbar-wp .searchbar-input {
  padding: 0 8px;
  border-radius: 0;
  background-position: left 8px center;
  height: auto;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 3rem;
  color: #141414;
  background-color: #fff;
}

.searchbar-wp .searchbar-input::-moz-placeholder {
  color: #858585;
}

.searchbar-wp .searchbar-input:-ms-input-placeholder {
  color: #858585;
}

.searchbar-wp .searchbar-input::-webkit-input-placeholder {
  text-indent: 0;
  color: #858585;
}

.searchbar-wp .searchbar-clear-icon {
  right: 8px;
  top: 0;
  background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20512%20512'><polygon%20fill='%23858585'%20points='405,136.798%20375.202,107%20256,226.202%20136.798,107%20107,136.798%20226.202,256%20107,375.202%20136.798,405%20256,285.798%20375.202,405%20405,375.202%20285.798,256'/></svg>");
  padding: 0;
  background-position: center;
  position: absolute;
  width: 22px;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 22px;
}

.searchbar-wp .searchbar-clear-icon.activated {
  background-color: transparent;
}

.searchbar-wp.searchbar-has-focus .searchbar-input-container {
  border-color: #0c031d;
}

.searchbar-wp.searchbar-has-value .searchbar-search-icon {
  display: none;
}

.searchbar-wp .searchbar-ios-cancel {
  display: none;
}

.searchbar-wp .searchbar-md-cancel {
  display: none;
}

.toolbar .searchbar-wp {
  padding: 2px;
}

.searchbar-wp-primary.searchbar-has-focus .searchbar-input-container {
  border-color: #0c031d;
}

.searchbar-wp-secondary.searchbar-has-focus .searchbar-input-container {
  border-color: #969696;
}

.searchbar-wp-danger.searchbar-has-focus .searchbar-input-container {
  border-color: #7e1111;
}

.searchbar-wp-light.searchbar-has-focus .searchbar-input-container {
  border-color: #f4f4f4;
}

.searchbar-wp-dark.searchbar-has-focus .searchbar-input-container {
  border-color: #000000;
}

.searchbar-wp-menuinicial.searchbar-has-focus .searchbar-input-container {
  border-color: white;
}

ion-segment {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
}

.segment-button {
  margin-left: 0;
  margin-right: 0;
  text-align: center;
  position: relative;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.segment-ios .segment-button {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 0;
  height: 3.2rem;
  border-width: 1px;
  border-style: solid;
  border-color: #0c031d;
  font-size: 1.3rem;
  line-height: 3rem;
  color: #0c031d;
  background-color: transparent;
}

.segment-ios .segment-button ion-icon {
  font-size: 2.6rem;
  line-height: 2.8rem;
}

.segment-ios .segment-button.segment-activated {
  color: #fff;
  background-color: #0c031d;
  opacity: 1;
  -webkit-transition: 100ms all linear;
  transition: 100ms all linear;
}

.segment-ios .segment-button:hover:not(.segment-activated) {
  background-color: rgba(12, 3, 29, 0.1);
  -webkit-transition: 100ms all linear;
  transition: 100ms all linear;
}

.segment-ios .segment-button:active:not(.segment-activated) {
  background-color: rgba(12, 3, 29, 0.16);
  -webkit-transition: 100ms all linear;
  transition: 100ms all linear;
}

.segment-ios .segment-button:first-of-type {
  border-top-left-radius: 4px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 4px;
  margin-right: 0;
}

.segment-ios .segment-button:not(:first-of-type) {
  border-left-width: 0;
}

.segment-ios .segment-button:last-of-type {
  border-top-left-radius: 0;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 0;
  margin-left: 0;
  border-left-width: 0;
}

[dir="rtl"] .segment-ios .segment-button:first-of-type {
  border-left-width: 0;
}

[dir="rtl"] .segment-ios .segment-button:last-of-type {
  border-left-width: 1px;
}

.segment-ios.segment-disabled {
  opacity: .4;
  pointer-events: none;
}

.segment-ios .segment-button-disabled {
  color: rgba(12, 3, 29, 0.3);
  pointer-events: none;
}

.toolbar-ios .segment-ios {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}

.toolbar-ios .segment-button {
  max-width: 100px;
  height: 2.6rem;
  font-size: 1.2rem;
  line-height: 2.5rem;
}

.toolbar-ios .segment-button ion-icon {
  font-size: 2.2rem;
  line-height: 2.4rem;
}

.segment-ios-primary .segment-button {
  border-color: #0c031d;
  color: #0c031d;
}

.segment-ios-primary .segment-button:hover:not(.segment-activated) {
  background-color: rgba(12, 3, 29, 0.1);
}

.segment-ios-primary .segment-button:active:not(.segment-activated) {
  background-color: rgba(12, 3, 29, 0.16);
}

.segment-ios-primary .segment-button.segment-activated {
  color: #fff;
  background-color: #0c031d;
}

.segment-ios-primary .segment-button-disabled {
  color: rgba(12, 3, 29, 0.3);
}

.toolbar-ios-primary .segment-ios .segment-button.segment-activated {
  color: #0c031d;
}

.segment-ios-secondary .segment-button {
  border-color: #969696;
  color: #969696;
}

.segment-ios-secondary .segment-button:hover:not(.segment-activated) {
  background-color: rgba(150, 150, 150, 0.1);
}

.segment-ios-secondary .segment-button:active:not(.segment-activated) {
  background-color: rgba(150, 150, 150, 0.16);
}

.segment-ios-secondary .segment-button.segment-activated {
  color: #fff;
  background-color: #969696;
}

.segment-ios-secondary .segment-button-disabled {
  color: rgba(150, 150, 150, 0.3);
}

.toolbar-ios-secondary .segment-ios .segment-button.segment-activated {
  color: #969696;
}

.segment-ios-danger .segment-button {
  border-color: #7e1111;
  color: #7e1111;
}

.segment-ios-danger .segment-button:hover:not(.segment-activated) {
  background-color: rgba(126, 17, 17, 0.1);
}

.segment-ios-danger .segment-button:active:not(.segment-activated) {
  background-color: rgba(126, 17, 17, 0.16);
}

.segment-ios-danger .segment-button.segment-activated {
  color: #fff;
  background-color: #7e1111;
}

.segment-ios-danger .segment-button-disabled {
  color: rgba(126, 17, 17, 0.3);
}

.toolbar-ios-danger .segment-ios .segment-button.segment-activated {
  color: #7e1111;
}

.segment-ios-light .segment-button {
  border-color: #f4f4f4;
  color: #f4f4f4;
}

.segment-ios-light .segment-button:hover:not(.segment-activated) {
  background-color: rgba(244, 244, 244, 0.1);
}

.segment-ios-light .segment-button:active:not(.segment-activated) {
  background-color: rgba(244, 244, 244, 0.16);
}

.segment-ios-light .segment-button.segment-activated {
  color: #000;
  background-color: #f4f4f4;
}

.segment-ios-light .segment-button-disabled {
  color: rgba(244, 244, 244, 0.3);
}

.toolbar-ios-light .segment-ios .segment-button.segment-activated {
  color: #f4f4f4;
}

.segment-ios-dark .segment-button {
  border-color: #000000;
  color: #000000;
}

.segment-ios-dark .segment-button:hover:not(.segment-activated) {
  background-color: rgba(0, 0, 0, 0.1);
}

.segment-ios-dark .segment-button:active:not(.segment-activated) {
  background-color: rgba(0, 0, 0, 0.16);
}

.segment-ios-dark .segment-button.segment-activated {
  color: #fff;
  background-color: #000000;
}

.segment-ios-dark .segment-button-disabled {
  color: rgba(0, 0, 0, 0.3);
}

.toolbar-ios-dark .segment-ios .segment-button.segment-activated {
  color: #000000;
}

.segment-ios-menuinicial .segment-button {
  border-color: white;
  color: white;
}

.segment-ios-menuinicial .segment-button:hover:not(.segment-activated) {
  background-color: rgba(255, 255, 255, 0.1);
}

.segment-ios-menuinicial .segment-button:active:not(.segment-activated) {
  background-color: rgba(255, 255, 255, 0.16);
}

.segment-ios-menuinicial .segment-button.segment-activated {
  color: #000;
  background-color: white;
}

.segment-ios-menuinicial .segment-button-disabled {
  color: rgba(255, 255, 255, 0.3);
}

.toolbar-ios-menuinicial .segment-ios .segment-button.segment-activated {
  color: white;
}

.segment-md .segment-button {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 0;
  height: 4.2rem;
  border-bottom-width: 2px;
  border-bottom-style: solid;
  border-bottom-color: rgba(0, 0, 0, 0.1);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 4rem;
  text-transform: uppercase;
  color: #0c031d;
  background-color: transparent;
  opacity: 0.7;
  -webkit-transition: 100ms all linear;
  transition: 100ms all linear;
  padding: 0 6px;
}

.segment-md .segment-button ion-icon {
  font-size: 2.6rem;
  line-height: 4rem;
}

.segment-md .segment-button.activated, .segment-md .segment-button.segment-activated {
  border-color: #0c031d;
  opacity: 1;
}

.segment-md.segment-disabled,
.segment-md .segment-button-disabled {
  opacity: 0.3;
  pointer-events: none;
}

.toolbar .segment-md {
  margin: 0 auto;
}

.toolbar .segment-md .segment-button.activated,
.toolbar .segment-md .segment-button.segment-activated {
  opacity: 1;
}

.segment-md-primary .segment-button {
  color: #0c031d;
}

.segment-md-primary .segment-button.activated, .segment-md-primary .segment-button.segment-activated {
  border-color: #0c031d;
  color: #0c031d;
  opacity: 1;
}

.segment-md-secondary .segment-button {
  color: #969696;
}

.segment-md-secondary .segment-button.activated, .segment-md-secondary .segment-button.segment-activated {
  border-color: #969696;
  color: #969696;
  opacity: 1;
}

.segment-md-danger .segment-button {
  color: #7e1111;
}

.segment-md-danger .segment-button.activated, .segment-md-danger .segment-button.segment-activated {
  border-color: #7e1111;
  color: #7e1111;
  opacity: 1;
}

.segment-md-light .segment-button {
  color: #f4f4f4;
}

.segment-md-light .segment-button.activated, .segment-md-light .segment-button.segment-activated {
  border-color: #f4f4f4;
  color: #f4f4f4;
  opacity: 1;
}

.segment-md-dark .segment-button {
  color: #000000;
}

.segment-md-dark .segment-button.activated, .segment-md-dark .segment-button.segment-activated {
  border-color: #000000;
  color: #000000;
  opacity: 1;
}

.segment-md-menuinicial .segment-button {
  color: white;
}

.segment-md-menuinicial .segment-button.activated, .segment-md-menuinicial .segment-button.segment-activated {
  border-color: white;
  color: white;
  opacity: 1;
}

.segment-wp {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.segment-wp .segment-button {
  height: 4rem;
  font-size: 1.3rem;
  font-weight: bold;
  line-height: 4rem;
  text-transform: uppercase;
  color: #000;
  background-color: transparent;
  opacity: 0.5;
  padding: 0 6px;
}

.segment-wp .segment-button.segment-activated {
  opacity: 1;
}

.segment-wp .segment-button ion-icon {
  font-size: 2.6rem;
  line-height: 4rem;
}

.segment-wp.segment-disabled,
.segment-wp .segment-button-disabled {
  opacity: 0.3;
  pointer-events: none;
}

.toolbar .segment-wp {
  margin: 0 auto;
}

.segment-wp-primary .segment-button {
  color: #0c031d;
}

.segment-wp-primary .segment-button.activated, .segment-wp-primary .segment-button.segment-activated {
  border-color: #0c031d;
  color: #0c031d;
  opacity: 1;
}

.segment-wp-secondary .segment-button {
  color: #969696;
}

.segment-wp-secondary .segment-button.activated, .segment-wp-secondary .segment-button.segment-activated {
  border-color: #969696;
  color: #969696;
  opacity: 1;
}

.segment-wp-danger .segment-button {
  color: #7e1111;
}

.segment-wp-danger .segment-button.activated, .segment-wp-danger .segment-button.segment-activated {
  border-color: #7e1111;
  color: #7e1111;
  opacity: 1;
}

.segment-wp-light .segment-button {
  color: #f4f4f4;
}

.segment-wp-light .segment-button.activated, .segment-wp-light .segment-button.segment-activated {
  border-color: #f4f4f4;
  color: #f4f4f4;
  opacity: 1;
}

.segment-wp-dark .segment-button {
  color: #000000;
}

.segment-wp-dark .segment-button.activated, .segment-wp-dark .segment-button.segment-activated {
  border-color: #000000;
  color: #000000;
  opacity: 1;
}

.segment-wp-menuinicial .segment-button {
  color: white;
}

.segment-wp-menuinicial .segment-button.activated, .segment-wp-menuinicial .segment-button.segment-activated {
  border-color: white;
  color: white;
  opacity: 1;
}

ion-select {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  max-width: 45%;
}

.select-text {
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 16px;
  font-size: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.item-multiple-inputs ion-select {
  position: relative;
}

.select-disabled,
.item-select-disabled ion-label {
  opacity: .4;
  pointer-events: none;
}

.select-popover ion-list {
  margin: -1px 0;
}

.select-ios {
  padding: 11px 8px 11px 16px;
}

.select-ios .select-placeholder {
  color: #999;
}

.select-ios .select-icon {
  position: relative;
  width: 12px;
  height: 18px;
}

.select-ios .select-icon .select-icon-inner {
  left: 5px;
  top: 50%;
  margin-top: -2px;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 5px solid;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  color: #999;
  pointer-events: none;
}

.select-md {
  padding: 13px 8px 13px 16px;
}

.select-md .select-placeholder {
  color: #999;
}

.select-md .item-select ion-label {
  margin-left: 0;
}

.select-md .select-icon {
  position: relative;
  width: 12px;
  height: 19px;
}

.select-md .select-icon .select-icon-inner {
  left: 5px;
  top: 50%;
  margin-top: -3px;
  position: absolute;
  width: 0;
  height: 0;
  border-top: 5px solid;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  color: #999;
  pointer-events: none;
}

.select-wp {
  margin: 13px 8px;
  padding: 0 8px;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  max-width: 100%;
  border: 2px solid rgba(0, 0, 0, 0.5);
  line-height: 3rem;
}

.select-wp .select-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.item-wp.item-select ion-label {
  margin-left: 0;
}

.select-wp .select-icon {
  position: relative;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  width: 18px;
  height: 18px;
}

.select-wp .select-icon .select-icon-inner {
  left: 5px;
  top: 3px;
  position: absolute;
  display: block;
  width: 9px;
  height: 9px;
  border-top: 2px solid rgba(0, 0, 0, 0.5);
  border-right: 2px solid rgba(0, 0, 0, 0.5);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  pointer-events: none;
}

.select-wp .select-text {
  min-height: 3rem;
}

.hidden-show-when {
  display: none !important;
}

.hidden-hide-when {
  display: none !important;
}

.swiper-container {
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.swiper-container-no-flexbox .swiper-slide {
  float: left;
}

.swiper-container-vertical > .swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.swiper-wrapper {
  padding: 0;
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
}

.swiper-container-multirow > .swiper-wrapper {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.swiper-container-free-mode > .swiper-wrapper {
  margin: 0 auto;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.swiper-slide {
  text-align: center;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 18px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}

.swiper-container-autoheight .swiper-wrapper {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-transition-property: height, -webkit-transform;
  transition-property: height, -webkit-transform;
  transition-property: transform, height;
  transition-property: transform, height, -webkit-transform;
}

.swiper-container .swiper-notification {
  left: 0;
  top: 0;
  position: absolute;
  z-index: -1000;
  opacity: 0;
  pointer-events: none;
}

.swiper-wp8-horizontal {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}

.swiper-wp8-vertical {
  -ms-touch-action: pan-x;
  touch-action: pan-x;
}

.swiper-button-prev,
.swiper-button-next {
  top: 50%;
  margin-top: -22px;
  background-position: center;
  position: absolute;
  z-index: 10;
  width: 27px;
  height: 44px;
  background-repeat: no-repeat;
  background-size: 27px 44px;
  cursor: pointer;
}

.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  cursor: auto;
  opacity: .35;
  pointer-events: none;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  left: 10px;
  right: auto;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  left: auto;
  right: 10px;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}

.swiper-pagination {
  text-align: center;
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
  position: absolute;
  z-index: 10;
  -webkit-transition: 300ms;
  transition: 300ms;
  pointer-events: none;
}

.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}

.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  left: 0;
  bottom: 10px;
  width: 100%;
}

.swiper-pagination-bullet {
  border-radius: 100%;
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #000;
  opacity: .2;
  pointer-events: auto;
}

button.swiper-pagination-bullet {
  margin: 0;
  padding: 0;
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}

.swiper-pagination-white .swiper-pagination-bullet {
  background: #fff;
}

.swiper-pagination-bullet-active {
  background: #007aff;
  opacity: 1;
}

.swiper-pagination-white .swiper-pagination-bullet-active {
  background: #fff;
}

.swiper-pagination-black .swiper-pagination-bullet-active {
  background: #000;
}

.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  -webkit-transform: translate3d(0,  -50%,  0);
  transform: translate3d(0,  -50%,  0);
}

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 5px 0;
  display: block;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 5px;
}

.swiper-pagination-progress {
  position: absolute;
  background: rgba(0, 0, 0, 0.25);
}

.swiper-pagination-progress .swiper-pagination-progressbar {
  left: 0;
  top: 0;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  position: absolute;
  width: 100%;
  height: 100%;
  background: #007aff;
  -webkit-transform: scale(0);
  transform: scale(0);
}

.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
  -webkit-transform-origin: right top;
  transform-origin: right top;
}

.swiper-container-horizontal > .swiper-pagination-progress {
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
}

.swiper-container-vertical > .swiper-pagination-progress {
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
}

.swiper-pagination-progress.swiper-pagination-white {
  background: rgba(255, 255, 255, 0.5);
}

.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
  background: #fff;
}

.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
  background: #000;
}

.swiper-container-3d {
  -webkit-perspective: 1200px;
  perspective: 1200px;
}

.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 10;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.swiper-container-3d .swiper-slide-shadow-left {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-right {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-top {
  background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-container-coverflow .swiper-wrapper,
.swiper-container-flip .swiper-wrapper {
  -webkit-perspective: 1200px;
  perspective: 1200px;
}

.swiper-container-cube,
.swiper-container-flip {
  overflow: visible;
}

.swiper-container-cube .swiper-slide,
.swiper-container-flip .swiper-slide {
  z-index: 1;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  pointer-events: none;
}

.swiper-container-cube .swiper-slide .swiper-slide,
.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-flip .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.swiper-container-cube .swiper-slide {
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
  -webkit-transform-origin: 100% 0;
  transform-origin: 100% 0;
}

.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  visibility: visible;
  pointer-events: auto;
}

.swiper-container-cube .swiper-cube-shadow {
  left: 0;
  bottom: 0;
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.swiper-container-fade .swiper-slide {
  -webkit-transition-property: opacity;
  transition-property: opacity;
  pointer-events: none;
}

.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}

.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}

.swiper-zoom-container {
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}

.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  background: rgba(0, 0, 0, 0.1);
  -ms-touch-action: none;
  touch-action: none;
}

.swiper-container-horizontal > .swiper-scrollbar {
  left: 1%;
  bottom: 3px;
  position: absolute;
  z-index: 50;
  width: 98%;
  height: 5px;
}

.swiper-container-vertical > .swiper-scrollbar {
  right: 3px;
  top: 1%;
  position: absolute;
  z-index: 50;
  width: 5px;
  height: 98%;
}

.swiper-scrollbar-drag {
  left: 0;
  top: 0;
  border-radius: 10px;
  position: relative;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

.swiper-scrollbar-cursor-drag {
  cursor: move;
}

.swiper-lazy-preloader {
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  position: absolute;
  z-index: 10;
  width: 42px;
  height: 42px;
  -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  animation: swiper-preloader-spin 1s steps(12, end) infinite;
}

.swiper-lazy-preloader::after {
  background-position: 50%;
  display: block;
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: 100%;
  content: "";
}

.swiper-lazy-preloader-white::after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

@-webkit-keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

ion-slides {
  display: block;
  width: 100%;
  height: 100%;
}

.slide-zoom {
  text-align: center;
  display: block;
  width: 100%;
}

.swiper-slide img {
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
}

ion-spinner {
  position: relative;
  display: inline-block;
  width: 28px;
  height: 28px;
}

ion-spinner svg {
  left: 0;
  top: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

ion-spinner.spinner-paused svg {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}

.spinner-ios line,
.spinner-ios-small line {
  stroke-width: 4px;
  stroke-linecap: round;
}

.spinner-ios svg,
.spinner-ios-small svg {
  -webkit-animation: spinner-fade-out 1s linear infinite;
  animation: spinner-fade-out 1s linear infinite;
}

.spinner-bubbles svg {
  -webkit-animation: spinner-scale-out 1s linear infinite;
  animation: spinner-scale-out 1s linear infinite;
}

.spinner-circles svg {
  -webkit-animation: spinner-fade-out 1s linear infinite;
  animation: spinner-fade-out 1s linear infinite;
}

.spinner-crescent circle {
  fill: transparent;
  stroke-width: 4px;
  stroke-dasharray: 128px;
  stroke-dashoffset: 82px;
}

.spinner-crescent svg {
  -webkit-animation: spinner-rotate 1s linear infinite;
  animation: spinner-rotate 1s linear infinite;
}

.spinner-dots circle {
  stroke-width: 0;
}

.spinner-dots svg {
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-animation: spinner-dots 1s linear infinite;
  animation: spinner-dots 1s linear infinite;
}

@-webkit-keyframes spinner-fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes spinner-fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes spinner-scale-out {
  0% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  100% {
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
  }
}

@keyframes spinner-scale-out {
  0% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  100% {
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
  }
}

@-webkit-keyframes spinner-rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spinner-rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes spinner-dots {
  0% {
    opacity: .9;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  50% {
    opacity: .3;
    -webkit-transform: scale(0.4, 0.4);
    transform: scale(0.4, 0.4);
  }
  100% {
    opacity: .9;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}

@keyframes spinner-dots {
  0% {
    opacity: .9;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
  50% {
    opacity: .3;
    -webkit-transform: scale(0.4, 0.4);
    transform: scale(0.4, 0.4);
  }
  100% {
    opacity: .9;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
  }
}

.spinner-ios-ios line,
.spinner-ios-ios-small line {
  stroke: #69717d;
}

.spinner-ios-bubbles circle {
  fill: #000;
}

.spinner-ios-circles circle {
  fill: #69717d;
}

.spinner-ios-crescent circle {
  stroke: #000;
}

.spinner-ios-dots circle {
  fill: #444;
}

.spinner-ios-primary.spinner-ios line,
.spinner-ios-primary.spinner-ios-small line,
.spinner-ios-primary.spinner-crescent circle {
  stroke: #0c031d;
}

.spinner-ios-primary.spinner-bubbles circle,
.spinner-ios-primary.spinner-circles circle,
.spinner-ios-primary.spinner-dots circle {
  fill: #0c031d;
}

.spinner-ios-secondary.spinner-ios line,
.spinner-ios-secondary.spinner-ios-small line,
.spinner-ios-secondary.spinner-crescent circle {
  stroke: #969696;
}

.spinner-ios-secondary.spinner-bubbles circle,
.spinner-ios-secondary.spinner-circles circle,
.spinner-ios-secondary.spinner-dots circle {
  fill: #969696;
}

.spinner-ios-danger.spinner-ios line,
.spinner-ios-danger.spinner-ios-small line,
.spinner-ios-danger.spinner-crescent circle {
  stroke: #7e1111;
}

.spinner-ios-danger.spinner-bubbles circle,
.spinner-ios-danger.spinner-circles circle,
.spinner-ios-danger.spinner-dots circle {
  fill: #7e1111;
}

.spinner-ios-light.spinner-ios line,
.spinner-ios-light.spinner-ios-small line,
.spinner-ios-light.spinner-crescent circle {
  stroke: #f4f4f4;
}

.spinner-ios-light.spinner-bubbles circle,
.spinner-ios-light.spinner-circles circle,
.spinner-ios-light.spinner-dots circle {
  fill: #f4f4f4;
}

.spinner-ios-dark.spinner-ios line,
.spinner-ios-dark.spinner-ios-small line,
.spinner-ios-dark.spinner-crescent circle {
  stroke: #000000;
}

.spinner-ios-dark.spinner-bubbles circle,
.spinner-ios-dark.spinner-circles circle,
.spinner-ios-dark.spinner-dots circle {
  fill: #000000;
}

.spinner-ios-menuinicial.spinner-ios line,
.spinner-ios-menuinicial.spinner-ios-small line,
.spinner-ios-menuinicial.spinner-crescent circle {
  stroke: white;
}

.spinner-ios-menuinicial.spinner-bubbles circle,
.spinner-ios-menuinicial.spinner-circles circle,
.spinner-ios-menuinicial.spinner-dots circle {
  fill: white;
}

.spinner-md-ios line,
.spinner-md-ios-small line {
  stroke: #69717d;
}

.spinner-md-bubbles circle {
  fill: #000;
}

.spinner-md-circles circle {
  fill: #69717d;
}

.spinner-md-crescent circle {
  stroke: #000;
}

.spinner-md-dots circle {
  fill: #444;
}

.spinner-md-primary.spinner-ios line,
.spinner-md-primary.spinner-ios-small line,
.spinner-md-primary.spinner-crescent circle {
  stroke: #0c031d;
}

.spinner-md-primary.spinner-bubbles circle,
.spinner-md-primary.spinner-circles circle,
.spinner-md-primary.spinner-dots circle {
  fill: #0c031d;
}

.spinner-md-secondary.spinner-ios line,
.spinner-md-secondary.spinner-ios-small line,
.spinner-md-secondary.spinner-crescent circle {
  stroke: #969696;
}

.spinner-md-secondary.spinner-bubbles circle,
.spinner-md-secondary.spinner-circles circle,
.spinner-md-secondary.spinner-dots circle {
  fill: #969696;
}

.spinner-md-danger.spinner-ios line,
.spinner-md-danger.spinner-ios-small line,
.spinner-md-danger.spinner-crescent circle {
  stroke: #7e1111;
}

.spinner-md-danger.spinner-bubbles circle,
.spinner-md-danger.spinner-circles circle,
.spinner-md-danger.spinner-dots circle {
  fill: #7e1111;
}

.spinner-md-light.spinner-ios line,
.spinner-md-light.spinner-ios-small line,
.spinner-md-light.spinner-crescent circle {
  stroke: #f4f4f4;
}

.spinner-md-light.spinner-bubbles circle,
.spinner-md-light.spinner-circles circle,
.spinner-md-light.spinner-dots circle {
  fill: #f4f4f4;
}

.spinner-md-dark.spinner-ios line,
.spinner-md-dark.spinner-ios-small line,
.spinner-md-dark.spinner-crescent circle {
  stroke: #000000;
}

.spinner-md-dark.spinner-bubbles circle,
.spinner-md-dark.spinner-circles circle,
.spinner-md-dark.spinner-dots circle {
  fill: #000000;
}

.spinner-md-menuinicial.spinner-ios line,
.spinner-md-menuinicial.spinner-ios-small line,
.spinner-md-menuinicial.spinner-crescent circle {
  stroke: white;
}

.spinner-md-menuinicial.spinner-bubbles circle,
.spinner-md-menuinicial.spinner-circles circle,
.spinner-md-menuinicial.spinner-dots circle {
  fill: white;
}

.spinner-wp-ios line,
.spinner-wp-ios-small line {
  stroke: #69717d;
}

.spinner-wp-bubbles circle {
  fill: #000;
}

.spinner-wp-circles circle {
  fill: #69717d;
}

.spinner-wp-crescent circle {
  stroke: #000;
}

.spinner-wp-dots circle {
  fill: #444;
}

.spinner-wp-primary.spinner-ios line,
.spinner-wp-primary.spinner-ios-small line,
.spinner-wp-primary.spinner-crescent circle {
  stroke: #0c031d;
}

.spinner-wp-primary.spinner-bubbles circle,
.spinner-wp-primary.spinner-circles circle,
.spinner-wp-primary.spinner-dots circle {
  fill: #0c031d;
}

.spinner-wp-secondary.spinner-ios line,
.spinner-wp-secondary.spinner-ios-small line,
.spinner-wp-secondary.spinner-crescent circle {
  stroke: #969696;
}

.spinner-wp-secondary.spinner-bubbles circle,
.spinner-wp-secondary.spinner-circles circle,
.spinner-wp-secondary.spinner-dots circle {
  fill: #969696;
}

.spinner-wp-danger.spinner-ios line,
.spinner-wp-danger.spinner-ios-small line,
.spinner-wp-danger.spinner-crescent circle {
  stroke: #7e1111;
}

.spinner-wp-danger.spinner-bubbles circle,
.spinner-wp-danger.spinner-circles circle,
.spinner-wp-danger.spinner-dots circle {
  fill: #7e1111;
}

.spinner-wp-light.spinner-ios line,
.spinner-wp-light.spinner-ios-small line,
.spinner-wp-light.spinner-crescent circle {
  stroke: #f4f4f4;
}

.spinner-wp-light.spinner-bubbles circle,
.spinner-wp-light.spinner-circles circle,
.spinner-wp-light.spinner-dots circle {
  fill: #f4f4f4;
}

.spinner-wp-dark.spinner-ios line,
.spinner-wp-dark.spinner-ios-small line,
.spinner-wp-dark.spinner-crescent circle {
  stroke: #000000;
}

.spinner-wp-dark.spinner-bubbles circle,
.spinner-wp-dark.spinner-circles circle,
.spinner-wp-dark.spinner-dots circle {
  fill: #000000;
}

.spinner-wp-menuinicial.spinner-ios line,
.spinner-wp-menuinicial.spinner-ios-small line,
.spinner-wp-menuinicial.spinner-crescent circle {
  stroke: white;
}

.spinner-wp-menuinicial.spinner-bubbles circle,
.spinner-wp-menuinicial.spinner-circles circle,
.spinner-wp-menuinicial.spinner-dots circle {
  fill: white;
}

.split-pane {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  contain: strict;
}

.split-pane-side:not(ion-menu) {
  display: none;
}

.split-pane-visible > .split-pane-side,
.split-pane-visible > .split-pane-main {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: relative;
  z-index: 0;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.split-pane-visible > .split-pane-side {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
}

.split-pane-visible > .split-pane-main,
.split-pane-visible > ion-nav.split-pane-side,
.split-pane-visible > ion-tabs.split-pane-side,
.split-pane-visible > ion-menu.menu-enabled {
  display: block;
}

.split-pane-visible > ion-split-pane.split-pane-side,
.split-pane-visible > ion-split-pane.split-pane-main {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.split-pane-visible > ion-menu.menu-enabled > .menu-inner {
  left: 0;
  right: 0;
  width: auto;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  -webkit-transform: none !important;
  transform: none !important;
}

.split-pane-visible > ion-menu.menu-enabled > .ion-backdrop {
  display: hidden !important;
}

.split-pane-visible > .split-pane-side[side=start] {
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
}

.split-pane-visible > .split-pane-side[side=end] {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}

.split-pane-visible > .split-pane-side[side=left] {
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
}

.split-pane-visible > .split-pane-side[side=right] {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}

.split-pane-ios.split-pane-visible > .split-pane-side {
  min-width: 270px;
  max-width: 28%;
  border-right: 0.55px solid #c8c7cc;
  border-left: 0;
}

.split-pane-ios.split-pane-visible > .split-pane-side[side=right] {
  border-right: 0;
  border-left: 0.55px solid #c8c7cc;
}

.split-pane-md.split-pane-visible > .split-pane-side {
  min-width: 270px;
  max-width: 28%;
  border-right: 1px solid #dedede;
  border-left: 0;
}

.split-pane-md.split-pane-visible > .split-pane-side[side=right] {
  border-right: 0;
  border-left: 1px solid #dedede;
}

.split-pane-wp.split-pane-visible > .split-pane-side {
  min-width: 270px;
  max-width: 28%;
  border-right: 1px solid transparent;
  border-left: 0;
}

.split-pane-wp.split-pane-visible > .split-pane-side[side=right] {
  border-right: 0;
  border-left: 1px solid transparent;
}

.tabbar {
  left: 0;
  bottom: 0;
  position: absolute;
  z-index: 10;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  opacity: 0;
}

.tabbar-hidden .tabbar {
  display: none;
}

.tabbar.show-tabbar {
  opacity: 1;
}

[tabsPlacement=top] > .tabbar {
  top: 0;
  bottom: auto;
}

.tab-button {
  margin: 0;
  text-align: center;
  border-radius: 0;
  position: relative;
  z-index: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  border: 0;
  text-decoration: none;
  background: none;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.tab-disabled {
  pointer-events: none;
}

.tab-disabled ion-badge,
.tab-disabled ion-icon,
.tab-disabled span {
  opacity: .4;
}

.tab-button-text {
  margin-top: 3px;
  margin-bottom: 2px;
}

.tab-button-text,
.tab-button-icon {
  display: none;
  overflow: hidden;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  min-width: 26px;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.has-icon .tab-button-icon,
.has-title .tab-button-text {
  display: block;
}

.has-title-only .tab-button-text {
  white-space: normal;
}

[tabsLayout=icon-bottom] .tab-button .tab-button-icon {
  -webkit-box-ordinal-group: 11;
  -webkit-order: 10;
  -ms-flex-order: 10;
  order: 10;
}

[tabsLayout=icon-left] .tab-button,
[tabsLayout=icon-right] .tab-button,
[tabsLayout=icon-start] .tab-button,
[tabsLayout=icon-end] .tab-button {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

[tabsLayout=icon-left] .tab-button .tab-button-icon,
[tabsLayout=icon-start] .tab-button .tab-button-icon {
  padding-right: 8px;
  text-align: right;
  text-align: end;
}

[tabsLayout=icon-right] .tab-button .tab-button-icon,
[tabsLayout=icon-end] .tab-button .tab-button-icon {
  padding-left: 8px;
  text-align: left;
  text-align: start;
  -webkit-box-ordinal-group: 11;
  -webkit-order: 10;
  -ms-flex-order: 10;
  order: 10;
}

.tab-hidden,
.tab-highlight,
[tabsLayout=icon-hide] .tab-button-icon,
[tabsLayout=title-hide] .tab-button-text {
  display: none;
}

.tab-badge {
  right: 4%;
  top: 6%;
  right: calc(50% - 50px);
  padding: 1px 6px;
  position: absolute;
  height: auto;
  font-size: 12px;
  line-height: 16px;
}

.has-icon .tab-badge {
  right: calc(50% - 30px);
}

[tabsLayout=icon-bottom] .tab-badge,
[tabsLayout=icon-left] .tab-badge,
[tabsLayout=icon-right] .tab-badge,
[tabsLayout=icon-start] .tab-badge,
[tabsLayout=icon-end] .tab-badge {
  right: calc(50% - 50px);
}

.tabs-ios .tabbar {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-top: 0.55px solid rgba(0, 0, 0, 0.3);
  background: #f8f8f8;
}

.tabs-ios[tabsPlacement=top] .tabbar {
  border-top: 0;
  border-bottom: 0.55px solid rgba(0, 0, 0, 0.3);
}

.tabs-ios .tab-button {
  max-width: 240px;
  min-height: 49px;
  font-size: 10px;
  font-weight: 500;
  color: #8c8c8c;
  padding: 0 2px;
}

.tabs-ios .tab-button:hover:not(.disable-hover),
.tabs-ios .tab-button[aria-selected=true] {
  color: #0c031d;
}

.tabs-ios .tab-button[aria-selected=true] .tab-button-icon {
  color: #0c031d;
}

.tabs-ios .tab-button-text {
  margin-top: 0;
  margin-bottom: 1px;
  min-height: 11px;
}

.tabs-ios .has-title-only .tab-button-text {
  font-size: 12px;
}

.tabs-ios .tab-button-icon {
  margin-top: 4px;
  margin-bottom: 1px;
  min-width: 35px;
  height: 30px;
  font-size: 30px;
  color: #8c8c8c;
}

.tabs-ios .tab-button-icon::before {
  vertical-align: top;
}

.tabs-ios[tabsLayout=icon-right] .tab-button .tab-button-text,
.tabs-ios[tabsLayout=icon-left] .tab-button .tab-button-text,
.tabs-ios[tabsLayout=icon-end] .tab-button .tab-button-text,
.tabs-ios[tabsLayout=icon-start] .tab-button .tab-button-text {
  font-size: 1.4rem;
  line-height: 1.1;
}

.tabs-ios[tabsLayout=icon-right] .tab-button ion-icon,
.tabs-ios[tabsLayout=icon-left] .tab-button ion-icon,
.tabs-ios[tabsLayout=icon-end] .tab-button ion-icon,
.tabs-ios[tabsLayout=icon-start] .tab-button ion-icon {
  min-width: 24px;
  height: 26px;
  font-size: 24px;
}

.tabs-ios[tabsLayout=icon-hide] .tab-button,
.tabs-ios .tab-button.has-title-only {
  min-height: 41px;
}

.tabs-ios[tabsLayout=icon-hide] .tab-button .tab-button-text,
.tabs-ios .tab-button.has-title-only .tab-button-text {
  margin: 2px 0;
  font-size: 1.4rem;
  line-height: 1.1;
}

.tabs-ios[tabsLayout=title-hide] .tab-button,
.tabs-ios .tab-button.icon-only {
  min-height: 41px;
}

.tabs-ios-primary .tabbar {
  border-color: black;
  background-color: #0c031d;
}

.tabs-ios-primary .tab-button,
.tabs-ios-primary .tab-button-icon,
.tabs-ios-primary .tab-button:hover:not(.disable-hover),
.tabs-ios-primary .tab-button:hover:not(.disable-hover) .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-ios-primary .tab-button[aria-selected=true],
.tabs-ios-primary .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-ios-secondary .tabbar {
  border-color: #7d7d7d;
  background-color: #969696;
}

.tabs-ios-secondary .tab-button,
.tabs-ios-secondary .tab-button-icon,
.tabs-ios-secondary .tab-button:hover:not(.disable-hover),
.tabs-ios-secondary .tab-button:hover:not(.disable-hover) .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-ios-secondary .tab-button[aria-selected=true],
.tabs-ios-secondary .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-ios-danger .tabbar {
  border-color: #510b0b;
  background-color: #7e1111;
}

.tabs-ios-danger .tab-button,
.tabs-ios-danger .tab-button-icon,
.tabs-ios-danger .tab-button:hover:not(.disable-hover),
.tabs-ios-danger .tab-button:hover:not(.disable-hover) .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-ios-danger .tab-button[aria-selected=true],
.tabs-ios-danger .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-ios-light .tabbar {
  border-color: #dbdbdb;
  background-color: #f4f4f4;
}

.tabs-ios-light .tab-button,
.tabs-ios-light .tab-button-icon,
.tabs-ios-light .tab-button:hover:not(.disable-hover),
.tabs-ios-light .tab-button:hover:not(.disable-hover) .tab-button-icon {
  color: rgba(0, 0, 0, 0.7);
}

.tabs-ios-light .tab-button[aria-selected=true],
.tabs-ios-light .tab-button[aria-selected=true] .tab-button-icon {
  color: #000;
}

.tabs-ios-dark .tabbar {
  border-color: black;
  background-color: #000000;
}

.tabs-ios-dark .tab-button,
.tabs-ios-dark .tab-button-icon,
.tabs-ios-dark .tab-button:hover:not(.disable-hover),
.tabs-ios-dark .tab-button:hover:not(.disable-hover) .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-ios-dark .tab-button[aria-selected=true],
.tabs-ios-dark .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-ios-menuinicial .tabbar {
  border-color: #e6e6e6;
  background-color: white;
}

.tabs-ios-menuinicial .tab-button,
.tabs-ios-menuinicial .tab-button-icon,
.tabs-ios-menuinicial .tab-button:hover:not(.disable-hover),
.tabs-ios-menuinicial .tab-button:hover:not(.disable-hover) .tab-button-icon {
  color: rgba(0, 0, 0, 0.7);
}

.tabs-ios-menuinicial .tab-button[aria-selected=true],
.tabs-ios-menuinicial .tab-button[aria-selected=true] .tab-button-icon {
  color: #000;
}

.tabs-md .tabbar {
  background: #f8f8f8;
}

.tabs-md .tab-button {
  min-height: 5.6rem;
  font-weight: normal;
  color: rgba(60, 60, 60, 0.7);
  padding: 0;
}

.tabs-md .tab-button[aria-selected=true] {
  color: #0c031d;
  padding: 0;
}

.tabs-md .tab-button-text {
  font-size: 1.2rem;
  text-transform: none;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  margin: 0;
  -webkit-transform-origin: 50% 80%;
  transform-origin: 50% 80%;
}

.tabs-md .tab-button[aria-selected=true] .tab-button-text {
  -webkit-transform: scale3d(1.16667, 1.16667, 1);
  transform: scale3d(1.16667, 1.16667, 1);
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.tabs-md[tabsLayout=icon-top] .has-icon .tab-button-text {
  margin-top: 4px;
  margin-bottom: 0;
}

.tabs-md[tabsLayout=icon-bottom] .tab-button .tab-button-text {
  margin-top: 0;
}

.tabs-md .tab-button-icon {
  margin-top: 1px;
  min-width: 2.4rem;
  font-size: 2.4rem;
  color: rgba(60, 60, 60, 0.7);
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  -webkit-transform-origin: 50% 150%;
  transform-origin: 50% 150%;
}

.tabs-md .tab-button[aria-selected=true] .tab-button-icon {
  color: #0c031d;
  -webkit-transform: translate3d(0,  -2px,  0);
  transform: translate3d(0,  -2px,  0);
}

.tabs-md[tabsLayout=icon-right] .tab-button[aria-selected=true] .tab-button-icon,
.tabs-md[tabsLayout=icon-end] .tab-button[aria-selected=true] .tab-button-icon {
  -webkit-transform: translate3d(2px,  0,  0);
  transform: translate3d(2px,  0,  0);
}

.tabs-md[tabsLayout=icon-bottom] .tab-button[aria-selected=true] .tab-button-icon {
  -webkit-transform: translate3d(0,  2px,  0);
  transform: translate3d(0,  2px,  0);
}

.tabs-md[tabsLayout=icon-left] .tab-button[aria-selected=true] .tab-button-icon,
.tabs-md[tabsLayout=icon-start] .tab-button[aria-selected=true] .tab-button-icon {
  -webkit-transform: translate3d(-2px,  0,  0);
  transform: translate3d(-2px,  0,  0);
}

.tabs-md[tabsLayout=icon-hide] .tab-button,
.tabs-md[tabsLayout=title-hide] .tab-button,
.tabs-md .tab-button.icon-only,
.tabs-md .tab-button.has-title-only {
  padding: 0 10px;
}

.tabs-md[tabsHighlight=true] .tab-highlight {
  left: 0;
  bottom: 0;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  position: absolute;
  display: block;
  width: 1px;
  height: 2px;
  background: #0c031d;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.tabs-md[tabsHighlight=true] .tab-highlight.animate {
  -webkit-transition-duration: 300ms;
  transition-duration: 300ms;
}

.tabs-md[tabsHighlight=true][tabsPlacement=bottom] > .tabbar > .tab-highlight {
  top: 0;
}

.tabs-md-primary .tabbar {
  background-color: #0c031d;
}

.tabs-md-primary .tab-button,
.tabs-md-primary .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-md-primary .tab-button:hover:not(.disable-hover),
.tabs-md-primary .tab-button[aria-selected=true],
.tabs-md-primary .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-md-primary[tabsHighlight=true] .tab-highlight {
  background: #fff;
}

.tabs-md-secondary .tabbar {
  background-color: #969696;
}

.tabs-md-secondary .tab-button,
.tabs-md-secondary .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-md-secondary .tab-button:hover:not(.disable-hover),
.tabs-md-secondary .tab-button[aria-selected=true],
.tabs-md-secondary .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-md-secondary[tabsHighlight=true] .tab-highlight {
  background: #fff;
}

.tabs-md-danger .tabbar {
  background-color: #7e1111;
}

.tabs-md-danger .tab-button,
.tabs-md-danger .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-md-danger .tab-button:hover:not(.disable-hover),
.tabs-md-danger .tab-button[aria-selected=true],
.tabs-md-danger .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-md-danger[tabsHighlight=true] .tab-highlight {
  background: #fff;
}

.tabs-md-light .tabbar {
  background-color: #f4f4f4;
}

.tabs-md-light .tab-button,
.tabs-md-light .tab-button-icon {
  color: rgba(0, 0, 0, 0.7);
}

.tabs-md-light .tab-button:hover:not(.disable-hover),
.tabs-md-light .tab-button[aria-selected=true],
.tabs-md-light .tab-button[aria-selected=true] .tab-button-icon {
  color: #000;
}

.tabs-md-light[tabsHighlight=true] .tab-highlight {
  background: #000;
}

.tabs-md-dark .tabbar {
  background-color: #000000;
}

.tabs-md-dark .tab-button,
.tabs-md-dark .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-md-dark .tab-button:hover:not(.disable-hover),
.tabs-md-dark .tab-button[aria-selected=true],
.tabs-md-dark .tab-button[aria-selected=true] .tab-button-icon {
  color: #fff;
}

.tabs-md-dark[tabsHighlight=true] .tab-highlight {
  background: #fff;
}

.tabs-md-menuinicial .tabbar {
  background-color: white;
}

.tabs-md-menuinicial .tab-button,
.tabs-md-menuinicial .tab-button-icon {
  color: rgba(0, 0, 0, 0.7);
}

.tabs-md-menuinicial .tab-button:hover:not(.disable-hover),
.tabs-md-menuinicial .tab-button[aria-selected=true],
.tabs-md-menuinicial .tab-button[aria-selected=true] .tab-button-icon {
  color: #000;
}

.tabs-md-menuinicial[tabsHighlight=true] .tab-highlight {
  background: #000;
}

.tabs-wp .tabbar {
  background: #f8f8f8;
}

.tabs-wp .tab-button {
  border-radius: 0;
  min-height: 4.8rem;
  border-bottom: 2px solid transparent;
  font-size: 1.2rem;
  font-weight: normal;
  color: rgba(140, 140, 140, 0.7);
  -webkit-box-shadow: none;
  box-shadow: none;
  padding: 12px 10px 5px;
}

.tabs-wp .tab-button[aria-selected=true] {
  border-bottom-color: #0c031d;
  color: #0c031d;
}

.tabs-wp .tab-button.activated {
  background: rgba(0, 0, 0, 0.1);
}

.tabs-wp[tabsPlacement=bottom] .tab-button {
  border-top: 2px solid transparent;
  border-bottom-width: 0;
}

.tabs-wp[tabsPlacement=bottom] .tab-button[aria-selected=true] {
  border-top-color: #0c031d;
}

.tabs-wp .tab-button-text {
  margin-top: 5px;
  margin-bottom: 5px;
}

.tabs-wp .tab-button-icon {
  min-width: 2.4rem;
  font-size: 2.4rem;
  color: rgba(140, 140, 140, 0.7);
}

.tabs-wp .tab-button[aria-selected=true] .tab-button-icon {
  color: #0c031d;
}

.tabs-wp[tabsLayout=icon-bottom] .tab-button {
  padding-top: 8px;
  padding-bottom: 8px;
}

.tabs-wp[tabsLayout=icon-right] .tab-button,
.tabs-wp[tabsLayout=icon-left] .tab-button,
.tabs-wp[tabsLayout=icon-end] .tab-button,
.tabs-wp[tabsLayout=icon-start] .tab-button {
  padding-bottom: 10px;
}

.tabs-wp[tabsLayout=icon-right] .tab-button ion-icon,
.tabs-wp[tabsLayout=icon-left] .tab-button ion-icon,
.tabs-wp[tabsLayout=icon-end] .tab-button ion-icon,
.tabs-wp[tabsLayout=icon-start] .tab-button ion-icon {
  min-width: 24px;
}

.tabs-wp[tabsLayout=icon-hide] .tab-button,
.tabs-wp[tabsLayout=title-hide] .tab-button,
.tabs-wp .tab-button.icon-only,
.tabs-wp .tab-button.has-title-only {
  padding: 6px 10px;
}

.tabs-wp-primary .tabbar {
  background-color: #0c031d;
}

.tabs-wp-primary .tab-button,
.tabs-wp-primary .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-wp-primary .tab-button:hover:not(.disable-hover),
.tabs-wp-primary .tab-button:hover:not(.disable-hover) .tab-button-icon,
.tabs-wp-primary .tab-button[aria-selected=true],
.tabs-wp-primary .tab-button[aria-selected=true] .tab-button-icon {
  border-color: #fff;
  color: #fff;
}

.tabs-wp-secondary .tabbar {
  background-color: #969696;
}

.tabs-wp-secondary .tab-button,
.tabs-wp-secondary .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-wp-secondary .tab-button:hover:not(.disable-hover),
.tabs-wp-secondary .tab-button:hover:not(.disable-hover) .tab-button-icon,
.tabs-wp-secondary .tab-button[aria-selected=true],
.tabs-wp-secondary .tab-button[aria-selected=true] .tab-button-icon {
  border-color: #fff;
  color: #fff;
}

.tabs-wp-danger .tabbar {
  background-color: #7e1111;
}

.tabs-wp-danger .tab-button,
.tabs-wp-danger .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-wp-danger .tab-button:hover:not(.disable-hover),
.tabs-wp-danger .tab-button:hover:not(.disable-hover) .tab-button-icon,
.tabs-wp-danger .tab-button[aria-selected=true],
.tabs-wp-danger .tab-button[aria-selected=true] .tab-button-icon {
  border-color: #fff;
  color: #fff;
}

.tabs-wp-light .tabbar {
  background-color: #f4f4f4;
}

.tabs-wp-light .tab-button,
.tabs-wp-light .tab-button-icon {
  color: rgba(0, 0, 0, 0.7);
}

.tabs-wp-light .tab-button:hover:not(.disable-hover),
.tabs-wp-light .tab-button:hover:not(.disable-hover) .tab-button-icon,
.tabs-wp-light .tab-button[aria-selected=true],
.tabs-wp-light .tab-button[aria-selected=true] .tab-button-icon {
  border-color: #000;
  color: #000;
}

.tabs-wp-dark .tabbar {
  background-color: #000000;
}

.tabs-wp-dark .tab-button,
.tabs-wp-dark .tab-button-icon {
  color: rgba(255, 255, 255, 0.7);
}

.tabs-wp-dark .tab-button:hover:not(.disable-hover),
.tabs-wp-dark .tab-button:hover:not(.disable-hover) .tab-button-icon,
.tabs-wp-dark .tab-button[aria-selected=true],
.tabs-wp-dark .tab-button[aria-selected=true] .tab-button-icon {
  border-color: #fff;
  color: #fff;
}

.tabs-wp-menuinicial .tabbar {
  background-color: white;
}

.tabs-wp-menuinicial .tab-button,
.tabs-wp-menuinicial .tab-button-icon {
  color: rgba(0, 0, 0, 0.7);
}

.tabs-wp-menuinicial .tab-button:hover:not(.disable-hover),
.tabs-wp-menuinicial .tab-button:hover:not(.disable-hover) .tab-button-icon,
.tabs-wp-menuinicial .tab-button[aria-selected=true],
.tabs-wp-menuinicial .tab-button[aria-selected=true] .tab-button-icon {
  border-color: #000;
  color: #000;
}

ion-toast {
  left: 0;
  top: 0;
  position: absolute;
  z-index: 1000;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  contain: strict;
}

.toast-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  pointer-events: auto;
  contain: content;
}

.toast-button {
  padding: 19px 16px 17px;
  font-size: 1.5rem;
}

.toast-message {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.toast-ios .toast-wrapper {
  left: 10px;
  right: 10px;
  margin: auto;
  border-radius: 0.65rem;
  position: absolute;
  z-index: 10;
  display: block;
  max-width: 700px;
  background: rgba(0, 0, 0, 0.9);
}

.toast-ios .toast-wrapper.toast-top {
  -webkit-transform: translate3d(0,  -100%,  0);
  transform: translate3d(0,  -100%,  0);
  margin: constant(safe-area-inset-top) auto auto;
  top: 0;
}

.toast-ios .toast-wrapper.toast-bottom {
  -webkit-transform: translate3d(0,  100%,  0);
  transform: translate3d(0,  100%,  0);
  margin: auto auto constant(safe-area-inset-bottom);
  bottom: 0;
}

.toast-ios .toast-wrapper.toast-middle {
  opacity: .01;
}

.toast-ios .toast-message {
  font-size: 1.4rem;
  color: #fff;
  padding: 1.5rem;
}

.toast-md .toast-wrapper {
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
  z-index: 10;
  display: block;
  width: 100%;
  max-width: 700px;
  background: #333;
}

.toast-md .toast-wrapper.toast-top {
  -webkit-transform: translate3d(0,  -100%,  0);
  transform: translate3d(0,  -100%,  0);
  top: 0;
}

.toast-md .toast-wrapper.toast-bottom {
  -webkit-transform: translate3d(0,  100%,  0);
  transform: translate3d(0,  100%,  0);
  bottom: 0;
}

.toast-md .toast-wrapper.toast-middle {
  opacity: .01;
}

.toast-md .toast-message {
  font-size: 1.5rem;
  color: #fff;
  padding: 19px 16px 17px;
}

.toast-wp .toast-wrapper {
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 0;
  position: absolute;
  z-index: 10;
  display: block;
  max-width: 700px;
  background: black;
}

.toast-wp .toast-wrapper.toast-top {
  top: 0;
  opacity: .01;
}

.toast-wp .toast-wrapper.toast-bottom {
  bottom: 0;
  opacity: .01;
}

.toast-wp .toast-wrapper.toast-middle {
  opacity: .01;
}

.toast-message {
  font-size: 1.4rem;
  color: #fff;
  padding: 1.5rem;
}

.toast-button {
  color: #fff;
}

.toggle-ios {
  position: relative;
  width: 51px;
  height: 32px;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  contain: strict;
}

.toggle-ios .toggle-icon {
  border-radius: 16px;
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #e6e6e6;
  -webkit-transition: background-color 300ms;
  transition: background-color 300ms;
  pointer-events: none;
}

.toggle-ios .toggle-icon::before {
  left: 2px;
  right: 2px;
  top: 2px;
  bottom: 2px;
  border-radius: 16px;
  position: absolute;
  background-color: #fff;
  content: "";
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  -webkit-transition: -webkit-transform 300ms;
  transition: -webkit-transform 300ms;
  transition: transform 300ms;
  transition: transform 300ms, -webkit-transform 300ms;
}

.toggle-ios .toggle-inner {
  left: 2px;
  top: 2px;
  border-radius: 14px;
  position: absolute;
  width: 28px;
  height: 28px;
  background-color: #fff;
  -webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16), 0 3px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16), 0 3px 1px rgba(0, 0, 0, 0.1);
  -webkit-transition: width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms, -webkit-transform 300ms;
  transition: width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms, -webkit-transform 300ms;
  transition: transform 300ms, width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms;
  transition: transform 300ms, width 120ms ease-in-out 80ms, left 110ms ease-in-out 80ms, right 110ms ease-in-out 80ms, -webkit-transform 300ms;
  will-change: transform;
  contain: strict;
}

.toggle-ios.toggle-checked .toggle-icon {
  background-color: #0c031d;
}

.toggle-ios.toggle-activated .toggle-icon::before,
.toggle-ios.toggle-checked .toggle-icon::before {
  -webkit-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
}

.toggle-ios.toggle-checked .toggle-inner {
  -webkit-transform: translate3d(19px,  0,  0);
  transform: translate3d(19px,  0,  0);
}

.toggle-ios.toggle-activated.toggle-checked .toggle-inner::before {
  -webkit-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
}

.toggle-ios.toggle-activated .toggle-inner {
  width: 34px;
}

.toggle-ios.toggle-activated.toggle-checked .toggle-inner {
  left: -4px;
}

.toggle-ios.toggle-disabled,
.item-ios.item-toggle-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.item-ios .toggle-ios {
  margin: 0;
  padding: 6px 8px 5px 16px;
}

.item-ios .toggle-ios[item-left],
.item-ios .toggle-ios[item-start] {
  padding: 6px 16px 5px 0;
}

.toggle-ios-primary.toggle-checked .toggle-icon {
  background-color: #0c031d;
}

.toggle-ios-secondary.toggle-checked .toggle-icon {
  background-color: #969696;
}

.toggle-ios-danger.toggle-checked .toggle-icon {
  background-color: #7e1111;
}

.toggle-ios-light.toggle-checked .toggle-icon {
  background-color: #f4f4f4;
}

.toggle-ios-dark.toggle-checked .toggle-icon {
  background-color: #000000;
}

.toggle-ios-menuinicial.toggle-checked .toggle-icon {
  background-color: white;
}

.toggle-md {
  position: relative;
  width: 36px;
  height: 14px;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  contain: strict;
  padding: 12px;
}

.toggle-md .toggle-icon {
  border-radius: 14px;
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #dedede;
  -webkit-transition: background-color 300ms;
  transition: background-color 300ms;
  pointer-events: none;
}

.toggle-md .toggle-inner {
  left: 0;
  top: -3px;
  border-radius: 50%;
  position: absolute;
  width: 20px;
  height: 20px;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  -webkit-transition-duration: 300ms;
  transition-duration: 300ms;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, -webkit-transform;
  transition-property: transform, background-color;
  transition-property: transform, background-color, -webkit-transform;
  will-change: transform, background-color;
  contain: strict;
}

.toggle-md.toggle-checked .toggle-icon {
  background-color: #3c0f91;
}

.toggle-md.toggle-checked .toggle-inner {
  -webkit-transform: translate3d(16px,  0,  0);
  transform: translate3d(16px,  0,  0);
  background-color: #0c031d;
}

.toggle-md.toggle-disabled,
.item-md.item-toggle-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.toggle-md.toggle-disabled ion-radio {
  opacity: 0.3;
}

.item-md .toggle-md {
  cursor: pointer;
  margin: 0;
  padding: 12px 8px 12px 16px;
}

.item-md .toggle-md[item-left],
.item-md .toggle-md[item-start] {
  padding: 12px 18px 12px 2px;
}

.item-md.item-toggle ion-label {
  margin-left: 0;
}

.toggle-md-primary.toggle-checked .toggle-icon {
  background-color: #3c0f91;
}

.toggle-md-primary.toggle-checked .toggle-inner {
  background-color: #0c031d;
}

.toggle-md-secondary.toggle-checked .toggle-icon {
  background-color: #d6d6d6;
}

.toggle-md-secondary.toggle-checked .toggle-inner {
  background-color: #969696;
}

.toggle-md-danger.toggle-checked .toggle-icon {
  background-color: #e32c2c;
}

.toggle-md-danger.toggle-checked .toggle-inner {
  background-color: #7e1111;
}

.toggle-md-light.toggle-checked .toggle-icon {
  background-color: white;
}

.toggle-md-light.toggle-checked .toggle-inner {
  background-color: #f4f4f4;
}

.toggle-md-dark.toggle-checked .toggle-icon {
  background-color: #404040;
}

.toggle-md-dark.toggle-checked .toggle-inner {
  background-color: #000000;
}

.toggle-md-menuinicial.toggle-checked .toggle-icon {
  background-color: white;
}

.toggle-md-menuinicial.toggle-checked .toggle-inner {
  background-color: white;
}

.toggle-wp {
  position: relative;
  width: 40px;
  height: 18px;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  contain: strict;
}

.toggle-wp .toggle-icon {
  border-radius: 18px;
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  border: 2px solid #323232;
  background-color: transparent;
  pointer-events: none;
  contain: strict;
}

.toggle-wp .toggle-inner {
  left: 2px;
  top: 2px;
  border-radius: 50%;
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: #323232;
  -webkit-transition-duration: 300ms;
  transition-duration: 300ms;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, -webkit-transform;
  transition-property: transform, background-color;
  transition-property: transform, background-color, -webkit-transform;
  will-change: transform, background-color;
}

.toggle-wp.toggle-checked .toggle-icon {
  border-color: #0c031d;
  background-color: #0c031d;
}

.toggle-wp.toggle-checked .toggle-inner {
  -webkit-transform: translate3d(22px,  0,  0);
  transform: translate3d(22px,  0,  0);
  background-color: #fff;
}

.toggle-wp.toggle-disabled,
.item-wp.item-toggle-disabled ion-label {
  opacity: 0.3;
  pointer-events: none;
}

.toggle-wp.toggle-disabled ion-radio {
  opacity: 0.3;
}

.item-wp .toggle-wp {
  margin: 0;
  cursor: pointer;
  padding: 12px 8px 12px 16px;
}

.item-wp .toggle-wp[item-left],
.item-wp .toggle-wp[item-start] {
  padding: 12px 18px 12px 2px;
}

.item-wp.item-toggle ion-label {
  margin-left: 0;
}

.toggle-wp-primary.toggle-checked .toggle-icon {
  border-color: #0c031d;
  background-color: #0c031d;
}

.toggle-wp-primary.toggle-checked .toggle-inner {
  background-color: #fff;
}

.toggle-wp-secondary.toggle-checked .toggle-icon {
  border-color: #969696;
  background-color: #969696;
}

.toggle-wp-secondary.toggle-checked .toggle-inner {
  background-color: #fff;
}

.toggle-wp-danger.toggle-checked .toggle-icon {
  border-color: #7e1111;
  background-color: #7e1111;
}

.toggle-wp-danger.toggle-checked .toggle-inner {
  background-color: #fff;
}

.toggle-wp-light.toggle-checked .toggle-icon {
  border-color: #f4f4f4;
  background-color: #f4f4f4;
}

.toggle-wp-light.toggle-checked .toggle-inner {
  background-color: #000;
}

.toggle-wp-dark.toggle-checked .toggle-icon {
  border-color: #000000;
  background-color: #000000;
}

.toggle-wp-dark.toggle-checked .toggle-inner {
  background-color: #fff;
}

.toggle-wp-menuinicial.toggle-checked .toggle-icon {
  border-color: white;
  background-color: white;
}

.toggle-wp-menuinicial.toggle-checked .toggle-inner {
  background-color: #000;
}

ion-toolbar {
  position: relative;
  z-index: 10;
}

.toolbar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  contain: content;
}

.toolbar-background {
  left: 0;
  top: 0;
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  border: 0;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  pointer-events: none;
  contain: strict;
}

ion-title {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.toolbar-title {
  display: block;
  overflow: hidden;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}

ion-buttons {
  margin: 0 0.2rem;
  display: block;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  pointer-events: none;
}

ion-buttons button,
ion-buttons a,
ion-buttons input,
ion-buttons textarea,
ion-buttons div {
  pointer-events: auto;
}

.toolbar[transparent] .toolbar-background {
  border-color: transparent;
  background: transparent;
}

ion-buttons,
.bar-button-menutoggle {
  z-index: 99;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

ion-navbar.toolbar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.bar-button {
  margin: 0;
  padding: 0;
  text-align: center;
  -moz-appearance: none;
  -ms-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  display: inline-block;
  line-height: 1;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  vertical-align: top;
  vertical-align: -webkit-baseline-middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.bar-button::after {
  left: -2px;
  right: -2px;
  top: -7px;
  bottom: -6px;
  position: absolute;
  content: "";
}

.bar-button-menutoggle {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.back-button {
  display: none;
}

.back-button.show-back-button {
  display: inline-block;
}

.back-button-text {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.toolbar-ios {
  padding: 4px;
  min-height: 44px;
}

.toolbar-background-ios {
  background: #f8f8f8;
}

.header-ios .toolbar-background-ios,
.footer-ios .toolbar-background-ios {
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.3);
}

.header-ios .toolbar-ios:last-child .toolbar-background-ios {
  border-width: 0 0 0.55px;
}

.footer-ios .toolbar-ios:first-child .toolbar-background-ios {
  border-width: 0.55px 0 0;
}

.header-ios[no-border] .toolbar-ios:last-child .toolbar-background-ios {
  border-bottom-width: 0;
}

.footer-ios[no-border] .toolbar-ios:first-child .toolbar-background-ios {
  border-top-width: 0;
}

.toolbar-content-ios {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-ordinal-group: 5;
  -webkit-order: 4;
  -ms-flex-order: 4;
  order: 4;
  min-width: 0;
}

.toolbar-title-ios {
  text-align: center;
  font-size: 1.7rem;
  font-weight: 600;
  color: #000;
  pointer-events: auto;
}

.toolbar-ios ion-title {
  left: 0;
  top: 0;
  padding: 0 90px 1px;
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  pointer-events: none;
}

.bar-buttons-ios {
  -webkit-box-ordinal-group: 4;
  -webkit-order: 3;
  -ms-flex-order: 3;
  order: 3;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.bar-buttons-ios[left] {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
}

.bar-buttons-ios[end] {
  text-align: right;
  text-align: end;
  -webkit-box-ordinal-group: 6;
  -webkit-order: 5;
  -ms-flex-order: 5;
  order: 5;
}

.bar-buttons-ios[right] {
  text-align: right;
  -webkit-box-ordinal-group: 7;
  -webkit-order: 6;
  -ms-flex-order: 6;
  order: 6;
}

.bar-button-ios {
  padding: 0 4px;
  border-radius: 4px;
  height: 32px;
  border: 0;
  font-size: 1.7rem;
}

.bar-button-outline-ios {
  border-width: 1px;
  border-style: solid;
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.bar-button-outline-ios:hover:not(.disable-hover) {
  opacity: .4;
}

.bar-button-outline-ios.activated {
  color: #fff;
  background-color: #0c031d;
}

.bar-button-solid-ios {
  color: #fff;
  background-color: #0c031d;
}

.bar-button-solid-ios:hover:not(.disable-hover) {
  color: #fff;
  opacity: .4;
}

.bar-button-solid-ios.activated {
  color: #fff;
  background-color: #1f172f;
  opacity: .4;
}

.bar-button-ios.bar-button-icon-start ion-icon {
  padding-right: 0.3em;
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
}

.bar-button-ios.bar-button-icon-end ion-icon {
  padding-left: 0.4em;
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
}

.bar-button-ios[icon-only] {
  padding: 0;
  min-width: .9em;
}

.bar-button-ios[icon-only] ion-icon {
  padding: 0 0.1em;
  font-size: 1.8em;
  line-height: .67;
  pointer-events: none;
}

.back-button-ios {
  margin: 0;
  z-index: 99;
  overflow: visible;
  -webkit-box-ordinal-group: 1;
  -webkit-order: 0;
  -ms-flex-order: 0;
  order: 0;
  min-height: 3.2rem;
  line-height: 1;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.back-button-icon-ios {
  margin: -1px 0 0;
  display: inherit;
  min-width: 18px;
  font-size: 3.4rem;
}

.back-button-text-ios {
  letter-spacing: -.01em;
}

.bar-button-menutoggle-ios {
  margin: 0 6px;
  padding: 0;
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
  min-width: 36px;
}

.bar-button-menutoggle-ios ion-icon {
  padding: 0 6px;
  font-size: 2.8rem;
}

.bar-button-menutoggle-ios[end],
.bar-button-menutoggle-ios[right] {
  -webkit-box-ordinal-group: 8;
  -webkit-order: 7;
  -ms-flex-order: 7;
  order: 7;
}

.bar-button-default-ios,
.bar-button-default.bar-button-ios-default,
.bar-button-clear-ios-default {
  color: #0c031d;
  background-color: transparent;
}

.bar-button-default-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-default:hover:not(.disable-hover),
.bar-button-clear-ios-default:hover:not(.disable-hover) {
  color: #0c031d;
}

.bar-button-default-ios.activated,
.bar-button-default.bar-button-ios-default.activated,
.bar-button-clear-ios-default.activated {
  opacity: .4;
}

.bar-button-clear-ios,
.bar-button-default.bar-button-ios-clear,
.bar-button-clear-ios-clear {
  color: #0c031d;
  background-color: transparent;
}

.bar-button-clear-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-clear:hover:not(.disable-hover),
.bar-button-clear-ios-clear:hover:not(.disable-hover) {
  color: #0c031d;
}

.bar-button-clear-ios.activated,
.bar-button-default.bar-button-ios-clear.activated,
.bar-button-clear-ios-clear.activated {
  opacity: .4;
}

.toolbar-ios-primary .toolbar-background-ios {
  background: #0c031d;
}

.toolbar-ios-primary .toolbar-title-ios,
.toolbar-ios-primary .bar-button-clear-ios,
.toolbar-ios-primary .bar-button-default-ios {
  color: #fff;
}

.toolbar-ios-primary .bar-button-primary-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-primary,
.toolbar-ios-primary .bar-button-clear-ios-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-primary-ios:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-ios-primary .bar-button-primary-ios.activated,
.toolbar-ios-primary .bar-button-default.bar-button-ios-primary.activated,
.toolbar-ios-primary .bar-button-clear-ios-primary.activated {
  opacity: .4;
}

.toolbar-ios-primary .bar-button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-primary .bar-button-solid-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-primary .bar-button-solid-ios-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-ios-primary .bar-button-secondary-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-primary .bar-button-clear-ios-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-secondary-ios:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-ios-primary .bar-button-secondary-ios.activated,
.toolbar-ios-primary .bar-button-default.bar-button-ios-secondary.activated,
.toolbar-ios-primary .bar-button-clear-ios-secondary.activated {
  opacity: .4;
}

.toolbar-ios-primary .bar-button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-primary .bar-button-solid-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-primary .bar-button-solid-ios-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-ios-primary .bar-button-danger-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-danger,
.toolbar-ios-primary .bar-button-clear-ios-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-danger-ios:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-ios-primary .bar-button-danger-ios.activated,
.toolbar-ios-primary .bar-button-default.bar-button-ios-danger.activated,
.toolbar-ios-primary .bar-button-clear-ios-danger.activated {
  opacity: .4;
}

.toolbar-ios-primary .bar-button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-primary .bar-button-solid-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-primary .bar-button-solid-ios-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-ios-primary .bar-button-light-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-light,
.toolbar-ios-primary .bar-button-clear-ios-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-light-ios:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-ios-primary .bar-button-light-ios.activated,
.toolbar-ios-primary .bar-button-default.bar-button-ios-light.activated,
.toolbar-ios-primary .bar-button-clear-ios-light.activated {
  opacity: .4;
}

.toolbar-ios-primary .bar-button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-primary .bar-button-solid-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-primary .bar-button-solid-ios-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-ios-primary .bar-button-dark-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-dark,
.toolbar-ios-primary .bar-button-clear-ios-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-dark-ios:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-ios-primary .bar-button-dark-ios.activated,
.toolbar-ios-primary .bar-button-default.bar-button-ios-dark.activated,
.toolbar-ios-primary .bar-button-clear-ios-dark.activated {
  opacity: .4;
}

.toolbar-ios-primary .bar-button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-primary .bar-button-solid-ios-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-primary .bar-button-solid-ios-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-ios-primary .bar-button-menuinicial-ios,
.toolbar-ios-primary .bar-button-default.bar-button-ios-menuinicial,
.toolbar-ios-primary .bar-button-clear-ios-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-menuinicial-ios:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-default.bar-button-ios-menuinicial:hover:not(.disable-hover),
.toolbar-ios-primary .bar-button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-ios-primary .bar-button-menuinicial-ios.activated,
.toolbar-ios-primary .bar-button-default.bar-button-ios-menuinicial.activated,
.toolbar-ios-primary .bar-button-clear-ios-menuinicial.activated {
  opacity: .4;
}

.toolbar-ios-primary .bar-button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.toolbar-ios-primary .bar-button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.toolbar-ios-primary .bar-button-solid-ios-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-ios-primary .bar-button-solid-ios-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-primary-ios,
.bar-button-default.bar-button-ios-primary,
.bar-button-clear-ios-primary {
  color: #0c031d;
  background-color: transparent;
}

.bar-button-primary-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
.bar-button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.bar-button-primary-ios.activated,
.bar-button-default.bar-button-ios-primary.activated,
.bar-button-clear-ios-primary.activated {
  opacity: .4;
}

.bar-button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.bar-button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.bar-button-solid-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.bar-button-solid-ios-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-ios-secondary .toolbar-background-ios {
  background: #969696;
}

.toolbar-ios-secondary .toolbar-title-ios,
.toolbar-ios-secondary .bar-button-clear-ios,
.toolbar-ios-secondary .bar-button-default-ios {
  color: #fff;
}

.toolbar-ios-secondary .bar-button-primary-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-primary,
.toolbar-ios-secondary .bar-button-clear-ios-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-primary-ios:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-ios-secondary .bar-button-primary-ios.activated,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-primary.activated,
.toolbar-ios-secondary .bar-button-clear-ios-primary.activated {
  opacity: .4;
}

.toolbar-ios-secondary .bar-button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-secondary .bar-button-solid-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-secondary .bar-button-solid-ios-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-ios-secondary .bar-button-secondary-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-secondary .bar-button-clear-ios-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-secondary-ios:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-ios-secondary .bar-button-secondary-ios.activated,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-secondary.activated,
.toolbar-ios-secondary .bar-button-clear-ios-secondary.activated {
  opacity: .4;
}

.toolbar-ios-secondary .bar-button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-secondary .bar-button-solid-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-secondary .bar-button-solid-ios-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-ios-secondary .bar-button-danger-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-danger,
.toolbar-ios-secondary .bar-button-clear-ios-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-danger-ios:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-ios-secondary .bar-button-danger-ios.activated,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-danger.activated,
.toolbar-ios-secondary .bar-button-clear-ios-danger.activated {
  opacity: .4;
}

.toolbar-ios-secondary .bar-button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-secondary .bar-button-solid-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-secondary .bar-button-solid-ios-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-ios-secondary .bar-button-light-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-light,
.toolbar-ios-secondary .bar-button-clear-ios-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-light-ios:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-ios-secondary .bar-button-light-ios.activated,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-light.activated,
.toolbar-ios-secondary .bar-button-clear-ios-light.activated {
  opacity: .4;
}

.toolbar-ios-secondary .bar-button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-secondary .bar-button-solid-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-secondary .bar-button-solid-ios-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-ios-secondary .bar-button-dark-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-dark,
.toolbar-ios-secondary .bar-button-clear-ios-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-dark-ios:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-ios-secondary .bar-button-dark-ios.activated,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-dark.activated,
.toolbar-ios-secondary .bar-button-clear-ios-dark.activated {
  opacity: .4;
}

.toolbar-ios-secondary .bar-button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-secondary .bar-button-solid-ios-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-secondary .bar-button-solid-ios-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-ios-secondary .bar-button-menuinicial-ios,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-menuinicial,
.toolbar-ios-secondary .bar-button-clear-ios-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-menuinicial-ios:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-default.bar-button-ios-menuinicial:hover:not(.disable-hover),
.toolbar-ios-secondary .bar-button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-ios-secondary .bar-button-menuinicial-ios.activated,
.toolbar-ios-secondary .bar-button-default.bar-button-ios-menuinicial.activated,
.toolbar-ios-secondary .bar-button-clear-ios-menuinicial.activated {
  opacity: .4;
}

.toolbar-ios-secondary .bar-button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.toolbar-ios-secondary .bar-button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.toolbar-ios-secondary .bar-button-solid-ios-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-ios-secondary .bar-button-solid-ios-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-secondary-ios,
.bar-button-default.bar-button-ios-secondary,
.bar-button-clear-ios-secondary {
  color: #969696;
  background-color: transparent;
}

.bar-button-secondary-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
.bar-button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.bar-button-secondary-ios.activated,
.bar-button-default.bar-button-ios-secondary.activated,
.bar-button-clear-ios-secondary.activated {
  opacity: .4;
}

.bar-button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.bar-button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.bar-button-solid-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.bar-button-solid-ios-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-ios-danger .toolbar-background-ios {
  background: #7e1111;
}

.toolbar-ios-danger .toolbar-title-ios,
.toolbar-ios-danger .bar-button-clear-ios,
.toolbar-ios-danger .bar-button-default-ios {
  color: #fff;
}

.toolbar-ios-danger .bar-button-primary-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-primary,
.toolbar-ios-danger .bar-button-clear-ios-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-primary-ios:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-ios-danger .bar-button-primary-ios.activated,
.toolbar-ios-danger .bar-button-default.bar-button-ios-primary.activated,
.toolbar-ios-danger .bar-button-clear-ios-primary.activated {
  opacity: .4;
}

.toolbar-ios-danger .bar-button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-danger .bar-button-solid-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-danger .bar-button-solid-ios-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-ios-danger .bar-button-secondary-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-danger .bar-button-clear-ios-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-secondary-ios:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-ios-danger .bar-button-secondary-ios.activated,
.toolbar-ios-danger .bar-button-default.bar-button-ios-secondary.activated,
.toolbar-ios-danger .bar-button-clear-ios-secondary.activated {
  opacity: .4;
}

.toolbar-ios-danger .bar-button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-danger .bar-button-solid-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-danger .bar-button-solid-ios-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-ios-danger .bar-button-danger-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-danger,
.toolbar-ios-danger .bar-button-clear-ios-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-danger-ios:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-ios-danger .bar-button-danger-ios.activated,
.toolbar-ios-danger .bar-button-default.bar-button-ios-danger.activated,
.toolbar-ios-danger .bar-button-clear-ios-danger.activated {
  opacity: .4;
}

.toolbar-ios-danger .bar-button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-danger .bar-button-solid-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-danger .bar-button-solid-ios-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-ios-danger .bar-button-light-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-light,
.toolbar-ios-danger .bar-button-clear-ios-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-light-ios:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-ios-danger .bar-button-light-ios.activated,
.toolbar-ios-danger .bar-button-default.bar-button-ios-light.activated,
.toolbar-ios-danger .bar-button-clear-ios-light.activated {
  opacity: .4;
}

.toolbar-ios-danger .bar-button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-danger .bar-button-solid-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-danger .bar-button-solid-ios-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-ios-danger .bar-button-dark-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-dark,
.toolbar-ios-danger .bar-button-clear-ios-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-dark-ios:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-ios-danger .bar-button-dark-ios.activated,
.toolbar-ios-danger .bar-button-default.bar-button-ios-dark.activated,
.toolbar-ios-danger .bar-button-clear-ios-dark.activated {
  opacity: .4;
}

.toolbar-ios-danger .bar-button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-danger .bar-button-solid-ios-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-danger .bar-button-solid-ios-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-ios-danger .bar-button-menuinicial-ios,
.toolbar-ios-danger .bar-button-default.bar-button-ios-menuinicial,
.toolbar-ios-danger .bar-button-clear-ios-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-menuinicial-ios:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-default.bar-button-ios-menuinicial:hover:not(.disable-hover),
.toolbar-ios-danger .bar-button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-ios-danger .bar-button-menuinicial-ios.activated,
.toolbar-ios-danger .bar-button-default.bar-button-ios-menuinicial.activated,
.toolbar-ios-danger .bar-button-clear-ios-menuinicial.activated {
  opacity: .4;
}

.toolbar-ios-danger .bar-button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.toolbar-ios-danger .bar-button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.toolbar-ios-danger .bar-button-solid-ios-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-ios-danger .bar-button-solid-ios-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-danger-ios,
.bar-button-default.bar-button-ios-danger,
.bar-button-clear-ios-danger {
  color: #7e1111;
  background-color: transparent;
}

.bar-button-danger-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
.bar-button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.bar-button-danger-ios.activated,
.bar-button-default.bar-button-ios-danger.activated,
.bar-button-clear-ios-danger.activated {
  opacity: .4;
}

.bar-button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.bar-button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.bar-button-solid-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.bar-button-solid-ios-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-ios-light .toolbar-background-ios {
  background: #f4f4f4;
}

.toolbar-ios-light .toolbar-title-ios,
.toolbar-ios-light .bar-button-clear-ios,
.toolbar-ios-light .bar-button-default-ios {
  color: #000;
}

.toolbar-ios-light .bar-button-primary-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-primary,
.toolbar-ios-light .bar-button-clear-ios-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-primary-ios:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-ios-light .bar-button-primary-ios.activated,
.toolbar-ios-light .bar-button-default.bar-button-ios-primary.activated,
.toolbar-ios-light .bar-button-clear-ios-primary.activated {
  opacity: .4;
}

.toolbar-ios-light .bar-button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-light .bar-button-solid-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-light .bar-button-solid-ios-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-ios-light .bar-button-secondary-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-light .bar-button-clear-ios-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-secondary-ios:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-ios-light .bar-button-secondary-ios.activated,
.toolbar-ios-light .bar-button-default.bar-button-ios-secondary.activated,
.toolbar-ios-light .bar-button-clear-ios-secondary.activated {
  opacity: .4;
}

.toolbar-ios-light .bar-button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-light .bar-button-solid-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-light .bar-button-solid-ios-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-ios-light .bar-button-danger-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-danger,
.toolbar-ios-light .bar-button-clear-ios-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-danger-ios:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-ios-light .bar-button-danger-ios.activated,
.toolbar-ios-light .bar-button-default.bar-button-ios-danger.activated,
.toolbar-ios-light .bar-button-clear-ios-danger.activated {
  opacity: .4;
}

.toolbar-ios-light .bar-button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-light .bar-button-solid-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-light .bar-button-solid-ios-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-ios-light .bar-button-light-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-light,
.toolbar-ios-light .bar-button-clear-ios-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-light-ios:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-ios-light .bar-button-light-ios.activated,
.toolbar-ios-light .bar-button-default.bar-button-ios-light.activated,
.toolbar-ios-light .bar-button-clear-ios-light.activated {
  opacity: .4;
}

.toolbar-ios-light .bar-button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-light .bar-button-solid-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-light .bar-button-solid-ios-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-ios-light .bar-button-dark-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-dark,
.toolbar-ios-light .bar-button-clear-ios-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-dark-ios:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-ios-light .bar-button-dark-ios.activated,
.toolbar-ios-light .bar-button-default.bar-button-ios-dark.activated,
.toolbar-ios-light .bar-button-clear-ios-dark.activated {
  opacity: .4;
}

.toolbar-ios-light .bar-button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-light .bar-button-solid-ios-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-light .bar-button-solid-ios-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-ios-light .bar-button-menuinicial-ios,
.toolbar-ios-light .bar-button-default.bar-button-ios-menuinicial,
.toolbar-ios-light .bar-button-clear-ios-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-menuinicial-ios:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-default.bar-button-ios-menuinicial:hover:not(.disable-hover),
.toolbar-ios-light .bar-button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-ios-light .bar-button-menuinicial-ios.activated,
.toolbar-ios-light .bar-button-default.bar-button-ios-menuinicial.activated,
.toolbar-ios-light .bar-button-clear-ios-menuinicial.activated {
  opacity: .4;
}

.toolbar-ios-light .bar-button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.toolbar-ios-light .bar-button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.toolbar-ios-light .bar-button-solid-ios-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-ios-light .bar-button-solid-ios-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-light-ios,
.bar-button-default.bar-button-ios-light,
.bar-button-clear-ios-light {
  color: #f4f4f4;
  background-color: transparent;
}

.bar-button-light-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
.bar-button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.bar-button-light-ios.activated,
.bar-button-default.bar-button-ios-light.activated,
.bar-button-clear-ios-light.activated {
  opacity: .4;
}

.bar-button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.bar-button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.bar-button-solid-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.bar-button-solid-ios-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-ios-dark .toolbar-background-ios {
  background: #000000;
}

.toolbar-ios-dark .toolbar-title-ios,
.toolbar-ios-dark .bar-button-clear-ios,
.toolbar-ios-dark .bar-button-default-ios {
  color: #fff;
}

.toolbar-ios-dark .bar-button-primary-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-primary,
.toolbar-ios-dark .bar-button-clear-ios-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-primary-ios:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-ios-dark .bar-button-primary-ios.activated,
.toolbar-ios-dark .bar-button-default.bar-button-ios-primary.activated,
.toolbar-ios-dark .bar-button-clear-ios-primary.activated {
  opacity: .4;
}

.toolbar-ios-dark .bar-button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-dark .bar-button-solid-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-dark .bar-button-solid-ios-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-ios-dark .bar-button-secondary-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-dark .bar-button-clear-ios-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-secondary-ios:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-ios-dark .bar-button-secondary-ios.activated,
.toolbar-ios-dark .bar-button-default.bar-button-ios-secondary.activated,
.toolbar-ios-dark .bar-button-clear-ios-secondary.activated {
  opacity: .4;
}

.toolbar-ios-dark .bar-button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-dark .bar-button-solid-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-dark .bar-button-solid-ios-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-ios-dark .bar-button-danger-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-danger,
.toolbar-ios-dark .bar-button-clear-ios-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-danger-ios:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-ios-dark .bar-button-danger-ios.activated,
.toolbar-ios-dark .bar-button-default.bar-button-ios-danger.activated,
.toolbar-ios-dark .bar-button-clear-ios-danger.activated {
  opacity: .4;
}

.toolbar-ios-dark .bar-button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-dark .bar-button-solid-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-dark .bar-button-solid-ios-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-ios-dark .bar-button-light-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-light,
.toolbar-ios-dark .bar-button-clear-ios-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-light-ios:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-ios-dark .bar-button-light-ios.activated,
.toolbar-ios-dark .bar-button-default.bar-button-ios-light.activated,
.toolbar-ios-dark .bar-button-clear-ios-light.activated {
  opacity: .4;
}

.toolbar-ios-dark .bar-button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-dark .bar-button-solid-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-dark .bar-button-solid-ios-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-ios-dark .bar-button-dark-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-dark,
.toolbar-ios-dark .bar-button-clear-ios-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-dark-ios:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-ios-dark .bar-button-dark-ios.activated,
.toolbar-ios-dark .bar-button-default.bar-button-ios-dark.activated,
.toolbar-ios-dark .bar-button-clear-ios-dark.activated {
  opacity: .4;
}

.toolbar-ios-dark .bar-button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-dark .bar-button-solid-ios-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-dark .bar-button-solid-ios-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-ios-dark .bar-button-menuinicial-ios,
.toolbar-ios-dark .bar-button-default.bar-button-ios-menuinicial,
.toolbar-ios-dark .bar-button-clear-ios-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-menuinicial-ios:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-default.bar-button-ios-menuinicial:hover:not(.disable-hover),
.toolbar-ios-dark .bar-button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-ios-dark .bar-button-menuinicial-ios.activated,
.toolbar-ios-dark .bar-button-default.bar-button-ios-menuinicial.activated,
.toolbar-ios-dark .bar-button-clear-ios-menuinicial.activated {
  opacity: .4;
}

.toolbar-ios-dark .bar-button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.toolbar-ios-dark .bar-button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.toolbar-ios-dark .bar-button-solid-ios-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-ios-dark .bar-button-solid-ios-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-dark-ios,
.bar-button-default.bar-button-ios-dark,
.bar-button-clear-ios-dark {
  color: #000000;
  background-color: transparent;
}

.bar-button-dark-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
.bar-button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.bar-button-dark-ios.activated,
.bar-button-default.bar-button-ios-dark.activated,
.bar-button-clear-ios-dark.activated {
  opacity: .4;
}

.bar-button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.bar-button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.bar-button-solid-ios-dark {
  color: #fff;
  background-color: #000000;
}

.bar-button-solid-ios-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-ios-menuinicial .toolbar-background-ios {
  background: white;
}

.toolbar-ios-menuinicial .toolbar-title-ios,
.toolbar-ios-menuinicial .bar-button-clear-ios,
.toolbar-ios-menuinicial .bar-button-default-ios {
  color: #000;
}

.toolbar-ios-menuinicial .bar-button-primary-ios,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-primary,
.toolbar-ios-menuinicial .bar-button-clear-ios-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-primary-ios:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-primary:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-clear-ios-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-ios-menuinicial .bar-button-primary-ios.activated,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-primary.activated,
.toolbar-ios-menuinicial .bar-button-clear-ios-primary.activated {
  opacity: .4;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-primary {
  border-color: #0c031d;
  color: #0c031d;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-primary.activated {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-ios-menuinicial .bar-button-secondary-ios,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-secondary,
.toolbar-ios-menuinicial .bar-button-clear-ios-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-secondary-ios:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-secondary:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-clear-ios-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-ios-menuinicial .bar-button-secondary-ios.activated,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-secondary.activated,
.toolbar-ios-menuinicial .bar-button-clear-ios-secondary.activated {
  opacity: .4;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-secondary {
  border-color: #969696;
  color: #969696;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-secondary.activated {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-ios-menuinicial .bar-button-danger-ios,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-danger,
.toolbar-ios-menuinicial .bar-button-clear-ios-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-danger-ios:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-danger:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-clear-ios-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-ios-menuinicial .bar-button-danger-ios.activated,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-danger.activated,
.toolbar-ios-menuinicial .bar-button-clear-ios-danger.activated {
  opacity: .4;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-danger {
  border-color: #7e1111;
  color: #7e1111;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-danger.activated {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-ios-menuinicial .bar-button-light-ios,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-light,
.toolbar-ios-menuinicial .bar-button-clear-ios-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-light-ios:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-light:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-clear-ios-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-ios-menuinicial .bar-button-light-ios.activated,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-light.activated,
.toolbar-ios-menuinicial .bar-button-clear-ios-light.activated {
  opacity: .4;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-light {
  border-color: #f4f4f4;
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-light.activated {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-ios-menuinicial .bar-button-dark-ios,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-dark,
.toolbar-ios-menuinicial .bar-button-clear-ios-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-dark-ios:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-dark:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-clear-ios-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-ios-menuinicial .bar-button-dark-ios.activated,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-dark.activated,
.toolbar-ios-menuinicial .bar-button-clear-ios-dark.activated {
  opacity: .4;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-dark {
  border-color: #000000;
  color: #000000;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-dark.activated {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-ios-menuinicial .bar-button-menuinicial-ios,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-menuinicial,
.toolbar-ios-menuinicial .bar-button-clear-ios-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-menuinicial-ios:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-menuinicial:hover:not(.disable-hover),
.toolbar-ios-menuinicial .bar-button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-ios-menuinicial .bar-button-menuinicial-ios.activated,
.toolbar-ios-menuinicial .bar-button-default.bar-button-ios-menuinicial.activated,
.toolbar-ios-menuinicial .bar-button-clear-ios-menuinicial.activated {
  opacity: .4;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.toolbar-ios-menuinicial .bar-button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-ios-menuinicial .bar-button-solid-ios-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-menuinicial-ios,
.bar-button-default.bar-button-ios-menuinicial,
.bar-button-clear-ios-menuinicial {
  color: white;
  background-color: transparent;
}

.bar-button-menuinicial-ios:hover:not(.disable-hover),
.bar-button-default.bar-button-ios-menuinicial:hover:not(.disable-hover),
.bar-button-clear-ios-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.bar-button-menuinicial-ios.activated,
.bar-button-default.bar-button-ios-menuinicial.activated,
.bar-button-clear-ios-menuinicial.activated {
  opacity: .4;
}

.bar-button-outline-ios-menuinicial {
  border-color: white;
  color: white;
  background-color: transparent;
}

.bar-button-outline-ios-menuinicial.activated {
  color: #000;
  background-color: white;
}

.bar-button-solid-ios-menuinicial {
  color: #000;
  background-color: white;
}

.bar-button-solid-ios-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-strong-ios {
  font-weight: 600;
}

.toolbar-md {
  padding: 4px;
  min-height: 56px;
}

.toolbar-background-md {
  border-color: #b2b2b2;
  background: #f8f8f8;
}

.header-md::after,
.tabs-md[tabsPlacement="top"] > .tabbar::after,
.footer-md::before,
.tabs-md[tabsPlacement="bottom"] > .tabbar::before {
  left: 0;
  bottom: -5px;
  background-position: left 0 top -2px;
  position: absolute;
  width: 100%;
  height: 5px;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAHBAMAAADzDtBxAAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABXRSTlMUCS0gBIh/TXEAAAAaSURBVAjXYxCEAgY4UIICBmMogMsgFLtAAQCNSwXZKOdPxgAAAABJRU5ErkJggg==);
  background-repeat: repeat-x;
  content: "";
}

.footer-md::before,
.tabs-md[tabsPlacement="bottom"] > .tabbar::before {
  top: -2px;
  bottom: auto;
  background-position: left 0 top 0;
  height: 2px;
}

.header-md[no-border]::after,
.footer-md[no-border]::before,
.tabs-md[tabsPlacement="top"][no-border] > .tabbar::after,
.tabs-md[tabsPlacement="bottom"][no-border] > .tabbar::before {
  display: none;
}

.toolbar-content-md {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-ordinal-group: 4;
  -webkit-order: 3;
  -ms-flex-order: 3;
  order: 3;
  min-width: 0;
  max-width: 100%;
}

.toolbar-title-md {
  padding: 0 12px;
  font-size: 2rem;
  font-weight: 500;
  color: #424242;
}

.bar-buttons-md {
  -webkit-box-ordinal-group: 5;
  -webkit-order: 4;
  -ms-flex-order: 4;
  order: 4;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.bar-buttons-md[left] {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
}

.bar-button-md:first-child {
  margin-left: 0;
}

.bar-buttons-md[end] {
  text-align: right;
  text-align: end;
  -webkit-box-ordinal-group: 6;
  -webkit-order: 5;
  -ms-flex-order: 5;
  order: 5;
}

.bar-buttons-md[right] {
  text-align: right;
  -webkit-box-ordinal-group: 7;
  -webkit-order: 6;
  -ms-flex-order: 6;
  order: 6;
}

.bar-button-md {
  margin: 0 0.2rem;
  padding: 0 5px;
  border-radius: 2px;
  height: 32px;
  border: 0;
  font-size: 1.4rem;
  font-weight: 500;
  text-transform: uppercase;
}

.bar-button-solid-md,
.bar-button-outline-md {
  overflow: hidden;
}

.bar-button-outline-md {
  border-width: 1px;
  border-style: solid;
  border-color: #424242;
  color: #424242;
  background-color: transparent;
}

.bar-button-outline-md:hover:not(.disable-hover) {
  opacity: .4;
}

.bar-button-outline-md.activated {
  background-color: transparent;
}

.bar-button-outline-md .button-effect {
  background-color: #424242;
}

.bar-button-solid-md {
  color: #fff;
  background-color: #424242;
}

.bar-button-solid-md:hover:not(.disable-hover) {
  color: #fff;
}

.bar-button-solid-md.activated {
  color: #fff;
  background-color: #515151;
}

.bar-button-md.bar-button-icon-start ion-icon {
  padding-right: 0.3em;
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
}

.bar-button-md.bar-button-icon-end ion-icon {
  padding-left: 0.4em;
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
}

.bar-button-md[icon-only] {
  padding: 0;
}

.bar-button-md[icon-only] ion-icon {
  padding: 0 0.1em;
  min-width: 28px;
  font-size: 1.8em;
  line-height: .67;
  pointer-events: none;
}

.back-button-md {
  margin: 0 6px;
  min-width: 44px;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.back-button-icon-md {
  margin: 0;
  padding: 0 6px;
  text-align: left;
  text-align: start;
  font-size: 2.4rem;
  font-weight: normal;
}

.bar-button-menutoggle-md {
  margin: 0 6px;
  padding: 0 2px;
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
  min-width: 44px;
}

.bar-button-menutoggle-md ion-icon {
  padding: 0 6px;
  font-size: 2.4rem;
}

.bar-button-menutoggle-md[end],
.bar-button-menutoggle-md[right] {
  margin: 0 2px;
  -webkit-box-ordinal-group: 8;
  -webkit-order: 7;
  -ms-flex-order: 7;
  order: 7;
  min-width: 28px;
}

.bar-button-default-md,
.bar-button-clear-md-default,
.bar-button-md-default {
  color: #424242;
  background-color: transparent;
}

.bar-button-default-md:hover:not(.disable-hover),
.bar-button-clear-md-default:hover:not(.disable-hover),
.bar-button-md-default:hover:not(.disable-hover) {
  color: #424242;
}

.bar-button-clear-md,
.bar-button-clear-md-clear,
.bar-button-md-clear {
  color: #424242;
  background-color: transparent;
}

.bar-button-clear-md:hover:not(.disable-hover),
.bar-button-clear-md-clear:hover:not(.disable-hover),
.bar-button-md-clear:hover:not(.disable-hover) {
  color: #424242;
}

.toolbar-md-primary .toolbar-background-md {
  background: #0c031d;
}

.toolbar-md-primary .bar-button-clear-md,
.toolbar-md-primary .bar-button-default-md,
.toolbar-md-primary .bar-button-outline-md,
.toolbar-md-primary .toolbar-title-md {
  color: #fff;
}

.toolbar-md-primary .bar-button-clear-md .button-effect,
.toolbar-md-primary .bar-button-default-md .button-effect,
.toolbar-md-primary .bar-button-outline-md .button-effect {
  background-color: #fff;
}

.toolbar-md-primary .bar-button-outline-md {
  border-color: #fff;
}

.toolbar-md-primary .bar-button-primary-md,
.toolbar-md-primary .bar-button-clear-md-primary,
.toolbar-md-primary .bar-button-md-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-primary-md:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-clear-md-primary:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-md-primary .bar-button-outline-md-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-primary.activated {
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-primary .button-effect {
  background-color: #1f172f;
}

.toolbar-md-primary .bar-button-solid-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-md-primary .bar-button-solid-md-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-md-primary .bar-button-secondary-md,
.toolbar-md-primary .bar-button-clear-md-secondary,
.toolbar-md-primary .bar-button-md-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-secondary-md:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-clear-md-secondary:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-md-primary .bar-button-outline-md-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-secondary.activated {
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-secondary .button-effect {
  background-color: #8a8a8a;
}

.toolbar-md-primary .bar-button-solid-md-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-md-primary .bar-button-solid-md-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-md-primary .bar-button-danger-md,
.toolbar-md-primary .bar-button-clear-md-danger,
.toolbar-md-primary .bar-button-md-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-danger-md:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-clear-md-danger:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-md-primary .bar-button-outline-md-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-danger.activated {
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-danger .button-effect {
  background-color: #882424;
}

.toolbar-md-primary .bar-button-solid-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-md-primary .bar-button-solid-md-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-md-primary .bar-button-light-md,
.toolbar-md-primary .bar-button-clear-md-light,
.toolbar-md-primary .bar-button-md-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-light-md:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-clear-md-light:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-md-primary .bar-button-outline-md-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-light.activated {
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-light .button-effect {
  background-color: #e0e0e0;
}

.toolbar-md-primary .bar-button-solid-md-light {
  color: #424242;
  background-color: #f4f4f4;
}

.toolbar-md-primary .bar-button-solid-md-light.activated {
  color: #424242;
  background-color: #e0e0e0;
}

.toolbar-md-primary .bar-button-dark-md,
.toolbar-md-primary .bar-button-clear-md-dark,
.toolbar-md-primary .bar-button-md-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-dark-md:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-clear-md-dark:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-md-primary .bar-button-outline-md-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-dark.activated {
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-dark .button-effect {
  background-color: #141414;
}

.toolbar-md-primary .bar-button-solid-md-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-md-primary .bar-button-solid-md-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-md-primary .bar-button-menuinicial-md,
.toolbar-md-primary .bar-button-clear-md-menuinicial,
.toolbar-md-primary .bar-button-md-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-menuinicial-md:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-clear-md-menuinicial:hover:not(.disable-hover),
.toolbar-md-primary .bar-button-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-md-primary .bar-button-outline-md-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.toolbar-md-primary .bar-button-outline-md-menuinicial .button-effect {
  background-color: #ebebeb;
}

.toolbar-md-primary .bar-button-solid-md-menuinicial {
  color: #424242;
  background-color: white;
}

.toolbar-md-primary .bar-button-solid-md-menuinicial.activated {
  color: #424242;
  background-color: #ebebeb;
}

.bar-button-primary-md,
.bar-button-clear-md-primary,
.bar-button-md-primary {
  color: #0c031d;
  background-color: transparent;
}

.bar-button-primary-md:hover:not(.disable-hover),
.bar-button-clear-md-primary:hover:not(.disable-hover),
.bar-button-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.bar-button-outline-md-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.bar-button-outline-md-primary.activated {
  background-color: transparent;
}

.bar-button-outline-md-primary .button-effect {
  background-color: #1f172f;
}

.bar-button-solid-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.bar-button-solid-md-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-md-secondary .toolbar-background-md {
  background: #969696;
}

.toolbar-md-secondary .bar-button-clear-md,
.toolbar-md-secondary .bar-button-default-md,
.toolbar-md-secondary .bar-button-outline-md,
.toolbar-md-secondary .toolbar-title-md {
  color: #fff;
}

.toolbar-md-secondary .bar-button-clear-md .button-effect,
.toolbar-md-secondary .bar-button-default-md .button-effect,
.toolbar-md-secondary .bar-button-outline-md .button-effect {
  background-color: #fff;
}

.toolbar-md-secondary .bar-button-outline-md {
  border-color: #fff;
}

.toolbar-md-secondary .bar-button-primary-md,
.toolbar-md-secondary .bar-button-clear-md-primary,
.toolbar-md-secondary .bar-button-md-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-primary-md:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-clear-md-primary:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-md-secondary .bar-button-outline-md-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-primary.activated {
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-primary .button-effect {
  background-color: #1f172f;
}

.toolbar-md-secondary .bar-button-solid-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-md-secondary .bar-button-solid-md-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-md-secondary .bar-button-secondary-md,
.toolbar-md-secondary .bar-button-clear-md-secondary,
.toolbar-md-secondary .bar-button-md-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-secondary-md:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-clear-md-secondary:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-md-secondary .bar-button-outline-md-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-secondary.activated {
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-secondary .button-effect {
  background-color: #8a8a8a;
}

.toolbar-md-secondary .bar-button-solid-md-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-md-secondary .bar-button-solid-md-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-md-secondary .bar-button-danger-md,
.toolbar-md-secondary .bar-button-clear-md-danger,
.toolbar-md-secondary .bar-button-md-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-danger-md:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-clear-md-danger:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-md-secondary .bar-button-outline-md-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-danger.activated {
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-danger .button-effect {
  background-color: #882424;
}

.toolbar-md-secondary .bar-button-solid-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-md-secondary .bar-button-solid-md-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-md-secondary .bar-button-light-md,
.toolbar-md-secondary .bar-button-clear-md-light,
.toolbar-md-secondary .bar-button-md-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-light-md:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-clear-md-light:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-md-secondary .bar-button-outline-md-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-light.activated {
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-light .button-effect {
  background-color: #e0e0e0;
}

.toolbar-md-secondary .bar-button-solid-md-light {
  color: #424242;
  background-color: #f4f4f4;
}

.toolbar-md-secondary .bar-button-solid-md-light.activated {
  color: #424242;
  background-color: #e0e0e0;
}

.toolbar-md-secondary .bar-button-dark-md,
.toolbar-md-secondary .bar-button-clear-md-dark,
.toolbar-md-secondary .bar-button-md-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-dark-md:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-clear-md-dark:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-md-secondary .bar-button-outline-md-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-dark.activated {
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-dark .button-effect {
  background-color: #141414;
}

.toolbar-md-secondary .bar-button-solid-md-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-md-secondary .bar-button-solid-md-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-md-secondary .bar-button-menuinicial-md,
.toolbar-md-secondary .bar-button-clear-md-menuinicial,
.toolbar-md-secondary .bar-button-md-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-menuinicial-md:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-clear-md-menuinicial:hover:not(.disable-hover),
.toolbar-md-secondary .bar-button-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-md-secondary .bar-button-outline-md-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.toolbar-md-secondary .bar-button-outline-md-menuinicial .button-effect {
  background-color: #ebebeb;
}

.toolbar-md-secondary .bar-button-solid-md-menuinicial {
  color: #424242;
  background-color: white;
}

.toolbar-md-secondary .bar-button-solid-md-menuinicial.activated {
  color: #424242;
  background-color: #ebebeb;
}

.bar-button-secondary-md,
.bar-button-clear-md-secondary,
.bar-button-md-secondary {
  color: #969696;
  background-color: transparent;
}

.bar-button-secondary-md:hover:not(.disable-hover),
.bar-button-clear-md-secondary:hover:not(.disable-hover),
.bar-button-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.bar-button-outline-md-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.bar-button-outline-md-secondary.activated {
  background-color: transparent;
}

.bar-button-outline-md-secondary .button-effect {
  background-color: #8a8a8a;
}

.bar-button-solid-md-secondary {
  color: #fff;
  background-color: #969696;
}

.bar-button-solid-md-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-md-danger .toolbar-background-md {
  background: #7e1111;
}

.toolbar-md-danger .bar-button-clear-md,
.toolbar-md-danger .bar-button-default-md,
.toolbar-md-danger .bar-button-outline-md,
.toolbar-md-danger .toolbar-title-md {
  color: #fff;
}

.toolbar-md-danger .bar-button-clear-md .button-effect,
.toolbar-md-danger .bar-button-default-md .button-effect,
.toolbar-md-danger .bar-button-outline-md .button-effect {
  background-color: #fff;
}

.toolbar-md-danger .bar-button-outline-md {
  border-color: #fff;
}

.toolbar-md-danger .bar-button-primary-md,
.toolbar-md-danger .bar-button-clear-md-primary,
.toolbar-md-danger .bar-button-md-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-primary-md:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-clear-md-primary:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-md-danger .bar-button-outline-md-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-primary.activated {
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-primary .button-effect {
  background-color: #1f172f;
}

.toolbar-md-danger .bar-button-solid-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-md-danger .bar-button-solid-md-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-md-danger .bar-button-secondary-md,
.toolbar-md-danger .bar-button-clear-md-secondary,
.toolbar-md-danger .bar-button-md-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-secondary-md:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-clear-md-secondary:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-md-danger .bar-button-outline-md-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-secondary.activated {
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-secondary .button-effect {
  background-color: #8a8a8a;
}

.toolbar-md-danger .bar-button-solid-md-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-md-danger .bar-button-solid-md-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-md-danger .bar-button-danger-md,
.toolbar-md-danger .bar-button-clear-md-danger,
.toolbar-md-danger .bar-button-md-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-danger-md:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-clear-md-danger:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-md-danger .bar-button-outline-md-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-danger.activated {
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-danger .button-effect {
  background-color: #882424;
}

.toolbar-md-danger .bar-button-solid-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-md-danger .bar-button-solid-md-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-md-danger .bar-button-light-md,
.toolbar-md-danger .bar-button-clear-md-light,
.toolbar-md-danger .bar-button-md-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-light-md:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-clear-md-light:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-md-danger .bar-button-outline-md-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-light.activated {
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-light .button-effect {
  background-color: #e0e0e0;
}

.toolbar-md-danger .bar-button-solid-md-light {
  color: #424242;
  background-color: #f4f4f4;
}

.toolbar-md-danger .bar-button-solid-md-light.activated {
  color: #424242;
  background-color: #e0e0e0;
}

.toolbar-md-danger .bar-button-dark-md,
.toolbar-md-danger .bar-button-clear-md-dark,
.toolbar-md-danger .bar-button-md-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-dark-md:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-clear-md-dark:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-md-danger .bar-button-outline-md-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-dark.activated {
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-dark .button-effect {
  background-color: #141414;
}

.toolbar-md-danger .bar-button-solid-md-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-md-danger .bar-button-solid-md-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-md-danger .bar-button-menuinicial-md,
.toolbar-md-danger .bar-button-clear-md-menuinicial,
.toolbar-md-danger .bar-button-md-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-menuinicial-md:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-clear-md-menuinicial:hover:not(.disable-hover),
.toolbar-md-danger .bar-button-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-md-danger .bar-button-outline-md-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.toolbar-md-danger .bar-button-outline-md-menuinicial .button-effect {
  background-color: #ebebeb;
}

.toolbar-md-danger .bar-button-solid-md-menuinicial {
  color: #424242;
  background-color: white;
}

.toolbar-md-danger .bar-button-solid-md-menuinicial.activated {
  color: #424242;
  background-color: #ebebeb;
}

.bar-button-danger-md,
.bar-button-clear-md-danger,
.bar-button-md-danger {
  color: #7e1111;
  background-color: transparent;
}

.bar-button-danger-md:hover:not(.disable-hover),
.bar-button-clear-md-danger:hover:not(.disable-hover),
.bar-button-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.bar-button-outline-md-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.bar-button-outline-md-danger.activated {
  background-color: transparent;
}

.bar-button-outline-md-danger .button-effect {
  background-color: #882424;
}

.bar-button-solid-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.bar-button-solid-md-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-md-light .toolbar-background-md {
  background: #f4f4f4;
}

.toolbar-md-light .bar-button-clear-md,
.toolbar-md-light .bar-button-default-md,
.toolbar-md-light .bar-button-outline-md,
.toolbar-md-light .toolbar-title-md {
  color: #424242;
}

.toolbar-md-light .bar-button-clear-md .button-effect,
.toolbar-md-light .bar-button-default-md .button-effect,
.toolbar-md-light .bar-button-outline-md .button-effect {
  background-color: #424242;
}

.toolbar-md-light .bar-button-outline-md {
  border-color: #424242;
}

.toolbar-md-light .bar-button-primary-md,
.toolbar-md-light .bar-button-clear-md-primary,
.toolbar-md-light .bar-button-md-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-md-light .bar-button-primary-md:hover:not(.disable-hover),
.toolbar-md-light .bar-button-clear-md-primary:hover:not(.disable-hover),
.toolbar-md-light .bar-button-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-md-light .bar-button-outline-md-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-primary.activated {
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-primary .button-effect {
  background-color: #1f172f;
}

.toolbar-md-light .bar-button-solid-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-md-light .bar-button-solid-md-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-md-light .bar-button-secondary-md,
.toolbar-md-light .bar-button-clear-md-secondary,
.toolbar-md-light .bar-button-md-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-md-light .bar-button-secondary-md:hover:not(.disable-hover),
.toolbar-md-light .bar-button-clear-md-secondary:hover:not(.disable-hover),
.toolbar-md-light .bar-button-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-md-light .bar-button-outline-md-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-secondary.activated {
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-secondary .button-effect {
  background-color: #8a8a8a;
}

.toolbar-md-light .bar-button-solid-md-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-md-light .bar-button-solid-md-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-md-light .bar-button-danger-md,
.toolbar-md-light .bar-button-clear-md-danger,
.toolbar-md-light .bar-button-md-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-md-light .bar-button-danger-md:hover:not(.disable-hover),
.toolbar-md-light .bar-button-clear-md-danger:hover:not(.disable-hover),
.toolbar-md-light .bar-button-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-md-light .bar-button-outline-md-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-danger.activated {
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-danger .button-effect {
  background-color: #882424;
}

.toolbar-md-light .bar-button-solid-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-md-light .bar-button-solid-md-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-md-light .bar-button-light-md,
.toolbar-md-light .bar-button-clear-md-light,
.toolbar-md-light .bar-button-md-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-md-light .bar-button-light-md:hover:not(.disable-hover),
.toolbar-md-light .bar-button-clear-md-light:hover:not(.disable-hover),
.toolbar-md-light .bar-button-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-md-light .bar-button-outline-md-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-light.activated {
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-light .button-effect {
  background-color: #e0e0e0;
}

.toolbar-md-light .bar-button-solid-md-light {
  color: #424242;
  background-color: #f4f4f4;
}

.toolbar-md-light .bar-button-solid-md-light.activated {
  color: #424242;
  background-color: #e0e0e0;
}

.toolbar-md-light .bar-button-dark-md,
.toolbar-md-light .bar-button-clear-md-dark,
.toolbar-md-light .bar-button-md-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-md-light .bar-button-dark-md:hover:not(.disable-hover),
.toolbar-md-light .bar-button-clear-md-dark:hover:not(.disable-hover),
.toolbar-md-light .bar-button-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-md-light .bar-button-outline-md-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-dark.activated {
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-dark .button-effect {
  background-color: #141414;
}

.toolbar-md-light .bar-button-solid-md-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-md-light .bar-button-solid-md-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-md-light .bar-button-menuinicial-md,
.toolbar-md-light .bar-button-clear-md-menuinicial,
.toolbar-md-light .bar-button-md-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-md-light .bar-button-menuinicial-md:hover:not(.disable-hover),
.toolbar-md-light .bar-button-clear-md-menuinicial:hover:not(.disable-hover),
.toolbar-md-light .bar-button-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-md-light .bar-button-outline-md-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.toolbar-md-light .bar-button-outline-md-menuinicial .button-effect {
  background-color: #ebebeb;
}

.toolbar-md-light .bar-button-solid-md-menuinicial {
  color: #424242;
  background-color: white;
}

.toolbar-md-light .bar-button-solid-md-menuinicial.activated {
  color: #424242;
  background-color: #ebebeb;
}

.bar-button-light-md,
.bar-button-clear-md-light,
.bar-button-md-light {
  color: #f4f4f4;
  background-color: transparent;
}

.bar-button-light-md:hover:not(.disable-hover),
.bar-button-clear-md-light:hover:not(.disable-hover),
.bar-button-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.bar-button-outline-md-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.bar-button-outline-md-light.activated {
  background-color: transparent;
}

.bar-button-outline-md-light .button-effect {
  background-color: #e0e0e0;
}

.bar-button-solid-md-light {
  color: #424242;
  background-color: #f4f4f4;
}

.bar-button-solid-md-light.activated {
  color: #424242;
  background-color: #e0e0e0;
}

.toolbar-md-dark .toolbar-background-md {
  background: #000000;
}

.toolbar-md-dark .bar-button-clear-md,
.toolbar-md-dark .bar-button-default-md,
.toolbar-md-dark .bar-button-outline-md,
.toolbar-md-dark .toolbar-title-md {
  color: #fff;
}

.toolbar-md-dark .bar-button-clear-md .button-effect,
.toolbar-md-dark .bar-button-default-md .button-effect,
.toolbar-md-dark .bar-button-outline-md .button-effect {
  background-color: #fff;
}

.toolbar-md-dark .bar-button-outline-md {
  border-color: #fff;
}

.toolbar-md-dark .bar-button-primary-md,
.toolbar-md-dark .bar-button-clear-md-primary,
.toolbar-md-dark .bar-button-md-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-primary-md:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-clear-md-primary:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-md-dark .bar-button-outline-md-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-primary.activated {
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-primary .button-effect {
  background-color: #1f172f;
}

.toolbar-md-dark .bar-button-solid-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-md-dark .bar-button-solid-md-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-md-dark .bar-button-secondary-md,
.toolbar-md-dark .bar-button-clear-md-secondary,
.toolbar-md-dark .bar-button-md-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-secondary-md:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-clear-md-secondary:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-md-dark .bar-button-outline-md-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-secondary.activated {
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-secondary .button-effect {
  background-color: #8a8a8a;
}

.toolbar-md-dark .bar-button-solid-md-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-md-dark .bar-button-solid-md-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-md-dark .bar-button-danger-md,
.toolbar-md-dark .bar-button-clear-md-danger,
.toolbar-md-dark .bar-button-md-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-danger-md:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-clear-md-danger:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-md-dark .bar-button-outline-md-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-danger.activated {
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-danger .button-effect {
  background-color: #882424;
}

.toolbar-md-dark .bar-button-solid-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-md-dark .bar-button-solid-md-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-md-dark .bar-button-light-md,
.toolbar-md-dark .bar-button-clear-md-light,
.toolbar-md-dark .bar-button-md-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-light-md:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-clear-md-light:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-md-dark .bar-button-outline-md-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-light.activated {
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-light .button-effect {
  background-color: #e0e0e0;
}

.toolbar-md-dark .bar-button-solid-md-light {
  color: #424242;
  background-color: #f4f4f4;
}

.toolbar-md-dark .bar-button-solid-md-light.activated {
  color: #424242;
  background-color: #e0e0e0;
}

.toolbar-md-dark .bar-button-dark-md,
.toolbar-md-dark .bar-button-clear-md-dark,
.toolbar-md-dark .bar-button-md-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-dark-md:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-clear-md-dark:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-md-dark .bar-button-outline-md-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-dark.activated {
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-dark .button-effect {
  background-color: #141414;
}

.toolbar-md-dark .bar-button-solid-md-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-md-dark .bar-button-solid-md-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-md-dark .bar-button-menuinicial-md,
.toolbar-md-dark .bar-button-clear-md-menuinicial,
.toolbar-md-dark .bar-button-md-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-menuinicial-md:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-clear-md-menuinicial:hover:not(.disable-hover),
.toolbar-md-dark .bar-button-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-md-dark .bar-button-outline-md-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.toolbar-md-dark .bar-button-outline-md-menuinicial .button-effect {
  background-color: #ebebeb;
}

.toolbar-md-dark .bar-button-solid-md-menuinicial {
  color: #424242;
  background-color: white;
}

.toolbar-md-dark .bar-button-solid-md-menuinicial.activated {
  color: #424242;
  background-color: #ebebeb;
}

.bar-button-dark-md,
.bar-button-clear-md-dark,
.bar-button-md-dark {
  color: #000000;
  background-color: transparent;
}

.bar-button-dark-md:hover:not(.disable-hover),
.bar-button-clear-md-dark:hover:not(.disable-hover),
.bar-button-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.bar-button-outline-md-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.bar-button-outline-md-dark.activated {
  background-color: transparent;
}

.bar-button-outline-md-dark .button-effect {
  background-color: #141414;
}

.bar-button-solid-md-dark {
  color: #fff;
  background-color: #000000;
}

.bar-button-solid-md-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-md-menuinicial .toolbar-background-md {
  background: white;
}

.toolbar-md-menuinicial .bar-button-clear-md,
.toolbar-md-menuinicial .bar-button-default-md,
.toolbar-md-menuinicial .bar-button-outline-md,
.toolbar-md-menuinicial .toolbar-title-md {
  color: #424242;
}

.toolbar-md-menuinicial .bar-button-clear-md .button-effect,
.toolbar-md-menuinicial .bar-button-default-md .button-effect,
.toolbar-md-menuinicial .bar-button-outline-md .button-effect {
  background-color: #424242;
}

.toolbar-md-menuinicial .bar-button-outline-md {
  border-color: #424242;
}

.toolbar-md-menuinicial .bar-button-primary-md,
.toolbar-md-menuinicial .bar-button-clear-md-primary,
.toolbar-md-menuinicial .bar-button-md-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-primary-md:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-clear-md-primary:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-md-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-md-menuinicial .bar-button-outline-md-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-primary.activated {
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-primary .button-effect {
  background-color: #1f172f;
}

.toolbar-md-menuinicial .bar-button-solid-md-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-md-menuinicial .bar-button-solid-md-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-md-menuinicial .bar-button-secondary-md,
.toolbar-md-menuinicial .bar-button-clear-md-secondary,
.toolbar-md-menuinicial .bar-button-md-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-secondary-md:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-clear-md-secondary:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-md-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-md-menuinicial .bar-button-outline-md-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-secondary.activated {
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-secondary .button-effect {
  background-color: #8a8a8a;
}

.toolbar-md-menuinicial .bar-button-solid-md-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-md-menuinicial .bar-button-solid-md-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-md-menuinicial .bar-button-danger-md,
.toolbar-md-menuinicial .bar-button-clear-md-danger,
.toolbar-md-menuinicial .bar-button-md-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-danger-md:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-clear-md-danger:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-md-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-md-menuinicial .bar-button-outline-md-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-danger.activated {
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-danger .button-effect {
  background-color: #882424;
}

.toolbar-md-menuinicial .bar-button-solid-md-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-md-menuinicial .bar-button-solid-md-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-md-menuinicial .bar-button-light-md,
.toolbar-md-menuinicial .bar-button-clear-md-light,
.toolbar-md-menuinicial .bar-button-md-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-light-md:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-clear-md-light:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-md-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-md-menuinicial .bar-button-outline-md-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-light.activated {
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-light .button-effect {
  background-color: #e0e0e0;
}

.toolbar-md-menuinicial .bar-button-solid-md-light {
  color: #424242;
  background-color: #f4f4f4;
}

.toolbar-md-menuinicial .bar-button-solid-md-light.activated {
  color: #424242;
  background-color: #e0e0e0;
}

.toolbar-md-menuinicial .bar-button-dark-md,
.toolbar-md-menuinicial .bar-button-clear-md-dark,
.toolbar-md-menuinicial .bar-button-md-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-dark-md:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-clear-md-dark:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-md-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-md-menuinicial .bar-button-outline-md-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-dark.activated {
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-dark .button-effect {
  background-color: #141414;
}

.toolbar-md-menuinicial .bar-button-solid-md-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-md-menuinicial .bar-button-solid-md-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-md-menuinicial .bar-button-menuinicial-md,
.toolbar-md-menuinicial .bar-button-clear-md-menuinicial,
.toolbar-md-menuinicial .bar-button-md-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-menuinicial-md:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-clear-md-menuinicial:hover:not(.disable-hover),
.toolbar-md-menuinicial .bar-button-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-md-menuinicial .bar-button-outline-md-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.toolbar-md-menuinicial .bar-button-outline-md-menuinicial .button-effect {
  background-color: #ebebeb;
}

.toolbar-md-menuinicial .bar-button-solid-md-menuinicial {
  color: #424242;
  background-color: white;
}

.toolbar-md-menuinicial .bar-button-solid-md-menuinicial.activated {
  color: #424242;
  background-color: #ebebeb;
}

.bar-button-menuinicial-md,
.bar-button-clear-md-menuinicial,
.bar-button-md-menuinicial {
  color: white;
  background-color: transparent;
}

.bar-button-menuinicial-md:hover:not(.disable-hover),
.bar-button-clear-md-menuinicial:hover:not(.disable-hover),
.bar-button-md-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.bar-button-outline-md-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.bar-button-outline-md-menuinicial.activated {
  background-color: transparent;
}

.bar-button-outline-md-menuinicial .button-effect {
  background-color: #ebebeb;
}

.bar-button-solid-md-menuinicial {
  color: #424242;
  background-color: white;
}

.bar-button-solid-md-menuinicial.activated {
  color: #424242;
  background-color: #ebebeb;
}

.bar-button-strong-md {
  font-weight: bold;
}

.toolbar-wp {
  padding: 4px;
  min-height: 46px;
}

.toolbar-background-wp {
  border-color: #b2b2b2;
  background: #f8f8f8;
}

.toolbar-content-wp {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-ordinal-group: 4;
  -webkit-order: 3;
  -ms-flex-order: 3;
  order: 3;
  min-width: 0;
  max-width: 100%;
}

.toolbar-title-wp {
  font-size: 1.5rem;
  font-weight: bold;
  text-transform: uppercase;
  color: #000;
  padding: 0 6px;
}

.bar-buttons-wp {
  -webkit-box-ordinal-group: 5;
  -webkit-order: 4;
  -ms-flex-order: 4;
  order: 4;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.bar-buttons-wp[left] {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
}

.bar-buttons-wp[left] .bar-button:first-child {
  margin-left: 0;
}

.bar-buttons-wp[end] {
  text-align: right;
  text-align: end;
  -webkit-box-ordinal-group: 6;
  -webkit-order: 5;
  -ms-flex-order: 5;
  order: 5;
}

.bar-buttons-wp[right] {
  text-align: right;
  -webkit-box-ordinal-group: 7;
  -webkit-order: 6;
  -ms-flex-order: 6;
  order: 6;
}

.bar-button-wp {
  margin: 0 0.2rem;
  padding: 0 5px;
  border-radius: 2px;
  height: 32px;
  border: 0;
  font-size: 1.4rem;
  font-weight: 500;
  text-transform: uppercase;
}

.bar-button-solid-wp,
.bar-button-outline-wp {
  overflow: hidden;
}

.bar-button-outline-wp {
  border-width: 1px;
  border-style: solid;
  border-color: #000;
  color: #000;
  background-color: transparent;
}

.bar-button-outline-wp:hover:not(.disable-hover) {
  opacity: .4;
}

.bar-button-outline-wp.activated {
  color: #fff;
  background-color: #000;
}

.bar-button-solid-wp {
  color: #fff;
  background-color: #000;
}

.bar-button-solid-wp:hover:not(.disable-hover) {
  color: #fff;
}

.bar-button-solid-wp.activated {
  color: #fff;
  background-color: #141414;
}

.bar-button-wp.bar-button-icon-start ion-icon {
  padding-right: 0.3em;
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
}

.bar-button-wp.bar-button-icon-end ion-icon {
  padding-left: 0.4em;
  font-size: 1.4em;
  line-height: .67;
  pointer-events: none;
}

.bar-button-wp[icon-only] {
  padding: 0;
}

.bar-button-wp[icon-only] ion-icon {
  padding: 0 0.1em;
  min-width: 28px;
  font-size: 1.8em;
  line-height: .67;
  pointer-events: none;
}

.back-button-wp {
  margin: 0 6px;
  min-width: 44px;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.back-button-icon-wp {
  text-align: left;
  text-align: start;
  margin: 0;
  padding: 0 6px;
  font-size: 2.4rem;
  font-weight: normal;
}

.bar-button-menutoggle-wp {
  margin: 0 6px;
  padding: 0 2px;
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
  min-width: 44px;
}

.bar-button-menutoggle-wp ion-icon {
  padding: 0 6px;
  font-size: 2.4rem;
}

.bar-button-menutoggle-wp[end],
.bar-button-menutoggle-wp[right] {
  margin: 0 2px;
  -webkit-box-ordinal-group: 8;
  -webkit-order: 7;
  -ms-flex-order: 7;
  order: 7;
  min-width: 28px;
}

.bar-button-default-wp,
.bar-button-clear-wp-default,
.bar-button-wp-default {
  color: #000;
  background-color: transparent;
}

.bar-button-default-wp:hover:not(.disable-hover),
.bar-button-clear-wp-default:hover:not(.disable-hover),
.bar-button-wp-default:hover:not(.disable-hover) {
  color: #000;
}

.bar-button-clear-wp,
.bar-button-clear-wp-clear,
.bar-button-wp-clear {
  color: #000;
  background-color: transparent;
}

.bar-button-clear-wp:hover:not(.disable-hover),
.bar-button-clear-wp-clear:hover:not(.disable-hover),
.bar-button-wp-clear:hover:not(.disable-hover) {
  color: #000;
}

.toolbar-wp-primary .toolbar-background-wp {
  background: #0c031d;
}

.toolbar-wp-primary .bar-button-clear-wp,
.toolbar-wp-primary .bar-button-default-wp,
.toolbar-wp-primary .bar-button-outline-wp,
.toolbar-wp-primary .toolbar-title-wp {
  color: #fff;
}

.toolbar-wp-primary .bar-button-outline-wp {
  border-color: #fff;
}

.toolbar-wp-primary .bar-button-primary-wp,
.toolbar-wp-primary .bar-button-clear-wp-primary,
.toolbar-wp-primary .bar-button-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-primary-wp:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-clear-wp-primary:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-wp-primary .bar-button-outline-wp-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-outline-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-primary .bar-button-solid-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-wp-primary .bar-button-solid-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-primary .bar-button-secondary-wp,
.toolbar-wp-primary .bar-button-clear-wp-secondary,
.toolbar-wp-primary .bar-button-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-secondary-wp:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-clear-wp-secondary:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-wp-primary .bar-button-outline-wp-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-outline-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-primary .bar-button-solid-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-wp-primary .bar-button-solid-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-primary .bar-button-danger-wp,
.toolbar-wp-primary .bar-button-clear-wp-danger,
.toolbar-wp-primary .bar-button-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-danger-wp:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-clear-wp-danger:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-wp-primary .bar-button-outline-wp-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-outline-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-primary .bar-button-solid-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-wp-primary .bar-button-solid-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-primary .bar-button-light-wp,
.toolbar-wp-primary .bar-button-clear-wp-light,
.toolbar-wp-primary .bar-button-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-light-wp:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-clear-wp-light:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-wp-primary .bar-button-outline-wp-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-outline-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-primary .bar-button-solid-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-wp-primary .bar-button-solid-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-primary .bar-button-dark-wp,
.toolbar-wp-primary .bar-button-clear-wp-dark,
.toolbar-wp-primary .bar-button-wp-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-dark-wp:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-clear-wp-dark:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-wp-primary .bar-button-outline-wp-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-outline-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-primary .bar-button-solid-wp-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-wp-primary .bar-button-solid-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-primary .bar-button-menuinicial-wp,
.toolbar-wp-primary .bar-button-clear-wp-menuinicial,
.toolbar-wp-primary .bar-button-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-menuinicial-wp:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-clear-wp-menuinicial:hover:not(.disable-hover),
.toolbar-wp-primary .bar-button-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-wp-primary .bar-button-outline-wp-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-wp-primary .bar-button-outline-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.toolbar-wp-primary .bar-button-solid-wp-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-wp-primary .bar-button-solid-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-primary-wp,
.bar-button-clear-wp-primary,
.bar-button-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.bar-button-primary-wp:hover:not(.disable-hover),
.bar-button-clear-wp-primary:hover:not(.disable-hover),
.bar-button-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.bar-button-outline-wp-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.bar-button-outline-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.bar-button-solid-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.bar-button-solid-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-secondary .toolbar-background-wp {
  background: #969696;
}

.toolbar-wp-secondary .bar-button-clear-wp,
.toolbar-wp-secondary .bar-button-default-wp,
.toolbar-wp-secondary .bar-button-outline-wp,
.toolbar-wp-secondary .toolbar-title-wp {
  color: #fff;
}

.toolbar-wp-secondary .bar-button-outline-wp {
  border-color: #fff;
}

.toolbar-wp-secondary .bar-button-primary-wp,
.toolbar-wp-secondary .bar-button-clear-wp-primary,
.toolbar-wp-secondary .bar-button-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-primary-wp:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-clear-wp-primary:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-wp-secondary .bar-button-outline-wp-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-outline-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-secondary .bar-button-solid-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-wp-secondary .bar-button-solid-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-secondary .bar-button-secondary-wp,
.toolbar-wp-secondary .bar-button-clear-wp-secondary,
.toolbar-wp-secondary .bar-button-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-secondary-wp:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-clear-wp-secondary:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-wp-secondary .bar-button-outline-wp-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-outline-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-secondary .bar-button-solid-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-wp-secondary .bar-button-solid-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-secondary .bar-button-danger-wp,
.toolbar-wp-secondary .bar-button-clear-wp-danger,
.toolbar-wp-secondary .bar-button-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-danger-wp:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-clear-wp-danger:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-wp-secondary .bar-button-outline-wp-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-outline-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-secondary .bar-button-solid-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-wp-secondary .bar-button-solid-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-secondary .bar-button-light-wp,
.toolbar-wp-secondary .bar-button-clear-wp-light,
.toolbar-wp-secondary .bar-button-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-light-wp:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-clear-wp-light:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-wp-secondary .bar-button-outline-wp-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-outline-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-secondary .bar-button-solid-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-wp-secondary .bar-button-solid-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-secondary .bar-button-dark-wp,
.toolbar-wp-secondary .bar-button-clear-wp-dark,
.toolbar-wp-secondary .bar-button-wp-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-dark-wp:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-clear-wp-dark:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-wp-secondary .bar-button-outline-wp-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-outline-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-secondary .bar-button-solid-wp-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-wp-secondary .bar-button-solid-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-secondary .bar-button-menuinicial-wp,
.toolbar-wp-secondary .bar-button-clear-wp-menuinicial,
.toolbar-wp-secondary .bar-button-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-menuinicial-wp:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-clear-wp-menuinicial:hover:not(.disable-hover),
.toolbar-wp-secondary .bar-button-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-wp-secondary .bar-button-outline-wp-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-wp-secondary .bar-button-outline-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.toolbar-wp-secondary .bar-button-solid-wp-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-wp-secondary .bar-button-solid-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-secondary-wp,
.bar-button-clear-wp-secondary,
.bar-button-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.bar-button-secondary-wp:hover:not(.disable-hover),
.bar-button-clear-wp-secondary:hover:not(.disable-hover),
.bar-button-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.bar-button-outline-wp-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.bar-button-outline-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.bar-button-solid-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.bar-button-solid-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-danger .toolbar-background-wp {
  background: #7e1111;
}

.toolbar-wp-danger .bar-button-clear-wp,
.toolbar-wp-danger .bar-button-default-wp,
.toolbar-wp-danger .bar-button-outline-wp,
.toolbar-wp-danger .toolbar-title-wp {
  color: #fff;
}

.toolbar-wp-danger .bar-button-outline-wp {
  border-color: #fff;
}

.toolbar-wp-danger .bar-button-primary-wp,
.toolbar-wp-danger .bar-button-clear-wp-primary,
.toolbar-wp-danger .bar-button-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-primary-wp:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-clear-wp-primary:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-wp-danger .bar-button-outline-wp-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-outline-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-danger .bar-button-solid-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-wp-danger .bar-button-solid-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-danger .bar-button-secondary-wp,
.toolbar-wp-danger .bar-button-clear-wp-secondary,
.toolbar-wp-danger .bar-button-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-secondary-wp:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-clear-wp-secondary:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-wp-danger .bar-button-outline-wp-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-outline-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-danger .bar-button-solid-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-wp-danger .bar-button-solid-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-danger .bar-button-danger-wp,
.toolbar-wp-danger .bar-button-clear-wp-danger,
.toolbar-wp-danger .bar-button-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-danger-wp:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-clear-wp-danger:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-wp-danger .bar-button-outline-wp-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-outline-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-danger .bar-button-solid-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-wp-danger .bar-button-solid-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-danger .bar-button-light-wp,
.toolbar-wp-danger .bar-button-clear-wp-light,
.toolbar-wp-danger .bar-button-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-light-wp:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-clear-wp-light:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-wp-danger .bar-button-outline-wp-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-outline-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-danger .bar-button-solid-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-wp-danger .bar-button-solid-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-danger .bar-button-dark-wp,
.toolbar-wp-danger .bar-button-clear-wp-dark,
.toolbar-wp-danger .bar-button-wp-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-dark-wp:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-clear-wp-dark:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-wp-danger .bar-button-outline-wp-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-outline-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-danger .bar-button-solid-wp-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-wp-danger .bar-button-solid-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-danger .bar-button-menuinicial-wp,
.toolbar-wp-danger .bar-button-clear-wp-menuinicial,
.toolbar-wp-danger .bar-button-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-menuinicial-wp:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-clear-wp-menuinicial:hover:not(.disable-hover),
.toolbar-wp-danger .bar-button-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-wp-danger .bar-button-outline-wp-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-wp-danger .bar-button-outline-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.toolbar-wp-danger .bar-button-solid-wp-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-wp-danger .bar-button-solid-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-danger-wp,
.bar-button-clear-wp-danger,
.bar-button-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.bar-button-danger-wp:hover:not(.disable-hover),
.bar-button-clear-wp-danger:hover:not(.disable-hover),
.bar-button-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.bar-button-outline-wp-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.bar-button-outline-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.bar-button-solid-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.bar-button-solid-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-light .toolbar-background-wp {
  background: #f4f4f4;
}

.toolbar-wp-light .bar-button-clear-wp,
.toolbar-wp-light .bar-button-default-wp,
.toolbar-wp-light .bar-button-outline-wp,
.toolbar-wp-light .toolbar-title-wp {
  color: #000;
}

.toolbar-wp-light .bar-button-outline-wp {
  border-color: #000;
}

.toolbar-wp-light .bar-button-primary-wp,
.toolbar-wp-light .bar-button-clear-wp-primary,
.toolbar-wp-light .bar-button-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-primary-wp:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-clear-wp-primary:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-wp-light .bar-button-outline-wp-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-outline-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-light .bar-button-solid-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-wp-light .bar-button-solid-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-light .bar-button-secondary-wp,
.toolbar-wp-light .bar-button-clear-wp-secondary,
.toolbar-wp-light .bar-button-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-secondary-wp:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-clear-wp-secondary:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-wp-light .bar-button-outline-wp-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-outline-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-light .bar-button-solid-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-wp-light .bar-button-solid-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-light .bar-button-danger-wp,
.toolbar-wp-light .bar-button-clear-wp-danger,
.toolbar-wp-light .bar-button-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-danger-wp:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-clear-wp-danger:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-wp-light .bar-button-outline-wp-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-outline-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-light .bar-button-solid-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-wp-light .bar-button-solid-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-light .bar-button-light-wp,
.toolbar-wp-light .bar-button-clear-wp-light,
.toolbar-wp-light .bar-button-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-light-wp:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-clear-wp-light:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-wp-light .bar-button-outline-wp-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-outline-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-light .bar-button-solid-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-wp-light .bar-button-solid-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-light .bar-button-dark-wp,
.toolbar-wp-light .bar-button-clear-wp-dark,
.toolbar-wp-light .bar-button-wp-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-dark-wp:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-clear-wp-dark:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-wp-light .bar-button-outline-wp-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-outline-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-light .bar-button-solid-wp-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-wp-light .bar-button-solid-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-light .bar-button-menuinicial-wp,
.toolbar-wp-light .bar-button-clear-wp-menuinicial,
.toolbar-wp-light .bar-button-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-menuinicial-wp:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-clear-wp-menuinicial:hover:not(.disable-hover),
.toolbar-wp-light .bar-button-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-wp-light .bar-button-outline-wp-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-wp-light .bar-button-outline-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.toolbar-wp-light .bar-button-solid-wp-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-wp-light .bar-button-solid-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-light-wp,
.bar-button-clear-wp-light,
.bar-button-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.bar-button-light-wp:hover:not(.disable-hover),
.bar-button-clear-wp-light:hover:not(.disable-hover),
.bar-button-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.bar-button-outline-wp-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.bar-button-outline-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.bar-button-solid-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.bar-button-solid-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-dark .toolbar-background-wp {
  background: #000000;
}

.toolbar-wp-dark .bar-button-clear-wp,
.toolbar-wp-dark .bar-button-default-wp,
.toolbar-wp-dark .bar-button-outline-wp,
.toolbar-wp-dark .toolbar-title-wp {
  color: #fff;
}

.toolbar-wp-dark .bar-button-outline-wp {
  border-color: #fff;
}

.toolbar-wp-dark .bar-button-primary-wp,
.toolbar-wp-dark .bar-button-clear-wp-primary,
.toolbar-wp-dark .bar-button-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-primary-wp:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-clear-wp-primary:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-wp-dark .bar-button-outline-wp-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-outline-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-dark .bar-button-solid-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-wp-dark .bar-button-solid-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-dark .bar-button-secondary-wp,
.toolbar-wp-dark .bar-button-clear-wp-secondary,
.toolbar-wp-dark .bar-button-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-secondary-wp:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-clear-wp-secondary:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-wp-dark .bar-button-outline-wp-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-outline-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-dark .bar-button-solid-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-wp-dark .bar-button-solid-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-dark .bar-button-danger-wp,
.toolbar-wp-dark .bar-button-clear-wp-danger,
.toolbar-wp-dark .bar-button-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-danger-wp:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-clear-wp-danger:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-wp-dark .bar-button-outline-wp-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-outline-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-dark .bar-button-solid-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-wp-dark .bar-button-solid-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-dark .bar-button-light-wp,
.toolbar-wp-dark .bar-button-clear-wp-light,
.toolbar-wp-dark .bar-button-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-light-wp:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-clear-wp-light:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-wp-dark .bar-button-outline-wp-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-outline-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-dark .bar-button-solid-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-wp-dark .bar-button-solid-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-dark .bar-button-dark-wp,
.toolbar-wp-dark .bar-button-clear-wp-dark,
.toolbar-wp-dark .bar-button-wp-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-dark-wp:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-clear-wp-dark:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-wp-dark .bar-button-outline-wp-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-outline-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-dark .bar-button-solid-wp-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-wp-dark .bar-button-solid-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-dark .bar-button-menuinicial-wp,
.toolbar-wp-dark .bar-button-clear-wp-menuinicial,
.toolbar-wp-dark .bar-button-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-menuinicial-wp:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-clear-wp-menuinicial:hover:not(.disable-hover),
.toolbar-wp-dark .bar-button-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-wp-dark .bar-button-outline-wp-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-wp-dark .bar-button-outline-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.toolbar-wp-dark .bar-button-solid-wp-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-wp-dark .bar-button-solid-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-dark-wp,
.bar-button-clear-wp-dark,
.bar-button-wp-dark {
  color: #000000;
  background-color: transparent;
}

.bar-button-dark-wp:hover:not(.disable-hover),
.bar-button-clear-wp-dark:hover:not(.disable-hover),
.bar-button-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.bar-button-outline-wp-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.bar-button-outline-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.bar-button-solid-wp-dark {
  color: #fff;
  background-color: #000000;
}

.bar-button-solid-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-menuinicial .toolbar-background-wp {
  background: white;
}

.toolbar-wp-menuinicial .bar-button-clear-wp,
.toolbar-wp-menuinicial .bar-button-default-wp,
.toolbar-wp-menuinicial .bar-button-outline-wp,
.toolbar-wp-menuinicial .toolbar-title-wp {
  color: #000;
}

.toolbar-wp-menuinicial .bar-button-outline-wp {
  border-color: #000;
}

.toolbar-wp-menuinicial .bar-button-primary-wp,
.toolbar-wp-menuinicial .bar-button-clear-wp-primary,
.toolbar-wp-menuinicial .bar-button-wp-primary {
  color: #0c031d;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-primary-wp:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-clear-wp-primary:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-wp-primary:hover:not(.disable-hover) {
  color: #0c031d;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-primary {
  border-color: #1f172f;
  color: #1f172f;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-primary {
  color: #fff;
  background-color: #0c031d;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-primary.activated {
  color: #fff;
  background-color: #1f172f;
}

.toolbar-wp-menuinicial .bar-button-secondary-wp,
.toolbar-wp-menuinicial .bar-button-clear-wp-secondary,
.toolbar-wp-menuinicial .bar-button-wp-secondary {
  color: #969696;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-secondary-wp:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-clear-wp-secondary:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-wp-secondary:hover:not(.disable-hover) {
  color: #969696;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-secondary {
  border-color: #8a8a8a;
  color: #8a8a8a;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-secondary {
  color: #fff;
  background-color: #969696;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-secondary.activated {
  color: #fff;
  background-color: #8a8a8a;
}

.toolbar-wp-menuinicial .bar-button-danger-wp,
.toolbar-wp-menuinicial .bar-button-clear-wp-danger,
.toolbar-wp-menuinicial .bar-button-wp-danger {
  color: #7e1111;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-danger-wp:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-clear-wp-danger:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-wp-danger:hover:not(.disable-hover) {
  color: #7e1111;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-danger {
  border-color: #882424;
  color: #882424;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-danger {
  color: #fff;
  background-color: #7e1111;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-danger.activated {
  color: #fff;
  background-color: #882424;
}

.toolbar-wp-menuinicial .bar-button-light-wp,
.toolbar-wp-menuinicial .bar-button-clear-wp-light,
.toolbar-wp-menuinicial .bar-button-wp-light {
  color: #f4f4f4;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-light-wp:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-clear-wp-light:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-wp-light:hover:not(.disable-hover) {
  color: #f4f4f4;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-light {
  border-color: #e0e0e0;
  color: #e0e0e0;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-light {
  color: #000;
  background-color: #f4f4f4;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-light.activated {
  color: #000;
  background-color: #e0e0e0;
}

.toolbar-wp-menuinicial .bar-button-dark-wp,
.toolbar-wp-menuinicial .bar-button-clear-wp-dark,
.toolbar-wp-menuinicial .bar-button-wp-dark {
  color: #000000;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-dark-wp:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-clear-wp-dark:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-wp-dark:hover:not(.disable-hover) {
  color: #000000;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-dark {
  border-color: #141414;
  color: #141414;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-dark {
  color: #fff;
  background-color: #000000;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-dark.activated {
  color: #fff;
  background-color: #141414;
}

.toolbar-wp-menuinicial .bar-button-menuinicial-wp,
.toolbar-wp-menuinicial .bar-button-clear-wp-menuinicial,
.toolbar-wp-menuinicial .bar-button-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-menuinicial-wp:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-clear-wp-menuinicial:hover:not(.disable-hover),
.toolbar-wp-menuinicial .bar-button-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.toolbar-wp-menuinicial .bar-button-outline-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-menuinicial {
  color: #000;
  background-color: white;
}

.toolbar-wp-menuinicial .bar-button-solid-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-menuinicial-wp,
.bar-button-clear-wp-menuinicial,
.bar-button-wp-menuinicial {
  color: white;
  background-color: transparent;
}

.bar-button-menuinicial-wp:hover:not(.disable-hover),
.bar-button-clear-wp-menuinicial:hover:not(.disable-hover),
.bar-button-wp-menuinicial:hover:not(.disable-hover) {
  color: white;
}

.bar-button-outline-wp-menuinicial {
  border-color: #ebebeb;
  color: #ebebeb;
  background-color: transparent;
}

.bar-button-outline-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-solid-wp-menuinicial {
  color: #000;
  background-color: white;
}

.bar-button-solid-wp-menuinicial.activated {
  color: #000;
  background-color: #ebebeb;
}

.bar-button-strong-wp {
  font-weight: bold;
}

.text-ios-primary {
  color: #0c031d;
}

.text-ios-secondary {
  color: #969696;
}

.text-ios-danger {
  color: #7e1111;
}

.text-ios-light {
  color: #f4f4f4;
}

.text-ios-dark {
  color: #000000;
}

.text-ios-menuinicial {
  color: white;
}

.text-md-primary {
  color: #0c031d;
}

.text-md-secondary {
  color: #969696;
}

.text-md-danger {
  color: #7e1111;
}

.text-md-light {
  color: #f4f4f4;
}

.text-md-dark {
  color: #000000;
}

.text-md-menuinicial {
  color: white;
}

.text-wp-primary {
  color: #0c031d;
}

.text-wp-secondary {
  color: #969696;
}

.text-wp-danger {
  color: #7e1111;
}

.text-wp-light {
  color: #f4f4f4;
}

.text-wp-dark {
  color: #000000;
}

.text-wp-menuinicial {
  color: white;
}

.virtual-loading {
  opacity: 0;
}

.virtual-scroll {
  position: relative;
  contain: content;
}

.virtual-scroll .virtual-position,
.virtual-scroll .virtual-position.item {
  left: 0;
  top: 0;
  position: absolute;
  -webkit-transition-duration: 0ms;
  transition-duration: 0ms;
  contain: content;
}

.virtual-scroll .virtual-last {
  display: none;
}

.ios ion-nav > .ion-page > .toolbar.statusbar-padding:first-child,
.ios ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.ios ion-tab > .ion-page > .toolbar.statusbar-padding:first-child,
.ios ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child,
.ios ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child,
.ios ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child {
  padding-top: calc(20px + 4px);
  padding-left: calc(constant(safe-area-inset-left) + 4px);
  padding-right: calc(constant(safe-area-inset-right) + 4px);
  padding-top: calc(constant(safe-area-inset-top) + 4px);
  min-height: calc(44px + 20px);
  min-height: calc(44px + constant(safe-area-inset-top));
}

.ios ion-nav > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-tab > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-menu > .menu-inner > ion-content.statusbar-padding:first-child .scroll-content,
.ios ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
  padding-top: 20px;
  padding-top: calc(20px + constant(safe-area-inset-top));
}

.ios ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.ios ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.ios ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
  padding-top: calc(16px + 20px);
  padding-top: calc(16px + constant(safe-area-inset-top));
}

.ios ion-nav > .ion-page > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-nav > .ion-page > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-tab > .ion-page > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-tab > .ion-page > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child ion-title,
.ios ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
.ios ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child ion-title {
  padding-top: 20px;
  padding-top: calc(constant(safe-area-inset-top) + 4px);
  height: calc(44px + 20px);
  height: calc(44px + constant(safe-area-inset-top));
  min-height: calc(44px + 20px);
  min-height: calc(44px + constant(safe-area-inset-top));
}

@media only screen and (max-width: 767px) {
  .ios .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child {
    padding-top: calc(20px + 4px);
    padding-left: calc(constant(safe-area-inset-left) + 4px);
    padding-right: calc(constant(safe-area-inset-right) + 4px);
    padding-top: calc(constant(safe-area-inset-top) + 4px);
    min-height: calc(44px + 20px);
    min-height: calc(44px + constant(safe-area-inset-top));
  }
  .ios .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
    padding-top: 20px;
    padding-top: calc(20px + constant(safe-area-inset-top));
  }
  .ios .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
  .ios .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
    padding-top: calc(16px + 20px);
    padding-top: calc(16px + constant(safe-area-inset-top));
  }
  .ios .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-segment,
  .ios .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child ion-title {
    padding-top: 20px;
    padding-top: calc(constant(safe-area-inset-top) + 4px);
    height: calc(44px + 20px);
    height: calc(44px + constant(safe-area-inset-top));
    min-height: calc(44px + 20px);
    min-height: calc(44px + constant(safe-area-inset-top));
  }
}

.ios .tabs .tabbar {
  padding-bottom: constant(safe-area-inset-bottom);
}

.ios ion-footer .toolbar:last-child {
  padding-bottom: calc(constant(safe-area-inset-top) + 4px);
  height: calc(44px + constant(safe-area-inset-top));
  min-height: calc(44px + constant(safe-area-inset-top));
}

.md ion-nav > .ion-page > .toolbar.statusbar-padding:first-child,
.md ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.md ion-tab > .ion-page > .toolbar.statusbar-padding:first-child,
.md ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.md ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child,
.md ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child,
.md ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child {
  padding-top: calc(20px + 4px);
  padding-left: calc(constant(safe-area-inset-left) + 4px);
  padding-right: calc(constant(safe-area-inset-right) + 4px);
  padding-top: calc(constant(safe-area-inset-top) + 4px);
  min-height: calc(56px + 20px);
  min-height: calc(56px + constant(safe-area-inset-top));
}

.md ion-nav > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-tab > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-menu > .menu-inner > ion-content.statusbar-padding:first-child .scroll-content,
.md ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
  padding-top: 20px;
  padding-top: calc(20px + constant(safe-area-inset-top));
}

.md ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.md ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.md ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
  padding-top: calc(16px + 20px);
  padding-top: calc(16px + constant(safe-area-inset-top));
}

@media only screen and (max-width: 767px) {
  .md .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child {
    padding-top: calc(20px + 4px);
    padding-left: calc(constant(safe-area-inset-left) + 4px);
    padding-right: calc(constant(safe-area-inset-right) + 4px);
    padding-top: calc(constant(safe-area-inset-top) + 4px);
    min-height: calc(56px + 20px);
    min-height: calc(56px + constant(safe-area-inset-top));
  }
  .md .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
    padding-top: 20px;
    padding-top: calc(20px + constant(safe-area-inset-top));
  }
  .md .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
  .md .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
    padding-top: calc(16px + 20px);
    padding-top: calc(16px + constant(safe-area-inset-top));
  }
}

.md .tabs .tabbar {
  padding-bottom: constant(safe-area-inset-bottom);
}

.md ion-footer .toolbar:last-child {
  padding-bottom: calc(constant(safe-area-inset-top) + 4px);
  height: calc(56px + constant(safe-area-inset-top));
  min-height: calc(56px + constant(safe-area-inset-top));
}

.wp ion-nav > .ion-page > .toolbar.statusbar-padding:first-child,
.wp ion-nav > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.wp ion-tab > .ion-page > .toolbar.statusbar-padding:first-child,
.wp ion-tab > .ion-page > ion-header > .toolbar.statusbar-padding:first-child,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > .toolbar.statusbar-padding:first-child,
.wp ion-menu > .menu-inner > .toolbar.statusbar-padding:first-child,
.wp ion-menu > .menu-inner > ion-header > .toolbar.statusbar-padding:first-child {
  padding-top: calc(20px + 4px);
  padding-left: calc(constant(safe-area-inset-left) + 4px);
  padding-right: calc(constant(safe-area-inset-right) + 4px);
  padding-top: calc(constant(safe-area-inset-top) + 4px);
  min-height: calc(46px + 20px);
  min-height: calc(46px + constant(safe-area-inset-top));
}

.wp ion-nav > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-tab > .ion-page > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-menu > .menu-inner > ion-content.statusbar-padding:first-child .scroll-content,
.wp ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
  padding-top: 20px;
  padding-top: calc(20px + constant(safe-area-inset-top));
}

.wp ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-nav > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-nav > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-tab > .ion-page > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-tab > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-tabs > .ion-page.tab-subpage > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-menu > .menu-inner > ion-content.statusbar-padding:first-child[padding-top] .scroll-content,
.wp ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
.wp ion-menu > .menu-inner > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
  padding-top: calc(16px + 20px);
  padding-top: calc(16px + constant(safe-area-inset-top));
}

@media only screen and (max-width: 767px) {
  .wp .modal-wrapper > .ion-page > ion-header > .toolbar.statusbar-padding:first-child {
    padding-top: calc(20px + 4px);
    padding-left: calc(constant(safe-area-inset-left) + 4px);
    padding-right: calc(constant(safe-area-inset-right) + 4px);
    padding-top: calc(constant(safe-area-inset-top) + 4px);
    min-height: calc(46px + 20px);
    min-height: calc(46px + constant(safe-area-inset-top));
  }
  .wp .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child .scroll-content {
    padding-top: 20px;
    padding-top: calc(20px + constant(safe-area-inset-top));
  }
  .wp .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding] .scroll-content,
  .wp .modal-wrapper > .ion-page > ion-header > ion-content.statusbar-padding:first-child[padding-top] .scroll-content {
    padding-top: calc(16px + 20px);
    padding-top: calc(16px + constant(safe-area-inset-top));
  }
}

.wp .tabs .tabbar {
  padding-bottom: constant(safe-area-inset-bottom);
}

.wp ion-footer .toolbar:last-child {
  padding-bottom: calc(constant(safe-area-inset-top) + 4px);
  height: calc(46px + constant(safe-area-inset-top));
  min-height: calc(46px + constant(safe-area-inset-top));
}

.item-select-searchable .label {
  margin-right: 0;
}

.select-searchable {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.select-searchable-label {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-overflow: ellipsis;
  overflow: hidden;
}

.select-searchable-value {
  max-width: 45%;
  text-overflow: ellipsis;
  overflow: hidden;
}

.select-searchable-icon {
  position: relative;
  width: 20px;
}

.select-searchable-icon-inner {
  position: absolute;
  top: 50%;
  left: 5px;
  border-top: 5px solid;
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  pointer-events: none;
}

.select-searchable-ios .select-searchable-icon {
  height: 18px;
}

.select-searchable-ios .select-searchable-icon-inner {
  margin-top: -2px;
  color: #999;
}

.select-searchable-ios .select-searchable-value {
  padding-left: 16px;
}

.select-searchable-md .select-searchable-icon {
  height: 19px;
}

.select-searchable-md .select-searchable-icon-inner {
  margin-top: -3px;
  color: #999;
}

.select-searchable-md .select-searchable-value {
  padding-left: 16px;
}

.select-searchable-md .select-searchable-label {
  color: #999;
}

.select-searchable-spinner-background {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  background-color: #000;
  z-index: 100;
  opacity: 0.05;
}

.select-searchable-spinner ion-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10;
  margin-top: -14px;
  margin-left: -14px;
}

.select-searchable-page.select-searchable-page-can-reset.select-searchable-page-multiple .footer .col:first-child {
  padding-right: 8px;
}

.select-searchable-page.select-searchable-page-can-reset.select-searchable-page-multiple .footer .col:last-child {
  padding-left: 8px;
}

.linea {
  background-color: grey;
  padding: 1px;
}

.pure-table {
  /* Remove spacing between table cells (from Normalize.css) */
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border: 1px solid #cbcbcb;
  width: 100%;
}

.pure-table caption {
  color: #000;
  font: italic 85%/1 arial, sans-serif;
  padding: 1em 0;
  text-align: center;
}

.pure-table td,
.pure-table th {
  border-left: 1px solid #cbcbcb;
  /*  inner column border */
  border-width: 0 0 0 1px;
  font-size: inherit;
  margin: 0;
  overflow: visible;
  /*to make ths where the title is really long work*/
  padding: 0.5em 1em;
  /* cell padding */
}

/* Consider removing this next declaration block, as it causes problems when
  there's a rowspan on the first cell. Case added to the tests. issue#432 */
.pure-table td:first-child,
.pure-table th:first-child {
  border-left-width: 0;
}

.pure-table thead {
  background-color: #e0e0e0;
  color: #000;
  text-align: left;
  vertical-align: bottom;
}

/*
  striping:
   even - #fff (white)
   odd  - #f2f2f2 (light gray)
  */
.pure-table td {
  background-color: transparent;
}

.pure-table-odd td {
  background-color: #f2f2f2;
}

/* nth-child selector for modern browsers */
.pure-table-striped tr:nth-child(2n-1) td {
  background-color: #f2f2f2;
}

/* BORDERED TABLES */
.pure-table-bordered td {
  border-bottom: 1px solid #cbcbcb;
}

.pure-table-bordered tbody > tr:last-child > td {
  border-bottom-width: 0;
}

/* HORIZONTAL BORDERED TABLES */
.pure-table-horizontal td,
.pure-table-horizontal th {
  border-width: 0 0 1px 0;
  border-bottom: 1px solid #cbcbcb;
}

.pure-table-horizontal tbody > tr:last-child > td {
  border-bottom-width: 0;
}

ion-menu .item.active {
  -webkit-box-shadow: inset 5px 0px 0px 0px #000000;
  box-shadow: inset 5px 0px 0px 0px #000000;
}

ion-content {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0c0d0d), color-stop(#1f2c30), color-stop(#344b58), color-stop(#556985), to(#8686af));
  background-image: linear-gradient(to right top, #0c0d0d, #1f2c30, #344b58, #556985, #8686af);
}

ion-content ion-item {
  background-color: transparent !important;
}

ion-content button {
  border-radius: 12px !important;
}

.img-name-row {
  text-align: center;
}

.img-name-row .user-img {
  max-width: 100%;
  height: 7em;
  width: 7em;
  border: 3px solid #f2f2f2;
  border-radius: 50%;
  margin-top: 24px;
}

ion-item {
  background-color: transparent !important;
  color: white !important;
}

button {
  border-radius: 12px !important;
}

.item-md h2 {
  color: 1px solid #2c2a2a !important;
}

h2 {
  color: 1px solid #2c2a2a !important;
}

h3 {
  color: 1px solid #2c2a2a !important;
}

h1 {
  color: 1px solid #2c2a2a !important;
}

.item-md {
  color: 1px solid #2c2a2a !important;
}

.item-md h2 {
  color: 1px solid #2c2a2a !important;
}

.input-wrapper {
  color: #fffefe !important;
}

.item-md {
  background-color: transparent !important;
}

ion-list {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0c0d0d), color-stop(#1f2c30), color-stop(#344b58), color-stop(#556985), to(#8686af));
  background-image: linear-gradient(to right top, #0c0d0d, #1f2c30, #344b58, #556985, #8686af);
}

*, :after, :before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* Estilos del menú principal */
ion-content {
  background-color: #f4f4f4;
  /* Color de fondo */
}

/* Estilos de los grupos */
ion-list-header {
  background-color: #d3d3d3;
  /* Color de fondo del encabezado */
  font-weight: bold;
  /* Texto en negrita */
  padding: 8px 16px;
  /* Espaciado interno */
}

/* Estilos de los elementos del menú */
ion-item {
  padding: 8px 16px;
  /* Espaciado interno */
  font-size: 16px;
  /* Tamaño del texto */
  border-bottom: 1px solid #ccc;
  /* Separador inferior */
}

/* Estilo para resaltar elementos al pasar el ratón por encima */
ion-item:hover {
  background-color: #eaeaea;
  /* Color de fondo al pasar el ratón por encima */
  cursor: pointer;
  /* Cambio de cursor al pasar el ratón por encima */
}

.custom-alert-wrapper {
  background-color: #f9f9f9 !important;
  /* !important para asegurar que los estilos se apliquen */
  border-radius: 10px !important;
  padding: 20px !important;
}

.custom-alert-message {
  color: #666 !important;
  /* Color del mensaje */
  font-size: 16px !important;
  /* Tamaño del texto del mensaje */
}

.custom-alert-button-cancel {
  color: #555 !important;
  /* Color del botón Cancelar */
  font-size: 16px !important;
  /* Tamaño del texto del botón */
  font-weight: bold !important;
  /* Negrita del texto del botón */
  background-color: #eee !important;
  /* Color de fondo del botón Cancelar */
  border-radius: 8px !important;
  /* Borde redondeado del botón */
  width: 45%;
  /* Ancho del botón (ajustable según diseño) */
  margin: 10px auto 0;
  /* Margen para centrar el botón */
}

.custom-alert-button-accept {
  color: #fff !important;
  /* Color del texto del botón Aceptar */
  font-size: 16px !important;
  /* Tamaño del texto del botón */
  font-weight: bold !important;
  /* Negrita del texto del botón */
  background-color: #4CAF50 !important;
  /* Color de fondo del botón Aceptar */
  border-radius: 8px !important;
  /* Borde redondeado del botón */
  width: 45%;
  /* Ancho del botón (ajustable según diseño) */
  margin: 10px auto 0;
  /* Margen para centrar el botón */
}

.custom-alert-title {
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  padding: 10px !important;
  font-size: 16px !important;
  color: #333 !important;
}

.custom-alert-input {
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  padding: 10px !important;
  font-size: 16px !important;
  color: #333 !important;
}

.custom-alert-input .alert-input {
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  padding: 10px !important;
  font-size: 16px !important;
  color: #333 !important;
}

.nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 12px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: #fefefefb;
  /* Color del texto */
  display: block;
}

.calendar {
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  width: 100%;
  margin: 0 auto;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 20px;
  background: -webkit-gradient(linear, left top, right top, from(#f9f1f5), color-stop(0%, #0e0e0e), color-stop(0%, #efe6f1), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#091a4b));
  background: linear-gradient(90deg, #f9f1f5 0%, #0e0e0e 0%, #efe6f1 0%, #211e4a 99%, #41484a 100%, #091a4b 100%);
  height: auto;
  overflow: hidden;
  /* Asegura que el contenido del calendario no se desborde */
}

.calendar::before {
  content: "";
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.6);
  /* Ajusta la opacidad y el color del overlay */
}

.calendar .day {
  padding: 10px;
  text-align: center;
  border: 1px solid #ccc;
  background-color: #fff;
  /* Color de fondo para resaltar los números de los días */
  border-radius: 8px;
  cursor: pointer !important;
  color: white !important;
}

.calendar .day:hover {
  background-color: #f2f2f2;
  /* Cambia el color de fondo en hover para mayor contraste */
  border-radius: 8px;
  cursor: pointer !important;
  color: white !important;
}

.calendar .weekday {
  font-weight: bold;
  text-align: center;
  background-color: #111111;
  padding: 10px;
  margin: 0px;
  border-radius: 8px;
  color: #9c9fa3;
  cursor: pointer;
}

.calendar .today {
  background-color: #1a7ba8;
  font-weight: bold;
  border-radius: 8px;
  cursor: pointer;
}

.calendar .month-header {
  text-align: center;
  font-size: 20px;
  margin-bottom: 10px;
  display: none;
  color: black;
  background-color: #fff;
  /* Color de fondo */
}

.calendar .month-header:first-child {
  display: block;
  /* Mostrar solo el primer mes */
}

/* Estilo para resaltar el mes actual */
.calendar .month-header.active {
  display: block;
  font-weight: bold;
  color: black;
}

/* Asegura que los botones sean clicables */
.calendar button {
  cursor: pointer;
  background: none;
  border: none;
  outline: none;
}

/* Ajusta los estilos para los botones de retroceso y avance */
.calendar button:nth-child(1),
.calendar button:nth-child(2) {
  background: #fff;
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  position: relative;
  z-index: 1;
}

.calendar button {
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  color: #333;
  /* Color de texto */
  max-height: 38px;
}

/* Estilo al botón de avance */
.calendar button.next {
  padding: 2px 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  background-color: #fff;
  /* Color de fondo */
  color: #333;
  /* Color de texto */
  margin: 0 5px;
  /* Margen entre los botones */
  /* Agrega otros estilos específicos según tus preferencias */
}

/* Estilo al botón de retroceso */
.calendar button.previous {
  padding: 2px 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  background-color: #fff;
  /* Color de fondo */
  color: #333;
  /* Color de texto */
  margin: 0 5px;
  /* Margen entre los botones */
  /* Agrega otros estilos específicos según tus preferencias */
}

/* Estilos para los botones de navegación */
.calendar-previous,
.calendar-next {
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  background-color: #fff;
  color: #333;
  margin: 0 5px;
}

/* Asegura que los botones de navegación sean clicables */
.calendar-previous,
.calendar-next {
  cursor: pointer;
  background: none;
  border: none;
  outline: none;
}

/* Estilos específicos para el botón de navegación "siguiente" */
.calendar-next {
  opacity: 1;
}

/* Estilos específicos para el botón de navegación "anterior" */
.calendar-previous {
  opacity: 1;
}

/* Incluye clases específicas si deseas diferenciar visualmente los botones */
.calendar button.previous {
  opacity: 1;
  /* Ajusta la opacidad para que el texto sea más visible */
}

.calendar button.next {
  opacity: 1;
  /* Ajusta la opacidad para que el texto sea más visible */
}

.calendar .highlighted {
  background-color: red;
  /* Cambia el color de fondo para resaltar los elementos */
  font-weight: bold;
  /* Aplica negrita u otros estilos de texto */
  /* Agrega otros estilos deseados para resaltar los elementos */
}

.calendar .header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 10px;
  /* Espacio entre la cabecera y el grid de días */
}

.calendar .month-header {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* Permite que la fecha ocupe el espacio disponible */
  text-align: center;
  display: block;
  /* Aseguramos que se muestre */
  color: black;
  /* tus estilos existentes */
  /* Elimina estilos que ocultan o muestran basados en clases adicionales, si es necesario */
}

/* Estilos para el contenedor principal */
.containerheader {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  margin: 0 auto;
}

/* Estilos para los botones de navegación */
.containerheader .button {
  font-size: 20px;
  /* Ajustar el tamaño del texto de los botones */
  --background: #e0e0e0;
  /* Cambiar el color de fondo de los botones */
  --border-radius: 8px;
  /* Aplicar bordes redondeados a los botones */
  --padding-start: 20px;
  /* Ajustar el espacio interno del botón */
  --padding-end: 20px;
  /* Ajustar el espacio interno del botón */
  --color: #333;
  /* Cambiar el color del texto de los botones */
  background-color: #333;
  color: #cfc2c2;
  border-radius: 4px;
}

/* Estilos para la fecha en el medio */
.containerheader .center-content {
  text-align: center;
  font-size: 24px;
  /* Ajustar el tamaño de la fuente para la fecha */
  font-weight: bold;
  /* Hacer la fecha en negrita */
  color: #1a7ba8;
  /* Cambiar el color de la fecha */
  background-color: #333;
  color: #cfc2c2;
  border-radius: 4px;
}

.calendar .clicked-day {
  border: 2px solid red;
  /* Solo un ejemplo para destacar el día clickeado */
}

.calendar .selected-day {
  /* Estilos para el día seleccionado, por ejemplo: */
  border: 2px solid blue;
}

.calendar .day .select-hour-button {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #333;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 5px;
}

ion-icon[name="alarm-outline"] {
  font-size: 4.5rem;
  /* Ajusta el tamaño del icono según sea necesario */
  margin-bottom: -4px;
  /* Ajusta el margen inferior para colocarlo en la parte inferior */
}

.select-time-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

@media (max-width: 768px) {
  .calendar {
    grid-template-columns: repeat(7, calc(100% / 7));
    /* Ajusta el ancho de las columnas para pantallas pequeñas */
    gap: 5px;
    /* Reduce el espacio entre los elementos para una apariencia más compacta */
  }
  .calendar .day {
    font-size: 12px;
    /* Reducir el tamaño de la fuente para los números de los días */
    padding: 5px;
    /* Reducir el espacio alrededor de cada día para que se ajuste mejor en pantallas pequeñas */
  }
  .calendar .month-header {
    font-size: 16px;
    /* Reducir el tamaño de la fuente para adaptarse a pantallas pequeñas */
    margin-bottom: 5px;
    /* Reducir el espacio inferior para un diseño más compacto */
  }
  /* tus estilos existentes para responsividad */
  .calendar .header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .calendar .month-header {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
    /* Asegura que la fecha se muestre en medio en pantallas pequeñas */
    margin: 10px 0;
    /* Espacio antes y después en diseño vertical */
  }
  .calendar .selected-day {
    /* Estilos para el día seleccionado, por ejemplo: */
    border: 2px solid blue;
  }
}

.titulo-parametros {
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}

.responsive-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra los elementos horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinea los elementos verticalmente (en el caso de que haya más de una fila) */
}

.responsive-item {
  width: 100%;
  /* Toma toda la anchura disponible */
  margin-bottom: 10px;
  /* Espaciado entre elementos */
}

.button-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 20px;
  /* Añade un margen superior para separar el botón del formulario */
}

.button-container {
  --background: #4CAF50;
  /* Color de fondo */
  --background-hover: #45a049;
  /* Color de fondo al pasar el mouse */
  --border-radius: 10px;
  /* Bordes redondeados */
  --padding-start: 15px;
  --padding-end: 15px;
  --padding-top: 10px;
  --padding-bottom: 10px;
  --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra del botón */
  --transition: background-color 0.3s ease;
  /* Suaviza el cambio de color al pasar el mouse */
  color: #4CAF50;
  /* Color del texto */
  font-size: 16px;
  /* Tamaño del texto */
}

.button-container button:hover {
  --background: #45a049;
  /* Cambia el color de fondo al pasar el mouse */
  --box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
  /* Aumenta la sombra para dar un efecto de profundidad */
}

@media (min-width: 576px) {
  .responsive-item {
    width: 48%;
    /* Ocupa el 48% en pantallas más grandes, dejando espacio entre los elementos */
  }
}

@media (min-width: 768px) {
  .responsive-item {
    width: 32%;
    /* Ocupa el 32% en pantallas más grandes */
  }
}

estados-parqueadero .nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 12px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: #fefefefb;
  /* Color del texto */
  display: block;
}

estados-parqueadero .color-list {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #fff;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  z-index: 9999;
}

estados-parqueadero .color-item {
  width: 30px;
  height: 30px;
  margin: 5px;
  cursor: pointer;
}

estados-parqueaderos-por-valor .nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 24px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: #333;
  /* Color del texto */
  display: block;
}

estados-parqueaderos-por-valor .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

estados-parqueaderos-por-valor .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

estados-parqueaderos-por-valor .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

estados-parqueaderos-por-valor .puntero {
  cursor: pointer;
}

estados-parqueaderos-por-valor .end {
  float: right;
}

estados-parqueaderos-por-valor .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

estados-parqueaderos-por-valor .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

estados-parqueaderos-por-valor .item-container-tiporeserva {
  border: 1px solid #ccc;
  padding: 1px;
  margin: 1px 0;
  background-color: #cfc9c9;
}

estados-parqueaderos-por-valor #guardar-button {
  background-color: #007bff;
  cursor: pointer;
  color: #fff;
  /* Otros estilos de botón */
}

estados-parqueaderos-por-valor .valor-input {
  width: 100%;
  padding: 5px;
  margin-top: 5px;
  /* Otros estilos de input */
}

factura-select .fullscreen-modal {
  height: 100%;
  width: 100%;
}

factura-select .header-row {
  background: #1c1c1d;
  color: #413b3b;
  font-size: 18px;
}

factura-select ion-col {
  border: 1px solid #90bcd2;
  cursor: pointer;
}

factura-select .selectHover:hover {
  background-color: #817d7d;
}

factura-select ion-content {
  --background: #979494;
}

factura-select ion-content .paginador {
  cursor: pointer;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: #b1aaaa;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

factura-select ion-content .paginador:hover {
  background-color: #e53935;
}

factura-select ion-content .paginador #input {
  color: cadetblue;
}

factura-select ion-content .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

factura-select ion-content .row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: #5e6265;
  color: #2c2929;
  cursor: pointer;
}

factura-select ion-content .col {
  width: 33.33%;
  margin-right: 10px;
}

factura-select ion-content .col:last-child {
  margin-right: 0;
}

factura-select ion-footer {
  background-color: #2a4054;
}

factura-select .descripcion-modal {
  position: fixed;
  top: 10%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 90%;
  max-width: 820px;
  background-color: #ffffff;
  padding: 20px;
  padding-bottom: 80px;
  /* 👈 Espacio extra para los botones */
  border-radius: 12px;
  z-index: 99999;
  -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  max-height: 80%;
  overflow-y: auto;
  /* 👈 Scroll interno si es necesario */
}

factura-select .descripcion-textarea {
  width: 100%;
  min-height: 100px;
  resize: vertical;
  border-radius: 8px;
  text-align: center;
  padding: 10px;
  font-size: 14px;
  color: #000;
  background: #f9f9f9;
  border: 1px solid #ccc;
  outline: none;
}

factura-select .descripcion-botones {
  position: absolute;
  /* 👈 Fijamos los botones al fondo */
  bottom: 15px;
  left: 0;
  width: 100%;
  padding: 0 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.gruposreservas {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 4px;
  padding: 3px;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  background-color: #5f3232;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;
}

.gruposreservas p {
  font-size: 20px;
  /* Ajustar el tamaño de la letra */
  font-weight: bold;
  color: #333;
  text-align: center;
  /* Centrar el texto */
  margin: 0;
  /* Eliminar el margen para reducir el espacio */
}

.gruposres:hover {
  -webkit-transform: translateY(-3px);
  transform: translateY(-3px);
  -webkit-box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
}

.gruposreservas .ch-menu .wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

.gruposreservas .ch-menu .item {
  min-width: 100px;
  width: 80px;
  /* Establecer el ancho fijo */
  height: 80px;
  /* Establecer la altura fija */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 12px;
  margin-right: 10px;
  margin-left: 10px;
  padding-top: 10px;
  margin-top: 10px;
  overflow: hidden;
}

.gruposreservas .ch-menu .item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}

#image-container {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 80%;
  height: 80%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  z-index: 9999;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

#expanded-buscar-producto {
  max-width: 90vw;
  max-height: 90vh;
}

#expanded-image {
  width: 100%;
  /* El doble del tamaño original */
  height: 100%;
  /* El doble del tamaño original */
  max-width: none;
  /* Permite sobrepasar el ancho máximo si es necesario */
  max-height: none;
  /* Permite sobrepasar la altura máxima si es necesario */
}

#close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

.Products-item-reserva {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: #fff;
  border-radius: 4px;
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  margin: 2px;
  overflow: hidden;
  cursor: pointer;
}

.Products-item-reserva .orderId p, .edit .wrapper {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}

.Products-item-reserva .orderId {
  width: 100%;
  /* Asegura que el contenedor ocupe todo el ancho disponible */
  text-align: center;
  /* Centra el texto horizontalmente */
}

.Products-item-reserva .orderId p {
  margin: 0 auto;
  /* Centra el texto horizontalmente si es necesario */
  font-weight: bold;
  color: #333;
  /* No olvides mantener tus otros estilos aquí */
}

.Products-item-reserva .content {
  padding: 15px;
}

.Products-item-reserva .footer {
  padding: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.Products-item-reserva .Products-item-reserva-img {
  width: 100%;
  position: relative;
  padding: 15px;
  border-radius: 12px;
}

.Products-item-reserva .orderId p {
  margin: 0;
  font-weight: bold;
  color: #333;
}

.Products-item-reserva .editprecio {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 10px 15px;
}

.Products-item-reserva .wrapperprecio {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.Products-item-reserva .num {
  font-size: 1.2rem;
  color: #444;
  font-weight: 500;
  /* Más grueso que el normal */
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
  /* Sutil sombra para mejorar el contraste */
}

.Products-item-reserva .edit .wrapper {
  padding: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Esto centra los ítems flexibles horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Esto centra los ítems flexibles verticalmente, en caso de que tu contenedor tenga altura */
  width: 100%;
  /* Asegura que el contenedor ocupe todo el ancho disponible */
}

.Products-item-reserva .nombreGrupoReserva {
  background-color: #EFEFEF;
  /* Ejemplo de color de fondo */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Añade aquí más estilos según sea necesario */
}

.info-container-fechas {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.info-item-fechas {
  margin-bottom: 0.1px;
  /* Espacio entre cada párrafo */
}

ia {
  /* Posición de las sugerencias */
  /* Resultados */
  /* Modo pantalla completa */
  /* Fondo oscuro para la imagen ampliada */
  /* Imagen en pantalla completa */
}

ia :host {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100vh;
  background: #f4f4f4;
}

ia .buscador-container {
  width: 100%;
  max-width: 1200px;
  position: relative;
  /* Para que las sugerencias aparezcan bien */
  margin: 0 auto;
}

ia .input-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Mantiene los elementos internos en columna */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background: white;
  border-radius: 25px;
  padding: 12px 15px;
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  position: relative;
  width: 100%;
  max-width: 1200px;
}

ia .botones-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra los botones */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  /* Espacio entre botones */
  width: 100%;
  margin-top: 10px;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  /* Evita que los botones se vayan a otra línea */
}

ia .boton {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Hace que los botones ocupen el mismo espacio */
  max-width: 140px;
  /* Ajusta el ancho máximo */
  height: 40px;
  border: 1px solid #CCCCCC;
  border-radius: 10px;
  /* Menos redondeado */
  background-color: #F7F7F8;
  color: #333;
  font-size: 14px;
  cursor: pointer;
  text-align: center;
  padding: 0 12px;
  white-space: nowrap;
  -webkit-transition: background 0.2s ease-in-out;
  transition: background 0.2s ease-in-out;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

ia .boton:hover {
  background: #e3e3e5;
}

ia input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  border: none;
  outline: none;
  font-size: 16px;
}

ia button {
  background: #ffffff;
  border: none;
  color: white;
  padding: 8px 15px;
  border-radius: 20px;
  cursor: pointer;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin: 0 5px;
  /* Espacio entre botones */
}

ia button:hover {
  background: #e3e3e5;
}

ia .sugerencias {
  position: absolute;
  top: 100%;
  /* Justo debajo del buscador */
  left: 0;
  width: 100%;
  background: white;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  padding: 5px 0;
  max-height: 200px;
  overflow-y: auto;
}

ia .sugerencias div {
  padding: 10px;
  cursor: pointer;
  font-size: 14px;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}

ia .sugerencias div:hover {
  background: #007bff;
  color: white;
}

ia .sugerencias .tabla {
  font-weight: bold;
  background: #e3f2fd;
}

ia .sugerencias .campo {
  padding-left: 20px;
  font-style: italic;
  background: #f9f9f9;
}

ia .result-card {
  margin-top: 20px;
  padding: 15px;
  border-radius: 10px;
  -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  background: white;
}

ia .result-container {
  overflow-x: auto;
}

ia .result-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}

ia .result-header {
  font-weight: bold;
  background: #f1f1f1;
  width: 100%;
}

ia .result-cell {
  padding: 10px;
  border-bottom: 1px solid #ddd;
  min-width: 120px;
  width: 100%;
  text-align: left;
}

ia .inputBuscador {
  width: 100%;
  border: none;
  outline: none;
  font-size: 16px;
  padding: 8px;
}

ia .botones-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  /* Distribuye los botones uniformemente */
  width: 100%;
  margin-top: 10px;
}

ia .historial-container {
  max-height: 550px;
  width: 90%;
  overflow-y: auto;
  border: 1px solid #ccc;
  border-radius: 8px;
  background: #f9f9f9;
  padding: 10px;
  margin-top: 10px;
  -webkit-box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
}

ia .historial-item {
  padding: 10px;
  border-bottom: 1px solid #ddd;
  cursor: pointer;
  background: #ffffff;
  border-radius: 5px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

ia .historial-item:hover {
  background: #007bff;
  color: #ffffff;
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

ia .historial-item:active {
  background: #0056b3;
  -webkit-transform: scale(0.98);
  transform: scale(0.98);
}

ia .paginacion {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 10px;
}

ia .excel-style-table {
  width: 100%;
  max-height: 500px;
  /* Ajusta la altura máxima */
  padding: 10px;
  border: 1px solid #ccc;
  background-color: white;
  border-radius: 8px;
  overflow: hidden;
  /* Evita desbordamientos */
}

ia .excel-download-badge {
  width: 50px;
  cursor: pointer;
  background-color: #3d574f;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  border-radius: 5px;
  padding: 5px;
}

ia .table-container {
  overflow-x: auto;
  /* Scroll horizontal si es necesario */
  overflow-y: auto;
  /* Habilita scroll vertical */
  max-height: 400px;
}

ia table {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
  background-color: #fff;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  table-layout: auto;
  /* Ajusta automáticamente el ancho de las columnas */
}

ia th, ia td {
  padding: 12px;
  /* Aumenta el padding para mejor visibilidad */
  text-align: center;
  border: 1px solid #b8b8b8;
  font-size: 14px;
  min-width: 120px;
  /* Evita que las columnas se compriman demasiado */
}

ia th {
  background-color: #d9d9d9;
  color: #333;
  font-weight: bold;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 10;
}

ia td {
  background-color: #f9f9f9;
  color: #333;
  word-wrap: break-word;
  /* Permite dividir texto largo */
  white-space: normal;
  /* Permite saltos de línea */
}

ia tr:nth-child(even) {
  background-color: #f1f1f1;
}

ia tr:hover {
  background-color: #e1f0ff;
  cursor: pointer;
}

ia .image-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 50vh;
  /* Ajusta la altura según necesites */
  text-align: center;
}

ia .centered-image {
  max-width: 60%;
  height: auto;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  cursor: pointer;
}

ia .centered-image:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Pequeño efecto de zoom al pasar el mouse */
}

ia .fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  -o-object-fit: contain;
  object-fit: contain;
  /* Asegura que la imagen se ajuste bien */
  background: rgba(0, 0, 0, 0.8);
  z-index: 1000;
  -webkit-transform: scale(1);
  transform: scale(1);
  /* Restaura tamaño normal */
  border-radius: 0;
}

ia .contenedor-videos {
  padding: 10px;
  text-align: center;
}

ia .videos-grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 15px;
  overflow-y: auto;
  /* Activa el scroll vertical */
  max-height: 600px;
  /* Ajusta según necesidad */
}

ia .video-item {
  max-width: 250px;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 10px;
  text-align: center;
  background: #fff;
}

ia .video-thumbnail {
  width: 100%;
  height: auto;
  border-radius: 5px;
}

ia .btn-ver-video {
  display: block;
  margin-top: 10px;
  padding: 8px;
  background: #007bff;
  color: #fff;
  border-radius: 5px;
  text-decoration: none;
}

ia .btn-ver-video:hover {
  background: #0056b3;
}

ia .imagenes-asociadas {
  margin-top: 10px;
}

ia .imagenes-grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

ia .imagen-asociada {
  width: 100px;
  /* Tamaño normal */
  height: auto;
  border-radius: 5px;
  border: 1px solid #ddd;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
  cursor: pointer;
}

ia .overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.8);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 1000;
}

ia .imagen-grande {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 10px;
  -webkit-box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.5);
  box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.5);
}

informe-cambios-maestro #difference-container {
  margin-bottom: 8px;
  /* Separación entre contenedores de diferencias */
  color: white;
  background-color: #b7a1a1;
}

informe-cambios-maestro #prop {
  font-weight: bold;
  /* Estilo para resaltar el nombre de la propiedad */
  color: white;
  background-color: #b7a1a1;
}

informe-cambios-maestro #value {
  color: lightcoral;
  margin: 0 4px;
  /* Separación entre los valores de la propiedad */
}

informe-cambios-maestro #difference {
  display: block;
}

modalseleccion {
  /* Contenedor del modal */
  /* Eliminar márgenes y paddings predeterminados */
  /* Estilo para cada ítem dentro del modal */
  /* Imagen pequeña si existe */
  /* Estilo para la información del ítem */
  /* Estilos responsivos */
}

modalseleccion :host {
  --ion-background-color: #ffffff;
  /* Cambia el color de fondo a blanco */
  --ion-color-primary: transparent;
  /* Elimina el color primario de Ionic */
  --ion-color-secondary: transparent;
  /* Elimina el color secundario de Ionic */
}

modalseleccion ion-content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que el contenido principal ocupe el espacio disponible */
}

modalseleccion ion-header, modalseleccion ion-content, modalseleccion ion-footer {
  margin: 0;
  padding: 0;
  background: none;
  /* Eliminar fondo predeterminado */
}

modalseleccion .modal-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 20px;
  background-color: #f9f9f9;
}

modalseleccion .modal-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 15px;
  margin-bottom: 15px;
  background-color: #fff;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  -webkit-transition: -webkit-transform 0.2s ease-in-out;
  transition: -webkit-transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
  cursor: pointer;
}

modalseleccion .modal-item:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Efecto al pasar el mouse */
}

modalseleccion .modal-item-image {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-right: 15px;
}

modalseleccion .modal-item-image img {
  width: 50px;
  height: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  /* Asegura que la imagen no se distorsione */
  border-radius: 5px;
}

modalseleccion .modal-item-info {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

modalseleccion .modal-item-title {
  font-size: 16px;
  font-weight: bold;
  color: #333;
  margin-bottom: 5px;
}

modalseleccion .modal-item-description {
  font-size: 14px;
  color: #777;
  margin: 0;
}

@media (max-width: 768px) {
  modalseleccion .modal-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    cursor: pointer;
  }
  modalseleccion .modal-item-info {
    text-align: left;
  }
  modalseleccion .modal-item-image img {
    width: 40px;
    height: 40px;
  }
}

@media (max-width: 480px) {
  modalseleccion .modal-container {
    padding: 10px;
  }
  modalseleccion .modal-item {
    padding: 10px;
    cursor: pointer;
  }
  modalseleccion .modal-item-title {
    font-size: 14px;
  }
  modalseleccion .modal-item-description {
    font-size: 12px;
  }
}

movimientos-electronicos ion-scroll {
  position: relative;
  display: block;
  color: #e1dede;
  width: 100% !important;
  height: 100% !important;
}

movimientos-electronicos .cuentaporcobrar {
  color: #ddd2d2;
}

movimientos-electronicos .pointerprint {
  cursor: pointer;
}

parqueaderos {
  /* Estilo cuando está grabando (rojo) */
  /* Estilo cuando está detenido (por defecto o de otro color) */
}

parqueaderos .fullscreen-modal {
  height: 100vh;
  /* 100% del alto de la ventana */
  width: 100vw;
  /* 100% del ancho de la ventana */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centrar horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
}

parqueaderos #gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

parqueaderos ion-header .fullscreen-modal {
  height: 100vh;
  /* 100% del alto de la ventana */
  width: 100vw;
  /* 100% del ancho de la ventana */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centrar horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
}

parqueaderos ion-header ion-icon {
  font-size: 30px;
  position: relative;
}

parqueaderos ion-header #notifications-badge-msg {
  background-color: #4307e9;
  position: absolute;
  top: 5px;
  right: 95px;
  color: #fff;
  z-index: 111;
}

parqueaderos ion-header #notifications-badge {
  background-color: #4307e9;
  position: absolute;
  top: 5px;
  right: 50px;
  color: #fff;
  z-index: 111;
}

parqueaderos ion-header img {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  margin-right: 10px;
}

parqueaderos ion-header .ch-menu {
  background-color: #252526;
  width: 100%;
}

parqueaderos ion-header .ch-menu p {
  color: #efe7e7;
  height: 100%;
  width: 100%;
  margin-left: 20px;
  margin-right: 20px;
  font-size: 12px;
}

parqueaderos ion-header .ch-menu .wrapper {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

parqueaderos ion-header .ch-menu .wrapper .item {
  min-width: 100px;
  height: auto;
  position: relative;
}

parqueaderos ion-header .ch-menu .wrapper .item #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

parqueaderos ion-header .ch-menu .wrapper .item #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

parqueaderos ion-header .ch-menu ion-grid ion-row ion-col #gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

parqueaderos ion-header .ch-menu ion-grid ion-row ion-col .ionSearchbar {
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
  padding: 0px;
  border-radius: 12px;
  margin: 0px;
}

parqueaderos ion-header .ch-menu ion-grid ion-row ion-col #numeromesap {
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
  max-width: 30px;
  border-radius: 12px;
  margin: 2px;
}

parqueaderos ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

parqueaderos ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas .itemmesas {
  height: auto;
  position: relative;
  display: contents;
}

parqueaderos ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas::-webkit-scrollbar {
  width: 0.2px;
  border-radius: 2px;
  opacity: 0.2;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

parqueaderos ion-header .ch-menu ion-card ion-card-header .cardHeader {
  background-color: #0c031d;
  color: #fff;
}

parqueaderos ion-header .ch-menu ion-card ion-card-header .cardContent {
  padding: 0px 16px;
  max-height: 0px;
}

parqueaderos ion-header ion-segment {
  background: #53414d;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

parqueaderos ion-header ion-segment ion-segment-button {
  --background-checked: #54586a;
  --color-checked: #fff;
  --indicator-color: #444141;
  font-size: 18px;
  --color: white;
}

parqueaderos ion-header ion-segment ion-segment-button ion-label {
  color: white;
}

parqueaderos ion-header ion-segment ion-label {
  display: initial !important;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select {
  background-color: #fff;
  margin-top: 10px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  height: auto;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select ion-icon {
  font-size: 24px;
  color: red;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select img {
  width: 30px;
  height: 30px;
  margin-right: 10px;
  color: red;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select span {
  width: 30px;
  margin-right: 30px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  background-color: #298;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select .text {
  width: 30px;
  margin-right: 30px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

parqueaderos ion-header .container-grid-select .upperBox-producto-select span.num {
  font-size: 22px;
  margin-right: 4px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

parqueaderos ion-header .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

parqueaderos ion-header .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

parqueaderos ion-header .gestionpedido {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  position: relative;
}

parqueaderos ion-header .gestionpedidoicon {
  margin-top: 2px;
}

parqueaderos ion-header .enviarcomandaboton {
  background-color: black;
}

parqueaderos ion-header .enviarcomandabotonReemprimir {
  background-color: #393838;
}

parqueaderos ion-header .enviarcomandabotonReemprimirTotal {
  background-color: #4b3333;
}

parqueaderos ion-header .enviarcomandabotonReemprimirIcon {
  font-size: 18px !important;
  color: white;
}

parqueaderos ion-header .devolverVenta {
  border-radius: 2px 2px 2px 2px !important;
}

parqueaderos ion-content {
  --background: #fff;
  /* Estilo cuando está detenido (por defecto o de otro color) */
}

parqueaderos ion-content .fullscreen-modal {
  height: 100vh;
  /* 100% del alto de la ventana */
  width: 100vw;
  /* 100% del ancho de la ventana */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centrar horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
}

parqueaderos ion-content .numero_total_precioSelect {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

parqueaderos ion-content .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

parqueaderos ion-content #labelDescripcion {
  visibility: hidden;
}

parqueaderos ion-content .img {
  background: black;
  overflow: hidden;
  height: 250px;
  width: 100%;
  position: relative;
}

parqueaderos ion-content .img .top {
  margin-top: 40px;
  margin-left: 20px;
  margin-right: 20px;
  position: absolute;
  width: 100%;
  z-index: 999;
}

parqueaderos ion-content .img .top .back_div {
  font-size: 30px;
  position: relative;
}

parqueaderos ion-content .img .top .back_div #end {
  float: right;
  margin-right: 40px;
}

parqueaderos ion-content .img .bottom {
  bottom: 10px;
  left: 10px;
  position: absolute;
  right: 10px;
  z-index: 80px;
  height: 80px;
  display: grid;
  grid-template-columns: 25% 55% 20%;
  grid-template-rows: 80px auto 80px;
  color: #fff;
}

parqueaderos ion-content .img .bottom .first {
  justify-self: start;
}

parqueaderos ion-content .img .bottom .first img {
  width: 70px;
  height: 70px;
  border-radius: 50px;
}

parqueaderos ion-content .img .bottom .second {
  justify-self: start;
  -webkit-align-self: start;
  -ms-flex-item-align: start;
  align-self: start;
}

parqueaderos ion-content .img .bottom .second h4 {
  margin-top: -3px;
}

parqueaderos ion-content .img .bottom .second p {
  margin-top: -10px;
}

parqueaderos ion-content .img .bottom .third h4 {
  margin-top: -5px;
}

parqueaderos ion-content .img #myimg {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  opacity: 0.3;
}

parqueaderos ion-content .content {
  margin-top: 105px;
  /* Estilos para el scrollbar en WebKit (Chrome, Safari, etc.) */
  /* Estilos para el scrollbar en Firefox */
}

parqueaderos ion-content .content .overview span:nth-of-type(1) {
  color: gray;
}

parqueaderos ion-content .content .overview span:nth-of-type(2) {
  color: red;
}

parqueaderos ion-content .content .overview .intro {
  padding: 0px 20px;
  color: gray;
  margin-top: -10px;
  text-align: justify;
}

parqueaderos ion-content .content .overview .intro span {
  color: red;
}

parqueaderos ion-content .content .overview .hrs {
  padding-left: 10px;
  margin-top: -20px;
}

parqueaderos ion-content .content .overview .hrs span {
  color: gray;
}

parqueaderos ion-content .content .overview .hrs ion-icon {
  color: #91e710;
}

parqueaderos ion-content .content #gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

parqueaderos ion-content .content .content .gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

parqueaderos ion-content .content .content .gestionProductosContainer::-webkit-scrollbar {
  width: 12px;
  /* Ancho del scrollbar */
}

parqueaderos ion-content .content .content .gestionProductosContainer::-webkit-scrollbar-track {
  background: #f1f1f1;
  /* Color de fondo de la pista del scrollbar */
}

parqueaderos ion-content .content .content .gestionProductosContainer::-webkit-scrollbar-thumb {
  background: #888;
  /* Color del "pulgar" del scrollbar */
  border-radius: 6px;
  /* Bordes redondeados para el "pulgar" */
}

parqueaderos ion-content .content .content .gestionProductosContainer::-webkit-scrollbar-thumb:hover {
  background: #555;
  /* Color del "pulgar" al pasar el mouse */
}

parqueaderos ion-content .content .content .gestionProductosContainer {
  scrollbar-width: thin;
  /* "auto" o "thin" */
  scrollbar-color: #888 #f1f1f1;
  /* Color del "pulgar" y de la pista */
}

parqueaderos ion-content .content .content .gestionProductosContainer::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

parqueaderos ion-content .content .grid {
  text-align: center;
  background-color: white;
  height: calc(100% - 18px);
  overflow-y: auto;
  padding: 0px;
}

parqueaderos ion-content .content .grid::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

parqueaderos ion-content .content .content .gridSelectReserva {
  height: calc(50vh - 1px);
  overflow-y: auto;
  margin-top: 10px !important;
}

parqueaderos ion-content .content .content .gridSelectReserva::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

parqueaderos ion-content .content .content .gridSelectProductReserva {
  height: 100%;
  /* Ajusta este valor según sea necesario */
  overflow: hidden;
  /* Evita el desbordamiento del contenido */
}

parqueaderos ion-content .content .content .gridSelectProductReserva::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

parqueaderos ion-content .content .products {
  position: relative;
  text-align: center;
  display: -webkit-box !important;
  width: 33% !important;
}

parqueaderos ion-content .content .top {
  background-color: #f9f9f9;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 1.95px 2.6px;
  height: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 20px;
}

parqueaderos ion-content .content #date {
  padding-left: 20px;
}

parqueaderos ion-content .content .container-grid {
  width: 100%;
  background: #54586a;
  border-radius: 8px;
  margin-right: 2px;
  margin-bottom: 2px;
}

parqueaderos ion-content .content .container-grid .Products-item {
  position: relative;
}

parqueaderos ion-content .content .container-grid .Products-item .orderId {
  grid-area: orderId;
}

parqueaderos ion-content .content .container-grid .Products-item .orderId p {
  position: absolute;
  vertical-align: middle;
  color: #121212 !important;
  padding-top: 13px;
  font-size: 13px !important;
  white-space: nowrap;
  /* Evita que el texto se divida en varias líneas */
  text-overflow: ellipsis;
  /* Agrega puntos suspensivos (...) al final del texto si no cabe en el contenedor */
  overflow: hidden;
  /* Oculta cualquier texto que sobrepase el contenedor */
  left: 0;
  /* Alinea el texto a la izquierda */
  right: 0;
  /* Alinea el texto a la derecha */
}

parqueaderos ion-content .content .container-grid .Products-item .edit {
  grid-area: edit;
  margin-top: 2px;
  margin-bottom: -4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

parqueaderos ion-content .content .container-grid .Products-item .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

parqueaderos ion-content .content .container-grid .Products-item .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 35px;
}

parqueaderos ion-content .content .container-grid .Products-item .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

parqueaderos ion-content .content .container-grid .Products-item .editprecio {
  grid-area: edit;
  margin-top: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

parqueaderos ion-content .content .container-grid .Products-item .editprecio .wrapperprecio {
  height: auto;
  width: 100px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: end;
  -ms-flex-align: end;
  align-items: end;
  background: #FFF;
}

parqueaderos ion-content .content .container-grid .Products-item .editprecio .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

parqueaderos ion-content .content .container-grid .Products-item .editprecio .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  color: #FFF;
  font-weight: bold;
  pointer-events: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

parqueaderos ion-content .content .container-grid .Products-item-img {
  width: 100%;
  background-color: white;
  -o-object-fit: cover;
  object-fit: cover;
  grid-area: image;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

parqueaderos ion-content .content .container-grid .Products-item-img #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding-right: 40px;
  height: 50px;
  max-width: none;
  width: 120px;
}

parqueaderos ion-content .content .container-grid .Products-item-img #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

parqueaderos ion-content .content .upperBox {
  width: 100%;
  background-color: #fff;
  margin-top: 10px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  height: auto;
  display: grid;
  grid-template-columns: 40% 35% 15% 10%;
  grid-template-rows: 15% 35% 35% 15%;
  gap: 5px 5px;
  grid-template-areas: "image orderId orderId orderId" "image menu menu menu" "image title title title" "image amount status status" "image edit edit edit";
}

parqueaderos ion-content .content .upperBox .image {
  grid-area: image;
}

parqueaderos ion-content .content .upperBox .image #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding: 10px;
  border-radius: 5px;
  height: auto;
  width: 100%;
}

parqueaderos ion-content .content .upperBox .image #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

parqueaderos ion-content .content .upperBox .title {
  grid-area: title;
  color: blue;
}

parqueaderos ion-content .content .upperBox .title h3 {
  font-size: 16px;
}

parqueaderos ion-content .content .upperBox .menu {
  grid-area: menu;
  margin-right: 20px;
  justify-self: center;
}

parqueaderos ion-content .content .upperBox .menu h3 ion-icon {
  margin-right: 10px;
  color: red;
}

parqueaderos ion-content .content .upperBox .orderId {
  grid-area: orderId;
}

parqueaderos ion-content .content .upperBox .orderId p {
  color: gray;
}

parqueaderos ion-content .content .upperBox .amount {
  grid-area: amount;
  -webkit-align-self: start;
  -ms-flex-item-align: start;
  align-self: start;
  justify-self: start;
  margin-top: -25px;
}

parqueaderos ion-content .content .upperBox .edit {
  grid-area: edit;
  margin-bottom: -4px;
  margin-right: 20px;
}

parqueaderos ion-content .content .upperBox .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

parqueaderos ion-content .content .upperBox .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

parqueaderos ion-content .content .upperBox .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

@media screen and (min-width: 200px) {
  parqueaderos ion-content .content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  parqueaderos ion-content .content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 200px) and (max-width: 600px) {
  parqueaderos ion-content .content .gridSelectReserva {
    margin-top: 150px !important;
    height: calc(30vh - 1px);
  }
  parqueaderos ion-content .content .gridSelectReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  parqueaderos ion-content .content .gridSelectProductReserva {
    height: calc(30vh - 1px);
  }
  parqueaderos ion-content .content .gridSelectProductReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  parqueaderos ion-content .content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  parqueaderos ion-content .content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
  parqueaderos ion-content .content page-meseromesero ion-content .content {
    margin-top: 22px !important;
  }
  parqueaderos ion-content .content .content {
    margin-top: 22px !important;
  }
}

@media screen and (min-width: 600px) and (max-width: 1200px) {
  parqueaderos ion-content .content page-meseromesero ion-content .content {
    margin-top: 18px !important;
  }
  parqueaderos ion-content .content .content {
    margin-top: 18px !important;
  }
}

@media screen and (min-width: 200px) {
  parqueaderos ion-content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  parqueaderos ion-content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 200px) and (max-width: 600px) {
  parqueaderos ion-content .gridSelectReserva {
    margin-top: 150px !important;
    height: calc(30vh - 1px);
  }
  parqueaderos ion-content .gridSelectReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  parqueaderos ion-content .gridSelectProductReserva {
    height: calc(30vh - 1px);
    margin-top: 150px !important;
  }
  parqueaderos ion-content .gridSelectProductReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  parqueaderos ion-content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  parqueaderos ion-content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
  parqueaderos ion-content page-meseromesero ion-content .content {
    margin-top: 27px !important;
  }
  parqueaderos ion-content .content {
    margin-top: 28px !important;
  }
}

@media screen and (min-width: 601px) and (max-width: 799px) {
  parqueaderos ion-content page-meseromesero ion-content .content {
    margin-top: 35px !important;
  }
  parqueaderos ion-content .content {
    margin-top: 36px !important;
  }
}

@media screen and (min-width: 800px) and (max-width: 2000px) {
  parqueaderos ion-content page-meseromesero ion-content .content {
    margin-top: 123px !important;
  }
  parqueaderos ion-content .content {
    margin-top: 124px !important;
  }
}

@media screen and (min-width: 200px) and (max-width: 900px) {
  parqueaderos ion-content .item-md ion-avatar ion-img, parqueaderos ion-content .item-md ion-avatar img {
    display: none !important;
  }
  parqueaderos ion-content ion-avatar img {
    display: none !important;
  }
  parqueaderos ion-content .item-input ion-input, parqueaderos ion-content .item-input ion-textarea {
    display: none !important;
  }
  parqueaderos ion-content ion-textarea {
    display: none !important;
  }
  parqueaderos ion-content .item-md ion-avatar[item-left], parqueaderos ion-content .item-md ion-thumbnail[item-left], parqueaderos ion-content .item-md ion-avatar[item-start], parqueaderos ion-content .item-md ion-thumbnail[item-start] {
    display: none !important;
  }
  parqueaderos ion-content #footer {
    height: 65px;
  }
}

parqueaderos ion-content .grabando {
  background-color: red;
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

parqueaderos ion-content .detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

parqueaderos ion-content .descripcion-textarea {
  width: 100%;
  height: auto;
  /* Ajusta la altura según el contenido */
  padding: 0;
  /* Elimina el relleno para que ocupe el 100% del ancho */
  border: none;
  /* Elimina el borde si es necesario */
  resize: none;
  /* Evita que el usuario cambie el tamaño manualmente */
  overflow: hidden;
  /* Controla el desbordamiento de contenido si lo hubiera */
}

parqueaderos #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

parqueaderos .grabando {
  background-color: red;
  color: white;
}

parqueaderos .detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
}

parqueaderos ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

/* Estilo cuando está grabando (rojo) */
.grabando {
  background-color: red;
  color: white;
}

/* Estilo cuando está detenido (por defecto o de otro color) */
.detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
}

#gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

#gestionProductosContainer::-webkit-scrollbar {
  width: 1.5px;
  /* Grosor del scrollbar */
  height: 6px;
}

#gestionProductosContainer::-webkit-scrollbar-thumb {
  border-radius: 8px;
  /* Radio de las esquinas del scrollbar */
  background-color: rgba(116, 211, 57, 0.329);
}

.image-container-asignar-placa {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  z-index: 9999;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.buscar-producto-container {
  position: fixed;
  top: 340px;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: white;
  padding: 20px;
  z-index: 99999;
  /* Aumentar el valor del z-index */
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  height: 80%;
  /* Limita el ancho del contenedor al 80% del ancho del viewport */
  max-height: 80%;
}

.expanded-buscar-producto {
  max-width: 90vw;
  max-height: 90vh;
}

.expanded-image-asignar-placa {
  width: 100%;
  /* El doble del tamaño original */
  height: 100%;
  /* El doble del tamaño original */
  max-width: none;
  /* Permite sobrepasar el ancho máximo si es necesario */
  max-height: none;
  /* Permite sobrepasar la altura máxima si es necesario */
}

.close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

.close-producto {
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

.close:hover {
  background-color: #ff6666;
  /* Cambiar color de fondo al pasar el ratón por encima */
}

pos-electronico .hide {
  display: none;
}

pos-electronico .gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

pos-electronico .gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

pos-electronico .inputTextArea textarea {
  text-align: left;
  font-size: 12px;
  padding-right: 0px;
}

@-webkit-keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.hide {
  display: none;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.inputTextArea textarea {
  text-align: left;
  font-size: 12px;
  padding-right: 0px;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.hide {
  display: none;
}

.config-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 2px;
  border: 1px solid #ccc;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  z-index: 1000;
}

.config-modal .h2 {
  margin-bottom: 15px;
}

.config-modal .input {
  display: block;
  margin-bottom: 10px;
  padding: 8px;
  width: 100%;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.config-modal .button {
  margin-top: 10px;
  padding: 8px 15px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.config-modal .button:hover {
  background-color: #0056b3;
}

.config-modal .h2 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 15px;
}

.config-modal .button-group {
  margin-bottom: 15px;
}

.config-modal .shortcut-buttons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
}

.config-modal .shortcut-buttons button {
  background: #979393;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 5px 10px;
  cursor: pointer;
  font-size: 14px;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}

.config-modal .shortcut-buttons button.selected {
  background: #007bff;
  color: #fff;
  border-color: #007bff;
}

.config-modal .shortcut-buttons button:hover {
  background: #e0e0e0;
}

.config-modal .button {
  background: #28a745;
  color: white;
  border: none;
  padding: 10px 15px;
  border-radius: 5px;
  cursor: pointer;
}

.config-modal .button:hover {
  background: #218838;
}

.config-modal .shortcut-buttons .forma-pago-chip {
  background-color: #ffffff;
  /* Fondo blanco */
  color: #333;
  /* Color de texto */
  font-size: 14px;
  /* Tamaño de fuente */
  padding: 5px 10px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra para profundidad */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Display flex para alinear imagen y texto */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
  white-space: nowrap;
  /* Evita que el texto se divida en múltiples líneas */
  min-width: 80px;
  /* Ancho mínimo para los chips */
  max-width: 100%;
  /* Ancho máximo opcional para los chips */
  line-height: normal;
}

.config-modal .forma-pago-imagen {
  width: 30px;
  /* Tamaño de la imagen */
  height: 30px;
  border-radius: 50%;
  /* Redondear la imagen */
  margin-right: 2px;
  /* Espacio entre la imagen y el texto */
}

.config-modal .forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.config-modal .forma-pago-nombre {
  font-weight: bold;
  /* Nombre en negrita */
  font-size: 15px;
  /* Tamaño de fuente más grande */
}

.config-modal .forma-pago-detalles {
  font-size: 13px;
  /* Tamaño de fuente para detalles */
  color: #666;
  /* Color de texto gris */
}

.config-modal .ioninput {
  margin-top: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 5px;
  width: 100%;
}

.config-modal .forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.config-modal .shortcut-buttons .selected button {
  background-color: #4CAF50;
  /* Color de fondo para el atajo seleccionado */
  color: white;
  /* Color de texto */
  font-weight: bold;
}

.config-modal .image-container {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  z-index: 9999;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.config-modal .expanded-image {
  width: 100%;
  /* El doble del tamaño original */
  height: 100%;
  /* El doble del tamaño original */
  max-width: none;
  /* Permite sobrepasar el ancho máximo si es necesario */
  max-height: none;
  /* Permite sobrepasar la altura máxima si es necesario */
}

.config-modal .close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

.config-modal .close-producto {
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

.config-modal .close:hover {
  background-color: #ff6666;
  /* Cambiar color de fondo al pasar el ratón por encima */
}

productos-campos-adicionales {
  --background-color:tranparent;
  /* Mejoras responsivas */
}

productos-campos-adicionales .ionchip {
  background-color: #f1f1f1;
  color: #333;
  border-radius: 20px;
  margin: 5px;
  font-size: 14px;
}

productos-campos-adicionales .ionchip .ionicon {
  font-size: 18px;
  color: #ff0000;
}

productos-campos-adicionales .ionchip .ionlabel {
  margin-right: 10px;
}

productos-campos-adicionales .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
}

productos-campos-adicionales .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

productos-campos-adicionales .color-item:hover {
  background-color: #f0f0f5;
}

productos-campos-adicionales .button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-campos-adicionales .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
  font-size: 16px;
}

productos-campos-adicionales .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 12px 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  font-size: 16px;
}

productos-campos-adicionales .color-item:hover {
  background-color: #f0f0f5;
}

productos-campos-adicionales .add-color-button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-campos-adicionales .add-color-button:hover {
  background: linear-gradient(45deg, #f06595, #ff6b6b);
}

@media (max-width: 600px) {
  productos-campos-adicionales .custom-input {
    font-size: 14px;
  }
  productos-campos-adicionales .color-item {
    font-size: 14px;
  }
  productos-campos-adicionales .add-color-button {
    font-size: 14px;
  }
}

productos-campos-adicionales .autocomplete-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
}

productos-campos-adicionales .tag {
  background-color: #d1d1d1;
  color: #333;
  padding: 5px 10px;
  border-radius: 20px;
  cursor: pointer;
  font-size: 14px;
}

productos-campos-adicionales .tag:hover {
  background-color: #bdbdbd;
}

productos-campos-adicionales .add-color {
  margin-top: 10px;
  text-align: right;
}

productos-campos-adicionales #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

productos-campos-adicionales ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

productos-campos-adicionales .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

.cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

.cuota:first-child {
  font-weight: bold;
}

.cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col:first-child {
  width: 15%;
}

/* Estilos para las filas de cuotas */
.cuota {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col {
  border-right: 1px solid #ccc;
}

.cuota-col:last-child {
  border: none;
}

.cuota-extra:first-child {
  font-weight: bold;
}

.cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

/* Estilos para las filas de cuotas */
.cuota-extra {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col-extra {
  border-right: 1px solid #ccc;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.centered-col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  /* Ajusta la altura para centrar verticalmente */
  text-align: center;
  padding: 15px;
}

.centered-text {
  font-size: 1.2em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* Hace que el texto sea más destacado */
  padding: 10px;
  color: #164372;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
}

.centered-texttitulo {
  font-size: 1.1em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* He que el texto sea más destacado */
  padding: 2px;
  color: white;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
  background-color: #37373f;
  /* Fondo suave para el texto */
}

productos-campos-adicionales-cambiar-valor {
  --background-color:tranparent;
  /* Mejoras responsivas */
}

productos-campos-adicionales-cambiar-valor .ionchip {
  background-color: #f1f1f1;
  color: #333;
  border-radius: 20px;
  margin: 5px;
  font-size: 14px;
}

productos-campos-adicionales-cambiar-valor .ionchip .ionicon {
  font-size: 18px;
  color: #ff0000;
}

productos-campos-adicionales-cambiar-valor .ionchip .ionlabel {
  margin-right: 10px;
}

productos-campos-adicionales-cambiar-valor .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
}

productos-campos-adicionales-cambiar-valor .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

productos-campos-adicionales-cambiar-valor .color-item:hover {
  background-color: #f0f0f5;
}

productos-campos-adicionales-cambiar-valor .button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-campos-adicionales-cambiar-valor .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
  font-size: 16px;
}

productos-campos-adicionales-cambiar-valor .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 12px 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  font-size: 16px;
}

productos-campos-adicionales-cambiar-valor .color-item:hover {
  background-color: #f0f0f5;
}

productos-campos-adicionales-cambiar-valor .add-color-button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-campos-adicionales-cambiar-valor .add-color-button:hover {
  background: linear-gradient(45deg, #f06595, #ff6b6b);
}

@media (max-width: 600px) {
  productos-campos-adicionales-cambiar-valor .custom-input {
    font-size: 14px;
  }
  productos-campos-adicionales-cambiar-valor .color-item {
    font-size: 14px;
  }
  productos-campos-adicionales-cambiar-valor .add-color-button {
    font-size: 14px;
  }
}

productos-campos-adicionales-cambiar-valor .autocomplete-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
}

productos-campos-adicionales-cambiar-valor .tag {
  background-color: #d1d1d1;
  color: #333;
  padding: 5px 10px;
  border-radius: 20px;
  cursor: pointer;
  font-size: 14px;
}

productos-campos-adicionales-cambiar-valor .tag:hover {
  background-color: #bdbdbd;
}

productos-campos-adicionales-cambiar-valor .add-color {
  margin-top: 10px;
  text-align: right;
}

productos-campos-adicionales-cambiar-valor #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

productos-campos-adicionales-cambiar-valor ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

productos-campos-adicionales-cambiar-valor .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

.cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

.cuota:first-child {
  font-weight: bold;
}

.cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col:first-child {
  width: 15%;
}

/* Estilos para las filas de cuotas */
.cuota {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col {
  border-right: 1px solid #ccc;
}

.cuota-col:last-child {
  border: none;
}

.cuota-extra:first-child {
  font-weight: bold;
}

.cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

/* Estilos para las filas de cuotas */
.cuota-extra {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col-extra {
  border-right: 1px solid #ccc;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.centered-col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  /* Ajusta la altura para centrar verticalmente */
  text-align: center;
  padding: 15px;
}

.centered-text {
  font-size: 1.2em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* Hace que el texto sea más destacado */
  padding: 10px;
  color: #164372;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
}

.centered-texttitulo {
  font-size: 1.1em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* He que el texto sea más destacado */
  padding: 2px;
  color: white;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
  background-color: #37373f;
  /* Fondo suave para el texto */
}

productos-campos-adicionales-cambiar-valor-impuestos {
  --background-color:tranparent;
  /* Mejoras responsivas */
}

productos-campos-adicionales-cambiar-valor-impuestos .ionchip {
  background-color: #f1f1f1;
  color: #333;
  border-radius: 20px;
  margin: 5px;
  font-size: 14px;
}

productos-campos-adicionales-cambiar-valor-impuestos .ionchip .ionicon {
  font-size: 18px;
  color: #ff0000;
}

productos-campos-adicionales-cambiar-valor-impuestos .ionchip .ionlabel {
  margin-right: 10px;
}

productos-campos-adicionales-cambiar-valor-impuestos .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
}

productos-campos-adicionales-cambiar-valor-impuestos .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

productos-campos-adicionales-cambiar-valor-impuestos .color-item:hover {
  background-color: #f0f0f5;
}

productos-campos-adicionales-cambiar-valor-impuestos .button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-campos-adicionales-cambiar-valor-impuestos .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
  font-size: 16px;
}

productos-campos-adicionales-cambiar-valor-impuestos .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 12px 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  font-size: 16px;
}

productos-campos-adicionales-cambiar-valor-impuestos .color-item:hover {
  background-color: #f0f0f5;
}

productos-campos-adicionales-cambiar-valor-impuestos .add-color-button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-campos-adicionales-cambiar-valor-impuestos .add-color-button:hover {
  background: linear-gradient(45deg, #f06595, #ff6b6b);
}

@media (max-width: 600px) {
  productos-campos-adicionales-cambiar-valor-impuestos .custom-input {
    font-size: 14px;
  }
  productos-campos-adicionales-cambiar-valor-impuestos .color-item {
    font-size: 14px;
  }
  productos-campos-adicionales-cambiar-valor-impuestos .add-color-button {
    font-size: 14px;
  }
}

productos-campos-adicionales-cambiar-valor-impuestos .autocomplete-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
}

productos-campos-adicionales-cambiar-valor-impuestos .tag {
  background-color: #d1d1d1;
  color: #333;
  padding: 5px 10px;
  border-radius: 20px;
  cursor: pointer;
  font-size: 14px;
}

productos-campos-adicionales-cambiar-valor-impuestos .tag:hover {
  background-color: #bdbdbd;
}

productos-campos-adicionales-cambiar-valor-impuestos .add-color {
  margin-top: 10px;
  text-align: right;
}

productos-campos-adicionales-cambiar-valor-impuestos #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

productos-campos-adicionales-cambiar-valor-impuestos ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

productos-campos-adicionales-cambiar-valor-impuestos .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

.cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

.cuota:first-child {
  font-weight: bold;
}

.cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col:first-child {
  width: 15%;
}

/* Estilos para las filas de cuotas */
.cuota {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col {
  border-right: 1px solid #ccc;
}

.cuota-col:last-child {
  border: none;
}

.cuota-extra:first-child {
  font-weight: bold;
}

.cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

/* Estilos para las filas de cuotas */
.cuota-extra {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col-extra {
  border-right: 1px solid #ccc;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.centered-col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  /* Ajusta la altura para centrar verticalmente */
  text-align: center;
  padding: 15px;
}

.centered-text {
  font-size: 1.2em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* Hace que el texto sea más destacado */
  padding: 10px;
  color: #164372;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
}

.centered-texttitulo {
  font-size: 1.1em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* He que el texto sea más destacado */
  padding: 2px;
  color: white;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
  background-color: #37373f;
  /* Fondo suave para el texto */
}

.novedad {
  background-color: #004085;
  /* Azul oscuro profesional */
  color: #ffffff;
  /* Texto blanco */
  font-size: 16px;
  /* Tamaño de fuente ligeramente más grande */
  font-weight: 500;
  /* Peso de fuente medio */
  text-transform: uppercase;
  /* Texto en mayúsculas */
  border-radius: 5px;
  /* Bordes suavemente redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
  padding: 2px 5px;
  /* Espaciado interno */
}

.novedad ion-icon {
  font-size: 18px;
  margin-right: 10px;
}

.novedad:hover {
  background-color: #002752;
  /* Color más oscuro en hover */
}

.novedad:active {
  background-color: #282c31;
  /* Color más oscuro al presionar */
}

productos-rapidos {
  /* Eliminar márgenes y paddings predeterminados */
  /* Mejoras responsivas */
}

productos-rapidos :host {
  --ion-background-color: #ffffff;
  /* Cambia el color de fondo a blanco */
  --ion-color-primary: transparent;
  /* Elimina el color primario de Ionic */
  --ion-color-secondary: transparent;
  /* Elimina el color secundario de Ionic */
}

productos-rapidos ion-content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que el contenido principal ocupe el espacio disponible */
}

productos-rapidos ion-header, productos-rapidos ion-content, productos-rapidos ion-footer {
  margin: 0;
  padding: 0;
  background-color: #737070;
  /* Eliminar fondo predeterminado */
}

productos-rapidos ion-input {
  width: 100%;
  border: none;
  outline: none;
  font-size: 16px;
  padding: 1px;
  background: transparent;
  color: #333;
}

productos-rapidos .ionchip {
  background-color: #f1f1f1;
  color: #333;
  border-radius: 20px;
  margin: 5px;
  font-size: 14px;
}

productos-rapidos .ionchip .ionicon {
  font-size: 18px;
  color: #ff0000;
}

productos-rapidos .ionchip .ionlabel {
  margin-right: 10px;
}

productos-rapidos .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
}

productos-rapidos .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

productos-rapidos .color-item:hover {
  background-color: #f0f0f5;
}

productos-rapidos .button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-rapidos .custom-input {
  border: 1px solid #dcdcdc;
  border-radius: 8px;
  padding: 10px;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
  font-size: 16px;
}

productos-rapidos .color-item {
  border-bottom: 1px solid #f1f1f1;
  padding: 12px 10px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  font-size: 16px;
}

productos-rapidos .color-item:hover {
  background-color: #f0f0f5;
}

productos-rapidos .add-color-button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
  background: linear-gradient(45deg, #ff6b6b, #f06595);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
}

productos-rapidos .add-color-button:hover {
  background: linear-gradient(45deg, #f06595, #ff6b6b);
}

@media (max-width: 600px) {
  productos-rapidos .custom-input {
    font-size: 14px;
  }
  productos-rapidos .color-item {
    font-size: 14px;
  }
  productos-rapidos .add-color-button {
    font-size: 14px;
  }
}

productos-rapidos .autocomplete-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 10px;
}

productos-rapidos .tag {
  background-color: #d1d1d1;
  color: #333;
  padding: 5px 10px;
  border-radius: 20px;
  cursor: pointer;
  font-size: 14px;
}

productos-rapidos .tag:hover {
  background-color: #bdbdbd;
}

productos-rapidos .add-color {
  margin-top: 10px;
  text-align: right;
}

productos-rapidos .grid-container-productos {
  max-width: 1200px;
  margin: 0 auto;
}

productos-rapidos .grid-container-productos-row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: whitesmoke;
  cursor: pointer;
}

productos-rapidos .grid-container-productos-col {
  width: 33.33%;
  margin-right: 10px;
}

productos-rapidos .grid-container-productos-col:last-child {
  margin-right: 0;
}

productos-rapidos .selecttext:hover {
  background-color: transparent;
}

productos-rapidos #customsearchbar {
  --background: #1e1e1e;
  /* Fondo oscuro */
  --color: white;
  /* Texto blanco */
  color: #605050;
  background: #1e1e1e;
  --placeholder-color: rgba(255, 255, 255, 0.7);
  /* Color del placeholder en blanco pero más claro */
  --input-background: transparent;
  /* Fondo del input transparente */
  --cancel-button-color: white;
  /* Botón cancelar blanco */
  --icon-color: white;
  /* Color del icono de búsqueda */
  border-radius: 8px;
  /* Bordes redondeados */
}

productos-rapidos #customsearchbar input {
  width: 100%;
  color: white;
  --color:white;
  font-size: 16px;
  /* Ajustar el tamaño del texto */
}

productos-rapidos ion-col[width-10] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 5%;
  -ms-flex: 0 0 5%;
  flex: 0 0 5%;
  /* Ocupa el 10% del ancho */
  max-width: 5%;
}

productos-rapidos ion-col[width-20] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 30%;
  -ms-flex: 0 0 30%;
  flex: 0 0 30%;
  /* Ocupa el 70% del ancho */
  max-width: 30%;
}

productos-rapidos ion-col[width-35] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  /* Ocupa el 70% del ancho */
  max-width: 60%;
}

productos-rapidos ion-col[width-45] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  /* Ocupa el 70% del ancho */
  max-width: 60%;
}

productos-rapidos ion-col {
  padding: 1px;
}

productos-rapidos .paginadorcol {
  background: gray;
}

productos-rapidos .paginador {
  cursor: pointer;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: #b1aaaa;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

productos-rapidos .paginador:hover {
  background-color: #e53935;
}

productos-rapidos .paginador #input {
  color: cadetblue;
}

productos-rapidos .productoValido {
  font-size: 14px;
  font-weight: bold;
  margin-top: 5px;
  display: block;
  padding: 5px;
  border-radius: 5px;
  text-align: center;
}

productos-rapidos .productoValido.error {
  color: #ff3b30;
  background: rgba(255, 59, 48, 0.1);
  border: 1px solid #ff3b30;
}

productos-rapidos .productoValido.success {
  color: #28a745;
  background: rgba(40, 167, 69, 0.1);
  border: 1px solid #28a745;
}

productos-rapidos .novedad {
  background-color: #004085;
  /* Azul oscuro profesional */
  color: #ffffff;
  /* Texto blanco */
  font-size: 16px;
  /* Tamaño de fuente ligeramente más grande */
  font-weight: 500;
  /* Peso de fuente medio */
  text-transform: uppercase;
  /* Texto en mayúsculas */
  border-radius: 5px;
  /* Bordes suavemente redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
  padding: 2px 5px;
  /* Espaciado interno */
}

productos-rapidos .novedad ion-icon {
  font-size: 18px;
  margin-right: 10px;
}

productos-rapidos .novedad:hover {
  background-color: #002752;
  /* Color más oscuro en hover */
}

productos-rapidos .novedad:active {
  background-color: #282c31;
  /* Color más oscuro al presionar */
}

productos-rapidos .grid-container-productos {
  --ion-grid-padding: 0px;
  /* Elimina padding global del grid */
}

productos-rapidos .grid-container-productos-row {
  --ion-grid-column-padding: 5px;
  /* Reduce padding entre las columnas */
}

productos-rapidos .grid-container-productos-col {
  padding: 12px;
  /* Espaciado más amplio entre cada item */
  background: #f0f8ff;
  border-radius: 8px;
  /* Bordes redondeados para un look moderno */
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  /* Ligero sombreado */
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  /* Efecto suave de hover */
  color: #fff;
  /* Color de texto blanco para contraste */
}

productos-rapidos .grid-container-productos-col:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Efecto de hover al pasar el mouse */
  background: #444;
  /* Fondo más oscuro al hacer hover */
}

productos-rapidos .selecttext {
  font-size: 16px;
  /* Aumentar el tamaño de la fuente */
  font-weight: bold;
  /* Poner el texto en negrita para mayor claridad */
  text-align: center;
  color: #fff;
  /* Color de texto blanco para una buena visibilidad */
}

productos-rapidos .paginadorcol {
  text-align: center;
}

productos-rapidos .paginador {
  display: inline-block;
  margin-top: 10px;
}

productos-rapidos .scrollable-container {
  max-height: 500px;
  /* Ajusta esto según lo que necesites */
  overflow-y: auto;
  position: relative;
}

productos-rapidos .fab-container {
  position: fixed;
  right: 20px;
  /* Ajusta para acercarlo más a la grid */
  z-index: 100;
  -webkit-transition: top 0.3s ease-in-out;
  transition: top 0.3s ease-in-out;
  /* Suaviza el movimiento */
}

productos-rapidos .producto-card {
  background: white;
  border-radius: 10px;
  padding: 10px;
  margin: 10px 0;
  -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}

productos-rapidos .producto-row {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  color: white;
  margin: 0px;
  padding: 0px;
}

productos-rapidos .producto-imagen img {
  max-width: 50px;
  height: auto;
  border-radius: 8px;
  -o-object-fit: cover;
  object-fit: cover;
}

productos-rapidos .producto-info {
  cursor: pointer;
}

productos-rapidos .nombre-producto {
  font-size: 16px;
  font-weight: bold;
  margin: 0;
}

productos-rapidos .existencias {
  font-size: 14px;
  color: #666;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

productos-rapidos .existencias ion-icon {
  margin-right: 5px;
  color: #007aff;
}

productos-rapidos .producto-acciones {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

productos-rapidos .btn-eliminar {
  background: #ae1616;
  color: white;
  font-size: 14px;
  padding: 5px 10px;
  border-radius: 5px;
}

productos-rapidos .producto-info {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

productos-rapidos .producto-info:hover {
  background: rgba(0, 0, 0, 0.1);
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota ion-row {
  background: #2c3e50;
  /* Color de fondo profesional (gris oscuro/azul) */
  padding: 0;
  margin: 0;
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota ion-col {
  padding: 0 !important;
  margin: 0 !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota .cuota-col {
  min-height: 2.5em;
  /* Tamaño adaptable */
  max-height: 3em;
  line-height: 1.2;
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota .header {
  font-weight: bold;
  color: white;
  /* Letra blanca */
  min-height: 3em;
  max-height: 3.5em;
  text-transform: uppercase;
  /* Mayúsculas para estilo profesional */
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota ion-badge {
  font-size: 0.9em;
  /* Fuente más pequeña para adaptabilidad */
  padding: 5px;
  height: auto;
  background-color: #2980b9;
  /* Color de fondo azul profesional */
  color: white;
  /* Letra blanca */
  border-radius: 8px;
  /* Bordes ligeramente redondeados */
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota ion-input {
  height: auto;
  font-size: 1em;
  padding: 0 5px;
  color: white;
  /* Letra blanca */
  background-color: rgba(255, 255, 255, 0.1);
  /* Fondo semi-transparente */
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  /* Borde tenue */
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota ion-checkbox {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  /* Tamaño del checkbox más pequeño */
  margin-right: 10px !important;
  --background-checked: #27ae60;
  /* Fondo verde cuando está seleccionado */
  --border-color: #fff;
  /* Borde blanco */
  --checkmark-color: #fff;
  /* Checkmark blanco */
}

productos-rapidos .cuota-grid-plan-de-pagos-por-cuota ion-item {
  --padding-start: 0;
  background: transparent;
  /* Fondo transparente para ion-item */
}

productos-rapidos ::ng-deep ion-searchbar {
  --background: rgb(63, 59, 59) !important;
  --color: white !important;
}

productos-rapidos ::ng-deep ion-searchbar .searchbar-input {
  color: white !important;
}

productos-rapidos ::ng-deep ion-searchbar .searchbar-search-icon,
productos-rapidos ::ng-deep ion-searchbar .searchbar-clear-icon {
  color: white !important;
}

productos-rapidos .producto-info-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 10px;
  padding-top: 5px;
}

productos-rapidos .producto-nombre {
  margin: 0;
  padding: 3px 7px;
  background-color: #298;
  color: white;
  border-radius: 5px;
  font-size: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}

productos-rapidos .producto-existencias {
  margin: 0;
  padding: 5px 10px;
  background-color: #298;
  color: white;
  border-radius: 5px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 5px;
  font-size: 14px;
  cursor: pointer;
}

productos-rapidos .custom-infinite-scroll {
  position: absolute;
  /* Se posiciona dentro de su contenedor */
  bottom: 0;
  /* Lo coloca en la parte inferior */
  left: 0;
  width: 100%;
  /* O ajusta el ancho según lo necesites */
  z-index: -1;
  /* Lo envía detrás de otros elementos */
  opacity: 0;
  /* Lo oculta visualmente */
}

productos-rapidos .custom-infinite-scroll .infinite-loading {
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  /* Alinea el spinner a la derecha */
  -webkit-transform: scale(0.4);
  transform: scale(0.4);
  /* Reduce el tamaño del spinner */
  width: 15px !important;
  /* Ajusta el ancho */
  height: 15px !important;
  /* Ajusta la altura */
  position: absolute;
  /* Se posiciona dentro del contenedor padre */
  bottom: 0;
  /* Lo coloca en la parte inferior */
  left: 0;
  z-index: -1;
  /* Lo coloca detrás de otros elementos */
  opacity: 0;
  /* Lo oculta visualmente */
}

productos-translados {
  /* Para dispositivos pequeños */
}

productos-translados .nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 24px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: white;
  /* Color del texto */
  display: block;
}

productos-translados .nombrereservatituloexistencia {
  text-align: center;
  /* Para centrar el texto */
  font-size: 12px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: white;
  /* Color del texto */
  display: block;
}

productos-translados .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

productos-translados .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

productos-translados .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

productos-translados .puntero {
  cursor: pointer;
}

productos-translados .end {
  float: right;
}

productos-translados .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

productos-translados .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

productos-translados .item-container-tiporeserva {
  border: 1px solid #ccc;
  padding: 1px;
  margin: 1px 0;
  color: white;
  background-color: #403a3a;
}

productos-translados #guardar-button {
  background-color: #007bff;
  cursor: pointer;
  color: #fff;
  /* Otros estilos de botón */
}

productos-translados .valor-input {
  width: 100%;
  padding: 2px;
  margin-top: 2px;
  cursor: pointer;
  border-bottom: 2px solid #71719a;
}

productos-translados .grid-container-productos {
  max-width: 1200px;
  margin: 0 auto;
}

productos-translados .grid-container-productos-row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: whitesmoke;
  cursor: pointer;
}

productos-translados .grid-container-productos-col {
  width: 33.33%;
  margin-right: 2px;
}

productos-translados .grid-container-productos-col:last-child {
  margin-right: 0;
}

productos-translados .selectHover:hover {
  background-color: #4c4949;
  color: white;
}

productos-translados .selecttext {
  color: white;
  background-color: #298;
  border-radius: 8px;
  margin: 2px;
  padding: 2px;
}

productos-translados .selecttext:hover {
  background-color: transparent;
}

productos-translados #customsearchbar {
  --background: #1e1e1e;
  /* Fondo oscuro */
  --color: white;
  /* Texto blanco */
  color: #605050;
  background: #1e1e1e;
  --placeholder-color: rgba(255, 255, 255, 0.7);
  /* Color del placeholder en blanco pero más claro */
  --input-background: transparent;
  /* Fondo del input transparente */
  --cancel-button-color: white;
  /* Botón cancelar blanco */
  --icon-color: white;
  /* Color del icono de búsqueda */
  border-radius: 8px;
  /* Bordes redondeados */
}

productos-translados #customsearchbar input {
  width: 100%;
  color: white;
  --color:white;
  font-size: 16px;
  /* Ajustar el tamaño del texto */
}

productos-translados ion-list {
  margin: 15px;
}

productos-translados ion-list ion-item {
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  margin-bottom: 10px;
  padding: 15px;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

productos-translados ion-list ion-item ion-row {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

productos-translados ion-list ion-item ion-row ion-col {
  padding: 5px;
}

productos-translados ion-list ion-item ion-row h2 {
  font-size: 18px;
  font-weight: bold;
  color: #333;
  margin-bottom: 5px;
}

productos-translados ion-list ion-item ion-row p {
  font-size: 14px;
  color: #777;
  margin-bottom: 2px;
}

productos-translados ion-list ion-item button {
  background-color: #3880ff;
  /* color azul profesional */
  color: white;
  border-radius: 20px;
  font-size: 14px;
  font-weight: bold;
}

productos-translados ion-list ion-item button ion-icon {
  margin-right: 5px;
}

productos-translados ion-list ion-item button:hover {
  background-color: #3171e0;
}

@media (max-width: 600px) {
  productos-translados ion-item ion-col h2 {
    font-size: 16px;
  }
  productos-translados ion-item ion-col p {
    font-size: 12px;
  }
  productos-translados ion-item button {
    font-size: 12px;
  }
}

proveedora-por-producto .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

proveedora-por-producto .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

proveedora-por-producto .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

proveedora-por-producto .puntero {
  cursor: pointer;
}

proveedora-por-producto .end {
  float: right;
}

proveedora-por-producto .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

proveedora-por-producto .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

proveedora-por-producto-equivalencia .nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 24px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: white;
  /* Color del texto */
  display: block;
}

proveedora-por-producto-equivalencia .nombrereservatituloexistencia {
  text-align: center;
  /* Para centrar el texto */
  font-size: 12px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: white;
  /* Color del texto */
  display: block;
}

proveedora-por-producto-equivalencia .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

proveedora-por-producto-equivalencia .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

proveedora-por-producto-equivalencia .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

proveedora-por-producto-equivalencia .puntero {
  cursor: pointer;
}

proveedora-por-producto-equivalencia .end {
  float: right;
}

proveedora-por-producto-equivalencia .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

proveedora-por-producto-equivalencia .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

proveedora-por-producto-equivalencia .item-container-tiporeserva {
  border: 1px solid #ccc;
  padding: 1px;
  margin: 1px 0;
  color: white;
  background-color: #403a3a;
}

proveedora-por-producto-equivalencia #guardar-button {
  background-color: #007bff;
  cursor: pointer;
  color: #fff;
  /* Otros estilos de botón */
}

proveedora-por-producto-equivalencia .valor-input {
  width: 100%;
  padding: 5px;
  margin-top: 5px;
  cursor: pointer;
  border-bottom: 2px solid #71719a;
}

reservas-grupales #image-container {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 80%;
  height: 80%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  z-index: 9999;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

reservas-grupales #expanded-buscar-producto {
  max-width: 90vw;
  max-height: 90vh;
}

reservas-grupales #expanded-image {
  width: 100%;
  /* El doble del tamaño original */
  height: 100%;
  /* El doble del tamaño original */
  max-width: none;
  /* Permite sobrepasar el ancho máximo si es necesario */
  max-height: none;
  /* Permite sobrepasar la altura máxima si es necesario */
}

reservas-grupales #close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

reservas-grupales #close-producto {
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

reservas-grupales #close:hover {
  background-color: #ff6666;
  /* Cambiar color de fondo al pasar el ratón por encima */
}

reservas-grupales .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

reservas-grupales .colorfecha {
  background-color: red;
}

reservas-grupales .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

reservas-grupales .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

reservas-grupales .puntero {
  cursor: pointer;
}

reservas-grupales .end {
  float: right;
}

reservas-grupales .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

reservas-grupales .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

.config-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  border: 1px solid #ccc;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  z-index: 1000;
}

.config-modal .h2 {
  margin-bottom: 15px;
}

.config-modal .input {
  display: block;
  margin-bottom: 10px;
  padding: 8px;
  width: 100%;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.config-modal .button {
  margin-top: 10px;
  padding: 8px 15px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.config-modal .button:hover {
  background-color: #0056b3;
}

.config-modal .h2 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 15px;
}

.config-modal .button-group {
  margin-bottom: 15px;
}

.config-modal .shortcut-buttons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
}

.config-modal .shortcut-buttons button {
  background: #979393;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 5px 10px;
  cursor: pointer;
  font-size: 14px;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}

.config-modal .shortcut-buttons button.selected {
  background: #007bff;
  color: #fff;
  border-color: #007bff;
}

.config-modal .shortcut-buttons button:hover {
  background: #e0e0e0;
}

.config-modal .button {
  background: #28a745;
  color: white;
  border: none;
  padding: 10px 15px;
  border-radius: 5px;
  cursor: pointer;
}

.config-modal .button:hover {
  background: #218838;
}

.config-modal .shortcut-buttons .forma-pago-chip {
  background-color: #ffffff;
  /* Fondo blanco */
  color: #333;
  /* Color de texto */
  font-size: 14px;
  /* Tamaño de fuente */
  padding: 5px 10px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra para profundidad */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Display flex para alinear imagen y texto */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
  white-space: nowrap;
  /* Evita que el texto se divida en múltiples líneas */
  min-width: 80px;
  /* Ancho mínimo para los chips */
  max-width: 100%;
  /* Ancho máximo opcional para los chips */
  line-height: normal;
}

.config-modal .forma-pago-imagen {
  width: 30px;
  /* Tamaño de la imagen */
  height: 30px;
  border-radius: 50%;
  /* Redondear la imagen */
  margin-right: 2px;
  /* Espacio entre la imagen y el texto */
}

.config-modal .forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.config-modal .forma-pago-nombre {
  font-weight: bold;
  /* Nombre en negrita */
  font-size: 15px;
  /* Tamaño de fuente más grande */
}

.config-modal .forma-pago-detalles {
  font-size: 13px;
  /* Tamaño de fuente para detalles */
  color: #666;
  /* Color de texto gris */
}

.config-modal .ioninput {
  margin-top: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 5px;
  width: 100%;
}

.config-modal .forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.config-modal .shortcut-buttons .selected button {
  background-color: #4CAF50;
  /* Color de fondo para el atajo seleccionado */
  color: white;
  /* Color de texto */
  font-weight: bold;
}

teclado {
  /* Eliminar márgenes y paddings predeterminados */
}

teclado :host {
  --ion-background-color: #ffffff;
  /* Cambia el color de fondo a blanco */
  --ion-color-primary: transparent;
  /* Elimina el color primario de Ionic */
  --ion-color-secondary: transparent;
  /* Elimina el color secundario de Ionic */
}

teclado ion-content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que el contenido principal ocupe el espacio disponible */
}

teclado ion-header, teclado ion-content, teclado ion-footer {
  margin: 0;
  padding: 0;
  background: none;
  /* Eliminar fondo predeterminado */
}

/* Estilo para la capa de fondo cuando el pop-up está visible */
.popup-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  /* Fondo semi-transparente */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 10;
}

/* Estilo para el contenido del pop-up */
.popup-content {
  background: white;
  padding: 20px;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  width: 80%;
  max-width: 400px;
  text-align: center;
}

.popup-content h2 {
  margin-bottom: 20px;
}

/* Estilo para la capa de fondo cuando el pop-up está visible */
.popup-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  /* Fondo semi-transparente */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 10;
}

/* Estilo para el contenido del pop-up */
.popup-content {
  background: white;
  padding: 20px;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  width: 80%;
  max-width: 400px;
  text-align: center;
}

.popup-content h2 {
  margin-bottom: 20px;
}

/* Estilo para los botones alineados uno al lado del otro */
.popup-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  margin-top: 20px;
}

/* Estilo para los campos de input, mejorando la visibilidad de los asteriscos */
.popup-input {
  font-size: 18px;
  letter-spacing: 2px;
  /* Aumenta el espacio entre los caracteres para mejorar la legibilidad */
}

.popup-content button {
  margin-top: 10px;
}

.fullscreen-modal {
  height: 100%;
  width: 100%;
}

.container {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas: "productos productos gestion" "productos productos gestion" "productos productos gestion";
}

.productos {
  grid-area: productos;
  /* Estilos para la lista desplegable */
  /* Opcional: estilos personalizados para el scrollbar */
}

.productos .wrapper {
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
  margin-top: 2px !important;
}

.productos .wrapper::-webkit-scrollbar {
  width: 2.5px;
  /* Grosor del scrollbar */
  height: 8px;
}

.productos .wrapper::-webkit-scrollbar-thumb {
  border-radius: 8px;
  /* Radio de las esquinas del scrollbar */
  background-color: rgba(23, 15, 40, 0.329);
}

.productos .ion--ticket {
  display: inline-block;
  width: 1em;
  height: 1em;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("https://res.cloudinary.com/drqk6qzo7/image/upload/v1716566547/ticket_ux7z6d.png");
}

.productos .item {
  min-width: 100px;
  height: auto;
  position: relative;
}

.productos #imggrupos {
  height: 80px;
  display: block;
  outline: 1px solid #361717;
  margin: 2px;
}

.productos .denominacion-mayor-seis #imggrupos {
  width: 100%;
  margin: 0px !important;
  border-radius: 50%;
  /* Para imágenes redondeadas */
  background-color: rgba(255, 255, 255, 0);
  /* Fondo transparente */
}

.productos .select-searchable-search-box {
  background-color: #676262;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 1px;
}

.productos .select-searchable-list {
  background-color: #a59a9a;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.productos .image-container {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  z-index: 9999;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.productos .buscar-producto-container {
  position: fixed;
  top: 340px;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: white;
  padding: 20px;
  z-index: 99999;
  /* Aumentar el valor del z-index */
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  height: 80%;
  /* Limita el ancho del contenedor al 80% del ancho del viewport */
  max-height: 80%;
}

.productos .expanded-buscar-producto {
  max-width: 90vw;
  max-height: 90vh;
}

.productos .expanded-image {
  width: 100%;
  /* El doble del tamaño original */
  height: 100%;
  /* El doble del tamaño original */
  max-width: none;
  /* Permite sobrepasar el ancho máximo si es necesario */
  max-height: none;
  /* Permite sobrepasar la altura máxima si es necesario */
}

.productos .close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

.productos .close-producto {
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

.productos .close:hover {
  background-color: #ff6666;
  /* Cambiar color de fondo al pasar el ratón por encima */
}

.productos .productoselect {
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-y: auto;
  max-height: 100%;
  /* Ajusta la altura máxima según tus necesidades */
  background-color: #413f3f;
  /* Establece el color de fondo deseado */
  padding-right: 15px;
  /* Agrega un relleno a la derecha para dar espacio al scrollbar */
}

.productos .itemselect {
  min-width: 100px;
  height: auto;
  position: relative;
}

.productos .itemselectgeneral {
  min-width: 100px;
  height: auto;
  position: relative;
  max-height: 52vh;
  /*70vh; 70% de la altura de la pantalla */
  overflow-y: auto;
  /* Habilita el scrollbar vertical */
}

.productos .itemselectgeneral::-webkit-scrollbar {
  width: 12px;
  /* Ancho del scrollbar */
}

.productos .itemselectgeneral::-webkit-scrollbar-track {
  background: #f1f1f1;
  /* Color de fondo del track */
}

.productos .itemselectgeneral::-webkit-scrollbar-thumb {
  background: #888;
  /* Color del pulgar del scrollbar */
}

.productos .itemselectgeneral::-webkit-scrollbar-thumb:hover {
  background: #555;
  /* Color del pulgar del scrollbar al pasar el mouse por encima */
}

.productos .productoselect::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

.productos .headerrow {
  background: #94949b;
  color: #fff;
  font-size: 18px;
}

.productos .ioncol {
  border: 1px solid #ECEEEF;
  cursor: pointer;
}

.productos .selectHover:hover {
  background-color: #817d7d;
}

.productos .ioncontent {
  --background: #fff;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-y: auto;
}

.productos .ioncontent .paginador {
  cursor: pointer;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.productos .ioncontent .paginador:hover {
  background-color: #e53935;
}

.productos .ioncontent .paginador #input {
  color: cadetblue;
}

.productos .ioncontent .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

.productos .ioncontent .ionGrd {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  background: white;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: #2c2929;
  cursor: pointer;
}

.productos .ioncontent .col {
  width: 33.33%;
  margin-right: 10px;
}

.productos .ioncontent .col:last-child {
  margin-right: 0;
}

.productos .ionfooter {
  background-color: aliceblue;
}

.productos .ticket {
  width: 200px;
  /* Ancho del ticket */
  padding: 20px;
  /* Espacio interno del ticket */
  background-color: #f3f3f3;
  /* Color de fondo del ticket */
  border: 2px solid #333;
  /* Borde del ticket */
  border-radius: 8px;
  /* Bordes redondeados */
  position: relative;
  /* Establecer posición relativa para elementos internos */
}

.productos .ticket:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  /* Triángulo superior */
  border-bottom-color: #333;
  /* Color del triángulo */
  border-top-width: 0;
  /* Ocultar borde superior */
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  /* Centrar triángulo horizontalmente */
}

.productos .ticket:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10px;
  height: 10px;
  background-color: #333;
  /* Punto en la esquina inferior izquierda */
}

.productos .ticket_content {
  font-family: Arial, sans-serif;
  /* Fuente del contenido */
  color: #333;
  /* Color del texto */
}

.productos .ticket_content h2 {
  font-size: 16px;
  /* Tamaño del título */
  margin: 0 0 10px;
  /* Margen inferior del título */
}

.productos .ticket_content p {
  font-size: 14px;
  /* Tamaño del texto */
  margin: 0;
  /* Eliminar margen del párrafo */
}

.gestion {
  grid-area: gestion;
}

.ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

.numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
  margin-bottom: 4px;
}

/* Estilos para la vista de "response" */
@media only screen and (max-width: 600px) {
  .container {
    grid-template-columns: 1fr;
    /* Cambiar a una sola columna en vista de "response" */
    grid-template-rows: auto;
    /* Permitir filas flexibles en vista de "response" */
    grid-template-areas: "productos" "gestion";
  }
  .productos {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
  }
  /* Cambiar el orden en vista de "response" */
  .gestion {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
  }
  /* Cambiar el orden en vista de "response" */
}

usuariopedidosalon {
  /* Eliminar márgenes y paddings predeterminados */
}

usuariopedidosalon :host {
  --ion-background-color: #ffffff;
  /* Cambia el color de fondo a blanco */
  --ion-color-primary: transparent;
  /* Elimina el color primario de Ionic */
  --ion-color-secondary: transparent;
  /* Elimina el color secundario de Ionic */
}

usuariopedidosalon ion-content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que el contenido principal ocupe el espacio disponible */
}

usuariopedidosalon ion-header, usuariopedidosalon ion-content, usuariopedidosalon ion-footer {
  margin: 0;
  padding: 0;
  background: none;
  /* Eliminar fondo predeterminado */
}

usuariopedidosalon ion-navbar .back-button {
  display: none !important;
}

.nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 12px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: #fefefefb;
  /* Color del texto */
  display: block;
}

.calendar {
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  width: 100%;
  margin: 0 auto;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 20px;
  background: -webkit-gradient(linear, left top, right top, from(#f9f1f5), color-stop(0%, #0e0e0e), color-stop(0%, #efe6f1), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#091a4b));
  background: linear-gradient(90deg, #f9f1f5 0%, #0e0e0e 0%, #efe6f1 0%, #211e4a 99%, #41484a 100%, #091a4b 100%);
  height: auto;
  overflow: hidden;
  /* Asegura que el contenido del calendario no se desborde */
}

.calendar::before {
  content: "";
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.6);
  /* Ajusta la opacidad y el color del overlay */
}

.calendar .day {
  padding: 10px;
  text-align: center;
  border: 1px solid #ccc;
  background-color: #fff;
  /* Color de fondo para resaltar los números de los días */
  border-radius: 8px;
  cursor: pointer !important;
  color: white !important;
}

.calendar .day:hover {
  background-color: #f2f2f2;
  /* Cambia el color de fondo en hover para mayor contraste */
  border-radius: 8px;
  cursor: pointer !important;
  color: white !important;
}

.calendar .weekday {
  font-weight: bold;
  text-align: center;
  background-color: #111111;
  padding: 10px;
  margin: 0px;
  border-radius: 8px;
  color: #9c9fa3;
  cursor: pointer;
}

.calendar .today {
  background-color: #1a7ba8;
  font-weight: bold;
  border-radius: 8px;
  cursor: pointer;
}

.calendar .month-header {
  text-align: center;
  font-size: 20px;
  margin-bottom: 10px;
  display: none;
  color: black;
  background-color: #fff;
  /* Color de fondo */
}

.calendar .month-header:first-child {
  display: block;
  /* Mostrar solo el primer mes */
}

/* Estilo para resaltar el mes actual */
.calendar .month-header.active {
  display: block;
  font-weight: bold;
  color: black;
}

/* Asegura que los botones sean clicables */
.calendar button {
  cursor: pointer;
  background: none;
  border: none;
  outline: none;
}

/* Ajusta los estilos para los botones de retroceso y avance */
.calendar button:nth-child(1),
.calendar button:nth-child(2) {
  background: #fff;
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  position: relative;
  z-index: 1;
}

.calendar button {
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  color: #333;
  /* Color de texto */
  max-height: 38px;
}

/* Estilo al botón de avance */
.calendar button.next {
  padding: 2px 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  background-color: #fff;
  /* Color de fondo */
  color: #333;
  /* Color de texto */
  margin: 0 5px;
  /* Margen entre los botones */
  /* Agrega otros estilos específicos según tus preferencias */
}

/* Estilo al botón de retroceso */
.calendar button.previous {
  padding: 2px 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  background-color: #fff;
  /* Color de fondo */
  color: #333;
  /* Color de texto */
  margin: 0 5px;
  /* Margen entre los botones */
  /* Agrega otros estilos específicos según tus preferencias */
}

/* Estilos para los botones de navegación */
.calendar-previous,
.calendar-next {
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 16px;
  cursor: pointer;
  background-color: #fff;
  color: #333;
  margin: 0 5px;
}

/* Asegura que los botones de navegación sean clicables */
.calendar-previous,
.calendar-next {
  cursor: pointer;
  background: none;
  border: none;
  outline: none;
}

/* Estilos específicos para el botón de navegación "siguiente" */
.calendar-next {
  opacity: 1;
}

/* Estilos específicos para el botón de navegación "anterior" */
.calendar-previous {
  opacity: 1;
}

/* Incluye clases específicas si deseas diferenciar visualmente los botones */
.calendar button.previous {
  opacity: 1;
  /* Ajusta la opacidad para que el texto sea más visible */
}

.calendar button.next {
  opacity: 1;
  /* Ajusta la opacidad para que el texto sea más visible */
}

.calendar .highlighted {
  background-color: red;
  /* Cambia el color de fondo para resaltar los elementos */
  font-weight: bold;
  /* Aplica negrita u otros estilos de texto */
  /* Agrega otros estilos deseados para resaltar los elementos */
}

.calendar .header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 10px;
  /* Espacio entre la cabecera y el grid de días */
}

.calendar .month-header {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* Permite que la fecha ocupe el espacio disponible */
  text-align: center;
  display: block;
  /* Aseguramos que se muestre */
  color: black;
  /* tus estilos existentes */
  /* Elimina estilos que ocultan o muestran basados en clases adicionales, si es necesario */
}

/* Estilos para el contenedor principal */
.containerheader {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  margin: 0 auto;
}

/* Estilos para los botones de navegación */
.containerheader .button {
  font-size: 20px;
  /* Ajustar el tamaño del texto de los botones */
  --background: #e0e0e0;
  /* Cambiar el color de fondo de los botones */
  --border-radius: 8px;
  /* Aplicar bordes redondeados a los botones */
  --padding-start: 20px;
  /* Ajustar el espacio interno del botón */
  --padding-end: 20px;
  /* Ajustar el espacio interno del botón */
  --color: #333;
  /* Cambiar el color del texto de los botones */
  background-color: #333;
  color: #cfc2c2;
  border-radius: 4px;
}

/* Estilos para la fecha en el medio */
.containerheader .center-content {
  text-align: center;
  font-size: 24px;
  /* Ajustar el tamaño de la fuente para la fecha */
  font-weight: bold;
  /* Hacer la fecha en negrita */
  color: #1a7ba8;
  /* Cambiar el color de la fecha */
  background-color: #333;
  color: #cfc2c2;
  border-radius: 4px;
}

.calendar .clicked-day {
  border: 2px solid red;
  /* Solo un ejemplo para destacar el día clickeado */
}

.calendar .selected-day {
  /* Estilos para el día seleccionado, por ejemplo: */
  border: 2px solid blue;
}

.calendar .day .select-hour-button {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #333;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 5px;
}

ion-icon[name="alarm-outline"] {
  font-size: 4.5rem;
  /* Ajusta el tamaño del icono según sea necesario */
  margin-bottom: -4px;
  /* Ajusta el margen inferior para colocarlo en la parte inferior */
}

.select-time-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

@media (max-width: 768px) {
  .calendar {
    grid-template-columns: repeat(7, calc(100% / 7));
    /* Ajusta el ancho de las columnas para pantallas pequeñas */
    gap: 5px;
    /* Reduce el espacio entre los elementos para una apariencia más compacta */
  }
  .calendar .day {
    font-size: 12px;
    /* Reducir el tamaño de la fuente para los números de los días */
    padding: 5px;
    /* Reducir el espacio alrededor de cada día para que se ajuste mejor en pantallas pequeñas */
  }
  .calendar .month-header {
    font-size: 16px;
    /* Reducir el tamaño de la fuente para adaptarse a pantallas pequeñas */
    margin-bottom: 5px;
    /* Reducir el espacio inferior para un diseño más compacto */
  }
  /* tus estilos existentes para responsividad */
  .calendar .header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .calendar .month-header {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
    /* Asegura que la fecha se muestre en medio en pantallas pequeñas */
    margin: 10px 0;
    /* Espacio antes y después en diseño vertical */
  }
  .calendar .selected-day {
    /* Estilos para el día seleccionado, por ejemplo: */
    border: 2px solid blue;
  }
}

page-caja .fullscreen-modal {
  height: 100%;
  width: 100%;
}

page-caja .divProductos {
  text-align: center;
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-caja .colorfecha {
  background-color: red;
}

page-caja .divGrupos {
  text-align: center;
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-caja .leftItem {
  float: left;
  width: 46%;
}

page-caja .rightItem {
  float: right;
  width: 46%;
}

page-caja .divGrupos::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.603);
}

page-caja .divFactura::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.603);
}

page-caja .divProductos::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-caja .divCaja::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-caja body::-webkit-scrollbar {
  width: 2px;
  background-color: violet;
}

page-caja .divCaja {
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-caja img {
  max-height: 55px;
  float: left;
}

page-caja .divFactura {
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-caja .pointerprint {
  cursor: pointer;
}

page-caja ion-card {
  position: relative;
  text-align: center;
  display: inline-block;
  width: 90% !important;
}

page-caja .afn {
  border-bottom: 5px solid;
  color: gray;
  cursor: pointer;
}

page-caja .afn.clic {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-caja .afn.clic:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

page-caja .afn.animate {
  border-bottom: none;
}

page-caja .afn.animate:before {
  content: "afn";
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 5px;
  background-color: red;
  width: 0%;
  border-radius: 0 0 5px 5px;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-caja .afn.animate.col:before {
  background-color: gray;
}

page-caja .afn.animate.colpro:before {
  background-color: #0c031c;
}

page-caja .afn.animate:hover:before {
  width: 100%;
}

page-caja .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-caja .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-caja .inputTextArea textarea {
  text-align: left;
  font-size: 18px;
  padding-right: 0px;
}

page-caja .inputPrecio input {
  text-align: right;
  font-size: 25px;
  border: 1px solid #567;
  padding-right: 0px;
  color: white;
}

page-caja page-caja .botondinamico {
  top: "0px";
  float: "left";
  width: "15px";
  height: "15px";
}

page-caja .imgmoneda {
  display: block;
  float: left !important;
  margin: auto;
  width: 100%;
  height: 55px;
  border: 1px solid #9c9c9c;
  border-radius: 25px;
}

page-caja .imgmonedamonedero {
  display: block;
  float: left !important;
  margin: auto;
  width: 10%;
  height: 85px;
  border: 1px solid #9c9c9c;
  border-radius: 25px;
}

page-caja .card-title {
  float: left;
}

page-caja .card-background-page ion-card {
  position: relative;
  text-align: center;
  border-bottom: 5px solid var(--red);
}

page-caja .card-background-page .card-title {
  position: absolute;
  top: 36%;
  font-size: 2.0em;
  width: 100%;
  font-weight: bold;
  color: #fff;
}

page-caja .card-background-page .card-subtitle {
  font-size: 1.0em;
  position: absolute;
  top: 52%;
  width: 100%;
  color: #fff;
}

page-caja .card-background-page .cuentaporcobrar {
  color: #920f0f;
}

page-caja .text-right {
  text-align: right;
}

page-caja .text-left {
  text-align: left;
}

page-caja .large-padding {
  padding: 10px 15px;
  font-size: 16px;
  padding-right: 6px;
  padding-bottom: 1px;
}

page-caja .pointer {
  cursor: pointer;
}

page-caja .no-background {
  background: transparent;
}

page-caja .light-text {
  color: #0c031d;
}

page-caja .contenedor {
  width: 98%;
  max-width: 2000px;
  margin: 1px auto;
  display: grid;
  grid-gap: 1px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
  grid-template-areas: "header contenido";
}

page-caja .contenedor > div {
  background: #fff;
  padding: 1px;
  border-radius: 2px;
}

page-caja .contenedor .header {
  background: #12203E;
  color: #fff;
  grid-area: header;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  grid-column-start: 1;
  grid-column-end: -1;
}

page-caja .contenedor .prueba2 {
  background: #fAA43D;
}

page-caja .contenedor .contenido {
  grid-area: contenido;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #12203E;
}

page-caja .contenedor .sidebar {
  grid-column: 2 / -1;
  background: #fAA43D;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
}

page-caja .menu-fixed {
  position: fixed;
  z-index: 1000;
  top: 0;
}

page-caja .contenedor .footer {
  background: #12203E;
  color: #fff;
  grid-area: footer;
}

page-caja #wrapper-caja-mesas {
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
  max-width: 100%;
  /* Ajusta este valor según tu diseño */
}

page-caja #item-caja-mesas {
  min-width: 150px;
  height: auto;
  position: relative;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  /* Opcionalmente, prueba con display: inline-block; */
  margin-bottom: 3px;
}

page-caja #wrapper-caja-mesas::-webkit-scrollbar {
  width: 1.5px;
  /* Grosor del scrollbar */
  height: 6px;
}

page-caja #wrapper-caja-mesas::-webkit-scrollbar-thumb {
  border-radius: 8px;
  /* Radio de las esquinas del scrollbar */
  background-color: rgba(73, 48, 127, 0.329);
}

page-caja #imggrupos {
  height: 80px;
  display: block;
  outline: 1px solid #361717;
  margin: 2px;
}

page-caja .denominacion-mayor-seis #imggrupos {
  width: 100%;
  margin: 0px !important;
  border-radius: 50%;
  /* Para imágenes redondeadas */
  background-color: rgba(255, 255, 255, 0);
  /* Fondo transparente */
}

@media screen and (max-width: 768px) {
  page-caja .contenedor .contenido {
    grid-column: 1 / -1;
  }
  page-caja .contenedor .sidebar {
    grid-column: 1 / -1;
  }
  page-caja .contenedor .footer {
    grid-column: 1 / -1;
  }
}

@media screen and (max-width: 901px) {
  page-caja page-caja .numero_total_precio {
    display: none !important;
  }
  page-caja .numero_total_precio {
    display: none !important;
  }
  page-caja .item-md ion-avatar[item-left], page-caja .item-md ion-thumbnail[item-left], page-caja .item-md ion-avatar[item-start], page-caja .item-md ion-thumbnail[item-start] {
    display: none !important;
  }
}

page-caja ion-grid ion-row ion-col ion-item .item-md {
  color: 1px solid #2c2a2a !important;
}

page-caja ion-grid ion-row ion-col ion-item .item-md h2 {
  color: 1px solid #2c2a2a !important;
}

page-caja ion-grid ion-row ion-col ion-item h2 {
  color: 1px solid #2c2a2a !important;
}

page-caja ion-grid ion-row ion-col ion-item h3 {
  color: 1px solid #2c2a2a !important;
}

page-caja ion-grid ion-row ion-col ion-item h1 {
  color: 1px solid #2c2a2a !important;
}

page-caja ion-grid ion-row ion-col ion-item .input-wrapper {
  color: 1px solid #2c2a2a !important;
}

page-caja ion-content #inputWrappe {
  color: 1px solid #2c2a2a !important;
}

page-caja #inputWrappe {
  color: 1px solid #2c2a2a !important;
}

page-caja .item-md h2 {
  color: 1px solid #2c2a2a !important;
}

page-caja h2 {
  color: 1px solid #2c2a2a !important;
}

page-caja h3 {
  color: 1px solid #2c2a2a !important;
}

page-caja h1 {
  color: 1px solid #2c2a2a !important;
}

page-caja .item-md {
  color: 1px solid #2c2a2a !important;
}

page-caja .item-md h2 {
  color: 1px solid #2c2a2a !important;
}

page-caja .input-wrapper {
  color: #fffefe !important;
}

page-caja .item-md {
  background-color: transparent !important;
}

page-caja ion-list {
  background-image: -webkit-gradient(linear, left bottom, right top, from(#0c0d0d), color-stop(#1f2c30), color-stop(#344b58), color-stop(#556985), to(#8686af));
  background-image: linear-gradient(to right top, #0c0d0d, #1f2c30, #344b58, #556985, #8686af);
}

page-caja form, page-caja input, page-caja optgroup, page-caja select {
  color: black;
}

page-caja .custom-alert-input .alert-input {
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  padding: 10px !important;
  font-size: 16px !important;
  color: #333 !important;
}

page-caja .custom-fab {
  top: 92px !important;
  left: 10px !important;
  /* Ajusta según sea necesario */
  position: fixed !important;
  /* Asegura que la posición sea fija */
  z-index: 2;
  /* Asegura que el FAB esté por encima del contenido del header */
  cursor: pointer;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  /* Elimina la sombra */
  background: #c9c1c1;
  width: 35px;
  height: 45px;
  border-radius: 12px;
}

page-caja .fab-button {
  background: none !important;
  /* Elimina el fondo */
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  /* Elimina la sombra */
  width: 250px;
  /* Ajusta el ancho del botón */
  height: 56px;
  /* Ajusta la altura del botón */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0;
  /* Elimina el padding extra */
  margin: 0;
  /* Elimina el margin extra */
  color: #bec7c6;
  /* Ajusta el color del ícono */
  border-radius: 50%;
  /* Hace el botón circular */
}

page-caja .fab-button ion-icon {
  font-size: 28px;
  /* Ajusta el tamaño del ícono */
}

page-caja .custom-fab ion-fab-list ion-button {
  background: none !important;
  /* Elimina el fondo */
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  /* Elimina la sombra */
  width: 56px;
  /* Ajusta el ancho del botón */
  height: 56px;
  /* Ajusta la altura del botón */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0;
  /* Elimina el padding extra */
  margin: 0;
  /* Elimina el margin extra */
  color: #6e7675;
  /* Ajusta el color del ícono */
  border-radius: 50%;
  /* Hace el botón circular */
}

page-caja .custom-fab ion-fab-list ion-button ion-icon {
  font-size: 28px;
  /* Ajusta el tamaño del ícono */
}

page-caja .custom-fab ion-fab-list ion-button:hover {
  background: rgba(100, 85, 75, 0.2);
  /* Fondo ligero al pasar el ratón */
}

page-caja .custom-fab ion-fab-list ion-button:active {
  background: rgba(70, 60, 50, 0.2);
  /* Fondo ligero al hacer clic */
}

page-caja .custom-fab ion-button {
  background: transparent !important;
  /* Elimina el fondo */
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  /* Elimina la sombra */
  width: 56px;
  /* Ajusta el ancho del botón */
  height: 56px;
  /* Ajusta la altura del botón */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0;
  /* Elimina el padding extra */
  margin: 0;
  /* Elimina el margin extra */
  color: #6e7675;
  /* Ajusta el color del ícono */
  border-radius: 50%;
  /* Hace el botón circular */
}

page-caja .custom-fab ion-button ion-icon {
  font-size: 28px;
  /* Ajusta el tamaño del ícono */
}

page-caja .custom-fab ion-button:hover {
  background: rgba(100, 85, 75, 0.2);
  /* Fondo ligero al pasar el ratón */
}

page-caja .custom-fab ion-button:active {
  background: rgba(70, 60, 50, 0.2);
  /* Fondo ligero al hacer clic */
}

page-caja .price-badge-caja {
  position: absolute;
  top: 10px;
  /* Ajusta según sea necesario */
  right: 10px;
  /* Ajusta según sea necesario */
  z-index: 10;
}

page-caja .price-badge-caja img {
  width: 30px;
  /* Ajusta el tamaño según sea necesario */
  height: 30px;
  /* Ajusta el tamaño según sea necesario */
}

page-caja .custom-button {
  width: auto;
  /* El botón se ajusta al tamaño del texto */
  background-color: #2b2424;
  /* Fondo uniforme */
  border-radius: 10px;
  /* Bordes redondeados para simular un cuadro de diálogo */
  padding: 10px 20px;
  /* Añadir espacio dentro del botón */
  text-align: left;
  /* Alinea el contenido del botón a la izquierda */
  margin-bottom: 10px;
  /* Espacio entre botones */
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* Sombra suave para simular un cuadro */
}

page-caja .custom-fab-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Asegura que los botones estén en columna */
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  /* Alinea los botones a la izquierda */
}

page-caja .custom-fab {
  background-color: #36393c;
  /* Color del botón principal */
}

.container-cajavertical {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Usar flexbox para alinear los divs */
  width: 100%;
  /* Asegurarse de que el contenedor ocupe el 100% del ancho */
  overflow-x: auto;
  /* Scroll horizontal */
  height: 100vh;
  /* Altura total de la ventana */
}

.div-38-cajavertical {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 33%;
  -ms-flex: 0 0 33%;
  flex: 0 0 33%;
  /* Flex-grow: 0, Flex-shrink: 0, Flex-basis: 38% */
  background-color: #b9cee7;
  /* Color de fondo para visualizar */
  min-width: 200px;
  /* Establecer un ancho mínimo para que no se colapse */
  overflow-y: auto;
  /* Scroll vertical */
  max-height: calc(100vh - 2px);
  /* Ajustar la altura para no superar el 100% de la pantalla */
  padding: 2px;
  /* Espaciado interno */
}

.div-34-cajavertical {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 26%;
  -ms-flex: 0 0 26%;
  flex: 0 0 26%;
  /* Flex-grow: 0, Flex-shrink: 0, Flex-basis: 34% */
  background-color: #b9cee7;
  /* Color de fondo para visualizar */
  min-width: 200px;
  /* Establecer un ancho mínimo para que no se colapse */
  overflow-y: auto;
  /* Scroll vertical */
  max-height: calc(100vh - 55px);
  /* Ajustar la altura para no superar el 100% de la pantalla */
  padding: 2px;
  /* Espaciado interno */
}

.div-rest-cajavertical {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Ocupa el resto del espacio disponible */
  background-color: #b9cee7;
  /* Color de fondo para visualizar */
  min-width: 200px;
  /* Establecer un ancho mínimo para que no se colapse */
  overflow-y: auto;
  /* Scroll vertical */
  max-height: calc(100vh - 2px);
  /* Ajustar la altura para no superar el 100% de la pantalla */
  padding: 2px;
  /* Espaciado interno */
}

/* Estilos para el contenido que pueda ser largo */
.content-cajavertical {
  height: 100vh;
  /* Altura fija para el contenido, puedes ajustarlo según necesites */
  overflow-y: auto;
  /* Scroll vertical para el contenido */
}

.producto-card-select {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0px;
  border: 1px solid #ddd;
  border-radius: 10px;
  background-color: #eee6e6;
  margin: 2px;
}

.productos-container-wrapper {
  margin-top: 0px;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow-y: auto;
  /* Habilitar el scrollbar vertical */
  max-height: 100vh;
  /* Asegurarse de que el contenedor no exceda la altura de la ventana */
}

.productos-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Para que los productos estén uno debajo del otro */
  gap: 4px;
  /* Espacio entre cada tarjeta */
  padding: 1px;
  margin: 1px;
  cursor: pointer;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* Permitir que el contenedor crezca para ocupar el espacio disponible */
}

.producto-card {
  background-color: #fff;
  /* Color de fondo */
  border: 1px solid #ddd;
  /* Borde */
  border-radius: 4px;
  /* Bordes redondeados */
  padding: 10px;
  /* Espaciado interno */
  margin-bottom: 10px;
  /* Espacio inferior entre tarjetas */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  /* Sombra */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  cursor: pointer;
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  /* Transición suave para el hover */
}

.producto-card:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Efecto de zoom al pasar el mouse */
}

.producto-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 60%;
  font-size: 16px;
  /* Tamaño de fuente */
  font-weight: 700;
  /* Negrita */
  color: #2d2c2c;
  /* Gris claro */
  text-align: center;
  /* Centrar el texto */
  padding: 10px;
}

.productos-container-wrapper {
  margin-top: 0px;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow-y: auto;
  position: relative;
  /* Necesario para posicionar el badge */
}

.productos-contador {
  position: absolute;
  /* Cambiado a absolute para que flote */
  top: 10px;
  right: 25px;
  z-index: 1000;
  background-color: #987f1c;
  color: #fff;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 12px;
  /* Ajusta el tamaño de la fuente para que no ocupe mucho espacio */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.spanselect {
  margin: 0;
  padding: 0;
  position: relative;
  /* Necesario para posicionar el badge dentro del span */
}

.productos-contador-select {
  position: absolute;
  /* Cambiado a absolute para que flote */
  top: -10px;
  /* Ajusta según sea necesario */
  right: -10px;
  /* Ajusta según sea necesario */
  z-index: 1000;
  background-color: #987f1c;
  color: #fff;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 12px;
  /* Ajusta el tamaño de la fuente para que no ocupe mucho espacio */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.numero_total_producto {
  font-weight: bold;
  margin-left: 4px;
  /* Espacio entre el texto y el número */
}

.nombre-producto {
  font-size: 18px;
  font-weight: bold;
  margin: 0;
}

.descripcion-producto {
  font-size: 14px;
  color: #7f8c8d;
  margin: 5px 0;
}

.nombre-tienda {
  font-size: 14px;
  color: #95a5a6;
  margin-top: auto;
}

.precio-cantidad {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 10px;
}

.precio {
  font-size: 18px;
  font-weight: bold;
}

.cantidad {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
}

.icono-borrar {
  font-size: 20px;
  color: #95a5a6;
}

.producto-imagen img {
  max-height: 40px;
  border-radius: 8px;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
}

.imgselect {
  width: 60px;
  height: 60px;
  margin-right: 10px;
  -o-object-fit: cover;
  object-fit: cover;
  /* Asegura que la imagen mantenga sus proporciones */
  border-radius: 4px;
}

.producto-imagenselect {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinea el contenido verticalmente */
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  /* Alinea la imagen y el contenido a la izquierda */
  max-width: 40px;
  /* Limita el ancho máximo del contenedor */
}

.price-badge-caja img {
  width: 30px;
  /* Ajusta el tamaño según sea necesario */
  height: 30px;
  /* Ajusta el tamaño según sea necesario */
  margin-left: 20px;
  border-radius: 2px;
}

.icono-profesional {
  font-size: 40px;
  /* Aumentar el tamaño del ícono */
  color: #007bff;
  /* Color del ícono (puedes cambiarlo) */
  width: 50px;
  /* Ancho adicional */
  height: 50px;
  /* Alto adicional, opcional */
  display: inline-block;
  /* Permitir ajustar el tamaño */
  background-color: #f8f9fa;
  /* Fondo suave */
  border-radius: 5px;
  /* Bordes redondeados */
  padding: 10px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
  text-align: center;
  /* Centrar el ícono */
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  /* Transición suave al pasar el mouse */
}

.icono-configuracion {
  font-size: 40px;
  /* Aumentar el tamaño del ícono */
  color: #06203b;
  /* Color del ícono (puedes cambiarlo) */
  width: 50px;
  /* Ancho adicional */
  display: inline-block;
  /* Permitir ajustar el tamaño */
  background-color: #f8f9fa;
  /* Fondo suave */
  border-radius: 5px;
  /* Bordes redondeados */
  padding: 0px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
  text-align: center;
  /* Centrar el ícono */
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  /* Transición suave al pasar el mouse */
}

.icono-configuracion:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  /* Aumentar ligeramente al pasar el mouse */
}

.icono-configuracion-rapido {
  font-size: 20px;
  /* Aumentar el tamaño del ícono */
  color: #06203b;
  /* Color del ícono (puedes cambiarlo) */
  width: 35px;
  /* Ancho adicional */
  display: inline-block;
  /* Permitir ajustar el tamaño */
  background-color: #f8f9fa;
  /* Fondo suave */
  border-radius: 2px;
  /* Bordes redondeados */
  padding: 0px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
  text-align: center;
  /* Centrar el ícono */
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
  /* Transición suave al pasar el mouse */
}

.icono-configuracion-rapido:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  /* Aumentar ligeramente al pasar el mouse */
}

#buscarproductos {
  --background: #1e1e1e;
  /* Fondo oscuro */
  --color: white;
  /* Texto blanco */
  color: #605050;
  background: #1e1e1e;
  --placeholder-color: rgba(255, 255, 255, 0.7);
  /* Color del placeholder en blanco pero más claro */
  --input-background: transparent;
  /* Fondo del input transparente */
  --cancel-button-color: white;
  /* Botón cancelar blanco */
  --icon-color: white;
  /* Color del icono de búsqueda */
  border-radius: 8px;
  /* Bordes redondeados */
}

#buscarproductos input {
  width: 100%;
  color: white;
  --color:white;
  font-size: 16px;
  /* Ajustar el tamaño del texto */
}

/* Solo aplicable a la página con la clase .productosseleccion */
.productosseleccion ion-list {
  margin: 10px;
  /* Espaciado externo */
}

.productosseleccion ion-item {
  border-radius: 10px;
  /* Bordes redondeados */
  margin-bottom: 10px;
  /* Espaciado entre ítems */
  padding: 10px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra para dar profundidad */
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  /* Transición suave para el cambio de color */
}

.productosseleccion ion-item:hover {
  background-color: rgba(0, 0, 0, 0.05);
  /* Color de fondo al pasar el mouse */
}

.productosseleccion ion-avatar {
  margin-right: 10px;
  /* Espaciado a la derecha del avatar */
}

.productosseleccion .pointerprint {
  color: #007bff;
  /* Color azul para los iconos */
}

.productosseleccion .numero_cantidad,
.productosseleccion .numero_total_precio {
  background-color: #007bff;
  /* Color de fondo azul */
  color: white;
  /* Color de texto blanco */
  margin: 0 5px;
  /* Espaciado horizontal entre badges */
}

.productosseleccion ion-input {
  width: 70px;
  /* Ancho del input */
  margin-left: 10px;
  /* Espaciado a la izquierda del input */
}

.productosseleccion ion-label {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* Permite que el label ocupe el espacio disponible */
  font-weight: bold;
  /* Letra en negrita */
  color: #333;
  /* Color del texto */
}

.gruposproductoswrapper {
  max-width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  padding: 1px;
  /* Añade algo de padding para separación */
  gap: 3px;
  /* Espacio entre elementos */
  cursor: pointer;
  scroll-behavior: smooth;
  /* Para un desplazamiento suave */
  scrollbar-width: thin;
  /* Scrollbar más delgado */
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  /* Se mantendrá en la parte superior durante el scroll vertical */
  background-color: white;
  /* Asegura que el fondo no se mezcle con otros elementos */
  z-index: 10;
}

.gruposproductositem {
  position: relative;
  text-align: center;
  /* Centra el contenido */
  min-width: 80px;
  /* Tamaño mínimo del ítem */
  height: 100px;
  /* Altura ajustada */
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  /* Evita que se encojan los items */
}

#gruposproductosimggrupos {
  width: 80px;
  /* Tamaño de la imagen */
  height: 80px;
  border-radius: 50%;
  /* Hacemos la imagen redonda */
  display: block;
  margin: 0 auto;
  /* Centrar la imagen */
  -o-object-fit: cover;
  object-fit: cover;
  /* Para que la imagen siempre ocupe el espacio sin deformarse */
  border: 2px solid #fff;
  /* Borde blanco alrededor de la imagen */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra sutil para hacer que destaque */
}

/* El nombre sobrepuesto en el centro de la imagen */
.gruposproductositem p {
  position: absolute;
  top: 50%;
  /* Centrado vertical */
  left: 50%;
  /* Centrado horizontal */
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  /* Ajusta el centrado completo */
  width: 100%;
  /* Abarca todo el ancho de la imagen */
  text-align: center;
  color: white;
  /* Texto en blanco para que destaque sobre la imagen */
  font-size: 12px;
  /* Tamaño de letra ajustado */
  font-weight: bold;
  /* Letra en negrita */
  background-color: rgba(0, 0, 0, 0.5);
  /* Fondo oscuro semitransparente para mejorar la legibilidad */
  padding: 5px;
  /* Espaciado interno */
  border-radius: 50%;
  /* Bordes redondeados para hacer que coincida con la imagen */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  pointer-events: none;
  /* Evita que interfiera con los clics */
}

.filtrarGrupo {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0;
  /* Ajusta los márgenes y rellenos según sea necesario */
}

.filtrarGrupo ion-icon {
  margin-right: 5px;
  /* Espacio entre el icono del filtro y el texto */
}

.filtrarGrupo button {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 14px;
  /* Ajusta el tamaño de la fuente si es necesario */
  padding: 0;
  margin-left: 5px;
  /* Espacio entre el icono de cerrar y el texto */
}

.contenedorheader {
  position: absolute;
  /* Superpone el div sobre otros elementos */
  top: 0;
  /* Ajusta según la posición deseada */
  left: 0;
  /* Alinea el contenido a la izquierda */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 5px;
  /* Ajusta según sea necesario */
  z-index: 10;
  /* Asegúrate de que se superponga sobre otros elementos */
}

.denominaciones-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Para hacer que los elementos salten a la siguiente línea si no hay espacio */
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  /* Alineación a la izquierda */
  gap: 10px;
  /* Espaciado entre los elementos */
  position: relative;
  /* Para que los elementos hijos se posicionen correctamente */
}

.denominacion-card {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 calc(20% - 10px);
  -ms-flex: 1 1 calc(20% - 10px);
  flex: 1 1 calc(20% - 10px);
  /* Toma el 20% del ancho del contenedor */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 2px;
  /* Espacio entre las filas */
  position: relative;
  /* Necesario para posicionar el botón */
}

.img-monedero {
  width: 100%;
  /* Tamaño fijo para todas las imágenes */
  height: 70px;
  background-color: transparent;
  color: transparent;
  border: 1px solid #ddd;
  /* Añade un borde ligero */
  -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra para estilo más profesional */
  cursor: pointer;
}

.img-monedero-redonda {
  width: 100%;
  /* Tamaño fijo para todas las imágenes */
  height: 70px;
  background-color: transparent;
  color: transparent;
  border-radius: 50%;
  /* Si deseas bordes redondeados */
  border: 1px solid #ddd;
  /* Añade un borde ligero */
  -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra para estilo más profesional */
  cursor: pointer;
}

/* Estilo para ocultar el contenedor cuando no está activo */
.denominaciones-container.hidden {
  display: none;
  /* Oculta el contenedor cuando no está activo */
}

.denominaciones-container.visible {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Muestra el contenedor cuando está activo */
}

.inputPrecio {
  font-size: 1.2em;
}

.error-message {
  color: red;
  font-size: 0.9em;
  margin-top: 5px;
}

.valor-devolver-positivo {
  font-weight: bold;
  /* Texto en negrita para que destaque */
  color: #2a8f00;
  /* Verde más claro y vibrante para valores positivos */
  font-size: 16px;
  /* Aumentar tamaño de fuente */
  margin-top: 5px;
  /* Mayor espacio superior */
  padding: 5px;
  /* Añadir relleno interno para mayor separación del texto */
  border: 1px solid #2a8f00;
  /* Borde verde para mayor énfasis */
  border-radius: 5px;
  /* Bordes redondeados para un look moderno */
  background-color: #e6f4e6;
  /* Fondo verde suave para resaltar más el valor */
  display: inline-block;
  /* Hace que el valor se vea como un bloque separado */
}

.valor-venta-positivo {
  font-weight: bold;
  /* Texto en negrita para que destaque */
  color: #767874;
  /* Verde más claro y vibrante para valores positivos */
  font-size: 16px;
  /* Aumentar tamaño de fuente */
  margin-top: 5px;
  /* Mayor espacio superior */
  padding: 5px;
  /* Añadir relleno interno para mayor separación del texto */
  border: 1px solid #252525;
  /* Borde verde para mayor énfasis */
  border-radius: 5px;
  /* Bordes redondeados para un look moderno */
  background-color: #e6f4e6;
  /* Fondo verde suave para resaltar más el valor */
  display: inline-block;
  /* Hace que el valor se vea como un bloque separado */
}

.valor-devolver-negativo {
  font-weight: bold;
  /* Texto en negrita */
  color: #dc1503;
  /* Rojo brillante para valores negativos */
  font-size: 16px;
  /* Aumentar tamaño de fuente */
  margin-top: 5px;
  /* Mayor espacio superior */
  padding: 5px;
  /* Añadir relleno interno */
  border: 1px solid #dc1503;
  /* Borde rojo para mayor contraste */
  border-radius: 5px;
  /* Bordes redondeados */
  background-color: #fbe8e6;
  /* Fondo rojo suave para mayor énfasis */
  display: inline-block;
  /* Para que el valor sea un bloque visual separado */
}

.horizontal-container-pago {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Activa el modo flexbox */
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  /* Alinea los elementos en una fila */
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  /* Espacio entre los elementos */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinea los elementos verticalmente al centro */
}

.horizontal-container-pago-ion-card {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que los ion-card crezcan y ocupen el espacio disponible */
  margin: 0 10px;
  /* Espacio entre los cards */
}

/* Estilos generales para el grid */
.ionGrd {
  margin-top: 1px;
}

.ionRow {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.ionCol {
  text-align: center;
}

/* Botón Cancelar */
.btn-cancelar {
  background-color: #dc3545;
  /* Rojo más vibrante */
  color: white;
  font-size: 18px;
  font-weight: bold;
  border-radius: 8px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  /* Sombra sutil */
  -webkit-transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
  /* Efecto de transición */
}

.btn-cancelar:hover {
  background-color: #c82333;
  /* Cambia el color al hacer hover */
  -webkit-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
  box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
  /* Aumenta la sombra */
}

.btn-cancelar:disabled {
  background-color: #d3d3d3;
  /* Color gris para el estado deshabilitado */
  color: #888;
}

/* Botón Pagar */
.btn-pagar {
  background-color: #28a745;
  /* Verde llamativo */
  color: white;
  font-size: 18px;
  font-weight: bold;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  -webkit-transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
}

.btn-pagar:hover {
  background-color: #218838;
  -webkit-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
  box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
}

.btn-pagar:disabled {
  background-color: #d3d3d3;
  color: #888;
}

.btn-icon {
  margin-right: 8px;
  /* Añade espacio entre el icono y el texto */
}

/* Badge personalizado para Facturas generadas */
.badge-facturas {
  padding: 4px 6px;
  /* Más espacio interno para un diseño más cómodo */
  background-color: #031527;
  color: white;
  /* Texto blanco para buen contraste */
  font-size: 16px;
  /* Tamaño de letra más grande */
  font-weight: bold;
  /* Texto en negrita para mayor importancia */
  border-radius: 12px;
  /* Bordes redondeados */
  cursor: pointer;
  /* Indica que es clicable */
  position: relative;
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  /* Sombra sutil para elevar el botón */
  -webkit-transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
  /* Transición suave */
  margin-bottom: -2px;
  /* Mantener el ajuste de margen */
}

.badge-facturas-descripcion {
  padding-top: 8px;
  /* Más espacio interno para un diseño más cómodo */
  padding-bottom: 8px;
  background-color: #61670c;
  /* Color de fondo vibrante */
  color: white;
  /* Texto blanco para buen contraste */
  font-size: 16px;
  /* Tamaño de letra más grande */
  font-weight: bold;
  /* Texto en negrita para mayor importancia */
  border-radius: 12px;
  /* Bordes redondeados */
  cursor: pointer;
  /* Indica que es clicable */
  position: relative;
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  /* Sombra sutil para elevar el botón */
  -webkit-transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
  /* Transición suave */
  margin-bottom: -2px;
  /* Mantener el ajuste de margen */
}

.badge-facturas-actualizar-precio {
  padding-top: 2px;
  /* Más espacio interno para un diseño más cómodo */
  margin-top: 6px;
  color: white;
  /* Texto blanco para buen contraste */
  background-color: #082039;
  font-size: 16px;
  /* Tamaño de letra más grande */
  font-weight: bold;
  /* Texto en negrita para mayor importancia */
  border-radius: 12px;
  /* Bordes redondeados */
  cursor: pointer;
  /* Indica que es clicable */
  position: relative;
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  /* Sombra sutil para elevar el botón */
  -webkit-transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
  /* Transición suave */
  margin-bottom: -2px;
  /* Mantener el ajuste de margen */
}

/* Efecto hover para interacción */
.badge-facturas:hover {
  background-color: #123150;
  -webkit-box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
  box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
  /* Sombra más intensa en hover */
}

/* Tooltip */
.badge-facturas[data-toggle="tooltip"]::after {
  content: attr(title);
  /* Muestra el texto del tooltip */
  position: absolute;
  bottom: 125%;
  /* Ajusta la posición del tooltip */
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.8);
  /* Fondo del tooltip */
  color: white;
  padding: 5px;
  border-radius: 5px;
  font-size: 12px;
  white-space: nowrap;
  opacity: 0;
  /* Oculto por defecto */
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  /* Transición suave */
  pointer-events: none;
  /* No bloquea el click */
}

.badge-facturas:hover[data-toggle="tooltip"]::after {
  opacity: 1;
  /* Muestra el tooltip en hover */
}

/* Efecto de clic activo */
.badge-facturas:active {
  -webkit-transform: scale(0.98);
  transform: scale(0.98);
  /* Efecto de presionar ligeramente */
}

/* Contenedor que mantiene los botones fijos en el lado derecho y alineados verticalmente */
.fixed-buttons-container {
  position: fixed;
  /* Fijo para que siempre esté visible */
  left: 20px;
  /* Posiciona el contenedor a la derecha */
  top: 0%;
  /* Se coloca un poco abajo desde el top */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Alinea los elementos verticalmente */
  gap: 1px;
  /* Espacio entre botones */
  z-index: 1000;
  /* Asegura que esté por encima del contenido principal */
}

/* Estilo del botón buscar cliente */
.fixed-buttons-container ion-badge {
  padding: 2px 3px;
  font-size: 14px;
  border-radius: 8px;
  background-color: #0d3b6c;
  /* Color primario */
  color: white;
  border: none;
  cursor: pointer;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

/* Hover para el botón */
.fixed-buttons-container ion-badge:hover {
  background-color: #0056b3;
  /* Color más oscuro al pasar el mouse */
}

/* Contenedor que mantiene los botones fijos, alineados horizontalmente, y comienza al 33% de la pantalla tanto en altura como en la posición horizontal */
.fixed-buttons-horizontal {
  position: fixed;
  /* Fijo para que siempre esté visible */
  left: 5vw;
  top: 0;
  /* Comienza después del 33% de la pantalla en altura */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  /* Alinea los elementos horizontalmente */
  gap: 15px;
  /* Espacio entre los botones y el badge */
  z-index: 10;
  /* Ajusta el z-index para que no bloquee otros elementos debajo */
}

/* Estilo del botón "Buscar Cliente" */
.fixed-buttons-horizontal button {
  padding: 10px 15px;
  font-size: 14px;
  border-radius: 8px;
  background-color: #007bff;
  /* Azul primario */
  color: white;
  border: none;
  cursor: pointer;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

/* Hover para el botón */
.fixed-buttons-horizontal button:hover {
  background-color: #0056b3;
  /* Azul más oscuro al pasar el mouse */
}

/* Estilo para el botón "Crear Cliente" y "Simulador" (Badges) */
.badge-crear-cliente, .badge-simulador {
  padding: 8px 14px;
  background-color: #082544;
  /* Verde oscuro */
  color: white;
  border-radius: 12px;
  cursor: pointer;
  -webkit-transition: background-color 0.3s, -webkit-transform 0.2s;
  transition: background-color 0.3s, -webkit-transform 0.2s;
  transition: background-color 0.3s, transform 0.2s;
  transition: background-color 0.3s, transform 0.2s, -webkit-transform 0.2s;
  font-size: 14px;
  display: inline-block;
  margin-right: 10px;
  /* Espacio entre badges */
  border: none;
  /* Asegúrate de que no haya borde */
  -webkit-box-shadow: none;
  box-shadow: none;
  /* Elimina cualquier sombra */
}

/* Hover para badges */
.badge-crear-cliente:hover, .badge-simulador:hover {
  background-color: #082544;
  /* Verde más oscuro al pasar el mouse */
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Efecto de zoom */
}

/* Estilo solo para el botón "Guardar turno" */
.guardar-turno-btn {
  padding: 10px 20px;
  font-size: 16px;
  border-radius: 8px;
  background-color: #d5680e;
  /* Naranja */
  color: white;
  border: none;
  cursor: pointer;
  -webkit-transition: background-color 0.3s, -webkit-transform 0.2s;
  transition: background-color 0.3s, -webkit-transform 0.2s;
  transition: background-color 0.3s, transform 0.2s;
  transition: background-color 0.3s, transform 0.2s, -webkit-transform 0.2s;
  display: block;
  margin-top: 1px;
  -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
}

/* Hover para el botón "Guardar turno" */
.guardar-turno-btn:hover {
  background-color: #bf5a0d;
  /* Naranja más oscuro al pasar el mouse */
  -webkit-transform: translateY(-2px);
  transform: translateY(-2px);
  /* Efecto de elevación */
}

/* Estilo solo para el botón "Buscar Cliente" */
.buscar-cliente-btn {
  padding: 10px 20px;
  font-size: 16px;
  border-radius: 8px;
  background-color: #082544;
  /* Azul primario */
  color: white;
  border: none;
  cursor: pointer;
  -webkit-transition: background-color 0.3s, -webkit-transform 0.2s;
  transition: background-color 0.3s, -webkit-transform 0.2s;
  transition: background-color 0.3s, transform 0.2s;
  transition: background-color 0.3s, transform 0.2s, -webkit-transform 0.2s;
  display: inline-block;
  margin-top: 1px;
  -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
}

/* Hover para el botón "Buscar Cliente" */
.buscar-cliente-btn:hover {
  background-color: #0056b3;
  /* Azul más oscuro al pasar el mouse */
  -webkit-transform: translateY(-2px);
  transform: translateY(-2px);
  /* Efecto de elevación */
}

@media (max-width: 480px) {
  .denominacion-card {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 calc(100% - 10px);
    -ms-flex: 1 1 calc(100% - 10px);
    flex: 1 1 calc(100% - 10px);
    /* Ocupa el 100% del ancho en pantallas muy pequeñas */
  }
}

/* Media query para pantallas pequeñas */
@media (max-width: 768px) {
  .denominacion-card {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 calc(50% - 10px);
    -ms-flex: 1 1 calc(50% - 10px);
    flex: 1 1 calc(50% - 10px);
    /* Ajuste para pantallas pequeñas */
  }
  .div-38-cajavertical {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 98%;
    -ms-flex: 0 0 98%;
    flex: 0 0 98%;
    /* Cambiar a 45% en pantallas pequeñas */
  }
  .div-34-cajavertical {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 98%;
    -ms-flex: 0 0 98%;
    flex: 0 0 98%;
    /* Cambiar a 45% en pantallas pequeñas */
  }
  .div-rest-cajavertical {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 98%;
    -ms-flex: 0 0 98%;
    flex: 0 0 98%;
    /* Ocupa el resto del espacio disponible */
  }
}

ion-progress-bar {
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  --background: #e0e0e0;
  /* Color de fondo de la barra */
  --progress-background: #4caf50;
  /* Color del progreso (verde) */
  --progress-background: #4caf50;
  height: 20px;
  /* Ajusta la altura según tus necesidades */
}

.progress-container {
  width: 100%;
}

.custom-progress {
  background-color: #4caf50;
  /* Color del progreso */
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  /* Animación suave */
  height: 20px;
  /* Altura de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra sutil */
}

.mensaje-producto {
  font-size: 1.9rem;
  /* Tamaño de letra grande */
  font-weight: bold;
  /* Letra gruesa */
  color: #333;
  /* Color oscuro para mejor legibilidad */
  background-color: #f8f8f8;
  /* Fondo claro para destacar el texto */
  padding: 20px;
  /* Espaciado alrededor del texto */
  border-radius: 8px;
  /* Bordes redondeados */
  text-align: center;
  /* Centrar el texto */
  -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra para darle un toque elegante */
  margin: 20px 0;
  /* Separación del resto del contenido */
}

.collapse-button {
  position: absolute;
  right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 12px;
  /* Ajusta el tamaño para hacerlo pequeño */
  padding: 0;
  /* Sin relleno adicional */
  background: none;
  /* Elimina fondo del botón para que sea más discreto */
}

.collapse-button ion-icon {
  font-size: 14px;
  /* Tamaño del ícono ajustado */
}

.full-height-grid {
  padding: 0;
  /* Elimina el padding adicional */
}

.optimized-row {
  height: auto;
  /* Se ajusta al contenido */
  margin: 0;
  /* Elimina márgenes */
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  /* Asegura que las columnas se estiren para llenar el espacio vertical */
}

.optimized-row ion-col {
  padding: 2px;
  /* Ajusta el espaciado dentro de cada columna */
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Hace que cada columna ocupe el mismo espacio */
}

ion-infinite-scroll-content {
  min-height: 1px;
  /* Ajusta según sea necesario */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.producto-card-select {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0px;
  border: 1px solid #ddd;
  border-radius: 10px;
  background-color: #eee6e6;
  margin: 2px;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permitir que los elementos se bajen si no hay suficiente espacio */
}

.producto-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 10px;
}

.price-badge-caja {
  position: relative;
  top: 0px;
  /* Ajusta según sea necesario */
  left: 10px;
  /* Ajusta según sea necesario */
  z-index: 10;
  margin-right: 10px;
}

.price-badge-caja-rapido {
  position: relative;
  top: 10px;
  /* Ajusta según sea necesario */
  left: 10px;
  /* Ajusta según sea necesario */
  z-index: 10;
  margin-right: 10px;
}

.price-badge-caja-rapido-sincodigodebarra {
  position: absolute;
  top: 10px;
  /* Ajusta según sea necesario */
  right: 0;
  left: 10px;
  /* Ajusta según sea necesario */
  z-index: 10;
  margin-right: 10px;
}

.spanselect {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permitir que los botones se bajen si no hay suficiente espacio */
}

.numero_cantidad, .numero_total_precio {
  margin-left: 5px;
}

.producto-imagenselect {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 10px;
}

.collapse-div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 10px;
}

.icon-col {
  font-size: 24px;
}

.forma-pago-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permite que los elementos se envuelvan si no caben en una fila */
  gap: 7px;
  /* Espacio entre los chips */
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  /* Alinea los chips a la izquierda */
  padding: 15px 0;
  /* Espaciado interno */
}

.forma-pago-chip {
  background-color: #ffffff;
  /* Fondo blanco */
  color: #333;
  /* Color de texto */
  border-radius: 20px;
  /* Bordes redondeados */
  font-size: 14px;
  /* Tamaño de fuente */
  padding: 5px 10px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra para profundidad */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Display flex para alinear imagen y texto */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
  white-space: nowrap;
  /* Evita que el texto se divida en múltiples líneas */
  min-width: 80px;
  /* Ancho mínimo para los chips */
  max-width: 100%;
  /* Ancho máximo opcional para los chips */
  line-height: normal;
}

.forma-pago-imagen {
  width: 30px;
  /* Tamaño de la imagen */
  height: 30px;
  border-radius: 50%;
  /* Redondear la imagen */
  margin-right: 2px;
  /* Espacio entre la imagen y el texto */
}

.forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.forma-pago-nombre {
  font-weight: bold;
  /* Nombre en negrita */
  font-size: 15px;
  /* Tamaño de fuente más grande */
}

.forma-pago-detalles {
  font-size: 13px;
  /* Tamaño de fuente para detalles */
  color: #666;
  /* Color de texto gris */
}

.custom-select-item {
  --background: #f7f7f7;
  --border-radius: 8px;
  --padding-start: 16px;
  --padding-end: 16px;
  margin-bottom: 12px;
  border: 1px solid #e0e0e0;
}

.custom-select {
  --placeholder-color: #999;
  --color: #333;
  --padding-start: 0;
  --padding-end: 0;
  --height: 44px;
  --border-radius: 8px;
  --background: #fff;
  --padding: 8px 12px;
  --box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  font-size: 16px;
  color: #333;
}

.custom-select-item ion-label {
  color: #666;
  font-weight: bold;
  font-size: 14px;
}

.custom-select-item ion-select {
  --background-activated: #e6f7ff;
  --border-color: #007bff;
}

ion-select::part(text) {
  font-weight: bold;
  color: #007bff;
}

.custom-select ion-select-option {
  --ion-text-color: #333;
  font-size: 14px;
  padding: 8px 16px;
}

@media (min-width: 768px) {
  .ion-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

/* Estilo para pantallas pequeñas */
@media (max-width: 767px) {
  .ion-item {
    display: block;
  }
}

@media (max-width: 768px) {
  .forma-pago-chip {
    font-size: 12px;
    /* Reducir el tamaño de fuente en pantallas más pequeñas */
    padding: 3px 8px;
    /* Ajustar el espaciado interno */
    min-width: 70px;
    /* Ajustar el ancho mínimo en pantallas más pequeñas */
    max-width: 130px;
    /* Ajustar el ancho máximo en pantallas más pequeñas */
    line-height: normal;
  }
  .forma-pago-imagen {
    width: 20px;
    /* Reducir el tamaño de la imagen en pantallas más pequeñas */
    height: 20px;
  }
  .forma-pago-info {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    /* Cambiar la dirección de flexión a fila en pantallas más pequeñas */
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    /* Centrar verticalmente */
  }
  .forma-pago-nombre {
    font-size: 10px;
    /* Reducir el tamaño de fuente en pantallas más pequeñas */
    margin-bottom: 4px;
  }
  .forma-pago-detalles {
    font-size: 9px;
    /* Reducir el tamaño de fuente para detalles */
  }
}

.productos-contador-crear-rapido {
  position: relative;
  /* Cambiado a absolute para que flote */
  top: 5px;
  right: 1px;
  z-index: 1000;
  background-color: transparent;
  color: #fff;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 12px;
  /* Ajusta el tamaño de la fuente para que no ocupe mucho espacio */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.productos-contador-crear-rapido-codigobarra {
  position: relative;
  /* Cambiado a absolute para que flote */
  top: 10px;
  left: 15px;
  z-index: 1000;
  background-color: transparent;
  color: #fff;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 12px;
  /* Ajusta el tamaño de la fuente para que no ocupe mucho espacio */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.price-badge-caja-rapido-crear-producto {
  position: relative;
  top: 10px;
  /* Ajusta según sea necesario */
  left: 5px;
  /* Ajusta según sea necesario */
  z-index: 10;
  margin-right: 10px;
  margin-left: 8px;
  font-size: 24px;
}

.custom-infinite-scroll {
  position: absolute;
  /* Se posiciona dentro de su contenedor */
  bottom: 0;
  /* Lo coloca en la parte inferior */
  left: 0;
  width: 100%;
  /* O ajusta el ancho según lo necesites */
  z-index: -1;
  /* Lo envía detrás de otros elementos */
  opacity: 0;
  /* Lo oculta visualmente */
}

.custom-infinite-scroll .infinite-loading {
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  /* Alinea el spinner a la derecha */
  -webkit-transform: scale(0.4);
  transform: scale(0.4);
  /* Reduce el tamaño del spinner */
  width: 15px !important;
  /* Ajusta el ancho */
  height: 15px !important;
  /* Ajusta la altura */
  position: absolute;
  /* Se posiciona dentro del contenedor padre */
  bottom: 0;
  /* Lo coloca en la parte inferior */
  left: 0;
  z-index: -1;
  /* Lo coloca detrás de otros elementos */
  opacity: 0;
  /* Lo oculta visualmente */
}

.mensaje-producto-sin-info {
  color: #555;
  font-size: 16px;
  text-align: center;
  margin-top: 20px;
  background: #f8f9fa;
  padding: 10px;
  border-radius: 8px;
}

.price-badge-caja-vertical-config {
  position: relative;
  top: 10px;
  /* Ajusta según sea necesario */
  right: 10px;
  /* Pegado a la derecha */
  z-index: 9999;
  /* Asegura que esté encima */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.1);
  /* Fondo ligero */
  padding: 10px;
  /* Área de clic más grande */
  border-radius: 50%;
  /* Forma circular */
  cursor: pointer;
  pointer-events: auto;
  /* Asegura que se pueda hacer clic */
}

.icono-configuracion-vertical-config {
  font-size: 20px;
  color: #333;
}

/* Evitar que el click se propague al padre */
.price-badge-caja-vertical-config ion-icon {
  pointer-events: auto;
}

.price-badge-caja-vertical-config-dinamico {
  position: relative;
  top: 10px;
  /* Ajusta según sea necesario */
  right: 3px;
  /* Pegado a la derecha */
  z-index: 9999;
  /* Asegura que esté encima */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #b29898;
  /* Fondo ligero */
  padding: 10px;
  /* Área de clic más grande */
  border-radius: 50%;
  /* Forma circular */
  cursor: pointer;
  pointer-events: auto;
  /* Asegura que se pueda hacer clic */
}

.icono-configuracion-vertical-config-dinamico {
  font-size: 20px;
  color: #806767;
}

/* Evitar que el click se propague al padre */
.price-badge-caja-vertical-config-dinamico ion-icon {
  pointer-events: auto;
}

.add-button {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 20%;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  /* Ocupa el 20% del contenedor */
  top: 10px;
  /* Ajusta según sea necesario */
  right: 3px;
  /* Pegado a la derecha */
  z-index: 9999;
  /* Asegura que esté encima */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0;
  background: none;
  border: none;
}

.add-button .img {
  width: 20px;
  height: 20px;
}

.nombre-producto-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.boton-actualizar {
  height: 36px;
  font-size: 14px;
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.nombre-producto-input {
  border: 2px solid transparent;
  background-color: #f0f8ff;
  color: #d9534f;
  font-weight: bold;
  padding: 4px 8px;
  border-radius: 4px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  font-size: 16px;
}

/* Botón más compacto */
.boton-actualizar {
  height: 32px;
  width: 32px;
  min-width: unset;
  /* Evita que se expanda innecesariamente */
  padding: 2px;
  font-size: 16px;
  border-radius: 50%;
  /* Lo hace más pequeño y redondo */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.nombre-producto-input,
.nombre-producto-container ion-input,
ion-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 120px;
  font-size: 14px;
}

.boton-actualizar {
  height: 36px;
  font-size: 14px;
}

.novedad {
  font-size: 14px;
  padding: 6px 10px;
  background-color: #3880ff;
  color: white;
  border-radius: 5px;
  border: none;
  margin-top: 5px;
}

.spanselect {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 5px;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 10px;
}

ion-badge {
  font-size: 13px;
}

ion-input::part(native) {
  font-size: 14px;
}

.producto-imagenselect img {
  max-width: 100px;
  height: auto;
}

.collapse-div {
  text-align: center;
  margin-top: 10px;
  cursor: pointer;
}

.nombre-producto-input {
  border: 2px solid transparent;
  background-color: #f0f8ff;
  color: #d9534f;
  font-weight: bold;
  padding: 2px;
  border-radius: 2px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  width: 100%;
  /* 🔥 Esto es clave */
  display: block;
  /* Asegura que se comporte como bloque */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* Incluye padding y border en el 100% */
}

/* Cambia el color del borde y el fondo cuando el usuario hace clic */
.nombre-producto-input:focus {
  border: 2px solid #007bff;
  /* Azul más fuerte al hacer clic */
  background-color: #e3f2fd;
  /* Fondo más claro */
  outline: none;
}

/* Placeholder en color llamativo */
.nombre-producto-input::-webkit-input-placeholder {
  color: #ff5722;
  /* Naranja */
  font-style: italic;
  opacity: 0.8;
}
.nombre-producto-input::-moz-placeholder {
  color: #ff5722;
  /* Naranja */
  font-style: italic;
  opacity: 0.8;
}
.nombre-producto-input::-ms-input-placeholder {
  color: #ff5722;
  /* Naranja */
  font-style: italic;
  opacity: 0.8;
}
.nombre-producto-input::placeholder {
  color: #ff5722;
  /* Naranja */
  font-style: italic;
  opacity: 0.8;
}

.add-button-sincodigodebarras {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 20%;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  /* Ocupa el 20% del contenedor */
  top: 10px;
  /* Ajusta según sea necesario */
  right: 3px;
  /* Pegado a la derecha */
  z-index: 9999;
  /* Asegura que esté encima */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0;
  background: none;
  border: none;
}

.add-button-sincodigodebarras .img {
  width: 40px;
  height: 40px;
}

.fab-small {
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
  opacity: 0.7;
  background: rgba(0, 0, 0, 0.6);
}

@media screen and (max-width: 480px) {
  .nombre-producto-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
  }
  .boton-actualizar {
    width: 100%;
  }
  .nombre-producto-input {
    font-size: 18px;
  }
}

.config-button-v {
  position: fixed;
  top: 40px;
  right: 10px;
  z-index: 9999;
}

.menu-opciones {
  position: fixed;
  top: 60px;
  right: 10px;
  z-index: 9998;
  background: white;
  padding: 10px;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  max-width: 90vw;
  max-height: 70vh;
  overflow-y: auto;
}

@media screen and (max-width: 768px) {
  .menu-opciones {
    width: 90vw;
    right: 5vw;
    top: 60px;
  }
}

.contenedor-turnos {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permite que se bajen si no caben */
  gap: 6px;
  /* Espacio entre botones */
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  /* Puedes usar center si prefieres */
  padding: 10px 0;
}

.boton-turno {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 60px;
  padding: 4px 6px;
  font-size: 12px;
  border-radius: 12px;
}

.turno-id {
  font-weight: bold;
  font-size: 14px;
}

.cliente-nombre {
  font-size: 10px;
  color: #f5f5f5;
  opacity: 0.9;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.task-groups-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  /* Evita que las tarjetas salten a la siguiente línea */
  overflow-x: auto;
  /* Permite desplazamiento horizontal si hay muchas tarjetas */
}

.task-groups-container-horizontal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100vh;
  /* Ocupa toda la altura de la pantalla */
  overflow-y: hidden;
  /* Evita scroll vertical dentro del contenedor */
  overflow-x: auto;
  /* Permite scroll horizontal si hay demasiados grupos */
  white-space: nowrap;
  /* Evita que los componentes salten a una nueva línea */
}

.task-group-horizontal {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Distribuye el espacio entre todos los elementos */
  max-width: 300px;
  /* Ancho mínimo para cada tarjeta */
  margin-right: 20px;
  /* Espacio entre las tarjetas */
}

.card-horizontal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  height: 100%;
  /* Asegura que las tarjetas llenen su contenedor */
  border: 1px solid #ccc;
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  padding: 16px;
}

.task-group-header-horizontal {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.chat-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition: margin-left 0.3s ease;
  transition: margin-left 0.3s ease;
}

.side-menu {
  width: 250px;
  /* Ancho del menú lateral */
  background-color: #f8f8f8;
  /* Color de fondo del menú */
  position: absolute;
  /* Posicionamiento absoluto */
  left: -250px;
  /* Oculta el menú fuera de la vista */
  top: 0;
  bottom: 0;
  -webkit-transition: left 0.3s ease;
  transition: left 0.3s ease;
  /* Transición suave */
  z-index: 10;
  /* Asegúrate de que el menú esté por encima del contenido */
}

.side-menu.open {
  left: 0;
  /* Muestra el menú */
}

.chat-container.menu-open {
  margin-left: 250px;
  /* Desplaza el contenido principal cuando el menú está abierto */
}

page-callcenter {
  /* Eliminar márgenes y paddings predeterminados */
  /* Personaliza otros elementos como quieras */
  /* Cada columna por compañía */
  /* Estilos de las tarjetas de tareas */
  /* Barra de progreso */
  /* Título de la columna */
  /* Grupo de tareas (nombre de la compañía) */
  /* Lista de tareas */
  /* Cada tarea individual */
  /* Detalles de la tarea */
  /* Barra de progreso */
}

page-callcenter :host {
  --ion-background-color: #ffffff;
  /* Cambia el color de fondo a blanco */
  --ion-color-primary: transparent;
  /* Elimina el color primario de Ionic */
  --ion-color-secondary: transparent;
  /* Elimina el color secundario de Ionic */
}

page-callcenter ion-content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que el contenido principal ocupe el espacio disponible */
}

page-callcenter ion-header, page-callcenter ion-content, page-callcenter ion-footer {
  margin: 0;
  padding: 0;
  background: none;
  /* Eliminar fondo predeterminado */
}

page-callcenter .chat-container {
  height: 100%;
  /* Asegura que el contenedor ocupe toda la altura */
  overflow: hidden;
  /* Evita el overflow en el contenedor principal */
}

page-callcenter .chat-container .side-menu {
  height: 100%;
  overflow-y: auto;
  /* Permite el scroll vertical */
  padding: 16px;
  background-color: #f8f9fa;
  /* Color de fondo del menú */
  border-right: 1px solid #dee2e6;
  /* Línea divisoria a la derecha */
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  /* Animación para abrir/cerrar el menú */
}

page-callcenter .chat-container .side-menu.open {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  /* Muestra el menú */
}

page-callcenter .chat-container::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(25, 25, 114, 0.603);
}

page-callcenter .chat-container::-webkit-scrollbar {
  width: 8px;
  /* Ancho del scrollbar */
}

page-callcenter .chat-container::-webkit-scrollbar-track {
  background: #1a4775;
  /* Color de fondo del track del scrollbar */
  border-radius: 4px;
  /* Esquinas redondeadas */
}

page-callcenter .chat-container::-webkit-scrollbar-thumb {
  background: #007bff;
  /* Color del thumb del scrollbar */
  border-radius: 10px;
  /* Esquinas redondeadas */
}

page-callcenter .chat-container::-webkit-scrollbar-thumb:hover {
  background: #0056b3;
  /* Color del thumb en hover */
}

page-callcenter .chat-messages {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Para ocupar el espacio disponible */
  padding: 10px;
  overflow-y: auto;
  /* Permite desplazamiento vertical */
}

page-callcenter .chat-input {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 10px;
}

page-callcenter .chat-input input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Ocupa todo el ancho disponible */
  border: 1px solid #ccc;
  /* Agrega un borde al input */
  border-radius: 5px;
  /* Bordes redondeados */
  padding: 10px;
  margin-right: 10px;
  /* Espacio entre el input y el botón */
}

page-callcenter .chat-input button {
  background-color: #353d45;
  /* Color del botón */
  color: white;
  /* Color del texto del botón */
}

page-callcenter .container-grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

page-callcenter .container-grid .list {
  width: 45%;
}

page-callcenter .container-grid .list .card {
  background-color: #f1f1f1;
  border: 1px solid #ccc;
  padding: 15px;
  margin-bottom: 10px;
  cursor: pointer;
}

page-callcenter .container-grid .dropzone {
  width: 45%;
  height: 200px;
  background-color: #f9f9f9;
  border: 2px dashed #ccc;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: #888;
  font-size: 18px;
}

page-callcenter .task-board {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 10px;
}

page-callcenter .company-column {
  width: 30%;
  /* Ajusta según cuántas columnas quieras mostrar */
  padding: 10px;
  background-color: #f4f4f4;
  border-radius: 8px;
}

page-callcenter .task-card ion-card {
  margin-bottom: 15px;
  background-color: white;
  border: 1px solid #ddd;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  -webkit-transition: -webkit-transform 0.2s ease-in-out;
  transition: -webkit-transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
}

page-callcenter .task-card ion-card:hover {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}

page-callcenter .progress-bar-container {
  background-color: #e0e0e0;
  border-radius: 4px;
  overflow: hidden;
  margin-top: 10px;
}

page-callcenter .progress-bar {
  height: 10px;
  background-color: #4caf50;
  /* Verde para progreso completado */
  -webkit-transition: width 0.3s ease-in-out;
  transition: width 0.3s ease-in-out;
}

page-callcenter .company-column h3 {
  text-align: center;
  font-weight: bold;
  background-color: #134165;
  color: white;
  padding: 10px;
  border-radius: 4px 4px 0 0;
}

page-callcenter .task-group {
  margin-bottom: 4px;
  border-bottom: 1px solid #ccc;
}

page-callcenter .task-group-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
  font-size: medium;
  padding: 0px;
  background-color: #484848;
  /* Color de fondo del header del grupo */
  color: white;
  /* Color del texto */
  border-radius: 5px;
  /* Esquinas redondeadas */
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

page-callcenter .task-group-header .group-image {
  width: 40px;
  /* Ancho de la imagen */
  height: 40px;
  /* Alto de la imagen */
  border-radius: 50%;
  /* Esquinas redondeadas (opcional) */
  margin-right: 10px;
  /* Espaciado entre la imagen y el texto */
}

page-callcenter .task-group-header .group-description {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Asegura que el texto ocupe el espacio disponible */
  font-size: 13px;
  font-weight: 400;
}

page-callcenter .task-group-header .group-quantity {
  font-size: 14px;
  /* Tamaño del texto de la cantidad */
  background-color: rgba(53, 14, 125, 0.3);
  /* Fondo semitransparente para resaltar */
  color: #fbfffb;
  border-radius: 5px;
  /* Esquinas redondeadas */
  padding: 5px 10px;
  /* Espaciado interno */
  margin-left: 10px;
  /* Espaciado a la izquierda */
}

page-callcenter .task-list {
  padding: 1px 2px;
}

page-callcenter .task-item {
  padding: 1px;
  border-bottom: 1px solid #eaeaea;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-callcenter .task-item:hover {
  background-color: #f0f0f0;
}

page-callcenter .task-details {
  background-color: #f9f9f9;
  /* Fondo claro para el contenedor */
  padding: 1px;
  border-radius: 8px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
  margin-bottom: 15px;
}

page-callcenter .task-details-recorrido {
  background-color: #f9f9f9;
  /* Fondo claro para el contenedor */
  border-radius: 8px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
  padding: 0px;
  /* Espacio interno */
  max-width: 300px;
  /* Establece un ancho máximo */
  font-size: 14px;
  /* Ajusta el tamaño de la fuente */
  overflow-wrap: break-word;
  /* Evita que el texto se salga */
  margin-bottom: 0px;
  /* Agrega margen inferior */
}

page-callcenter .task-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 0px;
  cursor: pointer;
}

page-callcenter .task-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  /* Hace que el contenedor sea circular */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  color: white;
  /* Texto blanco para contrastar con el fondo */
  margin-right: 10px;
  /* Espacio entre el avatar y el texto */
  text-transform: uppercase;
  /* Para que las iniciales siempre estén en mayúsculas */
}

page-callcenter .task-avatar-recorrido {
  width: 40px;
  border-radius: 50%;
  /* Hace que el contenedor sea circular */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  color: white;
  /* Texto blanco para contrastar con el fondo */
  margin-right: 4px;
  /* Espacio entre el avatar y el texto */
  text-transform: uppercase;
  /* Para que las iniciales siempre estén en mayúsculas */
}

page-callcenter .task-time {
  background-color: #3e3d3d;
  /* Fondo gris oscuro */
  color: white;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  display: inline-block;
}

page-callcenter .task-date {
  color: #888;
}

page-callcenter .progress-bar-container {
  background-color: #e0e0e0;
  /* Fondo gris claro para el contenedor de la barra de progreso */
  border-radius: 6px;
  position: relative;
  height: 20px;
  overflow: hidden;
}

page-callcenter .progress-bar {
  background-color: #28a745;
  /* Verde corporativo para la barra de progreso */
  height: 100%;
  border-radius: 6px 0 0 6px;
  /* Redondeado en la izquierda */
  -webkit-transition: width 0.4s ease;
  transition: width 0.4s ease;
}

page-callcenter .progress-text {
  position: absolute;
  right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 14px;
  font-weight: 500;
  color: #333;
}

page-callcenter ion-buttons {
  position: absolute;
  top: 0;
  right: 0;
}

.chat-container::-webkit-scrollbar {
  width: 2px;
  border-radius: 10px;
  opacity: 0.5;
  background-color: rgba(25, 25, 114, 0.603);
}

::-webkit-scrollbar {
  width: 5px;
  border-radius: 10px;
  opacity: 0.5;
  background-color: rgba(119, 123, 116, 0.603);
  cursor: pointer;
}

.board-container-trello {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  /* Para que las tarjetas estén en una sola línea y se haga scroll horizontal */
  overflow-x: auto;
  /* Scroll horizontal en todo el board */
  height: 100%;
  /* Ocupa todo el alto de la pantalla */
  padding: 10px;
}

.task-group-trello {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 300px;
  -ms-flex: 0 0 300px;
  flex: 0 0 300px;
  /* Cada tarjeta tiene un ancho fijo de 300px */
  margin-right: 15px;
  /* Espaciado entre las tarjetas */
  background-color: white;
  border-radius: 8px;
  -webkit-box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  max-height: 100%;
  overflow-y: auto;
  /* Scroll vertical dentro de cada tarjeta */
}

.card-trello {
  padding: 16px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  height: 100%;
  /* Cada tarjeta ocupará todo el espacio vertical disponible */
}

.task-group-header-trello {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #f1f3f4;
  padding: 10px;
  border-bottom: 1px solid #ccc;
  border-radius: 8px 8px 0 0;
}

.group-image-trello {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

.group-description-trello {
  font-size: 16px;
  font-weight: bold;
}

.group-quantity-trello {
  font-size: 14px;
}

.icon-margin-trello {
  margin-left: 10px;
}

.task-list-trello {
  margin-top: 10px;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* Las tareas ocuparán el espacio restante en la tarjeta */
}

.progress-bar-container-trello {
  background-color: #f3f3f3;
  border-radius: 5px;
  overflow: hidden;
  margin-top: 5px;
}

.progress-bar-trello {
  background-color: #4caf50;
  height: 10px;
  border-radius: 5px;
}

.progress-text-trello {
  margin-left: 5px;
}

/* Scrollbar customization for vertical scroll in each card */
.task-group::-webkit-scrollbar-trello {
  width: 8px;
}

.task-group::-webkit-scrollbar-thumb-trello {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
}

.board-container::-webkit-scrollbar-trello {
  height: 10px;
}

.board-container::-webkit-scrollbar-thumb-trello {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
}

main#container-tasks {
  background-color: transparent;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100vh;
  /* Ocupa toda la altura de la pantalla */
  overflow-y: hidden;
  /* Evita scroll vertical dentro del contenedor */
  overflow-x: auto;
  /* Permite scroll horizontal si hay demasiados grupos */
  white-space: nowrap;
  /* Evita que los componentes salten a una nueva línea */
}

.container-tasks {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

main#container-tasks > div.container-card {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

main#container-tasks > div.container-card > div.card {
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  width: 272px;
  background-color: #EBECF0;
  margin-left: 8px;
  border-radius: 4px;
  padding: 0 10px 10px 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100vh;
  /* Ocupa toda la altura de la pantalla */
  overflow-x: hidden;
  /* Evita scroll horizontal dentro del contenedor */
  overflow-y: auto;
  /* Permite scroll vertical si hay demasiados grupos */
  white-space: nowrap;
  /* Evita que los componentes salten a una nueva línea */
}

main#container-tasks > div.container-card > div.first-task {
  background-color: #717373;
  /* Color de fondo diferente para la primera tarea */
  border: 2px solid #585b5c;
  /* Borde específico */
  position: fixed;
  top: 0;
  left: 0;
  width: 272px;
  /* Asegúrate de que el ancho sea el mismo que el de las tarjetas */
  z-index: 10000;
}

main#container-tasks > div.container-card > div.card > div.header-recorrido {
  background-color: #1c175b;
  /* Color gris claro para un look moderno */
  color: white;
  padding: 15px;
  /* Aumentar el padding para un mejor espaciado */
  border-radius: 8px 8px 0 0;
  /* Bordes redondeados en la parte superior */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  font-weight: 300;
  font-size: 15px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
  -webkit-transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, -webkit-box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s;
  transition: background-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s;
  /* Transiciones suaves */
}

main#container-tasks > div.container-card > div.card > div.content-recorrido {
  background-color: #ffffff;
  /* Fondo blanco para un look limpio */
  padding: 15px;
  /* Espaciado interno para el contenido */
  border-radius: 8px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
  margin: 10px 0;
  /* Margen vertical para separar las secciones */
  -webkit-transition: -webkit-box-shadow 0.3s;
  transition: -webkit-box-shadow 0.3s;
  transition: box-shadow 0.3s;
  transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
  /* Transición suave para sombra */
  min-height: 100px;
  /* Asegura que el contenedor sea lo suficientemente grande */
  border: 1px dashed #ccc;
  /* Estilo para visualizar el área de drop */
}

main#container-tasks .fieldcard p.recibo-texto {
  white-space: pre-wrap !important;
  font-family: monospace;
  font-size: 14px;
  text-align: left;
  background: #f8f8f8;
  padding: 10px;
  border-radius: 5px;
}

p.recibo-texto {
  white-space: pre-wrap !important;
  font-family: monospace;
  font-size: 14px;
  text-align: left;
  background: #f8f8f8;
  padding: 10px;
  border-radius: 5px;
}

main#container-tasks > div.container-card > div.card > div.header :hover {
  opacity: 1;
  cursor: pointer;
}

main#container-tasks > div.container-card > div.card > div.header > input {
  width: 100%;
  padding: 8px;
  border: 1px solid #ccc;
  border-radius: 4px;
  color: #333;
  font-size: 14px;
  background-color: #fff;
}

main#container-tasks > div.container-card > div.card > div.header > input:focus {
  outline: none;
  border-color: #007bff;
  /* Color de borde al enfocarse */
  -webkit-box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
  box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
}

main#container-tasks > div.container-card > div.card > div.header > i {
  font-size: 12px;
  opacity: 0.6;
}

main#container-tasks > div.container-card > div.card > div.content > div.task {
  background-color: white;
  color: black;
  border-radius: 2px;
  padding: 2px;
  width: 256px;
  height: 32px;
  font-size: 0.8rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 6px;
  margin-top: 4px;
}

main#container-tasks > div.container-card > div.card > div.content > div.task > p {
  margin: 8px 0;
  padding: 10px;
  width: 100%;
  color: gray;
  font-size: 15px;
  font-weight: 500;
  background-color: transparent;
  border-radius: 4px;
  cursor: -webkit-grab;
  cursor: grab;
  overflow: hidden;
  /* Oculta el texto que excede el tamaño del contenedor */
  text-overflow: ellipsis;
  /* Añade puntos suspensivos cuando el texto es muy largo */
  white-space: nowrap;
  /* Evita que el texto haga salto de línea */
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  /* Transición suave al hacer hover */
}

main#container-tasks > div.container-card > div.card > div.content-recorrido > div.task >
div.task-details-recorrido > div.task-header > span.task-time-recorrido {
  margin: 8px 0;
  padding: 10px;
  width: 100%;
  color: gray;
  font-size: 15px;
  font-weight: 500;
  background-color: transparent;
  border-radius: 4px;
  cursor: -webkit-grab;
  cursor: grab;
  overflow: hidden;
  /* Oculta el texto que excede el tamaño del contenedor */
  text-overflow: ellipsis;
  /* Añade puntos suspensivos cuando el texto es muy largo */
  white-space: nowrap;
  /* Evita que el texto haga salto de línea */
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  /* Transición suave al hacer hover */
}

main#container-tasks > div.container-card > div.card > div.content > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

main#container-tasks > div.container-card > div.card > div.content > div > a {
  opacity: 0.6;
  margin-top: 8px;
}

main#container-tasks > div.container-card > div.card > div.content > div > i {
  opacity: 0.6;
  margin-top: 9px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

main#container-tasks > div.container-card > div.card > div.content > div > a > div.space :hover {
  opacity: 1;
  cursor: pointer;
}

main#container-tasks > div.container-card > div.card > div.content > div > i :hover {
  cursor: pointer;
}

main#container-tasks > div.container-card > div.card > div.content > div > a > div.space > i.icons {
  font-size: 14px;
}

main#container-tasks > div.container-card > div.card > div.content > div > a > div.space > span {
  margin-left: 4px;
  color: #070707;
}

main#container-tasks::-webkit-scrollbar {
  height: 10px;
}

main#container-tasks {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  /* Activa el scroll horizontal */
  white-space: nowrap;
  /* Evita que los elementos salten a la siguiente línea */
}

main#container-tasks::-webkit-scrollbar {
  height: 8px;
  /* Altura de la scrollbar */
}

main#container-tasks::-webkit-scrollbar-thumb {
  background-color: #888;
  /* Color del scroll */
  height: 100%;
  border-radius: 10px;
}

main#container-tasks::-webkit-scrollbar-thumb:hover {
  background-color: #eab0b0;
  /* Color del scroll al pasar el mouse */
}

.input-container-comentario {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 1px;
  padding: 1px;
  background-color: #fff;
  /* Fondo blanco */
  border-radius: 2px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* Sombra suave */
}

.ion-input-comentario-input {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  font-weight: 400;
  font-size: 15px;
  margin-right: 1px;
  padding: 10px;
  /* Aumenta el padding para más espacio interno */
  background-color: #ffffff;
  /* Fondo blanco para un look más limpio */
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  /* Sombra externa sutil */
  border: 1px solid #ddd;
  /* Bordes ligeros */
  color: #333;
  /* Color de texto más oscuro */
  min-height: 50px;
  /* Altura mínima */
  max-height: 200px;
  /* Altura máxima antes de mostrar el scrollbar */
  overflow-y: auto;
  /* Permite scroll vertical si el contenido es demasiado grande */
  resize: vertical;
  /* Permite al usuario ajustar la altura */
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  /* Transición suave para cambios de estilo */
}

.ion-input-comentario-input textarea {
  height: auto;
  /* Ajusta la altura automáticamente */
  min-height: 50px;
  /* Altura mínima */
  height: 500px;
  /* Altura máxima antes de mostrar el scrollbar */
  overflow-y: auto;
  /* Permite scroll vertical si el contenido es demasiado grande */
}

.ion-input-comentario-input:focus {
  -webkit-box-shadow: 0 0 8px rgba(0, 123, 255, 0.25);
  box-shadow: 0 0 8px rgba(0, 123, 255, 0.25);
  /* Sombra azul al enfocar */
  border: 1px solid #143e6b;
  /* Borde azul al enfocar */
}

.guardar-comentario-button {
  -webkit-align-self: flex-end;
  -ms-flex-item-align: end;
  align-self: flex-end;
  /* Alinea el botón al final del contenedor */
  background-color: #1c175b;
  /* Color de fondo del botón */
  color: #fff;
  /* Color del texto del botón */
  padding: 10px 20px;
  /* Espaciado interno del botón */
  border: none;
  /* Sin borde */
  border-radius: 5px;
  /* Bordes redondeados */
  text-align: center;
  cursor: pointer;
  /* Cambia el cursor al pasar sobre el botón */
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
  /* Transición suave para el cambio de color de fondo */
}

.guardar-comentario-button:hover {
  background-color: #0056b3;
  /* Color de fondo al pasar el mouse */
}

.collapsible-container {
  margin-top: 10px;
  border-top: 1px solid #ccc;
  padding-top: 10px;
  width: 100%;
  /* Asegura que no se expanda fuera del contenedor */
  max-width: inherit;
  /* Para heredar el ancho de la card */
}

.collapsible-content p {
  font-size: 14px;
  margin: 5px 0;
  padding: 0 10px;
  /* Ajusta el padding para controlar el espacio */
}

.collapse-button {
  background-color: #3a6d3c;
  color: white;
  padding: 10px;
  border: none;
  cursor: pointer;
  width: auto;
  /* Cambia de 100% a auto para que no ocupe todo el ancho */
  display: inline-block;
  text-align: left;
  font-size: 16px;
}

.collapse-button:hover {
  background-color: #45a049;
}

.collapsible-content {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height 0.3s ease-out;
  transition: max-height 0.3s ease-out;
  width: 100%;
  /* Asegúrate de que el contenido no se salga de su contenedor */
}

.collapsible-content.collapsed {
  max-height: 500px;
  /* Ajusta esto según el contenido que tengas */
  width: 100%;
  /* Se mantiene dentro del contenedor */
}

.task-avatar-recorrido {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  color: white;
  font-weight: bold;
  margin-right: 10px;
}

.gestiones-internas-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 10px;
  max-height: 80vh;
  /* Ajusta según sea necesario */
  overflow-y: auto;
  padding: 3px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #f9f9f9;
}

.gestion-interna-card {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding: 3px;
  margin-bottom: 10px;
  word-wrap: break-word;
  /* Para evitar que el texto largo se salga del card */
}

.fieldcard {
  margin-bottom: 4px;
  /* Aumenta el margen para mejor separación */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Coloca los elementos en columna */
}

.fieldcard p {
  margin: 0;
  font-size: 14px;
  color: #333;
  word-wrap: break-word;
  /* Para evitar que el texto largo se salga del card */
}

.fieldcard p:first-child {
  font-weight: bold;
  /* Hace que el nombre del campo sea más prominente */
  margin-bottom: 5px;
  /* Añade un pequeño margen debajo del nombre del campo */
}

.title {
  text-align: center;
  color: #5b4b4b;
  font-size: 2px;
  margin-bottom: 2px;
}

.recibo-texto {
  white-space: pre-wrap;
  /* Mantiene los saltos de línea */
  font-family: monospace;
  /* Simula impresión de recibo */
  font-size: 14px;
  /* Ajusta el tamaño */
  text-align: left;
  /* Alineado a la izquierda */
  background: #f8f8f8;
  /* Opcional: color tipo recibo */
  padding: 10px;
  /* Espaciado */
  border-radius: 5px;
  /* Bordes redondeados */
}

.gestion-interna-card {
  position: relative;
  border: 1px solid #ccc;
  padding: 10px;
  margin-bottom: 10px;
  border-radius: 5px;
}

.card-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.collapse-icon {
  font-size: 1.5em;
  cursor: pointer;
  color: #0d253f;
}

.collapse-icon:hover {
  color: #0d345e;
}

.title {
  text-align: center;
  font-weight: bold;
  font-size: 1.5em;
  margin-bottom: 20px;
}

.first-task {
  position: -webkit-sticky;
  position: sticky;
  color: red;
  top: 0;
  z-index: 1;
  /* Asegúrate de que esté por encima de otros elementos */
  background-color: #EBECF0;
  /* Mantén el mismo fondo para que se vea bien */
}

.custom-searchbarmenu {
  margin-bottom: 10px;
  --background: #f5f5f5;
  --border-radius: 8px;
  --box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  --padding-start: 10px;
  --padding-end: 10px;
  --height: 40px;
  --placeholder-color: #999;
  --color: #333;
}

.custom-searchbarmenu .searchbar-input {
  font-size: 14px;
}

.custom-searchbarmenu .searchbar-clear-icon {
  font-size: 18px;
  color: #007bff;
}

.large-badge {
  width: 50px;
  height: 50px;
  cursor: pointer;
  background-color: #3d574f;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-right: 1px;
  margin-top: 2px;
}

.large-icon {
  font-size: 40px;
  color: white;
}

.page-clientes-active ion-content {
  left: 0;
  top: 1%;
  display: contents;
  /* Mantener display: contents */
  position: static;
  /* Mantener position: static */
  width: 100%;
  height: 100%;
  margin-top: 60px;
}

.page-clientes-active .grid {
  background-color: #464545 !important;
  /* Cambia el color de fondo */
  color: #fcf9f9;
  /* Cambia el color del texto */
}

.page-clientes-active .grid-container {
  margin-top: 9%;
  color: #fcf9f9;
  /* Cambia el color del texto */
}

.page-clientes-active .cuota-grid-plan-de-pagos-por-cuota {
  margin-top: 9%;
  color: white;
  /* Cambia el color del texto */
}

.page-clientes-active .ion-footer-creditos {
  margin-top: 0px;
  background-color: #464545 !important;
  /* Cambia el color de fondo */
  color: #fcf9f9;
  /* Cambia el color del texto */
  position: fixed;
  /* Fija el footer en la parte inferior */
  bottom: 0;
  /* Asegura que el footer esté en la parte inferior */
  width: 100%;
  /* Asegura que el footer ocupe todo el ancho */
  z-index: 1000;
  /* Asegura que el footer esté por encima de otros elementos */
  padding-bottom: 50px;
  /* Añade padding para hacerlo más visible */
}

.menu-button {
  background-color: #062240 !important;
  /* Cambia el color de fondo */
  color: white !important;
  /* Cambia el color del texto */
  border-radius: 8px;
  /* Bordes redondeados */
  padding: 10px 20px;
  /* Espaciado interno */
  font-size: 16px;
  /* Tamaño de la fuente */
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  /* Sombra */
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
  /* Transición suave para el cambio de color de fondo */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  text-align: center;
}

.menu-button:hover {
  background-color: #2b4a6a !important;
  /* Color de fondo al pasar el mouse */
}

.menu-icon {
  margin-right: 8px;
  /* Espacio entre el icono y el texto */
  font-size: 20px;
  /* Tamaño del icono */
}

.general-title {
  font-size: 24px;
  /* Tamaño de fuente grande */
  font-weight: bold;
  /* Peso de fuente grueso */
  text-align: center;
  /* Centrar el texto */
  margin: 20px 0;
  /* Espaciado superior e inferior */
  color: #333;
  /* Color del texto */
}

.task-group-default {
  margin-bottom: 16px;
  /* Más espacio entre los grupos */
  border-bottom: 1px solid #ccc;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* Sombra para dar profundidad */
  border-radius: 8px;
  /* Bordes redondeados */
  overflow: hidden;
  /* Para que los bordes redondeados funcionen con la sombra */
  -webkit-transition: -webkit-transform 0.3s, -webkit-box-shadow 0.3s;
  transition: -webkit-transform 0.3s, -webkit-box-shadow 0.3s;
  transition: transform 0.3s, box-shadow 0.3s;
  transition: transform 0.3s, box-shadow 0.3s, -webkit-transform 0.3s, -webkit-box-shadow 0.3s;
  /* Transiciones suaves */
  max-width: 600px;
  /* Limitar el ancho máximo */
  margin: 16px auto;
  /* Centrar el contenedor horizontalmente */
}

.task-group-default:hover {
  -webkit-transform: none;
  transform: none;
  /* No elevar al pasar el mouse */
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* Mantener la sombra original */
}

.task-group-header-default {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: default;
  /* Cambiar el cursor a default para indicar que no es clicable */
  font-size: medium;
  padding: 10px 16px;
  /* Más padding para un diseño más espacioso */
  background-color: #9a7676;
  /* Color de fondo del header del grupo */
  color: white;
  /* Color del texto */
  border-radius: 8px 8px 0 0;
  /* Bordes redondeados solo en la parte superior */
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}

.task-group-header-default .group-image-default {
  width: 40px;
  /* Ancho de la imagen */
  height: 40px;
  /* Alto de la imagen */
  border-radius: 50%;
  /* Esquinas redondeadas (opcional) */
  margin-right: 10px;
  /* Espaciado entre la imagen y el texto */
}

.task-group-header-default .group-info {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Asegura que el texto ocupe el espacio disponible */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.task-group-header-default .group-title {
  font-size: 18px;
  /* Tamaño de fuente del título */
  font-weight: bold;
  /* Peso de fuente del título */
  margin-bottom: 4px;
  /* Espaciado inferior del título */
}

.task-group-header-default .group-description-default {
  font-size: 14px;
  /* Tamaño de fuente más pequeño para la descripción */
  font-weight: 400;
  /* Peso de fuente normal para la descripción */
}

.task-group-header-default .group-quantity-default {
  font-size: 14px;
  /* Tamaño del texto de la cantidad */
  background-color: rgba(53, 14, 125, 0.3);
  /* Fondo semitransparente para resaltar */
  color: #fbfffb;
  border-radius: 5px;
  /* Esquinas redondeadas */
  padding: 5px 10px;
  /* Espaciado interno */
  margin-left: 10px;
  /* Espaciado a la izquierda */
}

/* Estilos globales para la barra de progreso */
ion-progress-bar {
  --background: #f3f4f6;
  /* Fondo de la barra */
  --color: #007bff;
  /* Color de la barra de progreso */
  height: 20px;
  /* Altura de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra sutil */
}

.progress-container {
  padding: 10px;
  /* Espaciado alrededor de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  background-color: #e9ecef;
  /* Color de fondo de la contenedor */
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  /* Sombra para el contenedor */
}

.progress-container {
  width: 100%;
}

ion-progress-bar {
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  --background: #e0e0e0;
  /* Color de fondo de la barra */
  --progress-background: #4caf50;
  /* Color del progreso (verde) */
  --progress-background: #4caf50;
  height: 20px;
  /* Ajusta la altura según tus necesidades */
}

.progress-container {
  width: 100%;
}

.custom-progress {
  background-color: #4caf50;
  /* Color del progreso */
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  /* Animación suave */
  height: 20px;
  /* Altura de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra sutil */
}

page-chat .chat-bg {
  background-image: url(../assets/imgs/logo.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

page-chat .scroll-content {
  margin-bottom: 56px;
}

page-chat .item {
  color: #fff;
  background-color: transparent;
  height: 4rem;
  border-bottom: 0 !important;
}

page-chat .item.item-block .item-inner {
  padding-right: 0px;
  border-bottom: 0;
}

page-chat .item.item-input.ng-invalid.ng-touched:not(.input-has-focus) .item-inner {
  border-bottom-color: transparent !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

page-chat .list .item-block .item-inner {
  border-bottom: 0 !important;
}

page-chat .chat-box, page-chat .chat-box-right {
  background-color: white;
  margin: 10px 15px;
  padding: 8px;
  position: relative;
  border-radius: 0px 30px 30px 30px;
  -webkit-box-shadow: 3px 3px 12px 0px rgba(46, 50, 124, 0.26);
  box-shadow: 3px 3px 12px 0px rgba(46, 50, 124, 0.26);
}

page-chat .chat-box .chat-header, page-chat .chat-box-right .chat-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 30%;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

page-chat .chat-box .chat-header .name, page-chat .chat-box-right .chat-header .name {
  color: #fff;
  font-weight: 700;
  overflow: hidden;
  padding-left: 4px;
}

page-chat .chat-box .chat-header .time, page-chat .chat-box-right .chat-header .time {
  color: #474444;
  font-size: 9px;
  width: 100%;
  text-align: right;
  padding-right: 15px;
  margin: 3px 0;
}

page-chat .chat-box .msg, page-chat .chat-box-right .msg {
  margin: 0 5px;
  line-height: 20px;
  color: #1a0303;
  text-align: justify;
}

page-chat .right {
  float: right;
}

page-chat .chat-box-right {
  border-radius: 30px 0 30px 30px;
  background-color: green;
  -webkit-box-shadow: 3px 3px 12px 0px rgba(46, 50, 124, 0.26);
  box-shadow: 3px 3px 12px 0px rgba(46, 50, 124, 0.26);
}

page-chat .thumb-l {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  padding: 2px;
  border: 1px solid #fff;
}

page-chat .thumb-r {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  padding: 2px;
  border: 1px solid #fff;
}

page-chat ion-footer {
  position: fixed;
  z-index: 10;
  display: block;
  width: 100%;
  bottom: 0;
}

page-chat .input-md[clearInput] .text-input {
  padding-right: 30px;
  color: #000;
}

page-chat .chat-field {
  border: none;
  padding: 0px 0 0px 8px !important;
}

page-chat .send-img-txt {
  color: #144a48;
  padding-left: 12px;
  font-size: 13px;
}

page-chat .button {
  background-color: transparent;
  color: blue;
  -webkit-box-shadow: none;
  box-shadow: none;
  float: right;
  padding: 0;
}

page-chat .button:hover:not(.disable-hover) {
  background-color: transparent;
}

page-chat .enter-btn {
  font-size: 36px;
  float: right;
  margin: 2px 5px 0px 0px;
}

page-chat .text-input {
  margin: 0px;
}

page-chat .chat-footer {
  position: fixed;
  bottom: 0;
  background-color: #fff;
  z-index: 999;
  border-top: 1px solid #fff;
  height: 4em;
  width: 100%;
}

page-chat .chat-input {
  color: #000;
}

page-cliente-select .header-row {
  background: #1c1c1d;
  color: #fff;
  font-size: 18px;
}

page-cliente-select ion-col {
  border: 1px solid #ECEEEF;
  cursor: pointer;
}

page-cliente-select .selectHover:hover {
  background-color: #817d7d;
}

page-cliente-select ion-content {
  --background: #fff;
}

page-cliente-select ion-content .paginador {
  cursor: pointer;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-cliente-select ion-content .paginador:hover {
  background-color: #e53935;
}

page-cliente-select ion-content .paginador #input {
  color: cadetblue;
}

page-cliente-select ion-content .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

page-cliente-select ion-content .row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: #2c2929;
  cursor: pointer;
}

page-cliente-select ion-content .col {
  width: 33.33%;
  margin-right: 10px;
}

page-cliente-select ion-content .col:last-child {
  margin-right: 0;
}

page-cliente-select ion-footer {
  background-color: aliceblue;
}

page-clientes {
  display: block;
  width: 100%;
  height: 100%;
  /* Estilos globales para la barra de progreso */
}

page-clientes .text-right {
  text-align: right;
}

page-clientes .text-left {
  text-align: left;
}

page-clientes .large-padding {
  padding: 10px 15px;
  font-size: 16px;
  padding-right: 6px;
  padding-bottom: 1px;
}

page-clientes .pointer {
  cursor: pointer;
}

page-clientes .no-background {
  background: transparent;
}

page-clientes .light-text {
  color: #0c031d;
}

page-clientes ion-datetime .datetime-text {
  font-size: 18px;
  color: #3880ff;
}

page-clientes ion-datetime .datetime-picker {
  background-color: #f4f4f4;
}

page-clientes .selectHover:hover {
  background-color: #4c4949;
  color: white;
}

page-clientes .selecttext {
  color: white;
  background-color: #298;
  border-radius: 8px;
  margin: 4px;
  padding: 4px;
}

page-clientes .selecttext:hover {
  background-color: transparent;
}

page-clientes #customsearchbar {
  --background: #1e1e1e;
  /* Fondo oscuro */
  --color: white;
  /* Texto blanco */
  color: #605050;
  background: #1e1e1e;
  --placeholder-color: rgba(255, 255, 255, 0.7);
  /* Color del placeholder en blanco pero más claro */
  --input-background: transparent;
  /* Fondo del input transparente */
  --cancel-button-color: white;
  /* Botón cancelar blanco */
  --icon-color: white;
  /* Color del icono de búsqueda */
  border-radius: 8px;
  /* Bordes redondeados */
}

page-clientes #customsearchbar input {
  width: 100%;
  color: white;
  --color:white;
  font-size: 16px;
  /* Ajustar el tamaño del texto */
}

page-clientes ion-col[width-10] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 5%;
  -ms-flex: 0 0 5%;
  flex: 0 0 5%;
  /* Ocupa el 10% del ancho */
  max-width: 5%;
}

page-clientes ion-col[width-20] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 30%;
  -ms-flex: 0 0 30%;
  flex: 0 0 30%;
  /* Ocupa el 70% del ancho */
  max-width: 30%;
}

page-clientes ion-col[width-35] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  /* Ocupa el 70% del ancho */
  max-width: 60%;
}

page-clientes ion-col[width-45] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  /* Ocupa el 70% del ancho */
  max-width: 60%;
}

page-clientes .paginadorcol {
  background: gray;
}

page-clientes .paginador {
  cursor: pointer;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: #b1aaaa;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-clientes .paginador:hover {
  background-color: #e53935;
}

page-clientes .paginador #input {
  color: cadetblue;
}

page-clientes #paddingcreditos {
  padding-bottom: -200px !important;
  margin-bottom: -200px !important;
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota ion-row {
  background: #2c3e50;
  /* Color de fondo profesional (gris oscuro/azul) */
  padding: 0;
  margin: 0;
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota ion-col {
  padding: 0 !important;
  margin: 0 !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota .cuota-col {
  min-height: 2.5em;
  /* Tamaño adaptable */
  max-height: 3em;
  line-height: 1.2;
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota .header {
  font-weight: bold;
  color: white;
  /* Letra blanca */
  min-height: 3em;
  max-height: 3.5em;
  text-transform: uppercase;
  /* Mayúsculas para estilo profesional */
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota ion-badge {
  font-size: 0.9em;
  /* Fuente más pequeña para adaptabilidad */
  padding: 5px;
  height: auto;
  background-color: #2980b9;
  /* Color de fondo azul profesional */
  color: white;
  /* Letra blanca */
  border-radius: 8px;
  /* Bordes ligeramente redondeados */
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota ion-input {
  height: auto;
  font-size: 1em;
  padding: 0 5px;
  color: white;
  /* Letra blanca */
  background-color: rgba(255, 255, 255, 0.1);
  /* Fondo semi-transparente */
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  /* Borde tenue */
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota ion-checkbox {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  /* Tamaño del checkbox más pequeño */
  margin-right: 10px !important;
  --background-checked: #27ae60;
  /* Fondo verde cuando está seleccionado */
  --border-color: #fff;
  /* Borde blanco */
  --checkmark-color: #fff;
  /* Checkmark blanco */
}

page-clientes .cuota-grid-plan-de-pagos-por-cuota ion-item {
  --padding-start: 0;
  background: transparent;
  /* Fondo transparente para ion-item */
}

page-clientes ion-progress-bar {
  --background: #f3f4f6;
  /* Fondo de la barra */
  --color: #007bff;
  /* Color de la barra de progreso */
  height: 20px;
  /* Altura de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra sutil */
}

page-clientes .progress-container {
  padding: 10px;
  /* Espaciado alrededor de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  background-color: #e9ecef;
  /* Color de fondo de la contenedor */
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  /* Sombra para el contenedor */
}

page-clientes .progress-container {
  width: 100%;
}

page-clientes ion-progress-bar {
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  --background: #e0e0e0;
  /* Color de fondo de la barra */
  --progress-background: #4caf50;
  /* Color del progreso (verde) */
  --progress-background: #4caf50;
  height: 20px;
  /* Ajusta la altura según tus necesidades */
}

page-clientes .progress-container {
  width: 100%;
}

page-clientes .custom-progress {
  background-color: #4caf50;
  /* Color del progreso */
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  /* Animación suave */
  height: 20px;
  /* Altura de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra sutil */
}

page-clientes .clientes-grid {
  padding: 1px;
  background-color: #352727;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

page-clientes .clientes-grid ion-item {
  margin-bottom: 15px;
}

page-clientes .clientes-grid ion-label {
  color: #333;
}

page-clientes .clientes-grid ion-input, page-clientes .clientes-grid ion-checkbox {
  --padding-start: 10px;
  --padding-end: 10px;
}

page-clientes .clientes-grid button[ion-button] {
  background-color: #007bff;
  color: #fff;
  border-radius: 5px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-clientes .clientes-grid button[ion-button]:hover {
  background-color: #0056b3;
}

page-clientes .clientes-grid .novedad {
  background-color: #004085;
  /* Azul oscuro profesional */
  color: #ffffff;
  /* Texto blanco */
  font-size: 16px;
  /* Tamaño de fuente ligeramente más grande */
  font-weight: 500;
  /* Peso de fuente medio */
  text-transform: uppercase;
  /* Texto en mayúsculas */
  border-radius: 5px;
  /* Bordes suavemente redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
  padding: 2px 5px;
  /* Espaciado interno */
}

page-clientes .clientes-grid .novedad ion-icon {
  font-size: 18px;
  margin-right: 10px;
}

page-clientes .clientes-grid .novedad:hover {
  background-color: #002752;
  /* Color más oscuro en hover */
}

page-clientes .clientes-grid .novedad:active {
  background-color: #282c31;
  /* Color más oscuro al presionar */
}

page-clientes .clientes-grid .cupo-label {
  font-size: 24px;
  /* Aumenta el tamaño de la fuente */
  font-weight: bold;
  text-align: center;
  width: 100%;
  padding: 10px;
  /* Añade padding para hacerlo más llamativo */
  border-radius: 8px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  /* Añade una sombra para destacar */
}

page-clientes .clientes-grid .cupo-label:hover {
  -webkit-transform: scale(2.2);
  transform: scale(2.2);
  /* Escala el componente al 120% de su tamaño original */
  -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
  /* Aumenta la sombra para hacerlo más llamativo */
}

page-clientes .clientes-grid .positivo {
  color: #28a745;
  /* Verde para positivo */
  background-color: #d4edda;
  /* Fondo verde claro */
}

page-clientes .clientes-grid .positivodescripcion {
  color: #c5d5c8;
  /* Verde para positivo */
  background-color: #3c453e;
  /* Fondo verde claro */
}

page-clientes .clientes-grid .cupo-label-descripcion {
  position: relative;
  /* Asegura que el contenido adicional se posicione correctamente */
  overflow: hidden;
  /* Oculta el contenido que se salga del contenedor por defecto */
  -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  /* Transición suave */
  font-size: 13px;
  /* Aumenta el tamaño de la fuente */
  font-weight: bold;
  text-align: center;
  width: 100%;
  padding: 5px;
  /* Añade padding para hacerlo más llamativo */
  border-radius: 8px 4px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

page-clientes .clientes-grid .cupo-label-descripcion:hover {
  -webkit-transform: scale(2.2);
  transform: scale(2.2);
  /* Escala el componente */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  /* Aumenta la sombra */
  overflow: visible;
  /* Muestra el contenido que se salga del contenedor */
  z-index: 9999;
  /* Asegura que el elemento esté por encima de los demás */
}

page-clientes .clientes-grid .negativo {
  color: #dc3545;
  /* Rojo para negativo */
  background-color: #f8d7da;
  /* Fondo rojo claro */
}

@media (max-width: 767px) {
  page-clientes .clientes-grid ion-col {
    margin-bottom: 15px;
  }
  page-clientes .clientes-grid button[ion-button] {
    width: 100%;
  }
}

.fechas {
  position: relative;
}

.fechas ion-input {
  width: calc(100% - 40px);
  /* Ajusta el ancho para dejar espacio para el icono */
  padding-right: 40px;
  /* Añade padding a la derecha para el icono */
}

.fechas .calendar-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 24px;
  color: #007bff;
  /* Color del icono */
}

.compact-grid {
  height: auto;
  padding: 0;
}

.compact-grid ion-row {
  height: auto;
  padding: 0;
}

.compact-grid ion-col {
  height: auto;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.ion-list {
  height: auto;
  padding: 0;
}

page-comandas {
  /* Agrega este estilo al final de tu archivo CSS */
  /* Agrega reglas de medios para dispositivos móviles */
}

page-comandas .end {
  float: right;
}

page-comandas .nota {
  border-top: 1.2em solid rgba(255, 255, 255, 0.3);
  padding: 0;
  -webkit-box-shadow: 2px 2px 8px #555;
  box-shadow: 2px 2px 8px #555;
  background-color: #5f5d56;
  background-image: url("assets/imgs/nota.png");
  border-radius: 4px;
  float: left;
}

page-comandas .description-container {
  padding: 10px;
  border-radius: 5px;
  margin-top: 10px;
}

page-comandas .description {
  margin-top: 5px;
  color: #f2f2f2;
}

page-comandas * {
  margin: 0;
  padding: 0;
}

page-comandas .cantidadnum {
  font-size: 140%;
  margin: 1em;
  background: #070707;
  background-color: white;
}

page-comandas .cantidadnumdes {
  font-size: 70%;
  margin: 1em;
  background: #070707;
  background-color: white;
}

page-comandas body {
  font-family: arial,sans-serif;
  font-size: 100%;
  margin: 1em;
  background: #666;
  color: #fff;
}

page-comandas p {
  font-size: 100%;
  font-weight: normal;
}

page-comandas h2 {
  font-size: 100%;
  font-weight: normal;
  margin-left: 2em;
}

page-comandas .ulli {
  list-style: none;
  background-color: #f2f2f2;
  border-radius: 10px;
  margin: 10px;
  padding: 10px;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

page-comandas .ulli img {
  float: right;
  -webkit-box-shadow: 5px 5px 7px rgba(33, 33, 33, 0.7);
  box-shadow: 5px 5px 7px rgba(33, 33, 33, 0.7);
  border-radius: 4px;
  max-width: 10%;
  height: 23px;
}

page-comandas .ulli {
  margin: 1em;
  float: left !important;
  max-width: 25%;
}

page-comandas .ulli h2 {
  font-size: 90%;
  font-weight: bold;
  padding-bottom: 10px;
  float: left;
}

page-comandas .ulli p {
  font-family: "Reenie Beanie",arial,sans-serif;
  font-size: 90%;
  float: left;
  margin-left: 1em;
}

page-comandas .ulli:nth-child(even) a {
  position: relative;
  top: 5px;
  background: #cfc;
}

page-comandas .ulli:nth-child(3n) a {
  position: relative;
  top: -5px;
  background: #ccf;
}

page-comandas .ulli:nth-child(5n) a {
  position: relative;
  top: -10px;
}

page-comandas .ulli a:hover, page-comandas .ulli a:focus {
  box-shadow: 10px 10px 7px rgba(0, 0, 0, 0.7);
  -moz-box-shadow: 10px 10px 7px rgba(0, 0, 0, 0.7);
  -webkit-box-shadow: 10px 10px 7px rgba(0, 0, 0, 0.7);
  position: relative;
  z-index: 5;
}

page-comandas .ulli {
  text-align: center;
}

page-comandas .ulli {
  display: inline;
  padding-right: 1em;
}

page-comandas .ulli img {
  color: #fff;
}

page-comandas .pedido {
  float: left;
}

page-comandas .pedidoimg {
  border-top: 0.2em solid rgba(255, 255, 255, 0.3);
  padding: 2px;
  -webkit-box-shadow: 2px 2px 8px #555;
  box-shadow: 2px 2px 8px #555;
  margin: 0px 12px;
  cursor: pointer;
  border-radius: 10px;
  font-size: 25px;
}

page-comandas .pedidoNum {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 4vh;
  /* Reducir la altura del contador para que se adapte mejor al contenido */
  font-size: 15px;
  /* Mantener el tamaño relativo de la fuente */
  color: #fff;
  background-color: #5d8a87;
  border-radius: 10px;
  text-align: center;
  padding: 3%;
  /* Ajustar el relleno para el texto no se salga del contenedor */
  margin: 0 auto;
  -webkit-box-shadow: 2px 2px 8px #555;
  box-shadow: 2px 2px 8px #555;
  margin-bottom: 3px;
}

page-comandas .color-domicilio {
  background: #562f2f;
  /* Cambia el color a rojo para Domicilio # */
}

page-comandas .color-turno {
  background: #3c3c62;
  /* Cambia el color a azul para Turno # */
}

page-comandas .color-mesa {
  background: #425d42;
  /* Cambia el color a verde para Mesa # */
}

page-comandas .color-alerta {
  background-color: red;
}

page-comandas .alerta {
  background-color: red;
  /* Cambia el color del fondo del elemento alert activa */
}

page-comandas .gray-content .ulli.alerta {
  background-color: red;
  /* Cambia el color del fondo del elemento alert activa */
}

page-comandas .ulli.alerta {
  background-color: red;
  /* Cambia el color del fondo del elemento alert activa */
}

@-webkit-keyframes susurro {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
  /* Define la distancia y dirección que deseas para el movimiento */
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes susurro {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
  /* Define la distancia y dirección que deseas para el movimiento */
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

page-comandas .move-animation {
  -webkit-animation: susurro 2s infinite alternate;
  animation: susurro 2s infinite alternate;
}

page-comandas .pendiente {
  background-color: #F08080;
  margin-left: 1em;
}

page-comandas .pendienteelaborado {
  background-color: #FAEBD7;
  margin-left: 1em;
}

page-comandas .gestionado {
  background-color: #425D42;
  border-radius: 2px;
  margin-left: 1em;
}

page-comandas .cancelado {
  background-color: #FF0000;
  margin-left: 1em;
}

page-comandas .facturado {
  background-color: aqua;
  margin-left: 1em;
}

page-comandas .cocina {
  background-color: #87CEFA;
  padding-left: 10px;
  margin-left: 1em;
}

page-comandas .salon {
  background-color: #483D8B;
  margin-left: 1em;
}

page-comandas .bar {
  background-color: #1c344d;
  margin-left: 1em;
}

page-comandas .contadorusuario {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 5vh;
  /* Reducir la altura del contador para que se adapte mejor al contenido */
  font-size: 15px;
  /* Mantener el tamaño relativo de la fuente */
  color: #fff;
  background-color: #2f3333;
  border-radius: 10px;
  text-align: center;
  padding: 3%;
  /* Ajustar el relleno para el texto no se salga del contenedor */
  margin: 0 auto;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

page-comandas .contador {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 5vh;
  /* Reducir la altura del contador para que se adapte mejor al contenido */
  font-size: 15px;
  /* Mantener el tamaño relativo de la fuente */
  color: #fff;
  background-color: #5d8a87;
  border-radius: 10px;
  text-align: center;
  padding: 3%;
  /* Ajustar el relleno para el texto no se salga del contenedor */
  margin: 0 auto;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

page-comandas .tiempo {
  font-weight: bold;
}

page-comandas .gray-content .ulli {
  border: 2px solid #5d8a87;
  /* Añade un borde alrededor del contenedor */
  border-radius: 10px;
  /* Redondea las esquinas del contenedor */
  margin: 10px 0;
  /* Añade un espacio en la parte superior e inferior del contenedor */
  padding: 10px;
  /* Añade espacio interno al contenedor */
  /* Define un gradiente de fondo para el contenedor */
  background: linear-gradient(45deg, #5d8a87, #434343);
  color: #fff;
  /* Establece el color del texto como blanco */
  -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
}

page-comandas .gray-content .pedidoNum {
  display: block;
  /* Cambia el elemento strong a bloque para ocupar todo el ancho disponible */
  text-align: center;
  /* Centra el texto horizontalmente */
  font-size: 16px;
  /* Define el tamaño de fuente */
  margin: 5px 0;
  /* Añade espacio en la parte superior e inferior del elemento */
}

page-comandas .gray-content .contador {
  text-align: center;
  /* Centra el texto horizontalmente */
  margin-top: 5px;
  /* Añade espacio en la parte superior del elemento */
}

@media (min-width: 600px) {
  page-comandas .ulli {
    width: 100%;
  }
  page-comandas .nota {
    width: 100%;
  }
}

@media (min-width: 300px) {
  page-comandas .ulli {
    width: 100%;
  }
  page-comandas .nota {
    width: 100%;
  }
}

@media only screen and (max-width: 600px) {
  page-comandas .ulli {
    width: 100%;
    /* Asegura que el elemento ocupe todo el ancho en dispositivos móviles */
    max-width: none;
    /* Elimina cualquier límite máximo de ancho */
    margin: 5px 0;
    /* Reduce el espacio alrededor del elemento */
  }
  page-comandas .pedidoNum {
    font-size: 14px;
    /* Reducir el tamaño de fuente para dispositivos móviles */
    height: auto;
    /* Permite que la altura del elemento se adapte al contenido */
  }
  page-comandas .contador {
    font-size: 17px;
    /* Reducir el tamaño de fuente para dispositivos móviles */
  }
  page-comandas .ulli img {
    max-width: 15%;
    /* Reducir el tamaño de la imagen para que no se vea tan grande en dispositivos móviles */
    height: auto;
    /* Permite que la altura de la imagen se adapte proporcionalmente al ancho */
  }
}

page-companias-usuarios .end {
  float: right;
}

page-conceptos-egresos #file-input {
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0;
  z-index: 999;
}

page-conceptos-egresos .end {
  float: right;
}

page-cuadre-caja-diario-domicilios {
  /* Ajuste de estilos para adaptabilidad */
  /* Ejemplo de estilo para hacer los campos de entrada blancos */
  /* Aplicar estilos a la fila para distribuir de forma horizontal */
  /* Ajustar el tamaño de las columnas para ocupar el ancho disponible */
  /* Ajustar la distribución de elementos */
  /* Ajustar el tamaño de las columnas para que se muestren en una sola fila */
}

page-cuadre-caja-diario-domicilios .mita {
  width: 60%;
  float: left;
}

page-cuadre-caja-diario-domicilios .mita2 {
  width: 37%;
  float: right;
}

page-cuadre-caja-diario-domicilios .nombre {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-cuadre-caja-diario-domicilios .imgmoneda {
  display: block;
  margin: auto;
  width: 20%;
}

page-cuadre-caja-diario-domicilios .label2 {
  color: #051153;
  font-weight: bold;
  text-align: left;
  font-size: 28px;
  float: left;
}

page-cuadre-caja-diario-domicilios .label13 {
  color: #130822;
  font-weight: bold;
  text-align: center;
  display: block;
  font-size: 10px;
  float: left;
}

page-cuadre-caja-diario-domicilios .label15 {
  color: rgba(7, 128, 27, 0.918);
  font-weight: bold;
  text-align: left;
  display: block;
  font-size: 28px;
  float: left;
}

page-cuadre-caja-diario-domicilios .label16 {
  color: #ff0419;
  font-weight: bold;
  text-align: left;
  display: block;
  font-size: 28px;
  float: left;
}

page-cuadre-caja-diario-domicilios .imgmoneda {
  display: block;
  margin: auto;
  float: left;
}

page-cuadre-caja-diario-domicilios .mitad1 {
  width: 48%;
  float: left;
  padding: 1%;
  /* Agregar un pequeño espacio entre los elementos */
}

page-cuadre-caja-diario-domicilios .mitad2 {
  width: 48%;
  float: right;
  padding: 1%;
  /* Agregar un pequeño espacio entre los elementos */
}

page-cuadre-caja-diario-domicilios ion-input {
  background-color: white;
  /* Hacer que el fondo del campo de entrada sea blanco */
  border: 0.5px solid #ccc;
  /* Agregar un borde para resaltar los campos de entrada */
}

page-cuadre-caja-diario-domicilios .img-reducida {
  max-width: 125px;
  height: auto;
  /* Permite que la altura se ajuste automáticamente para mantener la proporción */
  display: block;
  /* Asegura que la imagen se muestre como un elemento de bloque */
  margin: 0 auto;
  /* Centra la imagen horizontalmente en su contenedor */
}

page-cuadre-caja-diario-domicilios .mita ion-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Hace que los elementos se alineen horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente los elementos */
}

page-cuadre-caja-diario-domicilios .mita ion-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permite que los elementos se distribuyan en múltiples líneas cuando no quepan todos en una sola fila */
}

page-cuadre-caja-diario-domicilios .mita ion-col {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 50%;
  -ms-flex: 1 1 50%;
  flex: 1 1 50%;
  /* Establece que las columnas ocupen el 50% del ancho disponible, permitiendo que dos elementos se alineen en la misma fila */
  max-width: 50%;
  /* Evita que los elementos crezcan más allá del 50% del ancho disponible */
}

page-cuadre-caja-diario-domicilios .mita ion-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utilizar flexbox para alinear elementos */
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  /* Evitar que los elementos se envuelvan (nowrap) */
  overflow-x: auto;
  /* Permitir desplazamiento horizontal si el contenido no cabe en el ancho disponible */
}

page-cuadre-caja-diario-domicilios .mita ion-col {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* Permitir que las columnas crezcan para ocupar el espacio disponible */
  max-width: 100%;
  /* Establecer el ancho máximo al 100% para que las columnas ocupen todo el espacio disponible */
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  /* Resetear el ancho inicial para permitir la distribución equitativa */
}

page-cuadre-caja-diario-domicilios .afn {
  border-bottom: 5px solid;
  color: gray;
  cursor: pointer;
}

page-cuadre-caja-diario-domicilios .afn.clic {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-cuadre-caja-diario-domicilios .afn.clic:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

page-cuadre-caja-diario-domicilios .afn.animate {
  border-bottom: none;
}

page-cuadre-caja-diario-domicilios .afn.animate:before {
  content: "afn";
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 5px;
  background-color: red;
  width: 0%;
  border-radius: 0 0 5px 5px;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-cuadre-caja-diario-domicilios .afn.animate.col:before {
  background-color: gray;
}

page-cuadre-caja-diario-domicilios .afn.animate.colpro:before {
  background-color: #0c031c;
}

page-cuadre-caja-diario-domicilios .afn.animate:hover:before {
  width: 100%;
}

page-cuadre-caja-diario-domicilios .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-cuadre-caja-diario-domicilios .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-cuadre-caja-diario-domicilios .inputTextArea textarea {
  text-align: left;
  font-size: 18px;
  padding-right: 0px;
}

page-cuadre-caja-diario-domicilios .inputPrecio input {
  text-align: right;
  font-size: 25px;
  border: 1px solid #567;
  padding-right: 0px;
  color: white;
}

page-cuadre-caja-diario-domicilios .divProductos {
  text-align: center;
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
  width: 100% !important;
}

page-cuadre-caja-diario-domicilios ion-card {
  position: relative;
  text-align: center;
  display: inline-block;
  width: 90% !important;
}

page-cuadre-caja-diario-domicilios .Products-item {
  position: relative;
  border-radius: 8px;
  background-color: #241717;
  width: 100%;
}

page-cuadre-caja-diario-domicilios .Products-item .orderId {
  grid-area: orderId;
}

page-cuadre-caja-diario-domicilios .Products-item .orderId p {
  position: absolute;
  vertical-align: middle;
  color: #121212 !important;
  padding-top: 13px;
  font-size: 13px !important;
  white-space: nowrap;
  /* Evita que el texto se divida en varias líneas */
  text-overflow: ellipsis;
  /* Agrega puntos suspensivos (...) al final del texto si no cabe en el contenedor */
  overflow: hidden;
  /* Oculta cualquier texto que sobrepase el contenedor */
  left: 0;
  /* Alinea el texto a la izquierda */
  right: 0;
  /* Alinea el texto a la derecha */
}

page-cuadre-caja-diario-domicilios .Products-item .edit {
  grid-area: edit;
  margin-top: 2px;
  margin-bottom: -4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-cuadre-caja-diario-domicilios .Products-item .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

page-cuadre-caja-diario-domicilios .Products-item .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 35px;
}

page-cuadre-caja-diario-domicilios .Products-item .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-cuadre-caja-diario-domicilios .Products-item .editprecio {
  grid-area: edit;
  margin-top: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-cuadre-caja-diario-domicilios .Products-item .editprecio .wrapperprecio {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: end;
  -ms-flex-align: end;
  align-items: end;
  background: #FFF;
}

page-cuadre-caja-diario-domicilios .Products-item .editprecio .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-cuadre-caja-diario-domicilios .Products-item .editprecio .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  color: #FFF;
  font-weight: bold;
  pointer-events: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-cuadre-caja-diario-domicilios .Products-item-img {
  width: 100%;
  background-color: white;
  -o-object-fit: cover;
  object-fit: cover;
  grid-area: image;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-cuadre-caja-diario-domicilios .Products-item-img #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding-right: 40px;
  height: 50px;
  max-width: none;
  width: 120px;
}

page-cuadre-caja-diario-domicilios .Products-item-img #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-cuadre-caja-diario-domicilios .wrapper {
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
  margin-top: 2px !important;
}

page-cuadre-caja-diario-domicilios .wrapperdenominaciones {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

page-cuadre-caja-diario-domicilios .item {
  min-width: 100px;
  height: auto;
  position: relative;
}

page-cuadre-caja-diario-domicilios #imggrupos {
  height: 80px;
  display: block;
  outline: 1px solid #361717;
  margin: 2px;
}

page-cuadre-caja-diario-domicilios .custom-button-enviar-cierre {
  background-color: #6c7308;
  /* Verde */
  color: white;
  border-radius: 12px;
  padding: 10px 20px;
  border: none;
  font-size: 16px;
  -webkit-transition: background-color 0.3s, -webkit-transform 0.3s;
  transition: background-color 0.3s, -webkit-transform 0.3s;
  transition: background-color 0.3s, transform 0.3s;
  transition: background-color 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

page-cuadre-caja-diario-domicilios .custom-button-enviar-cierre:hover {
  background-color: #61670c;
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

page-cuadre-caja-diario-domicilios .custom-button-enviar-cierre:active {
  background-color: #6e7136;
}

page-cuadre-caja-diario-domicilios .custom-icon-enviar-cierre {
  background-color: white;
  border-radius: 50%;
  padding: 5px;
  color: #8e9340;
  /* Verde */
  font-size: 20px;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

page-cuadre-caja-diario-domicilios .custom-button-enviar-cierre:hover .custom-icon {
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}

@media (max-width: 600px) {
  page-cuadre-caja-diario-domicilios .div {
    width: 100% !important;
    float: left !important;
  }
  page-cuadre-caja-diario-domicilios .afn {
    width: 100% !important;
  }
  page-cuadre-caja-diario-domicilios .mita {
    width: 100%;
    float: left;
  }
  page-cuadre-caja-diario-domicilios .mita2 {
    width: 100%;
    float: right;
  }
}

@media (max-width: 800px) {
  page-cuadre-caja-diario-domicilios .div {
    width: 100% !important;
    float: left !important;
  }
  page-cuadre-caja-diario-domicilios .afn {
    width: 100% !important;
  }
  page-cuadre-caja-diario-domicilios .mita {
    width: 100%;
    float: left;
  }
  page-cuadre-caja-diario-domicilios .mita2 {
    width: 100%;
    float: right;
  }
}

page-cuadre-caja-diario-domicilios .custom-grid-visualizarventa {
  background-color: #f9f9f9;
  border: 1px solid #ddd;
}

page-cuadre-caja-diario-domicilios .header-row-visualizarventa {
  font-weight: bold;
  background-color: #315132;
  color: white;
}

page-cuadre-caja-diario-domicilios ion-col {
  padding: 10px;
  border-bottom: 1px solid #ddd;
}

page-cuadre-caja-diario-domicilios .total-row {
  font-weight: bold;
  background-color: #383434;
  color: white;
}

page-cuadre-caja-diario-domicilios .total-label {
  text-align: right;
}

page-cuentas-por-cobrar #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

page-cuentas-por-cobrar ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

page-cuentas-por-cobrar .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

.cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

.cuota:first-child {
  font-weight: bold;
}

.cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col:first-child {
  width: 15%;
}

/* Estilos para las filas de cuotas */
.cuota {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col {
  border-right: 1px solid #ccc;
}

.cuota-col:last-child {
  border: none;
}

.cuota-extra:first-child {
  font-weight: bold;
}

.cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

/* Estilos para las filas de cuotas */
.cuota-extra {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col-extra {
  border-right: 1px solid #ccc;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.comprobante-boton-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 15px;
}

.abrir-comprobante-btn {
  background-color: #298;
  color: white;
  border: none;
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
}

.comprobante-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.45);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 9999;
}

.comprobante-contenido {
  background: white;
  padding: 20px 25px;
  border-radius: 10px;
  width: 90%;
  max-width: 400px;
  -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2);
  text-align: center;
}

.comprobante-contenido input {
  display: block;
  width: 100%;
  margin: 10px auto;
  padding: 8px;
  font-size: 14px;
  border-radius: 6px;
  border: 1px solid #ccc;
}

.comprobante-botones {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 15px;
}

.btn-cancelar {
  background: #ccc;
  color: #333;
  border: none;
  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;
}

.btn-validar {
  background: #298;
  color: white;
  border: none;
  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;
}

.abrir-comprobante-btn {
  background: #298;
  border: none;
  color: white;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
}

.comprobante-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 9999;
}

.comprobante-contenido {
  background: #fff;
  padding: 20px;
  border-radius: 8px;
  width: 90%;
  max-width: 400px;
  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  text-align: center;
}

.comprobante-contenido input {
  display: block;
  width: 100%;
  margin: 10px 0;
  padding: 8px;
  font-size: 14px;
  border-radius: 6px;
  border: 1px solid #ccc;
}

.comprobante-botones {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 15px;
}

.btn-cancelar {
  background: #ccc;
  color: #333;
  padding: 8px 14px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
}

.btn-validar {
  background: #298;
  color: white;
  padding: 8px 14px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
}

page-cuentas-por-cobrar-creditos #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

page-cuentas-por-cobrar-creditos ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

page-cuentas-por-cobrar-creditos .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

.cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

.cuota:first-child {
  font-weight: bold;
}

.cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col:first-child {
  width: 15%;
}

/* Estilos para las filas de cuotas */
.cuota {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col {
  border-right: 1px solid #ccc;
}

.cuota-col:last-child {
  border: none;
}

.cuota-extra:first-child {
  font-weight: bold;
}

.cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

/* Estilos para las filas de cuotas */
.cuota-extra {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col-extra {
  border-right: 1px solid #ccc;
}

.header-row {
  background: #1c1c1d;
  color: #fff;
  font-size: 18px;
}

ion-col {
  cursor: pointer;
}

.selectHover:hover {
  background-color: #4c4949;
  color: white;
}

.selecttext {
  color: white;
  background-color: #298;
  border-radius: 8px;
  margin: 4px;
  padding: 4px;
}

.selecttext:hover {
  background-color: transparent;
}

.ion-content {
  --background: #fff;
}

.ion-content .paginador {
  cursor: pointer;
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.ion-content .paginador:hover {
  background-color: #e53935;
}

.ion-content .paginador #input {
  color: cadetblue;
}

.ion-content .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

.ion-content .row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: whitesmoke;
  cursor: pointer;
}

.ion-content .col {
  margin-top: 20px;
  width: 33.33%;
  margin-right: 10px;
}

.ion-content .col:last-child {
  margin-right: 0;
}

#customsearchbar {
  --background: #f0f0f0;
  /* Color de fondo de la caja de texto */
  --color: #ddd7d7;
  /* Color del texto */
  --placeholder-color: #f3efef;
  /* Color del placeholder */
  --input-background: #ffffff;
  /* Color de fondo del input */
  --input-color: #000000;
  /* Color del texto en el input */
}

ion-grid {
  --ion-grid-padding: 16px;
}

ion-col {
  padding: 10px;
}

.cuentaporcobrar {
  width: 100%;
  margin-top: 5px;
}

ion-item {
  background: #f9f9f9;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  margin-bottom: 15px;
  padding: 10px;
}

ion-badge {
  font-size: 14px;
  padding: 5px 10px;
  border-radius: 5px;
}

.centered-col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  /* Ajusta la altura para centrar verticalmente */
  text-align: center;
  padding: 15px;
}

.centered-text {
  font-size: 1.2em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* Hace que el texto sea más destacado */
  padding: 10px;
  color: #164372;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
  background-color: #f0f0f5;
  /* Fondo suave para el texto */
}

.resaltar-col {
  background-color: #ffeeba;
  /* Color de fondo amarillo claro */
  color: #333;
  /* Color de texto oscuro */
  font-weight: bold;
  /* Texto en negrita */
  border-radius: 5px;
  /* Bordes redondeados */
  padding: 10px;
  /* Espaciado interno */
}

.progress-container {
  width: 100%;
  background-color: #e0e0e0;
  border-radius: 8px;
  margin-top: 20px;
}

.progress-bar {
  height: 20px;
  background-color: #488aff;
  border-radius: 8px;
  width: 0;
  /* Esto será dinámico, modificado por la lógica en TypeScript */
  -webkit-transition: width 0.5s ease;
  transition: width 0.5s ease;
}

.plan-de-pagos-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  /* Fondo semitransparente */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 1000;
  /* Asegura que el div esté por encima de otros elementos */
}

.plan-de-pagos-container {
  background: white;
  padding: 20px;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  width: 80%;
  max-width: 600px;
}

.plan-de-pagos-container h2 {
  margin-top: 0;
}

.plan-de-pagos-container ion-list {
  margin-top: 10px;
}

.plan-de-pagos-container ion-item {
  cursor: pointer;
}

.always-float {
  -webkit-transform: translateY(-20px) !important;
  transform: translateY(-20px) !important;
  font-size: 14px !important;
  /* Aumenta el tamaño de la fuente para mayor legibilidad */
  color: #4c4949;
  border-radius: 4px;
  margin: 2px;
  padding: 2px;
  font-weight: 300;
  /* Incrementa el peso de la fuente para que se vea más grueso */
  line-height: 1.2;
  /* Ajusta la altura de la línea para mejorar la legibilidad */
}

.always-floats {
  font-size: 18px !important;
  /* Aumenta el tamaño de la fuente para mayor legibilidad */
  color: #4c4949;
  border-radius: 4px;
  margin: 2px;
  padding: 2px;
  font-weight: 400;
  /* Incrementa el peso de la fuente para que se vea más grueso */
  line-height: 1.2;
  /* Ajusta la altura de la línea para mejorar la legibilidad */
}

.custom-fab-izquierda-inferior {
  position: fixed;
  left: 16px;
  bottom: 3%;
  z-index: 1000;
}

.custom-fab-button {
  --background: transparent;
  /* Fondo transparente */
  width: 50px;
  height: 50px;
  padding: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  /* Remueve cualquier sombra */
}

.custom-fab-badge {
  background-color: rgba(251, 78, 98, 0.3);
  font-weight: 800;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.9);
  cursor: pointer;
}

.custom-fab-button img {
  width: 80%;
  height: 80%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}

.grid-valor-pagar {
  background: transparent;
}

.resaltar-pago {
  background-color: rgba(255, 235, 186, 0.3);
  color: white;
  font-weight: 800;
  /* Más grueso que "bold" */
  font-size: 18px;
  border-radius: 5px;
  /* Bordes redondeados */
  padding: 10px;
  /* Espaciado interno */
}

#customsearchbar {
  --background: #1e1e1e;
  /* Fondo oscuro */
  --color: white;
  /* Texto blanco */
  color: #605050;
  background: #1e1e1e;
  --placeholder-color: rgba(255, 255, 255, 0.7);
  /* Color del placeholder en blanco pero más claro */
  --input-background: transparent;
  /* Fondo del input transparente */
  --cancel-button-color: white;
  /* Botón cancelar blanco */
  --icon-color: white;
  /* Color del icono de búsqueda */
  border-radius: 8px;
  /* Bordes redondeados */
}

#customsearchbar input {
  width: 100%;
  color: white;
  --color:white;
  font-size: 16px;
  /* Ajustar el tamaño del texto */
}

ion-col[width-10] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 5%;
  -ms-flex: 0 0 5%;
  flex: 0 0 5%;
  /* Ocupa el 10% del ancho */
  max-width: 5%;
}

ion-col[width-20] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 30%;
  -ms-flex: 0 0 30%;
  flex: 0 0 30%;
  /* Ocupa el 70% del ancho */
  max-width: 30%;
}

ion-col[width-35] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  /* Ocupa el 70% del ancho */
  max-width: 60%;
}

ion-col[width-45] {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  /* Ocupa el 70% del ancho */
  max-width: 60%;
}

.custom-checkbox {
  --size: 24px;
  /* Tamaño del checkbox */
  --background: #ffffff;
  /* Fondo del checkbox */
  --border-radius: 8px;
  /* Bordes redondeados (puedes ajustarlo para redondearlo más o menos) */
  --border-color: #007bff;
  /* Color del borde del checkbox */
  --color-checked: #007bff;
  /* Color de fondo cuando está seleccionado */
  --checkmark-color: #ffffff;
  /* Color del checkmark */
  --checkmark-width: 18px;
  /* Tamaño del checkmark */
  padding-left: 35px;
  margin-left: 35px;
  /* Efecto hover para el checkbox */
  /* Añadir sombra cuando esté seleccionado */
}

.custom-checkbox:hover {
  --border-color: #0056b3;
  /* Color del borde al pasar el mouse */
  --background: #f0f0f0;
  /* Fondo más claro en hover */
}

.custom-checkbox.checkbox-checked {
  --box-shadow: 0 0 10px rgba(0, 123, 255, 0.5);
  /* Sombra al estar marcado */
}

.cuota-grid-plan-de-pagos-por-cuota {
  /* Estilo para dispositivos móviles */
}

.cuota-grid-plan-de-pagos-por-cuota ion-row {
  background: #2c3e50;
  /* Color de fondo profesional (gris oscuro/azul) */
  padding: 0;
  margin: 0;
}

.cuota-grid-plan-de-pagos-por-cuota ion-col {
  padding: 0 !important;
  margin: 0 !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

.cuota-grid-plan-de-pagos-por-cuota .cuota-col {
  min-height: 2.5em;
  /* Tamaño adaptable */
  max-height: 3em;
  line-height: 1.2;
}

.cuota-grid-plan-de-pagos-por-cuota .header {
  font-weight: bold;
  color: white;
  /* Letra blanca */
  min-height: 3em;
  max-height: 3.5em;
  text-transform: uppercase;
  /* Mayúsculas para estilo profesional */
}

.cuota-grid-plan-de-pagos-por-cuota ion-badge {
  font-size: 0.9em;
  /* Fuente más pequeña para adaptabilidad */
  padding: 5px;
  height: auto;
  background-color: #2980b9;
  /* Color de fondo azul profesional */
  color: white;
  /* Letra blanca */
  border-radius: 8px;
  /* Bordes ligeramente redondeados */
}

.cuota-grid-plan-de-pagos-por-cuota ion-input {
  height: auto;
  font-size: 1em;
  padding: 0 5px;
  color: white;
  /* Letra blanca */
  background-color: rgba(255, 255, 255, 0.1);
  /* Fondo semi-transparente */
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  /* Borde tenue */
}

.cuota-grid-plan-de-pagos-por-cuota ion-checkbox {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  /* Tamaño del checkbox más pequeño */
  margin-right: 10px !important;
  --background-checked: #27ae60;
  /* Fondo verde cuando está seleccionado */
  --border-color: #fff;
  /* Borde blanco */
  --checkmark-color: #fff;
  /* Checkmark blanco */
}

.cuota-grid-plan-de-pagos-por-cuota ion-item {
  --padding-start: 0;
  background: transparent;
  /* Fondo transparente para ion-item */
}

@media (max-width: 768px) {
  .cuota-grid-plan-de-pagos-por-cuota ion-col {
    font-size: 0.9em;
    /* Fuente más pequeña en pantallas pequeñas */
  }
  .cuota-grid-plan-de-pagos-por-cuota .header {
    font-size: 1em;
    /* Ajuste de fuente en encabezado */
  }
  .cuota-grid-plan-de-pagos-por-cuota ion-badge {
    font-size: 0.8em;
    /* Ajuste de tamaño del badge */
  }
}

.cuota-grid-plan-de-pagos-por-cuota .total-text {
  color: white;
  font-size: 14px;
  font-weight: bold;
}

.cuota-grid-plan-de-pagos-por-cuota .total-amount {
  font-size: 24px;
  font-weight: bold;
  color: white;
}

.cuota-grid-plan-de-pagos-por-cuota .custom-button {
  background-color: black;
  color: white;
  padding: 10px 20px;
  border-radius: 10px;
  font-size: 16px;
  text-align: center;
  display: inline-block;
  cursor: pointer;
}

.cuota-grid-plan-de-pagos-por-cuota .ion-footer {
  background-color: gray;
}

.cuota-grid-plan-de-pagos-por-cuota .ion-footer #total-text {
  color: white;
  font-size: 14px;
  font-weight: bold;
}

.cuota-grid-plan-de-pagos-por-cuota .ion-footer #custom-button {
  background-color: black;
  color: white;
  padding: 10px 20px;
  border-radius: 10px;
  font-size: 16px;
  text-align: center;
  display: inline-block;
  cursor: pointer;
}

.cuota-grid-plan-de-pagos-por-cuota .ion-footer #custom-button:hover {
  background-color: #555;
}

.cuota-grid-plan-de-pagos-por-cuota .custom-button:hover {
  background-color: #555;
}

.cuota-grid-plan-de-pagos-por-cuota #total-text {
  color: white;
  font-size: 14px;
  font-weight: bold;
}

.cuota-grid-plan-de-pagos-por-cuota #total-amount {
  font-size: 24px;
  font-weight: bold;
  color: white;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

page-cuentas-por-cobrar-creditos-visualizar .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

.cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

.cuota:first-child {
  font-weight: bold;
}

.cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col:first-child {
  width: 15%;
}

/* Estilos para las filas de cuotas */
.cuota {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col {
  border-right: 1px solid #ccc;
}

.cuota-col:last-child {
  border: none;
}

.cuota-extra:first-child {
  font-weight: bold;
}

.cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

/* Estilos para las filas de cuotas */
.cuota-extra {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col-extra {
  border-right: 1px solid #ccc;
}

.header-row {
  background: #1c1c1d;
  color: #fff;
  font-size: 18px;
}

ion-col {
  cursor: pointer;
}

.selectHover:hover {
  background-color: #4c4949;
  color: white;
}

.selecttext {
  color: white;
  background-color: #298;
  border-radius: 8px;
  margin: 4px;
  padding: 4px;
}

.selecttext:hover {
  background-color: transparent;
}

.ion-content {
  --background: #fff;
}

.ion-content .paginador {
  cursor: pointer;
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.ion-content .paginador:hover {
  background-color: #e53935;
}

.ion-content .paginador #input {
  color: cadetblue;
}

.ion-content .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

.ion-content .row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: whitesmoke;
  cursor: pointer;
}

.ion-content .col {
  width: 33.33%;
  margin-right: 10px;
}

.ion-content .col:last-child {
  margin-right: 0;
}

#customsearchbar {
  --background: #f0f0f0;
  /* Color de fondo de la caja de texto */
  --color: #ddd7d7;
  /* Color del texto */
  --placeholder-color: #f3efef;
  /* Color del placeholder */
  --input-background: #ffffff;
  /* Color de fondo del input */
  --input-color: #000000;
  /* Color del texto en el input */
}

ion-grid {
  --ion-grid-padding: 16px;
}

ion-col {
  padding: 10px;
}

.cuentaporcobrar {
  width: 100%;
  margin-top: 5px;
}

ion-item {
  background: #f9f9f9;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  margin-bottom: 15px;
  padding: 10px;
}

ion-badge {
  font-size: 14px;
  padding: 5px 10px;
  border-radius: 5px;
}

.centered-col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  /* Ajusta la altura para centrar verticalmente */
  text-align: center;
  padding: 15px;
}

.centered-text {
  font-size: 1.2em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* Hace que el texto sea más destacado */
  padding: 10px;
  color: #164372;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
  background-color: #f0f0f5;
  /* Fondo suave para el texto */
}

.resaltar-col {
  background-color: #ffeeba;
  /* Color de fondo amarillo claro */
  color: #333;
  /* Color de texto oscuro */
  font-weight: bold;
  /* Texto en negrita */
  border-radius: 5px;
  /* Bordes redondeados */
  padding: 10px;
  /* Espaciado interno */
}

.plan-de-pagos-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  /* Fondo semitransparente más oscuro */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 1000;
  /* Asegura que el div esté por encima de otros elementos */
  -webkit-animation: fadeIn 0.3s ease-in-out;
  animation: fadeIn 0.3s ease-in-out;
  /* Añade una animación de aparición */
}

.plan-de-pagos-container {
  background: #f7f7f7;
  padding: 20px;
  border-radius: 12px;
  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  width: 90%;
  max-width: 500px;
  -webkit-animation: slideInUp 0.3s ease-in-out;
  animation: slideInUp 0.3s ease-in-out;
  /* Añade una animación de deslizamiento */
}

.plan-de-pagos-container h2 {
  margin-top: 0;
  color: #333;
  font-size: 1.5em;
  text-align: center;
  border-bottom: 2px solid #007bff;
  padding-bottom: 10px;
}

.plan-de-pagos-container ion-list {
  margin-top: 20px;
  max-height: 300px;
  overflow-y: auto;
  /* Añade scroll si la lista es muy larga */
}

.plan-de-pagos-container ion-item {
  cursor: pointer;
  background: #ffffff;
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-bottom: 10px;
  -webkit-transition: background 0.3s, -webkit-transform 0.3s;
  transition: background 0.3s, -webkit-transform 0.3s;
  transition: background 0.3s, transform 0.3s;
  transition: background 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.plan-de-pagos-container ion-item:hover {
  background: #007bff;
  /* Cambia el color de fondo al hacer hover */
  color: #fff;
  /* Cambia el color del texto al hacer hover */
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
  /* Efecto de zoom al hacer hover */
}

.plan-de-pagos-container p {
  margin: 5px 0;
}

.plan-de-pagos-container button {
  display: block;
  width: 100%;
  margin-top: 20px;
  background-color: #007bff;
  color: #fff;
  border-radius: 8px;
  font-size: 1.2em;
}

.first-item ion-badge.payment-badge {
  background-color: red !important;
}

.cuota-grid .cuota ion-badge {
  background-color: blue;
  margin-bottom: 2px !important;
}

.cuota-grid .cuota.first-item ion-col {
  background-color: #ff4d4d !important;
  color: white;
}

.cuota-grid .cuota.first-item ion-col ion-badge {
  background-color: #c70039 !important;
}

.cuota-grid .cuota.first-item ion-col ion-input {
  border: 2px solid #c70039;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

page-cuentas-por-cobrar-creditos-visualizar-plan-de-pagos .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

.cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

.cuota:first-child {
  font-weight: bold;
}

.cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col:first-child {
  width: 15%;
}

/* Estilos para las filas de cuotas */
.cuota {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col {
  border-right: 1px solid #ccc;
}

.cuota-col:last-child {
  border: none;
}

.cuota-extra:first-child {
  font-weight: bold;
}

.cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

/* Estilos para las filas de cuotas */
.cuota-extra {
  text-align: center;
}

/* Estilos para las celdas de cuota */
.cuota-col-extra {
  border-right: 1px solid #ccc;
}

.header-row {
  background: #1c1c1d;
  color: #fff;
  font-size: 18px;
}

ion-col {
  cursor: pointer;
}

.selectHover:hover {
  background-color: #4c4949;
  color: white;
}

.selecttext {
  color: white;
  background-color: #298;
  border-radius: 8px;
  margin: 4px;
  padding: 4px;
}

.selecttext:hover {
  background-color: transparent;
}

.ion-content {
  --background: #fff;
}

.ion-content .paginador {
  cursor: pointer;
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.ion-content .paginador:hover {
  background-color: #e53935;
}

.ion-content .paginador #input {
  color: cadetblue;
}

.ion-content .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

.ion-content .row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: whitesmoke;
  cursor: pointer;
}

.ion-content .col {
  width: 33.33%;
  margin-right: 10px;
}

.ion-content .col:last-child {
  margin-right: 0;
}

#customsearchbar {
  --background: #f0f0f0;
  /* Color de fondo de la caja de texto */
  --color: #ddd7d7;
  /* Color del texto */
  --placeholder-color: #f3efef;
  /* Color del placeholder */
  --input-background: #ffffff;
  /* Color de fondo del input */
  --input-color: #000000;
  /* Color del texto en el input */
}

ion-grid {
  --ion-grid-padding: 16px;
}

ion-col {
  padding: 10px;
}

.cuentaporcobrar {
  width: 100%;
  margin-top: 5px;
}

ion-item {
  background: #f9f9f9;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  margin-bottom: 15px;
  padding: 10px;
}

ion-badge {
  font-size: 14px;
  padding: 5px 10px;
  border-radius: 5px;
}

.centered-col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  /* Ajusta la altura para centrar verticalmente */
  text-align: center;
  padding: 15px;
}

.centered-text {
  font-size: 1.2em;
  /* Aumenta el tamaño del texto */
  font-weight: bold;
  /* Hace que el texto sea más destacado */
  padding: 10px;
  color: #164372;
  /* Color primario o el color que desees usar */
  border-radius: 8px;
  /* Bordes redondeados para suavizar el diseño */
  background-color: #f0f0f5;
  /* Fondo suave para el texto */
}

.resaltar-col {
  background-color: #ffeeba;
  /* Color de fondo amarillo claro */
  color: #333;
  /* Color de texto oscuro */
  font-weight: bold;
  /* Texto en negrita */
  border-radius: 5px;
  /* Bordes redondeados */
  padding: 10px;
  /* Espaciado interno */
}

.plan-de-pagos-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  /* Fondo semitransparente más oscuro */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: 1000;
  /* Asegura que el div esté por encima de otros elementos */
  -webkit-animation: fadeIn 0.3s ease-in-out;
  animation: fadeIn 0.3s ease-in-out;
  /* Añade una animación de aparición */
}

.plan-de-pagos-container {
  background: #f7f7f7;
  padding: 20px;
  border-radius: 12px;
  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
  width: 90%;
  max-width: 500px;
  -webkit-animation: slideInUp 0.3s ease-in-out;
  animation: slideInUp 0.3s ease-in-out;
  /* Añade una animación de deslizamiento */
}

.plan-de-pagos-container h2 {
  margin-top: 0;
  color: #333;
  font-size: 1.5em;
  text-align: center;
  border-bottom: 2px solid #007bff;
  padding-bottom: 10px;
}

.plan-de-pagos-container ion-list {
  margin-top: 20px;
  max-height: 300px;
  overflow-y: auto;
  /* Añade scroll si la lista es muy larga */
}

.plan-de-pagos-container ion-item {
  cursor: pointer;
  background: #ffffff;
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-bottom: 10px;
  -webkit-transition: background 0.3s, -webkit-transform 0.3s;
  transition: background 0.3s, -webkit-transform 0.3s;
  transition: background 0.3s, transform 0.3s;
  transition: background 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.plan-de-pagos-container ion-item:hover {
  background: #007bff;
  /* Cambia el color de fondo al hacer hover */
  color: #fff;
  /* Cambia el color del texto al hacer hover */
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
  /* Efecto de zoom al hacer hover */
}

.plan-de-pagos-container p {
  margin: 5px 0;
}

.plan-de-pagos-container button {
  display: block;
  width: 100%;
  margin-top: 20px;
  background-color: #007bff;
  color: #fff;
  border-radius: 8px;
  font-size: 1.2em;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

page-desperdicios .end {
  float: right;
}

page-desperdicios .mita {
  width: 52%;
  float: left;
}

page-desperdicios .mita2 {
  width: 94%;
  float: left;
}

page-desperdicios .nombre {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

@media (min-width: 1200px) {
  page-desperdicios ion-card {
    position: relative;
    text-align: center;
    padding-bottom: 180px;
    height: 125px;
  }
  page-desperdicios .avatar {
    min-height: 45px;
  }
  page-desperdicios .letra {
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
  }
  page-desperdicios .card-title {
    position: absolute;
    top: 36%;
    font-size: 2.0em;
    width: 100%;
    font-weight: bold;
    color: #1b162b;
  }
  page-desperdicios .card-subtitle {
    font-size: 1.0em;
    position: absolute;
    top: 52%;
    width: 100%;
    color: #fff;
  }
  page-desperdicios img {
    min-height: 125px;
  }
}

page-desperdicios .item-input ion-input, page-desperdicios .item-input ion-textarea {
  position: static;
  width: 50px;
}

page-devolver-abonos .item-md .item-button .red {
  background-color: red;
}

page-devolver-abonos .item-md .item-button .green {
  background-color: #25d366;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

page-devolver-ventas ion-scroll {
  position: relative;
  display: block;
  color: #0e0d0d;
  width: 100% !important;
  height: 100% !important;
}

page-devolver-ventas .cuentaporcobrar {
  color: #202020;
}

page-devolver-ventas .pointerprint {
  cursor: pointer;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.inputTextArea textarea {
  text-align: left;
  font-size: 12px;
  padding-right: 0px;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

page-domicilios .divProductos {
  text-align: center;
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-domicilios .divGrupos {
  text-align: center;
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-domicilios .leftItem {
  float: left;
  width: 46%;
}

page-domicilios .rightItem {
  float: right;
  width: 46%;
}

page-domicilios .divGrupos::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.603);
}

page-domicilios .divFactura::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.603);
}

page-domicilios .divProductos::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-domicilios .divCaja::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-domicilios body::-webkit-scrollbar {
  width: 2px;
  background-color: violet;
}

page-domicilios .divCaja {
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-domicilios img {
  max-height: 55px;
  float: left;
}

page-domicilios .divFactura {
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-domicilios ion-card {
  position: relative;
  text-align: center;
  display: inline-block;
  width: 90% !important;
}

page-domicilios .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-domicilios .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-domicilios .inputPrecio input {
  text-align: right;
  font-size: 25px;
  border: 1px solid #567;
  padding-right: 0px;
}

page-domicilios page-domicilios .botondinamico {
  top: "0px";
  float: "left";
  width: "15px";
  height: "15px";
}

page-domicilios .imgmoneda {
  display: block;
  float: left !important;
  margin: auto;
  width: 100%;
  height: 55px;
  border: 1px solid #9c9c9c;
  border-radius: 25px;
}

page-domicilios .imgmonedamonedero {
  display: block;
  float: left !important;
  margin: auto;
  width: 10%;
  height: 85px;
  border: 1px solid #9c9c9c;
  border-radius: 25px;
}

page-domicilios .card-title {
  float: left;
}

page-domicilios .card-background-page ion-card {
  position: relative;
  text-align: center;
}

page-domicilios .card-background-page .card-title {
  position: absolute;
  top: 36%;
  font-size: 2.0em;
  width: 100%;
  font-weight: bold;
  color: #fff;
}

page-domicilios .card-background-page .card-subtitle {
  font-size: 1.0em;
  position: absolute;
  top: 52%;
  width: 100%;
  color: #fff;
}

page-domicilios .SinEntregar {
  background-color: #9c9c9c;
}

page-domicilios .Entregado {
  background-color: #006400;
  border-radius: 2px;
  padding: 2px;
}

page-domiciliosapp .ionsearchbar {
  width: 40% !important;
  float: right;
}

page-domiciliosapp .taginput {
  width: 30% !important;
  float: right;
}

page-domiciliosapp .numeroEnProceso {
  color: #12015c;
  width: 50%;
  font-size: 50px;
  margin-left: 290px;
  display: block;
  text-align: center;
  top: 0;
}

page-domiciliosapp .inputEnProceso {
  display: block;
  float: left;
  color: #12015c;
  width: 25%;
}

page-domiciliosapp .divProductos {
  text-align: center;
  height: calc(90vh - 35px);
  overflow-y: auto;
  width: 100%;
}

page-domiciliosapp .colorfecha {
  background-color: red;
}

page-domiciliosapp .divGrupos {
  text-align: center;
  background-color: white;
  height: calc(100vh - 35px);
  overflow-y: auto;
}

page-domiciliosapp .leftItem {
  float: left;
  width: 46%;
}

page-domiciliosapp .rightItem {
  float: right;
  width: 46%;
}

page-domiciliosapp .divGrupos::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.603);
}

page-domiciliosapp .divFactura::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.603);
}

page-domiciliosapp .divProductos::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-domiciliosapp .divCaja::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-domiciliosapp body::-webkit-scrollbar {
  width: 2px;
  background-color: violet;
}

page-domiciliosapp .divCaja {
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-domiciliosapp img {
  max-height: 55px;
  float: left;
}

page-domiciliosapp .divFactura {
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
}

page-domiciliosapp .pointerprint {
  cursor: pointer;
}

page-domiciliosapp .scroll-content {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
  display: block;
  overflow-x: hidden;
  overflow-y: hidden;
}

page-domiciliosapp ion-card {
  position: relative;
  text-align: center;
  display: inline-block;
  width: 27% !important;
  float: left;
  text-align: center;
}

page-domiciliosapp ion-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: inline;
}

page-domiciliosapp .afn {
  border-bottom: 5px solid;
  color: gray;
  cursor: pointer;
}

page-domiciliosapp .afn.clic {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-domiciliosapp .afn.clic:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

page-domiciliosapp .afn.animate {
  border-bottom: none;
}

page-domiciliosapp .afn.animate:before {
  content: "";
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 5px;
  background-color: red;
  width: 0%;
  border-radius: 0 0 5px 5px;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-domiciliosapp .afn.animate.col:before {
  background-color: gray;
}

page-domiciliosapp .afn.animate.colpro:before {
  background-color: #0c031c;
}

page-domiciliosapp .afn.animate:hover:before {
  width: 100%;
}

page-domiciliosapp .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-domiciliosapp .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-domiciliosapp .inputPrecio input {
  text-align: right;
  font-size: 25px;
  border: 1px solid #567;
  padding-right: 0px;
}

page-domiciliosapp page-caja .botondinamico {
  top: "0px";
  float: "left";
  width: "15px";
  height: "15px";
}

page-domiciliosapp .imgmoneda {
  display: block;
  float: left !important;
  margin: auto;
  width: 100%;
  height: 55px;
  border: 1px solid #9c9c9c;
  border-radius: 25px;
}

page-domiciliosapp .imgmonedamonedero {
  display: block;
  float: left !important;
  margin: auto;
  width: 10%;
  height: 85px;
  border: 1px solid #9c9c9c;
  border-radius: 25px;
}

page-domiciliosapp .card-title {
  float: left;
}

page-domiciliosapp .card-background-page ion-card {
  position: relative;
  text-align: center;
  border-bottom: 5px solid var(--red);
}

page-domiciliosapp .card-background-page .card-title {
  position: absolute;
  top: 36%;
  font-size: 2.0em;
  width: 100%;
  font-weight: bold;
  color: #fff;
}

page-domiciliosapp .card-background-page .card-subtitle {
  font-size: 1.0em;
  position: absolute;
  top: 52%;
  width: 100%;
  color: #fff;
}

page-domiciliosapp .card-background-page .cuentaporcobrar {
  color: #920f0f;
}

page-domiciliosapp .text-right {
  text-align: right;
}

page-domiciliosapp .text-left {
  text-align: left;
}

page-domiciliosapp .large-padding {
  padding: 10px 15px;
  font-size: 16px;
  padding-right: 6px;
  padding-bottom: 1px;
}

page-domiciliosapp .pointer {
  cursor: pointer;
}

page-domiciliosapp .no-background {
  background: transparent;
}

page-domiciliosapp .light-text {
  color: #0c031d;
}

page-domiciliosapp .contenedor {
  width: 100%;
  margin: 1px auto;
  display: grid;
  grid-gap: 1px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto);
  grid-template-areas: "header contenido";
}

page-domiciliosapp .contenedor > div {
  background: #fff;
  padding: 1px;
  border-radius: 2px;
}

page-domiciliosapp .contenedor .header {
  background: #12203E;
  color: #fff;
  grid-area: header;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  grid-column-start: 1;
  grid-column-end: -1;
}

page-domiciliosapp .contenedor .prueba2 {
  background: #fAA43D;
}

page-domiciliosapp .contenedor .contenido {
  grid-area: contenido;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #12203E;
}

page-domiciliosapp .contenedor .sidebar {
  grid-column: 2 / -1;
  background: #fAA43D;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  left: 0;
}

page-domiciliosapp .menu-fixed {
  position: fixed;
  z-index: 1000;
  top: 0;
}

page-domiciliosapp .contenedor .footer {
  background: #12203E;
  color: #fff;
  grid-area: footer;
}

page-domiciliosapp [icon-only] ion-icon {
  font-size: 2.9em !important;
}

page-domiciliosapp ion-badge {
  padding: 10px 10px !important;
}

page-domiciliosapp .end {
  float: right;
}

page-domiciliosapp .left {
  float: left;
}

page-domiciliosapp .bar-button-md[icon-only] ion-icon {
  padding: 1.0em !important;
}

page-domiciliosapp .item-md .item-button {
  padding: 5 0.6em;
  height: 35px;
  font-size: 2.4rem;
}

@media screen and (max-width: 768px) {
  page-domiciliosapp .contenedor {
    width: 100%;
    margin: 1px auto;
    display: grid;
    grid-gap: 1px;
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(1, auto);
    grid-template-areas: "header" "contenido";
  }
  page-domiciliosapp .divGrupos {
    text-align: center;
    background-color: white;
    height: calc(30vh - 35px);
    overflow-y: auto;
    width: 100%;
  }
  page-domiciliosapp .divProductos {
    text-align: center;
    background-color: white;
    height: calc(60vh - 35px);
    overflow-y: auto;
    width: 100%;
  }
  page-domiciliosapp .ionsearchbar {
    width: 60% !important;
    float: right;
  }
  page-domiciliosapp .taginput {
    width: 100% !important;
    float: right;
  }
  page-domiciliosapp .inputEnProceso {
    display: block;
    float: left;
    color: #12015c;
    width: 100%;
  }
  page-domiciliosapp .numeroEnProceso {
    color: #12203E;
    width: 50%;
    font-size: 50px;
    margin-left: 1px;
    display: block;
    text-align: center;
    float: left;
    z-index: -1;
    position: fixed;
    top: 0;
  }
}

page-egresos-ingresos-diarios .image-container {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  z-index: 9999;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

page-egresos-ingresos-diarios .expanded-image {
  width: 100%;
  /* El doble del tamaño original */
  height: 100%;
  /* El doble del tamaño original */
  max-width: none;
  /* Permite sobrepasar el ancho máximo si es necesario */
  max-height: none;
  /* Permite sobrepasar la altura máxima si es necesario */
}

page-egresos-ingresos-diarios .close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

page-egresos-ingresos-diarios .close:hover {
  background-color: #ff6666;
  /* Cambiar color de fondo al pasar el ratón por encima */
}

page-exportarventas .data-scroll {
  background-color: #dad4d4;
  width: 100%;
  height: 50%;
}

page-exportarventas .data-scrollproducto {
  background-color: #436d6e;
  width: 100%;
  height: 100%;
}

page-exportarventas .data-table {
  min-width: 800px;
}

.gray-background-card {
  background-color: gray;
  margin-top: 13px !important;
  padding: 20px;
  /* Aumenta el espacio interno del card */
  border-radius: 8px;
  height: auto;
  /* Permite que la altura se ajuste automáticamente al contenido */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  /* Evita que el contenido desborde */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* Incluye el padding en el ancho total */
}

#card-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

#card-content:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Agranda el div al pasar el mouse */
  -webkit-box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  /* Agrega una sombra para resaltar el div */
  color: #b7a9a9;
  background-color: #434545;
  border-radius: 12px;
}

.card-image {
  width: 40px;
  /* Ajusta el tamaño de la imagen */
  height: 40px;
  /* Ajusta la altura de la imagen */
  margin-right: 12px;
  /* Espacio entre la imagen y el texto */
  -o-object-fit: contain;
  object-fit: contain;
  max-width: 100%;
  /* Ajusta la imagen para que no exceda el ancho del card */
}

#card-title {
  font-size: 20px;
  /* Aumenta el tamaño del texto */
  color: white;
}

:host {
  display: block;
  width: 100%;
}

.gray-background-card {
  background-color: #f5f5f5;
  border-radius: 10px;
  padding: 20px;
  -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.info-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 15px;
  background-color: #ffffff;
  border-radius: 8px;
  margin-bottom: 20px;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.valor-total h2, .valor-restante h2 {
  font-weight: bold;
  margin: 0;
  font-size: 18px;
}

.valor-total h2 {
  color: #333;
}

.valor-restante h2 {
  color: #28a745;
}

.valor-restante.negativo h2 {
  color: #dc3545;
}

.forma-pago-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 10px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.forma-pago-chip {
  background-color: #ffffff;
  color: #333;
  font-size: 14px;
  padding: 10px 15px;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 20px;
  width: 48%;
  /* Ajuste al 50% para que quepan dos por fila */
  min-width: 120px;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.forma-pago-chip:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Efecto de hover */
}

.forma-pago-imagen {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-right: 10px;
}

.forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
}

.forma-pago-nombre {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 5px;
}

.forma-pago-input {
  margin-top: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 8px;
  width: 100%;
  font-size: 14px;
}

.forma-pago-input:focus {
  border-color: #28a745;
  /* Cambio de color al hacer foco */
  outline: none;
}

page-gestion-cambio-precio-por-producto .text-input {
  color: #f9f3f3;
}

.fullscreen-modal {
  height: 100%;
  width: 100%;
}

.inputPrecio input {
  text-align: right;
  font-size: 25px;
  border: 1px solid #567;
  padding-right: 0px;
}

#footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

.pointerprint {
  cursor: pointer;
}

.grabando {
  background-color: red;
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

/* Estilo cuando está detenido (por defecto o de otro color) */
.detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

.grabando {
  background-color: red;
  color: white;
  padding: 15px 2px 25px 2px;
  margin: 15px 2px 25px 2px;
}

/* Estilo cuando está detenido (por defecto o de otro color) */
.detenido {
  background-color: #5a626b;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
  padding: 15px 2px 25px 2px;
  margin: 15px 2px 25px 2px;
}

.section-title {
  font-size: 2em;
  font-weight: bold;
  color: #1f1d3e;
  margin-bottom: 15px;
  text-align: center;
}

.custom-item {
  background-color: #f9f9f9;
  border-radius: 8px;
  margin-bottom: 10px;
  padding: 15px;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.item-title {
  font-size: 1.2em;
  font-weight: 600;
  color: white;
  margin-bottom: 5px;
}

.item-detail {
  font-size: 1em;
  color: white;
  font-weight: 300;
}

.valor-class {
  color: #3880ff;
  /* Color azul para "Valor" */
  font-weight: bold;
  /* Texto en negrita */
  background-color: #e0f7fa;
  /* Fondo suave */
  padding: 5px 10px;
  /* Espaciado */
  border-radius: 5px;
  /* Bordes redondeados */
}

.valornumerocuota {
  color: #307855;
  /* Color azul para "Valor" */
  font-weight: bold;
  /* Texto en negrita */
  background-color: #e0f7fa;
  /* Fondo suave */
  padding: 5px 10px;
  /* Espaciado */
  border-radius: 5px;
  /* Bordes redondeados */
}

.porcentaje-class {
  color: #eb445a;
  /* Color rojo para "Porcentaje" */
  font-weight: bold;
  /* Texto en negrita */
  background-color: #ffe0e0;
  /* Fondo suave */
  padding: 5px 10px;
  /* Espaciado */
  border-radius: 5px;
  /* Bordes redondeados */
}

.numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

.numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

.arrastrarValor {
  background-color: #004085;
  /* Azul oscuro profesional */
  color: #ffffff;
  /* Texto blanco */
  font-size: 16px;
  /* Tamaño de fuente ligeramente más grande */
  font-weight: 500;
  /* Peso de fuente medio */
  text-transform: uppercase;
  /* Texto en mayúsculas */
  border-radius: 5px;
  /* Bordes suavemente redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
  padding: 2px 5px;
  /* Espaciado interno */
}

.arrastrarValor ion-icon {
  font-size: 18px;
  margin-right: 10px;
}

.arrastrarValor:hover {
  background-color: #002752;
  /* Color más oscuro en hover */
}

.arrastrarValor:active {
  background-color: #282c31;
  /* Color más oscuro al presionar */
}

page-gestionar-pedido {
  /* Estilo cuando está detenido (por defecto o de otro color) */
}

page-gestionar-pedido .inputPrecio input {
  text-align: right;
  font-size: 25px;
  border: 1px solid #567;
  padding-right: 0px;
}

page-gestionar-pedido #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

page-gestionar-pedido ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

page-gestionar-pedido .pointerprint {
  cursor: pointer;
}

page-gestionar-pedido .grabando {
  background-color: red;
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

page-gestionar-pedido .detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

.grabando {
  background-color: red;
  color: white;
  padding: 15px 2px 25px 2px;
  margin: 15px 2px 25px 2px;
}

/* Estilo cuando está detenido (por defecto o de otro color) */
.detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
  padding: 15px 2px 25px 2px;
  margin: 15px 2px 25px 2px;
}

page-graficas .data-scroll {
  background-color: #dad4d4;
  width: 100%;
  height: 50%;
}

page-graficas .data-scrollproducto {
  background-color: #436d6e;
  width: 100%;
  height: 100%;
}

page-graficas .data-table {
  min-width: 800px;
}

page-grid-denominaciones {
  /* Ajuste de estilos para adaptabilidad */
  /* Ejemplo de estilo para hacer los campos de entrada blancos */
  /* Aplicar estilos a la fila para distribuir de forma horizontal */
  /* Ajustar el tamaño de las columnas para ocupar el ancho disponible */
  /* Ajustar la distribución de elementos */
  /* Ajustar el tamaño de las columnas para que se muestren en una sola fila */
}

page-grid-denominaciones .mita {
  width: 60%;
  float: left;
}

page-grid-denominaciones .mita2 {
  width: 37%;
  float: right;
}

page-grid-denominaciones .nombre {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-grid-denominaciones .imgmoneda {
  display: block;
  margin: auto;
  width: 20%;
}

page-grid-denominaciones .label2 {
  color: #051153;
  font-weight: bold;
  text-align: left;
  font-size: 28px;
  float: left;
}

page-grid-denominaciones .label13 {
  color: #130822;
  font-weight: bold;
  text-align: center;
  display: block;
  font-size: 10px;
  float: left;
}

page-grid-denominaciones .label15 {
  color: rgba(7, 128, 27, 0.918);
  font-weight: bold;
  text-align: left;
  display: block;
  font-size: 28px;
  float: left;
}

page-grid-denominaciones .label16 {
  color: #ff0419;
  font-weight: bold;
  text-align: left;
  display: block;
  font-size: 28px;
  float: left;
}

page-grid-denominaciones .imgmoneda {
  display: block;
  margin: auto;
  float: left;
}

page-grid-denominaciones .mitad1 {
  width: 48%;
  float: left;
  padding: 1%;
  /* Agregar un pequeño espacio entre los elementos */
}

page-grid-denominaciones .mitad2 {
  width: 48%;
  float: right;
  padding: 1%;
  /* Agregar un pequeño espacio entre los elementos */
}

page-grid-denominaciones ion-input {
  background-color: white;
  /* Hacer que el fondo del campo de entrada sea blanco */
  border: 0.5px solid #ccc;
  /* Agregar un borde para resaltar los campos de entrada */
}

page-grid-denominaciones .img-reducida {
  max-width: 125px;
  height: auto;
  /* Permite que la altura se ajuste automáticamente para mantener la proporción */
  display: block;
  /* Asegura que la imagen se muestre como un elemento de bloque */
  margin: 0 auto;
  /* Centra la imagen horizontalmente en su contenedor */
}

page-grid-denominaciones .mita ion-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Hace que los elementos se alineen horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente los elementos */
}

page-grid-denominaciones .mita ion-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permite que los elementos se distribuyan en múltiples líneas cuando no quepan todos en una sola fila */
}

page-grid-denominaciones .mita ion-col {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 50%;
  -ms-flex: 1 1 50%;
  flex: 1 1 50%;
  /* Establece que las columnas ocupen el 50% del ancho disponible, permitiendo que dos elementos se alineen en la misma fila */
  max-width: 50%;
  /* Evita que los elementos crezcan más allá del 50% del ancho disponible */
}

page-grid-denominaciones .mita ion-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utilizar flexbox para alinear elementos */
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  /* Evitar que los elementos se envuelvan (nowrap) */
  overflow-x: auto;
  /* Permitir desplazamiento horizontal si el contenido no cabe en el ancho disponible */
}

page-grid-denominaciones .mita ion-col {
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* Permitir que las columnas crezcan para ocupar el espacio disponible */
  max-width: 100%;
  /* Establecer el ancho máximo al 100% para que las columnas ocupen todo el espacio disponible */
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  /* Resetear el ancho inicial para permitir la distribución equitativa */
}

page-grid-denominaciones .afn {
  border-bottom: 5px solid;
  color: gray;
  cursor: pointer;
}

page-grid-denominaciones .afn.clic {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-grid-denominaciones .afn.clic:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

page-grid-denominaciones .afn.animate {
  border-bottom: none;
}

page-grid-denominaciones .afn.animate:before {
  content: "afn";
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 5px;
  background-color: red;
  width: 0%;
  border-radius: 0 0 5px 5px;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-grid-denominaciones .afn.animate.col:before {
  background-color: gray;
}

page-grid-denominaciones .afn.animate.colpro:before {
  background-color: #0c031c;
}

page-grid-denominaciones .afn.animate:hover:before {
  width: 100%;
}

page-grid-denominaciones .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-grid-denominaciones .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-grid-denominaciones .inputTextArea textarea {
  text-align: left;
  font-size: 18px;
  padding-right: 0px;
}

page-grid-denominaciones .inputPrecio input {
  text-align: right;
  font-size: 25px;
  border: 1px solid #567;
  padding-right: 0px;
  color: white;
}

page-grid-denominaciones .divProductos {
  text-align: center;
  background-color: white;
  height: calc(50vh - 35px);
  overflow-y: auto;
  width: 100% !important;
}

page-grid-denominaciones ion-card {
  position: relative;
  text-align: center;
  display: inline-block;
  width: 90% !important;
}

page-grid-denominaciones .Products-item {
  position: relative;
  border-radius: 8px;
  background-color: #241717;
  width: 100%;
}

page-grid-denominaciones .Products-item .orderId {
  grid-area: orderId;
}

page-grid-denominaciones .Products-item .orderId p {
  position: absolute;
  vertical-align: middle;
  color: #121212 !important;
  padding-top: 13px;
  font-size: 13px !important;
  white-space: nowrap;
  /* Evita que el texto se divida en varias líneas */
  text-overflow: ellipsis;
  /* Agrega puntos suspensivos (...) al final del texto si no cabe en el contenedor */
  overflow: hidden;
  /* Oculta cualquier texto que sobrepase el contenedor */
  left: 0;
  /* Alinea el texto a la izquierda */
  right: 0;
  /* Alinea el texto a la derecha */
}

page-grid-denominaciones .Products-item .edit {
  grid-area: edit;
  margin-top: 2px;
  margin-bottom: -4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-grid-denominaciones .Products-item .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

page-grid-denominaciones .Products-item .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 35px;
}

page-grid-denominaciones .Products-item .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-grid-denominaciones .Products-item .editprecio {
  grid-area: edit;
  margin-top: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-grid-denominaciones .Products-item .editprecio .wrapperprecio {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: end;
  -ms-flex-align: end;
  align-items: end;
  background: #FFF;
}

page-grid-denominaciones .Products-item .editprecio .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-grid-denominaciones .Products-item .editprecio .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  color: #FFF;
  font-weight: bold;
  pointer-events: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-grid-denominaciones .Products-item-img {
  width: 100%;
  background-color: white;
  -o-object-fit: cover;
  object-fit: cover;
  grid-area: image;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-grid-denominaciones .Products-item-img #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding-right: 40px;
  height: 50px;
  max-width: none;
  width: 120px;
}

page-grid-denominaciones .Products-item-img #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-grid-denominaciones .wrapper {
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
  margin-top: 2px !important;
}

page-grid-denominaciones .wrapperdenominaciones {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

page-grid-denominaciones .item {
  min-width: 100px;
  height: auto;
  position: relative;
}

page-grid-denominaciones #imggrupos {
  height: 80px;
  display: block;
  outline: 1px solid #361717;
  margin: 2px;
}

page-grid-denominaciones .custom-button-enviar-cierre {
  background-color: #6c7308;
  /* Verde */
  color: white;
  border-radius: 12px;
  padding: 10px 20px;
  border: none;
  font-size: 16px;
  -webkit-transition: background-color 0.3s, -webkit-transform 0.3s;
  transition: background-color 0.3s, -webkit-transform 0.3s;
  transition: background-color 0.3s, transform 0.3s;
  transition: background-color 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

page-grid-denominaciones .custom-button-enviar-cierre:hover {
  background-color: #61670c;
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

page-grid-denominaciones .custom-button-enviar-cierre:active {
  background-color: #6e7136;
}

page-grid-denominaciones .custom-icon-enviar-cierre {
  background-color: white;
  border-radius: 50%;
  padding: 5px;
  color: #8e9340;
  /* Verde */
  font-size: 20px;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

page-grid-denominaciones .custom-button-enviar-cierre:hover .custom-icon {
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}

@media (max-width: 600px) {
  page-grid-denominaciones .div {
    width: 100% !important;
    float: left !important;
  }
  page-grid-denominaciones .afn {
    width: 100% !important;
  }
  page-grid-denominaciones .mita {
    width: 100%;
    float: left;
  }
  page-grid-denominaciones .mita2 {
    width: 100%;
    float: right;
  }
}

@media (max-width: 800px) {
  page-grid-denominaciones .div {
    width: 100% !important;
    float: left !important;
  }
  page-grid-denominaciones .afn {
    width: 100% !important;
  }
  page-grid-denominaciones .mita {
    width: 100%;
    float: left;
  }
  page-grid-denominaciones .mita2 {
    width: 100%;
    float: right;
  }
}

page-grid-denominaciones .loading-content {
  text-align: center;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
}

page-grid-denominaciones .loading-spinner {
  margin: 20px auto;
}

page-grid-denominaciones .forma-pago-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permite que los elementos se envuelvan si no caben en una fila */
  gap: 7px;
  /* Espacio entre los chips */
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  /* Alinea los chips a la izquierda */
  padding: 15px 0;
  /* Espaciado interno */
}

page-grid-denominaciones .forma-pago-chip {
  background-color: #ffffff;
  /* Fondo blanco */
  color: #333;
  /* Color de texto */
  border-radius: 20px;
  /* Bordes redondeados */
  font-size: 14px;
  /* Tamaño de fuente */
  padding: 5px 10px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra para profundidad */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Display flex para alinear imagen y texto */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
  white-space: nowrap;
  /* Evita que el texto se divida en múltiples líneas */
  min-width: 80px;
  /* Ancho mínimo para los chips */
  max-width: 100%;
  /* Ancho máximo opcional para los chips */
  height: 60px;
}

page-grid-denominaciones .forma-pago-imagen {
  width: 30px;
  /* Tamaño de la imagen */
  height: 30px;
  border-radius: 50%;
  /* Redondear la imagen */
  margin-right: 2px;
  /* Espacio entre la imagen y el texto */
}

page-grid-denominaciones .forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

page-grid-denominaciones .forma-pago-nombre {
  font-weight: bold;
  /* Nombre en negrita */
  font-size: 15px;
  /* Tamaño de fuente más grande */
}

page-grid-denominaciones .forma-pago-detalles {
  font-size: 13px;
  /* Tamaño de fuente para detalles */
  color: #666;
  /* Color de texto gris */
}

page-grid-denominaciones .ioninput {
  margin-top: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 5px;
  width: 100%;
}

page-grid-denominaciones .forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

page-grid-denominaciones ion-input {
  margin-top: 5px;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 5px;
  width: 100%;
}

page-grid-proveedores .ionselecttipe-modal .select-interface {
  max-width: 90%;
  max-height: 70%;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

page-grid-proveedores .ionselecttipe-modal .select-icon-inner {
  display: none;
}

page-grid-proveedores .ionselecttipe-modal .select-popover {
  background-color: rgba(255, 255, 255, 0.95);
  border-radius: 10px;
}

page-grid-proveedores .ionselecttipe-modal .select-popover .select-text {
  color: #333;
}

page-grid-proveedores .ionselecttipe-modal .select-popover .select-placeholder {
  color: #999;
}

page-grid-proveedores .ionselecttipe-modal .select-popover .select-searchbar {
  display: none;
}

page-grid-proveedores .color-proveedor {
  color: white;
}

page-grid-proveedores .afn {
  float: left !important;
}

page-grid-proveedores .cuentaporcobrar {
  color: white;
}

page-grid-proveedores button {
  margin: 5px;
  width: 10%;
}

page-grid-proveedores .card-md {
  -webkit-box-shadow: none;
  box-shadow: none;
}

page-grid-proveedores .mita {
  float: left;
  width: 40% !important;
  height: 43% !important;
}

page-grid-proveedores .mita2 {
  width: 80px;
  margin-left: -10px;
  float: right;
}

page-grid-proveedores .avatarimg {
  height: 100% !important;
  width: 40px !important;
  background-repeat: no-repeat !important;
  background-position: 50% !important;
  border-radius: 50% !important;
  background-size: 100% auto !important;
}

page-grid-proveedores #notification-button {
  position: relative;
  width: 42px;
  top: 1px;
  right: 1px;
  overflow: visible !important;
}

page-grid-proveedores #notifications-badge {
  position: absolute;
  top: -3px;
  right: -3px;
  border-radius: 100%;
}

page-grid-proveedores .select-searchable {
  color: white;
}

page-grid-proveedores .custom-notification-button {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #f8f9fa;
  /* Fondo del botón */
  border-radius: 50%;
  /* Hacer el botón circular */
  width: 50px;
  height: 50px;
  -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra para darle un efecto 3D */
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
}

page-grid-proveedores .custom-notification-button:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  /* Efecto de agrandamiento al pasar el mouse por encima */
}

page-grid-proveedores .custom-icon {
  font-size: 20px;
  /* Tamaño del ícono */
  color: #007bff;
  /* Color del ícono */
}

page-grid-proveedores .custom-badge {
  position: absolute;
  top: -15px;
  /* Ajusta la posición del badge */
  right: -15px;
  background-color: #dc3545;
  /* Color de fondo del badge */
  color: white;
  /* Color del texto del badge */
  font-size: 12px;
  /* Tamaño del texto en el badge */
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

page-grid-proveedores .custom-edit-button {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #f8f9fa;
  /* Fondo del botón */
  border-radius: 50%;
  /* Hacer el botón circular */
  width: 50px;
  height: 50px;
  -webkit-box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra para darle un efecto 3D */
  -webkit-transition: -webkit-transform 0.2s;
  transition: -webkit-transform 0.2s;
  transition: transform 0.2s;
  transition: transform 0.2s, -webkit-transform 0.2s;
}

page-grid-proveedores .custom-edit-button:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  /* Efecto de agrandamiento al pasar el mouse por encima */
}

@media (max-width: 600px) {
  page-grid-proveedores .color-proveedor {
    color: white;
  }
  page-grid-proveedores .div {
    width: 100% !important;
    float: left !important;
  }
  page-grid-proveedores .afn {
    width: 100% !important;
  }
}

.ioncontent {
  --background: #fff;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-y: auto;
}

.ioncontent .paginador {
  cursor: pointer;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.ioncontent .paginador:hover {
  background-color: #e53935;
}

.ioncontent .paginador #input {
  color: cadetblue;
}

.ioncontent .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

.ioncontent .ionGrd {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  background: white;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: #2c2929;
  cursor: pointer;
}

.ioncontent .col {
  width: 33.33%;
  margin-right: 10px;
}

.ioncontent .col:last-child {
  margin-right: 0;
}

.ionfooter {
  background-color: aliceblue;
}

.ticket {
  width: 200px;
  /* Ancho del ticket */
  padding: 20px;
  /* Espacio interno del ticket */
  background-color: #f3f3f3;
  /* Color de fondo del ticket */
  border: 2px solid #333;
  /* Borde del ticket */
  border-radius: 8px;
  /* Bordes redondeados */
  position: relative;
  /* Establecer posición relativa para elementos internos */
}

.ticket:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  /* Triángulo superior */
  border-bottom-color: #333;
  /* Color del triángulo */
  border-top-width: 0;
  /* Ocultar borde superior */
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  /* Centrar triángulo horizontalmente */
}

.ticket:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10px;
  height: 10px;
  background-color: #333;
  /* Punto en la esquina inferior izquierda */
}

.ticket_content {
  font-family: Arial, sans-serif;
  /* Fuente del contenido */
  color: #333;
  /* Color del texto */
}

.ticket_content h2 {
  font-size: 16px;
  /* Tamaño del título */
  margin: 0 0 10px;
  /* Margen inferior del título */
}

.ticket_content p {
  font-size: 14px;
  /* Tamaño del texto */
  margin: 0;
  /* Eliminar margen del párrafo */
}

.gestion {
  grid-area: gestion;
}

.ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

.numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
  margin-bottom: 4px;
}

/* Estilos para la vista de "response" */
@media only screen and (max-width: 600px) {
  .container {
    grid-template-columns: 1fr;
    /* Cambiar a una sola columna en vista de "response" */
    grid-template-rows: auto;
    /* Permitir filas flexibles en vista de "response" */
    grid-template-areas: "productos" "gestion";
  }
  .productos {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
  }
  /* Cambiar el orden en vista de "response" */
  .gestion {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
    -ms-flex-order: 2;
    order: 2;
  }
  /* Cambiar el orden en vista de "response" */
}

.inputPrecioProveedores {
  width: 100% !important;
  /* Por defecto ocupa todo el ancho */
  max-width: 600px;
  /* Limita el ancho en pantallas grandes */
  background: white !important;
  border-radius: 12px;
  padding: 8px;
  color: #383636;
  display: block;
  margin: 0 auto;
  /* Centra en pantallas grandes */
}

@media (max-width: 768px) {
  .inputPrecioProveedores {
    max-width: 100% !important;
    /* En móviles ocupa el 100% */
  }
}

page-grupos-productos-domicilios-descripcion ion-buttons button[icon-only].my-style-for-modal {
  margin: 0 6px;
  min-width: 50px;
}

page-grupos-productos-domicilios-descripcion div.input-wrapper {
  text-align: center !important;
}

page-grupos-productos-domicilios-descripcion div.input-wrapper .left {
  text-align: left !important;
}

page-grupos-productos-domicilios-descripcion .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-grupos-productos-domicilios-descripcion .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-grupos-productos-domicilios-descripcion .carrito-numeroguardar {
  position: absolute;
  top: -1px;
  left: 5px;
  color: white;
  background-color: #e44d12ea;
  text-align: left;
  float: right;
}

page-grupos-productos-domicilios-descripcion [icon-only] ion-icon {
  font-size: 2.9em !important;
}

page-grupos-productos-domicilios-descripcion ion-badge {
  padding: 10px 10px !important;
}

page-grupos-productos-domicilios-descripcion .end {
  float: right;
}

page-grupos-productos-domicilios-descripcion .left {
  float: left;
}

page-grupos-productos-domicilios-descripcion .bar-button-md[icon-only] ion-icon {
  padding: 1.0em !important;
}

page-grupos-reservas-por-producto #image-container {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 80%;
  height: 80%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 20px;
  z-index: 9999;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

page-grupos-reservas-por-producto #expanded-buscar-producto {
  max-width: 90vw;
  max-height: 90vh;
}

page-grupos-reservas-por-producto #expanded-image {
  width: 100%;
  /* El doble del tamaño original */
  height: 100%;
  /* El doble del tamaño original */
  max-width: none;
  /* Permite sobrepasar el ancho máximo si es necesario */
  max-height: none;
  /* Permite sobrepasar la altura máxima si es necesario */
}

page-grupos-reservas-por-producto #close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

page-grupos-reservas-por-producto #close-producto {
  cursor: pointer;
  font-size: 24px;
  /* Tamaño de la fuente */
  color: #ffffff;
  /* Color del texto */
  background-color: #ff0000;
  /* Color de fondo */
  width: 30px;
  /* Ancho del área de clic */
  height: 30px;
  /* Altura del área de clic */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Mostrar como elemento flex */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinear verticalmente al centro */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Alinear horizontalmente al centro */
  border-radius: 50%;
  /* Forma redondeada */
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  /* Sombra */
}

page-grupos-reservas-por-producto #close:hover {
  background-color: #ff6666;
  /* Cambiar color de fondo al pasar el ratón por encima */
}

page-grupos-reservas-por-producto .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-grupos-reservas-por-producto .colorfecha {
  background-color: red;
}

page-grupos-reservas-por-producto .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

page-grupos-reservas-por-producto .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

page-grupos-reservas-por-producto .puntero {
  cursor: pointer;
}

page-grupos-reservas-por-producto .end {
  float: right;
}

page-grupos-reservas-por-producto .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

page-grupos-reservas-por-producto .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

page-grupos-productos #file-input {
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0;
  z-index: 999;
}

page-grupos-productos .end {
  float: right;
}

page-home .carrito-numero {
  position: absolute;
  top: -3px;
  left: 5px;
  color: white;
  background-color: #e44d12ea;
  text-align: left;
}

page-home ion-content {
  background-color: #000000 !important;
}

page-home ion-content .gridcontenedor {
  top: 50px !important;
}

page-home .footer {
  width: 100%;
  padding-top: 1px;
  background: black;
  color: white;
  font-weight: bold;
  font-size: 4px;
  text-align: center;
  position: absolute;
  /*Here's what sticks it*/
  bottom: 0;
  /*to the bottom of the body/page*/
  left: 0;
  /*and to the left of the body/page.*/
}

page-home .footer-left {
  text-align: left;
}

page-home a {
  color: #4c4fe6;
  font-size: 4px;
}

page-home .footer-center {
  text-align: center;
  color: white;
  font-weight: bold;
  padding-top: 20px;
}

page-home .end {
  float: right;
}

page-home .grid {
  padding: 0px;
}

page-home .grid .slides .overlay {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.4)));
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

page-home .grid .slides .slider-img {
  height: 220px;
  width: 100%;
  position: relative;
  z-index: -111;
}

page-home .grid .slides .slider-text {
  color: #fff;
  font-size: 22px;
  padding: 5px;
  position: absolute;
  bottom: 0;
  margin: 5px 0px;
}

page-home .grid .slides .swiper-pagination-bullet {
  background: #042020 !important;
}

page-home .grid .card-title {
  position: absolute;
  top: 36%;
  font-size: 2.0em;
  width: 100%;
  font-weight: bold;
  color: #fff;
}

page-home .grid .carsito {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

page-home .grid .carsito h2 {
  margin-top: -12px;
  font-size: 2.7rem;
  color: rgba(66, 66, 66, 0.87);
  font-weight: 500;
}

page-home .grid .carsito img {
  height: 110px;
  width: 100%;
  position: relative;
  z-index: -111;
}

page-home .grid .carsito .text-over-img {
  color: #fff;
  font-size: 18px;
  padding: 5px;
  background-color: rgba(119, 119, 119, 0.6);
  position: relative;
  width: 100%;
  margin: -34px 0px 0px 0px;
  text-align: center;
}

page-home .ios page-home .scroll-content, page-home .md page-home .scroll-content {
  background-color: #f4f4f4;
}

page-home .ios page-home ion-card-header, page-home .md page-home ion-card-header {
  font-weight: bold;
}

@media (max-width: 600px) {
  page-home canvas {
    width: 100% !important;
    float: left !important;
  }
}

page-home [logo] {
  width: 30%;
  height: 30%;
  bottom: 50%;
  left: 50%;
  margin-left: -50px;
  position: absolute;
  opacity: 0;
  background-repeat: no-repeat;
  background-position: 50%;
  border-radius: 50%;
  background-size: 100% auto;
}

@-webkit-keyframes logoAnimation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes logoAnimation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

page-home [animation] {
  -webkit-animation: logoAnimation 2s;
  -webkit-animation-fill-mode: forwards;
  animation: logoAnimation 2s;
  -webkit-animation-delay: 500ms;
  animation-delay: 500ms;
  animation-fill-mode: forwards;
}

page-home .splash-screen {
  position: fixed;
  width: 100%;
  height: 100%;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 10s;
  animation-duration: 10s;
  -webkit-animation-name: animationBackground;
  animation-name: animationBackground;
}

@-webkit-keyframes animationBackground {
  0% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
  25% {
    -webkit-transform: scale(1.12, 1.12) translate(-5px, -5px);
    transform: scale(1.12, 1.12) translate(-5px, -5px);
  }
  50% {
    -webkit-transform: scale(1.15, 1.15) translate(0px, 0px);
    transform: scale(1.15, 1.15) translate(0px, 0px);
  }
  75% {
    -webkit-transform: scale(1.13, 1.13) translate(5px, 5px);
    transform: scale(1.13, 1.13) translate(5px, 5px);
  }
  100% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
}

@keyframes animationBackground {
  0% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
  25% {
    -webkit-transform: scale(1.12, 1.12) translate(-5px, -5px);
    transform: scale(1.12, 1.12) translate(-5px, -5px);
  }
  50% {
    -webkit-transform: scale(1.15, 1.15) translate(0px, 0px);
    transform: scale(1.15, 1.15) translate(0px, 0px);
  }
  75% {
    -webkit-transform: scale(1.13, 1.13) translate(5px, 5px);
    transform: scale(1.13, 1.13) translate(5px, 5px);
  }
  100% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
}

page-home .card-background-page ion-card {
  position: relative;
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
}

page-home .card-background-page .card-title {
  position: absolute;
  top: 36%;
  font-size: 2.0em;
  width: 100%;
  font-weight: bold;
  color: #fff;
}

page-home .card-background-page .card-subtitle {
  font-size: 1.0em;
  position: absolute;
  top: 52%;
  width: 100%;
  color: #fff;
}

page-home button {
  border-radius: 12px !important;
}

page-home .banner-incumplimiento {
  background-color: red;
  color: white;
  font-size: 20px;
  text-align: center;
  padding: 20px;
  border: 3px solid yellow;
  -webkit-animation: parpadeo 1s infinite;
  animation: parpadeo 1s infinite;
}

page-home .banner-mensaje-general {
  background-color: #444e45;
  color: white;
  font-size: 20px;
  text-align: center;
  padding: 20px;
  border: 3px solid #80802d;
  -webkit-animation: parpadeo 1s infinite;
  animation: parpadeo 1s infinite;
}

page-home .alerta-estorbosa {
  background-color: red !important;
  color: white !important;
  text-align: center;
  font-size: 22px;
  font-weight: bold;
}

page-home .alerta-estorbosa .alert-wrapper {
  border: 5px solid yellow;
  background-color: red !important;
  -webkit-animation: parpadeo 1s infinite;
  animation: parpadeo 1s infinite;
}

page-home .alerta-estorbosa .alert-title {
  font-size: 24px !important;
  color: yellow !important;
}

page-home .alerta-estorbosa .alert-sub-title {
  font-size: 20px !important;
  color: white !important;
}

page-home .alerta-estorbosa .alert-button {
  font-size: 18px !important;
  background-color: yellow !important;
  color: red !important;
}

page-home .btn-redirigir {
  background-color: #007bff;
  /* Azul brillante */
  color: white;
  border: none;
  border-radius: 5px;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  -webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease;
  transition: background-color 0.3s ease, -webkit-transform 0.3s ease;
  transition: background-color 0.3s ease, transform 0.3s ease;
  transition: background-color 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease;
}

page-home .btn-redirigir:hover {
  background-color: #0056b3;
  /* Azul más oscuro en hover */
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Efecto de aumento al pasar el mouse */
}

page-home .btn-redirigir:focus {
  outline: none;
  -webkit-box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.5);
  box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.5);
}

@-webkit-keyframes parpadeo {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}

@keyframes parpadeo {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}

.banner-mensaje-general-html {
  background-color: linear-gradient(to right, #f5f5f5, #e0e0e0);
  /* Azul vibrante */
  color: white;
  padding: 20px;
  border-radius: 10px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.6;
}

.banner-mensaje-general-html a {
  color: yellow;
  /* Enlaces más visibles */
  font-size: 20px;
  /* Aumentar tamaño de fuente */
  font-weight: bold;
  text-decoration: none;
  display: inline-block;
  margin-top: 5px;
}

.banner-mensaje-general-html a:hover {
  text-decoration: underline;
}

page-impresora-bluetooth .afn {
  font-size: 10px;
  text-align: left !important;
  width: 2000px !important;
  font-size: 20px;
  /* Cambiar el tamaño de la letra */
  font-style: italic;
  /* Cambiar el estilo de la letra */
  text-align: center;
  /* Centrar el texto */
}

page-impresora-bluetooth img {
  width: 190px;
}

@media print {
  page-impresora-bluetooth .oculto-impresion, page-impresora-bluetooth .oculto-impresion * {
    display: none !important;
  }
}

page-impresora-bluetooth .botonNoMostrar {
  display: none !important;
}

page-imprimir .afn {
  font-size: 12px;
  width: 2450px;
  text-align: left;
  -webkit-align-content: left;
  -ms-flex-line-pack: left;
  align-content: left;
}

page-imprimir td,
page-imprimir th,
page-imprimir tr,
page-imprimir table {
  border-top: 1px solid black;
  border-collapse: collapse;
}

page-imprimir td.producto,
page-imprimir th.producto {
  width: 75px;
  max-width: 75px;
}

page-imprimir td.cantidad,
page-imprimir th.cantidad {
  width: 40px;
  max-width: 40px;
  word-break: break-all;
}

page-imprimir td.precio,
page-imprimir th.precio {
  width: 40px;
  max-width: 40px;
  word-break: break-all;
}

page-imprimir .centrado {
  text-align: left;
  -webkit-align-content: left;
  -ms-flex-line-pack: left;
  align-content: left;
}

page-imprimir .ticket {
  width: 155px;
  max-width: 155px;
}

page-imprimir img {
  width: 190px;
}

@media print {
  page-imprimir .oculto-impresion, page-imprimir .oculto-impresion * {
    display: none !important;
  }
}

page-imprimir .botonNoMostrar {
  display: none !important;
}

.gray-background-card {
  background-color: #817b7b;
  margin-top: 13px !important;
  padding: 20px;
  /* Aumenta el espacio interno del card */
  border-radius: 8px;
  height: auto;
  /* Permite que la altura se ajuste automáticamente al contenido */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  /* Evita que el contenido desborde */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* Incluye el padding en el ancho total */
}

#card-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

#card-content:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Agranda el div al pasar el mouse */
  -webkit-box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  /* Agrega una sombra para resaltar el div */
  color: #b7a9a9;
  background-color: #434545;
  border-radius: 12px;
}

.card-image {
  width: 40px;
  /* Ajusta el tamaño de la imagen */
  height: 40px;
  /* Ajusta la altura de la imagen */
  margin-right: 12px;
  /* Espacio entre la imagen y el texto */
  -o-object-fit: contain;
  object-fit: contain;
  max-width: 100%;
  /* Ajusta la imagen para que no exceda el ancho del card */
}

#card-title {
  font-size: 20px;
  /* Aumenta el tamaño del texto */
  color: white;
}

page-informe-balance-negocio ion-scroll {
  position: relative;
  display: block;
  color: red;
  width: 100% !important;
  height: 100% !important;
}

page-informe-cantidades-descontadas-inventario-por-dia ion-scroll {
  position: relative;
  display: block;
  color: red;
  width: 100% !important;
  height: 100% !important;
}

page-informe-cuentas-por-cobrar .item-md .item-button .red {
  background-color: red;
}

page-informe-cuentas-por-cobrar .item-md .item-button .green {
  background-color: #25d366;
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.progress-container {
  width: 100%;
  background-color: #ccc;
  border-radius: 5px;
  overflow: hidden;
}

.progress-bar {
  height: 10px;
  background-color: #4caf50;
  -webkit-transition: width 0.3s ease-in-out;
  transition: width 0.3s ease-in-out;
}

.progress-container {
  width: 100%;
  background-color: #2c2f33;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  height: 30px;
}

.progress-bar {
  height: 100%;
  background: -webkit-gradient(linear, left top, right top, from(#4caf50), to(#8bc34a));
  background: linear-gradient(90deg, #4caf50, #8bc34a);
  -webkit-transition: width 0.3s ease-in-out;
  transition: width 0.3s ease-in-out;
}

.progress-text {
  position: absolute;
  width: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align: center;
  color: white;
  font-weight: bold;
  font-size: 14px;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

page-informe-existencias-productos-actuales .mita {
  width: 60%;
  float: left;
}

page-informe-existencias-productos-actuales .mita2 {
  width: 37%;
  float: right;
}

page-informe-existencias-productos-actuales .nombre {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-informe-existencias-productos-actuales .imgmoneda {
  display: block;
  margin: auto;
  width: 20%;
}

page-informe-existencias-productos-actuales .label2 {
  color: #051153;
  font-weight: bold;
  text-align: left;
  font-size: 28px;
  float: left;
}

page-informe-existencias-productos-actuales .label13 {
  color: #130822;
  font-weight: bold;
  text-align: center;
  display: block;
  font-size: 10px;
  float: left;
}

page-informe-existencias-productos-actuales .label15 {
  color: rgba(7, 128, 27, 0.918);
  font-weight: bold;
  text-align: left;
  display: block;
  font-size: 28px;
  float: left;
}

page-informe-existencias-productos-actuales .label16 {
  color: #ff0419;
  font-weight: bold;
  text-align: left;
  display: block;
  font-size: 28px;
  float: left;
}

page-informe-existencias-productos-actuales .imgmoneda {
  display: block;
  margin: auto;
  float: left;
}

@media (max-width: 600px) {
  page-informe-existencias-productos-actuales .div {
    width: 100% !important;
    float: left !important;
  }
  page-informe-existencias-productos-actuales .afn {
    width: 100% !important;
  }
  page-informe-existencias-productos-actuales .mita {
    width: 100%;
    float: left;
  }
  page-informe-existencias-productos-actuales .mita2 {
    width: 100%;
    float: right;
  }
}

@media (max-width: 800px) {
  page-informe-existencias-productos-actuales .div {
    width: 100% !important;
    float: left !important;
  }
  page-informe-existencias-productos-actuales .afn {
    width: 100% !important;
  }
  page-informe-existencias-productos-actuales .mita {
    width: 100%;
    float: left;
  }
  page-informe-existencias-productos-actuales .mita2 {
    width: 100%;
    float: right;
  }
}

page-informe-gestiones .data-scroll-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 10px;
  /* Espaciado interno para mejorar la apariencia */
  margin: 0;
  /* Elimina el margen para aprovechar mejor el espacio */
}

page-informe-gestiones .data-scroll {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: auto;
}

page-informe-gestiones .data-table {
  width: 100%;
  border-collapse: collapse;
  /* Mejora el aspecto de la tabla */
  margin-top: 10px;
  /* Espacio superior para separación visual */
}

page-informe-gestiones .data-table td, page-informe-gestiones .data-table th {
  border: 1px solid #ddd;
  /* Agrega bordes a las celdas de la tabla */
  padding: 8px;
  /* Añade espacio interno en las celdas */
  text-align: center;
  /* Alinea el texto al centro */
}

page-informe-gestiones .data-table th {
  background-color: #f2f2f2;
  /* Agrega un color de fondo para diferenciar los encabezados */
}

page-informe-gestiones .form-control {
  width: 100%;
  /* Ajusta el ancho del input al 100% */
  padding: 6px;
  /* Añade un poco de espacio interno al input */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* Asegura que el padding no incremente el tamaño total */
  margin-top: 5px;
  /* Espacio superior para separación visual */
}

page-informe-gestiones .box {
  margin-bottom: 20px;
  /* Agrega margen inferior para separación visual */
  padding: 10px;
  /* Espaciado interno para mejorar la apariencia */
  border: 1px solid #ddd;
  /* Agrega un borde al contenedor */
}

page-informe-productos-vendidos-por-dias ion-scroll {
  position: relative;
  display: block;
  color: red;
  width: 100% !important;
  height: 100% !important;
}

page-informe-reimprimir-recibo-caja ion-scroll {
  position: relative;
  display: block;
  color: #886969;
  width: 100% !important;
  height: 100% !important;
}

page-informe-reimprimir-recibo-caja .cuentaporcobrar {
  color: #744b4b;
}

page-informe-reimprimir-recibo-caja .pointerprint {
  cursor: pointer;
}

.grid-recibo-caja ion-row {
  background: #2c3e50;
  /* Color de fondo profesional (gris oscuro/azul) */
  padding: 0;
  margin: 0;
}

.grid-recibo-caja ion-col {
  padding: 0 !important;
  margin: 0 !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

.grid-recibo-caja .cuota-col {
  min-height: 2.5em;
  /* Tamaño adaptable */
  max-height: 3em;
  line-height: 1.2;
}

.grid-recibo-caja .header {
  font-weight: bold;
  color: white;
  /* Letra blanca */
  min-height: 3em;
  max-height: 3.5em;
  text-transform: uppercase;
  /* Mayúsculas para estilo profesional */
}

.grid-recibo-caja ion-badge {
  font-size: 0.9em;
  /* Fuente más pequeña para adaptabilidad */
  padding: 5px;
  height: auto;
  background-color: #2980b9;
  /* Color de fondo azul profesional */
  color: white;
  /* Letra blanca */
  border-radius: 8px;
  /* Bordes ligeramente redondeados */
}

.grid-recibo-caja ion-input {
  height: auto;
  font-size: 1em;
  padding: 0 5px;
  color: white;
  /* Letra blanca */
  background-color: rgba(255, 255, 255, 0.1);
  /* Fondo semi-transparente */
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  /* Borde tenue */
}

.grid-recibo-caja ion-checkbox {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  /* Tamaño del checkbox más pequeño */
  margin-right: 10px !important;
  --background-checked: #27ae60;
  /* Fondo verde cuando está seleccionado */
  --border-color: #fff;
  /* Borde blanco */
  --checkmark-color: #fff;
  /* Checkmark blanco */
}

.grid-recibo-caja ion-item {
  --padding-start: 0;
  background: transparent;
  /* Fondo transparente para ion-item */
}

.grid-recibo-caja .fechas {
  position: relative;
}

.grid-recibo-caja .fechas ion-input {
  width: calc(100% - 40px);
  /* Ajusta el ancho para dejar espacio para el icono */
  padding-right: 40px;
  /* Añade padding a la derecha para el icono */
}

.grid-recibo-caja .fechas .calendar-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 24px;
  color: #007bff;
  /* Color del icono */
}

page-informe-ventas-devueltas ion-scroll {
  position: relative;
  display: block;
  color: red;
  width: 100% !important;
  height: 100% !important;
}

.factura-header {
  background-color: #58595a;
  /* Color de fondo del encabezado */
  border-bottom: 2px solid #2d6cc4;
  /* Borde inferior del encabezado */
}

.factura-header .toolbar-background {
  background-color: transparent;
  /* Fondo transparente para la barra de herramientas */
}

.factura-header .title {
  color: #4e4d4d;
  /* Color del texto del título */
}

/* Estilos para el fondo del componente */
.factura-venta {
  background-color: #c7c3c3;
  /* Color de fondo del componente */
  border: 1px solid #ddd;
  /* Borde del componente */
  padding: 10px;
  /* Espaciado interior */
  border-radius: 5px;
  /* Bordes redondeados */
}

.cuenta-page {
  background-color: #f2f2f2;
  /* Cambia el color de fondo del componente */
}

.cuenta-page ion-header {
  background-color: #3880ff;
  /* Color de fondo del encabezado */
  border-bottom: 2px solid #2d6cc4;
  /* Borde inferior del encabezado */
}

.cuenta-page .toolbar-background {
  background-color: transparent;
  /* Fondo transparente para la barra de herramientas */
}

.cuenta-page .cuenta-page-input {
  background-color: #534e4e;
}

.gray-background-card {
  background-color: #817b7b;
  margin-top: 13px !important;
  padding: 20px;
  /* Aumenta el espacio interno del card */
  border-radius: 8px;
  height: auto;
  /* Permite que la altura se ajuste automáticamente al contenido */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  /* Evita que el contenido desborde */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* Incluye el padding en el ancho total */
}

#card-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

#card-content:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Agranda el div al pasar el mouse */
  -webkit-box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  /* Agrega una sombra para resaltar el div */
  color: #b7a9a9;
  background-color: #434545;
  border-radius: 12px;
}

.card-image {
  width: 40px;
  /* Ajusta el tamaño de la imagen */
  height: 40px;
  /* Ajusta la altura de la imagen */
  margin-right: 12px;
  /* Espacio entre la imagen y el texto */
  -o-object-fit: contain;
  object-fit: contain;
  max-width: 100%;
  /* Ajusta la imagen para que no exceda el ancho del card */
}

#card-title {
  font-size: 20px;
  /* Aumenta el tamaño del texto */
  color: white;
}

.numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

.numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

.factura-header {
  background-color: #58595a;
  /* Color de fondo del encabezado */
  border-bottom: 2px solid #2d6cc4;
  /* Borde inferior del encabezado */
}

.factura-header .toolbar-background {
  background-color: transparent;
  /* Fondo transparente para la barra de herramientas */
}

.factura-header .title {
  color: #4e4d4d;
  /* Color del texto del título */
}

/* Estilos para el fondo del componente */
.factura-venta {
  background-color: #c7c3c3;
  /* Color de fondo del componente */
  border: 1px solid #ddd;
  /* Borde del componente */
  padding: 10px;
  /* Espaciado interior */
  border-radius: 5px;
  /* Bordes redondeados */
}

.cuenta-page {
  background-color: #f2f2f2;
  /* Cambia el color de fondo del componente */
}

.cuenta-page ion-header {
  background-color: #3880ff;
  /* Color de fondo del encabezado */
  border-bottom: 2px solid #2d6cc4;
  /* Borde inferior del encabezado */
}

.cuenta-page .toolbar-background {
  background-color: transparent;
  /* Fondo transparente para la barra de herramientas */
}

.cuenta-page .cuenta-page-input {
  background-color: #534e4e;
}

.gray-background-card {
  background-color: #817b7b;
  margin-top: 13px !important;
  padding: 20px;
  /* Aumenta el espacio interno del card */
  border-radius: 8px;
  height: auto;
  /* Permite que la altura se ajuste automáticamente al contenido */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  /* Evita que el contenido desborde */
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* Incluye el padding en el ancho total */
}

#card-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

#card-content:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  /* Agranda el div al pasar el mouse */
  -webkit-box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  box-shadow: 0 4px 8px rgba(159, 30, 30, 0.2);
  /* Agrega una sombra para resaltar el div */
  color: #b7a9a9;
  background-color: #434545;
  border-radius: 12px;
}

.card-image {
  width: 40px;
  /* Ajusta el tamaño de la imagen */
  height: 40px;
  /* Ajusta la altura de la imagen */
  margin-right: 12px;
  /* Espacio entre la imagen y el texto */
  -o-object-fit: contain;
  object-fit: contain;
  max-width: 100%;
  /* Ajusta la imagen para que no exceda el ancho del card */
}

#card-title {
  font-size: 20px;
  /* Aumenta el tamaño del texto */
  color: white;
}

.numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

.numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

.arrastrarValor {
  background-color: #004085;
  /* Azul oscuro profesional */
  color: #ffffff;
  /* Texto blanco */
  font-size: 16px;
  /* Tamaño de fuente ligeramente más grande */
  font-weight: 500;
  /* Peso de fuente medio */
  text-transform: uppercase;
  /* Texto en mayúsculas */
  border-radius: 5px;
  /* Bordes suavemente redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
  padding: 2px 5px;
  /* Espaciado interno */
}

.arrastrarValor ion-icon {
  font-size: 18px;
  margin-right: 10px;
}

.arrastrarValor:hover {
  background-color: #002752;
  /* Color más oscuro en hover */
}

.arrastrarValor:active {
  background-color: #282c31;
  /* Color más oscuro al presionar */
}

page-inventario {
  /* Eliminar márgenes y paddings predeterminados */
  /* Filas alternas para el estilo de Excel */
  /* Cambiar el color al pasar el ratón (hover) */
  /* Diseño responsivo */
  /* Estilo para el historial de cambios */
  /* Opcional: Estilos para las fechas */
  /* Estilos para el modal */
  /* Estilos globales para la barra de progreso */
}

page-inventario :host {
  --ion-background-color: #ffffff;
  /* Cambia el color de fondo a blanco */
  --ion-color-primary: transparent;
  /* Elimina el color primario de Ionic */
  --ion-color-secondary: transparent;
  /* Elimina el color secundario de Ionic */
}

page-inventario ion-content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que el contenido principal ocupe el espacio disponible */
}

page-inventario ion-header, page-inventario ion-content, page-inventario ion-footer {
  margin: 0;
  padding: 0;
  background: none;
  /* Eliminar fondo predeterminado */
}

page-inventario .excel-style-table {
  width: 100%;
  overflow-x: auto;
  /* Asegura que la tabla sea responsive */
  padding: 10px;
}

page-inventario table {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
  background-color: #fff;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  /* Sombras suaves para dar un toque profesional */
}

page-inventario th, page-inventario td {
  padding: 8px;
  text-align: center;
  border: 1px solid #b8b8b8;
  /* Bordes más claros para parecerse a Excel */
  font-size: 14px;
}

page-inventario th {
  background-color: #d9d9d9;
  /* Color gris claro para el encabezado */
  color: #333;
  font-weight: bold;
}

page-inventario td {
  background-color: #f9f9f9;
  /* Color de fondo suave para las celdas */
  color: #333;
}

page-inventario td ion-input {
  background-color: #e1e1e1;
  /* Color similar al fondo de celda editable de Excel */
  border-radius: 4px;
  padding: 6px;
  width: 100%;
  font-size: 14px;
  color: #333;
}

page-inventario td p {
  font-size: 14px;
  color: #333;
}

page-inventario td ion-input:focus {
  background-color: #d4e1f4;
  /* Color suave al enfocar el input (azul claro) */
}

page-inventario tr:nth-child(even) {
  background-color: #f1f1f1;
  /* Color de fondo de fila alterna */
}

page-inventario tr:hover {
  background-color: #e1f0ff;
  /* Azul suave cuando se pasa el ratón */
  cursor: pointer;
}

@media (max-width: 768px) {
  page-inventario table {
    font-size: 12px;
    /* Reduce el tamaño de la fuente en pantallas más pequeñas */
  }
}

page-inventario ion-card {
  margin-bottom: 15px;
}

page-inventario ion-card-header {
  background-color: #f2f2f2;
  padding: 10px;
}

page-inventario ion-card-title {
  font-weight: bold;
  font-size: 18px;
}

page-inventario ion-item {
  margin-top: 5px;
  padding: 10px;
  border-radius: 10px;
  background-color: #f8f8f8;
}

page-inventario ion-label {
  font-size: 14px;
}

page-inventario ion-label strong {
  color: #333;
}

page-inventario ion-label[color='primary'] {
  color: #007bff;
}

page-inventario span {
  font-weight: bold;
}

page-inventario span[style*="color: green;"] {
  color: green;
}

page-inventario span[style*="color: red;"] {
  color: red;
}

page-inventario ion-item ion-label {
  font-style: italic;
  font-size: 12px;
  color: #777;
}

page-inventario .modal {
  display: none;
  /* Inicialmente oculto */
  position: fixed;
  z-index: 1;
  /* Asegúrate de que el modal esté sobre otros elementos */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  /* Fondo oscuro */
  overflow: auto;
  /* Desplazamiento si es necesario */
}

page-inventario .modal-content {
  background-color: #fff;
  margin: 15% auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
  /* Puedes ajustar el tamaño */
}

page-inventario .close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

page-inventario .close:hover,
page-inventario .close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota ion-row {
  background: #2c3e50;
  /* Color de fondo profesional (gris oscuro/azul) */
  padding: 0;
  margin: 0;
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota ion-col {
  padding: 0 !important;
  margin: 0 !important;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota .cuota-col {
  min-height: 2.5em;
  /* Tamaño adaptable */
  max-height: 3em;
  line-height: 1.2;
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota .header {
  font-weight: bold;
  color: white;
  /* Letra blanca */
  min-height: 3em;
  max-height: 3.5em;
  text-transform: uppercase;
  /* Mayúsculas para estilo profesional */
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota ion-badge {
  font-size: 0.9em;
  /* Fuente más pequeña para adaptabilidad */
  padding: 5px;
  height: auto;
  background-color: #2980b9;
  /* Color de fondo azul profesional */
  color: white;
  /* Letra blanca */
  border-radius: 8px;
  /* Bordes ligeramente redondeados */
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota ion-input {
  height: auto;
  font-size: 1em;
  padding: 0 5px;
  color: white;
  /* Letra blanca */
  background-color: rgba(255, 255, 255, 0.1);
  /* Fondo semi-transparente */
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  /* Borde tenue */
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota ion-checkbox {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
  /* Tamaño del checkbox más pequeño */
  margin-right: 10px !important;
  --background-checked: #27ae60;
  /* Fondo verde cuando está seleccionado */
  --border-color: #fff;
  /* Borde blanco */
  --checkmark-color: #fff;
  /* Checkmark blanco */
}

page-inventario .cuota-grid-plan-de-pagos-por-cuota ion-item {
  --padding-start: 0;
  background: transparent;
  /* Fondo transparente para ion-item */
}

page-inventario ion-progress-bar {
  --background: #f3f4f6;
  /* Fondo de la barra */
  --color: #007bff;
  /* Color de la barra de progreso */
  height: 20px;
  /* Altura de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra sutil */
}

page-inventario .progress-container {
  padding: 10px;
  /* Espaciado alrededor de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  background-color: #e9ecef;
  /* Color de fondo de la contenedor */
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  /* Sombra para el contenedor */
}

page-inventario .progress-container {
  width: 100%;
}

page-inventario ion-progress-bar {
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  --background: #e0e0e0;
  /* Color de fondo de la barra */
  --progress-background: #4caf50;
  /* Color del progreso (verde) */
  --progress-background: #4caf50;
  height: 20px;
  /* Ajusta la altura según tus necesidades */
}

page-inventario .progress-container {
  width: 100%;
}

page-inventario .custom-progress {
  background-color: #4caf50;
  /* Color del progreso */
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  /* Animación suave */
  height: 20px;
  /* Altura de la barra */
  border-radius: 10px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra sutil */
}

page-inventario .clientes-grid {
  padding: 1px;
  background-color: #352727;
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

page-inventario .clientes-grid ion-item {
  margin-bottom: 15px;
}

page-inventario .clientes-grid ion-label {
  color: #333;
}

page-inventario .clientes-grid ion-input, page-inventario .clientes-grid ion-checkbox {
  --padding-start: 10px;
  --padding-end: 10px;
}

page-inventario .clientes-grid button[ion-button] {
  background-color: #007bff;
  color: #fff;
  border-radius: 5px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-inventario .clientes-grid button[ion-button]:hover {
  background-color: #0056b3;
}

page-inventario .clientes-grid .novedad {
  background-color: #004085;
  /* Azul oscuro profesional */
  color: #ffffff;
  /* Texto blanco */
  font-size: 16px;
  /* Tamaño de fuente ligeramente más grande */
  font-weight: 500;
  /* Peso de fuente medio */
  text-transform: uppercase;
  /* Texto en mayúsculas */
  border-radius: 5px;
  /* Bordes suavemente redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
  padding: 2px 5px;
  /* Espaciado interno */
}

page-inventario .clientes-grid .novedad ion-icon {
  font-size: 18px;
  margin-right: 10px;
}

page-inventario .clientes-grid .novedad:hover {
  background-color: #002752;
  /* Color más oscuro en hover */
}

page-inventario .clientes-grid .novedad:active {
  background-color: #282c31;
  /* Color más oscuro al presionar */
}

page-inventario .clientes-grid .cupo-label {
  font-size: 24px;
  /* Aumenta el tamaño de la fuente */
  font-weight: bold;
  text-align: center;
  width: 100%;
  padding: 10px;
  /* Añade padding para hacerlo más llamativo */
  border-radius: 8px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  /* Añade una sombra para destacar */
}

page-inventario .clientes-grid .cupo-label:hover {
  -webkit-transform: scale(2.2);
  transform: scale(2.2);
  /* Escala el componente al 120% de su tamaño original */
  -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
  /* Aumenta la sombra para hacerlo más llamativo */
}

page-inventario .clientes-grid .positivo {
  color: #28a745;
  /* Verde para positivo */
  background-color: #d4edda;
  /* Fondo verde claro */
}

page-inventario .clientes-grid .positivodescripcion {
  color: #c5d5c8;
  /* Verde para positivo */
  background-color: #3c453e;
  /* Fondo verde claro */
}

page-inventario .clientes-grid .cupo-label-descripcion {
  position: relative;
  /* Asegura que el contenido adicional se posicione correctamente */
  overflow: hidden;
  /* Oculta el contenido que se salga del contenedor por defecto */
  -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  /* Transición suave */
  font-size: 13px;
  /* Aumenta el tamaño de la fuente */
  font-weight: bold;
  text-align: center;
  width: 100%;
  padding: 5px;
  /* Añade padding para hacerlo más llamativo */
  border-radius: 8px 4px;
  /* Bordes redondeados */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

page-login .grid {
  padding: 0px;
}

page-login .grid .slides .overlay {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.4)));
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

page-login .grid .slides .slider-img {
  height: 220px;
  width: 100%;
  position: relative;
  z-index: -111;
}

page-login .grid .slides .slider-text {
  color: #fff;
  font-size: 22px;
  padding: 5px;
  position: absolute;
  bottom: 0;
  margin: 5px 0px;
}

page-login .grid .slides .swiper-pagination-bullet {
  background: #042020 !important;
}

page-login .grid .card-title {
  position: absolute;
  top: 36%;
  font-size: 2.0em;
  width: 100%;
  font-weight: bold;
  color: #fff;
}

page-login .grid .carsito {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

page-login .grid .carsito h2 {
  margin-top: -12px;
  font-size: 2.7rem;
  color: rgba(66, 66, 66, 0.87);
  font-weight: 500;
}

page-login .grid .carsito img {
  height: 110px;
  width: 100%;
  position: relative;
  z-index: -111;
}

page-login .grid .carsito .text-over-img {
  color: #fff;
  font-size: 18px;
  padding: 5px;
  background-color: rgba(119, 119, 119, 0.6);
  position: relative;
  width: 100%;
  margin: -34px 0px 0px 0px;
  text-align: center;
}

page-login ion-content .ionGrid .ionRow .ionCol .button-login {
  border-radius: 12px 12px 12px 12px !important;
}

page-login ion-content .ionGrid .ionRow .ionCol .ion-input {
  border-radius: 12px 12px 12px 12px !important;
  background-color: none !important;
}

page-login ion-content .ionGrid .ionRow .ionCol ion-item {
  background-color: transparent !important;
  color: white;
}

page-login ion-content .ionGrid .ionRow .ionCol .ionItem {
  background-color: transparent !important;
  color: white;
}

page-login .footer {
  width: 100%;
  height: 169px;
  padding-top: 1px;
  color: white;
  font-weight: bold;
  font-size: 4px;
  text-align: center;
  position: absolute;
  /*Here's what sticks it*/
  bottom: 0;
  /*to the bottom of the body/page*/
  left: 0;
  /*and to the left of the body/page.*/
}

page-login .demo {
  color: white;
  font-size: 25px;
}

page-login .item-inner {
  border-bottom-color: #8b6868;
  -webkit-box-shadow: inset 0 -1px 0 0 #f5ecec;
  box-shadow: inset 0 -1px 0 0 #efe9e9;
}

page-mesas #recorrer {
  position: absolute;
  width: 100%;
  height: auto;
}

page-mesas .dehabilitar {
  opacity: 0.2;
}

page-mesas .eliminar {
  display: inline-block;
}

page-mesas .eliminarCenter {
  width: 70%;
  text-align: center;
}

page-meseromesero {
  /* Estilo cuando está grabando (rojo) */
  /* Estilo cuando está detenido (por defecto o de otro color) */
}

page-meseromesero ion-header ion-icon {
  font-size: 30px;
  position: relative;
}

page-meseromesero ion-header #notifications-badge-msg {
  background-color: #4307e9;
  position: absolute;
  top: 5px;
  right: 95px;
  color: #fff;
  z-index: 111;
}

page-meseromesero ion-header #notifications-badge {
  background-color: #4307e9;
  position: absolute;
  top: 5px;
  right: 50px;
  color: #fff;
  z-index: 111;
}

page-meseromesero ion-header img {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  margin-right: 10px;
}

page-meseromesero ion-header .ch-menu {
  background-color: #252526;
  width: 100%;
}

page-meseromesero ion-header .ch-menu p {
  color: #efe7e7;
  height: 100%;
  width: 100%;
  margin-left: 20px;
  margin-right: 20px;
  font-size: 12px;
}

page-meseromesero ion-header .ch-menu .wrapper {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

page-meseromesero ion-header .ch-menu .wrapper .item {
  min-width: 100px;
  height: auto;
  position: relative;
}

page-meseromesero ion-header .ch-menu .wrapper .item #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-meseromesero ion-header .ch-menu .wrapper .item #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-meseromesero ion-header .ch-menu ion-grid ion-row ion-col .ionSearchbar {
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
  padding: 0px;
  border-radius: 12px;
  margin: 0px;
}

page-meseromesero ion-header .ch-menu ion-grid ion-row ion-col #numeromesap {
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
  max-width: 30px;
  border-radius: 12px;
  margin: 2px;
}

page-meseromesero ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

page-meseromesero ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas .itemmesas {
  height: auto;
  position: relative;
  display: contents;
}

page-meseromesero ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas::-webkit-scrollbar {
  width: 0.2px;
  border-radius: 2px;
  opacity: 0.2;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-meseromesero ion-header .ch-menu ion-card ion-card-header .cardHeader {
  background-color: #0c031d;
  color: #fff;
}

page-meseromesero ion-header .ch-menu ion-card ion-card-header .cardContent {
  padding: 0px 16px;
  max-height: 0px;
}

page-meseromesero ion-header ion-segment {
  background: #53414d;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-meseromesero ion-header ion-segment ion-segment-button {
  --background-checked: #54586a;
  --color-checked: #fff;
  --indicator-color: #444141;
  font-size: 18px;
  --color: white;
}

page-meseromesero ion-header ion-segment ion-segment-button ion-label {
  color: white;
}

page-meseromesero ion-header ion-segment ion-label {
  display: initial !important;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select {
  background-color: #fff;
  margin-top: 10px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  height: auto;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select ion-icon {
  font-size: 24px;
  color: red;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select img {
  width: 30px;
  height: 30px;
  margin-right: 10px;
  color: red;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select span {
  width: 30px;
  margin-right: 30px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  background-color: #298;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select .text {
  width: 30px;
  margin-right: 30px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-meseromesero ion-header .container-grid-select .upperBox-producto-select span.num {
  font-size: 22px;
  margin-right: 4px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-meseromesero ion-header .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-meseromesero ion-header .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-meseromesero ion-header .gestionpedido {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  position: relative;
}

page-meseromesero ion-header .gestionpedidoicon {
  margin-top: 2px;
}

page-meseromesero ion-header .enviarcomandaboton {
  background-color: black;
}

page-meseromesero ion-header .enviarcomandabotonReemprimir {
  background-color: #393838;
}

page-meseromesero ion-header .enviarcomandabotonReemprimirTotal {
  background-color: #4b3333;
}

page-meseromesero ion-header .enviarcomandabotonReemprimirIcon {
  font-size: 18px !important;
  color: white;
}

page-meseromesero ion-header .devolverVenta {
  border-radius: 2px 2px 2px 2px !important;
}

page-meseromesero ion-content {
  --background: #fff;
  /* Estilo cuando está detenido (por defecto o de otro color) */
}

page-meseromesero ion-content .numero_total_precioSelect {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-meseromesero ion-content .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-meseromesero ion-content #labelDescripcion {
  visibility: hidden;
}

page-meseromesero ion-content .img {
  background: black;
  overflow: hidden;
  height: 250px;
  width: 100%;
  position: relative;
}

page-meseromesero ion-content .img .top {
  margin-top: 40px;
  margin-left: 20px;
  margin-right: 20px;
  position: absolute;
  width: 100%;
  z-index: 999;
}

page-meseromesero ion-content .img .top .back_div {
  font-size: 30px;
  position: relative;
}

page-meseromesero ion-content .img .top .back_div #end {
  float: right;
  margin-right: 40px;
}

page-meseromesero ion-content .img .bottom {
  bottom: 10px;
  left: 10px;
  position: absolute;
  right: 10px;
  z-index: 80px;
  height: 80px;
  display: grid;
  grid-template-columns: 25% 55% 20%;
  grid-template-rows: 80px auto 80px;
  color: #fff;
}

page-meseromesero ion-content .img .bottom .first {
  justify-self: start;
}

page-meseromesero ion-content .img .bottom .first img {
  width: 70px;
  height: 70px;
  border-radius: 50px;
}

page-meseromesero ion-content .img .bottom .second {
  justify-self: start;
  -webkit-align-self: start;
  -ms-flex-item-align: start;
  align-self: start;
}

page-meseromesero ion-content .img .bottom .second h4 {
  margin-top: -3px;
}

page-meseromesero ion-content .img .bottom .second p {
  margin-top: -10px;
}

page-meseromesero ion-content .img .bottom .third h4 {
  margin-top: -5px;
}

page-meseromesero ion-content .img #myimg {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  opacity: 0.3;
}

page-meseromesero ion-content .content {
  margin-top: 105px;
}

page-meseromesero ion-content .content .overview span:nth-of-type(1) {
  color: gray;
}

page-meseromesero ion-content .content .overview span:nth-of-type(2) {
  color: red;
}

page-meseromesero ion-content .content .overview .intro {
  padding: 0px 20px;
  color: gray;
  margin-top: -10px;
  text-align: justify;
}

page-meseromesero ion-content .content .overview .intro span {
  color: red;
}

page-meseromesero ion-content .content .overview .hrs {
  padding-left: 10px;
  margin-top: -20px;
}

page-meseromesero ion-content .content .overview .hrs span {
  color: gray;
}

page-meseromesero ion-content .content .overview .hrs ion-icon {
  color: #91e710;
}

page-meseromesero ion-content .content .grid {
  text-align: center;
  background-color: white;
  height: calc(100% - 18px);
  overflow-y: auto;
  padding: 0px;
}

page-meseromesero ion-content .content .grid::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-meseromesero ion-content .content .gridSelect {
  height: calc(50vh - 1px);
  overflow-y: auto;
  margin-top: 50px !important;
}

page-meseromesero ion-content .content .gridSelect::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-meseromesero ion-content .content .gridSelectProduct {
  height: calc(50vh - 1px);
  overflow-y: auto;
}

page-meseromesero ion-content .content .gridSelectProduct::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-meseromesero ion-content .content .products {
  position: relative;
  text-align: center;
  display: -webkit-box !important;
  width: 33% !important;
}

page-meseromesero ion-content .content .top {
  background-color: #f9f9f9;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 1.95px 2.6px;
  height: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 20px;
}

page-meseromesero ion-content .content #date {
  padding-left: 20px;
}

page-meseromesero ion-content .content .container-grid {
  width: 100%;
  background: #54586a;
  border-radius: 8px;
  margin-right: 2px;
  margin-bottom: 2px;
}

page-meseromesero ion-content .content .container-grid .Products-item {
  position: relative;
}

page-meseromesero ion-content .content .container-grid .Products-item .orderId {
  grid-area: orderId;
}

page-meseromesero ion-content .content .container-grid .Products-item .orderId p {
  position: absolute;
  vertical-align: middle;
  color: #121212 !important;
  padding-top: 13px;
  font-size: 13px !important;
  white-space: nowrap;
  /* Evita que el texto se divida en varias líneas */
  text-overflow: ellipsis;
  /* Agrega puntos suspensivos (...) al final del texto si no cabe en el contenedor */
  overflow: hidden;
  /* Oculta cualquier texto que sobrepase el contenedor */
  left: 0;
  /* Alinea el texto a la izquierda */
  right: 0;
  /* Alinea el texto a la derecha */
}

page-meseromesero ion-content .content .container-grid .Products-item .edit {
  grid-area: edit;
  margin-top: 2px;
  margin-bottom: -4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-meseromesero ion-content .content .container-grid .Products-item .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

page-meseromesero ion-content .content .container-grid .Products-item .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 35px;
}

page-meseromesero ion-content .content .container-grid .Products-item .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-meseromesero ion-content .content .container-grid .Products-item .editprecio {
  grid-area: edit;
  margin-top: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-meseromesero ion-content .content .container-grid .Products-item .editprecio .wrapperprecio {
  height: auto;
  width: 100px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: end;
  -ms-flex-align: end;
  align-items: end;
  background: #FFF;
}

page-meseromesero ion-content .content .container-grid .Products-item .editprecio .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-meseromesero ion-content .content .container-grid .Products-item .editprecio .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  color: #FFF;
  font-weight: bold;
  pointer-events: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-meseromesero ion-content .content .container-grid .Products-item-img {
  width: 100%;
  background-color: white;
  -o-object-fit: cover;
  object-fit: cover;
  grid-area: image;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-meseromesero ion-content .content .container-grid .Products-item-img #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding-right: 40px;
  height: 50px;
  max-width: none;
  width: 120px;
}

page-meseromesero ion-content .content .container-grid .Products-item-img #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-meseromesero ion-content .content .upperBox {
  width: 100%;
  background-color: #fff;
  margin-top: 10px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  height: auto;
  display: grid;
  grid-template-columns: 40% 35% 15% 10%;
  grid-template-rows: 15% 35% 35% 15%;
  gap: 5px 5px;
  grid-template-areas: "image orderId orderId orderId" "image menu menu menu" "image title title title" "image amount status status" "image edit edit edit";
}

page-meseromesero ion-content .content .upperBox .image {
  grid-area: image;
}

page-meseromesero ion-content .content .upperBox .image #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding: 10px;
  border-radius: 5px;
  height: auto;
  width: 100%;
}

page-meseromesero ion-content .content .upperBox .image #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-meseromesero ion-content .content .upperBox .title {
  grid-area: title;
  color: blue;
}

page-meseromesero ion-content .content .upperBox .title h3 {
  font-size: 16px;
}

page-meseromesero ion-content .content .upperBox .menu {
  grid-area: menu;
  margin-right: 20px;
  justify-self: center;
}

page-meseromesero ion-content .content .upperBox .menu h3 ion-icon {
  margin-right: 10px;
  color: red;
}

page-meseromesero ion-content .content .upperBox .orderId {
  grid-area: orderId;
}

page-meseromesero ion-content .content .upperBox .orderId p {
  color: gray;
}

page-meseromesero ion-content .content .upperBox .amount {
  grid-area: amount;
  -webkit-align-self: start;
  -ms-flex-item-align: start;
  align-self: start;
  justify-self: start;
  margin-top: -25px;
}

page-meseromesero ion-content .content .upperBox .edit {
  grid-area: edit;
  margin-bottom: -4px;
  margin-right: 20px;
}

page-meseromesero ion-content .content .upperBox .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

page-meseromesero ion-content .content .upperBox .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-meseromesero ion-content .content .upperBox .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

@media screen and (min-width: 200px) {
  page-meseromesero ion-content .content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-meseromesero ion-content .content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 200px) and (max-width: 600px) {
  page-meseromesero ion-content .content .gridSelect {
    margin-top: 150px !important;
    height: calc(30vh - 1px);
  }
  page-meseromesero ion-content .content .gridSelect ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-meseromesero ion-content .content .gridSelectProduct {
    height: calc(30vh - 1px);
  }
  page-meseromesero ion-content .content .gridSelectProduct ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-meseromesero ion-content .content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-meseromesero ion-content .content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
  page-meseromesero ion-content .content page-meseromesero ion-content .content {
    margin-top: 22px !important;
  }
  page-meseromesero ion-content .content .content {
    margin-top: 22px !important;
  }
}

@media screen and (min-width: 600px) and (max-width: 1200px) {
  page-meseromesero ion-content .content page-meseromesero ion-content .content {
    margin-top: 18px !important;
  }
  page-meseromesero ion-content .content .content {
    margin-top: 18px !important;
  }
}

@media screen and (min-width: 200px) {
  page-meseromesero ion-content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-meseromesero ion-content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 200px) and (max-width: 600px) {
  page-meseromesero ion-content .gridSelect {
    margin-top: 150px !important;
    height: calc(30vh - 1px);
  }
  page-meseromesero ion-content .gridSelect ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-meseromesero ion-content .gridSelectProduct {
    height: calc(30vh - 1px);
    margin-top: 150px !important;
  }
  page-meseromesero ion-content .gridSelectProduct ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-meseromesero ion-content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-meseromesero ion-content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
  page-meseromesero ion-content page-meseromesero ion-content .content {
    margin-top: 27px !important;
  }
  page-meseromesero ion-content .content {
    margin-top: 28px !important;
  }
}

@media screen and (min-width: 601px) and (max-width: 799px) {
  page-meseromesero ion-content page-meseromesero ion-content .content {
    margin-top: 35px !important;
  }
  page-meseromesero ion-content .content {
    margin-top: 36px !important;
  }
}

@media screen and (min-width: 800px) and (max-width: 2000px) {
  page-meseromesero ion-content page-meseromesero ion-content .content {
    margin-top: 123px !important;
  }
  page-meseromesero ion-content .content {
    margin-top: 124px !important;
  }
}

@media screen and (min-width: 200px) and (max-width: 900px) {
  page-meseromesero ion-content .item-md ion-avatar ion-img, page-meseromesero ion-content .item-md ion-avatar img {
    display: none !important;
  }
  page-meseromesero ion-content ion-avatar img {
    display: none !important;
  }
  page-meseromesero ion-content .item-input ion-input, page-meseromesero ion-content .item-input ion-textarea {
    display: none !important;
  }
  page-meseromesero ion-content ion-textarea {
    display: none !important;
  }
  page-meseromesero ion-content .item-md ion-avatar[item-left], page-meseromesero ion-content .item-md ion-thumbnail[item-left], page-meseromesero ion-content .item-md ion-avatar[item-start], page-meseromesero ion-content .item-md ion-thumbnail[item-start] {
    display: none !important;
  }
  page-meseromesero ion-content #footer {
    height: 65px;
  }
}

page-meseromesero ion-content .grabando {
  background-color: red;
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

page-meseromesero ion-content .detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

page-meseromesero ion-content .descripcion-textarea {
  width: 100%;
  height: auto;
  /* Ajusta la altura según el contenido */
  padding: 0;
  /* Elimina el relleno para que ocupe el 100% del ancho */
  border: none;
  /* Elimina el borde si es necesario */
  resize: none;
  /* Evita que el usuario cambie el tamaño manualmente */
  overflow: hidden;
  /* Controla el desbordamiento de contenido si lo hubiera */
}

page-meseromesero #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

page-meseromesero .grabando {
  background-color: red;
  color: white;
}

page-meseromesero .detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
}

page-meseromesero ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

/* Estilo cuando está grabando (rojo) */
.grabando {
  background-color: red;
  color: white;
}

/* Estilo cuando está detenido (por defecto o de otro color) */
.detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
}

#buscarproductopedidosalon {
  color: white;
  padding: 20px;
}

page-parametros-creditos .titulo-parametros {
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}

page-parametros-creditos .responsive-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra los elementos horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinea los elementos verticalmente (en el caso de que haya más de una fila) */
}

page-parametros-creditos .responsive-item {
  width: 100%;
  /* Toma toda la anchura disponible */
  margin-bottom: 10px;
  /* Espaciado entre elementos */
}

page-parametros-creditos .button-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 20px;
  /* Añade un margen superior para separar el botón del formulario */
}

page-parametros-creditos .button-container {
  --background: #4CAF50;
  /* Color de fondo */
  --background-hover: #45a049;
  /* Color de fondo al pasar el mouse */
  --border-radius: 10px;
  /* Bordes redondeados */
  --padding-start: 15px;
  --padding-end: 15px;
  --padding-top: 10px;
  --padding-bottom: 10px;
  --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra del botón */
  --transition: background-color 0.3s ease;
  /* Suaviza el cambio de color al pasar el mouse */
  color: #4CAF50;
  /* Color del texto */
  font-size: 16px;
  /* Tamaño del texto */
}

page-parametros-creditos .button-container button:hover {
  --background: #45a049;
  /* Cambia el color de fondo al pasar el mouse */
  --box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
  /* Aumenta la sombra para dar un efecto de profundidad */
}

@media (min-width: 576px) {
  page-parametros-creditos .responsive-item {
    width: 48%;
    /* Ocupa el 48% en pantallas más grandes, dejando espacio entre los elementos */
  }
}

@media (min-width: 768px) {
  page-parametros-creditos .responsive-item {
    width: 32%;
    /* Ocupa el 32% en pantallas más grandes */
  }
}

page-parametros-generales ion-card {
  margin: 10px;
  border-radius: 8px;
}

page-parametros-generales ion-card-header {
  background-color: #f8f8f8;
  border-bottom: 1px solid #e0e0e0;
}

page-parametros-generales ion-card-title {
  font-size: 18px;
  font-weight: bold;
}

page-parametros-generales ion-item {
  margin: 5px 0;
}

page-parametros-generales ion-label {
  font-weight: bold;
}

page-parametros-generales ion-select {
  max-width: 100%;
}

page-parametros-generales .titulo-parametros {
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}

page-parametros-generales .responsive-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra los elementos horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Alinea los elementos verticalmente (en el caso de que haya más de una fila) */
}

page-parametros-generales .responsive-item {
  width: 100%;
  /* Toma toda la anchura disponible */
  margin-bottom: 10px;
  /* Espaciado entre elementos */
}

page-parametros-generales .button-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 20px;
  /* Añade un margen superior para separar el botón del formulario */
}

page-parametros-generales .button-container {
  --background: #4CAF50;
  /* Color de fondo */
  --background-hover: #45a049;
  /* Color de fondo al pasar el mouse */
  --border-radius: 10px;
  /* Bordes redondeados */
  --padding-start: 15px;
  --padding-end: 15px;
  --padding-top: 10px;
  --padding-bottom: 10px;
  --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra del botón */
  --transition: background-color 0.3s ease;
  /* Suaviza el cambio de color al pasar el mouse */
  color: #4CAF50;
  /* Color del texto */
  font-size: 16px;
  /* Tamaño del texto */
}

page-parametros-generales .button-container button:hover {
  --background: #45a049;
  /* Cambia el color de fondo al pasar el mouse */
  --box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
  /* Aumenta la sombra para dar un efecto de profundidad */
}

@media (min-width: 576px) {
  page-parametros-generales .responsive-item {
    width: 48%;
    /* Ocupa el 48% en pantallas más grandes, dejando espacio entre los elementos */
  }
}

@media (min-width: 768px) {
  page-parametros-generales .responsive-item {
    width: 32%;
    /* Ocupa el 32% en pantallas más grandes */
  }
}

page-permisos .end {
  float: right;
}

page-companias-usuarios .end {
  float: right;
}

.ion-card-personalizar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-width: 100%;
  margin: 10px;
  padding: 0;
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.ion-card-title-personalizar {
  font-size: 1.2em;
  /* Tamaño de fuente adecuado */
  margin: 0;
}

.ion-card-content-personalizar {
  font-size: 0.9em;
  /* Tamaño de fuente adecuado */
  padding: 10px;
  /* Espaciado dentro del card-content */
}

.ion-col-personalizar {
  --padding-start: 0;
  --padding-end: 0;
}

.ion-grid-personalizar {
  --ion-grid-padding: 0;
  /* Elimina el padding por defecto si es necesario */
  width: 100%;
  margin: 0 auto;
  /* Centra el grid si hay un límite de ancho */
}

.ion-row-personalizar {
  margin: 0;
  padding: 0;
}

.ion-thumbnail-personalizar {
  --size: 80px;
  /* Ajusta el tamaño del thumbnail según tus necesidades */
  border-radius: 8px;
  /* Agrega bordes redondeados */
  overflow: hidden;
  /* Asegura que las imágenes no se desborden */
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  /* Agrega una sombra sutil */
}

.ion-thumbnail-personalizar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.ion-list-personalizar {
  padding: 16px;
  border-radius: 8px;
  /* Agrega bordes redondeados a la lista */
  background-color: #ffffff;
  /* Cambia el color de fondo */
  -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  /* Agrega una sombra sutil */
}

.ion-label-personalizar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 16px;
}

.ion-label-personalizar h2 {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 8px 0;
}

.ion-label-personalizar p {
  font-size: 14px;
  color: #666;
  margin: 4px 0;
}

.ion-item-personalizar {
  margin: 10px 0;
}

.ion-select-personalizar {
  margin-left: 10px;
}

.ion-card-personalizar {
  margin: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.ion-card-personalizar:hover {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}

.ion-card-header-personalizar {
  background-color: #f8f9fa;
  border-bottom: 1px solid #e0e0e0;
}

.ion-card-title-personalizar {
  font-size: 1.2rem;
  font-weight: bold;
  color: #333;
}

.product-info {
  margin: 10px 0;
}

.product-info p {
  margin: 0;
  font-size: 1rem;
  color: #555;
}

.ion-select-personalizar {
  width: 100%;
}

.ion-thumbnail-personalizar {
  border-radius: 8px;
  overflow: hidden;
}

.ion-thumbnail-personalizar img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
}

.ion-card-content-personalizar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.app-formas-de-pago-personalizar {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.forma-pago-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permite que los elementos se envuelvan si no caben en una fila */
  gap: 7px;
  /* Espacio entre los chips */
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  /* Alinea los chips a la izquierda */
  padding: 15px 0;
  /* Espaciado interno */
}

.forma-pago-chip {
  background-color: #ffffff;
  /* Fondo blanco */
  color: #333;
  /* Color de texto */
  border-radius: 20px;
  /* Bordes redondeados */
  font-size: 14px;
  /* Tamaño de fuente */
  padding: 5px 10px;
  /* Espaciado interno */
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Sombra para profundidad */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Display flex para alinear imagen y texto */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
  white-space: nowrap;
  /* Evita que el texto se divida en múltiples líneas */
  min-width: 80px;
  /* Ancho mínimo para los chips */
  max-width: 100%;
  /* Ancho máximo opcional para los chips */
}

.forma-pago-imagen {
  width: 30px;
  /* Tamaño de la imagen */
  height: 30px;
  border-radius: 50%;
  /* Redondear la imagen */
  margin-right: 2px;
  /* Espacio entre la imagen y el texto */
}

.forma-pago-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.forma-pago-nombre {
  font-weight: bold;
  /* Nombre en negrita */
  font-size: 15px;
  /* Tamaño de fuente más grande */
}

.forma-pago-detalles {
  font-size: 13px;
  /* Tamaño de fuente para detalles */
  color: #666;
  /* Color de texto gris */
}

.ion-col-personalizar {
  padding: 1px;
  /* Ajusta el padding para que las columnas tengan espacio alrededor */
  border-radius: 2px;
}

.ion-item-personalizar {
  --padding-start: 0;
  --padding-end: 0;
}

.ion-input-personalizar {
  --padding-start: 1px;
}

.ion-button-personalizar {
  --width: auto;
  /* Ajustar el ancho del botón */
  margin-top: 1px;
  /* Espacio superior */
}

.ion-button-personalizar[expand="full"] {
  --width: auto;
}

.payment-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Permite que los elementos se ajusten si el espacio es limitado */
  gap: 1px;
  /* Espacio entre el campo de texto y el botón */
}

.payment-container ion-item {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que los elementos se ajusten automáticamente */
}

.payment-container ion-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* El campo de texto ocupa más espacio que el botón */
}

.payment-container ion-button {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* El botón ocupa el espacio restante */
}

.devolver-label {
  display: block;
  /* Asegura que se muestre en una nueva línea */
  margin-top: 10px;
  /* Espacio entre el input y el span */
  font-size: 16px;
  /* Tamaño de fuente adecuado para móviles */
  color: #ff5733;
  /* Color distintivo para el valor a devolver */
  font-weight: bold;
  /* Hace el texto más destacado */
}

.custom-divider {
  background-color: #f0f0f0;
  color: #333;
  padding: 10px;
  font-size: 1.2em;
}

@media (max-width: 768px) {
  .custom-divider {
    font-size: 1em;
    /* Ajustar el tamaño de la fuente para pantallas más pequeñas */
    padding: 8px;
    /* Menor espaciado en dispositivos móviles */
  }
}

.custom-divider {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.custom-divider ion-icon {
  margin-right: 10px;
  font-size: 1.5em;
  color: #555;
}

@media (max-width: 768px) {
  .devolver-label {
    font-size: 14px;
    /* Ajuste de tamaño de fuente para pantallas pequeñas */
  }
}

@media (min-width: 769px) {
  .devolver-label {
    font-size: 18px;
    /* Ajuste de tamaño de fuente para pantallas más grandes */
  }
}

@media (max-width: 768px) {
  .payment-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    /* En pantallas más pequeñas, apila los elementos verticalmente */
  }
  .payment-container ion-input,
  .payment-container ion-button {
    width: 100%;
    /* Asegura que ambos elementos ocupen el ancho completo en pantallas pequeñas */
  }
}

@media (max-width: 768px) {
  ion-button {
    --width: 100%;
  }
}

@media (min-width: 768px) {
  ion-col {
    padding: 16px;
    /* Ajusta el padding para pantallas medianas */
  }
}

@media (min-width: 992px) {
  ion-col {
    padding: 24px;
    /* Ajusta el padding para pantallas grandes */
  }
}

@media (max-width: 768px) {
  .forma-pago-chip {
    font-size: 12px;
    /* Reducir el tamaño de fuente en pantallas más pequeñas */
    padding: 3px 8px;
    /* Ajustar el espaciado interno */
    min-width: 70px;
    /* Ajustar el ancho mínimo en pantallas más pequeñas */
    max-width: 130px;
    /* Ajustar el ancho máximo en pantallas más pequeñas */
  }
  .forma-pago-imagen {
    width: 20px;
    /* Reducir el tamaño de la imagen en pantallas más pequeñas */
    height: 20px;
  }
  .forma-pago-info {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    /* Cambiar la dirección de flexión a fila en pantallas más pequeñas */
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    /* Centrar verticalmente */
  }
  .forma-pago-nombre {
    font-size: 10px;
    /* Reducir el tamaño de fuente en pantallas más pequeñas */
    margin-bottom: 4px;
  }
  .forma-pago-detalles {
    font-size: 9px;
    /* Reducir el tamaño de fuente para detalles */
  }
}

page-personalizar {
  /* Eliminar márgenes y paddings predeterminados */
  /* Color cuando está seleccionado */
}

page-personalizar :host {
  --ion-background-color: #ffffff;
  /* Cambia el color de fondo a blanco */
  --ion-color-primary: transparent;
  /* Elimina el color primario de Ionic */
  --ion-color-secondary: transparent;
  /* Elimina el color secundario de Ionic */
}

page-personalizar ion-content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  /* Permite que el contenido principal ocupe el espacio disponible */
}

page-personalizar ion-header, page-personalizar ion-content, page-personalizar ion-footer {
  margin: 0;
  padding: 0;
  background: none;
  /* Eliminar fondo predeterminado */
}

page-personalizar .segment-estilizado {
  background-color: #5c6a77;
  /* Fondo oscuro elegante */
  border-radius: 10px;
  padding: 5px;
  color: white;
}

page-personalizar .segment-button-estilizado {
  color: white;
  /* Texto blanco */
  font-weight: bold;
  border-radius: 8px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

page-personalizar .segment-button-estilizado.ion-activated {
  background-color: #27ae60 !important;
  /* Verde profesional */
  color: white !important;
}

.image {
  width: 50px;
  /* Ajusta al tamaño que desees */
  height: 50px;
  /* Ajusta al tamaño que desees */
  -o-object-fit: cover;
  object-fit: cover;
  /* Para asegurarte de que la imagen se recorte si es necesario */
}

.input-descuento {
  width: 100%;
  max-width: 500px;
  /* Limita el ancho máximo */
  margin-top: 10px;
  border: 1px solid #ccc;
  padding: 8px;
  border-radius: 6px;
}

@media (min-width: 768px) {
  .input-descuento {
    /* Para pantallas grandes */
    width: 100%;
    max-width: 500px;
  }
}

.input-valor-pagar {
  width: 100%;
  max-width: 500px;
  /* Limita el ancho máximo */
  margin-top: 10px;
  border: 1px solid #ccc;
  padding: 8px;
  border-radius: 6px;
}

@media (min-width: 768px) {
  .input-valor-pagar {
    /* Para pantallas grandes */
    width: 100%;
    max-width: 500px;
  }
}

.gif-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.5);
}

.gif-infinito {
  width: 420px;
  height: 420px;
  -webkit-animation: girarInfinito 4s linear infinite;
  animation: girarInfinito 4s linear infinite;
}

.inputTextArea textarea {
  text-align: left;
  font-size: 12px;
  padding-right: 0px;
}

@keyframes girarInfinito {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

page-principal ion-content {
  background-color: #000000 !important;
}

page-principal .end {
  float: right;
}

page-principal .grid {
  padding: 0px;
}

page-principal .grid .slides .overlay {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.4)));
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

page-principal .grid .slides .slider-img {
  height: 220px;
  width: 100%;
  position: relative;
  z-index: -111;
}

page-principal .grid .slides .slider-text {
  color: #fff;
  font-size: 22px;
  padding: 5px;
  position: absolute;
  bottom: 0;
  margin: 5px 0px;
}

page-principal .grid .slides .swiper-pagination-bullet {
  background: #042020 !important;
}

page-principal .grid .card-title {
  position: absolute;
  top: 36%;
  font-size: 2.0em;
  width: 100%;
  font-weight: bold;
  color: #fff;
}

page-principal .grid .carsito {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

page-principal .grid .carsito h2 {
  margin-top: -12px;
  font-size: 2.7rem;
  color: rgba(66, 66, 66, 0.87);
  font-weight: 500;
}

page-principal .grid .carsito img {
  height: 110px;
  width: 100%;
  position: relative;
  z-index: -111;
}

page-principal .grid .carsito .text-over-img {
  color: #fff;
  font-size: 18px;
  padding: 5px;
  background-color: rgba(119, 119, 119, 0.6);
  position: relative;
  width: 100%;
  margin: -34px 0px 0px 0px;
  text-align: center;
}

page-principal .ios page-home .scroll-content, page-principal .md page-home .scroll-content {
  background-color: #f4f4f4;
}

page-principal .ios page-home ion-card-header, page-principal .md page-home ion-card-header {
  font-weight: bold;
}

page-principal .footer {
  width: 100%;
  height: 169px;
  padding-top: 1px;
  background: black;
  color: white;
  font-weight: bold;
  font-size: 4px;
  text-align: center;
  position: absolute;
  /*Here's what sticks it*/
  bottom: 0;
  /*to the bottom of the body/page*/
  left: 0;
  /*and to the left of the body/page.*/
}

page-principal .footer-left {
  text-align: left;
}

page-principal a {
  color: #4c4fe6;
  font-size: 4px;
}

page-principal .footer-center {
  text-align: center;
  color: white;
  font-weight: bold;
  padding-top: 20px;
}

@media (max-width: 600px) {
  page-principal canvas {
    width: 100% !important;
    float: left !important;
  }
}

page-principal [logo] {
  width: 30%;
  height: 30%;
  bottom: 50%;
  left: 50%;
  margin-left: -50px;
  position: absolute;
  opacity: 0;
  background-repeat: no-repeat;
  background-position: 50%;
  border-radius: 50%;
  background-size: 100% auto;
}

@keyframes logoAnimation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

page-principal [animation] {
  -webkit-animation: logoAnimation 2s;
  -webkit-animation-fill-mode: forwards;
  animation: logoAnimation 2s;
  -webkit-animation-delay: 500ms;
  animation-delay: 500ms;
  animation-fill-mode: forwards;
}

page-principal .splash-screen {
  position: fixed;
  width: 100%;
  height: 100%;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 10s;
  animation-duration: 10s;
  -webkit-animation-name: animationBackground;
  animation-name: animationBackground;
}

@keyframes animationBackground {
  0% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
  25% {
    -webkit-transform: scale(1.12, 1.12) translate(-5px, -5px);
    transform: scale(1.12, 1.12) translate(-5px, -5px);
  }
  50% {
    -webkit-transform: scale(1.15, 1.15) translate(0px, 0px);
    transform: scale(1.15, 1.15) translate(0px, 0px);
  }
  75% {
    -webkit-transform: scale(1.13, 1.13) translate(5px, 5px);
    transform: scale(1.13, 1.13) translate(5px, 5px);
  }
  100% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
}

page-principalweb .contacto {
  text-align: center;
}

page-principalweb .pp {
  font-size: 12px;
}

page-principalweb .imgtam {
  width: 82%;
  max-height: 100%;
}

page-principalweb .text-blue {
  color: #14023d !important;
}

page-principalweb .bold {
  font-weight: 500 !important;
}

page-principalweb .fondogrid {
  background: #e4e1e1;
}

page-principalweb .maximo {
  max-height: 460px;
  min-height: 460px;
}

page-principalweb .maximoslider {
  max-height: 320px;
  min-height: 280px;
}

page-principalweb h2 {
  color: gray;
}

page-principalweb p {
  color: #4e3737;
}

page-principalweb .toolbar-md {
  padding: 4px;
  min-height: 74px;
  color: #fdfdfd;
}

page-principalweb .abajo {
  bottom: 0px !important;
}

page-principalweb .demo {
  color: #131730;
  text-decoration: none;
}

page-principalweb .demo:hover {
  background-color: #040025;
  color: white;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-box-shadow: 0px 2px 2px #000;
  box-shadow: 0px 2px 2px #000;
}

page-principalweb .end {
  color: #131730;
  font-size: 25px;
}

page-principalweb .end:hover {
  background-color: #040025;
  color: white;
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-box-shadow: 0px 2px 2px #000;
  box-shadow: 0px 2px 2px #000;
}

page-principalweb .demo .a {
  text-decoration: none;
}

page-principalweb .a {
  text-decoration: none;
}

page-principalweb .end {
  cursor: pointer;
  text-align: right;
}

page-principalweb .card-titlederecha {
  text-align: right !important;
  float: right;
}

page-principalweb .sinpadding {
  padding: 0px !important;
  margin: 0px !important;
  background-color: #fdfdfd;
  font-family: "Merriweather", serif;
  font-weight: 300;
  font-size: 300px;
  letter-spacing: 2px;
  color: #fff;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  font-family: "Playfair Display", serif;
  font-style: italic;
  text-transform: none;
}

@media screen and (max-width: 768px) {
  page-principalweb .contacto {
    text-align: left;
  }
  page-principalweb .card-subtitle {
    display: none;
  }
  page-principalweb .media {
    display: none;
  }
  page-principalweb .sinpadding h2 {
    font-size: 20px;
  }
  page-principalweb .card-background-page ion-card {
    height: 100% !important;
    position: relative;
    text-align: center;
    width: 100% !important;
  }
  page-principalweb .card-background-page .card-title {
    position: absolute;
    top: 420px;
    font-size: 2.0em;
    width: 100%;
    font-weight: bold;
    text-align: center;
    color: #fff;
    -webkit-transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
    transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
  }
  page-principalweb .card-background-page .card-subtitle {
    font-size: 7.0em;
    position: absolute;
    top: 350px;
    width: 100%;
    color: #fff;
    text-align: center;
    -webkit-transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
    transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
  }
}

page-principalweb .card-background-page ion-card {
  position: relative;
  text-align: center;
  width: 100% !important;
}

page-principalweb .card-background-page .card-title {
  position: absolute;
  top: 620px;
  font-size: 3.0em;
  width: 100%;
  font-weight: bold;
  text-align: center;
  color: #fff;
  -webkit-transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
  transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
}

page-principalweb .card-background-page .card-background-page .end {
  cursor: pointer;
  text-align: right;
  font-weight: bold;
  color: #fff;
}

page-principalweb .card-background-page .card-subtitle {
  font-size: 2.0em;
  position: absolute;
  top: 550px;
  width: 100%;
  color: #fff;
  text-align: center;
  -webkit-transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
  transition: 1s cubi-bezier(0.18, 0.9, 0.32, 0.28) !important;
}

page-principalweb .splash-screen {
  position: relative;
  width: 100%;
  height: 430px;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 10s;
  animation-duration: 10s;
  -webkit-animation-name: animationBackground;
  animation-name: animationBackground;
}

@keyframes animationBackground {
  0% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
  25% {
    -webkit-transform: scale(1.12, 1.12) translate(-5px, -5px);
    transform: scale(1.12, 1.12) translate(-5px, -5px);
  }
  50% {
    -webkit-transform: scale(1.15, 1.15) translate(0px, 0px);
    transform: scale(1.15, 1.15) translate(0px, 0px);
  }
  75% {
    -webkit-transform: scale(1.13, 1.13) translate(5px, 5px);
    transform: scale(1.13, 1.13) translate(5px, 5px);
  }
  100% {
    -webkit-transform: scale(1.1, 1.1) translate(0px, 0px);
    transform: scale(1.1, 1.1) translate(0px, 0px);
  }
}

page-principalweb h1 {
  color: gray;
  text-align: center;
}

page-principalweb .footer {
  width: 100%;
  height: 169px;
  padding-top: 1px;
  background-color: white !important;
  color: #353131;
  font-weight: bold;
  font-size: 4px;
  text-align: center;
  position: absolute;
  /*Here's what sticks it*/
  bottom: 0;
  /*to the bottom of the body/page*/
  left: 0;
  /*and to the left of the body/page.*/
}

page-principalweb .footer-left {
  text-align: left;
}

page-principalweb .footer h1, page-principalweb h2, page-principalweb h3, page-principalweb h4, page-principalweb h5, page-principalweb h6 {
  color: white !important;
}

page-principalweb .afn {
  border-bottom: 5px solid;
  color: gray;
  cursor: pointer;
}

page-principalweb .afn.clic {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-principalweb .afn.clic:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

page-principalweb .afn.animate {
  border-bottom: none;
}

page-principalweb .afn.animate:before {
  content: "afn";
  position: absolute;
  bottom: 0px;
  left: 0px;
  height: 5px;
  background-color: red;
  width: 0%;
  border-radius: 0 0 5px 5px;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

page-principalweb .afn.animate.col:before {
  background-color: #1e073b;
}

page-principalweb .afn.animate.colpro:before {
  background-color: #0c031c;
}

page-principalweb .afn.animate:hover:before {
  width: 100%;
}

page-principalweb footer {
  width: 100%;
  float: left;
  clear: both;
  box-shadow: 0px 2px 2px #000;
  -moz-box-shadow: 0px 2px 2px #000;
  -webkit-box-shadow: 0px 2px 2px #000;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  background: #2f2f2f;
  /* Old browsers */
  /* FF3.6+ */
  /* Chrome,Safari4+ */
  /* Chrome10+,Safari5.1+ */
  /* Opera 11.10+ */
  /* IE10+ */
  background: -webkit-gradient(linear, left top, left bottom, from(#2f2f2f), to(#242424));
  background: linear-gradient(to bottom, #2f2f2f 0%, #242424 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2f2f2f', endColorstr='#242424',GradientType=0 );
  /* IE6-9 */
}

page-principalweb footer section {
  width: 440px;
  float: left;
  padding: 20px;
}

page-principalweb footer #acerca-de {
  font-family: Arial, Helvetica, Sans-serif;
  font-size: 12px;
  color: #8c8c8c;
  text-align: justify;
  line-height: 20px;
}

page-principalweb footer #acerca-de h3 {
  font-family: sourcesans-light;
  font-size: 20px;
  color: #fff;
  margin-bottom: 5px;
}

page-principalweb footer #redes-s > div {
  width: 220px;
  height: 60px;
  float: left;
  background: #ff8000;
  opacity: 0.5;
}

page-principalweb footer #redes-s > div a {
  width: 220px;
  height: 60px;
  display: inline-block;
}

page-principalweb footer #redes-s .email {
  background: url(../imagenes/correo.png);
  margin-bottom: 15px;
}

page-principalweb footer #redes-s .twitter {
  background: url(../imagenes/twitter.png);
  margin-bottom: 15px;
}

page-principalweb footer #redes-s .facebook {
  background: url(../imagenes/facebook.png);
}

page-principalweb footer #redes-s .youtube {
  background: url(../imagenes/youtube.png);
}

page-principalweb footer #redes-s > div:hover {
  opacity: 1;
}

page-principalweb #copyright {
  float: left;
  width: 960px;
  margin: 10px 0px;
}

page-principalweb #copyright p {
  text-align: center;
  font-size: 12px;
  color: #fff;
  font-family: Arial, Helvetica, Sans-serif;
}

page-principalweb .text-right {
  text-align: right;
}

page-principalweb .text-left {
  text-align: left;
}

page-principalweb .large-padding {
  padding: 10px 15px;
  font-size: 16px;
  padding-right: 6px;
  padding-bottom: 1px;
}

page-principalweb .pointer {
  cursor: pointer;
}

page-principalweb .no-background {
  background: transparent;
}

page-principalweb .light-text {
  color: #0c031d;
}

page-producto-dinamico .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-producto-dinamico .numero_cantidadT {
  background-color: #044e43;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-producto-dinamico .numero_cantidadP {
  background-color: #021f1a;
  padding-top: 12px;
  padding-bottom: 12px;
  top: 4px;
  position: relative;
}

page-producto-dinamico .numero_cantidadTotal {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  border-radius: 50%;
  color: white;
  position: relative;
}

page-producto-dinamico .endCursor {
  cursor: pointer;
  color: red;
}

page-producto-dinamico .endCursorCenter {
  cursor: pointer !important;
}

page-producto-dinamico ion-card img {
  display: block;
  width: 100%;
}

page-producto-dinamico .imgs {
  display: block;
  width: 100%;
}

page-producto-dinamico .botonderecha {
  text-align: left;
}

page-producto-dinamico .flotar {
  float: left !important;
}

page-producto-dinamico .flotarr {
  float: right !important;
}

page-producto-dinamico .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-companias .end {
  float: right;
}

page-companias #file-input {
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0;
  z-index: 999;
}

page-companias .img {
  height: 22px;
  float: left;
  border-radius: 50% !important;
}

page-productos-contenedor .cuentaporcobrar {
  color: #920f0f;
}

page-productos-descripcion-domiciliosapp ion-buttons button[icon-only].my-style-for-modal {
  margin: 0 6px;
  min-width: 36px;
  width: 50px !important;
}

page-productos-descripcion-domiciliosapp button.button.button-md.button-default.button-default.md.item-button {
  width: 50px !important;
}

page-productos-descripcion-domiciliosapp .button-md {
  width: 50px !important;
}

page-productos-descripcion-domiciliosapp .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-productos-descripcion-domiciliosapp .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-productos-descripcion-domiciliosapp .carrito-numeroguardar {
  position: absolute;
  top: -1px;
  left: 5px;
  color: white;
  background-color: #e44d12ea;
  text-align: left;
  float: right;
}

page-productos-descripcion-domiciliosapp [icon-only] ion-icon {
  font-size: 2.9em !important;
}

page-productos-descripcion-domiciliosapp ion-badge {
  padding: 10px 10px !important;
}

page-productos-descripcion-domiciliosapp .end {
  float: right;
}

page-productos-descripcion-domiciliosapp .bar-button-md[icon-only] ion-icon {
  padding: 1.0em !important;
}

page-productos-elaborados .imagen {
  position: relative;
  height: 120px;
  width: calc(100% - 6px) !important;
  margin: 6px 3px 0 3px !important;
  border-radius: 0 !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

page-productos-elaborados .end {
  float: right;
}

page-productos-elaborados-contenido .end {
  float: right;
}

page-productos-elaborados-contenido .mita {
  width: 52%;
  float: left;
}

page-productos-elaborados-contenido .mita2 {
  width: 44%;
  float: right;
}

page-productos-elaborados-contenido .nombre {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-productos-elaborados-contenido .img {
  max-height: 55px;
  float: left;
}

page-productos-elaborados-contenido img {
  max-width: 125px !important;
}

page-productos-elaborados-contenido .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-productos-elaborados-contenido .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

page-productos-elaborados-contenido .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

page-productos-elaborados-contenido .puntero {
  cursor: pointer;
}

page-productos-elaborados-contenido .end {
  float: right;
}

page-productos-elaborados-contenido .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

page-productos-elaborados-contenido .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

@media (min-width: 1200px) {
  page-productos-elaborados-contenido ion-card {
    position: relative;
    text-align: center;
    padding-bottom: 180px;
    height: 125px;
  }
  page-productos-elaborados-contenido .avatar {
    min-height: 45px;
  }
  page-productos-elaborados-contenido .letra {
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
  }
  page-productos-elaborados-contenido .card-title {
    position: absolute;
    top: 36%;
    font-size: 2.0em;
    width: 100%;
    font-weight: bold;
    color: #1b162b;
  }
  page-productos-elaborados-contenido .card-subtitle {
    font-size: 1.0em;
    position: absolute;
    top: 52%;
    width: 100%;
    color: #fff;
  }
  page-productos-elaborados-contenido img {
    min-height: 125px;
  }
}

page-productos-elaborados-contenido .item-input ion-input, page-productos-elaborados-contenido .item-input ion-textarea {
  position: static;
  width: 50px;
}

page-grupos-productos #file-input {
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: 0;
  z-index: 999;
}

.end {
  float: right;
}

page-productos-por-grupos-drag .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-productos-por-grupos-drag .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

page-productos-por-grupos-drag .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

page-productos-por-grupos-drag .puntero {
  cursor: pointer;
}

page-productos-por-grupos-drag .end {
  float: right;
}

page-productos-por-grupos-drag .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

page-productos-por-grupos-drag .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

page-proveedores-cargar-stock .mita {
  width: 70%;
  float: left;
  margin-left: -10px;
}

page-proveedores-cargar-stock .mita2 {
  width: 12%;
  height: 40%;
  float: left;
  margin-top: 10px;
  padding-top: -12px;
  margin-left: -10px;
}

page-push scroll-content {
  overflow-y: hidden !important;
  overflow-x: hidden;
}

page-push body {
  margin: 0;
  padding: 0;
  width: 100%;
  bottom: 0 !important;
  margin: 0px 0px 0px 0px;
  widows: 800px !important;
  height: 600px !important;
  padding: 0px !important;
  float: right !important;
}

page-push .boton-push {
  position: relative;
  top: -10px;
  float: right;
  left: 5px;
  color: white;
  background-color: #e44d12ea;
  text-align: left;
}

page-push #hellobar-bar {
  font-family: "Open Sans", sans-serif;
  width: 100%;
  margin: 0;
  height: 30px;
  display: table;
  font-size: 17px;
  font-weight: 400;
  padding: .33em .5em;
  -webkit-font-smoothing: antialiased;
  color: #5c5e60;
  position: fixed;
  background-color: white;
  -webkit-box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 3px 2px rgba(0, 0, 0, 0.15);
  bottom: 0 !important;
}

page-push #hellobar-bar.regular {
  height: 30px;
  font-size: 14px;
  padding: .2em .5em;
  bottom: 0 !important;
}

page-push .hb-content-wrapper {
  text-align: center;
  text-align: center;
  position: relative;
  display: table-cell;
  vertical-align: middle;
  bottom: 0 !important;
}

page-push .hb-content-wrapper p {
  margin-top: 0;
  margin-bottom: 0;
  bottom: 0 !important;
}

page-push .hb-text-wrapper {
  margin-right: .67em;
  display: inline-block;
  line-height: 1.3;
  bottom: 0 !important;
}

page-push .hb-text-wrapper .hb-headline-text {
  font-size: 1em;
  display: inline-block;
  vertical-align: middle;
  bottom: 0 !important;
}

page-push #hellobar-bar .hb-cta {
  display: inline-block;
  vertical-align: middle;
  margin: 5px 0;
  color: #ffffff;
  background-color: #22af73;
  border-color: #22af73;
}

page-push .hb-cta-button {
  opacity: 1;
  color: #fff;
  display: block;
  cursor: pointer;
  line-height: 1.5;
  max-width: 22.5em;
  text-align: center;
  position: relative;
  border-radius: 3px;
  white-space: nowrap;
  margin: 1.75em auto 0;
  text-decoration: none;
  padding: 0;
  overflow: hidden;
}

page-push .hb-cta-button .hb-text-holder {
  border-radius: inherit;
  padding: 5px 15px;
}

page-push .hb-close-wrapper {
  display: table-cell;
  width: 1.6em;
}

page-push .hb-close-wrapper .icon-close {
  font-size: 14px;
  top: 15px;
  right: 25px;
  width: 15px;
  height: 15px;
  opacity: .3;
  color: #000;
  cursor: pointer;
  position: absolute;
  text-align: center;
  line-height: 15px;
  z-index: 1000;
  text-decoration: none;
}

page-reservas {
  /* Estilo cuando está grabando (rojo) */
  /* Estilo cuando está detenido (por defecto o de otro color) */
}

page-reservas .fullscreen-modal {
  height: 100vh;
  /* 100% del alto de la ventana */
  width: 100vw;
  /* 100% del ancho de la ventana */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centrar horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
}

page-reservas #gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

page-reservas ion-header .fullscreen-modal {
  height: 100vh;
  /* 100% del alto de la ventana */
  width: 100vw;
  /* 100% del ancho de la ventana */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centrar horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
}

page-reservas ion-header ion-icon {
  font-size: 30px;
  position: relative;
}

page-reservas ion-header #notifications-badge-msg {
  background-color: #4307e9;
  position: absolute;
  top: 5px;
  right: 95px;
  color: #fff;
  z-index: 111;
}

page-reservas ion-header #notifications-badge {
  background-color: #4307e9;
  position: absolute;
  top: 5px;
  right: 50px;
  color: #fff;
  z-index: 111;
}

page-reservas ion-header img {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  margin-right: 10px;
}

page-reservas ion-header .ch-menu {
  background-color: #252526;
  width: 100%;
}

page-reservas ion-header .ch-menu p {
  color: #efe7e7;
  height: 100%;
  width: 100%;
  margin-left: 20px;
  margin-right: 20px;
  font-size: 12px;
}

page-reservas ion-header .ch-menu .wrapper {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

page-reservas ion-header .ch-menu .wrapper .item {
  min-width: 100px;
  height: auto;
  position: relative;
}

page-reservas ion-header .ch-menu .wrapper .item #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-reservas ion-header .ch-menu .wrapper .item #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-reservas ion-header .ch-menu ion-grid ion-row ion-col #gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

page-reservas ion-header .ch-menu ion-grid ion-row ion-col .ionSearchbar {
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
  padding: 0px;
  border-radius: 12px;
  margin: 0px;
}

page-reservas ion-header .ch-menu ion-grid ion-row ion-col #numeromesap {
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
  max-width: 30px;
  border-radius: 12px;
  margin: 2px;
}

page-reservas ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas {
  max-width: 100%;
  border: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow-x: auto;
  cursor: pointer;
}

page-reservas ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas .itemmesas {
  height: auto;
  position: relative;
  display: contents;
}

page-reservas ion-header .ch-menu ion-grid ion-row ion-col .wrappermesas::-webkit-scrollbar {
  width: 0.2px;
  border-radius: 2px;
  opacity: 0.2;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-reservas ion-header .ch-menu ion-card ion-card-header .cardHeader {
  background-color: #0c031d;
  color: #fff;
}

page-reservas ion-header .ch-menu ion-card ion-card-header .cardContent {
  padding: 0px 16px;
  max-height: 0px;
}

page-reservas ion-header ion-segment {
  background: #53414d;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-reservas ion-header ion-segment ion-segment-button {
  --background-checked: #54586a;
  --color-checked: #fff;
  --indicator-color: #444141;
  font-size: 18px;
  --color: white;
}

page-reservas ion-header ion-segment ion-segment-button ion-label {
  color: white;
}

page-reservas ion-header ion-segment ion-label {
  display: initial !important;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select {
  background-color: #fff;
  margin-top: 10px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  height: auto;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select ion-icon {
  font-size: 24px;
  color: red;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select img {
  width: 30px;
  height: 30px;
  margin-right: 10px;
  color: red;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select span {
  width: 30px;
  margin-right: 30px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  background-color: #298;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select .text {
  width: 30px;
  margin-right: 30px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-reservas ion-header .container-grid-select .upperBox-producto-select span.num {
  font-size: 22px;
  margin-right: 4px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-reservas ion-header .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-reservas ion-header .numero_total_precio {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-reservas ion-header .gestionpedido {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  position: relative;
}

page-reservas ion-header .gestionpedidoicon {
  margin-top: 2px;
}

page-reservas ion-header .enviarcomandaboton {
  background-color: black;
}

page-reservas ion-header .enviarcomandabotonReemprimir {
  background-color: #393838;
}

page-reservas ion-header .enviarcomandabotonReemprimirTotal {
  background-color: #4b3333;
}

page-reservas ion-header .enviarcomandabotonReemprimirIcon {
  font-size: 18px !important;
  color: white;
}

page-reservas ion-header .devolverVenta {
  border-radius: 2px 2px 2px 2px !important;
}

page-reservas ion-content {
  --background: #fff;
  /* Estilo cuando está detenido (por defecto o de otro color) */
}

page-reservas ion-content .fullscreen-modal {
  height: 100vh;
  /* 100% del alto de la ventana */
  width: 100vw;
  /* 100% del ancho de la ventana */
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centrar horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centrar verticalmente */
}

page-reservas ion-content .numero_total_precioSelect {
  background-color: #bba216;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-reservas ion-content .numero_cantidad {
  background-color: #298;
  padding-top: 6px;
  padding-bottom: 6px;
  top: 4px;
  position: relative;
}

page-reservas ion-content #labelDescripcion {
  visibility: hidden;
}

page-reservas ion-content .img {
  background: black;
  overflow: hidden;
  height: 250px;
  width: 100%;
  position: relative;
}

page-reservas ion-content .img .top {
  margin-top: 40px;
  margin-left: 20px;
  margin-right: 20px;
  position: absolute;
  width: 100%;
  z-index: 999;
}

page-reservas ion-content .img .top .back_div {
  font-size: 30px;
  position: relative;
}

page-reservas ion-content .img .top .back_div #end {
  float: right;
  margin-right: 40px;
}

page-reservas ion-content .img .bottom {
  bottom: 10px;
  left: 10px;
  position: absolute;
  right: 10px;
  z-index: 80px;
  height: 80px;
  display: grid;
  grid-template-columns: 25% 55% 20%;
  grid-template-rows: 80px auto 80px;
  color: #fff;
}

page-reservas ion-content .img .bottom .first {
  justify-self: start;
}

page-reservas ion-content .img .bottom .first img {
  width: 70px;
  height: 70px;
  border-radius: 50px;
}

page-reservas ion-content .img .bottom .second {
  justify-self: start;
  -webkit-align-self: start;
  -ms-flex-item-align: start;
  align-self: start;
}

page-reservas ion-content .img .bottom .second h4 {
  margin-top: -3px;
}

page-reservas ion-content .img .bottom .second p {
  margin-top: -10px;
}

page-reservas ion-content .img .bottom .third h4 {
  margin-top: -5px;
}

page-reservas ion-content .img #myimg {
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  opacity: 0.3;
}

page-reservas ion-content .content {
  margin-top: 105px;
  /* Estilos para el scrollbar en WebKit (Chrome, Safari, etc.) */
  /* Estilos para el scrollbar en Firefox */
}

page-reservas ion-content .content .overview span:nth-of-type(1) {
  color: gray;
}

page-reservas ion-content .content .overview span:nth-of-type(2) {
  color: red;
}

page-reservas ion-content .content .overview .intro {
  padding: 0px 20px;
  color: gray;
  margin-top: -10px;
  text-align: justify;
}

page-reservas ion-content .content .overview .intro span {
  color: red;
}

page-reservas ion-content .content .overview .hrs {
  padding-left: 10px;
  margin-top: -20px;
}

page-reservas ion-content .content .overview .hrs span {
  color: gray;
}

page-reservas ion-content .content .overview .hrs ion-icon {
  color: #91e710;
}

page-reservas ion-content .content #gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

page-reservas ion-content .content .content .gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

page-reservas ion-content .content .content .gestionProductosContainer::-webkit-scrollbar {
  width: 12px;
  /* Ancho del scrollbar */
}

page-reservas ion-content .content .content .gestionProductosContainer::-webkit-scrollbar-track {
  background: #f1f1f1;
  /* Color de fondo de la pista del scrollbar */
}

page-reservas ion-content .content .content .gestionProductosContainer::-webkit-scrollbar-thumb {
  background: #888;
  /* Color del "pulgar" del scrollbar */
  border-radius: 6px;
  /* Bordes redondeados para el "pulgar" */
}

page-reservas ion-content .content .content .gestionProductosContainer::-webkit-scrollbar-thumb:hover {
  background: #555;
  /* Color del "pulgar" al pasar el mouse */
}

page-reservas ion-content .content .content .gestionProductosContainer {
  scrollbar-width: thin;
  /* "auto" o "thin" */
  scrollbar-color: #888 #f1f1f1;
  /* Color del "pulgar" y de la pista */
}

page-reservas ion-content .content .content .gestionProductosContainer::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-reservas ion-content .content .grid {
  text-align: center;
  background-color: white;
  height: calc(100% - 18px);
  overflow-y: auto;
  padding: 0px;
}

page-reservas ion-content .content .grid::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-reservas ion-content .content .content .gridSelectReserva {
  height: calc(50vh - 1px);
  overflow-y: auto;
  margin-top: 10px !important;
}

page-reservas ion-content .content .content .gridSelectReserva::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-reservas ion-content .content .content .gridSelectProductReserva {
  height: 100%;
  /* Ajusta este valor según sea necesario */
  overflow: hidden;
  /* Evita el desbordamiento del contenido */
}

page-reservas ion-content .content .content .gridSelectProductReserva::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background: -webkit-gradient(linear, left top, right top, from(#53414d), color-stop(0%, #c8c6cd), color-stop(0%, #493a4c), color-stop(99%, #211e4a), color-stop(100%, #41484a), to(#5f6063));
  background: linear-gradient(90deg, #53414d 0%, #c8c6cd 0%, #493a4c 0%, #211e4a 99%, #41484a 100%, #5f6063 100%);
}

page-reservas ion-content .content .products {
  position: relative;
  text-align: center;
  display: -webkit-box !important;
  width: 33% !important;
}

page-reservas ion-content .content .top {
  background-color: #f9f9f9;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 1.95px 2.6px;
  height: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 20px;
}

page-reservas ion-content .content #date {
  padding-left: 20px;
}

page-reservas ion-content .content .container-grid {
  width: 100%;
  background: #54586a;
  border-radius: 8px;
  margin-right: 2px;
  margin-bottom: 2px;
}

page-reservas ion-content .content .container-grid .Products-item {
  position: relative;
}

page-reservas ion-content .content .container-grid .Products-item .orderId {
  grid-area: orderId;
}

page-reservas ion-content .content .container-grid .Products-item .orderId p {
  position: absolute;
  vertical-align: middle;
  color: #121212 !important;
  padding-top: 13px;
  font-size: 13px !important;
  white-space: nowrap;
  /* Evita que el texto se divida en varias líneas */
  text-overflow: ellipsis;
  /* Agrega puntos suspensivos (...) al final del texto si no cabe en el contenedor */
  overflow: hidden;
  /* Oculta cualquier texto que sobrepase el contenedor */
  left: 0;
  /* Alinea el texto a la izquierda */
  right: 0;
  /* Alinea el texto a la derecha */
}

page-reservas ion-content .content .container-grid .Products-item .edit {
  grid-area: edit;
  margin-top: 2px;
  margin-bottom: -4px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-reservas ion-content .content .container-grid .Products-item .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

page-reservas ion-content .content .container-grid .Products-item .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 30px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 35px;
}

page-reservas ion-content .content .container-grid .Products-item .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-reservas ion-content .content .container-grid .Products-item .editprecio {
  grid-area: edit;
  margin-top: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-reservas ion-content .content .container-grid .Products-item .editprecio .wrapperprecio {
  height: auto;
  width: 100px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -webkit-align-items: end;
  -ms-flex-align: end;
  align-items: end;
  background: #FFF;
}

page-reservas ion-content .content .container-grid .Products-item .editprecio .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-reservas ion-content .content .container-grid .Products-item .editprecio .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  color: #FFF;
  font-weight: bold;
  pointer-events: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

page-reservas ion-content .content .container-grid .Products-item-img {
  width: 100%;
  background-color: white;
  -o-object-fit: cover;
  object-fit: cover;
  grid-area: image;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

page-reservas ion-content .content .container-grid .Products-item-img #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding-right: 40px;
  height: 50px;
  max-width: none;
  width: 120px;
}

page-reservas ion-content .content .container-grid .Products-item-img #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-reservas ion-content .content .upperBox {
  width: 100%;
  background-color: #fff;
  margin-top: 10px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
  height: auto;
  display: grid;
  grid-template-columns: 40% 35% 15% 10%;
  grid-template-rows: 15% 35% 35% 15%;
  gap: 5px 5px;
  grid-template-areas: "image orderId orderId orderId" "image menu menu menu" "image title title title" "image amount status status" "image edit edit edit";
}

page-reservas ion-content .content .upperBox .image {
  grid-area: image;
}

page-reservas ion-content .content .upperBox .image #img {
  visibility: hidden;
  /* Oculta la imagen visualmente */
  padding: 10px;
  border-radius: 5px;
  height: auto;
  width: 100%;
}

page-reservas ion-content .content .upperBox .image #imggrupos {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -6px;
  margin-top: 4px;
  border: 1px solid #fff;
  outline: 1px solid #361717;
}

page-reservas ion-content .content .upperBox .title {
  grid-area: title;
  color: blue;
}

page-reservas ion-content .content .upperBox .title h3 {
  font-size: 16px;
}

page-reservas ion-content .content .upperBox .menu {
  grid-area: menu;
  margin-right: 20px;
  justify-self: center;
}

page-reservas ion-content .content .upperBox .menu h3 ion-icon {
  margin-right: 10px;
  color: red;
}

page-reservas ion-content .content .upperBox .orderId {
  grid-area: orderId;
}

page-reservas ion-content .content .upperBox .orderId p {
  color: gray;
}

page-reservas ion-content .content .upperBox .amount {
  grid-area: amount;
  -webkit-align-self: start;
  -ms-flex-item-align: start;
  align-self: start;
  justify-self: start;
  margin-top: -25px;
}

page-reservas ion-content .content .upperBox .edit {
  grid-area: edit;
  margin-bottom: -4px;
  margin-right: 20px;
}

page-reservas ion-content .content .upperBox .edit .wrapper {
  height: auto;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #bba216;
  border-radius: 22px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

page-reservas ion-content .content .upperBox .edit .wrapper span {
  width: 100%;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

page-reservas ion-content .content .upperBox .edit .wrapper span.num {
  font-size: 22px;
  border-right: 2px solid rgba(0, 0, 0, 0.2);
  border-left: 2px solid rgba(0, 0, 0, 0.2);
  pointer-events: none;
  color: #FFF;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  /* Utiliza flexbox para centrar vertical y horizontalmente */
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  /* Centra horizontalmente */
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  /* Centra verticalmente */
}

@media screen and (min-width: 200px) {
  page-reservas ion-content .content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-reservas ion-content .content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 200px) and (max-width: 600px) {
  page-reservas ion-content .content .gridSelectReserva {
    margin-top: 150px !important;
    height: calc(30vh - 1px);
  }
  page-reservas ion-content .content .gridSelectReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-reservas ion-content .content .gridSelectProductReserva {
    height: calc(30vh - 1px);
  }
  page-reservas ion-content .content .gridSelectProductReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-reservas ion-content .content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-reservas ion-content .content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
  page-reservas ion-content .content page-meseromesero ion-content .content {
    margin-top: 22px !important;
  }
  page-reservas ion-content .content .content {
    margin-top: 22px !important;
  }
}

@media screen and (min-width: 600px) and (max-width: 1200px) {
  page-reservas ion-content .content page-meseromesero ion-content .content {
    margin-top: 18px !important;
  }
  page-reservas ion-content .content .content {
    margin-top: 18px !important;
  }
}

@media screen and (min-width: 200px) {
  page-reservas ion-content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-reservas ion-content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
}

@media screen and (min-width: 200px) and (max-width: 600px) {
  page-reservas ion-content .gridSelectReserva {
    margin-top: 150px !important;
    height: calc(30vh - 1px);
  }
  page-reservas ion-content .gridSelectReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-reservas ion-content .gridSelectProductReserva {
    height: calc(30vh - 1px);
    margin-top: 150px !important;
  }
  page-reservas ion-content .gridSelectProductReserva ion-row ion-col ion-list ion-item {
    font-size: 11px !important;
  }
  page-reservas ion-content .container-grid .Products-item .orderId {
    grid-area: orderId;
  }
  page-reservas ion-content .container-grid .Products-item .orderId p {
    margin: 0 0 0 -37.5px;
    font-size: 16px;
    color: #666261;
    padding-top: 13px;
    margin: 0 auto;
  }
  page-reservas ion-content page-meseromesero ion-content .content {
    margin-top: 27px !important;
  }
  page-reservas ion-content .content {
    margin-top: 28px !important;
  }
}

@media screen and (min-width: 601px) and (max-width: 799px) {
  page-reservas ion-content page-meseromesero ion-content .content {
    margin-top: 35px !important;
  }
  page-reservas ion-content .content {
    margin-top: 36px !important;
  }
}

@media screen and (min-width: 800px) and (max-width: 2000px) {
  page-reservas ion-content page-meseromesero ion-content .content {
    margin-top: 123px !important;
  }
  page-reservas ion-content .content {
    margin-top: 124px !important;
  }
}

@media screen and (min-width: 200px) and (max-width: 900px) {
  page-reservas ion-content .item-md ion-avatar ion-img, page-reservas ion-content .item-md ion-avatar img {
    display: none !important;
  }
  page-reservas ion-content ion-avatar img {
    display: none !important;
  }
  page-reservas ion-content .item-input ion-input, page-reservas ion-content .item-input ion-textarea {
    display: none !important;
  }
  page-reservas ion-content ion-textarea {
    display: none !important;
  }
  page-reservas ion-content .item-md ion-avatar[item-left], page-reservas ion-content .item-md ion-thumbnail[item-left], page-reservas ion-content .item-md ion-avatar[item-start], page-reservas ion-content .item-md ion-thumbnail[item-start] {
    display: none !important;
  }
  page-reservas ion-content #footer {
    height: 65px;
  }
}

page-reservas ion-content .grabando {
  background-color: red;
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

page-reservas ion-content .detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
  padding: 5px 45px 5px 0px;
  margin: 5px 45px 5px 0px;
}

page-reservas ion-content .descripcion-textarea {
  width: 100%;
  height: auto;
  /* Ajusta la altura según el contenido */
  padding: 0;
  /* Elimina el relleno para que ocupe el 100% del ancho */
  border: none;
  /* Elimina el borde si es necesario */
  resize: none;
  /* Evita que el usuario cambie el tamaño manualmente */
  overflow: hidden;
  /* Controla el desbordamiento de contenido si lo hubiera */
}

page-reservas #footer {
  width: 100%;
  height: 58px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: 15px;
}

page-reservas .grabando {
  background-color: red;
  color: white;
}

page-reservas .detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
}

page-reservas ion-footer ion-grid ion-row {
  margin-bottom: -9px;
}

/* Estilo cuando está grabando (rojo) */
.grabando {
  background-color: red;
  color: white;
}

/* Estilo cuando está detenido (por defecto o de otro color) */
.detenido {
  background-color: #007bff;
  /* Puedes cambiar esto al color que prefieras */
  color: white;
}

#gestionProductosContainer {
  max-height: 500px;
  /* Ajusta según la altura deseada */
  overflow-y: auto;
  /* Habilita el desplazamiento vertical */
}

#gestionProductosContainer::-webkit-scrollbar {
  width: 1.5px;
  /* Grosor del scrollbar */
  height: 6px;
}

#gestionProductosContainer::-webkit-scrollbar-thumb {
  border-radius: 8px;
  /* Radio de las esquinas del scrollbar */
  background-color: rgba(116, 211, 57, 0.329);
}

page-reservas-sin-asignar .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-reservas-sin-asignar .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

page-reservas-sin-asignar .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

page-reservas-sin-asignar .puntero {
  cursor: pointer;
}

page-reservas-sin-asignar .end {
  float: right;
}

page-reservas-sin-asignar .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

page-reservas-sin-asignar .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

page-reservas-tipos-por-valor .nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 24px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: #333;
  /* Color del texto */
  display: block;
}

page-reservas-tipos-por-valor .divoverflowy::-webkit-scrollbar {
  width: 2px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: rgba(36, 36, 39, 0.329);
}

page-reservas-tipos-por-valor .divoverflowyleft {
  text-align: center;
  background-color: white;
  height: calc(100vh - 15px);
  overflow-y: auto;
}

page-reservas-tipos-por-valor .divoverflowy {
  text-align: center;
  background-color: white;
  height: calc(83vh - 15px);
  overflow-y: auto;
}

page-reservas-tipos-por-valor .puntero {
  cursor: pointer;
}

page-reservas-tipos-por-valor .end {
  float: right;
}

page-reservas-tipos-por-valor .endCursor {
  float: right;
  color: red;
  cursor: pointer;
}

page-reservas-tipos-por-valor .ediCursor {
  float: left;
  color: #346605;
  cursor: pointer;
  margin-right: 8px;
}

page-reservas-tipos-por-valor .item-container-tiporeserva {
  border: 1px solid #ccc;
  padding: 1px;
  margin: 1px 0;
  background-color: #cfc9c9;
}

page-reservas-tipos-por-valor #guardar-button {
  background-color: #007bff;
  cursor: pointer;
  color: #fff;
  /* Otros estilos de botón */
}

page-reservas-tipos-por-valor .valor-input {
  width: 100%;
  padding: 5px;
  margin-top: 5px;
  /* Otros estilos de input */
}

page-salon {
  /* Agrega este estilo al final de tu archivo CSS */
  /* Agrega reglas de medios para dispositivos móviles */
}

page-salon .end {
  float: right;
}

page-salon .nota {
  border-top: 1.2em solid rgba(255, 255, 255, 0.3);
  padding: 0;
  -webkit-box-shadow: 2px 2px 8px #555;
  box-shadow: 2px 2px 8px #555;
  background-color: #5f5d56;
  background-image: url("assets/imgs/nota.png");
  border-radius: 4px;
  float: left;
}

page-salon .description-container {
  padding: 10px;
  border-radius: 5px;
  margin-top: 10px;
}

page-salon .description {
  margin-top: 5px;
  color: #f2f2f2;
}

page-salon * {
  margin: 0;
  padding: 0;
}

page-salon .cantidadnum {
  font-size: 140%;
  margin: 1em;
  background: #070707;
  background-color: white;
}

page-salon .cantidadnumdes {
  font-size: 70%;
  margin: 1em;
  background: #070707;
  background-color: white;
}

page-salon body {
  font-family: arial,sans-serif;
  font-size: 100%;
  margin: 1em;
  background: #666;
  color: #fff;
}

page-salon p {
  font-size: 100%;
  font-weight: normal;
}

page-salon h2 {
  font-size: 100%;
  font-weight: normal;
  margin-left: 2em;
}

page-salon .ulli {
  list-style: none;
  background-color: #f2f2f2;
  border-radius: 10px;
  margin: 10px;
  padding: 10px;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

page-salon .ulli img {
  float: right;
  -webkit-box-shadow: 5px 5px 7px rgba(33, 33, 33, 0.7);
  box-shadow: 5px 5px 7px rgba(33, 33, 33, 0.7);
  border-radius: 4px;
  max-width: 10%;
  height: 23px;
}

page-salon .ulli {
  margin: 1em;
  float: left !important;
  max-width: 25%;
}

page-salon .ulli h2 {
  font-size: 90%;
  font-weight: bold;
  padding-bottom: 10px;
  float: left;
}

page-salon .ulli p {
  font-family: "Reenie Beanie",arial,sans-serif;
  font-size: 90%;
  float: left;
  margin-left: 1em;
}

page-salon .ulli:nth-child(even) a {
  position: relative;
  top: 5px;
  background: #cfc;
}

page-salon .ulli:nth-child(3n) a {
  position: relative;
  top: -5px;
  background: #ccf;
}

page-salon .ulli:nth-child(5n) a {
  position: relative;
  top: -10px;
}

page-salon .ulli a:hover, page-salon .ulli a:focus {
  box-shadow: 10px 10px 7px rgba(0, 0, 0, 0.7);
  -moz-box-shadow: 10px 10px 7px rgba(0, 0, 0, 0.7);
  -webkit-box-shadow: 10px 10px 7px rgba(0, 0, 0, 0.7);
  position: relative;
  z-index: 5;
}

page-salon .ulli {
  text-align: center;
}

page-salon .ulli {
  display: inline;
  padding-right: 1em;
}

page-salon .ulli img {
  color: #fff;
}

page-salon .pedido {
  float: left;
}

page-salon .pedidoimg {
  border-top: 0.2em solid rgba(255, 255, 255, 0.3);
  padding: 2px;
  -webkit-box-shadow: 2px 2px 8px #555;
  box-shadow: 2px 2px 8px #555;
  margin: 0px 12px;
  cursor: pointer;
  border-radius: 10px;
  font-size: 25px;
}

page-salon .pedidoNum {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 4vh;
  /* Reducir la altura del contador para que se adapte mejor al contenido */
  font-size: 15px;
  /* Mantener el tamaño relativo de la fuente */
  color: #fff;
  background-color: #5d8a87;
  border-radius: 10px;
  text-align: center;
  padding: 3%;
  /* Ajustar el relleno para el texto no se salga del contenedor */
  margin: 0 auto;
  -webkit-box-shadow: 2px 2px 8px #555;
  box-shadow: 2px 2px 8px #555;
  margin-bottom: 3px;
}

page-salon .color-domicilio {
  background: #562f2f;
  /* Cambia el color a rojo para Domicilio # */
}

page-salon .color-turno {
  background: #3c3c62;
  /* Cambia el color a azul para Turno # */
}

page-salon .color-mesa {
  background: #425d42;
  /* Cambia el color a verde para Mesa # */
}

page-salon .color-alerta {
  background-color: red;
}

page-salon .alerta {
  background-color: red;
  /* Cambia el color del fondo del elemento alert activa */
}

page-salon .gray-content .ulli.alerta {
  background-color: red;
  /* Cambia el color del fondo del elemento alert activa */
}

page-salon .ulli.alerta {
  background-color: red;
  /* Cambia el color del fondo del elemento alert activa */
}

@keyframes susurro {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
  /* Define la distancia y dirección que deseas para el movimiento */
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

page-salon .move-animation {
  -webkit-animation: susurro 2s infinite alternate;
  animation: susurro 2s infinite alternate;
}

page-salon .pendiente {
  background-color: #F08080;
  margin-left: 1em;
}

page-salon .pendienteelaborado {
  background-color: #FAEBD7;
  margin-left: 1em;
}

page-salon .gestionado {
  background-color: #425D42;
  border-radius: 2px;
  margin-left: 1em;
}

page-salon .cancelado {
  background-color: #FF0000;
  margin-left: 1em;
}

page-salon .facturado {
  background-color: aqua;
  margin-left: 1em;
}

page-salon .cocina {
  background-color: #87CEFA;
  padding-left: 10px;
  margin-left: 1em;
}

page-salon .salon {
  background-color: #483D8B;
  margin-left: 1em;
}

page-salon .bar {
  background-color: #1c344d;
  margin-left: 1em;
}

page-salon .contador {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 5vh;
  /* Reducir la altura del contador para que se adapte mejor al contenido */
  font-size: 15px;
  /* Mantener el tamaño relativo de la fuente */
  color: #fff;
  background-color: #5d8a87;
  border-radius: 10px;
  text-align: center;
  padding: 3%;
  /* Ajustar el relleno para el texto no se salga del contenedor */
  margin: 0 auto;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}

page-salon .tiempo {
  font-weight: bold;
}

page-salon .gray-content .ulli {
  border: 2px solid #5d8a87;
  /* Añade un borde alrededor del contenedor */
  border-radius: 10px;
  /* Redondea las esquinas del contenedor */
  margin: 10px 0;
  /* Añade un espacio en la parte superior e inferior del contenedor */
  padding: 10px;
  /* Añade espacio interno al contenedor */
  /* Define un gradiente de fondo para el contenedor */
  background: linear-gradient(45deg, #5d8a87, #434343);
  color: #fff;
  /* Establece el color del texto como blanco */
  -webkit-box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.3);
}

page-salon .gray-content .pedidoNum {
  display: block;
  /* Cambia el elemento strong a bloque para ocupar todo el ancho disponible */
  text-align: center;
  /* Centra el texto horizontalmente */
  font-size: 16px;
  /* Define el tamaño de fuente */
  margin: 5px 0;
  /* Añade espacio en la parte superior e inferior del elemento */
}

page-salon .gray-content .contador {
  text-align: center;
  /* Centra el texto horizontalmente */
  margin-top: 5px;
  /* Añade espacio en la parte superior del elemento */
}

@media (min-width: 600px) {
  page-salon .ulli {
    width: 100%;
  }
  page-salon .nota {
    width: 100%;
  }
}

@media (min-width: 300px) {
  page-salon .ulli {
    width: 100%;
  }
  page-salon .nota {
    width: 100%;
  }
}

@media only screen and (max-width: 600px) {
  page-salon .ulli {
    width: 100%;
    /* Asegura que el elemento ocupe todo el ancho en dispositivos móviles */
    max-width: none;
    /* Elimina cualquier límite máximo de ancho */
    margin: 5px 0;
    /* Reduce el espacio alrededor del elemento */
  }
  page-salon .pedidoNum {
    font-size: 14px;
    /* Reducir el tamaño de fuente para dispositivos móviles */
    height: auto;
    /* Permite que la altura del elemento se adapte al contenido */
  }
  page-salon .contador {
    font-size: 17px;
    /* Reducir el tamaño de fuente para dispositivos móviles */
  }
  page-salon .ulli img {
    max-width: 15%;
    /* Reducir el tamaño de la imagen para que no se vea tan grande en dispositivos móviles */
    height: auto;
    /* Permite que la altura de la imagen se adapte proporcionalmente al ancho */
  }
}

page-simulador-cuentas-por-cobrar {
  /* Estilos para la lista de cuotas */
  /* Estilos para las filas de cuotas */
  /* Estilos para las celdas de cuota */
  /* Estilos para las filas de cuotas */
  /* Estilos para las celdas de cuota */
  /* Estilo para las opciones dentro del ion-select */
  /* Asegurarse de que el contenido sea visible */
  /* Estilo adicional para el ion-option */
}

page-simulador-cuentas-por-cobrar .fullscreen-modal {
  height: 100%;
  width: 100%;
}

page-simulador-cuentas-por-cobrar .cuota-grid {
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 10px;
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background-color: #f2f2f2;
  /* Agregamos el fondo gris */
}

page-simulador-cuentas-por-cobrar .cuota-grid .header {
  background-color: #f2f2f2;
  font-weight: bold;
  border: 1px solid #ccc;
  text-align: center;
}

page-simulador-cuentas-por-cobrar .cuota:first-child {
  font-weight: bold;
}

page-simulador-cuentas-por-cobrar .cuota-col {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

page-simulador-cuentas-por-cobrar .cuota-col:first-child {
  width: 15%;
}

page-simulador-cuentas-por-cobrar .cuota {
  text-align: center;
}

page-simulador-cuentas-por-cobrar .cuota-col {
  border-right: 1px solid #ccc;
}

page-simulador-cuentas-por-cobrar .cuota-col:last-child {
  border: none;
}

page-simulador-cuentas-por-cobrar .cuota-extra:first-child {
  font-weight: bold;
}

page-simulador-cuentas-por-cobrar .cuota-col-extra {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

page-simulador-cuentas-por-cobrar .cuota-col-extra:first-child {
  width: 45%;
  height: auto !important;
}

page-simulador-cuentas-por-cobrar .cuota-extra {
  text-align: center;
}

page-simulador-cuentas-por-cobrar .cuota-col-extra {
  border-right: 1px solid #ccc;
}

page-simulador-cuentas-por-cobrar #custom-item-creditos {
  background: #ffffff;
  padding-left: 10px;
  padding-bottom: 10px;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  margin: 10px 0;
}

page-simulador-cuentas-por-cobrar #custom-label-creditos {
  color: white;
  font-weight: bold;
}

page-simulador-cuentas-por-cobrar #custom-select-creditos {
  border-radius: 8px;
  background: #151414;
  color: white;
  -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  margin-top: 5px;
}

page-simulador-cuentas-por-cobrar #ion-select-creditos::part(text) {
  color: white;
}

page-simulador-cuentas-por-cobrar #ion-select-creditos::part(placeholder) {
  color: white;
}

page-simulador-cuentas-por-cobrar #custom-select-creditos {
  --padding-start: 10px;
  --padding-end: 10px;
  --background: #f7f7f7;
  --border-radius: 8px;
  --color:white;
  --box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

page-simulador-cuentas-por-cobrar #custom-select-creditos .select-interface-option {
  --padding: 10px;
  --background: #fff;
  --border-bottom: 1px solid #ddd;
  --border-radius: 8px;
  --color:white;
  font-size: 16px;
}

page-simulador-cuentas-por-cobrar .select-interface-option {
  --padding: 10px;
  --background: #fff;
  --border-bottom: 1px solid #ddd;
  --border-radius: 8px;
  font-size: 16px;
  color: white;
}

page-simulador-cuentas-por-cobrar #custom-select-creditos .select-interface-option {
  white-space: normal;
  /* Permitir el wrap del texto */
}

page-simulador-cuentas-por-cobrar #custom-select-creditos .select-text {
  padding: 10px;
  font-size: 16px;
  color: white;
  white-space: normal;
  /* Permitir el wrap del texto */
}

page-simulador-cuentas-por-cobrar .select-text {
  padding: 10px;
  font-size: 16px;
  color: white;
  white-space: normal;
  /* Permitir el wrap del texto */
}

page-simulador-cuentas-por-cobrar .plansepare {
  background-color: #004085;
  /* Azul oscuro profesional */
  color: #ffffff;
  /* Texto blanco */
  font-size: 16px;
  /* Tamaño de fuente ligeramente más grande */
  font-weight: 500;
  /* Peso de fuente medio */
  text-transform: uppercase;
  /* Texto en mayúsculas */
  border-radius: 5px;
  /* Bordes suavemente redondeados */
  -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* Sombra ligera */
  padding: 2px 5px;
  /* Espaciado interno */
}

page-simulador-cuentas-por-cobrar .plansepare ion-icon {
  font-size: 18px;
  margin-right: 10px;
}

page-simulador-cuentas-por-cobrar .plansepare:hover {
  background-color: #002752;
  /* Color más oscuro en hover */
}

page-simulador-cuentas-por-cobrar .plansepare:active {
  background-color: #282c31;
  /* Color más oscuro al presionar */
}

page-simulador-cuentas-por-cobrar .inputTextArea textarea {
  text-align: left;
  font-size: 18px;
  padding-right: 0px;
}

page-sql {
  /* Contenedor general del board */
  /* Cada columna por compañía */
  /* Estilos de las tarjetas de tareas */
  /* Barra de progreso */
  /* Título de la columna */
  /* Grupo de tareas (nombre de la compañía) */
  /* Lista de tareas */
  /* Cada tarea individual */
  /* Detalles de la tarea */
  /* Cabecera de la tarea: tiempo y descripción */
  /* Barra de progreso */
}

page-sql #texta {
  overflow: auto;
  height: auto;
  font: inherit;
  color: red !important;
  width: 100% !important;
  height: 190px !important;
}

page-sql textarea {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  overflow: hidden;
  /* demo only: */
  padding: 10px;
  width: 100%;
  font-size: 14px;
  margin: 2px auto;
  display: block;
  border-radius: 5px;
  border: 4px solid #556677;
  width: 900px;
}

page-sql .textareaMensaje {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  overflow: hidden;
  text-align: left;
  /* demo only: */
  width: 900px;
  font-size: 12px;
  margin: 7px auto;
  display: block;
  border-radius: 1px;
  border: 1px solid #8a079b;
}

page-sql .subir-registros-col {
  padding: 10px;
  background-color: #556677;
}

page-sql ion-card {
  border-radius: 8px;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

page-sql ion-card-header {
  font-weight: bold;
  color: #333;
}

page-sql canvas {
  width: 100%;
  height: 100px;
}

page-sql .task-board {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 10px;
}

page-sql .company-column {
  width: 30%;
  /* Ajusta según cuántas columnas quieras mostrar */
  padding: 10px;
  background-color: #f4f4f4;
  border-radius: 8px;
}

page-sql .task-card ion-card {
  margin-bottom: 15px;
  background-color: white;
  border: 1px solid #ddd;
  -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  -webkit-transition: -webkit-transform 0.2s ease-in-out;
  transition: -webkit-transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
}

page-sql .task-card ion-card:hover {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
}

page-sql .progress-bar-container {
  background-color: #e0e0e0;
  border-radius: 4px;
  overflow: hidden;
  margin-top: 10px;
}

page-sql .progress-bar {
  height: 10px;
  background-color: #4caf50;
  /* Verde para progreso completado */
  -webkit-transition: width 0.3s ease-in-out;
  transition: width 0.3s ease-in-out;
}

page-sql .company-column h3 {
  text-align: center;
  font-weight: bold;
  background-color: #0078d4;
  /* Color de cabecera similar a Azure DevOps */
  color: white;
  padding: 10px;
  border-radius: 4px 4px 0 0;
}

page-sql .task-group {
  margin-bottom: 20px;
  border-bottom: 1px solid #ccc;
}

page-sql .task-group-header {
  background-color: #2b2b2b;
  color: #fff;
  padding: 10px;
  font-weight: bold;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

page-sql .task-group-header ion-icon {
  margin-right: 10px;
}

page-sql .task-list {
  padding: 10px 20px;
}

page-sql .task-item {
  padding: 10px;
  border-bottom: 1px solid #eaeaea;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-sql .task-item:hover {
  background-color: #f0f0f0;
}

page-sql .task-details {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

page-sql .task-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 10px;
}

page-sql .task-time {
  font-weight: bold;
}

page-sql .task-date {
  color: #888;
}

page-sql .progress-bar-container {
  position: relative;
  height: 8px;
  background-color: #eaeaea;
  border-radius: 4px;
}

page-sql .progress-bar {
  height: 100%;
  background-color: #4caf50;
  border-radius: 4px;
}

page-sql .progress-text {
  position: absolute;
  right: 10px;
  top: -20px;
  color: #666;
  font-size: 12px;
}

page-sql .tabla-scroll {
  max-height: 300px;
  overflow-y: auto;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 8px;
  margin-bottom: 16px;
  background: #f9f9f9;
}

page-sql .tabla-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px solid #eee;
  font-size: 14px;
}

page-sql .contenedor-tablas {
  max-width: 600px;
  margin: 0 auto;
  padding: 12px;
}

page-sql .tabla-header {
  font-weight: bold;
  padding: 10px 0;
}

page-sql .tabla-scroll {
  max-height: 300px;
  overflow-y: auto;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 8px;
  margin: 16px 0;
  background: #f9f9f9;
}

page-sql .tabla-item {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 6px 4px;
  border-bottom: 1px solid #eee;
  font-size: 14px;
}

page-sql .tabla-nombre {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 85%;
}

page-sql .tabla-linea {
  max-height: 500px;
  overflow-y: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 6px 4px;
  border-bottom: 1px solid #eee;
}

page-sql .tabla-nombre-resumen {
  font-size: 13px;
  max-width: 80%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

page-subir-registros .subir-registros-grid {
  margin-top: 20px;
}

page-subir-registros .subir-registros-row {
  border-bottom: 1px solid #ccc;
}

page-subir-registros .subir-registros-col {
  padding: 10px;
}

page-subir-registros .file-input-container {
  position: relative;
  display: inline-block;
  width: 100%;
}

page-subir-registros .file-input-label {
  display: inline-block;
  padding: 10px;
  background-color: #387ef5;
  color: white;
  border-radius: 4px;
  cursor: pointer;
  width: 100%;
  text-align: center;
  font-size: 14px;
}

page-subir-registros .file-input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

page-subir-registros .button-subir-registros {
  font-size: 12px;
  padding: 5px 10px;
}

page-subir-registros .subir-registros-grid-comparison {
  margin-top: 20px;
}

page-subir-registros .subir-registros-row-comparison {
  background-color: #f9f9f9;
  margin-bottom: 5px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

page-subir-registros .subir-registros-col-comparison {
  padding: 5px;
  border: 1px solid #ddd;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-height: 40px;
}

page-subir-registros input[type="text"] {
  width: 100%;
  border: none;
  background-color: #f9f9f9;
  padding: 5px;
  text-align: center;
}

.nombrereservatitulo {
  text-align: center;
  /* Para centrar el texto */
  font-size: 12px;
  /* Tamaño de fuente */
  font-weight: bold;
  /* Negrita */
  color: #fefefefb;
  /* Color del texto */
  display: block;
}

.color-list {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #fff;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  z-index: 9999;
}

.color-item {
  width: 30px;
  height: 30px;
  margin: 5px;
  cursor: pointer;
}

page-turnos .fullscreen-modal {
  height: 100%;
  width: 100%;
}

page-turnos .atras {
  margin: 0 6px;
  min-width: 50px;
  border-radius: 8px;
  opacity: 0.5;
  background-color: #53514f;
}

page-turnos .select {
  cursor: pointer;
}

page-turnos .container-turnos {
  display: block;
}

page-ubicacion .cuentaporcobrar {
  color: #920f0f;
}

page-usuario-select ion-content {
  --background: #fff;
}

page-usuario-select ion-content .paginador {
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-usuario-select ion-content .paginador:hover {
  background-color: #e53935;
}

page-usuario-select ion-content .paginador #input {
  color: cadetblue;
}

page-usuario-select ion-content .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

page-usuario-select ion-content .row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: #2c2929;
  cursor: pointer;
}

page-usuario-select ion-content .col {
  width: 33.33%;
  margin-right: 10px;
}

page-usuario-select ion-content .col:last-child {
  margin-right: 0;
}

page-usuario-select ion-footer {
  background-color: aliceblue;
}

page-usuarios .usuarioValido {
  text-align: left;
  background-color: red;
  font-size: 12px;
}

page-versionamiento .modal_content {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  margin: 0 auto;
  color: #333;
  background: #e8e8e8;
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e8e8e8));
  background: linear-gradient(to bottom, #fff 0%, #e8e8e8 100%);
  border-radius: 5px;
  -webkit-box-shadow: 0 2px 3px rgba(51, 51, 51, 0.35);
  box-shadow: 0 2px 3px rgba(51, 51, 51, 0.35);
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  overflow: hidden;
}

page-versionamiento textarea {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  overflow: hidden;
  /* demo only: */
  padding: 10px;
  width: 400px;
  font-size: 14px;
  margin: 2px auto;
  display: block;
  border-radius: 5px;
  border: 4px solid #556677;
}

page-versionamiento .textareaMensaje {
  -webkit-box-sizing: padding-box;
  box-sizing: padding-box;
  overflow: hidden;
  text-align: left;
  /* demo only: */
  width: 500px;
  font-size: 12px;
  margin: 7px auto;
  display: block;
  border-radius: 1px;
  border: 1px solid #8a079b;
  color: black;
}

page-versionamiento .commit-id {
  width: 100%;
  padding: 10px;
  border: none;
  background: #f1f1f1;
  font-size: 14px;
  color: #333;
  border-radius: 5px;
  resize: none;
}

page-versionamiento .textareaMensaje {
  width: 100%;
  font-size: 14px;
  padding: 10px;
  background: #e9ecef;
  border: 1px solid #ccc;
  border-radius: 5px;
  color: black;
  resize: none;
}

page-whatsapp ion-content {
  --background: #fff;
}

page-whatsapp ion-content .paginador {
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  background: -webkit-gradient(linear, left top, right top, from(#ff6b6b), to(#f5515f));
  background: linear-gradient(to right, #ff6b6b, #f5515f);
  background-color: #f5515f;
  color: white;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

page-whatsapp ion-content .paginador:hover {
  background-color: #e53935;
}

page-whatsapp ion-content .paginador #input {
  color: cadetblue;
}

page-whatsapp ion-content .grid-container {
  max-width: 1200px;
  margin: 0 auto;
}

page-whatsapp ion-content .row {
  margin-bottom: 2px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background-color: aliceblue;
  color: #2c2929;
  cursor: pointer;
}

page-whatsapp ion-content .col {
  width: 33.33%;
  margin-right: 10px;
}

page-whatsapp ion-content .col:last-child {
  margin-right: 0;
}

page-whatsapp ion-footer {
  background-color: aliceblue;
}