/*
 * Main application stylesheet
 *
 * Note: With Propshaft, we link stylesheets directly in the layout
 * This file is kept for additional custom styles only
 */

/* Show class for JavaScript interactions */
.show {
  display: block !important;
}

/* Ensure base styles */
button {
  border: none;
  font-family: inherit;
  cursor: pointer;
}

/* Drag and drop styles */
.drag-over {
  background-color: rgba(99, 102, 241, 0.1);
  border: 2px dashed rgba(99, 102, 241, 0.5);
}

.operation-item {
  transition: all 0.3s ease;
}

.operation-item.drag-over-top {
  border-top: 3px solid #4F46E5;
  margin-top: 8px;
}

.operation-item.drag-over-bottom {
  border-bottom: 3px solid #4F46E5;
  margin-bottom: 8px;
}

.draggable-generator {
  cursor: move;
}

.draggable-generator.dragging {
  opacity: 0.5;
}

/* Slide animations for example toggle */
@keyframes slide-in-right {
  from {
    opacity: 0;
    transform: translateX(100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slide-in-left {
  from {
    opacity: 0;
    transform: translateX(-100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.slide-in-right {
  animation: slide-in-right 0.4s ease-out;
}

.slide-in-left {
  animation: slide-in-left 0.4s ease-out;
}


/* Input principale nelle celle cifre */
.quaderno-input {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  text-align: center;
  font-family: inherit;
  font-weight: bold;
  font-size: 1.25em;
}

/* Input piccolo per riporti/prestiti */
.quaderno-input-small {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  text-align: center;
  font-family: inherit;
  font-weight: 300; /* font-light */
  font-size: 0.875em;
}

@layer components {
  .icon {
    -webkit-touch-callout: none;
    background-color: currentColor;
    block-size: var(--icon-size, 1em);
    display: inline-block;
    flex-shrink: 0;
    inline-size: var(--icon-size, 1em);
    mask-image: var(--svg);
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: var(--icon-size, 1em);
    pointer-events: none;
    user-select: none;
  }

  img.icon {
    background: none;
  }
  .icon--calculator { --svg: url("/assets/calculator-ecbffb99.svg"); }
  .icon--plus { --svg: url("/assets/plus-52592f7c.svg"); }
  .icon--minus { --svg: url("/assets/minus-b31a1093.svg"); }
  .icon--x { --svg: url("/assets/x-a1a7fffb.svg"); }
  .icon--divide { --svg: url("/assets/divide-c11a158a.svg"); }
  .icon--music { --svg: url("/assets/music-a217f323.svg"); }
  .icon--37signals { --svg: url("/assets/37signals-f2f8866e.svg"); }
  .icon--add { --svg: url("/assets/add-880260c1.svg"); }
  .icon--add--meta { --svg: url("add--meta.svg"); }
  .icon--arrow-left { --svg: url("/assets/arrow-left-abe40556.svg"); }
  .icon--arrow-right { --svg: url("/assets/arrow-right-61dca488.svg"); }
  .icon--arrow-up { --svg: url("/assets/arrow-up-f96b3895.svg"); }
  .icon--art { --svg: url("/assets/art-ed709d32.svg"); }
  .icon--assigned { --svg: url("/assets/assigned-c901a8eb.svg"); }
  .icon--attachment { --svg: url("/assets/attachment-cfa1f89c.svg"); }
  .icon--bell-alert { --svg: url("/assets/bell-alert-b467cde7.svg"); }
  .icon--bell-off { --svg: url("/assets/bell-off-d8096c76.svg"); }
  .icon--bell { --svg: url("/assets/bell-cde41b14.svg"); }
  .icon--bolt { --svg: url("/assets/bolt-e44495ad.svg"); }
  .icon--bookmark-outline { --svg: url("/assets/bookmark-outline-bbb8078f.svg"); }
  .icon--bookmark { --svg: url("/assets/bookmark-92557340.svg"); }
  .icon--boost { --svg: url("/assets/boost-7f9c80de.svg"); }
  .icon--camera { --svg: url("/assets/camera-927323b8.svg"); }
  .icon--caret-down { --svg: url("/assets/caret-down-a7992d86.svg"); }
  .icon--check { --svg: url("/assets/check-611182fc.svg"); }
  .icon--check-circle { --svg: url("/assets/check-circle-505e76c3.svg"); }
  .icon--check-all { --svg: url("check-all.svg"); }
  .icon--clipboard { --svg: url("/assets/clipboard-b2c44b50.svg"); }
  .icon--close { --svg: url("/assets/close-b9e837a5.svg"); }
  .icon--close-circle { --svg: url("/assets/close-circle-5e9b8106.svg"); }
  .icon--collapse { --svg: url("/assets/collapse-93f70f6b.svg"); }
  .icon--board { --svg: url("/assets/board-b9e5ced2.svg"); }
  .icon--board-add { --svg: url("/assets/board-add-05750ca2.svg"); }
  .icon--column-left { --svg: url("/assets/column-left-e0a9b2a9.svg"); }
  .icon--column-right { --svg: url("/assets/column-right-3024ca0b.svg"); }
  .icon--comment { --svg: url("/assets/comment-41d3ab44.svg"); }
  .icon--copy-paste { --svg: url("/assets/copy-paste-4c379063.svg"); }
  .icon--crown { --svg: url("/assets/crown-00d190cb.svg"); }
  .icon--email { --svg: url("/assets/email-6c595bc5.svg"); }
  .icon--everyone { --svg: url("/assets/everyone-4ca1d460.svg"); }
  .icon--expand { --svg: url("/assets/expand-5d1825e8.svg"); }
  .icon--gear { --svg: url("/assets/gear-50e77d2b.svg"); }
  .icon--grid { --svg: url("/assets/grid-db00fc62.svg"); }
  .icon--filter { --svg: url("/assets/filter-37a7ac58.svg"); }
  .icon--fizzy { --svg: url("/assets/fizzy-eb76b7c1.svg"); }
  .icon--globe { --svg: url("/assets/globe-8c54d23b.svg"); }
  .icon--golden-ticket { --svg: url("/assets/golden-ticket-7e4b48fc.svg"); }
  .icon--history { --svg: url("/assets/history-2e264581.svg"); }
  .icon--home { --svg: url("/assets/home-ef66b2cb.svg"); }
  .icon--install-edge { --svg: url("/assets/install-edge-0b7cd918.svg"); }
  .icon--lifebuoy { --svg: url("/assets/lifebuoy-f31f26aa.svg"); }
  .icon--lock { --svg: url("/assets/lock-5192fa2d.svg"); }
  .icon--logout { --svg: url("/assets/logout-a6131db1.svg"); }
  .icon--marker { --svg: url("/assets/marker-04289650.svg"); }
  .icon--maximize { --svg: url("/assets/maximize-c5514b27.svg"); }
  .icon--menu { --svg: url("menu.svg"); }
  .icon--menu-dots-horizontal { --svg: url("/assets/menu-dots-horizontal-f6a5d793.svg"); }
  .icon--menu-dots-vertical { --svg: url("/assets/menu-dots-vertical-c247e3cc.svg"); }
  .icon--minus { --svg: url("/assets/minus-b31a1093.svg"); }
  .icon--monitor { --svg: url("/assets/monitor-1ec6b129.svg"); }
  .icon--moon { --svg: url("/assets/moon-16206fa2.svg"); }
  .icon--move { --svg: url("/assets/move-282b3bcc.svg"); }
  .icon--notification-bell-access-only { --svg: url("/assets/bell-cde41b14.svg"); }
  .icon--notification-bell-watching { --svg: url("/assets/bell-off-d8096c76.svg"); }
  .icon--notification-bell-reverse-access-only { --svg: url("/assets/bell-off-d8096c76.svg"); }
  .icon--notification-bell-reverse-watching { --svg: url("/assets/bell-cde41b14.svg"); }
  .icon--password { --svg: url("/assets/password-0896da4e.svg"); }
  .icon--pencil { --svg: url("/assets/pencil-a8559afd.svg"); }
  .icon--person { --svg: url("/assets/person-01c1c915.svg"); }
  .icon--person-add { --svg: url("/assets/person-add-adae7f19.svg"); }
  .icon--picture-add { --svg: url("/assets/picture-add-c06a03ac.svg"); }
  .icon--picture-double { --svg: url("picture-double.svg"); }
  .icon--picture-remove { --svg: url("/assets/picture-remove-83bbfa08.svg"); }
  .icon--picture-zoom { --svg: url("/assets/picture-zoom-f30f5232.svg"); }
  .icon--pinned { --svg: url("/assets/pinned-9533c2d7.svg"); }
  .icon--qr-code { --svg: url("/assets/qr-code-dac3b273.svg"); }
  .icon--reaction { --svg: url("/assets/reaction-41dcf1f6.svg"); }
  .icon--refresh { --svg: url("/assets/refresh-249f0509.svg"); }
  .icon--refresh--meta { --svg: url("/assets/refresh--meta-c004dae4.svg"); }
  .icon--remove { --svg: url("/assets/remove-d18dd986.svg"); }
  .icon--rename { --svg: url("/assets/rename-920f4a0d.svg"); }
  .icon--search { --svg: url("/assets/search-5f29565f.svg"); }
  .icon--settings { --svg: url("/assets/settings-aee56972.svg"); }
  .icon--share { --svg: url("/assets/share-e41e51d1.svg"); }
  .icon--sliders { --svg: url("/assets/sliders-3979a007.svg"); }
  .icon--sun { --svg: url("/assets/sun-b1b9df29.svg"); }
  .icon--switch { --svg: url("/assets/switch-eec22a2d.svg"); }
  .icon--tag { --svg: url("/assets/tag-e0ea89be.svg"); }
  .icon--tag-outline { --svg: url("/assets/tag-outline-cb702ba2.svg"); }
  .icon--thumb-up { --svg: url("/assets/thumb-up-1426364b.svg"); }
  .icon--trash { --svg: url("/assets/trash-708c7eb2.svg"); }
  .icon--unpinned { --svg: url("/assets/unpinned-2fab4bad.svg"); }
  .icon--unseen { --svg: url("/assets/unseen-abf780e7.svg"); }
  .icon--world { --svg: url("/assets/world-36f1fe50.svg"); }
  .icon--youtube { --svg: url("/assets/youtube-78f1b230.svg"); }
  .icon--tools { --svg: url("/assets/tools-babcf657.svg"); }
  .icon--dashboard { --svg: url("/assets/dashboard-c19651c3.svg"); }
  .icon--book { --svg: url("/assets/book-dd908bd6.svg"); }
  .icon--folder { --svg: url("/assets/folder-3ed34d22.svg"); }
  .icon--page { --svg: url("/assets/page-543e2530.svg"); }
  .icon--user { --svg: url("/assets/user-8513d180.svg"); }
}

kbd {
  border: 1px solid;
  border-radius: 0.3em;
  box-shadow: 0 0.1em 0 currentColor;
  font-family: var(--font-mono);
  font-size: 0.65em;
  font-weight: 600;
  opacity: 0.7;
  padding: 0 0.4em;
  text-transform: uppercase;
  vertical-align: middle;
  white-space: nowrap;
}