/* Ambience Knowledge Base Styling */

/* Set the Advice Centre content width  */
article {max-width: 1000px;margin: 0 auto;padding:0.5rem;}
article h1 {font-size: 2rem;}

form  {margin:5px auto;padding: 5px;border-radius: 15px;}

/* Style the search bar  */
.ac-search {max-width:600px;font-size: 1.4rem;padding-top: 1rem;}
.ac-search h2 {text-align:center;padding-top: 0.1rem;color:#ffffff;margin-bottom:1rem;}
.ac-search label {font-size: 3rem;}
.search-button {
    flex-shrink: 0;
    background-color: #006600;
    color: #ffffff;
    padding: 0 20px;
    margin: 0;
    border: 3px solid #000000;
    cursor: pointer;
border-radius:15px;
}
.search-button p {text-align:center;font-size:1.4rem;padding:0;margin-top:20px;}
.search-button:hover {background-color: #333333;color: #000000;transition:0.3s;}

/* Style the search box */
.search-box {
    display: flex;
    align-items: stretch;
border-radius:15px;
}
.toptip {margin-top:20px;}
.form-control-search {
    flex: 1;
    min-width: 0;
    margin: 0;
    border: 3px solid #000000;
    padding: 10px;
    font-size: 1rem;
    border-radius:15px;
}
.form-control-search:focus {
    outline: none;
    border: 3px solid #006600;
    box-shadow: none;
}
/* Style the Advice Centre article content
article {padding:0.5rem;}  */

.article-main-image img, .advice-main-image img {max-width:80%;display:inline-block;margin-top:1rem;text-align:center; border-radius:15px;}

.bluf-quick-answer {width:100%;display:inline-block;padding:1rem;}
.bluf-quick-answer p {font-size: 1.1rem;text-align: left;}

.bluf-buttons {margin-top:20px;}
.bluf-button {width:80%;display: inline-block; background-color:#333;color:#ffffff; border-radius: 15px;padding:10px 20px;text-decoration: none; margin:0.5rem}
.bluf-button:hover {background-color:#222222;color:#006600;}
.bluf-button p {text-align:center;font-size:1.4rem;padding:0;margin-top:20px;}


.article-section {border-radius:35px;padding:0.5rem;margin-bottom:1.5rem;}
.article-section h2 {font-size: 1.5rem;text-align: left;padding:1rem 0;}
.article-section h3 {font-size: 1.2rem;color: #fe0100; text-align: left;padding:0.5rem 0;}
.article-section ul {text-align: left;padding:0.5rem 0;font-weight:normal;}
.article-section li {font-size: 1rem; color: #ffffff; text-align: left;padding:0.5rem;margin-left:1rem;font-weight:normal;}
.article-section img {border-radius:10px;max-width:70%;}

.ac-section p {color: #ffffff;}

/* Style the Advice Centre Answers List used by search.js */

.advice-search-answers-list {padding:0.5rem;max-width: 1000px;margin: 0 auto;display: none}

/* Set up the problem area  */
.article-box  {width: 100%; padding-right:1rem;}
.article-box ul {padding-left:40px;list-style-type:none;}
.article-box ul li {text-align: left;padding: 15px;font-size: 1rem;}
.article-box img {border-radius:10px;max-width:80%;margin-top: 15px;}

/* Style the search results  */
#search-results {margin: 10px;}
#search-results h2 {text-align:center;padding:10px}

.search-result {padding-top: 10px; }
.search-result a {display: block;font-size: 1.3rem;text-align:left;padding-left:1rem;margin-top: 8px;}
.search-result p {font-size: 1.1rem;text-align:left;padding: 0 1rem}
.search-result-category {color:red;}

/* Set up the problem area  */
.article-table  {text-align: left;width: 60%;margin:0 auto}
.article-table th {text-align: left;font-weight:bold}
.article-table tr {text-align: left;padding: 15px;}
.article-table td {text-align: left;max-width:50%;padding-left: 15px;}
.article-table p {padding-bottom: 1rem;}

/* Set up the Back to Search Results button  */
#backtosearchBtn {position: fixed; bottom: 20px; right: 80px;  z-index: 710;font-size: 17px; border: none; outline: none; background: rgba( 100, 0, 0, 0.5);color: #ffffff;cursor: pointer; padding:10px 20px;border-radius: 15px;}
#backtosearchBtn:hover {background-color: #4CAF50;transition:0.3s;}

.clear-button {position: fixed; bottom: 20px; right: 80px;  z-index: 710;font-size: 17px; border: none; outline: none; background: rgba( 100, 0, 0, 0.5);color: #ffffff;cursor: pointer; padding:10px 20px;border-radius: 15px;}
.clear-button:hover {background-color: #4CAF50;transition:0.3s;}


/* Set up Request for Service  */

.service-popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: 9999;
}

.service-popup-overlay[hidden] {
    display: none;
}

.service-popup {
    background: #222;
    color: #fff;
    width: 90%;
    max-width: 600px;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.3);
}

.service-popup h2 {margin-top: 0;text-align:center}
.service-popup h3{text-align:center}






@media screen and (min-width: 500px) { .bluf-button {width:45%;} }

@media screen and (min-width: 800px) {.article-box {width: 50%;} .bluf-quick-answer, .article-main-image, .advice-main-image {width: 49%;} }