/*
 * Styling for the Shortcodes Ultimate replacements in shortcode_smart-su.php.
 *
 * Copied from shortcodes-ultimate/includes/css/shortcodes.full.css, keeping the
 * original .su-* class names because converted sites carry their own CSS written
 * against them. Every selector here is under a .su-* class that only these
 * shortcodes emit, so the file is inert on a page that uses none of them.
 *
 * Two deliberate substitutions:
 *  - Icon glyphs use the 'FontAwesome' (v4) face realsmart-core already loads,
 *    instead of v3's bundled ShortcodesUltimateIcons (a Fork Awesome build).
 *    The codepoints are identical: star f005, minus f068, plus f067.
 *  - The quote marks are inlined as a data URI rather than pointing at the v3
 *    plugin's images/quote.png, which does not exist on SmartPress-4.
 */

/* ---- shared helpers ---------------------------------------------------- */
.su-u-clearfix::after { content: ''; display: table; clear: both; }
.su-u-trim > :first-child { margin-top: 0; }
.su-u-trim > :last-child { margin-bottom: 0; }
.su-u-responsive-media-yes { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.su-u-responsive-media-yes iframe,
.su-u-responsive-media-yes object,
.su-u-responsive-media-yes embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* ---- [smart-list] / [su_list] ------------------------------------------ */
.su-list { margin-bottom: 1.5em; }
.su-list ul { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.su-list ul li { position: relative; display: block !important; margin: 0 !important; padding: 4px 0 4px 2em !important; list-style-type: none !important; line-height: 1.3em; }
.su-list ul li > img { position: absolute; left: 0; top: 4px; width: 1.3em; height: 1.3em; padding: 0; margin: 0; border: none; }
.su-list ul li > i { position: absolute; left: 0; top: 4px; width: 1.3em; height: 1.3em; line-height: 1.3em; text-align: center; }

/* The icon font. v3 used its own Fork Awesome build; FontAwesome 4 is already
   loaded by realsmart-core and carries the same codepoints. */
.su-list .sui,
.su-spoiler-icon { font-family: 'FontAwesome'; font-weight: normal; font-style: normal; display: inline-block; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.su-list .sui-star:before { content: '\f005'; }

/* ---- [smart-box] / [su_box] -------------------------------------------- */
.su-box { margin: 0 0 1.5em; border-width: 2px; border-style: solid; }
.su-box-title { display: block; padding: 0.5em 1em; font-weight: bold; font-size: 1.1em; }
.su-box-content { background-color: #fff; color: #444; padding: 1em; }

/* ---- [smart-quote] / [su_quote] ---------------------------------------- */
.su-quote-style-default { position: relative; margin-bottom: 1.5em; padding: 0.5em 3em; font-style: italic; }
.su-quote-style-default:before,
.su-quote-style-default:after { position: absolute; display: block; width: 20px; height: 20px; content: ''; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAUCAQAAABVT7cwAAAA+UlEQVR42uVUWxGEMAzEAhZqAQu1gAUs1AIWagELtbAWsFALvQHSNCGdm+N+ab/Yyeax2TIM7z5wSJhv2ARg+i/djIKCLOkIhDn6XpBPZKsIxxREjIOhFqQGIxK23WLOOMJWgUWbbhUlarrACAS5XIWp4+tmPSxX1YMIrKjrTtUVVgN3AhamjlzZi4TJkpl73F33J7oRagXlgjYgCPMi4aU1NgF5o1Zu++wXYq0LWa7TtFZLKuu5TPPCorm/S93dvFC2Pgm7eIwqIb5ufjUlhAbsQ7VPCmWto/BCsh0fsLWwI3quVuINB/XOsxr24Vvv/CYwI0kXvPJ8AL/W8uhemD3eAAAAAElFTkSuQmCC"); }
.su-quote-style-default:before { top: 0; left: 0; background-position: 0 0; }
.su-quote-style-default:after { right: 0; bottom: 0; background-position: -20px 0; }
.su-quote-style-default .su-quote-cite { display: block; text-align: right; font-style: normal; }
.su-quote-style-default .su-quote-cite:before { content: '\2014\0000a0'; }
.su-quote-style-default .su-quote-cite a { text-decoration: underline; }

/* ---- [smart-spoiler] + [smart-accordion] ------------------------------- */
.su-accordion { margin-bottom: 1.5em; }
.su-accordion .su-spoiler { margin-bottom: 0.5em; }
.su-spoiler { margin-bottom: 1.5em; }
.su-spoiler .su-spoiler:last-child { margin-bottom: 0; }
.su-spoiler-title { position: relative; cursor: pointer; min-height: 20px; line-height: 20px; padding: 7px 7px 7px 34px; font-weight: bold; font-size: 13px; }
.su-spoiler-title:focus { outline: currentColor thin dotted; }
.su-spoiler-icon { position: absolute; left: 7px; top: 7px; width: 20px; height: 20px; line-height: 21px; text-align: center; font-size: 14px; }
.su-spoiler-content { padding: 14px; transition: padding-top 0.2s; }
.su-spoiler.su-spoiler-closed > .su-spoiler-content { height: 0; margin: 0; padding-top: 0; padding-bottom: 0; overflow: hidden; border: none; opacity: 0; pointer-events: none; }
.su-spoiler.su-spoiler-closed > .su-spoiler-content iframe { display: none; }
.su-spoiler-icon-plus .su-spoiler-icon:before { content: '\f068'; }
.su-spoiler-icon-plus.su-spoiler-closed .su-spoiler-icon:before { content: '\f067'; }
.su-spoiler-style-default > .su-spoiler-title { padding-left: 27px; padding-right: 0; }
.su-spoiler-style-default > .su-spoiler-title > .su-spoiler-icon { left: 0; }
.su-spoiler-style-default > .su-spoiler-content { padding: 1em 0 1em 27px; }

/* ---- [smart-row] / [smart-column] -------------------------------------- */
.su-row { margin-bottom: 1.5em; }
.su-row::after { display: table; clear: both; content: ''; }
.su-row .su-column { display: block; float: left; box-sizing: border-box; margin: 0 0 0 4%; }
.su-row .su-column:first-child { margin-left: 0; }
.su-row .su-column.su-column-size-1-1 { margin-right: 0; margin-left: 0; }
.su-row .su-column.su-column-centered { float: none; margin-right: auto; margin-left: auto; }
.su-row .su-column-size-1-1 { width: 100%; }
.su-row .su-column-size-1-2 { width: 48%; }
.su-row .su-column-size-1-3 { width: 30.66%; }
.su-row .su-column-size-2-3 { width: 65.33%; }
.su-row .su-column-size-1-4 { width: 22%; }
.su-row .su-column-size-3-4 { width: 74%; }
.su-row .su-column-size-1-5 { width: 16.8%; }
.su-row .su-column-size-2-5 { width: 37.6%; }
.su-row .su-column-size-3-5 { width: 58.4%; }
.su-row .su-column-size-4-5 { width: 79.2%; }
.su-row .su-column-size-1-6 { width: 13.33%; }
.su-row .su-column-size-5-6 { width: 82.66%; }
.su-row .su-column img,
.su-row .su-column iframe,
.su-row .su-column object,
.su-row .su-column embed { max-width: 100%; }

/* ---- [smart-youtube] / [smart-vimeo] ----------------------------------- */
.su-youtube { margin: 0 0 1.5em; }
.su-youtube iframe { border: none !important; }
.su-vimeo { margin: 0 0 1.5em; }
.su-vimeo iframe { border: none !important; }
