/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 17 2024 | 19:58:45 */
<style>
@import url(https://use.typekit.net/qzn8hor.css);

/* Global styles */
body, .ms-core-overlay {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #333333;
  background-image: linear-gradient(25deg, #f0f4f9, #ffffff);
    background-size: 100% 100%;
}

/* Main content area */
#contentBox, .CanvasComponent {
    padding: 20px;
 /   max-width: 1200px;
    margin: 0 auto;

}

/* Section containers: maintain outer shadow but remove inner shadow */
[data-automation-id="CanvasZone"], 
.CanvasSection, 
[data-automation-id="ControlZone"] {
    background-color: transparent !important;
    overflow: hidden;
    margin-bottom: 24px;
    padding: 20px;
    border-radius: 16px;
}

/* Add shadows to sections */
.CanvasZone{
    box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
}

/* Separate sections */
.fui-FluentProvider {
    margin-bottom: 14px;
    margin-right: 7px;
    margin-left: 7px;
}

/* Remove shadow from individual buttons */
[data-automation-id="QuickLinksWebPart"] .ms-List-cell a.ButtonCard {
    background-color: #fff !important; /* White background for buttons */
    border-radius: 8px; /* Rounded corners for buttons */
    box-shadow: none !important;
    transition: all 0.3s ease;
    overflow: hidden;
    display: block;
    height: 100%;
    margin: 8px;
}

/* Buttons retain hover effect */
[data-automation-id="QuickLinksWebPart"] .ms-List-cell a.ButtonCard:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
}

/* Button content styles */
[data-automation-id="QuickLinksWebPart"] .ms-List-cell a.ButtonCard .thumbnail-172 {
    background-color: #fff !important;
    padding: 16px;
    border-radius: 8px 8px 0 0;
}

[data-automation-id="QuickLinksWebPart"] .ms-List-cell a.ButtonCard .icon-184 {
    color: #00529b !important;
    font-size: 24px;
}

[data-automation-id="QuickLinksWebPart"] .ms-List-cell a.ButtonCard .textArea-174 {
    padding-top: 12px;
}

[data-automation-id="QuickLinksWebPart"] .ms-List-cell a.ButtonCard .quick-links-item-title {
    color: #00529b !important;
    font-weight: 600;
    font-size: 14px;
}

/* Time Zone bar */
[data-automation-id="pageHeader"] {
    background: linear-gradient(to right, #00529b, #7e77bb);
    color: #fff;
    border-radius: 8px;
    padding: 16px;
    margin-top: 24px;
    margin-bottom: 24px;
    width: 100%;
}

/* News section */
[data-automation-id="NewsWebPart"] [data-automation-id="newsItem"] {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    margin-bottom: 20px;
}

/* Remove Dark Blue Corners from Quick Links Buttons */
.ButtonCard {
    background-color: #0193cb;
    border-radius: 10px;
    overflow: hidden;
    transition: background-color 0.3s ease;
}

.ButtonCard:hover {
    background-color: #0251a9;
    border-radius: 10px;
    overflow: hidden;
}

/* Add underline to "Create an Event" links */
.emptyStateTitle-514 {
    text-decoration: underline 2px;
    text-decoration-color: #0193cb;
}

/* Change the nav color */
div.ms-HubNav {
    background-image: linear-gradient(to bottom, #0073cc, #008ecf);
}

/* Change the editor nav-bar color */
.bottomNavRow-107 {
    background-image: linear-gradient(to right, #32458f, #2284ff);
}

/* Change the nav text color */
.ms-HorizontalNavItem-link {
    color: #ffffff !important; /* Lighter blue text color for subnav */
}

/* Change the nav "Global Home" color */
.ms-HubNav-nameLink {
    color: #b6cdf8;
}

/* Change the color of the nav chevrons */
.ms-HorizontalNav-chevronDown {
    color: #b6cdf8;
}

a[href^="https://opsmile.sharepoint.com/sites/109-ProjGlobalHomePageDev"] .ms-Icon--Home::before {
    content: "\EB51" !important;  /* Unicode for the heart icon */
    font-family: 'FabricMDL2Icons' !important;
}

a[href^="https://opsmile.sharepoint.com/sites/109-ProjGlobalHomePageDev"] .ms-Icon--Home {
    font-size: 18px;
    color: #b6cdf8; /* Matching the color of your nav text */
    display: inline-block;
    vertical-align: middle;
}

a[href^="https://opsmile.sharepoint.com/sites/109-ProjGlobalHomePageDev"] {
    background-image: none !important;
}

/* End of new CSS for heart icon */


</style>