{"version":3,"sources":["src/scss/light-modal.scss","dist/css/light-modal.css"],"names":[],"mappings":"AAEA,aACE,oBAAa,CACb,kBAAc,CACd,qBAAc,CACd,qBAAiB,CACjB,qBAAiB,CACjB,mBAAe,CACf,YAAa,CACb,cAAe,CACf,sBAA4B,CAC5B,KAAM,CACN,QAAS,CACT,MAAO,CACP,kBAAmB,CACnB,sBAAuB,CACvB,OAAQ,CACR,YAAa,CACb,wBAAyB,CACzB,6BAA8B,CAC9B,iBCDF,CDGE,qBACE,4BAA6B,CAC7B,UAAW,CACX,2BAA4B,CAC5B,kBAAoB,CACpB,iBAAkB,CAClB,8BAA+B,CAC/B,eAAgB,CAChB,YAAa,CACb,qBCAJ,CDTG,yBAWG,cAAe,CACf,kBCEN,CDdG,mCAgBG,2BCEN,CDCE,oBACE,YAA4B,CAC5B,yBAA8B,CAC9B,YAAa,CACb,6BAA8B,CAC9B,kBCEJ,CDAE,qBACE,QAAS,CACT,eCGJ,CDLG,6CAIG,eCKN,CDFE,kBACE,YAAa,CACb,aAAc,CACd,gBCKJ,CDHE,oBACE,YAA4B,CAC5B,yBAA8B,CAC9B,gBAAiB,CACjB,YAAa,CACb,kBCMJ,CDHE,+CAEE,oBAAqB,CACrB,UAAW,CACX,gBAAiB,CACjB,kBAAoB,CACpB,6BAA8B,CAC9B,eAAgB,CAChB,aAAc,CACd,SAAU,CACV,kCCKJ,CDfG,2DAYG,UCON,CDJE,wBACE,iBAAkB,CAClB,SAAU,CACV,WCOJ,CDLE,uBACE,eAAgB,CAChB,eCQJ,CDNE,qBACE,iBAAkB,CAClB,QAAS,CACT,0BAA2B,CAC3B,QAAS,CACT,cAAe,CACf,yBAA8B,CAC9B,kBAAoB,CACpB,UAAW,CACX,iBAAkB,CAClB,cCSJ,CDLA,oBACE,yBAA8B,CAC9B,YAAa,CACb,kBCQF,CDLA,kFAGI,UAAW,CACX,WAAY,CACZ,iBAAkB,CAClB,2BCOJ,CDbA,8FASM,+BCSN,CDlBA,yCAaI,iBAAkB,CAClB,WAAY,CACZ,OAAQ,CACR,uBAAwB,CACxB,qBAAsB,CACtB,yBCSJ,CD3BA,yCAqBI,iBAAkB,CAClB,UAAW,CACX,OAAQ,CACR,uBAAwB,CACxB,qBAAsB,CACtB,uBCUJ,CDNA,yBACE,yCAEI,SCQJ,CDVA,yCAKI,QCQJ,CACF,CDJA,yBACE,GACE,SCOF,CDJA,GACE,SCMF,CACF,CDbA,iBACE,GACE,SCOF,CDJA,GACE,SCMF,CACF,CDHA,OACE,4BAAqB,CAArB,oBCMF,CDHA,0BACE,aACE,qBAAiB,CACjB,qBCMF,CACF","file":"light-modal.dce9200f.css","sourceRoot":"..","sourcesContent":["// New Variables for easy customization\r\n\r\n.light-modal {\r\n  --lm-body-bg: #845ec2;\r\n  --lm-modal-bg: #000000;\r\n  --lm-close-bg: #ff6f91;\r\n  --lm-small-modal: 30vw;\r\n  --lm-large-modal: 50vw;\r\n  --lm-font-size: 14px;\r\n  display: none;\r\n  position: fixed;\r\n  background: rgba(0, 0, 0, 0);\r\n  top: 0;\r\n  bottom: 0;\r\n  left: 0;\r\n  align-items: center;\r\n  justify-content: center;\r\n  right: 0;\r\n  z-index: 9000;\r\n  transition: background 1s;\r\n  font-size: var(--lm-font-size);\r\n  visibility: hidden;\r\n\r\n  &-content {\r\n    background: var(--lm-body-bg);\r\n    color: #fff;\r\n    width: var(--lm-small-modal);\r\n    border-radius: 0.2em;\r\n    position: relative;\r\n    max-height: calc(100vh - 150px);\r\n    line-height: 1.4;\r\n    display: flex;\r\n    flex-direction: column;\r\n    img {\r\n      max-width: 100%;\r\n      border-radius: 0.2em;\r\n    }\r\n\r\n    &.large-content {\r\n      width: var(--lm-large-modal);\r\n    }\r\n  }\r\n  &-header {\r\n    padding: 20px 20px 20px 20px;\r\n    background: rgba(0, 0, 0, 0.2);\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n  }\r\n  &-heading {\r\n    margin: 0;\r\n    font-size: 1.5em;\r\n    + .light-modal-close-icon {\r\n      position: static;\r\n    }\r\n  }\r\n  &-body {\r\n    padding: 20px;\r\n    overflow: auto;\r\n    max-height: 450px;\r\n  }\r\n  &-footer {\r\n    padding: 20px 20px 20px 20px;\r\n    background: rgba(0, 0, 0, 0.2);\r\n    text-align: right;\r\n    display: flex;\r\n    align-items: center;\r\n  }\r\n\r\n  &-close-icon,\r\n  &-close-btn {\r\n    text-decoration: none;\r\n    color: #fff;\r\n    padding: 5px 10px;\r\n    border-radius: 0.2em;\r\n    background: var(--lm-close-bg);\r\n    font-size: 1.5em;\r\n    line-height: 1;\r\n    opacity: 1;\r\n    transition: opacity 0.2s ease-in-out;\r\n    &:hover {\r\n      opacity: 0.9;\r\n    }\r\n  }\r\n  &-close-icon {\r\n    position: absolute;\r\n    top: -15px;\r\n    right: -15px;\r\n  }\r\n  &-close-btn {\r\n    font-size: 1.3em;\r\n    line-height: 1.4;\r\n  }\r\n  &-caption {\r\n    position: absolute;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    top: 100%;\r\n    padding: 10px 0;\r\n    background: rgba(0, 0, 0, 0.2);\r\n    border-radius: 0.2em;\r\n    width: 100%;\r\n    text-align: center;\r\n    margin-top: 5px;\r\n  }\r\n}\r\n\r\n.light-modal:target {\r\n  background: rgba(0, 0, 0, 0.5);\r\n  display: flex;\r\n  visibility: visible;\r\n}\r\n\r\n.light-modal-navigation {\r\n  .navigation-next,\r\n  .navigation-prev {\r\n    width: 32px;\r\n    height: 32px;\r\n    border-color: #fff;\r\n    transition: border-color 0.2s;\r\n\r\n    &:hover {\r\n      border-color: rgba(255, 255, 255, 0.7);\r\n    }\r\n  }\r\n  .navigation-next {\r\n    position: absolute;\r\n    right: -50px;\r\n    top: 50%;\r\n    border-bottom: 1px solid;\r\n    border-left: 1px solid;\r\n    transform: rotate(-135deg);\r\n  }\r\n  .navigation-prev {\r\n    position: absolute;\r\n    left: -50px;\r\n    top: 50%;\r\n    border-bottom: 1px solid;\r\n    border-left: 1px solid;\r\n    transform: rotate(45deg);\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .light-modal-navigation {\r\n    .navigation-next {\r\n      right: 5px;\r\n    }\r\n    .navigation-prev {\r\n      left: 5px;\r\n    }\r\n  }\r\n}\r\n\r\n@keyframes basic {\r\n  0% {\r\n    opacity: 0;\r\n  }\r\n\r\n  100% {\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n.basic {\r\n  animation-name: basic;\r\n}\r\n\r\n@media (max-width: 1000px) {\r\n  .light-modal {\r\n    --lm-small-modal: 70vw;\r\n    --lm-large-modal: 70vw;\r\n  }\r\n}\r\n",".light-modal {\n  --lm-body-bg: #845ec2;\n  --lm-modal-bg: #000000;\n  --lm-close-bg: #ff6f91;\n  --lm-small-modal: 30vw;\n  --lm-large-modal: 50vw;\n  --lm-font-size: 14px;\n  display: none;\n  position: fixed;\n  background: rgba(0, 0, 0, 0);\n  top: 0;\n  bottom: 0;\n  left: 0;\n  align-items: center;\n  justify-content: center;\n  right: 0;\n  z-index: 9000;\n  transition: background 1s;\n  font-size: var(--lm-font-size);\n  visibility: hidden;\n}\n\n.light-modal-content {\n  background: var(--lm-body-bg);\n  color: #fff;\n  width: var(--lm-small-modal);\n  border-radius: 0.2em;\n  position: relative;\n  max-height: calc(100vh - 150px);\n  line-height: 1.4;\n  display: flex;\n  flex-direction: column;\n}\n\n.light-modal-content img {\n  max-width: 100%;\n  border-radius: 0.2em;\n}\n\n.light-modal-content.large-content {\n  width: var(--lm-large-modal);\n}\n\n.light-modal-header {\n  padding: 20px 20px 20px 20px;\n  background: rgba(0, 0, 0, 0.2);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.light-modal-heading {\n  margin: 0;\n  font-size: 1.5em;\n}\n\n.light-modal-heading + .light-modal-close-icon {\n  position: static;\n}\n\n.light-modal-body {\n  padding: 20px;\n  overflow: auto;\n  max-height: 450px;\n}\n\n.light-modal-footer {\n  padding: 20px 20px 20px 20px;\n  background: rgba(0, 0, 0, 0.2);\n  text-align: right;\n  display: flex;\n  align-items: center;\n}\n\n.light-modal-close-icon, .light-modal-close-btn {\n  text-decoration: none;\n  color: #fff;\n  padding: 5px 10px;\n  border-radius: 0.2em;\n  background: var(--lm-close-bg);\n  font-size: 1.5em;\n  line-height: 1;\n  opacity: 1;\n  transition: opacity 0.2s ease-in-out;\n}\n\n.light-modal-close-icon:hover, .light-modal-close-btn:hover {\n  opacity: 0.9;\n}\n\n.light-modal-close-icon {\n  position: absolute;\n  top: -15px;\n  right: -15px;\n}\n\n.light-modal-close-btn {\n  font-size: 1.3em;\n  line-height: 1.4;\n}\n\n.light-modal-caption {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  top: 100%;\n  padding: 10px 0;\n  background: rgba(0, 0, 0, 0.2);\n  border-radius: 0.2em;\n  width: 100%;\n  text-align: center;\n  margin-top: 5px;\n}\n\n.light-modal:target {\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  visibility: visible;\n}\n\n.light-modal-navigation .navigation-next,\n.light-modal-navigation .navigation-prev {\n  width: 32px;\n  height: 32px;\n  border-color: #fff;\n  transition: border-color 0.2s;\n}\n\n.light-modal-navigation .navigation-next:hover,\n.light-modal-navigation .navigation-prev:hover {\n  border-color: rgba(255, 255, 255, 0.7);\n}\n\n.light-modal-navigation .navigation-next {\n  position: absolute;\n  right: -50px;\n  top: 50%;\n  border-bottom: 1px solid;\n  border-left: 1px solid;\n  transform: rotate(-135deg);\n}\n\n.light-modal-navigation .navigation-prev {\n  position: absolute;\n  left: -50px;\n  top: 50%;\n  border-bottom: 1px solid;\n  border-left: 1px solid;\n  transform: rotate(45deg);\n}\n\n@media (max-width: 480px) {\n  .light-modal-navigation .navigation-next {\n    right: 5px;\n  }\n  .light-modal-navigation .navigation-prev {\n    left: 5px;\n  }\n}\n\n@-webkit-keyframes basic {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n@keyframes basic {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.basic {\n  -webkit-animation-name: basic;\n          animation-name: basic;\n}\n\n@media (max-width: 1000px) {\n  .light-modal {\n    --lm-small-modal: 70vw;\n    --lm-large-modal: 70vw;\n  }\n}\n/*# sourceMappingURL=light-modal.css.map */"]}