:root {
    --colour01: #FFFFFF;
    --colour02: #000000;
    --colour03: #808080;
    --colour04: #ffa500;
}

body {
    font-family: 'Fjalla One', 'Cantarell', sans-serif;
}

.kkd-container {
    padding: 20px;
    background-color: var(--colour01);
    color: var(--colour02);
}

.kkd-heading {
    text-align: center;
    margin-bottom: 10px;
    color: var(--colour02);
}

.kkd-section {
    margin-bottom: 20px;
    padding: 10px;
}

.kkd-order {
    padding: 10px;
    margin-bottom: 5px;
    background-color: var(--colour03);
    color: var(--colour01);
    cursor: pointer;
}

.kkd-popup {
    position: fixed;
    top: 10%;
    left: 10%;
    width: 80vw;
    height: 80vh;
    background-color: var(--colour01);
    display: none;
    z-index: 1000;
}

.kkd-popup-content {
    padding: 20px;
    overflow-y: auto;
}

.kkd-popup-close,
.kkd-status-change {
    width: 100%;
    background-color: var(--colour04);
    color: var(--colour01);
    padding: 10px;
    cursor: pointer;
    margin-top: 10px;
}