﻿body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
    background-color: #777;
    border-color: #fff
}

.btn-success {
    background-color: #936a9f;
    border-color: #936a9f;
    color: #fff; /* Text color */
}

/* Button hover effect */
.btn-success:hover {
    background-color: #7a5480; /* New background color on hover */
    border-color: #7a5480; /* New border color on hover */
}

.table th, .table td {
    text-align: center;
    vertical-align: middle;
    padding: 8px;
}

.table thead {
    background-color: #a984bb;
    color: white;
}

.table td {
    word-break: break-word;
    white-space: normal;
    overflow-wrap: anywhere;
}

/* Mobile: turn table into card list */
@media (max-width: 768px) {
    .table, .table thead, .table tbody, .table th, .table td, .table tr {
       /* display: block;*/
        width: 100%;
    }

    .table thead {
        display: none; /* hide headers */
    }

    .table tr {
        margin-bottom: 1rem;
        border: 1px solid #ddd;
        border-radius: 8px;
        padding: 10px;
        background: #fff;
        box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    }

    .table td {
        display: flex;
        justify-content: space-between;
        padding: 6px 10px;
        border: none;
        border-bottom: 1px solid #eee;
    }

    .table td:last-child {
        border-bottom: none;
    }

    .table td:before {
        content: attr(data-label);
        font-weight: bold;
        color: #444;
    }
    .mobile-info {
        background-color: #f8f5fa;
        border-left: 4px solid #a18eaa;
        padding: 10px 14px;
        border-radius: 6px;
    }
}
