/* GPL-3.0-or-later; 108design native Moodle UI, 2026-10-03. Theme owns typography and colours. */
.supportdesk [hidden] { display: none !important; }
.supportdesk-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; }
.supportdesk .table th, .supportdesk .table td { vertical-align: middle; text-align: start; }
.supportdesk .table td { overflow-wrap: anywhere; }
.supportdesk #ticketsTable td:nth-child(2) { min-width: 11rem; }
.supportdesk .supportdesk-actions { white-space: nowrap; width: 1%; }
.supportdesk-form { max-width: 48rem; }
.supportdesk-facts { margin: 0; }
.supportdesk-facts dt { font-weight: 600; }
.supportdesk-facts dd { margin: 0 0 .75rem; overflow-wrap: anywhere; }
.supportdesk-message { overflow-wrap: anywhere; }
.supportdesk-message img { max-width: 100%; height: auto; }
.supportdesk audio { max-width: 100%; }
.supportdesk-dropzone[data-dragging] { outline: 2px solid currentColor; }
.supportdesk-fallback { margin-top: 2rem; }

.supportdesk-form label:not(.supportdesk-file-picker), .supportdesk-block label { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 500; color: var(--bs-secondary-color, #62666b); margin-bottom: .35rem; }
.supportdesk-field-action { display: flex; gap: .375rem; align-items: stretch; }
.supportdesk-field-action select { flex: 1; min-width: 0; }
.supportdesk-iconbutton { display: inline-flex; align-items: center; justify-content: center; min-width: 2.4rem; padding: .4rem .55rem; flex: none; }
.supportdesk-iconbutton .icon { margin: 0; }
.supportdesk .supportdesk-action-link { display: inline-flex; align-items: center; justify-content: center; padding: .4rem .55rem; background: transparent; border: 0; color: inherit; text-decoration: none; }
.supportdesk .supportdesk-action-link:hover, .supportdesk .supportdesk-action-link:focus { background: transparent; color: inherit; text-decoration: none; }
.supportdesk .supportdesk-action-link:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.supportdesk-action-link .fa { font-size: 1rem; color: inherit; }
.supportdesk .supportdesk-color-input { width: 4rem; height: 2.5rem; padding: .25rem; cursor: pointer; }
.supportdesk-dropzone { border: 1px dashed var(--bs-border-color, #adb5bd); border-radius: .5rem; }
.supportdesk-dropzone:hover, .supportdesk-dropzone[data-dragging] { background: rgba(127, 127, 127, .045); }
.supportdesk-dropzone:focus-within { outline: 2px solid var(--bs-primary, currentColor); outline-offset: 2px; }
.supportdesk-file-picker { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 1.1rem .75rem; margin: 0; cursor: pointer; text-align: center; }
.supportdesk-file-picker .icon { font-size: 1.2rem; margin: 0; }
.supportdesk-badges { display: flex; flex-wrap: wrap; gap: .4rem; }
.supportdesk .supportdesk-badge { display: inline-flex; align-items: center; gap: .3em; font-size: .8125rem; line-height: 1.4; font-weight: 500; padding: .2em .6em; border: 1px solid transparent; border-radius: 999px; white-space: nowrap; }
.supportdesk .supportdesk-badge-neutral { color: #374151; background: #f1f3f5; border-color: #d8dde3; }
.supportdesk .supportdesk-badge-info { color: #1e40af; background: #e8f0fe; border-color: #c7daf9; }
.supportdesk .supportdesk-badge-warning { color: #854d0e; background: #fef3c7; border-color: #ecd58c; }
.supportdesk .supportdesk-badge-danger { color: #991b1b; background: #fee2e2; border-color: #f0baba; }
.supportdesk .supportdesk-badge-success { color: #166534; background: #dcfce7; border-color: #afdfbe; }
.supportdesk .supportdesk-badge-purple { color: #5b21b6; background: #ede9fe; border-color: #d2c9f3; }
.supportdesk .supportdesk-badge-orange { color: #9a3412; background: #ffedd5; border-color: #eccaa2; }
.supportdesk #ticketsTable [data-ticket-row] > td:not(.supportdesk-actions):not([data-no-row-link]) { cursor: pointer; }
.supportdesk-stats li { display: flex; align-items: baseline; gap: .5rem; font-size: .875rem; margin: .35rem 0; }
.supportdesk-count-pill { display: inline-block; flex: none; min-width: 1.8em; padding: .08em .45em; border-radius: 999px; text-align: center; background: var(--bs-secondary-bg, #f0f1f3); color: inherit; font-size: inherit; font-weight: 500; }

.supportdesk .supportdesk-record-button { color: inherit; border-color: var(--bs-border-color, #adb5bd); background: transparent; }
.supportdesk .supportdesk-record-button:hover, .supportdesk .supportdesk-record-button:focus { color: inherit; background: rgba(127, 127, 127, .1); border-color: currentColor; }
.supportdesk-record-button .fa { font-size: 1rem; color: inherit; margin-inline-end: .35rem; }

.supportdesk-form .supportdesk-field-label { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 500; color: var(--bs-secondary-color, #62666b); }
.supportdesk-form label.supportdesk-team-member { font-size: .875rem; text-transform: none; letter-spacing: normal; color: inherit; font-weight: 400; }

/* Messages keep one continuous separator, with the same inset for both authors. */
.supportdesk .supportdesk-issue, .supportdesk .supportdesk-reply, .supportdesk .supportdesk-compose { padding: 1rem; }
.supportdesk .supportdesk-issue { background: #fff; }
.supportdesk .supportdesk-reply { border-top: 1px solid var(--bs-border-color, #d4d4d8); }
.supportdesk .supportdesk-reply:last-child { border-bottom: 1px solid var(--bs-border-color, #d4d4d8); }
.supportdesk .supportdesk-reply-support { background: #eeebff; background: oklch(94% .03 294.59); }
.supportdesk .supportdesk-compose { background: var(--bs-tertiary-bg, #f5f5f6); border-radius: .375rem; }
.supportdesk .supportdesk-message > :last-child { margin-bottom: 0; }
.supportdesk .supportdesk-attachments { display: flex; flex-wrap: wrap; gap: .75rem; margin-bottom: 0; }
.supportdesk .supportdesk-attachment { min-width: 0; max-width: 100%; }
.supportdesk .supportdesk-attachment:not(.supportdesk-attachment-image) { flex-basis: 100%; }
.supportdesk .supportdesk-thumbnail { display: flex; flex-direction: column; gap: .3rem; width: 8rem; color: inherit; font-size: .75rem; text-decoration: none; }
.supportdesk .supportdesk-thumbnail img { width: 100%; height: 5.5rem; object-fit: contain; border: 1px solid var(--bs-border-color, #d4d4d8); border-radius: .25rem; background: #fff; }
.supportdesk .supportdesk-thumbnail span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.supportdesk .supportdesk-thumbnail:hover img { border-color: currentColor; }
.supportdesk .supportdesk-thumbnail:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.pswp--supportdesk .supportdesk-lightbox-footer { position: absolute; bottom: 0; left: 0; right: 0; padding: .75rem 1rem; color: #fff; background: rgba(0, 0, 0, .65); }
.pswp--supportdesk .supportdesk-lightbox-caption { margin: 0 0 .5rem; font-size: .875rem; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pswp--supportdesk .supportdesk-lightbox-strip { display: flex; gap: .5rem; overflow-x: auto; padding: .2rem; max-width: 100%; width: max-content; margin: auto; }
.pswp--supportdesk .supportdesk-lightbox-strip button { flex: none; background: transparent; border: 2px solid transparent; border-radius: .25rem; padding: 2px; opacity: .65; }
.pswp--supportdesk .supportdesk-lightbox-strip button[aria-current="true"], .pswp--supportdesk .supportdesk-lightbox-strip button:hover { opacity: 1; border-color: #fff; }
.pswp--supportdesk .supportdesk-lightbox-strip button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; opacity: 1; }
.pswp--supportdesk .supportdesk-lightbox-strip img { display: block; width: 4rem; height: 3rem; object-fit: contain; }

/* Guest content inherits the theme or Frontpage login panel, including all authored styling. */
.supportdesk-access-panel { width: 100%; max-width: 36rem; margin-inline: auto; }
.supportdesk-public-panel { width: 100%; margin-inline: auto; }
.supportdesk-public-panel .supportdesk-form { max-width: none; }
.supportdesk-public-panel .form-group, .supportdesk-create-form .form-group { margin-bottom: .75rem !important; }
.supportdesk-public-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: 1rem; }
.supportdesk-form-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1rem; align-items: start; }
.supportdesk-form-fields > * { min-width: 0; }
.supportdesk-priorities legend { margin-bottom: .5rem; }
.supportdesk-priority-options { display: flex; flex-wrap: wrap; gap: .75rem; padding: .2rem; }
.supportdesk-form label.supportdesk-priority-option { position: relative; margin: 0; cursor: pointer; text-transform: none; letter-spacing: normal; }
.supportdesk-priority-option input:checked + .supportdesk-badge { outline: 2px solid currentColor; outline-offset: 2px; font-weight: 600; }
.supportdesk-priority-option input:focus-visible + .supportdesk-badge { outline: 2px dashed var(--bs-primary, currentColor); outline-offset: 3px; }
.supportdesk-priority-option:hover .supportdesk-badge { border-color: currentColor; }
@media (max-width: 575.98px) {
    .supportdesk-form-fields { grid-template-columns: 1fr; }
}