/* CSS Overrides By Artifact - chevas@agentartifact.com */

:root {

    /* Primary Colors */
    --popNetrual: #c9cbcf;
    --popOrange: #fe842e;
    --popFuchsia: #fe226b;
    --popPurple: #f20df2;

    --popMidnight: #19192a;
    --popMidnightGlow: #1e1e33;
    --popDusk: #313747;
    --popDuskGlow: #353c51;

    --popNeutralDark: #5b5e67;
    --popOrangeDark: #f96801;
    --popFuchsiaDark: #ea014e;
    --popPurpleDark: #c20ac2;

    --popDust: #e1e1e6;


    /* Tertiary */
    --graylight: #e0e5ec;
    --graylightTint: #e0e5ec;
    --graylight2: #d2d2d7;
    --graylight3: #bbc0c7;
    --graylight4: #9fa5ad;
    --gray: #899399;
    --graydark1: #22252a;
    --graydark2: #2e3440;
    --graydark3: #404959;
    --graydark4: #566073;
    --graydark5: #616878;

    /* Other Neutrals */
    --white: #ffffff;
    --black: #000000;
    --twhite: #f8f9fa;
    --twhite2: #f6f7f8;
    --twhite3: #EEEFF0;

    --whiteTranslucent: rgba(255, 255, 255, .7);
    --whiteTranslucent2: rgba(255, 255, 255, .9);

    /* Most Used Colors */
    --primaryTextColor: var(--gradydark1);
    /* Used for regular text and headlines */
    --secondaryTextColor: var(--graydark4);
    /* Used on all sub headlines */

    --primaryColor: var(--artifactRed);
    /* Primary Red */
    --primaryColorLight: var(--artifactRedLight);
    --primaryColorDark: var(--artifactRedDark);
    --primaryColorDark2: var(--artifactRedDark2);

    --secondaryColor: var(--artifactNavy);
    /* Primary dark background and navy */

    /* Shadows */
    --primaryBoxShadow: 0 0 30px rgba(0, 0, 0, .15);
    --secondaryBoxShadow: 0 0 30px rgba(0, 0, 0, .1);

    /* Fonts */
    --primaryFont: Inter, Helvetica, Arial, Sans-serif;
    --primaryMonospaceFont: 'Source Code Pro', 'Courier New', Courier, monospace;
    --blockquoteFont: Georgia, Sans-serif;

}

body {
    font-family: Inter, Helvetica, Arial, Sans-serif;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6,
.huge,
.xxlarge,
.xlarge,
.large,
.medium,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    line-height: 1.4em;
    font-family: var(--primaryFont);
    letter-spacing: -.03em;
}

h1,
.huge,
.h1 {
    font-size: 28px;
    font-weight: bold;
}

h2,
.xxlarge,
.h2 {
    font-size: 22px;
}

h3,
.xlarge,
.h3 {
    font-size: 20px;
}

h4,
.large,
.h4 {
    font-size: 18px;
}

h5,
.medium,
.h5 {
    font-size: 18px;
}

h6,
.small,
.h6 {
    font-size: 16px;
    letter-spacing: 0px;
}

/* Colors */
.popfuchsiadark {
    color: var(--popFuchsiaDark);
}

/* Global */
.container {
    max-width: 100%;
    padding: 0;
}

.navbuffer {
    padding-top: 65px !important;
}

.row {
    margin: 0;
}

input[type=text],
input[type=email],
input[type=number],
input[type=url],
select,
textarea,
input.form-control[type=text],
select.form-select,
input.form-control {
    background: var(--twhite);
    padding-left: 12px;
    padding-right: 12px;
}

/* Alert */
.alert {
    position: relative;
    border: 0;
    border-radius: 0;
    border-left: 30px solid var(--white);
    border-right: 30px solid var(--white);
    top: 70px
}

.alert ul {
    margin: 0;
    padding: 0;
}

.alert ul li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

/* Header */
.logoct {
    width: 160px;
    display: block;
    margin-top: -5px;
    margin-right: 5px;
}

.logoct img {
    width: 100%;
    float: left;
}

.navbar {
    box-shadow: 0 0 20px rgba(0, 0, 0, .1);
    height: 50px;
    padding: 0 30px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    background: var(--white);
}

a.navbar-brand {
    font-size: 16px;
    padding: 0;
    font-weight: bold;
    color: var(--popNeutralDark);
    transition: .15s linear all;
}

a.navbar-brand:hover {
    color: var(--popFuchsiaDark);
    transition: .15s linear all;
}

.navbar-expand-lg .navbar-nav .nav-link {
    color: var(--popNeutralDark);
}

.navbar-expand-lg .navbar-nav .nav-link {
    color: var(--popNeutralDark);
    font-size: 14px;
    padding: 0 15px;
}

.navbar-expand-lg .navbar-nav .nav-link:hover {
    color: var(--popFuchsiaDark);
}

.navbar-expand-lg .navbar-nav .dropdown-menu {
    top: 33px;
    border: 0;
    border-radius: 0;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    box-shadow: 0 0 20px rgba(0, 0, 0, .1);
}

