:root {
    --spry-background-color: #FAFAFA;
    --spry-color: #FF644E;
    --spry-add-color: #5CDB5C;
    --spry-remove-color: #FF0021;
    --spry-move-color: var(--spry-color);
    --spry-edit-color: #0B6EFD;
    --spry-disabled-color: #D3D3D3;
}

#spry-links-title {    
    color: white;
    padding: 5px;
    text-align: center;
    background-color: var(--spry-color);
}

#unauthorized-container {
    height: 100vh; 
    display: flex; 
    justify-content: center; 
    align-items: center;
}

#filter-apps ul {
    margin-block-start: 0;
    margin-block-end: 0;
    padding-inline-start: 0;
    list-style-type: none;
}

body {
    background-color: var(--spry-background-color);
}

.search {
    margin-bottom: 1em;
    float: right;
}

/*.spry-links {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-gap: 1rem;    
}*/
.spry-links {
    display: inline;
}
.spry-links .spry-link {
    display: inline;
}
.spry-links .spry-link:not(:last-child)::after {
    content: '|';
}
.spry-links a {
    text-decoration: none;
}

.spry-link-a {
    color: var(--spry-edit-color) !important;
    text-decoration: none !important;
}

.spry-link-a:hover {
    text-decoration: underline !important;
}

.spry-main-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.spry-100vh {
    height: 100vh;
}

.spry-hv-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.spry-form {
    width: 50%;
    display: block;
    border: 2px solid gray;
    padding: 2rem;
}

.spry-form h1,h2 {
    text-align: center;
    margin-bottom: 1rem;
}

.spry-form span {
    width: 200px;
}

.spry-form-button {
    display: flex;
    justify-content: center;
}

.spry-table thead {
    background-color: var(--spry-disabled-color);
}

.spry-table th {
    width: 25%;
}

.spry-icon-title{
    color: black;
    transition-duration: 150ms;
    text-decoration: none !important;
}

.spry-icon-title:hover {    
    color: white;
    transition-duration: 150ms;
}

.spry-icon {
    color: var(--spry-disabled-color);
    transition-duration: 150ms;
    text-decoration: none !important;
}

.spry-icon:hover {
    color: black;
    transition-duration: 150ms;
}

.spry-icon-add:hover {
    color: var(--spry-add-color);
    
}

.spry-icon-edit:hover {
    color: var(--spry-edit-color);
    transition-duration: 150ms;
}

.spry-icon-remove:hover {
    color: var(--spry-remove-color);
    transition-duration: 150ms;
}

.spry-icon-move:hover {
    color: var(--spry-move-color);
    transition-duration: 150ms;
}

.btn-spry {
    width: 100%;
    color: white !important;
    background-color: var(--spry-color) !important;
    border: 2px solid var(--spry-color) !important;
    text-decoration: none !important;
    transition-duration: 150ms !important;
    padding: 0.5rem !important;
    border-radius: 5px;
}

.btn-spry:hover {
    transition-duration: 150ms !important;
    color: var(--spry-color) !important;
    background-color: #FFFFFF !important;
}

.btn-spry-disabled {
    width: 100%;
    color: black !important;
    background-color: var(--spry-background-color) !important;
    border: 2px solid var(--spry-disabled-color) !important;
    padding: 0.5rem !important;
    border-radius: 5px;
}

.page-content table td {
    white-space: nowrap;
}
  
.page-content table td:last-child {
    width: 100%;
}

.btn-spry-add {
    width: 100%;
    color: white;
    background-color: var(--spry-add-color);
    border: 2px solid var(--spry-add-color);
    border-radius: 5px;
    text-decoration: none;
    transition-duration: 150ms;
    padding: 0.5rem;    
}

.btn-spry-add:hover {
    transition-duration: 150ms !important;
    color: black !important;
    background-color: #FFFFFF !important;
}

.spry-container {
    padding: 10px;
}

.spry-object {
    display: flex;
    justify-content: space-between;
}

.spry-object a {
    margin-left: 5px;
    text-decoration: none;
}

.sortable-app-handle, .sortable-env-handle, .sortable-link-handle {
    cursor: -moz-grab;
    cursor: -webkit-grab;
}