/* custom-form.css */
body {
    background: #f5f7fa; /* very light gray-blue for subtlety */
}

/*FONT-SIZE EM*/
.fs-01em {font-size: 0.1em !important;}
.fs-02em {font-size: 0.2em !important;}
.fs-03em {font-size: 0.3em !important;}
.fs-04em {font-size: 0.4em !important;}
.fs-05em {font-size: 0.5em !important;}
.fs-06em {font-size: 0.6em !important;}
.fs-07em {font-size: 0.7em !important;}
.fs-08em {font-size: 0.8em !important;}
.fs-09em {font-size: 0.9em !important;}
.fs-1em {font-size: 1em !important;}
.fs-11em {font-size: 1.1em !important;}
.fs-12em {font-size: 1.2em !important;}
.fs-13em {font-size: 1.3em !important;}
.fs-14em {font-size: 1.4em !important;}
.fs-15em {font-size: 1.5em !important;}
.fs-16em {font-size: 1.6em !important;}
.fs-17em {font-size: 1.7em !important;}
.fs-18em {font-size: 1.8em !important;}
.fs-19em {font-size: 1.9em !important;}
.fs-2em {font-size: 2em !important;}
.fs-21em {font-size: 2.1em !important;}
.fs-22em {font-size: 2.2em !important;}
.fs-23em {font-size: 2.3em !important;}
.fs-24em {font-size: 2.4em !important;}
.fs-25em {font-size: 2.5em !important;}
.fs-26em {font-size: 2.6em !important;}
.fs-27em {font-size: 2.7em !important;}
.fs-28em {font-size: 2.8em !important;}
.fs-29em {font-size: 2.9em !important;}
.fs-3em {font-size: 3em !important;}
.fs-31em {font-size: 3.1em !important;}
.fs-32em {font-size: 3.2em !important;}
.fs-33em {font-size: 3.3em !important;}
.fs-34em {font-size: 3.4em !important;}
.fs-35em {font-size: 3.5em !important;}
.fs-36em {font-size: 3.6em !important;}
.fs-37em {font-size: 3.7em !important;}
.fs-38em {font-size: 3.8em !important;}
.fs-39em {font-size: 3.9em !important;}
.fs-4em {font-size: 4em !important;}
/*END FONT-SIZE EM*/

.em {
    font-style: italic;
}
.card {
    border-radius: 1.5rem;
    border: none;
    box-shadow: 0 6px 30px rgba(0,0,0,.10); /* subtle shadow like HTML cards */
}
.card-body {
    background: #fafdff; /* off-white with blue tint */
    border-radius: 1.5rem;
}
.form-control:focus {
    box-shadow: 0 0 0 0.2rem rgba(102,102,255,.10); /* softer blue shadow */
    border-color: #b6bbff; /* soft blue border */
}
.btn-warning {
    background: #cfe7ff; /* subtle blue gradient */
    border: none;
    color: #222;
}
.btn-warning:hover {
    background: #9ac6f2; /* subtle blue gradient */
    border: none;
    color: #222;
}
.btn-primary {
    background: linear-gradient(135deg,#996633 0%,#cc9966 50%,#ffcc99 100%);
    border: none;
    color: white; /* black text works better on gold */
    position: relative;
    overflow: hidden;
    transition: background 0.3s;
    font-weight: 600;
}

.btn-primary:hover,
.btn-primary:focus {
    background: linear-gradient(135deg,#b37740 0%,#d4a373 50%,#ffd9b3 100%);
    color: #000;
}

/* Shine animation stays */
.btn-primary::after {
    content: '';
    position: absolute;
    top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(
        120deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.5) 50%,
        rgba(255,255,255,0) 100%
    );
    transform: skewX(-20deg);
    transition: none;
    pointer-events: none;
}

.btn-primary:hover::after,
.btn-primary:focus::after {
    animation: shine-move 0.8s linear 1;
}


@keyframes shine-move {
    0% { left: -75%; }
    100% { left: 130%; }
}

.btn-lg {
    font-size: 1.2rem;
    padding: 0.75rem 1.5rem;
}
.rounded-3 {
    border-radius: 0.75rem !important;
}
.rounded-4 {
    border-radius: 1.5rem !important;
}
.participant-row {
    background: #cfe7ff; /* subtle blue-gray */
    border-radius: 0.75rem;
    padding: 1rem 0.5rem;
    margin-bottom: 0.5rem;
}
.error {
    color: #c02632; /* brand red for errors */
    font-size: 0.95em;
    margin-top: 4px;
}