.dropdown-menu {
    font-size: 14px;
}

/* Index */
.banner {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    margin-top: 100px;
    padding: 0 30px;
}

.banner-image {
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
    margin-bottom: 40px;
}

.banner-image img {
    width: 100%;
}

h1.welcome-title {
    font-weight: bold;
    text-align: center;
}

.banner .button-wrap {
    text-align: center;
    margin-top: 30px;
}

.button {
    padding: 7px 20px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
}

.button:hover {
    text-decoration: none;
}

/* Login */
.login-wrap,
.upload-wrap,
.error-wrap {
    width: 400px;
    max-width: 100%;
    margin: 0 auto;
    margin-top: 100px;
    font-size: 14px;
}


/* Schedule */
.container-fluid {
    padding: 15px 30px;
    padding-top: 60px;
}

.schedule-index .col-md-4.resource-left {
    max-width: 600px;
    padding: 0;
    padding-bottom: 15px;
}

.schedule-index .col-md-4.resource-left form {
    display: flex;
    gap: 10px;
    align-items: center;
}

.schedule-index .col-md-4.resource-left form .mb-3 {
    display: flex;
    gap: 10px;
    align-items: center;
    margin: 0 !important;
}

.schedule-index .col-md-4.resource-left form .mb-3 .form-control {
    font-size: 14px;
    cursor: default;
}

.schedule-index .col-md-4.resource-left form .mb-3 label.form-label {
    min-width: 130px;
    font-size: 14px;
    margin: 0;
    font-weight: bold;
    cursor: pointer;
}

.schedule-index .row {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 15px;
}

.schedule-index .col-2 {
    max-width: 100%;
    flex: none;
    padding: 0;
    border: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.schedule-index .col-2 h2 {
    font-size: 22px;
    text-align: left;
    padding: 0 0;
    width: 100%;
    margin: 0 !important;
    font-weight: 300;
}

input[type=submit],
.btn-success,
.btn-primary {
    background: linear-gradient(135deg, rgba(254, 132, 46, 1) 0%, rgba(254, 34, 107, 1) 100%);
    font-size: 14px;
    font-weight: bold;
    border: 0;
    box-shadow: 0 0 0 #fec9b2;
    transition: .15s linear all;
}

input[type=submit]:hover,
.btn-success:hover,
.btn-primary:hover {
    box-shadow: 0 0 15px #fec9b2;
    transition: .15s linear all;
}

.schedule-index .row .col-2 a.link-secondary {
    width: 100%;
    margin: 0 !important;
    display: block;
    text-align: left;
    border: 1px solid #e1e1e6;
    transition: .15s linear all;
    border-radius: 3px;
    box-shadow: 0 0 15px rgba(0, 0, 0, .05);
}

.schedule-index .col-2 .mb-1,
.schedule-index .col-2 .my-1 {
    width: 100%;
    text-align: left;
    margin: 0 !important;
}

.schedule-index .col-2 a.link-secondary:nth-child(odd) .mb-1 {
    background: #f8f9fa;
}

.schedule-index .col-2 a.link-secondary:hover .mb-1 {
    background: #fdf8f5;
    transition: .15s linear all;
}

.schedule-index .col-2 .btn-outline-success {
    border: 0 !important;
    font-size: 13px;
    color: var(--popNeutralDark);
    border-radius: 0;
}

.round-count-wrap,
.round-copy-wrap {
    font-weight: bold;
    display: flex;
}

.round-count,
.copy-label {
    width: 85px;
    flex-shrink: 0;
    color: var(--popNeutralDark);
}

.round-title {
    color: var(--popMidnight);
}

.copy-value {
    font-weight: normal;
}

.copy-value-status-recorded {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(255, 103, 174);
    color: white;
}

.copy-value-status-deployed {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(111, 207, 245);
    color: white;
}

.copy-value-status-planned {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(245, 137, 94);
    color: white;
}

.copy-value-status-broken {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(255, 103, 174);
    color: white;
}

.copy-value-status-cancelled {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(255, 103, 174);
    color: white;
}

.copy-value-status-inprocess {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(202, 189, 11);
    color: white;
}

.copy-value-status-scheduled {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(173, 11, 202);
    color: white;
}

.copy-value-status-scheduledtest {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(202, 11, 141);
    color: white;
}

.copy-value-status-senttest {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(55, 202, 11);
    color: white;
}

.copy-value-platform-sinch {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgba(226, 98, 98, 0.903);
    color: white;
}

.copy-value-platform-telnyx {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgba(80, 222, 64, 0.788);
    color: white;
}

.copy-value-platform-tfl {
    font-weight: normal;
    border-radius: 5px;
    margin-top: 1px;
    padding: 2px;
    background-color: rgb(217, 222, 75);
    color: white;
}

.button-wrap {
    width: 100%;
    text-align: left;
    margin-top: 15px;
}

.button-wrap button.btn.add-round {
    width: auto;
    font-size: 14px;
    font-weight: bold;
    background: var(--popDuskGlow);
    border: 0;
    transition: .15s linear all;
}

.button-wrap button.btn.add-round:hover {
    background: var(--popNeutralDark);
    transition: .15s linear all;
}

.button-wrap button.btn.add-round a {
    text-decoration: none;
    color: var(--white);
}

.button-wrap.add {
    margin-top: 5px;
}

.button-wrap.add a.add-round {
    background: transparent;
    border: 4px dashed var(--popDust);
    border-radius: 3px;
    width: 100%;
    padding: 10px 30px;
    text-decoration: none;
    transition: .15s linear all;
    color: var(--popNeutralDark);
    width: 100%;
    text-align: center;
    display: block;
    transition: .15s linear all;
    font-size: 14px;
    font-weight: bold;
}

.button-wrap.add a.add-round:hover {
    border: 4px dashed var(--graylight2);
    transition: .15s linear all;
}

/* Round */
.round-page-outside {
    width: 100%;
    margin: 0;
    padding: 15px 30px;
}

.round-page-outside input,
.round-page-outside select,
.round-page-outside textarea,
.round-page-outside label.form-label {
    font-size: 14px;
}

h1.page-title {
    text-align: left;
    margin: 0;
    margin-bottom: 15px;
    padding: 0;
}

.row.framed {
    padding: 15px 30px;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

.row.full {
    padding: 15px 30px;
    width: 100%;
}

.row.quarter {
    padding: 15px 30px;
    width: 25%;
}

.round-page-outside {
    padding: 0;
    font-size: 14px;
}

.round-page-outside .row form {
    padding: 0;
}

.round-page-outside .round-row {
    display: block;
}

.round-page-outside .round-row .row {
    gap: 60px;
}

.round-page-outside .row .col,
.record-page-outside .row .col {
    padding: 0;
}

.round-page-outside .row .col .mb-3 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}

.round-page-outside .row .col .mb-3 label.form-label {
    margin: 0;
    flex-shrink: 0;
    width: 100px;
    cursor: pointer;
    margin: 0;
    font-size: 14px;
    color: var(--popNeutralDark);
}

.round-page-outside .round-row .row .col:first-child {
    max-width: 350px;
}

.round-page-outside .round-row .row .col:nth-child(2) {
    max-width: 350px;
}

.round-page-outside .round-row .row .col:nth-child(3) {
    max-width: 350px;
}

.round-page-outside .round-row .row .col:nth-child(4) {
    max-width: 220px;
}

.round-page-outside .round-row.four {
    border-top: 1px solid var(--popDust);
    padding-top: 30px;
    margin-top: 15px;
    position: relative;
}

.deployments-title {
    background: var(--white);
    padding: 2px 15px;
    position: absolute;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: -.03em;
    top: -15px;
    left: 0;
    border-radius: 3px;
    border: 1px solid var(--popDust);
}


.round-page-outside .round-row.five .row {
    display: grid;
    grid-template-columns: 175px 175px 85px 85px 80px 80px 80px 80px 80px 80px 80px 90px 125px 150px 125px auto;
    gap: 10px;
}

.round-page-outside .round-row.five .row .col {
    width: 100%;
    max-width: 100%;
}

.round-page-outside .round-row.five .row .col .mb-3 {
    display: block;
}

.round-page-outside .round-row.five .row .col .mb-3 label.form-label {
    width: 100%;
    margin-bottom: 5px;
    display: none;
}

.round-page-outside .round-row.five.showlabels .row .col .mb-3 label.form-label {
    display: block;
}

/* Create Round */
.row.create {
    padding-bottom: 100px;
}

.round-page-outside .row.create .col .mb-3 label.form-label {
    width: 150px;
    flex-shrink: 0;
}

legend label {
    font-size: 16px;
    font-weight: bold;
}

.round-page-outside .row .col.create-round {
    padding-right: 50%;
    position: relative;
}

.create-round fieldset {
    position: absolute;
    width: 50%;
    top: 0;
    right: 0;
    padding-left: 40px;
}

.create-round fieldset fieldset {
    position: relative;
    width: 100%;
    top: auto;
    right: auto;
    padding-left: 0;
}

/* Records */
.record-page-outside {
    padding: 0;
    font-size: 14px;
}

.record-page-outside .row.framed {
    column-gap: 40px;
}

.record-page-outside .row .col {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.record-page-outside .row .col a.record-item {
    width: 100%;
    display: block;
    border: 1px solid var(--popDust);
    text-decoration: none;
    color: var(--popMidnightGlow);
    padding: 5px 15px;
    transition: .15s linear all;
    border-radius: 3px;
    box-shadow: 0 0 15px rgba(0, 0, 0, .05);
}

.record-page-outside .row .col a.record-item:nth-child(odd) {
    background: var(--twhite);
}

.record-page-outside .row .col a.record-item:hover {
    background: #fdf8f5;
}

.record-page-outside .row .col a.record-item .record-title {
    font-weight: bold;
}

.viewall {
    font-size: 14px;
    letter-spacing: 0;
}